/* ==========================================================================
   home.css — HOME page of the HoloHDR site.
   Composes the frozen foil vocabulary (assets/holo/holo-fallback.css) with the
   Elevate tokens. This file only sizes/positions foil boxes — it never
   restyles the foil itself. LEDGER is the single site language: no concept
   gating remains; what used to sit behind [data-concept="ledger"] is now the
   unprefixed base. The page shell stays token-driven (--page-bg / --page-ink)
   so section copy leans on currentColor and survives the dark bands.
   ========================================================================== */

/* ---------- page shell ---------- */
.home{
  background:var(--page-bg,var(--canvas));
  color:var(--page-ink,var(--ink));
}
/* every section hosts foil pills (z-index:-1 fallback) → own stacking context */
.home>section{position:relative;isolation:isolate;}
.home{position:relative;}

/* ---------- shared vocabulary ---------- */
.home-h2{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(34px,4.6vw,56px);line-height:1.06;letter-spacing:-0.02em;
  margin:0;
}
/* copy inherits the section ink verbatim — slate-900 on light, white on
   dark; NO grey copy anywhere (Aaron) */
.home-sub{
  font-size:clamp(18px,2vw,22px);font-weight:500;
  margin:8px 0 0;
}
.home-lead{
  font-size:17px;line-height:1.55;max-width:52ch;
  margin:var(--space-sm) 0 0;
}
.home-link{
  font-weight:600;color:inherit;
  padding-bottom:2px;
  border-bottom:1px solid color-mix(in srgb,currentColor 32%,transparent);
  transition:border-color var(--dur) ease;
}
.home-link:hover{border-color:currentColor;}
.home-link--lg{font-size:17px;}

/* ---------- silky reveals (armed by home.js; without JS everything shows) ---------- */
body.rv-armed .rv{
  opacity:0;transform:translateY(var(--reveal-rise));
  transition:opacity var(--dur-reveal) var(--ease-silk),transform var(--dur-reveal) var(--ease-silk);
}
body.rv-armed .rv.in{opacity:1;transform:none;}
@media(prefers-reduced-motion:reduce){
  body.rv-armed .rv{opacity:1;transform:none;transition:none;}
}

/* ---------- 1 · hero ---------- */
/* one normal-flow viewport — NO runway, NO sticky: the copy scrolls away the
   instant the wheel turns (Aaron: scrolling must never feel blocked). The
   guilloché background is a separate fixed layer (.home-gbg below); home.js
   owns its land fade-in and its fast scroll fade-out. */
.home-hero{
  min-height:100vh;
  display:flex;flex-direction:column;justify-content:center;
  padding-top:120px;                 /* tolerate the transparent nav */
  padding-bottom:var(--space-lg);
}

/* Guilloche Background 10 — the gallery's quiet-mode exploration as the
   homepage hero background. The construction is the gallery's verbatim
   (components.css .cg-gbg10-stack): two wave sheets at whisper strength
   (25%), masks guilloche-waves-1 (lead) and -3 (echo), every dial on the
   elements. The wrapper (not the .hl!) carries the scroll fade so the foil
   canvases are never resized or display:none'd after boot; at true
   opacity:0 the engine's cssShown gate parks the surfaces and frees their
   animation slots (flash-free resume on scroll-up).
   position:fixed = full viewport on BOTH axes, under the copy and the
   transparent nav. */
.home-gbg{
  position:fixed;inset:0;z-index:0;
  pointer-events:none;
  opacity:0.02; /* pre-JS/boot floor: never 0 at boot, so the engine's
                   visibility gate can't park the sheets before first paint;
                   home.js ramps it to 1 on land */
}
.home-gbg .hl.hl--rule,
.home-gbg .hl.hl--rule.hl-gl{
  position:absolute;inset:0;
  width:100%;height:100%;
  opacity:0.25;                      /* GBG10's whisper strength */
}
.home-gbg__l1,
.home-gbg__l1.hl-gl{
  -webkit-mask:url('assets/guilloche/guilloche-waves-1.svg') center/cover no-repeat;
  mask:url('assets/guilloche/guilloche-waves-1.svg') center/cover no-repeat;
}
.home-gbg__l3,
.home-gbg__l3.hl-gl{
  -webkit-mask:url('assets/guilloche/guilloche-waves-3.svg') center/cover no-repeat;
  mask:url('assets/guilloche/guilloche-waves-3.svg') center/cover no-repeat;
}
/* reduced motion: no scroll choreography — a permanently-visible fixed field
   would bleed through every transparent section down the page; no field is
   the cleaner read (home.js also skips its fades) */
@media(prefers-reduced-motion:reduce){
  .home-gbg{display:none;}
}
.home-hero__in{position:relative;z-index:1;}
.home-hero__copy{max-width:min(640px,56vw);}
.home-hero__h{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(44px,7vw,92px);line-height:1.02;letter-spacing:-0.03em;
  margin:0;
}
.home-hero__lead{
  font-size:clamp(18px,2.2vw,22px);line-height:1.5;
  margin:var(--space-sm) 0 0;max-width:44ch;
}
.home-hero__cta{
  display:flex;align-items:center;gap:var(--space-sm);flex-wrap:wrap;
  margin-top:var(--space-md);
}
/* ---------- 2 · the FIRE list ---------- */
.home-fires{padding:var(--space-2xl) 0;}
/* the section header block is CENTER-ALIGNED like the bento's (Aaron
   2026-07-22) - heading, body, and the small copy underneath */
.home-fires .home-h2{text-align:center;max-width:none;}
.home-fires .home-sub{text-align:center;}
.home-fires .home-lead{text-align:center;margin-left:auto;margin-right:auto;}
.home-fires__grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-sm);
  margin-top:var(--space-lg);
}
.home-stat{
  position:relative;
  isolation:isolate;                 /* keep foil above the card fill */
  background:color-mix(in srgb,currentColor 5%,transparent);
  border-radius:var(--radius-card);
  padding:var(--space-sm);
}
/* (the "real incident data" card's seal-stripe was removed 2026-07-22,
   Aaron - the three stat cards are uniform now) */
/* glowy foil icons on the stat cards (the contract's 28px default resized;
   the compound selector outranks .hl.hl--icon's base size in all states,
   and display:block keeps the old .home-stat__ic layout slot) */
.home-fires .hl.hl--icon{display:block;width:26px;height:26px;}
.home-stat__num{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(46px,5.4vw,72px);line-height:1.1;letter-spacing:-0.02em;
  margin-top:var(--space-xs);
}
.home-stat__label{
  font-size:17px;font-weight:600;margin:6px 0 0;
}
.home-stat__foot{
  font-size:14.5px;line-height:1.5;
  margin:var(--space-xs) 0 0;
}

/* ---------- 3 · the bento: one platform, four capabilities ----------
   2x2 product bento. Foil rules never resize (the anti-flash contract):
   the scan bar's fill and the trendline draw-in are both CURTAINS - an
   overflow-hidden reveal translates while the full-size foil inside
   counter-translates; JS (home.js) drives the progress. */
.home-bento{padding:var(--space-2xl) 0;}
.home-bento__h{text-align:center;max-width:none;}
.home-bento__sub{
  text-align:center;font-size:17px;line-height:1.55;
  margin:var(--space-xs) auto 0;
}
.home-bento__grid{
  display:grid;grid-template-columns:1fr 1fr;gap:var(--space-sm);
  margin-top:var(--space-lg);
}
@media(max-width:880px){.home-bento__grid{grid-template-columns:1fr;}}
.home-bento__card{
  position:relative;isolation:isolate;overflow:hidden;
  border-radius:16px;background:var(--slate-50);
  padding:clamp(28px,3.5vw,48px);
  min-height:380px;
  display:flex;flex-direction:column;
}
.home-bento__t{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(24px,2.6vw,34px);letter-spacing:-0.02em;
  margin:0 0 14px;
}
.home-bento__p{font-size:17px;line-height:1.6;max-width:44ch;margin:0 0 18px;}
.home-bento__link{margin:0;}

/* card 1 - Scan: the creeping progress cluster, bottom right */
.home-bento__scanviz{
  margin-top:auto;align-self:flex-end;
  display:flex;flex-direction:column;align-items:flex-end;gap:10px;
  width:min(320px,100%);padding-top:var(--space-sm);
}
.home-scanbar{
  position:relative;width:100%;height:6px;border-radius:999px;
  background:var(--slate-200);overflow:hidden;
}
/* plain ink fill (2026-07-22, Aaron: the bento's lines go slate-900, no
   hologram) - a simple width transition, no engine surface, no curtain */
.home-scanbar__fill{
  position:absolute;left:0;top:0;bottom:0;display:block;
  width:8%;border-radius:999px;
  background:var(--slate-900);
}
.home-bento__pillrow{display:flex;gap:8px;}
.home-bento__scancap{
  font-size:14px;margin:0;color:var(--ink);
  display:flex;align-items:center;gap:6px;
}
.home-bento__scancap strong{font-weight:700;}
.home-dots{display:inline-flex;}
.home-dots i{font-style:normal;opacity:0;animation:homeDot 1.4s infinite;}
.home-dots i:nth-child(2){animation-delay:.2s;}
.home-dots i:nth-child(3){animation-delay:.4s;}
@keyframes homeDot{0%{opacity:0;}30%,80%{opacity:1;}100%{opacity:0;}}

/* wide variant (layout experiment, 2026-07-22, Aaron): Scan and Warranty
   stretch full-width at 320px tall; Surface + Reporting share the middle
   row. Same cards, same recipes - only the grid placement changes. */
.home-bento--wide .home-bento__card--scan,
.home-bento--wide .home-bento__card--warranty{grid-column:1/-1;min-height:320px;}

/* card 2 - Surface: dark; the page's ONE globe (legacy spin), clipped right */
.home-bento__card--surface{background:var(--slate-950);color:#fff;}
.home-bento__globe{
  position:absolute;right:-16%;top:50%;transform:translateY(-50%);
  width:76%;aspect-ratio:1;z-index:0;pointer-events:none;
}
.home-bento__globe .hl.hl--globe,
.home-bento__globe .hl.hl--globe.hl-gl{position:absolute;inset:0;}
.home-bento__card--surface .home-bento__t,
.home-bento__card--surface .home-bento__p,
.home-bento__card--surface .home-bento__link{position:relative;z-index:1;}
.home-bento__card--surface .home-bento__p{max-width:36ch;}

/* card 3 - Reporting: the draw-in trendline (wider box than the 3c slide) */
.home-bento__sparkwrap{position:relative;margin-top:auto;}
.home-bento__spark{display:block;width:100%;height:auto;}
/* the in-flow polyline only SIZES the box - it paints nothing (2026-07-22,
   Aaron: no pre-drawn grey track; the dot draws the line fresh) */
.home-bento__spark polyline{fill:none;stroke:transparent;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;}
.home-bento__spark circle{fill:var(--slate-950);stroke:#fff;stroke-width:2;}
/* plain ink line (2026-07-22, Aaron): the drawn line is slate-900 - a masked
   solid, no engine surface; the draw-in curtain works on it unchanged */
.home-bento__sparkink{
  position:absolute;inset:0;display:block;
  background:var(--slate-900);
  -webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20460%20110'%3E%3Cpolyline%20points='6,96%2052,85%2092,87%20138,66%20184,57%20224,60%20276,41%20322,32%20368,25%20414,16%20446,11'%20fill='none'%20stroke='%23fff'%20stroke-width='3.5'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20460%20110'%3E%3Cpolyline%20points='6,96%2052,85%2092,87%20138,66%20184,57%20224,60%20276,41%20322,32%20368,25%20414,16%20446,11'%20fill='none'%20stroke='%23fff'%20stroke-width='3.5'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
}
.home-bento__spark--dot{position:absolute;inset:0;z-index:1;height:100%;pointer-events:none;}

/* the shared draw-in curtain ([data-spark-draw], bento + the 3c slide):
   the reveal translates left while the foil counter-translates - net zero
   at the seam, so the full-size canvas is wiped in without ever resizing.
   home.js eases both to 0 with the dot riding the edge. */
.sparkdraw-reveal{
  position:absolute;inset:0;display:block;overflow:hidden;
  transform:translateX(-101%);
}
.sparkdraw-reveal>*{transform:translateX(101%);}

/* card 4 - Warranty: silver-locked laminate bed + mix seal-stripe + badge */
.home-bento__card--warranty{
  background:var(--slate-100);
  padding-left:calc(clamp(20px,2.5vw,36px) + clamp(28px,3.5vw,48px));
}
.home-bento__lam{position:absolute;inset:0;z-index:0;opacity:0.4;pointer-events:none;}
.home-bento__lam .hl.hl--rule,
.home-bento__lam .hl.hl--rule.hl-gl{
  position:absolute;inset:0;width:100%;height:100%;display:block;
}
/* pattern sheets re-tiled for a big card (cover would blow one tile up) */
.home-bento__lam .hl--pat-guilloche,
.home-bento__lam .hl--pat-guilloche.hl-gl{
  -webkit-mask-size:180px auto;mask-size:180px auto;
  -webkit-mask-repeat:repeat;mask-repeat:repeat;
  -webkit-mask-position:center;mask-position:center;
}
.home-bento__lam .hl--pat-logo,
.home-bento__lam .hl--pat-logo.hl-gl{
  -webkit-mask-size:auto 720px;mask-size:auto 720px;
  -webkit-mask-repeat:repeat;mask-repeat:repeat;
  -webkit-mask-position:left center;mask-position:left center;
}
.home-bento__card--warranty>.hl--seal{z-index:2;}
/* the edge stamp's four sheets: the REBUILT Seal-stripe-on-a-card-4 masks
   (gallery recipe verbatim: shield-stripe4-* artworks, sheet 3 at 50%) */
.hb-s4x1,.hb-s4x1.hl-gl{-webkit-mask:url('assets/guilloche/shield-stripe4-1.svg') center/cover no-repeat;mask:url('assets/guilloche/shield-stripe4-1.svg') center/cover no-repeat;}
.hb-s4x2,.hb-s4x2.hl-gl{-webkit-mask:url('assets/guilloche/shield-stripe4-2.svg') center/cover no-repeat;mask:url('assets/guilloche/shield-stripe4-2.svg') center/cover no-repeat;}
.hb-s4x3,.hb-s4x3.hl-gl{-webkit-mask:url('assets/guilloche/shield-stripe4-3.svg') center/cover no-repeat;mask:url('assets/guilloche/shield-stripe4-3.svg') center/cover no-repeat;}
.hb-s4x3-dim,.hb-s4x3-dim.hl-gl{opacity:0.5;}
.hb-s4x4,.hb-s4x4.hl-gl{-webkit-mask:url('assets/guilloche/shield-stripe4-4.svg') center/cover no-repeat;mask:url('assets/guilloche/shield-stripe4-4.svg') center/cover no-repeat;}
.home-bento__badge{
  position:absolute;right:-60px;bottom:-70px;
  width:min(340px,62%);z-index:1;pointer-events:none;
}
.home-bento__badge .emblem-stage{width:100%;aspect-ratio:1;}
.home-bento__badge .emblem-tilt{width:100%;height:100%;will-change:transform;}
/* the badge canvas paints an OPAQUE square (its field is one flat sampled
   color) which read as a pale plate over the silver laminate - clip it to
   the emblem's circle so the corners vanish and the laminate runs right up
   to the badge (a soft 2% feather hides the disc edge; masking never
   resizes the canvas) */
.home-bento__badge .warr-holo{
  display:block;
  -webkit-mask-image:radial-gradient(circle closest-side,#000 97%,transparent 99.5%);
  mask-image:radial-gradient(circle closest-side,#000 97%,transparent 99.5%);
}
.home-bento__body{position:relative;z-index:2;display:flex;flex-direction:column;flex:1;}
.home-bento__card--warranty .home-bento__p{max-width:34ch;}

@media(prefers-reduced-motion:reduce){
  .home-scanbar__fill{width:62%;transition:none;}
  .home-dots i{animation:none;opacity:1;}
  .sparkdraw-reveal{transform:none;}
  .sparkdraw-reveal>*{transform:none;}
}

/* ---------- 3 · product teasers (shared) ---------- */
.home-teaser{padding:var(--space-2xl) 0;}
.home-teaser__h{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(30px,4.4vw,52px);line-height:1.06;letter-spacing:-0.02em;
  margin:0;max-width:24ch;
}
.home-teaser__p{
  font-size:clamp(17px,1.9vw,20px);line-height:1.55;max-width:52ch;
  margin:var(--space-sm) 0 0;
}
.home-teaser__cta{margin:var(--space-md) 0 0;}

/* 3a — Surface: the dark beat; the big line is plain white display type
   (the steel foil was retired — restraint) */
.home-surface{
  background:var(--cx-dark-bg,var(--slate-950));
  color:var(--cx-dark-ink,var(--on-dark));
  min-height:78vh;
  display:flex;flex-direction:column;justify-content:center;
}
.home-steel{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(19px,6.4vw,92px);line-height:1.08;letter-spacing:-0.02em;
  margin:var(--space-sm) 0 0;
}
.home-surface .home-teaser__p{margin-top:var(--space-md);}

/* 3b — Scan: copy left, the Financial Risk Retired counter card right.
   Restraint: NO foil anywhere on this card. Geometry + type follow Aaron's
   Figma export (520x304, slate-50, radius 16 — deliberately NOT the 24px
   --radius-card; the export's shadows are ignored per the monochrome law,
   and the card sits borderless — no hairline either, per Aaron). */
.home-scan__grid{
  display:grid;grid-template-columns:1.05fr 0.95fr;gap:var(--space-xl);
  align-items:center;
}
.home-scan__copy{max-width:56ch;}
/* 520 max at EVERY width: the card never stretches with its column — it
   centers instead (grid child → justify-self). */
.home-frr{
  width:min(100%,520px);
  justify-self:center;
  background:var(--slate-50);
  border-radius:16px;
  padding:var(--space-md);
}
.home-frr__title{
  font-size:24px;font-weight:600;color:var(--ink);
  margin:0;
}
/* the figure row: a separate medium-weight $ TOP-ALIGNED to the number's cap
   height (flex-start + a small em nudge past the ascent gap), tight 6px gap,
   then the two small skeleton pills riding beside the figure */
.home-frr__fig{
  display:flex;align-items:flex-start;gap:6px;
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(40px,4vw,52px);line-height:1;letter-spacing:-0.02em;
  color:var(--ink);
  margin:var(--space-xs) 0 0;
}
.home-frr__cur{
  font-size:0.58em;font-weight:500;
  margin-top:0.14em;                 /* drops the $ cap to the number's cap */
}
/* min-width in ch so "1.4M" → "62.1M" never shifts the pills beside it */
.home-frr__num{
  display:inline-block;
  min-width:5.2ch;
}
.home-frr__figpills{
  display:inline-flex;gap:8px;
  align-self:center;margin-left:6px;
}
/* skeleton pills per the export: slate-200, radius 4, 12px tall */
.home-frr__pill{
  display:inline-block;height:12px;
  border-radius:4px;
  background:var(--slate-200);
}
.home-frr__pill--w16{width:16px;}
.home-frr__pill--w32{width:32px;}
.home-frr__pill--w56{width:56px;}
.home-frr__pill--w64{width:64px;}
.home-frr__pill--w128{width:128px;}
.home-frr__pillrow{
  display:flex;gap:8px;
  margin-top:var(--space-sm);
}
/* caption row: inline (NOT flex — the strong lives mid-sentence), pill
   vertically centered against the text */
.home-frr__foot{
  font-size:15px;font-weight:400;color:var(--ink);
  margin:var(--space-sm) 0 0;
}
.home-frr__foot strong{font-weight:700;}
.home-frr__foot .home-frr__pill{vertical-align:middle;margin-left:6px;}

/* 3c — Reporting: copy left, the board-slide mock right — the same plain-
   card family as the FRR card (borderless slate-50, radius 16; the
   holo-frame ring is gone). The ONE foil beat is the trendline. */
.home-report__grid{
  display:grid;grid-template-columns:1.05fr 0.95fr;gap:var(--space-xl);
  align-items:center;
}
.home-slide{
  width:min(100%,520px);
  justify-self:center;
  background:var(--slate-50);
  border-radius:16px;
  overflow:hidden;
}
/* the bar carries the FRR title tone (slate-700, 24px, 600); the page count
   stays quiet */
.home-slide__bar{
  display:flex;justify-content:space-between;align-items:baseline;gap:var(--space-xs);
  padding:var(--space-sm) 28px 0;
}
.home-slide__bar span:first-child{font-size:24px;font-weight:600;color:var(--ink);}
.home-slide__bar span:last-child{font-size:13px;font-weight:var(--w-medium);}
.home-slide__body{padding:var(--space-sm) 28px;}
.home-slide__label{font-size:14px;font-weight:var(--w-medium);color:var(--ink);margin:0 0 8px;}
/* the figure matches the FRR treatment exactly: medium top-aligned $ (the
   shared .home-frr__cur), bold number, same clamp - one family, two cards */
.home-slide__fig{
  display:flex;align-items:flex-start;gap:6px;
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(40px,4vw,52px);letter-spacing:-0.02em;line-height:1;
  color:var(--ink);margin:0;
}
.home-slide__delta{font-size:15px;font-weight:var(--w-medium);color:var(--ink);margin:12px 0 0;}
/* the trendline foil: the wrapper anchors three layers over one box —
   1) the static slate polyline SVG (in flow: it SIZES the box and is the
      no-engine fallback), 2) the foil rule masked to the same polyline shape
      (stroke 3 vs the fallback's 2.5, so an armed foil fully covers the slate
      line), 3) the endpoint dot as its own static SVG on top — Aaron's dot is
      NEVER foiled. The compound selector below ties .hl.hl--rule.hl-gl's
      specificity; this file loads later, so the absolute geometry wins in
      both fallback and engine states (same trick as .home-hero__ribbon). */
.home-slide__sparkwrap{position:relative;margin-top:var(--space-sm);}
.home-slide__spark{display:block;width:100%;height:auto;}
.home-slide__spark polyline{fill:none;stroke:var(--slate-400);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;}
.home-slide__spark circle{fill:var(--slate-950);stroke:#fff;stroke-width:2;}
.home-slide__sparkwrap .hl.hl--rule{
  position:absolute;inset:0;
  -webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20320%2096'%3E%3Cpolyline%20points='4,84%2036,74%2064,76%2096,58%20128,50%20156,52%20192,36%20224,28%20256,22%20288,14%20310,10'%20fill='none'%20stroke='%23fff'%20stroke-width='3'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20320%2096'%3E%3Cpolyline%20points='4,84%2036,74%2064,76%2096,58%20128,50%20156,52%20192,36%20224,28%20256,22%20288,14%20310,10'%20fill='none'%20stroke='%23fff'%20stroke-width='3'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
}
.home-slide__spark--dot{
  position:absolute;inset:0;z-index:1;
  height:100%;
  pointer-events:none;
}

/* 3d — Warranty: the star teaser, quiet slate band (the emerald lives in the
   foil only). The holo-frame ring turns the body into a framed card.
   (Restored 2026-07-21 — only the gallery's flooded fill-card RENDERING was
   wrong, never the ring itself.) */
.home-warranty{background:var(--slate-100);color:var(--ink);}
.home-warranty__frame{isolation:isolate;}
/* the framed card needs its own fill so the ring reads as a frame */
.home-warranty__in{
  background:var(--canvas);
  padding:var(--space-lg);
}

/* ---------- 4 · three messages — stacking cards ---------- */
.home-stack{padding:var(--space-xl) 0;}
.home-stack__list>*+*{margin-top:var(--space-md);}
.home-scard{
  position:sticky;
  min-height:82vh;
  border-radius:var(--radius-card);
  display:flex;align-items:center;justify-content:center;
  text-align:center;
  padding:var(--space-lg);
}
.home-scard:nth-child(1){top:clamp(12px,3vh,24px);}
.home-scard:nth-child(2){top:calc(clamp(12px,3vh,24px) + 14px);}
.home-scard:nth-child(3){top:calc(clamp(12px,3vh,24px) + 28px);}
.home-scard__h{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(30px,4.8vw,60px);line-height:1.08;letter-spacing:-0.02em;
  margin:0;max-width:20ch;
}
/* the monochrome trio: two paper steps, then ink — no foil in this section
   (restraint); the base .home-scard flex centering puts each headline in
   the true middle of its card */
.home-scard--light{background:var(--slate-100);color:var(--slate-950);}
.home-scard--mid{background:var(--slate-200);color:var(--slate-950);}
.home-scard--dark{background:var(--slate-950);color:#fff;}

/* ---------- 5 · who needs Evidence ---------- */
.home-who{padding:var(--space-2xl) 0;}
.home-who__grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-sm);
  margin-top:var(--space-lg);
}
.home-whoc{
  display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-xs);
  background:color-mix(in srgb,var(--slate-50) 88%,transparent);   /* 88% glass (Aaron 2026-07-24) */
  -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
  border-radius:var(--radius-card);
  padding:var(--space-sm);
  transition:background .35s var(--ease-silk),border-color .35s var(--ease-silk),transform .35s var(--ease-silk);
}
.home-whoc:hover{background:color-mix(in srgb,var(--slate-100) 88%,transparent);transform:translateY(-2px);}
@media(prefers-reduced-motion:reduce){
  .home-whoc{transition:none;}
  .home-whoc:hover{transform:none;}
}
/* glowy foil icons, out of any boxes (the contract's 28px default, sized up;
   the compound selector outranks .hl.hl--icon's base size in all states) */
.home-whoc .hl.hl--icon{width:32px;height:32px;}
.home-whoc__h{
  font-family:var(--font-display);font-weight:700;font-size:22px;letter-spacing:-0.01em;
  margin:4px 0 0;
}
.home-whoc__p{
  font-size:15px;line-height:1.55;flex:1;
  margin:0;
}

/* ---------- 6 · closer ---------- */
.home-closer{padding:var(--space-lg) 0 0;}
.home-closer__panel{
  background:var(--cx-dark-bg,var(--slate-950));
  color:var(--cx-dark-ink,var(--on-dark));
  border-radius:var(--radius-card);
  padding:var(--space-xl) var(--space-md);
  text-align:center;
}
.home-closer__h{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(36px,5vw,64px);line-height:1.05;letter-spacing:-0.02em;
  margin:0 auto;max-width:20ch;
}
.home-closer__p{
  font-size:clamp(17px,1.9vw,20px);line-height:1.55;max-width:48ch;
  margin:var(--space-sm) auto 0;
}
.home-closer__btn{margin-top:var(--space-md);}
/* the page-ender pattern: the glowy CTA at 2x scale. Sizing lives on the
   inner pill (the .btn--holo wrapper drops its own fill/padding); the
   three-class compound outranks holo-fallback's .hl.hl--btn in all states. */
.btn--holo-xl .hl.hl--btn{
  font-size:23px;
  padding:22px 44px;
}

/* ---------- responsive ---------- */
@media(max-width:880px){
  .home-hero__copy{max-width:none;}
  .home-fires__grid,.home-who__grid{grid-template-columns:1fr;}
  .home-scan__grid,.home-report__grid{grid-template-columns:1fr;gap:var(--space-lg);}
  .home-warranty__in{padding:var(--space-md);}
  .home-frr{padding:var(--space-sm);}
  .home-scard{min-height:70vh;}
}
@media(max-width:560px){
  .home-hero{padding-top:104px;}
  .home-closer__panel{padding:var(--space-lg) var(--space-sm);}
  .btn--holo-xl .hl.hl--btn{font-size:19px;padding:18px 34px;}
}

/* ==========================================================================
   PINNED STATEMENT BEATS (.sfmap) - shared with the surface page (this file
   loads there too; the driver lives in home.js). Sticky 100vh stage, one
   line per screen, wrapper-only crossfades; without JS / reduced motion the
   lines flow as stacked content. Ink inherits the ground: dark type on the
   light home, white inside a cx-dark-band section.
   ========================================================================== */
body.sf-scrub .sfmap{position:relative;min-height:300vh;}
body.sf-scrub .sfmap--two{min-height:220vh;}
body.sf-scrub .sfmap__sticky{position:sticky;top:0;height:100vh;overflow:hidden;}
body.sf-scrub .sfmap__phase{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;pointer-events:none;isolation:isolate;}
body.sf-scrub .sfmap__phase > .wrap{width:100%;}
body:not(.sf-scrub) .sfmap__phase{padding:var(--space-xl) 0;}
.sfmap__in{text-align:center;isolation:isolate;}
.sfmap__line{font-family:var(--font-display);font-weight:700;font-size:clamp(38px,5.6vw,84px);line-height:1.08;letter-spacing:-0.035em;margin:0;}
/* the settled paragraph under a final beat (Problem A) */
.sfmap__sub{font-size:clamp(16px,1.6vw,19px);line-height:1.6;max-width:46ch;margin:var(--space-sm) auto 0;}
/* six-beat stage (the prove-it story) */
body.sf-scrub .sfmap--long{min-height:520vh;}
/* a beat's floating icon, centered above the line; the art is black-fill,
   so it inverts to white inside a dark band */
.sfmap__icon{display:block;width:clamp(104px,12vw,160px);height:auto;margin:0 auto 28px;}
.cx-dark-band .sfmap__icon img,
.cx-dark-band img.sfmap__icon{filter:invert(1);}
/* the idea beat: the engine's foil shimmers over JUST the lightbulb -
   an hl--icon masked to the bulb+rays region of the same 110x115 art,
   stacked on the inverted base image */
.sfmap__icon--fire{position:relative;aspect-ratio:110/115;}
.sfmap__icon--fire img{display:block;width:100%;height:100%;}
.hl.sfmap__bulb,
.hl.sfmap__bulb.hl-gl{position:absolute;inset:0;width:100%;height:100%;
  -webkit-mask:url('assets/holo/svg/icon-bulb-fire.svg') center/contain no-repeat;
  mask:url('assets/holo/svg/icon-bulb-fire.svg') center/contain no-repeat;}
/* the quote beat: same layered recipe, the CHECKMARK carries the foil */
.sfmap__icon--check{position:relative;aspect-ratio:110/115;}
.sfmap__icon--check img{display:block;width:100%;height:100%;}
.hl.sfmap__checkmark,
.hl.sfmap__checkmark.hl-gl{position:absolute;inset:0;width:100%;height:100%;
  -webkit-mask:url('assets/holo/svg/icon-check-bubble.svg') center/contain no-repeat;
  mask:url('assets/holo/svg/icon-check-bubble.svg') center/contain no-repeat;}

/* ==========================================================================
   V3 REDESIGN (2026-07-24) - hero proof line, the 01-04 chain, the firsts
   story stack, and the founders cards. Everything below reuses the site's
   proven recipes; the retired sections' styles above stay for the archive.
   ========================================================================== */

/* hero proof line - quiet, rides the introBlur with the copy wrapper */
.home-hero__proof{font-size:15px;line-height:1.55;color:color-mix(in srgb,currentColor 62%,transparent);max-width:52ch;margin:28px 0 0;}

/* ---- 5 · the chain: steel numerals over type-only rows ---- */
.home-chain{padding:var(--space-2xl) 0;isolation:isolate;}
.home-chain__list{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-md) var(--space-sm);margin-top:var(--space-lg);}
/* plain slate-900 numerals, left aligned (foil retired - Aaron) */
.home-chain__num{display:block;font-family:var(--font-display);font-weight:700;font-size:clamp(40px,4.6vw,64px);line-height:1;color:var(--slate-900);text-align:left;margin-bottom:16px;}
.home-chain__step h3{font-family:var(--font-display);font-weight:700;font-size:22px;letter-spacing:-0.01em;margin:0 0 10px;}
.home-chain__step p{font-size:15.5px;line-height:1.6;margin:0;}
.home-chain__cta{margin-top:var(--space-lg);}
@media(max-width:1023px){.home-chain__list{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.home-chain__list{grid-template-columns:1fr;}}

/* ---- 6 · the firsts: the story-stack treatment on the light ground.
   Four sticky cards climb; each keeps its product's live viz. ---- */
.home-firsts{position:relative;padding:var(--space-xl) 24px;isolation:isolate;}
.home-firsts .wrap{margin-bottom:var(--space-md);}
.home-firsts__list{
  max-width:1200px;margin:0 auto;
  display:flex;flex-direction:column;gap:120px;
}
.home-firsts__list::after{content:"";height:30vh;}
.home-firsts__card{
  position:sticky;
  display:flex;flex-direction:column;justify-content:center;
  min-height:clamp(440px,62vh,620px);
  border-radius:32px;overflow:hidden;isolation:isolate;
  padding:48px clamp(28px,5vw,72px);
  padding-right:calc(clamp(28px,5vw,72px) + clamp(20px,2.5vw,36px));   /* clear the stripe */
}
.home-firsts__card:nth-child(odd){background:var(--slate-50);}
.home-firsts__card:nth-child(even){background:var(--slate-100);}
.home-firsts__card:nth-child(1){top:96px;z-index:4;}
.home-firsts__card:nth-child(2){top:120px;z-index:5;}
.home-firsts__card:nth-child(3){top:144px;z-index:6;}
.home-firsts__card:nth-child(4){top:168px;z-index:7;}
.hl.hl--seal.home-firsts__stripe,
.hl.hl--seal.home-firsts__stripe.hl-gl{left:auto;right:0;}
.home-firsts__body{max-width:56ch;position:relative;z-index:1;}
/* the product logo (the nav ptile foil icons, card-sized) leads each card;
   compounds outrank the icon contract's 28px default */
.hl.hl--icon.home-firsts__logo,
.hl.hl--icon.home-firsts__logo.hl-gl{display:block;width:44px;height:44px;margin:0 0 18px;}
.home-firsts__t{font-family:var(--font-display);font-weight:700;font-size:clamp(26px,3vw,40px);line-height:1.12;letter-spacing:-0.025em;margin:0;}
.home-firsts__p{font-size:clamp(16px,1.5vw,19px);line-height:1.6;margin:18px 0 0;max-width:52ch;}
.home-firsts__link{margin:18px 0 0;}
/* card 1 - Surface: the dark card hosts the page's ONE globe */
.home-firsts__card--surface{background:var(--slate-950)!important;color:#fff;}
/* card 3 - Reporting: copy left, the board slide right */
.home-firsts__grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(24px,3vw,48px);align-items:center;}
/* card 4 - Warranty: the bento recipe verbatim (laminate bed + left edge
   stamp + clipped badge); clear the stamp like the bento card did.
   The badge runs 35% bigger here and centers vertically (Aaron). */
.home-firsts__card--warranty{padding-left:calc(clamp(20px,2.5vw,36px) + clamp(28px,5vw,72px));}
.home-firsts__card--warranty .home-bento__badge{width:min(459px,84%);top:50%;bottom:auto;transform:translateY(-50%);}
.home-firsts__card--warranty > .hl--seal{z-index:2;}
@media(max-width:880px){
  .home-firsts__grid{grid-template-columns:1fr;}
  .home-firsts__card{min-height:0;padding:36px 24px;padding-right:calc(24px + 20px);}
  .home-firsts__card--warranty{padding-left:calc(20px + 24px);}
}

/* the quote slide's floor: the FULL laminate stripe + microtext (the
   pre-footer's four-sheet recipe rides the .holo-hr classes verbatim -
   fallback stacking + the site.css re-tiling apply) at 2x height,
   pinned to the stage bottom */
.sfmap__hr{position:absolute;left:0;right:0;bottom:0;height:32px;z-index:1;margin:0;}
/* the quote beat runs longer than a statement line - size it to fit */
.sfmap__line--quote{font-size:clamp(26px,3.6vw,54px);max-width:26ch;margin:0 auto;}

/* ---- 9 · founders: the surface founder-card treatment, light ----
   The heading is the quote composition (Aaron's mock): three display
   lines flanked by GLOWING steel-foil quotation marks - the engine's
   glyph treatment, no masks needed. */
.home-found{padding:var(--space-2xl) 0;isolation:isolate;}
/* the marks are SVG comma-pair artwork driven as engine foil icons -
   deterministic pixel boxes (the steel-glyph attempt fought font metrics
   and clipped/drifted). The open pair hangs in the left margin so the
   title stays flush with the lead below; the close pair rides a
   zero-width inline anchor at the end of the last line. */
.home-found__quote{position:relative;display:block;font-family:var(--font-display);font-weight:700;font-size:clamp(32px,4.6vw,64px);line-height:1.2;letter-spacing:-0.02em;margin:0;}
.hl.hl--icon.home-found__qmark,
.hl.hl--icon.home-found__qmark.hl-gl{display:block;aspect-ratio:170/124;height:auto;padding:0;}
/* mock-metered, em-driven (tracks the title size): mark ~2.3x the title
   em, a 0.7em gap to the text. The .hl--icon contract's 28px default
   outranked the earlier width rules - that's why the marks rendered
   tiny; these compounds outrank it in all states. */
.hl.hl--icon.home-found__qmark--open,
.hl.hl--icon.home-found__qmark--open.hl-gl{
  position:absolute;width:2.3em;left:-3em;top:-0.15em;
  -webkit-mask:url('assets/media/Q_quote.svg') center/contain no-repeat;
  mask:url('assets/media/Q_quote.svg') center/contain no-repeat;
}
.home-found__qanchor{position:relative;display:inline-block;width:0.4em;height:1px;vertical-align:baseline;}
.hl.hl--icon.home-found__qmark--close,
.hl.hl--icon.home-found__qmark--close.hl-gl{
  position:absolute;width:2em;left:calc(1.5em + 48px);top:0.1em;   /* clear of the lead paragraph below-right (Aaron, +48px round 2) */
  -webkit-mask:url('assets/media/Q_unquote.svg') center/contain no-repeat;
  mask:url('assets/media/Q_unquote.svg') center/contain no-repeat;
}
@media(max-width:1100px){
  .hl.hl--icon.home-found__qmark--open,
  .hl.hl--icon.home-found__qmark--open.hl-gl{position:static;margin:0 0 18px;}
}
.home-found__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-sm);margin-top:var(--space-lg);}
.home-found__card{background:var(--slate-50);border-radius:var(--radius-card);padding:clamp(24px,3vw,40px);}
body.rv-armed .home-found__card.rv{--reveal-rise:72px;--dur-reveal:.9s;}
.home-found__photo{width:min(200px,100%);aspect-ratio:1;object-fit:cover;border-radius:var(--radius-input);display:block;}
.home-found__name{font-family:var(--font-display);font-weight:700;font-size:clamp(22px,2.2vw,30px);line-height:1.15;letter-spacing:-0.02em;margin:22px 0 0;}
.home-found__role{display:block;margin:6px 0 0;font-family:var(--font-body);font-size:15px;font-weight:600;color:color-mix(in srgb,currentColor 62%,transparent);letter-spacing:0;}
.home-found__card p{font-size:clamp(15px,1.4vw,17px);line-height:1.55;margin:12px 0 0;max-width:52ch;}
.home-found__cta{margin-top:var(--space-md);}
@media(max-width:880px){.home-found__grid{grid-template-columns:1fr;}}

/* ==========================================================================
   2 · THE BACKLOG STORY (.home-prob) - custom pinned scrub stage. The
   severity table is a dimmed background explainer built from skeleton
   pills; only the severity dots, the status pills, and the blinking red
   frames carry color (Aaron's spec). Driver: home.js "backlog story".
   Unarmed (no JS / reduced motion) the phases flow stacked and the table
   shows fully built and static.
   ========================================================================== */
body.sf-scrub .home-prob{position:relative;min-height:640vh;}
body.sf-scrub .home-prob__sticky{position:sticky;top:0;height:100vh;overflow:hidden;}
body.sf-scrub .home-prob__phase{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;opacity:0;pointer-events:none;isolation:isolate;z-index:2;}
body.sf-scrub .home-prob__phase > .wrap{width:100%;}
body:not(.sf-scrub) .home-prob__phase{padding:var(--space-lg) 0;}
/* the story beats float dead-center in the big statement type; the table
   is the ground behind them */
.home-prob .sfmap__line{max-width:24ch;margin:0 auto;}

/* the table layer: centered lower half of the stage, dimmed - a visual
   aid behind the copy, never the subject */
body.sf-scrub .home-prob__tablewrap{
  position:absolute;left:50%;top:54%;transform:translateX(-50%);
  width:min(1080px,92%);opacity:0;z-index:1;pointer-events:none;
}
body:not(.sf-scrub) .home-prob__tablewrap{width:min(1080px,92%);margin:0 auto var(--space-lg);opacity:0.55;}
/* monochrome, borderless (Aaron round 2): a grey plate, grey pills, and
   slate-shade severity words - the only color left is the blinking red
   frame, which IS the story's point */
.home-prob__table{background:var(--slate-100);border-radius:16px;padding:6px 18px 14px;transform-origin:50% 32%;}
.home-prob__thead,
.home-prob__row{
  display:grid;grid-template-columns:64px 100px 1.6fr 1.3fr 44px 100px 56px 76px 76px;
  gap:14px;align-items:center;min-height:34px;
}
.home-prob__thead{min-height:38px;}
.home-prob__thead span{font-size:11px;font-weight:600;color:color-mix(in srgb,var(--ink) 55%,transparent);white-space:nowrap;overflow:hidden;}
.home-prob__mask{overflow:hidden;max-height:432px;}
.home-prob__row{border-radius:8px;}
/* armed: header + rows arrive on the driver's cue */
body.sf-scrub .home-prob__thead,
body.sf-scrub .home-prob__row{opacity:0;transform:translateY(8px);transition:opacity .4s var(--ease-silk),transform .4s var(--ease-silk);}
body.sf-scrub .home-prob__thead.on,
body.sf-scrub .home-prob__row.on{opacity:1;transform:none;}
/* skeleton pills (the FRR pill vocabulary at table scale) */
.hp-pill{display:inline-block;width:var(--w,64px);height:10px;border-radius:4px;background:#CBD5E1;}   /* slate-300 on the slate-100 plate */
.hp-pill--cvss{--w:30px;}
.hp-pill--status{background:#94A3B8;}   /* slightly darker (slate-400) */
.hp-cve{font-size:12px;font-weight:600;color:color-mix(in srgb,var(--ink) 72%,transparent);white-space:nowrap;display:flex;align-items:center;gap:2px;}
/* severity: slate shades darkening with the word */
.hp-sev{display:inline-flex;align-items:center;justify-content:center;min-width:44px;padding:2px 9px;border-radius:6px;font-size:10px;font-weight:600;line-height:1.4;white-space:nowrap;}
.hp-sev--low{background:#E2E8F0;color:#334155;}
.hp-sev--medium{background:#94A3B8;color:#0F172A;}
.hp-sev--high{background:#475569;color:#fff;}
.hp-sev--critical{background:#0F172A;color:#fff;}
/* the financial-loss rows: a silver sheen sweeps the row - the banknote
   read, not an alarm (Aaron round 3; the red frame retired) */
@keyframes hpShimmer{from{background-position:120% 0;}to{background-position:-60% 0;}}
.home-prob__row.hl-on{
  background:linear-gradient(105deg,#CBD5E1 30%,#F1F5F9 46%,#FFFFFF 50%,#F1F5F9 54%,#CBD5E1 70%);
  background-size:260% 100%;
  animation:hpShimmer 2.4s linear infinite;
}
@media(prefers-reduced-motion:reduce){.home-prob__row.hl-on{animation:none;background:#E2E8F0;}}
@media(max-width:880px){
  .home-prob__thead,.home-prob__row{grid-template-columns:44px 80px 1.4fr 40px 60px;gap:10px;}
  .home-prob__thead span:nth-child(n+6),.home-prob__row span:nth-child(n+6){display:none;}
  .home-prob__thead span:nth-child(4),.home-prob__row span:nth-child(4){display:none;}
}

/* ==========================================================================
   NAV-HOME RESTRUCTURE (2026-07-25). The platform tile crowns the bento
   full-width at 320px (the --wide rules' pattern) with the ev-platform
   glyph and the guilloche seal-stripe as its signature edge.
   ========================================================================== */
.home-bento__card--platform{
  grid-column:1/-1;min-height:320px;position:relative;
}
.hl.hl--icon.home-bento__platlogo,
.hl.hl--icon.home-bento__platlogo.hl-gl{display:block;width:44px;height:44px;margin:0 0 18px;}

/* ---- the founder film: full-viewport bg video, scrim, watch button ---- */
.home-video{position:relative;min-height:100vh;display:flex;align-items:center;overflow:hidden;isolation:isolate;background:var(--slate-950);}
.home-video__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.home-video__scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(2,6,23,0.55),rgba(2,6,23,0.35) 45%,rgba(2,6,23,0.72));}
.home-video__in{position:relative;z-index:2;text-align:center;width:100%;}
.home-video__h{font-family:var(--font-display);font-weight:700;font-size:clamp(38px,5.6vw,84px);line-height:1.06;letter-spacing:-0.03em;color:#fff;margin:0;}
.home-video__p{font-size:clamp(16px,1.6vw,20px);line-height:1.6;color:#fff;max-width:52ch;margin:var(--space-sm) auto 0;}
.home-video__watch{
  display:inline-flex;align-items:center;gap:14px;
  margin-top:var(--space-md);
  font-family:var(--font-body);font-weight:600;font-size:clamp(18px,1.8vw,23px);
  background:#fff;color:var(--slate-900);
  border:0;border-radius:var(--radius-pill);cursor:pointer;
  padding:22px 44px;
  transition:background var(--dur) ease;
}
.home-video__watch:hover{background:var(--slate-100);}
.home-video__play{font-size:0.8em;line-height:1;}
.home-video__lightbox{position:fixed;inset:0;z-index:1300;background:rgba(2,6,23,0.92);display:flex;align-items:center;justify-content:center;padding:4vmin;}
.home-video__lightbox[hidden]{display:none;}
.home-video__player{width:min(1400px,100%);max-height:92vh;border-radius:12px;background:#000;}
.home-video__close{position:absolute;top:18px;right:22px;font-size:40px;line-height:1;background:none;border:0;color:#fff;cursor:pointer;padding:8px;}
@media(prefers-reduced-motion:reduce){.home-video__bg{display:none;}}
/* EV-VIDEO-LIGHTBOX */
.home-video__lightbox{background:#000;z-index:100001;}
.home-video:has(.home-video__lightbox:not([hidden])){isolation:auto;}
@media(hover:hover){
.home-video__lightbox .home-video__close{opacity:0;transition:opacity .25s ease;}
.home-video__lightbox:hover .home-video__close,
.home-video__lightbox .home-video__close:focus-visible{opacity:1;}
}
/* EV-HOME-HERO */
.home-hero{position:relative;isolation:isolate;background:#EEF2F6;}
.home-hero__bg{position:absolute;left:0;right:0;top:calc(-1 * var(--ev-nav-h,96px));width:100%;height:calc(100% + var(--ev-nav-h,96px));object-fit:cover;z-index:1;}
.home-hero__scrim{position:absolute;left:0;right:0;top:calc(-1 * var(--ev-nav-h,96px));height:calc(100% + var(--ev-nav-h,96px));z-index:2;background:linear-gradient(90deg,rgba(2,6,23,0.80),rgba(2,6,23,0.46) 46%,rgba(2,6,23,0.04) 76%);}
.home-hero__in{position:relative;z-index:3;}
#site-nav[data-over="home-hero"] .nav__login,#site-nav[data-over="home-hero"] .nav__login:hover{color:#020617;}
.home-hero .home-hero__h,.home-hero .home-hero__lead,.home-hero .home-hero__lead strong,
.home-hero .home-link{color:#fff;}
@media(prefers-reduced-motion:reduce){.home-hero__bg{display:none;}}
/* EV-HERO-TREATMENT */
:root{
--ev-hero-tint:0;              /* 0 = no wash, the video plays clean */
--ev-hero-tint-c:255,255,255;  /* if the wash ever returns it is white, not ink */
--ev-hero-shadow-a:0;           /* glow OFF; the stroke below does the separation */
--ev-hero-shadow-blur:0px;
--ev-hero-shadow-c:255,255,255;
--ev-hero-stroke:4px;           /* white outline under the fill (paint-order) does the lift */
--ev-hero-stroke-a:0.4;
--ev-hero-scale:0.85;
--ev-hero-y:clamp(-80px,calc((100vh - 602px) / 2),220px);
--ev-hero-w:770px;
--ev-hero-lead:52.9ch;         /* 44ch scaled by 770/640, or widening only rewraps the h1 */
--ev-hero-wcap:56vw;           /* Aaron's vw companion to the px cap */
--ev-hero-panel-blur:0px;
--ev-hero-panel-a:0;
--ev-hero-panel-pad:0px;
--ev-hero-panel-feather:76px;
--ev-hero-panel-r:108px;
}
.home-hero__scrim{opacity:var(--ev-hero-tint);}
.home-hero__scrim{position:absolute;left:0;right:0;top:calc(-1 * var(--ev-nav-h,96px));height:calc(100% + var(--ev-nav-h,96px));z-index:2;background:linear-gradient(90deg,rgba(var(--ev-hero-tint-c),0.80),rgba(var(--ev-hero-tint-c),0.46) 46%,rgba(var(--ev-hero-tint-c),0.04) 76%);}
.home-hero .home-hero__h,.home-hero .home-hero__lead,.home-hero .home-hero__lead strong,
.home-hero .home-hero__copy .home-link{
text-shadow:0 2px var(--ev-hero-shadow-blur) rgba(var(--ev-hero-shadow-c),var(--ev-hero-shadow-a));
-webkit-text-stroke:var(--ev-hero-stroke,0px) rgba(var(--ev-hero-shadow-c),var(--ev-hero-stroke-a,1));
paint-order:stroke fill;
}
html[data-ev-hero-ink] .home-hero .home-hero__h,
html[data-ev-hero-ink] .home-hero .home-hero__lead,
html[data-ev-hero-ink] .home-hero .home-hero__lead strong,
html[data-ev-hero-ink] .home-hero .home-hero__copy .home-link{color:var(--slate-950,#020617);}
html[data-ev-hero-ink] .nav[data-over="home-hero"]{--nav-ink:var(--slate-950);--nav-logo:var(--slate-950);--nav-soft:var(--fill-2);--nav-btn-bg:var(--slate-950);--nav-btn-ink:#fff;--nav-btn-bg-hover:var(--slate-800);}
.home-hero__copy{scale:var(--ev-hero-scale);transform-origin:left top;}
.home-hero__in{translate:0 var(--ev-hero-y);}
.home-hero__copy{max-width:min(var(--ev-hero-w),var(--ev-hero-wcap));}
.home-hero__lead{max-width:var(--ev-hero-lead);}
.home-hero__copy{position:relative;}
.home-hero__copy::before{
content:"";position:absolute;z-index:-1;pointer-events:none;
inset:calc(-1 * var(--ev-hero-panel-pad));
border-radius:var(--ev-hero-panel-r);
background:rgba(255,255,255,var(--ev-hero-panel-a));
-webkit-backdrop-filter:blur(var(--ev-hero-panel-blur));
backdrop-filter:blur(var(--ev-hero-panel-blur));
-webkit-mask:linear-gradient(to right,transparent 0,#000 var(--ev-hero-panel-feather),#000 calc(100% - var(--ev-hero-panel-feather)),transparent 100%),linear-gradient(to bottom,transparent 0,#000 var(--ev-hero-panel-feather),#000 calc(100% - var(--ev-hero-panel-feather)),transparent 100%);
mask:linear-gradient(to right,transparent 0,#000 var(--ev-hero-panel-feather),#000 calc(100% - var(--ev-hero-panel-feather)),transparent 100%),linear-gradient(to bottom,transparent 0,#000 var(--ev-hero-panel-feather),#000 calc(100% - var(--ev-hero-panel-feather)),transparent 100%);
-webkit-mask-composite:source-in;mask-composite:intersect;
}