/* thesolutionsite.com — Paperwork
   PALETTE (5 members + one sheet tint, each with a job)
   --ground  #C9BC9C  desk kraft: the page ground
   --paper   #FBF7EC  the sheet: every reading surface
   --ink     #1B1A16  type, rules, frames
   --accent  #5B2BC9  stamp violet: masthead, stamps, one band  (saturated, hue ~265)
   --second  #0E6B4F  seal green: panels, callouts, one band     (saturated, hue ~160)
   --flag    #F2E6A9  carbon yellow: tinted areas, pull-outs
   TYPE  Spectral display + prose · Karla captions/labels/UI · Courier Prime form fields, stamps, numerals
   WIDTHS  --prose (ch) · --wide (breakout) · full bleed. All three step up at 1200 / 1600 / 2000px.
*/

:root{
  --ground:#C9BC9C;
  --paper:#FBF7EC;
  --paper-2:#EFE7D2;
  --ink:#1B1A16;
  --ink-60:#5F5A4A;
  --ink-40:#8B8267;
  --accent:#5B2BC9;
  --accent-ink:#47189F;
  --second:#0E6B4F;
  --flag:#F2E6A9;
  --rule:#B7AC90;

  --fs-body:17px;
  --fs-prose:19px;
  --prose:74ch;
  --wide:1060px;
  --gut:clamp(16px,4vw,40px);
  --band:clamp(40px,5vw,84px);

  --serif:"Spectral",Georgia,"Times New Roman",serif;
  --sans:"Karla","Helvetica Neue",Arial,sans-serif;
  --mono:"Courier Prime","Courier New",monospace;
}
@media (min-width:1200px){:root{--fs-body:18px;--fs-prose:20px;--prose:78ch;--wide:1320px}}
@media (min-width:1600px){:root{--fs-body:19px;--fs-prose:21px;--prose:82ch;--wide:1560px}}
@media (min-width:2000px){:root{--fs-body:20px;--fs-prose:22px;--prose:86ch;--wide:1800px}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--ground);color:var(--ink);
  font:400 var(--fs-body)/1.6 var(--sans);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:var(--accent-ink);text-decoration:none;border-bottom:1px solid rgba(71,24,159,.35)}
a:hover{color:var(--ink);border-bottom-color:var(--ink)}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;letter-spacing:-.015em;line-height:1.06;margin:0}
p{margin:0 0 1.05em}
figure{margin:0}
svg{display:block}

/* ---------- widths ---------- */
.wrap{width:100%;max-width:var(--wide);margin:0 auto;padding-inline:var(--gut)}
.prose{width:100%;max-width:var(--prose);margin-inline:auto;padding-inline:var(--gut)}
.bleed{width:100%}
.sheet{background:var(--paper);border:1px solid var(--ink)}

/* ---------- labels & drawn device ---------- */
.field{font:400 11px/1.3 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-60)}
.field-2{font:400 12px/1.3 var(--mono);letter-spacing:.16em;text-transform:uppercase}
.rowline{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;align-items:baseline;
  border-bottom:1px solid var(--rule);padding-bottom:11px;margin-bottom:clamp(20px,2.2vw,40px)}
.stamp{color:var(--accent)}
.stamp svg{width:clamp(76px,7vw,124px);height:auto}
.tick{width:26px;height:26px;flex:0 0 auto}
.ico{width:22px;height:22px;flex:0 0 auto}
.ico-lg{width:34px;height:34px;flex:0 0 auto}

/* ---------- masthead ---------- */
.mast{background:var(--accent);color:#F4EFE1}
.mast a{color:inherit;border:none}
.mast .tab{border:1px solid rgba(244,239,225,.45);border-bottom:none}
.mast .tab[aria-current]{border-color:var(--ink)}
.mast .tab-arch{background:none;border:1px dashed rgba(244,239,225,.45);border-bottom:none}
.mast .tab-arch:hover{border-color:#F4EFE1;background:rgba(251,247,236,.14)}
.mast-top{display:flex;justify-content:space-between;gap:16px;padding-block:9px;
  border-bottom:1px solid rgba(244,239,225,.3);font:400 11px/1.3 var(--mono);
  letter-spacing:.18em;text-transform:uppercase}
.mast-top span:last-child{opacity:.72}
.mast-id{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(20px,3vw,64px);
  align-items:center;padding-block:clamp(18px,2.2vw,42px) clamp(14px,1.8vw,32px)}
.mast-id .field{color:rgba(244,239,225,.72);margin-bottom:9px}
.mast-id h1,.mast-id .wordmark{font-family:var(--serif);font-weight:700;
  font-size:clamp(34px,5.2vw,104px);line-height:.88;letter-spacing:-.03em;
  border-bottom:2px solid rgba(244,239,225,.55);padding-bottom:clamp(6px,.9vw,16px)}
.mast-ring{transform:rotate(-11deg)}
.tabs{display:flex;flex-wrap:wrap;align-items:flex-end;gap:4px;
  font:400 clamp(11px,.72vw,13px)/1 var(--mono);letter-spacing:.16em;text-transform:uppercase}
.tab{display:flex;align-items:center;gap:8px;padding:11px 18px 10px;border-radius:3px 3px 0 0;
  background:rgba(251,247,236,.2);border:1px solid rgba(244,239,225,.45);border-bottom:none}
.tab:hover{background:rgba(251,247,236,.34)}
.tab[aria-current]{background:var(--paper);color:var(--ink);border-color:var(--ink);font-weight:700}
.tab-w2{padding-inline:26px}
.tab-w3{padding-inline:32px}
.tab-arch{background:none;border-style:dashed;margin-left:auto}
.mast-menu{display:none}

/* ---------- homepage lead ---------- */
.lead-band{position:relative;background:var(--ink)}
.lead-band img{width:100%;height:min(78vh,860px);object-fit:cover;opacity:.94}
.lead-card{width:100%;max-width:var(--wide);margin:0 auto;padding-inline:var(--gut);
  position:relative;margin-top:min(-14vh,-120px)}
.lead-card .inner{background:var(--paper);border:1px solid var(--ink);
  padding:clamp(20px,2.4vw,46px) clamp(18px,2.2vw,44px) clamp(22px,2.6vw,50px);max-width:64ch}
.lead-card h2{font-size:clamp(28px,3.4vw,64px);line-height:1.0;margin-bottom:.5em}
.lead-card h2 a{color:inherit;border:none}
.lead-card h2 a:hover{color:var(--accent-ink)}
.lead-card p{margin-bottom:0;font-size:calc(var(--fs-body) + 1px)}
.lead-kicker{display:flex;align-items:center;gap:10px;margin-bottom:14px;color:var(--second)}

/* ---------- signature band ---------- */
.sig{background:var(--flag);border-block:1px solid var(--ink);padding-block:var(--band)}
.sig-grid{display:grid;gap:clamp(24px,3vw,64px);grid-template-columns:1fr}
@media (min-width:820px){.sig-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.sig-item{display:flex;flex-direction:column;gap:12px;border-top:2px solid var(--ink);padding-top:16px}
.sig-year{font:700 clamp(40px,4.6vw,92px)/.9 var(--mono);letter-spacing:-.02em}
.sig-item h3{font-size:clamp(19px,1.5vw,30px);line-height:1.16}
.sig-item h3 a{color:inherit;border:none}
.sig-item h3 a:hover{color:var(--accent-ink)}
.sig-item p{margin:0;font-size:calc(var(--fs-body) - 1px);color:#3F3A2C}

/* ---------- generic bands ---------- */
.band{padding-block:var(--band)}
.band-green{background:var(--second);color:#F1EBD8;border-block:1px solid var(--ink)}
.band-green a{color:#F1EBD8;border-bottom-color:rgba(241,235,216,.5)}
.band-green .field{color:rgba(241,235,216,.7)}
.split{display:grid;gap:clamp(24px,3vw,64px);grid-template-columns:1fr;align-items:start}
@media (min-width:900px){.split{grid-template-columns:minmax(0,1.55fr) minmax(0,1fr)}}
@media (min-width:1600px){.split{grid-template-columns:minmax(0,1.75fr) minmax(0,1fr)}}
.split h3{font-size:clamp(24px,2.1vw,44px);line-height:1.04;margin-bottom:.5em}
.split h3 a{color:inherit;border:none}
.split h3 a:hover{color:var(--accent-ink)}
.aside-note{background:var(--paper);border:1px solid var(--ink);padding:clamp(16px,1.8vw,32px)}
.aside-note h4{font-size:clamp(19px,1.45vw,28px);line-height:1.14;margin-bottom:.6em}
.aside-note h4 a{color:inherit;border:none}

/* ---------- figure system: three treatments ---------- */
/* 1 · plate — photo on a paper mat, hairline frame */
.fig-plate{background:var(--paper);border:1px solid var(--ink);padding:clamp(10px,1.2vw,22px)}
.fig-plate img{width:100%;aspect-ratio:16/10;object-fit:cover}
/* 2 · bleed — breaks the measure, caption on a plate that overlaps the image */
.fig-bleed img{width:100%;height:min(62vh,760px);object-fit:cover}
.fig-bleed .capbox{width:100%;max-width:var(--wide);margin:-1px auto 0;padding-inline:var(--gut)}
.fig-bleed .capbox > div{background:var(--paper);border:1px solid var(--ink);padding:clamp(12px,1.3vw,24px)}
/* 3 · inset — narrow, sits against a coloured bar */
.fig-inset{border-left:6px solid var(--second);padding-left:clamp(12px,1.2vw,22px)}
.fig-inset img{width:100%;aspect-ratio:3/2;object-fit:cover}
/* caption + credit share ONE row on desktop; box is sized by the caption, never by the image */
figcaption{padding-top:12px}
.cap{display:flex;flex-wrap:wrap;gap:6px 28px;align-items:baseline}
.cap .c-text{font-family:var(--serif);font-size:calc(var(--fs-body) + 1px);line-height:1.4;
  flex:1 1 22ch;min-width:min(100%,22ch);text-wrap:pretty}
.cap .c-credit{font:400 11.5px/1.55 var(--sans);letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-40);flex:0 1 auto;max-width:38ch;margin-left:auto;text-align:right}
.fig-plate .cap .c-text::before{content:"";display:block;width:44px;height:2px;background:var(--accent);margin-bottom:9px}
.band-green .cap .c-text,.band-green figcaption{color:#F1EBD8}
.band-green .cap .c-credit{color:rgba(241,235,216,.62)}
@media (max-width:640px){.cap .c-credit{margin-left:0;text-align:left}}

.gallery{display:grid;gap:clamp(12px,1.4vw,24px);grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.gallery img{width:100%;aspect-ratio:3/2;object-fit:cover;border:1px solid var(--ink)}
.article-figure img{width:100%;border:1px solid var(--ink)}

/* ---------- map ---------- */
.map-figure{background:var(--paper);border:1px solid var(--ink);padding:clamp(12px,1.4vw,26px)}
.map-slot svg{width:100%;height:auto}
.map-state{fill:#E4DAC0;stroke:var(--ink);stroke-width:.7;vector-effect:non-scaling-stroke}
.map-pin-hit{fill:transparent}
.map-pin circle{fill:var(--accent);stroke:var(--paper);stroke-width:2}
.map-pin text{font:400 13px var(--mono);letter-spacing:.1em;fill:var(--ink);text-transform:uppercase}
.map-pin:hover circle{fill:var(--second)}
.map-pin:hover text{fill:var(--accent-ink)}

/* ---------- article ---------- */
.art-head{padding-top:clamp(18px,2vw,36px)}
.art-kicker{display:flex;align-items:center;gap:10px;color:var(--second);margin-bottom:clamp(14px,1.6vw,26px)}
.art-kicker a{color:inherit;border:none;font:400 11px/1 var(--mono);letter-spacing:.2em;text-transform:uppercase}
.art-head h1{font-size:clamp(30px,3.9vw,78px);line-height:.98;letter-spacing:-.028em;max-width:26ch}
.art-body{font-family:var(--serif);font-size:var(--fs-prose);line-height:1.62}
.art-body h2{font-size:clamp(23px,1.9vw,38px);line-height:1.1;margin:1.9em 0 .7em}
.art-body h2:first-child{margin-top:0}
.art-body em{font-style:italic}
.lead{font-family:var(--serif);font-size:calc(var(--fs-prose) + 3px);line-height:1.38;font-weight:400;
  border-top:2px solid var(--ink);padding-top:clamp(14px,1.4vw,24px);margin-bottom:1.2em}
.note{font-family:var(--sans);font-size:calc(var(--fs-body) - 1px);color:var(--ink-60);
  border-left:3px solid var(--rule);padding-left:14px}

.pullquote{margin:clamp(26px,3vw,56px) 0;background:var(--flag);border:1px solid var(--ink);
  padding:clamp(20px,2.2vw,42px);position:relative}
.pullquote p{font-family:var(--serif);font-weight:600;font-size:clamp(20px,1.7vw,34px);
  line-height:1.2;margin:0;max-width:36ch}
.blockquote{margin:clamp(24px,2.6vw,44px) 0;border-left:6px solid var(--accent);padding-left:clamp(14px,1.4vw,26px)}
.blockquote p{font-family:var(--serif);font-size:calc(var(--fs-prose) + 1px);line-height:1.42;margin-bottom:.5em}
.blockquote cite{font:400 12px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-60);font-style:normal}
.callout{background:var(--second);color:#F1EBD8;padding:clamp(18px,2vw,36px);margin:clamp(24px,2.6vw,48px) 0}
.callout p{margin:0;font-family:var(--serif);font-size:calc(var(--fs-prose) + 1px);line-height:1.4}
.callout p + p{margin-top:.7em}

/* pull-outs break OUT of the prose measure */
.breakout{width:100%;max-width:var(--wide);margin-inline:auto;padding-inline:var(--gut);
  margin-block:clamp(30px,3.4vw,64px)}
.notes-block{background:var(--paper);border:1px solid var(--ink);padding:clamp(18px,2vw,38px)}
.notes-block > .rowline{margin-bottom:clamp(16px,1.8vw,30px)}
.notes-block h3{font-size:clamp(20px,1.6vw,32px);margin-bottom:.7em}

.timeline{list-style:none;margin:0;padding:0;counter-reset:t}
.timeline li{display:grid;grid-template-columns:1fr;gap:2px 24px;padding:13px 0;border-bottom:1px dotted var(--rule)}
@media (min-width:760px){.timeline li{grid-template-columns:minmax(9ch,20ch) minmax(0,1fr);gap:6px 32px}}
@media (min-width:1600px){.timeline li{grid-template-columns:minmax(9ch,24ch) minmax(0,1fr)}}
.t-when{font:700 13px/1.5 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--accent-ink)}
.t-what{font-family:var(--serif);font-size:calc(var(--fs-body) + 1px);line-height:1.45}

.datatable,.versus{width:100%;border-collapse:collapse;font-size:var(--fs-body)}
.datatable th,.versus th{font:400 11px/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-60);text-align:left;padding:0 16px 10px 0;border-bottom:1px solid var(--ink);font-weight:400}
.datatable td,.versus td{font-family:var(--serif);padding:12px 16px 12px 0;border-bottom:1px dotted var(--rule);
  vertical-align:top;line-height:1.45}
.datatable td:first-child{font-family:var(--sans);font-weight:700;width:clamp(10ch,26%,30ch)}
.versus td:first-child{width:clamp(10ch,22%,26ch);font-family:var(--sans);font-weight:700}

.statrow{display:grid;gap:clamp(14px,1.6vw,28px);grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.statblock{border-top:2px solid var(--accent);padding-top:12px;display:flex;flex-direction:column;gap:6px}
.stat-num{font:700 clamp(30px,2.8vw,54px)/.95 var(--mono);letter-spacing:-.02em}
.stat-label{font-family:var(--sans);font-size:calc(var(--fs-body) - 2px);line-height:1.35;color:var(--ink-60)}

.chart figcaption{padding-top:10px}
.chart .bar-label{font:400 12px var(--sans)}
.chart .bar-val{font:700 12px var(--mono)}
.chart rect{fill:var(--accent)}
.chart rect.alt{fill:var(--second)}
.chart .axis{stroke:var(--rule);stroke-width:1}

/* ---------- cards, lists, refs ---------- */
.cardgrid{display:grid;gap:clamp(16px,1.8vw,32px);grid-template-columns:1fr}
@media (min-width:700px){.cardgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1200px){.cardgrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:2000px){.cardgrid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.card{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--ink);
  padding:clamp(14px,1.4vw,26px);height:100%;border-bottom-width:1px}
a.card{border:1px solid var(--ink);color:var(--ink)}
a.card:hover{background:#fff;border-color:var(--accent)}
.card img{width:100%;aspect-ratio:16/10;object-fit:cover;margin-bottom:14px}
.card .field{margin-bottom:10px;display:flex;align-items:center;gap:8px}
.card h3{font-size:clamp(18px,1.25vw,26px);line-height:1.2;min-height:2.4em;margin-bottom:.55em}
.card p{font-size:calc(var(--fs-body) - 1px);color:var(--ink-60);margin-bottom:1em}
.card .card-foot{margin-top:auto;font:400 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--accent-ink)}

.cat-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.cat-list li{border-bottom:1px solid var(--rule)}
.cat-list a{display:grid;grid-template-columns:1fr;gap:4px 32px;padding:14px 0;color:var(--ink);border:none;align-items:baseline}
@media (min-width:760px){.cat-list a{grid-template-columns:minmax(0,1fr) minmax(0,.85fr)}}
.cat-list a:hover .cl-title{color:var(--accent-ink)}
.cl-title{font-family:var(--serif);font-size:calc(var(--fs-body) + 3px);line-height:1.25}
.cl-brief{font-size:calc(var(--fs-body) - 2px);color:var(--ink-60);line-height:1.4}

.further-grid{display:grid;gap:clamp(16px,1.8vw,34px);grid-template-columns:1fr}
@media (min-width:760px){.further-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.further-grid a{color:var(--ink);border:none;border-top:2px solid var(--ink);padding-top:12px;display:block}
.further-grid a:hover{border-top-color:var(--accent)}
.further-grid .field{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.further-grid strong{display:block;font-family:var(--serif);font-weight:600;
  font-size:calc(var(--fs-body) + 2px);line-height:1.24}
.related-links{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.related-links a{font-family:var(--serif);font-size:calc(var(--fs-body) + 2px)}
.entity-ref{white-space:nowrap}

.profile-grid{display:grid;gap:clamp(16px,1.8vw,32px);grid-template-columns:1fr}
@media (min-width:760px){.profile-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1600px){.profile-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.profile-card{background:var(--paper);border:1px solid var(--ink);padding:clamp(14px,1.4vw,26px);
  display:flex;flex-direction:column;height:100%}
.profile-card .p-photo{width:100%;aspect-ratio:4/5;object-fit:cover;margin-bottom:14px}
.profile-card.no-photo{border-left:6px solid var(--second)}
.profile-card h3{font-size:calc(var(--fs-body) + 5px);margin-bottom:.35em}
.p-role{font:400 11px/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-60);margin-bottom:.9em}
.p-links{margin-top:auto;font-size:calc(var(--fs-body) - 1px)}
.org-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.org-card{display:flex;flex-direction:column;gap:4px;background:var(--paper);border:1px solid var(--ink);
  padding:14px 16px;color:var(--ink)}
.org-card:hover{border-color:var(--accent)}
.org-logo{height:26px;width:auto;max-width:100%;object-fit:contain;margin-bottom:6px}
.org-name{font-family:var(--serif);font-weight:600;font-size:calc(var(--fs-body) + 1px);line-height:1.2}
.org-host{font:400 11px/1.3 var(--mono);letter-spacing:.1em;color:var(--ink-40)}

details.more{margin-top:18px}
details.more summary{font:400 12px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;
  cursor:pointer;color:var(--accent-ink);padding:10px 0}
details.more[open] summary{color:var(--ink)}

/* ---------- supporters (homepage only) ---------- */

/* ---------- footer ---------- */
.foot{background:var(--ink);color:#E9DFC4;padding-block:clamp(30px,3.4vw,64px) clamp(22px,2.4vw,46px);
  border-top:1px solid rgba(233,223,196,.25)}
.foot a{color:#E9DFC4;border:none;opacity:.82}
.foot a:hover{opacity:1;border-bottom:1px solid #E9DFC4}
.foot .rowline{border-bottom-color:rgba(233,223,196,.25);color:rgba(233,223,196,.6)}
.foot-grid{display:grid;gap:clamp(24px,3vw,64px);grid-template-columns:1fr}
@media (min-width:820px){.foot-grid{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}}
.foot-mark{font-family:var(--serif);font-weight:700;font-size:clamp(24px,2.2vw,46px);
  line-height:.98;letter-spacing:-.025em}
.foot-cols{display:grid;grid-template-columns:1fr 1fr;gap:12px clamp(16px,2vw,40px);
  font:400 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase}
.foot-cols div{display:flex;flex-direction:column;gap:11px}
.foot-line{margin:14px 0 0;max-width:48ch;color:rgba(233,223,196,.78)}

.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;background:var(--paper);color:var(--ink);padding:8px 14px;z-index:9}

/* ---------- additions ---------- */
.notes-list{list-style:none;margin:0;padding:0}
.notes-list li{position:relative;padding:11px 0 11px 24px;border-bottom:1px dotted var(--rule);
  font-family:var(--serif);font-size:calc(var(--fs-body) + 1px);line-height:1.45}
.notes-list li::before{content:"";position:absolute;left:0;top:1.05em;width:10px;height:10px;border:1.5px solid var(--accent)}
.sec-index .cl-title{display:flex;gap:12px;align-items:baseline}
.sec-index .ico{color:var(--second);position:relative;top:3px}
.related-links{list-style:none;padding:0;margin:0}
.related-links li{margin:0}
@media (min-width:900px){.cat-head{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)!important;align-items:end}}
.sponsor-txt{display:flex;flex-direction:column;min-width:0}
.fig-inset figcaption{padding-top:10px}
.art-body .fig-inset{margin:clamp(24px,2.6vw,46px) 0}
.art-body > h2 + p{margin-top:0}
.map-figure figcaption{padding-top:14px}

.mast .stamp{color:rgba(244,239,225,.9)}
.mast-ring svg{width:clamp(84px,8vw,140px)}
@media (max-width:860px){.mast-ring{display:none}}
.tab-arch{margin-left:auto}
@media (max-width:1080px){.tab-arch{margin-left:0}}

.band-green .fig-plate .cap .c-text,.band-green .fig-plate figcaption{color:var(--ink)}
.band-green .fig-plate .cap .c-credit{color:var(--ink-40)}
.band-green .aside-note,.band-green .aside-note .field{color:var(--ink)}
.band-green .aside-note .field{color:var(--ink-60)}
.band-green .aside-note h4 a{color:var(--ink)}
.band-green .aside-note h4 a:hover{color:var(--accent-ink)}

/* verifier fixes */
.mast{overflow:clip}
.art-head{padding-bottom:clamp(18px,2vw,34px)}
.art-head h1{padding-bottom:.08em}
.prose .lead{margin-top:0}
.quiet-band{overflow:clip}
.band{overflow:clip}

/* ---------- supporters: woven directory strips, name as type, no marks ---------- */
.sup-strip{background:var(--paper);border-block:1px solid var(--ink);padding-block:clamp(16px,1.8vw,30px)}
.sup-strip .field{display:block;margin-bottom:10px}
.sup-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.sup-list li{margin:0}
a.sponsor{display:block;background:none;border:none;border-bottom:1px solid var(--rule);
  padding:13px 0;color:var(--ink);max-width:none}
a.sponsor:hover{border-bottom-color:var(--ink)}
a.sponsor:hover .sponsor-name{color:var(--accent-ink)}
.sponsor-name{display:block;font-family:var(--serif);font-weight:600;
  font-size:calc(var(--fs-body) + 3px);line-height:1.25;white-space:normal;overflow:visible}
.sponsor-blurb{display:block;margin-top:3px;color:var(--ink-60);
  font-size:calc(var(--fs-body) - 2px);line-height:1.45;max-width:72ch}
a.sponsor.feat .sponsor-name{font-size:calc(var(--fs-body) + 7px)}
@media (min-width:1200px){a.sponsor{display:grid;grid-template-columns:minmax(0,22ch) minmax(0,1fr);
  gap:8px 40px;align-items:baseline}.sponsor-blurb{margin-top:0}}
@media (min-width:2000px){a.sponsor{grid-template-columns:minmax(0,26ch) minmax(0,1fr)}}

a.sponsor.feat{background:none}
/* ---------- large displays gain more than margin ---------- */
@media (min-width:1600px){
  .lead-card .inner{max-width:72ch}
  .fig-bleed img{height:min(70vh,900px)}
  .lead-band img{height:min(82vh,980px)}
}
@media (min-width:2000px){
  :root{--gut:clamp(28px,3vw,72px)}
  .lead-band img{height:min(86vh,1120px)}
  .fig-bleed img{height:min(74vh,1000px)}
  .sec-index .cl-title{font-size:calc(var(--fs-body) + 5px)}
  .sig-year{font-size:104px}
}
/* ---------- narrow-screen hardening ---------- */
.split>*,.cardgrid>*,.sig-grid>*,.further-grid>*,.foot-grid>*{min-width:0}
@media (max-width:560px){
  .datatable tr{display:block;border-bottom:1px dotted var(--rule);padding:9px 0}
  .datatable td{display:block;border-bottom:none;padding:2px 0}
  .datatable td:first-child{width:auto}
  .versus{font-size:calc(var(--fs-body) - 2px)}
  .versus th,.versus td{padding-right:10px}
  .timeline li{padding:11px 0}
  .cap .c-credit{max-width:none}
}

/* ---------- page shell: nothing bleeds past the shell, however wide the display ---------- */
html{background:#B3A586}
body{max-width:1920px;margin-inline:auto;border-inline:1px solid rgba(27,26,22,.22)}
@media (min-width:2000px){
  :root{--wide:1620px;--gut:clamp(28px,2.2vw,56px)}
  .lead-band img{height:min(84vh,1000px)}
  .fig-bleed img{height:min(70vh,900px)}
}

/* ---------- narrow screens ---------- */
@media (max-width:700px){
  .tabs{gap:3px;font-size:10.5px;letter-spacing:.12em}
  .tab,.tab-w2,.tab-w3{padding:9px 11px 8px;gap:6px}
  .tab .ico{width:16px;height:16px}
  .lead-card{margin-top:-56px}
  .lead-band img{height:52vh}
  .fig-bleed img{height:44vh}
  .sig-year{font-size:44px}
  .breakout{margin-block:26px}
  .pullquote p{font-size:20px}
  .stat-num{font-size:30px}
}
@media (max-width:420px){
  .tabs{font-size:10px}
  .tab,.tab-w2,.tab-w3{padding:8px 9px 7px}
  .mast-id{padding-top:14px}
  .lead-card .inner{padding:16px 15px 18px}
  .art-head h1{font-size:28px}
  .versus,.datatable{font-size:15px}
}

/* ---------- nav: heavier labels, one colour per section icon ---------- */
.tabs{font-size:clamp(12px,.86vw,15px);font-weight:700;letter-spacing:.14em}
.tab,.tab-w2,.tab-w3{padding-block:13px 12px}
.tab .ico{width:24px;height:24px}
.mast .tab-plant   .ico,.tab .ico-plant   {color:#F2E6A9}
.mast .tab .ico-plant{color:#F2E6A9}
.mast .tab .ico-money{color:#7FE3B4}
.mast .tab .ico-measure{color:#9FC4FF}
.mast .tab .ico-founders{color:#F5B9D4}
.mast .tab .ico-acts{color:#FFC98A}
.mast .tab .ico-offices{color:#C9B6FF}
.mast .tab[aria-current] .ico-plant{color:#8A7614}
.mast .tab[aria-current] .ico-money{color:#0E6B4F}
.mast .tab[aria-current] .ico-measure{color:#1F4FA8}
.mast .tab[aria-current] .ico-founders{color:#9C2A63}
.mast .tab[aria-current] .ico-acts{color:#9A5410}
.mast .tab[aria-current] .ico-offices{color:#5B2BC9}
@media (max-width:700px){.tabs{font-size:11.5px;letter-spacing:.1em}.tab .ico{width:18px;height:18px}}
@media (max-width:420px){.tabs{font-size:11px}}

/* ---------- nameplate ---------- */
.mast-id .wordmark{border-bottom:none;padding-bottom:0}
.mast-id .wordmark a{display:grid;gap:clamp(4px,.5vw,10px);color:inherit}
.wm-the{font-family:var(--mono);font-weight:400;
  font-size:clamp(11px,.86vw,16px);line-height:1;letter-spacing:.42em;text-transform:uppercase;
  color:rgba(244,239,225,.78);padding-bottom:clamp(5px,.6vw,11px);
  border-bottom:1px solid rgba(244,239,225,.42)}
.wm-name{font-family:var(--serif);font-weight:700;
  font-size:clamp(34px,5.4vw,108px);line-height:.86;letter-spacing:-.035em;
  padding-bottom:clamp(6px,.9vw,16px);
  border-bottom:3px solid rgba(244,239,225,.75);
  box-shadow:0 5px 0 -3px rgba(244,239,225,.4)}
.wm-site{font-style:italic;font-weight:400}

/* ---------- nav fills the content width ---------- */
.mast .tabs{flex-wrap:nowrap;gap:3px}
.mast .tab{flex:1 1 0;min-width:0;justify-content:center;padding-inline:6px}
.mast .tab-w2,.mast .tab-w3{padding-inline:6px}
.mast .tab-arch{margin-left:0;flex:0 1 auto;padding-inline:clamp(10px,1.1vw,22px)}
@media (max-width:820px){
  .mast .tabs{flex-wrap:wrap}
  .mast .tab{flex:1 1 30%}
  .mast .tab-arch{flex:1 1 100%}
}
@media (max-width:520px){.mast .tab{flex:1 1 45%}}

/* ---------- nameplate: one line, one rule ---------- */
.mast-id .wordmark a{display:block}
.wm-the{font-family:var(--serif);font-weight:400;font-style:italic;
  font-size:.42em;line-height:1;letter-spacing:-.01em;text-transform:none;
  color:rgba(244,239,225,.72);padding-bottom:0;border-bottom:none;
  margin-right:.12em;vertical-align:baseline}
.wm-name{display:block;border-bottom:2px solid rgba(244,239,225,.6);box-shadow:none;
  padding-bottom:clamp(7px,1vw,18px);white-space:nowrap}
.wm-site{font-style:italic;font-weight:400}
@media (max-width:600px){.wm-name{white-space:normal}}

/* ---------- map: its own ground, numbered pins, legend ---------- */
.band-map{background:var(--ink);color:#E9DFC4;border-block:1px solid var(--ink)}
.band-map .rowline{border-bottom-color:rgba(233,223,196,.3);color:rgba(233,223,196,.72)}
.band-map .field{color:rgba(233,223,196,.72)}
.map-state{fill:#D8CCAE}
.map-pin circle{fill:var(--accent);stroke:var(--paper);stroke-width:2.4}
.pin-no{font:700 9.5px var(--mono);fill:#F4EFE1;letter-spacing:0}
.map-pin:hover circle{fill:var(--second)}
.map-legend{list-style:none;margin:clamp(16px,1.8vw,30px) 0 0;padding:clamp(14px,1.5vw,26px) 0 0;
  border-top:1px solid var(--rule);display:grid;gap:clamp(10px,1.2vw,20px);
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.map-legend a{display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px 12px;
  color:var(--ink);border:none;align-items:start}
.map-legend a:hover .lg-title{color:var(--accent-ink)}
.lg-no{grid-row:span 2;width:26px;height:26px;display:grid;place-items:center;
  background:var(--accent);color:#F4EFE1;font:700 12px var(--mono);border-radius:50%}
.lg-state{font:700 11px/1.5 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-60)}
.lg-title{font-family:var(--serif);font-size:calc(var(--fs-body) - 1px);line-height:1.32}

/* ---------- signature dates carry the band ---------- */
.sig-item{border-top:4px solid var(--ink);padding-top:14px;gap:14px}
.sig-year{font-size:clamp(56px,6.6vw,132px);line-height:.82;letter-spacing:-.04em;
  font-variant-numeric:tabular-nums;color:var(--ink)}
@media (max-width:700px){.sig-year{font-size:60px}}

/* ---------- the stamped Coleman line stays on one line ---------- */
@media (min-width:900px){.quiet-line p{white-space:nowrap}}

/* ---------- nameplate: a label plate, ink on paper, keyed to the six sections ---------- */
.mast-id .wordmark a{display:inline-block}
.wm-plate{display:grid;gap:clamp(3px,.35vw,7px);background:var(--paper);color:var(--ink);
  padding:clamp(10px,1.1vw,20px) clamp(14px,1.5vw,30px) 0;
  border:1px solid var(--ink);box-shadow:6px 6px 0 rgba(27,26,22,.28)}
.wm-plate .wm-the{font-family:var(--mono);font-weight:400;font-style:normal;
  font-size:clamp(10px,.68vw,13px);line-height:1;letter-spacing:.4em;text-transform:uppercase;
  color:var(--ink-40);margin:0;border:none;padding:0}
.wm-plate .wm-name{display:block;font-family:var(--serif);font-weight:700;
  font-size:clamp(30px,4.4vw,86px);line-height:.9;letter-spacing:-.038em;
  border:none;box-shadow:none;padding:0;white-space:nowrap}
.wm-plate .wm-site{font-style:italic;font-weight:400;color:var(--accent-ink)}
.wm-keys{display:grid;grid-template-columns:repeat(6,1fr);height:clamp(5px,.5vw,9px);
  margin-top:clamp(7px,.8vw,14px)}
.wm-keys i{display:block}
.wm-keys i:nth-child(1){background:#8A7614}
.wm-keys i:nth-child(2){background:#0E6B4F}
.wm-keys i:nth-child(3){background:#1F4FA8}
.wm-keys i:nth-child(4){background:#9C2A63}
.wm-keys i:nth-child(5){background:#9A5410}
.wm-keys i:nth-child(6){background:#5B2BC9}
.mast-id .wordmark a:hover .wm-plate{box-shadow:8px 8px 0 rgba(27,26,22,.34)}
@media (max-width:600px){.wm-plate .wm-name{white-space:normal}}

/* ---------- section index: icon-led ---------- */
.sec-grid{list-style:none;margin:0;padding:0;display:grid;gap:clamp(12px,1.3vw,22px);
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.sec-grid a{display:grid;gap:5px;background:var(--paper);border:1px solid var(--ink);
  padding:clamp(16px,1.7vw,30px);color:var(--ink);height:100%;align-content:start}
.sec-grid a:hover{border-color:var(--accent);background:#fff}
.sg-mark{display:block;margin-bottom:clamp(8px,1vw,18px)}
.ico-xl{width:clamp(46px,4.2vw,76px);height:clamp(46px,4.2vw,76px);stroke-width:1.25}
.sg-mark .ico-plant{color:#8A7614}
.sg-mark .ico-money{color:#0E6B4F}
.sg-mark .ico-measure{color:#1F4FA8}
.sg-mark .ico-founders{color:#9C2A63}
.sg-mark .ico-acts{color:#9A5410}
.sg-mark .ico-offices{color:#5B2BC9}
.sg-key{font:700 10.5px/1 var(--mono);letter-spacing:.24em;text-transform:uppercase;color:var(--ink-40)}
.sg-title{font-family:var(--serif);font-weight:600;font-size:calc(var(--fs-body) + 4px);line-height:1.16}
.sg-brief{font-size:calc(var(--fs-body) - 2px);line-height:1.4;color:var(--ink-60)}
.sg-count{margin-top:6px;font:400 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--accent-ink)}

/* ---------- sponsor names stay on one row ---------- */
.sponsor-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (min-width:1200px){a.sponsor{grid-template-columns:max-content minmax(0,1fr)}}
@media (min-width:2000px){a.sponsor{grid-template-columns:max-content minmax(0,1fr)}}

/* ---------- footer ---------- */
.foot{padding-block:clamp(34px,3.8vw,72px) clamp(16px,1.6vw,28px)}
.foot-grid{grid-template-columns:1fr;gap:clamp(26px,3vw,72px)}
@media (min-width:900px){.foot-grid{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}}
.foot-mark{font-size:clamp(28px,2.9vw,58px);letter-spacing:-.03em;
  padding-bottom:clamp(10px,1.1vw,20px);border-bottom:2px solid rgba(233,223,196,.5)}
.foot-line{margin-top:clamp(12px,1.3vw,22px);max-width:56ch;font-size:calc(var(--fs-body) - 1px)}
.foot-meta{display:flex;flex-wrap:wrap;gap:10px 26px;margin:clamp(14px,1.5vw,26px) 0 0;
  font:400 12px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase}
.foot-secs .field{display:block;color:rgba(233,223,196,.6);padding-bottom:10px;
  border-bottom:1px solid rgba(233,223,196,.25)}
.foot-seclist{display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(16px,2vw,40px)}
.foot-seclist a{display:flex;align-items:center;gap:11px;padding:11px 0;
  border-bottom:1px solid rgba(233,223,196,.16);opacity:1;
  font:700 12px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase}
.foot-seclist a:hover{border-bottom-color:rgba(233,223,196,.6)}
.foot-seclist i{width:9px;height:9px;flex:0 0 auto}
.foot-bar{display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;
  margin-top:clamp(26px,3vw,60px);padding-top:12px;border-top:1px solid rgba(233,223,196,.25);
  font:400 11px/1.3 var(--mono);letter-spacing:.18em;text-transform:uppercase;
  color:rgba(233,223,196,.6)}

.map-pin circle{stroke-width:3}
.pin-no{font:700 18px var(--mono);fill:#F4EFE1;letter-spacing:0}

/* the map plate is paper — its type must stay ink even on the ink band */
.band-map .map-figure,.band-map .map-figure figcaption,.band-map .map-figure .c-text{color:var(--ink)}
.band-map .map-figure .c-credit{color:var(--ink-40)}

.map-pin text.pin-no{font:700 26px var(--mono);fill:#F4EFE1;letter-spacing:0;text-transform:none}

/* ---------- band headers carry weight ---------- */
.rowline{border-bottom-width:2px;border-bottom-color:var(--ink);padding-bottom:14px}
.rowline > .field:first-child,.rowline > span:first-child{
  font-family:var(--mono);font-weight:700;
  font-size:clamp(14px,1.05vw,20px);line-height:1.25;letter-spacing:.13em;
  text-transform:uppercase;color:var(--ink)}
.rowline > .field:last-child:not(:first-child),.rowline > span:last-child:not(:first-child){
  font-size:clamp(11px,.72vw,13px);color:var(--ink-60)}
.rowline .ico{width:26px;height:26px;position:relative;top:5px}
.band-map .rowline{border-bottom-color:rgba(233,223,196,.7)}
.band-map .rowline > .field:first-child{color:#F4EFE1}
.band-map .rowline > .field:last-child:not(:first-child){color:rgba(233,223,196,.72)}
.band-green .rowline > .field:first-child{color:#F1EBD8}
.foot .rowline > span:first-child,.supporters .rowline > span:first-child{color:#E9DFC4}

/* ---------- Exhibit C: the Coleman survey, as figures ---------- */
.band-fact{background:var(--paper);border-block:1px solid var(--ink)}
.fact-grid{display:grid;gap:clamp(20px,2.4vw,56px);grid-template-columns:1fr;align-items:start}
@media (min-width:820px){.fact-grid{grid-template-columns:auto minmax(0,1fr)}}
.fact-stamp{transform:rotate(-9deg)}
.fact-stamp svg{width:clamp(92px,8.5vw,150px);height:auto}
.fact-lead{font-family:var(--serif);font-weight:600;
  font-size:clamp(21px,2.1vw,40px);line-height:1.14;letter-spacing:-.018em;
  margin:0 0 clamp(20px,2.2vw,40px);max-width:44ch;text-wrap:pretty}
.fact-lead a{color:inherit;border-bottom:2px solid var(--accent)}
.fact-lead a:hover{color:var(--accent-ink)}
.fact-stats{margin-bottom:clamp(18px,2vw,34px)}
.fact-note{margin:0;max-width:64ch;font-size:calc(var(--fs-body) - 1px);color:var(--ink-60);
  border-top:1px solid var(--rule);padding-top:14px}

/* ---------- article header uses the full measure ---------- */
.art-head{padding-top:clamp(22px,2.6vw,52px);padding-bottom:clamp(22px,2.4vw,44px)}
.art-head h1{max-width:none;font-size:clamp(32px,5.2vw,104px);line-height:.94;letter-spacing:-.032em}
.art-standfirst{font-family:var(--serif);font-weight:400;
  font-size:clamp(19px,1.55vw,30px);line-height:1.34;text-wrap:pretty;
  margin:clamp(18px,2vw,38px) 0 0;padding-top:clamp(14px,1.5vw,26px);
  border-top:2px solid var(--ink);max-width:none}
@media (min-width:1200px){.art-standfirst{columns:2;column-gap:clamp(32px,3.4vw,72px)}}
.art-body > h2:first-child{margin-top:0}
/* closing reference blocks read as a set, not a repeat */
.notes-block + .breakout,.breakout + .breakout{margin-top:clamp(-6px,-.4vw,0px)}

/* ---------- hero caption plate: room to breathe, and clear of the prose ---------- */
.fig-bleed{margin-bottom:clamp(30px,3.4vw,68px)}
.fig-bleed .capbox{margin-top:min(-6vw,-52px)}
.fig-bleed .capbox > div{padding:clamp(18px,1.9vw,36px) clamp(20px,2.1vw,42px);max-width:78ch}
.fig-bleed figcaption{padding-top:0}
.fig-bleed .cap .c-text{font-size:calc(var(--fs-body) + 2px);line-height:1.42}
@media (max-width:700px){.fig-bleed .capbox{margin-top:-28px}}

/* ---------- article title: a step down ---------- */
.art-head h1{font-size:clamp(30px,3.9vw,74px)}

/* ---------- figure credit reads as a reference, not fine print ---------- */
.cap{gap:10px 32px;align-items:baseline}
.cap .c-credit{font-family:var(--sans);font-size:calc(var(--fs-body) - 3px);line-height:1.4;
  letter-spacing:0;text-transform:none;color:var(--ink-60);max-width:42ch;text-align:left}
.cap .c-credit a{font-weight:500;color:var(--accent-ink);border-bottom:1px solid rgba(71,24,159,.3)}
.cap .c-credit a:hover{color:var(--ink);border-bottom-color:var(--ink)}
@media (min-width:900px){.cap .c-credit{text-align:right;margin-left:auto}}

/* ---------- timeline: the date carries the row ---------- */
.t-when{font-size:clamp(13px,1vw,17px);letter-spacing:.08em;color:var(--accent-ink)}
.timeline li{padding:15px 0}
.t-what{font-size:calc(var(--fs-body) + 2px)}

/* ---------- pullquote uses its full breakout width ---------- */
.pullquote p{max-width:none;font-size:clamp(22px,2.4vw,46px);line-height:1.14;letter-spacing:-.02em}
.pullquote{padding:clamp(24px,2.8vw,54px) clamp(24px,3vw,64px)}

/* ---------- related pages: clear of the footer, room per card ---------- */
main > .breakout:last-child{margin-bottom:clamp(40px,4.4vw,96px)}
.further-grid{gap:clamp(18px,2vw,40px)}
.further-grid a{padding:14px 0 18px}
.further-grid strong{font-size:calc(var(--fs-body) + 4px);line-height:1.2}

.mast .tabs{align-items:stretch}
.mast .tab{align-items:center}

/* ---------- one colour per section, wherever the mark appears ---------- */
.ico-plant{color:#8A7614}
.ico-money{color:#0E6B4F}
.ico-measure{color:#1F4FA8}
.ico-founders{color:#9C2A63}
.ico-acts{color:#9A5410}
.ico-offices{color:#5B2BC9}
.art-kicker{color:var(--ink-60)}
.art-kicker a{color:var(--ink)}
.art-kicker a:hover{color:var(--accent-ink)}
.lead-kicker{color:var(--ink-60)}
.band-green .ico-plant,.band-green .ico-money,.band-green .ico-measure,
.band-green .ico-founders,.band-green .ico-acts,.band-green .ico-offices{color:#F1EBD8}
.band-map .ico-plant,.band-map .ico-money,.band-map .ico-measure,
.band-map .ico-founders,.band-map .ico-acts,.band-map .ico-offices{color:#F4EFE1}
.band-green .aside-note .ico-offices{color:#5B2BC9}

/* ---------- the article IS the sheet: paper ground, softer ink ---------- */
main.article{background:var(--paper);padding-bottom:clamp(30px,3.4vw,64px)}
main.article .art-body{color:#2C2A24}
main.article .art-standfirst{color:#26241E}
/* blocks that were paper-on-kraft now need a tint to separate from the sheet */
main.article .notes-block{background:var(--paper-2);border-color:var(--rule)}
main.article .fig-plate{background:var(--paper-2);border-color:var(--rule)}
main.article .pullquote{border-color:var(--ink)}
main.article .fig-bleed .capbox > div{background:var(--paper);border-color:var(--ink)}
main.article .further-grid a{border-top-color:var(--ink)}

main.article .fig-bleed .capbox > div{background:var(--paper-2);border:1px solid var(--ink);
  box-shadow:6px 6px 0 rgba(27,26,22,.14)}

/* replaced content paints after static block backgrounds — the overlapping plate needs its own context */
.fig-bleed .capbox{position:relative;z-index:1}
.lead-card{position:relative;z-index:1}

/* ============================================================
   MOBILE PASS — one place, overriding the scattered rules above
   ============================================================ */
@media (max-width:860px){
  :root{--gut:18px;--band:36px}
  body{border-inline:none}

  /* ---- masthead: nameplate compact, stamp hidden, tabs a visible 2-up grid ---- */
  .mast-top{font-size:10px;letter-spacing:.14em}
  .mast-id{padding-block:16px 14px;grid-template-columns:minmax(0,1fr)}
  .wm-plate{padding:10px 14px 0;box-shadow:4px 4px 0 rgba(27,26,22,.28)}
  .wm-plate .wm-name{font-size:clamp(26px,8.4vw,42px);white-space:normal;line-height:.94}
  .wm-plate .wm-the{font-size:10px;letter-spacing:.34em}
  .wm-keys{height:5px;margin-top:8px}

  .mast .tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;flex-wrap:unset;
    font-size:12px;letter-spacing:.1em;padding-bottom:0}
  .mast .tab,.mast .tab-w2,.mast .tab-w3{flex:none;min-height:48px;
    padding:10px 12px;justify-content:flex-start;gap:10px;border-radius:2px 2px 0 0}
  .mast .tab .ico{width:20px;height:20px}
  .mast .tab-arch{grid-column:1 / -1;justify-content:center;min-height:44px;padding-inline:12px}

  /* ---- article intersections ---- */
  main.article{padding-bottom:32px}
  .art-head{padding-top:20px;padding-bottom:20px}
  .art-head h1{font-size:clamp(27px,7.6vw,40px);line-height:1.0}
  .art-standfirst{font-size:17px;line-height:1.4;margin-top:16px;padding-top:14px;columns:auto}
  .art-kicker{margin-bottom:12px}
  .art-kicker .ico-lg{width:26px;height:26px}

  .fig-bleed{margin-bottom:26px}
  .fig-bleed img{height:42vh;min-height:220px}
  .fig-bleed .capbox{margin-top:-22px}
  .fig-bleed .capbox > div{padding:15px 16px;max-width:none;box-shadow:4px 4px 0 rgba(27,26,22,.14)}
  .fig-bleed .cap .c-text{font-size:16px;line-height:1.4}

  .breakout{margin-block:26px}
  .notes-block{padding:16px 15px}
  .notes-block > .rowline{margin-bottom:14px}
  .fig-plate{padding:9px}
  .fig-inset{border-left-width:4px;padding-left:12px;margin-block:24px}
  .pullquote{padding:20px 18px}
  .pullquote p{font-size:20px;line-height:1.2}
  .callout{padding:16px 15px}
  .callout p{font-size:17px}
  .blockquote{border-left-width:4px;padding-left:14px}

  .rowline{gap:6px 14px;padding-bottom:10px}
  .rowline > .field:first-child,.rowline > span:first-child{font-size:12.5px;letter-spacing:.1em}
  .rowline > .field:last-child:not(:first-child),.rowline > span:last-child:not(:first-child){font-size:10.5px}
  .rowline .ico{width:18px;height:18px;top:3px}

  .timeline li{grid-template-columns:1fr;gap:3px;padding:12px 0}
  .t-when{font-size:12.5px}
  .t-what{font-size:16.5px}
  .cap{gap:6px}
  .cap .c-credit{text-align:left;margin-left:0;max-width:none;font-size:13px}

  /* ---- map: pins and numbers sized for a small screen, legend stacked ---- */
  .map-figure{padding:12px 10px}
  .map-pin circle{r:30px;stroke-width:5}
  .map-pin text.pin-no{font-size:40px}
  .map-legend{grid-template-columns:1fr;gap:12px;padding-top:14px}
  .map-legend a{grid-template-columns:34px minmax(0,1fr);gap:2px 12px}
  .lg-no{width:32px;height:32px;font-size:14px}
  .lg-state{font-size:11px}
  .lg-title{font-size:15.5px}

  /* ---- homepage bands ---- */
  .lead-band img{height:46vh;min-height:240px}
  .lead-card{margin-top:-40px}
  .lead-card .inner{padding:18px 16px 20px;max-width:none}
  .lead-card h2{font-size:clamp(24px,7vw,36px)}
  .sig-grid{gap:22px}
  .sig-year{font-size:54px}
  .sig-item{border-top-width:3px;padding-top:12px}
  .sig-item h3{font-size:19px}
  .fact-grid{gap:18px}
  .fact-stamp svg{width:80px}
  .fact-lead{font-size:21px;line-height:1.2;margin-bottom:20px}
  .statrow{grid-template-columns:1fr 1fr;gap:14px}
  .stat-num{font-size:30px}
  .stat-label{font-size:13px}
  .sec-grid{grid-template-columns:1fr;gap:10px}
  .sec-grid a{padding:16px;grid-template-columns:auto minmax(0,1fr);
    grid-template-areas:"mark key" "mark title" "mark brief" "mark count";column-gap:16px}
  .sg-mark{grid-area:mark;margin-bottom:0}
  .ico-xl{width:40px;height:40px}
  .sg-key{grid-area:key}.sg-title{grid-area:title;font-size:18px}
  .sg-brief{grid-area:brief}.sg-count{grid-area:count}
  .split{gap:22px}
  .aside-note{padding:16px 15px}

  /* ---- lists, cards, sponsors, footer ---- */
  .cardgrid{grid-template-columns:1fr;gap:12px}
  .card{padding:16px}
  .card h3{min-height:0;font-size:19px}
  .cat-list a{padding:13px 0}
  .cl-title{font-size:17.5px}
  .further-grid{grid-template-columns:1fr;gap:0}
  .further-grid a{padding:13px 0}
  .further-grid strong{font-size:17.5px}
  a.sponsor{grid-template-columns:1fr;padding:12px 0}
  .sponsor-name{white-space:normal;font-size:17px}
  .sponsor-blurb{margin-top:3px;font-size:14px}
  .foot{padding-block:30px 16px}
  .foot-mark{font-size:28px}
  .foot-seclist{grid-template-columns:1fr}
  .foot-seclist a{padding:13px 0;font-size:12.5px}
  .foot-bar{margin-top:24px;font-size:10.5px}
  .cat-head{gap:16px}
}
@media (max-width:420px){
  :root{--gut:14px}
  .mast .tabs{font-size:11px;letter-spacing:.08em}
  .mast .tab,.mast .tab-w2,.mast .tab-w3{padding:9px 10px;gap:8px}
  .statrow{grid-template-columns:1fr}
  .map-pin circle{r:38px}
  .map-pin text.pin-no{font-size:50px}
}

.map-pin text.pin-no{dominant-baseline:central;alignment-baseline:central}

/* display-size links: baseline-relative underline, never a border on a multi-line inline */
.fact-lead a{border-bottom:none;text-decoration:underline;text-decoration-color:var(--accent);
  text-decoration-thickness:2px;text-underline-offset:.14em;text-decoration-skip-ink:auto}
.fact-lead a:hover{text-decoration-color:var(--ink)}
/* four-up sets stay even rather than ragging 3 + 1 */
@media (min-width:760px){
  .fact-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .map-legend{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:1200px){
  .fact-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
  .map-legend{grid-template-columns:repeat(4,minmax(0,1fr))}
}

/* sp-roll-normalize: a logo roll keeps object-fit and loses its geometry.
   It used to set width:auto, height:46px, max-width:172px and min-width:30px, which let
   every plate in the roll shrink-wrap its own artwork — evbb measured 62px next to 204px
   in the SAME ROW. The operator's rule is that the dark ground is unified whatever the
   logo's size, so the plate cannot be sized by the logo. Geometry belongs to Design. */
[class~="roll"] .sponsor img,[class*="roll-"] .sponsor img,[class*="-roll"] .sponsor img{object-fit:contain}

/* sp-contain-guard: sponsor logos are wordmarks — never object-fit:cover (crops).
   object-fit ONLY. This block used to also set width:auto, padding:4px 10px,
   max-width:calc(100% - 20px) and min/max-height, which overrode Design's own frame and
   let every plate shrink-wrap its logo — the recurring "inconsistent sizing" and
   "lacks padding". Geometry belongs to Design. */
.sponsor img,.sponsor-box img,.sp-logo img{object-fit:contain!important;display:block;margin-left:auto;margin-right:auto;align-self:center}

/* 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-txt > .sponsor{flex:0 0 auto!important}
.sponsor:not(.lead-line){grid-column:span 1!important;grid-row:span 1!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}
: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}

/* 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__pin{cursor:pointer}
.mapkit__pin text{paint-order:stroke;stroke:#f4f2ed;stroke-width:3px;stroke-linejoin:round}
.mapkit__pin:hover circle{r:9.1}
.mapkit__pin:hover text{font-weight:700}
/* MAPKIT_END */

/* op-nav-collapse: this nav printed 200px of stacked links at 390 before any content
   (7 links), and the build shipped no control to close it. A disclosure cannot be
   built from CSS alone — :hover and :focus-within are unreachable on touch until a link has
   already been tapped — so a hidden checkbox and its label were injected immediately before
   the nav, and the nav collapses against the checked state. Exactly the mechanism the builds
   that DO have a burger already use.
   Treatment "inset-box", bold, seeded from the domain so 175 builds do not all ship the
   same hairline box in the same place; it inherits this build's font and colour, and where the
   nav's own parent has no inline padding (0px measured) the button carries the build's
   gutter (clamp(16px,4vw,40px)) so it cannot sit against the glass. The links are hidden,
   not removed: they stay in the markup. Desktop is untouched — every rule below is inside the
   phone breakpoint (860px here), where the button appears and the nav starts closed.
   Folded with the "height-clip" technique and marked with the "dots" icon — the mechanism
   is deliberately not identical across the fleet either. */
.nav-disclose{display:none}
@media (max-width:860px){
  .nav-disclose{align-items:center;justify-content:center;gap:9px;font:inherit;font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:inherit;cursor:pointer;min-height:44px;box-sizing:border-box;display:flex;width:fit-content;border:1px solid currentColor;border-radius:2px;padding:10px 15px;margin-inline:clamp(16px,4vw,40px);margin-block:clamp(16px,4.5vw,26px) clamp(12px,3vw,18px)}

  .nav-disclose-bars{width:13px;height:3px;flex:none;border-radius:99px;background:currentColor;box-shadow:5px 0 0 -0.5px currentColor,-5px 0 0 -0.5px currentColor}
  .wrap.tabs{height:0;overflow:hidden;visibility:hidden;padding-block:0;margin-block:0;border-top-width:0;border-bottom-width:0}
  .nav-disclose-c:checked ~ .wrap.tabs{height:auto;overflow:visible;visibility:visible;padding-block:revert;margin-block:revert;border-top-width:revert;border-bottom-width:revert}
  .mast:has(> .nav-disclose){display:flow-root}
  .nav-disclose:not(:has(~ .wrap.tabs)){display:none}
}

/* op-footer-compact: the footer printed 6 rows for 6 link(s) in
   1 list(s) — 540px at 390, 8% 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, and the group holder takes two columns,
   measured 540 -> 378px (30% 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:min(0.21vw,3px)!important;row-gap:6px!important}
  footer ul > li,footer ol > li{width:auto!important;flex:0 0 auto;max-width:100%}
  footer [class*=grid],footer [class*=index],footer [class*=cols]{grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:20px}
}
/* op-heading-levels */
h2:where(.rt-h3){font-family: var(--serif); font-weight: 600; letter-spacing: -0.015em; line-height: 1.06; margin: 0px;}
.split h2:where(.rt-h3){font-size: clamp(24px, 2.1vw, 44px); line-height: 1.04; margin-bottom: 0.5em;}
.split h2:where(.rt-h3) a{color: inherit; border-width: medium; border-style: none; border-color: currentcolor; border-image: none;}
.split h2:where(.rt-h3) a:hover{color: var(--accent-ink);}
.card h2:where(.rt-h3){font-size: clamp(18px, 1.25vw, 26px); line-height: 1.2; min-height: 2.4em; margin-bottom: 0.55em;}
@media (max-width: 860px){.card h2:where(.rt-h3){min-height: 0px; font-size: 19px;}}
/* op-heading-levels:end */

/* op-img-dims — intrinsic width/height reserve image space; the proven height:auto guard (zero specificity) */
:where(div > figure.fig-plate > img,
  div.art-body.prose > figure.fig-inset > img,
  div.breakout > figure.fig-plate > img,
  div.cardgrid > a.card > img,
  div.split > figure.fig-plate > img,
  main > section.lead-band > img,
  main.article > figure.fig-bleed > img){height:auto}
/* op-img-dims:end */
