.model{padding-block:var(--gap)}
.model.green{background:var(--green);color:var(--cream)}
.model.green.shine-fin{background:url('../img/shining_benefits.png') top center/100% auto no-repeat,var(--green)}
.model.tan.shine-fin{position:relative}
.model.tan.shine-fin::before{content:"";position:absolute;inset:0 0 auto 0;height:660px;background:radial-gradient(ellipse 26% 62% at 50% 0%,rgba(255,255,255,.14),transparent 70%);pointer-events:none}
.model.tan.shine-fin > *{position:relative;z-index:1}
.model.tan{background:var(--sand-l);color:var(--green)}
.model .head{text-align:center;max-width:900px;margin:0 auto clamp(46px,6vw,70px)}
.model .head h2{font-family:var(--display);font-weight:300;font-size:clamp(32px,4vw,54px);text-transform:uppercase}
.model.green .head h2{color:#fff}
.model.tan .head h2{color:#fff}
.model .head p{margin-top:14px;font-size:14px;opacity:.75}
.card-grid{display:grid;gap:20px}
.card-grid.c3{grid-template-columns:repeat(3,1fr)}
.card-grid.c4{grid-template-columns:repeat(4,1fr)}
/* Figma 4542:15635 — flex column, gap 12, padding 80/40; card height comes from content, grid stretches the row */
.mcard{background:var(--paper);color:var(--green);text-align:center;padding:80px 40px;display:flex;flex-direction:column;align-items:center;gap:12px}
.mcard .lbl{font-family:var(--display);font-weight:600;font-size:24px;line-height:normal;letter-spacing:0;text-transform:uppercase;color:var(--green)}
.card-grid.c4 .mcard .lbl{font-family:var(--body);font-weight:400;font-size:22px;line-height:28px;text-transform:none;width:100%}
.mcard .num{font-family:var(--display);font-weight:400;font-size:132px;line-height:1.4318;letter-spacing:-2.64px;margin:0;color:var(--sand)}
.mcard .val{font-family:var(--display);font-weight:400;font-size:34px;line-height:1.4318;text-transform:uppercase;margin:0}
.mcard .val small{font-family:var(--body);font-weight:400;font-size:18px;line-height:25px;text-transform:none}
.mcard .sub{font-family:var(--body);font-size:22px;line-height:28px;color:var(--green);margin:0}
.card-grid.c3 .val + .sub{margin-top:-4px}
/* Figma 4578:2012 — footnote runs at the 18/25 scale, not Body Base */
.card-grid.c3 .sub + .sub{font-size:18px;line-height:25px}
.model .note{text-align:center;font-size:12px;margin-top:34px;opacity:.7;max-width:620px;margin-inline:auto}
@media(max-width:900px){.card-grid.c3,.card-grid.c4{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.card-grid.c3,.card-grid.c4{grid-template-columns:1fr}}
.steps{padding-block:var(--gap)}
.steps h2{font-family:var(--display);font-weight:300;text-align:center;font-size:clamp(34px,4.6vw,60px);text-transform:uppercase;margin-bottom:clamp(50px,6vw,80px)}
.step-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,4vw,60px)}
.step .n{font-family:var(--display);font-weight:300;font-size:52px;color:var(--sand)}
.step h3{font-weight:700;font-size:15px;letter-spacing:.1em;text-transform:uppercase;color:var(--green);margin:12px 0 12px}
.step p{font-size:14px;color:#736862;padding-bottom:30px;border-bottom:1px solid var(--line-cream)}
@media(max-width:760px){.step-grid{grid-template-columns:1fr}}

/* mobile tier (page) */
@media(max-width:1200px){
  .model{padding-block:72px}
  .model .head h2{font-size:clamp(26px,6vw,44px)}
  .mcard{padding:48px 24px}
  .mcard .lbl,.card-grid.c4 .mcard .lbl{font-size:18px;line-height:24px}
  .mcard .num{font-size:clamp(72px,16vw,104px);letter-spacing:-2px}
  .mcard .val{font-size:28px}
  .mcard .val small{font-size:16px}
  .mcard .sub{font-size:18px;line-height:24px}
  .steps{padding-block:72px}
  .steps h2{font-size:clamp(26px,6vw,44px);margin-bottom:40px}
  .step-grid{gap:32px}
}