/* v21 package C (10 Nov 2026): proof pages. Before/After line, pull loops, stat tiles, four-line "what we did". */
.page-hero.c-hero{padding:48px 0 48px}
.c-hero h1{max-width:1040px;text-wrap:balance}
.c-hero .wrap>.lead{max-width:720px}
.page-hero.c-hub{padding-bottom:64px}
/* readout: before (orange) -> after (light blue); figures count once */
.c-read{display:flex;flex-wrap:wrap;gap:16px 64px;margin:32px 0 4px}
.c-m{display:flex;flex-direction:column;gap:4px}
.c-ml{font-size:15px;color:#D5DCE6}
.c-v{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.c-b,.c-a{display:inline-flex;align-items:baseline;gap:8px;font-size:34px;font-weight:bold;letter-spacing:-.6px;line-height:1.1;font-variant-numeric:tabular-nums;transition:opacity .3s ease}
.c-b{color:#EB6834}
.c-a{color:#8FC0F5}
.c-b i,.c-a i{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.c-to{color:#9FB0C4;font-size:24px}
.c-ba[data-state="push"] .c-a,.c-loops.c-pre .c-a{opacity:0;transition:none}
.c-ba svg,.c-loops svg{display:block;width:100%;height:auto;overflow:visible;margin-top:8px}
.c-ba figcaption,.c-loops figcaption{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:10px;min-height:44px}
.c-cap{font-size:16px;color:#D5DCE6}
.c-ba[data-state="push"] .c-cap,.c-loops[data-state="push"] .c-cap{color:#F3A27F}
.c-replay{font:bold 14px Arial,sans-serif;color:#fff;background:none;border:1px solid rgba(213,220,230,.45);border-radius:999px;min-height:44px;padding:0 20px;cursor:pointer}
.c-replay:hover{background:rgba(255,255,255,.08)}
.c-replay[hidden]{display:none}
figure.c-ba,figure.c-loops{margin:0}
/* svg marks: navy stations, blue pacemaker, orange piles = waiting, light blue = buffer at the pacemaker / flow */
.c-tr{stroke:#4A6582;stroke-width:2;fill:none}
.c-st{fill:#16314F;stroke:#8FB3D9;stroke-width:2}
.c-pm{fill:#2A78D6;stroke:#8FC0F5;stroke-width:2}
.c-pml{fill:#8FC0F5;font-weight:bold}
.c-u{fill:#EB6834}
.c-u.c-buf{fill:#8FC0F5}
.c-lp{fill:none;stroke:#2A78D6;stroke-width:3}
.c-lp.broken{stroke:#EB6834;stroke-width:2.5;stroke-dasharray:10 9}
.c-src{fill:#16314F;stroke:#8FB3D9;stroke-width:2}
.c-srt{fill:#fff;font-weight:bold}
.c-bin{fill:#8FC0F5;stroke:#8FC0F5;stroke-width:2}
.c-bin.short{fill:#0F2338;stroke:#EB6834}
.c-card{fill:#8FC0F5}
.c-card.up{fill:#0F2338;stroke:#8FC0F5;stroke-width:1.5}
.c-lu{fill:#2A78D6;stroke:#8FC0F5;stroke-width:1.5}
.c-lu.wait{fill:#EB6834;stroke:#EB6834}
.c-ltx{fill:#9FB0C4}
/* bands */
.c-band{padding:72px 0;background:#fff}
.c-band+.c-band{padding-top:0}
.c-tiles .cs-stats{grid-template-columns:repeat(4,1fr)}
.c-tiles .cs-stat{padding-right:28px}
.c-tiles .cs-stat b{font-size:36px;white-space:nowrap}
.c-did h2{font-size:32px;margin:0 0 24px}
.c-steps,.c-loop-list{list-style:none;counter-reset:c;padding:0;margin:0;max-width:860px}
.c-steps li,.c-loop-list li{counter-increment:c;position:relative;max-width:none;padding:18px 0 18px 56px;border-top:1px solid var(--line);font-size:19px;color:#1B2533}
.c-steps li:last-child,.c-loop-list li:last-child{border-bottom:1px solid var(--line)}
.c-steps li::before{content:"0" counter(c);position:absolute;left:0;top:19px;font-weight:bold;font-size:15px;color:#1F68C1}
.c-loop-list li::before{content:"";position:absolute;left:4px;top:26px;width:22px;height:12px;border-radius:3px;background:#2A78D6;transition:background .5s ease}
.c-loop-list li.off::before{background:#EB6834}
.c-loop-list b{color:var(--navy)}
.c-loop-list em{display:block;font-style:normal;font-weight:bold;color:var(--navy);margin-top:4px}
.c-why{margin:28px 0 0;font-size:18px;color:#33414F;max-width:760px}
.c-why b{color:var(--navy)}
/* /results/: each row keeps its big number and gets a compact Before/After line */
.c-case{grid-template-columns:440px 1fr}
.c-left{display:flex;flex-direction:column;gap:20px;min-width:0}
.c-left>b{font-size:64px;line-height:1;letter-spacing:-2px;color:var(--navy);white-space:nowrap}
.c-case:hover .c-left>b{color:var(--blue)}
.c-mini{background:#0F2338;border-radius:12px;padding:14px 18px 10px}
.c-mini .c-read{margin:0;gap:4px}
.c-mini .c-ml{font-size:13px}
.c-mini .c-b,.c-mini .c-a{font-size:19px;letter-spacing:0;gap:6px}
.c-mini .c-to{font-size:16px}
.c-mini figcaption{display:none}
.c-mini svg{margin-top:4px}
@media (max-width:860px){
  .page-hero.c-hero{padding:40px 0 36px}
  .c-read{gap:14px 32px;margin-top:28px}
  .c-b,.c-a{font-size:26px}.c-to{font-size:20px}
  .c-cap{font-size:15px}
  .c-tiles .cs-stats{grid-template-columns:1fr 1fr}
  .c-tiles .cs-stat b{font-size:28px;white-space:normal}
  .c-band{padding:52px 0}
  .c-did h2{font-size:26px}
  .c-steps li,.c-loop-list li{font-size:17px;padding-left:44px}
  .c-loop-list li::before{width:18px;left:2px}
  .c-case{grid-template-columns:1fr}
  .c-left>b{font-size:52px}
}
@media (max-width:480px){.page-hero.c-hero{padding-top:28px}.c-hero .crumb{margin-bottom:8px}.c-hero .eyebrow{margin-bottom:8px}.c-hero .wrap .lead{font-size:18px}.c-read{gap:10px;margin-top:20px}.c-b,.c-a{font-size:22px;letter-spacing:-.3px}.c-to{font-size:17px}.c-v{gap:10px;flex-wrap:nowrap}.c-ml{font-size:14px}.c-tiles .cs-stats{grid-template-columns:1fr}.c-mini .c-b,.c-mini .c-a{font-size:17px}}
@media (prefers-reduced-motion:reduce){.c-b,.c-a,.c-loop-list li::before{transition:none}}
.c-chev{fill:none;stroke:#8FC0F5;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
/* supply-pull hero: words left, loops right on wide screens */
.c-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,540px);gap:56px;align-items:center}
.c-split .c-read{margin-top:0}
@media (max-width:1000px){.c-grid{grid-template-columns:1fr;gap:8px}.c-split .c-read{margin-top:28px}}

/* results: each headline number carries its own label; the mini line below shows a second metric */
.c-case .c-biglab{display:block;margin-top:-12px;font-size:16px;font-weight:bold;color:#1F68C1}