/* medioevoitaliano.org — Register */
:root{
  --paper:#F4EFE4;      /* ground */
  --panel:#E9E2D2;      /* secondary ground */
  --ink:#241D17;        /* ink */
  --ink-2:#4A4038;
  --quiet:#8A7D6F;
  --rubric:#A32219;     /* accent — rubric red */
  --verdigris:#16564B;  /* secondary — verdigris */
  --saffron:#C98A12;    /* area — saffron */
  --rule:rgba(36,29,23,.18);
  --rule-2:rgba(36,29,23,.35);
  --measure:70ch;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);
  font:400 20px/1.68 Cardo,"Times New Roman",Georgia,serif;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:var(--verdigris);text-decoration:none}
a:hover{color:var(--rubric)}
h1,h2,h3{font-weight:700;letter-spacing:-.01em}
.k{font-family:Karla,system-ui,-apple-system,sans-serif}
.wrap{width:100%;max-width:1320px;margin:0 auto;padding-inline:clamp(18px,4vw,46px)}
.narrow{max-width:900px}
.rule{display:block;width:100%;height:5px;color:var(--ink);fill:none;stroke:currentColor;stroke-width:1.4}
.rule.thin{stroke-width:1}
.kicker{font-family:Karla,sans-serif;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--rubric);margin:0}
.ico{width:18px;height:18px;flex:none;color:var(--rubric);fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ico-lg{width:26px;height:26px}
.skip{position:absolute;left:-9999px}
.skip:focus{position:static;display:inline-block;padding:8px}

/* ---------- masthead: the ruled ledger head ---------- */
.mast{padding-top:22px}
.mast-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px 40px;flex-wrap:wrap;padding:22px 0 16px}
.mast-id{min-width:min(100%,520px)}
.mast-name{display:flex;align-items:center;gap:18px;color:var(--ink)}
.mast-mark{width:66px;height:66px;flex:none;color:var(--rubric);fill:none;stroke:currentColor;stroke-width:2.4;stroke-linejoin:round}
.mast-title{font-size:clamp(26px,4vw,48px);line-height:1;font-weight:700;margin:0;white-space:nowrap}
.mast-sub{font-family:Karla,sans-serif;font-size:12px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--verdigris);margin:10px 0 0}
.mast-note{font-family:Karla,sans-serif;font-size:12.5px;line-height:1.6;color:var(--quiet);text-align:right;max-width:26ch;margin:0 0 4px}
.ledger-nav{display:flex;flex-wrap:wrap;align-items:baseline;gap:12px 30px;padding:13px 0;font-family:Karla,sans-serif;font-size:15px}
.ledger-nav a{display:flex;align-items:center;gap:9px;color:var(--ink);font-weight:600}
.ledger-nav a[aria-current]{color:var(--rubric)}
.ledger-nav .n{font-family:Cardo,serif;font-weight:400;color:var(--rubric)}
.ledger-nav .spare{margin-left:auto;display:flex;gap:24px}
.ledger-nav .spare a{color:var(--verdigris)}
@media(max-width:900px){
  .mast-note{display:none}
  .ledger-nav{flex-direction:column;gap:0;padding:4px 0 8px}
  .ledger-nav>a,.ledger-nav .spare a{padding:12px 0;border-bottom:1px solid var(--rule)}
  .ledger-nav .spare{margin:0;flex-direction:column;gap:0;width:100%}
}

/* ---------- bands ---------- */
.band{padding:clamp(34px,5vw,62px) 0}
.band-panel{background:var(--panel)}
.band-saffron{background:var(--saffron)}
.band-verdigris{background:var(--verdigris);color:#EAF1EE}
.band-verdigris a{color:#F3D9A0}
.band-tight{padding:clamp(26px,3.4vw,38px) 0}
.band-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:14px}
.band-head h2{font-size:clamp(26px,3vw,34px);margin:0}
.band-head .side{font-family:Karla,sans-serif;font-size:13px;color:var(--quiet)}
.quiet-line{font-size:clamp(20px,2.4vw,26px);line-height:1.5;font-style:italic;margin:22px 0 0;text-align:center;color:var(--ink-2)}

/* lead entry */
.lead-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(24px,4vw,52px);align-items:center}
.lead-title{font-size:clamp(34px,5vw,56px);line-height:1.04;margin:12px 0 0;max-width:24ch}
.lead-dek{font-size:clamp(18px,2vw,21px);line-height:1.6;margin:16px 0 0;max-width:52ch;color:#3D2F10}
.entry-meta{display:flex;flex-wrap:wrap;gap:0;margin-top:24px;border-top:1px solid rgba(36,29,23,.4);font-family:Karla,sans-serif;font-size:13.5px}
.entry-meta div{padding:12px 26px 0 0;margin-right:26px;border-right:1px solid rgba(36,29,23,.25)}
.entry-meta div:last-child{border-right:0;margin-right:0}
.entry-meta dt,.entry-meta .lab{display:block;font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);margin-bottom:2px}
@media(max-width:860px){.lead-grid{grid-template-columns:1fr}}

/* seconds */
.seconds{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(24px,4vw,48px)}
@media(max-width:860px){.seconds{grid-template-columns:1fr}}
.entry-title{font-size:clamp(24px,2.8vw,32px);line-height:1.14;margin:10px 0 0}
.entry-title a{color:var(--ink)}
.entry-dek{font-family:Karla,sans-serif;font-size:16px;line-height:1.62;color:var(--ink-2);margin:10px 0 0}
.entry-line{font-family:Karla,sans-serif;font-size:12.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--quiet);margin:12px 0 0}

/* ---------- the register ---------- */
.register{list-style:none;margin:0;padding:0;font-family:Karla,sans-serif;font-size:15.5px}
.register .rh,.register li{display:grid;
  grid-template-columns:54px minmax(0,1.7fr) minmax(0,1fr) 62px minmax(0,1.5fr) minmax(0,.95fr);
  gap:20px;padding:13px 0;border-bottom:1px solid var(--rule);align-items:baseline}
.register .rh{border-bottom:none;padding:0 0 7px;font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--rubric)}
.register .no{font-family:Cardo,serif;font-size:16px;color:var(--rubric)}
.register .t{font-weight:700;color:var(--ink)}
.register .t:hover{color:var(--rubric)}
.register .disputed{color:var(--rubric)}
.register .meta{display:none}
.register li.is-open{background:rgba(201,138,18,.12)}
@media(max-width:900px){
  .register .rh{display:none}
  .register li{grid-template-columns:42px 1fr;gap:4px 12px}
  .register li .c{display:none}
  .register .meta{display:block;grid-column:2;font-size:13px;line-height:1.5;color:var(--quiet)}
}

/* ---------- figures ---------- */
figure{margin:0}
figcaption{font-family:Cardo,serif;font-size:18px;line-height:1.45;margin-top:12px;padding-top:11px;
  border-top:2px solid var(--rubric);max-width:62ch}
.credit{display:block;font-family:Karla,sans-serif;font-size:11.5px;letter-spacing:.05em;
  text-transform:uppercase;color:var(--quiet);margin-top:8px}
/* 1 · plate: mat + inset hairline */
.fig-plate{background:var(--paper);padding:clamp(10px,1.4vw,16px)}
.fig-plate .frame{box-shadow:inset 0 0 0 1px var(--rule-2);padding:0;overflow:hidden}
.fig-plate img{width:100%}
/* 2 · inset: sits in the column, prose beside it */
.fig-inset{float:right;width:min(340px,44%);margin:10px 0 22px 34px;background:var(--panel);padding:12px}
.fig-inset figcaption{font-size:16px;border-top-width:1px;border-top-color:var(--rubric);max-width:none}
.fig-inset.left{float:left;margin:10px 34px 22px 0}
@media(max-width:720px){.fig-inset,.fig-inset.left{float:none;width:100%;margin:26px 0}}
/* 3 · band: breaks the measure, caption on a verdigris strip */
.fig-band{margin:44px 0}
.fig-band img{width:100%;max-height:62vh;object-fit:cover}
.fig-band .strip{background:var(--verdigris);color:#EAF1EE;padding:18px clamp(18px,3vw,32px)}
.fig-band .strip figcaption,.fig-band figcaption{border-top:none;margin:0;padding:0;font-size:19px;max-width:70ch}
.fig-band .credit{color:#A9C6BC}
/* 4 · map */
.map-figure .map-frame{background:var(--panel);padding:clamp(12px,2vw,20px);box-shadow:inset 0 0 0 1px var(--rule)}
.mapsvg{display:block;width:100%;height:auto}
.mapsvg .land{fill:#DCD0BA;stroke:var(--ink);stroke-width:3;stroke-linejoin:round}
.mapsvg .pin{fill:var(--rubric)}
.mapsvg .pin-dot{fill:var(--ink)}
.mapsvg .pin-lead{stroke:var(--ink);stroke-width:2.5}
.mapsvg .is-here .pin{fill:var(--verdigris)}
.mapsvg .is-here .pin-dot,.mapsvg .is-here .pin-lead{stroke:var(--verdigris);fill:var(--verdigris)}

.mapsvg .pin-no{fill:#F4EFE4;font:700 26px Karla,sans-serif;text-anchor:middle}
.mapsvg .pin-label{fill:var(--ink);font:600 21px Karla,sans-serif}
.mapsvg .is-here .pin{fill:var(--verdigris)}
.map-list{list-style:none;margin:26px 0 0;padding:0;font-family:Karla,sans-serif;font-size:17.5px;
  display:grid;grid-template-columns:1fr;gap:0}
.map-list li{display:grid;grid-template-columns:52px 1fr;align-items:baseline;padding:15px 12px 15px 0;
  border-top:1px solid var(--rule);transition:background .14s,padding-left .14s}
.map-list li:last-child{border-bottom:1px solid var(--rule)}
.map-list li.is-active{background:rgba(22,86,75,.1);padding-left:10px}
.map-list li a{font-weight:600;color:var(--verdigris)}
.map-list li.is-active a,.map-list li.is-active span:not(.no){color:var(--rubric)}
.map-list .no{font-family:Cardo,serif;font-size:20px;color:var(--rubric)}
.mapsvg g[id]{outline:none}
.mapsvg g.is-active .pin{fill:var(--verdigris)}
.mapsvg g.is-active .pin-dot,.mapsvg g.is-active .pin-lead{fill:var(--verdigris);stroke:var(--verdigris)}
.mapsvg g.is-active .pin{stroke:var(--ink);stroke-width:4}
.mapsvg g:focus-visible .pin{stroke:var(--ink);stroke-width:4}
.map-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(24px,4vw,52px);align-items:start}
@media(max-width:900px){.map-grid{grid-template-columns:1fr}}

/* ---------- sections index ---------- */
.sec-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1px}
.sec-card{background:var(--paper);box-shadow:0 0 0 1px var(--rule);padding:22px 22px 24px;display:flex;flex-direction:column;min-height:170px}
.sec-card h3{font-size:23px;margin:10px 0 0}
.sec-card h3 a{color:var(--ink)}
.sec-card p{font-family:Karla,sans-serif;font-size:14.5px;line-height:1.55;color:var(--ink-2);margin:8px 0 0}
.sec-card .count{margin-top:auto;padding-top:14px;font-family:Karla,sans-serif;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--quiet)}
.sec-no{font-family:Cardo,serif;font-size:15px;color:var(--rubric)}

/* ---------- disagreement ---------- */
.bracketed{position:relative;background:var(--panel);padding:clamp(24px,4vw,40px)}
.bracketed .bk{position:absolute;width:34px;height:34px;color:var(--rubric);fill:none;stroke:currentColor;stroke-width:1.6}
.bracketed .bk-tl{top:10px;left:10px}
.bracketed .bk-br{bottom:10px;right:10px;transform:rotate(180deg)}
.readings{list-style:none;margin:0;padding:0;font-family:Karla,sans-serif;font-size:16px}
.readings li{display:grid;grid-template-columns:30px 1fr;gap:16px;padding:13px 0;border-top:1px solid var(--rule)}
.readings li:last-child{border-bottom:1px solid var(--rule)}
.readings .r-no{font-family:Cardo,serif;color:var(--rubric)}
.two-col{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:clamp(22px,4vw,46px)}
@media(max-width:860px){.two-col{grid-template-columns:1fr}}

/* ---------- article ---------- */
.entry-head{padding:30px 0 0}
.entry-kicker{display:flex;align-items:center;gap:10px;font-family:Karla,sans-serif;font-size:11.5px;
  font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--rubric)}
.entry-kicker a{color:var(--rubric)}
.entry-h1{font-size:clamp(34px,5.4vw,64px);line-height:1;margin:16px 0 0;max-width:24ch}
.lead{font-size:clamp(20px,2.3vw,25px);line-height:1.5;margin:20px 0 0;max-width:46ch;color:var(--ink)}
.entry-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:0;margin:26px 0 0;
  border-top:1px solid var(--ink);border-bottom:1px solid var(--rule);font-family:Karla,sans-serif;font-size:14.5px}
.entry-strip div{padding:14px 22px 14px 0}
.entry-strip .lab{display:block;font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--rubric);margin-bottom:3px}
.sub-line{display:flex;flex-wrap:wrap;gap:8px 22px;padding:14px 0;font-family:Karla,sans-serif;font-size:14px;border-bottom:1px solid var(--rule)}
.sub-line span{color:var(--quiet);font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:10.5px;align-self:center}
.sub-line a{color:var(--ink-2)}
.sub-line a[aria-current]{color:var(--rubric);font-weight:700}
.article{display:grid;grid-template-columns:minmax(18px,1fr) minmax(0,var(--measure)) minmax(18px,1fr);
  padding-block:clamp(26px,4vw,44px) 0}
.article>*{grid-column:2;min-width:0}
.article>.bleed{grid-column:1/-1}
.article h2{font-size:clamp(24px,3vw,32px);line-height:1.18;margin:44px 0 0}
.article p{margin:20px 0 0}
.article p:first-of-type{margin-top:0}
.notes{background:var(--panel);padding:clamp(26px,4vw,44px) 0;margin:48px 0}
.notes-in{width:100%;max-width:1020px;margin:0 auto;padding-inline:clamp(18px,4vw,46px)}
.notes h2{font-family:Karla,sans-serif;font-size:11px;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:var(--rubric);margin:0 0 16px}
.article-foot{margin:52px 0 0;padding-top:0}
.article .foot-h,.article-foot .foot-h,.foot-h{font-family:Karla,sans-serif;font-size:11px;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink);border-bottom:1px solid var(--ink);padding-bottom:8px;margin:0 0 4px}

/* ---------- components ---------- */
.timeline{list-style:none;margin:0;padding:0}
.timeline li{display:grid;grid-template-columns:minmax(130px,210px) minmax(0,1fr);gap:6px 26px;
  padding:13px 0;border-top:1px solid var(--rule)}
.timeline li:last-child{border-bottom:1px solid var(--rule)}
.t-when{font-family:Karla,sans-serif;font-weight:700;font-size:14px;line-height:1.45;color:var(--verdigris)}
.t-what{font-size:18px;line-height:1.5}
@media(max-width:640px){.timeline li{grid-template-columns:1fr;gap:2px}}
table.datatable,table.versus{width:100%;border-collapse:collapse;font-size:17px;table-layout:fixed}
.datatable th,.datatable td,.versus th,.versus td{text-align:left;vertical-align:top;
  padding:12px 16px 12px 0;border-bottom:1px solid var(--rule);overflow-wrap:break-word}
.datatable th,.versus th{font-family:Karla,sans-serif;font-size:10.5px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--rubric)}
.datatable td:first-child{font-weight:700}
.versus td:first-child{font-family:Karla,sans-serif;font-size:14px;font-weight:700;color:var(--verdigris)}
.statrow{display:flex;flex-wrap:wrap;gap:2px}
.statblock{background:var(--verdigris);color:#EAF1EE;padding:22px 26px;flex:1 1 210px}
.stat-num{display:block;font-size:clamp(34px,4vw,50px);line-height:1;font-weight:700}
.stat-label{display:block;font-family:Karla,sans-serif;font-size:13px;line-height:1.4;color:#C3DBD4;margin-top:8px}
.callout{margin:34px 0;padding:4px 0 4px 24px;border-left:4px solid var(--verdigris);font-size:19px}
.callout p{margin:0}
p.note{font-family:Karla,sans-serif;font-size:15px;line-height:1.6;color:var(--ink-2);
  border-top:1px solid var(--rule);padding-top:11px;margin:30px 0 0}
.pullquote{margin:40px 0;padding:0;border-top:2px solid var(--rubric);border-bottom:2px solid var(--rubric)}
.pullquote p{font-size:clamp(22px,2.7vw,29px);line-height:1.34;font-style:italic;margin:20px 0}
.blockquote{margin:34px 0;padding-left:24px;border-left:1px solid var(--rule)}
.blockquote p{margin:0;font-size:20px}
.blockquote cite{display:block;font-family:Karla,sans-serif;font-style:normal;font-size:13px;
  letter-spacing:.05em;color:var(--quiet);margin-top:12px}
.profile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px}
.profile-card{display:flex;flex-direction:column;background:var(--paper);padding:20px;box-shadow:inset 0 0 0 1px var(--rule)}
.profile-card .p-photo{width:100%;aspect-ratio:4/3;object-fit:cover;margin-bottom:14px}
.profile-card h3{font-size:21px;margin:0}
.p-role{font-family:Karla,sans-serif;font-size:11px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--rubric);margin:6px 0 10px}
.profile-card p{font-size:17px;line-height:1.55;margin:0 0 10px}
.p-links{margin-top:auto;padding-top:6px;font-family:Karla,sans-serif;font-size:14px}
.p-attr{font-family:Karla,sans-serif;font-size:11.5px;color:var(--quiet)}
.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:14px}
.org-card{display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px 14px;align-items:center;
  background:var(--panel);padding:15px 18px}
.org-logo{width:38px;height:38px;grid-row:span 2;object-fit:contain}
.org-name{font-weight:700;font-size:18px;color:var(--ink);overflow-wrap:break-word}
.org-host{font-family:Karla,sans-serif;font-size:12px;color:var(--quiet)}
.entity-ref{white-space:nowrap}
.further-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1px}
.further-grid a{display:flex;flex-direction:column;background:var(--paper);box-shadow:0 0 0 1px var(--rule);padding:18px 20px;
  min-height:132px;font-size:20px;line-height:1.25;color:var(--ink)}
.further-grid a .k{margin-top:auto;padding-top:10px;font-size:11px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--rubric)}
.related-links{list-style:none;margin:0;padding:0;font-family:Karla,sans-serif;font-size:16px}
.related-links li{border-bottom:1px solid var(--rule)}
.related-links a{display:block;padding:13px 0}
.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:56px minmax(0,1fr);gap:6px 18px;padding:20px 0;color:var(--ink)}
.cat-list .no{font-family:Cardo,serif;font-size:17px;color:var(--rubric)}
.cat-list .t{font-size:25px;line-height:1.18;font-weight:700}
.cat-list .d{font-family:Karla,sans-serif;font-size:15.5px;line-height:1.55;color:var(--ink-2);grid-column:2}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px}
.gallery figure{background:var(--panel);padding:10px}
.gallery figcaption{font-size:15.5px;border-top-width:1px}
details.more{margin-top:14px}
details.more summary{font-family:Karla,sans-serif;font-size:14px;font-weight:700;color:var(--verdigris);cursor:pointer;padding:12px 0}

/* ---------- rail (section / register pages) ---------- */
.with-rail{display:grid;grid-template-columns:250px minmax(0,1fr);gap:clamp(26px,4vw,54px);align-items:start}
@media(max-width:900px){.with-rail{grid-template-columns:1fr}}
.rail h2,.rail .foot-h{font-family:Karla,sans-serif;font-size:10.5px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--rubric);border-bottom:1px solid var(--ink);padding-bottom:7px;margin:0}
.rail ul{list-style:none;margin:0;padding:0;font-family:Karla,sans-serif;font-size:14.5px}
.rail li{border-bottom:1px solid var(--rule)}
.rail a{display:block;padding:11px 0;color:var(--ink-2)}
.rail a[aria-current]{color:var(--rubric);font-weight:700}

/* ---------- colophon / supporters ---------- */
.colophon{background:var(--panel);padding:clamp(30px,5vw,52px) 0;margin-top:clamp(40px,6vw,72px)}
.colophon-head{display:flex;align-items:flex-end;justify-content:space-between;gap:22px;flex-wrap:wrap;margin-bottom:8px}
.colophon-head h2{font-size:26px;margin:6px 0 0}
.colophon-head p{font-family:Karla,sans-serif;font-size:13.5px;line-height:1.6;color:var(--ink-2);margin:0;max-width:46ch}
.sponsor-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(248px,272px));gap:22px;justify-content:center;margin-top:24px}
.sponsor{display:block;background:var(--paper);padding:16px;box-shadow:inset 0 0 0 1px var(--rule);color:var(--ink)}
.sponsor-box{display:flex;align-items:center;justify-content:center;background:var(--ink);height:64px;padding:8px 12px}
.sponsor-box img{max-height:44px;max-width:100%;width:auto;height:auto;object-fit:contain}
.sponsor-name{display:block;font-family:Karla,sans-serif;font-size:15px;font-weight:700;margin-top:13px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sponsor-blurb{display:block;font-size:16px;line-height:1.45;color:var(--ink-2);margin-top:6px}
@media(max-width:620px){.sponsor-grid{grid-template-columns:1fr}}

/* ---------- footer ---------- */
.site-foot{background:var(--ink);color:#C9BFAE;padding:clamp(30px,4vw,44px) 0}
.site-foot a{color:#C9BFAE}
.site-foot a:hover{color:var(--saffron)}
.foot-grid{display:flex;flex-wrap:wrap;gap:26px 44px;justify-content:space-between;align-items:flex-start}
.foot-name{display:flex;align-items:center;gap:14px;font-size:21px;color:var(--paper)}
.foot-name svg{width:30px;height:30px;color:var(--saffron);fill:none;stroke:currentColor;stroke-width:3}
.foot-nav{display:flex;flex-wrap:wrap;gap:10px 26px;font-family:Karla,sans-serif;font-size:14px}
.foot-note{font-family:Karla,sans-serif;font-size:12.5px;line-height:1.6;color:#8A7D6F;max-width:40ch;margin:0}

.rlist{list-style:none;margin:0;padding:0;font-size:18px}
.rlist li{padding:12px 0;border-top:1px solid var(--rule)}
.rlist li:last-child{border-bottom:1px solid var(--rule)}
.org-card.no-logo{grid-template-columns:minmax(0,1fr)}
.profile-card.no-photo .p-photo{display:none}
.lead-fig{margin:0 0 6px}
.notes .statrow{margin-top:4px}

.article-figure{background:var(--paper);padding:clamp(10px,1.4vw,16px)}
.article-figure img{width:100%;box-shadow:inset 0 0 0 1px var(--rule-2)}
.chart{margin:0}
.chart svg{display:block;width:100%;height:auto}
.chart .bar-r{fill:var(--verdigris)}
.chart .bar-r.alt{fill:var(--saffron)}
.chart .bar-l{fill:var(--ink);font:600 15px Karla,sans-serif}
.chart .bar-v{fill:var(--rubric);font:700 15px Karla,sans-serif}
.chart figcaption{border-top-width:1px}
.sg-block{padding:34px 0;border-top:1px solid var(--rule)}
.sg-block>h2{font-family:Karla,sans-serif;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--rubric);margin:0 0 18px}
.sg-narrow{max-width:70ch}

/* image ratio — the kit ships 1600x1000; portraits crop to the same window */
.fig-plate img,.fig-inset img,.article-figure img,.gallery img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover}
.fig-band img{width:100%;height:auto;aspect-ratio:21/9;object-fit:cover;max-height:none}
.map-frame .mapsvg{height:auto}
.lead-grid{align-items:start}

/* article rhythm */
.entry-head{max-width:var(--measure);margin-inline:auto}
.article h2,.article-foot{clear:both}
.article>.notes+.notes,.article>figure+figure{margin-top:0}
@media(max-width:720px){.fig-inset figcaption{max-width:none}}

/* the inset needs a block formatting context: floats do nothing on a grid item */
.figwrap{display:block}
.figwrap::after{content:"";display:block;clear:both}
.figwrap>p:first-of-type{margin-top:0}
.figwrap>p{margin-top:20px}

/* entry pages: the lead plate sits in the measure with the prose, not at page width */
.article>.bleed.lead-fig{grid-column:2}
.lead-fig .wrap{max-width:none;padding-inline:0}
.article .fig-plate{padding:10px}
.article .fig-plate figcaption{max-width:none}
.fig-inset{margin:6px 0 18px 30px}
.fig-inset.left{margin:6px 30px 18px 0}

/* article foot: a clean boundary, and rows that always fill */
.article-foot{border-top:2px solid var(--ink);padding-top:24px}
.article-foot .foot-h{border-bottom-color:var(--rule)}
.further-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.further-grid a{min-height:104px;font-size:18px;line-height:1.28}
@media(max-width:720px){.further-grid{grid-template-columns:1fr}.further-grid a{min-height:0}}

.article{padding-bottom:clamp(44px,6vw,80px)}

/* header: keep the numbered line on one row, or stack it cleanly — never a wrapped hybrid */
.ledger-nav{gap:12px 26px;font-size:15.5px}
.ledger-nav .ico{width:20px;height:20px}
@media(max-width:1040px){
  .mast-note{display:none}
  .ledger-nav{flex-direction:column;gap:0;padding:4px 0 8px;font-size:16px}
  .ledger-nav>a,.ledger-nav .spare a{padding:13px 0;border-bottom:1px solid var(--rule)}
  .ledger-nav .spare{margin:0;flex-direction:column;gap:0;width:100%}
}
/* colophon: same tile geometry, less slab */
.sponsor{padding:14px}
.sponsor-box{height:56px}
.sponsor-blurb{font-size:15.5px;line-height:1.4}

/* stacked nav: items must fill the line, so the rules run edge to edge */
@media(max-width:1040px){
  .ledger-nav{align-items:stretch}
  .ledger-nav>a,.ledger-nav .spare a{display:flex;align-items:center;gap:10px;width:100%}
  .ledger-nav .n{min-width:26px}
}

@media(max-width:1040px){.ledger-nav .spare a::before{content:"";display:inline-block;min-width:26px}}

/* --- mobile corrections (must sit last in the cascade) --- */
@media(max-width:600px){.mast-title{white-space:normal;font-size:clamp(24px,7vw,34px)}}
@media(max-width:720px){
  .fig-inset,.fig-inset.left{float:none;width:100%;margin:24px 0}
  .figwrap>p:first-of-type{margin-top:20px}
}

.mast-head{justify-content:flex-start}

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


/* sp-domain-override: per-domain, from work/css_override.css */
/* medioevoitaliano.org — 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; }

/* 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-grid .sponsor .sponsor-box.sponsor-box{display:block!important;width:100%!important}
.sponsor-grid .sponsor.sponsor img{height:44px!important;display:block!important;width:100%!important}

/* op-nav-collapse: this nav printed 389px 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 "block-fill", bold, 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,46px)) 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 "max-height" technique and marked with the "chevron" icon — the mechanism
   is deliberately not identical across the fleet either. */
.nav-disclose{display:none}
@media (max-width:900px){
  .nav-disclose{align-items:center;justify-content:center;gap:9px;font:inherit;font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:inherit;cursor:pointer;min-height:44px;box-sizing:border-box;display:flex;width:auto;border:1px solid currentColor;border-radius:3px;padding:12px 16px;background:color-mix(in srgb, currentColor 9%, transparent);margin-block:clamp(16px,4.5vw,26px) clamp(12px,3vw,18px)}

  .nav-disclose-bars{width:8px;height:8px;flex:none;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px)}
  .ledger-nav{max-height:0;overflow:hidden;padding-block:0;border-top-width:0;border-bottom-width:0;transition:max-height .28s ease}
  .nav-disclose-c:checked ~ .ledger-nav{max-height:220vh;padding-block:revert;border-top-width:revert;border-bottom-width:revert}
  .wrap:has(> .nav-disclose){display:flow-root}
  .nav-disclose:not(:has(~ .ledger-nav)){display:none}
}

/* op-money-columns: the supporters block ran one tile per row — 11 tiles,
   2142px at 390, 20% of the whole page. Two columns bring it to
   1274px (41% shorter). Checked before writing: no new overflow, smallest mark still
   117px wide, longest blurb 3 lines, tile heights 175-198px.
   A block that fails any of those is left in one column — two narrow columns can make a block
   TALLER once the copy rewraps, which is the case the operator warned about.
   The blurb is held to three rows at phone width, because a nine- or eleven-line blurb in a narrow column made two columns TALLER than one. The copy stays in the markup. An odd tile count means the lead tile spans the whole row, so the block does not end on an empty cell. Only the tier(s) that were one-per-row are touched (.sponsor-grid), 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-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:22px!important}
    .sponsor-grid > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .sponsor-grid > * *{min-width:0!important;max-width:100%}
    .sponsor-grid img,.sponsor-grid svg{max-width:100%;height:auto}
  .sponsor-grid .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical;overflow:hidden!important}
}

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

/* op-name-wrap: at 320 the money tile truncated its brand name — "My Pervy Family" — losing up to 11px to an
   ellipsis. The name is allowed to wrap instead of being cut: a brand that reads as half a word
   is worse than a brand on two lines. Structural only, phone widths only, desktop untouched. */
@media (max-width:360px){
  .sponsor-name{white-space:normal!important;overflow-wrap:anywhere;text-overflow:clip}
}

/* op-article-width: the article column was capped at 717px (86 characters per line) at every desktop width. Operator: "it should utilize more space". Widened through grid track 2 of "minmax(18px,1fr) minmax(0,var(--measure)) minmax(18px,1fr)" (declared in .article) 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){
  article.article{grid-template-columns:minmax(18px,1fr) min(854px, 100%) minmax(18px,1fr)!important}
}
@media (min-width:1600px){
  article.article{grid-template-columns:minmax(18px,1fr) min(clamp(854px, 59.306vw, 1025px), 100%) minmax(18px,1fr)!important}
  article.article > :is(p:not([class])){font-size:clamp(20px,1.3889vw,24.0px)!important}
}
/* op-article-width:end */

/* op-article-seam: text ran into the band that follows it (0-7px) — operator: "end of paragraph nearly touches intersection. Padding is missing." The section now keeps Design's own gap before the band: p → figure.map-figure.bleed: 20px (the gap after the band). */
  article.article > p:has(+ figure.map-figure.bleed){padding-bottom:20px!important}
/* op-article-seam:end */

/* op-article-head: the article header followed the text column (717px) and was left behind when the text went to 854px. Operator: "article header page with title + meta info that are super shrinked". Its containers now follow the text again by the text's own factor. */
@media (min-width:1024px){
  div.entry-head{max-width:min(854px, 100%)!important}
  div.entry-head p.lead{max-width:min(702px, 100%)!important}
}
@media (min-width:1600px){
  div.entry-head{max-width:min(calc(clamp(854px, 59.306vw, 1025px) + 0px), 100%)!important}
  div.entry-head p.lead{max-width:min(calc(clamp(702px, 48.750vw, 842px) + 0px), 100%)!important}
}
/* op-article-head:end */
/* op-heading-levels */
h2:where(.rt-h3){font-weight: 700; letter-spacing: -0.01em;}
div:where(.rt-h1), h1:where(.rt-h2){font-weight: 700; letter-spacing: -0.01em;}
.rail h1:where(.rt-h2){font-family: Karla, sans-serif; font-size: 10.5px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--rubric); border-bottom: 1px solid var(--ink); padding-bottom: 7px; margin: 0px;}
div:where(.rt-h1){font-weight: 700; letter-spacing: -0.01em;}
/* op-heading-levels:end */
@media (min-width:780px) and (max-width:949px){.sponsor-grid.sponsor-grid:has(> [data-partner]){grid-template-columns:repeat(auto-fill,minmax(min(272px,calc(50% - 11px)),1fr))!important;justify-content:stretch!important}.sponsor-grid.sponsor-grid > [data-partner]{width:auto!important;max-width:none!important}}