/* dialuk.info — "Threshold" house style
   Palette roles: ground (paper), ink, accent (form blue), secondary (rust), muted.
   Two saturated members: accent #1B3FD6 and secondary #D6531B — ~213° apart in hue. */

:root{
  --ground:#F2EEE4;
  --ink:#17181C;
  --accent:#1B3FD6;
  --secondary:#D6531B;
  --secondary-ink:#A63A0B;
  --muted:#67665F;

  --mat:#E9E4D7;
  --rule:rgba(23,24,28,.22);
  --hair:rgba(23,24,28,.14);
  --accent-tint:rgba(27,63,214,.07);

  --display:"Petrona",Georgia,"Times New Roman",serif;
  --label:"Schibsted Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;

  --gut:clamp(20px,4vw,56px);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:clip}
body{overflow-x:clip}
body{
  margin:0;background:var(--ground);color:var(--ink);
  font:400 20px/1.65 var(--display);
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block}
h1,h2,h3,h4,h5{margin:0;font-weight:600;letter-spacing:-.018em;line-height:1.08}
p{margin:0 0 1.15em}
p:last-child{margin-bottom:0}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--secondary)}
svg{flex:none}
:focus-visible{outline:3px solid var(--secondary);outline-offset:2px}

.wrap{width:min(1180px,100% - (2 * var(--gut)));margin-inline:auto}
.eyebrow{
  font:600 12px/1 var(--label);letter-spacing:.16em;text-transform:uppercase;
  color:var(--accent);display:flex;align-items:center;gap:9px;
}
.eyebrow--rust{color:var(--secondary-ink)}
.rule-heavy{height:3px;background:var(--ink);margin-top:14px}
.rule-hair{height:1px;background:var(--rule)}

/* ---------- masthead ---------- */
.topbar{height:5px;background:var(--accent)}
.masthead{padding:16px 0 0}
.masthead__row{display:flex;flex-wrap:wrap;gap:14px 40px;align-items:flex-start;justify-content:space-between}
.masthead__row > div:first-child{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px}
.wordmark{font:600 clamp(28px,3.2vw,34px)/1 var(--display);letter-spacing:-.025em;color:var(--ink);display:inline-block}
.wordmark:hover{color:var(--ink)}
.strapline{font:400 italic 15px/1.4 var(--display);color:var(--muted);margin:0;max-width:56ch}
.nav{
  flex:1 0 100%;width:100%;margin-top:16px;display:grid;
  grid-template-columns:repeat(7,1fr);
  border-top:2px solid var(--ink);
}
.nav a{
  display:flex;flex-direction:column;gap:9px;align-items:flex-start;
  padding:10px 14px 12px;color:var(--ink);
  border-left:1px solid var(--hair);
  transition:background .14s ease,color .14s ease;
}
.nav a:first-child{border-left:none;padding-left:0}
.nav__top{display:flex;align-items:center;justify-content:space-between;width:100%;gap:12px;color:var(--accent)}
.nav__no{font:500 10px/1 var(--label);letter-spacing:.2em;color:var(--muted)}
.nav__lb{font:600 17px/1.15 var(--display);letter-spacing:-.012em}
.nav a:hover{background:var(--accent-tint);color:var(--ink)}
.nav a:hover .nav__no{color:var(--secondary-ink)}
.nav a[aria-current]{background:var(--accent);color:var(--ground)}
.nav a[aria-current] .nav__top{color:var(--ground)}
.nav a[aria-current] .nav__no{color:rgba(242,238,228,.72)}
@media (max-width:939px){
  .nav{grid-template-columns:repeat(3,1fr)}
  .nav a:nth-child(n+4){border-top:1px solid var(--hair)}
  .nav a:nth-child(4){border-left:none;padding-left:0}
  .nav a:last-child{grid-column:1 / -1;border-left:none;padding-left:0}
}
@media (max-width:619px){
  .strapline{display:none}
  .nav{grid-template-columns:repeat(2,1fr)}
  .nav a{
    flex-direction:row;align-items:center;justify-content:space-between;
    gap:10px;padding:0 12px;min-height:48px;
  }
  .nav a:nth-child(n+3){border-top:1px solid var(--hair)}
  .nav a:nth-child(odd){border-left:none;padding-left:0}
  .nav__top{width:auto;order:2}
  .nav__no{display:none}
  .nav__lb{font-size:16px}
}
.masthead__rule{height:1px;background:var(--rule);margin-top:0}

/* ---------- generic band rhythm ---------- */
.band{padding:clamp(40px,6vw,68px) 0}
.band--tight{padding:clamp(28px,4vw,44px) 0}
.band--accent{background:var(--accent);color:var(--ground)}
.band--accent a{color:var(--ground)}
.band--ink{background:var(--ink);color:var(--ground)}
.section-head{display:flex;flex-wrap:wrap;gap:16px 40px;align-items:flex-end;justify-content:space-between}
.section-head p{max-width:56ch;font:400 17px/1.55 var(--label);color:var(--muted)}
.more-link{font:500 13px/1 var(--label);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}

/* ---------- lead / opener ---------- */
.opener{position:relative;border-bottom:1px solid var(--rule)}
.opener img{width:100%;height:clamp(300px,46vw,620px);object-fit:cover}
.opener__cap{
  position:relative;background:var(--ground);border-top:3px solid var(--accent);
  padding:22px 24px 20px;max-width:560px;
}
@media (min-width:900px){
  .opener__cap{position:absolute;left:var(--gut);bottom:0;margin:0}
}
.opener__cap p{font:400 17px/1.45 var(--display)}
.credit{font:500 11px/1.35 var(--label);letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin-top:12px}

.lead-head{display:grid;gap:24px 56px;align-items:start;padding-top:clamp(28px,4vw,44px)}
@media (min-width:960px){.lead-head{grid-template-columns:7fr 5fr}}
.lead-head h1,.lead-head h2{font-size:clamp(36px,5.4vw,62px);letter-spacing:-.03em;text-wrap:pretty}
.deck{font:400 18px/1.55 var(--label);color:#3A3A35;text-wrap:pretty}

/* ---------- three-up dense run ---------- */
.trio{display:grid;gap:36px 40px;padding-top:26px}
@media (min-width:760px){.trio{grid-template-columns:repeat(3,1fr)}}
.trio h3{font-size:26px;margin-top:10px}
.trio p{font:400 16px/1.55 var(--label);color:#3A3A35;margin-top:12px}
.kicker{font:500 12px/1 var(--label);letter-spacing:.13em;text-transform:uppercase;color:var(--secondary-ink)}

/* ---------- cards ---------- */
.card-grid{display:grid;gap:34px 36px;padding-top:26px}
@media (min-width:700px){.card-grid--2{grid-template-columns:repeat(2,1fr)}}
@media (min-width:820px){.card-grid--3{grid-template-columns:repeat(3,1fr)}}
.card{display:flex;flex-direction:column;height:100%;color:var(--ink)}
.card:hover{color:var(--ink)}
.card__frame{border:1px solid var(--rule);padding:10px;background:var(--mat)}
.card__frame img{aspect-ratio:8/5;object-fit:cover;width:100%}
.card h3{font-size:24px;margin-top:14px}
@media (min-width:700px){.card h3{min-height:2.2em}}
.card:hover h3{color:var(--accent)}
.card p{font:400 15px/1.5 var(--label);color:#3A3A35;margin-top:10px}
.card .card__meta{margin-top:auto;padding-top:14px}
.card__meta{font:500 11px/1 var(--label);letter-spacing:.13em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:8px}

.rowlist{border-top:2px solid var(--ink);margin-top:26px}
.rowlist a{display:grid;gap:6px 28px;padding:18px 0;border-bottom:1px solid var(--hair);color:var(--ink);align-items:baseline}
@media (min-width:760px){.rowlist a{grid-template-columns:1fr 46%}}
.rowlist a:hover .rowlist__t{color:var(--accent)}
.rowlist__t{font:600 25px/1.15 var(--display);letter-spacing:-.02em}
.rowlist__d{font:400 15px/1.5 var(--label);color:#3A3A35}

/* ---------- section index ---------- */
.sections-grid{display:grid;gap:26px 34px;padding-top:22px}
@media (min-width:640px){.sections-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1040px){.sections-grid{grid-template-columns:repeat(3,1fr)}}
.section-block{border-top:1px solid var(--rule);padding-top:16px;color:var(--ink);display:flex;flex-direction:column;gap:10px;height:100%}
.section-block:hover{color:var(--ink);border-top-color:var(--accent)}
.section-block h3{font-size:23px}
.section-block:hover h3{color:var(--accent)}
.section-block p{font:400 15px/1.5 var(--label);color:var(--muted)}
.section-block .n{font:500 11px/1 var(--label);letter-spacing:.16em;color:var(--muted);margin-top:auto;padding-top:8px}

/* ---------- quiet accent band ---------- */
.quiet q,.quiet blockquote{quotes:none}
.quiet__line{font:400 italic clamp(24px,3.4vw,38px)/1.3 var(--display);max-width:34ch;margin:16px 0 0;text-wrap:pretty}
.quiet__src{font:400 15px/1.55 var(--label);color:rgba(242,238,228,.82);margin-top:20px;max-width:64ch}
.band--accent .eyebrow{color:rgba(242,238,228,.75)}

/* ---------- article ---------- */
.article-head{padding-top:clamp(26px,4vw,40px)}
.article-head h1{font-size:clamp(34px,5.2vw,60px);letter-spacing:-.03em;margin-top:16px;max-width:22ch;text-wrap:pretty}
.byline{
  display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin-top:22px;
  padding-top:14px;border-top:1px solid var(--rule);
  font:500 12px/1 var(--label);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);
}
.prose{width:min(47ch,100%);margin-inline:auto;padding-top:clamp(24px,3vw,36px)}
.prose > *{margin-inline:auto}
.prose h2{font-size:clamp(25px,3.2vw,34px);margin:1.6em 0 .55em;letter-spacing:-.02em}
.prose > p + p{margin-top:0}
@media (max-width:619px){.prose{font-size:19px}.lead{font-size:20px}.article-figure{margin-bottom:1.9em}}
.prose h2::before{
  content:"";display:block;width:56px;height:3px;background:var(--secondary);margin-bottom:16px;
}
.lead{font:400 22px/1.5 var(--display);color:var(--ink);margin-bottom:1.1em}
.lead strong{font-weight:600}
.prose a{border-bottom:1px solid rgba(27,63,214,.35)}
.prose a:hover{border-bottom-color:var(--secondary)}

/* breakouts inside the prose column */
.breakout,.prose .fig--mat,.prose .fig--offset,.prose .related{
  width:min(940px,100vw - (2 * var(--gut)));margin-inline:auto;
  position:relative;left:50%;transform:translateX(-50%);
}
.bleed{width:100vw;position:relative;left:50%;transform:translateX(-50%)}

/* ---------- figure system: three treatments ---------- */
.article-figure{margin:0 0 1.6em}
.article-figure figcaption,.cap{font:400 17px/1.45 var(--display)}
.article-figure .credit{margin-top:10px}

/* 1 — matted plate */
.fig--mat{border:1px solid var(--rule);padding:clamp(12px,1.6vw,18px);background:var(--mat)}
.fig--mat img{width:100%;aspect-ratio:8/5;object-fit:cover}
.fig--mat figcaption{padding-top:14px;margin-top:16px;border-top:1px solid var(--rule)}

/* 2 — offset caption, ranged right in the margin */
.fig--offset{display:grid;gap:16px 32px}
@media (min-width:900px){
  .fig--offset{grid-template-columns:4fr 8fr;align-items:start}
  .fig--offset figcaption{text-align:right;order:-1}
}
.fig--offset img{width:100%;aspect-ratio:8/5;object-fit:cover;border:1px solid var(--rule)}
.fig--offset .fignum{font:600 12px/1 var(--label);letter-spacing:.13em;text-transform:uppercase;color:var(--secondary-ink);display:block;margin-bottom:10px}

/* 3 — full-bleed band with the caption panel stepping over the image */
.fig--bleed{position:relative;margin-block:2em}
.fig--bleed img{width:100%;height:clamp(260px,42vw,560px);object-fit:cover}
.fig--bleed figcaption{
  background:var(--ground);border-top:3px solid var(--accent);padding:20px 22px;
  max-width:560px;margin-top:0;
}
@media (min-width:900px){
  .fig--bleed figcaption{position:absolute;left:var(--gut);bottom:0}
}

.gallery{display:grid;gap:16px}
@media (min-width:700px){.gallery{grid-template-columns:repeat(2,1fr)}}
.gallery img{width:100%;aspect-ratio:8/5;object-fit:cover;border:1px solid var(--rule)}
.gallery figcaption{font:400 15px/1.45 var(--display);margin-top:8px}

/* ---------- apparatus panels (the "Notes for Design" material) ---------- */
.apparatus{margin:2.2em 0}
.apparatus__title,.prose h2.apparatus__title,.related h2.apparatus__title{
  font:600 12px/1 var(--label);letter-spacing:.16em;text-transform:uppercase;
  display:flex;align-items:center;gap:9px;margin:0;
}
.prose h2.apparatus__title::before,.related h2.apparatus__title::before{content:none;display:none}
.apparatus--accent{background:var(--accent);color:var(--ground);padding:clamp(24px,3.4vw,40px) 0}
.apparatus--accent .apparatus__title{color:rgba(242,238,228,.78)}
.apparatus--accent .deflist dt{color:var(--ground)}
.apparatus--accent .deflist dd{color:rgba(242,238,228,.85)}
.apparatus--accent .deflist div{border-top-color:rgba(242,238,228,.28)}
.apparatus--frame{border:1px solid var(--ink);border-top:4px solid var(--secondary);padding:clamp(20px,2.6vw,30px);background:var(--mat)}

.deflist{margin:18px 0 0;display:grid;gap:0}
@media (min-width:820px){.deflist--2{grid-template-columns:repeat(2,1fr);column-gap:40px}}
.deflist div{padding:14px 0;border-top:1px solid var(--rule)}
.deflist dt{font:600 18px/1.3 var(--display);letter-spacing:-.01em;display:block}
.deflist dd{margin:6px 0 0;font:400 15px/1.55 var(--label);color:#3A3A35;display:block}

.plainlist{margin:16px 0 0;padding:0;list-style:none}
.plainlist li{padding:12px 0;border-top:1px solid var(--rule);font:400 17px/1.5 var(--display)}
.apparatus--accent .plainlist li{border-top-color:rgba(242,238,228,.28)}

/* ---------- text components ---------- */
.pullquote{margin:1.8em 0;padding:4px 0 4px 26px;border-left:3px solid var(--accent)}
.pullquote p{font:400 italic clamp(22px,2.6vw,30px)/1.32 var(--display);text-wrap:pretty}
.blockquote{margin:1.8em 0;padding:0 0 0 26px;border-left:3px solid var(--secondary)}
.blockquote p{font:400 20px/1.5 var(--display)}
.blockquote cite{display:block;margin-top:12px;font:500 12px/1.4 var(--label);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-style:normal}
.callout{margin:1.8em 0;background:var(--accent-tint);border-top:3px solid var(--accent);padding:22px 24px}
.callout p{font:400 18px/1.55 var(--display)}
.note{font:400 16px/1.6 var(--label);color:var(--muted);border-top:1px solid var(--rule);padding-top:14px;margin-top:1.6em}

/* ---------- data components ---------- */
.datatable,.versus{width:100%;border-collapse:collapse;margin:1.8em 0;font-family:var(--label)}
.datatable caption,.versus caption{
  caption-side:top;text-align:left;font:600 12px/1.4 var(--label);letter-spacing:.14em;
  text-transform:uppercase;color:var(--secondary-ink);padding-bottom:12px;
}
.datatable th,.versus th{
  text-align:left;font:600 12px/1.3 var(--label);letter-spacing:.09em;text-transform:uppercase;
  background:var(--ink);color:var(--ground);padding:12px 14px;vertical-align:bottom;
}
.datatable td,.versus td{padding:14px;border-bottom:1px solid var(--rule);font-size:15px;line-height:1.5;vertical-align:top}
.versus tbody th{background:transparent;color:var(--ink);border-bottom:1px solid var(--rule);text-transform:none;letter-spacing:0;font:600 16px/1.4 var(--display);width:26%}
.versus td+td{background:var(--accent-tint)}

.statrow{display:grid;gap:24px;margin:1.8em 0}
@media (min-width:640px){.statrow{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}}
.statblock{border-top:3px solid var(--ink);padding-top:14px}
.stat-num{display:block;font:600 clamp(34px,4vw,46px)/1 var(--display);letter-spacing:-.03em;color:var(--secondary)}
.stat-label{display:block;font:400 15px/1.45 var(--label);color:#3A3A35;margin-top:10px}

.timeline{list-style:none;margin:1.8em 0;padding:0;border-top:1px solid var(--rule)}
.timeline li{display:grid;gap:4px 28px;padding:16px 0;border-bottom:1px solid var(--rule)}
@media (min-width:760px){.timeline li{grid-template-columns:minmax(160px,26%) 1fr}}
.t-when{font:600 15px/1.4 var(--label);letter-spacing:.02em;color:var(--accent);display:block}
.t-what{font:400 17px/1.5 var(--display);display:block}

.chart{margin:1.8em 0}
.chart svg{width:100%;height:auto;display:block}
.chart figcaption{font:400 15px/1.5 var(--label);color:var(--muted);margin-top:12px;border-top:1px solid var(--rule);padding-top:10px}

/* ---------- cards / references ---------- */
.profile-grid,.org-grid,.further-grid{display:grid;gap:20px;margin:1.8em 0}
@media (min-width:700px){.profile-grid{grid-template-columns:repeat(2,1fr)}.org-grid{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}.further-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}}
.profile-card{border:1px solid var(--rule);padding:20px;background:var(--mat);display:flex;flex-direction:column;gap:8px}
.profile-card .p-photo{width:100%;aspect-ratio:1/1;object-fit:cover;margin-bottom:8px}
.profile-card h3{font-size:21px}
.profile-card .p-role{font:500 12px/1.3 var(--label);letter-spacing:.12em;text-transform:uppercase;color:var(--secondary-ink)}
.profile-card p{font:400 15px/1.55 var(--label);color:#3A3A35}
.profile-card .p-links{margin-top:auto;padding-top:8px}
.org-card{display:flex;flex-direction:column;gap:6px;border:1px solid var(--rule);padding:16px;color:var(--ink);background:var(--mat)}
.org-card:hover{border-color:var(--accent);color:var(--ink)}
.org-logo{max-height:34px;width:auto;object-fit:contain}
.org-name{font:600 18px/1.25 var(--display)}
.org-host{font:400 13px/1.3 var(--label);color:var(--muted)}
.entity-ref{white-space:nowrap;border-bottom:1px solid rgba(27,63,214,.35)}
.further-grid a{border:1px solid var(--rule);border-top:3px solid var(--accent);padding:16px;color:var(--ink);font:600 19px/1.3 var(--display)}
.further-grid a:hover{color:var(--accent)}

.related{margin-top:clamp(36px,5vw,56px);border-top:3px solid var(--ink);padding-top:18px}
.related-links{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:0}
.related-links li{border-bottom:1px solid var(--hair)}
.related-links a{display:block;padding:14px 0;color:var(--ink);font:600 21px/1.3 var(--display)}
.related-links a:hover{color:var(--accent)}
.related-links .rl-note{display:block;font:400 14px/1.5 var(--label);color:var(--muted);margin-top:4px}

.cat-list{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.cat-list li{border-bottom:1px solid var(--hair)}
.cat-list a{display:grid;gap:6px 28px;padding:20px 0;color:var(--ink);align-items:baseline}
@media (min-width:760px){.cat-list a{grid-template-columns:1fr 46%}}
.cat-list a:hover .cl-t{color:var(--accent)}
.cl-t{font:600 clamp(22px,2.6vw,28px)/1.2 var(--display);letter-spacing:-.02em}
.cl-d{font:400 15px/1.5 var(--label);color:#3A3A35}

/* ---------- supporters rail ---------- */
.feed{display:grid;gap:clamp(32px,4vw,56px)}
@media (min-width:1000px){.feed{grid-template-columns:minmax(0,1fr) 300px}}
.supporters{border-top:3px solid var(--ink);padding-top:16px;align-self:start}
.supporters h2{font:600 12px/1 var(--label);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.supporters p.sup-note{font:400 14px/1.5 var(--label);color:var(--muted);margin-top:10px}
.sup-group{margin-top:22px}
.sup-group__label{font:500 11px/1 var(--label);letter-spacing:.14em;text-transform:uppercase;color:var(--secondary-ink);padding-bottom:8px;border-bottom:1px solid var(--rule)}
.sup-list{display:flex;flex-direction:column}
.sponsor{display:block;padding:14px 0;border-bottom:1px solid var(--hair);color:var(--ink)}
.sponsor:hover{color:var(--accent)}
.sponsor-name{display:block;font:600 18px/1.3 var(--display);letter-spacing:-.01em}
.sponsor-blurb{display:block;font:400 14px/1.5 var(--label);color:var(--muted);margin-top:5px}
.sponsor.feat .sponsor-name{font-size:20px}
.sup-group--roll .sponsor{padding:9px 0}
.sup-group--roll .sponsor-name{font-size:16px}

/* ---------- footer ---------- */
.site-foot{background:var(--ink);color:var(--ground);margin-top:clamp(40px,6vw,72px);padding:clamp(32px,4vw,48px) 0}
.site-foot a{color:var(--ground);border-bottom:1px solid rgba(242,238,228,.35)}
.site-foot a:hover{color:#9FB4F5;border-bottom-color:#9FB4F5}
.foot-grid{display:grid;gap:28px 48px}
@media (min-width:800px){.foot-grid{grid-template-columns:1fr 1fr 1fr}}
.foot-grid h3{font:600 12px/1 var(--label);letter-spacing:.16em;text-transform:uppercase;color:rgba(242,238,228,.6)}
.foot-grid ul{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:0}
.foot-grid li a{display:block;padding:9px 0;font:400 16px/1.4 var(--display);border-bottom:none}
.foot-note{font:400 14px/1.6 var(--label);color:rgba(242,238,228,.7);max-width:62ch;margin-top:14px}
.foot-bottom{margin-top:32px;padding-top:18px;border-top:1px solid rgba(242,238,228,.25);font:400 13px/1.6 var(--label);color:rgba(242,238,228,.6)}

/* ---------- small pages ---------- */
.page-body{width:min(49ch,100%);margin-inline:auto;padding-top:clamp(20px,3vw,32px)}
.page-body h2{font-size:26px;margin:1.4em 0 .4em}

/* ---------- styleguide only ---------- */
.sg-item{border-top:1px solid var(--rule);padding-top:18px;margin-top:40px}
.sg-item > h2{font:600 12px/1 var(--label);letter-spacing:.16em;text-transform:uppercase;color:var(--secondary-ink);margin-bottom:18px}

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

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

/* sp-mark-align: marks sit CENTRED in their box. Placement only — Design's size,
   padding, panel and object-fit are untouched. */
.sponsor img,.sponsor-box img,.sp-logo img{object-position:center!important;margin-left:auto!important;margin-right:auto!important;display:block}
.sponsor .sp-logo,.sponsor-box{display:flex;align-items:center;justify-content:center}

/* sp-tile-uniform: a slot never grows to fill its row — every tile the same width in
   every row, whatever the count. Only flex-grow is touched. */
.sponsor{flex-grow:0!important}
.sponsor.lead-line,.sponsor.feat.lead-line{flex-grow:1!important}

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

  .index-toggle-bars{width:8px;height:8px;flex:none;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px)}
  .nav{display:none}
  .index-toggle-c:checked ~ .nav{display:grid}
  .masthead__row:has(> .index-toggle){display:flow-root}
  .index-toggle:not(:has(~ .nav)){display:none}
}

/* op-footer-compact: the footer printed 6 rows for 6 link(s) in
   1 list(s) — 819px at 390, 11% of the whole page. Design's own
   good case (evbb) has no list at all: its footer links simply flow inline, 479px in total.
   Here the lists flow inline too,
   measured 819 -> 583px (29% shorter) with no new overflow. Both shapes were
   tried and the shorter one kept — two columns helps a wide group set and hurts a narrow one.
   Phone widths only; the desktop footer is untouched. */
@media (max-width:640px){
  footer ul,footer ol{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;column-gap:min(3.33vw,48px)!important;row-gap:6px!important}
  footer ul > li,footer ol > li{width:auto!important;flex:0 0 auto;max-width:100%}
}
/* op-heading-levels */
h2:where(.rt-h3){margin: 0px; font-weight: 600; letter-spacing: -0.018em; line-height: 1.08;}
.trio h2:where(.rt-h3){font-size: 26px; margin-top: 10px;}
.card h2:where(.rt-h3){font-size: 24px; margin-top: 14px;}
@media (min-width: 700px){.card h2:where(.rt-h3){min-height: 2.2em;}}
.card:hover h2:where(.rt-h3){color: var(--accent);}
.section-block h2:where(.rt-h3){font-size: 23px;}
.section-block:hover h2:where(.rt-h3){color: var(--accent);}
.foot-grid h2:where(.rt-h3){font: 600 12px/1 var(--label); letter-spacing: 0.16em; text-transform: uppercase; color: rgba(242, 238, 228, 0.6);}
/* op-heading-levels:end */

/* op-img-dims — intrinsic width/height reserve image space; the proven height:auto guard (zero specificity) */
:where(a.card > span.card__frame > img,
  article > figure.article-figure.bleed.fig--bleed > img,
  div.band.band--tight > figure.article-figure.fig--offset > img,
  div.prose > figure.article-figure.fig--mat > img,
  div.prose > figure.article-figure.fig--offset > img,
  main > section.opener > img){height:auto}
/* op-img-dims:end */
@media (min-width:700px) and (max-width:999px){.sup-list:has(> [data-partner]){display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:var(--sp-gap,16px)!important}.sup-list:has(> [data-partner]) > [data-partner]{width:auto!important;min-width:0!important;margin-left:0!important;margin-right:0!important}}