/* Ported from prototype/what-happens-monday.html. Brand colours are set at
   runtime from the partner file (app.mjs, applyBrand). */
html{color-scheme:light dark}body{margin:0;font:14px system-ui,-apple-system,"Segoe UI",sans-serif}img{max-width:100%}[hidden]{display:none!important}

:root{
  /* Heritage Vault: charcoal 1D2020 / grey 464C4C 6E7474 / stone DDD8D2 C9C3BC
     off-white F3F1EE / maroon C6422B / orange D97B12 / logo F38216 -> C1202A */
  --brand-l:#A82D22; --brand-d:#E8836F;
  --fill-l:#B5342A;  --fill-d:#C6422B;
  --grad-from:#E0651C; --grad-to:#C1202A;

  --ground:#F3F1EE; --surface:#FFFFFF; --surface-2:#EAE7E2; --surface-3:#DDD8D2;
  --ink:#1D2020; --ink-2:#464C4C; --ink-3:#6E7474;
  --line:#DDD8D2; --line-2:#C9C3BC;
  --accent:var(--brand-l); --fill:var(--fill-l); --tint:var(--tint-l,#FBEBD8);
  --good:#2C6B4C; --warn:#B0660B; --bad:#A02A20;
  --good-soft:#E4EFE8; --warn-soft:#FBEBD8; --bad-soft:#F8E3E0;
  --on-fill:#FFFFFF;
  --shadow-s:0 1px 2px rgba(29,32,32,.06);
  --shadow-m:0 1px 2px rgba(29,32,32,.05), 0 10px 28px -14px rgba(29,32,32,.26);
  --shadow-l:0 2px 4px rgba(29,32,32,.07), 0 22px 48px -20px rgba(29,32,32,.34);
  --sans:"IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --serif:"Fraunces", ui-serif, Georgia, "Times New Roman", serif;
  --mono:"IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ground:#121515; --surface:#1D2020; --surface-2:#262A2A; --surface-3:#333838;
    --ink:#F3F1EE; --ink-2:#C9C3BC; --ink-3:#8D9494;
    --line:#2E3333; --line-2:#414747;
    --accent:var(--brand-d); --fill:var(--fill-d); --tint:var(--tint-d,#2A1512);
    --good:#67AE8B; --warn:#E0A64F; --bad:#E0796A;
    --good-soft:#17291F; --bad-soft:#2E1A17; --warn-soft:#2B2113;
    --on-fill:#FFFFFF;
    --shadow-s:0 1px 2px rgba(0,0,0,.45);
    --shadow-m:0 1px 2px rgba(0,0,0,.45), 0 10px 28px -14px rgba(0,0,0,.75);
    --shadow-l:0 2px 4px rgba(0,0,0,.5), 0 22px 48px -20px rgba(0,0,0,.85);
  }
}
:root[data-theme="dark"]{
  --ground:#121515; --surface:#1D2020; --surface-2:#262A2A; --surface-3:#333838;
  --ink:#F3F1EE; --ink-2:#C9C3BC; --ink-3:#8D9494;
  --line:#2E3333; --line-2:#414747;
  --accent:var(--brand-d); --fill:var(--fill-d); --tint:var(--tint-d,#2A1512);
  --good:#67AE8B; --warn:#E0A64F; --bad:#E0796A;
  --good-soft:#17291F; --bad-soft:#2E1A17; --warn-soft:#2B2113;
  --on-fill:#FFFFFF;
  --shadow-s:0 1px 2px rgba(0,0,0,.45);
  --shadow-m:0 1px 2px rgba(0,0,0,.45), 0 10px 28px -14px rgba(0,0,0,.75);
  --shadow-l:0 2px 4px rgba(0,0,0,.5), 0 22px 48px -20px rgba(0,0,0,.85);
}

*{box-sizing:border-box}
body{
  background:var(--ground); color:var(--ink);
  font-family:var(--sans); font-size:16px; line-height:1.55;
  -webkit-font-smoothing:antialiased;
  transition:background .5s ease;
}
h1,h2,h3{font-family:var(--serif); font-weight:500; text-wrap:balance; margin:0; line-height:1.14}
p{margin:0}
button{font:inherit; color:inherit; cursor:pointer; border:0; background:none; text-align:left}
:focus-visible{outline:2px solid var(--accent); outline-offset:3px; border-radius:3px}

/* ============ page wash: the module colour bleeds into the page ============ */
.wash{
  position:fixed; inset:0 0 auto 0; height:62vh; z-index:-1; pointer-events:none;
  background:linear-gradient(180deg, var(--tint) 0%, var(--ground) 100%);
  opacity:0; transition:opacity .55s ease, background .55s ease;
}
.wash.on{opacity:1}

.wrap{max-width:1140px; margin:0 auto; padding:0 26px}
.narrow{max-width:760px; margin:0 auto; padding:0 26px}

/* ============ masthead ============ */
.masthead{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:18px 0; border-bottom:1px solid var(--line);
}
.brandmark{display:flex; align-items:center; gap:12px}
.brandmark .logo{width:30px; height:auto; display:block; flex:none}
.brandmark .mark{
  width:34px; height:34px; display:grid; place-items:center; flex:none; border-radius:8px;
  background:var(--fill); color:var(--on-fill);
  font-family:var(--mono); font-size:12px; font-weight:500; letter-spacing:.03em;
}
.brandmark .wm{display:grid; gap:1px}
.brandmark .nm{
  font-family:var(--sans); font-size:14.5px; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:var(--ink); line-height:1.1;
}
.brandmark .tg{
  font-family:var(--sans); font-size:10.5px; letter-spacing:.1em;
  color:var(--ink-3); line-height:1.1;
}
.masthead .loc{
  font-family:var(--mono); font-size:11px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--ink-3);
}

/* ============ landing ============ */
.hero{padding:58px 0 20px; max-width:780px}
.eyebrow{
  display:inline-flex; align-items:center; gap:9px; margin-bottom:22px;
  font-family:var(--mono); font-size:11px; letter-spacing:.13em;
  text-transform:uppercase; color:var(--accent);
}
.eyebrow::before{content:""; width:26px; height:2px; background:var(--accent); border-radius:2px}
.hero h1{font-size:clamp(38px,7.4vw,62px); letter-spacing:-.028em}
.hero .scene{margin-top:24px; font-size:18.5px; line-height:1.6; color:var(--ink-2); max-width:58ch}
.hero .scene strong{color:var(--ink); font-weight:600}

/* first-week strip */
.firstweek{
  margin-top:40px; padding:22px 22px 20px; border-radius:16px;
  background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-m);
}
.firstweek .cap{
  font-family:var(--mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--ink-3); display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap;
}
.firstweek .cap b{color:var(--bad); font-weight:500}
.chips{display:flex; flex-wrap:wrap; gap:7px; margin-top:15px}
.chip{
  display:inline-flex; align-items:center; gap:7px; border-radius:999px;
  padding:6px 12px; font-size:13px; border:1px solid var(--line);
  background:var(--surface-2); color:var(--ink-3);
}
.chip .g{font-family:var(--mono); font-size:11px; line-height:1; font-weight:500}
.chip.known{background:var(--good-soft); border-color:transparent; color:var(--good)}
.chip.unknown{background:var(--bad-soft); border-color:transparent; color:var(--bad)}
.firstweek .foot{
  margin-top:16px; padding-top:13px; border-top:1px dashed var(--line);
  font-size:13.5px; color:var(--ink-2);
}

/* stat */
.statline{
  margin-top:44px; padding:26px 24px; border-radius:16px;
  background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow-s);
  display:grid; grid-template-columns:auto 1fr; gap:6px 26px; align-items:start;
}
.statline .big{
  font-family:var(--serif); font-size:clamp(34px,6vw,50px); color:var(--accent);
  letter-spacing:-.03em; line-height:1; grid-row:span 2; white-space:nowrap;
}
.statline .txt{font-size:15.5px; color:var(--ink-2); max-width:54ch}
.statline .src{
  font-family:var(--mono); font-size:10.5px; letter-spacing:.06em;
  text-transform:uppercase; color:var(--ink-3);
}

/* module preview cards */
.modgrid{display:grid; grid-template-columns:repeat(auto-fit,minmax(168px,1fr)); gap:10px; margin-top:20px}
.modcard{
  padding:16px 15px; border-radius:13px; border:1px solid var(--line);
  background:var(--surface); box-shadow:var(--shadow-s);
  border-top:3px solid var(--mc);
}
.modcard .n{font-family:var(--mono); font-size:10.5px; letter-spacing:.09em; color:var(--mc)}
.modcard .t{font-family:var(--serif); font-size:16.5px; margin-top:5px; letter-spacing:-.01em; line-height:1.2}

.cta-row{margin:36px 0 10px; display:flex; gap:16px; align-items:center; flex-wrap:wrap}
.btn{
  display:inline-flex; align-items:center; gap:10px; border-radius:11px;
  background:linear-gradient(160deg, var(--grad-from), var(--grad-to));
  color:var(--on-fill); padding:15px 28px;
  font-size:16px; font-weight:600; letter-spacing:.005em;
  box-shadow:var(--shadow-m);
  transition:transform .13s ease, filter .13s ease, box-shadow .13s ease;
}
.btn:hover{filter:brightness(1.08); transform:translateY(-2px); box-shadow:var(--shadow-l)}
.btn.mod{background:linear-gradient(160deg, var(--grad-from), var(--grad-to))}
.btn.full{width:100%; justify-content:center}
.btn.sm{padding:11px 20px; font-size:14.5px; border-radius:9px}
.btn.ghost{background:none; color:var(--ink); border:1px solid var(--line-2); box-shadow:none}
.btn.ghost:hover{border-color:var(--accent); color:var(--accent); box-shadow:none}
.cta-row .note{font-size:13.5px; color:var(--ink-3); line-height:1.45}
.cta-row .note b{color:var(--ink-2); font-weight:600}

.privacy{
  margin:32px 0 64px; padding:18px 20px; border-radius:13px; background:var(--surface-2);
  border-left:3px solid var(--accent); font-size:14.5px; color:var(--ink-2);
}
.privacy b{color:var(--ink); font-weight:600}

/* ============ QUIZ: two-column with conversion rail ============ */
.quizgrid{display:grid; grid-template-columns:minmax(0,1fr) 316px; gap:44px; padding:26px 0 70px; align-items:start}
@media (max-width:920px){ .quizgrid{grid-template-columns:1fr; gap:26px} }

/* one plain progress bar */
.progress{height:6px; border-radius:99px; background:var(--surface-3); overflow:hidden; margin-bottom:22px}
.progress i{
  display:block; height:100%; border-radius:99px;
  background:linear-gradient(90deg, var(--grad-from), var(--grad-to));
  transition:width .45s cubic-bezier(.2,.7,.3,1);
}

.qhead{display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:22px}
.modpill{
  display:inline-flex; align-items:center; gap:9px; padding:6px 13px; border-radius:999px;
  background:var(--surface-2); color:var(--ink-2); border:1px solid var(--line);
  font-size:12.5px; font-weight:500; letter-spacing:.005em;
}
.qcount{
  font-family:var(--mono); font-size:11.5px; letter-spacing:.06em; color:var(--ink-3);
  font-variant-numeric:tabular-nums;
}

.qtext{font-size:clamp(26px,4.3vw,38px); letter-spacing:-.022em; line-height:1.17}
.qhelp{
  margin-top:16px; font-size:15.5px; color:var(--ink-2); max-width:56ch;
  border-left:3px solid var(--fill); padding-left:14px; line-height:1.5;
}
.opts{display:grid; gap:10px; margin-top:30px}
.opt{
  display:flex; gap:15px; align-items:flex-start; width:100%; border-radius:13px;
  padding:17px 19px; background:var(--surface); border:1.5px solid var(--line);
  font-size:16.5px; line-height:1.4; box-shadow:var(--shadow-s);
  transition:border-color .13s, transform .13s, box-shadow .13s;
}
.opt:hover{border-color:var(--fill); transform:translateX(3px); box-shadow:var(--shadow-m)}
.opt .key{
  font-family:var(--mono); font-size:12px; flex:none; width:22px; height:22px; border-radius:6px;
  display:grid; place-items:center; margin-top:2px;
  background:var(--surface-3); color:var(--ink-3); transition:background .13s, color .13s;
}
.opt:hover .key{background:var(--fill); color:var(--on-fill)}
.opt.selected{border-color:var(--fill); background:var(--tint)}
.opt.selected .key{background:var(--fill); color:var(--on-fill)}
.qnav{display:flex; gap:14px; align-items:center; margin-top:24px}
.linkbtn{
  font-family:var(--mono); font-size:11.5px; letter-spacing:.07em; text-transform:uppercase;
  color:var(--ink-3); padding:7px 0;
}
.linkbtn:hover{color:var(--accent)}

/* the conversion rail */
.rail{position:sticky; top:22px; display:grid; gap:14px}
@media (max-width:920px){ .rail{position:static} }
.railcard{
  border-radius:15px; padding:20px 19px; background:var(--surface);
  border:1px solid var(--line); border-top:4px solid var(--fill);
  box-shadow:var(--shadow-m);
}
.railcard .lbl{
  font-family:var(--mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--accent); font-weight:500; margin-bottom:11px;
}
.railcard .msg{font-size:15px; line-height:1.5; color:var(--ink); min-height:3em}
.railcard .sep{height:1px; background:var(--line); margin:17px 0 15px}
.railcard .fine{margin-top:11px; font-size:12px; color:var(--ink-3); line-height:1.45}
.railfade{animation:fade .4s ease}
@keyframes fade{from{opacity:0; transform:translateY(5px)}to{opacity:1; transform:none}}

.railstat{
  border-radius:15px; padding:17px 19px; background:var(--tint);
  border:1px solid var(--line);
}
.railstat .k{
  font-family:var(--mono); font-size:10px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--ink-3); margin-bottom:8px;
}
.railstat .dots{display:flex; flex-wrap:wrap; gap:6px}
.railstat .v{font-size:13.5px; color:var(--ink-2); margin-top:10px; line-height:1.45}

/* ============ module intro ============ */
.modintro{padding:70px 0 60px; max-width:640px}
.modbig{
  font-family:var(--mono); font-size:13px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent); font-weight:500; margin-bottom:18px;
  display:inline-flex; align-items:center; gap:11px;
}
.modbig::before{content:""; width:34px; height:3px; background:var(--fill); border-radius:2px}
.modintro h2{font-size:clamp(32px,5.6vw,46px); letter-spacing:-.025em}
.modintro p{margin-top:18px; font-size:17.5px; color:var(--ink-2); max-width:52ch; line-height:1.55}

/* ============ inline module banner (replaces the interstitial screen) ============ */
.modbanner{
  display:grid; gap:3px; padding:15px 18px; margin-bottom:20px; border-radius:13px;
  background:var(--tint); border:1px solid var(--line); border-left:4px solid var(--fill);
}
.modbanner .bn{
  font-family:var(--mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--accent); font-weight:500;
}
.modbanner .bt{font-family:var(--serif); font-size:20px; letter-spacing:-.015em; line-height:1.2}
.modbanner .bb{font-size:14px; color:var(--ink-2); line-height:1.45; margin-top:3px}

/* ============ which-apply grid ============ */
.applygrid{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:11px; margin-top:30px}
.applybtn{
  display:flex; gap:14px; align-items:center; padding:18px 19px; border-radius:14px;
  background:var(--surface); border:1.5px solid var(--line); box-shadow:var(--shadow-s);
  font-size:16px; line-height:1.35;
  transition:border-color .13s, background .13s, transform .13s;
}
.applybtn:hover{border-color:var(--ac); transform:translateY(-2px)}
.applybtn .tick{
  width:26px; height:26px; border-radius:8px; flex:none; display:grid; place-items:center;
  border:1.5px solid var(--line-2); color:transparent; font-size:13px; font-weight:700;
  transition:background .13s, border-color .13s, color .13s;
}
.applybtn.on{border-color:var(--ac); background:var(--at)}
.applybtn.on .tick{background:var(--ac); border-color:var(--ac); color:var(--on-fill)}

/* ============ score blocks ============ */
.res{padding:44px 0 20px}
.scoreblock{display:flex; align-items:flex-end; gap:26px; flex-wrap:wrap}
.scorenum{
  font-family:var(--mono); font-size:clamp(66px,14vw,98px); line-height:.84;
  font-variant-numeric:tabular-nums; letter-spacing:-.05em;
}
.scorenum small{font-size:.32em; letter-spacing:0; margin-left:3px}
.scoreband{padding-bottom:8px}
.scoreband .lbl{
  font-family:var(--mono); font-size:10.5px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--ink-3);
}
.scoreband h2{font-size:clamp(23px,3.6vw,30px); margin-top:7px; letter-spacing:-.02em}
.scoremeter{height:9px; border-radius:99px; background:var(--surface-3); margin:26px 0 22px; overflow:hidden}
.scoremeter i{display:block; height:100%; border-radius:99px; transition:width .8s cubic-bezier(.2,.7,.3,1)}
.scoresent{font-size:17px; color:var(--ink-2); max-width:58ch; line-height:1.6}

.doors{
  margin-top:30px; padding:24px 22px; border-radius:16px; background:var(--surface);
  border:1px solid var(--line); box-shadow:var(--shadow-m);
}
.doors .hd{font-size:18px; line-height:1.45; max-width:52ch}
.doors .hd b{color:var(--bad); font-weight:700}
.dots{display:flex; flex-wrap:wrap; gap:8px; margin-top:18px}
.dot{width:15px; height:15px; border-radius:50%; background:var(--good)}
.dot.shut{background:var(--bad)}
.dot.part{background:var(--warn)}
.dot.sm{width:11px; height:11px}
.dotkey{
  display:flex; gap:20px; flex-wrap:wrap; margin-top:16px;
  font-family:var(--mono); font-size:10.5px; letter-spacing:.06em;
  text-transform:uppercase; color:var(--ink-3);
}
.dotkey span{display:inline-flex; align-items:center; gap:7px}
.dotkey i{width:10px; height:10px; border-radius:50%; display:inline-block}

/* ============ the push (CTA after stage one) ============ */
.push{
  margin-top:34px; border-radius:18px; overflow:hidden;
  border:1px solid var(--line); box-shadow:var(--shadow-l); background:var(--surface);
}
.push .top{background:var(--accent); color:var(--on-fill); padding:26px 26px 24px}
.push .top .k{
  font-family:var(--mono); font-size:10.5px; letter-spacing:.13em;
  text-transform:uppercase; opacity:.85; margin-bottom:12px;
}
.push .top h3{font-size:clamp(23px,3.6vw,31px); letter-spacing:-.02em; color:var(--on-fill)}
.push .body{padding:24px 26px 26px}
.push ul{margin:0 0 22px; padding:0; list-style:none; display:grid; gap:12px}
.push li{font-size:15.5px; color:var(--ink-2); padding-left:28px; position:relative; line-height:1.45}
.push li::before{
  content:"✓"; position:absolute; left:0; top:-1px; width:19px; height:19px; border-radius:50%;
  background:var(--good-soft); color:var(--good); font-size:11px;
  display:grid; place-items:center; font-weight:700;
}
.push .alt{
  margin-top:20px; padding-top:18px; border-top:1px solid var(--line);
  display:flex; gap:14px; align-items:center; flex-wrap:wrap;
}
.push .alt .t{font-size:14.5px; color:var(--ink-2); flex:1 1 220px}

/* ============ results ============ */
.ctapair{display:flex; gap:11px; flex-wrap:wrap; margin-top:20px}
.ctapair .btn{flex:1 1 210px; justify-content:center; margin-top:0}
.btn.outline{
  background:transparent; border:1.5px solid currentColor; box-shadow:none;
}
.btn.outline:hover{filter:none; background:rgba(255,255,255,.12)}
.ctanote{margin-top:13px; font-size:13.5px; line-height:1.45; opacity:.85}
.push .ctapair .btn.outline{color:var(--accent); border-color:var(--line-2)}
.push .ctapair .btn.outline:hover{background:var(--tint); border-color:var(--accent)}
.push .ctanote{color:var(--ink-3); opacity:1}
.finalcta .ctapair .btn.outline{color:#fff; border-color:rgba(255,255,255,.55); background:transparent}
.finalcta .ctapair .btn.outline:hover{background:rgba(255,255,255,.14)}
.finalcta .ctanote{color:rgba(255,255,255,.88)}

/* vault-led closing items */
.act .body b .tag{
  display:inline-block; vertical-align:2px; margin-left:9px; font-style:normal;
  font-family:var(--mono); font-size:9.5px; letter-spacing:.09em; text-transform:uppercase;
  color:#fff; background:var(--warn); padding:3px 8px; border-radius:99px; font-weight:500;
}
.act .vaultmark.warn{background:var(--warn)}
.act .vaultmark{
  flex:none; width:26px; height:26px; border-radius:8px; margin-top:2px;
  background:linear-gradient(160deg, var(--grad-from), var(--grad-to));
  display:grid; place-items:center; color:#fff; font-size:13px; font-weight:700;
}

.finalcta{
  margin-top:20px; padding:28px 26px; border-radius:18px;
  background:linear-gradient(160deg, var(--grad-from), var(--grad-to));
  color:#fff; box-shadow:var(--shadow-l);
}
.finalcta .k{
  font-family:var(--mono); font-size:10.5px; letter-spacing:.13em;
  text-transform:uppercase; opacity:.88; margin-bottom:11px;
}
.finalcta h3{font-size:clamp(22px,3.4vw,29px); letter-spacing:-.02em; color:#fff}
.finalcta p{margin-top:13px; font-size:16px; color:rgba(255,255,255,.92); max-width:50ch}
.finalcta .btn{
  margin-top:22px; background:#fff; color:var(--grad-to);
  box-shadow:0 2px 10px rgba(0,0,0,.18);
}
.finalcta .btn:hover{filter:none; background:#fff; transform:translateY(-2px)}

details.juris{margin-top:34px; padding:0; border-radius:14px; overflow:hidden}
details.juris summary{
  cursor:pointer; padding:17px 20px; font-size:15.5px; font-weight:500;
  list-style:none; display:flex; align-items:center; gap:11px;
}
details.juris summary::-webkit-details-marker{display:none}
details.juris summary::before{
  content:"+"; font-family:var(--mono); font-size:15px; color:var(--accent); flex:none;
}
details.juris[open] summary::before{content:"\2212"}
details.juris .jbody{padding:0 20px 20px}

.sechead{
  margin:50px 0 20px; display:flex; align-items:baseline; gap:16px;
  font-family:var(--mono); font-size:11px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--ink-3);
}
.sechead::after{content:""; flex:1; height:1px; background:var(--line)}

.ledger{display:grid; gap:9px}
.lrow{
  display:grid; grid-template-columns:1fr auto; gap:7px 14px; align-items:center;
  padding:15px 17px; border-radius:12px; background:var(--surface);
  border:1px solid var(--line); border-left:4px solid var(--rc);
}
.lrow .nm{font-size:15.5px; font-weight:500}
.lrow .pc{
  font-family:var(--mono); font-size:10px; letter-spacing:.09em; text-transform:uppercase;
  color:#fff; background:var(--rc); font-weight:500; padding:4px 10px; border-radius:99px;
}
.lrow.na .pc{background:var(--surface-3); color:var(--ink-3)}
.lrow .bar{grid-column:1 / -1; height:6px; border-radius:99px; background:var(--surface-3); position:relative}
.lrow .bar i{position:absolute; inset:0 auto 0 0; display:block; border-radius:99px; background:var(--rc)}
.lrow .sub{grid-column:1 / -1; font-size:13.5px; color:var(--ink-2); line-height:1.45}
.lrow.na{border-left-color:var(--line-2)}
.lrow.na .nm,.lrow.na .pc{color:var(--ink-3)}

.actions{display:grid; gap:11px}
.act{
  background:var(--surface); padding:20px 21px; border-radius:14px;
  border:1px solid var(--line); border-left:4px solid var(--ac);
  display:flex; gap:17px; align-items:flex-start; box-shadow:var(--shadow-s);
}
.act .step{
  font-family:var(--mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--on-fill); background:var(--ac); flex:none; align-self:flex-start;
  padding:5px 11px; border-radius:99px; white-space:nowrap; margin-top:2px;
}
.act .body b{display:block; font-size:17px; font-weight:600; margin-bottom:6px; line-height:1.3}
.act .body p{font-size:15px; color:var(--ink-2); line-height:1.5}
.act .body .why{
  margin-top:10px; font-family:var(--mono); font-size:10.5px; letter-spacing:.06em;
  text-transform:uppercase; color:var(--ac);
}

.agenda{
  margin-top:16px; padding:24px 22px; border-radius:16px;
  background:var(--surface); border:2px solid var(--accent); box-shadow:var(--shadow-m);
}
.agenda h3{font-size:21px; letter-spacing:-.015em}
.agenda .sub{margin-top:9px; font-size:14.5px; color:var(--ink-2)}
.agenda ol{margin:18px 0 0; padding-left:20px; display:grid; gap:10px}
.agenda li{font-size:15.5px; line-height:1.45; color:var(--ink)}
.agenda li span{display:block; font-size:13.5px; color:var(--ink-3); margin-top:2px}

.juris{margin-top:16px; padding:24px 22px; border-radius:16px; background:var(--surface-2); border:1px solid var(--line)}
.juris h3{font-size:19px; margin-bottom:16px}
.juris ul{margin:0; padding:0; list-style:none; display:grid; gap:12px}
.juris li{font-size:14.5px; color:var(--ink-2); padding-left:22px; position:relative; line-height:1.5}
.juris li::before{content:"—"; position:absolute; left:0; top:0; color:var(--accent); font-family:var(--mono); font-size:13px}
.juris .src{
  margin-top:18px; padding-top:14px; border-top:1px solid var(--line);
  font-family:var(--mono); font-size:10px; letter-spacing:.04em; color:var(--ink-3); line-height:1.7;
}

.capture{
  margin:50px 0 20px; padding:30px 26px; border-radius:18px; background:var(--surface);
  border:2px solid var(--accent); box-shadow:var(--shadow-l);
}
.capture h3{font-size:clamp(22px,3.4vw,28px); letter-spacing:-.018em}
.capture p{margin-top:13px; font-size:16px; color:var(--ink-2); max-width:54ch}
.capture .form{display:flex; gap:10px; margin-top:22px; flex-wrap:wrap}
.capture input{
  flex:1 1 250px; padding:14px 16px; font:inherit; font-size:15.5px; border-radius:11px;
  background:var(--surface-2); color:var(--ink); border:1.5px solid var(--line-2);
}
.capture input::placeholder{color:var(--ink-3)}
.capture .stub{
  margin-top:15px; font-family:var(--mono); font-size:10.5px;
  letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3);
}

.restart{margin:32px 0 70px; display:flex; gap:20px; flex-wrap:wrap; align-items:center}

.sitefoot{
  border-top:1px solid var(--line); padding:22px 0 38px;
  display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap;
  font-family:var(--mono); font-size:10.5px; letter-spacing:.07em;
  text-transform:uppercase; color:var(--ink-3);
}

@media (prefers-reduced-motion:reduce){ *{animation:none !important; transition:none !important} }
@media (max-width:520px){
  .hero{padding:40px 0 14px}
  .statline{grid-template-columns:1fr}
  .statline .big{grid-row:auto}
}

/* ============ added for the live page ============ */
.capture .consent{display:flex; gap:10px; align-items:flex-start; margin-top:16px; font-size:14px; color:var(--ink-2); max-width:60ch}
.capture .consent input{flex:none; width:18px; height:18px; margin-top:2px; accent-color:var(--fill); padding:0}
.capture .fine{margin-top:12px; font-size:12px; color:var(--ink-3); max-width:60ch}
.capture .fine a{color:inherit}
.capture .status{margin-top:15px; font-size:14.5px; color:var(--ink-2); min-height:1.5em}
.capture .status.ok{color:var(--good)}
.capture .status.err{color:var(--bad)}
.capture .btn[disabled]{opacity:.55; cursor:default; transform:none; filter:none}
.hp{position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden}

.keep{margin:34px 0 0; padding:22px 24px; border-radius:16px; background:var(--surface); border:1px solid var(--line)}
.keep h3{font-size:19px}
.keep p{margin-top:8px; font-size:14.5px; color:var(--ink-2)}
.keep .row{display:flex; gap:10px; flex-wrap:wrap; margin-top:16px}
.keep .row .btn{margin-top:0}
.keep .done{margin-top:10px; font-size:13px; color:var(--good); min-height:1.3em}

.notice{margin:18px 0 0; padding:12px 16px; border-radius:10px; background:var(--warn-soft); color:var(--ink-2); font-size:14px}
.previewbar{position:sticky; top:0; z-index:5; background:var(--ink); color:var(--ground); font-family:var(--mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; text-align:center; padding:6px 10px}
.fatal{max-width:560px; margin:80px auto; padding:0 26px; text-align:center}
.fatal h1{font-size:30px}
.fatal p{margin-top:14px; color:var(--ink-2)}

@media print{
  .wash, .masthead .loc, #btnRestart, #btnAnswers, .capture, .keep, .ctapair, .previewbar, .sitefoot #fRight{display:none !important}
  body{background:#fff; color:#000}
  #answerDump{display:block !important}
  .finalcta{box-shadow:none}
}
.scene p + p{margin-top:15px}
.grecaptcha-badge{visibility:hidden}
.keep a.btn{text-decoration:none}