/* situations section — scoped under .situations-wrap to avoid class-name conflicts
   with why.css / calculator.css (.card, .grid, .section all reused across leaves).
   Skipped: *, html/body resets, .stage — already in tokens.css / hero.css. */

.situations-wrap{background:var(--surface)}

.situations-wrap .section{max-width:1440px;margin-inline:auto;padding:110px 140px}

.situations-wrap .section h2{font-size:var(--fs-h2);line-height:var(--lh-h2);font-weight:400;color:var(--ink);
            max-width:726px;margin-bottom:40px}

/* Frame 1469 — 3 cols × 367, gap 30 (wraps to 2 rows) */
.situations-wrap .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;max-width:1161px}

/* card — Frame 1290: vertical, padding 20, gap 12, radius 12, white */
.situations-wrap .card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-card);padding:20px;
      display:flex;flex-direction:column;gap:12px}
.situations-wrap .card .icon{width:80px;height:80px;flex:none}
.situations-wrap .card .icon img{display:block;width:100%;height:100%}
.situations-wrap .card .body{display:flex;flex-direction:column;gap:8px}
.situations-wrap .card .title{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--ink)}
.situations-wrap .card .desc{font-size:var(--fs-body-sm);line-height:var(--lh-body-sm);color:var(--muted)}

@media (max-width:768px){
  .situations-wrap .section{padding:64px 0 64px 28px}
  .situations-wrap .section h2{font-size:24px;line-height:33.6px;margin-bottom:32px;max-width:none}
  .situations-wrap .grid{display:flex;gap:20px;max-width:none;padding-right:28px;
        overflow-x:auto;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
  .situations-wrap .card{flex:0 0 234px;scroll-snap-align:start;padding:16px 14px 16px 20px}
  .situations-wrap .card .icon{width:60px;height:60px}
  .situations-wrap .card .title{font-size:16px;line-height:23.68px}
  .situations-wrap .card .desc{font-size:14px;line-height:21.28px;
              display:-webkit-box;-webkit-box-orient:vertical;
              -webkit-line-clamp:var(--mobile-text-lines);overflow:hidden}
}