:root{--chart:clamp(220px,35svh,340px);--bars:calc(var(--chart)*.76)}
/* Hero */
.hero{display:flex;flex-direction:column}
.hero-head{padding:clamp(20px,3.4svh,40px) var(--gut) 0}
.br-d{display:none}
@media (min-width:861px){.br-d{display:inline}.hero-act{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px 14px;align-items:center}.offer{grid-column:1/-1;margin:0}.hero-act .note+.note{grid-column:1/-1}.hero-act .note{margin:0;font-size:.8125rem;line-height:1.3}}
@media (min-width:861px) and (max-width:1120px){.hero-act .note{grid-column:1/-1}}
.hero-row{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,4fr);margin-top:clamp(14px,2.4svh,26px);row-gap:10px;align-items:start}
/* Funnel: bar height = square root of (count / 3,714), so small steps still show a slope. Printed figures stay exact; the readout says not to scale. */
.funnel{position:relative;margin-top:clamp(14px,2.6svh,28px);height:var(--chart);animation:reveal 1.1s cubic-bezier(.16,1,.3,1) both}
@keyframes reveal{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
.steps{display:grid;grid-template-columns:repeat(4,2fr) 1fr;height:100%}
.steps li{display:grid;grid-template-columns:1fr 1fr;align-items:end;min-width:0;--bar:calc(var(--bars)*var(--h))}
.steps .last{grid-template-columns:1fr}
.col{display:flex;flex-direction:column;justify-content:flex-end;min-width:0}
.bar{display:block;height:var(--bar);min-height:3px;background:var(--brand-500)}
.lab{padding:0 0 8px 10px;display:grid;line-height:1.2}
.steps li:first-child .lab{padding-left:var(--gut)}
.lab b{font:600 clamp(1.125rem,1.6vw,1.5rem)/1.1 var(--sans);letter-spacing:-.02em}
.lab span{font-size:.875rem;color:var(--mute)}
.lab em{font:400 .75rem/1.4 var(--mono);color:var(--mute);font-style:normal}
.gap{position:relative;display:block;height:var(--bars);padding:0;background:none;border:0;cursor:pointer;color:var(--mute)}
.wedge{position:absolute;inset:0;background:var(--brand-100);clip-path:polygon(0 calc(100% - var(--h)*100%),100% calc(100% - var(--n)*100%),100% 100%,0 100%);transition:background .18s}
.gap:hover .wedge{background:hsl(210,100%,82%)}
.gap[aria-pressed=true] .wedge{background:hsl(210,100%,82%)}
.gap.is-leak[aria-pressed=true]::before{content:"";position:absolute;left:0;top:0;bottom:calc(var(--h)*100%);width:2px;background:var(--leak-bar)}
.gap.is-leak .wedge,.gap.is-leak:hover .wedge{background:var(--leak-bar)}
.gap span{position:absolute;left:10px;bottom:8px;font:600 .875rem/1.2 var(--sans);font-variant-numeric:tabular-nums;padding:3px 7px;border:1px solid var(--line);background:var(--white);border-radius:var(--r-sm);transition:background .15s,color .15s}
.gap:hover span{color:var(--ink);border-color:var(--ink)}
.gap[aria-pressed=true] span{background:var(--ink);border-color:var(--ink);color:#fff}
.gap.is-leak span{color:var(--leak)}.gap.is-leak[aria-pressed=true] span{color:#fff}
.readout{position:absolute;left:55.556%;right:var(--gut);top:0;padding-left:12px;z-index:2}
.readout-meta{font-size:.8125rem;color:var(--mute);margin-bottom:6px}.readout-meta .chip{margin-right:6px}
.readout-text{font-size:clamp(1rem,1.25vw,1.125rem);line-height:1.28;font-weight:600;letter-spacing:-.012em;margin-bottom:4px;max-width:31.5em;min-height:2.56em}

.todo{padding-block:clamp(56px,8vw,120px)}
.todo-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,96px);align-items:start}
.todo-copy h2{margin-bottom:clamp(32px,6.7vw,96px)}
.todo-copy h3{margin-top:24px;margin-bottom:6px}.todo-copy p{color:var(--mute)}
.sheet{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:clamp(18px,2.4vw,36px);box-shadow:0 1px 2px rgba(16,24,40,.04),0 18px 40px rgba(16,24,40,.08)}
.sheet-top{display:flex;justify-content:space-between;align-items:center;font-size:1.125rem}
.sheet-call{margin-top:16px;padding:12px 14px;background:var(--leak-bg);border-radius:var(--r);color:var(--leak);font-weight:600;font-size:1.0625rem;line-height:1.35}
.sheet-nums{display:grid;grid-template-columns:repeat(4,1fr);margin-top:20px;border-block:1px solid var(--line)}
.sheet-nums div{padding:12px 0 12px 14px;border-left:1px solid var(--line)}.sheet-nums div:first-child{border-left:0;padding-left:0}
.sheet-nums dt{font-size:.8125rem;color:var(--mute)}
.sheet-nums dd{font-size:clamp(1.375rem,2.4vw,2rem);font-weight:600;letter-spacing:-.02em;line-height:1.15}
.sheet-h{margin-top:22px;font-size:1.0625rem}
.tasks{margin-top:8px}
.tasks li{display:flex;align-items:center;gap:12px;min-height:58px;padding:9px 0;border-bottom:1px solid var(--line-soft)}
.task-t{flex:1;min-width:0;line-height:1.3}
.tag{flex:none;padding:2px 8px;border-radius:var(--r-sm);font-size:.8125rem;font-weight:600}
.tag-fix{background:var(--broken-bg);color:var(--broken)}.tag-win{background:var(--win-bg);color:var(--win)}
.fixit{flex:none;min-height:36px;padding:0 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--white);color:var(--ink);font:500 .875rem var(--sans);cursor:pointer;white-space:nowrap;transition:border-color .15s,background .15s}
.fixit:hover{border-color:var(--ink)}
.fixit[aria-pressed=true]{background:var(--brand-50);border-color:var(--brand-100);color:var(--brand-600)}
.sheet-foot{margin:14px 0 12px;font-size:.875rem;color:var(--mute)}

/* Ledger */
.ledger{padding-block:clamp(56px,8vw,120px)}
.ledger .row:first-child{padding-top:0;border-top:0}
.row{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,6vw,96px);padding-block:clamp(32px,4.5vw,64px);border-top:1px solid var(--line)}
.row-t h2{margin-bottom:clamp(32px,6.7vw,96px)}.row-t h2+h3{margin-top:24px}
.row-t h3{margin-bottom:6px}
.row-t p{color:var(--mute)}
.still{margin:0;min-width:0}
.still figcaption,.ai-fig figcaption{position:sticky;left:0;display:table;margin-bottom:8px}
.crop{overflow:hidden;border:1px solid var(--line);border-radius:var(--r);aspect-ratio:960/720}
.still .crop img{width:133.34%;max-width:none;border:0;border-radius:0;box-shadow:none}
.ai-fig{margin-top:20px}
.still img{display:block;width:100%;height:auto;border:1px solid var(--line);border-radius:var(--r);box-shadow:0 1px 2px rgba(16,24,40,.04),0 14px 32px rgba(16,24,40,.08)}
/* Desktop: the chip hangs above the box, so box top and heading top share a line */
@media (min-width:861px){.row-v.still{position:relative}.row-v.still figcaption{position:absolute;left:0;bottom:100%;margin:0 0 8px}}

.triage{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3.5vw,56px)}
.triage h4{margin:0 0 8px;font-size:.875rem;font-weight:500;color:var(--mute)}
.triage li{padding:12px 0;border-top:1px solid var(--line);font-size:1.125rem;font-weight:600;letter-spacing:-.01em;line-height:1.25}
.vitals div{padding:10px 0;border-top:1px solid var(--line)}
.vitals dt{font:600 1rem/1.3 var(--mono)}.vitals dd{font-size:.9375rem;color:var(--mute);line-height:1.35}
.time{font-size:clamp(4rem,10vw,9rem);line-height:.85;letter-spacing:-.05em;font-weight:700;color:var(--brand-500)}

/* How */
.how{padding-block:clamp(56px,8vw,112px)}
.how-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3.5vw,56px);margin-top:clamp(28px,4vw,56px);border-top:2px solid var(--ink);counter-reset:none}
.how-steps li{padding-top:18px;position:relative}
.how-steps li::before{content:"";position:absolute;top:-7px;left:0;width:12px;height:12px;border-radius:50%;background:var(--brand-500);box-shadow:0 0 0 3px var(--paper)}
.how-steps h3{font-size:clamp(1.3rem,2vw,1.75rem);letter-spacing:-.02em;margin-bottom:10px}
.how-steps p{color:var(--mute)}.how-steps a{color:var(--brand-600);text-underline-offset:2px}
.how-links{display:flex;flex-wrap:wrap;gap:8px 32px;margin-top:clamp(24px,3vw,40px);max-width:none}

/* AI */
.ai{background:var(--ink);color:#fff;padding-block:clamp(56px,8vw,112px)}
.ai-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:clamp(28px,6vw,96px);align-items:center}
.ai-still{display:block;width:100%;height:auto;border-radius:var(--r)}
.ai h2{margin-bottom:18px}.ai p{color:hsl(220,20%,82%);margin-bottom:18px}.ai p code{color:#fff}
.term-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:72px;border-top:1px solid hsl(220,15%,28%)}
.term-row:last-child{border-bottom:1px solid hsl(220,15%,28%)}
.term code{font-size:clamp(.875rem,1.5vw,1.25rem);overflow-wrap:anywhere}
.copy{flex:none;min-height:36px;min-width:72px;padding:0 12px;border:1px solid hsl(220,15%,40%);border-radius:var(--r);background:transparent;color:#fff;font:500 .875rem var(--sans);cursor:pointer;transition:background .15s,color .15s}
.copy:hover{background:#fff;color:var(--ink)}

/* Audit, FAQ */
.audit{padding-block:clamp(56px,8vw,112px)}
.audit h2{max-width:20em}
.audit-form{margin-top:clamp(20px,3vw,36px);max-width:760px}
.audit-form label{display:block;margin-bottom:8px;font-weight:600}
.audit-row{display:flex;gap:8px}
.audit-row input{flex:1;min-width:0;min-height:54px;padding:0 16px;border:1px solid var(--faint);border-radius:var(--r);background:var(--white);color:var(--ink);font:400 1.0625rem var(--sans)}
.audit-row input::placeholder{color:var(--faint)}.audit-row .btn{min-height:54px}
.audit-links{display:flex;flex-wrap:wrap;gap:6px 26px;margin-top:18px;max-width:none;font-size:.9375rem}.audit-links a{color:var(--brand-600);text-underline-offset:2px}
@media (max-width:860px){
  .row,.hero-row,.todo-grid,.ai-grid{grid-template-columns:minmax(0,1fr)}
  .how-steps{grid-template-columns:minmax(0,1fr);border-top:0;border-left:2px solid var(--ink);padding-left:20px;gap:28px}
  .how-steps li{padding-top:0}.how-steps li::before{left:-27px;top:7px}
  .hero-row{gap:12px}
  .funnel{display:flex;flex-direction:column;height:auto;margin-top:10px;padding-bottom:16px}
  .steps{order:1;display:block;height:auto;padding-inline:var(--gut)}
  .stats{order:0;margin-top:12px}
  .steps li,.steps .last{display:grid;grid-template-columns:minmax(0,1fr) 56px;align-items:center;gap:10px;min-height:44px}
  .steps li:first-child .lab,.lab{padding:0 0 3px}
  .col{display:block}
  .lab{grid-template-columns:auto 1fr auto;align-items:baseline;gap:6px}
  .lab b{font-size:1.125rem}.lab span{font-size:.8125rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .bar{height:12px;width:calc(var(--h)*100%);min-width:3px}
  .gap{display:flex;justify-content:flex-end;align-items:center;width:56px;height:44px}
  .wedge,.gap.is-leak[aria-pressed=true]::before{display:none}
  .gap span{position:static}
  .gap.is-leak span,.gap.is-leak[aria-pressed=true] span{background:var(--leak-bar);border-color:var(--leak-bar);color:var(--ink)}
  .gap.is-leak[aria-pressed=true] span{border-color:var(--ink)}
  .readout{order:2;position:static;padding:14px var(--gut) 0}.readout-text{min-height:0;font-size:1rem}
}
@media (max-width:520px){
  .sheet-nums{grid-template-columns:1fr 1fr}.sheet-nums div:nth-child(3){border-left:0;padding-left:0}.sheet-nums div:nth-child(n+3){border-top:1px solid var(--line)}
  .tasks li{flex-wrap:wrap}.task-t{flex-basis:70%}
  .triage{grid-template-columns:minmax(0,1fr)}
  .audit-row{flex-direction:column}
}
:where(:target){scroll-margin-top:88px}
@media (hover:none){.todo-copy h3 a,.row-t h3 a{text-decoration:underline;text-underline-offset:3px}}