/* KEPT — efah.org
   PALETTE (3 saturated-capable members + ground/ink)
   --paper      ground      near-white page
   --ink        ink         text, dark bands
   --accent     accent      ultramarine — links, rules, kickers, filled panels
   --secondary  secondary   ochre — the signature band and the card figure ground
   --rule       hairline    quiet divider only
*/
:root{
  --paper:#FBFAF6; --paper-2:#F3F1EA; --ink:#101418; --ink-soft:#3A3E44; --ink-mute:#5C6068;
  --accent:#1E3FBF; --accent-ink:#152C86; --secondary:#D98A0B; --secondary-deep:#5A3A02;
  --rule:#D5D2C9;
  --sans:'Familjen Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:'Spline Sans Mono',ui-monospace,'SFMono-Regular',Menlo,monospace;
  --gut:clamp(20px,4vw,56px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.55;font-synthesis-weight:none;text-wrap:pretty}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--secondary-deep)}
h1,h2,h3{margin:0;font-weight:700;letter-spacing:-.03em;line-height:1.06;text-wrap:balance}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
::selection{background:var(--accent);color:#fff}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;background:var(--ink);color:var(--paper);padding:10px 14px;z-index:20}
.ico{flex:none}

/* ---------- masthead ---------- */
.masthead{border-bottom:0}
.masthead-top{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;padding:20px var(--gut) 16px}
.wordmark{display:flex;align-items:baseline;gap:14px;color:var(--ink)}
.wordmark:hover{color:var(--ink)}
.wordmark-name{font-size:clamp(30px,4.4vw,42px);font-weight:700;letter-spacing:-.055em;line-height:.9}
.wordmark-domain{font-family:var(--mono);font-size:12px;letter-spacing:.08em;color:var(--accent)}
.standfirst{font-family:var(--mono);font-size:12.5px;line-height:1.5;color:var(--ink-mute);max-width:34ch;text-align:right}
.nav{display:flex;flex-wrap:wrap;background:var(--ink);padding:0 var(--gut)}
.navitem{position:relative;display:flex;align-items:center;gap:10px;padding:15px 19px;font-size:17px;font-weight:700;letter-spacing:-.02em;color:#EDEFF2;border-left:1px solid #262B32}
.navitem .ico{color:#8FA6FF;transition:color .15s}
.navitem:first-child{border-left:0;padding-left:0}
.navitem::after{content:'';position:absolute;left:19px;right:19px;bottom:0;height:4px;background:var(--secondary);transform:scaleX(0);transform-origin:left;transition:transform .18s ease}
.navitem:first-child::after{left:0}
.navitem:hover{color:#fff}
.navitem:hover .ico{color:var(--secondary)}
.navitem:hover::after{transform:scaleX(1)}
.navitem.is-here{color:#fff}
.navitem.is-here .ico{color:var(--secondary)}
.navitem.is-here::after{transform:scaleX(1);background:var(--accent)}
.navitem--end{color:#fff;background:var(--accent);padding-left:22px;padding-right:22px;border-left:0}
.navitem--end .ico{color:#fff}
.navitem--end:hover{background:var(--secondary);color:var(--ink)}
.navitem--end:hover .ico{color:var(--ink)}
.navitem--end::after{display:none}

/* ---------- generic wrap / bands ---------- */
.wrap{padding:0 var(--gut)}
.band{padding:clamp(38px,5vw,64px) var(--gut)}
.band--tight{padding-top:clamp(26px,3vw,36px);padding-bottom:clamp(26px,3vw,36px)}
.band--rule{border-top:2px solid var(--ink)}
.band--hair{border-top:1px solid var(--rule)}
.bandhead{display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:22px}
.bandhead h2{font-size:clamp(21px,2.4vw,26px)}
.eyebrow{font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-mute)}
.more{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase}
.kicker a,.kicker{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}

/* ---------- homepage lead ---------- */
.lead-entry{border-bottom:2px solid var(--ink)}
.lead-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,42%);gap:clamp(24px,4vw,52px);align-items:end;padding:clamp(34px,4.5vw,58px) var(--gut) 0}
.lead-title{font-size:clamp(38px,6.4vw,74px)}
.lead-deck{font-size:clamp(17px,1.5vw,20px);line-height:1.45;color:var(--ink-soft);margin-top:20px;max-width:44ch}
.lead-cta{display:inline-flex;align-items:center;gap:9px;margin-top:26px;background:var(--accent);color:#fff;padding:12px 18px;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.lead-cta:hover{background:var(--ink);color:#fff}
.lead-side{border-left:1px solid var(--rule);padding-left:clamp(18px,2vw,28px);padding-bottom:6px}
.lead-side dl{margin:0;font-family:var(--mono);font-size:12.5px}
.lead-side div{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid var(--rule)}
.lead-side dt{color:var(--ink-mute)}
.lead-side dd{margin:0;text-align:right}
.lead-figure{margin:clamp(28px,4vw,44px) var(--gut) 0}
.lead-figure .fig-img{border-top:4px solid var(--accent)}
.lead-figure figcaption{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,300px);gap:24px;padding-top:14px;padding-bottom:clamp(30px,4vw,48px)}

/* ---------- cards ---------- */
.cards{display:grid;gap:clamp(24px,3vw,40px)}
.cards--3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.card{display:flex;flex-direction:column;height:100%}
.card-img{display:block;border-top:3px solid var(--accent);border-bottom:1px solid var(--ink);margin-bottom:16px;padding:9px 9px 0;background:var(--paper-2);transition:background .18s ease}
.card-img img{aspect-ratio:16/10;object-fit:cover;border:1px solid var(--ink);transition:filter .18s ease}
.card:hover .card-img{background:var(--secondary)}
.card-img::after{content:'';display:block;height:9px}
.card h3{font-size:clamp(20px,2vw,25px);margin-bottom:8px;min-height:2.2em}
.card p{font-size:15.5px;line-height:1.5;color:var(--ink-soft)}
.card .kicker{margin-bottom:10px}
.card-meta{margin-top:auto;padding-top:14px;font-family:var(--mono);font-size:11px;line-height:1.5;letter-spacing:0;text-transform:none;color:var(--ink-mute)}

/* ---------- signature band (real colour area) ---------- */
.signature{background:var(--secondary);color:var(--ink);padding:clamp(48px,6vw,86px) var(--gut)}
.signature .eyebrow{color:var(--secondary-deep)}
.sig-line{font-size:clamp(24px,3.4vw,40px);font-weight:700;letter-spacing:-.03em;line-height:1.2;max-width:34ch;margin-top:20px}
.sig-foot{display:flex;flex-wrap:wrap;gap:12px 28px;margin-top:30px;padding-top:20px;border-top:1px solid var(--secondary-deep);font-family:var(--mono);font-size:12.5px;color:var(--secondary-deep)}
.sig-foot a{color:var(--ink)}

/* ---------- sections grid ---------- */
.sects{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:34px 48px}
.sect{border-top:2px solid var(--ink);padding-top:18px;display:flex;gap:22px;align-items:flex-start}
.sect .ico{color:var(--accent);flex:none;margin-top:-2px}
.sect h3{font-size:22px;letter-spacing:-.025em}
.sect p{font-size:15px;line-height:1.5;color:var(--ink-soft);margin-top:5px}
.sect-count{font-family:var(--mono);font-size:11.5px;color:var(--ink-mute);margin-top:8px;display:block}

/* ---------- compact register rows ---------- */
.rows{border-top:2px solid var(--ink)}
.row{display:grid;grid-template-columns:minmax(0,148px) minmax(0,1fr) minmax(0,150px);gap:16px 22px;align-items:baseline;padding:13px 0;border-bottom:1px solid var(--rule)}
.row-sec{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.row-title{font-size:19px;font-weight:600;letter-spacing:-.015em;color:var(--ink)}
.row a.row-title:hover{color:var(--accent)}
.row-note{font-family:var(--mono);font-size:11.5px;color:var(--ink-mute)}
.row-deck{grid-column:2;font-size:14.5px;color:var(--ink-soft);margin-top:-6px}

/* ---------- supporters ---------- */
.supporters{border-bottom:2px solid var(--ink);background:var(--paper-2);padding:clamp(26px,3vw,38px) var(--gut)}
.sup-head{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.sup-note{font-size:14.5px;color:var(--ink-soft);max-width:62ch}
.sup-run{display:flex;flex-wrap:wrap;border-top:1px solid var(--rule);border-left:1px solid var(--rule)}
.sponsor{flex:0 0 244px;background:var(--paper-2);padding:14px 16px;display:flex;flex-direction:column;gap:6px;color:var(--ink);min-height:82px;border-right:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.sponsor:hover{background:#fff;color:var(--accent)}
.sponsor-name{font-size:16px;font-weight:600;letter-spacing:-.01em;line-height:1.25}
.sponsor.feat{background:#fff}
.sponsor.feat .sponsor-name{font-size:19px;font-weight:700}
.sponsor.feat .sponsor-blurb{color:var(--ink-soft)}
.sponsor-blurb{font-family:var(--mono);font-size:11.5px;line-height:1.45;color:var(--ink-mute)}
.sponsor img{max-height:44px;max-width:100%;width:auto;height:auto;object-fit:contain}

/* ---------- article ---------- */
.article{display:grid;padding-bottom:clamp(30px,4vw,52px);
  grid-template-columns:[full-start] minmax(var(--gut),1fr) [wide-start] minmax(0,150px) [text-start] minmax(0,66ch) [text-end] minmax(0,150px) [wide-end] minmax(var(--gut),1fr) [full-end]}
.article>*{grid-column:text-start/text-end}
.article>.wide{grid-column:wide-start/wide-end}
.article>.full{grid-column:full-start/full-end}
.kicker{margin:clamp(34px,4vw,52px) 0 18px}
.art-title{font-size:clamp(34px,5.4vw,60px)}
.lead{font-size:clamp(18px,1.7vw,22px);line-height:1.45;color:var(--ink-soft);margin-top:20px}
.art-h2{font-size:clamp(22px,2.4vw,29px);margin:clamp(34px,4vw,50px) 0 4px;padding-top:14px;border-top:1px solid var(--rule)}
.article p.text{font-size:17.5px;line-height:1.72;margin-top:18px}
.artlist{margin-top:18px;display:grid;gap:9px}
.artlist li{font-size:17px;line-height:1.6;padding-left:20px;position:relative}
.artlist li::before{content:'';position:absolute;left:0;top:.62em;width:9px;height:1px;background:var(--accent)}
.filed{margin-top:clamp(34px,4vw,48px);padding-top:16px;border-top:2px solid var(--ink)}
.filed-in{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-mute)}

/* figures — one drawing system: square corners, 3px accent rule or ochre mat, caption then quieter credit */
.fig{margin:clamp(28px,3.5vw,44px) 0 0}
.fig img{width:100%}
.fig-cap{font-size:16.5px;line-height:1.45;font-weight:500;max-width:56ch}
.fig-credit{font-family:var(--mono);font-size:11.5px;line-height:1.5;color:var(--ink-mute);margin-top:7px;max-width:60ch}
.fig--plate .fig-img{border-top:3px solid var(--accent)}
.fig--plate figcaption{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,270px);gap:14px 30px;padding-top:14px}
.fig--plate .fig-credit{margin-top:0;border-top:1px solid var(--rule);padding-top:10px}
.fig--card{background:var(--secondary);padding:clamp(16px,2vw,24px)}
.fig--card .fig-cap{margin-top:16px;max-width:52ch}
.fig--card .fig-credit{color:var(--secondary-deep);border-top:1px solid var(--secondary-deep);padding-top:9px;margin-top:11px}
.fig--inset{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:20px;align-items:start}
.fig--inset .fig-img{border:1px solid var(--ink);padding:5px;background:var(--paper)}
.fig--inset figcaption{padding-top:2px}
.fig--inset .fig-cap{font-size:15.5px}

/* notes-for-design material — interruptions, not a rail */
.notes{margin:clamp(30px,4vw,46px) 0 0;border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);padding:22px 0 24px}
.notes-head{font-family:var(--mono);font-size:11.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:16px}
.notes p{font-size:16px;line-height:1.6;color:var(--ink-soft);margin-bottom:12px;max-width:70ch}
.timeline{display:grid;gap:1px;background:var(--rule)}
.timeline li{display:grid;grid-template-columns:minmax(0,210px) minmax(0,1fr);gap:8px 24px;background:var(--paper);padding:11px 0}
.timeline .t-when{font-family:var(--mono);font-size:12.5px;color:var(--accent-ink);line-height:1.45}
.timeline .t-what{font-size:16px;line-height:1.5}
.timeline--terms .t-when{color:var(--ink);font-weight:500}
.notelist{display:grid;gap:10px}
.notelist li{font-size:16px;line-height:1.55;padding-left:20px;position:relative}
.notelist li::before{content:'';position:absolute;left:0;top:.62em;width:9px;height:1px;background:var(--secondary)}
.pullquote{margin:clamp(26px,3vw,38px) 0 0;padding-left:22px;border-left:3px solid var(--secondary)}
.pullquote p{font-size:clamp(20px,2.2vw,26px);font-weight:600;letter-spacing:-.02em;line-height:1.3}

.related{margin-top:clamp(30px,4vw,44px)}
.related-head{font-family:var(--mono);font-size:11.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-mute);padding-bottom:12px;border-bottom:1px solid var(--ink)}
.related-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:0 32px}
.related-links li{border-bottom:1px solid var(--rule)}
.related-links a{display:block;padding:14px 0}
.rl-title{display:block;font-size:19px;font-weight:600;letter-spacing:-.015em;color:var(--ink)}
.related-links a:hover .rl-title{color:var(--accent)}
.rl-deck{display:block;font-size:14.5px;line-height:1.45;color:var(--ink-soft);margin-top:4px}

/* ---------- section / index pages ---------- */
.sec-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,380px);gap:clamp(22px,3vw,52px);align-items:end;padding:clamp(34px,4.5vw,60px) var(--gut) clamp(26px,3vw,40px);border-bottom:2px solid var(--ink)}
.sec-hero-t{display:flex;gap:clamp(14px,2vw,22px);align-items:flex-start}
.sec-hero-t .ico{color:var(--accent);margin-top:8px}
.sec-hero h1{font-size:clamp(38px,6vw,68px)}
.sec-hero .sec-blurb{font-size:clamp(17px,1.6vw,20px);line-height:1.45;color:var(--ink-soft);margin-top:14px;max-width:44ch}
.sec-hero-side{font-family:var(--mono);font-size:12.5px;border-left:1px solid var(--rule);padding-left:22px;color:var(--ink-mute)}
.sec-hero-side p{margin-bottom:10px}
.cat-list{border-top:2px solid var(--ink)}
.cat-list li{border-bottom:1px solid var(--rule)}
.cat-list a{display:grid;grid-template-columns:minmax(0,152px) minmax(0,1fr) minmax(0,130px);gap:14px 30px;align-items:center;padding:20px 0}
.cat-list a>span{display:block;min-width:0}
.cat-list img{width:152px;aspect-ratio:16/10;object-fit:cover;border:1px solid var(--ink)}
.cat-list .ct{display:block;font-size:clamp(20px,2.2vw,26px);font-weight:700;letter-spacing:-.025em;line-height:1.15;color:var(--ink)}
.cat-list a:hover .ct{color:var(--accent)}
.cat-list .cd{display:block;font-size:15.5px;line-height:1.5;color:var(--ink-soft);margin-top:9px;max-width:64ch}
.cat-list .cn{display:block;font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-mute);text-align:right}
.datatable{width:100%;border-collapse:collapse;font-size:16px}
.datatable caption{text-align:left;font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);padding-bottom:10px}
.datatable th,.datatable td{text-align:left;padding:11px 16px 11px 0;border-bottom:1px solid var(--rule);vertical-align:top}
.datatable thead th{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-mute);border-bottom:1px solid var(--ink)}
.datatable tbody tr:hover{background:var(--paper-2)}
.prose{max-width:66ch;padding:clamp(30px,4vw,52px) var(--gut)}
.prose p{font-size:17.5px;line-height:1.72;margin-top:18px}
.prose h2{font-size:24px;margin-top:34px}

/* ---------- footer ---------- */
.foot{background:var(--ink);color:var(--paper);padding:clamp(32px,4vw,48px) var(--gut) 26px;margin-top:0}
.foot-in{display:grid;grid-template-columns:minmax(0,240px) minmax(0,1fr) minmax(0,220px);gap:26px 40px}
.foot .wordmark,.foot .wordmark:hover{color:var(--paper)}
.foot .wordmark--foot{flex-direction:column;gap:7px;align-items:flex-start}
.foot .wordmark-name{font-size:28px}
.foot .wordmark-domain{color:#8FA6FF}
.foot-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 34px;align-self:start}
.foot-nav a{display:flex;align-items:center;gap:12px;padding:13px 0;border-top:1px solid #2A2F36;font-size:17px;font-weight:600;letter-spacing:-.015em;color:#E7E9EC}
.foot-nav .ico{color:#8FA6FF;transition:color .15s}
.foot-nav a:hover .ico{color:var(--secondary)}
.foot-meta a{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:#B9BEC6}
.foot-nav a:hover,.foot-meta a:hover{color:#fff}
.foot-meta{border-top:1px solid #2A2F36;padding-top:13px}
.foot-meta{display:grid;gap:8px}
.foot-line{font-family:var(--mono);font-size:11.5px;color:#7C828B;margin-top:28px;padding-top:16px;border-top:1px solid #2A2F36;max-width:80ch}

/* ---------- styleguide-only components ---------- */
.blockquote{margin:24px 0;padding:18px 22px;background:var(--paper-2);border-left:3px solid var(--accent)}
.blockquote p{font-size:19px;line-height:1.45}
.blockquote cite{display:block;font-family:var(--mono);font-size:11.5px;font-style:normal;color:var(--ink-mute);margin-top:10px}
.callout{margin:24px 0;padding:20px 22px;background:var(--accent);color:#fff}
.callout p{font-size:17px;line-height:1.55}
.note{font-family:var(--mono);font-size:13px;line-height:1.6;color:var(--ink-mute);border-top:1px solid var(--rule);padding-top:10px;margin-top:20px}
.versus{width:100%;border-collapse:collapse;font-size:16px}
.versus th,.versus td{text-align:left;padding:11px 14px 11px 0;border-bottom:1px solid var(--rule);vertical-align:top}
.versus thead th{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-mute);border-bottom:1px solid var(--ink)}
.versus tbody th{font-weight:600;width:30%}
.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule);margin:24px 0}
.statblock{background:var(--paper);padding:16px}
.stat-num{display:block;font-size:38px;font-weight:700;letter-spacing:-.04em;color:var(--accent)}
.stat-label{display:block;font-family:var(--mono);font-size:11.5px;line-height:1.45;color:var(--ink-mute);margin-top:6px}
.chart{margin:24px 0}
.chart svg{width:100%;height:auto;overflow:visible}
.chart figcaption{font-family:var(--mono);font-size:11.5px;color:var(--ink-mute);margin-top:10px}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin:24px 0}
.gallery figure{margin:0}
.gallery img{aspect-ratio:16/10;object-fit:cover;border:1px solid var(--ink)}
.gallery figcaption{font-size:14.5px;line-height:1.45;margin-top:8px}
.article-figure{margin:24px 0}
.article-figure img{border-top:3px solid var(--accent)}
.article-figure figcaption{font-size:16px;line-height:1.45;padding-top:12px;max-width:56ch}
.profile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;margin:24px 0}
.profile-card{border:1px solid var(--ink);padding:18px}
.profile-card h3{font-size:20px;margin-bottom:4px}
.profile-card .p-role{font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin-bottom:10px}
.profile-card p{font-size:15.5px;line-height:1.55}
.profile-card .p-links{margin-top:12px;font-family:var(--mono);font-size:12px}
.profile-card .p-attr{font-family:var(--mono);font-size:11px;color:var(--ink-mute);margin-top:10px}
.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule);margin:24px 0}
.org-card{background:var(--paper);padding:14px;display:grid;gap:4px}
.org-card:hover{background:#fff}
.org-name{font-size:16px;font-weight:600;color:var(--ink)}
.org-host{font-family:var(--mono);font-size:11.5px;color:var(--ink-mute)}
.entity-ref{border-bottom:1px solid var(--accent)}
.further-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule);margin:24px 0}
.further-grid a{background:var(--paper);padding:16px;font-size:17px;font-weight:600;letter-spacing:-.015em;color:var(--ink)}
.further-grid a:hover{background:#fff;color:var(--accent)}
.sg-sec{padding:clamp(30px,4vw,48px) var(--gut);border-top:1px solid var(--rule)}
.sg-sec>h2{font-size:26px;margin-bottom:6px}
.sg-sec>.eyebrow{display:block;margin-bottom:20px}
.sg-narrow{max-width:66ch}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .article{grid-template-columns:[full-start] minmax(var(--gut),1fr) [wide-start] minmax(0,64px) [text-start] minmax(0,66ch) [text-end] minmax(0,64px) [wide-end] minmax(var(--gut),1fr) [full-end]}
}
@media (max-width:880px){
  .article{grid-template-columns:[full-start] var(--gut) [wide-start] 0px [text-start] minmax(0,1fr) [text-end] 0px [wide-end] var(--gut) [full-end]}
}
@media (max-width:1020px){
  .lead-grid{grid-template-columns:minmax(0,1fr)}
  .lead-side{border-left:0;border-top:1px solid var(--rule);padding-left:0;padding-top:14px}
  .sec-hero{grid-template-columns:minmax(0,1fr)}
  .sec-hero-side{border-left:0;border-top:1px solid var(--rule);padding-left:0;padding-top:14px}
  .foot-in{grid-template-columns:minmax(0,1fr)}
  .foot-nav{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:820px){
  .masthead-top{flex-direction:column;align-items:flex-start;gap:12px}
  .standfirst{text-align:left;max-width:46ch}
  .nav{padding-bottom:4px}
  .nav{gap:0 20px}
  .navitem{padding:11px 0;font-size:16px;border-left:0}
  .navitem::after{left:0;right:0}
  .navitem--end{padding:11px 13px;margin-left:0}
  .navitem--end::after{display:none}
  .fig--plate figcaption,.lead-figure figcaption{grid-template-columns:minmax(0,1fr)}
  .fig--inset{grid-template-columns:minmax(0,1fr)}
  .row{grid-template-columns:minmax(0,1fr)}
  .row-deck{grid-column:1}
  .row-note{order:-1}
  .timeline li{grid-template-columns:minmax(0,1fr)}
  .cat-list a{grid-template-columns:minmax(0,110px) minmax(0,1fr);gap:12px 18px;padding:16px 0}
  .cat-list img{width:110px}
  .cat-list .cn{grid-column:2;text-align:left}
  .sect{gap:16px}
  .sect .ico{width:52px;height:52px}
}
@media (max-width:560px){
  body{font-size:16.5px}
  .sponsor{flex:1 1 100%;min-height:0}
  .cat-list a{grid-template-columns:minmax(0,1fr)}
  .cat-list img{width:100%}
  .article p.text{font-size:17px}
  .datatable{font-size:15px}
  .datatable th,.datatable td{padding-right:10px}
  .foot-nav{grid-template-columns:minmax(0,1fr)}
  .datatable,.datatable tbody,.datatable tr,.datatable th,.datatable td{display:block;width:auto}
  .datatable thead{display:none}
  .datatable tr{border-bottom:1px solid var(--rule);padding:15px 0}
  .datatable tbody tr:hover{background:transparent}
  .datatable th[scope="row"]{padding:0 0 6px;border:0;font-size:19px;font-weight:700;letter-spacing:-.02em}
  .datatable td{padding:0;border:0;color:var(--ink-soft);font-size:15.5px;line-height:1.5}
  .datatable caption{letter-spacing:.08em;line-height:1.5}
}
@media print{
  .nav,.supporters,.foot-nav,.foot-meta{display:none}
  body{background:#fff}
}

/* 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}

/* 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-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}

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

/* op-money-columns: the supporters block ran one tile per row — 12 tiles,
   1366px at 390, 18% of the whole page. Two columns bring it to
   718px (47% shorter). Checked before writing: no new overflow, smallest mark still
   134px wide, longest blurb 3 lines, tile heights 99-161px.
   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.
   The blurb is held to three rows at phone width, because a nine- or eleven-line blurb in a narrow column made two columns TALLER than one. The copy stays in the markup. Only the tier(s) that were one-per-row are touched (.sup-run), 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){
  .sup-run{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:16px!important}
    .sup-run > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .sup-run > * *{min-width:0!important;max-width:100%}
    .sup-run img,.sup-run svg{max-width:100%;height:auto}
  .sup-run .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical;overflow:hidden!important}
}

/* op-page-overflow: the page scrolled sideways at 320 — div.sect reached
   340px in a 320px screen (+20px), inside
   div.sects. Remedy: unpin the grid track. Structural only, no spacing value of mine;
   tried in order and this is the first that held, with the page's visible copy unchanged.
   Phone widths only — desktop is re-measured after writing and must not move. */
@media (max-width:360px){
  div.sects{grid-template-columns:minmax(0,1fr)!important}
  div.sect{min-width:0!important;max-width:100%!important}
}

/* op-article-width: the article column was capped at 636px (89 characters per line) at every desktop width. Operator: "it should utilize more space". Widened through grid track 3 of "[full-start] minmax(var(--gut),1fr) [wide-start] minmax(0,150px) [text-start] minmax(0,66ch) [text-end] minmax(0,150px) [wide-end] minmax(var(--gut),1fr) [full-end]" (declared in .article) to ~102 characters per line in this build's own prose font, never past the edge Design's own content already reaches beside it. Above 1600 the column and the prose type grow together (up to 1.2x). Nothing below 1024 changes. Originals: migration/_backups/article_width/. */
@media (min-width:1024px){
  body:has(.article) main#main{grid-template-columns:[full-start] minmax(var(--gut),1fr) [wide-start] minmax(0,150px) [text-start] min(732px, calc(100% - 300px)) [text-end] minmax(0,150px) [wide-end] minmax(var(--gut),1fr) [full-end]!important}
}
@media (min-width:1600px){
  body:has(.article) main#main{grid-template-columns:[full-start] minmax(var(--gut),1fr) [wide-start] minmax(0,150px) [text-start] min(clamp(732px, 50.833vw, 878px), calc(100% - 300px)) [text-end] minmax(0,150px) [wide-end] minmax(var(--gut),1fr) [full-end]!important}
  body:has(.article) main#main > :is(p.kicker.text, p.lead.text, p.text.art-open, p.text){font-size:clamp(17.5px,1.2153vw,21.0px)!important}
}
/* op-article-width:end */

/* op-hover-pad */
.datatable tbody tr>*:first-child{padding-left:clamp(12px,3.5vw,22px)!important}
/* op-hover-pad:end */
@media (min-width:660px) and (max-width:1439px){.sup-run.sup-run:has(> [data-partner]){display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(244px,calc(50% - 6px)),1fr))!important;column-gap:12px!important;row-gap:12px!important;justify-content:stretch!important;align-items:stretch!important}.sup-run.sup-run > [data-partner]{flex:none!important;width:auto!important;max-width:none!important;margin-left:0!important;margin-right:0!important}}