:root{
    --bg:#131110;            /* the "Law" slide warm near-black */
    --bg-2:#191613;          /* raised */
    --cream:#EFEBE0;
    --cream-70:rgba(239,235,224,.7);
    --cream-45:rgba(239,235,224,.45);
    --cream-28:rgba(239,235,224,.28);
    --cream-12:rgba(239,235,224,.12);
    --cream-07:rgba(239,235,224,.07);
    --paper:#F4F1E8;
    --paper-2:#EAE6D9;
    --ink:#0A0E17;
    --ink-45:rgba(10,14,23,.45);
    --ink-12:rgba(10,14,23,.12);
    --ink-07:rgba(10,14,23,.07);
    --yellow:#EDFF00;
    --mono:'Geist Mono',ui-monospace,monospace;
    --sans:'Instrument Sans',Helvetica,-apple-system,'Segoe UI',Arial,sans-serif;
    --serif:'Instrument Serif',serif;
    --maxw:1180px;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  html,body{overflow-x:clip}
  body{background:var(--bg);color:var(--cream);font-family:var(--sans);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
  ::selection{background:var(--yellow);color:var(--ink)}
  a{color:inherit}
  button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
  :focus-visible{outline:2px solid var(--yellow);outline-offset:3px}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 40px}
  @media(max-width:640px){.wrap{padding:0 24px}}

  /* the actual suss. logo asset */
  .suss-img{height:.92em;width:auto;vertical-align:-.06em;display:inline-block}
  .logo-btn{padding:0;line-height:0;cursor:pointer}
  .nav-logo{height:24px;vertical-align:middle;display:block}
  /* wordmark fallback (unused when the logo image is present) */
  .suss{font-family:'Noto Sans Display',sans-serif;font-weight:900;letter-spacing:-.005em;white-space:nowrap}
  .suss::after{content:"";display:inline-block;width:.28em;height:.28em;background:var(--yellow);margin-left:.12em}

  /* ============ nav ============ */
  header.site{position:sticky;top:0;z-index:50;background:rgba(19,17,16,.96);border-bottom:1px solid var(--cream-12)}
  .nav{display:flex;align-items:center;justify-content:space-between;height:68px}
  .nav .suss{font-size:23px;line-height:1}
  .tabs{display:flex;gap:32px}
  .tab{font-size:15px;padding:4px 0;color:var(--cream-70);border-bottom:2px solid transparent}
  .tab:hover{color:var(--cream)}
  .tab[aria-selected="true"]{color:var(--cream);border-bottom-color:var(--yellow)}
  .nav-cta{font-size:14px;font-weight:500;padding:10px 20px;background:transparent;color:var(--cream);border:1px solid var(--cream);text-decoration:none;border-radius:2px;cursor:pointer}
  .nav-cta:hover{background:var(--cream);color:var(--ink)}
  @media(max-width:720px){.nav-cta{display:none}}

  .annot{background:var(--bg-2);border-bottom:1px solid var(--cream-07)}
  .annot p{font-family:var(--mono);font-size:11.5px;letter-spacing:.04em;color:var(--cream-45);padding:8px 0}
  .annot b{color:var(--cream);font-weight:500}

  .fold{padding:24px 0;border-bottom:1px solid var(--cream-12)}
  .fold p{font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:var(--cream-28)}

  main[hidden]{display:none}

  /* ============ hero — real live-site footage ============ */
  .hero{position:relative;min-height:92vh;display:flex;align-items:center;overflow:hidden;border-bottom:1px solid var(--cream-12);background:radial-gradient(110% 90% at 70% 30%,rgba(70,66,58,.5),transparent 55%),linear-gradient(160deg,#1c1915 0%,#131110 60%,#0f0d0c 100%)}
  .hero video,.scene video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
  .hero .shade,.scene .vshade{position:absolute;inset:0;z-index:1;background:linear-gradient(to bottom,rgba(19,17,16,1) 0%,rgba(19,17,16,0) 16%,rgba(19,17,16,0) 82%,rgba(19,17,16,1) 100%),linear-gradient(90deg,rgba(19,17,16,.92) 0%,rgba(19,17,16,.7) 48%,rgba(19,17,16,.45) 100%)}
  .hero .grain,.scene .vgrain{position:absolute;inset:0;z-index:1;opacity:.4;mix-blend-mode:overlay;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.28'/%3E%3C/svg%3E")}
  .hero .wrap{position:relative;z-index:2;width:100%;padding-top:120px;padding-bottom:120px}
  /* headline matches the live site: Instrument Sans black + round yellow dot period */
  .hero h1{font-family:var(--sans);font-weight:700;font-size:clamp(46px,6.6vw,92px);letter-spacing:-.025em;line-height:1.04;max-width:13ch;color:var(--cream)}
  .hero-dot{display:inline-block;width:.17em;height:.17em;border-radius:50%;background:var(--yellow);margin-left:.1em}
  .hero .sub{margin-top:28px;font-size:19px;color:var(--cream-70);max-width:44ch}
  .hero .hero-cta{margin-top:40px;display:flex;gap:16px;flex-wrap:wrap}
  .hbtn-fill{font-family:var(--mono);font-size:13px;letter-spacing:.1em;background:var(--cream);color:var(--ink);padding:17px 28px;border:1px solid var(--cream);cursor:pointer}
  .hbtn-fill:hover{background:#fff}
  .hbtn-ghost{font-family:var(--mono);font-size:13px;letter-spacing:.1em;color:var(--cream);padding:17px 28px;border:1px solid var(--cream-45);text-decoration:none;display:inline-block}
  .hbtn-ghost:hover{border-color:var(--cream);background:var(--cream-07)}
  .hero-note{position:absolute;left:0;bottom:20px;z-index:2;width:100%}
  .hero-note p{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;color:var(--cream-28)}

  /* ============ cinematic full-bleed sections ============ */
  .scene{position:relative;min-height:82vh;display:flex;align-items:center;overflow:hidden;border-bottom:1px solid var(--cream-12)}
  .scene .wrap{position:relative;z-index:2;width:100%;padding-top:110px;padding-bottom:110px}
  .scene .footage-cap{z-index:2}
  .footage{position:absolute;inset:0;z-index:0;pointer-events:none}
  .footage .img{position:absolute;inset:-6%;background-blend-mode:normal}
  @media(prefers-reduced-motion:no-preference){
    .footage .img{animation:kenburns 44s ease-in-out infinite alternate}
    @keyframes kenburns{from{transform:scale(1) translateX(0)}to{transform:scale(1.09) translateX(-1.5%)}}
  }
  .footage .grain{position:absolute;inset:0;opacity:.5;mix-blend-mode:overlay;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.28'/%3E%3C/svg%3E")}
  .footage .shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(19,17,16,.94) 0%,rgba(19,17,16,.72) 46%,rgba(19,17,16,.42) 100%)}
  .footage-cap{position:absolute;left:0;bottom:22px;z-index:2;width:100%}
  .footage-cap p{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;color:var(--cream-28)}

  /* footage stand-ins per scene (real screen: replace with actual legal footage) */
  .f-ledger .img{background:
    radial-gradient(120% 90% at 78% 18%,rgba(96,84,60,.55),transparent 55%),
    radial-gradient(90% 80% at 30% 85%,rgba(52,46,38,.6),transparent 60%),
    linear-gradient(160deg,#1c1915 0%,#131110 60%,#0f0d0c 100%)}
  .f-signature .img{background:
    radial-gradient(100% 80% at 82% 70%,rgba(88,74,52,.5),transparent 55%),
    radial-gradient(70% 60% at 18% 20%,rgba(46,42,36,.65),transparent 60%),
    linear-gradient(200deg,#1a1713 0%,#131110 55%,#100e0d 100%)}
  .f-wire .img{background:
    radial-gradient(110% 85% at 70% 30%,rgba(70,66,58,.55),transparent 55%),
    radial-gradient(80% 70% at 25% 80%,rgba(58,50,40,.5),transparent 60%),
    linear-gradient(140deg,#191613 0%,#131110 60%,#0f0e0c 100%)}
  .f-ticks .img{background:
    radial-gradient(120% 90% at 20% 25%,rgba(84,74,56,.45),transparent 55%),
    radial-gradient(90% 80% at 80% 80%,rgba(50,46,40,.55),transparent 60%),
    linear-gradient(120deg,#1b1814 0%,#131110 55%,#0f0d0c 100%)}

  /* yellow square period — ONLY inside the wordmark (Noto Sans Display contexts) */
  .wm-dot{display:inline-block;width:.28em;height:.28em;background:var(--yellow);margin-left:.12em}
  /* in serif or any other running text, "suss." takes a typographic period in suss yellow */
  .yp{color:var(--yellow)}

  .sc-label{font-family:var(--mono);font-size:12px;letter-spacing:.2em;color:var(--cream-45);margin-bottom:26px}
  .sc-label b{color:var(--cream);font-weight:500}
  .sc-num{font-family:var(--serif);font-style:italic;font-size:clamp(52px,7vw,96px);line-height:1;color:var(--cream-28);margin-bottom:18px}
  h2,.sc-h{font-family:var(--serif);font-weight:400;font-size:clamp(40px,6vw,76px);letter-spacing:.012em;line-height:1.06;max-width:16ch}
  .sc-h em{font-style:italic}
  /* Legora-style staggered statement: sentence one upper left, sentence two lower right */
  .sc-split{display:flex;flex-direction:column;max-width:none;width:100%}
  .sc-split .l1{max-width:14ch}
  .sc-split .l2{align-self:flex-end;text-align:right;max-width:14ch;margin-top:.4em}
  @media(max-width:700px){.sc-split .l2{margin-top:.3em}}
  .sc-body{margin-top:26px;font-size:19px;color:var(--cream-70);max-width:46ch}
  .stamp{margin-top:30px;display:inline-block;font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.16em;color:var(--cream-70);background:transparent;border:1px solid var(--cream-45);padding:6px 12px;transform:rotate(-1.5deg)}


  /* ============ the problem — slide-style stat grid ============ */
  .stats{position:relative;overflow:hidden;padding:130px 0;border-bottom:1px solid var(--cream-12)}
  .stats-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%;filter:saturate(.6) brightness(.85);z-index:0}
  .stats-shade{position:absolute;inset:0;z-index:1;background:
    linear-gradient(to bottom,rgba(19,17,16,1) 0%,rgba(19,17,16,0) 16%,rgba(19,17,16,0) 82%,rgba(19,17,16,1) 100%),
    linear-gradient(90deg,rgba(19,17,16,.95) 0%,rgba(19,17,16,.88) 45%,rgba(19,17,16,.8) 100%)}
  .stats-wrap{position:relative;z-index:2}
  .prob-tag{font-family:var(--mono);font-size:12px;letter-spacing:.18em;color:var(--cream-45);margin-bottom:56px}
  .prob-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:72px;align-items:start}
  @media(max-width:920px){.prob-grid{grid-template-columns:1fr;gap:48px}}
  .stats-intro{font-family:var(--serif);font-weight:400;font-size:clamp(26px,2.6vw,36px);letter-spacing:.012em;line-height:1.35;max-width:22ch}
  .stats-intro b{font-weight:400;color:var(--yellow)}
  .cellgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  @media(max-width:640px){.cellgrid{grid-template-columns:1fr}}
  .cell{border:1px solid var(--cream-12);padding:26px 26px 22px;background:rgba(19,17,16,.45);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
  .cell-k{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;color:var(--cream-45);margin-bottom:20px}
  .cell-n{font-family:var(--serif);font-weight:400;font-size:clamp(44px,4.4vw,68px);line-height:1;letter-spacing:.008em;padding-bottom:20px;border-bottom:1px dashed var(--cream-28)}
  .cell-n em{font-style:italic}
  .cell-per{font-family:var(--mono);font-size:13px;letter-spacing:.1em;color:var(--cream-45);margin-left:8px}
  .cell-d{margin-top:18px;font-size:14.5px;line-height:1.55;color:var(--cream-70)}
  .cell-s{margin-top:16px;font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;color:var(--cream-28)}
  .stats-note{margin-top:52px;font-family:var(--mono);font-size:11px;letter-spacing:.05em;color:var(--cream-28)}

  /* ============ the three checks — list left, stage right ============ */
  .checks{padding:130px 0;border-bottom:1px solid var(--cream-12)}
  .checks-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:80px;align-items:start}
  @media(max-width:900px){.checks-grid{grid-template-columns:1fr;gap:48px}}
  .checks-title{font-family:var(--serif);font-weight:400;font-size:clamp(26px,2.6vw,36px);letter-spacing:.012em;margin-bottom:36px;max-width:none}
  .checks-list{display:flex;flex-direction:column}
  .check-item{display:block;text-align:left;padding:26px 0;border-top:1px solid var(--cream-12);cursor:pointer;width:100%}
  .check-item:last-child{border-bottom:1px solid var(--cream-12)}
  .check-item .ci-title{display:block;font-size:24px;font-weight:500;color:var(--cream-28);transition:color .3s}
  .check-item .ci-desc{display:none;margin-top:12px;font-size:15.5px;line-height:1.6;color:var(--cream-70);max-width:40ch}
  .check-item[aria-selected="true"]{border-top-color:var(--cream)}
  .check-item[aria-selected="true"] .ci-title{color:var(--cream)}
  .check-item[aria-selected="true"] .ci-desc{display:block}
  .check-item:hover .ci-title{color:var(--cream-70)}
  .check-item[aria-selected="true"]:hover .ci-title{color:var(--cream)}
  .checks-stage{position:relative}
  .check-panel{display:none}
  .check-panel.show{display:block}
  @media(prefers-reduced-motion:no-preference){
    .check-panel.show{animation:panelin .45s ease}
    @keyframes panelin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
  }
  .panel-paper{position:relative;background:rgba(239,235,224,.035);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--cream-12);border-radius:12px;padding:38px;color:var(--cream)}
  .panel-paper svg{width:100%;height:auto;display:block}
  .panel-paper .stamp{position:absolute;right:26px;bottom:22px;margin:0;transform:rotate(-2deg)}


  /* legible product-style check demos */
  .ck-app{font-family:var(--mono);font-size:12.5px;color:var(--cream);min-height:250px}
  .ck-head{display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:.14em;color:var(--cream-45);padding-bottom:10px;border-bottom:1px solid var(--cream-28)}
  .ck-head .ck-mt{color:var(--cream)}
  .ck-row{display:grid;grid-template-columns:110px minmax(0,1fr) 84px;gap:12px;align-items:center;padding:14px 0;border-bottom:1px dashed var(--cream-12);opacity:.25;transition:opacity .3s}
  .ck-row.on{opacity:1}
  .ck-k{color:var(--cream-45);font-size:11px;letter-spacing:.08em}
  .ck-v{font-family:var(--sans);font-size:14.5px}
  .ck-v.hl b{background:none;border-bottom:2px solid var(--yellow);font-weight:600}
  .ck-r{justify-self:end;font-size:10.5px;letter-spacing:.08em;opacity:0;transform:scale(.9);transition:opacity .25s,transform .25s;padding:3px 8px;white-space:nowrap}
  .ck-row.done .ck-r{opacity:1;transform:none}
  .ck-row[data-res="pass"].done .ck-r::after{content:"VERIFIED";color:var(--cream-70);border:1px solid var(--cream-28);padding:2px 8px}
  .ck-row[data-res="warn"].done .ck-r::after{content:"NEW";color:var(--cream-70);border:1px solid var(--cream-45);padding:2px 8px}
  .ck-row[data-res="fail"].done .ck-r::after{content:"FLAG";color:var(--yellow);background:transparent;border:1px solid var(--yellow);padding:2px 8px;font-weight:600}
  .ck-compare{display:grid;grid-template-columns:80px 1fr 1fr;column-gap:14px}
  .ck-col-h{font-size:10px;letter-spacing:.14em;color:var(--cream-45);padding:12px 0 6px}
  .ck-cmp{display:contents}
  .ck-cmp .ck-k,.ck-cmp .ck-v{padding:12px 0;border-bottom:1px dashed var(--cream-12);opacity:.25;transition:opacity .3s}
  .ck-cmp.on .ck-k,.ck-cmp.on .ck-v{opacity:1}
  .ck-cmp[data-res="fail"].done .ck-v:last-child{background:rgba(237,255,0,.08)}
  .ck-verdict{display:inline-block;margin-top:18px;font-size:11px;font-weight:600;letter-spacing:.14em;padding:6px 12px;opacity:0;transform:scale(.95);transition:opacity .3s,transform .3s}
  .ck-verdict.held{background:transparent;color:var(--cream);border:1px solid var(--cream-28);border-left:3px solid var(--yellow)}
  .ck-verdict.in{opacity:1;transform:none}

  /* three-way match status (Balance check) */
  .rc-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}
  @media(max-width:560px){.rc-cols{grid-template-columns:1fr}}
  .rc-col{border:1px solid var(--cream-12);padding:18px 16px;opacity:.25;transition:opacity .35s}
  .rc-col.on{opacity:1}
  .rc-k{font-size:10px;letter-spacing:.14em;color:var(--cream-45);margin-bottom:12px}
  .rc-n{font-family:var(--mono);font-size:clamp(14px,1.5vw,19px);font-variant-numeric:tabular-nums;padding-bottom:12px;border-bottom:1px dashed var(--cream-12)}
  .rc-live{margin-top:16px;font-size:10.5px;letter-spacing:.1em;color:var(--cream-45)}

  /* legacy excel-ledger styles (unused) */
  .ledger{font-family:var(--mono);font-size:12px;color:var(--ink);min-height:300px}
  .lg-sheet{border:1px solid #C9C4B4;background:#FBF9F2}
  .lg-head,.lg-row{display:grid;grid-template-columns:52px minmax(0,1fr) 60px 84px 100px 92px}
  .lg-head span,.lg-row span{padding:8px 10px;border-right:1px solid #DDD8C8;border-bottom:1px solid #DDD8C8;min-width:0}
  .lg-head span:last-child,.lg-row span:last-child{border-right:none}
  .lg-head span{background:#E9E5D6;font-weight:600;font-size:11px;color:rgba(10,14,23,.75);white-space:nowrap;overflow:hidden}
  .lg-head .num,.lg-row .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
  .lg-row .desc{display:flex;align-items:center;gap:6px;overflow:hidden;white-space:nowrap}
  .lg-row .desc .rx{display:inline-block;height:9px;background:#1B1913;flex:0 1 auto;min-width:24px}
  .lg-row .mt{color:rgba(10,14,23,.55);font-size:11px}
  .lg-row{opacity:0;transform:translateY(3px);transition:opacity .35s ease,transform .35s ease}
  .lg-row:nth-child(even) span{background:#F3EFE2}
  .lg-row.in{opacity:1;transform:none}
  .lg-total{display:flex;gap:18px;flex-wrap:wrap;align-items:center;padding:10px;background:#EFEBDD;border-top:2px solid var(--ink)}
  .lg-total .lg-src{font-size:11px;color:rgba(10,14,23,.6);opacity:0;transition:opacity .35s ease}
  .lg-total .lg-src b{color:var(--ink);font-weight:600;margin-left:6px;font-variant-numeric:tabular-nums}
  .lg-total.in .lg-src{opacity:1}
  .lg-total.in .lg-src:nth-child(2){transition-delay:.25s}
  .lg-total.in .lg-src:nth-child(3){transition-delay:.5s}
  .lg-diff{margin-left:auto;font-size:11px;font-weight:600;background:transparent;border:1px solid var(--ink);border-left:3px solid var(--yellow);color:var(--ink);padding:4px 9px;opacity:0;transform:scale(.96);transition:opacity .3s ease,transform .3s ease}
  .lg-diff.in{opacity:1;transform:none}
  .lg-tabs{display:flex;gap:2px;margin-top:0;border:1px solid #C9C4B4;border-top:none;background:#E4E0D0;padding:3px 6px 0}
  .lg-tab{font-size:10.5px;color:rgba(10,14,23,.5);background:#D8D3C2;padding:4px 12px;border:1px solid #C9C4B4;border-bottom:none;border-radius:3px 3px 0 0}
  .lg-tab.active{background:#FBF9F2;color:var(--ink);font-weight:600}
  #lgStamp{opacity:0;transition:opacity .3s ease}
  #lgStamp.in{opacity:1}
  @media(max-width:600px){
    .lg-head,.lg-row{grid-template-columns:46px minmax(0,1fr) 88px 86px}
    .lg-head span:nth-child(3),.lg-row span:nth-child(3),
    .lg-head span:nth-child(4),.lg-row span:nth-child(4){display:none}
  }
    .lg-head span:nth-child(3),.lg-row .num:nth-child(3){display:none}
  }

  /* ============ wheel — suss label left, phrases right ============ */
  .wheel-sec{padding:150px 0;overflow:hidden}
  .wheel-grid{display:grid;grid-template-columns:300px minmax(0,1fr) auto;gap:48px;align-items:center}
  @media(max-width:700px){.wheel-grid{grid-template-columns:1fr;gap:36px}}
  .wheel-label{font-size:21px;font-weight:500;line-height:1.45;color:var(--cream-70)}
  .wheel-label .wl-suss{color:var(--cream);font-weight:700}
  .wheel-view{--wl:92px;height:calc(var(--wl) * 5);overflow:hidden;position:relative;
    -webkit-mask-image:linear-gradient(to bottom,transparent,#000 28%,#000 72%,transparent);
    mask-image:linear-gradient(to bottom,transparent,#000 28%,#000 72%,transparent)}
  @media(max-width:920px){.wheel-view{--wl:66px}}
  .wheel-list{list-style:none;transition:transform .7s cubic-bezier(.5,0,.15,1);will-change:transform}
  .wheel-list li{
    height:var(--wl);display:flex;align-items:center;
    font-family:var(--serif);font-weight:400;letter-spacing:.012em;
    font-size:clamp(32px,4.8vw,58px);color:var(--cream);
    opacity:.1;transform:scale(.94);transform-origin:left center;
    transition:opacity .7s ease,transform .7s ease;white-space:nowrap
  }
  .wheel-list li.near{opacity:.3}
  .wheel-list li.active{opacity:1;transform:scale(1)}
  @media(prefers-reduced-motion:reduce){.wheel-list,.wheel-list li{transition:none}}
  .wheel-cta{justify-self:end}
  @media(max-width:700px){.wheel-cta{justify-self:start}}
  .btn-ghost{display:inline-block;font-size:14px;font-weight:500;color:var(--cream);border:1px solid var(--cream-28);padding:12px 22px;text-decoration:none;border-radius:2px}
  .btn-ghost:hover{border-color:var(--cream);background:var(--cream-07)}

  /* ============ product: light screen out of the dark ============ */
  .desk{position:relative;background:var(--bg-2);overflow:hidden;border-bottom:1px solid var(--cream-12);padding:120px 0}
  .desk .wrap{position:relative;z-index:2}
  .flowbg{position:absolute;inset:-14% -6%;z-index:0;opacity:.13;filter:blur(1px);pointer-events:none;display:flex;flex-direction:column;gap:28px;transform:rotate(-2deg)}
  .flowbg .frow{display:flex;align-items:center;gap:28px;white-space:nowrap;font-family:var(--mono);font-size:13px;letter-spacing:.08em;color:var(--cream)}
  .flowbg .frow .bar{height:12px;background:rgba(239,235,224,.4);display:inline-block}
  .flowbg .frow .fd{width:11px;height:11px;border-radius:50%;border:1.5px solid rgba(239,235,224,.55);flex:none}
  .flowbg .frow .fd.y{background:var(--yellow);border-color:var(--yellow)}
  @media(prefers-reduced-motion:no-preference){
    .flowbg{animation:bgscroll 46s linear infinite}
    @keyframes bgscroll{from{transform:rotate(-2deg) translateY(0)}to{transform:rotate(-2deg) translateY(-34%)}}
  }
  .desk-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:72px;align-items:center}
  @media(max-width:900px){.desk-grid{grid-template-columns:1fr;gap:48px}.screen-col{order:2}.desk-copy{order:1}}
  .screen-col{min-width:0}
  .desk .browser{margin-top:0;width:100%;margin-left:0}
  
  .feature{position:relative;background:var(--bg);overflow:hidden;padding:150px 0}
  
  .feature .wrap{position:relative;z-index:2}
  .feat-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:96px;align-items:center}
  .feat-copy{min-width:0}
  .flip .feat-grid{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
  @media(max-width:1150px){
    .feat-grid,.flip .feat-grid{grid-template-columns:1fr;gap:52px}
    .feat-screen{order:2}.feat-copy{order:1}
    .feature .browser{max-width:860px}
  }
  .feat-screen{min-width:0}
  .feature .browser{margin-top:0}
  .feed-main{padding:30px 34px;min-height:360px}
  .feed{display:flex;flex-direction:column;font-family:var(--mono);font-size:12.5px}
  .feed-row{display:grid;grid-template-columns:70px minmax(0,1fr) 96px;gap:12px;align-items:center;padding:13px 0;border-bottom:1px solid var(--ink-07)}
  .feed-row .ft{color:var(--ink-45);font-size:11px}
  .feed-row .fx{font-family:var(--sans);font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .feed-row .fs{justify-self:end;font-size:10px;letter-spacing:.1em;padding:3px 9px}
  .feed-row .fs.done{background:var(--ink);color:var(--paper);font-weight:600}
  .feed-row .fs.held{background:var(--yellow);color:var(--ink);border:1px solid var(--ink);font-weight:600}
  @media(prefers-reduced-motion:no-preference){
    .feed-row.new{animation:feedin .45s ease}
    @keyframes feedin{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
  }
  .trail{font-family:var(--mono);font-size:12px}
  .tr-row{display:grid;grid-template-columns:74px minmax(0,1fr) 62px 64px 66px;gap:10px;align-items:center;padding:13px 0;border-bottom:1px solid var(--ink-07);opacity:0;transform:translateY(4px);transition:opacity .4s,transform .4s}
  .tr-row.in{opacity:1;transform:none}
  .tr-row span:first-child{color:var(--ink-45);font-size:11px}
  .tr-row span:nth-child(2){font-family:var(--sans);font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .tr-row .tr-s{justify-self:end;font-size:9.5px;letter-spacing:.1em;border:1px solid var(--ink-45);padding:2px 7px;color:var(--ink)}
  .tr-row .rx{display:inline-block;height:9px;background:#1B1913;vertical-align:middle}
  .desk-word{font-family:var(--serif);font-weight:400;font-size:clamp(36px,4.2vw,66px);letter-spacing:.012em;line-height:1.05;margin-bottom:26px;max-width:none;overflow-wrap:break-word}
  .desk-word em{font-style:italic}
  .desk-copy .sc-body{margin-top:0;font-size:18px;max-width:38ch}
  .desk-btn{margin-top:30px}
  .desk .sc-h{font-size:clamp(36px,5vw,62px)}
  .mock-note{margin-top:24px;font-family:var(--mono);font-size:12px;letter-spacing:.05em;color:var(--cream-70)}
  .mock-note b{background:none;color:var(--yellow);font-weight:500;padding:0}
  .video-note{margin-top:14px;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;color:var(--cream-28)}

  .browser{margin-top:56px;background:var(--paper);color:var(--ink);border-radius:6px;overflow:hidden;box-shadow:0 44px 120px rgba(0,0,0,.65)}
  .browser-bar{display:flex;align-items:center;padding:12px 18px;border-bottom:1px solid var(--ink-12);background:var(--paper-2)}
  .browser-bar .url{font-family:var(--mono);font-size:12px;color:var(--ink-45);letter-spacing:.05em}
  .app{display:grid;grid-template-columns:200px 1fr;min-height:420px}
  @media(max-width:760px){.app{grid-template-columns:1fr}.app-side{display:none}}
  .app-side{border-right:1px solid var(--ink-12);padding:22px 16px;display:flex;flex-direction:column;gap:6px}
  .app-side .item{display:flex;align-items:center;gap:10px;padding:8px 10px;font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--ink-45);border-radius:3px}
  .app-side .item.active{background:var(--ink-07);color:var(--ink)}
  .app-side .item .d{width:6px;height:6px;border-radius:50%;background:var(--ink-12);flex:none}
  .app-side .item.active .d{background:var(--yellow);outline:1px solid var(--ink)}
  .app-side .r{height:8px;background:var(--ink-07);flex:1;border-radius:2px}
  .app-main{padding:26px 28px}
  .app-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;gap:12px;flex-wrap:wrap}
  .app-head h4{font-family:var(--mono);font-size:13px;letter-spacing:.14em;color:var(--ink-45);font-weight:500}
  .app-head .live{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--ink)}
  .app-head .live i{width:7px;height:7px;border-radius:50%;background:var(--yellow);outline:1px solid var(--ink)}
  table.queue{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:12px}
  .queue th{font-weight:500;text-align:left;color:var(--ink-45);letter-spacing:.1em;font-size:10.5px;padding:0 12px 10px;border-bottom:1px solid var(--ink-12)}
  .queue td{padding:14px 12px;border-bottom:1px solid var(--ink-07);white-space:nowrap}
  .queue tr:last-child td{border-bottom:none}
  .redact{display:inline-block;height:10px;background:var(--ink-12);border-radius:2px}
  .checkdots{display:inline-flex;gap:7px}
  .checkdots i{width:9px;height:9px;border-radius:50%;border:1.5px solid var(--ink-45)}
  .checkdots i.on{background:var(--ink);border-color:var(--ink)}
  .checkdots i.hold{background:var(--yellow);border-color:var(--ink)}
  .status{display:inline-flex;font-size:10.5px;letter-spacing:.1em;padding:4px 10px;border-radius:2px}
  .status.clear{color:var(--paper);background:var(--ink);font-weight:600}
  .status.held{color:var(--ink);background:var(--yellow);border:1px solid var(--ink);font-weight:600}
  .status.review{color:var(--ink-45);border:1px solid var(--ink-45)}
  @media(max-width:640px){.queue th:nth-child(2),.queue td:nth-child(2){display:none}}
  @media(prefers-reduced-motion:no-preference){
    tr.rowin td{animation:rowin .5s ease}
    @keyframes rowin{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
  }


  /* ============ founder story — text over the photo ============ */
  .story{position:relative;overflow:hidden;padding:56px 0 190px;border-bottom:1px solid var(--cream-12)}
  .story-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 62%;filter:saturate(.9) brightness(1.12);z-index:0}
  .story-shade{position:absolute;inset:0;z-index:1;background:
    linear-gradient(to bottom,rgba(19,17,16,1) 0%,rgba(19,17,16,0) 16%,rgba(19,17,16,0) 82%,rgba(19,17,16,1) 100%),
    linear-gradient(90deg,rgba(19,17,16,.8) 0%,rgba(19,17,16,.64) 52%,rgba(19,17,16,.42) 100%)}
  .story-wrap{position:relative;z-index:2}

  /* heading — bold like the magazine reference */
  .story h2{font-family:var(--sans);font-weight:700;font-size:clamp(38px,5.4vw,74px);letter-spacing:-.025em;line-height:1.02;margin-bottom:0;max-width:none}

  .story-grid{display:grid;gap:80px;align-items:start}
  .story-lede{font-family:var(--serif);font-size:clamp(26px,3vw,40px);line-height:1.3;letter-spacing:.012em;max-width:20ch}
  .story-lede em{font-style:italic;color:var(--yellow)}
  .story-body{
    background:rgba(19,17,16,.2);
    backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
    border:1px solid var(--cream-12);border-radius:12px;
    padding:28px 30px;align-self:start
  }
  .story-body p{color:var(--cream);font-size:16.5px;line-height:1.7;max-width:44ch;text-shadow:0 1px 12px rgba(19,17,16,.9)}
  .story-body p+p{margin-top:18px}

  .story-grid{grid-template-columns:minmax(0,6fr) minmax(0,5fr);margin-top:170px}
  .story-body{margin-top:-40px}

  @media(max-width:860px){
    .story-grid{grid-template-columns:1fr;gap:36px;margin-top:60px}
    .story-body{margin-top:0}
  }


  /* glass trust ledger in The record. */
  .gled{font-family:var(--mono);font-size:12px}
  .gl-head,.gl-row{display:grid;grid-template-columns:46px minmax(0,1fr) 104px 100px;gap:12px;align-items:center}
  .gl-head{font-size:9.5px;letter-spacing:.12em;color:var(--cream-45);padding-bottom:10px;border-bottom:1px solid var(--cream-28)}
  .gl-head span{white-space:nowrap;overflow:hidden}
  .gl-head .num,.gl-row .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
  .gl-row{padding:12px 0;border-bottom:1px dashed var(--cream-12);color:var(--cream)}
  .gl-row span:first-child{color:var(--cream-45);font-size:11px}
  .gl-row .gl-d{font-family:var(--sans);font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .gl-row .gl-m{color:var(--cream-45);font-size:10.5px;font-family:var(--mono);font-weight:400;margin-left:4px}
  .grx{display:inline-block;height:8px;background:rgba(239,235,224,.28);vertical-align:middle;border-radius:1px}
  .gl-row{opacity:0;transform:translateY(4px);transition:opacity .4s,transform .4s}
  .gl-row.in{opacity:1;transform:none}
  .gl-foot{display:flex;gap:18px;flex-wrap:wrap;align-items:center;padding-top:14px;margin-top:2px;border-top:1px solid var(--cream-28);font-size:10.5px;letter-spacing:.08em;color:var(--cream-45)}
  .gl-foot b{color:var(--cream);font-weight:600;margin-left:6px;font-variant-numeric:tabular-nums}
  .gl-bal{margin-left:auto;color:var(--cream);border:1px solid var(--cream-28);border-left:3px solid var(--yellow);padding:4px 9px;font-weight:600}
  @media(max-width:480px){
    .gl-head,.gl-row{grid-template-columns:40px minmax(0,1fr) 92px}
    .gl-head .num:nth-last-child(2),.gl-row .num:nth-last-child(2){display:none}
  }

  /* glass product frames — the live product is dark glass, documents stay paper */
  .feature .browser{
    background:rgba(239,235,224,.055);
    backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
    border:1px solid rgba(239,235,224,.14);border-radius:12px;
    color:var(--cream);box-shadow:0 30px 90px rgba(0,0,0,.45)
  }
  .feature .browser-bar{background:rgba(239,235,224,.045);border-bottom:1px solid rgba(239,235,224,.1)}
  .feature .browser-bar .url{color:var(--cream-45)}
  .feature .app-head h4{color:var(--cream-45)}
  .feature .app-head .live{color:var(--yellow)}
  .feature .feed-row{border-bottom:1px solid rgba(239,235,224,.09)}
  .feature .feed-row .ft{color:var(--cream-45)}
  .feature .feed-row .fx{color:var(--cream)}
  .feature .feed-row .fs.done{background:transparent;border:1px solid var(--cream-28);color:var(--cream-70);font-weight:500}
  .feature .feed-row .fs.held{background:transparent;border:1px solid var(--yellow);color:var(--yellow);font-weight:600}
  .feature .tr-row{border-bottom:1px solid rgba(239,235,224,.09)}
  .feature .tr-row span{color:var(--cream)}
  .feature .tr-row span:first-child{color:var(--cream-45)}
  .feature .tr-row .tr-s{border-color:var(--cream-28);color:var(--cream-70)}
  .feature .tr-row .rx{background:rgba(239,235,224,.3)}
  .feature .app-head .live[style]{color:var(--cream-70)!important}
  .desk-word em{color:var(--yellow)}

  /* ============ cta ============ */
  .cta{padding:130px 0}
  .cta .inner{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;flex-wrap:wrap}
  .btn-primary{display:inline-block;font-size:15px;font-weight:500;background:transparent;color:var(--cream);border:1px solid var(--cream);padding:16px 30px;text-decoration:none;border-radius:2px;cursor:pointer}
  .btn-primary:hover{background:var(--cream);color:var(--ink)}

  /* ============ request access form ============ */
  .contact{padding:110px 0 140px}
  .contact-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:72px;margin-top:56px;align-items:start}
  @media(max-width:860px){.contact-grid{grid-template-columns:1fr;gap:44px}}
  .contact-aside p{color:var(--cream-70);font-size:17px;line-height:1.65;max-width:40ch}
  .contact-aside .note{margin-top:22px;font-family:var(--mono);font-size:11.5px;letter-spacing:.05em;color:var(--cream-45)}
  .contact-alt{margin-top:34px;padding-top:24px;border-top:1px solid var(--cream-12)}
  .contact-alt .ca-k{font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:var(--cream-45);margin-bottom:8px}
  .contact-alt .ca-v a{font-size:19px;color:var(--cream);text-decoration:none;border-bottom:1px solid var(--yellow)}
  .contact-alt .ca-v a:hover{color:#fff}
  .ra-form{display:grid;grid-template-columns:1fr 1fr;gap:22px}
  .ra-form .full{grid-column:1/-1}
  @media(max-width:560px){.ra-form{grid-template-columns:1fr}.ra-form .full{grid-column:auto}}
  .ra-field{display:flex;flex-direction:column;gap:8px}
  .ra-field label{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--cream-45)}
  .ra-field input,.ra-field select,.ra-field textarea{
    font-family:var(--sans);font-size:15.5px;color:var(--cream);
    background:var(--bg-2);border:1px solid var(--cream-28);border-radius:2px;padding:13px 14px;width:100%
  }
  .ra-field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23EFEBE0' fill='none' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;cursor:pointer}
  .ra-field textarea{min-height:110px;resize:vertical}
  .ra-field input:focus-visible,.ra-field select:focus-visible,.ra-field textarea:focus-visible{outline:2px solid var(--yellow);outline-offset:1px;border-color:transparent}
  .ra-field input::placeholder,.ra-field textarea::placeholder{color:var(--cream-28)}
  .ra-submit{grid-column:1/-1;justify-self:start}
  .form-done{display:none;padding:40px 0}
  .form-done.show{display:block}
  .form-done h3{font-family:var(--serif);font-weight:400;font-size:32px;letter-spacing:.012em;margin-bottom:12px}
  .form-done p{color:var(--cream-70);max-width:44ch}

  /* ============ resources ============ */
  .res-head{padding:110px 0 0}
  .res-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;margin-top:64px;align-items:start;padding-bottom:140px}
  @media(max-width:900px){.res-grid{grid-template-columns:1fr}}
  .picker{display:flex;align-items:center;gap:14px;margin-bottom:28px;flex-wrap:wrap}
  select#stateSel{
    font-family:var(--mono);font-size:14px;letter-spacing:.05em;color:var(--cream);
    background:var(--bg-2);border:1px solid var(--cream-28);border-radius:2px;padding:11px 42px 11px 14px;
    appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23EFEBE0' fill='none' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;cursor:pointer;min-width:260px
  }
  .picker .hint{font-family:var(--mono);font-size:12px;color:var(--cream-45);letter-spacing:.08em}
  #usmap{width:100%;height:auto;display:block}
  #usmap path.stx{fill:var(--bg-2);stroke:rgba(239,235,224,.22);stroke-width:.8;cursor:pointer;transition:fill .2s ease}
  #usmap path.stx:hover{fill:#221e19;stroke:var(--cream-45)}
  #usmap path.stx.featured{stroke:rgba(239,235,224,.5)}
  #usmap path.stx.sel{
    fill:rgba(237,255,0,.16);stroke:var(--yellow);stroke-width:1.1;
    filter:drop-shadow(0 0 8px rgba(237,255,0,.45)) drop-shadow(0 0 24px rgba(237,255,0,.18))
  }
  #usmap path.stx:focus-visible{outline:none;stroke:var(--yellow);stroke-width:1.1}
  .map-key{margin-top:16px;display:flex;gap:22px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--cream-45)}
  .map-key span{display:inline-flex;align-items:center;gap:8px}
  .map-key i{width:10px;height:10px;background:var(--bg-2);border:1px solid rgba(239,235,224,.5);display:inline-block}
  .map-key i.y{background:rgba(237,255,0,.16);border-color:var(--yellow);box-shadow:0 0 8px rgba(237,255,0,.5)}

  .rule-card{
    background:rgba(239,235,224,.035);
    backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
    border:1px solid var(--cream-12);border-radius:10px;
    color:var(--cream);padding:36px 36px 30px
  }
  .rule-card .state-label{font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:var(--cream-45);margin-bottom:10px}
  .rule-card h3{font-family:var(--serif);font-weight:400;font-size:32px;letter-spacing:.012em;margin-bottom:22px;color:var(--cream)}
  .rule-row{padding:16px 0;border-top:1px dashed var(--cream-12)}
  .rule-row .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;color:var(--cream-45);margin-bottom:6px}
  .rule-row .v{font-size:15px;line-height:1.6;color:var(--cream-70)}
  .rule-card .src{margin-top:22px;font-family:var(--mono);font-size:10.5px;letter-spacing:.05em;color:var(--cream-28);line-height:1.7}
  .rule-card .pending{color:var(--cream-70);font-size:15px;line-height:1.6}
  .draft-note{margin-top:18px;font-family:var(--mono);font-size:10.5px;letter-spacing:.05em;color:var(--cream-28)}
  .draft-note::before{content:"// "}

  footer.site{border-top:1px solid var(--cream-12);padding:32px 0}
  footer .wrap{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}
  footer p{font-family:var(--mono);font-size:12px;color:var(--cream-45);letter-spacing:.05em}
  .foot-links{display:flex;gap:26px;align-items:center}
  .foot-link{font-family:var(--mono);font-size:12px;letter-spacing:.05em;color:var(--cream-45);text-decoration:none;border-bottom:1px solid transparent;padding:0}
  .foot-link:hover{color:var(--cream);border-bottom-color:var(--cream-45)}

  /* ============ security page ============ */
  .sec{position:relative;overflow:hidden;padding:120px 0 170px}
  .sec-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 28%;filter:saturate(.7) brightness(.85);z-index:0}
  .sec-shade{position:absolute;inset:0;z-index:1;background:
    linear-gradient(to bottom,rgba(19,17,16,1) 0%,rgba(19,17,16,0) 16%,rgba(19,17,16,0) 82%,rgba(19,17,16,1) 100%),
    linear-gradient(90deg,rgba(19,17,16,.95) 0%,rgba(19,17,16,.88) 55%,rgba(19,17,16,.72) 100%)}
  .sec-wrap{position:relative;z-index:2}
  .sec-intro{margin-top:18px;font-size:18px;color:var(--cream-70);max-width:52ch;line-height:1.65}

  /* ============ privacy page ============ */
  .privacy{padding:110px 0 140px}
  .pp-meta{margin-top:18px;font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--cream-45)}
  .pp-draft{margin-top:10px;font-family:var(--mono);font-size:11px;letter-spacing:.05em;color:var(--yellow)}
  .pp-body{margin-top:48px;max-width:70ch}
  .pp-body h3{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--cream-45);margin:40px 0 12px;padding-top:22px;border-top:1px solid var(--cream-12)}
  .pp-body h3:first-child{margin-top:0;border-top:none;padding-top:0}
  .pp-body p{color:var(--cream-70);font-size:16px;line-height:1.7}

.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.ra-error{color:#ff6b6b;font-family:var(--mono,monospace);font-size:13px;margin-top:14px}

/* ===== Owner phone-review revisions ===== */
/* Editorial statements keep Instrument Serif italic (the approved mockup look):
   the scene lines ("Done by hand…"), feature headings ("The record." etc.), the
   founder story, stats intro, big numerals, and the phrase wheel all stay serif.
   Only the functional section title "How suss. checks every disbursement" is sans
   (owner request); the hero was always sans. */
.checks-title{font-family:var(--sans);font-style:normal;font-weight:700;letter-spacing:-.025em;margin-top:-12px}
/* Hero: match the live site's exact type spec (was slightly larger / looser) */
.hero h1{font-size:clamp(44px,6.2vw,84px);line-height:1.03}
/* Phrase wheel: show ~3 phrases so each sits in its own space and doesn't bleed
   into neighbouring sections (paired with the JS centering change in home.js). */
.wheel-view{height:calc(var(--wl) * 3)}
.wheel-sec{padding:130px 0}

/* Privacy policy (v1 text re-housed in the new design; interim until v2) */
.pp-banner{margin:26px 0 6px;padding:16px 20px;border:1px solid var(--cream-12);border-left:3px solid var(--yellow);border-radius:10px;background:var(--cream-07)}
.pp-banner .pp-banner-k{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--yellow);margin-bottom:8px}
.pp-banner p{color:var(--cream-70);font-size:14.5px;line-height:1.6;margin:0}
.pp-banner a{color:var(--cream);text-decoration:underline}
.pp-body h4{font-family:var(--sans);font-weight:600;font-size:15px;color:var(--cream);margin:22px 0 8px}
.pp-body ul{margin:12px 0 8px;padding-left:20px;list-style:disc}
.pp-body li{color:var(--cream-70);font-size:16px;line-height:1.7;margin:6px 0}
.pp-body li strong,.pp-body p strong{color:var(--cream);font-weight:600}
.pp-body a{color:var(--cream);text-decoration:underline}
.pp-callout{margin:16px 0;padding:14px 18px;border:1px solid var(--cream-12);border-left:2px solid var(--yellow);border-radius:8px;background:rgba(239,235,224,.03);color:var(--cream);font-size:15px;line-height:1.6}
.pp-sec-n{color:var(--cream-28)}

/* Why page: the "That's not a legal problem" block eases into frame ~2s in,
   after the crash photo has time to set. */
.story-body{animation:storyIn .9s cubic-bezier(.2,.72,.2,1) 2s both}
@keyframes storyIn{from{opacity:0;transform:translateX(56px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.story-body{animation:none}}

/* Mobile nav (hamburger + slide-down menu, injected by nav.js) */
.nav-burger{display:none}
.nav-mobile{display:none}
@media(max-width:720px){
  .tabs{display:none}
  .nav-burger{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:44px;height:44px;padding:0;background:none;border:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .nav-burger span{display:block;width:24px;height:2px;background:var(--cream);transition:transform .25s ease,opacity .2s ease}
  header.site.nav-open .nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  header.site.nav-open .nav-burger span:nth-child(2){opacity:0}
  header.site.nav-open .nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .nav-mobile{display:flex;flex-direction:column;position:fixed;top:68px;left:0;right:0;bottom:0;background:var(--bg);padding:12px 22px 40px;z-index:45;opacity:0;transform:translateY(-8px);pointer-events:none;transition:opacity .25s ease,transform .25s ease;overflow-y:auto}
  header.site.nav-open .nav-mobile{opacity:1;transform:none;pointer-events:auto}
  .nav-mobile a.tab{font-family:var(--sans);font-size:22px;font-weight:500;color:var(--cream);padding:20px 2px;border-bottom:1px solid var(--cream-12);text-decoration:none;display:block}
  .nav-mobile .nav-cta{display:inline-flex;align-self:flex-start;margin-top:28px;font-size:15px;padding:14px 26px}
}

/* 24/7-accountant feature: tighter, calmer flow on phones (less padding, quieter
   ambient flow-rows behind the copy, tighter stack). */
@media(max-width:720px){
  .desk{padding:72px 0}
  .desk .flowbg{opacity:.05;filter:blur(2px)}
  .feat-grid,.flip .feat-grid{gap:36px}
  .mock-note{margin-top:18px}
}