/* louer-un-gite-en-france.info — "Carrière"
   Palette roles: ground · ink · accent (madder) · secondary (slate blue) · mat
   Type: Bricolage Grotesque (display) · Spectral (reading) · ui-monospace (labels, captions on plates) */

:root{
  --ground:#EDEFF0;
  --paper:#FAFBFB;
  --ink:#12161A;
  --body:#333B42;
  --accent:#A81E2D;
  --secondary:#1F4B63;
  --mat:#D6DADC;
  --rule:#B0B8BD;
  --muted:#5A636A;
  --quiet:#545D64;
  --terracotta:#c96442;

  --prose:72ch;
  --breakout:960px;
  --shell:1360px;
  --gutter:clamp(18px,4vw,44px);

  --fs-body:17px;
  --fs-read:18px;
  --fs-cap:15px;
  --fs-label:12px;

  --display:"Bricolage Grotesque",system-ui,sans-serif;
  --read:Spectral,Georgia,serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--ground);color:var(--ink);
  font-family:var(--read);font-size:var(--fs-body);line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--secondary);text-decoration:none}
a:hover{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
h1,h2,h3,h4{font-family:var(--display);font-weight:600;letter-spacing:-0.025em;line-height:1.04;margin:0;text-wrap:balance}
p{margin:0 0 1.05em;text-wrap:pretty}
figure{margin:0}
::selection{background:var(--accent);color:var(--paper)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;background:var(--ink);color:var(--paper);padding:10px 14px;z-index:99}

/* ---------- shell widths (three visibly different measures + full bleed) ---------- */
.shell{width:min(var(--shell),100% - 2*var(--gutter));margin-inline:auto}
.prose{width:min(var(--prose),100% - 2*var(--gutter));margin-inline:auto}
.breakout{width:min(var(--breakout),100% - 2*var(--gutter));margin-inline:auto}
.bleed{width:100%}

/* ---------- masthead ---------- */
.masthead{background:var(--ink);color:var(--ground)}
.mast-top{padding:clamp(14px,1.5vw,26px) 0 clamp(12px,1.3vw,22px)}
.mast-top-in{display:flex;align-items:flex-end;justify-content:space-between;gap:clamp(14px,2.4vw,50px);flex-wrap:wrap}
.brand{display:flex;align-items:flex-end;gap:clamp(10px,1.2vw,22px);min-width:0;text-decoration:none}
.brand:hover{text-decoration:none}
.brand:hover .wm-b{color:#F0A8AF}
.mark{width:clamp(40px,4.2vw,76px);height:auto;color:var(--accent);flex:none}
.wordmark{display:flex;align-items:baseline;gap:clamp(7px,.7vw,14px);font-family:var(--display);
  text-transform:uppercase;line-height:.84;white-space:nowrap}
.wordmark .wm-a{font-weight:400;font-size:clamp(10px,1.05vw,19px);letter-spacing:.24em;color:rgba(237,239,240,.62)}
.wordmark .wm-b{font-weight:800;font-size:clamp(19px,2.9vw,52px);letter-spacing:-0.042em;color:var(--ground)}
.mast-meta{display:flex;flex-wrap:wrap;gap:4px clamp(12px,1.2vw,22px);margin:0 0 4px;
  font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:rgba(237,239,240,.55)}
.mast-meta span+span{padding-left:clamp(12px,1.2vw,22px);border-left:1px solid rgba(237,239,240,.28)}
.wordmark--foot{gap:8px}
.wordmark--foot .wm-a{font-size:11px;color:rgba(237,239,240,.6)}
.wordmark--foot .wm-b{font-size:clamp(15px,1.05vw,22px);color:var(--ground)}

/* ledger nav strip */
.mast-nav{background:var(--ground);border-top:3px solid var(--accent);border-bottom:3px solid var(--ink)}
.nav-strip{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.nav-cell{display:flex;flex-direction:column;justify-content:flex-end;gap:5px;min-width:0;
  padding:clamp(9px,.9vw,15px) clamp(8px,.8vw,16px) clamp(9px,.9vw,15px) clamp(9px,.9vw,14px);
  border-left:1px solid var(--rule);color:var(--ink);text-decoration:none}
.nav-cell:first-child{border-left:0}
.nav-cell:hover{background:var(--mat);color:var(--ink);text-decoration:none}
.nav-cell .nav-no{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;color:var(--accent)}
.nav-cell .nav-name{font-family:var(--display);font-weight:700;font-size:clamp(11px,.95vw,17px);
  letter-spacing:.08em;text-transform:uppercase;line-height:1.05}
.nav-cell--standing .nav-no{color:var(--rule)}
.nav-cell--standing .nav-name{font-weight:600;color:var(--quiet)}
.nav-cell[aria-current="page"]{background:var(--accent);color:var(--paper)}
.nav-cell[aria-current="page"] .nav-no,.nav-cell[aria-current="page"] .nav-name{color:var(--paper)}
.navtoggle,.navlabel{display:none}

@media (max-width:1023px){
  .nav-strip{grid-template-columns:repeat(4,minmax(0,1fr))}
  .nav-cell:nth-child(5){border-left:0}
  .nav-cell{border-top:1px solid var(--rule)}
  .nav-cell:nth-child(-n+4){border-top:0}
}
@media (max-width:767px){
  .mast-top-in{align-items:center}
  .mast-meta{display:none}
  .navlabel{display:flex;align-items:center;gap:9px;font-family:var(--display);font-weight:700;
    font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ground);cursor:pointer;
    border:2px solid rgba(237,239,240,.5);padding:9px 13px;margin-bottom:2px}
  .navlabel .nl-bars{display:block;width:15px;height:9px;border-top:2px solid currentColor;
    border-bottom:2px solid currentColor}
  .mast-nav{display:none}
  .navtoggle:checked ~ .mast-nav{display:block}
  .nav-strip{grid-template-columns:minmax(0,1fr)}
  .nav-cell{flex-direction:row;align-items:baseline;gap:12px;border-left:0;border-top:1px solid var(--rule);
    padding:13px clamp(18px,4vw,44px)}
  .nav-cell:first-child{border-top:0}
}

/* ---------- kickers, rules, labels ---------- */
.kicker{font-family:var(--display);font-weight:600;font-size:var(--fs-label);letter-spacing:.24em;
  text-transform:uppercase;color:var(--accent);margin:0 0 10px}
.kicker a{color:inherit}
.kicker--quiet{color:var(--quiet)}
.strat{display:flex;align-items:baseline;gap:14px;border-top:3px solid var(--ink);padding-top:12px;margin-bottom:clamp(16px,2vw,34px)}
.strat-no{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.14em;color:var(--accent)}
.strat-name{font-family:var(--display);font-weight:600;font-size:var(--fs-label);letter-spacing:.24em;text-transform:uppercase}
.hr{border:0;border-top:1px solid var(--rule);margin:clamp(28px,3vw,60px) 0}

/* ---------- homepage bands ---------- */
.lead-band{position:relative;background:var(--mat)}
.lead-band img{width:100%;height:clamp(320px,72vh,1000px);object-fit:cover}
.lead-cap{position:absolute;inset:auto 0 0 0;padding:clamp(28px,6vw,110px) 0 clamp(14px,1.6vw,30px);
  background:linear-gradient(to top,rgba(18,22,26,.9),rgba(18,22,26,.4) 60%,rgba(18,22,26,0))}
.lead-foot{display:flex;flex-direction:column;gap:8px;margin-top:clamp(12px,1.4vw,26px)}
.lead-foot .lead-dek{font-family:var(--display);font-size:clamp(12.5px,.85vw,16px);line-height:1.5;
  color:rgba(250,251,251,.9);max-width:74ch;margin:0;text-shadow:0 1px 4px rgba(10,13,16,.85)}
.lead-foot .lead-credit{color:rgba(250,251,251,.6);margin:0}
@media (min-width:1024px){
  .lead-foot{flex-direction:row;align-items:flex-end;justify-content:space-between;gap:clamp(20px,2.4vw,48px)}
  .lead-foot .lead-credit{flex:0 0 auto;text-align:right}
}
.lead-cap h1{color:var(--paper);font-size:clamp(28px,4.2vw,84px);line-height:.98;max-width:30ch;
  text-shadow:0 2px 6px rgba(10,13,16,.55),0 14px 44px rgba(10,13,16,.5)}
.lead-cap .kicker{text-shadow:0 1px 4px rgba(10,13,16,.7)}
.lead-cap .kicker{color:#F0A8AF}
.lead-under{display:flex;flex-direction:column;gap:10px;padding:clamp(12px,1.4vw,24px) 0 0}
.lead-under p{margin:0;font-size:var(--fs-cap);line-height:1.5;color:var(--muted);max-width:68ch}
.lead-under .credit{flex:0 0 auto}
.credit{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;color:var(--muted);margin:0}

.band{padding:clamp(40px,5vw,110px) 0}
.band--tight{padding:clamp(28px,3vw,64px) 0}
.band--ink{background:var(--ink);color:var(--ground)}
.band--ink a{color:#F0A8AF}
.band--slate{background:var(--secondary);color:var(--ground)}
.band--slate a{color:var(--paper)}
.band--paper{background:var(--paper)}

.quiet-line{font-family:var(--read);font-size:clamp(20px,1.8vw,38px);line-height:1.3;letter-spacing:-0.012em;max-width:44ch;margin:0}
.begin-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(18px,2vw,44px);align-items:start;
  border-top:3px solid var(--accent);padding-top:clamp(18px,1.8vw,32px)}
.begin-date{width:min(260px,54%);height:auto;color:var(--accent);display:block}
.begin-second{font-size:var(--fs-cap);line-height:1.55;color:var(--body);max-width:60ch;margin:clamp(14px,1.4vw,24px) 0 0}
.quiet-src{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.1em;color:var(--muted);margin:14px 0 0}

/* three asymmetric building cards — middle one double width */
.asym{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(24px,3vw,60px)}
.asym-card{border-top:3px solid var(--ink);padding-top:clamp(12px,1.2vw,20px)}
.asym-card--wide{border-top-color:var(--accent)}
.asym-card .fig-plate img{aspect-ratio:16/10}
.asym-card--wide .fig-plate img{aspect-ratio:16/10}
.asym h3{font-size:clamp(19px,1.35vw,30px);margin:clamp(14px,1.4vw,24px) 0 8px}
.asym-card--wide h3{font-size:clamp(22px,1.9vw,40px)}
.asym .asym-dek{font-size:var(--fs-cap);color:var(--body);margin:0}

/* the land band: full-bleed photograph, title in Spectral italic over it */
.land{position:relative;background:var(--ink)}
.land img{width:100%;height:clamp(300px,60vh,760px);object-fit:cover;opacity:.92}
.land-title{position:absolute;inset:auto 0 0 0;padding:clamp(20px,3vw,64px) 0;
  background:linear-gradient(to top,rgba(18,22,26,.8),rgba(18,22,26,0))}
.land-title h2{font-family:var(--read);font-style:italic;font-weight:400;letter-spacing:-0.01em;
  font-size:clamp(24px,3.2vw,64px);line-height:1.06;max-width:34ch;
  text-shadow:0 2px 6px rgba(10,13,16,.6),0 16px 48px rgba(10,13,16,.55)}
.land-title h2 a{color:var(--paper)}
.land-title h2 a:hover{color:#F0A8AF;text-decoration:none}
.land-dek{font-size:var(--fs-cap);line-height:1.5;color:rgba(250,251,251,.92);max-width:62ch;
  margin:clamp(12px,1.2vw,20px) 0 0;text-shadow:0 1px 4px rgba(10,13,16,.8)}
.land-credit{color:rgba(250,251,251,.62);margin-top:10px}
.land-title{background:linear-gradient(to top,rgba(18,22,26,.92),rgba(18,22,26,.55) 45%,rgba(18,22,26,0))}

/* materials strip: close crops, ui-monospace captions */
.strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(10px,1.2vw,22px)}
.strip figure{border-top:3px solid var(--accent);padding-top:10px}
.strip figure img{width:100%;aspect-ratio:1/1;object-fit:cover;background:var(--mat);
  border:1px solid rgba(237,239,240,.22);padding:6px}
.strip figure a:hover img{border-color:#F0A8AF}
.strip figcaption{font-family:var(--mono);font-size:12.5px;line-height:1.45;color:var(--body);margin-top:10px}
.band--ink .strip figcaption{color:rgba(237,239,240,.88)}
.band--slate .strip figcaption{color:rgba(237,239,240,.9)}
.strip .credit{margin-top:6px}

/* DPE signature scale */
.dpe{width:100%;height:auto;display:block;margin:0 0 clamp(14px,1.4vw,24px)}
.law-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(22px,2.4vw,52px);
  background:var(--paper);border:1px solid var(--rule);padding:clamp(16px,2vw,40px)}
.law-quote .pullquote{margin-top:0;border-top:0;padding-top:0}
.law-scale .note{margin:0;border-left-color:var(--accent)}

/* ---------- sponsors ---------- */
.supporters{background:var(--mat);border-top:3px solid var(--ink);border-bottom:3px solid var(--ink);
  padding:clamp(24px,3vw,56px) 0;
  background-image:repeating-linear-gradient(90deg,rgba(18,22,26,.055) 0 1px,transparent 1px 26px)}
.supporters .kicker{color:var(--accent)}
.supporters .sup-label{color:var(--body)}
.sup-group+.sup-group{border-top-color:rgba(18,22,26,.18)}
.sup-groups{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(18px,1.8vw,30px)}
.sup-group{min-width:0}
.sup-group+.sup-group{border-top:1px solid var(--rule);padding-top:clamp(16px,1.6vw,26px)}
.sup-group{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
.sup-label{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.14em;text-transform:uppercase;
  color:var(--quiet);margin:0 0 12px}
.sup-row{display:flex;flex-wrap:wrap;gap:10px}
.sponsor{flex:0 0 232px;height:76px;background:var(--ink);border:1px solid var(--ink);
  display:flex;align-items:center;justify-content:center;padding:14px 16px}
.sponsor:hover{border-color:var(--accent)}
.sponsor img{max-height:44px;max-width:100%;width:auto;height:auto;object-fit:contain}
@media (max-width:480px){ .sponsor{flex:0 0 100%} }

/* ---------- figure system — three treatments, one drawing language ---------- */
/* 1 · plate: mat panel + hairline, breakout width */
.fig-plate{background:var(--paper);padding:clamp(10px,1vw,18px);border:1px solid var(--rule);
  margin:clamp(32px,3.4vw,64px) 0}
.fig-plate img{width:100%;aspect-ratio:16/10;object-fit:cover;background:var(--mat)}
/* 2 · bleed: full width, caption offset below on the shell grid */
.fig-bleedfig{margin:clamp(32px,3.4vw,72px) 0}
.fig-bleedfig figcaption{padding-inline:var(--gutter)}
.fig-bleedfig figcaption .cap{width:min(var(--breakout),100%);margin-inline:auto}
.fig-bleedfig img{width:100%;height:clamp(260px,58vh,780px);object-fit:cover;background:var(--mat)}
/* 3 · inset: smaller, sits in the column, prose runs beside it on wide screens */
.fig-inset{margin:clamp(28px,3vw,48px) 0;border-top:3px solid var(--accent);padding-top:12px}
.fig-inset img{width:100%;aspect-ratio:5/4;object-fit:cover;background:var(--mat)}

figcaption{margin-top:12px}
.cap{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px}
.cap .cap-t{font-family:var(--display);font-size:var(--fs-cap);line-height:1.45;color:var(--ink);
  margin:0;flex:1 1 320px;max-width:76ch}
.cap .credit{flex:0 1 auto;margin:0;text-align:left}
.fig-inset .cap .cap-t{font-size:14px}

/* ---------- article page ---------- */
.article-head{padding:clamp(26px,3.4vw,72px) 0 clamp(16px,2vw,36px)}
.article-head h1{font-size:clamp(30px,3.9vw,84px);line-height:.96;max-width:26ch}
.article-head .lead{font-family:var(--read);font-size:clamp(18px,1.3vw,28px);line-height:1.45;color:var(--body);
  margin:clamp(14px,1.6vw,30px) 0 0;max-width:52ch}
.meta{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.1em;text-transform:uppercase;color:var(--quiet);margin:0}
.article-body{font-size:var(--fs-read);line-height:1.65;color:var(--ink)}
.article-body>p{font-size:var(--fs-read)}
.article-body h2{clear:both;font-size:clamp(22px,1.9vw,40px);margin:clamp(30px,3vw,56px) 0 14px;max-width:34ch}
.article-body h2::before{content:"";display:block;width:56px;border-top:3px solid var(--accent);margin-bottom:16px}
.article-body em{font-style:italic}
.dropcap::first-letter{font-family:var(--display);font-weight:700;font-size:3.1em;line-height:.78;
  float:left;margin:.06em .1em 0 0;color:var(--accent)}

/* ---------- inserted units (all in flow, room on both sides) ---------- */
.article-body > .breakout{margin-block:clamp(36px,3.6vw,68px)}
.article-body > .breakout > .unit,
.article-body > .breakout > .article-figure,
.article-body > .breakout > .pullquote,
.article-body > .breakout > .callout{margin-block:0}
.unit{margin:clamp(34px,3.6vw,68px) 0;padding:0}
.callout{background:var(--paper);border-top:3px solid var(--secondary);border-bottom:1px solid var(--rule);
  padding:clamp(16px,1.8vw,32px);margin:clamp(34px,3.6vw,68px) 0}
.callout p{margin:0;font-size:var(--fs-read)}
.note{font-family:var(--display);font-size:var(--fs-cap);line-height:1.5;color:var(--body);
  border-left:3px solid var(--rule);padding:2px 0 2px 16px;margin:clamp(24px,2.4vw,40px) 0}
.pullquote{margin:clamp(34px,3.6vw,68px) 0;padding:0;border-top:3px solid var(--ink);border-bottom:3px solid var(--ink)}
.pullquote p{font-family:var(--read);font-size:clamp(20px,1.8vw,36px);line-height:1.28;letter-spacing:-0.012em;
  margin:clamp(14px,1.4vw,26px) 0;max-width:44ch}
.blockquote{margin:clamp(30px,3vw,56px) 0;padding-left:clamp(14px,1.4vw,26px);border-left:4px solid var(--accent)}
.blockquote p{font-size:var(--fs-read);font-style:italic;margin:0 0 8px}
.blockquote cite{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.06em;color:var(--quiet);font-style:normal}

.unit-head{display:flex;align-items:baseline;gap:12px;border-top:3px solid var(--ink);padding-top:10px;margin-bottom:18px}
.unit-head h3{font-family:var(--display);font-weight:600;font-size:clamp(15px,1vw,20px);letter-spacing:.02em}
.unit-head .u-tag{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-left:auto}

.timeline{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.timeline li{display:grid;grid-template-columns:minmax(0,1fr);gap:2px 20px;padding-bottom:14px;border-bottom:1px solid var(--rule)}
.timeline li:last-child{border-bottom:0;padding-bottom:0}
.t-when{font-family:var(--mono);font-size:13px;letter-spacing:.04em;color:var(--accent)}
.t-what{font-size:var(--fs-cap);line-height:1.5;color:var(--body)}

.keylist{margin:0;display:grid;gap:14px}
.keylist>div{padding-bottom:14px;border-bottom:1px solid var(--rule)}
.keylist>div:last-child{border-bottom:0;padding-bottom:0}
.keylist dt{font-family:var(--display);font-weight:700;font-size:var(--fs-cap);color:var(--ink);margin-bottom:4px}
.keylist dd{margin:0;font-size:var(--fs-cap);line-height:1.5;color:var(--body)}

.tablewrap{overflow-x:auto}
.datatable,.versus{border-collapse:collapse;width:100%;font-size:var(--fs-cap)}
.datatable th,.datatable td,.versus th,.versus td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--rule);vertical-align:top}
.datatable thead th,.versus thead th{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.1em;
  text-transform:uppercase;color:var(--quiet);border-bottom:2px solid var(--ink)}
.datatable td:last-child{font-family:var(--mono);white-space:nowrap;color:var(--accent)}
.versus td+td{border-left:1px solid var(--rule)}

.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:clamp(14px,1.6vw,28px)}
.statblock{border-top:3px solid var(--accent);padding-top:10px}
.stat-num{display:block;font-family:var(--display);font-weight:700;font-size:clamp(26px,2.2vw,46px);line-height:1;letter-spacing:-0.03em}
.stat-label{display:block;font-size:13.5px;line-height:1.4;color:var(--body);margin-top:8px}

.chart{margin:clamp(30px,3vw,56px) 0}
.chart svg{width:100%;height:auto;display:block}
.chart figcaption{font-family:var(--mono);font-size:12.5px;color:var(--body)}

.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:clamp(10px,1.2vw,20px)}
.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--mat)}

/* map: real geometry, site styling */
.map-figure{margin:clamp(30px,3vw,60px) 0}
.map-wrap{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(20px,2.4vw,48px);align-items:stretch}
.map-side{display:flex;flex-direction:column}
.map-side .map-legend{margin-top:auto}
.map-slot{background:rgba(10,13,16,.35);border:1px solid rgba(237,239,240,.28)}
.map-slot svg{width:100%;height:auto;display:block}
.map-land{fill:#16202A;stroke:rgba(237,239,240,.5);stroke-width:1.6}
.map-neighbour{fill:rgba(237,239,240,.09);stroke:none}
.map-pin{fill:var(--accent);stroke:var(--paper);stroke-width:2.5}
.map-slot a:hover .map-pin{fill:var(--paper);stroke:var(--accent)}
.map-pin-no{font-family:var(--mono);font-size:17px;font-weight:700;fill:var(--paper)}
.map-h{font-family:var(--display);font-size:clamp(19px,1.5vw,32px);line-height:1.08;max-width:26ch;margin:0 0 12px}
.map-intro{font-size:var(--fs-cap);line-height:1.5;color:rgba(237,239,240,.86);max-width:62ch;margin:0 0 clamp(16px,1.6vw,28px)}
.map-key-list{list-style:none;margin:0;padding:12px 0 0;display:grid;gap:3px;
  border-top:1px solid rgba(237,239,240,.3)}
.map-key-list li{display:grid;grid-template-columns:20px minmax(0,8em) minmax(0,1fr);gap:0 10px;
  align-items:baseline;padding:2px 0;border-bottom:1px solid rgba(237,239,240,.09)}
.map-key-list li:last-child{border-bottom:0}
.map-key-list .mk-no{font-family:var(--mono);font-size:11px;color:#F0A8AF;text-align:right}
.map-key-list .mk-place{font-family:var(--display);font-weight:700;font-size:12.5px;letter-spacing:.04em;
  text-transform:uppercase}
.map-key-list .mk-link{font-size:12.5px;line-height:1.35;color:rgba(237,239,240,.8)}
.map-key-list .mk-link:hover{color:var(--paper)}
.map-scale path{fill:none;stroke:rgba(237,239,240,.75);stroke-width:2.4}
.map-scale text{font-family:var(--mono);font-size:19px;fill:rgba(237,239,240,.8)}
.map-north path{fill:none;stroke:rgba(237,239,240,.75);stroke-width:2.4;stroke-linejoin:round;stroke-linecap:round}
.map-north text{font-family:var(--mono);font-size:22px;font-weight:700;fill:rgba(237,239,240,.8)}
.map-legend{list-style:none;margin:clamp(16px,1.6vw,28px) 0 0;padding:12px 0 0;display:grid;gap:8px;
  border-top:1px solid rgba(237,239,240,.3)}
.map-legend li{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:11.5px;
  line-height:1.4;color:rgba(237,239,240,.8)}
.map-legend .lg-mark{width:20px;height:20px;flex:none}
.map-legend .lg-note{color:rgba(237,239,240,.6)}
.map-key{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--quiet);margin-top:12px}

/* profiles / orgs / related */
.profile-grid,.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:clamp(14px,1.6vw,26px)}
.profile-card{background:var(--paper);border:1px solid var(--rule);padding:clamp(14px,1.4vw,24px);display:flex;flex-direction:column}
.profile-card .p-photo{width:100%;aspect-ratio:4/3;object-fit:cover;margin-bottom:14px;background:var(--mat)}
.profile-card h3{font-size:19px;margin-bottom:4px}
.profile-card .p-role{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--quiet);margin:0 0 10px}
.profile-card p{font-size:var(--fs-cap);color:var(--body)}
.profile-card .p-links{margin-top:auto}
.org-card{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;gap:2px 14px;
  background:var(--paper);border:1px solid var(--rule);padding:14px;align-items:center;color:var(--ink)}
.org-card:hover{border-color:var(--accent);text-decoration:none}
.org-logo{grid-row:span 2;width:56px;height:56px;object-fit:contain;background:var(--ink)}
.org-name{font-family:var(--display);font-weight:600;font-size:16px}
.org-host{font-family:var(--mono);font-size:12px;color:var(--quiet)}
.entity-ref{font-family:var(--display);font-weight:600}
.further-grid,.related-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));
  gap:clamp(12px,1.4vw,22px);list-style:none;margin:0;padding:0}
.further-grid a,.related-links a{display:block;background:var(--paper);border:1px solid var(--rule);
  padding:clamp(14px,1.4vw,22px);font-family:var(--display);font-weight:600;font-size:17px;line-height:1.2;color:var(--ink);height:100%}
.further-grid a:hover,.related-links a:hover{border-color:var(--accent);color:var(--accent);text-decoration:none}
.related-links .rl-sec{display:block;font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--quiet);margin-bottom:8px;font-weight:400}
.endzone{margin-block:clamp(40px,4vw,80px) clamp(48px,5vw,96px)}

/* ---------- section / category pages ---------- */
.cat-head{padding:clamp(24px,3vw,64px) 0 clamp(18px,2vw,40px)}
.cat-head h1{font-size:clamp(28px,3.6vw,76px);max-width:24ch}
.cat-head .blurb{font-size:clamp(17px,1.15vw,24px);line-height:1.5;color:var(--body);max-width:62ch;margin:clamp(12px,1.4vw,26px) 0 0}
.cat-count{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.14em;text-transform:uppercase;color:var(--quiet)}
.cat-open img{width:100%;height:clamp(240px,46vh,620px);object-fit:cover;background:var(--mat)}
.cat-list{list-style:none;margin:0;padding:0;display:grid;gap:clamp(26px,2.6vw,44px);
  grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr))}
.cat-list li{min-width:0}
.entry{display:flex;flex-direction:column;height:100%;background:var(--paper);border:1px solid var(--rule)}
.entry:hover{border-color:var(--accent);text-decoration:none}
.entry img{width:100%;aspect-ratio:3/2;object-fit:cover;background:var(--mat)}
.entry-in{padding:clamp(14px,1.4vw,24px);display:flex;flex-direction:column;flex:1}
.entry h3{font-size:clamp(18px,1.25vw,26px);line-height:1.1;color:var(--ink);min-height:2.2em}
.entry p{font-size:var(--fs-cap);line-height:1.5;color:var(--body);margin:10px 0 0}
.entry .entry-tag{font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--accent);margin-top:auto;padding-top:14px}
.cat-list li.lead-entry{grid-column:span 1}
.cat-list li.lead-entry .entry img{aspect-ratio:16/9}
.cat-list li.lead-entry .entry h3{font-size:clamp(22px,1.9vw,38px);min-height:0}
.cat-nav{display:flex;flex-wrap:wrap;align-items:center;gap:4px clamp(16px,2vw,36px);font-family:var(--display);
  font-weight:600;font-size:13px;letter-spacing:.14em;text-transform:uppercase;border-top:1px solid var(--rule);padding-top:16px}
.cat-nav a{display:flex;align-items:center;min-height:44px}

/* glossary + archive */
.gloss{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(20px,2.2vw,40px);margin:0}
.gloss>div{border-top:1px solid var(--rule);padding-top:14px}
.gloss dt{font-family:var(--display);font-weight:700;font-size:19px}
.gloss dd{margin:8px 0 0;font-size:var(--fs-cap);line-height:1.5;color:var(--body)}
.arch{list-style:none;margin:0 0 clamp(30px,3vw,56px);padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:0 clamp(24px,2.6vw,56px)}
.arch li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 20px;align-items:baseline;
  border-bottom:1px solid var(--rule);padding:14px 0}
.arch a{display:block;padding-block:6px;min-height:44px;font-family:var(--display);font-weight:600;
  font-size:clamp(16px,1.1vw,21px);line-height:1.25;color:var(--ink)}
.arch .arch-sec{font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--quiet)}

/* ---------- footer ---------- */
.foot{background:var(--ink);color:var(--ground);padding:clamp(20px,2vw,34px) 0 clamp(24px,2.2vw,40px);margin-top:clamp(30px,3vw,60px)}
.foot a{color:var(--ground)}
.foot-in{display:flex;flex-wrap:wrap;align-items:baseline;gap:12px clamp(20px,2.4vw,48px)}
.foot .wordmark{white-space:nowrap}
.foot p{font-size:13px;line-height:1.45;color:rgba(237,239,240,.8);max-width:52ch;margin:0;flex:1 1 300px}
.foot nav{display:flex;flex-wrap:wrap;gap:8px clamp(14px,1.6vw,28px);font-family:var(--display);
  font-weight:600;font-size:13px;letter-spacing:.06em;text-transform:uppercase}

/* ---------- breakpoints: each one gains content, not margin ---------- */
@media (min-width:768px){
  :root{--fs-body:17.5px;--fs-read:18.5px}
  .strip{grid-template-columns:repeat(4,minmax(0,1fr))}
  .timeline li{grid-template-columns:132px minmax(0,1fr)}
  .keylist{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px clamp(20px,2vw,40px)}
  .foot-in{grid-template-columns:1.1fr .9fr 1fr}
}
@media (min-width:1280px){
  .lead-under{flex-direction:row;justify-content:space-between;align-items:flex-end;gap:clamp(24px,3vw,60px)}
  .lead-under .credit{text-align:right}
}
@media (min-width:1024px){
  :root{--prose:70ch;--breakout:900px;--shell:1200px}
  .gloss{grid-template-columns:repeat(2,minmax(0,1fr))}
  .arch{grid-template-columns:repeat(2,minmax(0,1fr))}
  .law-grid{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);align-items:start}
  .map-wrap{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:stretch}
  .map-slot{max-width:720px}
  .asym-card .fig-plate img{aspect-ratio:4/5}
  .begin-grid{grid-template-columns:minmax(200px,26%) minmax(0,1fr)}
  .begin-date{width:100%}
  .sponsor{flex:0 0 200px;height:72px}
  .sponsor img{max-height:40px}
  .asym{grid-template-columns:minmax(0,1fr) minmax(0,2fr) minmax(0,1fr);align-items:start}
  .cat-list{grid-template-columns:repeat(3,minmax(0,1fr))}
  .cat-list li.lead-entry{grid-column:span 2}
  /* inset figure sits in the column with prose beside it */
  .fig-inset{float:right;width:44%;margin:6px 0 22px clamp(24px,2.4vw,44px)}
  .article-body::after{content:"";display:block;clear:both}
}
@media (min-width:1280px){
  :root{--prose:72ch;--breakout:1000px;--shell:1360px}
  .article-grid{display:grid;grid-template-columns:minmax(0,1fr);}
}
@media (min-width:1500px){
  .sup-group{grid-template-columns:200px minmax(0,1fr);align-items:center;gap:clamp(20px,1.8vw,32px)}
  .sup-label{margin:0}
  .sup-row{flex-wrap:nowrap}
  .sponsor{flex:0 0 232px;height:80px}
  .sponsor img{max-height:46px}
}
@media (min-width:1600px){
  :root{--fs-body:18.5px;--fs-read:20px;--fs-cap:16px;--prose:76ch;--breakout:1180px;--shell:1560px}
  .gloss{grid-template-columns:repeat(3,minmax(0,1fr))}
  .map-slot{max-width:820px}
  .map-key-list li{grid-template-columns:30px minmax(0,8em) minmax(0,1fr)}
  .lead-band img{height:min(78vh,1040px)}
  .cat-list{grid-template-columns:repeat(4,minmax(0,1fr))}
  .cat-list li.lead-entry{grid-column:span 2}
  .strip{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
}
@media (min-width:1920px){
  :root{--fs-body:19.5px;--fs-read:21.5px;--fs-cap:17px;--prose:80ch;--breakout:1320px;--shell:1800px}
  .sponsor{flex:0 0 280px;height:92px}
  .sponsor img{max-height:52px}
  .map-slot{max-width:900px}
  .gloss{grid-template-columns:repeat(4,minmax(0,1fr))}
  .arch{grid-template-columns:repeat(3,minmax(0,1fr))}
  .keylist{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media print{
  .masthead,.supporters,.foot,.navlabel{display:none}
  body{background:#fff}
}

/* 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}
.sup-row{flex-wrap:wrap!important}
.sup-row > .sponsor{flex:1 1 var(--sp-min,220px)!important;min-width:min(220px,100%)!important}
.sponsor:not(.lead-line){grid-column:span 1!important;grid-row:span 1!important}

/* sp-blurb-stack: a slot holding BOTH a mark and our copy stacks them —
   a fixed-height row clips the mark once the copy is un-hidden. */
.sponsor:has(> img):has(> .sponsor-blurb:not(:empty)){flex-direction:column!important;align-items:flex-start!important;justify-content:flex-start!important;height:auto!important;min-height:0!important;overflow:visible!important;gap:8px}
.sponsor:has(> img):has(> .sponsor-blurb:not(:empty)) > img{align-self:flex-start}

/* 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-size: the design never sized .sponsor-blurb, so it inherited body copy.
   Relative, so it still follows the design's scale. */
.sponsor .sponsor-blurb{font-size:.8em;line-height:1.45}
.sponsor .sp-brand{font-weight:700}

/* sp-blurb-contrast: the design never coloured .sponsor-blurb because its bar was
   marks-only; our copy would inherit the page's dark ink onto a dark tile. */
.sponsor .sponsor-blurb{color:rgba(255,255,255,.82)}
.sponsor .sponsor-name{color:rgba(255,255,255,.95)}

/* sp-tile-fit: a slot fills its track, keeps a symmetric inset, and cannot be inflated
   by one long line of our copy. */
.sponsor.sponsor{width:100%!important;box-sizing:border-box!important;align-self:stretch!important;align-items:center!important;height:auto!important;min-height:0!important;overflow:hidden}
.sponsor.sponsor{justify-content:center!important}
:has(> .sponsor.sponsor){align-items:stretch!important}
.sponsor.sponsor .sponsor-name{min-width:0!important;overflow-wrap:anywhere}
.sponsor.sponsor > img{flex:0 0 auto!important;align-self:center!important}
.sponsor.sponsor > .sponsor-txt,.sponsor.sponsor > span:not(.sponsor-name){flex:1 1 auto!important;min-width:0!important}
.sponsor.sponsor .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden;margin:0!important}
/* the mobile un-clamp is retired: the operator asked for "2-3 rows max" on phones, which is
   what the desktop rule above already does — so mobile simply keeps it. */
@media (max-width:640px){.sponsor.sponsor .sponsor-blurb{-webkit-line-clamp:3!important;display:-webkit-box!important;-webkit-box-orient:vertical!important;overflow:hidden!important}}

/* 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-panels{display:grid;grid-template-columns:repeat(var(--n,2),minmax(0,1fr));gap:16px;width:100%}
.mapkit-panels>svg.mapkit{width:100%;height:auto;display:block}
@media (max-width:700px){.mapkit-panels{grid-template-columns:minmax(0,1fr)}}
.mapkit__pin{cursor:pointer}
.mapkit__pin text{paint-order:stroke;stroke:#101317;stroke-width:3px;stroke-linejoin:round}
.mapkit__pin:hover circle{r:9.1}
.mapkit__pin:hover text{font-weight:700}
/* MAPKIT_END */

/* 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. */
.sup-row .sponsor .sp-logo.sp-logo{display:block!important;width:100%!important}
.sup-row .sponsor.sponsor img{height:46px!important;display:block!important;width:100%!important}

/* op-money-columns: the supporters block ran one tile per row — 11 tiles,
   894px at 390, 12% of the whole page. Two columns bring it to
   642px (28% shorter). Checked before writing: no new overflow, smallest mark still
   135px wide, longest blurb 0 lines, tile heights 74-74px.
   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 (.sup-row), never the section
   that holds several tiers: forcing a grid on that would put a featured row and a regulars run
   side by side. Phone widths only. */
@media (max-width:640px){
  .sup-row{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:10px!important}
    .sup-row > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .sup-row > * *{min-width:0!important;max-width:100%}
    .sup-row img,.sup-row svg{max-width:100%;height:auto}

}

/* op-odd-tier-lead: .sup-row (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){
  .sup-row:has(> *:nth-child(odd):last-child) > *:first-child{grid-column:1 / -1!important}
}
/* op-heading-levels */
h2:where(.rt-h3){font-family: var(--display); font-weight: 600; letter-spacing: -0.025em; line-height: 1.04; margin: 0px; text-wrap: balance;}
.asym h2:where(.rt-h3){font-size: clamp(19px, 1.35vw, 30px); margin: clamp(14px, 1.4vw, 24px) 0px 8px;}
.asym-card--wide h2:where(.rt-h3){font-size: clamp(22px, 1.9vw, 40px);}
.entry h2:where(.rt-h3){font-size: clamp(18px, 1.25vw, 26px); line-height: 1.1; color: var(--ink); min-height: 2.2em;}
.cat-list li.lead-entry .entry h2:where(.rt-h3){font-size: clamp(22px, 1.9vw, 38px); min-height: 0px;}
/* op-heading-levels:end */

/* op-img-dims — intrinsic width/height reserve image space; the proven height:auto guard (zero specificity) */
:where(article.asym-card > figure.article-figure.fig-plate > img,
  article.asym-card.asym-card--wide > figure.article-figure.fig-plate > img,
  div.bleed > figure.article-figure.fig-bleedfig > img,
  div.breakout > figure.article-figure.fig-plate > img,
  div.cat-open.shell > figure.article-figure.fig-plate > img,
  div.prose > figure.article-figure.fig-inset > img,
  figure > a > img,
  figure.article-figure.fig-plate > div.gallery > img,
  li > a.entry > img,
  li.lead-entry > a.entry > img,
  main > section.land > img,
  main > section.lead-band > img){height:auto}
/* op-img-dims:end */
