
/* FiDUS product-page kit: layout and components. Colour, type and the light ring live in fidus.css.
   Extracted from the live MCP page on 16 Sep 2026 so sibling product pages share one sheet. */

:root{
  --studio:#f2f1ee; --studio-deep:#dedcd7; --paper:#ffffff; --black:#0f0e11;
  --ink:#151417; --ink-2:#4a4750; --ink-3:#8a8791; --ink-4:#c9c6c0;
  --line:rgba(0,0,0,.09); --line-2:rgba(0,0,0,.18);
  --crimson:#b5123e; --crimson-deep:#8e0d31; --verified:#1f6b5a;
  --display:Boska,"Bodoni 72","Didot",Georgia,serif;
  --body:-apple-system,BlinkMacSystemFont,"SF Pro Text",system-ui,"Helvetica Neue",Arial,sans-serif;
  --mono:"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --gutter:clamp(20px,5vw,96px); --max:1320px;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--studio);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
:focus-visible{outline:2px solid var(--crimson);outline-offset:3px;border-radius:2px}
::selection{background:var(--crimson);color:#fff}
p{margin:0}

/* the studio: a lit cyclorama, brighter at the centre, falling off to the edges */
.studio{position:fixed;inset:0;z-index:0;pointer-events:none;background:radial-gradient(120% 90% at 50% 30%,#fbfbfa 0%,var(--studio) 45%,var(--studio-deep) 100%)}
.studio::after{content:"";position:absolute;inset:0;opacity:.5;mix-blend-mode:multiply;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .96 0 0 0 0 .96 0 0 0 0 .95 0 0 0 .08 0'/></filter><rect width='200' height='200' filter='url(%23n)'/></svg>")}
main{position:relative;z-index:1}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}

/* type roles */
.display{font-family:var(--display);font-weight:400;font-feature-settings:"salt" 1,"liga" 1;letter-spacing:-.005em;line-height:.96;text-wrap:balance;margin:0;text-transform:uppercase}
.display em{font-style:italic;font-weight:380;color:var(--crimson)}
h1.display{font-size:clamp(46px,7vw,112px)}
h2.display{font-size:clamp(36px,4.8vw,72px)}
h3.display{font-size:clamp(22px,2.2vw,30px);text-transform:none;line-height:1.05}
.kicker{font:600 11px/1.5 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);margin:0}
.kicker.crimson{color:var(--crimson)}
.lede{font:500 12.5px/1.7 var(--body);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-2);max-width:46em;margin:0}
.cap{font-size:14.5px;color:var(--ink-2);line-height:1.55;margin:0;max-width:48ch}
.prompt{font-family:var(--display);font-style:italic;font-weight:400;font-size:clamp(24px,2.6vw,40px);line-height:1.15;color:var(--crimson);margin:0;text-wrap:balance}
.num{font-variant-numeric:tabular-nums lining-nums}
.mono{font-family:var(--mono)}

/* stats: a serif figure over a tiny uppercase caption */
.stat{margin:0}
.stat b{display:block;font-family:var(--display);font-weight:400;font-size:clamp(40px,4.6vw,76px);line-height:.95;letter-spacing:-.01em;color:var(--ink);font-variant-numeric:tabular-nums lining-nums}
.stat span{display:block;font:600 10.5px/1.5 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);margin-top:12px}
.stat.crimson b{color:var(--crimson)}.stat.verified b{color:var(--verified)}
.stat.struck b{color:var(--ink-3);position:relative;display:inline-block}
.stat.struck b::after{content:"";position:absolute;left:-.04em;right:-.04em;top:.5em;height:.05em;border-radius:1em;background:var(--crimson)}

/* a sheet of paper: the filing, the deliverable, the object */
.sheet{background:var(--paper);color:var(--ink);border-radius:6px;box-shadow:0 1px 2px rgba(0,0,0,.06),0 12px 40px -12px rgba(0,0,0,.22),0 0 0 1px var(--line)}
.slab{background:var(--black);color:#f4f2ee;border-radius:8px;box-shadow:0 30px 80px -20px rgba(0,0,0,.45)}

/* ledger sheets: an accounting margin rule, a proportional band, a share table, a stamp */
.paper{position:relative}
.paper::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;border-radius:6px 0 0 6px;background:linear-gradient(180deg,var(--crimson),var(--crimson-deep))}
.band{display:flex;height:14px;border-radius:3px;overflow:hidden;margin-top:18px;background:var(--studio)}
.band i{display:block;width:var(--w);height:100%;transform-origin:0 50%}
.card.on .band i,.tile .band i,.kc .band i{animation:grow .9s cubic-bezier(.2,.8,.2,1) both}
.band i:nth-child(2){animation-delay:.08s}.band i:nth-child(3){animation-delay:.16s}.band i:nth-child(4){animation-delay:.24s}
@keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.lt{width:100%;border-collapse:collapse;margin-top:14px;font-size:14px}
.lt td{padding:8px 0;border-top:1px solid var(--line);color:var(--ink-2);vertical-align:baseline}
.lt td:first-child{color:var(--ink);display:flex;align-items:center;gap:10px}
.lt td:nth-child(2),.lt td:nth-child(3){text-align:right;font-family:var(--mono);font-size:13.5px;white-space:nowrap}
.lt td:nth-child(3){color:var(--ink-3);width:64px;padding-left:12px}
.lt tr.total td{color:var(--ink);font-weight:600;border-top:1px solid var(--ink)}
.lt tr.total td:nth-child(2){color:var(--ink)}
.lt tr.dim td{color:var(--ink-3)}
.sw{width:10px;height:10px;border-radius:2px;display:inline-block;flex:none}
.stamp{position:absolute;right:26px;bottom:24px;transform:rotate(-5deg);color:var(--verified);border:2px solid var(--verified);border-radius:5px;padding:9px 12px 8px;font:700 10.5px/1 var(--body);letter-spacing:.16em;text-transform:uppercase;box-shadow:inset 0 0 0 3px var(--paper),inset 0 0 0 4px var(--verified);opacity:.92}
.attrs{display:grid;gap:0;margin-top:14px}
.attrs div{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-top:1px solid var(--line);font-size:13px;color:var(--ink-2)}
.attrs div b{font-weight:500;color:var(--ink);text-align:right}
.toolchip{display:inline-block;font-family:var(--mono);font-size:12px;color:var(--crimson);background:rgba(255,106,43,.07);border-radius:4px;padding:4px 8px;margin-top:10px}
.foot-note{font-size:12px;color:var(--ink-3);margin-top:12px;line-height:1.45}

/* nav: small wordmark, floating black pill in the centre, one action on the right */
nav::before{content:"";position:absolute;inset:0;bottom:-36px;background:linear-gradient(180deg,var(--studio) 0%,rgba(8,7,11,.85) 55%,rgba(8,7,11,0) 100%);z-index:-1}
nav{position:fixed;top:0;left:0;right:0;z-index:50;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:16px var(--gutter);pointer-events:none}
nav>*{pointer-events:auto}
nav .wm{font-family:var(--display);font-size:22px;text-transform:uppercase;letter-spacing:.02em;text-decoration:none;color:var(--ink)}
nav .pill{display:flex;gap:26px;background:var(--black);color:#f4f2ee;border-radius:999px;padding:11px 22px;font:600 11.5px/1 var(--body);letter-spacing:.12em;text-transform:uppercase}
nav .pill a{text-decoration:none;opacity:.78}nav .pill a:hover{opacity:1}
nav .act{justify-self:end}
.btn{display:inline-block;font:600 11.5px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;color:#fff;background:var(--crimson);padding:14px 22px;border-radius:999px;text-decoration:none;border:0;cursor:pointer}
.btn:hover{background:var(--crimson-deep)}
.btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2)}
.btn.big{padding:18px 30px;font-size:12.5px}
@media (max-width:820px){nav{grid-template-columns:1fr auto}nav .pill{display:none}}

/* hero: headline above, the object in the middle, four stats framing it */
.hero{padding:150px 0 40px;text-align:center}
.hero h1{margin:16px auto 22px;max-width:19ch}
.x,.stat b .x{display:inline;font:inherit;font-size:.62em;vertical-align:.08em;margin:0 0 0 .04em;letter-spacing:0;color:inherit;text-transform:none}
.hero .lede{margin:0 auto}
.hero .actions{display:flex;gap:10px;justify-content:center;margin:30px 0 54px;flex-wrap:wrap}
.hero .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;max-width:1000px;margin:54px auto 0;text-align:left}
@media (max-width:820px){.hero .stats{grid-template-columns:1fr 1fr}}

/* terminal: the black object */
.term{max-width:980px;margin:0 auto;text-align:left;overflow:hidden;font-family:var(--mono);font-size:14px;line-height:1.65}
.term .bar{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.08);color:rgba(244,242,238,.45);font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.term .bar i{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.14);display:inline-block}
.term .bar span{margin-left:8px}
.term .body{padding:20px 24px 24px;height:430px;overflow:hidden;white-space:pre-wrap;word-break:break-word;scroll-behavior:smooth}
.term .q{color:#f4f2ee;font-family:var(--display);font-style:italic;font-size:22px;line-height:1.25;text-transform:none;letter-spacing:0}
.term .q::before{content:"› ";color:#ff6a2b;font-style:normal;font-family:var(--mono);font-size:14px;vertical-align:3px}
.term .call{color:rgba(244,242,238,.62);margin-top:10px}
.term .call b{color:#ffb07a;font-weight:500}.term .call s{color:#d9d3c8;text-decoration:none}
.term .out{color:rgba(244,242,238,.7);margin-top:6px;padding-left:14px;border-left:2px solid rgba(255,95,131,.45)}
.term .k{color:#ffb07a}.term .s{color:#d9d3c8}.term .n{color:#fff}.term .ok{color:#b79bff}.term .dim{color:rgba(244,242,238,.4)}
.term .caret{display:inline-block;width:8px;height:16px;background:#f4f2ee;vertical-align:-3px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.term .hint{margin-top:16px;color:rgba(244,242,238,.4);font-size:12px}

/* chapters */
.chapter{padding:120px 0}
.pin{position:relative}
.pin .stage{position:sticky;top:0;height:100vh;height:100svh;display:flex;align-items:center;overflow:hidden}
.statement{font-family:var(--display);font-weight:400;font-size:clamp(30px,4.2vw,62px);letter-spacing:-.005em;line-height:1.08;max-width:1180px;margin:0 auto;text-align:center;padding:0 var(--gutter);text-transform:uppercase}
.statement span{color:var(--ink-4);transition:color .2s linear}

/* how it answers — three pinned panels */
.how .stage{align-items:center;padding-top:70px}
.how .inner{width:100%;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,72px);align-items:center;max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}
.how .steps{display:grid;gap:8px;margin-top:22px}
.how .step{padding:16px 18px;border-radius:6px;border-left:2px solid transparent;transition:opacity .3s,border-color .3s,background .3s;opacity:.42;cursor:pointer}
.how .step.on{opacity:1;border-left-color:var(--crimson);background:rgba(244,241,236,.05)}
.how .step h3{margin:4px 0 6px}
.how .panel{position:relative;height:600px}
.how .card{position:absolute;inset:0;padding:32px 36px;opacity:0;transform:translateY(18px);transition:opacity .45s,transform .55s cubic-bezier(.2,.8,.2,1)}
.how .card.on{opacity:1;transform:none}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}
.chip{font-family:var(--mono);font-size:12.5px;padding:7px 12px;border-radius:4px;background:var(--studio);border:1px solid var(--line)}
.ok{color:var(--verified)}
.bars{display:grid;gap:16px;margin-top:22px}
.bar{display:grid;grid-template-columns:1fr auto;gap:6px 18px;align-items:baseline}
.bar .lab{font-size:15px}.bar .val{font-family:var(--mono);font-size:14px}
.bar .track{grid-column:1/-1;height:8px;border-radius:4px;background:var(--studio);overflow:hidden}
.bar .fill{height:100%;background:var(--crimson);transform-origin:0 50%;transform:scaleX(0);transition:transform 1.1s cubic-bezier(.2,.8,.2,1)}
.how .card.on .bar .fill{transform:scaleX(var(--w))}
.tl{position:relative;height:1px;background:var(--line-2);margin:74px 10px 60px}
.tl b{position:absolute;top:-12px;width:1px;height:25px;background:var(--ink)}
.tl b span{position:absolute;top:30px;left:50%;transform:translateX(-50%);font:600 10px var(--body);letter-spacing:.1em;color:var(--ink-3);white-space:nowrap}
.tl b.dim{opacity:.3}
.tl .cur{position:absolute;top:-50px;width:2px;height:100px;background:var(--crimson);left:102%;transition:left 1.2s cubic-bezier(.65,0,.35,1)}
.tl .cur span{position:absolute;top:-28px;left:50%;transform:translateX(-50%);font:600 10.5px var(--body);letter-spacing:.1em;color:var(--crimson);white-space:nowrap}
.how .card.on .tl .cur{left:69%}
@media (max-width:980px){.how .inner{grid-template-columns:1fr}.how .panel{height:620px}.how .stage{height:auto;position:static;padding:40px 0}}

/* as filed: comparison + ledger + bars */
.cmp{display:grid;grid-template-columns:120px 1fr 1fr;gap:0 20px;font-size:14.5px;line-height:1.4}
.cmp .h{font:600 10.5px/1.4 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);padding-bottom:12px;border-bottom:1px solid var(--ink)}
.cmp .h.b{color:var(--crimson)}
.cmp .r{display:contents}
.cmp .r>span{padding:11px 0;border-top:1px solid var(--line)}
.cmp .r>span:first-child{font-weight:600;color:var(--ink)}
.cmp .r>span:nth-child(2){color:var(--ink-3);text-decoration:line-through;text-decoration-color:rgba(255,106,43,.5)}
.led{display:flex;justify-content:space-between;align-items:baseline;padding:12px 0;border-top:1px solid var(--line);font-size:17px}
.led b{font-family:var(--mono);font-weight:400;font-size:15px}
.chart{display:flex;align-items:flex-end;gap:10px;height:150px;margin-top:22px}
.chart div{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;height:100%}
.chart i{display:block;width:100%;background:var(--crimson);border-radius:3px 3px 0 0}
.chart small{font:600 10px var(--body);letter-spacing:.1em;color:var(--ink-3)}
.chart em{font:400 11px var(--mono);font-style:normal;color:var(--ink-2)}
.asfiled{display:grid;grid-template-columns:1.25fr 1fr;gap:18px;margin-top:22px}
@media (max-width:980px){.asfiled{grid-template-columns:1fr}}
/* line-by-line ledger */
.lbl{display:grid;grid-template-columns:1fr 1.75fr;gap:18px;margin-top:40px}
@media (max-width:980px){.lbl{grid-template-columns:1fr}}
.tpl .row{padding:10px 0;border-top:1px solid var(--line)}
.tpl .row:first-child{border-top:0}
.tpl .row .top{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.tpl .row b{display:block;font-weight:400;font-size:16px;color:var(--ink-3);text-decoration:line-through;text-decoration-color:rgba(255,106,43,.55)}
.tpl .row .v{font:400 13px var(--mono);color:var(--ink-3)}
.tpl .row i{display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;font:600 9.5px/1.4 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--crimson);margin-top:5px;font-style:normal}
.tpl .row i .ln{font:500 11px var(--mono);letter-spacing:0;text-transform:none;color:var(--ink);background:var(--studio);padding:2px 6px;border-radius:3px;white-space:nowrap}
.tpl .row i .ln::before{content:"← lines ";color:var(--ink-3)}
.tpl .foot{margin-top:22px;font-size:15px;line-height:1.45;color:var(--ink-2)}
.ledr .row{display:grid;grid-template-columns:30px 1fr auto;gap:0 10px;align-items:baseline;padding:6px 0;border-top:1px solid var(--line);font-size:14.5px;line-height:1.3;border-radius:3px;opacity:0;transform:translateY(8px);transition:opacity .5s ease,transform .5s ease}
.ledr.in .row{opacity:1;transform:none}
.ledr .row:first-child{border-top:0}
.ledr .row small{font:500 10px var(--mono);color:var(--ink-4)}
.ledr .row.ell span{font-size:12px;color:var(--ink-3);font-style:italic}
.ledr .row.tot{font-weight:600}
.ledr .row.hl{background:rgba(255,106,43,.06)}
.ledr .row .v{font:400 14px var(--mono);white-space:nowrap}
.ledr .row .v em{font:600 8.5px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--verified);font-style:normal;margin-left:8px}
.ledr .row .ref{font:500 10px var(--mono);color:var(--crimson);margin-left:8px;white-space:nowrap}
.ledr .foot{margin-top:14px;font:500 11px/1.5 var(--mono);color:var(--verified)}
/* note proof */
.noteproof{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}
@media (max-width:980px){.noteproof{grid-template-columns:1fr}}
.chip{display:inline-block;padding:9px 14px;border-radius:5px;background:var(--paper);box-shadow:0 0 0 1px var(--line);font:400 13px var(--mono);color:var(--ink);max-width:100%;overflow-x:auto;white-space:nowrap}
.chip .kk{color:var(--crimson)}.chip .ss{color:var(--ink-2)}
.hit{margin:12px 0;padding:14px 18px;border-radius:5px;background:var(--studio);font-family:var(--mono);font-size:14px;line-height:1.7}
.hit b{color:var(--crimson);font-weight:500}
.pgs{position:relative;overflow:hidden}
.pgs .ph{font:600 9.5px/1.5 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.pgs .pu{font-size:11px;color:var(--ink-3);margin-top:2px}
.pgs .hd{display:inline-block;font:700 15px/1.2 var(--body);letter-spacing:.06em;color:var(--ink);margin:16px 0 8px;background:rgba(255,106,43,.12);border-radius:3px;padding:2px 5px}
.pgs .pt{font-size:12.5px;line-height:1.55;color:var(--ink-2);margin:0 0 8px}
.pgs .pt b{color:var(--ink);font-weight:600}
.pgs .pt mark{background:rgba(255,106,43,.12);color:var(--crimson);font-weight:600;border-radius:3px;padding:0 3px}
.pgs .pcol{display:grid;grid-template-columns:1fr 92px 92px;gap:0 10px;margin-top:16px;padding-bottom:6px;border-bottom:1px solid var(--ink);font:600 9px/1.4 var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}
.pgs .pcol span:not(:first-child){text-align:right}
.pgs .rrow{display:grid;grid-template-columns:1fr 92px 92px;gap:0 10px;align-items:baseline;padding:5px 0;border-bottom:1px solid var(--line);font-size:12px;color:var(--ink-2)}
.pgs .rrow span:not(:first-child){text-align:right;font-family:var(--mono);font-size:11.5px}
.pgs .rrow.tot{font-weight:600;color:var(--ink);border-bottom:2px solid var(--ink)}
.pgs .red{margin-top:12px;font:500 10.5px/1.5 var(--mono);color:var(--crimson)}
.pgs .pn{margin-top:18px;font:600 10px var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);text-align:right}


/* chain panel */
.chainp{margin-top:14px}
.chainp div{display:grid;grid-template-columns:28px 190px 1fr;gap:0 12px;align-items:baseline;padding:9px 0;border-top:1px solid var(--line);font-size:13.5px;line-height:1.4;color:var(--ink-2)}
.chainp i{font:600 10px var(--body);letter-spacing:.1em;color:var(--crimson);font-style:normal}
.chainp b{font:400 13px var(--mono);color:var(--ink)}
.chainp span em{font-style:normal;font-family:var(--mono);color:var(--ink);font-size:12.5px}
.ansp{margin-top:14px;padding:14px 18px;border-radius:6px;background:var(--black);color:#f4f2ee;font-family:var(--display);font-style:italic;font-size:19px;line-height:1.3}
.pgchip{display:inline-block;padding:5px 9px;border-radius:4px;background:var(--studio);font:400 11.5px var(--mono);color:var(--ink);margin:0 6px 6px 0}
.pgchip b{color:var(--crimson);font-weight:500}
.quotes{display:grid;grid-template-columns:1fr 1fr;gap:14px 22px;margin-top:8px}
.quotes .who{font:600 9.5px/1.4 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--crimson);margin:0}
.quotes .qt{font-family:var(--display);font-style:italic;font-size:17px;line-height:1.28;color:var(--ink);margin:6px 0 0;text-transform:none}
.cap.so{font-size:13px;margin-top:10px;color:var(--ink-2)}
.askall{display:grid;grid-template-columns:1.25fr 1fr;gap:18px;margin-top:40px}
@media (max-width:980px){.askall{grid-template-columns:1fr}.quotes{grid-template-columns:1fr}}
/* bento */
.bento{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:44px}
.tile{padding:26px 28px;min-height:300px;display:flex;flex-direction:column;justify-content:space-between;gap:22px}
.tile .stat b{font-size:clamp(40px,3.6vw,56px)}
.tile.wide{grid-column:span 2}
@media (max-width:980px){.bento{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.bento{grid-template-columns:1fr}.tile.wide{grid-column:auto}}

/* carousel */
.caro .stage{align-items:flex-start;padding-top:110px}
.caro .head{max-width:var(--max);margin:0 auto 40px;padding:0 var(--gutter);width:100%}
.track{display:flex;gap:16px;padding-left:max(var(--gutter),calc((100vw - var(--max)) / 2 + var(--gutter)));will-change:transform}
.kc{flex:none;width:340px;padding:26px 28px 24px 34px;display:flex;flex-direction:column;justify-content:flex-start;gap:22px}
.kc .stat b{font-size:52px}
@media (max-width:980px){.caro .stage{height:auto;position:static;padding:0}.track{overflow-x:auto;padding:0 var(--gutter) 20px;transform:none!important}}

/* tools: a ledger */
.ledger{margin-top:40px;display:grid;grid-template-columns:repeat(2,1fr);column-gap:48px}
.ledger div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:16px;padding:11px 0;border-top:1px solid var(--line);font-size:14px;color:var(--ink-2)}
.ledger div b{font-family:var(--mono);font-weight:500;color:var(--ink);font-size:13.5px}
@media (max-width:820px){.ledger{grid-template-columns:1fr}}

/* install */
.two{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
@media (max-width:980px){.two{grid-template-columns:1fr}}
.tabs{display:flex;gap:6px;margin:30px 0 14px;flex-wrap:wrap}
.tabs button{font:600 11px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);background:transparent;border:1px solid var(--line-2);border-radius:999px;padding:11px 16px;cursor:pointer}
.tabs button[aria-selected="true"]{color:#fff;background:var(--black);border-color:var(--black)}
.code{padding:22px 24px;font-family:var(--mono);font-size:13.5px;line-height:1.7;overflow-x:auto;white-space:pre;color:rgba(244,242,238,.75)}
.code .k{color:#ffb07a}.code .s{color:#d9d3c8}.code .c{color:rgba(244,242,238,.4)}
.list{margin-top:22px}
.list div{padding:16px 0;border-top:1px solid var(--line)}
.list b{display:block;font-family:var(--display);font-size:21px;line-height:1.1;font-weight:400}
.list p{color:var(--ink-2);font-size:14.5px;margin-top:6px;max-width:52ch}

/* footer: black floor, giant wordmark */
.close{padding:140px 0 60px;text-align:center}
.close .btn{margin-top:30px}
footer{background:var(--black);color:rgba(244,242,238,.6);padding:80px 0 40px;margin-top:100px}
footer .big{font-family:var(--display);font-size:clamp(80px,17vw,300px);line-height:.85;text-transform:uppercase;color:#f4f2ee;letter-spacing:-.01em;margin:0 0 40px}
footer .row{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font:600 10.5px/1.6 var(--body);letter-spacing:.12em;text-transform:uppercase}

/* reveal: visible at rest, lifts a touch as it enters */
.rv{transform:translateY(16px);opacity:.75;transition:transform .8s cubic-bezier(.2,.8,.2,1),opacity .8s}
.rv.in{transform:none;opacity:1}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{transform:none;opacity:1}.how .step,.how .card{opacity:1!important;transform:none!important}.statement span{color:var(--ink)!important}}

/* where it sits: archetype comparison */
.cmpwrap{margin-top:40px;overflow-x:auto}

.named{width:100%;border-collapse:collapse;font-size:13.5px;min-width:860px}
.named th,.named td{padding:9px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.named thead th{font:600 10.5px/1.35 var(--body);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-2);white-space:nowrap;border-bottom:1px solid var(--line-2)}
.named thead th.us{color:var(--crimson)}
.named td.cap0{white-space:nowrap;font-weight:500}
.named td.mid{text-align:center;font-family:var(--mono);font-size:13px;white-space:nowrap}
.named td.us{background:rgba(255,106,43,.045);text-align:center;font-family:var(--mono);font-size:13px;font-weight:600;white-space:nowrap}
.named tbody tr:last-child td{border-bottom:0}
.named .yes{color:var(--verified)}
.named .no{color:var(--ink-4)}
.named .part{color:var(--ink-3)}
.named .beat{color:var(--crimson);font-weight:600}
.legend{display:flex;flex-wrap:wrap;gap:16px;font:500 11.5px/1.5 var(--body);color:var(--ink-3);margin-top:14px}
.cmp4{display:grid;grid-template-columns:150px 1fr 1fr 1.35fr;gap:0 22px;font-size:14px;line-height:1.45;min-width:820px}
.cmp4 .h{font:600 10.5px/1.4 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);padding-bottom:12px;border-bottom:1px solid var(--ink)}
.cmp4 .h.b{color:var(--crimson)}
.cmp4 .r{display:contents}
.cmp4 .r>span{padding:12px 0;border-top:1px solid var(--line)}
.cmp4 .r>span:first-child{font:600 10.5px/1.5 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--ink)}
.cmp4 .r>span:nth-child(2),.cmp4 .r>span:nth-child(3){color:var(--ink-3)}
.cmp4 .r>span:last-child{color:var(--ink)}
.cmp4 .r>span .mono{font-size:12.5px}
@media (max-width:820px){
.cmpwrap{overflow-x:visible}
.cmp4{display:block;min-width:0}
.cmp4 .h{display:none}
.cmp4 .r{display:block;padding:16px 0;border-top:1px solid var(--line)}
.cmp4 .r:first-of-type{border-top:0}
.cmp4 .r>span{display:block;border-top:0;padding:3px 0}
.cmp4 .r>span:first-child{margin-bottom:6px}
.cmp4 .r>span:nth-child(2)::before{content:"a terminal — ";font:600 9.5px/1 var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-4)}
.cmp4 .r>span:nth-child(3)::before{content:"a us-schema feed — ";font:600 9.5px/1 var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-4)}
.cmp4 .r>span:last-child::before{content:"FiDUS: ";font:600 9.5px/1 var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--crimson)}
}
.cmpfoot{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:18px;padding-top:14px;border-top:1px solid var(--line);font:500 11.5px/1.5 var(--mono);color:var(--ink-2)}

/* contact card */
/* Two cards side by side, collapsing to one column below ~700px. auto-fit rather
   than a fixed 1fr 1fr so a third name later needs no CSS change, and so a single
   card still centres if one is ever removed.
   The 340px floor is measured, not guessed: .crow a is nowrap + ellipsis, and at a
   300px card both addresses clip (by 31px and 39px). An ellipsised email is not a
   cosmetic problem — it is unusable contact detail on the page whose only job is
   to be contacted. 340 keeps the longest current address whole, and the column
   drops to one before it can ever be reached. */
.contacts{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));
          gap:18px;max-width:940px;margin:34px auto 0;align-items:start}
.contacts .contact{max-width:none;margin:0}
.contact{max-width:460px;margin:34px auto 0;padding:26px 30px 22px 36px;text-align:left}
.contact .cname{font-family:var(--display);font-size:clamp(24px,2.4vw,32px);line-height:1.05;text-transform:uppercase;margin:8px 0 4px}
.contact .crole{font:600 10.5px/1.5 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin:0 0 14px}
.contact .crow{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:11px 0;border-top:1px solid var(--line)}
.contact .crow>span{font:600 10.5px/1.5 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);flex:none}
.contact .crow a{font-family:var(--mono);font-size:13.5px;color:var(--ink);text-decoration:none;border-bottom:1px solid rgba(255,106,43,.35);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.contact .crow a:hover{color:var(--crimson)}
