/* mostradelcavallo.com — the working horse in Italy
   PALETTE — 5 members, each with a job
   --ground  #EDE4D6  page ground (bone)
   --paper   #F5EEE1  raised ground for reading pages
   --ink     #17150F  ink; also a full-band ground (masthead, footer)
   --accent  #B23A1F  saturated red-earth: kickers, rules, one filled plate
   --moss    #2C5545  saturated green: full section bands
   --gold    #F0C46A  flag/alert on dark grounds only
   accent and moss are ~135deg apart in hue; both are used as AREAS. */

:root{
  --ground:#EDE4D6; --paper:#F5EEE1; --ink:#17150F;
  --accent:#B23A1F; --accent-lift:#D9764F; --moss:#2C5545; --gold:#F0C46A;
  --mat:#E4D9C6; --mat-deep:#DCD0BC; --rule:rgba(23,21,15,.2); --rule-soft:rgba(23,21,15,.12);
  --ink-60:rgba(23,21,15,.6); --ink-45:rgba(23,21,15,.45);
  --pale:rgba(243,235,221,.72);
  --display:"Young Serif",Georgia,serif;
  --text:"Chivo",system-ui,sans-serif;
  --gut:clamp(18px,4vw,56px);
  --measure:70ch;
}

*{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(--ink);text-decoration-color:var(--accent);text-underline-offset:3px}
a:hover{color:var(--accent)}
h1,h2,h3,h4{font-family:var(--display);font-weight:400;letter-spacing:-.015em;line-height:1.08;margin:0;text-wrap:pretty}
p{text-wrap:pretty}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{width:100%;max-width:1240px;margin:0 auto;padding-inline:var(--gut)}
.band{padding-block:clamp(30px,5vw,60px)}
.band + .band{border-top:1px solid var(--rule-soft)}
.kicker{font:700 11.5px/1 var(--text);letter-spacing:.2em;text-transform:uppercase;color:var(--accent);display:flex;align-items:center;gap:8px}
.kicker--pale{color:var(--accent-lift)}
.ico{flex:none;display:inline-block;vertical-align:middle}
.rule-hand{display:block;width:100%;height:8px;color:var(--rule)}
.rule-hand path{vector-effect:non-scaling-stroke}

/* ---------- masthead: ink plate, two levels, no dropdowns ---------- */
.masthead{background:var(--ink);color:#F3EBDD}
.masthead a{color:#F3EBDD;text-decoration:none}
.masthead a:hover{color:var(--accent-lift)}
.mast-top{display:flex;flex-wrap:wrap;gap:6px 20px;justify-content:space-between;align-items:center;
  padding-block:12px;font:400 11.5px/1.4 var(--text);letter-spacing:.16em;text-transform:uppercase;color:var(--pale);
  border-bottom:1px solid rgba(237,228,214,.16)}
.mast-top em{font-style:normal;color:var(--accent-lift)}
.mast-name{display:flex;align-items:flex-end;gap:clamp(14px,2.5vw,34px);padding:24px 0 4px}
.mast-emblem{flex:none;color:var(--accent-lift);width:clamp(46px,5.6vw,84px);height:auto;margin-bottom:6px}
.mast-emblem path{stroke-width:3.4}
.masthead--inner .mast-emblem path{stroke-width:4.6}
.mast-name h1,.mast-name .h1{font-family:var(--display);font-size:clamp(32px,6.6vw,104px);line-height:.9;letter-spacing:-.026em;color:#F3EBDD;margin:0}
.mast-standfirst{margin:0 0 10px auto;max-width:250px;font:400 14.5px/1.5 var(--text);color:var(--pale)}
.mast-rule{margin:20px 0 14px}
.mast-nav{padding-bottom:22px}
.nav-1{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:8px clamp(14px,2.4vw,26px);
  font-family:var(--display);font-size:clamp(20px,2.4vw,27px)}
.nav-1 li{display:flex;align-items:center;gap:9px}
.nav-1 a{display:flex;align-items:center;gap:9px}
.nav-1 .ico{color:var(--accent-lift)}
.nav-1 a[aria-current="page"]{color:var(--accent-lift);border-bottom:2px solid var(--accent-lift)}
.nav-2{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:5px 18px;
  font:400 12px/1.35 var(--text);letter-spacing:.08em;text-transform:uppercase;color:var(--pale)}
.nav-2 sup{color:var(--accent-lift);margin-right:3px}
.nav-2 a{color:var(--pale)}
.nav-toggle{display:none}
.mast-mobile{display:none}

/* compact masthead for inner pages */
.masthead--inner .mast-name{padding-top:14px}
.masthead--inner .mast-name .h1{font-size:clamp(26px,4vw,32px)}
.masthead--inner .mast-emblem{width:clamp(26px,3vw,32px)}
.masthead--inner .mast-nav{padding-bottom:16px}
.masthead--inner .nav-1{font-size:clamp(17px,1.8vw,19px)}
.masthead--inner .mast-rule{margin:14px 0 10px}

/* ---------- homepage bands ---------- */
.lead-band{background:var(--ink)}
.lead-figure{margin:0;display:grid;grid-template-columns:1.5fr minmax(300px,1fr);align-items:stretch}
.lead-figure img{width:100%;aspect-ratio:16/10;object-fit:cover}
.lead-plate{display:flex;flex-direction:column;justify-content:flex-end;background:var(--ink);color:#F3EBDD;padding:clamp(20px,3vw,34px) clamp(20px,3vw,40px) clamp(22px,3.2vw,36px)}
.lead-plate .kicker{color:var(--accent-lift)}
.lead-plate h2{font-size:clamp(24px,3.2vw,40px);color:#F3EBDD;margin:10px 0 0}
.lead-plate h2 a{color:inherit;text-decoration:none}
.lead-plate p{margin:10px 0 0;font-size:15.5px;color:var(--pale)}
.lead-credit{margin:8px 0 0;font:400 11px/1.4 var(--text);letter-spacing:.12em;text-transform:uppercase;color:rgba(237,228,214,.45)}

.quiet{padding-block:clamp(28px,4.4vw,52px)}
.quiet p{margin:0 0 0 auto;max-width:860px;font-family:var(--display);font-size:clamp(21px,2.7vw,32px);line-height:1.32}

.pair{display:grid;grid-template-columns:1.35fr 1fr;gap:clamp(24px,3.4vw,52px);align-items:start}
.pair .second figure{margin-bottom:16px}
.pair h3{font-size:clamp(22px,2.9vw,32px);margin:9px 0 7px}
.pair h4{font-family:var(--display);font-weight:400;font-size:clamp(19px,2.2vw,24px);line-height:1.15;margin:7px 0 6px}
.pair .brief{margin:0;font-size:15.5px;line-height:1.55;color:var(--ink-60)}
.pair .credit{margin-top:10px}
.row{display:grid;grid-template-columns:132px 1fr;gap:clamp(14px,1.6vw,20px);align-items:start;padding-top:16px;border-top:2px solid var(--ink)}
.row .thumb img{width:132px;height:132px;object-fit:cover;border:1px solid var(--rule)}
.row .credit{margin-top:8px}
.stack{display:flex;flex-direction:column;gap:clamp(20px,2.4vw,34px)}

.band--moss{background:var(--moss);color:#E9E2D2}
.band--moss a{color:#F3EBDD}
.band--moss a:hover{color:var(--gold)}
.band--moss h2{color:#F3EBDD}
.band-head{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:baseline;justify-content:space-between;
  border-bottom:1px solid currentColor;padding-bottom:12px;margin-bottom:6px}
.band-head h2{font-size:clamp(26px,3.4vw,38px)}
.band-head .meta{font:400 12px/1.4 var(--text);letter-spacing:.16em;text-transform:uppercase;opacity:.7}

.register{list-style:none;margin:0;padding:0}
.register li{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1.25fr) minmax(0,.8fr) minmax(0,1fr);gap:6px 22px;align-items:baseline;padding:13px 0;border-bottom:1px solid rgba(233,226,210,.2)}
.register .r-head{padding:0 0 9px;border-bottom:1px solid rgba(233,226,210,.45);font:700 10.5px/1 var(--text);letter-spacing:.18em;text-transform:uppercase;opacity:.65}
.register .r-coat,.register .r-size{font-size:14.5px;opacity:.88}
.register .r-size{white-space:nowrap;font-variant-numeric:tabular-nums}
.register li:last-child{border-bottom:0}
.register .r-name{font-family:var(--display);font-size:clamp(20px,2.2vw,27px)}
.register .r-name a{text-decoration:none}
.register .r-what{font-size:14.5px;opacity:.85}
.register .r-where{font:400 12.5px/1.3 var(--text);letter-spacing:.1em;text-transform:uppercase;color:var(--gold);white-space:nowrap}
.after-register{margin:18px 0 0;font-size:14.5px;opacity:.85}

.ground-band{display:grid;grid-template-columns:340px 1fr;align-items:stretch}
.ground-band > .gb-text{padding:clamp(24px,3vw,44px) clamp(20px,2.4vw,34px) clamp(24px,3vw,44px) 0;border-right:1px solid var(--rule-soft)}
.ground-band > .gb-map{padding:clamp(18px,2.4vw,30px) 0 clamp(18px,2.4vw,30px) clamp(20px,2.4vw,34px)}
.pinlist{list-style:none;margin:0;padding:0;font:400 13px/1.9 var(--text);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-60)}
.pinlist a{color:inherit;text-decoration:none;border-bottom:1px solid var(--rule)}
.pinlist a:hover{color:var(--accent);border-color:var(--accent)}

/* short group of entries */
.entry-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:clamp(18px,2.4vw,30px)}
.entry{display:flex;flex-direction:column;gap:8px;text-decoration:none;border-top:2px solid var(--ink);padding-top:12px}
.entry h3{font-size:clamp(19px,2vw,23px)}
.entry p{margin:0;font-size:14.5px;color:var(--ink-60)}
.entry:hover h3{color:var(--accent)}

/* ---------- figure system — four treatments, one drawing language ---------- */
figure{margin:0}
figcaption{margin-top:12px}
.cap{font:600 16.5px/1.45 var(--text);margin:0}
.credit{margin:6px 0 0;font:400 12.5px/1.45 var(--text);letter-spacing:.13em;text-transform:uppercase;color:var(--ink-45)}

/* 1 · matted — photograph sits on a mat, drawn corner brackets */
.fig-mat{background:var(--mat);border:1px solid var(--rule);padding:18px;position:relative}
.fig-mat img{width:100%;aspect-ratio:8/5;object-fit:cover}
.fig-mat .brk{position:absolute;width:22px;height:22px;color:var(--accent)}
.fig-mat .brk-tl{top:-1px;left:-1px}.fig-mat .brk-tr{top:-1px;right:-1px}
.fig-mat + figcaption,.fig-mat figcaption{margin-top:14px}
.fig-mat figcaption{margin-bottom:0}

/* 2 · offset — caption hangs beside the image on an accent rule */
.fig-offset{display:grid;grid-template-columns:1.55fr 1fr;gap:clamp(16px,2vw,26px);align-items:start}
.fig-offset img{width:100%;aspect-ratio:8/5;object-fit:cover;border:1px solid var(--rule)}
.fig-offset figcaption{border-left:2px solid var(--accent);padding-left:14px;margin-top:2px}

/* 3 · inset — small, in the column, prose beside */
.fig-inset{float:right;width:min(300px,44%);margin:6px 0 18px 26px}
.fig-inset img{width:100%;aspect-ratio:1/1;object-fit:cover;border:1px solid var(--rule)}
.fig-inset .cap{font-size:14.5px;font-weight:600}
.fig-inset .credit{font-size:10.5px}

/* 4 · full-bleed band, caption on ink */
.fig-bleed{margin-block:clamp(26px,4vw,44px)}
.fig-bleed img{width:100%;aspect-ratio:21/9;object-fit:cover}
.fig-bleed figcaption{background:var(--ink);color:#F3EBDD;padding:16px clamp(18px,3vw,30px);display:grid;grid-template-columns:1fr auto;gap:6px 26px;align-items:end;margin-top:0}
.fig-bleed .credit{color:rgba(237,228,214,.5)}

/* 5 · tinted plate — accent ground, used once per page at most */
.fig-tint{background:var(--accent);color:#FBF3E6;padding:16px}
.fig-tint img{width:100%;aspect-ratio:8/5;object-fit:cover;mix-blend-mode:luminosity}
.fig-tint .cap{color:#FBF3E6}
.fig-tint .credit{color:rgba(251,243,230,.7)}

.article-figure{margin-block:clamp(24px,3.4vw,38px);background:var(--mat);border:1px solid var(--rule);padding:18px}
.article-figure img{width:100%;aspect-ratio:8/5;object-fit:cover}
.article-figure figcaption{margin-top:14px}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-block:26px}
.gallery figure{background:var(--mat);border:1px solid var(--rule);padding:10px}
.gallery img{aspect-ratio:4/3;object-fit:cover}
.gallery figcaption{margin-top:8px}
.gallery .cap{font-size:14px}

/* ---------- map ---------- */
.map-figure{margin-block:clamp(24px,3.4vw,38px)}
.map-slot{background:var(--ink);border:1px solid var(--rule)}
.map-slot svg{display:block;width:100%;height:auto}
.gb-map .map-slot{display:flex;justify-content:center;max-height:560px}
.gb-map .map-slot svg{width:auto;height:560px;max-width:100%}
@media (max-width:720px){.map-slot svg text{display:none}}
.map-figure figcaption{margin-top:12px}
.map-legend{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:4px 16px;font:400 12.5px/1.5 var(--text);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-45)}

/* ---------- article page ---------- */
.article-head{display:grid;grid-template-columns:1.15fr .85fr;gap:0;border-bottom:1px solid var(--rule)}
.article-head .ah-text{padding:clamp(26px,4vw,52px) clamp(22px,3vw,44px) clamp(26px,4vw,46px) var(--gut)}
.article-head .ah-img{position:relative}
.article-head .ah-img img{width:100%;height:100%;min-height:280px;object-fit:cover;border-left:1px solid var(--rule)}
.article-head .ah-img .credit{position:absolute;right:0;bottom:0;margin:0;background:rgba(23,21,15,.82);color:rgba(237,228,214,.75);padding:6px 10px;max-width:100%}
.article-head h1{font-size:clamp(30px,4.4vw,56px);margin:16px 0 18px}
.lead{margin:0;font-size:clamp(18px,2vw,21px);line-height:1.5;color:rgba(23,21,15,.82);max-width:44ch}

.article{padding-block:clamp(26px,4vw,46px)}
.prose{max-width:var(--measure);margin-inline:auto;display:flow-root}
.prose > .fig-bleed,.prose > .fig-offset,.prose > .map-figure{--bo:min(1080px,calc(100vw - 2 * var(--gut)));width:var(--bo);margin-inline:calc((100% - var(--bo)) / 2)}
.prose > p{font-size:17.5px;line-height:1.7;margin:0 0 18px}
.prose h2{font-size:clamp(23px,2.8vw,30px);margin:34px 0 12px}
.prose h2::before{content:"";display:block;width:56px;border-top:2px solid var(--accent);margin-bottom:14px}
.prose h3{font-size:clamp(19px,2.2vw,23px);margin:26px 0 10px}
.prose a{text-decoration:underline}
.prose figure,.prose .field-notes,.prose .callout,.prose .timeline-block,.prose .map-figure,.prose .pullquote,.prose .statrow{max-width:none}


/* interruptions */
.field-notes{margin-block:clamp(26px,3.4vw,40px);background:var(--paper);border-top:3px solid var(--ink);padding:20px clamp(16px,2.2vw,26px) 22px}
.field-notes h2,.field-notes h3{font-family:var(--text);font-size:11.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin:0 0 14px;line-height:1.2}
.field-notes h2::before{content:none}
.field-notes dl{margin:0;display:grid;grid-template-columns:minmax(120px,24%) 1fr;gap:0 clamp(18px,2.4vw,34px)}
.field-notes dt{font-family:var(--display);font-size:17.5px;line-height:1.25;padding:9px 0;border-top:1px solid var(--rule-soft)}
.field-notes dd{margin:0;font-size:15px;line-height:1.55;color:rgba(23,21,15,.78);padding:10px 0 9px;border-top:1px solid var(--rule-soft)}
.field-notes dl > dt:first-of-type,.field-notes dl > dt:first-of-type + dd{border-top:0}
.field-notes--moss{background:var(--moss);border-top-color:var(--gold);color:#EDE6D6}
.field-notes--moss h3,.field-notes--moss h2{color:var(--gold)}
.field-notes--moss dd{color:rgba(237,230,214,.85)}
.field-notes--moss dt,.field-notes--moss dd{border-top-color:rgba(237,230,214,.22)}
.field-notes--moss .t-when{color:var(--gold)}
.field-notes--moss .timeline li{border-top-color:rgba(237,230,214,.22)}
.field-notes--moss .timeline li:last-child{border-bottom-color:rgba(237,230,214,.22)}
.field-notes--moss .t-what{color:rgba(237,230,214,.92)}

.callout{margin-block:clamp(24px,3vw,34px);border-top:2px solid var(--accent);border-bottom:1px solid var(--rule);padding:14px 0 16px}
.callout p{margin:0;font-size:17px;line-height:1.55}
.callout .kicker{margin-bottom:8px}
.note{font-size:15px;line-height:1.6;color:var(--ink-60);border-left:2px solid var(--rule);padding-left:14px;margin-block:20px}

.pullquote{margin-block:clamp(28px,3.6vw,40px);padding:0;border:0}
.pullquote p{margin:0;font-family:var(--display);font-size:clamp(22px,2.8vw,30px);line-height:1.28;color:var(--accent)}
.blockquote{margin-block:26px;background:var(--mat);border-left:3px solid var(--moss);padding:18px 20px}
.blockquote p{margin:0;font-family:var(--display);font-size:20px;line-height:1.35}
.blockquote cite{display:block;margin-top:10px;font:400 12.5px/1.4 var(--text);letter-spacing:.1em;text-transform:uppercase;font-style:normal;color:var(--ink-60)}

.timeline{list-style:none;margin:0;padding:0}
.timeline li{display:grid;grid-template-columns:minmax(140px,26%) 1fr;gap:6px 22px;padding:11px 0;border-top:1px solid var(--rule)}
.timeline li:last-child{border-bottom:1px solid var(--rule)}
.t-when{font:700 12.5px/1.45 var(--text);letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.t-what{font-size:15.5px;line-height:1.55}

.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1px;background:var(--rule);margin-block:clamp(24px,3vw,34px)}
.statblock{background:var(--paper);padding:16px 18px;display:flex;flex-direction:column;gap:4px}
.stat-num{font-family:var(--display);font-size:clamp(28px,3.4vw,40px);line-height:1;color:var(--accent)}
.stat-label{font:400 13px/1.45 var(--text);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-60)}

.datatable,.versus{width:100%;border-collapse:collapse;margin-block:clamp(24px,3vw,34px);font-size:15.5px}
.datatable caption,.versus caption{text-align:left;font:700 11.5px/1.3 var(--text);letter-spacing:.18em;text-transform:uppercase;color:var(--accent);padding-bottom:10px}
.datatable th,.versus th{text-align:left;font:700 11.5px/1.35 var(--text);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-60);border-bottom:2px solid var(--ink);padding:8px 12px 8px 0;vertical-align:bottom}
.datatable td,.versus td{padding:10px 12px 10px 0;border-bottom:1px solid var(--rule-soft);vertical-align:top}
.versus tbody th{border-bottom:1px solid var(--rule-soft);font-family:var(--display);font-size:16px;letter-spacing:0;text-transform:none;color:var(--ink);padding-right:20px}
.table-scroll{overflow-x:auto}

.chart{margin-block:clamp(24px,3vw,34px)}
.chart svg{width:100%;height:auto;overflow:visible}
.chart .c-bar{fill:var(--accent)}
.chart .c-bar-2{fill:var(--moss)}
.chart .c-axis{stroke:var(--rule);stroke-width:1}
.chart .c-label{font:400 12px var(--text);fill:var(--ink-60)}
.chart .c-value{font:700 12px var(--text);fill:var(--ink)}
.chart .c-line{fill:none;stroke:var(--accent);stroke-width:2}
.chart figcaption{margin-top:10px}

/* cards / references */
.profile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px;margin-block:clamp(24px,3vw,34px)}
.profile-card{background:var(--paper);border:1px solid var(--rule);padding:18px;display:flex;flex-direction:column;gap:8px}
.profile-card .p-photo{width:100%;aspect-ratio:4/3;object-fit:cover;margin-bottom:4px}
.profile-card h3{font-size:21px}
.profile-card .p-role{margin:0;font:700 11.5px/1.35 var(--text);letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.profile-card p{margin:0;font-size:15px;line-height:1.55}
.profile-card .p-links,.profile-card .p-attr{margin-top:auto;font-size:13px;color:var(--ink-60)}
.profile-card.no-photo{border-left:3px solid var(--moss)}

.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin-block:26px}
.org-card{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;align-items:center;background:var(--paper);border:1px solid var(--rule);padding:12px 14px;text-decoration:none}
.org-logo{width:52px;height:52px;object-fit:contain;grid-row:span 2}
.org-name{font-family:var(--display);font-size:17px;line-height:1.2}
.org-host{font:400 12px/1.3 var(--text);letter-spacing:.06em;color:var(--ink-45)}
.org-card.no-logo{grid-template-columns:1fr}
.entity-ref{text-decoration:underline;text-decoration-color:var(--accent);overflow-wrap:anywhere}

.further-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:clamp(16px,2vw,26px);margin-top:18px}
.further-grid a{display:flex;flex-direction:column;gap:7px;text-decoration:none;border-top:2px solid var(--ink);padding-top:12px;font-family:var(--display);font-size:20px;line-height:1.2}
.further-grid a .kicker{font-family:var(--text)}
.related-links{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:2px}
.related-links li{border-top:1px solid var(--rule)}
.related-links a{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline;padding:11px 0;text-decoration:none;font-family:var(--display);font-size:19px;line-height:1.25}
.related-links .kicker{font-family:var(--text);font-size:10.5px}
.related-links:empty{display:none}
.read-next{max-width:var(--measure);margin:clamp(34px,4.4vw,56px) auto 0;padding-top:16px;border-top:2px solid var(--ink)}
.read-next > .kicker{margin:0 0 4px}
.read-next .related-links li:first-child{border-top:0}
.read-next .related-links a{padding:13px 0;font-size:20px}
.read-next .related-links .kicker{min-width:130px}
@media (max-width:560px){
  .row{grid-template-columns:88px 1fr}
  .row .thumb img{width:88px;height:88px}
}
@media (max-width:520px){.read-next .related-links .kicker{min-width:0}}
.read-next .related-links a:hover{color:var(--accent)}

/* section / category pages */
.cat-list{list-style:none;margin:0;padding:0}
.cat-list li{border-top:1px solid var(--rule)}
.cat-list li:last-child{border-bottom:1px solid var(--rule)}
.cat-list a{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.4fr);gap:6px clamp(18px,3vw,40px);align-items:baseline;padding:16px 0;text-decoration:none}
.cat-list a:hover{background:rgba(178,58,31,.05)}
.cat-list .c-title{font-family:var(--display);font-size:clamp(20px,2.4vw,26px);line-height:1.15}
.cat-list .c-brief{font-size:15px;line-height:1.5;color:var(--ink-60)}
.hub-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:clamp(22px,3vw,40px)}

/* ---------- supporters: a directory strip above the footer ---------- */
.supporters{background:var(--ink);color:#F3EBDD;padding-block:clamp(28px,4vw,44px)}
.supporters a{color:#F3EBDD}
.sup-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 16px;margin-bottom:22px;border-bottom:1px solid rgba(237,228,214,.22);padding-bottom:12px}
.sup-head h2{font-size:clamp(20px,2.4vw,26px);color:#F3EBDD}
.sup-head p{margin:0;font:400 12px/1.4 var(--text);letter-spacing:.14em;text-transform:uppercase;color:rgba(237,228,214,.45)}
.sup-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:clamp(22px,2.8vw,44px)}
.sponsor-group{min-width:0}
.sponsor-group > h3{font:700 11px/1.3 var(--text);letter-spacing:.2em;text-transform:uppercase;color:var(--accent-lift);margin:0 0 6px;padding-bottom:8px;border-bottom:1px solid rgba(237,228,214,.3)}
.sponsor{display:block;width:100%;padding:12px 0;border-bottom:1px solid rgba(237,228,214,.16);text-decoration:none}
.sponsor img{width:100%;height:54px;max-height:54px;object-fit:contain;object-position:left center;background:#0F0E0A;border:1px solid rgba(237,228,214,.14);padding:6px 10px}
.sponsor-name{display:block;margin-top:9px;min-height:2.7em;font:400 14px/1.35 var(--text);letter-spacing:.05em;color:rgba(237,228,214,.8)}
.sponsor:hover .sponsor-name{color:var(--accent-lift)}
.sponsor.feat img{border-color:var(--accent-lift)}
.sponsor.feat .sponsor-name::after{content:"Founding";display:block;margin-top:2px;color:var(--accent-lift);letter-spacing:.16em;font-size:10.5px;text-transform:uppercase}

/* ---------- footer ---------- */
.site-foot{background:var(--ink);color:rgba(237,228,214,.8);padding-block:clamp(28px,4vw,40px)}
.site-foot a{color:rgba(237,228,214,.8)}
.site-foot a:hover{color:var(--accent-lift)}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:clamp(20px,3vw,40px)}
.foot-grid h2,.foot-grid h3{font:700 11px/1.3 var(--text);letter-spacing:.18em;text-transform:uppercase;color:rgba(237,228,214,.42);margin:0 0 10px}
.foot-brand{display:flex;align-items:center;gap:14px}
.foot-brand .ico{color:var(--accent-lift)}
.foot-brand span{font-family:var(--display);font-size:22px;color:#F3EBDD}
.foot-grid ul{list-style:none;margin:0;padding:0;font-size:14px;line-height:1.85}
.foot-note{margin:14px 0 0;max-width:44ch;font-size:13.5px;line-height:1.6;color:rgba(237,228,214,.55)}

/* ---------- responsive ---------- */
@media (max-width:1040px){
  .article-head{grid-template-columns:1fr}
  .article-head .ah-text{padding-right:var(--gut)}
  .article-head .ah-img img{border-left:0;border-top:1px solid var(--rule);aspect-ratio:16/9;min-height:0}
  .ground-band{grid-template-columns:1fr}
  .ground-band > .gb-text{border-right:0;border-bottom:1px solid var(--rule-soft);padding-right:0}
  .ground-band > .gb-map{padding-left:0}
}
@media (max-width:1040px){
  .lead-figure{grid-template-columns:1fr}
}
@media (max-width:860px){
  .pair{grid-template-columns:1fr}
  .fig-offset{grid-template-columns:1fr}
  .fig-offset figcaption{border-left:0;border-top:2px solid var(--accent);padding:10px 0 0}
  .foot-grid{grid-template-columns:1fr 1fr}
  .cat-list a{grid-template-columns:1fr}
  .register li,.register .r-head{grid-template-columns:1fr 1fr;gap:4px 18px}
  .register .r-name{grid-column:1/-1}
  .register .r-head span:nth-child(n+3){display:none}
  .register .r-head span:first-child{grid-column:1/-1}
}
@media (max-width:720px){
  .nav-1{gap:0 clamp(14px,4vw,22px)}
  .nav-1 a{min-height:44px}
  .mast-mobile summary{min-height:44px;display:flex;align-items:center}
  .mast-mobile .nav-2 a{min-height:38px;display:flex;align-items:center}
  .foot-grid ul a{display:inline-flex;align-items:center;min-height:38px}
  .pinlist a,.map-legend a{display:inline-flex;align-items:center;min-height:34px}
  .prose > .fig-bleed,.prose > .fig-offset,.prose > .map-figure{--bo:100%;margin-inline:0}
  .field-notes dl{grid-template-columns:1fr}
  .field-notes dt{padding-bottom:0;border-top:1px solid var(--rule-soft)}
  .field-notes dd{padding-top:2px;border-top:0}

  body{font-size:16.5px}
  .mast-standfirst{margin-left:0;max-width:none;order:3;flex-basis:100%}
  .mast-name{flex-wrap:wrap;gap:14px}
  .nav-2{display:none}
  .mast-mobile{display:block;margin-top:14px}
  .mast-mobile summary{font:700 11.5px/1 var(--text);letter-spacing:.18em;text-transform:uppercase;color:var(--accent-lift);cursor:pointer;padding:10px 0;border-top:1px solid rgba(237,228,214,.2)}
  .mast-mobile .nav-2{display:flex;flex-direction:column;gap:2px;margin-top:4px;padding-bottom:10px}
  .fig-inset{float:none;width:100%;margin:20px 0}
  .fig-bleed figcaption{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr}
  .lead-figure{grid-template-columns:1fr}
  .timeline li{grid-template-columns:1fr}
  .field-notes dl{grid-template-columns:1fr}
}
@media print{.masthead,.supporters,.site-foot{background:#fff;color:#000}}

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

/* MAPKIT_BEGIN — injected real geodata; pins are links */
.map-slot{padding:0;background:none!important;border:0!important;display:flex;align-items:center;justify-content:center;min-height:0!important}
.map-slot>svg.mapkit{width:100%!important;max-width:100%;height:auto;max-height:none;margin:0 auto}
.map-slot{width:100%}
.map-slot{aspect-ratio:auto!important;height:auto!important}
.map-slot::after,.map-slot::before{content:none!important;display:none!important}
.map-figure figcaption{}
.mapkit__pin{cursor:pointer}
.mapkit__pin text{paint-order:stroke;stroke:#14120D;stroke-width:3px;stroke-linejoin:round}
.mapkit__pin:hover circle{r:10.9}
.mapkit__pin:hover text{font-weight:700}
/* MAPKIT_END */


/* sp-domain-override: per-domain, from work/css_override.css */
/* mostradelcavallo.com — pad the MARK, not the tile.
   ⚠️ Two corrections to my first attempt:
   1. Selector. `[data-partner]` (0,1,0) LOST the cascade to Design's own more specific rule — the
      override was in the stylesheet and computed padding stayed 12px 0px. Qualifying it with the
      class raises specificity enough to win.
   2. Approach. Operator: "dont reduce the size of the grids - add padding inside the grid for the
      image itself." The <img> is already border-box with its own horizontal padding, so raising
      THAT insets the artwork while the tile and the image box keep their exact dimensions.
      No max-width cap — nothing is scaled down. */
a.sponsor[data-partner] img, .sponsor[data-partner] img, [data-partner] .sponsor-box img{
  box-sizing:border-box!important;
  padding-left:26px!important; padding-right:26px!important;
  padding-top:10px!important; padding-bottom:10px!important;
  object-fit:contain!important;
}
a.sponsor[data-partner] img, .sponsor[data-partner] img{ object-position:center!important; }

/* MAPKIT_BEGIN — injected real geodata; pins are links */
.map-slot{padding:0;background:none!important;border:0!important;display:flex;align-items:center;justify-content:center;min-height:0!important}
.map-slot>svg.mapkit{width:100%!important;max-width:100%;height:auto;max-height:none;margin:0 auto}
.map-slot{width:100%}
.map-slot{aspect-ratio:auto!important;height:auto!important}
.map-slot::after,.map-slot::before{content:none!important;display:none!important}
.map-figure figcaption{}
.mapkit__pin{cursor:pointer}
.mapkit__pin text{paint-order:stroke;stroke:#14120D;stroke-width:3px;stroke-linejoin:round}
.mapkit__pin:hover circle{r:10.9}
.mapkit__pin:hover text{font-weight:700}
/* MAPKIT_END */

/* op-drop-founding-tag: operator asked for the FOUNDING text on the two featured tiles to go —
   it is a ::after on .sponsor-name, not page copy, which is why it was nowhere in the HTML.
   (I first mis-read the ask and cut the group heading instead; that is restored.) The featured
   tiles keep their accent border, so the tier still reads as the leading one. */
.sponsor.feat .sponsor-name::after{content:none}

/* op-nav-collapse: this nav printed 168px of stacked links at 390 before any content
   (23 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 "bracket", 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 (18px measured) the button carries the build's
   gutter (clamp(18px,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 (860px here), where the button appears and the nav starts closed.
   Folded with the "display" technique and marked with the "dots" icon — the mechanism
   is deliberately not identical across the fleet either. */
.nav-fold{display:none}
@media (max-width:860px){
  .nav-fold{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;padding:10px 4px;letter-spacing:.2em;gap:12px;margin-block:clamp(16px,4.5vw,26px) clamp(12px,3vw,18px)}
  .nav-fold::before{content:"[";opacity:.55}
  .nav-fold::after{content:"]";opacity:.55}
  .nav-fold-bars{width:13px;height:3px;flex:none;border-radius:99px;background:currentColor;box-shadow:5px 0 0 -0.5px currentColor,-5px 0 0 -0.5px currentColor}
  .mast-nav{display:none}
  .nav-fold-c:checked ~ .mast-nav{display:block}
  .wrap:has(> .nav-fold){display:flow-root}
  .nav-fold:not(:has(~ .mast-nav)){display:none}
}

/* op-footer-compact: the footer printed 5 rows for 5 link(s) in
   1 list(s) — 525px at 390, 8% 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 525 -> 374px (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(2.78vw,40px)!important;row-gap:6px!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:20px}
}

/* op-money-columns: the supporters block ran one tile per row — 12 tiles,
   1627px at 390, 24% of the whole page. Two columns bring it to
   1047px (36% shorter). Checked before writing: no new overflow, smallest mark still
   170px wide, longest blurb 2 lines, tile heights 104-126px.
   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-group), 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-group{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:14px!important}
    .sponsor-group > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .sponsor-group > * *{min-width:0!important;max-width:100%}
    .sponsor-group img,.sponsor-group svg{max-width:100%;height:auto}

}

/* op-odd-tier-lead: .sponsor-group (3 tiles), .sponsor-group (3 tiles), .sponsor-group (3 tiles), .sponsor-group (3 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-group:has(> a:nth-of-type(odd):last-of-type) > [data-partner]:first-of-type{grid-column:1 / -1!important}
  .sponsor-group:has(> a:nth-of-type(odd):last-of-type) > [data-partner]:first-of-type{grid-column:1 / -1!important}
  .sponsor-group:has(> a:nth-of-type(odd):last-of-type) > [data-partner]:first-of-type{grid-column:1 / -1!important}
  .sponsor-group:has(> a:nth-of-type(odd):last-of-type) > [data-partner]:first-of-type{grid-column:1 / -1!important}
}

/* op-article-width: the article column was capped at 732px (87 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 1280 changes. Originals: migration/_backups/article_width/. */
@media (min-width:1280px){
  div.prose{--measure:min(82.449ch, 100%)!important}
}
@media (min-width:1600px){
  div.prose{--measure:min(clamp(82.449ch, 59.861vw, calc(82.449ch * 1.2)), 100%)!important}
  div.prose > :is(p:not([class])){font-size:clamp(17.5px,1.2153vw,21.0px)!important}
}
/* op-article-width: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(article.row > div.thumb > img,
  article.second > figure.fig-mat > img,
  div.article-head > div.ah-img > img,
  div.prose > figure.fig-bleed > img,
  div.prose > figure.fig-mat > img,
  div.prose > figure.fig-offset > img,
  div.prose > figure.fig-tint > img,
  div.wrap > figure.fig-offset > img,
  section.lead-band > figure.lead-figure > img){height:auto}
/* op-img-dims:end */
.sponsor-group > [data-partner] img{background:transparent!important}
.sponsor-group.sponsor-group > [data-partner][data-partner] img{border:0!important}