/* artween.com — Middle Grey
   Palette roles:
     --ground     graphite page ground
     --ink        type on the ground / paper panels
     --accent     electric blue — band and panel grounds, links on paper
     --secondary  acid — kickers, numbers, section marks on the ground
     --grey       supporting rules and quiet meta
*/
:root{
  --ground:#17181B;
  --ground-2:#1D1F23;
  --ground-3:#0F1013;
  --paper:#E9E6DE;
  --ink:#E9E6DE;
  --ink-2:#C6C9CE;
  --ink-dark:#17181B;
  --ink-dark-2:#3B3D42;
  --accent:#2B4BFF;
  --accent-lo:#DCE1FF;
  --accent-hi:#6A80FF;
  --secondary:#CFE800;
  --grey:#7A7E86;
  --grey-2:#9BA0A8;
  --rule:#34373D;
  --rule-2:#26282D;
  --rule-paper:#C7C3B9;

  --sans:"Chivo","Helvetica Neue",Helvetica,sans-serif;
  --mono:"Sometype Mono",ui-monospace,SFMono-Regular,Menlo,monospace;

  --pad:clamp(18px,4vw,44px);
  --measure:70ch;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--ground);color:var(--ink);
  font-family:var(--sans);font-size:17px;line-height:1.55;
  text-wrap:pretty;overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:var(--secondary);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px}
h1,h2,h3,h4{margin:0;font-weight:800;letter-spacing:-.025em;line-height:1.05}
p{margin:0 0 1.15em}
figure{margin:0}
table{border-collapse:collapse;width:100%}
svg{display:block}
.wrap{max-width:1320px;margin:0 auto;padding-inline:var(--pad)}
.narrow{max-width:1080px;margin:0 auto;padding-inline:var(--pad)}
.kicker{font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--secondary);margin:0 0 14px;display:flex;align-items:center;gap:9px}
.kicker--quiet{color:var(--grey)}
.meta{font-family:var(--mono);font-size:12.5px;letter-spacing:.05em;color:var(--grey-2)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;background:var(--secondary);color:var(--ink-dark);padding:10px 14px;z-index:99}

/* ---------- masthead ---------- */
.masthead{border-bottom:1px solid var(--rule);background:var(--ground)}
.masthead__bar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:20px}
.wordmark{display:flex;align-items:center;gap:12px;color:var(--ink)}
.wordmark:hover{text-decoration:none}
.wordmark svg{color:var(--secondary);flex:none}
.wordmark b{font-size:clamp(20px,2.4vw,26px);font-weight:800;letter-spacing:-.03em;text-transform:lowercase}
.strapline{font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--grey);text-align:right;max-width:30ch}

/* ---------- nav ---------- */
.nav{border-bottom:1px solid var(--rule)}
.nav__list{display:flex;flex-wrap:wrap;list-style:none;margin:0;padding:0;font-family:var(--mono);font-size:11.5px;letter-spacing:.07em;text-transform:uppercase}
.nav__list>li{border-right:1px solid var(--rule)}
.nav__list>li:first-child a{padding-left:0}
.nav__list>li.nav__end{border-right:0;margin-left:auto}
.nav__list a{display:flex;align-items:center;gap:8px;padding:14px 17px;color:var(--ink-2);min-height:44px}
.nav__list a:hover{color:var(--secondary);text-decoration:none;background:var(--ground-2)}
.nav__list a[aria-current="page"]{color:var(--secondary)}
.nav__list svg{width:15px;height:15px;flex:none}
.nav__no{color:var(--grey);margin-right:-2px}
.nav__toggle,.nav__label{display:none}

/* ---------- register rows (the site's core list component) ---------- */
.reg{margin:0;padding:0;list-style:none;border-top:1px solid var(--rule)}
.reg__head,.reg__row{display:grid;grid-template-columns:56px minmax(0,1fr) 200px minmax(0,300px);gap:0 18px;align-items:baseline}
.reg__head{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey);padding:10px 0;border-bottom:1px solid var(--rule)}
.reg__row{padding:17px 0;border-bottom:1px solid var(--rule-2)}
.reg__row:hover{background:var(--ground-2)}
.reg__no{font-family:var(--mono);font-size:13px;color:var(--secondary)}
.reg__title{font-size:clamp(19px,1.5vw,22px);font-weight:700;letter-spacing:-.015em;line-height:1.2}
.reg__title a{color:var(--ink)}
.reg__title a:hover{color:var(--secondary)}
.reg__sec{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--grey-2);display:flex;gap:7px;align-items:center}
.reg__sec svg{width:14px;height:14px;flex:none}
.reg__what{font-size:15px;line-height:1.5;color:var(--grey-2)}
.reg__foot{font-family:var(--mono);font-size:12px;color:var(--grey);padding-top:14px}

/* ---------- bands ---------- */
.band{padding-block:clamp(40px,5vw,64px)}
.band--blue{background:var(--accent);color:#fff}
.band--blue a,.lead-band a{color:#fff}
.band--blue .kicker,.lead-band .kicker{color:var(--accent-lo)}
.band--paper{background:var(--paper);color:var(--ink-dark)}
.band--paper a{color:var(--accent)}
.band--paper .kicker{color:var(--accent)}
.band--paper .meta{color:#6F7178}
.band--dark{background:var(--ground-3)}
.band__head{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;align-items:baseline;margin-bottom:22px}
.band__head .meta{max-width:44ch}

/* ---------- lead / hero ---------- */
.lead-band{background:var(--accent);color:#fff;padding-block:clamp(40px,5vw,60px)}
.lead-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,470px);gap:clamp(28px,4vw,52px);align-items:start}
.lead-grid h1{font-size:clamp(34px,4.6vw,58px);letter-spacing:-.035em;line-height:1.02;margin-bottom:18px}
.lead-grid .lead{font-size:clamp(17px,1.4vw,19px);line-height:1.5;color:var(--accent-lo);max-width:36em}
.factstrip{display:flex;flex-wrap:wrap;gap:12px 34px;font-family:var(--mono);font-size:12.5px;border-top:1px solid var(--accent-hi);padding-top:16px;margin-top:24px}
.factstrip dt{color:var(--accent-lo);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase}
.factstrip dd{margin:2px 0 0}
.factstrip>div{min-width:0}

/* ---------- figure system ----------
   1. .fig-cell   specimen cell: hairline frame + data strip, caption inside
   2. .fig-plate  full-bleed plate on a colour ground, caption reversed out beside it
   3. .fig-inset  small inset in the reading column, hanging caption
*/
.fig-cell{border:1px solid var(--rule);background:var(--ground)}
.band--paper .fig-cell,.fig-cell--paper{border-color:var(--ink-dark)}
.band--blue .fig-cell,.lead-band .fig-cell{border-color:#fff}
.fig-cell__strip{display:flex;justify-content:space-between;gap:12px;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--grey);padding:9px 12px;border-bottom:1px solid var(--rule)}
.band--paper .fig-cell__strip{color:#6F7178;border-bottom-color:var(--ink-dark)}
.band--blue .fig-cell__strip,.lead-band .fig-cell__strip{color:var(--accent-lo);border-bottom-color:#fff}
.fig-cell img{width:100%;aspect-ratio:16/10;object-fit:cover}
.fig-cell figcaption{padding:14px;border-top:1px solid var(--rule);font-size:16px;line-height:1.45}
.band--paper .fig-cell figcaption{border-top-color:var(--ink-dark)}
.band--blue .fig-cell figcaption,.lead-band .fig-cell figcaption{border-top-color:#fff}

.fig-plate{background:var(--accent);color:#fff;padding:clamp(24px,3vw,40px) 0}
.fig-plate:not(.fig-bleed){display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,380px);gap:clamp(24px,3vw,44px);align-items:center}
.fig-plate.fig-bleed{display:block}
.fig-plate img{width:100%;aspect-ratio:16/10;object-fit:cover}
.fig-plate figcaption{font-size:clamp(17px,1.5vw,20px);line-height:1.4}
.fig-plate--dark{background:var(--ground-3)}
.fig-bleed{margin-inline:calc(50% - 50vw);width:100vw;max-width:100vw}
.fig-bleed>.wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,380px);gap:clamp(24px,3vw,44px);align-items:center}

.fig-inset{border-left:3px solid var(--secondary);padding-left:20px;margin:34px 0}
.fig-inset img{width:100%;aspect-ratio:16/10;object-fit:cover}
.fig-inset figcaption{padding-top:12px;font-size:15.5px;line-height:1.5;color:var(--ink-2)}
.band--paper .fig-inset figcaption{color:var(--ink-dark-2)}

.credit{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;color:var(--grey);margin-top:8px;text-transform:none}
.band--paper .credit{color:#83857F}
.band--blue .credit,.lead-band .credit{color:var(--accent-lo)}
.fig-cap-kicker{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--secondary);display:block;margin-bottom:7px}
.band--paper .fig-cap-kicker{color:var(--accent)}
.band--blue .fig-cap-kicker,.lead-band .fig-cap-kicker{color:#fff}

.article-figure{margin:34px 0;border:1px solid var(--rule)}
.article-figure img{width:100%;aspect-ratio:16/10;object-fit:cover}
.article-figure figcaption{padding:14px;border-top:1px solid var(--rule);font-size:15.5px;line-height:1.5;color:var(--ink-2)}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin:34px 0}
.gallery figure{border:1px solid var(--rule)}
.gallery img{width:100%;aspect-ratio:16/10;object-fit:cover}
.gallery figcaption{padding:11px 12px;font-size:14px;line-height:1.45;color:var(--grey-2)}
.map-figure{border:1px solid var(--rule);padding:12px}
.map-figure .map-slot{aspect-ratio:16/10;background:var(--ground-2)}

/* ---------- article ---------- */
.art-head{background:var(--paper);color:var(--ink-dark);padding-block:clamp(34px,4vw,52px)}
.art-head__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,340px);gap:clamp(24px,4vw,56px);align-items:end}
.art-head h1{font-size:clamp(32px,4.4vw,56px);letter-spacing:-.035em;line-height:1}
.art-head .lead{margin:18px 0 0;font-size:clamp(17px,1.5vw,20px);line-height:1.45;color:var(--ink-dark-2);max-width:34em;font-weight:400}
.art-head .kicker{color:var(--accent)}
.spec{font-family:var(--mono);font-size:12.5px;line-height:1.75;border-top:1px solid var(--ink-dark);padding-top:14px;margin:0}
.spec div{display:flex;justify-content:space-between;gap:16px}
.spec dt{color:#6F7178}
.spec dd{margin:0;text-align:right}
.art-body{max-width:var(--measure);font-size:19px;line-height:1.65;color:var(--ink-2)}
.art-body h2{margin:42px 0 16px;font-size:clamp(24px,2.4vw,30px);color:var(--ink);letter-spacing:-.02em;line-height:1.15}
.art-body a{color:var(--secondary);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.art-body p strong{color:var(--ink)}
.art-wide{max-width:none}
.art-body>.fig-inset,.art-body>.article-figure{max-width:none}

.lead{font-size:1.12em;line-height:1.5}
.pullquote{margin:34px 0;border-left:3px solid var(--secondary);padding:4px 0 4px 22px}
.pullquote p{margin:0;font-size:clamp(22px,2.2vw,27px);font-weight:700;letter-spacing:-.02em;line-height:1.25;color:var(--ink)}
.band--paper .pullquote p{color:var(--ink-dark)}
.blockquote{margin:34px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:20px 0}
.blockquote p{font-size:20px;line-height:1.45;margin:0 0 10px;color:var(--ink)}
.blockquote cite{font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--grey);font-style:normal}
.callout{margin:34px 0;background:var(--accent);color:#fff;padding:22px 24px}
.callout p{margin:0;font-size:18px;line-height:1.45}
.note{font-family:var(--mono);font-size:14px;line-height:1.65;color:var(--grey-2);border-top:1px solid var(--rule);padding-top:12px}

/* ---------- notes-for-design interruption bands ---------- */
.notes-band{background:var(--ground-3);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding-block:clamp(30px,3.5vw,44px);margin-block:clamp(36px,4vw,52px)}
.notes-band--paper{background:var(--paper);color:var(--ink-dark);border-color:var(--ink-dark)}
.notes-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:0}
.note-item{display:grid;grid-template-columns:44px minmax(0,1fr);gap:0 16px;align-items:start;padding:16px 26px 16px 0;border-top:1px solid var(--rule-2)}
.notes-band--paper .note-item{border-top-color:var(--rule-paper)}
.note-item__no{font-family:var(--mono);font-size:12.5px;color:var(--secondary);padding-top:3px}
.notes-band--paper .note-item__no{color:var(--accent)}
.note-item__t{font-size:17.5px;font-weight:700;letter-spacing:-.01em;margin:0 0 5px}
.note-item__d{font-size:15.5px;line-height:1.5;color:var(--grey-2);margin:0}
.notes-band--paper .note-item__d{color:var(--ink-dark-2)}

/* ---------- data components ---------- */
.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--rule);margin:34px 0}
.statblock{background:var(--ground);padding:20px 18px;display:flex;flex-direction:column;gap:6px}
.band--paper .statblock{background:var(--paper)}
.stat-num{font-family:var(--mono);font-size:clamp(26px,3vw,34px);line-height:1;color:var(--secondary)}
.band--paper .stat-num{color:var(--accent)}
.stat-label{font-family:var(--mono);font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--grey)}
.versus,.datatable{margin:34px 0;font-size:16px}
.versus th,.versus td,.datatable th,.datatable td{text-align:left;padding:13px 16px 13px 0;border-bottom:1px solid var(--rule-2);vertical-align:top}
.versus th,.datatable th{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey);border-bottom:1px solid var(--rule)}
.versus td:first-child,.datatable td:first-child{font-weight:700}
.band--paper .versus td,.band--paper .datatable td{border-bottom-color:var(--rule-paper)}
.timeline{list-style:none;margin:34px 0;padding:0;border-top:1px solid var(--rule)}
.timeline li{display:grid;grid-template-columns:minmax(140px,240px) minmax(0,1fr);gap:6px 22px;padding:15px 0;border-bottom:1px solid var(--rule-2)}
.t-when{font-family:var(--mono);font-size:12.5px;letter-spacing:.05em;color:var(--secondary);line-height:1.5}
.t-what{font-size:16px;line-height:1.5;color:var(--ink-2)}
.chart{margin:34px 0}
.chart svg{width:100%;height:auto}
.chart figcaption{font-family:var(--mono);font-size:12px;color:var(--grey);padding-top:10px}
.bars{display:grid;gap:1px;background:var(--rule);margin:34px 0}
.bar-row{display:grid;grid-template-columns:minmax(120px,180px) minmax(90px,120px) minmax(0,1fr);gap:0 16px;align-items:center;background:var(--ground);padding:13px 0}
.band--paper .bar-row{background:var(--paper)}
.bar-row__k{font-family:var(--mono);font-size:14px}
.bar-row__v{font-family:var(--mono);font-size:14px;color:var(--grey-2)}
.bar-row__b{height:10px;background:var(--accent)}
.band--paper .bar-row__b{background:var(--accent)}

/* ---------- cards, lists, references ---------- */
.cat-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.cat-list li{border-bottom:1px solid var(--rule-2)}
.cat-list a{display:grid;grid-template-columns:56px minmax(0,1fr) minmax(0,320px);gap:6px 18px;align-items:baseline;padding:18px 0;color:var(--ink)}
.cat-list a:hover{text-decoration:none;background:var(--ground-2)}
.cat-list a:hover .cat-list__t{color:var(--secondary)}
.band--paper .cat-list a{color:var(--ink-dark)}
.band--paper .cat-list a:hover{background:#DFDBD0}
.cat-list__n{font-family:var(--mono);font-size:13px;color:var(--secondary)}
.band--paper .cat-list__n{color:var(--accent)}
.cat-list__t{font-size:21px;font-weight:700;letter-spacing:-.015em;line-height:1.2}
.cat-list__d{font-size:15px;line-height:1.5;color:var(--grey-2)}
.band--paper .cat-list__d{color:var(--ink-dark-2)}

.sec-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:1px;background:var(--rule)}
.sec-card{background:var(--ground);padding:26px 24px 24px;display:flex;flex-direction:column;gap:12px;min-height:100%}
.sec-card__h{display:flex;gap:10px;align-items:center;font-family:var(--mono);font-size:11.5px;letter-spacing:.13em;text-transform:uppercase}
.sec-card__h svg{width:18px;height:18px;flex:none;color:var(--secondary)}
.sec-card__h a{color:var(--ink)}
.sec-card__b{font-size:15.5px;line-height:1.5;color:var(--grey-2);margin:0}
.sec-card ul{list-style:none;margin:auto 0 0;padding:0;display:flex;flex-direction:column;gap:9px}
.sec-card li{font-size:17.5px;line-height:1.25;font-weight:600;letter-spacing:-.01em}
.sec-card li a{color:var(--ink)}
.sec-card li a:hover{color:var(--secondary)}

.further-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:1px;background:var(--rule);margin:0}
.further-grid a{background:var(--ground);padding:20px;font-size:19px;font-weight:700;letter-spacing:-.015em;line-height:1.2;color:var(--ink);display:flex;min-height:96px}
.further-grid a:hover{text-decoration:none;color:var(--secondary);background:var(--ground-2)}
.related-links{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:1px;background:var(--rule)}
.related-links li{background:var(--ground)}
.related-links li a{display:flex;flex-direction:column;gap:7px;padding:18px 20px;min-height:96px;color:var(--ink);font-size:18.5px;font-weight:700;letter-spacing:-.015em;line-height:1.2}
.related-links li a:hover{text-decoration:none;color:var(--secondary);background:var(--ground-2)}
.related-links .meta{font-weight:400;letter-spacing:.05em}

.profile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:1px;background:var(--rule);margin:34px 0}
.profile-card{background:var(--ground);padding:22px;display:flex;flex-direction:column;gap:10px}
.profile-card .p-photo{width:100%;aspect-ratio:16/10;object-fit:cover}
.profile-card h3{font-size:20px}
.p-role{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--secondary);margin:0}
.profile-card p{font-size:15.5px;line-height:1.5;color:var(--grey-2);margin:0}
.p-links a,.p-attr{font-family:var(--mono);font-size:12.5px}
.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:1px;background:var(--rule);margin:34px 0}
.org-card{background:var(--ground);padding:18px;display:flex;flex-direction:column;gap:8px;color:var(--ink)}
.org-card:hover{text-decoration:none;background:var(--ground-2)}
.org-logo{height:34px;width:auto;max-width:100%;object-fit:contain;object-position:left center}
.org-name{font-size:17px;font-weight:700}
.org-host{font-family:var(--mono);font-size:12px;color:var(--grey)}
.entity-ref{white-space:nowrap}

/* ---------- supporters ---------- */
.sup{border-top:1px solid var(--rule);padding-block:clamp(24px,3vw,34px)}
.sup__head{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:baseline;justify-content:space-between;margin-bottom:18px}
.sup__label{font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--secondary);display:flex;gap:9px;align-items:center}
.sup__label svg{width:16px;height:16px;flex:none}
.sup__note{font-family:var(--mono);font-size:11.5px;letter-spacing:.05em;color:var(--grey)}
.sup__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,268px),1fr));gap:14px}
.sup__grid--five{grid-template-columns:repeat(auto-fill,minmax(min(100%,212px),1fr))}
/* specimen list (paper band) */
.speclist{border-top:1px solid var(--ink-dark);margin:0}
.speclist__head,.speclist__row{display:grid;grid-template-columns:176px 190px minmax(0,1fr) 260px;gap:0 24px;align-items:start}
.speclist__head{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:#6F7178;padding:10px 0;border-bottom:1px solid var(--ink-dark)}
.speclist__row{padding:16px 0;border-bottom:1px solid var(--rule-paper)}
.speclist__row img{width:100%;aspect-ratio:16/10;object-fit:cover}
.speclist__n{font-size:19px;font-weight:700;letter-spacing:-.01em}
.speclist__w{font-size:16px;line-height:1.5;color:var(--ink-dark-2);margin:0}
.speclist__r{font-family:var(--mono);font-size:13px;line-height:1.6}
.sponsor{background:var(--ground-2);border:1px solid var(--rule);padding:16px;display:flex;flex-direction:column;gap:12px;color:var(--ink);min-width:0}
.sponsor:hover{text-decoration:none;border-color:var(--accent-hi);background:#212429}
.sponsor img{width:100%;height:52px;max-height:52px;object-fit:contain;object-position:left center;background:var(--ground-3);padding:6px 10px}
.sponsor-name{font-size:16.5px;font-weight:700;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sponsor-blurb{font-size:14px;line-height:1.5;color:var(--grey-2);min-width:200px}

/* ---------- footer ---------- */
.foot{background:var(--ground-3);border-top:1px solid var(--rule);padding-block:34px;margin-top:clamp(40px,5vw,70px)}
.foot__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:28px}
.foot__sections{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr));gap:12px 22px;align-content:start;list-style:none;margin:0;padding:0}
.foot__sections a{display:flex;gap:8px;align-items:center;font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);min-height:24px}
.foot__sections svg{width:14px;height:14px;flex:none}
.foot p{font-size:14px;line-height:1.6;color:var(--grey);margin:0 0 10px;max-width:40ch}
.foot__legal{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;color:var(--grey);border-top:1px solid var(--rule);margin-top:26px;padding-top:16px;display:flex;flex-wrap:wrap;gap:8px 22px}

/* ---------- collapsible ---------- */
.more{margin-top:14px}
.more input{position:absolute;opacity:0;pointer-events:none}
.more__rest{display:none}
.more input:checked~.more__rest{display:block}
.more__btn{display:inline-flex;align-items:center;gap:9px;min-height:44px;font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--secondary);cursor:pointer}
.band--paper .more__btn{color:var(--accent)}
.more input:checked~.more__btn{display:none}

/* ---------- responsive ---------- */
@media (max-width:1180px){
  .nav__list{font-size:11px;letter-spacing:.05em}
  .nav__list a{padding:13px 11px;gap:6px}
}
@media (max-width:1080px){
  .speclist__head,.speclist__row{grid-template-columns:140px 160px minmax(0,1fr)}
  .speclist__head :nth-child(4),.speclist__row .speclist__r{display:none}
  .reg__head,.reg__row{grid-template-columns:44px minmax(0,1fr) 170px}
  .reg__head :nth-child(4),.reg__row .reg__what{display:none}
  .cat-list a{grid-template-columns:44px minmax(0,1fr)}
  .cat-list__d{grid-column:2}
}
@media (max-width:900px){
  .foot__sections a{min-height:44px}
  .lead-grid,.art-head__grid,.fig-plate,.fig-bleed>.wrap,.foot__grid{grid-template-columns:minmax(0,1fr)}
  .nav__label{display:flex;align-items:center;gap:10px;min-height:44px;padding:11px 0;font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--secondary);cursor:pointer}
  .nav__list{display:none;padding-bottom:10px}
  .nav__toggle:checked~.nav__list{display:block}
  .nav__list>li{border-right:0;border-top:1px solid var(--rule-2)}
  .nav__list>li.nav__end{margin-left:0}
  .nav__list>li:first-child a{padding-left:17px}
}
@media (max-width:620px){
  body{font-size:16px}
  .speclist__head{display:none}
  .speclist__row{grid-template-columns:minmax(0,1fr);row-gap:10px}
  .reg__head{display:none}
  .reg__row{grid-template-columns:38px minmax(0,1fr);row-gap:6px}
  .reg__row .reg__sec{grid-column:2}
  .art-body{font-size:17.5px}
  .timeline li,.spec div{grid-template-columns:minmax(0,1fr)}
  .bar-row{grid-template-columns:minmax(0,1fr) 90px;row-gap:8px}
  .bar-row__b{grid-column:1/-1}
  .fig-inset{padding-left:14px}
}

/* sp-mark-align: marks centre in their box — only object-position is overridden */
.sponsor img,.sponsor-box img,.sp-logo img{object-position:center!important;margin-left:auto;margin-right:auto}

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

/* op-money-columns: the supporters block ran one tile per row — 13 tiles,
   2679px at 390, 26% of the whole page. Two columns bring it to
   1387px (48% shorter). Checked before writing: no new overflow, smallest mark still
   133px wide, longest blurb 3 lines, tile heights 184-199px.
   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 (.sup__grid, .sup__grid.sup__grid--five), 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__grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:14px!important}
    .sup__grid > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .sup__grid > * *{min-width:0!important;max-width:100%}
    .sup__grid img,.sup__grid svg{max-width:100%;height:auto}
  .sup__grid.sup__grid--five{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:14px!important}
    .sup__grid.sup__grid--five > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .sup__grid.sup__grid--five > * *{min-width:0!important;max-width:100%}
    .sup__grid.sup__grid--five img,.sup__grid.sup__grid--five svg{max-width:100%;height:auto}
  .sup__grid .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical;overflow:hidden!important}
  .sup__grid.sup__grid--five .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical;overflow:hidden!important}
}

/* op-odd-tier-lead: .sup__grid.sup__grid--five (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){
  .sup__grid.sup__grid--five: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 — "Raging Stallion" — losing up to 27px 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-blurb-two-rows: money blurbs ran FIVE rows or more (desk: .sup__grid.sup__grid--five 5 rows at 1440). Operator: "we should probably limit that to display only 2" — held to two rows in that width band only; the copy stays in the markup. */
@media (min-width:641px){
  .sup__grid.sup__grid--five .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;max-height:2lh!important;min-height:0!important;overflow:hidden!important}
}
/* op-blurb-two-rows:end */

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

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

/* op-img-dims — intrinsic width/height reserve image space; the proven height:auto guard (zero specificity) */
:where(div.art-body > figure.fig-inset > img,
  div.lead-grid.wrap > figure.fig-cell > img,
  div.speclist > div.speclist__row > img,
  div.wrap > figure.fig-cell > img,
  figure.fig-bleed.fig-plate > div.wrap > img,
  figure.fig-bleed.fig-plate.fig-plate--dark > div.wrap > img){height:auto}
/* op-img-dims:end */
[data-partner] img{background:transparent!important}
