/* Homepage v2 — one navy surface, hairline rules, copper only at the protection moment.
   Shared shell (tokens/base/components) is composed, not restyled. */

/* ---------- hero: full-bleed navy stage, video loop, word-by-word headline, looping claim journey ---------- */
.hero{position:relative;min-height:calc(100svh - var(--nav-h));display:flex;align-items:center;padding:var(--s-16) 0 var(--s-20);overflow:hidden;background:var(--ink)}
.hero__video{position:absolute;top:0;bottom:0;left:-10%;width:100%;max-width:none;height:100%;object-fit:cover;object-position:50% 42%;opacity:.82;pointer-events:none;transform-origin:60% 50%;will-change:transform;mask-image:linear-gradient(90deg,#000 78%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,#000 78%,transparent 100%)}
.hero__veil{position:absolute;inset:0;pointer-events:none;background:radial-gradient(60% 55% at 66% 42%,rgba(120,140,190,.12),transparent 70%),linear-gradient(90deg,rgba(12,18,38,.94) 0%,rgba(12,18,38,.72) 36%,rgba(12,18,38,.3) 58%,rgba(12,18,38,.42) 100%),linear-gradient(180deg,rgba(12,18,38,.35) 0%,rgba(12,18,38,0) 30%,rgba(12,18,38,0) 55%,rgba(12,18,38,.75) 100%),linear-gradient(rgba(12,18,38,.28),rgba(12,18,38,.28))}
.hero__fog{position:absolute;inset:-10%;pointer-events:none;background:radial-gradient(45% 40% at 60% 55%,rgba(150,165,200,.16),transparent 70%),radial-gradient(35% 30% at 80% 30%,rgba(150,165,200,.12),transparent 70%);filter:blur(30px);mix-blend-mode:screen;opacity:.5;will-change:transform}
.hero__inner{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:var(--s-10);align-items:center;width:100%}
.hero__copy,.hero__stage{position:relative;z-index:1}
.hero__inner>*{min-width:0}
.hero__h{font-size:clamp(3.4rem,8vw,6.5rem);line-height:.92;letter-spacing:-.045em;font-weight:800;margin-bottom:var(--s-6);perspective:800px}
.hero__h .w{display:block;color:var(--text-on-dark);will-change:transform,opacity}
.hero__h .w--copper{color:var(--copper)}
.hero .lede{max-width:38ch;margin-bottom:var(--s-8);color:var(--text-on-dark-2);font-size:clamp(1.05rem,1.4vw,1.25rem)}
.hero__ctas{display:flex;gap:var(--s-3);flex-wrap:wrap;margin-bottom:var(--s-8)}
.hero__trust{display:flex;gap:var(--s-3) var(--s-6);flex-wrap:wrap;font-size:var(--t-sm);color:var(--steel)}
.hero__trust span{display:inline-flex;align-items:center;gap:8px}
.hero__trust span::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--copper)}
.hero__scroll{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);width:26px;height:42px;border:1px solid rgba(255,255,255,.28);border-radius:14px;display:flex;justify-content:center;padding-top:7px}
.hero__scroll span{width:3px;height:8px;border-radius:2px;background:var(--copper);animation:scrollhint 1.8s ease-in-out infinite}
@keyframes scrollhint{0%{transform:translateY(0);opacity:1}70%{transform:translateY(14px);opacity:0}100%{transform:translateY(0);opacity:0}}
/* stage: certificate + the journey list */
.hero__stage{position:relative;perspective:1200px;display:flex;flex-direction:column;gap:var(--s-4);width:100%;justify-self:end}
#hero-cert{width:100%}
.journey{list-style:none;display:flex;flex-direction:column;background:rgba(12,18,38,.62);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.08);border-radius:var(--r-2);padding:2px 14px}
.journey__step{display:grid;grid-template-columns:14px minmax(0,1fr) auto;gap:14px;align-items:center;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.08);color:var(--steel);font-size:var(--t-sm)}
.journey__step i{width:10px;height:10px;border-radius:50%;border:1.5px solid rgba(255,255,255,.35);background:transparent;transition:background .3s,border-color .3s,box-shadow .3s}
.journey__step b{display:block;font-weight:600;color:var(--text-on-dark-2);transition:color .3s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.journey__step small{display:block;font-size:var(--t-xs);color:var(--steel)}
.journey__t{font-family:var(--font-mono);font-size:11px;color:var(--steel);white-space:nowrap}
.journey__step.is-on i{background:var(--copper);border-color:var(--copper);box-shadow:0 0 0 4px rgba(216,146,91,.2)}
.journey__step.is-on b{color:var(--text-on-dark)}
.journey__step--ok.is-on i{background:var(--mint);border-color:var(--mint);box-shadow:0 0 0 4px rgba(62,199,154,.22)}
.journey__step--ok.is-on b{color:var(--mint)}
.journey__bar{height:3px;background:rgba(255,255,255,.1);border-radius:2px;overflow:hidden}
.journey__bar b{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--copper),var(--mint));transition:width .6s var(--ease)}
@media(max-width:960px){.hero{min-height:0;padding:var(--s-12) 0 var(--s-16)}.hero__video{left:-45%;width:145%;object-position:50% 30%;opacity:.6}.hero__inner{grid-template-columns:1fr;gap:var(--s-10)}.hero__stage{justify-self:stretch;max-width:none}.hero__h{font-size:clamp(3rem,15vw,4.6rem)}.hero__scroll{display:none}.hero__veil{background:linear-gradient(180deg,rgba(12,18,38,.72),rgba(12,18,38,.94) 70%)}}

/* ---------- numbers: counters ---------- */
.numbers{border-bottom:1px solid var(--rule);background:var(--bg-2)}
.numbers__inner{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.numbers .num{padding:var(--s-8) var(--s-6) var(--s-8) 0;border-left:1px solid var(--rule);padding-left:var(--s-6)}
.numbers .num:first-child{border-left:0;padding-left:0}
.numbers .num b{display:block;font-family:var(--font-display);font-size:clamp(1.9rem,3vw,2.6rem);font-weight:700;letter-spacing:-.03em;line-height:1;color:var(--fg);font-variant-numeric:tabular-nums}
.numbers .num span{display:block;margin-top:8px;font-size:var(--t-sm);color:var(--fg-muted)}
@media(max-width:800px){.numbers__inner{grid-template-columns:1fr 1fr}.numbers .num{padding:var(--s-5) var(--s-4) var(--s-5) var(--s-4)}.numbers .num:nth-child(odd){border-left:0;padding-left:0}.numbers .num:nth-child(-n+2){border-bottom:1px solid var(--rule)}}

/* ---------- photos ---------- */
.photo,.feature__media,.band{margin:0;overflow:hidden;border-radius:var(--r-3);background:var(--bg-3)}
.photo img,.feature__media img,.band img{width:100%;height:100%;object-fit:cover;display:block;will-change:transform;scale:1.14}
.photo--wide{aspect-ratio:16/9;margin-bottom:var(--s-8)}
.photo--tall{aspect-ratio:4/5}
.band{aspect-ratio:21/8;margin-bottom:var(--s-12)}
@media(max-width:700px){.band{aspect-ratio:16/9}}

/* ---------- problem: photo + copy ---------- */
.feature{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:var(--s-16);align-items:center}
.feature__media{aspect-ratio:4/3;position:relative}
.feature__media figcaption{position:absolute;left:18px;bottom:16px;font-size:var(--t-xs);color:#fff;background:rgba(12,18,38,.6);padding:6px 10px;border-radius:var(--r-1);backdrop-filter:blur(4px)}
.feature__copy h2{margin-bottom:var(--s-4)}
.feature__copy .lede{margin-bottom:var(--s-8)}
@media(max-width:900px){.feature{grid-template-columns:1fr;gap:var(--s-10)}}


/* ---------- how it works: a 4-step timeline in the shell type scale ---------- */
.steps{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-8);border-top:1px solid var(--rule);position:relative}
.steps__line{position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--copper);transform:scaleX(0);transform-origin:0 50%}
.step{position:relative;padding-top:var(--s-6)}
.step::before{content:'';position:absolute;top:-1px;left:0;width:40px;height:1px;background:var(--copper)}
.step__n{font-family:var(--font-mono);font-size:var(--t-sm);color:var(--copper-hi);margin-bottom:var(--s-4)}
.step h3{font-size:var(--t-lg);font-weight:600;letter-spacing:-.015em;margin-bottom:var(--s-2)}
.step p{color:var(--fg-2);font-size:var(--t-base);line-height:var(--lh-relaxed)}
@media(max-width:900px){.steps__line{display:none}.steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-8) var(--s-8);border-top:0}.step{border-top:1px solid var(--rule-2)}}
@media(max-width:560px){.steps{grid-template-columns:1fr;gap:var(--s-6)}}

/* ---------- for vendors: facts + the portal preview (raised navy frame, not paper) ---------- */
.portal{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--s-16);align-items:start}
.portal__copy .facts li{grid-template-columns:minmax(0,1fr) minmax(0,2.2fr)}
.portal__note{margin-top:var(--s-6);font-size:var(--t-sm);color:var(--fg-muted);line-height:var(--lh-relaxed)}
.portal__frame{background:var(--bg-2);border:1px solid var(--rule-2);border-radius:var(--r-2);overflow:hidden}
.portal__bar{display:flex;align-items:center;gap:7px;padding:10px 14px;border-bottom:1px solid var(--rule)}
.portal__bar i{width:9px;height:9px;border-radius:50%;background:var(--rule-2)}
.portal__bar span{font-size:var(--t-xs);color:var(--fg-muted);margin-left:8px;font-family:var(--font-mono)}
.portal__body{padding:var(--s-5)}
.stats-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);margin-bottom:var(--s-4)}
.stat{padding:12px 14px;border-left:1px solid var(--rule);min-width:0}
.stat:first-child{border-left:0;padding-left:0}
.stat__l{font-size:var(--t-xs);color:var(--fg-muted);margin-bottom:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stat__v{font-family:var(--font-display);font-weight:700;font-size:1.25rem;letter-spacing:-.02em;color:var(--fg);white-space:nowrap}
.stat__d{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:var(--t-xs);color:var(--fg-muted);margin-top:2px;white-space:nowrap}
.spark{height:56px;margin-bottom:var(--s-4)}
.spark svg{width:100%;height:100%}
.portal .table th{background:var(--bg-2)}
.portal .table td{white-space:nowrap}
@media(max-width:960px){.portal{grid-template-columns:1fr;gap:var(--s-10)}}
@media(max-width:640px){.portal .table th:nth-child(3),.portal .table td:nth-child(3),.portal .table th:nth-child(5),.portal .table td:nth-child(5){display:none}.portal .table{font-size:12px}.portal .table th,.portal .table td{padding-left:8px;padding-right:8px}.portal .table th:first-child,.portal .table td:first-child{padding-left:0}.portal .table th:nth-child(4),.portal .table td:nth-child(4){padding-right:0}.portal .table-wrap.is-overflow th:last-child,.portal .table-wrap.is-overflow td:last-child{position:static;border-left:0}}
@media(max-width:560px){.portal__body{padding:var(--s-4)}.stats-row{grid-template-columns:1fr 1fr}.stat{padding:10px 12px}.stat:nth-child(odd){border-left:0;padding-left:0}.stat:nth-child(n+3){border-top:1px solid var(--rule)}}

/* ---------- coverage: tall photo + two ruled columns ---------- */
.coverage-wrap{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:var(--s-12);align-items:start}
@media(max-width:900px){.coverage-wrap{grid-template-columns:1fr}.photo--tall{aspect-ratio:16/10}}
.coverage{display:grid;grid-template-columns:1fr 1fr}
.cov{padding-right:var(--s-12);min-width:0}
.cov+.cov{border-left:1px solid var(--rule);padding:0 0 0 var(--s-12)}
.cov h3{display:flex;align-items:center;gap:10px;font-size:var(--t-lg);font-weight:600;letter-spacing:-.015em;padding-bottom:var(--s-4);border-bottom:1px solid var(--rule-2)}
.cov h3 svg{width:18px;height:18px;flex-shrink:0}
.cov--yes h3 svg{color:var(--mint)}
.cov--no h3 svg{color:var(--fg-muted)}
.cov ul{list-style:none}
.cov li{padding:14px 0;border-bottom:1px solid var(--rule);color:var(--fg-2);font-size:var(--t-base);line-height:1.5}
.cov p{margin-top:var(--s-5);font-size:var(--t-sm);color:var(--fg-muted);line-height:var(--lh-relaxed)}
@media(max-width:800px){.coverage{grid-template-columns:1fr;gap:var(--s-10)}.cov,.cov+.cov{padding:0;border-left:0}}

/* ---------- pricing: copy + a ruled calculator block ---------- */
.pricing{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--s-16);align-items:start}
.pricing__copy h2{margin-bottom:var(--s-4)}
.pricing__copy .lede{margin-bottom:var(--s-8)}
.pricing__copy .facts li{grid-template-columns:minmax(0,1fr) minmax(0,1.8fr)}
.calc{border-top:1px solid var(--rule-2);border-bottom:1px solid var(--rule-2);padding:var(--s-6) 0 var(--s-5)}
.calc__head{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s-4)}
.calc__label{font-size:var(--t-sm);color:var(--fg-muted)}
.calc__val{font-family:var(--font-display);font-size:var(--t-3xl);font-weight:700;letter-spacing:-.03em;color:var(--fg);font-variant-numeric:tabular-nums}
.calc input[type=range]{display:block;width:100%;margin:var(--s-4) 0 var(--s-3);accent-color:var(--copper);cursor:pointer}
.calc__row{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s-4);padding:14px 0;border-top:1px solid var(--rule);font-size:var(--t-sm);color:var(--fg-2)}
.calc__row b{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:var(--t-lg);color:var(--fg);font-weight:600}
.calc__row.fee b{color:var(--copper-hi)}
.calc__row.you{border-top-color:var(--rule-2)}
.calc__row.you b{color:var(--mint)}
.calc__note{font-size:var(--t-xs);color:var(--fg-muted);padding-top:var(--s-4);border-top:1px solid var(--rule)}
@media(max-width:900px){.pricing{grid-template-columns:1fr;gap:var(--s-10)}}

/* ---------- closer: the second navy object ---------- */
.closer{position:relative;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:center;border-radius:var(--r-3);overflow:hidden;min-height:440px;padding:var(--s-16) var(--s-12);background:var(--ink)}
.closer__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 50%;opacity:.5;mask-image:linear-gradient(90deg,transparent 15%,#000 60%);-webkit-mask-image:linear-gradient(90deg,transparent 15%,#000 60%)}
.closer__copy{position:relative}
.closer h2{font-size:clamp(2.2rem,4.2vw,3.4rem);margin-bottom:var(--s-4);color:var(--text-on-dark)}
.closer .lede{margin-bottom:var(--s-8);color:var(--text-on-dark-2)}
.cta__actions{display:flex;gap:var(--s-3);flex-wrap:wrap}
@media(max-width:800px){.closer{grid-template-columns:1fr;padding:var(--s-10) var(--s-6);min-height:0}.closer__img{opacity:.3;mask-image:linear-gradient(180deg,transparent 20%,#000 70%);-webkit-mask-image:linear-gradient(180deg,transparent 20%,#000 70%)}}
.journey__step:last-child{border-bottom:0}