/* KCHO.org — Register. Palette: ground / ink / accent (indigo) / secondary (vermilion) / rule */
:root{
  --ground:#EFEBE3;      /* paper ground */
  --ground-2:#E9E4DA;    /* banded ground */
  --plate:#F4F1EA;       /* plate / card */
  --ink:#14181C;         /* ink */
  --ink-2:#3D4348;       /* secondary ink */
  --ink-3:#5E646A;
  --quiet:#8A9095;       /* credits, meta */
  --accent:#3B5BDB;      /* indigo — table heads, drawn lines, full band */
  --accent-ink:#2D49B8;  /* indigo for small text on paper */
  --secondary:#E4572E;   /* vermilion — the night state, single-line bands */
  --secondary-ink:#C6431F;
  --rule:#C9C3B7;
  --dark:#14181C;        /* dark ground for sponsor marks */
  --measure:770px;
  --pad:clamp(18px,4vw,46px);
  --display:"Zilla Slab",Georgia,serif;
  --text:"Sora",system-ui,-apple-system,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--text);font-size:17px;line-height:1.6;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent-ink);text-decoration:none}
a:hover{color:var(--secondary-ink)}
h1,h2,h3,h4{font-family:var(--display);font-weight:700;letter-spacing:-.01em;margin:0}
figure{margin:0}
table{border-collapse:collapse;width:100%}
.wrap{padding-inline:var(--pad)}
.measure{max-width:var(--measure);margin-inline:auto;padding-inline:var(--pad)}
.kicker{font-size:11.5px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--accent-ink)}
.kicker--quiet{color:var(--quiet)}
.seg{color:var(--accent);flex:none}
.icon{width:1.35em;height:1.35em;flex:none;color:var(--accent)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;background:var(--ink);color:var(--plate);padding:8px 12px;z-index:9}

/* ---------- masthead + printed index header ---------- */
.mast{padding:26px var(--pad) 18px;border-bottom:3px solid var(--ink);display:flex;flex-wrap:wrap;gap:20px 40px;align-items:flex-start;justify-content:space-between}
.mast-id{display:flex;align-items:stretch;gap:18px;min-width:0}
.mast-seg{border:1.5px solid var(--accent);color:var(--accent);padding:7px 9px;display:flex;gap:5px;align-items:center}
.mast-name{font-family:var(--display);font-weight:700;font-size:clamp(34px,5.4vw,58px);line-height:.92;letter-spacing:-.015em}
.mast-name a{color:inherit}
.mast-name span{color:var(--accent)}
.mast-sub{font-size:11.5px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-3);margin-top:8px}
.mast-note{max-width:430px;border-left:1px solid var(--rule);padding-left:20px}
.mast-note p{margin:0;font-family:var(--display);font-size:18px;line-height:1.35;font-weight:500}
.mast-note small{display:block;font-family:var(--text);font-size:12.5px;line-height:1.5;color:var(--quiet);margin-top:7px}

.index{background:var(--ground-2);border-bottom:1px solid var(--ink);padding:0 var(--pad)}
.nav-row{display:flex;flex-wrap:wrap;align-items:stretch;justify-content:space-between;gap:0 clamp(14px,2vw,28px)}
.nav-sec{display:flex;align-items:center;gap:8px;padding:11px 0;color:var(--ink-2);font-size:12px;font-weight:600;letter-spacing:.11em;text-transform:uppercase;border-bottom:2px solid transparent}
.nav-sec .icon{width:1.5em;height:1.5em;stroke-width:1.4;color:var(--accent)}
.nav-sec:hover{color:var(--accent-ink)}
.nav-sec[aria-current]{color:var(--ink);border-bottom-color:var(--accent)}
.nav-ref{display:flex;align-items:center;padding:11px 0;font-size:12px;font-weight:600;letter-spacing:.11em;text-transform:uppercase;color:var(--quiet)}
.nav-ref:hover{color:var(--accent-ink)}
@media (max-width:760px){.nav-sec span{display:none}.nav-sec{padding:12px 0}.nav-row{gap:0 clamp(16px,5vw,30px)}.nav-ref{letter-spacing:.08em}}
.idx-num{font-variant-numeric:tabular-nums;color:var(--quiet);font-size:13px;font-family:var(--text);font-weight:600}

/* ---------- bands ---------- */
.band{padding:clamp(34px,5vw,64px) 0;border-bottom:1px solid var(--rule)}
.band > .inner{padding-inline:var(--pad)}
.band--tight{padding:clamp(26px,3.4vw,40px) 0}
.band-head{display:flex;flex-wrap:wrap;gap:12px 28px;align-items:flex-end;justify-content:space-between;margin-bottom:22px}
.band-head h2{font-size:clamp(26px,3.2vw,38px);font-weight:600;line-height:1.06}
.band-head p{margin:0;max-width:52ch;font-size:14.5px;line-height:1.6;color:var(--ink-3)}
.quiet-line{background:var(--secondary);color:#FBF3EE;padding:clamp(28px,4vw,46px) var(--pad);display:flex;align-items:center;gap:clamp(18px,3vw,36px);flex-wrap:wrap}
.quiet-line p{margin:0;font-family:var(--display);font-size:clamp(21px,2.5vw,29px);line-height:1.32;font-weight:500;max-width:38ch;text-wrap:pretty}
.quiet-line svg{flex:none;opacity:.85;max-width:150px}

/* lead */
.lead-band{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(420px,100%),1fr));gap:clamp(24px,3vw,52px);padding:clamp(30px,4vw,54px) var(--pad);border-bottom:1px solid var(--rule);align-items:start}
.lead-band h1{font-size:clamp(34px,4.6vw,60px);line-height:1.03;margin:14px 0 0;text-wrap:balance}
.lead-band .fig--plate img{aspect-ratio:16/10;object-fit:cover}
.lead-band .dek{font-size:clamp(17px,1.5vw,20px);line-height:1.55;color:var(--ink-2);font-weight:300;margin:16px 0 0}
.btn{display:inline-flex;align-items:center;gap:10px;margin-top:20px;font-size:12.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--plate);background:var(--accent);padding:12px 18px}
.btn:hover{background:var(--ink);color:var(--plate)}
.entry-line{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-ink)}

/* ---------- figures: three treatments, one system ---------- */
.article-figure{margin:30px 0}
.article-figure img{width:100%;height:auto}
.article-figure figcaption{font-family:var(--display);font-size:16.5px;line-height:1.45;font-weight:500;margin-top:11px;max-width:60ch}
.article-figure .credit,.credit{display:block;font-family:var(--text);font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--quiet);margin-top:6px;font-weight:500}
/* 1 · matted plate */
.fig--plate img{border:1px solid var(--rule);background:var(--plate);padding:12px}
.fig--plate figcaption{border-left:2px solid var(--accent);padding-left:12px}
/* 2 · full-bleed strip, caption in the margin */
.fig--strip{margin:38px 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:0;background:var(--ground-2)}
.fig--strip img{height:100%;min-height:220px;object-fit:cover}
.fig--strip figcaption{margin:0;padding:clamp(20px,2.8vw,38px);display:flex;flex-direction:column;justify-content:center;border-left:none}
/* 3 · inset in the column, prose beside it */
.fig--inset{float:right;width:min(42%,320px);margin:6px 0 18px 26px}
.fig--inset img{border:1px solid var(--rule)}
.fig--inset figcaption{font-size:14.5px;line-height:1.4}
.fig--wide{margin:34px 0}
.fig--wide img{border-top:3px solid var(--accent)}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr));gap:18px;margin:26px 0}
.gallery figure img{border:1px solid var(--rule);background:var(--plate);padding:8px}
.gallery figcaption{font-family:var(--display);font-size:14.5px;line-height:1.4;margin-top:8px}
.map-figure .map-slot{aspect-ratio:16/10;border:1px solid var(--rule);background:var(--ground-2)}

/* ---------- register tables ---------- */
.datatable,.versus{font-size:14.5px;border-top:2px solid var(--ink)}
.datatable caption,.versus caption{text-align:left;font-family:var(--display);font-weight:600;font-size:15px;padding-bottom:8px}
.datatable th,.versus th{background:var(--accent);color:var(--plate);font-family:var(--display);font-size:13.5px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;text-align:left;padding:11px 14px;vertical-align:bottom}
.datatable td,.versus td{padding:13px 14px;border-bottom:1px solid var(--rule);vertical-align:top;color:var(--ink-2)}
.datatable tbody tr:nth-child(even){background:var(--ground-2)}
.datatable td:first-child{font-family:var(--display);font-size:16.5px;font-weight:600;color:var(--ink)}
.versus td:first-child{font-weight:600;color:var(--ink)}
.state{display:inline-block;border:1px solid var(--rule);padding:3px 8px;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.state--night{border-color:var(--secondary);color:var(--secondary-ink);font-weight:600}
.tablewrap{overflow-x:auto}

/* ---------- section / entry lists ---------- */
.sec-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:0 clamp(24px,3vw,46px)}
.sec-row{display:grid;grid-template-columns:44px 1fr;gap:16px;padding:18px 0;border-top:1px solid var(--rule);color:var(--ink);align-items:start}
.sec-row:hover{color:var(--accent-ink)}
.sec-row .t{font-family:var(--display);font-size:23px;font-weight:600;line-height:1.15;display:block}
.sec-row .b{font-size:14px;line-height:1.55;color:var(--ink-3);display:block;margin-top:4px}
.sec-row .c{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--quiet);display:block;margin-top:6px}
.cat-list{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.cat-list li{border-bottom:1px solid var(--rule)}
.cat-list a{display:grid;grid-template-columns:minmax(0,1fr);gap:4px;padding:16px 0;color:var(--ink)}
.cat-list .t{font-family:var(--display);font-size:21px;font-weight:600;line-height:1.2}
.cat-list .b{font-size:14.5px;line-height:1.55;color:var(--ink-3);max-width:70ch}
.cat-list a:hover .t{color:var(--accent-ink)}

/* picks (cards, even height) */
.picks{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:clamp(20px,2.6vw,36px)}
.pick{display:flex;flex-direction:column;height:100%;color:var(--ink);background:var(--plate);border:1px solid var(--rule)}
.pick img{aspect-ratio:16/10;object-fit:cover;width:100%}
.pick .body{padding:16px 18px 18px;display:flex;flex-direction:column;flex:1;gap:8px}
.pick h3{font-size:21px;line-height:1.2;font-weight:600}
.pick p{margin:0;font-size:14.5px;line-height:1.55;color:var(--ink-3)}
.pick .meta{margin-top:auto;display:flex;align-items:center;gap:8px;font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--quiet)}
.pick:hover h3{color:var(--accent-ink)}

/* ---------- article ---------- */
.art-head{padding:clamp(28px,3.6vw,52px) 0 clamp(20px,2.4vw,32px);border-bottom:2px solid var(--ink)}
.art-head .inner{padding-inline:var(--pad);max-width:100ch;margin-inline:auto}
.art-head h1{font-size:clamp(31px,4.4vw,56px);line-height:1.04;margin:12px 0 0;text-wrap:balance}
.art-crumb{display:flex;flex-wrap:wrap;gap:10px;align-items:center;font-size:12.5px;color:var(--ink-3);padding:10px var(--pad);background:var(--ground-2);border-bottom:1px solid var(--rule)}
.art-body{font-size:19px;line-height:1.7;color:#22272B}
.art-body > *{max-width:var(--measure);margin-inline:auto;padding-inline:var(--pad)}
.art-body p{margin:0 auto 1.15em}
.art-body h2{max-width:var(--measure);font-size:clamp(24px,2.6vw,31px);line-height:1.15;font-weight:600;margin:34px auto 12px;padding-top:14px;border-top:2px solid var(--accent)}
.art-body h3{font-size:21px;margin:26px auto 8px}
.art-body ul,.art-body ol{margin:0 auto 1.2em;padding-left:calc(var(--pad) + 20px);padding-right:var(--pad)}
.art-body li{margin-bottom:.4em}
.art-body .article-figure,.art-body .callout,.art-body .statrow,.art-body .timeline,.art-body .pullquote,.art-body .blockquote,.art-body .tablewrap,.art-body .note,.art-body .further-grid,.art-body .related-links{max-width:var(--measure)}
.art-body .fig--strip,.art-body .fig--wide,.art-body .bleed{max-width:none;padding-inline:0}
.art-body .fig--wide img{width:100%}
.lead{font-size:clamp(19px,1.7vw,22px);line-height:1.5;font-weight:300;color:var(--ink-2)}
.pullquote{border-top:2px solid var(--secondary);border-bottom:1px solid var(--rule);margin:30px auto;padding-top:16px;padding-bottom:16px}
.pullquote p{font-family:var(--display);font-size:clamp(21px,2.3vw,27px);line-height:1.34;font-weight:500;margin:0;color:var(--ink);text-wrap:pretty}
.blockquote{margin:28px auto;border-left:3px solid var(--accent);}
.blockquote p{font-family:var(--display);font-size:19px;line-height:1.45;margin:0 0 8px}
.blockquote cite{font-size:13px;font-style:normal;color:var(--quiet);letter-spacing:.06em}
.callout{background:var(--ground-2);border:1px solid var(--rule);border-left:4px solid var(--accent);padding:18px 20px;margin:28px auto}
.callout p{margin:0;font-size:16.5px;line-height:1.55}
.note{font-size:15px;line-height:1.55;color:var(--ink-3);border-top:1px solid var(--rule);padding-top:10px}
.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(150px,100%),1fr));gap:1px;background:var(--rule);border:1px solid var(--rule);margin:30px auto}
.statblock{background:var(--plate);padding:16px 16px 18px;display:flex;flex-direction:column;gap:6px}
.stat-num{font-family:var(--display);font-size:clamp(24px,2.6vw,32px);font-weight:700;line-height:1;color:var(--accent-ink);font-variant-numeric:tabular-nums}
.stat-label{font-size:13px;line-height:1.45;color:var(--ink-3)}
.timeline{list-style:none;margin:30px auto;padding-left:var(--pad);padding-right:var(--pad);border-top:2px solid var(--ink)}
.timeline li{display:grid;grid-template-columns:minmax(110px,190px) minmax(0,1fr);gap:8px 22px;padding:13px 0;border-bottom:1px solid var(--rule)}
.t-when{font-family:var(--display);font-weight:600;font-size:16px;color:var(--accent-ink)}
.t-what{font-size:15.5px;line-height:1.55;color:var(--ink-2)}
.steps{counter-reset:s;list-style:none;margin:30px auto;padding-left:var(--pad);padding-right:var(--pad)}
.steps li{counter-increment:s;display:grid;grid-template-columns:34px minmax(0,1fr);gap:16px;padding:11px 0;border-bottom:1px solid var(--rule);font-size:15.5px;line-height:1.55;color:var(--ink-2)}
.steps li::before{content:counter(s,decimal-leading-zero);font-family:var(--text);font-weight:600;font-size:13px;letter-spacing:.08em;color:var(--accent);padding-top:2px}
.bleed-notes{background:var(--accent);color:#EEF1FB;padding:clamp(24px,3vw,40px) var(--pad);margin:36px 0}
.bleed-notes h3{color:var(--plate);font-size:13px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;font-family:var(--text);margin-bottom:16px}
.bleed-notes .statrow{background:rgba(255,255,255,.28);border-color:rgba(255,255,255,.35);margin:0 auto;max-width:1100px}
.bleed-notes .statblock{background:rgba(20,24,28,.16)}
.bleed-notes .stat-num{color:#FFF}
.bleed-notes .stat-label{color:#DCE3F8}
.further-grid,.related-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr));gap:14px;margin:26px auto;list-style:none;padding-left:var(--pad);padding-right:var(--pad)}
.further-grid a,.related-links a{display:block;background:var(--plate);border:1px solid var(--rule);border-top:3px solid var(--accent);padding:14px 16px;font-family:var(--display);font-size:17px;font-weight:600;line-height:1.25;color:var(--ink);height:100%}
.further-grid a:hover,.related-links a:hover{color:var(--accent-ink)}
.entity-ref{font-weight:500}
.art-foot{padding:26px var(--pad) 40px;border-top:1px solid var(--rule);display:flex;flex-wrap:wrap;gap:14px 30px;font-family:var(--display);font-size:17px;font-weight:600}

/* profile / org cards (styleguide + about) */
.profile-grid,.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:18px}
.profile-card{background:var(--plate);border:1px solid var(--rule);padding:18px;display:flex;flex-direction:column;gap:8px;height:100%}
.profile-card .p-photo{aspect-ratio:1;object-fit:cover;width:84px;border-radius:50%}
.profile-card h3{font-size:20px}
.profile-card .p-role{margin:0;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--quiet)}
.profile-card p{margin:0;font-size:14.5px;line-height:1.55;color:var(--ink-3)}
.profile-card .p-links{margin-top:auto}
.org-card{display:flex;flex-direction:column;gap:6px;background:var(--dark);border:1px solid var(--ink);padding:14px;height:100%}
.org-logo{max-height:40px;width:auto;object-fit:contain}
.org-name{font-family:var(--display);font-size:17px;font-weight:600;color:var(--plate)}
.org-host{font-size:12px;color:#9AA3AA}

/* ---------- colophon: supporters ---------- */
.colophon{background:var(--ground-2);border-top:2px solid var(--ink);border-bottom:1px solid var(--rule);padding:clamp(26px,3.4vw,44px) var(--pad)}
.colophon-head{display:flex;flex-wrap:wrap;gap:8px 26px;align-items:baseline;justify-content:space-between;margin-bottom:8px}
.colophon-head h2{font-family:var(--display);font-size:clamp(21px,2.2vw,26px);font-weight:600}
.colophon-head p{margin:0;font-size:13.5px;color:var(--ink-3);max-width:56ch}
.tier{margin-top:20px}
.tier-label{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--quiet);border-bottom:1px solid var(--rule);padding-bottom:6px;margin-bottom:14px}
/* count-agnostic: tiles share each row's width, so every row fills, last row included */
.sponsor-row{display:flex;flex-wrap:wrap;gap:14px;align-items:stretch}
.sponsor{flex:1 1 238px;min-width:238px;max-width:100%;height:178px;box-sizing:border-box;background:var(--dark);border:1px solid var(--ink);padding:16px 18px;display:flex;flex-direction:column;gap:10px;color:var(--plate);overflow:hidden}
.sponsor img{max-height:46px;max-width:100%;width:auto;height:auto;object-fit:contain;object-position:left center;flex:none}
.sponsor-name{flex:none;margin-top:auto;font-family:var(--display);font-size:16px;font-weight:600;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sponsor-blurb{flex:none;font-size:13px;line-height:1.5;color:#B9C1C8}
.sponsor:hover{border-color:var(--accent)}
.sponsor:hover .sponsor-name{color:#C9D4FF}
@media (max-width:620px){.sponsor{min-width:100%;height:auto;min-height:178px}}

/* ---------- footer ---------- */
.foot{background:var(--dark);color:#E6E1D8;border-top:6px solid var(--accent);padding:40px var(--pad) 54px;display:flex;flex-wrap:wrap;gap:18px 40px;align-items:flex-end;justify-content:space-between}
.foot .n{font-family:var(--display);font-size:26px;font-weight:700;color:#F4F1EA}
.foot .n span{color:#8CA3FF}
.foot p{margin:6px 0 0;font-size:13px;line-height:1.6;color:#8A9299;max-width:52ch}
.foot nav{display:flex;flex-wrap:wrap;gap:10px 24px;font-size:12px;font-weight:600;letter-spacing:.15em;text-transform:uppercase}
.foot nav a{color:#C6D0F5}
.foot nav a:hover{color:var(--secondary)}

/* ---------- drawings ---------- */
.drawing{border:1px solid var(--accent);background:var(--plate);padding:clamp(14px,2vw,22px);color:var(--accent)}
.drawing svg{display:block;width:100%;height:auto}
.drawn-band{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(460px,100%),1fr));gap:clamp(22px,3vw,40px);align-items:start}

@media (max-width:700px){
  body{font-size:16px}
  .art-body{font-size:17.5px}
  .fig--inset{float:none;width:100%;margin:22px 0}
  .mast-note{border-left:none;padding-left:0}
  .timeline li{grid-template-columns:minmax(0,1fr)}
}
@media print{
  .index,.colophon{display:none}
  body{background:#fff}
}

/* charts + inline refs */
.entity-ref::after{content:" \2197";font-size:.78em;color:var(--quiet)}
.chart{margin:30px auto}
.chart svg{width:100%;height:auto;overflow:visible}
.chart figcaption{font-family:var(--display);font-size:15.5px;line-height:1.45;margin-top:10px;color:var(--ink-2)}
.chart .bar-label{font-family:var(--text);font-size:11.5px;fill:var(--ink-2)}
.chart .bar-val{font-family:var(--text);font-size:11.5px;font-weight:600;fill:var(--accent-ink)}
.sg-sec{padding:34px var(--pad);border-bottom:1px solid var(--rule)}
.sg-sec > h2{font-size:24px;font-weight:600;margin-bottom:4px}
.sg-sec > p.k{margin:0 0 18px;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--quiet)}
.sg-sec .art-body > *{padding-inline:0;margin-inline:0}
.sg-narrow{max-width:380px;border:1px dashed var(--rule);padding:12px;margin-top:20px}

.factgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr));gap:1px;background:rgba(255,255,255,.32);border:1px solid rgba(255,255,255,.4);max-width:1100px;margin:0 auto}
.factgrid > div{background:rgba(20,24,28,.18);padding:15px 16px 17px;display:flex;flex-direction:column;gap:6px}
.f-k{font-size:11.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#C6D0F5}
.f-v{font-family:var(--display);font-size:18px;line-height:1.35;font-weight:600;color:#FFF}

header.band .article-figure img{aspect-ratio:16/10;object-fit:cover}

/* hard data in prose, and section run-ins */
.qty{font-variant-numeric:tabular-nums;font-feature-settings:"tnum";font-weight:600;color:var(--accent-ink);white-space:nowrap}
.bleed-notes .qty,.foot .qty{color:#C9D4FF}
.runin{font-family:var(--display);font-weight:700;font-size:1.02em;letter-spacing:-.005em}
.closing-ref{max-width:none;padding:clamp(24px,3vw,38px) 0 6px;margin:34px 0 0;border-top:2px solid var(--ink);background:var(--ground-2)}
.closing-ref > h3{max-width:var(--measure);margin:0 auto 18px;padding-inline:var(--pad);font-family:var(--text);font-size:11.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--quiet)}
.closing-ref > *{margin-bottom:26px}
.closing-ref .datatable,.closing-ref .callout,.closing-ref .timeline,.closing-ref .steps,.closing-ref .tablewrap,.closing-ref .bleed-notes{max-width:var(--measure);margin-inline:auto}
.closing-ref .callout,.closing-ref .tablewrap,.closing-ref .datatable{margin-inline:auto;box-sizing:border-box}
.closing-ref > .tablewrap,.closing-ref > .callout{padding-inline:0}
.closing-ref .timeline,.closing-ref .steps{padding-inline:var(--pad)}
.closing-ref .callout{background:var(--plate)}

/* mobile tap targets: every standalone link gets a 44px row */
@media (max-width:700px){
  .art-crumb{gap:6px 12px;padding-block:6px}
  .art-crumb a{display:inline-flex;align-items:center;min-height:44px}
  .art-foot{gap:0 26px}
  .art-foot a{display:inline-flex;align-items:center;min-height:44px}
  .foot nav{gap:0 22px}
  .foot nav a{display:inline-flex;align-items:center;min-height:44px}
  .idx li a,.cat-list a,.related-links a,.further-grid a{min-height:44px;display:flex;align-items:center}
  .related-links a,.further-grid a{align-items:flex-start}
}

/* 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-domain-override: per-domain, from work/css_override.css */
/* kcho — the supporter grid never fills its row at ANY width.
   Design sizes the tracks in fixed pixels, so: at 1900px ten 238px tiles sit 5-across and leave
   ~700px of dead space on the right; at 390px the same five columns squeeze to 60px each and the
   names truncate to "Swe…".
   Fix: fractional tracks at every breakpoint so the row always uses the width it is given, with the
   column COUNT stepping down as the screen narrows. Tile styling, colours, order and tiers are
   Design's and are untouched — only the track sizing.
   Verified: 2000px -> 100% fill; 1440px -> 100%; 390px -> single column, 0 truncation, 0 overflow. */
.sponsor-row{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  width:100%!important;
  align-items:stretch!important;
}
.sponsor-row > *{ min-width:0!important; width:auto!important; max-width:none!important; }
@media (max-width:1100px){ .sponsor-row{ grid-template-columns:repeat(3,minmax(0,1fr))!important; } }
@media (max-width:760px){  .sponsor-row{ grid-template-columns:repeat(2,minmax(0,1fr))!important; } }
@media (max-width:460px){  .sponsor-row{ grid-template-columns:1fr!important; } }

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

/* op-money-columns: the supporters block ran one tile per row — 10 tiles,
   1892px at 390, 21% of the whole page. Two columns bring it to
   1124px (41% shorter). Checked before writing: no new overflow, smallest mark still
   129px wide, longest blurb 3 lines, tile heights 178-178px.
   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. 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}
  .sponsor-row .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical;overflow:hidden!important}
}

/* op-odd-tier-lead: .sponsor-row (5 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-name-wrap: at 320 the money tile truncated its brand name — "Girlfriends Films" — losing up to 23px to an
   ellipsis. The name is allowed to wrap instead of being cut: a brand that reads as half a word
   is worse than a brand on two lines. Structural only, phone widths only, desktop untouched. */
@media (max-width:360px){
  .sponsor-name{white-space:normal!important;overflow-wrap:anywhere;text-overflow:clip}
}
/* op-heading-levels */
h2:where(.rt-h3){font-family: var(--display); font-weight: 700; letter-spacing: -0.01em; margin: 0px;}
h2:where(.rt-h3p8707ca){font-family: var(--display); font-weight: 700; letter-spacing: -0.01em; margin: 0px;}
.art-body h2:where(.rt-h3){font-size: 21px; margin: 26px auto 8px;}
.art-body h2:where(.rt-h3p8707ca){font-size: 21px; margin: 26px auto 8px;}
.closing-ref > h2:where(.rt-h3){max-width: var(--measure); margin: 0px auto 18px; padding-inline: var(--pad); font-family: var(--text); font-size: 11.5px; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: var(--quiet);}
.closing-ref > h2:where(.rt-h3p8707ca){max-width: var(--measure); margin: 0px auto 18px; padding-inline: var(--pad); font-family: var(--text); font-size: 11.5px; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: var(--quiet);}
h2.rt-h3.rt-h3{height:35.6875px;padding-top:0px;border-top-width:0px;border-top-style:none;border-top-color:rgb(45, 73, 184);line-height:35.7px;max-width:none}
h2.rt-h3.rt-h3{height:19.5469px;border-top-color:rgb(138, 144, 149);line-height:19.55px;max-width:770px}
h2.rt-h3.rt-h3{height:35.6875px;border-top-color:rgb(45, 73, 184);line-height:35.7px;max-width:none}
h2.rt-h3p8707ca.rt-h3p8707ca{height:19.5469px;padding-top:0px;border-top-width:0px;border-top-style:none;border-top-color:rgb(138, 144, 149);line-height:19.55px}
/* op-heading-levels:end */
html body .sponsor-row.sponsor-row > [data-partner] .sponsor-blurb.sponsor-blurb.sponsor-blurb{flex:0 0 auto!important;display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:3!important;max-height:3lh!important;overflow:hidden!important}
