/* Designs For Change — rebuilt from the picked homepage */
:root{
  --ink:#14140F;      /* ink + dark ground */
  --accent:#FFC709;   /* chrome yellow — signal, bands, numerals */
  --secondary:#10307A;/* deep blue — the Rosenwald ground */
  --paper:#FDFCF8;    /* page ground */
  --mat:#DDD8CC;      /* figure mat */
  --stone:#EFEBE3;
  --muted:#57534A;
  --rule:#C6BFAC;
  --prose:68ch;
  --wide:90ch;
  --pad:clamp(20px,3vw,64px);
  --sans:Chivo,"Helvetica Neue",Arial,sans-serif;
  --serif:Spectral,Georgia,"Times New Roman",serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);
  font-size:clamp(17px, .42vw + 15px, 20px);line-height:1.62;text-wrap:pretty}
img{max-width:100%;display:block;height:auto}
a{color:var(--secondary);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--ink);background:var(--accent);text-decoration:none}
::selection{background:var(--accent);color:var(--ink)}
h1,h2,h3,h4{font-family:var(--sans);letter-spacing:-.022em;line-height:1.06;margin:0;text-wrap:balance}
svg{flex:none}
.u-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.wrap{width:100%;max-width:1620px;margin:0 auto;padding-inline:var(--pad)}
.prose{max-width:var(--prose);margin-inline:auto;padding-inline:var(--pad)}
.breakout{max-width:var(--wide);margin-inline:auto;padding-inline:var(--pad)}

/* ---------- masthead (chosen arrangement C) ---------- */
.masthead{background:var(--ink);color:#FDFCF8;border-bottom:6px solid var(--accent)}
.mast-top{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:end;
  padding:clamp(14px,1.5vw,30px) 0 0}
.brand{display:flex;align-items:center;gap:clamp(10px,1.4vw,26px);text-decoration:none}
.brand:hover{background:none}
.brand .nm{font-family:var(--sans);font-weight:900;text-transform:uppercase;letter-spacing:-.035em;
  font-size:clamp(28px,4.6vw,86px);line-height:.86;color:var(--accent)}
.brand .nm em{font-style:normal;color:#FDFCF8}
.brand .plat{color:var(--accent)}
.tagline{font-family:var(--sans);font-size:clamp(10px,.72vw,14px);letter-spacing:.22em;
  text-transform:uppercase;color:#9C978A;margin-top:clamp(8px,.9vw,16px)}
.fscode{font-family:var(--sans);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:#9C978A;display:flex;align-items:flex-end;gap:12px;padding-bottom:6px}
.chip{width:60px;height:34px;background:var(--accent)}
.mnav{display:flex;flex-wrap:wrap;gap:clamp(12px,1.8vw,40px);align-items:center;
  border-top:1px solid #34332C;margin-top:clamp(12px,1.4vw,26px);padding:clamp(10px,1vw,18px) 0}
.mnav a{font-family:var(--sans);font-weight:700;font-size:clamp(13px,.95vw,20px);letter-spacing:.13em;
  text-transform:uppercase;color:#FDFCF8;text-decoration:none;display:flex;align-items:center;gap:7px}
.mnav a:hover,.mnav a[aria-current]{color:var(--accent);background:none}
.mnav svg{width:1.25em;height:1.25em;stroke-width:1.9;color:var(--accent)}
.mnav a:hover svg,.mnav a[aria-current] svg{color:#FDFCF8}
.mnav .rt{margin-left:auto;display:flex;gap:clamp(12px,1.6vw,30px)}
.mnav .rt a{font-weight:400;font-size:clamp(12px,.78vw,16px);color:#9C978A}
.subnav{border-top:1px solid #34332C;padding-block:9px;display:flex;flex-wrap:wrap;gap:8px 22px;align-items:baseline}
.subnav span{font-family:var(--sans);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#8A8577}
.subnav a{font-family:var(--sans);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#CFCABB;text-decoration:none}
.subnav a:hover{color:var(--accent);background:none}
.navtoggle,.hamburger{display:none}

/* ---------- lead plate ---------- */
.lead-plate{position:relative;background:var(--ink);display:grid;min-height:min(80vh,900px)}
.lead-plate>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.82}
.lead-plate .over{position:relative;align-self:end;padding-top:clamp(48px,14vh,180px);
  background:linear-gradient(to top,rgba(20,20,15,.95),rgba(20,20,15,.5) 62%,rgba(20,20,15,0))}
.lead-plate .over .wrap{padding-block:clamp(20px,3vw,60px)}
.kicker{font-family:var(--sans);font-weight:700;font-size:clamp(11px,.7vw,14px);letter-spacing:.26em;
  text-transform:uppercase;color:var(--accent);display:flex;align-items:center;gap:9px}
.kicker svg{width:1.15em;height:1.15em}
.bigyear{font-family:var(--sans);font-weight:900;font-size:clamp(76px,14vw,300px);line-height:.78;
  letter-spacing:-.05em;color:var(--accent);text-shadow:0 .045em .09em rgba(20,20,15,.62),0 .012em .02em rgba(20,20,15,.5)}
.lead-plate h1{font-family:var(--serif);font-weight:400;letter-spacing:0;
  font-size:clamp(21px,2.1vw,42px);line-height:1.24;color:#FDFCF8;max-width:23ch;margin-top:clamp(12px,1.4vw,26px)}
.lead-plate .deck{font-size:clamp(15px,.95vw,21px);color:#CFCABB;max-width:58ch;margin:16px 0 0}
.lead-plate .go{display:inline-block;margin-top:20px;background:var(--accent);color:var(--ink);
  font-family:var(--sans);font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  font-size:clamp(12px,.75vw,15px);padding:12px 20px;text-decoration:none}
.credit-bar{background:var(--ink);border-top:1px solid #2B2A24}
.credit-bar .wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:baseline;padding-block:12px 18px}
.credit-bar p{margin:0;font-size:clamp(14px,.9vw,18px);color:#CFCABB;max-width:80ch}
.credit-bar .cred{font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:#8A8577;white-space:nowrap}

/* ---------- bands ---------- */
.standing{background:var(--accent);color:var(--ink)}
.standing p{margin:0;font-family:var(--sans);font-weight:600;font-size:clamp(15px,1.2vw,26px);
  line-height:1.36;padding-block:clamp(14px,1.4vw,28px);max-width:76ch}
.band{padding-block:clamp(40px,4.6vw,112px)}
.band--dark{background:var(--ink);color:#CFCABB}
.band--dark h2,.band--dark h3{color:#FDFCF8}
.band--blue{background:var(--secondary);color:#D6DCEE}
.band--blue h2,.band--blue h3{color:#fff}
.band--blue a{color:var(--accent)}
.band--mat{background:var(--stone)}
.eyebrow{font-family:var(--sans);font-weight:900;font-size:clamp(13px,.95vw,19px);letter-spacing:.2em;
  text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:9px;margin-bottom:14px}
.eyebrow svg{width:1.15em;height:1.15em;stroke-width:2}
.band--dark .eyebrow,.band--blue .eyebrow{color:var(--accent)}
.band-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:14px 30px;justify-content:space-between;
  border-bottom:2px solid currentColor;padding-bottom:16px;margin-bottom:clamp(22px,2.4vw,48px)}
.band-head h2{font-size:clamp(22px,2.2vw,46px);font-weight:700;max-width:27ch}
.band-head h2 svg{width:1em;height:1em;vertical-align:-.1em;margin-right:.2em}
.more{font-family:var(--sans);font-weight:700;font-size:clamp(12px,.76vw,15px);letter-spacing:.14em;
  text-transform:uppercase;white-space:nowrap}

/* asymmetric feature row (the bus band, as delivered) */
.feature-row{display:grid;gap:clamp(28px,3.4vw,88px);grid-template-columns:1fr;align-items:start}
@media(min-width:900px){.feature-row{grid-template-columns:1.15fr 1fr}}
.feature-row h2{font-size:clamp(27px,3vw,60px);font-weight:700;margin-bottom:clamp(16px,1.6vw,30px)}
.feature-row p{margin:0 0 1em}
.stack{display:grid;gap:clamp(14px,1.6vw,30px)}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.2vw,22px)}
.feature-row .pair{margin-top:clamp(20px,2vw,40px)}
.feature-row .pair .slotfig img,.feature-row .pair .slotfig>div{aspect-ratio:1/1}
@media(min-width:900px){.feature-row .article-figure img{aspect-ratio:3/4}}

/* Rosenwald blue band, as delivered */
.bignum{font-family:var(--sans);font-weight:900;font-size:clamp(66px,9vw,200px);line-height:.82;
  letter-spacing:-.045em;color:var(--accent)}
.split-2{display:grid;gap:clamp(28px,3.4vw,80px);grid-template-columns:1fr;align-items:start}
@media(min-width:940px){.split-2{grid-template-columns:1fr 1fr}}

/* Crow Island amber panel, as delivered */
.panel-amber{background:var(--accent);color:var(--ink);padding:clamp(22px,3vw,72px);
  display:grid;gap:clamp(24px,3vw,72px);grid-template-columns:1fr;align-items:end}
@media(min-width:900px){.panel-amber{grid-template-columns:1fr 1fr}}
.panel-amber h2{font-size:clamp(25px,2.7vw,54px);font-weight:700;margin-bottom:clamp(14px,1.3vw,24px);max-width:22ch}
.panel-amber p{margin:0 0 clamp(14px,1.3vw,24px);color:#3A3418;max-width:52ch}
.panel-amber a{color:var(--ink)}

/* Objects strip */
.objgrid{display:grid;gap:clamp(14px,1.5vw,30px);grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
@media(min-width:1080px){.objgrid{grid-template-columns:repeat(6,minmax(0,1fr))}}
.objgrid>a{text-decoration:none;color:inherit;display:flex;flex-direction:column;border-top:2px solid var(--ink);padding-top:12px;position:relative}
.objgrid>a::before{content:"";position:absolute;top:-2px;left:0;width:26px;height:6px;background:var(--accent)}
.objgrid>a:hover::before{width:100%}
.objgrid>a:hover{background:none}
.objgrid img{aspect-ratio:4/5;object-fit:cover;width:100%}
.objgrid .yr{order:-1;font-family:var(--sans);font-weight:900;font-size:clamp(17px,1.3vw,26px);letter-spacing:-.02em;color:var(--ink);margin:0 0 10px}
.objgrid h3{margin:12px 0 6px;font-size:clamp(15px,.95vw,20px);font-weight:700;line-height:1.18}
.objgrid p{margin:0;font-size:15px;line-height:1.45;color:var(--muted)}
.strip>a:hover{background:none}
.strip img{aspect-ratio:1/1;object-fit:cover;width:100%}
.strip .yr{font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:var(--muted);margin-top:10px}
.strip h3{margin:4px 0 6px;font-size:clamp(16px,1.05vw,22px);font-weight:700}
.strip p{margin:0;font-size:15px;line-height:1.45;color:var(--muted)}

/* People & Ideas split */
.idea-list{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.idea-list li{border-bottom:1px solid var(--rule);padding:14px 0}
.idea-list a{font-family:var(--sans);font-weight:600;font-size:clamp(16px,1vw,21px);
  text-decoration:none;line-height:1.24;display:block;color:var(--ink)}
.idea-list a:hover{background:var(--accent)}
.idea-list span{display:block;font-family:var(--serif);font-size:15px;color:var(--muted);margin-top:6px}

/* timeline ribbon */
.ribbon{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));border-top:1px solid #3A382F}
.ribbon .stop{border-bottom:1px solid #3A382F;border-right:1px solid #3A382F;padding:20px 18px 24px}
.ribbon .yr{font-family:var(--sans);font-weight:900;font-size:clamp(30px,3vw,62px);line-height:.9;
  letter-spacing:-.04em;color:var(--accent)}
.ribbon .stamp{margin:12px 0 10px;color:#6A665A}
.ribbon p{margin:0;font-size:clamp(14px,.84vw,17px);line-height:1.5}
.ribbon a{color:#FDFCF8;text-decoration-color:#6A665A}

/* buildings cluster */
.cluster{display:grid;gap:clamp(18px,2vw,42px);grid-template-columns:1fr}
@media(min-width:820px){.cluster{grid-template-columns:repeat(3,1fr);align-items:start}}
@media(min-width:1080px){.cluster{grid-template-columns:repeat(4,1fr)}}
.cluster a{text-decoration:none;color:inherit;display:block;background:var(--mat);padding:clamp(10px,1vw,18px)}
.cluster a:hover img{opacity:.88}
.cluster a:hover{background:var(--mat)}
.cluster img{aspect-ratio:4/5;object-fit:cover;width:100%;transition:opacity .15s}
.cluster .tall img{aspect-ratio:3/4}
.cluster h3{margin:14px 0 8px;padding-top:12px;border-top:2px solid var(--ink);font-size:clamp(18px,1.25vw,27px);font-weight:700}
.cluster .tall h3{font-size:clamp(22px,1.7vw,35px)}
.cluster p{margin:0;color:var(--muted);font-size:.88em}
.cluster .extra{display:none}
@media(min-width:820px){.cluster .extra{display:block}}

/* ---------- figures: the three delivered treatments ---------- */
figure{margin:0}
.fig-cap{display:flex;flex-wrap:wrap;gap:6px 24px;align-items:baseline;justify-content:space-between;
  margin-top:12px;padding-top:10px;border-top:2px solid var(--ink)}
.fig-cap .cap{flex:1 1 min(100%,30ch);margin:0;font-family:var(--serif);font-style:italic;
  font-size:clamp(14px, .5vw + 12px, 17px);line-height:1.45}
.fig-cap .cred{flex:0 1 auto;margin:0;font-family:var(--mono);font-style:normal;font-size:11px;
  letter-spacing:.05em;color:var(--muted)}
/* 1 · flush mat */
.article-figure{background:var(--mat);padding:clamp(12px,1.1vw,22px)}
.article-figure img{width:100%;object-fit:cover}
/* 2 · offset stamp */
.fig-offset img{width:100%;object-fit:cover;position:relative;z-index:1}
.fig-offset .panel{background:#26251E;margin:-24px 0 0 clamp(16px,3vw,64px);position:relative;z-index:2;
  padding:20px clamp(16px,2vw,34px)}
.fig-offset .panel .fig-cap{border-top:0;margin-top:0;padding-top:0}
.fig-offset .panel .cap{color:var(--stone)}
.fig-offset .panel .cred{color:#8A8577}
/* 3 · full-bleed plate */
.fig-plate{position:relative;background:var(--ink)}
.fig-plate img{width:100%;height:min(62vh,720px);object-fit:cover;opacity:.9}
.fig-plate .over{position:absolute;left:0;right:0;bottom:0;padding:clamp(18px,3vw,56px);
  background:linear-gradient(to top,rgba(20,20,15,.93),rgba(20,20,15,0))}
.fig-plate .over p{margin:0;color:#FDFCF8;font-size:clamp(15px,.9vw,20px);max-width:70ch}
.fig-plate .over .cred{font-family:var(--mono);font-size:11px;color:#9C978A;margin-top:8px}
.gallery{display:grid;gap:clamp(12px,1.4vw,26px);grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.gallery figure{background:var(--mat);padding:10px}
.gallery img{aspect-ratio:3/4;object-fit:cover;width:100%}
.gallery figcaption{margin-top:10px;font-size:14px;line-height:1.42;font-style:italic}
.map-figure{background:var(--secondary);padding:clamp(14px,1.6vw,30px)}
.map-figure svg,.map-figure .map-slot{width:100%;display:block}
.map-band .band-head h2{font-size:clamp(22px,2.2vw,46px)}
.map-band .band-head h2 svg{width:1em;height:1em;vertical-align:-.1em;margin-right:.25em}
.map-layout{display:grid;gap:clamp(20px,2.4vw,52px);grid-template-columns:1fr;align-items:start}
@media(min-width:1000px){.map-layout{grid-template-columns:minmax(0,1.55fr) minmax(0,1fr)}}
.map-legend{list-style:none;margin:0;padding:0;display:grid;gap:0;counter-reset:none;border-top:1px solid #4A67B8}
.map-legend li{display:grid;grid-template-columns:2em minmax(0,9.5em) minmax(0,1fr);gap:4px 12px;align-items:baseline;border-bottom:1px solid #2A4A9E;padding:5px 0}
@media(max-width:640px){.map-legend li{grid-template-columns:2em minmax(0,1fr)}.map-legend .d{grid-column:2}}
.map-legend .n{font-family:var(--sans);font-weight:900;font-size:clamp(15px,1vw,20px);color:var(--accent)}
.map-legend .pl{display:contents}
.map-legend .pl>a{font-family:var(--sans);font-weight:700;font-size:clamp(15px,.95vw,19px);color:#fff;text-decoration:none;line-height:1.2}
.map-legend .pl>a:hover{color:var(--ink);background:var(--accent)}
.map-legend .d{display:block;font-size:clamp(13px,.8vw,16px);line-height:1.35;color:#B8C4E4}
.foot ul.compact{grid-template-columns:1fr 1fr;gap:6px 18px}
.map-figure figcaption{margin-top:12px;color:#D6DCEE;display:flex;flex-wrap:wrap;gap:6px 24px;
  justify-content:space-between;align-items:baseline;border-top:1px solid #2A4A9E;padding-top:10px;font-size:clamp(14px,.85vw,17px)}
.map-figure figcaption .cred{font-family:var(--mono);font-size:11px;color:#8FA6DE}
.slotfig{background:var(--mat);padding:clamp(10px,1vw,18px)}
.chip-fig{background:var(--accent);display:flex;flex-direction:column}
.chip-swatch{flex:1 1 auto;min-height:clamp(120px,14vw,260px);background:var(--accent);border-bottom:2px solid #3A3418}
.chip-spec{display:grid;gap:7px;padding:clamp(12px,1.2vw,20px)}
.cs-row{display:grid;grid-template-columns:5.6em 1fr;gap:10px;align-items:baseline;border-bottom:1px solid rgba(58,52,24,.28);padding-bottom:6px}
.cs-k{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#6B5A12}
.cs-v{font-family:var(--sans);font-weight:700;font-size:clamp(13px,.88vw,17px);line-height:1.2;color:#2A2510}
.cs-foot{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#6B5A12}
.slotfig img{aspect-ratio:4/5;object-fit:cover;width:100%}
.slotfig figcaption{margin-top:10px;font-size:14px;line-height:1.42;font-style:italic}
.slotfig .cred{display:block;font-family:var(--mono);font-style:normal;font-size:10px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted);margin-top:6px}
.band--blue .slotfig{background:#0B2258;border:1px solid #2A4A9E}
.band--blue .slotfig figcaption{color:#D6DCEE}
.band--blue .slotfig .cred{color:#8FA6DE}

/* ---------- article ---------- */
article .prose:empty{display:none}
article .breakout,article .bleed{margin-block:clamp(32px,4.2vw,84px)}
article .prose>figure{margin-block:clamp(32px,4.2vw,84px)}
article .breakout>.notes-panel,article .breakout>.pullquote,article .breakout>.blockquote{margin-block:0}
article .bleed>figure,article .breakout>figure{margin-block:0}

.artmeta{font-family:var(--sans);font-weight:700;font-size:clamp(11px,.72vw,13px);letter-spacing:.22em;
  text-transform:uppercase;display:flex;align-items:center;gap:9px;color:var(--accent)}
.artmeta svg{width:1.2em;height:1.2em}
.artmeta a{color:var(--accent);text-decoration:none}
.article-title{font-size:clamp(30px,3.8vw,74px);font-weight:900;max-width:20ch;color:#FDFCF8;
  margin:clamp(12px,1.3vw,26px) 0 0}
.lead{font-size:clamp(18px, .62vw + 15px, 26px);line-height:1.45}
article p{margin:0 0 1.05em}
article h2{font-size:clamp(22px,1.8vw,40px);font-weight:700;margin:1.5em 0 .45em}
.pullquote{margin:clamp(28px,3vw,64px) 0;border-top:4px solid var(--accent);border-bottom:4px solid var(--accent);padding:22px 0}
.pullquote p{margin:0;font-family:var(--sans);font-weight:600;font-size:clamp(19px,1.55vw,34px);
  line-height:1.2;letter-spacing:-.015em}
.blockquote{margin:1.6em 0;border-left:4px solid var(--secondary);padding:4px 0 4px 22px}
.blockquote p{margin:0 0 .5em;font-style:italic}
.blockquote cite{font-family:var(--sans);font-style:normal;font-size:14px;letter-spacing:.06em;color:var(--muted)}
.callout{background:var(--ink);color:var(--stone);padding:clamp(18px,2vw,36px);margin:clamp(24px,2.6vw,52px) 0}
.callout p{margin:0;font-size:clamp(16px,.95vw,21px)}
.callout .eyebrow{color:var(--accent)}
.note{background:var(--mat);border-left:4px solid var(--accent);padding:14px 18px;font-size:.92em;margin:1.4em 0}
.notes-panel{margin:clamp(26px,3vw,60px) 0;background:var(--stone);padding:clamp(18px,2vw,40px);border-top:6px solid var(--accent)}
.notes-panel h3{font-size:clamp(19px,1.3vw,28px);margin:0 0 16px;font-weight:700}
.notes-panel--dark{background:var(--ink);color:var(--stone)}
.notes-panel--dark h3{color:#FDFCF8}
.notes-panel--dark .eyebrow{color:var(--accent)}
.end-record{border-top:6px solid var(--accent)}
.record-grid{display:grid;gap:clamp(18px,2vw,40px);grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}

.record-grid>*{min-width:0;max-width:100%;margin-inline:0}
.record-grid>figure.article-figure figcaption .cap{color:var(--ink)}
.record-item .timeline li{grid-template-columns:1fr}
@media(min-width:1100px){.record-item .timeline li{grid-template-columns:minmax(7ch,11ch) 1fr}}
.record-item h3{font-size:clamp(16px,1.05vw,21px);font-weight:700;margin:0 0 12px}
.record-item .eyebrow{display:none}
.record-grid>figure.article-figure{align-self:start}
.record-grid>figure.article-figure img{aspect-ratio:4/3;object-fit:cover}
.record-grid>figure.article-figure figcaption p{color:var(--ink)}
.factlist{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.factlist li{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:baseline;
  border-top:1px solid var(--rule);padding-top:11px;font-size:clamp(15px, .5vw + 13px, 18px);line-height:1.5}
.notes-panel--dark .factlist li{border-top-color:#3A382F}
.factlist .mk{color:var(--accent)}
.factlist .mk svg{width:15px;height:15px;vertical-align:-.15em}
.timeline{list-style:none;margin:0;padding:0}
.timeline li{display:grid;grid-template-columns:1fr;gap:2px 20px;border-top:1px solid var(--rule);padding:12px 0}
@media(min-width:640px){.timeline li{grid-template-columns:minmax(9ch,16ch) 1fr}}
.timeline .t-when{font-family:var(--sans);font-weight:700;font-size:clamp(15px,.9vw,19px);color:var(--secondary)}
.notes-panel--dark .timeline li{border-top-color:#3A382F}
.notes-panel--dark .timeline .t-when{color:var(--accent)}
.timeline .t-what{font-size:clamp(15px, .5vw + 13px, 18px);line-height:1.5}
.statrow{display:grid;gap:clamp(14px,1.6vw,32px);grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr))}
.statblock{border-top:3px solid var(--accent);padding-top:12px}
.stat-num{display:block;font-family:var(--sans);font-weight:900;font-size:clamp(30px,2.6vw,54px);letter-spacing:-.035em;line-height:1}
.stat-label{display:block;font-size:15px;line-height:1.4;color:var(--muted);margin-top:8px}
.notes-panel--dark .stat-label{color:#B4AE9E}
.datatable,.versus{width:100%;border-collapse:collapse;font-size:clamp(15px, .45vw + 13px, 18px)}
.datatable th,.datatable td,.versus th,.versus td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--rule);vertical-align:top}
.datatable thead th,.versus thead th{font-family:var(--sans);font-size:12px;letter-spacing:.16em;
  text-transform:uppercase;background:var(--ink);color:var(--paper);border-bottom:0}
.versus tbody th{font-family:var(--sans);font-weight:700;font-size:15px;width:22%}
.tablewrap{overflow-x:auto}
.chart svg{width:100%;height:auto}
.chart figcaption{margin-top:10px;font-size:14px;color:var(--muted)}

/* cards & lists */
.profile-grid{display:grid;gap:clamp(14px,1.6vw,30px);grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.profile-card{background:var(--mat);padding:18px;display:flex;flex-direction:column}
.profile-card .p-photo{aspect-ratio:1/1;object-fit:cover;width:100%;margin-bottom:14px}
.profile-card.no-photo{border-top:4px solid var(--secondary)}
.profile-card h3{font-size:19px;margin:0 0 4px}
.profile-card .p-role{font-family:var(--sans);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0 0 10px}
.profile-card p{font-size:15px;line-height:1.5;margin:0 0 10px}
.profile-card .p-links{margin-top:auto;font-size:14px}
.org-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.org-card{display:flex;align-items:center;gap:12px;background:var(--mat);padding:12px 14px;text-decoration:none;color:inherit}
.org-card:hover{background:var(--accent)}
.org-logo{width:44px;height:44px;object-fit:contain;flex:none}
.org-name{font-family:var(--sans);font-weight:700;font-size:15px;line-height:1.2}
.org-host{font-family:var(--mono);font-size:11px;color:var(--muted);display:block}
.further-grid,.related-links{display:grid;gap:12px;list-style:none;margin:0;padding:0;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.further-grid a,.related-links a{display:block;height:100%;background:var(--mat);padding:16px 18px;
  text-decoration:none;color:inherit;font-family:var(--sans);font-weight:600;
  font-size:clamp(15px,.9vw,19px);line-height:1.24}
.further-grid a:hover,.related-links a:hover{background:var(--accent)}
.cat-list{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.cat-list li{border-bottom:1px solid var(--rule)}
.cat-list a{display:grid;grid-template-columns:1fr;gap:4px 28px;padding:18px 0;text-decoration:none;color:inherit}
@media(min-width:860px){.cat-list a{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);align-items:baseline}}
.cat-list a:hover{background:var(--accent)}
.cat-list .t{font-family:var(--sans);font-weight:700;font-size:clamp(17px,1.15vw,25px);line-height:1.2}
.cat-list .d{font-size:15px;line-height:1.5;color:var(--muted)}
.cat-list a:hover .d{color:var(--ink)}

/* ---------- supporters ---------- */
.supporters{background:var(--ink);color:#CFCABB;padding-block:clamp(30px,3.4vw,72px)}
.supporters h2{font-size:clamp(20px,2.1vw,44px);font-weight:700;color:#FDFCF8;max-width:34ch}
.supporters h2 svg{width:1em;height:1em;vertical-align:-.1em;margin-right:.2em}
.supporters .sub{font-size:clamp(15px,1.05vw,22px);color:#9C978A;margin:clamp(10px,1vw,18px) 0 0;max-width:78ch}
.sponsor-group{margin-top:clamp(20px,2.2vw,42px)}
.sponsor-group h3{font-family:var(--sans);font-size:11px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--accent);border-bottom:1px solid #3A382F;padding-bottom:8px;margin-bottom:16px}
.sponsor-row{display:grid;grid-template-columns:repeat(auto-fit,300px);gap:16px;justify-content:center}
.sponsor{width:300px;display:flex;flex-direction:column;gap:12px;background:#26251E;
  border:1px solid #3A382F;padding:16px;text-decoration:none;color:#CFCABB}
.sponsor:hover{background:#302E25;color:#FDFCF8}
.sponsor img{height:44px;max-height:44px;max-width:100%;width:auto;object-fit:contain;align-self:flex-start}
.sponsor-name{font-family:var(--sans);font-weight:700;font-size:14px;letter-spacing:.06em;
  text-transform:uppercase;color:#FDFCF8;line-height:1.2}
.sponsor-blurb{font-size:14px;line-height:1.45;color:#9C978A}
@media(max-width:520px){.sponsor-row{grid-template-columns:1fr}.sponsor{width:100%}}

/* ---------- footer ---------- */
.foot{background:var(--ink);color:#8A8377;padding-block:clamp(28px,3vw,60px);border-top:6px solid var(--accent)}
.foot .cols{display:grid;gap:clamp(20px,2.4vw,56px);grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.foot .fnm{font-family:var(--sans);font-weight:900;text-transform:uppercase;letter-spacing:-.03em;
  font-size:clamp(22px,2vw,40px);line-height:.9;color:var(--accent)}
.foot .fnm em{font-style:normal;color:#FDFCF8}
.foot h4{font-family:var(--sans);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.foot a{color:#DCD6C8;text-decoration:none;font-size:15px}
.foot a:hover{color:var(--ink)}
.foot .line{font-size:15px;line-height:1.55;max-width:46ch;margin:14px 0 0}

/* ---------- mobile nav ---------- */
@media(max-width:880px){
  .fscode{display:none}
  .hamburger{display:flex;align-items:center;gap:8px;background:none;border:1px solid var(--accent);
    color:var(--accent);font-family:var(--sans);font-weight:700;font-size:12px;letter-spacing:.16em;
    text-transform:uppercase;padding:9px 13px;cursor:pointer;align-self:end;margin-bottom:6px}
  .mnav{display:none;flex-direction:column;align-items:stretch;gap:0;padding:0}
  .mnav a{width:100%;padding:13px 0;border-bottom:1px solid #2B2A24;font-size:16px}
  .mnav .rt{margin-left:0;flex-direction:column;gap:0;width:100%}
  .navtoggle:checked ~ .wrap .mnav{display:flex}
  .mnav a{min-height:46px}
  .hamburger{min-height:44px}
  .subnav{display:none}
}

/* ---------- large displays ---------- */
@media(min-width:1400px){
  :root{--prose:70ch;--wide:96ch}
  .wrap{max-width:1780px}
  .article-shell{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:clamp(30px,3vw,72px);
    max-width:1440px;margin-inline:auto;padding-inline:var(--pad)}
  .article-shell .prose,.article-shell .breakout{margin-inline:0;padding-inline:0}
  .article-shell .bleed{margin-inline:calc(var(--pad)*-1)}
  .toc{position:sticky;top:32px;align-self:start;border-top:4px solid var(--accent);padding-top:14px}
  .toc h4{font-family:var(--sans);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin:0 0 12px}
  .toc ol{list-style:none;margin:0;padding:0;display:grid;gap:10px;counter-reset:c}
  .toc li{counter-increment:c;font-size:15px;line-height:1.35}
  .toc li::before{content:counter(c,decimal-leading-zero) "  ";font-family:var(--mono);font-size:11px;color:var(--accent)}
  .toc a{color:var(--ink);text-decoration:none}
  .toc a:hover{background:var(--accent)}
}
@media(max-width:1399px){.toc{display:none}}
@media(min-width:1920px){
  :root{--prose:76ch;--wide:118ch;--pad:80px}
  body{font-size:21px}
  .wrap{max-width:2100px}
  .article-shell{max-width:1880px;grid-template-columns:minmax(0,1fr) 320px}
  .lead-plate{min-height:min(86vh,1100px)}
  .strip>a{flex-basis:400px}
}
@media(min-width:2400px){
  :root{--prose:80ch;--wide:130ch}
  body{font-size:22px}
  .wrap{max-width:2360px}
  .article-shell{max-width:2200px;grid-template-columns:minmax(0,1fr) 380px}
}

/* sp-mark-align: marks sit CENTRED in their box. Placement only — Design's size,
   padding, panel and object-fit are untouched. */
.sponsor img,.sponsor-box img,.sp-logo img{object-position:center!important;margin-left:auto!important;margin-right:auto!important;display:block}
.sponsor .sp-logo,.sponsor-box{display:flex;align-items:center;justify-content:center}

/* sp-tile-uniform: a slot never grows to fill its row — every tile the same width in
   every row, whatever the count. Only flex-grow is touched. */
.sponsor{flex-grow:0!important}
.sponsor.lead-line,.sponsor.feat.lead-line{flex-grow:1!important}
.sponsor:not(.lead-line){flex-basis:var(--sp-tile,232px)!important}
.sponsor:not(.lead-line){grid-column:span 1!important;grid-row:span 1!important}

/* sp-grid-fill: fixed px columns leave a dead strip at wide widths — the tiles
   must stretch, and a tile with its own fixed width has to give that up too */
.sponsor-row{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))!important;justify-content:stretch!important}
.sponsor-row>[data-partner],.sponsor-row>*>[data-partner]{width:auto!important}

/* sp-blurb-stack: a slot holding BOTH a mark and our copy stacks them —
   a fixed-height row clips the mark once the copy is un-hidden. */
.sponsor:has(> img):has(> .sponsor-blurb:not(:empty)){flex-direction:column!important;align-items:flex-start!important;justify-content:flex-start!important;height:auto!important;min-height:0!important;overflow:visible!important;gap:8px}
.sponsor:has(> img):has(> .sponsor-blurb:not(:empty)) > img{align-self:flex-start}

/* sp-blurb-unhide: every supporter slot shows its text — no half-texted grids */
.sponsor-blurb:not(:empty){display:block!important;line-height:1.5}

/* sp-tile-fit: a slot fills its track, keeps a symmetric inset, and cannot be inflated
   by one long line of our copy. */
.sponsor.sponsor{width:100%!important;box-sizing:border-box!important;align-self:stretch!important;align-items:center!important;height:auto!important;min-height:0!important;overflow:hidden}
.sponsor.sponsor{justify-content:center!important}
:has(> .sponsor.sponsor){align-items:stretch!important}
.sponsor.sponsor .sponsor-name{min-width:0!important;overflow-wrap:anywhere}
.sponsor.sponsor > img{flex:0 0 auto!important;align-self:center!important}
.sponsor.sponsor > .sponsor-txt,.sponsor.sponsor > span:not(.sponsor-name){flex:1 1 auto!important;min-width:0!important}
.sponsor.sponsor .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin:0!important}
/* the mobile un-clamp is retired: the operator asked for "2-3 rows max" on phones, which is
   what the desktop rule above already does — so mobile simply keeps it. */
@media (max-width:640px){.sponsor.sponsor .sponsor-blurb{-webkit-line-clamp:3!important;display:-webkit-box!important;-webkit-box-orient:vertical!important;overflow:hidden!important}}

/* sp-blurb-link: money-link anchors in blurbs must inherit the blurb colour (readable on dark OR light tiles) */
.sponsor-blurb a{color:inherit;text-decoration:underline;text-underline-offset:2px}

/* pipeline: one brand treatment per tile — the name reads at the blurb's own size */
.sponsor .sp-brand{font:inherit!important;font-weight:700!important;letter-spacing:inherit!important;text-transform:none!important;color:inherit!important;display:inline!important;}

/* MAPKIT_BEGIN — injected real geodata; pins are links */
.map-slot{padding:0;background:none!important;border:0!important;display:flex;align-items:center;justify-content:center;min-height:0!important}
.map-slot>svg.mapkit{width:100%!important;max-width:100%;height:auto;max-height:none;margin:0 auto}
.map-slot{width:100%}
.map-slot{aspect-ratio:auto!important;height:auto!important}
.map-slot::after,.map-slot::before{content:none!important;display:none!important}
.map-figure figcaption{}
.mapkit-panels{display:grid;grid-template-columns:repeat(var(--n,2),minmax(0,1fr));gap:16px;width:100%}
.mapkit-panels>svg.mapkit{width:100%;height:auto;display:block}
@media (max-width:700px){.mapkit-panels{grid-template-columns:minmax(0,1fr)}}
.mapkit__pin{cursor:pointer}
.mapkit__pin text{paint-order:stroke;stroke:#FDFCF8;stroke-width:3px;stroke-linejoin:round}
.mapkit__pin:hover circle{r:9.1}
.mapkit__pin:hover text{font-weight:700}
/* MAPKIT_END */

/* sp-mark-frame: a uniform plate for the money mark, in the tiers where Design sized the plate
   to the artwork instead. Operator's rule: the dark ground is unified whatever the logo's
   size. width:100% (or one fixed width where copy shares the row) + one height for the tier
   + object-fit:contain, so the plate is the same box everywhere and the artwork fits inside
   it. A ground and an inset are added ONLY where none exists — adding a second ground gives
   co-cure's rectangle-inside-a-rectangle. Design's framed tiers are not touched at all. */
.sponsor-row .sponsor.sponsor img{height:44px!important;display:block!important;width:100%!important}

/* op-footer-compact: the footer printed 4 rows for 7 link(s) in
   1 list(s) — 452px at 390, 3% of the whole page. Design's own
   good case (evbb) has no list at all: its footer links simply flow inline, 479px in total.
   Here the lists flow inline too,
   measured 452 -> 347px (23% shorter) with no new overflow. Both shapes were
   tried and the shorter one kept — two columns helps a wide group set and hurts a narrow one.
   Phone widths only; the desktop footer is untouched. */
@media (max-width:640px){
  footer ul,footer ol{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;column-gap:clamp(6px,1.25vw,18px)!important;row-gap:4px!important}
  footer ul > li,footer ol > li{width:auto!important;flex:0 0 auto;max-width:100%}
}

/* op-money-columns: the supporters block ran one tile per row — 9 tiles,
   1248px at 390, 8% of the whole page. Two columns bring it to
   1047px (16% shorter). Checked before writing: no new overflow, smallest mark still
   131px wide, longest blurb 1 lines, tile heights 128-233px.
   A block that fails any of those is left in one column — two narrow columns can make a block
   TALLER once the copy rewraps, which is the case the operator warned about.
   An odd tile count means the lead tile spans the whole row, so the block does not end on an empty cell. Only the tier(s) that were one-per-row are touched (.sponsor-row), never the section
   that holds several tiers: forcing a grid on that would put a featured row and a regulars run
   side by side. Phone widths only. */
@media (max-width:640px){
  .sponsor-row{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:16px!important}
    .sponsor-row > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .sponsor-row > * *{min-width:0!important;max-width:100%}
    .sponsor-row img,.sponsor-row svg{max-width:100%;height:auto}

}

/* op-odd-tier-lead: .sponsor-row (3 tiles), .sponsor-row (3 tiles), .sponsor-row (3 tiles) lay out two per row with an ODD tile count, so the
   block ended on a lone tile beside an empty cell. The lead tile takes the whole row instead —
   operator: "the 1st item in such rows to be 100% width, then split" — so the grid reads as
   complete. These tiers were already two-per-row, which is why the column pass never wrote the
   rule for them. Checked before writing: no new horizontal overflow, block not more than 15%
   taller. Phone widths only; desktop keeps Design's layout. */
@media (max-width:640px){
  .sponsor-row:has(> *:nth-child(odd):last-child) > *:first-child{grid-column:1 / -1!important}
  .sponsor-row:has(> *:nth-child(odd):last-child) > *:first-child{grid-column:1 / -1!important}
  .sponsor-row:has(> *:nth-child(odd):last-child) > *:first-child{grid-column:1 / -1!important}
}

/* op-hover-pad */
.idea-list a{padding-left:clamp(12px,3.5vw,22px)!important}
/* op-hover-pad:end */

/* op-hover-pad */
.cat-list a{padding-left:clamp(12px,3.5vw,22px)!important;padding-right:clamp(12px,3.5vw,22px)!important}
/* op-hover-pad:end */
