/* S2O Advisors — homepage sections (next/site), loaded after style.css on / only.
   Motion: MOTION-VIDEO-ADDENDUM.md. Content is visible without JS. */

/* ---------- Homepage base ---------- */
img,svg,video{display:block;max-width:100%}
a{color:var(--forest);text-decoration-thickness:1px;text-underline-offset:.16em}
a:hover{color:var(--forest-2)}
p{margin:0}
.lead{font-size:1.125rem;max-width:34em;color:var(--ink-2)}
.small{font-size:.875rem}
section{padding-block:var(--section)}
.textlink{font-weight:500}
ul,ol{margin:0;padding:0;list-style:none}
.num{font-family:var(--serif);font-weight:500;font-variant-numeric:tabular-nums;letter-spacing:-.01em}

/* ---------- Section rule (the checklist header) ---------- */
.rule{display:flex;align-items:center;gap:var(--s3);padding-bottom:var(--s3);margin-bottom:var(--s6);border-bottom:1px solid var(--line);font:600 .75rem/1.2 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--copper-text)}
.rule-tick{width:18px;height:18px;flex:none;color:var(--forest)}
.rule-tick svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.rule-tick path{stroke-dasharray:1;stroke-dashoffset:0}
html.motion .rule-tick path{stroke-dashoffset:1;transition:stroke-dashoffset .5s var(--ease) .15s}
html.motion .in .rule-tick path{stroke-dashoffset:0}
.band-dark .rule{border-color:var(--on-dark-line);color:var(--copper-on-dark)}
.band-dark .rule-tick{color:var(--good-dark)}

/* ---------- Entrance on load (hero) ---------- */
html.motion [data-enter]{animation:land .8s var(--ease) both;animation-delay:calc(.15s + var(--i,0) * 110ms)}
/* ---------- Reveal grammar (JS only adds; default is visible) ---------- */
html.motion [data-reveal]{opacity:0;transform:translateY(14px);transition:opacity .55s var(--ease),transform .55s var(--ease);transition-delay:calc(var(--i,0) * 70ms)}
html.motion [data-reveal].in,html.motion .in > [data-reveal]{opacity:1;transform:none}

/* ---------- Hero: full-viewport moving image, centred ---------- */
.hero{position:relative;min-height:min(84svh,760px);padding:calc(var(--header) + var(--s6)) 0 var(--s5);color:var(--on-dark);background:#04101c;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}
.hero-media{position:absolute;inset:0;overflow:hidden;background:#04101c}
.hero-media img,.hero-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-video{opacity:.95;filter:saturate(.9) contrast(1.04)}
.video-toggle{position:absolute;right:var(--s4);top:calc(var(--header) + var(--s3));z-index:3;width:44px;height:44px;display:grid;place-items:center;padding:0;border:1px solid rgb(77 189 255/.55);border-radius:50%;background:rgb(4 16 28/.62);color:var(--on-dark);cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .15s var(--ease)}
.video-toggle[hidden]{display:none}
.video-toggle::before{content:"";width:12px;height:14px;background:linear-gradient(90deg,currentColor 0 34%,transparent 34% 66%,currentColor 66%)}
.video-toggle.is-paused::before{width:0;height:0;margin-left:4px;background:none;border-style:solid;border-width:7px 0 7px 12px;border-color:transparent transparent transparent currentColor}
.video-toggle:hover{background:rgb(4 16 28/.85)}
.video-toggle:focus-visible{outline:2px solid var(--copper-on-dark);outline-offset:3px}
.hero-media::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 62% 58% at 50% 46%,rgb(4 16 28/.58) 0%,rgb(4 16 28/.18) 72%,rgb(4 16 28/0) 100%),linear-gradient(180deg,rgb(4 16 28/.62) 0%,rgb(4 16 28/.4) 34%,rgb(4 16 28/.5) 70%,rgb(4 16 28/.94) 100%)}
.hero .wrap{position:relative}
.hero-center{text-align:center;display:flex;flex-direction:column;align-items:center;margin-block:auto;padding-block:var(--s5)}
.hero-kicker{display:inline-flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--s3);font:600 .75rem/1.2 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:rgb(255 255 255/.9);text-shadow:0 1px 10px rgb(0 0 0/.5);--k:var(--copper-on-dark);margin-bottom:var(--s5)}
.hero-kicker::before,.hero-kicker::after{content:"";width:28px;height:1px;background:var(--copper-on-dark);opacity:.8}
.hero h1{color:var(--on-dark);max-width:16em;font-size:clamp(3rem,1.5rem + 5vw,5.75rem);font-weight:700;line-height:.98;text-shadow:0 2px 28px rgb(0 0 0/.45)}
.hero h1 em{color:var(--copper-on-dark);font-weight:600}
.hero h1 .line{display:block}
.hero .lead{color:var(--on-dark);opacity:.9;margin-top:var(--s5);max-width:34em;font-size:1.1875rem;text-shadow:0 1px 12px rgb(0 0 0/.35)}
.hero-note{margin-top:var(--s5);font-size:.9375rem;color:rgb(255 255 255/.85);text-shadow:0 1px 12px rgb(0 0 0/.45)}
.hero-note b{color:var(--on-dark);font-weight:600}
/* the console */
.console{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:0;align-items:stretch;width:min(920px,100%);margin-top:var(--s6);background:rgb(4 16 28/.74);border:1px solid rgb(77 189 255/.7);border-radius:18px;padding:8px;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 30px 80px rgb(0 0 0/.45),inset 0 1px 0 rgb(255 255 255/.06);text-align:left;position:relative}
.console::before,.console::after{content:"";position:absolute;top:50%;width:min(14vw,160px);height:1px;background:linear-gradient(90deg,transparent,rgb(77 189 255/.7));left:auto;right:100%;margin-right:14px}
.console::after{right:auto;left:100%;margin-left:14px;background:linear-gradient(90deg,rgb(77 189 255/.7),transparent)}
.console-field{display:flex;flex-direction:column;gap:2px;padding:10px 16px;border-right:1px solid rgb(77 189 255/.25);min-width:0}
.console-field:nth-child(3){border-right:0}
.console-label{font:600 .625rem/1.2 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--copper-on-dark)}
.console select{appearance:none;-webkit-appearance:none;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a9b8c8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right center/16px;border:0;color:var(--on-dark);font:500 1rem/1.4 var(--sans);padding:4px 24px 4px 0;width:100%;cursor:pointer;border-radius:4px}
.console select option{color:var(--ink);background:var(--surface)}
.console select:focus-visible{outline:2px solid var(--copper-on-dark);outline-offset:2px}
.console .btn{align-self:center;margin:4px 6px 4px 10px;min-height:52px;padding-inline:var(--s5);background:var(--forest)}
.console .btn:hover{background:#0b7fd6}
/* proof ledger */
.proof{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s5);margin:var(--s6) 0 0;padding-top:var(--s4);border-top:1px solid var(--on-dark-line)}
.proof div{display:flex;flex-direction:column-reverse;gap:var(--s1)}
.proof dt{font-size:.875rem;color:var(--on-dark-2)}
.proof dd{margin:0;font-family:var(--serif);font-weight:650;font-size:clamp(2rem,1.6rem + 1.6vw,3rem);line-height:1;font-variant-numeric:tabular-nums;color:var(--on-dark);font-variation-settings:normal}
.proof dd small{font-size:.5em;font-family:var(--sans);font-weight:500;color:var(--on-dark-2);margin-left:.2em}

/* ---------- The cost sheet (focal moment) ---------- */
.sheet{position:relative;margin:0;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s5) var(--s5) var(--s5);box-shadow:0 20px 27px rgb(0 0 0/.05);font-size:.9375rem}
.sheet-cap{display:flex;justify-content:space-between;gap:var(--s3);font:600 .6875rem/1.2 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);padding-bottom:var(--s3);border-bottom:1px solid var(--line)}
.sheet-head{display:flex;justify-content:space-between;align-items:baseline;padding:var(--s4) 0 var(--s3)}
.sheet-head .k{font-weight:600}
.sheet-head .v{font-family:var(--serif);font-weight:500;font-size:1.75rem;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.sheet-rows li{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s3);padding:7px 0;border-top:1px dashed var(--line);color:var(--ink-2)}
.sheet-rows li::before{content:"";width:8px;height:8px;border-radius:2px;background:var(--extra);flex:none;align-self:center;margin-right:2px}
.sheet-rows li.govt::before{background:var(--ink-2)}
.sheet-rows li span{flex:1}
.sheet-rows li b{font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.sheet-bar{display:flex;height:12px;border-radius:3px;overflow:hidden;background:var(--surface-2);margin:var(--s4) 0 var(--s3)}
.sheet-bar i{display:block;height:100%;transform-origin:left;background:var(--extra)}
.sheet-bar .base{background:var(--forest);flex:0 0 80.8%}
.sheet-bar .x1{flex:0 0 2.6%}.sheet-bar .x2{flex:0 0 3%}.sheet-bar .x3{flex:0 0 2.4%}.sheet-bar .x4{flex:0 0 4.5%}
.sheet-bar .x5{flex:0 0 6.7%;background:var(--ink-2)}
.sheet-bar i + i{margin-left:1px}
.sheet-total{display:flex;justify-content:space-between;align-items:baseline;padding-top:var(--s3);border-top:2px solid var(--ink)}
.sheet-total .k{font-weight:600}
.sheet-total .v{font-family:var(--serif);font-weight:600;font-size:2rem;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.01em;color:var(--forest-deep)}
.sheet-stamp{position:absolute;right:var(--s4);bottom:var(--s4);transform:rotate(-6deg);padding:5px 10px;border:2px solid var(--extra);border-radius:var(--r-sm);color:var(--extra-text);font:700 .75rem/1.2 var(--sans);letter-spacing:.08em;text-transform:uppercase;background:rgb(255 255 255/.92)}
.sheet-foot{margin-top:var(--s4);font-size:.875rem;color:var(--ink-2)}
.sheet-foot a{font-weight:500}
/* assembly: JS adds .play when the hero is seen; without motion everything is already there */
html.motion .sheet[data-sheet]:not(.play) .sheet-rows li,
html.motion .sheet[data-sheet]:not(.play) .sheet-total,
html.motion .sheet[data-sheet]:not(.play) .sheet-stamp,
html.motion .sheet[data-sheet]:not(.play) .sheet-foot{opacity:0}
html.motion .sheet[data-sheet]:not(.play) .sheet-bar i{transform:scaleX(0)}
html.motion .sheet.play .sheet-rows li{animation:land .5s var(--ease) both;animation-delay:calc(.5s + var(--i) * .42s)}
html.motion .sheet.play .sheet-bar i{animation:grow .55s var(--ease) both}
html.motion .sheet.play .sheet-bar .base{animation-delay:.15s}
html.motion .sheet.play .sheet-bar .x1{animation-delay:.95s}
html.motion .sheet.play .sheet-bar .x2{animation-delay:1.37s}
html.motion .sheet.play .sheet-bar .x3{animation-delay:1.79s}
html.motion .sheet.play .sheet-bar .x4{animation-delay:2.21s}
html.motion .sheet.play .sheet-bar .x5{animation-delay:2.63s}
html.motion .sheet.play .sheet-total{animation:land .5s var(--ease) 2.9s both}
html.motion .sheet.play .sheet-stamp{animation:stamp .5s var(--ease) 3.7s both}
html.motion .sheet.play .sheet-foot{animation:land .4s var(--ease) 4s both}
@keyframes land{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes stamp{from{opacity:0;transform:rotate(-6deg) scale(1.35)}to{opacity:1;transform:rotate(-6deg) scale(1)}}

/* ---------- Why us: two ledgers ---------- */
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s6)}
.why-head{display:grid;grid-template-columns:7fr 5fr;gap:var(--s6);align-items:end;margin-bottom:var(--s7)}
.why-head .lead{margin:0}
.ledger{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s6);box-shadow:var(--shadow-1)}
.ledger h3{display:flex;align-items:center;gap:var(--s3);padding-bottom:var(--s4);border-bottom:1px solid var(--line)}
.ledger h3 svg{width:26px;height:26px;color:var(--copper);fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ledger ol{counter-reset:pt}
.ledger li{counter-increment:pt;display:grid;grid-template-columns:2.25rem 1fr;gap:var(--s3);padding:var(--s4) 0;border-bottom:1px dashed var(--line)}
.ledger li:last-child{border-bottom:0;padding-bottom:0}
.ledger li::before{content:counter(pt);font-family:var(--serif);font-weight:500;font-size:1.5rem;line-height:1;color:var(--copper);font-variant-numeric:tabular-nums;padding-top:2px}
.ledger p{color:var(--ink-2);margin-top:2px}
.why-link{margin-top:var(--s6);font-size:1.0625rem}

/* ---------- Dark bands ---------- */
.band-dark{background:linear-gradient(310deg,#04101c 0%,#0b2a45 100%);color:var(--on-dark)}
.band-dark h2,.band-dark h3{color:var(--on-dark)}
.band-dark h2 em{color:var(--copper-on-dark)}
.band-dark p{color:var(--on-dark-2)}
.band-dark a:not(.btn){color:var(--on-dark)}

/* What you get: three groups */
.groups{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s6);margin-top:var(--s7)}
.group h3{font-size:1.5rem;color:var(--copper-on-dark);padding-bottom:var(--s3);border-bottom:1px solid var(--on-dark-line);font-variation-settings:normal}
.group li{padding:var(--s4) 0;border-bottom:1px solid var(--on-dark-line)}
.group li:last-child{border-bottom:0}
.tag{display:inline-block;font:600 .6875rem/1.2 var(--sans);letter-spacing:.08em;text-transform:uppercase;padding:4px 8px;border-radius:var(--r-sm);background:var(--copper-tint);color:var(--ink);margin-bottom:var(--s2)}
.group h4{color:var(--on-dark);margin-bottom:2px}
.get-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s4) var(--s6);margin-top:var(--s7);padding-top:var(--s5);border-top:1px solid var(--on-dark-line)}
.get-foot p{max-width:40em}

/* ---------- What we check ---------- */
.checks-grid{display:grid;grid-template-columns:4fr 8fr;gap:var(--s8)}
.checks-grid .lead{margin-top:var(--s4)}
.checks{display:grid;grid-template-columns:1fr 1fr;gap:0 var(--s6)}
.check{display:grid;grid-template-columns:28px 1fr;gap:var(--s3);padding:var(--s4) 0;border-bottom:1px solid var(--line)}
.check-tick{width:28px;height:28px;border:1.5px solid var(--line);border-radius:6px;display:grid;place-items:center;color:var(--good-text);background:var(--surface)}
.check-tick svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.25;stroke-linecap:round;stroke-linejoin:round}
.check-tick path{stroke-dasharray:1}
html.motion .check-tick path{stroke-dashoffset:1}
html.motion .in .check-tick path{transition:stroke-dashoffset .45s var(--ease);transition-delay:calc(.15s + var(--i,0) * 60ms);stroke-dashoffset:0}
html.motion .in .check-tick{transition:background .3s,border-color .3s;transition-delay:calc(.15s + var(--i,0) * 60ms)}
html.motion .in .check .check-tick{background:var(--good-tint);border-color:var(--good-tint)}
.check h4{margin-bottom:2px}
.check p{color:var(--ink-2);font-size:.9375rem}
.check a{font-size:.875rem;font-weight:500}
.checks-link{margin-top:var(--s6)}

/* ---------- How it works: pinned steps ---------- */
.how{background:var(--surface-2)}
.how-grid{display:grid;grid-template-columns:5fr 6fr;gap:var(--s8);align-items:start;margin-top:var(--s6)}
.steps-media{position:sticky;top:calc(var(--header) + var(--s5))}
.frame{position:relative;aspect-ratio:4/3;border-radius:var(--r-lg);overflow:hidden;background:var(--forest-deep);box-shadow:var(--shadow-2)}
.frame-layer{position:absolute;inset:0;opacity:0;transition:opacity .5s var(--ease);display:grid;place-items:center}
.frame-layer.is-active{opacity:1}
.frame-layer video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.92}
.frame-layer video:not([data-ready]){display:none}
.frame-layer svg{width:62%;max-width:380px;color:var(--on-dark-2);fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;position:relative}
.frame-layer svg .cu{color:var(--copper-on-dark)}
.frame-layer svg .gd{color:var(--good-dark)}
.frame-label{position:absolute;left:var(--s4);bottom:var(--s4);font:600 .6875rem/1.2 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--on-dark-2)}
.steps{counter-reset:st}
.step{display:grid;grid-template-columns:3.5rem 1fr;gap:var(--s4);padding:var(--s6) 0;border-top:1px solid var(--line);min-height:min(34vh,300px)}
.step:first-child{border-top:0;padding-top:0}
.step-num{font-family:var(--serif);font-weight:650;font-size:3.25rem;line-height:1;color:var(--ink-3);font-variant-numeric:tabular-nums;transition:color .3s;font-variation-settings:normal}
.step.is-active .step-num{color:var(--copper)}
.step h3{margin-bottom:var(--s2)}
.step p{color:var(--ink-2);max-width:30em}
.step-get{margin-top:var(--s3);font-size:.875rem;color:var(--forest);font-weight:500}
.chips{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s3);margin-top:var(--s7);padding-top:var(--s5);border-top:1px solid var(--line)}
.chips span{font-weight:600;margin-right:var(--s2)}
.chip{display:inline-flex;align-items:center;min-height:44px;padding:0 var(--s4);border-radius:var(--r-pill);background:var(--surface);border:1.5px solid var(--line);color:var(--ink);text-decoration:none;font-weight:500;transition:border-color .15s,transform .15s var(--ease),box-shadow .15s}
.chip:hover{border-color:var(--forest);color:var(--forest);transform:translateY(-1px);box-shadow:var(--shadow-1)}

/* ---------- Areas and tools ---------- */
.areas-grid{display:grid;grid-template-columns:7fr 5fr;gap:var(--s8);margin-top:var(--s6)}
.areas{display:grid;grid-template-columns:1fr 1fr;gap:var(--s4)}
.area{position:relative;display:block;min-height:300px;background:linear-gradient(310deg,#04101c 0%,#005094 140%);border-radius:var(--r-lg);color:var(--on-dark);text-decoration:none;overflow:hidden;box-shadow:var(--shadow-1);transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.area:hover{transform:translateY(-3px);box-shadow:var(--shadow-2);color:var(--on-dark)}
.area-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease);opacity:.95}
.area-photo:not([data-ok]){display:none}
.area:hover .area-photo{transform:scale(1.05)}
.area::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgb(4 16 28/.05) 20%,rgb(4 16 28/.85) 100%)}
.area-letter{position:absolute;right:var(--s4);top:var(--s2);font-family:var(--serif);font-weight:700;font-size:7rem;line-height:1;color:rgb(255 255 255/.12);font-variation-settings:normal;pointer-events:none;z-index:1}
.area-body{position:absolute;left:0;right:0;bottom:0;padding:var(--s5);z-index:1}
.area h3{color:var(--on-dark);font-size:1.75rem}
.area-places{color:var(--on-dark-2);font-size:.875rem;margin-top:var(--s1)}
.area-body > p:not(.area-places){margin-top:var(--s3);font-size:.9375rem;color:var(--on-dark);opacity:.9}
.area .textlink{display:inline-block;margin-top:var(--s3);font-size:.875rem;color:var(--copper-on-dark)}
.tools h3{font-size:1.25rem;padding-bottom:var(--s3);border-bottom:1px solid var(--line)}
.tools li a{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);padding:var(--s3) 0;border-bottom:1px dashed var(--line);color:var(--ink);text-decoration:none;font-weight:500}
.tools li a:hover{color:var(--forest)}
.tools .tag{margin:0;background:var(--surface-2);color:var(--ink-2);flex:none}
.tools .textlink{display:inline-block;margin-top:var(--s4)}

/* ---------- No fee + FAQ ---------- */
.fee-grid{display:grid;grid-template-columns:5fr 7fr;gap:var(--s8);align-items:start}
.fee{background:var(--copper-tint);border-radius:var(--r-lg);padding:var(--s6);border:1px solid #c7e7fb;position:relative;overflow:hidden}
.fee h3{font-size:1.75rem}
.fee .lead{margin-top:var(--s2)}
.fee ul{margin-top:var(--s4)}
.fee li{position:relative;padding:var(--s2) 0 var(--s2) var(--s5);color:var(--ink-2)}
.fee li::before{content:"";position:absolute;left:4px;top:1.05em;width:8px;height:8px;border-radius:50%;background:var(--copper)}
.faq h3{font-size:1.75rem;margin-bottom:var(--s3)}
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:var(--s4);padding:var(--s4) 0;font:600 1.0625rem/1.35 var(--sans)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";width:12px;height:12px;flex:none;border-right:2px solid var(--forest);border-bottom:2px solid var(--forest);transform:rotate(45deg) translateY(-3px);transition:transform .25s var(--ease)}
.faq details[open] summary::after{transform:rotate(225deg) translateY(-3px)}
.faq details p{padding:0 0 var(--s4);color:var(--ink-2);max-width:40em}
html.motion .faq details[open] p{animation:land .3s var(--ease)}

/* ---------- Closing ---------- */
.closing{position:relative;text-align:center;overflow:hidden}
.closing .wrap{position:relative;max-width:46em}
.closing-media{position:absolute;inset:0}
.closing-media video{width:100%;height:100%;object-fit:cover;opacity:.5}
.closing-media::after{content:"";position:absolute;inset:0;background:radial-gradient(60% 80% at 50% 60%,rgb(4 16 28/.45),rgb(4 16 28/.92))}
.closing .lead{margin:var(--s4) auto 0}
.closing .hero-actions{justify-content:center}
.closing .reply{margin-top:var(--s5);font-size:.875rem}

/* ---------- Responsive ---------- */
@media (max-width:1100px){
  .hero-grid{grid-template-columns:1fr 1fr;gap:var(--s6)}
  .checks-grid{grid-template-columns:1fr;gap:var(--s6)}
  .checks{grid-template-columns:1fr 1fr}
  .areas-grid{grid-template-columns:1fr;gap:var(--s7)}
}
@media (max-width:850px){
    .hero-grid{grid-template-columns:1fr}
    .why-head{grid-template-columns:1fr;gap:var(--s4);margin-bottom:var(--s6)}
  .why-grid{grid-template-columns:1fr}
  .groups{grid-template-columns:1fr;gap:var(--s5)}
  .how-grid{display:block}
  .steps-media{top:var(--header);z-index:5;margin:0 calc(-1 * var(--gutter));background:var(--surface-2);padding:var(--s3) var(--gutter)}
  .frame{aspect-ratio:16/9;max-height:38vh}
  .steps{margin-top:var(--s5)}
  .step{min-height:0;padding:var(--s5) 0}
  .fee-grid{grid-template-columns:1fr;gap:var(--s6)}
}
@media (max-width:600px){
  .checks{grid-template-columns:1fr}
  .areas{gap:var(--s3)}
  .area{padding:var(--s4)}
  .area-letter{font-size:4rem}
  .proof{gap:var(--s3)}
  .proof dd{font-size:2rem}
  .hero-actions .btn{width:100%;justify-content:center}
}

/* ---------- Cost sheet section ---------- */
.cost{background:var(--paper);position:relative}
.cost-grid{display:grid;grid-template-columns:5fr 7fr;gap:var(--s8);align-items:center}
.cost .sheet{box-shadow:var(--shadow-2),0 1px 0 var(--line);max-width:560px;justify-self:end;width:100%}
.cost .lead{margin-top:var(--s4)}
@media (max-width:1100px){.cost-grid{grid-template-columns:1fr;gap:var(--s6)}.cost .sheet{justify-self:start}}
@media (max-width:850px){
  .hero{padding-top:calc(var(--header) + var(--s6))}
  .hero-center{padding-block:var(--s6)}
  .console{grid-template-columns:1fr;gap:4px;padding:6px}
  .console::before,.console::after{display:none}
  .console-field{border-right:0;border-bottom:1px solid rgb(77 189 255/.25);padding:10px 14px}
  .console-field:nth-child(3){border-bottom:0}
  .console .btn{margin:6px;justify-content:center}
  .area{min-height:240px}
  .area-letter{font-size:4.5rem}
}
@media (max-width:600px){
  .hero h1{font-size:2.9rem}
  .hero-kicker::before,.hero-kicker::after{display:none}
  .areas{grid-template-columns:1fr}
  .area{min-height:220px}
}

/* ---------- Project checks (S4b): links to /check/ pages; no prices on the homepage ---------- */
.pchecks{padding:var(--section) 0;border-top:1px solid var(--line)}
.pchecks-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:var(--s7);align-items:end;margin-bottom:var(--s6)}
.pchecks-head .lead{margin:0}
.pchecks-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s5)}
.pcard{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;text-decoration:none;color:var(--ink);background:var(--paper);transition:transform .15s var(--ease),box-shadow .15s var(--ease)}
.pcard:hover{transform:translateY(-2px);box-shadow:var(--shadow-2)}
.pcard-img{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;background:var(--surface-2)}
.pcard-img img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s var(--ease)}
.pcard:hover .pcard-img img{transform:scale(1.03)}
.pcard-cap{position:absolute;left:10px;bottom:10px;padding:3px 9px;border-radius:999px;background:rgb(255 255 255/.9);font-size:.6875rem;line-height:1.4;color:var(--ink-2)}
.pcard-num{display:flex;align-items:center;gap:14px;padding:var(--s4) var(--s5);background:var(--surface-2);border-bottom:1px solid var(--line);font-size:.8125rem;line-height:1.35;color:var(--ink-2)}
.pcard-num b{flex:none;font:600 clamp(2.2rem,1.7rem + 1.2vw,2.8rem)/1 var(--serif);color:var(--forest-2);font-variant-numeric:tabular-nums}
.pcard-body{flex:1;display:flex;flex-direction:column;gap:10px;padding:var(--s5)}
.pcard-k{font:650 .72rem/1.2 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--copper-text)}
.pcard-body strong{font:600 1.75rem/1.1 var(--serif)}
.pcard-ticks{display:flex;flex-direction:column;gap:6px;font-size:.9rem}
.pcard-ticks span::before{content:"✓";margin-right:8px;color:var(--good-text);font-weight:700}
.pcard-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 12px;margin-top:auto;padding-top:12px;border-top:1px solid var(--line);font-size:.875rem;color:var(--ink-2)}
.pcard-foot span{white-space:nowrap}
.pcard-foot span:last-child{color:var(--forest);font-weight:600}
.pchecks .checks-link{margin-top:var(--s5)}
@media (max-width:1000px){.pchecks-head{grid-template-columns:1fr}.pchecks-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.pchecks-grid{grid-template-columns:1fr}}