/* ============================================================
   GENESIS BASE · shared AAA+ design system · 2026-06-07
   Extracted from genesis-home.css (the homepage system) so every
   sub-page speaks ONE visual language: near-black, editorial serif,
   one disciplined gold accent, generous space, restrained motion.
   Self-contained. CSP-safe (external 'self' sheet, no inline).
   Sub-pages load THIS; index.html keeps genesis-home.css.
   If you change a shared token/component, mirror it in both.
   ============================================================ */
:root{
  --bg:#090C11; --bg-2:#0C1017; --card:#11161F; --card-2:#151C28;
  --ink:#F5F3EC; --ink-2:#AEB4BF; --ink-3:#8A929E; /* ink-3 lifted 6E7682→8A929E: 4.27→6.24:1, clears WCAG AA for the small disclaimer/label text (AAA pass) */
  --gold:#C9A24B; --gold-2:#E6CF8C; --gold-deep:#A8883A; /* lifted 7E6224→A8883A: 3.41→5.83:1, small gold labels clear WCAG AA */
  --line:rgba(201,162,75,.20); --line-soft:rgba(201,162,75,.10); --line-2:rgba(255,255,255,.06);
  --serif:'Newsreader','Noto Serif',Georgia,'Times New Roman',serif;
  --sans:'Inter',-apple-system,BlinkMacSystemFont,'Noto Sans',sans-serif;
  --mono:'JetBrains Mono',ui-monospace,'Noto Sans',monospace;
  /* font with guaranteed Akan (Ɛ Ɔ ɛ ɔ) coverage for Twi text */
  --akan:'Noto Serif',Georgia,serif;
  --wrap:1180px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth; overflow-x:hidden}
body{background:var(--bg); color:var(--ink); font-family:var(--sans); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; overflow-x:hidden; max-width:100%}
.wrap{max-width:var(--wrap); margin:0 auto; padding:0 40px}
a{color:inherit; text-decoration:none}
.eyebrow{font-family:var(--mono); font-size:11px; font-weight:500; letter-spacing:.30em; text-transform:uppercase; color:var(--gold)}
.disc{font-family:var(--mono); font-size:11px; letter-spacing:.04em; color:var(--ink-3)}
.center{text-align:center}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
/* keyboard focus rings (AAA a11y · 2026-06-05) — visible focus for keyboard nav,
   suppressed for mouse via :focus-visible so it never shows on click */
a:focus-visible,button:focus-visible,input:focus-visible,.btn:focus-visible,.btn-wait:focus-visible,.btn-demo:focus-visible,.pcard:focus-visible,.path:focus-visible{
  outline:2px solid var(--gold-2); outline-offset:3px; border-radius:2px}

/* entrance (hero only, on load, pure CSS) */
@keyframes genFade{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.rise{opacity:0; animation:genFade .9s cubic-bezier(.2,.7,.2,1) forwards}
.rise.d1{animation-delay:.06s}.rise.d2{animation-delay:.12s}.rise.d3{animation-delay:.18s}
.rise.d4{animation-delay:.24s}.rise.d5{animation-delay:.30s}.rise.d6{animation-delay:.36s}
@media (prefers-reduced-motion:reduce){.rise{opacity:1;animation:none}}

/* utility / honesty bar */
.util{border-bottom:1px solid var(--line-2); background:#06080B; font-family:var(--mono); font-size:11px; letter-spacing:.03em; color:var(--ink-3)}
.util .wrap{display:flex; gap:34px; padding:10px 40px; flex-wrap:wrap; justify-content:center}
.util b{color:var(--ink-2); font-weight:500}

/* nav */
nav{border-bottom:1px solid var(--line-soft); position:sticky; top:0; z-index:50; background:rgba(9,12,17,.82); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px)}
nav .wrap{display:flex; align-items:center; justify-content:space-between; height:78px; gap:24px}
.brand{display:flex; align-items:center; gap:13px; white-space:nowrap}
.brand .seal{flex:none}
.brand .name{font-family:var(--serif); font-size:20px; font-weight:400; letter-spacing:.005em; line-height:1.05; display:block}
.brand .name b{color:var(--gold); font-weight:500}
.brand .sub{font-family:var(--mono); font-size:9.5px; letter-spacing:.24em; color:var(--ink-3); text-transform:uppercase; margin-top:3px; display:block}
.navlinks{display:flex; gap:34px; align-items:center; font-size:14px; color:var(--ink-2)}
.navlinks a{position:relative; padding:4px 0}
.navlinks a:not(.btn-wait):hover{color:var(--ink)}
.navlinks a:not(.btn-wait)::after{content:''; position:absolute; left:0; bottom:-2px; width:0; height:1px; background:var(--gold); transition:width .25s}
.navlinks a:not(.btn-wait):hover::after{width:100%}
.btn-wait{font-family:var(--mono); font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--bg); background:var(--gold); padding:11px 20px; border-radius:2px; font-weight:500; transition:background .2s}
.btn-wait:hover{background:var(--gold-2)}

/* hero */
.hero{position:relative; padding:96px 0 84px; overflow:hidden}
.hero::before{content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(ellipse 64% 52% at 50% 2%, rgba(201,162,75,.12) 0%, transparent 60%)}
.hero .wrap{position:relative; z-index:1; max-width:960px; text-align:center}
.hero-seal{margin:0 auto 30px; width:74px; height:74px; opacity:.92; display:block}
.hero .eyebrow{display:inline-flex; gap:11px; align-items:center; justify-content:center}
.hero .eyebrow .dot{width:6px; height:6px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 4px rgba(201,162,75,.14)}
h1.display{font-family:var(--serif); font-weight:300; font-size:clamp(50px,7.6vw,96px); line-height:1.0; letter-spacing:-.02em; margin:26px 0 0; color:var(--ink)}
h1.display em{font-style:italic; color:var(--gold-2); font-weight:400}
.hero .lede{font-family:var(--serif); font-weight:300; font-size:clamp(18px,2vw,23px); color:var(--ink-2); line-height:1.55; max-width:620px; margin:26px auto 0}
.hero .cta{display:flex; gap:14px; justify-content:center; margin-top:40px; flex-wrap:wrap}
.btn{font-family:var(--mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; padding:16px 30px; border-radius:2px; font-weight:500; transition:all .22s; cursor:pointer; display:inline-block}
.btn-primary{background:var(--gold); color:var(--bg)}
.btn-primary:hover{background:var(--gold-2); transform:translateY(-1px)}
.btn-ghost{border:1px solid var(--line); color:var(--ink)}
.btn-ghost:hover{border-color:var(--gold); color:var(--gold-2)}

/* stat ribbon */
.stats{margin-top:68px; border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.stats .grid{display:grid; grid-template-columns:repeat(4,1fr)}
.stat{padding:30px 22px; text-align:center; border-right:1px solid var(--line-2)}
.stat:last-child{border-right:none}
.stat .num{font-family:var(--serif); font-weight:400; font-feature-settings:"lnum" 1; font-size:40px; line-height:1; color:var(--gold-2); letter-spacing:-.02em}
.stat .num .u{font-size:.48em; color:var(--gold); margin-left:2px}
.stat .lbl{font-family:var(--mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3); margin-top:13px; line-height:1.55}
.footnote{margin-top:16px; text-align:center}

/* section frame */
section.band{padding:100px 0; border-bottom:1px solid var(--line-2)}
.kicker{font-family:var(--mono); font-size:11px; letter-spacing:.26em; text-transform:uppercase; color:var(--gold); margin-bottom:22px}
h2.sec{font-family:var(--serif); font-weight:300; font-size:clamp(31px,4vw,48px); line-height:1.1; letter-spacing:-.012em; max-width:780px; color:var(--ink)}
.sec-lede{font-family:var(--serif); font-weight:300; font-size:clamp(17px,1.7vw,20px); color:var(--ink-2); line-height:1.62; max-width:680px; margin-top:24px}

/* three covenants */
.trinity{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:54px; background:var(--line-2); border:1px solid var(--line-2)}
.cov{background:var(--bg); padding:40px 34px; position:relative}
.cov .tnum{font-family:var(--mono); font-size:11px; letter-spacing:.2em; color:var(--gold-deep)}
.cov h3{font-family:var(--serif); font-weight:400; font-size:25px; margin:18px 0 4px; color:var(--ink)}
.cov .twi{font-family:var(--akan); font-style:italic; font-weight:400; font-size:15px; color:var(--gold-2); margin-bottom:16px}
.cov p{font-size:14.5px; color:var(--ink-2); line-height:1.65}
.cov .tag{font-family:var(--mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3); margin-top:18px; padding-top:14px; border-top:1px solid var(--line-soft); display:block}
.cov::before{content:''; position:absolute; top:0; left:0; width:38px; height:2px; background:var(--gold)}

/* proof cards */
.proof{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:1px; margin-top:50px; background:var(--line-2); border:1px solid var(--line-2)}
.pcard{background:var(--card); padding:28px 24px; transition:background .2s; display:block}
.pcard:hover{background:var(--card-2)}
.pcard .t{font-family:var(--mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-3)}
.pcard .v{font-family:var(--serif); font-size:18px; color:var(--ink); margin-top:11px; line-height:1.35}
.pcard .arr{color:var(--gold); font-size:13px; margin-top:15px; display:inline-block; opacity:.6; transition:transform .2s,opacity .2s}
.pcard:hover .arr{opacity:1; transform:translate(2px,-2px)}

.builton{display:flex; align-items:center; gap:13px; flex-wrap:wrap; margin-top:56px}
.builton .lab{font-family:var(--mono); font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-3); margin-right:6px}
.chip{font-family:var(--mono); font-size:12px; color:var(--ink-2); border:1px solid var(--line-2); padding:8px 16px; border-radius:2px; transition:all .2s}
.chip:hover{border-color:var(--line); color:var(--ink)}

/* divider */
.rule{display:flex; align-items:center; justify-content:center; gap:14px; margin-bottom:36px}
.rule span{height:1px; width:90px; background:linear-gradient(90deg,transparent,var(--gold),transparent)}
.rule i{width:5px; height:5px; transform:rotate(45deg); background:var(--gold); display:block}

/* waitlist */
.signup{text-align:center}
.signup form{display:flex; gap:12px; justify-content:center; margin-top:34px; flex-wrap:wrap}
.signup input{font-family:var(--sans); font-size:15px; background:var(--card); border:1px solid var(--line); color:var(--ink); padding:16px 20px; border-radius:2px; width:340px; max-width:80vw}
.signup input::placeholder{color:var(--ink-3)}
.signup input:focus{outline:none; border-color:var(--gold)}
.signup .sec{margin-left:auto;margin-right:auto;text-align:center}
.signup .disc{margin-top:24px}
.disc a,.risk-link{color:inherit;text-decoration:underline}

/* ── narrative pass (2026-06-04) ────────────────────────────── */
/* reveal on scroll (JS-toggled .in) */
.reveal{opacity:0; transform:translateY(20px); transition:opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1; transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* problem statement */
.statement{font-family:var(--serif); font-weight:300; font-size:clamp(28px,4.4vw,52px); line-height:1.16; letter-spacing:-.01em; color:var(--ink); max-width:880px}
.statement em{font-style:italic; color:var(--gold-2)}
.statement .mute2{color:var(--ink-2)}  /* lifted ink-3→ink-2 (9.4:1) — the elaboration read as "fully gray/broken"; now clearly legible, still a hair softer than the lead sentence */
.statement + .statement{margin-top:.5em}
.mute2{color:var(--ink-3)}  /* general muted span (also used outside .statement) */

/* hero hook line */
.hook{font-family:var(--serif); font-style:italic; font-weight:300; font-size:clamp(17px,2vw,21px); color:var(--gold-2); margin-bottom:6px; display:block}

/* the rule band */
.rule-band{text-align:center; padding:118px 0; border-bottom:1px solid var(--line-2); position:relative}
.rule-band h2{font-family:var(--serif); font-weight:300; font-size:clamp(38px,7vw,84px); letter-spacing:-.02em; line-height:1.02; color:var(--ink)}
.rule-band h2 em{font-style:italic; color:var(--gold-2)}
.rule-band p{margin:24px auto 0; color:var(--ink-2); max-width:560px; font-size:17px; line-height:1.6}

/* self-verifying attestation demo */
.demo{margin-top:50px; border:1px solid var(--line); border-radius:4px; background:var(--bg-2); overflow:hidden; max-width:760px}
.demo-head{display:flex; justify-content:space-between; align-items:center; gap:12px; padding:15px 22px; border-bottom:1px solid var(--line-2); font-family:var(--mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3)}
.demo-head .live{color:var(--gold)}
.demo-body{padding:20px 22px; font-family:var(--mono); font-size:12.5px; color:var(--ink-2); line-height:1.8}
.demo-body .row{display:flex; justify-content:space-between; gap:16px; border-bottom:1px dashed var(--line-2); padding:7px 0}
.demo-body .row span:first-child{color:var(--ink-3)}
.demo-body .row span:last-child{color:var(--ink); text-align:right; word-break:break-word}
.hashrow{margin-top:16px; padding-top:14px; border-top:1px solid var(--line-2)}
.hashline{display:flex; gap:12px; align-items:baseline; font-size:12px; margin-top:8px; flex-wrap:wrap}
.hashline .k{color:var(--ink-3); min-width:128px}
.hashline .h{color:var(--gold-2); word-break:break-all; flex:1}
.demo-foot{padding:18px 22px; border-top:1px solid var(--line-2); display:flex; align-items:center; gap:18px; flex-wrap:wrap}
.match{font-family:var(--mono); font-size:12px; letter-spacing:.08em; color:var(--ink-3)}
.match.ok{color:#79C9A0}
.btn-demo{font-family:var(--mono); font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink); background:transparent; border:1px solid var(--line); padding:12px 22px; border-radius:2px; cursor:pointer; transition:all .2s}
.btn-demo:hover{border-color:var(--gold); color:var(--gold-2)}
.demo-note{margin-top:16px; max-width:760px}

/* how it works steps */
.steps{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; margin-top:50px; background:var(--line-2); border:1px solid var(--line-2)}
.step{background:var(--bg); padding:34px 26px}
.step .n{font-family:var(--mono); font-size:11px; letter-spacing:.2em; color:var(--gold-deep)}
.step h3{font-family:var(--serif); font-weight:400; font-size:20px; margin:14px 0 8px; color:var(--ink)}
.step p{font-size:14px; color:var(--ink-2); line-height:1.6}

/* two paths */
.paths{display:grid; grid-template-columns:1fr 1fr; gap:1px; margin-top:50px; background:var(--line-2); border:1px solid var(--line-2)}
.path{background:var(--card); padding:44px 38px; transition:background .2s; display:block}
.path:hover{background:var(--card-2)}
.path .pk{font-family:var(--mono); font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--gold)}
.path h3{font-family:var(--serif); font-weight:300; font-size:30px; margin:14px 0 12px; color:var(--ink)}
.path p{color:var(--ink-2); font-size:15px; line-height:1.65}
.path .cue{font-family:var(--mono); font-size:12px; color:var(--gold-2); margin-top:20px; display:inline-block}

@media(max-width:820px){
  .steps{grid-template-columns:1fr 1fr}
  .paths{grid-template-columns:1fr}
  .rule-band{padding:84px 0}
}

footer{padding:48px 0 56px; color:var(--ink-3); font-size:13px}
footer .wrap{display:block}
.footer-disc{display:flex; gap:26px; flex-wrap:wrap; font-family:var(--mono); font-size:11px; letter-spacing:.03em; color:var(--ink-3); line-height:1.7; padding-bottom:22px; margin-bottom:22px; border-bottom:1px solid var(--line-2)}
.footer-disc b{color:var(--ink-2); font-weight:500}
.footer-meta{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:18px}
footer a{color:var(--ink-2)} footer a:hover{color:var(--gold-2)}

@media(max-width:820px){
  .wrap{padding:0 22px} .util .wrap{padding:10px 22px; gap:18px}
  .navlinks{display:none}
  .trinity{grid-template-columns:1fr}
  .stats .grid{grid-template-columns:repeat(2,1fr)}
  .stat:nth-child(-n+2){border-bottom:1px solid var(--line-2)} .stat:nth-child(2){border-right:none}
}

/* ════════ AAA+ visual polish · 2026-06-05 (tweaks 1 · 3 · 4) ════════════════ */
/* 1 · HERO FILM-GRAIN — faint static texture for editorial depth. CSP-safe
   (img-src 'self' data: permits the inline SVG). Sits behind hero content. */
.hero::after{content:''; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.045;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E")}

/* 3 · CARD HOVER-LIFT on the trinity covenants + how-it-works steps (pointer
   devices only, so touch screens don't sticky-hover). Matches .pcard cohesion. */
@media (hover:hover){
  .cov,.step{transition:transform .22s cubic-bezier(.2,.7,.2,1), background .22s, box-shadow .22s}
  .cov:hover,.step:hover{transform:translateY(-3px); background:var(--card-2); box-shadow:0 14px 34px rgba(0,0,0,.35)}
}

/* 4 · DEMO 'VERIFIES' DELIGHT — one-shot gold-green glow on the match badge the
   moment the recomputed hash matches (.match.ok is set by genesis-home.js). */
@media (prefers-reduced-motion:no-preference){
  @keyframes matchGlow{0%{text-shadow:0 0 0 rgba(121,201,160,0)}28%{text-shadow:0 0 16px rgba(121,201,160,.65)}100%{text-shadow:0 0 0 rgba(121,201,160,0)}}
  .match.ok{animation:matchGlow 1.5s ease-out}
}

/* 5 · CENTERED EDITORIAL — 2026-06-05. The hero, the "no token" rule-band and
   the signup block were centered; every other section's eyebrow/heading/lede/
   demo was left-aligned with a max-width and no auto-margin, so the right half
   of the page sat empty above the full-width grids and read as lopsided. Center
   the text columns section-wide. Full-width grids (.trinity/.steps/.paths/
   .proof) and card internals (.cov/.step/.path) are NOT touched — only the
   block-level heading/lede/demo elements get centered + auto-margined. */
.band .kicker,
.band h2.sec,
.band .sec-lede,
.band .statement{ margin-left:auto; margin-right:auto; text-align:center; }
.band .demo,
.band .demo-note{ margin-left:auto; margin-right:auto; }
.band .demo-note{ text-align:center; }
/* keep the built-on chip row centered with its (now-centered) heading */
.builton{ justify-content:center; }

/* ════════════════════════════════════════════════════════════
   SUB-PAGE COMPONENTS · 2026-06-07 · additive, genesis-base only
   (not present on the homepage; safe to extend per sub-page need)
   ════════════════════════════════════════════════════════════ */

/* page hero heading — calmer scale than the homepage display h1 */
h1.page{font-family:var(--serif); font-weight:300; font-size:clamp(36px,5vw,60px); line-height:1.05; letter-spacing:-.018em; color:var(--ink); margin:20px 0 0}
h1.page em{font-style:italic; color:var(--gold-2); font-weight:400}
.hero .lede.wide{max-width:760px}

/* institutional data table */
.gtable{width:100%; border-collapse:collapse; margin-top:46px; font-size:14px}
.gtable thead th{font-family:var(--mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-3); text-align:left; padding:0 16px 14px; border-bottom:1px solid var(--line)}
.gtable td{padding:15px 16px; border-bottom:1px solid var(--line-2); color:var(--ink-2); line-height:1.55; vertical-align:top}
.gtable td:first-child{color:var(--ink); font-family:var(--serif); font-size:15.5px; width:30%}
.gtable tr:hover td{background:rgba(255,255,255,.015)}
@media(max-width:720px){
  .gtable, .gtable thead, .gtable tbody, .gtable tr, .gtable td{display:block; width:100%}
  .gtable thead{display:none}
  .gtable td{border:none; padding:3px 0}
  .gtable tr{padding:16px 0; border-bottom:1px solid var(--line-2)}
  .gtable td:first-child{font-size:18px; margin-bottom:5px; width:100%}
}

/* status pills */
.pill{font-family:var(--mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase; padding:4px 11px; border-radius:2px; border:1px solid var(--line-2); white-space:nowrap; display:inline-block}
.pill.live{color:#79C9A0; border-color:rgba(121,201,160,.35)}
.pill.pending{color:var(--gold-2); border-color:var(--line)}
.pill.open{color:var(--ink-3); border-color:var(--line-2)}

/* feature / product cards */
.feature{display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); gap:1px; margin-top:50px; background:var(--line-2); border:1px solid var(--line-2)}
.fcard{background:var(--card); padding:36px 32px; transition:background .2s}
.fcard:hover{background:var(--card-2)}
.fcard .ic{width:30px; height:30px; color:var(--gold); margin-bottom:20px; display:block}
.fcard h3{font-family:var(--serif); font-weight:400; font-size:22px; color:var(--ink); margin-bottom:11px}
.fcard p{font-size:14px; color:var(--ink-2); line-height:1.64}
.fcard ul{list-style:none; margin-top:18px; display:grid; gap:9px}
.fcard li{font-family:var(--mono); font-size:11.5px; color:var(--ink-3); letter-spacing:.015em; padding-left:15px; position:relative; line-height:1.5}
.fcard li::before{content:''; position:absolute; left:0; top:7px; width:5px; height:5px; transform:rotate(45deg); background:var(--gold); opacity:.7}
.fcard a{color:var(--gold-2); text-decoration:underline}

/* CTA band */
.cta-band{text-align:center}
.cta-band h2{font-family:var(--serif); font-weight:300; font-size:clamp(30px,4.4vw,52px); line-height:1.1; letter-spacing:-.015em; color:var(--ink)}
.cta-band h2 em{font-style:italic; color:var(--gold-2)}
.cta-band p{color:var(--ink-2); max-width:580px; margin:20px auto 0; line-height:1.62}
.cta-band .cta{display:flex; gap:14px; justify-content:center; margin-top:34px; flex-wrap:wrap}
.cta-band .addr{font-family:var(--mono); font-size:11px; letter-spacing:.07em; color:var(--ink-3); margin-top:30px}

/* prose blocks for text-heavy pages (about/heritage/compliance) */
.prose{max-width:720px; margin:0 auto}
.prose p{color:var(--ink-2); font-size:16px; line-height:1.75; margin-top:18px}
.prose p:first-child{margin-top:0}
.prose h3{font-family:var(--serif); font-weight:400; font-size:24px; color:var(--ink); margin-top:40px}
.prose em{color:var(--gold-2); font-style:italic}
.prose a{color:var(--gold-2); text-decoration:underline}
.prose strong{color:var(--ink); font-weight:600}
.prose ul{margin:18px 0 0; padding-left:20px; color:var(--ink-2); line-height:1.7}
.prose li{margin-top:8px}
.prose .twi{font-family:var(--akan); font-style:italic; color:var(--gold-2); font-size:18px}

/* left-aligned section heads (sub-pages override the homepage centering when wanted) */
.band.left .kicker, .band.left h2.sec, .band.left .sec-lede{margin-left:0; margin-right:0; text-align:left}

/* founder block (about) */
.founder{display:grid; grid-template-columns:200px 1fr; gap:38px; align-items:start; max-width:840px; margin:46px auto 0}
.headshot{width:200px; height:200px; object-fit:cover; border-radius:4px; border:1px solid var(--line); display:block; background:var(--card-2)}
.founder h3{font-family:var(--serif); font-weight:400; font-size:26px; color:var(--ink); margin-bottom:4px}
.founder .role{font-family:var(--mono); font-size:10.5px; letter-spacing:.15em; text-transform:uppercase; color:var(--gold); margin-bottom:16px}
.founder p{color:var(--ink-2); font-size:15px; line-height:1.7; margin-top:12px}
.founder p:first-of-type{margin-top:0}
.founder strong{color:var(--ink); font-weight:600}
.founder .links{display:flex; gap:14px; flex-wrap:wrap; margin-top:20px}
.founder .links a{font-family:var(--mono); font-size:11.5px; letter-spacing:.04em; color:var(--gold-2); text-decoration:none; border-bottom:1px solid var(--line); padding-bottom:2px}
.founder .links a:hover{color:var(--gold); border-color:var(--gold)}
@media(max-width:680px){ .founder{grid-template-columns:1fr; gap:22px} .headshot{margin:0 auto} }

/* proverb anchor band */
.proverb-band{text-align:center}
.proverb-band .pv{font-family:var(--akan); font-style:italic; font-size:clamp(24px,4vw,38px); background:linear-gradient(135deg,var(--gold-deep),var(--gold),var(--gold-2) 60%,var(--gold-deep)); -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent; line-height:1.25}
.proverb-band .tr{font-family:var(--mono); font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--ink-3); margin-top:16px}

/* milestone table cells carry a title + sub */
.gtable .mt{font-family:var(--serif); font-size:16px; color:var(--ink); display:block; margin-bottom:5px}
.gtable .ms{font-size:13px; color:var(--ink-2); line-height:1.55}
.gtable code{font-family:var(--mono); font-size:12px; color:var(--gold-2)}

/* feature-card label + meta (compliance/doc cards) */
.fcard .lbl{font-family:var(--mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); display:block; margin-bottom:12px}
.fcard .meta{font-family:var(--mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3); margin-top:16px; display:block}
.fcard .credit{font-family:var(--mono); font-size:10.5px; letter-spacing:.06em; color:var(--ink-3); margin:-4px 0 12px}

/* centered pull-quote */
.pullquote{font-family:var(--serif); font-weight:300; font-style:italic; font-size:clamp(20px,2.7vw,28px); line-height:1.42; color:var(--ink); max-width:840px; margin:48px auto 0; text-align:center; padding:0 20px}
.pullquote em{color:var(--gold-2); font-style:italic}

/* code block (technical specs / endpoints) */
.codeblock{font-family:var(--mono); font-size:11.5px; color:#79C9A0; background:var(--bg-2); border:1px solid var(--line-2); border-radius:3px; padding:9px 11px; margin-top:12px; display:block; overflow-x:auto; line-height:1.55; white-space:pre-wrap; word-break:break-word}
.codeblock + .codeblock{margin-top:8px}

/* key-value spec table variant */
.gtable.kv td:first-child{font-family:var(--mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--gold); vertical-align:top; width:170px}
.gtable.kv td{font-size:13px}
.gtable.kv code{font-family:var(--mono); font-size:11.5px; color:var(--gold-2); word-break:break-all}
.gtable.kv a{color:var(--gold-2); text-decoration:underline; word-break:break-all}

/* council card highlight + verdict */
.fcard.lead{background:var(--card-2); border-left:2px solid var(--gold)}
.fcard .verdict{font-family:var(--mono); font-size:11px; color:var(--gold-2); margin-top:14px; padding-top:12px; border-top:1px solid var(--line-soft); display:block; line-height:1.5}

/* contracts ledger table — addresses */
.gtable .addr a{font-family:var(--mono); font-size:12px; color:var(--gold-2); text-decoration:none; word-break:break-all}
.gtable .addr a:hover{text-decoration:underline}

/* FAQ accordion */
.faq{max-width:820px; margin:46px auto 0}
.faq details{border-bottom:1px solid var(--line-2); padding:22px 4px}
.faq summary{cursor:pointer; font-family:var(--serif); font-size:19px; color:var(--ink); list-style:none; display:flex; justify-content:space-between; gap:16px; align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+'; color:var(--gold); font-family:var(--mono); font-size:20px; flex:none}
.faq details[open] summary::after{content:'\2212'}
.faq details p{color:var(--ink-2); font-size:15px; line-height:1.7; margin-top:14px}
.faq details p a{color:var(--gold-2); text-decoration:underline}
.faq details code{font-family:var(--mono); font-size:12px; color:var(--gold-2)}

/* section TOC chip row */
.toc{display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin-top:40px}
.toc a{font-family:var(--mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-2); border:1px solid var(--line-2); border-radius:2px; padding:7px 13px; transition:all .2s}
.toc a:hover{border-color:var(--gold); color:var(--gold-2)}

/* ── CSP-safe utility classes (replace inline styles on sub-pages) ── */
.u-code{color:#79C9A0}
.u-gold{color:var(--gold-2)}
.u-ink2{color:var(--ink-2)}
.u-inkn{color:var(--ink); font-weight:400}
.u-goldu{color:var(--gold-2); text-decoration:underline}
.u-goldumono{color:var(--gold-2); text-decoration:underline; font-family:var(--mono); font-size:11px}
.u-inhu{color:inherit; text-decoration:underline}
.u-monog{font-family:var(--mono); font-size:.85em; color:var(--gold-2)}
.u-serif18{font-family:var(--serif); font-size:18px; color:var(--ink); line-height:1.6}
.u-mx900{max-width:900px; margin-left:auto; margin-right:auto}
.u-cx{text-align:center; margin-left:auto; margin-right:auto}
.u-mt46{margin-top:46px}.u-mt40{margin-top:40px}.u-mt18{margin-top:18px}.u-mt14{margin-top:14px}.u-mt1{margin-top:1px}
.u-mt20c{margin-top:20px; text-align:center}
.u-mr8{margin-right:8px}
.u-w90{width:90px}.u-w130{width:130px}.u-w110{width:110px}
.u-dispxl{font-size:clamp(46px,7vw,86px)}
.u-h2sm{font-size:clamp(26px,3.6vw,40px)}
.u-h3c{font-size:clamp(20px,2.6vw,26px); margin-top:60px; text-align:center; margin-left:auto; margin-right:auto}
.u-h3cb{font-size:clamp(22px,3vw,30px); margin-top:64px; text-align:center; margin-left:auto; margin-right:auto}
.u-btnrow{display:flex; gap:14px; justify-content:center; margin-top:24px; flex-wrap:wrap}
.u-noteA{text-align:center; margin:46px auto 0; max-width:760px; line-height:1.8}
.u-noteB{text-align:center; margin:28px auto 0; max-width:760px}
.u-noteC{text-align:center; margin:24px auto 0; max-width:720px}
.u-noteD{text-align:center; margin:18px auto 0}
.u-noteE{text-align:center; margin:14px auto 0; max-width:720px}
.u-noteF{text-align:center; margin:0 auto 8px}
.u-noteG{max-width:820px; margin:34px auto 0; text-align:center; line-height:1.8}
.u-noteH{max-width:760px; margin:30px auto 0; text-align:center; line-height:1.75}
.u-noteI{margin-top:24px; font-style:italic; max-width:760px; margin-left:auto; margin-right:auto; text-align:center; line-height:1.7}

/* framework list (regulators matrix) */
.flist{list-style:none; margin-top:18px; display:grid; gap:14px}
.flist li{font-size:13px; color:var(--ink-2); line-height:1.55; padding-bottom:14px; border-bottom:1px solid var(--line-2)}
.flist li:last-child{border-bottom:none; padding-bottom:0}
.flist strong{color:var(--ink); display:block; margin-bottom:4px; font-family:var(--serif); font-weight:400; font-size:14.5px}
.flist .st{display:inline-block; margin-top:8px; font-family:var(--mono); font-size:9.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-2); border:1px solid var(--line-2); border-radius:2px; padding:3px 8px}

/* KPI grid (transparency) */
.kpis{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; margin-top:46px; background:var(--line-2); border:1px solid var(--line-2)}
.kpi{background:var(--bg); padding:24px 20px}
.kpi .kl{font-family:var(--mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3)}
.kpi .kv{font-family:var(--serif); font-size:32px; color:var(--gold-2); margin:9px 0 7px; line-height:1}
.kpi .kv .unit{font-size:.45em; color:var(--gold)}
.kpi .km{font-size:11px; color:var(--ink-2); line-height:1.5}
@media(max-width:820px){.kpis{grid-template-columns:repeat(2,1fr)}}

/* callout (disclosures) */
.callout{margin:24px auto 0; padding:18px 22px; background:rgba(201,162,75,.05); border-left:3px solid var(--gold); border-radius:0 4px 4px 0; font-size:13px; color:var(--ink-2); line-height:1.62; max-width:900px}
.callout b{color:var(--gold-2); display:block; font-family:var(--mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase; margin-bottom:8px}
.callout code{font-family:var(--mono); font-size:12px; color:var(--gold-2)}

/* event feed (transparency) */
.feed{font-family:var(--mono); font-size:12px; margin-top:0}
.feed .row{display:flex; justify-content:space-between; gap:12px; padding:9px 0; border-bottom:1px dashed var(--line-2); color:var(--ink-2); flex-wrap:wrap}
.feed .row:last-child{border-bottom:none}
.feed .t{color:var(--ink-3); flex:none}
.pill.rej{color:#E07A5F; border-color:rgba(224,122,95,.4)}

/* mitigation sub-block (risk cards) */
.fcard .mitig{margin-top:15px; padding-top:14px; border-top:1px solid var(--line-soft)}
.fcard .mitig .ml{font-family:var(--mono); font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:#79C9A0; margin-bottom:8px; display:block}
.fcard .mitig p{font-size:12.5px; color:var(--ink-2); line-height:1.75; margin:0}
.fcard .mitig a{color:var(--gold-2); text-decoration:underline}

/* prose code + section headings (legal/policy docs) */
.prose code{font-family:var(--mono); font-size:12.5px; color:var(--gold-2); word-break:break-word}
.prose h3.docsec{font-family:var(--serif); font-weight:400; font-size:25px; color:var(--ink); margin-top:52px; padding-top:30px; border-top:1px solid var(--line-2)}
.prose h3.docsec:first-child{margin-top:0; padding-top:0; border-top:none}
.prose .twi{display:block; margin:6px 0 14px}
.prose .last-updated{font-family:var(--mono); font-size:11px; letter-spacing:.04em; color:var(--ink-3); margin-top:14px}

/* diligence two-column + form */
.dgrid{display:grid; grid-template-columns:1.1fr .9fr; gap:48px; margin-top:46px; align-items:start}
@media(max-width:900px){.dgrid{grid-template-columns:1fr; gap:36px}}
.dform-card{background:var(--card); border:1px solid var(--line); border-radius:4px; padding:34px 30px}
@media(min-width:901px){.dform-card{position:sticky; top:96px}}
.dform-head h2{font-family:var(--serif); font-weight:400; font-size:24px; color:var(--ink)}
.dform-head p{font-family:var(--mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--gold); margin:6px 0 22px}
.dform .fld{margin-bottom:16px}
.dform label{display:block; font-family:var(--mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-2); margin-bottom:7px}
.dform .req{color:var(--gold)}
.dform input,.dform select,.dform textarea{width:100%; font-family:var(--sans); font-size:14px; background:var(--bg-2); border:1px solid var(--line-2); color:var(--ink); padding:11px 13px; border-radius:3px}
.dform input:focus,.dform select:focus,.dform textarea:focus{outline:none; border-color:var(--gold)}
.dform textarea{min-height:92px; resize:vertical}
.dform .checkbox-row{display:flex; gap:10px; align-items:flex-start; margin:18px 0; font-size:12.5px; color:var(--ink-2); line-height:1.5}
.dform .checkbox-row input{width:auto; margin-top:3px; flex:none}
.dform .submit-btn{width:100%; font-family:var(--mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; background:var(--gold); color:var(--bg); border:none; padding:15px; border-radius:2px; font-weight:500; cursor:pointer; transition:background .2s}
.dform .submit-btn:hover{background:var(--gold-2)}
.dform .submit-foot{font-size:11px; color:var(--ink-3); text-align:center; margin-top:14px; line-height:1.5}
.dform .fallback{margin-top:18px; padding-top:16px; border-top:1px solid var(--line-2); font-size:12px; color:var(--ink-3); text-align:center}
.dform .fallback a{color:var(--gold-2); text-decoration:underline}

/* gated detail list */
.gated{list-style:none; display:grid; gap:16px; margin:22px 0; padding:0}
.gated li{display:flex; gap:14px}
.gated .num{font-family:var(--mono); font-size:13px; color:var(--gold-2); flex:none; width:28px; padding-top:2px}
.gated b{color:var(--ink)}
.gated li>div{font-size:14px; color:var(--ink-2); line-height:1.6}
.gated code{font-family:var(--mono); font-size:11px; color:var(--gold-2); word-break:break-all}

/* final sub-page utilities */
.u-mx820{max-width:820px; margin-left:auto; margin-right:auto}
.u-hidden{display:none}
.u-ink{color:var(--ink)}
.u-mt36{margin-top:36px}
.cb-label{font-family:var(--sans); text-transform:none; letter-spacing:0; font-size:12.5px; color:var(--ink-2)}

/* ════════════════════════════════════════════════════════════════════════
   LIGHT / INSTITUTIONAL THEME · 2026-06-08 (mirror of genesis-home flip)
   Warm-paper, asset-manager register. Token-driven: this later :root wins.
   Deliberate dark accents (.skip-link, technical .inst-* band, press swatches)
   are LEFT dark on purpose — they read as intentional punctuation on light.
   Reversible — delete this block to return to near-black.
   ════════════════════════════════════════════════════════════════════════ */
:root{
  --bg:#F7F4EE; --bg-2:#FCFAF4; --card:#FFFFFF; --card-2:#F3EEE4;
  --ink:#16202E; --ink-2:#454F5D; --ink-3:#5A626D; /* lifted 69727E→5A626D for WCAG-AA on cream (~5.2:1) */
  --gold:#836413; --gold-2:#6E5414; --gold-deep:#5C4711; /* darkened for WCAG-AA on cream: small gold labels now ~5:1 */
  --line:rgba(159,123,36,.34); --line-soft:rgba(159,123,36,.16); --line-2:rgba(22,32,46,.11);
}
/* hardcoded dark surfaces → light */
.util{background:#F0EBE0;}
nav{background:rgba(247,244,238,.86);}
.btn-wait,.btn-wait:hover,.btn-primary,.btn-primary:hover,.dform .submit-btn,.dform .submit-btn:hover{color:#FFFFFF;}
.hero::before{background:radial-gradient(ellipse 64% 52% at 50% 2%, rgba(159,123,36,.10) 0%, transparent 60%);}
.cov,.step{background:var(--card);}
@media (hover:hover){.cov:hover,.step:hover{box-shadow:0 14px 30px rgba(22,32,46,.12);}}
.gtable tr:hover td{background:rgba(22,32,46,.025);}
/* status colours legible on light */
.match.ok,.pill.live,.fcard .mitig .ml{color:#2F855A;}
.pill.live{border-color:rgba(47,133,90,.4);}
.pill.rej,.feed .pill.rej{color:#C0492E;border-color:rgba(192,73,46,.4);}
/* code blocks stay a dark inset on light — intentional terminal chip */
.codeblock{background:#0C1017;color:#8FE3B4;border-color:rgba(22,32,46,.18);}
/* mobile drawer · light (when a sub-page gains the hamburger later) */
@media(max-width:820px){
  .navlinks{background:rgba(255,255,255,.985);box-shadow:0 18px 40px rgba(22,32,46,.16);}
}

/* ── Mobile nav · hamburger drawer (sub-pages) 2026-06-08 (breakpoint raised 820→1080 so landscape phones + iPad-landscape get the drawer instead of an overflowing full nav) ── */
.nav-toggle{display:none;}
@media(max-width:1080px){
  .nav-toggle{display:flex;flex-direction:column;justify-content:center;gap:5px;
    width:44px;height:44px;padding:11px;margin-left:auto;background:none;border:0;cursor:pointer;-webkit-tap-highlight-color:transparent;z-index:120;}
  .nav-toggle span{display:block;height:2px;width:100%;background:var(--gold,#9F7B24);border-radius:2px;
    transition:transform .28s ease,opacity .2s ease;}
  .nav-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .nav-toggle.is-open span:nth-child(2){opacity:0;}
  .nav-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
  nav .wrap{position:relative;}
  .navlinks{display:none;position:absolute;top:calc(100% + 1px);left:0;right:0;
    flex-direction:column;align-items:stretch;gap:0;
    background:rgba(255,255,255,.985);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
    border-top:1px solid var(--line);border-bottom:1px solid var(--line);
    box-shadow:0 18px 40px rgba(22,32,46,.16);padding:6px 22px 18px;}
  .navlinks.open{display:flex;animation:navDrop .26s ease;}
  .navlinks a{padding:15px 2px;font-size:16px;border-bottom:1px solid rgba(22,32,46,.08);}
  .navlinks a:not(.btn-wait)::after{display:none;}
  .navlinks .btn-wait{margin-top:14px;text-align:center;border-bottom:0;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.45)!important;transform:none!important;}
  .navlinks .btn-wait:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.5)!important;transform:none!important;}
  @keyframes navDrop{from{opacity:0;transform:translateY(-8px);}to{opacity:1;transform:translateY(0);}}
}
@media (prefers-reduced-motion:reduce){.navlinks.open{animation:none;}.nav-toggle span{transition:none;}}
/* ── Polished / metallic gold · light theme 2026-06-08 (sub-pages) ── */
h1.page em, h1.display em, h2.sec em, .cta-band h2 em, .rule-band h2 em{
  background:linear-gradient(120deg,#7A5C16 0%,#A6801F 28%,#EBCE73 50%,#A6801F 72%,#7A5C16 100%);
  -webkit-background-clip:text; background-clip:text;
  color:transparent; -webkit-text-fill-color:transparent;
}
.kpi .kv{
  background:linear-gradient(120deg,#7A5C16 0%,#A6801F 30%,#E7C868 50%,#A6801F 70%,#7A5C16 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent;
}
.btn-primary, .btn-wait, .dform .submit-btn{
  background:linear-gradient(180deg,#CBA34D 0%,#A6801F 54%,#856312 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 3px 10px rgba(120,92,20,.28);
  color:#FFFFFF; border:none;
}
.btn-primary:hover, .btn-wait:hover, .dform .submit-btn:hover{
  background:linear-gradient(180deg,#DAB45E 0%,#B68C26 54%,#8E6A14 100%);
}
/* nav waitlist CTA · 2026-06-13 — promote from cramped chip to a prominent struck-gold pill (site-wide) */
.btn-wait{
  font-size:12px; letter-spacing:.13em; font-weight:600; padding:13px 26px; border-radius:10px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55), 0 5px 16px rgba(120,92,20,.34);
  transition:transform .18s ease, box-shadow .2s ease, background .2s ease;
}
.btn-wait:hover{
  transform:translateY(-1px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6), 0 9px 24px rgba(120,92,20,.46);
}
.btn-wait:active{transform:translateY(0)}

/* embedded figures (attestation flow + XRF spectrum) — technical.html */
.flow-visual{margin:40px auto 0;max-width:940px}
.flow-visual img{width:100%;height:auto;display:block}
.spectrum-visual{margin:36px auto 0;max-width:900px}
.spectrum-visual img{width:100%;height:auto;display:block;border-radius:16px;box-shadow:0 18px 50px rgba(7,10,17,.28)}