/* ncsparks.net — "Cloud Line"
   PALETTE (4 members, each with a job)
   --ground   #16241d  spruce dark      : page ground, large areas
   --ink      #f2ece0  bone             : all body and display text on ground
   --accent   #d4581f  tangerine  (sat) : rules, kickers, links, one filled plate
   --secondary #2f8f7d jade      (sat) : section grounds, panels, icon strokes
   accent and secondary sit ~140° apart in hue, both fully saturated.
*/
:root{
  --ground:#16241d;
  --ground-deep:#0f1a15;
  --panel:#12201a;
  --ink:#f2ece0;
  --ink-70:rgba(242,236,224,.72);
  --ink-50:rgba(242,236,224,.52);
  --ink-30:rgba(242,236,224,.3);
  --ink-14:rgba(242,236,224,.14);
  --accent:#d4581f;
  --accent-lt:#e2703a;
  --secondary:#2f8f7d;
  --secondary-lt:#4fb39d;
  --display:"Vollkorn",Georgia,"Times New Roman",serif;
  --util:"Chivo",system-ui,-apple-system,sans-serif;
  --measure:68ch;
  --pad:clamp(24px,5.5vw,92px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--ground);color:var(--ink);
  font-family:var(--util);font-size:18px;line-height:1.6;
  text-rendering:optimizeLegibility;overflow-x:hidden;
}
img{max-width:100%;display:block}
figure{margin:0}
a{color:var(--accent-lt);text-decoration:none;border-bottom:1px solid rgba(212,88,31,.45)}
a:hover{color:var(--ink);border-bottom-color:var(--ink)}
h1,h2,h3,h4{font-family:var(--display);font-weight:600;letter-spacing:-.015em;margin:0;text-wrap:pretty}
p{margin:0}
::selection{background:var(--accent);color:var(--ink)}
.wrap{padding-inline:var(--pad)}
.measure{max-width:var(--measure)}
.kicker{font-family:var(--util);font-size:14.5px;letter-spacing:.15em;text-transform:uppercase;font-weight:500;color:var(--accent-lt);display:flex;align-items:center;gap:10px}
.kicker--jade{color:var(--secondary-lt)}
.kicker.kicker--jade{font-size:13px}
.kicker a{color:inherit;border:0}
.icon{width:22px;height:22px;flex:none;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.icon--lg{width:34px;height:34px;stroke-width:1.2}
.credit{display:block;font-family:var(--util);font-size:13.5px;letter-spacing:.05em;color:var(--ink-50);margin-top:8px}

/* ---------- masthead ---------- */
.site-head{padding-top:clamp(20px,3vw,34px);padding-bottom:0;padding-inline:var(--pad);background:var(--ground-deep)}
.site-head--onimage{position:relative;z-index:3;background:linear-gradient(180deg,rgba(15,26,21,.94) 0,rgba(15,26,21,.86) 58%,rgba(15,26,21,.62) 88%,rgba(15,26,21,0) 100%)}
.site-head--onimage .mh-name,.site-head--onimage .mh-sig{text-shadow:0 2px 20px rgba(15,26,21,.9)}
.mh-top{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;flex-wrap:wrap}
.mh-lock{display:flex;align-items:flex-start;gap:clamp(12px,2vw,24px);border:0}
.mh-lock:hover{border:0}
.mh-mark{width:clamp(34px,5.6vw,70px);height:clamp(34px,5.6vw,70px);flex:none;stroke:var(--accent);fill:none;margin-top:clamp(1px,.35vw,5px)}
.mh-name{font-family:var(--display);font-size:clamp(38px,6.4vw,80px);line-height:.86;font-weight:600;letter-spacing:-.03em;color:var(--ink);display:block}
.mh-sig{font-family:var(--util);font-size:clamp(14px,1.15vw,15.5px);letter-spacing:.13em;text-transform:uppercase;color:var(--secondary-lt);margin-top:11px;font-weight:500}
.mh-domain{font-family:var(--util);font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-50);align-self:flex-end;padding-bottom:6px}
.mh-rule{margin-top:clamp(18px,2.4vw,32px);border-top:1px solid var(--ink-30);padding-top:15px;display:flex;gap:clamp(16px,2.6vw,38px);flex-wrap:wrap;align-items:center;padding-bottom:15px}
.nav-a{display:flex;align-items:center;gap:10px;font-size:clamp(14px,1.25vw,16.5px);letter-spacing:.11em;text-transform:uppercase;font-weight:500;color:var(--ink);border:0}
.nav-a .icon{width:23px;height:23px;color:var(--secondary)}
.nav-a:hover{color:var(--accent-lt);border:0}
.nav-a:hover .icon{color:var(--accent)}
.nav-a[aria-current]{color:var(--accent-lt)}
.nav-a[aria-current] .icon{color:var(--accent)}
.nav-a--quiet{color:var(--ink-50)}

/* ---------- homepage lead ---------- */
.lead-band{position:relative;background:var(--panel);min-height:min(94vh,940px);display:flex;flex-direction:column;overflow:hidden}
.lead-band>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lead-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,26,21,.92) 0,rgba(15,26,21,.6) 24%,rgba(15,26,21,.42) 40%,rgba(15,26,21,.72) 62%,rgba(15,26,21,.94) 100%)}
.lead-copy{position:relative;z-index:3;margin-top:auto;padding-top:clamp(52px,8vw,120px);padding-bottom:clamp(34px,5vw,64px);padding-inline:var(--pad);max-width:none;background:linear-gradient(0deg,rgba(15,26,21,.95) 0,rgba(15,26,21,.9) 55%,rgba(15,26,21,.7) 82%,rgba(15,26,21,0) 100%)}
.lead-copy>*{max-width:1000px}
.lead-copy .kicker{color:var(--ink)}
.lead-copy .kicker .icon{color:var(--accent)}
.lead-copy .credit{color:rgba(242,236,224,.72)}
.lead-title a{color:var(--ink);border:0}
.lead-title a:hover{color:var(--accent-lt)}
.lead-dek{margin-top:18px;font-size:clamp(17px,1.5vw,22px);line-height:1.55;color:var(--ink-70);max-width:56ch}
.lead-title{font-size:clamp(34px,5.4vw,74px);line-height:1.02;margin-top:16px}
.lead-more{margin-top:22px;display:inline-block;font-size:14.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--accent-lt);border-bottom:2px solid var(--accent)}

/* ---------- generic bands ---------- */
.band{padding-block:clamp(56px,7vw,116px);padding-inline:var(--pad)}
.band--quiet{padding-block:clamp(70px,8.5vw,140px)}
.band--scenery{position:relative;background-image:linear-gradient(180deg,rgba(15,26,21,.9) 0,rgba(15,26,21,.6) 45%,rgba(15,26,21,.93) 100%),url("img/band-gorge.jpg");background-size:cover;background-position:center 38%;background-repeat:no-repeat}
.band--savanna{position:relative;background-image:linear-gradient(180deg,rgba(15,26,21,.92) 0,rgba(15,26,21,.66) 48%,rgba(15,26,21,.94) 100%),url("img/band-savanna.jpg");background-size:cover;background-position:center 55%;background-repeat:no-repeat}
.band--savanna .three{background:rgba(11,19,16,.82);border-top:3px solid var(--accent);padding:22px 22px 24px;box-shadow:0 22px 46px -14px rgba(0,0,0,.7)}
.band--savanna .three p{color:rgba(242,236,224,.8)}
.band--savanna .band-title{text-shadow:0 2px 20px rgba(11,19,16,.85)}
.band--scenery .statrow{background:transparent;gap:clamp(12px,1.4vw,20px);box-shadow:none}
.band--scenery .statblock{background:rgba(11,19,16,.82);border:1px solid rgba(242,236,224,.12);box-shadow:0 22px 46px -12px rgba(0,0,0,.7),0 2px 0 rgba(242,236,224,.05) inset;padding:24px 22px}
.band--scenery .stat-num{text-shadow:0 2px 18px rgba(11,19,16,.8)}
.band--scenery .big-line,.band--scenery .body-note{text-shadow:0 2px 20px rgba(11,19,16,.75)}
.band--jade{background:var(--secondary);color:var(--ground-deep)}
.band--jade h2,.band--jade h3{color:var(--ground-deep)}
.band--jade a{color:var(--ground-deep);border-bottom-color:rgba(15,26,21,.45)}
.band--jade .kicker{color:rgba(15,26,21,.72)}
.band--deep{background:var(--ground-deep)}
.band-hd{display:flex;align-items:baseline;justify-content:space-between;gap:28px;flex-wrap:wrap;margin-bottom:clamp(26px,3.4vw,48px)}
.band-title{font-size:clamp(26px,3vw,40px);line-height:1.16;max-width:34ch}
.band-title--italic{font-style:italic;font-weight:400;color:var(--ink-70)}
.big-line{font-size:clamp(28px,4.4vw,54px);line-height:1.24;max-width:24ch;font-family:var(--display);font-weight:400}
.body-note{margin-top:26px;max-width:60ch;font-size:clamp(16px,1.3vw,19px);line-height:1.68;color:var(--ink-70)}

/* two seconds */
.seconds{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:clamp(28px,4vw,58px);align-items:start}
.seconds>*{min-width:0}
@media(max-width:820px){.seconds{grid-template-columns:minmax(0,1fr)}}
.second-title{font-size:clamp(23px,2.5vw,36px);line-height:1.16;margin-top:18px}
.second-title a{color:var(--ink);border:0}
.second-title a:hover{color:var(--accent-lt)}
.second-dek{margin-top:12px;font-size:16.5px;line-height:1.62;color:var(--ink-70);max-width:46ch}

/* short group */
.threes{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:clamp(24px,3vw,44px)}
.three{min-width:0;border-top:1px solid var(--ink-30);padding-top:16px;display:flex;flex-direction:column;height:100%}
.three h3{font-size:21px;line-height:1.24;margin-top:10px}
.three h3 a{color:var(--ink);border:0}
.three h3 a:hover{color:var(--accent-lt)}
.three p{margin-top:8px;font-size:15.5px;line-height:1.58;color:var(--ink-70)}

/* section hub */
.hub{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1px;background:var(--ink-14);margin-top:clamp(40px,5vw,72px)}
.hub-item{min-width:0;display:flex;flex-direction:column;gap:0;border:0;color:inherit;background:var(--ground);padding:clamp(22px,2.4vw,30px);height:100%}
.hub-item:hover{border:0;background:var(--panel)}
.hub-item .icon{color:var(--secondary);margin:0 0 18px}
.hub-no{font-family:var(--util);font-size:13px;letter-spacing:.18em;color:var(--ink-50);margin-bottom:12px}
.hub-item:hover h3{color:var(--accent-lt)}
.hub-meta{margin-top:auto;padding-top:16px;font-family:var(--util);font-size:13.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--secondary-lt)}
.hub-item h3{font-size:clamp(19px,1.7vw,23px);line-height:1.24;color:var(--ink)}
.hub-item:hover h3{text-decoration:underline;text-underline-offset:3px}
.hub-item p{font-size:15.5px;line-height:1.58;margin-top:10px;color:var(--ink-70)}

/* ---------- figure system: three treatments ---------- */
/* 1 · mat — photograph sits on a raised card with an inset hairline */
.fig-mat{margin-block:clamp(46px,5.4vw,84px);margin-inline:calc(-1 * clamp(0px,3.6vw,80px));clear:both}
.fig-mat .fw{padding:clamp(10px,1.2vw,16px);background:rgba(242,236,224,.06);border:1px solid var(--ink-14)}
.fig-mat img{width:100%;aspect-ratio:16/10;max-height:min(58vh,540px);object-fit:cover}
/* 2 · bleed — full width, caption plate stepped over the corner */
.fig-bleed{margin:clamp(38px,5vw,76px) 0;position:relative;clear:both}
.fig-bleed img{width:100%;height:clamp(300px,52vw,620px);object-fit:cover}
.fig-bleed figcaption{background:var(--ground-deep);margin:-34px clamp(16px,3vw,60px) 0 auto;position:relative;max-width:min(640px,88%)}
/* 3 · inset — narrow, rule-topped, sits in the text column */
.fig-inset{margin:40px 0;max-width:480px}
.fig-inset img{width:100%;aspect-ratio:3/2;object-fit:cover;border-top:3px solid var(--accent)}
.fig-side{margin-inline:0;display:grid;grid-template-columns:minmax(0,44%) minmax(0,1fr);gap:clamp(20px,2.6vw,46px);align-items:start;margin-block:clamp(46px,5.4vw,84px);clear:both}
.fig-side img{width:100%;aspect-ratio:4/3;object-fit:cover;border-top:3px solid var(--accent)}
.fig-side figcaption{margin-top:0;align-self:stretch;max-width:44ch;display:flex;flex-direction:column}
.fig-side .fig-dek{font-family:var(--util);font-size:16.5px;line-height:1.6;color:var(--ink-70);margin:14px 0 0;max-width:40ch}
.fig-side .fig-more{margin-top:auto;padding-top:18px;font-family:var(--util);font-size:13.5px;letter-spacing:.13em;text-transform:uppercase;font-weight:700;color:var(--accent-lt);border:0;width:max-content}
.fig-side .fig-more::after{content:" \2192"}
.fig-side .fig-more:hover{color:var(--ink)}
.fig-side .credit{margin-top:14px}
figcaption>a{align-self:start;justify-self:start;width:max-content;max-width:100%}
@media(max-width:720px){.fig-side{grid-template-columns:minmax(0,1fr);gap:16px}.fig-side figcaption{max-width:none}}
@media(max-width:720px){.fig-inset--right{float:none;margin:30px 0;max-width:none}}
figcaption{font-family:var(--display);font-size:clamp(16px,1.3vw,19.5px);line-height:1.5;color:var(--ink);margin-top:14px;max-width:none;border-left:3px solid var(--accent);padding-left:15px}
@media(min-width:900px){
  .fig-mat figcaption,.map-figure figcaption,.article-figure figcaption{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,300px);column-gap:clamp(24px,3vw,56px);align-items:start}
  .fig-mat figcaption .credit,.map-figure figcaption .credit,.article-figure figcaption .credit{margin-top:4px;text-align:right;align-self:start;justify-self:end;grid-column:2;grid-row:1 / span 4;max-width:100%}
  .fig-mat figcaption .fig-kicker{grid-column:1}
  .fig-mat figcaption>a,.article-figure figcaption>a,.map-figure figcaption>a{grid-column:1;align-self:start;justify-self:start;width:max-content;max-width:100%}
  .fig-bleed figcaption .credit{max-width:none}
}
.fig-bleed figcaption{border-left:0;border-top:3px solid var(--accent);padding:24px clamp(20px,2.6vw,34px) 26px}
figcaption .credit{border:0;padding:0;font-family:var(--util)}
.article-figure{margin:34px 0}
.article-figure img{width:100%;aspect-ratio:16/10;object-fit:cover}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin:34px 0}
.gallery figure{margin:0}
.gallery img{width:100%;aspect-ratio:1/1;object-fit:cover}
.gallery figcaption{font-size:15px;border-left-width:2px;padding-left:11px}

/* ---------- article ---------- */
.art-head{padding-top:clamp(30px,4vw,58px);padding-bottom:0;padding-inline:var(--pad);max-width:calc(clamp(900px,68vw,1240px) + 2 * clamp(24px,5.5vw,92px));margin-inline:auto}
.art-title{font-size:clamp(32px,5vw,76px);line-height:1.03;margin-top:16px;max-width:24ch}
.art-body{padding-top:clamp(34px,4.4vw,62px);padding-bottom:clamp(56px,6.5vw,100px);padding-inline:var(--pad);max-width:calc(clamp(900px,68vw,1240px) + 2 * clamp(24px,5.5vw,92px));margin-inline:auto}
.col{max-width:var(--measure);padding-inline:0}
.art-body h2{font-size:clamp(23px,2.4vw,36px);line-height:1.2;margin:clamp(52px,5.4vw,84px) auto 22px;max-width:var(--col)}
.art-body h2::before{content:"";display:block;width:56px;border-top:3px solid var(--secondary);margin-bottom:16px}
.art-body{--col:min(clamp(620px,46vw,780px),100%)}
.art-body p{font-size:clamp(18px,1.35vw,22px);line-height:1.72;margin:0 auto 28px;max-width:var(--col)}
.lead{font-family:var(--display);font-size:clamp(21px,2.1vw,29px)!important;line-height:1.44!important;color:var(--ink);max-width:var(--col)!important;margin:0 auto clamp(34px,4vw,52px)!important}
.art-body a{border-bottom:1px solid rgba(212,88,31,.45)}

/* notes-for-design components */
.notes{margin:clamp(50px,5.6vw,88px) 0;border-top:1px solid var(--ink-30);padding-top:26px;clear:both}
.notes-hd{font-family:var(--util);font-size:13.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--secondary-lt);font-weight:500;display:flex;align-items:center;gap:10px;margin-bottom:20px}
.art-body h2.notes-hd{font-family:var(--util);font-size:14px;letter-spacing:.15em;margin:0 0 22px;max-width:none;line-height:1.4}
.art-body h2.notes-hd::before{content:none;display:none}
.fig-kicker{display:block;font-family:var(--util);font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-70);margin-bottom:8px}
.measures{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:0 clamp(24px,3vw,52px);margin:0;border-top:1px solid var(--ink-14);padding-top:6px}
.measures>div{min-width:0;padding:15px 0 16px}
.measures dt{font-family:var(--display);font-size:19px;line-height:1.35;color:var(--ink)}
.measures dd{margin:6px 0 0;font-size:15.5px;line-height:1.55;color:var(--ink-70)}
.measures--stat{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1px;background:var(--ink-14);border-top:0;padding-top:0}
.measures--stat>div{background:var(--panel);padding:22px 20px}
.measures--stat dt{font-family:var(--display);font-size:clamp(23px,2.4vw,32px);line-height:1.14;color:var(--accent)}
.measures--stat dd{margin:12px 0 0;font-family:var(--util);font-size:13px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-50);line-height:1.5}
.measures--gloss{grid-template-columns:minmax(0,1fr);border-top:0;padding-top:0;gap:0}
.measures--gloss>div{display:grid;grid-template-columns:minmax(150px,24%) minmax(0,1fr);gap:clamp(14px,2.4vw,36px);padding:17px 0;border-top:1px solid var(--ink-14);align-items:baseline}
.measures--gloss dt{font-family:var(--util);font-size:15px;letter-spacing:.08em;text-transform:uppercase;color:var(--secondary-lt);line-height:1.4}
.measures--gloss dd{margin:0;font-size:17px;line-height:1.62;color:var(--ink)}
@media(max-width:620px){.measures--gloss>div{grid-template-columns:minmax(0,1fr);gap:5px}}
.timeline{list-style:none;margin:0;padding:0 0 0 26px;display:grid;gap:0;position:relative}
.timeline::before{content:"";position:absolute;left:5px;top:14px;bottom:14px;border-left:1px solid rgba(47,143,125,.45)}
.timeline li{display:grid;grid-template-columns:minmax(120px,18%) minmax(0,1fr);gap:clamp(14px,2.4vw,34px);padding:14px 0;border-top:0;align-items:baseline;position:relative}
.timeline li::before{content:"";position:absolute;left:-26px;top:20px;width:11px;height:11px;border-radius:50%;background:var(--ground);border:2px solid var(--accent);box-sizing:border-box}
@media(max-width:620px){.timeline li{grid-template-columns:minmax(0,1fr);gap:4px}}
.t-when{font-family:var(--display);font-size:19.5px;letter-spacing:0;color:var(--secondary);font-weight:600;line-height:1.35}
.t-what{font-size:17px;line-height:1.62;color:var(--ink-70)}
.callout{background:var(--panel);border:1px solid var(--ink-14);border-left:4px solid var(--accent);padding:clamp(20px,2.4vw,30px);margin:clamp(30px,3.6vw,50px) 0}
.callout p{margin:0;font-family:var(--display);font-size:20px;line-height:1.5;max-width:52ch}
.callout ul{margin:0;padding-left:20px}
.callout li{font-size:16.5px;line-height:1.62;margin-bottom:8px}
.pullquote{margin:clamp(34px,4vw,58px) 0;border:0;padding:0}
.pullquote p{font-family:var(--display);font-size:clamp(24px,3vw,38px);line-height:1.26;color:var(--secondary);max-width:26ch;margin:0}
.blockquote{margin:34px 0;padding-left:22px;border-left:3px solid var(--secondary)}
.blockquote p{font-family:var(--display);font-size:21px;line-height:1.5;margin:0}
.blockquote cite{display:block;margin-top:12px;font-family:var(--util);font-size:14px;font-style:normal;color:var(--ink-50)}
.note{font-size:16px!important;line-height:1.6;color:var(--ink-70);border-top:1px solid var(--ink-14);padding-top:12px;max-width:56ch}
.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1px;background:var(--ink-14);margin:clamp(44px,5vw,72px) 0}
.statblock{background:var(--ground);padding:22px 20px;min-width:0}
.stat-num{display:block;font-family:var(--display);font-size:clamp(34px,4vw,54px);line-height:.94;color:var(--accent)}
.stat-label{display:block;margin-top:10px;font-size:14.5px;line-height:1.5;color:var(--ink-70)}
.versus,.datatable{width:100%;border-collapse:collapse;margin:clamp(28px,3.4vw,44px) 0;font-size:16.5px}
.versus th,.versus td,.datatable th,.datatable td{text-align:left;padding:13px 16px;border-bottom:1px solid var(--ink-14);vertical-align:top}
.versus th,.datatable th{font-family:var(--util);font-size:13.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--secondary-lt);font-weight:500}
.datatable td:last-child,.versus td:last-child{color:var(--ink-70)}
.chart{margin:clamp(30px,3.6vw,48px) 0}
.chart svg{width:100%;height:auto;overflow:visible}
.chart text{font-family:var(--util);font-size:12px;fill:var(--ink-70)}

/* map */
.map-figure{margin-block:clamp(46px,5.4vw,84px);margin-inline:0;clear:both}
.map-figure .map-slot{background:var(--ground-deep);border:1px solid var(--ink-14);padding:clamp(10px,1.6vw,22px)}
.map-figure svg{width:100%;height:auto;display:block}
.map-pin-label{font-family:var(--util);font-size:12.5px;letter-spacing:.05em;fill:#f2ece0;text-transform:uppercase;paint-order:stroke;stroke:#0b1310;stroke-width:3.5px;stroke-linejoin:round}
.map-region-label{font-family:var(--util);font-size:12px;letter-spacing:.2em;fill:rgba(242,236,224,.42);text-transform:uppercase}
.map-state-label{font-family:var(--display);font-size:30px;letter-spacing:.24em;fill:rgba(242,236,224,.13);text-transform:uppercase}
.map-legend{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 28px}
.map-legend li{display:flex;align-items:center;gap:9px;font-family:var(--util);font-size:13.5px;color:var(--ink-50)}
.map-legend .mk-dot{width:11px;height:11px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px rgba(212,88,31,.22);flex:none}
.map-legend .mk-land{width:16px;height:11px;background:#1f5a4d;border:1px solid rgba(47,143,125,.7);flex:none}
.map-figure a:hover .map-pin-label{fill:var(--accent-lt)}
.map-figure figcaption{border-left-color:var(--secondary)}
.band--jade .map-figure .map-slot{background:var(--ground-deep);border-color:rgba(15,26,21,.4)}
.band--jade .map-figure figcaption{color:var(--ground-deep);border-left-color:var(--ground-deep)}

/* rail-free aside: sidenotes sit under their own rule inside the measure */
.sidenote{margin:30px 0;padding:18px 0 0;border-top:1px solid var(--ink-30);max-width:min(46ch,100%)}
.sidenote .kicker{margin-bottom:8px}
.sidenote p{font-size:16px!important;line-height:1.62;color:var(--ink-70);margin:0}

/* cards / references */
.profile-grid,.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;margin:34px 0}
.profile-card{min-width:0;background:var(--panel);border:1px solid var(--ink-14);padding:22px;display:flex;flex-direction:column}
.profile-card .p-photo{width:100%;aspect-ratio:4/3;object-fit:cover;margin-bottom:16px}
.profile-card h3{font-size:21px;line-height:1.25}
.profile-card .p-role{font-family:var(--util);font-size:14px;letter-spacing:.09em;text-transform:uppercase;color:var(--secondary-lt);margin:8px 0 12px}
.profile-card p{font-size:16px;line-height:1.6;color:var(--ink-70)}
.profile-card .p-links{margin-top:auto;padding-top:14px}
.profile-card .p-attr{font-size:13px;color:var(--ink-50);margin-top:10px}
.org-card{display:flex;flex-direction:column;gap:6px;background:var(--ground-deep);border:1px solid var(--ink-14);padding:18px;min-width:0}
.org-card .org-logo{height:34px;width:auto;max-width:100%;object-fit:contain;margin-bottom:8px}
.org-name{font-family:var(--display);font-size:19px;color:var(--ink)}
.org-host{font-family:var(--util);font-size:13px;letter-spacing:.06em;color:var(--ink-50)}
.entity-ref{white-space:nowrap}
.further-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1px;background:var(--ink-14);margin-top:22px}
.further-grid a{background:var(--ground);padding:20px;border:0;color:var(--ink);font-family:var(--display);font-size:19px;line-height:1.32;min-width:0;display:flex;align-items:flex-start;gap:10px}
.further-grid a:hover{background:var(--panel);color:var(--accent-lt)}
.related-links{list-style:none;margin:0;padding:0;display:grid;gap:1px;background:var(--ink-14)}
.related-links li{background:var(--ground)}
.related-links a{display:flex;gap:12px;align-items:flex-start;padding:18px 20px;border:0;color:var(--ink);font-family:var(--display);font-size:19.5px;line-height:1.34}
.related-links a:hover{background:var(--panel);color:var(--accent-lt)}
.related-links .icon{color:var(--secondary);margin-top:3px}

/* category / archive lists */
.cat-list{list-style:none;margin:0;padding:0}
.cat-list li{border-top:1px solid var(--ink-14)}
.cat-list a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:baseline;padding:20px 0;border:0;color:var(--ink)}
.cat-list a:hover{color:var(--accent-lt)}
.cat-list .cl-title{font-family:var(--display);font-size:clamp(20px,2vw,27px);line-height:1.24}
.cat-list .cl-brief{grid-column:1;font-family:var(--util);font-size:16px;line-height:1.58;color:var(--ink-70);max-width:62ch;margin-top:8px}
.cat-list .cl-meta{font-family:var(--util);font-size:13px;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-50);white-space:nowrap}
.arch-group{margin-bottom:clamp(40px,5vw,72px)}
@media(max-width:620px){
  .cat-list a{grid-template-columns:minmax(0,1fr)}
  .cat-list .cl-meta{grid-row:1;justify-self:start;margin-bottom:4px}
  .cat-list .cl-brief{max-width:none}
}
.arch-group>.kicker{margin-bottom:14px}

/* ---------- supporters ---------- */
.supporters{background:var(--ground-deep);padding-block:clamp(50px,6vw,92px);padding-inline:var(--pad)}
.sponsor-wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:clamp(14px,1.6vw,22px);align-items:stretch;margin-top:clamp(24px,3vw,40px)}
.sponsor{min-width:0;display:flex;flex-direction:column;gap:12px;background:var(--panel);border:1px solid var(--ink-14);padding:16px;border-bottom:0;color:var(--ink)}
.sponsor:hover{border-color:var(--accent);color:var(--ink)}
.sponsor img{width:100%;height:46px;max-height:46px;object-fit:contain;object-position:left center;background:#0b1310;padding:6px 10px}
.sponsor-name{font-family:var(--display);font-size:17px;line-height:1.25}
.sponsor-blurb{font-family:var(--util);font-size:14px;line-height:1.5;color:var(--ink-70);min-height:2lh}
.sponsor--step{margin-top:0}
.sponsor--step2{margin-top:0}
@media(max-width:560px){.sponsor-wall{grid-template-columns:minmax(0,1fr)}}

/* ---------- footer ---------- */
.site-foot{background:var(--ground-deep);border-top:1px solid var(--ink-14);padding-block:clamp(38px,4.6vw,66px);padding-inline:var(--pad);display:flex;justify-content:space-between;gap:34px;flex-wrap:wrap;align-items:flex-end}
.site-foot .f-name{font-family:var(--display);font-size:30px;color:var(--ink)}
.site-foot p{margin-top:10px;font-size:14.5px;color:var(--ink-50);max-width:48ch}
.f-links{display:flex;gap:22px;flex-wrap:wrap}
.f-links a{font-size:13px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-70);border:0}
.f-links a:hover{color:var(--accent-lt)}

/* ---------- utility ---------- */
.plate{background:var(--accent);color:var(--ground-deep);padding:clamp(26px,3vw,44px)}
.plate h2,.plate h3{color:var(--ground-deep)}
.plate p{color:rgba(15,26,21,.82)}
.plate a{color:var(--ground-deep);border-bottom-color:rgba(15,26,21,.5)}
.expander{margin-top:18px}
.expander summary{cursor:pointer;font-family:var(--util);font-size:14.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--accent-lt);list-style:none}
.expander summary::-webkit-details-marker{display:none}
.expander summary::after{content:" +"}
.expander[open] summary::after{content:" –"}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* 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}
.sponsor:not(.lead-line){flex-basis:var(--sp-tile,232px)!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-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}
: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:3;-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__pin{cursor:pointer}
.mapkit__pin text{paint-order:stroke;stroke:#0f1a15;stroke-width:3px;stroke-linejoin:round}
.mapkit__pin:hover circle{r:9.1}
.mapkit__pin:hover text{font-weight:700}
/* MAPKIT_END */

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

/* op-mark-padding: operator asked for more padding around the logos. Design's plate was 46px tall
   with a 6px/10px inset, so the artwork ran nearly edge to edge. The inset doubles and the plate
   grows with it, which keeps the artwork the size Design chose instead of shrinking it into the
   same box. */
/* ⚠️ .sponsor img carries max-height:46px, which caps the height whatever the !important says —
   the same trap as kanchi and mamasgotflair. Release the cap, then set the height. */
.sponsor-wall .sponsor.sponsor img{height:62px!important;max-height:none!important;padding:12px 20px!important;box-sizing:border-box!important}

/* op-money-columns: the supporters block ran one tile per row — 11 tiles,
   2057px at 390, 22% of the whole page. Two columns bring it to
   1410px (31% shorter). Checked before writing: no new overflow, smallest mark still
   129px wide, longest blurb 6 lines, tile heights 174-259px.
   A block that fails any of those is left in one column — two narrow columns can make a block
   TALLER once the copy rewraps, which is the case the operator warned about.
   An odd tile count means the lead tile spans the whole row, so the block does not end on an empty cell. Only the tier(s) that were one-per-row are touched (.sponsor-wall), 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-wall{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:22px!important}
    .sponsor-wall > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .sponsor-wall > * *{min-width:0!important;max-width:100%}
    .sponsor-wall img,.sponsor-wall svg{max-width:100%;height:auto}

}

/* op-blurb-rows: money blurbs ran to 4 rows at 390, 1242px of tier across
   11 tiles. Operator: blurbs should show "2-3 rows max" on mobile —
   a blurb that long eats the screen and, in a two-column grid, rewraps into more height than
   the columns save. Held to three rows at phone width; the copy stays in the markup and
   desktop is untouched. Only the tier(s) measured past three rows are clamped. */
@media (max-width:640px){
  .sponsor-wall span{display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical;max-height:63px!important;min-height:0!important;overflow:hidden!important}
}

/* op-odd-tier-lead: .sponsor-wall (11 tiles) lay out two per row with an ODD tile count, so the
   block ended on a lone tile beside an empty cell. The lead tile takes the whole row instead —
   operator: "the 1st item in such rows to be 100% width, then split" — so the grid reads as
   complete. These tiers were already two-per-row, which is why the column pass never wrote the
   rule for them. Checked before writing: no new horizontal overflow, block not more than 15%
   taller. Phone widths only; desktop keeps Design's layout. */
@media (max-width:640px){
  .sponsor-wall:has(> *:nth-child(odd):last-child) > *:first-child{grid-column:1 / -1!important}
}

/* op-img-dims — intrinsic width/height reserve image space; the proven height:auto guard (zero specificity) */
:where(article > figure.fig-inset > img,
  body > div.lead-band > img,
  body > figure.fig-bleed > img,
  div.art-body > figure.fig-side > img,
  figure.fig-mat > div.fw > img){height:auto}
/* op-img-dims:end */
.sponsor-wall > [data-partner] img{background:transparent!important}
.sponsor-wall.sponsor-wall > [data-partner][data-partner]{border-bottom:1px solid var(--ink-14)!important}