/* earlychristianireland.org — "Raking Light"
   Palette: 4 members, each with a job.
   --ground  #101413  dark slate ground (the page)
   --ink     #EFE7D8  bone ink (all reading text)
   --accent  #D89A12  saturated ochre  (hue ~75) — kickers, rules, one full band
   --second  #177C74  saturated verdigris (hue ~185) — full-area panels, place labels
   The two saturated members sit ~110 degrees apart and both carry real area. */

:root{
  --ground:#101413;
  --ground-deep:#0B0F0E;
  --ground-raise:#171C1B;
  --ink:#EFE7D8;
  --ink-70:rgba(239,231,216,.72);
  --ink-55:rgba(239,231,216,.55);
  --ink-40:rgba(239,231,216,.40);
  --rule:rgba(239,231,216,.16);
  --rule-strong:rgba(239,231,216,.30);
  --accent:#D89A12;
  --accent-deep:#A97406;
  --second:#177C74;
  --second-bright:#31C6B6;
  --second-tint:#17332F;

  --serif:Alegreya,Georgia,'Times New Roman',serif;
  --sans:'Alegreya Sans',system-ui,-apple-system,'Segoe UI',sans-serif;

  --measure:72ch;
  --pad:clamp(20px,4vw,56px);
  --wide:1240px;
}

*,*::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.6;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.86em;background:var(--ground-deep);border:1px solid var(--rule);padding:1px 6px}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
h1,h2,h3,h4{font-family:var(--serif);font-weight:700;letter-spacing:-.015em;line-height:1.06;margin:0}
p{text-wrap:pretty}
svg{flex:none}
.icon,.icon-lg,.icon-xl{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}
.icon{width:1.05em;height:1.05em;stroke-width:1.5}
.icon-lg{width:30px;height:30px;stroke-width:1.3}
.icon-xl{width:44px;height:44px;stroke-width:1.15}
.wrap{max-width:var(--wide);margin:0 auto;padding-inline:var(--pad)}
.kicker{font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);margin:0 0 14px;display:flex;align-items:center;gap:9px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;background:var(--accent);color:var(--ground);padding:10px 14px;z-index:99}

/* ---------- masthead ---------- */
.masthead{background:var(--ground-deep);border-bottom:1px solid var(--rule);position:relative;z-index:20}
.masthead-in{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;padding-block:15px}
.wordmark{display:flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none}
.wordmark:hover{text-decoration:none;color:var(--ink)}
.wordmark svg{width:25px;height:25px;stroke:var(--accent);fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.wordmark b{font-family:var(--serif);font-size:20px;font-weight:500;letter-spacing:.14em;text-transform:uppercase}
.mainnav{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.mainnav a{display:flex;align-items:center;gap:7px;color:var(--ink);font-size:12.5px;letter-spacing:.13em;text-transform:uppercase;opacity:.85;text-decoration:none}
.mainnav a:hover{opacity:1;color:var(--accent);text-decoration:none}
.mainnav a[aria-current]{color:var(--accent);opacity:1}

/* ---------- footer ---------- */
.sitefoot{background:var(--ground-deep);border-top:1px solid var(--rule);margin-top:0;padding-block:44px 52px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px}
.sitefoot h4{font-family:var(--sans);font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin:0 0 14px;font-weight:700}
.sitefoot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.sitefoot a{color:var(--ink);opacity:.8;font-size:15px}
.sitefoot a:hover{opacity:1}
.foot-note{font-size:14.5px;color:var(--ink-55);max-width:38ch;margin:14px 0 0}
.foot-base{margin-top:36px;padding-top:18px;border-top:1px solid var(--rule);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:13px;color:var(--ink-40)}

/* ---------- bands ---------- */
.band{padding-block:clamp(44px,6vw,76px)}
.band--rule{border-top:1px solid var(--rule)}
.band--tight{padding-block:clamp(32px,4vw,48px)}
.band--quiet{position:relative;overflow:hidden;background:var(--second);color:var(--ink)}
.band--quiet::before{content:"";position:absolute;inset:0;background:url(img/carved-interlace.jpg) center/cover no-repeat;mix-blend-mode:multiply;opacity:.62}
.band--quiet::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--accent)}
.band--quiet>.wrap{position:relative;z-index:1}
.band--quiet p{font-family:var(--serif);font-size:clamp(24px,3vw,36px);line-height:1.26;font-weight:500;margin:0;max-width:26ch;max-width:min(100%,60ch)}

.band-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:30px}
.band-head h2{font-size:clamp(28px,3.4vw,40px)}
.band-head p{margin:0;color:var(--ink-55);font-size:15.5px;max-width:44ch}

/* ---------- opener ---------- */
.opener{position:relative;min-height:min(78vh,720px);display:flex;align-items:flex-end;background:var(--ground-raise)}
.opener img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.opener::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(11,15,14,.94) 6%,rgba(11,15,14,.55) 42%,rgba(11,15,14,.25) 100%)}
.opener-in{position:relative;z-index:2;width:100%;padding-block:clamp(40px,7vw,72px)}
.opener h1{font-size:clamp(42px,7vw,84px);font-weight:800;line-height:.97;max-width:16ch}
.opener .lede{margin:18px 0 0;font-size:clamp(17px,2vw,21px);line-height:1.5;color:var(--ink-70);max-width:52ch}
.opener .credit{position:absolute;right:var(--pad);bottom:14px;z-index:2;font-size:11.5px;letter-spacing:.05em;color:var(--ink-40)}

/* ---------- lead feature ---------- */
.lead-feature{display:grid;grid-template-columns:1.35fr 1fr;gap:clamp(28px,4vw,56px);align-items:center}
.lead-feature h2{font-size:clamp(32px,4.4vw,54px);line-height:1.02;margin-bottom:16px}
.lead-feature h2 a{color:var(--ink)}
.lead-feature h2 a:hover{color:var(--accent);text-decoration:none}
.lead-feature .deck{font-size:18.5px;line-height:1.6;color:var(--ink-70);margin:0 0 22px}
.more{display:inline-flex;align-items:center;gap:9px;font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);border-bottom:1px solid rgba(216,154,18,.45);padding-bottom:4px}
.more:hover{text-decoration:none;color:var(--ink);border-color:var(--ink)}

/* ---------- seconds / cards ---------- */
.card-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:clamp(20px,2.6vw,34px)}
.card{display:flex;flex-direction:column;background:var(--ground-deep);border:1px solid var(--rule);text-decoration:none;color:var(--ink);height:100%}
.card:hover{border-color:var(--accent);text-decoration:none}
.card .thumb{aspect-ratio:16/10;overflow:hidden;background:var(--ground-raise)}
.card .thumb img{width:100%;height:100%;object-fit:cover}
.card-body{padding:20px 22px 24px;display:flex;flex-direction:column;flex:1}
.card .sec{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--second-bright);display:flex;align-items:center;gap:7px;margin-bottom:10px}
.card h3{font-size:23px;line-height:1.15;margin-bottom:9px;min-height:2.3em}
.card p{margin:0;font-size:15px;line-height:1.55;color:var(--ink-55)}
.card .more{margin-top:auto;padding-top:16px;border:0}

/* ---------- section blocks ---------- */
.sec-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule)}
.sec-block{background:var(--ground);padding:26px 24px 28px;display:flex;flex-direction:column;text-decoration:none;color:var(--ink)}
.sec-block:hover{background:var(--ground-raise);text-decoration:none}
.sec-block svg{color:var(--accent)}
.sec-block h3{font-size:27px;margin:15px 0 10px}
.sec-block p{margin:0 0 16px;font-size:15px;line-height:1.55;color:var(--ink-55);flex:1}
.sec-block .count{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--second-bright)}

/* ---------- figure system: three treatments, one drawing system ---------- */
.article-figure{margin:0}
.article-figure img{width:100%}
.article-figure figcaption{font-family:var(--serif);font-size:17.5px;line-height:1.45;color:var(--ink);margin-top:0}
.article-figure .credit{display:block;font-family:var(--sans);font-size:12.5px;letter-spacing:.03em;color:var(--ink-40);margin-top:7px}

/* i. bleed — edge to edge, caption inset on a scrim */
.fig-bleed{position:relative}
.fig-bleed img{aspect-ratio:16/10;object-fit:cover}
.fig-bleed figcaption{position:absolute;left:var(--pad);bottom:24px;max-width:min(460px,72vw);background:rgba(11,15,14,.86);border-left:2px solid var(--accent);padding:16px 20px}
/* ii. plate — sunk on a mat, caption offset into the margin */
.fig-plate{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:34px;align-items:end}
.fig-plate .mat{background:var(--ground-deep);padding:22px}
.fig-plate figcaption{border-top:1px solid var(--accent);padding-top:14px}
/* iii. detail — tinted band, hairline rule over the caption */
.fig-detail{background:var(--second-tint);padding:22px 22px 20px}
.fig-detail img{aspect-ratio:3/2;object-fit:cover}
.fig-detail figcaption{border-top:1px solid var(--rule-strong);margin-top:16px;padding-top:13px;font-size:16.5px}

/* ---------- map ---------- */
.map-figure{margin:0}
.map-band{display:grid;grid-template-columns:340px minmax(0,1fr);align-items:stretch;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.map-side{padding:clamp(32px,4vw,52px) 36px}
.map-side h2{font-size:clamp(26px,3vw,34px);margin:14px 0 12px}
.map-side p{margin:0;color:var(--ink-55);font-size:15.5px}
.map-slot{background:var(--ground-deep);border-left:1px solid var(--rule);min-height:340px;display:flex;align-items:center;justify-content:center;padding:22px}
.map-slot svg{width:100%;height:auto;max-height:560px;display:block}
.coast{fill:#1A211F;stroke:rgba(239,231,216,.55);stroke-width:1.4;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.coast.away{fill:#121615;stroke:rgba(239,231,216,.18);stroke-width:1;stroke-dasharray:3 3}
.pin circle{fill:var(--accent);stroke:var(--ground-deep);stroke-width:1.4;vector-effect:non-scaling-stroke}
.pin text{font-family:'Alegreya Sans',sans-serif;font-size:11px;font-weight:600;fill:var(--ink);letter-spacing:.01em;paint-order:stroke;stroke:rgba(11,15,14,.9);stroke-width:3px;stroke-linejoin:round}
.pin .pin-note{font-size:9px;font-weight:400;fill:rgba(239,231,216,.72);letter-spacing:0}
.pin-tick{stroke:var(--accent);stroke-width:1;vector-effect:non-scaling-stroke;opacity:.7}
.grat{stroke:rgba(239,231,216,.09);stroke-width:1;vector-effect:non-scaling-stroke}
.grat-lbl{font-family:'Alegreya Sans',sans-serif;font-size:8px;fill:rgba(239,231,216,.42);letter-spacing:.08em}

.map-figure figcaption{font-family:var(--serif);font-size:17px;padding:14px 0 0;border-top:1px solid var(--accent);margin-top:14px}

/* ---------- article ---------- */
.article-head{padding-block:clamp(36px,5vw,60px) clamp(24px,3vw,34px)}
.article-head h1{font-size:clamp(36px,6vw,68px);font-weight:800;line-height:1;max-width:18ch}
.seclabel{display:inline-flex;align-items:center;gap:9px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin-bottom:20px}
.seclabel a{color:inherit}
.standfirst{font-family:var(--serif);font-size:clamp(19px,2.3vw,24px);line-height:1.45;color:var(--ink-70);max-width:56ch;margin:20px 0 0;font-weight:400}
.article-meta{display:flex;gap:10px 26px;flex-wrap:wrap;margin-top:24px;padding-top:16px;border-top:1px solid var(--rule);font-size:13px;letter-spacing:.05em;color:var(--ink-40)}
.article-meta span{white-space:nowrap}
.article-meta b{color:var(--second-bright);font-weight:400;letter-spacing:.14em;text-transform:uppercase;font-size:11.5px}

.prose{max-width:var(--measure);margin-inline:auto;padding-inline:0}
.prose>*:last-child{margin-bottom:0}
.prose>*{margin-block:0 24px}
.prose p{font-family:var(--serif);font-size:19.5px;line-height:1.68;margin-block:0 24px}
.prose h2{font-size:clamp(26px,3.2vw,34px);line-height:1.16;margin:44px 0 16px}
.prose h3{font-size:23px;line-height:1.24;margin:32px 0 12px}
.prose em{font-style:italic}
.prose strong{font-weight:700;color:var(--ink)}
.prose a{border-bottom:1px solid rgba(216,154,18,.4)}
.prose a:hover{text-decoration:none;border-color:var(--ink)}
.prose ul,.prose ol{font-family:var(--serif);font-size:19px;line-height:1.6;padding-left:1.1em}
.prose li{margin-bottom:9px}
.article-body{padding-bottom:clamp(40px,5vw,64px)}
.article-body>.article-figure,.article-body>.notes-band,.article-body>.pullquote,
.article-body>.wrap>.article-figure,main>.wrap>.article-figure{margin-block:clamp(34px,4.5vw,54px)}

.lead{font-family:var(--serif);font-size:clamp(19px,2.2vw,23px);line-height:1.5;color:var(--ink-70)}
.pullquote{margin:0;background:var(--second-tint);border-left:3px solid var(--accent);padding:32px clamp(24px,3vw,40px)}
.pullquote p{font-family:var(--serif);font-size:clamp(23px,2.8vw,31px);line-height:1.28;margin:0;color:var(--ink)}
.blockquote{margin:0;border-left:2px solid var(--rule-strong);padding:6px 0 6px 24px}
.blockquote p{font-family:var(--serif);font-size:20px;font-style:italic;margin:0 0 10px}
.blockquote cite{font-family:var(--sans);font-style:normal;font-size:14px;color:var(--ink-40)}
.callout{background:var(--ground-deep);border:1px solid var(--accent);padding:24px 26px;margin:0}
.callout p{margin:0;font-family:var(--serif);font-size:19px;line-height:1.55}
.note{font-family:var(--sans);font-size:15.5px;line-height:1.6;color:var(--ink-55);border-left:2px solid var(--second);padding-left:16px}

/* notes-for-design material: full-bleed interruptions, never a side rail */
.notes-band{background:var(--ground-deep);border-block:1px solid var(--rule);padding-block:clamp(30px,4vw,44px)}
.notes-band .notes-in{display:grid;grid-template-columns:230px minmax(0,1fr);gap:clamp(20px,3vw,44px);align-items:start}
.notes-band h3{font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);line-height:1.5;margin:0}
.notes-list{list-style:none;margin:0;padding:0;columns:2;column-gap:clamp(24px,3vw,44px)}
.notes-list li{break-inside:avoid;margin:0 0 14px;padding-left:18px;position:relative;font-size:16.5px;line-height:1.5;color:var(--ink-70)}
.notes-list li::before{content:"";position:absolute;left:0;top:.62em;width:9px;height:1px;background:var(--accent)}
.notes-list li b{color:var(--ink);font-weight:600}
.notes-list li em{font-style:italic;color:var(--ink)}

/* ---------- data components ---------- */
.tablewrap{overflow-x:auto}
.datatable,.versus{width:100%;border-collapse:collapse;font-size:16px;font-family:var(--sans)}
.datatable caption,.versus caption{text-align:left;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);padding-bottom:12px}
.datatable th,.versus th{background:var(--accent);color:var(--ground-deep);text-align:left;padding:10px 14px;font-size:11.5px;letter-spacing:.15em;text-transform:uppercase}
.datatable td,.versus td{padding:12px 14px;border-bottom:1px solid var(--rule);vertical-align:top;color:var(--ink-70)}
.datatable tr td:first-child,.versus tr td:first-child{color:var(--ink)}
.versus th:first-child{background:var(--second)}
.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule)}
.statblock{background:var(--ground-deep);padding:22px 20px;display:flex;flex-direction:column;gap:8px}
.stat-num{font-family:var(--serif);font-size:44px;line-height:1;color:var(--accent);font-weight:700}
.stat-label{font-size:14px;line-height:1.4;color:var(--ink-55)}
.timeline{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.timeline li{display:grid;grid-template-columns:260px minmax(0,1fr);gap:24px;padding:16px 0;border-bottom:1px solid var(--rule)}
.t-when{font-family:var(--sans);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--second-bright);line-height:1.5}
.t-what{font-family:var(--serif);font-size:18px;line-height:1.5}
.chart{margin:0}
.chart svg{width:100%;height:auto;overflow:visible}
.chart figcaption{font-family:var(--serif);font-size:16.5px;color:var(--ink-70);border-top:1px solid var(--rule);padding-top:12px;margin-top:14px}
.chart .bar-rect{fill:var(--accent)}
.chart .bar-rect.alt{fill:var(--second)}
.chart .axis{stroke:var(--rule-strong);stroke-width:1}
.chart text{font-family:'Alegreya Sans',sans-serif;font-size:11px;fill:var(--ink-70)}
.chart .val{fill:var(--ink)}

/* ---------- cards / references ---------- */
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.gallery figure{margin:0;background:var(--second-tint);padding:14px}
.gallery img{aspect-ratio:3/2;object-fit:cover;width:100%}
.gallery figcaption{font-family:var(--serif);font-size:15.5px;line-height:1.4;border-top:1px solid var(--rule-strong);margin-top:12px;padding-top:10px}
.profile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px}
.profile-card{background:var(--ground-deep);border:1px solid var(--rule);padding:22px;display:flex;flex-direction:column;gap:10px}
.profile-card .p-photo{width:100%;aspect-ratio:4/3;object-fit:cover}
.profile-card h3{font-size:22px}
.profile-card .p-role{margin:0;font-size:12px;letter-spacing:.15em;text-transform:uppercase;color:var(--second-bright)}
.profile-card p{margin:0;font-size:15.5px;line-height:1.55;color:var(--ink-70)}
.profile-card .p-links{margin-top:auto;padding-top:8px;font-size:14px}
.profile-card .p-attr{font-size:12.5px;color:var(--ink-40)}
.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.org-card{display:grid;grid-template-columns:56px minmax(0,1fr);gap:14px;align-items:center;background:var(--ground-deep);border:1px solid var(--rule);padding:14px 16px;text-decoration:none;color:var(--ink)}
.org-card:hover{border-color:var(--accent);text-decoration:none}
.org-logo{width:56px;height:40px;object-fit:contain}
.org-card.no-logo{grid-template-columns:minmax(0,1fr)}
.org-name{font-family:var(--serif);font-size:19px;line-height:1.2;display:block}
.org-host{font-size:12.5px;color:var(--ink-40);display:block}
.entity-ref{white-space:nowrap;border-bottom:1px solid rgba(216,154,18,.4)}
.further-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.further-grid a{display:block;background:var(--ground-deep);border:1px solid var(--rule);border-left:3px solid var(--accent);padding:18px 20px;font-family:var(--serif);font-size:20px;line-height:1.25;color:var(--ink);text-decoration:none}
.further-grid a:hover{background:var(--ground-raise);text-decoration:none;color:var(--accent)}
.related-links{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}
.related-links li{border-top:1px solid var(--accent);padding-top:12px}
.related-links a{font-family:var(--serif);font-size:20px;line-height:1.2;color:var(--ink)}
.related-links a:hover{color:var(--accent);text-decoration:none}
.related-links .r-sec{display:flex;align-items:center;gap:6px;font-family:var(--sans);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--second-bright);margin-bottom:8px}

.cat-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule-strong)}
.cat-list li{border-bottom:1px solid var(--rule)}
.cat-list li>a{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1.35fr) auto;gap:26px;align-items:baseline;padding:20px 0;color:var(--ink)}
.cat-list li>a:hover{text-decoration:none;color:var(--accent)}
.cat-list .cl-title{font-family:var(--serif);font-size:clamp(21px,2.4vw,27px);line-height:1.15}
.cat-list .cl-brief{font-size:15.5px;line-height:1.5;color:var(--ink-55)}
.cat-list .cl-go{font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);white-space:nowrap}

/* ---------- supporters ---------- */
.supporters{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);background:var(--ground-deep)}
.supporters .sup-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:22px}
.supporters h2{font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--accent)}
.supporters .sup-note{font-size:14.5px;color:var(--ink-40);margin:0}
.sponsor-set{display:flex;flex-wrap:wrap;gap:26px 22px;padding-bottom:6px}
.sponsor-set.roll{gap:18px 22px}
.sponsor{flex:0 0 calc((100% - 88px)/5);width:calc((100% - 88px)/5);display:flex;flex-direction:column;gap:10px;text-decoration:none;color:var(--ink)}
.sponsor img{width:100%;height:66px;object-fit:contain;background:var(--ground-raise);border:1px solid var(--rule);padding:10px 14px}
.sponsor.feat img{border-color:rgba(216,154,18,.45)}
.sponsor:hover img{border-color:var(--accent)}
.sponsor-name{font-family:var(--serif);font-size:17px;line-height:1.2;overflow-wrap:break-word;min-height:2.4em}
.sponsor-blurb{font-size:14px;line-height:1.45;color:var(--ink-55);min-height:2.9em}
.sponsor:hover .sponsor-name{color:var(--accent)}

/* ---------- generic page furniture ---------- */
.page-head{padding-block:clamp(40px,6vw,72px) clamp(20px,3vw,32px)}
.page-head h1{font-size:clamp(38px,6vw,72px);font-weight:800;line-height:.98}
.page-head .standfirst{margin-top:18px}
.head-accent{background:var(--accent);color:var(--ground-deep)}
.head-accent .seclabel,.head-accent .kicker{color:var(--ground-deep)}
.head-accent .standfirst{color:rgba(11,15,14,.82)}
.head-accent svg{color:var(--ground-deep)}

/* ---------- responsive ---------- */
@media (max-width:1000px){
  .lead-feature{grid-template-columns:1fr}
  .fig-plate{grid-template-columns:1fr;gap:18px}
  .map-band{grid-template-columns:1fr}
  .map-slot{border-left:0;border-top:1px solid var(--rule)}
  .notes-band .notes-in{grid-template-columns:1fr;gap:16px}
  .notes-list{columns:1}
  .foot-grid{grid-template-columns:1fr 1fr}
  .cat-list li>a{grid-template-columns:1fr;gap:8px}
  .cat-list .cl-go{display:none}
  .timeline li{grid-template-columns:1fr;gap:6px}
}
@media (max-width:1000px){
  .sponsor-set{gap:22px 16px}
  .sponsor{flex:0 0 calc((100% - 64px)/5);width:calc((100% - 64px)/5)}
}
@media (max-width:900px){
  .sponsor{flex:0 0 calc((100% - 32px)/3);width:calc((100% - 32px)/3)}
  .sponsor-blurb{font-size:13.5px}
  .mainnav{gap:2px 18px}
  .mainnav a{padding-block:12px}
  .more{padding-block:12px}
  .wordmark{padding-block:6px}
  .seclabel a{display:inline-block;padding-block:12px}
  .related-links li>a{display:inline-block;padding-block:8px}
}
@media (max-width:760px){
  .prose,.article-body>figure>figcaption:not(.fig-bleed figcaption){padding-inline:20px}
  .fig-plate figcaption,.fig-tint figcaption{padding-inline:20px}
}
@media (max-width:640px){
  body{font-size:16.5px}
  .prose p{font-size:18.5px}
  .prose h1,.article-head h1{line-height:1.06}
  .masthead-in{gap:14px}
  .mainnav{gap:6px 14px}
  .mainnav a{font-size:11.5px;letter-spacing:.1em;padding-block:13px}
  .fig-bleed figcaption{position:static;max-width:none;margin-top:0;border-left:0;border-top:2px solid var(--accent);background:var(--ground-deep);padding:16px var(--pad)}
  .foot-grid{grid-template-columns:1fr}
  .sponsor,.sponsor-set .sponsor{flex:0 0 100%;width:100%}
  .card h3{min-height:0}
}

/* 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-mark-fit: width:100% + padding must not overflow the tile — but the declared
   HEIGHT is the mark's size and border-box alone steals the vertical padding from it.
   earlychristianireland declares height:66px with 10px top/bottom padding: border-box
   left a 46px mark and the operator read it as 'logos too small'. Keep the horizontal
   inset, drop the vertical padding, so the mark occupies the full height Design set. */
.sponsor img,.sponsor-box img,.sp-logo img{box-sizing:border-box!important;padding-top:0!important;padding-bottom:0!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. */
.sponsor-set .sponsor.sponsor img{box-sizing:border-box!important;padding:11px 17px!important}
.sponsor-set.roll .sponsor.sponsor img{box-sizing:border-box!important;padding:11px 17px!important}

/* op-footer-compact: the footer printed 4 rows for 4 link(s) in
   1 list(s) — 672px at 390, 7% 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, and the group holder takes two columns,
   measured 672 -> 479px (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:clamp(9px,2.78vw,40px)!important;row-gap:9px!important}
  footer ul > li,footer ol > li{width:auto!important;flex:0 0 auto;max-width:100%}
  footer [class*=grid],footer [class*=index],footer [class*=cols]{grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:24px}
}

/* op-money-columns: the supporters block ran one tile per row — 11 tiles,
   2019px at 390, 23% of the whole page. Two columns bring it to
   1434px (29% shorter). Checked before writing: no new overflow, smallest mark still
   166px wide, longest blurb 3 lines, tile heights 149-274px.
   A block that fails any of those is left in one column — two narrow columns can make a block
   TALLER once the copy rewraps, which is the case the operator warned about.
   An odd tile count means the lead tile spans the whole row, so the block does not end on an empty cell. Only the tier(s) that were one-per-row are touched (.sponsor-set, .sponsor-set.roll), 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-set{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:22px!important}
    .sponsor-set > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .sponsor-set > * *{min-width:0!important;max-width:100%}
    .sponsor-set img,.sponsor-set svg{max-width:100%;height:auto}
  .sponsor-set.roll{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:22px!important}
    .sponsor-set.roll > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .sponsor-set.roll > * *{min-width:0!important;max-width:100%}
    .sponsor-set.roll img,.sponsor-set.roll svg{max-width:100%;height:auto}
}

/* op-odd-tier-lead: .sponsor-set (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-set:has(> *:nth-child(odd):last-child) > *:first-child{grid-column:1 / -1!important}
}

/* op-article-width: the article column was capped at 646px (83 characters per line) at every desktop width. Operator: "it should utilize more space". Widened through Design's own measure --measure (declared in .prose) 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){
  div.article-body div.prose{--measure:min(88.458ch, 100%)!important}
}
@media (min-width:1600px){
  div.article-body div.prose{--measure:min(clamp(88.458ch, 55.139vw, calc(88.458ch * 1.2)), 100%)!important}
  div.article-body div.prose > :is(p:not([class])){font-size:clamp(19.5px,1.3542vw,23.4px)!important}
}
/* op-article-width:end */
@media (min-width:660px) and (max-width:1023px){.sponsor-set.sponsor-set:has(> [data-partner]){display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(162px,calc(50% - 11px)),1fr))!important;column-gap:22px!important;row-gap:18px!important;justify-content:stretch!important;align-items:stretch!important}.sponsor-set.sponsor-set > [data-partner]{flex:none!important;width:auto!important;max-width:none!important;margin-left:0!important;margin-right:0!important}}
[data-partner] img{background:transparent!important}
