/* ================= LEDGER v2 · foundation-compliant =================
   Tokens: 4pt spacing scale · fixed type scale · 1 btn spec (52px)
   Fonts: Fraunces (display) + JetBrains Mono (data) + system body
   ==================================================================== */
:root{
  /* semantic colors — AA-checked pairs */
  --surface:#FAF7EF; --surface-2:#FFFFFF; --ink:#1F2933; --muted:#5B6B7C;
  --accent:#1D4ED8; --accent-ink:#FFFFFF; --positive:#116649; --negative:#B3372C;
  --line:#D9DFE7; --rule:#E4EAF1; --margin-red:#D4655C; --gold:#8A6A1F;
  --dark:#16212B; --dark-ink:#E8EDF3; --dark-muted:#9FB0C0; --wa:#1FAB55;
  /* spacing (4pt) */
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;--s9:96px;
  /* type scale (locked ratios) */
  --t-display:clamp(2.25rem,7.5vw,4rem); --t-h2:clamp(1.5rem,4.5vw,2.25rem);
  --t-h3:1.125rem; --t-body:1rem; --t-small:.875rem; --t-caption:.75rem; --t-micro:.6875rem;
  /* misc */
  --r-s:6px;--r-m:12px;--r-full:999px;
  --shadow-1:0 1px 2px rgba(31,41,51,.06),0 8px 24px -12px rgba(31,41,51,.18);
  --shadow-2:0 24px 48px -24px rgba(31,41,51,.32);
  --ease:cubic-bezier(.22,1,.36,1); --dur:.5s;
  --d:'Fraunces',Georgia,serif; --m:'JetBrains Mono',ui-monospace,monospace;
  --b:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--b);background:var(--surface);color:var(--ink);line-height:1.6;font-size:var(--t-body);-webkit-font-smoothing:antialiased;overflow-x:hidden;
background-image:repeating-linear-gradient(transparent 0 31px,var(--rule) 31px 32px)}
a{text-decoration:none;color:inherit}
h1,h2,h3{font-family:var(--d);font-weight:600;line-height:1.12;letter-spacing:-.01em;overflow-wrap:break-word}
.mono{font-family:var(--m);font-variant-numeric:tabular-nums}
.wrap{max-width:920px;margin:0 auto;padding-inline:var(--s4)}
section{padding-block:var(--s8);position:relative;z-index:2}
@media(min-width:768px){section{padding-block:var(--s9)}}
/* margin rule */
.margin-line{position:fixed;top:0;bottom:0;left:clamp(14px,4vw,56px);width:2px;background:var(--margin-red);opacity:.45;pointer-events:none;z-index:1}
/* a11y */
.skip{position:absolute;left:-999px;top:var(--s2)}
.skip:focus{left:var(--s2);z-index:100;background:var(--ink);color:#fff;padding:var(--s2) var(--s4);border-radius:var(--r-s)}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:var(--r-s)}
/* motion */
.rv{opacity:0;transform:translateY(20px);transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease)}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}html{scroll-behavior:auto}}
/* ONE button spec */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);font-family:var(--b);font-weight:650;font-size:var(--t-small);height:52px;padding-inline:var(--s5);border-radius:var(--r-s);border:1.5px solid transparent;cursor:pointer;transition:transform .25s var(--ease),box-shadow .25s var(--ease);white-space:nowrap}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:scale(.98)}
.btn svg{width:18px;height:18px;flex-shrink:0}
.btn-primary{background:var(--accent);color:var(--accent-ink);box-shadow:var(--shadow-1)}
.btn-dark{background:var(--ink);color:#fff}
.btn-outline{border-color:var(--ink);color:var(--ink);background:var(--surface-2)}
.btn-wa{background:var(--wa);color:#fff}
/* section header */
.k{font-family:var(--m);font-size:var(--t-micro);font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:var(--s3)}
h2{font-size:var(--t-h2);margin-bottom:var(--s2)}
h2 em{font-style:italic;color:var(--positive)}
.lead{color:var(--muted);max-width:58ch}

/* ---------- HERO ---------- */
.hero{border-bottom:3px double var(--ink);background:linear-gradient(180deg,#F2EDDF,var(--surface));position:relative;z-index:2}
.hero-nav{display:flex;justify-content:space-between;align-items:center;gap:var(--s3);padding:var(--s4);max-width:920px;margin:0 auto}
.mark{font-family:var(--m);font-weight:700;font-size:var(--t-small)}
.mark .cr{color:var(--positive)} .mark .dr{color:var(--negative)}
.hero-body{padding-block:var(--s7) var(--s8);position:relative}
.stamp{font-family:var(--m);font-size:var(--t-caption);letter-spacing:.14em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:var(--s4)}
.hero h1{font-size:var(--t-display);max-width:17ch}
.hero h1 em{font-style:italic;color:var(--positive)}
.hero .sub{color:var(--muted);max-width:56ch;margin-block:var(--s4) var(--s6)}
.cta-row{display:flex;gap:var(--s3);flex-wrap:wrap;margin-bottom:var(--s5)}
.meta-row{display:flex;gap:var(--s5);flex-wrap:wrap;font-size:var(--t-small);color:var(--muted)}
.meta-row span{display:inline-flex;align-items:center;gap:var(--s2)}
.meta-row svg{width:16px;height:16px;color:var(--accent)}
.audit{margin-top:var(--s5);display:inline-flex;align-items:center;gap:var(--s2);border:2px solid var(--positive);color:var(--positive);font-family:var(--m);font-size:var(--t-micro);font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:var(--s2) var(--s4);border-radius:var(--r-s);transform:rotate(-2deg)}

/* tally band (pauses offscreen) */
.band{background:var(--dark);color:var(--dark-muted);overflow:hidden;padding-block:var(--s3);position:relative;z-index:2}
.band-track{display:flex;gap:var(--s7);width:max-content;animation:mq 28s linear infinite;font-family:var(--m);font-size:var(--t-small)}
.band-track.paused{animation-play-state:paused}
.band b{color:#7ED9AC}.band i{font-style:normal;color:#F2A79D}
@keyframes mq{to{transform:translateX(-50%)}}

/* T-account */
.tacct{background:var(--surface-2);border:2px solid var(--ink);border-radius:var(--r-s);margin-top:var(--s6);overflow:hidden;box-shadow:var(--shadow-1)}
.t-head{display:grid;grid-template-columns:1fr 1fr;border-bottom:2px solid var(--ink);font-family:var(--m);font-size:var(--t-micro);letter-spacing:.14em;text-transform:uppercase;text-align:center}
.t-head span{padding:var(--s3)}
.t-head span:first-child{border-right:2px solid var(--ink);color:var(--negative)}
.t-head span:last-child{color:var(--positive)}
.t-body{display:grid;grid-template-columns:1fr 1fr}
.t-col:first-child{border-right:2px solid var(--ink)}
.t-row{display:flex;justify-content:space-between;gap:var(--s2);padding:var(--s3) var(--s4);font-size:var(--t-small);border-bottom:1px dotted var(--line)}
.t-row:last-child{border:none}
.t-row span{color:var(--muted)}
.t-row b{font-family:var(--m)}
.t-col:first-child b{color:var(--negative)}
.t-col:last-child b{color:var(--positive)}

/* vouchers */
.vouchers{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s6)}
.vou{background:var(--surface-2);border:1.5px solid var(--ink);border-radius:var(--r-s);padding:var(--s3) var(--s4);font-weight:650;font-size:var(--t-small);position:relative;padding-left:calc(var(--s4) + 6px);transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.vou::before{content:"";position:absolute;left:0;top:14%;bottom:14%;width:5px;background:var(--accent);border-radius:0 3px 3px 0}
.vou:hover{transform:translateY(-3px);box-shadow:var(--shadow-1)}
.vou small{display:block;color:var(--muted);font-weight:500;font-size:var(--t-caption)}

/* journal */
.journal{margin-top:var(--s6);background:var(--surface-2);border:1.5px solid var(--ink);border-radius:var(--r-s);overflow:hidden;box-shadow:var(--shadow-1)}
.j-head{font-family:var(--m);font-size:var(--t-micro);letter-spacing:.16em;text-transform:uppercase;color:#fff;background:var(--dark);padding:var(--s3) var(--s4)}
.j-entry{padding:var(--s5) var(--s4);border-bottom:1px solid var(--rule)}
.j-entry:last-child{border:none}
.j-entry .dt{font-family:var(--m);font-size:var(--t-caption);color:var(--negative);font-weight:700}
.j-entry h3{font-size:var(--t-h3);margin-block:var(--s1)}
.j-entry .org{font-size:var(--t-small);color:var(--accent);font-weight:650;margin-bottom:var(--s2)}
.j-entry p{font-size:var(--t-small);color:var(--muted);max-width:60ch}
.j-entry .narr{font-family:var(--m);font-size:var(--t-caption);color:var(--gold);margin-top:var(--s2);display:block}

/* awards */
.aw{display:flex;justify-content:space-between;gap:var(--s3);padding:var(--s4) var(--s1);border-bottom:1px dashed var(--line);flex-wrap:wrap;align-items:baseline}
.aw .t{font-family:var(--d);font-size:var(--t-h3)}
.aw .t svg{width:16px;height:16px;color:var(--positive);margin-right:var(--s2);vertical-align:-2px}
.aw .n{color:var(--muted);font-size:var(--t-small);flex-basis:100%}
.aw .y{font-family:var(--m);color:var(--accent);font-weight:700;font-size:var(--t-caption)}

/* receipts */
.recs{display:grid;gap:var(--s3);margin-top:var(--s6)}
.rec{background:var(--surface-2);border:1.5px dashed var(--ink);border-radius:var(--r-s);padding:var(--s5);position:relative}
.rec::before{content:"RECEIPT";position:absolute;top:-9px;left:var(--s4);background:var(--surface);font-family:var(--m);font-size:.58rem;letter-spacing:.22em;color:var(--muted);padding-inline:var(--s2)}
.rec p{color:var(--muted);font-style:italic;font-size:var(--t-small);margin-bottom:var(--s3)}
.rec b{font-family:var(--d);font-size:var(--t-small)}
.rec span{display:block;font-size:var(--t-caption);color:var(--muted)}

/* balance sheet */
.bs{background:var(--surface-2);border:2px solid var(--ink);border-radius:var(--r-s);margin-top:var(--s6);overflow:hidden;box-shadow:var(--shadow-2)}
.bs-head{text-align:center;padding:var(--s4);border-bottom:2px solid var(--ink)}
.bs-head h3{font-size:var(--t-h3)}
.bs-head span{font-family:var(--m);font-size:var(--t-micro);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.bs-row{display:flex;justify-content:space-between;gap:var(--s3);padding:var(--s3) var(--s4);font-size:var(--t-small);border-bottom:1px dotted var(--line);flex-wrap:wrap}
.bs-row span{color:var(--muted);font-family:var(--m);font-size:var(--t-caption);text-transform:uppercase;letter-spacing:.06em;align-self:center}
.bs-row b{text-align:right;overflow-wrap:anywhere}
.bs-row .yes{color:var(--positive)}
.bs-total{display:flex;justify-content:space-between;padding:var(--s4);font-family:var(--m);font-weight:700;border-top:2px solid var(--ink);background:#EDF5EF;font-size:var(--t-small)}
.bs-total .ok{color:var(--positive)}
.refs{display:grid;gap:var(--s3);margin-top:var(--s4)}
.ref{background:var(--surface-2);border:1.5px solid var(--line);border-radius:var(--r-s);padding:var(--s4);font-size:var(--t-small)}
.ref b{font-family:var(--d)}
.ref span{display:block;color:var(--muted);font-size:var(--t-caption)}

/* finale + footer + sticky */
.fin{text-align:center}
.fin p{color:var(--muted);margin-top:var(--s3)}
.fin .cta-row{justify-content:center;margin-top:var(--s6)}
footer{border-top:3px double var(--ink);padding:var(--s5);text-align:center;font-size:var(--t-caption);color:var(--muted);position:relative;z-index:2;background:var(--surface)}
footer a{color:var(--accent);font-weight:650}
.stick{position:fixed;inset-inline:0;bottom:0;z-index:40;background:color-mix(in srgb,var(--surface) 94%,transparent);backdrop-filter:blur(12px);border-top:2px solid var(--ink);padding:var(--s3) var(--s4) calc(var(--s3) + env(safe-area-inset-bottom));display:flex;gap:var(--s3);transform:translateY(110%);transition:transform .4s var(--ease)}
.stick.show{transform:none}
.stick .btn{flex:1}
@media(min-width:768px){
 .recs{grid-template-columns:repeat(3,1fr)}
 .refs{grid-template-columns:1fr 1fr}
 .stick{display:none}
}