/* ==========================================================================
   지금 이런 상황이신가요? (상황 카드) — 상간소송 피고 랜딩페이지 (법무법인 정서)
   ========================================================================== */
/* ---------- 상황 체크 ---------- */
.situ{background:#fff;overflow:hidden}
/* 상황 카드 그리드: 6개를 한 번에 보여 주고 본인 상황을 바로 찾게 함 */
.sgrid{margin-top:var(--tgap);display:grid;grid-template-columns:repeat(3,1fr);gap:28px;align-items:start;padding-bottom:90px}
.sitem{position:relative;aspect-ratio:3/4;padding:34px 34px 38px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;text-align:left;color:#fff;overflow:hidden;border-radius:22px;background:transparent;isolation:isolate;-webkit-mask-image:-webkit-radial-gradient(#fff,#000)}
.sitem:nth-child(3n+2){transform:translateY(90px)}
.sitem__img{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.01);transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.sitem::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(20,18,26,0) 18%,rgba(20,18,26,.45) 42%,rgba(20,18,26,.78) 62%,rgba(20,18,26,.94) 100%);transition:opacity .5s}
.sitem::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(20,18,26,0) 14%,rgba(20,18,26,.4) 40%,rgba(20,18,26,.74) 62%,rgba(20,18,26,.92) 100%);opacity:0;transition:opacity .5s}
.sitem>*:not(.sitem__img){position:relative;z-index:2;text-shadow:0 1px 14px rgba(0,0,0,.45)}
.sitem__no{display:block;font-family:var(--serif);font-weight:400;font-size:30px;line-height:1;color:var(--plum-soft)}
.sitem h3{margin-top:16px;font-family:var(--serif);font-weight:500;font-size:25px;line-height:1.4;letter-spacing:-.03em;text-wrap:balance}
.sitem p{margin-top:12px;font-size:15px;line-height:1.7;color:rgba(255,255,255,.92);word-break:keep-all}
@media (hover:hover){.sitem:hover .sitem__img{transform:scale(1.06)}.sitem:hover::before{opacity:0}.sitem:hover::after{opacity:1}}
/* 스크롤로 보이면 카드가 하나씩 아래에서 올라옴 (같은 줄은 왼쪽부터 순서대로) */
.js .sitem{opacity:0;translate:0 70px;transition:opacity .8s ease-out,translate 1s cubic-bezier(.2,.8,.2,1)}
.js .sitem.is-in{opacity:1;translate:0 0}
.js .sitem:nth-child(3n+2){transition-delay:.14s}
.js .sitem:nth-child(3n){transition-delay:.28s}
.situ__foot{margin-top:56px;text-align:center;font-family:var(--serif);font-weight:200;font-size:26px;line-height:1.55;color:var(--ink)}
.situ__foot b{font-weight:600}