/* Three shocks, three recoveries — draft v2. Chart-led band layout.
   House tokens and furniture per the Sarendia design system; page geometry is new. */

:root{
  --paper:#F4EEE3;--paper-card:#FAF5EB;--ink:#1B1813;--ink-soft:#4A4239;--ink-mute:#6A5F4E;
  --accent:#2C4A3C;--accent-soft:#6B8678;--warn:#9C5A3C;--warn-soft:#B07C5C;
  --rule:rgba(27,24,19,0.10);--rule-strong:rgba(27,24,19,0.22);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
:target{scroll-margin-top:24px;}
body{background:var(--paper);color:var(--ink);font-family:'Source Serif 4',Georgia,serif;
  font-size:17.5px;line-height:1.65;-webkit-font-smoothing:antialiased;}
a{color:var(--ink);text-decoration:underline;text-decoration-thickness:0.5px;text-underline-offset:4px;}
a:hover{color:var(--accent);}

/* masthead (house) */
.masthead{max-width:1080px;margin:0 auto;padding:28px 32px;border-bottom:1px solid var(--rule);}
.masthead-grid{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;gap:24px;}
.wordmark{font-family:'Fraunces',serif;font-weight:400;font-size:30px;letter-spacing:-0.008em;color:var(--ink);
  text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px;justify-self:start;
  font-variation-settings:"opsz" 72,"SOFT" 50;}
.wordmark:hover{color:var(--accent);}
.masthead .dateline{font-family:'IBM Plex Mono',monospace;font-size:11.5px;font-weight:500;letter-spacing:0.22em;
  text-transform:uppercase;color:var(--ink-soft);justify-self:center;text-align:center;}
.masthead-back{font-family:'IBM Plex Mono',monospace;font-size:11.5px;font-weight:500;letter-spacing:0.18em;
  text-transform:uppercase;color:var(--ink-soft);text-decoration:underline;text-decoration-thickness:0.5px;
  text-underline-offset:5px;justify-self:end;white-space:nowrap;}
.masthead-back:hover{color:var(--accent);}

/* band layout: full-bleed sections, inner wrap */
.wrap{max-width:1000px;margin:0 auto;padding:0 28px;}
section.band{padding:52px 0 34px;}
section.band-tint{background:var(--paper-card);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);}
.prose{max-width:620px;}
.prose p{margin:0 0 22px;hyphens:auto;}

/* hero */
.hero{padding:56px 0 8px;}
.hero h1{font-family:'Fraunces',serif;font-weight:300;font-size:54px;line-height:1.08;letter-spacing:-0.02em;
  font-variation-settings:"opsz" 144,"SOFT" 50;max-width:820px;margin-bottom:24px;}
.hero h1 em{color:var(--accent);font-style:italic;}
.dek{font-size:20px;line-height:1.55;color:var(--ink-soft);max-width:660px;margin-bottom:12px;}
.byline{font-family:'IBM Plex Mono',monospace;font-size:11.5px;letter-spacing:0.16em;text-transform:uppercase;
  color:var(--ink-mute);margin:24px 0 0;}
.byline a{color:var(--ink-mute);}
.byline a:hover{color:var(--accent);}

/* the three shocks, in brief */
.brief{margin:34px 0 6px;padding-top:22px;border-top:1px solid var(--rule-strong);}
.brief-label{font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:500;letter-spacing:0.22em;
  text-transform:uppercase;color:var(--ink-mute);margin-bottom:18px;}
.brief-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:36px;}
.brief-tag{font-family:'IBM Plex Mono',monospace;font-size:10.5px;font-weight:500;letter-spacing:0.18em;
  text-transform:uppercase;color:var(--warn);margin-bottom:8px;}
.brief-item .brief-line{font-size:14.5px;line-height:1.6;color:var(--ink-soft);margin:0;hyphens:auto;}

/* part headers: mono kicker + hed */
.kicker{font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:500;letter-spacing:0.24em;
  text-transform:uppercase;color:var(--accent);margin-bottom:12px;}
h2.part{font-family:'Fraunces',serif;font-weight:400;font-size:32px;line-height:1.18;letter-spacing:-0.014em;
  font-variation-settings:"opsz" 96,"SOFT" 50;margin-bottom:18px;max-width:760px;}

/* dossiers: stat rail + charts */
.dossier{margin:38px 0 8px;padding-top:30px;border-top:1px solid var(--rule-strong);}
.dossier-head{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;margin-bottom:8px;}
.shock-tag{font-family:'IBM Plex Mono',monospace;font-size:10.5px;font-weight:500;letter-spacing:0.2em;
  text-transform:uppercase;color:var(--paper);background:var(--warn);padding:4px 9px;}
.shock-tag.heal{background:var(--accent);}
h3.dossier-hed{font-family:'Fraunces',serif;font-weight:500;font-size:24px;letter-spacing:-0.01em;
  font-variation-settings:"opsz" 48,"SOFT" 50;}
.dossier-grid{display:grid;grid-template-columns:236px 1fr;gap:44px;align-items:start;margin-top:20px;}
.rail{border-top:2px solid var(--ink);}
.railrow{display:flex;justify-content:space-between;gap:10px;padding:10px 0 9px;border-bottom:1px solid var(--rule);}
.rail dt{font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:0.05em;text-transform:uppercase;
  color:var(--ink-mute);line-height:1.5;max-width:120px;}
.rail dd{font-family:'IBM Plex Mono',monospace;font-size:13px;font-weight:500;color:var(--ink);text-align:right;line-height:1.5;}
.rail dd.warn{color:var(--warn);}
.rail dd.pos{color:var(--accent);}
.rail-note{font-size:13px;font-style:italic;color:var(--ink-soft);line-height:1.55;margin-top:14px;hyphens:none;}
.dossier .prose{max-width:none;}
.dossier .prose p{max-width:640px;}

/* interstitial big stat */
.bigstat{text-align:left;padding:14px 0 8px;}
.bigstat .n{font-family:'Fraunces',serif;font-weight:300;font-size:88px;letter-spacing:-0.04em;line-height:1;
  font-variation-settings:"opsz" 144,"SOFT" 30;}
.bigstat .c{font-family:'IBM Plex Mono',monospace;font-size:11.5px;letter-spacing:0.14em;text-transform:uppercase;
  color:var(--ink-mute);margin-top:12px;max-width:560px;line-height:1.7;}

/* figures */
figure{margin:30px 0 42px;}
.fig-title{font-family:'Fraunces',serif;font-weight:500;font-size:19px;line-height:1.35;
  font-variation-settings:"opsz" 30,"SOFT" 50;margin-bottom:5px;max-width:760px;}
.fig-caption{font-size:14px;font-style:italic;color:var(--ink-soft);line-height:1.5;margin-bottom:16px;max-width:720px;}
.chartscroll{overflow-x:auto;}
.chartscroll svg{width:100%;height:auto;display:block;min-width:0;}
.fig-source{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--ink-soft);margin-top:11px;
  line-height:1.6;hyphens:none;max-width:760px;}
.fig-source a{color:var(--ink-mute);}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start;}
svg .grid{stroke:rgba(27,24,19,0.10);stroke-width:1;}
svg .axm{font-family:'IBM Plex Mono',monospace;font-size:11px;fill:var(--ink-mute);}
svg .lblm{font-family:'IBM Plex Mono',monospace;font-size:11.5px;fill:var(--ink-soft);}
svg .val{font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:500;fill:var(--ink);}
svg .anno{font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:0.06em;fill:var(--ink-mute);}
svg .serif-n{font-family:'Fraunces',serif;font-weight:300;fill:var(--ink);}
svg .ptag{font-family:'IBM Plex Mono',monospace;font-size:10.5px;font-weight:500;letter-spacing:0.18em;}
svg .phed{font-family:'Fraunces',serif;font-size:15px;font-weight:500;fill:var(--ink);}

/* scoreboard */
.scoreboard{width:100%;border-collapse:collapse;margin:26px 0 8px;}
.scoreboard th{font-family:'IBM Plex Mono',monospace;font-size:10.5px;font-weight:500;letter-spacing:0.14em;
  text-transform:uppercase;color:var(--ink-mute);text-align:left;padding:0 14px 10px 0;border-bottom:2px solid var(--ink);}
.scoreboard td{font-size:14.5px;line-height:1.5;color:var(--ink-soft);padding:12px 14px 12px 0;
  border-bottom:1px solid var(--rule);vertical-align:top;}
.scoreboard td:first-child{font-family:'Fraunces',serif;font-size:16px;color:var(--ink);white-space:nowrap;}
.scoreboard .mono{font-family:'IBM Plex Mono',monospace;font-size:12.5px;}

/* footnotes + furniture (house) */
sup.fn{font-family:'IBM Plex Mono',monospace;font-size:11px;line-height:0;}
sup.fn a{color:var(--accent);text-decoration:none;padding:15px 10px;margin:-15px -10px;}
.fnotes{margin-top:26px;padding-top:22px;border-top:1px solid var(--rule);}
.fnotes p{font-family:'IBM Plex Mono',monospace;font-size:12px;line-height:1.7;color:var(--ink-soft);
  margin-bottom:12px;hyphens:none;}
.fnnum{color:var(--accent);font-weight:500;margin-right:6px;}
.furn{margin-top:40px;padding-top:22px;border-top:1px solid var(--rule);}
.furn-hed{font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:500;letter-spacing:0.2em;
  text-transform:uppercase;color:var(--ink-mute);margin-bottom:14px;}
.furn p{font-size:14.5px;line-height:1.65;color:var(--ink-soft);margin-bottom:10px;max-width:760px;}
.furn dl dt{font-family:'Fraunces',serif;font-style:italic;font-size:16px;margin-top:14px;}
.furn dl dd{font-size:14.5px;color:var(--ink-soft);line-height:1.6;margin-top:3px;max-width:720px;}

/* footer (house) */
footer.footer{background:#2A2620;color:var(--paper);padding:56px 32px 64px;margin-top:72px;}
.footer-grid{max-width:1080px;margin:0 auto;display:grid;grid-template-columns:1.8fr 1fr;gap:48px;}
.footer-col{font-family:'Source Serif 4',Georgia,serif;}
.footer-label{font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:0.2em;text-transform:uppercase;
  color:rgba(244,238,227,0.55);margin:0 0 22px;font-weight:500;}
.footer-body{font-size:14px;line-height:1.6;color:rgba(244,238,227,0.86);}
.footer-body p{margin-bottom:8px;hyphens:none;}
.author-name{font-weight:600;color:var(--paper);font-size:16px;margin-bottom:14px;}
.footer-link{color:var(--paper);text-decoration:underline;text-decoration-thickness:0.5px;text-underline-offset:4px;}
.footer-link:hover{color:#8AA597;}
.footer-colophon{max-width:1080px;margin:38px auto 0;padding-top:20px;border-top:0.5px solid rgba(244,238,227,0.18);
  font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:0.08em;color:rgba(244,238,227,0.55);}
.footer-colophon a{color:rgba(244,238,227,0.72);}

/* mobile */
@media(max-width:760px){
  .masthead{padding:18px 24px;}
  .masthead-grid{grid-template-columns:1fr;gap:10px;}
  .wordmark,.masthead-back{justify-self:center;}
  .masthead .dateline{display:none;}
  body{font-size:16px;}
  .wrap{padding:0 18px;}
  section.band{padding:38px 0 24px;}
  .hero{padding:40px 0 4px;}
  .hero h1{font-size:36px;}
  .dek{font-size:17.5px;}
  h2.part{font-size:26px;}
  h3.dossier-hed{font-size:21px;}
  .dossier-grid{grid-template-columns:1fr;gap:22px;}
  .rail{max-width:420px;}
  .duo{grid-template-columns:1fr;gap:24px;}
  .brief-grid{grid-template-columns:1fr;gap:20px;}
  .bigstat .n{font-size:54px;}
  .scoreboard{display:block;overflow-x:auto;}
  footer.footer{padding:40px 24px 48px;}
  .footer-grid{grid-template-columns:1fr;gap:30px;}
}

/* Progressive reveal: enhancement only; gated on .js + motion preference so the page is fully visible without either */
@media (prefers-reduced-motion: no-preference){
  .js .reveal{opacity:0;animation:sa-rise .7s cubic-bezier(.2,.75,.25,1) forwards;animation-delay:calc(var(--d,0) * 70ms);}
  @keyframes sa-rise{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:none;}}
  .js .reveal-fig{opacity:0;transition:opacity .55s ease;}
  .js .reveal-fig.in{opacity:1;}
  .js .reveal-fig .chartscroll svg{clip-path:inset(0 100% 0 0);}
  .js .reveal-fig.in .chartscroll svg{clip-path:inset(0 0 0 0);transition:clip-path 1s cubic-bezier(.2,.75,.25,1) .1s;}
}
@media print{
  .js .reveal,.js .reveal-fig{opacity:1 !important;animation:none !important;}
  .js .reveal-fig .chartscroll svg{clip-path:none !important;}
}
