/* Deployed Advisory / site styles v3 / REV 2026-08-28
   Built to the brand book v1.0 + AMENDMENTS A9–A17. Ink cover hero (book §07), Paper ground, one Ink interlude per page.
   Rail grid: 1280 / 260 rail / 48 gutter. Two radii: 12 containers, 6 controls. Green ≤5%: full stop, dots on true status, one bar, one CTA, links. */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#F4F6F7;font-family:'Archivo',sans-serif;color:#0B1B2B;-webkit-font-smoothing:antialiased}
@keyframes dsFade{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
button{font:inherit}
h1,h2,h3,h4{margin:0}
/* ---------- The ramp (Sep 4, 2026) ----------
   Two scales, and nothing outside them. Text steps 11 / 12 / 13 / 14 / 16 / 18 / 20;
   display steps 24 / 26 / 30 / 36 / 40 / 44 / 48 / 56 / 72 / 84. Space is a 4px grid:
   4 / 8 / 12 / 16 / 20 / 24 / 32 / 40 / 48 / 56 / 64 / 72 / 80 / 104.
   Vertical rhythm holds one ratio at every width: section break : block break : paragraph
   is roughly 4 : 1.8 : 1 (desktop 104 / 40 / 22, phone 72 / 32 / 18).
   Rules carry two levels only: 1px Ink for a section or card boundary, 1px rule-light for
   anything subordinate. On a phone every rule is the same width, so weight is the grammar. */
:root{
  --t-11:11px;--t-12:12px;--t-13:13px;--t-14:14px;--t-16:16px;--t-18:18px;--t-20:20px;
  --d-24:24px;--d-26:26px;--d-30:30px;--d-36:36px;--d-40:40px;--d-44:44px;--d-48:48px;--d-56:56px;--d-72:72px;--d-84:84px;
  --s-4:4px;--s-8:8px;--s-12:12px;--s-16:16px;--s-20:20px;--s-24:24px;--s-32:32px;--s-40:40px;--s-48:48px;--s-56:56px;--s-64:64px;--s-72:72px;--s-80:80px;--s-104:104px;
}
:root{--serif:'Source Serif 4',Georgia,serif;--ink:#0B1B2B;--paper:#F4F6F7;--green:#16B364;--gtxt:#0E7A45;--glight:#7FE3AE;--graph:#5A6B7A;--muted-dark:#AEBECB;--faint-dark:#7C8B99;--rule:#0B1B2B;--rule-light:#D5DDE1;--rail:260px;--gutter:48px;--max:1280px}
.mono{font-family:'IBM Plex Mono',monospace}
.vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--ink);color:var(--paper);font-family:'IBM Plex Mono',monospace;font-size:13px;padding:12px 18px;border-radius:6px;text-decoration:none}
.skip:focus{left:12px;top:12px}
/* Focus is a designed state, not a browser default. Green on Paper, Paper on Ink. */
:focus-visible{outline:2px solid var(--green);outline-offset:2px}
.ds-nav :focus-visible,.ds-footer :focus-visible,.sec-ink :focus-visible,.res-hero :focus-visible,.modal-overlay :focus-visible{outline-color:var(--paper)}
.gstop{color:var(--green)}
.wrap{max-width:var(--max);margin:0 auto;padding:0 40px}
.ph{background:#B7791F;color:#fff;padding:0 6px;border-radius:6px;font-family:'IBM Plex Mono',monospace;font-size:.85em} /* counsel/founder gate: amber until cleared */

/* ---------- Nav (Ink) ---------- */
.ds-nav{position:sticky;top:0;z-index:50;background:var(--ink);border-bottom:1px solid rgba(255,255,255,.08)}
.ds-nav .inner{max-width:var(--max);margin:0 auto;padding:0 40px;height:72px;display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none}
.brand .dot{width:12px;height:12px;border-radius:50%;background:var(--green);display:block}
.brand .words{display:flex;align-items:baseline;gap:9px;font-size:20px;line-height:1;white-space:nowrap}
.brand .w1{font-weight:800;color:#FFF;letter-spacing:.01em}
.brand .w2{font-weight:400;color:#8A99A6;letter-spacing:.01em}
.nav-right{display:flex;align-items:center;gap:38px}
.navlinks{display:flex;align-items:center;gap:30px}
.navlink{display:flex;align-items:center;gap:7px;text-decoration:none;font-family:'IBM Plex Mono',monospace;font-size:13px;letter-spacing:.04em;color:var(--paper);font-weight:500}
.navlink .adot{width:6px;height:6px;border-radius:50%;background:var(--green);display:none}
.navlink.active .adot{display:block}
.navlink-cta{display:none}
.btn-cta{background:var(--green);border:none;cursor:pointer;color:#04140A;font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:13px;letter-spacing:.02em;padding:11px 18px;border-radius:6px}
.btn-cta:hover,.btn-green:hover{filter:brightness(1.07)}
.nav-menu{display:none;background:none;border:1px solid rgba(255,255,255,.22);color:var(--paper);font-family:'IBM Plex Mono',monospace;font-size:13px;padding:9px 12px;border-radius:6px;cursor:pointer}

/* ---------- Buttons / links ---------- */
.btn-green{background:var(--green);border:none;cursor:pointer;color:#04140A;font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:16px;padding:16px 26px;border-radius:6px}
.btn-green.lg{font-size:16px;padding:17px 32px}
.btn-ink{background:var(--ink);border:none;cursor:pointer;color:var(--paper);font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:14px;padding:15px 26px;border-radius:6px;text-decoration:none;display:inline-block}
.btn-ink:hover{background:#132a40}
.link-green{background:none;border:none;cursor:pointer;padding:0;color:var(--gtxt);font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:14px;text-decoration:none}
.link-lightgreen{background:none;border:none;cursor:pointer;padding:0;color:var(--glight);font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:14px;text-decoration:none}
.link-green:hover,.link-lightgreen:hover{text-decoration:underline}

/* ---------- Labels: one eyebrow per page (hero), folios elsewhere. Dots only on true status. ---------- */
.eyebrow{margin-bottom:24px}
.eyebrow .label{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--graph)}
.eyebrow.on-dark .label{color:var(--glight)}
.folio{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--graph);margin-bottom:14px}
.folio.on-dark{color:var(--faint-dark)}
.chip{display:inline-flex;align-items:center;gap:9px;font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--paper);border:1px solid var(--green);padding:8px 12px;border-radius:6px;margin-bottom:28px} /* book §05 status chip: one per layout, true statements only */
.chip .sdot{width:7px;height:7px;border-radius:50%;background:var(--green);display:inline-block}
.sdot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);margin-right:8px;vertical-align:middle;position:relative;top:-1px}

/* ---------- The Full Stop system ---------- */
/* The square is Archivo's period and the wordmark's full stop: the mark of completion. Ink when it closes a section; green only when it closes something true and done. It never pulses (the dot is alive, the square is finished), never rounds, never rotates. */
.endmark{display:inline-block;width:.46em;height:.46em;background:currentColor;margin-left:.4em;vertical-align:baseline;position:relative;top:-.02em}
.endmark.done{background:var(--green)}
.nb{white-space:nowrap}
.prog{display:flex;gap:6px;align-items:center;margin:18px 0 0}
.prog i{display:block;width:12px;height:12px;background:#fff;border:1px solid var(--rule-light)}
.prog i.on{background:var(--ink);border-color:var(--ink)}
.prog i.done{background:var(--green);border-color:var(--green)}
.prog span{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--graph);margin-left:10px;letter-spacing:.04em}

/* ---------- A19 / editorial body in Source Serif 4 (ledger, record, operator and Index body) ---------- */
.editorial{font-family:var(--serif)}
.editorial.prose{font-size:20px;line-height:1.6}

/* ---------- Sections and the rail ---------- */
.sec-ink{background:var(--ink);color:var(--paper)}
.sec-paper{background:var(--paper)}
.rail-sec{display:grid;grid-template-columns:var(--rail) 1fr;gap:0 var(--gutter);padding:104px 0;border-top:1px solid var(--rule)}
.sec-ink .rail-sec{border-top-color:rgba(255,255,255,.14)}
.rail-sec.tight{padding:72px 0}
.rail{position:sticky;top:100px;align-self:start}
.rail h2{font-size:30px;line-height:1.08;font-weight:800;letter-spacing:-.02em;margin:0;color:var(--ink)}
.sec-ink .rail h2{color:var(--paper)}
.rail .note{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.06em;color:var(--graph);margin-top:22px;line-height:1.7}
.sec-ink .rail .note{color:var(--faint-dark)}
.body{min-width:0}
.display{font-size:44px;line-height:1.08;font-weight:800;letter-spacing:-.02em;margin:0 0 28px;max-width:20ch;color:var(--ink)}
.sec-ink .display{color:var(--paper)}
.display.stmt{font-size:36px;line-height:1.15;max-width:26ch}
.prose{font-size:20px;line-height:1.65;color:var(--ink);max-width:66ch}
.prose p{margin:0 0 22px}
.prose p:last-child{margin-bottom:0}
.prose b{font-weight:700}
.prose b.gt{color:var(--gtxt)}
.sec-ink .prose{color:var(--muted-dark)}
.sec-ink .prose b{color:var(--paper)}
.two{display:grid;grid-template-columns:1fr 440px;gap:56px;align-items:start}
.two.wide{grid-template-columns:1fr minmax(0,480px)}
.two.split{grid-template-columns:1.1fr 1fr;gap:64px}
.two.op{grid-template-columns:1fr 420px}

/* ---------- Hero (Paper, A18: status block left, promise right) ---------- */
.hero-paper{background:var(--paper);color:var(--ink)}
.hero-paper .wrap{display:grid;grid-template-columns:var(--rail) 1fr;gap:0 var(--gutter);padding-top:80px;padding-bottom:80px;align-items:end}
/* Sub-page heroes have no status block: a lone child must span both columns, not sit in the 260px rail (fix Sep 14). Home has two children and is unaffected. */
.hero-paper .wrap>div:only-child{grid-column:1 / -1}
.status{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);line-height:2}
.status .g{color:var(--graph)}
.hero-paper h1{font-size:84px;line-height:.98;font-weight:800;letter-spacing:-.03em;max-width:13ch;margin:0 0 28px;color:var(--ink)}
.hero-paper .sub{font-size:20px;line-height:1.55;color:var(--graph);max-width:46ch;margin:0 0 36px}
.hero-paper .btns{display:flex;flex-wrap:wrap;align-items:center;gap:28px}
.hero-paper .hero-sub{color:var(--ink)}
.hero-paper .hero-sub-p{color:var(--graph)}

/* ---------- Hero (Ink cover, retained for print covers) ---------- */
.hero{position:relative;overflow:hidden}
.hero .wrap{position:relative;padding-top:96px;padding-bottom:0}
.hero h1{font-size:84px;line-height:.98;font-weight:800;letter-spacing:-.03em;max-width:13ch;margin:0 0 30px}
.hero .sub{font-size:20px;line-height:1.55;color:var(--muted-dark);max-width:46ch;margin:0 0 40px}
.hero .btns{display:flex;flex-wrap:wrap;align-items:center;gap:28px;padding-bottom:88px}
.hero .spec{position:absolute;right:40px;top:104px;font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint-dark);text-align:right;line-height:2}
.hero-sub{font-size:56px;line-height:1.04;font-weight:800;letter-spacing:-.025em;max-width:18ch;margin:0 0 24px}
.hero-sub-p{font-size:20px;line-height:1.6;color:var(--muted-dark);max-width:62ch;margin:0}

/* ---------- Credibility strip (proof at scale; the credential's designated slot) ---------- */
.strip{border-top:1px solid rgba(255,255,255,.14)}
.strip .wrap{display:grid;grid-template-columns:repeat(3,1fr);gap:0 var(--gutter);padding-top:36px;padding-bottom:44px}
.strip .wrap>div{border-left:1px solid rgba(255,255,255,.14);padding-left:22px}
.strip .wrap>div:first-child{border-left:0;padding-left:0}
.strip .n{font-size:56px;font-weight:800;letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums;color:var(--paper)}
.strip .n small{font-family:'IBM Plex Mono',monospace;font-size:20px;font-weight:600;letter-spacing:0;color:var(--glight);margin-left:6px}
.strip .l{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-dark);margin-top:12px;line-height:1.6;max-width:36ch}

/* ---------- Standing terms (spec framing) ---------- */
.standing{border-top:2px solid var(--ink);margin-top:40px;padding-top:18px}
.standing .hd{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--graph);margin-bottom:14px}
.standing dl{margin:0;display:grid;grid-template-columns:150px 1fr;gap:0 24px}
.standing dt{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--graph);padding:12px 0;border-top:1px solid var(--rule-light)}
.standing dd{margin:0;font-size:16px;line-height:1.55;color:var(--ink);padding:11px 0 12px;border-top:1px solid var(--rule-light)}

/* ---------- Definition list / rule list ---------- */
.rulelist{margin:0}
.rulelist dt{font-size:16px;font-weight:700;border-top:1px solid var(--rule);padding-top:14px;margin:0;color:var(--ink)}
.rulelist dd{font-size:14px;line-height:1.55;color:var(--graph);margin:6px 0 20px}
.rulelist dd:last-child{margin-bottom:0}
.sec-ink .rulelist dt{color:var(--paper);border-top-color:rgba(255,255,255,.18)}
.sec-ink .rulelist dd{color:var(--muted-dark)}
.deflist{display:grid;grid-template-columns:120px 1fr;gap:13px 24px;font-size:16px;line-height:1.65}
.deflist .lbl{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--graph);padding-top:3px;letter-spacing:.04em}
.deflist .for{color:var(--ink)}
.deflist .val{color:var(--graph)}
.sec-ink .deflist .lbl{color:var(--glight)}
.sec-ink .deflist .for{color:var(--paper)}
.sec-ink .deflist .val{color:var(--muted-dark)}

/* ---------- Document frame (the real artifact) ---------- */
.docframe{width:100%;max-width:480px;overflow:hidden;background:#fff;border:1px solid var(--ink);border-radius:12px}
.docframe img{display:block;width:100%;height:auto}
.docframe.on-dark{border-color:transparent}
.cap{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.04em;line-height:1.7;color:var(--graph);margin-top:12px;max-width:480px}
.sec-ink .cap{color:var(--faint-dark)}
.counter[hidden]{display:none}
.counter{margin-top:36px;border-top:1px solid var(--rule);padding-top:18px;display:flex;gap:56px}
.counter .n{font-size:56px;font-weight:800;letter-spacing:-.03em;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums}
.counter .l{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--graph);margin-top:10px;line-height:1.6;max-width:22ch}

/* ---------- Self-score (shared) ---------- */
.selfscore{margin-top:36px}
.selfscore #quiz{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.selfscore .qcard{margin-bottom:0}
.selfscore .qcard h3{font-size:16px}
.selfscore .opt{font-size:14px;padding:9px 12px}
.qcard{background:#fff;border:1px solid var(--rule-light);border-radius:12px;padding:24px 28px;margin-bottom:12px}
.qcard .dom{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.14em;color:var(--gtxt);display:block;margin-bottom:8px}
.qcard h3{font-size:18px;font-weight:700;line-height:1.4;margin:0 0 14px}
.opts{display:flex;flex-wrap:wrap;gap:8px}
.opt{display:flex;align-items:center;gap:10px;border:1px solid var(--rule-light);border-radius:6px;padding:10px 14px;cursor:pointer;font-size:14px;color:#33434F;background:#fff}
.opt:hover{border-color:var(--graph)}
.opt input{accent-color:var(--green);margin:0}
.opt.sel{border-color:var(--ink);background:var(--paper);color:var(--ink);font-weight:600}
.score-btn{margin:18px 0 0}
#results{display:none}
.res-hero{background:var(--ink);color:var(--paper);border-radius:12px;padding:40px 36px;text-align:left;display:grid;grid-template-columns:auto 1fr;gap:32px;align-items:center}
.res-hero .n{font-family:'IBM Plex Mono',monospace;font-size:72px;font-weight:600;color:var(--paper);line-height:1}
.res-hero .n.good{color:var(--green)}
.res-hero .n span{font-size:30px;color:var(--glight)}
.res-hero .band{font-size:24px;font-weight:800;margin:0 0 10px}
.res-hero .expl{font-size:16px;line-height:1.6;color:var(--muted-dark);max-width:56ch;margin:0}
.doms{margin-top:16px;background:#fff;border:1px solid var(--rule-light);border-radius:12px;padding:20px 28px}
.dom-row{display:flex;align-items:center;gap:16px;padding:10px 0;border-bottom:1px solid #EDF0F2}
.dom-row:last-child{border-bottom:none}
.dom-row .lbl{flex:1;font-size:14px;font-weight:600}
.dom-row .val{font-family:'IBM Plex Mono',monospace;font-size:13px;font-weight:600;color:var(--gtxt);width:44px;text-align:right}
.dom-row .bar{width:160px;height:8px;background:#EDF0F2;overflow:hidden}
.dom-row .bar i{display:block;height:100%;background:var(--ink)}
.lead-box{margin-top:16px;border-top:1px solid var(--rule);padding-top:20px}
.lead-box h4{font-size:18px;font-weight:800;margin:0 0 6px}
.lead-box p{font-size:14px;color:var(--graph);margin:0 0 16px}
.lead-row{display:flex;gap:10px;flex-wrap:wrap}
.lead-row input{flex:1;min-width:220px;border:1px solid var(--rule-light);border-radius:6px;padding:13px 14px;font-family:'Archivo',sans-serif;font-size:16px;outline:none}
.lead-row input:focus{border-color:var(--green)}
.fineprint{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.02em;color:var(--graph);margin-top:22px;line-height:1.7;max-width:70ch}

/* ---------- Terms sheet ---------- */
.tablewrap{overflow-x:auto}
table.spec{width:100%;border-collapse:collapse;border-top:2px solid var(--ink)}
table.spec th{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--graph);text-align:left;padding:14px 24px 14px 0;border-bottom:1px solid var(--ink);font-weight:500}
table.spec td{vertical-align:top;padding:24px 24px 24px 0;border-bottom:1px solid var(--rule-light);font-size:16px;line-height:1.55;color:var(--graph)}
table.spec td:first-child,table.spec th:first-child{font-family:'IBM Plex Mono',monospace;font-size:13px;width:48px;color:var(--ink);padding-top:27px}
table.spec td:nth-child(2){width:48%;color:var(--ink)}
table.spec td:nth-child(2) a{color:var(--ink);font-weight:800;font-size:20px;letter-spacing:-.01em;text-decoration:none;line-height:1.2;display:block;margin-bottom:6px}
table.spec td:nth-child(2) a:hover{color:var(--gtxt)}
table.spec td:last-child{font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--ink);white-space:nowrap;padding-right:0;padding-top:28px}

/* ---------- Three doors (Home entry points) ---------- */
.doors{display:grid;grid-template-columns:repeat(3,1fr);gap:0 var(--gutter)}
.door{display:block;text-decoration:none;border-top:2px solid var(--ink);padding-top:18px;color:var(--ink)}
.door .when{display:block;font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--graph);margin-bottom:12px}
.door .name{display:block;font-size:24px;font-weight:800;letter-spacing:-.015em;line-height:1.15;margin-bottom:12px}
.door:hover .name{color:var(--gtxt)}
.door .terms{display:block;font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--ink)}
.doors-more{font-size:16px;line-height:1.6;color:var(--graph);margin:40px 0 0;max-width:60ch}

/* ---------- Ledger (launch state: one featured note + subscribe) ---------- */
.note.featured{max-width:66ch}
.note.featured h3{font-size:30px}
.note.featured p{font-size:20px;line-height:1.6}
.subscribe{margin-top:40px;border-top:1px solid var(--rule);padding-top:20px;max-width:66ch}
.subscribe .hd{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--graph);margin-bottom:10px}
.subscribe p{font-size:16px;color:var(--graph);margin:0 0 14px;line-height:1.55}

/* ---------- Ledger ---------- */
.ledger{display:grid;grid-template-columns:repeat(3,1fr);gap:0 var(--gutter)}
.note{border-top:1px solid var(--rule);padding-top:18px}
.note .id{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.14em;color:var(--graph);margin-bottom:12px}
.note h3{font-size:24px;font-weight:800;letter-spacing:-.015em;line-height:1.2;margin:0 0 12px;color:var(--ink)}
.note p{font-size:16px;line-height:1.55;color:var(--ink);margin:0}
.note .sig{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.1em;color:var(--graph);margin-top:14px}

/* ---------- Photo ---------- */
.photo{width:100%;max-width:440px;aspect-ratio:4/5;background:#DDE3E7;border-radius:12px;position:relative;overflow:hidden}
.sec-ink .photo{background:#132a40}
.photo img{width:100%;height:100%;object-fit:cover;display:block}
.photo::after{content:"";position:absolute;left:0;right:0;bottom:0;height:40%;z-index:1;pointer-events:none;background:linear-gradient(to top,rgba(11,27,43,.82),rgba(11,27,43,0))}
.photo.no-cap::after{display:none} /* Sep 14: no caption, no gradient (Record page) */
.photo .cap-in{position:absolute;left:20px;bottom:18px;z-index:2;font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--paper);line-height:1.7}
.sec-ink .photo .cap-in{color:var(--paper)}
.sig-line{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--graph);margin-top:28px}
.sec-ink .sig-line{color:var(--faint-dark)}

/* ---------- Close ---------- */
.close{padding:104px 0;border-top:1px solid var(--rule)}
.close h2{font-size:56px;line-height:1.04;font-weight:800;letter-spacing:-.025em;max-width:18ch;margin:0 0 20px}
.close p{font-size:20px;line-height:1.6;color:var(--graph);max-width:52ch;margin:0 0 34px}
.close .btns{display:flex;flex-wrap:wrap;align-items:center;gap:28px}

/* ---------- Services page ---------- */
.svc .rail .idx{font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--graph);margin-bottom:10px}
.svc-tag{font-family:'IBM Plex Mono',monospace;font-size:13px;font-weight:600;color:var(--gtxt);border:1px solid rgba(14,122,69,.28);padding:7px 12px;border-radius:6px;display:inline-block;margin-bottom:26px}
.sec-ink .svc-tag{color:var(--glight);border-color:rgba(127,227,174,.35)}
.svc .deflist{font-size:16px}
.svc .link-green,.svc .link-lightgreen{display:inline-block;margin-top:26px}
.svc .deflist .guarantee{color:var(--ink)} /* Sep 14: guarantee is a labeled row of the list, not a floating paragraph */
.svc .guarantee small{display:block;font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--graph);margin-top:4px;letter-spacing:.04em}

/* ---------- Record page ---------- */
.record .prose{font-size:20px;line-height:1.7}

/* ---------- Footer ---------- */
.ds-footer{background:var(--ink);color:var(--muted-dark);border-top:1px solid rgba(255,255,255,.08)}
.ds-footer .inner{max-width:var(--max);margin:0 auto;padding:60px 40px 40px}
.foot-top{display:flex;justify-content:space-between;align-items:flex-start;gap:40px;flex-wrap:wrap}
.foot-brand .dot{width:11px;height:11px;border-radius:50%;background:var(--green);display:inline-block}
.foot-brand .row{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.foot-brand .words{display:flex;align-items:baseline;gap:8px;font-size:20px;line-height:1;white-space:nowrap}
.foot-brand .w1{font-weight:800;color:#FFF;letter-spacing:.01em}
.foot-brand .w2{font-weight:400;color:#8A99A6;letter-spacing:.01em}
.foot-brand p{font-size:14px;line-height:1.6;color:var(--faint-dark);margin:0;max-width:340px}
.foot-cols{display:flex;gap:64px;flex-wrap:wrap}
.foot-col .hd{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint-dark);margin-bottom:16px}
.foot-col .links{display:flex;flex-direction:column;gap:11px;align-items:flex-start}
.foot-col a{color:var(--muted-dark);text-decoration:none;font-size:14px}
.foot-col a:hover{color:var(--paper)}
.foot-bottom{margin-top:48px;padding-top:24px;border-top:1px solid rgba(255,255,255,.08);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--faint-dark)}

/* ---------- Modal ---------- */
.modal-overlay{position:fixed;inset:0;z-index:100;background:rgba(11,27,43,.85);display:flex;align-items:center;justify-content:center;padding:24px;animation:dsFade .2s ease-out}
.modal-overlay[hidden]{display:none}
.modal-card{background:#fff;border-radius:12px;width:100%;max-width:480px;padding:40px;position:relative;color:var(--ink)}
.modal-x{position:absolute;top:18px;right:18px;background:none;border:none;cursor:pointer;font-size:24px;color:var(--graph);line-height:1}
.modal-eyebrow{margin-bottom:8px}
.modal-eyebrow .label{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--gtxt)}
.modal-card h3{font-size:26px;font-weight:800;letter-spacing:-.01em;margin:0 0 8px}
.modal-card .sub{font-size:14px;line-height:1.55;color:var(--graph);margin:0 0 24px}
.modal-form{display:flex;flex-direction:column;gap:14px}
.modal-form input,.modal-form textarea{border:1px solid var(--rule-light);border-radius:6px;padding:13px 14px;font-family:'Archivo',sans-serif;font-size:16px;color:var(--ink);outline:none;resize:vertical}
.modal-form input:focus,.modal-form textarea:focus{border-color:var(--green)}
.modal-submit{background:var(--green);border:none;cursor:pointer;color:#04140A;font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:16px;padding:15px;border-radius:6px;margin-top:4px}
.modal-sent{text-align:center;padding:20px 0}
.modal-sent .tile{width:56px;height:56px;border-radius:12px;background:var(--ink);display:flex;align-items:center;justify-content:center;margin:0 auto 22px}
.modal-sent .tile span{width:16px;height:16px;border-radius:50%;background:var(--green);display:block}
.modal-sent h3{font-size:24px;font-weight:800;margin:0 0 12px}
.modal-sent p{font-size:16px;line-height:1.6;color:var(--graph);margin:0 0 24px}
.modal-close-btn{background:var(--ink);border:none;cursor:pointer;color:var(--paper);font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:14px;padding:13px 24px;border-radius:6px}

/* ---------- Legal page ---------- */
.legal{max-width:760px;margin:0 auto;padding:72px 40px 96px;font-size:16px;line-height:1.7;color:#33434F}
.legal h1{font-size:40px;font-weight:800;letter-spacing:-.02em;color:var(--ink);margin:0 0 8px}
.legal h2{font-size:24px;font-weight:800;color:var(--ink);margin:40px 0 12px}
.legal h3{font-size:18px;font-weight:700;color:var(--ink);margin:24px 0 8px}
.legal p,.legal li{margin:0 0 14px}
.legal .meta{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.08em;color:var(--graph);margin-bottom:36px}
.legal .plain{background:#fff;border:1px solid var(--rule-light);border-radius:12px;padding:16px 20px;margin:18px 0 6px;font-size:16px;line-height:1.65;color:#33434F}
.legal a{color:var(--gtxt)}

/* ---------- Responsive ---------- */
@media(max-width:1240px){
  /* Stack before the fixed side column can starve the text column. */
  .two,.two.wide,.two.split,.two.op{grid-template-columns:1fr;gap:40px}
}
@media(max-width:1000px){
  .rail-sec{grid-template-columns:1fr;padding:80px 0}
  /* Stacked: block breaks tighten so a section break still reads as the bigger event. */
  .standing,.subscribe,.counter,.selfscore{margin-top:36px}
  /* Every rule is now the same width, so weight carries the grammar:
     Ink for a section or card boundary, rule-light for anything inside one. */
  .note,.subscribe,.counter,.exit-primary,.rulelist dt,.lead-box{border-top-color:var(--rule-light)}
  .standing{border-top-width:1px}
  .hero-paper .wrap{grid-template-columns:1fr;gap:28px 0;padding:48px 40px 56px}
  /* REV 1 (EB ruling, Sep 4): stacked hero reads promise first. The status block
     follows the CTAs it supports; the REV line is desktop-only. Order only, no
     DOM reordering, so the two-column desktop hero above 1000 is untouched. */
  .hero-paper .wrap>.status{order:2}
  .hero-paper .wrap>div:not(.status){order:1}
  .hero-paper .status .rev{display:none}
  .hero-paper h1{font-size:48px}
  .rail{position:static;margin-bottom:28px}
  .hero h1{font-size:48px}
  .hero-sub{font-size:40px}
  .display.stmt{font-size:30px}
  .note h3{font-size:26px}
  .rail h2{font-size:24px}
  .prose p{margin-bottom:20px}
  .display{font-size:36px}
  .close h2{font-size:40px}
  .hero .spec{display:none}
  .strip .wrap{grid-template-columns:1fr;gap:22px 0}
  .strip .wrap>div{border-left:0;padding-left:0}
  .ledger,.doors{grid-template-columns:1fr;gap:32px}
  .standing dl{grid-template-columns:1fr}
  .standing dt{border-top:1px solid var(--rule-light);padding-bottom:0}
  .standing dd{border-top:none;padding-top:4px}
  .deflist{grid-template-columns:1fr;gap:4px 0}
  .deflist .lbl{padding-top:12px}
  .res-hero{grid-template-columns:1fr}
  .selfscore #quiz{grid-template-columns:1fr}
  .dom-row .bar{width:90px}
}
@media(max-width:720px){
  .wrap,.ds-nav .inner,.ds-footer .inner,.legal{padding-left:24px;padding-right:24px}
  .ds-nav .inner{height:64px}
  .brand .words{font-size:18px}
  .nav-right{gap:10px}
  .hero .wrap{padding-top:64px}
  .hero .btns{padding-bottom:56px}
}


/* ---------- Self-score readout ceremony (doc 52 REV 2, built Sep 1) ---------- */
.quiz-summary{scroll-margin-top:120px;display:flex;justify-content:space-between;align-items:center;border:1px solid #0B1B2B;border-radius:12px;padding:14px 20px;margin-bottom:26px;font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.12em;color:#5A6B7A;background:#fff}
.quiz-summary .qs-edit{background:none;border:none;padding:0;color:#0E7A45;font:inherit;letter-spacing:.12em;cursor:pointer;font-weight:600}
.exit-primary{margin-top:30px;border-top:1px solid #0B1B2B;padding-top:24px;display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap}
.exit-primary p{margin:0;font-size:18px;line-height:1.55;font-weight:600;color:#0B1B2B;max-width:52ch}
.exit-benchmark{font-size:14px;line-height:1.6;color:#5A6B7A;margin-top:20px}
.score-bridge{margin-top:26px;font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.12em;color:#5A6B7A}


/* Readout: one decision per moment (Sep 1). Secondary capture is quiet. */
.selfscore .lead-box{border:none;background:transparent;padding:18px 0 0;margin-top:8px;border-top:1px solid #D5DDE1}
.selfscore .lead-box h4{font-size:16px;margin:0 0 4px}
.selfscore .lead-box p{font-size:14px;color:#5A6B7A;margin:0 0 12px}

.lead-reveal-line{font-size:16px;color:#33434F;margin:0}
.lead-reveal-line .link-green{margin-left:6px}


/* ================= Mobile polish room / REV 2026-09-04 =================
   Mobile-first corrections. Everything below sits inside a max-width query,
   so 1280+ is untouched. Order matters: these follow the readout rules above
   so the ceremony can be restyled for the phone without being restructured. */

/* Nav collapses before the desktop bar can crowd. At 721-900 the full bar
   overlapped the wordmark and pushed the CTA off the right edge (iPad portrait). */
@media(max-width:900px){
  .btn-cta{display:none}
  .nav-menu{display:inline-flex;align-items:center;min-height:44px;padding:10px 14px}
  .navlinks{display:none;position:absolute;left:0;right:0;top:100%;background:var(--ink);border-bottom:1px solid rgba(255,255,255,.08);flex-direction:column;align-items:stretch;gap:0;padding:6px 40px 14px}
  .navlinks.open{display:flex}
  .navlinks .navlink{padding:0;font-size:14px;min-height:48px}
  .navlink-cta{display:flex;color:var(--glight)}
  .quiz-summary,.selfscore #quiz,.selfscore .res-hero{scroll-margin-top:96px}
}

@media(max-width:720px){
  /* Margins: the hero now sits on the same 24px edge as everything below it. */
  .hero-paper .wrap{padding:40px 24px 48px}
  .navlinks{padding:6px 24px 14px}

  /* Type scale: hero leads, rail heading labels, body statement follows. */
  .eyebrow{margin-bottom:18px}
  .eyebrow .label{font-size:11px;letter-spacing:.14em}
  .status{font-size:11px;line-height:1.9}
  .hero-paper h1{font-size:40px;line-height:1.04;margin-bottom:20px}
  .hero-paper .sub{font-size:18px;line-height:1.55;margin-bottom:28px}
  .hero-sub{font-size:30px;line-height:1.12;margin-bottom:18px}
  .hero-sub-p{font-size:18px;line-height:1.6}
  .rail-sec{padding:72px 0}
  .rail{margin-bottom:20px}
  .rail h2{font-size:20px;line-height:1.25}
  .rail .note{font-size:11px;margin-top:12px;line-height:1.8}
  .folio{font-size:11px}
  .display{font-size:26px;line-height:1.22;margin-bottom:20px}
  .display.stmt{font-size:24px;line-height:1.25}
  /* The operator section leads with the portrait on a phone: first image at 849px
     instead of 1406px. Order only, so the desktop two-column layout is untouched. */
  .two.op{display:flex;flex-direction:column}
  .two.op .photo{order:-1}
  .prose{font-size:18px;line-height:1.62}
  .prose p{margin-bottom:18px}
  .editorial.prose{font-size:18px;line-height:1.62}
  .note h3{font-size:20px}
  .note p{font-size:16px}
  .note.featured h3{font-size:24px}
  .note.featured p{font-size:18px}
  .rulelist dt{font-size:16px}
  .rulelist dd{font-size:14px}
  .standing dd{font-size:16px}
  .door .name{font-size:20px}
  .doors-more{font-size:16px}
  .counter{gap:32px}
  .counter .n{font-size:44px}

  /* Controls: 44px minimum on anything you tap. */
  .btn-green,.btn-green.lg,.btn-ink,.modal-submit{min-height:50px}
  .hero-paper .btns .link-green,.close .btns .link-green,.svc .link-green,.svc .link-lightgreen,.foot-col a{display:inline-flex;align-items:center;min-height:44px}
  .foot-col .links{gap:0}

  /* The close and the footer: the page ends, it does not stop. */
  .close{padding:72px 0 80px}
  .close h2{font-size:30px;margin-bottom:16px}
  .close p{font-size:18px;margin-bottom:28px}
  .close .btns,.hero-paper .btns{gap:18px}
  .ds-footer .inner{padding-top:48px;padding-bottom:calc(56px + env(safe-area-inset-bottom,0px))}
  .foot-top{gap:32px}
  .foot-cols{gap:32px}
  .foot-brand p{font-size:14px}
  .foot-bottom{margin-top:36px;flex-direction:column;gap:10px;font-size:11px;line-height:1.7}

  /* Self-score: same ceremony, phone-sized. */

  .qcard{padding:18px}
  .selfscore .qcard h3{font-size:16px;line-height:1.4;margin-bottom:12px}
  .qcard .dom{font-size:11px;letter-spacing:.12em}
  .opts{flex-direction:column;gap:8px}
  .selfscore .opt{width:100%;min-height:48px;padding:12px 14px;font-size:16px}
  .opt input{width:18px;height:18px;flex:none}
  .prog i{width:10px;height:10px}
  .prog span{font-size:11px;margin-left:8px}
  .score-btn{width:100%;min-height:52px;padding:14px 16px;line-height:1.35}
  .quiz-summary,.selfscore #quiz,.selfscore .res-hero{scroll-margin-top:80px}
  .quiz-summary{padding:12px 14px;font-size:11px;letter-spacing:.08em;gap:12px}
  .quiz-summary .qs-edit{letter-spacing:.08em;white-space:nowrap}
  .res-hero{padding:26px 20px;gap:18px}
  .res-hero .n{font-size:56px}
  .res-hero .n span{font-size:24px}
  .res-hero .band{font-size:20px}
  .res-hero .expl{font-size:16px}
  .doms{padding:14px 16px}
  .dom-row{gap:10px;padding:12px 0}
  .dom-row .lbl{font-size:14px}
  .dom-row .bar{width:64px}
  .dom-row .val{font-size:12px;width:38px}
  .exit-primary{gap:16px;margin-top:26px;padding-top:20px}
  .exit-primary p{font-size:16px}
  .exit-primary .btn-green{width:100%}
  .lead-box h4{font-size:16px}
  .lead-reveal-line{font-size:14px}
  .lead-row{gap:10px}
  .lead-row input{min-width:0;width:100%;font-size:16px;min-height:50px}
  .lead-row .btn-ink{width:100%}
  .fineprint{font-size:11px}


  /* Modal (the Calendly fallback path). */
  .modal-overlay{padding:16px;align-items:flex-start}
  .modal-card{padding:26px 20px;margin-top:20px;max-height:calc(100vh - 32px);overflow-y:auto}
  .modal-card h3{font-size:24px}
  .modal-card .sub{font-size:14px}
  .modal-x{width:44px;height:44px;top:6px;right:6px}
  .modal-form input,.modal-form textarea{font-size:16px}
  .modal-form input{min-height:50px}
}

@media(max-width:380px){
  .hero-paper h1{font-size:36px}
  .hero-sub{font-size:26px}
  .display{font-size:24px}
  .res-hero .n{font-size:48px}
}

/* Touch minimums for the tablet band too (721-900 is a touch width). */
@media(max-width:900px){
  .brand{min-height:44px}
  .selfscore .opt{min-height:48px;padding:12px 14px}
  .foot-col .links{gap:0}
  .foot-col a,.hero-paper .btns .link-green,.close .btns .link-green,.svc .link-green,.svc .link-lightgreen{display:inline-flex;align-items:center;min-height:44px}
}

/* Respect the reader's motion setting. The readout still lands, it just does not glide. */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
}
