/* CURBS & STOOPS — riso/halftone zine system
   Tokens drive everything. Paper + ink + riso red/blue. */
:root{
  --paper:#efe9db; --paper-2:#e6ddc9; --ink:#171410; --ink-soft:rgba(23,20,16,.72);
  --red:#e8391f; --blue:#0078bf; --note-yellow:#fdf6b8; --ochre:#b98a00;
  /* one colour per section, everywhere — unique: red / blue / riso pink / ink / ochre */
  --sec-walls:var(--red); --sec-objects:var(--blue); --sec-shows:#d63e8e; --sec-history:#2e7d4f; --sec-dispatches:var(--ochre);
  --display:'Haettenschweiler','Arial Narrow Bold',Impact,'Franklin Gothic Medium','Trebuchet MS',sans-serif;
  --mono:ui-monospace,'SF Mono',SFMono-Regular,Menlo,Consolas,'Liberation Mono',monospace;
  --serif:Charter,'Bitstream Charter','Iowan Old Style','Palatino Linotype',Georgia,serif;
  --rule:3px solid var(--ink);
  --gutter:clamp(18px,4vw,48px);
  --step-0:1.25rem; /* 20px body */
  --step--1:.9375rem; /* 15px meta */
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);font-size:var(--step-0);line-height:1.62}
img{max-width:100%;display:block}
a{color:var(--blue);text-decoration-thickness:2px;text-underline-offset:3px}
a:hover{color:var(--red)}
h1,h2,h3,h4{font-family:var(--display);font-weight:400;letter-spacing:.015em;line-height:1.02;margin:0;text-transform:uppercase}
::selection{background:var(--red);color:var(--paper)}
.mono{font-family:var(--mono)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;z-index:99;background:var(--ink);color:var(--paper);padding:10px 16px;font-family:var(--mono)}

/* ---------- kicker / labels ---------- */
.kicker{font-family:var(--mono);font-size:var(--step--1);letter-spacing:.12em;text-transform:uppercase}
.kicker b{font-weight:600}
.tag{display:inline-block;font-family:var(--mono);font-size:.875rem;letter-spacing:.09em;text-transform:uppercase;border:2px solid var(--ink);padding:2px 10px;color:var(--ink);text-decoration:none;background:transparent}
.tag:hover{background:var(--ink);color:var(--paper)}
.tag--walls{border-color:var(--sec-walls);color:var(--sec-walls)}
.tag--walls:hover{background:var(--sec-walls);color:var(--paper)}
.tag--objects{border-color:var(--sec-objects);color:var(--sec-objects)}
.tag--objects:hover{background:var(--sec-objects);color:var(--paper)}
.tag--shows{border-color:var(--sec-shows);color:var(--sec-shows)}
.tag--shows:hover{background:var(--sec-shows);color:var(--paper)}
.tag--history{border-color:var(--sec-history);color:var(--sec-history)}
.tag--history:hover{background:var(--sec-history);color:var(--paper)}
.tag--dispatches{border-color:var(--sec-dispatches);color:var(--sec-dispatches)}
.tag--dispatches:hover{background:var(--sec-dispatches);color:var(--paper)}

/* ---------- halftone image treatment ---------- */
.ht{position:relative;overflow:hidden;background:var(--ink)}
.ht img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.12) brightness(1.02)}
.ht::after{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:radial-gradient(circle,rgba(23,20,16,.55) 1px,transparent 1.4px);
  background-size:5px 5px;mix-blend-mode:overlay}
.ht::before{content:"";position:absolute;inset:0;pointer-events:none;background:var(--red);mix-blend-mode:multiply;opacity:.28;z-index:1}
.ht--blue::before{background:var(--blue)}
.ht--plain::before{opacity:0}

/* ---------- header ---------- */
.site-header{background:var(--ink);color:var(--paper);border-bottom:6px solid var(--red)}
.header-in{display:flex;align-items:center;gap:22px;padding:16px var(--gutter);max-width:1720px;margin:0 auto}
.wordmark{font-family:var(--display);font-size:clamp(26px,2.6vw,36px);letter-spacing:.02em;color:var(--paper);text-decoration:none;text-transform:uppercase;white-space:nowrap}
.wordmark:hover{color:var(--paper)}
.wordmark .amp{color:var(--red)}
.tagline{font-family:var(--mono);font-size:.8125rem;letter-spacing:.14em;text-transform:uppercase;color:var(--red);white-space:nowrap}
.nav-toggle-box,.sub-toggle{position:absolute;opacity:0;pointer-events:none}
.nav-toggle{display:none;margin-left:auto;border:2px solid var(--paper);background:none;color:var(--paper);font-family:var(--mono);font-size:.875rem;letter-spacing:.1em;padding:8px 14px;cursor:pointer;align-items:center;gap:8px}
.site-nav{margin-left:auto}
.site-nav>ul{list-style:none;margin:0;padding:0;display:flex;gap:6px;align-items:center}
.site-nav li{position:relative}
.site-nav [data-nav]{display:block;font-family:var(--mono);font-size:.9375rem;letter-spacing:.08em;text-transform:uppercase;color:var(--paper);text-decoration:none;padding:10px 12px;border-bottom:3px solid transparent}
.site-nav [data-nav]:hover,.site-nav [data-nav][aria-current="page"]{border-bottom-color:var(--red);color:var(--paper)}
/* unified section colour marks in the header */
.site-nav a[href$="/category/walls/"]::before,.site-nav a[href$="/category/objects/"]::before,.site-nav a[href$="/category/shows/"]::before,.site-nav a[href$="/category/history/"]::before,.site-nav a[href$="/category/dispatches/"]::before{content:"";display:inline-block;width:9px;height:9px;margin-right:8px;vertical-align:1px;border:2px solid transparent}
.site-nav a[href$="/category/walls/"]::before{background:var(--sec-walls)}
.site-nav a[href$="/category/objects/"]::before{background:var(--sec-objects)}
.site-nav a[href$="/category/shows/"]::before{background:var(--sec-shows)}
.site-nav a[href$="/category/history/"]::before{background:var(--sec-history)}
.site-nav a[href$="/category/dispatches/"]::before{background:var(--sec-dispatches)}
.site-nav a[href$="/category/walls/"]:hover{border-bottom-color:var(--sec-walls)}
.site-nav a[href$="/category/objects/"]:hover{border-bottom-color:var(--sec-objects)}
.site-nav a[href$="/category/shows/"]:hover{border-bottom-color:var(--sec-shows)}
.site-nav a[href$="/category/history/"]:hover{border-bottom-color:var(--sec-history)}
.site-nav a[href$="/category/dispatches/"]:hover{border-bottom-color:var(--sec-dispatches)}
.nav-sub[data-cat="Walls"]{border-top-color:var(--sec-walls)}
.nav-sub[data-cat="Objects"]{border-top-color:var(--sec-objects)}
.nav-sub[data-cat="Shows"]{border-top-color:var(--sec-shows)}
.nav-sub[data-cat="History"]{border-top-color:var(--sec-history)}
.nav-sub[data-cat="Dispatches"]{border-top-color:var(--sec-dispatches)}
.nav-sub[data-cat="Walls"] a:hover{border-left-color:var(--sec-walls)}
.nav-sub[data-cat="Objects"] a:hover{border-left-color:var(--sec-objects)}
.nav-sub[data-cat="Shows"] a:hover{border-left-color:var(--sec-shows)}
.nav-sub[data-cat="History"] a:hover{border-left-color:var(--sec-history)}
.nav-sub[data-cat="Dispatches"] a:hover{border-left-color:var(--sec-dispatches)}
.site-nav .sub-arrow{display:none}
/* dropdown */
.nav-sub{list-style:none;margin:0;padding:10px 0;position:absolute;top:100%;left:0;min-width:300px;background:var(--ink);border:3px solid var(--paper);border-top:3px solid var(--red);z-index:60;display:none}
.nav-sub:empty{display:none!important}
.has-sub::after{content:"";position:absolute;left:0;right:0;top:100%;height:14px}/* hover bridge — no dead gap */
.nav-sub{margin-top:14px}
.has-sub:hover .nav-sub,.has-sub:focus-within .nav-sub{display:block}
.nav-sub a{display:block;padding:9px 18px;font-family:var(--mono);font-size:.875rem;letter-spacing:.05em;color:var(--paper);text-decoration:none;border-left:4px solid transparent}
.nav-sub a:hover{border-left-color:var(--red);color:var(--paper);background:rgba(239,233,219,.08)}
.nav-sub .sub-all a{color:var(--red)}
.nav-hub{font-family:var(--mono);font-size:.75rem;letter-spacing:.1em;color:var(--paper);opacity:.75;text-decoration:none;border:1px solid rgba(239,233,219,.4);padding:5px 9px;white-space:nowrap}
.nav-hub:hover{opacity:1;color:var(--paper);border-color:var(--paper)}

/* ---------- footer ---------- */
.site-footer{background:var(--ink);color:var(--paper);border-top:6px solid var(--red);margin-top:0}
.footer-in{max-width:1720px;margin:0 auto;padding:34px var(--gutter) 40px;display:flex;flex-wrap:wrap;gap:22px;align-items:baseline}
.footer-in .wordmark{font-size:26px}
.footer-links{display:flex;flex-wrap:wrap;gap:4px 22px;margin-left:auto}
.footer-links a{font-family:var(--mono);font-size:.875rem;letter-spacing:.08em;text-transform:uppercase;color:var(--paper);text-decoration:none}
.footer-links a:hover{color:var(--red)}
.footer-note{width:100%;font-family:var(--mono);font-size:.8125rem;letter-spacing:.1em;color:rgba(239,233,219,.6);text-transform:uppercase}

/* ---------- bands / page scaffold ---------- */
.band{border-bottom:var(--rule)}
.band-in{max-width:1720px;margin:0 auto;padding:0 var(--gutter)}
.band-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 18px;padding:26px 0 16px}
.band-head h2{font-size:clamp(28px,3vw,42px)}
.band-head .kicker{color:var(--red)}
.band-head .band-more{margin-left:auto;font-family:var(--mono);font-size:.875rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);text-decoration:none;border-bottom:2px solid var(--red)}
.band-head .band-more:hover{color:var(--red)}

/* ---------- sponsor (contract markup) ---------- */
.sponsor-well{padding:16px var(--gutter);display:flex;justify-content:center}
.sponsor{display:flex;align-items:center;gap:18px;max-width:660px;width:100%;text-decoration:none;color:var(--ink);border:2px dashed var(--ink-soft);background:var(--paper-2);padding:12px 16px;position:relative}
.sponsor::before{content:"In partnership";position:absolute;top:-11px;left:14px;background:var(--paper);padding:0 8px;font-family:var(--mono);font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.sponsor img{width:210px;height:70px;object-fit:contain;background:var(--ink);padding:10px 16px;flex:none}
.sponsor .sponsor-blurb{display:block;font-family:var(--mono);font-size:.875rem;line-height:1.5;color:var(--ink-soft);min-height:1em;flex:1}
.sponsor:hover{border-color:var(--red)}
.sponsor--small{max-width:520px}
.sponsor--small img{width:160px;height:54px}

/* ---------- dispatch feed rows ---------- */
.feed{list-style:none;margin:0;padding:0}
.feed li{border-bottom:2px dashed rgba(23,20,16,.4)}
.feed a{display:flex;gap:16px;align-items:center;padding:15px 2px;text-decoration:none;color:var(--ink)}
.feed a:hover{background:rgba(232,57,31,.07)}
.feed .ht{flex:none;width:104px;height:72px}
.feed .f-meta{display:block;font-family:var(--mono);font-size:.8125rem;letter-spacing:.1em;text-transform:uppercase;color:var(--red)}
.feed .f-title{display:block;font-family:var(--display);font-size:22px;line-height:1.08;text-transform:uppercase;margin-top:4px}
.feed a>span:nth-of-type(2){flex:1;min-width:0}
.feed .f-arrow{margin-left:auto;font-family:var(--mono);opacity:.5;flex:none}
.feed-more-box{position:absolute;opacity:0;pointer-events:none}
.feed-rest{display:none}
.feed-more-box:checked~.feed .feed-rest{display:block}
.feed-more-lbl{display:inline-block;margin-top:14px;font-family:var(--mono);font-size:.875rem;letter-spacing:.1em;text-transform:uppercase;border:2px solid var(--ink);padding:8px 16px;cursor:pointer}
.feed-more-lbl:hover{background:var(--ink);color:var(--paper)}
.feed-more-box:checked~.feed-more-lbl .lbl-open{display:none}
.feed-more-box:not(:checked)~.feed-more-lbl .lbl-close{display:none}

/* ---------- cards ---------- */
.card-grid{display:grid;gap:22px;grid-template-columns:repeat(auto-fill,minmax(min(280px,100%),1fr))}
.piece-card{display:flex;flex-direction:column;background:var(--paper);border:var(--rule);text-decoration:none;color:var(--ink)}
.piece-card .ht{aspect-ratio:16/10}
.piece-card .pc-body{display:flex;flex-direction:column;flex:1;padding:16px 18px 18px;gap:8px}
.piece-card .pc-title{font-family:var(--display);font-size:26px;line-height:1.06;text-transform:uppercase;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.12em}
.piece-card .pc-dek{font-size:1rem;line-height:1.5;color:var(--ink-soft);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.piece-card .pc-meta{margin-top:auto;font-family:var(--mono);font-size:.8125rem;letter-spacing:.09em;text-transform:uppercase;color:var(--red);padding-top:8px}
.piece-card:hover{outline:3px solid var(--red);outline-offset:-3px}

/* ---------- article ---------- */
.article-hero{border-bottom:var(--rule)}
.article-hero .band-in{padding-top:38px;padding-bottom:30px}
.article-hero h1{font-size:clamp(40px,5.4vw,84px);max-width:20ch}
.article-hero .dek{font-size:clamp(20px,2vw,26px);line-height:1.4;font-style:italic;max-width:34em;margin:18px 0 0}
.article-hero .kicker{margin-bottom:14px;display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center}
.article-figure-hero{margin:0;border-bottom:var(--rule)}
.article-figure-hero .ht{height:clamp(260px,44vw,560px)}
.article-figure-hero figcaption{font-family:var(--mono);font-size:.8125rem;letter-spacing:.06em;padding:10px var(--gutter);color:var(--ink-soft)}

.article-wrap{max-width:1500px;margin:0 auto;padding:0 var(--gutter)}
.article-body{position:relative;max-width:72ch;padding:36px 0 56px;font-size:1.3125rem;line-height:1.68}
.article-body--rail{margin-right:360px} /* reserve margin rail */
.article-body>p,.article-body>ul,.article-body>ol{margin:0 0 1.35em}
.article-body h2{font-size:clamp(28px,3vw,40px);margin:1.6em 0 .6em;padding-top:.4em;border-top:var(--rule)}
.article-body h2 .h-num{color:var(--red);margin-right:12px}
.article-body h3{font-size:24px;margin:1.4em 0 .5em}
.article-body>p:first-of-type{font-size:1.1em}
.article-body>p:first-of-type::first-letter{font-family:var(--display);font-size:4.6em;line-height:.78;float:left;padding:6px 12px 0 0;color:var(--red)}

/* lead / standfirst */
.lead{font-size:1.5rem;line-height:1.5;font-style:italic;margin:0 0 1.4em}
/* pullquote */
.pullquote{margin:1.8em 0;padding:0;border-top:var(--rule);border-bottom:var(--rule)}
.pullquote p{font-family:var(--display);font-size:clamp(26px,2.6vw,38px);line-height:1.12;text-transform:uppercase;margin:.55em 0;color:var(--red)}
/* blockquote */
.blockquote{margin:1.6em 0;padding:6px 0 6px 24px;border-left:8px solid var(--blue)}
.blockquote p{font-size:1.15em;font-style:italic;margin:0 0 .5em}
.blockquote cite{font-family:var(--mono);font-size:.875rem;letter-spacing:.08em;text-transform:uppercase;font-style:normal;color:var(--ink-soft)}
/* callout */
.callout{margin:1.6em 0;background:var(--ink);color:var(--paper);padding:20px 24px}
.callout p{margin:0;font-size:1.05em}
.callout p+p{margin-top:.7em}
.callout b,.callout strong{color:var(--red)}
/* note */
.note{margin:1.6em 0;background:var(--note-yellow);padding:14px 18px;font-family:var(--mono);font-size:.9375rem;line-height:1.6;box-shadow:3px 3px 0 rgba(23,20,16,.25)}

/* tables */
.versus,.datatable{width:100%;border-collapse:collapse;margin:1.6em 0;font-size:1rem}
.versus caption,.datatable caption{font-family:var(--mono);font-size:.8125rem;letter-spacing:.12em;text-transform:uppercase;text-align:left;padding-bottom:8px;color:var(--ink-soft)}
.versus th,.datatable th{font-family:var(--mono);font-size:.8125rem;letter-spacing:.1em;text-transform:uppercase;text-align:left;background:var(--ink);color:var(--paper);padding:9px 12px}
.versus td,.datatable td{border:2px solid var(--ink);padding:9px 12px;vertical-align:top}
.versus tbody th{background:var(--paper-2);color:var(--ink);border:2px solid var(--ink)}
.versus td:nth-child(2){border-left:6px solid var(--red)}
.versus td:nth-child(3){border-left:6px solid var(--blue)}
.datatable tbody tr:nth-child(even){background:var(--paper-2)}

/* stats */
.statrow{display:flex;flex-wrap:wrap;gap:16px;margin:1.6em 0}
.statblock{flex:1 1 150px;border:var(--rule);padding:16px 16px 14px;background:var(--paper)}
.stat-num{display:block;font-family:var(--display);font-size:clamp(34px,3.4vw,52px);line-height:1;color:var(--red)}
.stat-label{display:block;font-family:var(--mono);font-size:.8125rem;letter-spacing:.08em;text-transform:uppercase;margin-top:8px;color:var(--ink-soft);line-height:1.45}

/* timeline */
.timeline{list-style:none;margin:1.8em 0;padding:0;border-left:6px solid var(--red)}
.timeline li{position:relative;padding:0 0 22px 26px}
.timeline li:last-child{padding-bottom:4px}
.timeline li::before{content:"";position:absolute;left:-13px;top:6px;width:14px;height:14px;background:var(--paper);border:4px solid var(--ink);border-radius:50%}
.t-when{display:block;font-family:var(--display);font-size:24px;text-transform:uppercase;color:var(--ink);line-height:1.1}
.t-what{display:block;font-size:1rem;line-height:1.55;margin-top:4px;color:var(--ink-soft);max-width:60ch}

/* charts */
.chart{margin:1.8em 0;border:var(--rule);padding:18px 18px 12px;background:var(--paper)}
.chart svg{width:100%;height:auto;display:block}
.chart figcaption{font-family:var(--mono);font-size:.8125rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);margin-top:10px}
.chart .c-bar{fill:var(--red)}
.chart .c-bar--alt{fill:var(--blue)}
.chart .c-axis{stroke:var(--ink);stroke-width:3}
.chart .c-line{stroke:var(--blue);stroke-width:4;fill:none}
.chart .c-dot{fill:var(--ink)}
.chart .c-lbl{font-family:var(--mono);font-size:13px;fill:var(--ink)}
.chart .c-val{font-family:var(--display);font-size:20px;fill:var(--ink)}
.chart .c-grid{stroke:rgba(23,20,16,.18);stroke-width:1}

/* figures */
.article-figure{margin:1.8em 0}
.article-figure .ht{aspect-ratio:16/9}
.article-figure figcaption,.gallery figcaption,.map-figure figcaption{font-family:var(--mono);font-size:.875rem;line-height:1.55;padding-top:9px;color:var(--ink-soft)}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin:1.8em 0}
.gallery figure{margin:0}
.gallery .ht{aspect-ratio:4/3}

.map-figure{margin:1.8em 0;border:var(--rule);background:var(--paper-2)}
.map-figure .map-slot{min-height:300px;display:grid;place-items:center;position:relative;background-image:radial-gradient(circle,rgba(0,120,191,.28) 1.2px,transparent 1.5px);background-size:9px 9px}
.map-figure .map-slot::before{content:none;font-family:var(--mono);font-size:.8125rem;letter-spacing:.06em;color:var(--ink-soft);background:var(--paper);border:2px dashed var(--ink-soft);padding:8px 14px;max-width:80%;text-align:center}
.map-figure figcaption{padding:10px 16px 14px}

/* profile / org cards */
.profile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:18px;margin:1.8em 0}
.profile-card{border:var(--rule);background:var(--paper);padding:0 0 16px;display:flex;flex-direction:column}
.profile-card .p-photo-wrap{aspect-ratio:5/4}
.profile-card.no-photo{padding-top:16px}
.profile-card h3{font-size:24px;margin:14px 16px 0}
.profile-card .p-role{font-family:var(--mono);font-size:.8125rem;letter-spacing:.1em;text-transform:uppercase;color:var(--red);margin:6px 16px 0}
.profile-card p{font-size:.9722rem;line-height:1.55;margin:10px 16px 0;color:var(--ink-soft)}
.profile-card .p-links{margin-top:auto;padding-top:12px}
.profile-card .p-links a{font-family:var(--mono);font-size:.875rem}
.profile-card .p-attr{font-family:var(--mono);font-size:.75rem;color:var(--ink-soft)}
.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(210px,100%),1fr));gap:14px;margin:1.8em 0}
.org-card{display:flex;flex-direction:column;gap:8px;border:2px solid var(--ink);padding:14px 16px;text-decoration:none;color:var(--ink);background:var(--paper)}
.org-card:hover{outline:3px solid var(--blue);outline-offset:-2px}
.org-card .org-logo{width:100%;height:44px;object-fit:contain;background:var(--ink);padding:6px 10px}
.org-card.no-logo .org-name{padding-top:4px}
.org-card .org-name{display:block;font-family:var(--display);font-size:20px;text-transform:uppercase;line-height:1.1}
.org-card .org-host{display:block;font-family:var(--mono);font-size:.8125rem;color:var(--blue)}
.entity-ref{font-family:var(--mono);font-size:.92em;white-space:nowrap;border-bottom:2px solid var(--blue);text-decoration:none}
.entity-ref:hover{border-bottom-color:var(--red)}

/* margin-rail asides */
.rail-card{background:var(--paper);border:2px solid var(--ink);padding:12px 14px 13px;font-size:.9375rem;line-height:1.5;box-shadow:4px 4px 0 rgba(23,20,16,.22)}
.rail-card .rc-kind{display:block;font-family:var(--mono);font-size:.6875rem;letter-spacing:.16em;text-transform:uppercase;color:var(--paper);background:var(--ink);margin:-12px -14px 10px;padding:4px 14px}
.rail-card.rc-person .rc-kind{background:var(--red)}
.rail-card.rc-place .rc-kind{background:var(--blue)}
.rail-card.rc-stat .rc-kind{background:var(--ink)}
.rail-card.rc-term .rc-kind{background:var(--ink);color:var(--note-yellow)}
.rail-card b{font-family:var(--mono);font-size:.875rem;letter-spacing:.03em;text-transform:uppercase;display:block;margin-bottom:3px}
.rail-card .rc-big{display:block;font-family:var(--display);font-size:34px;line-height:1;color:var(--red);margin-bottom:4px}
.article-body--rail .rail-card{position:absolute;left:calc(100% + 56px);width:300px}
.article-body--inline-asides .rail-card{margin:1.6em 0;max-width:420px}
/* related */
.related{border-top:var(--rule);padding:22px 0 40px;max-width:72ch}
.related h2{font-size:26px;margin-bottom:14px}
.related-links{list-style:none;margin:0;padding:0}
.related-links li{border-bottom:2px dashed rgba(23,20,16,.4)}
.related-links a{display:flex;gap:14px;align-items:baseline;padding:12px 2px;text-decoration:none;color:var(--ink)}
.related-links a:hover{color:var(--red)}
.related-links .r-title{font-family:var(--display);font-size:21px;text-transform:uppercase}
.related-links .r-meta{margin-left:auto;font-family:var(--mono);font-size:.8125rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);white-space:nowrap}
/* prev/next flip */
.flip-nav{display:flex;gap:14px;border-top:var(--rule);max-width:none}
.flip-nav a{flex:1;display:block;padding:18px 2px 30px;text-decoration:none;color:var(--ink)}
.flip-nav a:hover .r-title{color:var(--red)}
.flip-nav .r-dir{font-family:var(--mono);font-size:.8125rem;letter-spacing:.12em;text-transform:uppercase;color:var(--red)}
.flip-nav .r-title{display:block;font-family:var(--display);font-size:24px;text-transform:uppercase;margin-top:6px}
.flip-nav a:last-child{text-align:right}

/* further reading cards */
.further-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:14px;margin:1.8em 0}
.further-grid a{display:flex;flex-direction:column;gap:6px;border:2px solid var(--ink);padding:14px 16px;text-decoration:none;color:var(--ink);font-family:var(--mono);font-size:.9375rem;line-height:1.5;background:var(--paper)}
.further-grid a:hover{outline:3px solid var(--red);outline-offset:-2px}
.further-grid b{display:block;font-family:var(--display);font-size:20px;font-weight:400;text-transform:uppercase;line-height:1.1}

/* ---------- category pages ---------- */
.cat-hero{border-bottom:var(--rule);background:var(--paper-2)}
.cat-hero .band-in{padding:44px var(--gutter) 36px}
.cat-hero h1{font-size:clamp(48px,6vw,92px)}
.cat-hero .cat-blurb{font-size:1.35rem;line-height:1.5;font-style:italic;max-width:36em;margin:16px 0 0}
.cat-list{list-style:none;margin:0;padding:0}
.cat-list>li{border-bottom:var(--rule)}
.cat-list>li:last-child{border-bottom:none}
.cat-list a{display:grid;grid-template-columns:180px 1fr auto;gap:22px;align-items:center;padding:20px 0;text-decoration:none;color:var(--ink)}
.cat-list .ht{width:180px;height:120px}
.cat-list .cl-title{display:block;font-family:var(--display);font-size:clamp(26px,2.6vw,38px);line-height:1.05;text-transform:uppercase}
.cat-list .cl-dek{display:block;font-size:1.05rem;color:var(--ink-soft);margin-top:6px;max-width:60ch}
.cat-list .cl-meta{font-family:var(--mono);font-size:.8125rem;letter-spacing:.09em;text-transform:uppercase;color:var(--red);white-space:nowrap}
.cat-list a:hover .cl-title{color:var(--red)}

/* ---------- A–Z ---------- */
.az-list{list-style:none;margin:0;padding:0;columns:2;column-gap:48px}
.az-list li{break-inside:avoid;border-bottom:2px dashed rgba(23,20,16,.4)}
.az-list a{display:block;padding:13px 2px;text-decoration:none;color:var(--ink)}
.az-list .r-title{font-family:var(--display);font-size:23px;text-transform:uppercase}
.az-list .r-meta{font-family:var(--mono);font-size:.8125rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}
.az-list a:hover .r-title{color:var(--red)}

/* ---------- walks ---------- */
.walk-card{border:var(--rule);background:var(--paper);padding:20px 22px;display:block;text-decoration:none;color:var(--ink)}
.walk-card:hover{outline:3px solid var(--red);outline-offset:-3px}
.walk-card .w-meta{display:block;font-family:var(--mono);font-size:.8125rem;letter-spacing:.12em;text-transform:uppercase;color:var(--red)}
.walk-card h3,.walk-card .w-title{display:block;font-family:var(--display);font-size:30px;text-transform:uppercase;margin-top:8px;line-height:1.05}
.walk-card svg{width:100%;height:34px;margin-top:12px}
.walk-stops{list-style:none;margin:1.2em 0;padding:0;counter-reset:stop}
.walk-stops li{counter-increment:stop;position:relative;padding:0 0 20px 54px;border-left:4px dashed var(--red);margin-left:18px}
.walk-stops li::before{content:counter(stop,decimal-leading-zero);position:absolute;left:-20px;top:-2px;width:36px;height:36px;background:var(--ink);color:var(--paper);font-family:var(--mono);font-size:.875rem;display:grid;place-items:center;border-radius:50%;border:3px solid var(--paper);box-shadow:0 0 0 3px var(--ink)}
.walk-stops li:last-child{border-left-color:transparent;padding-bottom:0}
.walk-stops .ws-title{display:block;font-family:var(--display);font-size:23px;text-transform:uppercase}
.walk-stops .ws-meta{display:block;font-family:var(--mono);font-size:.8125rem;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-soft);margin-top:4px}
.walk-stops a{color:var(--ink);text-decoration:none}
.walk-stops a:hover .ws-title{color:var(--red)}

/* ---------- generic prose page ---------- */
.page-body{max-width:72ch;padding:36px 0 60px;font-size:1.25rem;line-height:1.65}
.page-body h1{font-size:clamp(40px,5vw,72px);margin-bottom:.4em}
.page-body h2{font-size:clamp(26px,2.6vw,36px);margin:1.5em 0 .5em}
.page-body>p{margin:0 0 1.3em}

/* ---------- responsive ---------- */
@media (max-width:1240px){
  .article-body--rail{margin-right:0}
  .article-body--rail .rail-card{position:static;left:auto;width:auto;max-width:420px;margin:1.6em 0}
}
@media (max-width:1080px){
  .header-in{flex-wrap:wrap;position:relative}
  .tagline{display:none}
  .nav-toggle{display:flex}
  .nav-hub{order:5}
  .site-nav{display:none;width:100%;margin:0}
  .nav-toggle-box:checked~.site-nav{display:block}
  .site-nav>ul{flex-direction:column;align-items:stretch;gap:0;padding:8px 0 14px}
  .site-nav [data-nav]{border-bottom:none;border-left:4px solid transparent;padding:12px 10px}
  .site-nav [data-nav]:hover,.site-nav [data-nav][aria-current="page"]{border-left-color:var(--red)}
  .has-sub{display:flex;flex-wrap:wrap;align-items:center}
  .has-sub>[data-nav]{flex:1}
  .has-sub::after{display:none}
  .site-nav .sub-arrow{display:grid;place-items:center;width:46px;height:46px;border:2px solid rgba(239,233,219,.4);cursor:pointer}
  .site-nav .sub-arrow svg{width:14px;height:14px;transition:transform .15s}
  .nav-sub{position:static;display:none;width:100%;min-width:0;border:none;border-left:4px solid var(--red);margin:0 0 6px 10px;padding:2px 0 6px}
  .has-sub:hover .nav-sub,.has-sub:focus-within .nav-sub{display:none}
  .sub-toggle:checked~.nav-sub{display:block!important}
  .sub-toggle:checked~.sub-arrow svg{transform:rotate(180deg)}
}
@media (max-width:900px){
  .cat-list a{grid-template-columns:120px 1fr}
  .cat-list .ht{width:120px;height:84px}
  .cat-list .cl-meta{grid-column:2}
  .az-list{columns:1}
  .flip-nav{flex-direction:column}
  .flip-nav a:last-child{text-align:left}
}
@media (max-width:600px){
  body{font-size:1.125rem}
  .article-body{font-size:1.1875rem}
  .feed .ht{width:80px;height:58px}
  .feed .f-title{font-size:19px}
  .sponsor{flex-direction:column;align-items:flex-start}
  .sponsor img{width:200px;height:64px}
  .statblock{flex-basis:120px}
  .article-hero h1{overflow-wrap:break-word}
  /* wide tables scroll instead of overflowing the page */
  .versus,.datatable{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}

/* pipeline: sponsor link-treatment variety (footprint) */
.sponsor::before{content:none!important;}
.sponsor a.sp-logo{display:contents;}   /* logo link is layout-transparent so Design's img sizing still applies */
.sponsor-blurb a{color:inherit;text-decoration:underline;text-underline-offset:2px;}
.sponsor-blurb a:hover{opacity:.8;}
.sponsor .sp-domain{display:inline-block;margin-top:8px;color:inherit;text-decoration:none;opacity:.75;font-size:.9em;letter-spacing:.02em;}
.sponsor .sp-domain:hover{text-decoration:underline;opacity:1;}

/* 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. */
.band.sponsor-well .sponsor.sponsor img{height:54px!important}


/* sp-well-row: more than one brand to a row — ON WIDE VIEWPORTS ONLY.
   ⚠️ THE FIRST VERSION WAS UNGUARDED !important AND IT BROKE MOBILE. Design stacks these tiles
   below 600px (.sponsor{flex-direction:column} and a 200x64 mark); my rules outranked that, so a
   phone got a 300px mark wedged beside a squeezed column of text. Everything here is now inside
   a min-width query and Design's own responsive rules govern below it.

   Design put each supporter in its own full-width .band.sponsor-well — eleven bands, eleven rows,
   one brand apiece. The wells are siblings with no shared flex parent, so those that sit in a RUN
   are set inline-block at a third of the width: three to a row, no markup touched. A well with no
   well either side of it stands alone between articles and gets its whole row instead. */
@media (min-width:901px){
  .band.sponsor-well:has(+ .band.sponsor-well),
  .band.sponsor-well + .band.sponsor-well{
    display:inline-block!important;width:32.4%!important;margin:0 .4% 4px!important;
    vertical-align:top!important;border-bottom:0!important;padding:12px 10px!important}
  .band.sponsor-well:has(+ .band.sponsor-well) .sponsor,
  .band.sponsor-well + .band.sponsor-well .sponsor{max-width:none!important;width:100%!important}

  .band.sponsor-well:not(:has(+ .band.sponsor-well)):not(.band.sponsor-well + .band.sponsor-well) .sponsor{
    max-width:1040px!important;width:100%!important;gap:28px!important}
  .band.sponsor-well:not(:has(+ .band.sponsor-well)):not(.band.sponsor-well + .band.sponsor-well) .sponsor.sponsor img{
    width:300px!important;height:88px!important}
}

/* op-article-width: the article column was capped at 841px (93 characters per line) at every desktop width. Operator: "it should utilize more space". Widened through max-width 72ch (declared in .article-body) 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){
  body:has(.article-body--rail) article#article{max-width:min(921px, 100%)!important}
}
@media (min-width:1600px){
  body:has(.article-body--rail) article#article{max-width:min(clamp(921px, 63.958vw, 1105px), 100%)!important}
  body:has(.article-body--rail) article#article > :is(p.note){font-size:clamp(15px,1.0417vw,18.0px)!important}
}
/* op-article-width:end */

/* op-hover-pad */
.feed a{padding-right:clamp(12px,3.5vw,22px)!important}
/* op-hover-pad:end */
/* op-heading-levels */
h1.rt-wrap{display:contents!important;font:inherit!important;letter-spacing:inherit!important;word-spacing:inherit!important;text-transform:inherit!important;color:inherit!important;line-height:inherit!important;text-align:inherit!important}
/* op-heading-levels:end */

/* op-img-dims — intrinsic width/height reserve image space; the proven height:auto guard (zero specificity) */
:where(a > span.ht > img,
  a > span.ht.ht--blue > img,
  figure > span.ht > img,
  figure > span.ht.ht--blue > img,
  figure.article-figure > span.ht > img,
  figure.article-figure > span.ht.ht--blue > img,
  figure.article-figure-hero > span.ht > img,
  figure.article-figure-hero > span.ht.ht--blue > img){height:auto}
/* op-img-dims:end */

/* op-locator-map — real-geodata locators (Natural Earth 10m · US Census 500k · OSM); the svg is meet-scaled into Design's own box,
   pins and labels are HTML at a fixed px size placed with container-query units, so they stay legible on phones */
.map-slot.is-mapped{position:relative;container-type:size;overflow:hidden;padding:0!important;background:#efe9db!important;background-image:none!important;border:0!important;color:#171410;height:300px!important}
.map-slot.is-mapped::before,.map-slot.is-mapped::after{content:none!important;display:none!important}
.map-slot.is-mapped>svg.mk{position:absolute;inset:0;width:100%;height:100%;display:block}
.map-slot.is-mapped>span{--s:min(100cqw / var(--vw), 100cqh / var(--vh));position:absolute;left:calc(50% + (var(--x) - var(--vw) / 2) * var(--s));top:calc(50% + (var(--y) - var(--vh) / 2) * var(--s));width:0;height:0;pointer-events:none;white-space:nowrap;font-family:var(--mono);line-height:1;letter-spacing:0;text-transform:none;font-style:normal}
.map-slot.is-mapped>.mk-p i{position:absolute;left:-5px;top:-5px;width:10px;height:10px;border-radius:50%;background:#e8391f;box-shadow:0 0 0 2px #efe9db}
.map-slot.is-mapped>.mk-p b{position:absolute;font-size:12px;font-weight:700;line-height:15px;color:#171410;text-shadow:0 0 2px #efe9db,0 0 2px #efe9db,0 0 3px #efe9db,0 0 4px #efe9db}
.map-slot.is-mapped>.mk-p.r b{left:10px;top:-7.5px}.map-slot.is-mapped>.mk-p.l b{right:10px;top:-7.5px}.map-slot.is-mapped>.mk-p.t b{left:0;transform:translateX(-50%);bottom:8px}.map-slot.is-mapped>.mk-p.b b{left:0;transform:translateX(-50%);top:8px}.map-slot.is-mapped>.mk-p.tr b{left:5px;bottom:4px}.map-slot.is-mapped>.mk-p.br b{left:5px;top:4px}.map-slot.is-mapped>.mk-p.tl b{right:5px;bottom:4px}.map-slot.is-mapped>.mk-p.bl b{right:5px;top:4px}.map-slot.is-mapped>.mk-p.ru b{left:10px;top:-15.5px}.map-slot.is-mapped>.mk-p.rd b{left:10px;top:.5px}.map-slot.is-mapped>.mk-p.lu b{right:10px;top:-15.5px}.map-slot.is-mapped>.mk-p.ld b{right:10px;top:.5px}.map-slot.is-mapped>.mk-p.tt b{left:0;transform:translateX(-50%);bottom:13px}.map-slot.is-mapped>.mk-p.bb b{left:0;transform:translateX(-50%);top:13px}
.map-slot.is-mapped>.mk-a{font-size:11px;font-style:italic;letter-spacing:.04em;color:#171410;opacity:.62;display:flex;justify-content:center;align-items:center}
.map-slot.is-mapped>.mk-a.mk-ref{font-style:normal;opacity:.7;justify-content:flex-start;padding-left:6px;align-items:center}
.map-slot.is-mapped>.mk-a.mk-sea{color:#171410;opacity:.85}
.map-slot.is-mapped>.mk-a.mk-line{font-style:normal;font-weight:700;opacity:.9;color:#e8391f;text-shadow:0 0 2px #efe9db,0 0 3px #efe9db}
.map-slot.is-mapped>.mk-r::before{content:'';position:absolute;left:-2.5px;top:-2.5px;width:5px;height:5px;border-radius:50%;background:#171410;opacity:.55}
/* op-locator-map:end */
@media (min-width:1081px) and (max-width:1359px){.header-in { flex-wrap: wrap; position: relative; }.nav-toggle { display: flex; }.nav-hub { order: 5; }.site-nav { display: none; width: 100%; margin: 0px; }.nav-toggle-box:checked ~ .site-nav { display: block; }.site-nav > ul { flex-direction: column; align-items: stretch; gap: 0px; padding: 8px 0px 14px; }.site-nav [data-nav] { border-bottom-width: medium; border-bottom-style: none; border-bottom-color: currentcolor; border-left: 4px solid transparent; padding: 12px 10px; }.site-nav [data-nav]:hover, .site-nav [data-nav][aria-current="page"] { border-left-color: var(--red); }.has-sub { display: flex; flex-wrap: wrap; align-items: center; }.has-sub > [data-nav] { flex: 1 1 0%; }.site-nav .sub-arrow { display: grid; place-items: center; width: 46px; height: 46px; border: 2px solid rgba(239, 233, 219, 0.4); cursor: pointer; }.site-nav .sub-arrow svg { width: 14px; height: 14px; transition: transform 0.15s; }.nav-sub { position: static; display: none; width: 100%; min-width: 0px; border-top-width: medium; border-right-width: medium; border-bottom-width: medium; border-top-style: none; border-right-style: none; border-bottom-style: none; border-top-color: currentcolor; border-right-color: currentcolor; border-bottom-color: currentcolor; border-image: none; border-left: 4px solid var(--red); margin: 0px 0px 6px 10px; padding: 2px 0px 6px; }.has-sub:hover .nav-sub, .has-sub:focus-within .nav-sub { display: none; }.sub-toggle:checked ~ .nav-sub { display: block !important; }.sub-toggle:checked ~ .sub-arrow svg { transform: rotate(180deg); }}
