/* bourg-gironde.net — The Cut Face
   Palette: 5 members, each with a job.
   ground  cold blue    #DCE4E9   the page
   ink     gallery dark #14181B   type, rules
   accent  oxide red    #C3391C   filing band, kickers, figure rules  (saturated, hue ~14)
   second  estuary slate#1D5A82   estuary bands, notes grounds        (saturated, hue ~205)
   silt    cool grey    #77848C   credits, hairlines, quiet labels
*/
:root{
  --ground:#DCE4E9;
  --paper:#EDF2F4;
  --ink:#14181B;
  --ink-2:#37424A;
  --accent:#C3391C;
  --accent-ink:#FFF3EE;
  --second:#1D5A82;
  --second-ink:#E4EDF4;
  --silt:#77848C;
  --hair:rgba(20,24,27,.22);
  --hair-soft:rgba(20,24,27,.13);
  --serif:'Alegreya',Georgia,'Times New Roman',serif;
  --sans:'Space Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
  --measure:68ch;
  --gut:clamp(20px,4vw,56px);
  --max:1360px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--ground);color:var(--ink);
  font-family:var(--serif);font-size:19px;line-height:1.62;
  text-wrap:pretty;overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:var(--second);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}
a:hover{color:var(--accent)}
h1,h2,h3,h4{font-family:var(--serif);font-weight:800;letter-spacing:-.015em;line-height:1.04;margin:0}
svg{flex:none}
figure{margin:0}
::selection{background:var(--accent);color:#fff}

.wrap{max-width:var(--max);margin:0 auto;padding-inline:var(--gut)}
.measure{max-width:var(--measure);margin-inline:auto;padding-inline:var(--gut)}
.kicker{font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase}
.label{font-family:var(--sans);font-size:12.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--silt)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;background:var(--ink);color:#fff;padding:10px 14px;z-index:20}

/* ---------- masthead ---------- */
.masthead{padding-top:22px}
.mast-top{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;flex-wrap:wrap;
  border-bottom:2px solid var(--ink);padding-bottom:16px}
.mast-brand{display:flex;align-items:center;gap:16px;text-decoration:none;color:var(--ink);padding:6px 0}
.mast-brand:hover{color:var(--ink)}
.wordmark{display:block;font-family:var(--serif);font-weight:800;font-size:clamp(30px,4.4vw,44px);line-height:.94;letter-spacing:-.02em}
.strapline{display:block;font-family:var(--serif);font-style:italic;font-size:16px;line-height:1.35;color:var(--ink-2);margin-top:6px;max-width:52ch}
.mast-note{font-family:var(--sans);font-size:12px;font-weight:500;letter-spacing:.15em;text-transform:uppercase;
  color:var(--silt);text-align:right;line-height:1.8}

.nav{display:flex;align-items:center;gap:clamp(14px,2vw,30px);flex-wrap:wrap;
  padding:11px 0 13px;border-bottom:1px solid var(--hair)}
.nav a{display:inline-flex;align-items:center;gap:8px;text-decoration:none;color:var(--ink);
  font-family:var(--sans);font-size:14.5px;font-weight:500;min-height:44px}
.nav a:hover,.nav a[aria-current="page"]{color:var(--accent)}
.nav .nav-end{margin-left:auto}
.nav-quiet{color:var(--silt)!important}
.nav-quiet:hover{color:var(--accent)!important}

/* ---------- lead feature ---------- */
.lead-band{padding:clamp(26px,3.4vw,42px) 0 0}
.lead-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:clamp(24px,3vw,46px);align-items:end}
.lead-title{font-size:clamp(38px,5.4vw,68px);letter-spacing:-.022em}
.lead-title a{color:inherit;text-decoration:none}
.lead-title a:hover{color:var(--accent)}
.lead-dek{font-size:clamp(18px,1.5vw,21px);line-height:1.5;color:var(--ink-2);margin:14px 0 0}
.meta{font-family:var(--sans);font-size:12.5px;letter-spacing:.05em;color:var(--silt);margin-top:14px;
  display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.meta .dot{color:var(--hair)}
.more{display:inline-flex;align-items:center;gap:9px;font-family:var(--sans);font-size:12px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--accent);text-decoration:none;
  border-bottom:1px solid var(--accent);padding-bottom:3px;min-height:44px}
.more:hover{color:var(--ink);border-color:var(--ink)}

/* ---------- figures: one drawing system, four treatments ---------- */
.fig-plate{background:var(--paper);border:1px solid var(--hair);padding:clamp(10px,1vw,15px)}
.fig-plate img{border:1px solid var(--hair-soft);width:100%;object-fit:cover}
.fig-plate figcaption{padding:15px 4px 2px;max-width:62ch}

.fig-cutin{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:clamp(20px,2.6vw,38px);align-items:start;margin:34px 0}
.fig-cutin figcaption{border-top:3px solid var(--accent);padding-top:13px}
.fig-cutin img{width:100%;object-fit:cover;border:1px solid var(--hair)}

.fig-band{background:var(--second);color:var(--second-ink);margin:38px 0}
.fig-band img{width:100%;max-height:60vh;object-fit:cover}
.fig-band figcaption{padding:16px var(--gut) 22px;display:grid;grid-template-columns:1fr auto;gap:26px;align-items:start}
.fig-band .cap-text{color:#fff;max-width:70ch}
.fig-band .cap-kicker{color:#A9C4D8}
.fig-band .fig-credit{color:#A9C4D8;text-align:right}

.fig-inset{background:var(--paper);border:1px solid var(--hair);padding:10px;margin:30px 0}
.fig-inset img{width:100%;object-fit:cover}
.fig-inset figcaption{padding:12px 3px 2px}

.cap-kicker{display:flex;align-items:center;gap:8px;color:var(--accent);margin-bottom:8px}
.cap-text{font-family:var(--serif);font-size:16.5px;line-height:1.5;color:var(--ink);display:block}
.fig-credit{display:block;margin-top:9px;font-family:var(--sans);font-size:12px;font-weight:500;
  letter-spacing:.13em;text-transform:uppercase;color:var(--silt)}
.article-figure{margin:34px 0}
.article-figure img{aspect-ratio:16/10}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;margin:34px 0}
.gallery img{aspect-ratio:4/3;object-fit:cover}

/* ---------- the filing band (accent, at size) ---------- */
.filing{background:var(--accent);color:var(--accent-ink);margin-top:clamp(30px,4vw,52px)}
.filing-inner{padding:clamp(24px,3vw,38px) 0 clamp(28px,3.4vw,40px)}
.filing-lede{font-family:var(--serif);font-size:clamp(19px,1.7vw,23px);line-height:1.45;max-width:66ch;margin:12px 0 26px;color:#fff}
.filing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:clamp(20px,2.4vw,34px)}
.filing-card{display:flex;flex-direction:column;gap:8px;text-decoration:none;color:var(--accent-ink);
  border-top:1px solid rgba(255,243,238,.45);padding-top:14px}
.filing-card:hover{color:#fff}
.filing-card:hover .fc-title{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.fc-verb{font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,243,238,.8)}
.fc-title{font-family:var(--serif);font-weight:800;font-size:26px;line-height:1.1}
.fc-blurb{font-size:16.5px;line-height:1.45;color:rgba(255,243,238,.9)}

/* ---------- feed + supporters rail ---------- */
.feed-band{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:clamp(28px,3.4vw,54px);
  padding:clamp(30px,4vw,52px) 0 0;align-items:start}
.sec-head{display:flex;align-items:baseline;gap:14px;border-bottom:2px solid var(--ink);padding-bottom:10px;margin-bottom:20px;flex-wrap:wrap}
.sec-head h2{font-size:clamp(26px,2.6vw,34px)}
.sec-head .sec-icon{color:var(--accent);align-self:center}
.sec-blurb{font-family:var(--serif);font-style:italic;font-size:16.5px;color:var(--ink-2);margin-left:auto}
.feed-group{margin-bottom:clamp(30px,3.4vw,46px)}
.feed-rest{margin-top:clamp(18px,2vw,26px);border-top:1px solid var(--hair)}
.feed-rest .cl-title{font-size:20px}
.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(18px,2vw,28px)}
@media (max-width:560px){.cards{grid-template-columns:1fr}}
.card{display:flex;flex-direction:column;height:100%;background:var(--paper);border:1px solid var(--hair);
  text-decoration:none;color:var(--ink)}
.card:hover{border-color:var(--accent);color:var(--ink)}
.card img{aspect-ratio:16/10;object-fit:cover;width:100%}
.card-body{display:flex;flex-direction:column;gap:8px;padding:15px 16px 16px;flex:1}
.card h3{font-size:21px;line-height:1.14;min-height:2.28em}
.card:hover h3{color:var(--accent)}
.card p{margin:0;font-size:16px;line-height:1.45;color:var(--ink-2)}
.card .meta{margin-top:auto;padding-top:10px}

/* supporters rail */
.rail{position:sticky;top:18px;align-self:start}
.rail-head{border-top:3px solid var(--ink);padding-top:12px}
.rail-head h2{font-family:var(--sans);font-size:15px;font-weight:600;letter-spacing:.1em;text-transform:uppercase}
.rail-note{font-family:var(--serif);font-style:italic;font-size:15.5px;color:var(--ink-2);margin:8px 0 0}
.sponsor-group{margin-top:18px}
.sponsor-group .label{display:block;margin-bottom:10px;border-bottom:1px solid var(--hair-soft);padding-bottom:7px}
.sponsor-list{display:flex;flex-wrap:wrap;gap:10px}
.sponsor-list>.sponsor{flex:1 1 320px}
.rail .sponsor-list>.sponsor{flex:1 1 100%}
.sponsor{display:grid;grid-template-columns:200px minmax(0,1fr);gap:14px;align-items:center;
  text-decoration:none;color:var(--ink);border:1px solid var(--hair-soft);background:rgba(20,24,27,.04);padding:8px}
.sponsor:hover{border-color:var(--accent);color:var(--ink)}
.sponsor img{width:100%;height:42px;max-height:42px;object-fit:contain;background:var(--ink);padding:6px 10px}
.sponsor .sponsor-name{font-family:var(--sans);font-size:12.5px;font-weight:500;letter-spacing:.02em;line-height:1.3}
.sponsor.feat{background:rgba(29,90,130,.1);border-color:rgba(29,90,130,.4)}
.sponsor.feat .sponsor-name{font-weight:600}
.sponsor-blurb{font-family:var(--serif);font-size:15px;line-height:1.4;color:var(--ink-2)}

/* ---------- estuary band (secondary, at size) ---------- */
.estuary{background:var(--second);color:var(--second-ink);margin-top:clamp(34px,4vw,56px)}
.estuary .wrap{padding-block:clamp(26px,3.2vw,42px)}
.estuary-inner{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(26px,3.4vw,52px);align-items:start}
.estuary h2{color:#fff;font-size:clamp(28px,3.2vw,42px)}
.estuary p{font-size:17.5px;line-height:1.55;color:var(--second-ink)}
.estuary .kicker{color:#A9C4D8}
.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:0}
.statblock{display:flex;flex-direction:column;gap:4px;padding:12px 0;border-top:1px solid rgba(255,255,255,.3)}
.stat-num{font-family:var(--sans);font-size:27px;font-weight:700;letter-spacing:-.02em;color:#fff;line-height:1}
.stat-label{font-family:var(--sans);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#A9C4D8}
.statrow.on-ground .statblock{border-top-color:var(--hair)}
.statrow.on-ground .stat-num{color:var(--ink)}
.statrow.on-ground .stat-label{color:var(--silt)}

/* ---------- map ---------- */
.map-figure{margin:clamp(30px,4vw,52px) 0 0}
.map-wrap{display:grid;grid-template-columns:minmax(0,620px) minmax(260px,1fr);gap:clamp(24px,3vw,44px);align-items:stretch}
.map-slot{background:var(--paper);border:1px solid var(--hair);padding:12px}
.map-slot svg{width:100%;height:auto;display:block}
.map-land{fill:#CBD7DE;stroke:var(--silt);stroke-width:.8;vector-effect:non-scaling-stroke}
.map-focus{fill:#B6C7D1;stroke:var(--ink);stroke-width:1.2;vector-effect:non-scaling-stroke}
.map-spokes line{stroke:var(--accent);stroke-width:1;stroke-dasharray:4 5;opacity:.5;vector-effect:non-scaling-stroke}
.map-pin{cursor:pointer;text-decoration:none}
.map-pin text{text-decoration:none}
.map-pin circle{fill:var(--accent);stroke:var(--paper);stroke-width:1.4;vector-effect:non-scaling-stroke}
.map-pin .pin-sub{font-family:var(--sans);font-size:17px;font-weight:500;fill:var(--silt);paint-order:stroke;stroke:var(--paper);stroke-width:4px;stroke-linejoin:round}
.map-pin:hover circle{fill:var(--ink)}
.map-pin:hover text{fill:var(--accent)}
.map-pin text{font-family:var(--sans);font-size:21px;font-weight:600;fill:var(--ink);paint-order:stroke;stroke:var(--paper);stroke-width:4px;stroke-linejoin:round}
.map-pin.is-here circle{fill:var(--ink)}
.map-legend{display:flex;flex-direction:column;gap:0;justify-content:space-between}
.map-legend ul{flex:1;display:flex;flex-direction:column;justify-content:space-between}
.map-legend li{align-items:baseline}
.map-note{margin:18px 0 0;font-family:var(--serif);font-size:17px;line-height:1.5;color:var(--ink-2);border-top:2px solid var(--ink);padding-top:14px;max-width:44ch}
.map-legend li{list-style:none;border-top:1px solid var(--hair-soft)}
.map-legend li>a{display:grid;grid-template-columns:minmax(88px,auto) minmax(0,1fr) auto;gap:12px;align-items:baseline;
  padding:13px 0;min-height:44px;text-decoration:none;color:var(--ink);font-size:16px;line-height:1.35}
.map-legend li>a:hover{color:var(--accent)}
.map-legend li>a:hover .mk{color:var(--ink)}
.map-legend .md{font-family:var(--sans);font-size:13px;font-weight:600;color:var(--ink);white-space:nowrap}
.map-legend .mn{color:var(--ink-2)}
.ml-head{display:grid;grid-template-columns:minmax(88px,auto) minmax(0,1fr) auto;gap:12px;padding-bottom:8px}
.ml-head .label{font-size:11px;letter-spacing:.16em}
.ml-head .label:last-child{text-align:right}
.map-legend ul{margin:0;padding:0}
.map-legend .mk{font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}

/* ---------- footer ---------- */
.foot{background:var(--ink);color:#C4CFD6;margin-top:clamp(36px,4.5vw,60px)}
.foot-inner{padding:clamp(26px,3vw,38px) 0;display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:clamp(24px,3vw,44px)}
.foot a{color:#DCE4E9;text-decoration:none}
.foot a:hover{color:#fff;text-decoration:underline}
.foot .label{color:#7E8E99}
.foot-brand{font-family:var(--serif);font-weight:800;font-size:24px;color:#fff;display:flex;align-items:center;gap:11px}
.foot p{font-size:16px;line-height:1.5;color:#A8B5BE;margin:10px 0 0;max-width:44ch}
.foot ul{margin:12px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:2px;font-size:16.5px}
.foot ul a{display:flex;align-items:center;min-height:44px}
.foot-bottom{border-top:1px solid rgba(255,255,255,.16);padding:16px 0;font-family:var(--sans);font-size:12px;color:#7E8E99;
  display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}

/* ---------- article ---------- */
.art-head{padding:clamp(26px,3.4vw,44px) 0 0}
.art-kicker{display:inline-flex;align-items:center;gap:9px;color:var(--accent);text-decoration:none;padding:11px 0;min-height:44px}
.art-kicker:hover{color:var(--ink)}
.art-title{font-size:clamp(36px,5vw,64px);letter-spacing:-.022em;margin:14px 0 0;max-width:24ch}
.lead{font-family:var(--serif);font-size:clamp(19px,1.7vw,23px);line-height:1.48;color:var(--ink-2);
  margin:16px 0 0;max-width:60ch}
.art-body{padding-top:8px}
.art-body>p,.art-body>h2,.art-body>h3,.art-body>.pullquote,.art-body>.blockquote,.art-body>.callout,.art-body>p.note{
  max-width:var(--measure);margin-inline:auto;padding-inline:var(--gut)}
.art-body>p{font-size:19.5px;line-height:1.66;margin:0 auto 20px}
.art-body>h2{font-size:clamp(25px,2.4vw,31px);margin:36px auto 14px;max-width:var(--measure)}
.art-body>h3{font-size:22px;margin:30px auto 10px;max-width:var(--measure)}
.art-body .fig-cutin,.art-body .fig-inset,.art-body .article-figure{max-width:1080px;margin-inline:auto;padding-inline:var(--gut)}
.art-body .fig-inset{max-width:min(620px,100%)}
.art-body .fig-band{max-width:none;padding-inline:0}

.pullquote{border-left:3px solid var(--accent);padding:2px 0 2px 22px;margin:30px auto}
.pullquote p{font-size:clamp(25px,2.4vw,32px);line-height:1.2;font-weight:500;margin:0}
.blockquote{border-top:2px solid var(--ink);padding-top:14px;margin:30px auto}
.blockquote p{font-size:21px;line-height:1.4;font-style:italic;margin:0}
.blockquote cite{display:block;margin-top:10px;font-family:var(--sans);font-size:12.5px;font-style:normal;letter-spacing:.06em;color:var(--silt)}
.callout{background:var(--paper);border:1px solid var(--hair);border-top:3px solid var(--second);padding:18px 20px;margin:30px auto}
.callout p{margin:0;font-size:17.5px;line-height:1.5}
p.note{font-size:16.5px;line-height:1.5;color:var(--ink-2);border-left:2px solid var(--silt);padding-left:16px}

/* notes-for-design bands: full-bleed interruptions, never a standing rail */
.band{margin:clamp(32px,4vw,50px) 0}
.band-ink{background:var(--ink);color:#DCE4E9}
.band-slate{background:var(--second);color:var(--second-ink)}
.band-paper{background:var(--paper);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.band-inner{padding:clamp(24px,3vw,38px) 0}
.band-head{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.band-ink .band-head .kicker,.band-slate .band-head .kicker{color:#fff}
.band-paper .band-head .kicker{color:var(--accent)}
.band-hint{font-family:var(--serif);font-style:italic;font-size:16px;color:var(--silt)}
.band-ink .band-hint{color:#8798A3}
.band-slate .band-hint{color:#A9C4D8}

.timeline{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(228px,1fr));gap:0}
.timeline li{padding:14px 22px 16px 0;border-top:2px solid var(--accent);position:relative}
.timeline li+li{padding-left:22px;border-left:1px solid rgba(255,255,255,.18)}
.band-paper .timeline li+li{border-left-color:var(--hair-soft)}
.t-when{display:block;font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;margin-bottom:7px}
.t-when.is-long{font-size:13.5px;letter-spacing:.01em;text-transform:none;line-height:1.3}
.band-ink .t-when,.band-slate .t-when{color:#fff}
.band-paper .t-when{color:var(--ink)}
.t-what{display:block;font-size:16.5px;line-height:1.45}
.band-ink .t-what{color:#B7C4CC}
.band-slate .t-what{color:var(--second-ink)}
.band-paper .t-what{color:var(--ink-2)}

.terms{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:0 clamp(24px,3vw,40px);margin:0}
.terms div{padding:13px 0;border-top:1px solid rgba(255,255,255,.22)}
.band-paper .terms div{border-top-color:var(--hair-soft)}
.terms dt{font-family:var(--sans);font-size:14.5px;font-weight:600;letter-spacing:.01em;margin-bottom:5px}
.band-ink .terms dt,.band-slate .terms dt{color:#fff}
.terms dd{margin:0;font-size:16.5px;line-height:1.45}
.band-ink .terms dd{color:#B7C4CC}
.band-slate .terms dd{color:var(--second-ink)}
.band-paper .terms dd{color:var(--ink-2)}

.datatable,.versus{width:100%;border-collapse:collapse;font-family:var(--serif)}
.datatable th,.versus th{text-align:left;font-family:var(--sans);font-size:11.5px;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:var(--silt);padding:10px 16px 10px 0;border-bottom:1px solid var(--hair)}
.datatable td,.versus td{padding:13px 16px 13px 0;border-bottom:1px solid var(--hair-soft);font-size:17px;line-height:1.4;vertical-align:top}
.datatable td:first-child,.versus td:first-child{font-family:var(--sans);font-size:14.5px;font-weight:600}
.band-ink .datatable td,.band-slate .datatable td{border-bottom-color:rgba(255,255,255,.16);color:#DCE4E9}
.band-ink .datatable th,.band-slate .datatable th{color:#fff;border-bottom-color:rgba(255,255,255,.3)}

.chart{margin:30px 0}
.chart svg{width:100%;height:auto;overflow:visible}
.chart .bar-rect{fill:var(--second)}
.chart .bar-rect.is-peak{fill:var(--accent)}
.chart .bar-label{font-family:var(--sans);font-size:11px;fill:var(--ink-2)}
.chart .bar-val{font-family:var(--sans);font-size:11.5px;font-weight:600;fill:var(--ink)}
.chart figcaption{margin-top:12px;font-size:16px;color:var(--ink-2);max-width:60ch}

/* related / further */
.related-links,.further-grid{list-style:none;margin:0;padding:0}
.related{padding:clamp(28px,3.4vw,44px) 0 0}
.related-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(268px,1fr));gap:0 clamp(24px,3vw,40px)}
.related-links li{border-top:2px solid var(--ink);padding:13px 0 16px}
.related-links a{display:block;font-family:var(--serif);font-weight:700;font-size:20px;line-height:1.16;
  color:var(--ink);text-decoration:none;padding:8px 0;min-height:44px}
.related-links a:hover{color:var(--accent)}
.related-links .rl-sec{display:flex;align-items:center;gap:7px;color:var(--accent);margin-bottom:8px}
.related-links p{margin:7px 0 0;font-size:16px;line-height:1.4;color:var(--ink-2)}
.further-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.further-grid a{display:block;background:var(--paper);border:1px solid var(--hair);padding:14px;
  font-weight:700;color:var(--ink);text-decoration:none}
.further-grid a:hover{border-color:var(--accent);color:var(--accent)}

/* category / index pages */
.cat-head{padding:clamp(26px,3.4vw,44px) 0 0;display:grid;grid-template-columns:auto 1fr;gap:clamp(20px,2.6vw,36px);align-items:start}
.cat-head .cat-icon{color:var(--accent)}
.cat-head h1{font-size:clamp(36px,4.8vw,58px)}
.cat-intro{font-size:clamp(18px,1.6vw,21px);line-height:1.5;color:var(--ink-2);margin:14px 0 0;max-width:64ch}
.cat-list{list-style:none;margin:clamp(24px,3vw,38px) 0 0;padding:0;border-top:2px solid var(--ink)}
.cat-list li{border-bottom:1px solid var(--hair-soft)}
.cat-list>li>a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:baseline;
  padding:16px 0;text-decoration:none;color:var(--ink)}
.cat-list>li>a:hover{color:var(--accent)}
.cat-list .cl-title{font-family:var(--serif);font-weight:700;font-size:22px;line-height:1.15}
.cat-list .cl-brief{display:block;font-size:16.5px;line-height:1.42;color:var(--ink-2);margin-top:5px;max-width:74ch}
.cat-list .cl-meta{font-family:var(--sans);font-size:12px;letter-spacing:.06em;color:var(--silt);white-space:nowrap}

.hub{padding:clamp(26px,3.4vw,44px) 0 0}
.hub-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:clamp(22px,2.6vw,36px)}
.prose{padding:clamp(26px,3.4vw,44px) 0 0}
.prose h1{font-size:clamp(34px,4.4vw,54px);max-width:24ch}
.prose h2{font-size:clamp(24px,2.3vw,30px);margin:34px 0 12px}
.prose p{font-size:19px;line-height:1.62;margin:0 0 18px;max-width:66ch}
.prose ul{font-size:18.5px;line-height:1.6;max-width:66ch;padding-left:20px}
.err{padding:clamp(46px,7vw,110px) 0;text-align:left}
.err h1{font-size:clamp(40px,6vw,74px)}

.collapse{margin-top:16px}
.collapse summary{font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--accent);cursor:pointer;padding:12px 0;min-height:44px;display:flex;align-items:center;gap:9px}
.collapse summary::-webkit-details-marker{display:none}
.collapse[open] summary{color:var(--ink)}

/* ---------- responsive ---------- */
@media (max-width:1180px){
  .feed-band{grid-template-columns:1fr}
  .rail{position:static;border-top:1px solid var(--hair);padding-top:24px}
  .rail .sponsor-list{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
}
@media (max-width:960px){
  .lead-grid,.estuary-inner,.map-wrap,.foot-inner{grid-template-columns:1fr}
  .foot-inner{gap:26px}
  .fig-cutin{grid-template-columns:1fr}
  .fig-cutin figcaption{order:2}
  .timeline li+li{padding-left:0;border-left:0}
  .cat-head{grid-template-columns:1fr}
}
@media (max-width:640px){
  body{font-size:18px}
  .mast-note{text-align:left}
  .nav{gap:12px 18px}
  .fig-band figcaption{grid-template-columns:1fr}
  .fig-band .fig-credit{text-align:left}
  .card h3{min-height:0}
  .sponsor{grid-template-columns:1fr;gap:10px}
  .sponsor img{height:44px}
  .cat-list>li>a{grid-template-columns:1fr}
  .art-body>p{font-size:18.5px}
}
@media print{
  .nav,.rail,.foot-bottom{display:none}
  body{background:#fff}
}

/* ---------- reference cards ---------- */
.profile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:clamp(18px,2vw,28px);margin:24px 0}
.profile-card{display:flex;flex-direction:column;gap:9px;background:var(--paper);border:1px solid var(--hair);
  border-top:3px solid var(--second);padding:16px 18px 18px}
.profile-card .p-photo{width:100%;aspect-ratio:4/3;object-fit:cover;margin-bottom:6px}
.profile-card.no-photo{border-top-color:var(--accent)}
.profile-card h3{font-size:21px;line-height:1.15}
.profile-card p{margin:0;font-size:16.5px;line-height:1.45;color:var(--ink-2)}
.profile-card .p-role{font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--accent)}
.profile-card .p-links{margin-top:auto;padding-top:6px;font-family:var(--sans);font-size:14px;
  display:flex;gap:14px;flex-wrap:wrap}
.profile-card .p-attr{font-family:var(--sans);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--silt)}
.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin:24px 0}
.org-card{display:grid;grid-template-columns:64px minmax(0,1fr);gap:14px;align-items:center;
  background:var(--paper);border:1px solid var(--hair);padding:12px 14px;text-decoration:none;color:var(--ink)}
.org-card:hover{border-color:var(--accent)}
.org-card .org-logo{width:64px;height:34px;object-fit:contain;background:var(--ink);padding:5px}
.org-card.no-logo{grid-template-columns:1fr}
.org-name{font-family:var(--serif);font-weight:700;font-size:18px;line-height:1.15;display:block}
.org-host{font-family:var(--sans);font-size:12px;letter-spacing:.05em;color:var(--silt);display:block;margin-top:3px}
a.entity-ref{font-family:var(--sans);font-size:.92em;font-weight:500;text-decoration:none;
  border-bottom:1px solid currentColor;color:var(--second)}
a.entity-ref:hover{color:var(--accent)}
.chart .line-path{fill:none;stroke:var(--second);stroke-width:2.5}
.chart .line-dot{fill:var(--accent)}
.chart .axis{stroke:var(--hair);stroke-width:1}
.chart .donut-track{fill:none;stroke:var(--hair-soft);stroke-width:16}
.chart .donut-arc{fill:none;stroke:var(--accent);stroke-width:16;stroke-linecap:butt}
.chart .donut-label{font-family:var(--sans);font-size:15px;font-weight:700;fill:var(--ink)}
/* styleguide only */
.sg-block{padding:clamp(26px,3vw,40px) 0;border-top:1px solid var(--hair)}
.sg-block>h2{font-size:26px;margin-bottom:6px}
.sg-block>p.sg-note{font-family:var(--sans);font-size:12.5px;color:var(--silt);margin:0 0 18px}

@media (max-width:640px){
  .kicker{font-size:12.5px}
  .label{font-size:13px}
  .fig-credit{font-size:12.5px}
  .cl-meta{font-size:13px}
  .meta{font-size:13.5px}
  .further-grid a,.cat-list>li>a{min-height:48px}
  .map-legend li>a{grid-template-columns:1fr auto;row-gap:2px}
  .map-legend .mn{grid-column:1/-1}
  .ml-head{display:none}
}

/* sp-blurb-unhide: every supporter slot shows its text — no half-texted grids */
.sponsor-blurb:not(:empty){display:block!important;line-height:1.5}

/* sp-blurb-link: money-link anchors in blurbs must inherit the blurb colour (readable on dark OR light tiles) */
.sponsor-blurb a{color:inherit;text-decoration:underline;text-underline-offset:2px}

/* op-nav-collapse: this nav printed 181px of stacked links at 390 before any content
   (6 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 "inset-box", 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 (20px measured) the button carries the build's
   gutter (clamp(20px,4vw,56px)) so it cannot sit against the glass. The links are hidden,
   not removed: they stay in the markup. Desktop is untouched — every rule below is inside the
   phone breakpoint (860px here), where the button appears and the nav starts closed.
   Folded with the "height-clip" technique and marked with the "bars" icon — the mechanism
   is deliberately not identical across the fleet either. */
.nav-disclose{display:none}
@media (max-width:860px){
  .nav-disclose{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;border:1px solid currentColor;border-radius:2px;padding:10px 15px;margin-block:clamp(16px,4.5vw,26px) clamp(12px,3vw,18px)}

  .nav-disclose-bars{width:15px;height:9px;flex:none;border-top:1.5px solid currentColor;border-bottom:1.5px solid currentColor;box-shadow:inset 0 3.5px 0 -1px currentColor}
  .nav{height:0;overflow:hidden;visibility:hidden;padding-block:0;margin-block:0;border-top-width:0;border-bottom-width:0}
  .nav-disclose-c:checked ~ .nav{height:auto;overflow:visible;visibility:visible;padding-block:revert;margin-block:revert;border-top-width:revert;border-bottom-width:revert}
  .wrap:has(> .nav-disclose){display:flow-root}
  .nav-disclose:not(:has(~ .nav)){display:none}
}

/* op-footer-compact: the footer printed 4 rows for 4 link(s) in
   1 list(s) — 678px at 390, 5% of the whole page. Design's own
   good case (evbb) has no list at all: its footer links simply flow inline, 479px in total.
   Here the lists flow inline too,
   measured 678 -> 496px (27% shorter) with no new overflow. Both shapes were
   tried and the shorter one kept — two columns helps a wide group set and hurts a narrow one.
   Phone widths only; the desktop footer is untouched. */
@media (max-width:640px){
  footer ul,footer ol{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;column-gap:clamp(2px,2.99vw,43px)!important;row-gap:2px!important}
  footer ul > li,footer ol > li{width:auto!important;flex:0 0 auto;max-width:100%}
}

/* op-money-columns: the supporters block ran one tile per row — 11 tiles,
   1019px at 390, 8% of the whole page. Two columns bring it to
   616px (40% shorter). Checked before writing: no new overflow, smallest mark still
   148px wide, longest blurb 1 lines, tile heights 79-86px.
   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.
   Only the tier(s) that were one-per-row are touched (.sponsor-list), 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-list{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:10px!important}
    .sponsor-list > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .sponsor-list > * *{min-width:0!important;max-width:100%}
    .sponsor-list img,.sponsor-list svg{max-width:100%;height:auto}
}

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

/* op-article-width: the article column was capped at 707px (91 characters per line) at every desktop width. Operator: "it should utilize more space". Widened through Design's own measure --measure (declared in .art-body > p, .art-body > h2, .art-body > h3, .art-body > .pullquote, .art-body > .blockquote, .art-body > .callout, .art-body > p.note) to ~102 characters per line in this build's own prose font, never past the edge Design's own content already reaches beside it. Above 1600 the column and the prose type grow together (up to 1.2x). Nothing below 1024 changes. Originals: migration/_backups/article_width/. */
@media (min-width:1024px){
  div.art-body{--measure:min(76.394ch, 100%)!important}
}
@media (min-width:1600px){
  div.art-body > :is(p:not([class])){font-size:clamp(19.5px,1.3542vw,23.4px)!important}
}
/* op-article-width:end */

/* op-img-dims — intrinsic width/height reserve image space; the proven height:auto guard (zero specificity) */
:where(div > figure.article-figure.fig-plate > img,
  div.art-body > figure.article-figure.fig-band > img,
  div.art-body > figure.article-figure.fig-cutin > img,
  div.art-body > figure.article-figure.fig-inset > img,
  div.art-body > figure.article-figure.fig-plate > img,
  div.cards > a.card > img,
  div.wrap > figure.article-figure.fig-plate > img,
  section.estuary > figure.article-figure.fig-band > img){height:auto}
/* op-img-dims:end */
@media (min-width:800px) and (max-width:1199px){.sponsor-list:has(> [data-partner]){display:grid!important;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))!important;gap:var(--sp-gap,14px)!important;justify-content:start!important}.sponsor-list:has(> [data-partner]) > [data-partner]{width:auto!important;min-width:0!important;margin-left:0!important;margin-right:0!important}}