/* CreaFigs — Atelier Wall
   Palette: ground (warm flax) · ink · oxblood (dark ground / secondary) · amber (accent) · flesh-rose (quiet accent)
   Type: Big Shoulders Display (display, small caps labels) · Spectral (reading) · ui-monospace (credits) */

:root{
  --ground:#F3EDE1;      /* page ground */
  --ink:#14100E;         /* text */
  --oxblood:#58181C;     /* saturated dark ground — bands, panels, mats */
  --accent:#E5A916;      /* saturated accent — rules, numerals, marks */
  --rose:#D9A29C;        /* quiet secondary on dark ground */
  --ground-2:#E7DECD;    /* tint of ground for panels */
  --hair:#CFC3AE;
  --quiet:#6E6152;

  --prose:72ch;
  --wide:1160px;
  --shell:1240px;

  --body:17px;
  --disp:'Big Shoulders Display', 'Arial Narrow', 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(--ground);color:var(--ink);
  font-family:var(--serif);font-size:var(--body);line-height:1.66;
  font-variant-ligatures:common-ligatures;text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block}
a{color:#8E2C1C;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--oxblood);background:rgba(229,169,22,.28)}
h1,h2,h3,h4{font-family:var(--disp);font-weight:600;line-height:.98;margin:0;text-transform:uppercase;letter-spacing:.005em}
p{margin:0 0 1.15em;text-wrap:pretty}
figure{margin:0}
hr{border:0;border-top:1px solid var(--hair);margin:2.4rem 0}

/* ————— shell / widths ————— */
.shell{width:100%;max-width:var(--shell);margin:0 auto;padding-inline:20px}
.wide{width:100%;max-width:var(--wide);margin-inline:auto;padding-inline:20px}
.prose{max-width:var(--prose);padding-inline:20px}
.bleed{width:100%}
.kicker{font-family:var(--disp);font-size:13px;letter-spacing:.26em;text-transform:uppercase;color:var(--quiet)}
.on-dark .kicker{color:var(--rose)}
.credit{font-family:var(--mono);font-size:12px;letter-spacing:.02em;color:var(--quiet)}
.on-dark{background:var(--oxblood);color:var(--ground)}
.on-dark a{color:var(--accent)}
.on-dark a:hover{color:#fff;background:rgba(229,169,22,.2)}

/* ————— the drawn mark: a vertical palette-knife stroke, three sizes only ————— */
.knife{display:block;color:var(--accent);flex:none}
.knife--sm{width:14px;height:44px}
.knife--md{width:26px;height:104px}
.knife--lg{width:46px;height:200px}
.ico{width:1.05em;height:1.05em;flex:none;display:inline-block;vertical-align:-.14em}
h1 .knife,h2 .knife,h3 .knife,.kicker .knife,p .knife{width:.42em;height:1.5em;display:inline-block;vertical-align:-.4em;margin-right:.4em}
.divider{display:flex;align-items:center;gap:18px;padding:0;margin:0}
.divider::before,.divider::after{content:"";flex:1 1 auto;border-top:1px solid var(--hair)}
.on-dark .divider::before,.on-dark .divider::after{border-color:rgba(243,237,225,.3)}

/* ————— masthead: the picked page's header, oxblood ground and a wordmark that holds the top ————— */
.masthead{background:var(--oxblood);color:var(--ground)}
.masthead__eyebrow{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;max-width:1760px;margin:0 auto;padding:13px 20px 0;font-family:var(--disp);font-size:clamp(10px,.7vw,13px);letter-spacing:.3em;text-transform:uppercase;color:var(--rose)}
.masthead__top{display:flex;align-items:flex-start;gap:clamp(6px,1vw,20px);padding:2px 20px 0;max-width:1760px;margin:0 auto}
.wordmark{display:flex;align-items:flex-start;gap:clamp(6px,.8vw,18px);text-decoration:none;color:inherit}
.wordmark:hover{background:none}
.wordmark__name{font-family:var(--disp);font-weight:800;font-size:clamp(58px,13.4vw,300px);line-height:.76;letter-spacing:-.012em;text-transform:uppercase;color:var(--ground)}
.masthead .knife--md{margin-top:clamp(6px,1.4vw,34px)}
.nav{border-top:2px solid var(--accent);border-bottom:1px solid rgba(243,237,225,.28);background:#3F1013}
.nav__inner{display:flex;flex-wrap:wrap;gap:clamp(16px,2.6vw,52px);align-items:baseline;padding:15px 20px;max-width:1760px;margin:0 auto}
.nav a{font-family:var(--disp);font-weight:800;font-size:clamp(16px,1.3vw,26px);letter-spacing:.2em;text-transform:uppercase;text-decoration:none;color:var(--ground);padding-bottom:4px;border-bottom:3px solid transparent}
.nav a:hover{background:none;border-bottom-color:var(--accent);color:var(--accent)}
.nav a[aria-current="page"]{color:var(--accent);border-bottom-color:var(--accent)}
.nav__end{margin-left:auto;display:flex;gap:clamp(12px,1.4vw,26px);font-size:clamp(11px,.72vw,14px);letter-spacing:.2em}
.nav__end a{color:var(--rose)}
.nav-toggle,.nav-toggle-label{display:none}

@media (max-width:760px){
  .nav-toggle-label{display:flex;align-items:center;gap:10px;font-family:var(--disp);font-size:15px;letter-spacing:.2em;text-transform:uppercase;padding:10px 20px;cursor:pointer;border-top:2px solid var(--accent);color:var(--ground)}
  .nav-toggle-label span{width:22px;height:2px;background:var(--accent);box-shadow:0 6px 0 var(--accent),0 -6px 0 var(--accent)}
  .nav{border-top:0}
  .nav__inner{display:none;flex-direction:column;gap:0;padding-bottom:12px}
  .nav-toggle:checked ~ .nav .nav__inner{display:flex}
  .nav a{display:flex;align-items:center;min-height:48px;padding:0;border-bottom:1px solid rgba(243,237,225,.2)}
  .nav a:hover,.nav a[aria-current="page"]{border-bottom-color:var(--accent)}
  .nav__end{margin-left:0;flex-direction:column;gap:0;width:100%}
  .nav__end a{min-height:48px}
}

/* ————— homepage: the type opener, as picked ————— */
.opener{background:var(--oxblood);color:var(--ground);padding:clamp(24px,3.2vw,80px) 0 clamp(22px,2.6vw,64px)}
.opener__grid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(14px,2vw,56px);align-items:start;max-width:1760px;margin:0 auto;padding-inline:20px}
.opener h1{font-family:var(--disp);font-weight:400;font-size:clamp(38px,6.4vw,164px);line-height:.94;letter-spacing:-.008em;max-width:20ch;text-wrap:balance;text-transform:none}
.opener__year{font-family:var(--disp);font-weight:800;font-size:clamp(54px,8.6vw,232px);line-height:.76;color:var(--accent);writing-mode:vertical-rl;text-orientation:mixed}
.opener__foot{display:flex;flex-wrap:wrap;gap:clamp(18px,2.6vw,72px);align-items:flex-start;max-width:1760px;margin:clamp(20px,2.4vw,56px) auto 0;padding-inline:20px}
.opener__foot p{flex:1 1 min(58ch,100%);max-width:min(78ch,100%);color:#F0E4D6;margin:0}
.specstack{flex:0 1 min(34ch,100%);display:flex;flex-direction:column;gap:8px;font-family:var(--disp);letter-spacing:.08em;text-transform:uppercase}
.specstack div{display:flex;justify-content:space-between;gap:16px;border-bottom:1px solid rgba(243,237,225,.26);padding-bottom:6px;font-size:clamp(13px,.92vw,19px)}
.specstack span{color:var(--accent);font-variant-numeric:tabular-nums}

/* the plate: one picture, hung */
.plate-band{background:var(--ground);padding:clamp(26px,3.2vw,84px) 0}
.plate-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:12px 30px;max-width:1760px;margin:0 auto clamp(16px,1.8vw,40px);padding-inline:20px}
.plate-head h2{font-size:clamp(26px,3.2vw,80px);font-weight:600;max-width:26ch}
.plate{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(16px,2vw,52px);align-items:start;max-width:1760px;margin:0 auto;padding-inline:20px}
@media (min-width:900px){.plate{grid-template-columns:minmax(0,1fr) minmax(min(100%,26ch),.34fr)}}
@media (min-width:1920px){.plate{grid-template-columns:minmax(0,1.5fr) minmax(min(100%,28ch),.5fr)}}
.plate__frame{border:clamp(9px,1.1vw,26px) solid var(--ink);background:var(--ground-2)}
.plate__frame img{width:100%;aspect-ratio:191/130;object-fit:cover}
.plate__no{font-family:var(--disp);font-weight:800;font-size:clamp(44px,4vw,104px);line-height:.78;color:var(--oxblood)}
.plate figcaption{display:flex;flex-direction:column;gap:12px}
.plate figcaption p{margin:0}
.plate__pull{font-style:italic;font-size:clamp(18px,1.3vw,26px);line-height:1.3;color:var(--oxblood);border-top:4px solid var(--accent);padding-top:12px}

/* the three dates, as picked */
.numrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:clamp(20px,2.6vw,66px);max-width:1760px;margin:0 auto;padding-inline:20px}
.numcol{display:flex;flex-direction:column}
.numcol p.numcol__year{font-family:var(--disp);font-weight:800;font-size:clamp(52px,5.4vw,150px);line-height:.78;color:var(--accent);font-variant-numeric:tabular-nums lining-nums;letter-spacing:.01em;font-feature-settings:"tnum" 1;border-bottom:3px solid var(--accent);padding-bottom:clamp(8px,.8vw,16px);margin-bottom:clamp(12px,1.2vw,24px)}
.numcol h3{font-size:clamp(19px,1.6vw,34px);font-weight:400;line-height:1.08;margin:0 0 clamp(12px,1.1vw,20px);padding-right:clamp(8px,1.2vw,28px);max-width:24ch}
.numcol>p:not(.numcol__year){font-size:.98em;max-width:44ch;color:#F0E4D6;margin:0}

/* ————— band rhythm ————— */
.band{padding:clamp(34px,4vw,96px) 0}
.band--tight{padding:clamp(20px,2vw,44px) 0}
.band-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:10px 32px;margin-bottom:clamp(18px,2vw,40px);border-bottom:1px solid var(--hair);padding-bottom:clamp(10px,1vw,20px)}
.on-dark .band-head,.supporters .band-head{border-bottom-color:rgba(243,237,225,.28)}
.band-head h2{font-size:clamp(24px,2.4vw,46px);font-weight:600;line-height:1.02;letter-spacing:.012em;max-width:34ch;flex:1 1 auto}
.band-head .kicker{margin-left:0;flex:0 0 auto;white-space:nowrap}
@media (max-width:900px){.band-head .kicker{white-space:normal;flex:1 1 100%}}

/* flagship row */
.flagship{display:grid;grid-template-columns:1fr;gap:clamp(18px,2vw,44px);align-items:start}
.flagship h2{font-size:clamp(30px,4.4vw,80px);font-weight:400;letter-spacing:-.01em}
.flagship .dek{font-size:1.12em;color:#3B322A;max-width:56ch}
.flagship__pull{border-left:4px solid var(--accent);padding-left:18px;font-style:italic;font-size:1.24em;line-height:1.35;max-width:40ch;color:var(--oxblood)}
@media (min-width:900px){.flagship{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}}
@media (min-width:1920px){.flagship{grid-template-columns:minmax(0,.98fr) minmax(0,1.5fr)}}

/* asymmetric feature cards — deliberately unequal */
.features{display:grid;gap:clamp(16px,1.8vw,38px);grid-template-columns:1fr;align-items:start}
@media (min-width:820px){.features{grid-template-columns:1.55fr 1fr 1fr}}
@media (min-width:1440px){.features{grid-template-columns:1.5fr 1fr 1fr .85fr}}
.feature{display:flex;flex-direction:column;background:var(--ground-2);border-top:3px solid var(--ink);padding:0 0 clamp(10px,.9vw,16px)}
.feature__no{font-family:var(--disp);font-weight:800;font-size:clamp(26px,1.9vw,44px);line-height:.8;color:var(--oxblood);padding:9px 14px 0}
.feature img{width:100%;aspect-ratio:4/3;object-fit:cover}
.feature__body{padding:8px 14px 0;display:flex;flex-direction:column;flex:1 1 auto;gap:clamp(8px,.7vw,14px)}
.feature h3{font-family:var(--serif);font-size:clamp(18px,1.18vw,24px);font-weight:600;line-height:1.2;letter-spacing:0;text-transform:none}
.feature h3 a{text-decoration:none;color:inherit}
.feature h3 a:hover{background:none;color:var(--oxblood);text-decoration:underline;text-decoration-color:var(--accent)}
.feature p{font-size:.94em;margin:0;color:#3B322A}
.feature .sect-tag{margin-top:clamp(4px,.4vw,10px)}
.feature:has(img) .sect-tag{margin-top:auto}
.feature--x{display:none}
@media (min-width:1440px){.feature--x{display:flex}}
.sect-tag{display:inline-flex;align-items:center;gap:8px;font-family:var(--disp);font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--quiet);text-decoration:none}
.sect-tag svg{width:20px;height:20px;flex:none}
.sect-tag:hover{background:none;color:var(--oxblood)}

/* academies band — wide dark panel */
.inst{display:grid;grid-template-columns:1fr;gap:clamp(16px,2vw,40px);align-items:end}
@media (min-width:900px){.inst{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.inst__name{font-family:var(--disp);font-weight:800;font-size:clamp(40px,7vw,150px);line-height:.82;text-transform:uppercase;color:var(--ground)}
.inst__gloss{font-size:1.05em;max-width:46ch;color:#F0E4D6}
.inst__list{display:flex;flex-direction:column;gap:0;list-style:none;margin:clamp(16px,1.6vw,32px) 0 0;padding:0;counter-reset:inst}
.inst__list li{counter-increment:inst;border-top:1px solid rgba(243,237,225,.28)}
.inst__list li:last-child{border-bottom:1px solid rgba(243,237,225,.28)}
.inst__list a{display:flex;align-items:baseline;gap:clamp(10px,1vw,20px);padding:10px 0;font-family:var(--serif);font-size:clamp(16px,1.02vw,21px);letter-spacing:0;text-transform:none;text-decoration:none;line-height:1.3}
.inst__list a::before{content:counter(inst,decimal-leading-zero);font-family:var(--disp);font-weight:800;font-size:.9em;letter-spacing:.06em;color:var(--accent);flex:none;min-width:2.2em}
.inst__list a:hover{background:rgba(229,169,22,.14);text-decoration:underline;text-decoration-color:var(--accent)}

/* materials strip — framed plates, alternating heights, caption as a plate label */
.strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:clamp(16px,1.8vw,40px);align-items:start}
.strip figure{display:flex;flex-direction:column;gap:0;background:var(--ground-2)}
.strip figure:nth-child(even){margin-top:clamp(14px,2.2vw,52px)}
.strip img{width:100%;aspect-ratio:4/5;object-fit:cover;border:clamp(6px,.6vw,13px) solid var(--ink);border-bottom-width:0}
.strip figure:nth-child(even) img{aspect-ratio:1}
.strip figcaption{display:flex;flex-direction:column;gap:6px;border:clamp(6px,.6vw,13px) solid var(--ink);border-top:0;padding:clamp(10px,.9vw,18px) clamp(11px,1vw,20px) clamp(12px,1.1vw,22px)}
.strip figcaption a{font-family:var(--disp);font-style:normal;font-weight:600;font-size:clamp(17px,1.24vw,26px);line-height:1.06;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;color:var(--ink);border-bottom:0}
.strip figcaption a:hover{background:none;color:var(--oxblood);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px}
.strip .credit{font-style:normal;display:block;margin:0;padding-top:2px;border-top:2px solid var(--accent);padding-top:8px}
.strip .credit{font-style:normal;display:block;margin-top:4px}

/* a single quiet line */
.coda{background:var(--oxblood);color:var(--ground);border-top:1px solid rgba(243,237,225,.28);padding:clamp(34px,4.4vw,116px) 0}
.coda__inner{display:flex;flex-direction:column;gap:clamp(20px,2.4vw,54px)}
.coda__line{font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(24px,3.4vw,76px);line-height:1.14;letter-spacing:-.005em;max-width:min(30ch,100%);margin:0;text-wrap:pretty}
.coda__foot{display:flex;align-items:center;gap:clamp(14px,1.4vw,30px);border-top:3px solid var(--accent);padding-top:clamp(12px,1.2vw,26px);max-width:min(30ch,100%)}
.coda__foot .knife{color:var(--accent)}
.coda__cta{font-family:var(--disp);font-weight:800;font-size:clamp(17px,1.5vw,32px);letter-spacing:.2em;text-transform:uppercase;text-decoration:none;color:var(--accent)}
.coda__cta::after{content:" \2192"}
.coda__cta:hover{background:none;color:var(--ground)}
.quiet-line{font-family:var(--serif);font-style:italic;font-size:clamp(20px,2.1vw,42px);line-height:1.24;max-width:38ch;margin:0}

/* ————— supporters ————— */
.supporters{padding:clamp(26px,3vw,64px) 0;background:var(--ground-2);color:var(--ink);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.supporters .band-head h2{color:var(--ink)}
.supporters .kicker{color:var(--quiet)}
.supporters .band-head{border-bottom-color:var(--hair)}
.sponsor-tiers{display:flex;flex-direction:column;gap:clamp(12px,1.2vw,26px)}
.sponsor-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(10px,1vw,20px)}
.sponsor-row:last-child{grid-template-columns:repeat(5,minmax(0,1fr))}
@media (max-width:900px){.sponsor-row,.sponsor-row:last-child{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.sponsor-row,.sponsor-row:last-child{grid-template-columns:minmax(0,1fr)}}
.sponsor{width:auto;display:flex;flex-direction:column;gap:10px;text-decoration:none;color:var(--ink);background:var(--ground);border:1px solid var(--hair);padding:clamp(10px,.9vw,18px)}
.sponsor:hover{background:var(--ground);border-color:var(--oxblood)}
.sponsor img{width:100%;height:clamp(44px,3.6vw,64px);object-fit:contain;background:var(--oxblood);padding:8px 10px}
.sponsor-name{font-family:var(--disp);font-weight:600;font-size:clamp(15px,1.02vw,19px);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sponsor-blurb{font-size:.84em;line-height:1.4;color:#3B322A;min-height:3.6em}
.sponsor.feat{background:#fff}

/* ————— footer ————— */
.site-foot{background:var(--oxblood);color:var(--ground);padding:clamp(28px,3vw,64px) 0 40px}
.site-foot a{color:var(--accent)}
.site-foot a:hover{color:#fff;background:rgba(229,169,22,.2)}
.site-foot .foot-grid{display:flex;flex-wrap:wrap;gap:20px 48px;align-items:flex-start}
.site-foot .wordmark__name{font-size:clamp(38px,4vw,74px);color:var(--ground)}
.foot-desc{max-width:44ch;color:#F0E4D6}
.foot-nav{display:flex;flex-wrap:wrap;gap:10px 26px;margin-left:auto;list-style:none;padding:0}
.foot-nav a{font-family:var(--disp);font-weight:800;font-size:clamp(16px,1.1vw,21px);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;color:var(--ground);border-bottom:2px solid transparent}
.foot-nav a:hover{background:none;color:var(--accent);border-bottom-color:var(--accent)}

/* ————— section (category) pages ————— */
.cat-head{padding-block:clamp(26px,3vw,72px) clamp(16px,2vw,36px);border-bottom:2px solid var(--ink)}
.cat-head h1{font-size:clamp(38px,5.4vw,120px);font-weight:600}
.cat-head .blurb{font-size:1.14em;max-width:52ch;margin-top:14px}
.cat-sub{display:flex;flex-wrap:wrap;gap:10px 24px;list-style:none;padding:0;margin:18px 0 0}
.cat-sub a{font-family:var(--disp);font-size:15px;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--oxblood)}
.cat-list{list-style:none;padding:0;margin:0}
.cat-list li{border-bottom:1px solid var(--hair);padding:clamp(16px,1.6vw,30px) 0;display:grid;grid-template-columns:1fr;gap:12px}
@media (min-width:780px){.cat-list li{grid-template-columns:64px minmax(0,1.35fr) minmax(0,1fr);align-items:start;gap:clamp(16px,2vw,42px)}}
.cat-list .no{font-family:var(--disp);font-weight:800;font-size:clamp(30px,2.4vw,46px);color:var(--accent);line-height:.85}
.cat-list h2{font-size:clamp(20px,1.7vw,34px);font-weight:600;margin-bottom:8px}
.cat-list h2 a{text-decoration:none;color:inherit}
.cat-list h2 a:hover{background:none;color:var(--oxblood);text-decoration:underline;text-decoration-color:var(--accent)}
.cat-list p{margin:0;font-size:.98em;color:#3B322A}
.cat-list img{width:100%;aspect-ratio:16/9;object-fit:cover}

/* archive */
.archive-group{margin-bottom:clamp(28px,3vw,64px)}
.archive-group h2{font-size:clamp(22px,2vw,40px);border-bottom:2px solid var(--ink);padding-bottom:8px;display:flex;align-items:center;gap:12px}
.archive-list{list-style:none;padding:0;margin:0;columns:1}
@media (min-width:900px){.archive-list{columns:2;column-gap:48px}}
@media (min-width:1600px){.archive-list{columns:3}}
.archive-list li{break-inside:avoid;padding:9px 0;border-bottom:1px dotted var(--hair)}
.archive-list a{text-decoration:none}
.archive-list a:hover{text-decoration:underline}

/* ————— article ————— */
.art-head{padding-block:clamp(22px,2.6vw,56px) clamp(14px,1.6vw,30px)}
.art-head .kicker{display:flex;align-items:center;gap:10px}
.art-head .kicker svg{width:22px;height:22px;color:var(--oxblood)}
.art-head h1{font-size:clamp(34px,5vw,104px);font-weight:600;max-width:26ch;margin:12px 0 0}
.standfirst{font-family:var(--serif);font-size:clamp(19px,1.5vw,30px);line-height:1.34;font-weight:400;max-width:44ch;margin:18px 0 0;color:var(--oxblood)}
.art-meta{display:flex;flex-wrap:wrap;gap:8px 26px;align-items:baseline;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);padding:10px 0;margin-top:clamp(18px,2vw,36px);font-family:var(--disp);font-size:15px;letter-spacing:.14em;text-transform:uppercase;color:var(--quiet)}
.art-body{padding:clamp(24px,3vw,64px) 0 0;max-width:var(--shell);margin-inline:auto}
.art-body .fig--bleed,.art-body .notes{width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
.art-body h2{font-size:clamp(23px,2.1vw,42px);font-weight:600;margin:clamp(28px,2.6vw,56px) 0 14px;max-width:34ch}
.art-body h3{font-size:clamp(18px,1.4vw,26px);margin:28px 0 10px}
.art-body .prose,.art-body .prose-wrap{max-width:var(--prose);padding-inline:20px}
.art-body>*{margin-inline:0}
.art-body .prose>p{margin:0 0 2em}
.art-body .prose:last-child>p:last-child{margin-bottom:0}
.lead{font-size:1.16em;line-height:1.5}
.art-body ul,.art-body ol{max-width:var(--prose);padding-inline:44px;margin:0 0 1.3em}
.art-body li{margin-bottom:.5em}

/* figure system — three treatments, one drawing vocabulary */
/* insertions: space on both sides ≥ 2× the paragraph gap at every width */
.art-body>.fig--bleed,.art-body>.fig--offset,.art-body>.fig--mat,.art-body>.article-figure,.art-body>.notes,.art-body>.pullquote,.art-body>.gallery,.art-body>.statrow,.art-body>.datatable-wrap,.art-body>.chart,.art-body>.profile-grid,.art-body>.org-grid,.art-body>.callout{margin-block:clamp(72px,6vw,124px)}
.art-body>*:last-child{margin-bottom:clamp(72px,6vw,124px)}
.art-foot{padding-block:clamp(26px,3vw,64px) clamp(44px,4.4vw,96px)}
.fig-cap{display:flex;flex-wrap:wrap;gap:6px 22px;align-items:baseline;padding-top:10px}
.fig-cap .cap{font-style:italic;font-size:.96em;line-height:1.42;flex:1 1 min(48ch,100%);max-width:70ch;margin:0}
.fig-cap .credit{flex:0 1 auto;margin-left:auto;text-align:right}

/* (1) full-bleed with amber rule and monospace credit flush right */
.fig--bleed{width:100%;margin:clamp(30px,3.4vw,72px) 0}
.fig--bleed img{width:100%;height:clamp(280px,58vh,760px);object-fit:cover}
.fig--bleed .fig-cap{border-top:5px solid var(--accent);max-width:1700px;margin:0 auto;padding:10px 20px 0}

/* (2) offset caption below-left, breaking out of the prose measure */
.fig--offset{max-width:var(--wide);margin:clamp(26px,3vw,64px) 0;padding-inline:20px}
.fig--offset img{width:100%;aspect-ratio:8/5;object-fit:cover;border-bottom:1px solid var(--hair)}
.fig--offset .fig-cap{margin-left:clamp(0px,4vw,72px);border-left:3px solid var(--oxblood);padding-left:16px}

/* (3) dark-matted panel, caption inside the frame */
.fig--mat{max-width:var(--wide);margin:clamp(26px,3vw,64px) 0;padding:clamp(14px,1.4vw,30px);background:var(--oxblood);color:var(--ground)}
.fig--mat img{width:100%;aspect-ratio:3/2;object-fit:cover}
.fig--mat .fig-cap .cap{color:#fff}
.fig--mat .credit{color:var(--rose)}
.fig--mat .fig-cap{border-top:1px solid rgba(243,237,225,.35);margin-top:12px}

/* generic figure class from the component spec */
.article-figure{max-width:var(--wide);margin:clamp(24px,2.6vw,54px) 0;padding-inline:20px}
.article-figure img{width:100%;aspect-ratio:8/5;object-fit:cover}
.article-figure figcaption{padding-top:10px;font-style:italic;font-size:.96em;max-width:70ch}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:14px;max-width:var(--wide);margin:clamp(24px,2.6vw,54px) 0;padding-inline:20px}
.gallery img{width:100%;aspect-ratio:1;object-fit:cover}
.gallery figcaption{font-size:.86em;font-style:italic;padding-top:6px}

/* notes-for-design material — full-width interruptions, not a side rail */
.notes{margin:clamp(30px,3.4vw,76px) 0;padding:clamp(22px,2.6vw,56px) 0}
.notes--dark{background:var(--oxblood);color:var(--ground)}
.notes--tint{background:var(--ground-2);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.notes h2{font-size:clamp(20px,1.9vw,36px);margin:0 0 18px;display:flex;align-items:center;gap:12px}
.notes--dark h2{color:var(--accent)}
.timeline{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:14px}
@media (min-width:820px){.timeline{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:clamp(16px,2vw,40px)}}
.timeline li{display:flex;flex-direction:column;gap:6px;border-top:2px solid var(--accent);padding-top:10px}
.t-when{font-family:var(--disp);font-weight:800;font-size:clamp(22px,1.8vw,34px);letter-spacing:.02em;line-height:1}
.notes--dark .t-when{color:var(--accent)}
.t-what{font-size:.98em;line-height:1.45}
.factlist{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:0}
@media (min-width:900px){.factlist{grid-template-columns:1fr 1fr;column-gap:clamp(24px,3vw,64px)}}
.factlist li{display:grid;grid-template-columns:1fr;gap:2px;padding:12px 0;border-bottom:1px solid var(--hair)}
.notes--dark .factlist li{border-bottom-color:rgba(243,237,225,.28)}
@media (min-width:640px){.factlist li{grid-template-columns:minmax(140px,.62fr) minmax(0,1.38fr);gap:clamp(14px,2vw,34px);align-items:baseline}}
.f-term{font-family:var(--disp);font-size:clamp(16px,1.15vw,22px);letter-spacing:.08em;text-transform:uppercase}
.notes--dark .f-term{color:var(--accent)}
.f-def{font-size:.98em;line-height:1.45}

/* component set (styleguide + article inline) */
.pullquote{margin:clamp(26px,3vw,60px) 0;max-width:var(--wide);padding-inline:20px}
.pullquote p{font-family:var(--serif);font-style:italic;font-size:clamp(22px,2.2vw,44px);line-height:1.22;margin:0;border-top:5px solid var(--accent);padding-top:16px;max-width:34ch;color:var(--oxblood)}
.blockquote{margin:1.6em 0;max-width:var(--prose);padding:0 20px 0 40px;border-left:3px solid var(--oxblood)}
.blockquote p{font-style:italic;margin-bottom:.4em}
.blockquote cite{font-family:var(--disp);font-size:15px;letter-spacing:.14em;text-transform:uppercase;font-style:normal;color:var(--quiet)}
.callout{max-width:var(--wide);margin:clamp(22px,2.4vw,48px) 0;padding:clamp(16px,1.8vw,34px);background:var(--ground-2);border-top:4px solid var(--oxblood)}
.callout p{margin:0;font-size:1.05em}
.note{max-width:var(--prose);padding-inline:20px;font-size:.94em;color:var(--quiet);border-left:2px solid var(--accent);padding-left:16px;margin-left:20px}
.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:clamp(14px,1.6vw,34px);max-width:var(--wide);margin:clamp(22px,2.4vw,50px) 0;padding-inline:20px}
.statblock{display:flex;flex-direction:column;gap:6px;border-top:3px solid var(--ink);padding-top:10px}
.stat-num{font-family:var(--disp);font-weight:800;font-size:clamp(38px,3.6vw,74px);line-height:.85;color:var(--oxblood)}
.stat-label{font-size:.92em;line-height:1.35;color:#3B322A}
.datatable,.versus{border-collapse:collapse;width:100%;max-width:var(--wide);margin:clamp(22px,2.4vw,50px) 0;font-size:.98em}
.datatable-wrap{max-width:var(--wide);overflow-x:auto;padding-inline:20px;margin:clamp(22px,2.4vw,50px) 0}
.datatable-wrap .datatable,.datatable-wrap .versus{margin:0}
.datatable th,.versus th{font-family:var(--disp);font-size:14px;letter-spacing:.16em;text-transform:uppercase;text-align:left;color:var(--quiet);border-bottom:2px solid var(--ink);padding:8px 18px 8px 0;white-space:nowrap}
.datatable td,.versus td{border-bottom:1px solid var(--hair);padding:11px 18px 11px 0;vertical-align:top}
.versus td:first-child{font-family:var(--disp);font-size:1.05em;letter-spacing:.06em;text-transform:uppercase}
.chart{max-width:var(--wide);margin:clamp(22px,2.4vw,50px) 0;padding-inline:20px}
.chart svg{width:100%;height:auto;overflow:visible}
.chart figcaption{font-size:.92em;font-style:italic;padding-top:10px}
.profile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:clamp(14px,1.6vw,32px);max-width:var(--wide);margin:clamp(22px,2.4vw,50px) 0;padding-inline:20px}
.profile-card{display:flex;flex-direction:column;height:100%;gap:10px;background:var(--ground-2);padding:14px;border-top:3px solid var(--accent)}
.profile-card img.p-photo{width:100%;aspect-ratio:1;object-fit:cover}
.profile-card h3{font-size:clamp(18px,1.3vw,25px)}
.p-role{font-family:var(--disp);font-size:14px;letter-spacing:.16em;text-transform:uppercase;color:var(--quiet);margin:0}
.profile-card p{margin:0;font-size:.94em}
.p-links{margin-top:auto!important;font-family:var(--disp);font-size:14px;letter-spacing:.12em;text-transform:uppercase}
.p-attr{font-family:var(--mono);font-size:12px;color:var(--quiet)}
.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:12px;max-width:var(--wide);margin:clamp(20px,2.2vw,44px) 0;padding-inline:20px}
.org-card{display:flex;flex-direction:column;gap:6px;padding:12px;border:1px solid var(--hair);text-decoration:none;background:var(--ground)}
.org-card:hover{border-color:var(--oxblood);background:var(--ground)}
.org-logo{height:34px;width:auto;max-width:100%;object-fit:contain}
.org-name{font-family:var(--disp);font-size:18px;letter-spacing:.08em;text-transform:uppercase}
.org-host{font-family:var(--mono);font-size:12px;color:var(--quiet)}
.entity-ref{white-space:normal}
.further-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:14px;max-width:var(--wide);margin:0;padding-inline:20px}
.further-grid a{display:block;padding:14px;background:var(--ground-2);text-decoration:none;font-family:var(--disp);font-size:clamp(17px,1.3vw,24px);letter-spacing:.04em;text-transform:uppercase;border-top:3px solid var(--ink)}
.further-grid a:hover{background:var(--ground-2);color:var(--oxblood);border-top-color:var(--accent)}
.related-links{list-style:none;margin:0;padding-inline:20px;max-width:var(--wide)}
.related-links li{border-bottom:1px solid var(--hair);padding:10px 0}
.related-links a{font-family:var(--disp);font-size:clamp(17px,1.25vw,23px);letter-spacing:.04em;text-transform:uppercase;text-decoration:none}
.related-links a:hover{text-decoration:underline;text-decoration-color:var(--accent)}
.art-foot{padding-block:clamp(26px,3vw,64px)}
.art-foot h2{font-size:clamp(20px,1.8vw,34px);margin-bottom:16px;padding-inline:20px}

/* ————— page furniture ————— */
.page-simple{padding-block:clamp(26px,3vw,72px)}
.page-simple h1{font-size:clamp(34px,4.4vw,88px);margin-bottom:20px}
.page-simple .prose{max-width:var(--prose)}
.page-404{padding-block:clamp(40px,6vw,140px)}
.page-404 .big{font-family:var(--disp);font-weight:800;font-size:clamp(90px,18vw,320px);line-height:.8;color:var(--accent)}

/* ————— large displays: the page keeps gaining, not just margin ————— */
@media (min-width:1440px){
  :root{--body:18px;--prose:74ch;--wide:1340px;--shell:1420px}
  .lead-line h1{max-width:28ch}
}
@media (min-width:1920px){
  :root{--body:19px;--prose:76ch;--wide:1560px;--shell:1720px}
  .lead-plate img{height:min(90vh,1000px)}
  .art-body{display:grid;grid-template-columns:minmax(0,1fr);justify-items:start}
  .fig--offset .fig-cap{margin-left:120px}
}
@media (min-width:2400px){
  :root{--body:20px;--prose:78ch;--wide:1800px;--shell:2000px}
  .fig--bleed img{height:min(72vh,1100px)}
  .strip{grid-template-columns:repeat(auto-fit,minmax(340px,1fr))}
}

/* 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-tiers > .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}
.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;}


/* sp-plate-ground: the mark plate was --oxblood #58181C, which against this build's paper ground
   is the loudest element in the section. Deepened so the logos sit on it rather than compete
   with it; the tile and section grounds Design chose are untouched. */
.sponsor img{background:#330E11!important}


/* op-money-columns: the supporters block ran one tile per row — 8 tiles,
   1063px at 390, 14% of the whole page. Two columns bring it to
   826px (22% shorter). Checked before writing: no new overflow, smallest mark still
   145px wide, longest blurb 1 lines, tile heights 121-209px.
   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:14px!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-blurb-rows: money blurbs ran to 5 rows at 390, 318px of tier across
   3 tiles. Operator: blurbs should show "2-3 rows max" on mobile —
   a blurb that long eats the screen and, in a two-column grid, rewraps into more height than
   the columns save. Held to three rows at phone width; the copy stays in the markup and
   desktop is untouched. Only the tier(s) measured past three rows are clamped. */
@media (max-width:640px){
  .sponsor-row .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical;max-height:63px!important;min-height:0!important;overflow:hidden!important}
}

/* op-odd-tier-lead: .sponsor-row (3 tiles), .sponsor-row (5 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}
}


/* op-tablet-fit — the vertical year's digits are wider than its .76 line box; reserve the difference so they stay on screen */
.opener__year{padding-right:.24em}
/* op-tablet-fit:end */

/* op-tablet-gutter — text never sits on the screen edge between the mobile guard and the max-width */
@media (min-width:901px) and (max-width:1099px){
  section.opener{padding-left:max(20px, 18px);padding-right:max(20px, 18px)}
}
/* op-tablet-gutter:end */

/* op-img-dims — intrinsic width/height reserve image space; the proven height:auto guard (zero specificity) */
:where(article > figure.fig--bleed > img,
  article > figure.fig--mat > img,
  article > figure.fig--offset > img,
  div.art-body > figure.fig--mat > img,
  div.art-body > figure.fig--offset > img,
  div.features > article.feature > img,
  div.strip > figure > img,
  figure.plate > div.plate__frame > img,
  li > a > img,
  main > figure.fig--bleed > img){height:auto}
/* op-img-dims:end */
