/* SafeIdea AI Legal — site system v6.0
   Monochrome. No hue anywhere: the only contrast tools are black, grey, white, hairlines and photography.
   Editorial serif display, sans body, mono for machine artifacts. No gradients except photographic scrims. */

:root{
  --canvas:#ffffff; --canvas-warm:#f4f4f3; --featured:#ebebea;
  --hairline:#e2e2e0; --hairline-soft:#efefee;
  --scrim:#0e0e0e; --footer:#070707;
  --ink:#0d0d0d; --ink-soft:#2a2a2a; --graphite:#4a4a4a; --slate:#6e6e6e;
  --stone:#949494; --mute:#a6a6a6; --ash:#c6c6c6;
  --on-primary:#ffffff;
  /* monochrome: "accent" is simply ink, kept as a token so emphasis stays consistent */
  --accent:#0d0d0d; --accent-deep:#000000; --accent-wash:#f1f1f0; --accent-line:#c4c4c2;
  --xxs:4px; --xs:8px; --sm:12px; --md:16px; --lg:24px; --xl:32px; --xxl:48px;
  --section:72px; --section-lg:120px;
  --r-none:0; --r-xs:3px; --r-sm:6px; --r-md:8px; --r-lg:16px; --r-full:9999px;
  --container:1280px; --reading:720px;
  --display:'Newsreader',Georgia,'Times New Roman',serif;
  --sans:'IBM Plex Sans',-apple-system,BlinkMacSystemFont,'Helvetica Neue',Arial,sans-serif;
  --mono:'JetBrains Mono','IBM Plex Mono',ui-monospace,Menlo,monospace;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}
:target{scroll-margin-top:88px}
body{font-family:var(--sans);background:var(--canvas);color:var(--ink);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5}
a{color:var(--ink);text-decoration-color:var(--stone);text-underline-offset:3px}
a:hover{color:#000;text-decoration-color:var(--ink)}
img,svg{max-width:100%}
h1,h2,h3,h4{font-family:var(--display);font-weight:400}

/* ---- type tokens ---- */
.t-display{font-family:var(--display);font-size:48px;font-weight:400;line-height:1.06;letter-spacing:-0.6px}
.t-heading-sm{font-family:var(--display);font-size:26px;font-weight:400;line-height:1.2;letter-spacing:-0.3px}
.t-subtitle{font-size:20px;font-weight:400;line-height:1.45;letter-spacing:-0.2px}
.t-body{font-size:16px;line-height:1.6;color:var(--graphite)}
.t-eyebrow{font-family:var(--sans);font-size:12px;font-weight:600;line-height:1.4;letter-spacing:1.3px;text-transform:uppercase;color:var(--slate);margin:0}
.t-meta{font-size:13px;line-height:1.45;letter-spacing:-0.1px;color:var(--stone)}
.t-micro-caps{font-size:11px;font-weight:600;line-height:1.3;letter-spacing:1.1px;text-transform:uppercase}
.t-mono-label{font:600 11px/1.3 var(--mono);letter-spacing:0.08em;text-transform:uppercase}
.tw{color:var(--stone)}

/* ---- layout ---- */
.container{max-width:var(--container);margin:0 auto;padding-left:var(--xxl);padding-right:var(--xxl)}
.reading{max-width:var(--reading)}
.reading-wide{max-width:920px}
.section{padding:var(--section-lg) 0;border-top:1px solid var(--hairline)}
.section-tight{padding:var(--section) 0;border-top:1px solid var(--hairline)}
.section-flush{border-top:none}
.section-center{text-align:center}
.band{border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.band-row{display:flex;align-items:baseline;gap:var(--xl);padding-top:var(--lg);padding-bottom:var(--lg);flex-wrap:wrap}

/* ---- buttons: exactly one primary per page ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 26px;border-radius:var(--r-full);font:600 14px/1.43 var(--sans);letter-spacing:.01em;text-decoration:none;border:1px solid transparent;cursor:pointer;white-space:nowrap;transition:background .15s ease,color .15s ease,border-color .15s ease}
.btn-primary{background:var(--accent);color:#fff}
.btn-outline{background:transparent;color:var(--ink);border:1px solid var(--ink)}
.btn-outline:hover{background:var(--ink);color:#fff}
.btn-primary:hover{background:var(--accent-deep);color:#fff}
.btn-primary-on-dark{background:var(--on-primary);color:var(--ink)}
.btn-primary-on-dark:hover{background:#fff;color:var(--accent)}
.btn-text{background:transparent;color:var(--ink);padding:0 0 3px;height:auto;border-radius:0;border-bottom:1px solid var(--hairline);font:600 14px/1.43 var(--sans);text-decoration:none}
.btn-text:hover{color:var(--accent);border-color:var(--accent-line)}
.btn-text-on-dark{background:transparent;color:var(--on-primary);padding:0 0 3px;height:auto;border-radius:0;border-bottom:1px solid rgba(250,249,247,.35);font:600 14px/1.43 var(--sans);text-decoration:none}
.btn-text-on-dark:hover{color:#fff;border-color:#fff}

/* ---- brand lockup: Combination B mark + two-tier name ---- */
.brand{display:inline-flex;align-items:center;gap:11px;text-decoration:none}
.brand svg{display:block;flex:none;overflow:visible;color:var(--ink)}
.brand .bt{display:flex;flex-direction:column;gap:2px}
.brand .b1{font-family:var(--sans);font-weight:600;font-size:19px;letter-spacing:-0.5px;line-height:1;color:var(--ink)}
.brand .b1 .si{font-family:var(--display);font-weight:500}
.brand .b2{font:600 8.5px/1 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--slate)}
.brand:hover .b1,.brand:hover svg{color:var(--ink)}
footer.footer .brand svg,footer.footer .brand .b1{color:var(--on-primary)}
footer.footer .brand .b2{color:var(--stone)}
.mobile-nav .brand{margin-bottom:var(--lg)}
@media (max-width:768px){.brand .b1{font-size:17px}.brand .b2{font-size:8px;letter-spacing:.18em}}

/* ---- nav ---- */
.nav{background:var(--canvas);height:84px;display:flex;align-items:center;position:sticky;top:0;z-index:50;border-bottom:1px solid var(--hairline);transition:background .25s ease,border-color .25s ease}
/* transparent over a photographic hero, solid once you scroll past it */
.nav-over{background:transparent;border-bottom-color:transparent}
/* light variant: ink chrome over a pale sky */
.nav-over.nav-light .brand svg,.nav-over.nav-light .brand .b1{color:var(--ink)}
.nav-over.nav-light .brand .b2{color:var(--slate)}
.nav-over.nav-light .nav-link{color:var(--ink-soft)}
.nav-over.nav-light .nav-link:hover{color:var(--ink);border-color:var(--ink)}
.nav-over.nav-light .btn-primary{background:var(--ink);color:#fff}
.nav-over.nav-light .nav-burger{color:var(--ink);border-color:rgba(13,13,13,.24)}
.nav-over .brand svg,.nav-over .brand .b1{color:#fff}
.nav-over .brand .b2{color:rgba(255,255,255,.62)}
.nav-over .nav-link{color:rgba(255,255,255,.82)}
.nav-over .nav-link:hover{color:#fff;border-color:#fff}
.nav-over .btn-primary{background:#fff;color:var(--ink)}
.nav-over .btn-primary:hover{background:#fff;color:#000}
.nav-over .nav-burger{color:#fff;border-color:rgba(255,255,255,.4)}
.nav-over .nav-burger:hover{background:rgba(255,255,255,.12)}
.nav-over.is-stuck{background:var(--canvas);border-bottom-color:var(--hairline)}
.nav-over.is-stuck .brand svg,.nav-over.is-stuck .brand .b1{color:var(--ink)}
.nav-over.is-stuck .brand .b2{color:var(--slate)}
.nav-over.is-stuck .nav-link{color:var(--ink-soft)}
.nav-over.is-stuck .nav-link:hover{color:var(--ink);border-color:var(--ink)}
.nav-over.is-stuck .btn-primary{background:var(--accent);color:#fff}
.nav-over.is-stuck .nav-burger{color:var(--ink);border-color:var(--hairline)}
.nav-inner{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;width:100%}
.wordmark{font-family:var(--sans);font-size:20px;font-weight:600;letter-spacing:-0.5px;color:var(--ink);text-decoration:none}
.wordmark .pd{color:var(--slate);font-weight:400}
.nav-menu{display:flex;gap:var(--xl);justify-content:center}
.nav-link{color:var(--ink-soft);text-decoration:none;font:500 14px/1.43 var(--sans);padding:8px 0;border-bottom:1px solid transparent}
.nav-link:hover{color:var(--ink);border-color:var(--ink)}
.nav-link[aria-current="page"]{color:var(--ink);border-color:var(--ink)}
.nav-right{display:flex;align-items:center;justify-content:flex-end;gap:var(--md)}
.nav-burger{display:none;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--r-sm);background:transparent;border:1px solid var(--hairline);color:var(--ink);padding:0;cursor:pointer}
.nav-burger:hover{background:var(--canvas-warm)}
.nav-burger .bars{display:block;width:18px;height:12px;position:relative}
.nav-burger .bars::before,.nav-burger .bars::after,.nav-burger .bars span{content:"";position:absolute;left:0;right:0;height:1.5px;background:currentColor;transition:transform .22s ease,opacity .15s ease,top .22s ease}
.nav-burger .bars::before{top:0}
.nav-burger .bars span{top:50%;transform:translateY(-50%);display:block}
.nav-burger .bars::after{top:calc(100% - 1.5px)}
.nav-burger[aria-expanded="true"] .bars::before{top:50%;transform:translateY(-50%) rotate(45deg)}
.nav-burger[aria-expanded="true"] .bars span{opacity:0}
.nav-burger[aria-expanded="true"] .bars::after{top:50%;transform:translateY(-50%) rotate(-45deg)}
.mobile-nav{position:fixed;top:68px;left:0;right:0;bottom:0;z-index:49;background:var(--canvas);border-top:1px solid var(--hairline);padding:var(--lg) 24px var(--xxl);display:none;flex-direction:column;overflow-y:auto}
.mobile-nav.is-open{display:flex}
.mobile-nav .m-link{display:flex;align-items:center;justify-content:space-between;padding:var(--lg) 0;border-bottom:1px solid var(--hairline);text-decoration:none;color:var(--ink);font-family:var(--display);font-size:24px;font-weight:400;letter-spacing:-0.3px}
.mobile-nav .m-link:first-child{border-top:1px solid var(--hairline)}
.mobile-nav .m-link .chev{color:var(--slate);font-size:16px}
.mobile-nav .m-cta{margin-top:var(--xl);display:flex}
.mobile-nav .m-cta .btn{width:100%;height:52px}
body.menu-open{overflow:hidden}

/* ---- hero: type-led, the claim is the hero ---- */
.hero{padding:var(--section-lg) 0 var(--section)}
.hero .eyebrow{margin-bottom:var(--lg);font:600 12px/1.4 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--slate);max-width:none}
.hero h1{font-size:clamp(31px,3.6vw,50px);line-height:1.1;letter-spacing:-0.7px;margin:0 0 var(--xl);color:var(--ink);max-width:34ch;text-wrap:pretty}
.hero h1 em{font-style:italic;color:var(--accent)}
.hero .actions{display:flex;gap:var(--xl);align-items:center;flex-wrap:wrap;margin-top:var(--xl)}

/* ---- photographic hero: colour photograph, ink type on the sky, boat kept clear ---- */
/* vertical anchor 45%: keeps the horizon ~58% down the hero at any window height (100% = bottom-anchored, boat rode the top on tall windows) */
.hero-photo{position:relative;margin-top:-84px;min-height:min(88vh,860px);display:flex;align-items:flex-end;padding:calc(84px + var(--section)) 0 var(--section-lg);overflow:hidden;background:#c9d3dc}
.hero-photo .hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%;display:block}
/* ---- What-SAIL-is mini wheel ---- */
.wheel-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:var(--section);align-items:center;margin-bottom:var(--section)}
.wheel-copy .lead{margin-bottom:var(--lg)}
.wheel-copy .lead{font-size:19px;line-height:1.55;letter-spacing:-0.15px;color:var(--graphite)}
.wheel-viz{margin:0}
.wheel-viz svg{width:100%;height:auto;display:block;overflow:visible}
.mw-nd{font:500 11.5px var(--sans);fill:var(--ink);text-anchor:middle}
.mw-sub{font:400 9px var(--sans);fill:var(--slate);text-anchor:middle}
.mw-mono{font:600 9.5px var(--mono);letter-spacing:.18em;fill:var(--slate);text-anchor:middle}
.mw-spk{stroke:#a6a6a6;stroke-width:1.2}
.mw-pu{fill:none;stroke:#0d0d0d;animation:mwPul 8s ease-in-out infinite}
.mw-p2{animation-delay:4s}
@keyframes mwPul{0%{r:172px;stroke-opacity:0}15%{stroke-opacity:.18}70%{r:62px;stroke-opacity:.05}100%{r:58px;stroke-opacity:0}}
.mw-fd{fill:var(--ink);opacity:0;animation:mwFl 6.5s ease-in-out infinite 2s}
@keyframes mwFl{0%{opacity:0;transform:translate(0,0)}14%{opacity:.85}86%{opacity:.85}100%{opacity:0;transform:translate(108px,0)}}
@media (prefers-reduced-motion:reduce){.wheel-viz *{animation:none!important}}
@media (max-width:880px){.wheel-grid{grid-template-columns:1fr;gap:var(--xl)}}
/* ---- Introducing SAIL: featured payoff section ---- */
.sail-intro{position:relative;overflow:hidden;border-top:2px solid var(--ink);background:linear-gradient(178deg,#edecea 0%,#f6f6f4 44%,#ffffff 100%)}
.sail-intro::after{content:"SAIL";position:absolute;top:-0.09em;right:2.5vw;font:italic 500 clamp(130px,17vw,250px)/1 var(--display);letter-spacing:-0.045em;color:rgba(13,13,13,.055);pointer-events:none;user-select:none;z-index:0}
.sail-intro .container{position:relative;z-index:1}
.sail-intro .intro-head{margin-bottom:var(--xxl)}
.sail-intro .intro-head .eyebrow{color:var(--ink);margin:0 0 var(--lg);display:flex;align-items:center;gap:var(--md)}
.sail-intro .intro-head .eyebrow::before{content:"";width:36px;height:1px;background:var(--ink)}
.sail-intro .intro-head h2{font-size:clamp(38px,4.8vw,62px);line-height:1.05;letter-spacing:-1.2px;margin:0;max-width:24ch;color:var(--ink);text-wrap:pretty}
.sail-intro .intro-head h2 em{font-style:italic}
.sail-intro .wheel-copy .lead{font-size:19px;line-height:1.6;margin-bottom:var(--md)}
.payoff-list{list-style:none;margin:0 0 var(--lg);padding:0 0 var(--lg);border-bottom:1px solid var(--ink);display:grid;gap:10px}
.payoff-list li{position:relative;padding-left:26px;font:500 16.5px/1.45 var(--sans);color:var(--ink);letter-spacing:-0.1px}
.payoff-list li::before{content:"";position:absolute;left:2px;top:.52em;width:12px;height:1.5px;background:var(--ink)}
@media (max-width:880px){.sail-intro::after{font-size:110px;right:0}}
.closing .close-steps{position:relative;z-index:2;font:600 11px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.78);margin:var(--lg) 0 0}
/* rule of thirds: push the boat off centre and onto the right third line */
@media (min-width:901px){.hero-photo .hero-img{transform:translateX(4.5%) scale(1.12)}}
.hero-photo .hero-scrim{position:absolute;inset:0;background:radial-gradient(152% 104% at -12% 110%,rgba(255,255,255,.92) 0%,rgba(255,255,255,.76) 40%,rgba(255,255,255,.42) 64%,rgba(255,255,255,0) 88%),linear-gradient(94deg,rgba(255,255,255,.92) 0%,rgba(255,255,255,.84) 26%,rgba(255,255,255,.52) 48%,rgba(255,255,255,.1) 68%,rgba(255,255,255,0) 80%)}
.hero-photo .hero-body{position:relative;z-index:2;width:100%}
.hero-photo .eyebrow{color:var(--slate);font:600 12px/1.4 var(--sans);letter-spacing:.2em;text-transform:uppercase;max-width:none;margin-bottom:var(--xl)}
.hero-photo h1{color:var(--ink);font-size:clamp(36px,4.2vw,56px);line-height:1.06;letter-spacing:-1.1px;max-width:21ch;margin:0 0 var(--lg)}
.hero-photo .hero-sub{font-family:var(--display);font-weight:400;font-size:clamp(19px,2.1vw,28px);line-height:1.3;letter-spacing:-0.3px;color:var(--ink-soft);max-width:34ch;margin:0 0 var(--xxl)}
.hero-photo .actions{margin-top:var(--xl);gap:var(--xl)}
.hero-photo .triad{border-top-color:var(--ink);border-bottom:none;width:fit-content;max-width:100%;grid-template-columns:repeat(3,max-content)}
.hero-photo .triad div{color:var(--ink);font-family:var(--display);font-size:clamp(15px,1.45vw,20px);padding-top:var(--md);padding-bottom:0;padding-right:var(--xl);white-space:nowrap}
.hero-photo .triad div+div{padding-left:var(--xl)}
.hero-photo .triad div+div{border-left-color:rgba(13,13,13,.24)}
.hero-credit{position:absolute;right:var(--xxl);bottom:var(--md);z-index:2;font:400 10.5px/1 var(--mono);letter-spacing:.06em;color:rgba(255,255,255,.8);text-shadow:0 1px 6px rgba(0,0,0,.5);margin:0}
/* the third locked line, set as a triad */
.triad{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--ink);border-bottom:1px solid var(--hairline);max-width:760px}
.triad div{padding:var(--md) var(--lg) var(--md) 0;font-size:19px;letter-spacing:-0.2px;color:var(--ink)}
.triad div+div{border-left:1px solid var(--hairline);padding-left:var(--lg)}

/* ---- lockup ---- */
.lockup .eyebrow{margin:0 0 var(--md)}
.lockup h2{font-size:clamp(32px,3.6vw,44px);line-height:1.1;letter-spacing:-0.6px;margin:0 0 var(--lg);color:var(--ink);max-width:24ch;text-wrap:pretty}
.lockup .lead{font-size:19px;line-height:1.55;letter-spacing:-0.15px;color:var(--graphite);max-width:62ch;margin:0 0 var(--md)}
.lockup .lead:last-child{margin-bottom:0}
.section-center .lockup h2,.section-center .lockup .lead{margin-left:auto;margin-right:auto}

/* ---- prose ---- */
.prose p{color:var(--graphite);font-size:18px;line-height:1.6;margin:0 0 var(--md);max-width:64ch}
.prose p.outro{color:var(--ink);font-size:21px;font-family:var(--display);line-height:1.35;margin-top:var(--xl);letter-spacing:-0.2px;max-width:52ch}
.prose .foot{margin-top:var(--xl)}

/* ---- compounding sequence (numbered, hairline-divided, not parallel cards) ---- */
.stack{margin-top:var(--xl);border-top:1px solid var(--ink)}
.stack-row{display:grid;grid-template-columns:64px 1fr 1.15fr;gap:var(--xl);padding:var(--xl) 0;border-bottom:1px solid var(--hairline);align-items:start}
.stack-row:last-child{border-bottom:none}
.stack-row .n{font:600 12px/1.3 var(--mono);letter-spacing:.1em;color:var(--slate);padding-top:6px}
.stack-row h3{font-size:23px;line-height:1.25;letter-spacing:-0.35px;margin:0;color:var(--ink);max-width:22ch}
.stack-row p{margin:0;font-size:16px;line-height:1.6;color:var(--graphite)}
.stack-row p+p{margin-top:var(--sm)}

/* ---- capability verbs (genuinely parallel, so a grid is honest) ---- */
.verbs{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--ink);margin-top:var(--xl)}
.verb{padding:var(--lg) var(--lg) var(--lg) 0;border-right:1px solid var(--hairline)}
.verb:nth-child(n+2){padding-left:var(--lg)}
.verb:last-child{border-right:none}
.verb h4{font-size:22px;letter-spacing:-0.3px;margin:0 0 var(--xs);color:var(--ink)}
.verb p{margin:0;font-size:15px;line-height:1.55;color:var(--graphite)}

/* ---- the boundary diagram: in-boundary in ink, the crossing in accent ---- */
.boundary{display:grid;grid-template-columns:1fr 200px 1fr;gap:0;align-items:stretch;margin-top:var(--xl)}
.bx{border:1px solid var(--ink);padding:var(--lg);background:var(--canvas);display:flex;flex-direction:column;gap:var(--md)}
.bx-out{border-color:var(--hairline);border-style:dashed;background:transparent}
.bx-label{font:600 11px/1.3 var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--ink);margin:0;padding-bottom:var(--sm);border-bottom:1px solid var(--hairline)}
.bx-out .bx-label{color:var(--slate)}
.bx-items{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--sm)}
.bx-items li{font-size:15px;line-height:1.4;color:var(--ink-soft);display:flex;justify-content:space-between;gap:var(--md);align-items:baseline;padding-bottom:var(--sm);border-bottom:1px solid var(--hairline-soft)}
.bx-items li:last-child{border-bottom:none;padding-bottom:0}
.bx-items .pin{font:600 10px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--slate);white-space:nowrap}
.bx-items .pin-stay{color:var(--ink);border:1px solid var(--ink);padding:3px 6px}
.bx-cross{display:flex;flex-direction:column;justify-content:center;gap:var(--md);padding:0 var(--lg);text-align:center}
.cross{display:flex;flex-direction:column;gap:var(--xxs);align-items:center}
.cross .arrow{display:block;width:100%;height:1px;background:var(--accent);position:relative}
.cross .arrow::after{content:"";position:absolute;right:0;top:-3px;border-left:7px solid var(--accent);border-top:3.5px solid transparent;border-bottom:3.5px solid transparent}
.cross.rev .arrow::after{right:auto;left:0;border-left:none;border-right:7px solid var(--accent)}
.cross span{font:600 10px/1.35 var(--mono);letter-spacing:.07em;text-transform:uppercase;color:var(--accent)}
.bx-cross .note{font-size:12px;line-height:1.4;color:var(--slate);margin:0;padding-top:var(--md);border-top:1px solid var(--hairline)}

/* ---- five-stage masking flow; the crossing stage carries the accent ---- */
.flow{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--ink);margin-top:var(--xl)}
.flow-step{padding:var(--lg) var(--md) var(--lg) 0;border-right:1px solid var(--hairline)}
.flow-step:nth-child(n+2){padding-left:var(--md)}
.flow-step:last-child{border-right:none}
.flow-step .n{font:700 11px/1.3 var(--mono);letter-spacing:.1em;color:var(--slate);margin:0 0 var(--sm)}
.flow-step h4{font-size:17px;font-family:var(--sans);font-weight:600;letter-spacing:-0.2px;line-height:1.3;margin:0 0 var(--xs);color:var(--ink)}
.flow-step p{margin:0;font-size:14px;line-height:1.55;color:var(--graphite)}
.flow-step.is-crossing{background:var(--accent-wash)}
.flow-step.is-crossing .n{color:var(--accent)}
.token{font:600 12px/1.3 var(--mono);letter-spacing:.02em;color:var(--accent);background:#fff;border:1px solid var(--accent-line);padding:2px 5px;white-space:nowrap}
/* three-stage variant of the same flow (matter lifecycle) */
.flow-3{grid-template-columns:repeat(3,1fr)}
/* the perimeter furniture: one gate, the dictionary tethered inside, the receipt mark */
.gate{background:var(--ink);color:#fff;font:700 10px/1.35 var(--mono);letter-spacing:.1em;text-transform:uppercase;padding:8px 10px;text-align:center}
.gate span{display:block;font-weight:400;letter-spacing:.06em;color:rgba(255,255,255,.72);margin-top:3px}
.rmark{font:600 9.5px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink);border:1px solid var(--ink);padding:3px 6px;align-self:center}
.bx-items li.tether{position:relative}
.bx-items li.tether::after{content:"";position:absolute;left:calc(-1 * var(--lg));top:11px;width:var(--lg);height:1px;background:var(--ink)}
.bx-out .bx-items li{color:var(--slate)}
/* hairline property list: bold lead phrase, running text */
.plist{list-style:none;margin:var(--xl) 0 0;padding:0;border-top:1px solid var(--ink)}
.plist li{padding:var(--lg) 0;border-bottom:1px solid var(--hairline);font-size:16.5px;line-height:1.6;color:var(--graphite);max-width:76ch}
.plist li b{color:var(--ink);font-weight:600}
.warm .plist li{border-bottom-color:rgba(13,13,13,.1)}
.after-list{margin:var(--xl) 0 0;font-size:16.5px;line-height:1.6;color:var(--graphite);max-width:66ch}
/* token demonstration */
.tokdemo{margin-top:var(--xxl);display:flex;flex-direction:column;gap:var(--md);max-width:820px}
.tokrow{border:1px solid var(--hairline);background:#fff}
.tokrow .tk{font:600 10px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--slate);margin:0;padding:var(--sm) var(--md);border-bottom:1px solid var(--hairline)}
.tokrow .tv{font:400 13px/1.7 var(--mono);color:var(--ink);margin:0;padding:var(--md);overflow-x:auto;white-space:nowrap}
/* two contrasted frames, divided by a rule (never cards) */
.frames{display:grid;grid-template-columns:1fr 1fr;gap:var(--xxl);margin-top:var(--xl);border-top:1px solid var(--ink);padding-top:var(--xl)}
.frames>div+div{border-left:1px solid var(--ink);padding-left:var(--xxl)}
.frames h3{font-family:var(--display);font-weight:400;font-size:26px;line-height:1.2;letter-spacing:-0.4px;margin:0 0 var(--md);color:var(--ink)}
.frames p{font-size:16.5px;line-height:1.65;color:var(--graphite);margin:0 0 var(--md)}
.frames p:last-child{margin-bottom:0}
.warm{background:var(--canvas-warm)}
.closeband .cb-alt{font-size:13.5px;color:var(--stone);margin:var(--xs) 0 0}
.closeband .cb-alt a{color:var(--ash)}

/* ---- ownership table: first-class, styled, not apologised for ---- */
.otable{width:100%;border-collapse:collapse;margin-top:var(--xl);text-align:left}
.otable caption{text-align:left;font:600 11px/1.3 var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--slate);padding-bottom:var(--md)}
.otable th{font:600 11px/1.3 var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--slate);font-weight:600;padding:0 var(--lg) var(--sm) 0;border-bottom:1px solid var(--ink)}
.otable td{padding:var(--md) var(--lg) var(--md) 0;border-bottom:1px solid var(--hairline);font-size:16px;line-height:1.5;color:var(--ink-soft);vertical-align:top}
.otable td:first-child{color:var(--ink);width:38%}
.otable td .sub{display:block;font-size:14px;color:var(--slate);margin-top:3px}
.otable tr:last-child td{border-bottom:1px solid var(--ink)}

/* ---- compliance receipt artifact ---- */
.receipt{border:1px solid var(--ink);background:#fff;font-family:var(--mono);font-size:12px;line-height:1.6}
.receipt .r-head{display:flex;justify-content:space-between;align-items:baseline;gap:var(--md);padding:var(--md) var(--lg);border-bottom:1px solid var(--ink);font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:10.5px;color:var(--ink)}
.receipt .r-body{padding:var(--md) var(--lg)}
.receipt .r-row{display:grid;grid-template-columns:132px 1fr;gap:var(--md);padding:5px 0;border-bottom:1px dotted var(--hairline)}
.receipt .r-row:last-child{border-bottom:none}
.receipt .r-k{color:var(--slate);text-transform:uppercase;letter-spacing:.05em;font-size:10.5px;padding-top:1px}
.receipt .r-v{color:var(--ink);word-break:break-all}
.receipt .r-v .acc{color:var(--accent)}
.receipt .r-stamp{display:flex;flex-wrap:wrap;gap:var(--xs);padding:var(--md) var(--lg);border-top:1px solid var(--hairline);background:var(--canvas-warm)}
.receipt .r-stamp span{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);border:1px solid var(--ink);padding:3px 7px}

/* ---- stat callout: one on the site, source line beneath ----
   Centred, not baseline-aligned. Baseline sat the numeral's foot on the first
   line of the sentence, which reads as centred only while the right column is
   one line. It is three, plus a four-line source note, so the number was
   pinned to the top of a much taller block. */
.stat{display:grid;grid-template-columns:auto 1fr;gap:var(--xl);align-items:center;border-top:1px solid var(--ink);border-bottom:1px solid var(--hairline);padding:var(--xl) 0;margin-top:var(--xl)}
.stat .big{font-family:var(--display);font-size:clamp(64px,8vw,104px);line-height:.92;letter-spacing:-2.5px;color:var(--ink);margin:0}
.stat .say{font-size:20px;line-height:1.45;letter-spacing:-0.2px;color:var(--ink);margin:0;max-width:44ch}
.stat .src{font-size:13px;line-height:1.5;color:var(--slate);margin:var(--md) 0 0;max-width:52ch}
.stat .src em{font-style:italic}

/* ---- deployment options: exactly two, never three ---- */
.deploy{display:grid;grid-template-columns:1fr 1fr;gap:var(--lg);margin-top:var(--xl)}
.card{border:1px solid var(--hairline);background:var(--canvas);padding:var(--lg)}
.card-warm{border:1px solid var(--hairline);background:var(--canvas-warm);padding:var(--xl)}
.card-strong{border:1px solid var(--ink);background:var(--canvas);padding:var(--xl)}
.card .label{color:var(--slate);margin:0 0 var(--xs)}
.card .title{font-family:var(--display);font-size:24px;font-weight:400;letter-spacing:-0.3px;color:var(--ink);margin:0 0 var(--sm)}
.card p{font-size:15.5px;line-height:1.6;color:var(--graphite);margin:0 0 var(--sm)}
.card p:last-child{margin-bottom:0}
.card ul{margin:var(--md) 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:var(--xs)}
.card ul li{font-size:14.5px;line-height:1.5;color:var(--ink-soft);padding-left:var(--md);position:relative}
.card ul li::before{content:"";position:absolute;left:0;top:9px;width:6px;height:1px;background:var(--ink)}

/* ---- two column ---- */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:var(--section);align-items:start}
.two-col.wide-right{grid-template-columns:1fr 1.25fr}
.col-eyebrow{font-family:var(--sans);font-size:17px;font-weight:600;letter-spacing:-0.15px;color:var(--ink);line-height:1.35;padding-bottom:var(--md);border-bottom:1px solid var(--hairline);margin:0 0 var(--md)}
.col-text p{color:var(--graphite);font-size:16.5px;line-height:1.6;margin:0 0 var(--md)}
.col-text p:last-child{margin-bottom:0}
.col-text p.kicker{color:var(--ink);font-family:var(--display);font-size:20px;letter-spacing:-0.2px;line-height:1.4;margin-top:var(--lg)}

/* ---- media wells — real product stills drop in later ---- */
.well{border:1px solid var(--hairline);background:var(--canvas-warm);position:relative;overflow:hidden}
.well image-slot{display:block;width:100%;height:100%}
.well-4x3{aspect-ratio:4/3}
.well-16x10{aspect-ratio:16/10}
.well-cap{font-size:12.5px;line-height:1.45;color:var(--stone);margin:var(--sm) 0 0}

/* ---- works-with strip ---- */
.works-with{margin-top:var(--xl);border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);padding:var(--xl) 0}
.logo-strip{display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:var(--lg) var(--xxl);margin:0 auto;max-width:1000px}
.logo-strip .name{font-family:var(--display);font-size:30px;font-weight:400;letter-spacing:-0.5px;color:var(--ink);line-height:1}

/* ---- people strip ---- */
.people{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--lg);margin-top:var(--xl)}
.person{display:flex;flex-direction:column;gap:var(--sm)}
.person .face{aspect-ratio:1;background:var(--canvas-warm);border:1px solid var(--hairline);overflow:hidden;display:flex;align-items:center;justify-content:center}
.person .face img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(1) contrast(1.02)}
.person .face .ini{font:500 20px/1 var(--mono);letter-spacing:.06em;color:var(--mute)}
.person .nm{font-size:15.5px;font-weight:600;letter-spacing:-0.15px;color:var(--ink);margin:0}
.person .rl{font-size:13px;line-height:1.4;color:var(--slate);margin:0}
.person .cr{font-size:13px;line-height:1.45;color:var(--graphite);margin:0}

/* ---- fact rows ---- */
.fact-group{font:600 10.5px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);margin:0;padding-bottom:var(--xs);border-bottom:2px solid var(--ink)}
.dash-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.dash-list li{position:relative;padding-left:26px;font:400 16.5px/1.5 var(--sans);color:var(--graphite)}
.dash-list li::before{content:"";position:absolute;left:2px;top:.6em;width:12px;height:1.5px;background:var(--ink)}
.fact-rows{display:flex;flex-direction:column;gap:var(--md);margin-top:var(--xl)}
.fact-row{display:grid;grid-template-columns:220px 1fr;gap:var(--xl);align-items:baseline;padding-bottom:var(--md);border-bottom:1px solid var(--hairline-soft)}
.fact-row .key{font:600 11px/1.4 var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--slate)}
.fact-row .val{font-size:16px;color:var(--ink-soft);line-height:1.55}

/* ---- form ---- */
.form{max-width:520px;margin-top:var(--xl);display:flex;flex-direction:column;gap:var(--lg)}
.field{display:flex;flex-direction:column;gap:var(--xs)}
.field label{font:600 11px/1.3 var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--slate)}
.field label .opt{color:var(--mute);font-weight:400;text-transform:none;letter-spacing:0}
.field input,.field textarea{font:400 16px/1.5 var(--sans);color:var(--ink);background:#fff;border:1px solid var(--hairline);border-radius:var(--r-none);padding:12px 14px;width:100%}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--ink)}
.field textarea{min-height:110px;resize:vertical}
.form .expect{font-size:14px;color:var(--slate);margin:0}
.form .alt{font-size:14px;color:var(--slate);margin:0}

/* ---- closing: the one dark panel, bookending the hero photograph ---- */
.closing-wrap{padding:var(--section-lg) 0}
.closing{position:relative;overflow:hidden;background:var(--scrim);color:var(--on-primary);border-radius:var(--r-lg);padding:124px var(--xxl);text-align:center}
.closing .close-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 100%;filter:grayscale(1) contrast(1.06);opacity:.5}
.closing .close-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,8,8,.5),rgba(8,8,8,.84))}
.closing>*:not(.close-img):not(.close-scrim){position:relative;z-index:2}
.closing h2{font-family:var(--display);font-size:clamp(36px,4.4vw,52px);font-weight:400;line-height:1.08;letter-spacing:-0.8px;color:var(--on-primary);margin:0 auto var(--lg);max-width:24ch}
.closing .sub{font-size:18px;color:var(--on-primary);opacity:.72;margin:0 auto var(--xl);max-width:52ch;line-height:1.5}
.closing .actions{display:flex;gap:var(--xl);align-items:center;justify-content:center;flex-wrap:wrap}
.closing .reassurance{color:var(--on-primary);opacity:.5;margin-top:var(--xl);font-size:13.5px}

/* ---- footer ---- */
footer.footer{background:var(--footer);color:var(--on-primary);padding:var(--section) 0 var(--xxl)}
.footer-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:var(--xxl);padding-bottom:var(--section);border-bottom:1px solid rgba(250,249,247,.09)}
.footer-brand .wordmark-foot{font-family:var(--sans);font-size:20px;font-weight:600;letter-spacing:-0.5px;color:var(--on-primary);margin:0 0 var(--sm);display:block;text-decoration:none}
.footer-brand p{color:var(--ash);font-size:13.5px;line-height:1.5;max-width:30ch;margin:0}
.footer-col h4{font-family:var(--sans);font-size:10.5px;font-weight:600;letter-spacing:1.1px;text-transform:uppercase;color:var(--stone);margin:0 0 var(--md)}
.footer-col ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--sm)}
.footer-col a{color:var(--on-primary);text-decoration:none;font-size:14px;line-height:1.4}
.footer-col a:hover{color:var(--ash)}
.footer-bottom{padding-top:var(--lg);display:flex;justify-content:space-between;align-items:baseline;gap:var(--lg);flex-wrap:wrap}
.footer-bottom .left{color:var(--ash);font-size:13px}
.footer-bottom .stamp{color:var(--stone);font-size:12.5px;font-family:var(--mono);letter-spacing:.04em}
.footer-bottom .credit{color:var(--stone);font-size:12px;margin:0;flex:1;text-align:center}

/* ---- responsive ---- */
@media (max-width:1100px){
  .boundary{grid-template-columns:1fr}
  .bx-cross{padding:var(--lg) 0;flex-direction:row;align-items:center;justify-content:space-between;gap:var(--lg);flex-wrap:wrap}
  .bx-cross .cross{flex:1;min-width:160px}
  .bx-cross .note{border-top:none;padding-top:0;flex-basis:100%;text-align:left}
  .flow{grid-template-columns:1fr 1fr}
  .flow-step{border-right:none;border-bottom:1px solid var(--hairline);padding:var(--lg) var(--md)}
  .flow-step:nth-child(odd){border-right:1px solid var(--hairline);padding-left:0}
  .flow-3{grid-template-columns:1fr}
  .flow-3 .flow-step,.flow-3 .flow-step:nth-child(odd){border-right:none;padding:var(--lg) 0}
  .bx-items li.tether::after{display:none}
  .people{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:1024px){
  .nav-menu{gap:var(--lg)}
  .two-col,.two-col.wide-right{grid-template-columns:1fr;gap:var(--xxl)}
  .verbs{grid-template-columns:1fr 1fr}
  .verb{border-bottom:1px solid var(--hairline);padding:var(--lg) var(--md) var(--lg) 0}
  .verb:nth-child(even){border-right:none;padding-left:var(--lg)}
  .verb:nth-child(odd){padding-left:0}
  .stack-row{grid-template-columns:48px 1fr;gap:var(--sm) var(--lg)}
  .stack-row .n{grid-column:1;grid-row:1}
  .stack-row h3{grid-column:2;grid-row:1}
  .stack-row>p:not(.n){grid-column:2;grid-row:2}
  .deploy{grid-template-columns:1fr}
  .footer-top{grid-template-columns:1fr 1fr;gap:var(--xl)}
}
@media (max-width:900px){
  .hero-photo .hero-img{object-position:64% 45%}
  .hero-photo{min-height:auto;padding-top:calc(84px + var(--section));padding-bottom:var(--section)}
  .hero-photo h1{letter-spacing:-0.8px;max-width:24ch}
  .hero-photo .triad div{padding-top:var(--md)}
  .hero-credit{display:none}
}
@media (max-width:768px){
  :root{--section:56px;--section-lg:80px;--xxl:32px}
  .container{padding-left:24px;padding-right:24px}
  .nav{height:68px}
  .hero-photo{margin-top:-68px;padding-top:calc(68px + var(--xxl))}
  .hero-photo .triad div+div{border-left:none;border-top:1px solid rgba(255,255,255,.22);padding-top:var(--sm)}
  .hero-photo .triad div{padding-top:var(--sm);padding-bottom:var(--sm)}
  .closing{padding:72px var(--lg)}
  .nav-menu{display:none}
  .nav-burger{display:inline-flex}
  .nav-right .btn{height:40px;padding:0 18px;font-size:13px}
  .nav-right{gap:var(--xs)}
  .triad{grid-template-columns:1fr}
  .triad div+div{border-left:none;border-top:1px solid var(--hairline);padding-left:0}
  .triad div{padding:var(--sm) 0}
  .flow{grid-template-columns:1fr}
  .flow-step,.flow-step:nth-child(odd){border-right:none;padding:var(--lg) 0}
  .verbs{grid-template-columns:1fr}
  .verb,.verb:nth-child(even),.verb:nth-child(odd){border-right:none;padding:var(--lg) 0;border-bottom:1px solid var(--hairline)}
  .verb:last-child{border-bottom:none}
  .stat{grid-template-columns:1fr;gap:var(--md)}
  .people{grid-template-columns:repeat(2,1fr)}
  .otable td:first-child{width:auto}
  .otable thead{display:none}
  .otable tr{display:grid;grid-template-columns:1fr;padding:var(--md) 0;border-bottom:1px solid var(--hairline)}
  .otable td{border-bottom:none;padding:2px 0}
  .otable td:first-child{font-weight:600}
  .logo-strip .name{font-size:24px}
  .fact-row{grid-template-columns:1fr;gap:var(--xxs)}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* ================= v7.0 — brief build: type-led hero, two build-on-scroll diagrams ================= */

/* header compresses on scroll */
.nav.is-stuck{height:64px}
.nav.is-stuck .brand svg{width:24px;height:24px}
.nav.is-stuck .brand .b1{font-size:17px}

/* motion: fade-ins, and the two diagrams that build stage by stage */
.fade{opacity:0;transform:translateY(12px);transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1)}
.fade.in{opacity:1;transform:none}
.build .s1,.build .s2,.build .s3,.build .s4,.build .s5,.build .s6{opacity:0;transform:translateY(8px);transition:opacity .5s ease,transform .5s ease}
.build.in .s1,.build.in .s2,.build.in .s3,.build.in .s4,.build.in .s5,.build.in .s6{opacity:1;transform:none}
.build.in .s1{transition-delay:.05s}.build.in .s2{transition-delay:.22s}.build.in .s3{transition-delay:.39s}
.build.in .s4{transition-delay:.56s}.build.in .s5{transition-delay:.73s}.build.in .s6{transition-delay:.9s}
@media (prefers-reduced-motion:reduce){.fade,.build .s1,.build .s2,.build .s3,.build .s4,.build .s5,.build .s6{opacity:1;transform:none;transition:none}}

/* hero: the claim is the hero, no imagery */
.hero-type{padding:var(--section-lg) 0 var(--section-lg);border-bottom:1px solid var(--hairline)}
.hero-type .h-eyebrow{font:600 11.5px/1.4 var(--mono);letter-spacing:.24em;text-transform:uppercase;color:var(--slate);margin:0 0 var(--xxl)}
.hero-type h1{font-family:var(--display);font-weight:400;font-size:clamp(38px,5.2vw,68px);line-height:1.04;letter-spacing:-1.4px;color:var(--ink);margin:0 0 var(--lg);max-width:17ch;text-wrap:pretty}
.hero-type .h-sub{font-family:var(--display);font-weight:400;font-size:clamp(21px,2.4vw,32px);line-height:1.28;letter-spacing:-0.4px;color:var(--graphite);margin:0 0 var(--xxl);max-width:30ch;text-wrap:pretty}
.hero-type .h-third{font:600 13px/1.5 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);margin:0 0 var(--md);padding-top:var(--lg);border-top:1px solid var(--ink);max-width:640px}
.hero-type .h-qual{font-size:14px;line-height:1.55;color:var(--slate);margin:0;max-width:56ch}
.hero-type .actions{display:flex;gap:var(--xl);align-items:center;flex-wrap:wrap;margin-top:var(--xxl)}

/* section type */
.measure{max-width:680px}
.h-sec{font-family:var(--display);font-weight:400;font-size:clamp(28px,3.3vw,42px);line-height:1.12;letter-spacing:-0.7px;color:var(--ink);margin:0 0 var(--lg);max-width:22ch;text-wrap:pretty}
.measure p{font-size:17.5px;line-height:1.65;color:var(--graphite);margin:0 0 var(--md)}
.measure p:last-child{margin-bottom:0}
.measure .lead-line{color:var(--ink);font-weight:500}
.measure .never{font:600 12px/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);margin:var(--lg) 0 var(--md)}
.measure .after-cites{margin-top:var(--xl)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:var(--section-lg);align-items:start}
.split-tight{grid-template-columns:1.35fr 1fr;gap:var(--section);align-items:center}
.split>div>p{font-size:17px;line-height:1.65;color:var(--graphite);margin:0 0 var(--md);max-width:56ch}
.split>div>p:last-child{margin-bottom:0}
.linkline{margin-top:var(--xl)}
.section-quiet{padding:var(--section) 0}

/* deployment boundary diagram */
.dep{display:flex;flex-direction:column;gap:0}
.dep-box{border:1px solid var(--ink);padding:var(--xl) var(--lg) var(--lg);position:relative}
.dep-label{position:absolute;top:-9px;left:var(--lg);background:var(--canvas);padding:0 var(--xs);font:600 10.5px/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);margin:0}
.dep-items{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.dep-items li{font-size:16px;line-height:1.4;color:var(--ink-soft);padding:var(--sm) 0;border-bottom:1px dotted var(--hairline);display:flex;align-items:baseline;gap:var(--sm)}
.dep-items li::before{content:"";width:6px;height:6px;background:var(--ink);flex:none;transform:translateY(-1px)}
.dep-items li:last-child{border-bottom:none;padding-bottom:0}
.dep-cross{display:flex;flex-direction:column;align-items:center;gap:var(--xxs);padding:var(--md) 0}
.dep-cross-label{font:600 10px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}
.dep-arrow{display:block;width:1px;height:34px;background:var(--ink);position:relative}
.dep-arrow::after{content:"";position:absolute;bottom:0;left:-3.5px;border-top:7px solid var(--ink);border-left:4px solid transparent;border-right:4px solid transparent}
.dep-out{border:1px dashed var(--ash);padding:var(--lg)}
.dep-out p{margin:0;font-size:16px;color:var(--slate)}

/* citation-style cards */
.cites{display:grid;grid-template-columns:1fr 1fr;gap:var(--lg);margin-top:var(--xl)}
.cite{border-left:1px solid var(--ink);padding:var(--md) 0 var(--md) var(--lg)}
.cite p{margin:0;font-family:var(--display);font-size:19px;line-height:1.4;letter-spacing:-0.2px;color:var(--ink)}

/* five-stage flow with the crossing and the receipt */
.flowwrap{margin-top:var(--xxl);position:relative}
.flow5{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--ink)}
.flow5 li{padding:var(--lg) var(--md) var(--lg) 0;border-right:1px solid var(--hairline);display:flex;flex-direction:column;gap:var(--sm)}
.flow5 li:nth-child(n+2){padding-left:var(--md)}
.flow5 li:last-child{border-right:none}
.flow5 .n{font:700 11px/1 var(--mono);letter-spacing:.1em;color:var(--slate)}
.flow5 .lb{font-size:16px;line-height:1.35;letter-spacing:-0.2px;color:var(--ink)}
.flow5 .is-out .lb{color:var(--slate)}
.crossmark{display:grid;grid-template-columns:repeat(5,1fr);align-items:center;padding:var(--md) 0 0}
.crossmark .cm-rule{grid-column:1/4;height:1px;background:var(--ink)}
.crossmark .cm-lb{grid-column:4/6;justify-self:start;font:600 10px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink);border:1px solid var(--ink);padding:4px 8px}
.rcpt{margin:var(--lg) 0 0 auto;border:1px solid var(--ink);max-width:520px}
.rcpt-t{font:700 10.5px/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink);margin:0;padding:var(--md) var(--lg);border-bottom:1px solid var(--ink)}
.rcpt-stamp{display:flex;flex-wrap:wrap;gap:var(--xs);padding:var(--md) var(--lg);background:var(--canvas-warm)}
.rcpt-stamp span{font:700 10px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink);border:1px solid var(--ink);padding:4px 7px}

/* table + the two deployment options */
.tablewrap{overflow-x:auto;margin:var(--xl) 0 var(--section)}
.tablewrap .otable{margin-top:0;min-width:560px}
.otable thead th:last-child{width:46%}
.deploy{margin:var(--lg) 0 var(--xl)}
.deploy .card-strong p{margin:0;font-family:var(--display);font-size:20px;line-height:1.35;letter-spacing:-0.25px;color:var(--ink)}

/* cost chart motif */
.chart{position:relative;padding:0 0 var(--lg) var(--lg)}
.chart .ax-y{position:absolute;left:-14px;top:50%;transform:rotate(-90deg) translateX(50%);transform-origin:left center;font:600 10px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--slate);margin:0;white-space:nowrap}
.chart .ax-x{text-align:right;font:600 10px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--slate);margin:var(--xs) 0 0}

/* quiet strips */
.strip{border-top:1px solid var(--hairline);padding:var(--xl) 0 0}
.strip+.strip{margin-top:var(--xl)}
.h-strip{font-family:var(--display);font-weight:400;font-size:24px;line-height:1.25;letter-spacing:-0.3px;color:var(--ink);margin:0 0 var(--lg)}
.strip .logo-strip{justify-content:flex-start;gap:var(--lg) var(--xl);margin:0;max-width:none;filter:grayscale(1)}
.strip .logo-strip .name{font-size:26px;color:var(--graphite)}
.strip-line{font-size:17px;line-height:1.6;color:var(--graphite);margin:0 0 var(--sm);max-width:60ch}
.strip-adv{font-size:15px;line-height:1.6;color:var(--slate);margin:0;max-width:70ch}

/* closing band */
.closeband{background:var(--scrim);color:var(--on-primary);padding:var(--section-lg) 0}
.closeband-in{max-width:640px}
.closeband h2{font-family:var(--display);font-weight:400;font-size:clamp(36px,4.6vw,58px);line-height:1.06;letter-spacing:-1px;color:var(--on-primary);margin:0 0 var(--lg)}
.closeband .cb-body{font-size:18.5px;line-height:1.55;color:var(--ash);margin:0 0 var(--xxl);max-width:52ch}
.closeband .actions{display:flex}
.closeband .cb-expect{font-size:13.5px;color:var(--stone);margin:var(--lg) 0 0}

/* footer, brief form */
.footer-row{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--xxl);padding-bottom:var(--section);border-bottom:1px solid rgba(255,255,255,.09);flex-wrap:wrap}
.footer-nav{display:flex;flex-wrap:wrap;gap:var(--lg) var(--xl)}
.footer-nav a{color:var(--on-primary);text-decoration:none;font-size:14px;line-height:1.4}
.footer-nav a:hover{color:var(--ash)}

@media (max-width:1024px){
  .split,.split-tight{grid-template-columns:1fr;gap:var(--xxl)}
  .frames{grid-template-columns:1fr;gap:var(--xl)}
  .frames>div+div{border-left:none;padding-left:0;border-top:1px solid var(--hairline);padding-top:var(--xl)}
  .chart{max-width:420px}
}
@media (max-width:768px){
  .hero-type .h-third{font-size:12px;letter-spacing:.12em}
  .cites{grid-template-columns:1fr}
  .flow5{grid-template-columns:1fr;border-top:1px solid var(--ink)}
  .flow5 li,.flow5 li:nth-child(n+2){border-right:none;border-bottom:1px solid var(--hairline);padding:var(--md) 0}
  .flow5 li:last-child{border-bottom:none}
  .rcpt{max-width:none;margin-left:0}
  .crossmark{grid-template-columns:1fr auto}
  .crossmark .cm-rule{grid-column:1}
  .crossmark .cm-lb{grid-column:2}
  .footer-row{flex-direction:column;gap:var(--xl)}
}

/* ---- v6.1: messaging brought over from the pitch deck ---- */
.choice{display:grid;grid-template-columns:1fr 1fr;gap:var(--lg);margin-top:var(--xl)}
.ch{border:1px solid var(--hairline);padding:var(--lg);display:flex;flex-direction:column;gap:var(--sm)}
.ch-k{font:600 11px/1.3 var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--slate);margin:0}
.ch p{margin:0;font-size:15.5px;line-height:1.6;color:var(--graphite)}
.ch p.ch-v{margin:auto 0 0;padding-top:var(--md);border-top:1px solid var(--hairline);font-size:14.5px;font-weight:600;color:var(--ink);display:flex;gap:var(--xs);align-items:baseline}
.ch-v::before{content:"\00d7";font:600 13px/1 var(--mono);color:var(--ink)}
.metric{border-top:1px solid var(--ink);margin-top:var(--xl);padding-top:var(--lg);display:grid;grid-template-columns:auto 1fr;gap:var(--xxl);align-items:baseline}
.metric .mk{font-family:var(--display);font-size:clamp(30px,3.6vw,46px);line-height:1;letter-spacing:-1.1px;color:var(--ink);margin:0;white-space:nowrap}
.metric .md{font-size:19.5px;line-height:1.5;letter-spacing:-0.2px;color:var(--ink);margin:0;max-width:44ch}
.metric .mn{font-size:15px;line-height:1.55;color:var(--slate);margin:var(--sm) 0 0;max-width:58ch}
.footer .li-link{display:inline-flex;color:var(--slate);margin-top:var(--md)}
.footer .li-link:hover{color:var(--ink)}
.cite-card{display:grid;grid-template-columns:auto 1fr;gap:var(--xl);align-items:baseline;border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);padding:var(--lg) 0;margin-top:var(--xl)}
.cite-card .num{font-family:var(--display);font-size:42px;line-height:1;letter-spacing:-1.6px;color:var(--ink);margin:0}
.cite-card .txt{font-size:16.5px;line-height:1.55;color:var(--ink-soft);margin:0;max-width:62ch}
.cite-card .src{font-size:12.5px;line-height:1.5;color:var(--slate);margin:var(--xs) 0 0;max-width:62ch}
.steps3{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink);margin-top:var(--xl)}
.steps3 .st{padding:var(--lg) var(--lg) var(--lg) 0;border-right:1px solid var(--hairline)}
.steps3 .st:nth-child(n+2){padding-left:var(--lg)}
.steps3 .st:last-child{border-right:none}
.steps3 .n{font:700 11px/1.3 var(--mono);letter-spacing:.1em;color:var(--slate);margin:0 0 var(--sm)}
.steps3 h4{font-family:var(--display);font-weight:400;font-size:22px;letter-spacing:-0.3px;margin:0 0 var(--xs);color:var(--ink)}
.steps3 p{margin:0;font-size:15px;line-height:1.55;color:var(--graphite)}
@media (max-width:900px){
  .choice{grid-template-columns:1fr}
  .metric{grid-template-columns:1fr;gap:var(--md)}
  .cite-card{grid-template-columns:1fr;gap:var(--md)}
  .steps3{grid-template-columns:1fr}
  .steps3 .st,.steps3 .st:nth-child(n+2){border-right:none;border-bottom:1px solid var(--hairline);padding:var(--lg) 0}
  .steps3 .st:last-child{border-bottom:none}
}

/* ---- type-led hero: the claim is the hero ---- */
.hero-lead{padding:var(--section-lg) 0 var(--section-lg)}
.hero-stack{animation:heroIn .7s cubic-bezier(.22,.61,.36,1) both}
@keyframes heroIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.hero-stack{animation:none}}
.hero-lead .hl-eyebrow{font:600 12px/1.4 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--slate);margin:0 0 var(--xxl)}
.hero-lead h1{font-family:var(--display);font-weight:400;font-size:clamp(31px,5.4vw,66px);line-height:1.04;letter-spacing:-1.5px;color:var(--ink);margin:0 0 var(--md);max-width:17ch;text-wrap:balance}
.hero-lead .hl-sub{font-family:var(--display);font-weight:400;font-size:clamp(19px,2.6vw,33px);line-height:1.24;letter-spacing:-0.5px;color:var(--graphite);margin:0;max-width:26ch;text-wrap:pretty}
.hero-lead .hl-third{font:600 13.5px/1.5 var(--sans);letter-spacing:.15em;text-transform:uppercase;color:var(--ink);margin:calc(var(--section) - 8px) 0 var(--md);padding-top:var(--lg);border-top:1px solid var(--ink);max-width:620px}
.hero-lead .hl-qual{font-size:14px;line-height:1.55;color:var(--slate);margin:0;max-width:54ch}
.hero-lead .hl-actions{display:flex;gap:var(--xl);align-items:center;flex-wrap:wrap;margin-top:var(--xxl)}
@media (max-width:768px){
  .hero-lead{padding:var(--section) 0}
  .hero-lead .hl-eyebrow{letter-spacing:.16em;margin-bottom:var(--xl)}
  .hero-lead h1{letter-spacing:-0.9px;max-width:none}
  .hero-lead .hl-sub{max-width:none}
  .hero-lead .hl-third{margin-top:var(--xxl);letter-spacing:.12em;font-size:12.5px}
  .hero-lead .hl-actions{margin-top:var(--xl)}
}