/* The Nile Companion — Upriver
   Limestone & lapis field guide. Tokens → base → chrome → homepage rooms → article system. */

:root{
  --paper:#EFE6D3;      /* limestone base */
  --canvas:#DCD3BE;     /* outer canvas */
  --inset:#F6F0E2;      /* inset panel */
  --band:#E9DFC8;       /* warm band */
  --bed:#E2D5BB;        /* image bed */
  --lapis:#1B3A6B;
  --navy:#14213A;
  --lapis-pale:#9FB4D4;
  --footer-ink:#C6CFE0;
  --dek-pale:#D8DFEC;
  --green:#4E7A5E;
  --green-mid:#5C8C6B;
  --terra:#A8482C;
  --ochre:#C08B3E;
  --ink:#1A1B18;
  --body:#2E2E28;
  --body-2:#3A3A32;
  --body-3:#4A4A40;
  --muted:#5A5648;
  --stone:#8C866F;
  --label:#6C6350;
  --nav-off:#3E4A3F;
  --rule:#C9BCA0;
  --rule-dash:#A99C80;
  --grid:#D8CBAE;

  --display:"Newsreader",Georgia,"Times New Roman",serif;
  --text:"Spectral",Georgia,serif;
  --mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;

  --gutter:34px;
  --measure:41.5rem;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--canvas);color:var(--ink);
  font:300 19.5px/1.62 var(--text);
  text-wrap:pretty;
  display:flex;flex-direction:column;align-items:center;
}
/* the page is a sheet: everything sits in one 1280px card on the limestone canvas */
body>.strip,body>.masthead,body>.sitehead,body>main,body>.chandlery,body>.foot{
  width:100%;max-width:1280px;border-inline:1px solid rgba(27,58,107,.16)}
body>main{background:var(--paper)}
@media (max-width:1300px){
  body>.strip,body>.masthead,body>.sitehead,body>main,body>.chandlery,body>.foot{border-inline:0}
}
img{display:block;max-width:100%}
a{color:var(--lapis);text-decoration:none}
a:hover{color:var(--terra)}
h1,h2,h3,h4,h5{margin:0;font-family:var(--display);font-weight:400;letter-spacing:-.01em}
p{margin:0 0 1.1em}
p:last-child{margin-bottom:0}
hr{border:0;border-top:1px solid var(--rule);margin:26px 0}
:focus-visible{outline:2px solid var(--terra);outline-offset:3px}

.wrap{width:100%;max-width:1280px;margin:0 auto;padding-inline:var(--gutter)}
.sheet{background:var(--paper)}
.eyebrow,.mono{font-family:var(--mono);text-transform:uppercase;letter-spacing:.18em}
.eyebrow{font-size:11px;font-weight:500;color:var(--terra)}
.eyebrow.green{color:var(--green)}
.rule{height:1px;background:var(--rule);border:0}
.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;z-index:99;background:var(--paper);padding:10px 14px;font-family:var(--mono);font-size:12px}

/* ───────── utility strip ───────── */
.strip{background:var(--lapis);color:var(--paper)}
.strip .wrap{display:flex;justify-content:space-between;gap:16px;padding-block:9px;
  font:400 10.5px/1.5 var(--mono);letter-spacing:.16em;text-transform:uppercase}
.strip b{font-weight:400}
.strip .strip-r{color:var(--lapis-pale)}

/* ───────── masthead ───────── */
.masthead{background:var(--paper);border-bottom:1px solid var(--lapis);text-align:center;padding:34px 0 22px}
.masthead .kicker{font:400 11px/1 var(--mono);letter-spacing:.34em;text-transform:uppercase;color:var(--green)}
.wordmark{display:inline-block;margin:14px 0 12px;font:300 66px/0.95 var(--display);letter-spacing:-.015em;color:var(--lapis)}
a.wordmark:hover{color:var(--lapis)}
.coord-row{display:flex;align-items:center;justify-content:center;gap:14px;color:var(--green)}
.coord-row span{font:400 12px/1 var(--mono);letter-spacing:.22em;text-transform:uppercase}
.coord-row i{display:block;height:1px;width:min(180px,18vw)}
.coord-row i:first-child{background:linear-gradient(90deg,rgba(78,122,94,0),var(--green))}
.coord-row i:last-child{background:linear-gradient(270deg,rgba(78,122,94,0),var(--green))}

/* ───────── nav ───────── */
.sitehead{background:var(--paper);border-bottom:2px solid var(--lapis)}
.sitehead .wrap{display:flex;align-items:center;gap:20px;padding-block:14px}
.sitehead.center .wrap{justify-content:center;padding-block:13px}
.sitehead .brand{font:300 30px/1 var(--display);color:var(--lapis);white-space:nowrap;margin-right:auto}
.nav{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:28px}
.sitehead.center .nav{gap:34px}
.nav>li{position:relative}
.nav>li>a{display:inline-block;font:500 11.5px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;
  color:var(--nav-off);padding-bottom:3px;border-bottom:2px solid transparent}
.nav>li>a:hover,.nav>li:focus-within>a{color:var(--lapis);border-bottom-color:var(--rule-dash)}
.nav>li>a[aria-current]{color:var(--lapis);border-bottom-color:var(--terra)}
.nav .browse a{color:var(--green)}
/* dropdown */
.nav-sub{position:absolute;z-index:40;left:-14px;top:100%;margin:12px 0 0;padding:14px 0 10px;list-style:none;
  min-width:302px;max-width:calc(100vw - 2 * var(--gutter));background:var(--inset);border:1px solid var(--lapis);
  box-shadow:0 18px 34px -20px rgba(20,33,58,.5);
  display:none;opacity:0;transform:translateY(-4px);transition:opacity .14s ease,transform .14s ease}
.nav>li.has-sub>a::after{content:"";position:absolute;left:0;right:-14px;top:100%;height:14px}  /* hover bridge */
.nav>li.has-sub:hover .nav-sub,.nav>li.has-sub:focus-within .nav-sub{display:block;opacity:1;transform:none}
.nav>li:nth-last-child(2) .nav-sub,.nav>li:nth-last-child(3) .nav-sub,.nav>li:nth-last-child(4) .nav-sub{left:auto;right:-14px}
.nav-sub::before{content:attr(data-cat);display:block;margin:0 18px 9px;padding-bottom:9px;border-bottom:1px solid var(--rule);
  font:500 9.5px/1 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--terra)}
.nav-sub li{margin:0}
.nav-sub a{display:block;padding:7px 18px;font:300 17px/1.3 var(--text);color:var(--lapis)}
.nav-sub a:hover{background:var(--band);color:var(--terra)}
.nav-sub .all a{margin-top:6px;font:500 10px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--green)}
.nav-toggle,.nav-toggle-label{display:none}

/* ───────── hero / lead ───────── */
.lead-grid{display:grid;grid-template-columns:minmax(0,1fr) 400px;background:var(--paper);border-bottom:1px solid var(--rule)}
.lead-grid>.lead-text{padding:34px var(--gutter) 30px;border-right:1px solid var(--rule);min-width:0}
.lead-grid>.lead-art{position:relative;background:var(--bed);min-height:420px}
.lead-art img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.plate-scrim{position:absolute;inset:auto 0 0 0;padding:44px 18px 12px;
  background:linear-gradient(0deg,rgba(20,33,58,.86),rgba(20,33,58,0));pointer-events:none}
.plate-scrim span{font:400 11px/1.5 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--paper)}
h1.lead-title{margin:14px 0 16px;font:400 52px/1.04 var(--display);letter-spacing:-.02em;color:var(--navy);text-wrap:balance}
.dek{margin:0 0 20px;font:300 21px/1.55 var(--text);color:var(--body-2);max-width:60ch}
.meta{font:500 12px/1.6 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--stone)}
.meta a{color:var(--green)}
.trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:18px}
.trio h4{font:500 10px/1.4 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--green);margin-bottom:7px}
.trio p{margin:0;font:300 16px/1.5 var(--text);color:var(--body-3)}

/* ───────── section heading rows ───────── */
.room{background:var(--paper);padding:28px 0}
.room.band{background:var(--band);border-block:1px solid var(--rule)}
.room-head{display:flex;align-items:baseline;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.room-head h2,.room-head h3{font-size:30px;line-height:1.05;color:var(--navy)}
.room-head .rule{flex:1;min-width:40px}
.room-head .more{font:500 10.5px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase}
.room-note{font:300 15.5px/1.55 var(--text);color:var(--muted);max-width:48ch}

/* ───────── the map ───────── */
.mapfig{margin:0;border:1px solid var(--lapis);background:var(--inset);padding:12px}
.mapfig .map-slot{position:relative;background:var(--paper);touch-action:pan-y}
.mapfig .map-slot.is-grab svg{cursor:grab}
.mapfig .map-slot.is-drag svg{cursor:grabbing}
.map-tools{position:absolute;right:10px;top:10px;display:flex;flex-direction:column;gap:6px;z-index:2}
.map-tools button{width:34px;height:34px;display:flex;align-items:center;justify-content:center;
  background:var(--inset);border:1px solid var(--lapis);color:var(--lapis);cursor:pointer;
  font:500 15px/1 var(--mono);padding:0}
.map-tools button:hover{background:var(--lapis);color:var(--paper)}
.map-tools button[disabled]{opacity:.35;cursor:default}
.map-tools button[disabled]:hover{background:var(--inset);color:var(--lapis)}
.map-tools .t-reset{font-size:9px;letter-spacing:.08em;text-transform:uppercase;height:26px}
.map-hint{position:absolute;left:10px;bottom:10px;z-index:2;pointer-events:none;
  background:rgba(246,240,226,.86);padding:5px 9px;
  font:400 10px/1.4 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.map-scale{position:absolute;right:10px;bottom:10px;z-index:2;pointer-events:none;
  font:500 10px/1.4 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--stone)}
.mapfig svg{max-height:760px}
.mapfig svg{width:100%;height:auto;display:block}
.map-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:26px;align-items:start}
.map-pin{cursor:pointer}
.map-pin circle{transition:none}
.map-pin text{font:500 11px/1 var(--mono);letter-spacing:.04em;fill:var(--lapis);paint-order:stroke;
  stroke:var(--paper);stroke-width:4px;stroke-linejoin:round}
.map-pin.is-on text{fill:var(--terra)}
.map-axis{display:flex;justify-content:space-between;gap:12px;margin-top:10px;
  font:400 10.5px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--lapis)}
.map-axis span:nth-child(2){color:var(--stone)}
.readout{border:1px solid var(--rule);background:var(--inset)}
.readout .r-head{padding:14px 16px;border-bottom:1px solid var(--rule)}
.readout h3{font:400 28px/1.1 var(--display);color:var(--lapis)}
.readout .r-coord{display:block;margin-top:7px;font:400 11px/1.4 var(--mono);letter-spacing:.1em;color:var(--stone)}
.readout .r-body{padding:14px 16px}
.readout dt{font:500 10px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--green);margin-bottom:7px}
.readout dd{margin:0 0 14px;font:300 16.5px/1.5 var(--text);color:var(--body-2)}
.readout dd:last-child{margin-bottom:0}
.readout .r-go{display:inline-block;margin-top:4px;font:500 10.5px/1 var(--mono);letter-spacing:.14em;
  text-transform:uppercase;border-bottom:1px solid var(--ochre);padding-bottom:3px}
.walk{margin:22px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0;border-top:1px solid var(--lapis)}
.walk li{border-bottom:1px solid var(--rule);border-right:1px solid var(--rule);padding:12px 14px;min-width:0}
.walk li:nth-child(4n){border-right:0}
.walk .w-no{font:500 9.5px/1 var(--mono);letter-spacing:.14em;color:var(--ochre)}
.walk .w-name{display:block;margin:6px 0 4px;font:400 19px/1.2 var(--display);color:var(--lapis)}
.walk .w-co{font:400 10px/1.4 var(--mono);letter-spacing:.06em;color:var(--stone)}

/* ───────── dynasty timeline ───────── */
.dyn{border:1px solid var(--lapis);background:var(--inset)}
.dyn-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;
  padding:16px 20px;background:var(--lapis);color:var(--paper)}
.dyn-head h3{font:400 24px/1.1 var(--display);color:var(--paper)}
.dyn-head span{font:500 10.5px/1.4 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--lapis-pale)}
.dyn-axis{display:grid;grid-template-columns:200px minmax(220px,1fr);gap:0 20px;padding:14px 20px 0}
.a-scale{position:relative;height:16px;border-bottom:1px solid var(--rule)}
.a-tick{position:absolute;top:0;transform:translateX(-50%);white-space:nowrap;
  font:500 9.5px/1 var(--mono);letter-spacing:.08em;color:var(--stone)}
.a-tick::after{content:"";position:absolute;left:50%;bottom:-5px;width:1px;height:5px;background:var(--rule)}
.dyn-rows{list-style:none;margin:0;padding:0}
.dyn-row{display:grid;grid-template-columns:200px minmax(220px,1fr) minmax(0,1.15fr);gap:14px 20px;
  align-items:start;padding:16px 20px;border-top:1px solid var(--rule);cursor:default}
.dyn-row:first-child{border-top:0}
.dyn-row.is-on{background:var(--band)}
.e-label b{display:block;font:400 24px/1.1 var(--display);font-weight:400;color:var(--lapis)}
.e-label em{display:block;margin-top:6px;font:500 10.5px/1.4 var(--mono);font-style:normal;
  letter-spacing:.1em;text-transform:uppercase;color:var(--stone)}
.e-track{position:relative;height:26px;margin-top:6px;background:
  repeating-linear-gradient(90deg,rgba(27,58,107,.07) 0 1px,transparent 1px 40px);
  border-top:1px solid var(--grid);border-bottom:1px solid var(--grid)}
.e-bar{position:absolute;top:5px;bottom:5px;min-width:3px;background:var(--lapis);opacity:.85}
.dyn-row.is-on .e-bar{background:var(--ochre);opacity:1}
.dyn-row.is-on .e-label b{color:var(--terra)}
.e-note{margin:0 0 10px;font:300 17px/1.5 var(--text);color:var(--body-2)}
.e-sites{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.e-sites a{display:block;padding:7px 11px;border:1px solid var(--rule);background:var(--inset);
  font:400 15.5px/1.25 var(--text);color:var(--lapis)}
.e-sites a:hover{border-color:var(--lapis);color:var(--terra)}
.e-none{margin:0;font:400 12px/1.5 var(--mono);letter-spacing:.04em;color:var(--stone)}
.dyn-foot{margin:0;padding:16px 20px 20px;border-top:1px solid var(--rule);
  font:300 15.5px/1.55 var(--text);color:var(--muted)}
.dyn-band{display:flex;list-style:none;margin:0;padding:0;border-bottom:1px solid var(--lapis);touch-action:none}
.dyn-band li{flex:1 1 0;min-width:0;border-right:1px solid var(--rule)}
.dyn-band li:last-child{border-right:0}
.dyn-band button{width:100%;height:58px;padding:6px 5px;background:var(--band);border:0;cursor:pointer;
  font:500 10px/1.25 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--label);
  overflow-wrap:anywhere;display:flex;align-items:center;justify-content:center;transition:background .12s ease}
.dyn-band button:hover{background:#E2D5BB}
.dyn-band li[aria-selected=true] button{background:var(--ochre);color:var(--navy)}
.dyn-scale{display:flex;justify-content:space-between;padding:8px 20px 0;
  font:500 10px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--stone)}
.dyn-panels{padding:6px 20px 22px}
.dyn-panel{padding-top:16px}
.dyn-panel h4{font:400 30px/1.1 var(--display);color:var(--navy);margin-bottom:10px}
.dyn-panel .d-note{font:300 19px/1.55 var(--text);color:var(--body-2);max-width:56ch;margin-bottom:14px}
.dyn-sites{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:10px}
.dyn-sites a{display:block;padding:9px 13px;border:1px solid var(--rule);background:var(--band);
  font:400 16px/1.2 var(--text);color:var(--lapis)}
.dyn-sites a:hover{border-color:var(--lapis);color:var(--terra)}
.dyn-none{font:400 12px/1.5 var(--mono);letter-spacing:.06em;color:var(--stone)}
.js .dyn-panel[hidden]{display:none}

/* ───────── temple plan diagram ───────── */
.plan{border:1px solid var(--lapis);background:var(--inset)}
.plan-head{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:13px 16px;border-bottom:1px solid var(--lapis);
  font:500 10.5px/1.4 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--lapis)}
.plan-head em{font-style:normal;color:var(--stone);letter-spacing:.1em}
.plan-row{display:flex;align-items:flex-end;height:160px;padding:22px 18px 0}
.plan-row button{flex:var(--w,1);height:var(--h,60px);background:var(--canvas);border:1px solid var(--rule-dash);
  border-right:0;cursor:pointer;display:flex;align-items:flex-end;justify-content:center;padding:0 4px 7px;
  font:500 9.5px/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--label)}
.plan-row button:last-child{border-right:1px solid var(--rule-dash)}
.plan-row button[aria-selected=true]{background:var(--lapis);border-color:var(--lapis);color:var(--paper)}
.plan-grad{display:flex;justify-content:space-between;padding:12px 18px 0;
  font:400 9.5px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--stone)}
.plan-read{margin:14px 18px 18px;padding-top:14px;border-top:1px solid var(--rule);display:flex;gap:16px;align-items:baseline}
.plan-read b{flex:0 0 150px;font:400 20px/1.2 var(--display);font-weight:400;color:var(--lapis)}
.plan-read p{margin:0;font:300 17px/1.5 var(--text);color:var(--body-2)}

/* ───────── cards ───────── */
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.cards.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.cards.five{grid-template-columns:repeat(5,minmax(0,1fr))}
.card{display:flex;flex-direction:column;min-width:0;background:var(--inset);border:1px solid var(--rule)}
.card .c-art{aspect-ratio:4/3;background:var(--bed);overflow:hidden}
.card .c-art img{width:100%;height:100%;object-fit:cover}
.card .c-body{display:flex;flex-direction:column;flex:1;gap:10px;padding:17px 17px 18px}
.card .c-kick{font:500 10px/1.3 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--terra)}
.card h3{font:400 24px/1.16 var(--display);color:var(--lapis);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.32em}
.card p{margin:0;flex:1;font:300 16px/1.5 var(--text);color:var(--body-3)}
.card .c-meta{font:500 10.5px/1.4 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--stone)}
.card:hover h3{color:var(--terra)}
.sec-card{display:flex;flex-direction:column;min-width:0;background:var(--inset);border:1px solid var(--rule);
  border-top:3px solid var(--accent,var(--lapis));padding:18px 17px 19px;gap:9px}
.sec-card .s-no{font:500 10px/1 var(--mono);letter-spacing:.16em;color:var(--stone)}
.sec-card h3{font:400 26px/1.12 var(--display);color:var(--lapis)}
.sec-card p{margin:0;flex:1;font:300 16px/1.5 var(--text);color:var(--body-3)}
.sec-card .s-count{font:500 10.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--green)}

/* CSS-only expander */
.more-toggle{position:absolute;opacity:0;pointer-events:none}
.more-wrap{display:none;margin-top:24px}
.more-toggle:checked~.more-wrap{display:block}
.more-label{display:inline-flex;align-items:center;gap:10px;margin-top:22px;cursor:pointer;
  font:500 10.5px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--lapis);
  border-bottom:1px solid var(--ochre);padding-bottom:4px}
.more-toggle:checked~.more-label{display:none}
.more-label:hover{color:var(--terra)}

/* ───────── season band ───────── */
.season{border:1px solid var(--lapis);background:var(--inset)}
.season-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;
  padding:14px 20px;background:var(--lapis);color:var(--paper)}
.season-head h3{font:400 23px/1.15 var(--display);color:var(--paper)}
.season-head span{font:500 10.5px/1.4 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--lapis-pale)}
.season-body{padding:18px 20px 22px}
.season-grid{display:grid;grid-template-columns:150px minmax(0,1fr);gap:12px 16px;align-items:center}
.season-months{display:grid;grid-template-columns:repeat(12,1fr);text-align:center;
  font:400 10px/1 var(--mono);letter-spacing:.06em;color:var(--stone)}
.season-label{font:400 14px/1.25 var(--text);color:var(--body-2)}
.season-label em{display:block;margin-top:3px;font:400 9.5px/1.35 var(--mono);font-style:normal;
  letter-spacing:.04em;text-transform:uppercase;color:var(--stone)}
.season-track{display:grid;grid-template-columns:repeat(12,1fr);background:var(--band);border:1px solid var(--grid)}
.season-track i{height:20px;border-right:1px solid var(--paper)}
.season-track i:last-child{border-right:0}
.season-foot{display:flex;gap:24px;flex-wrap:wrap;margin-top:18px;padding-top:14px;border-top:1px solid var(--rule)}
.season-foot p{flex:1 1 260px;margin:0;font:300 15.5px/1.55 var(--text);color:var(--muted)}
.season-foot b{font-weight:500;color:var(--lapis)}

/* ───────── sponsors: the chandlery ───────── */
.chandlery{background:var(--band);border-top:1px solid var(--rule)}
.chandlery .wrap{padding-block:26px 30px}
.chandlery .ch-head{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.chandlery h2{font:400 26px/1.1 var(--display);color:var(--navy)}
.chandlery .ch-kick{font:500 10px/1.4 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--terra)}
.sponsor-strip{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0;background:var(--navy);
  border:1px solid var(--rule-dash)}
.sponsor{display:flex;flex-direction:column;justify-content:center;gap:6px;min-width:0;
  background:var(--navy);padding:16px 14px;min-height:74px;
  box-shadow:inset 0 0 0 1px rgba(239,230,211,.13)}
.sponsor img{width:100%;height:28px;object-fit:contain;object-position:center;opacity:.92}
.sponsor .sponsor-blurb{font:400 10.5px/1.4 var(--mono);letter-spacing:.04em;color:var(--lapis-pale);
  overflow-wrap:anywhere}
.sponsor .sponsor-blurb:empty{display:none}
.sponsor:hover{background:#1B2E4E}

/* ───────── footer ───────── */
.foot{background:var(--navy);color:var(--footer-ink)}
.foot .wrap{padding-block:28px 30px;display:flex;justify-content:space-between;gap:26px;flex-wrap:wrap;align-items:flex-end}
.foot .f-mark{font:300 26px/1 var(--display);color:var(--paper)}
.foot .f-line{margin:9px 0 0;font:300 15px/1.5 var(--text)}
.foot nav{display:flex;flex-wrap:wrap;gap:22px}
.foot a{font:500 10.5px/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--lapis-pale)}
.foot a:hover{color:var(--paper)}
.foot .f-small{width:100%;padding-top:18px;border-top:1px solid rgba(239,230,211,.18);
  font:400 10.5px/1.6 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#8FA0BC}

/* ───────── article ───────── */
.post-hero{position:relative;background:var(--bed);border-bottom:1px solid var(--lapis)}
.post-hero>img{width:100%;height:clamp(320px,42vw,460px);object-fit:cover}
.post-hero .ph-scrim{position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(20,33,58,.9) 0%,rgba(20,33,58,.62) 46%,rgba(20,33,58,.06) 76%)}
.post-hero .ph-text{position:absolute;inset:0;display:flex;align-items:center}
.post-hero .ph-text>div{max-width:680px;padding-inline:var(--gutter)}
.post-hero .ph-kick{font:500 10.5px/1.4 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--ochre)}
.post-hero h1{margin:14px 0 14px;font:300 clamp(34px,3.6vw,56px)/1.03 var(--display);letter-spacing:-.02em;
  color:var(--paper);text-wrap:balance}
.post-hero .ph-dek{margin:0 0 14px;font:300 20px/1.5 var(--text);color:var(--dek-pale);max-width:52ch}
.post-hero .ph-meta{font:500 11.5px/1.5 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--lapis-pale)}
.post-plate{padding:9px var(--gutter) 0;background:var(--paper)}
.post-plate span{font:400 10.5px/1.5 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--stone)}

.post-grid{display:grid;grid-template-columns:230px minmax(0,1fr);gap:0;background:var(--paper)}
.post-rail{border-right:1px solid var(--rule);padding:34px 22px 34px var(--gutter)}
.post-rail .r-title{font:500 10px/1.4 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--stone);margin-bottom:13px}
.post-rail ol,.post-rail ul{margin:0 0 20px;padding:0;list-style:none;display:flex;flex-direction:column;gap:9px}
.post-rail a{font:300 16px/1.35 var(--text)}
.post-rail .r-fact{font:400 11.5px/1.7 var(--mono);letter-spacing:.06em;color:var(--stone)}
.post-rail .r-fact b{display:block;font-weight:500;color:var(--lapis);letter-spacing:.1em;text-transform:uppercase;font-size:10px;margin-bottom:5px}
.post-body{padding:30px 40px 38px;min-width:0}
.post-body>*{max-width:var(--measure)}
.post-body>.breakout{max-width:none}
/* photographs may run to the edge of the column; their captions keep the reading gutter */
.post-body>.bleed{max-width:none;margin-inline:-40px}
.post-body>.bleed>figcaption,.post-body>.bleed>.plate-cap{padding-inline:40px}
.plate-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;margin:0 0 24px}
.plate-pair figure{margin:0;display:flex;flex-direction:column;min-width:0}
.plate-pair img{width:100%;aspect-ratio:5/4;object-fit:cover;background:var(--bed)}
.plate-pair figcaption{margin-top:9px;flex:1;display:flex;flex-direction:column;
  font:400 12.5px/1.5 var(--mono);letter-spacing:.03em;color:var(--stone)}
.plate-pair figcaption a{margin-top:auto;padding-top:6px;font:500 11px/1.4 var(--mono);
  letter-spacing:.1em;text-transform:uppercase}
.bleed img{width:100%;display:block}
.bleed.tall img{aspect-ratio:21/9;object-fit:cover}
.post-body p{font:300 19.5px/1.62 var(--text);color:var(--body);margin:0 0 18px}
.post-body .lead{font:300 23px/1.5 var(--text);color:var(--body-2);margin-bottom:22px}
.post-body h2{margin:30px 0 12px;font:400 34px/1.1 var(--display);color:var(--navy);display:flex;gap:16px;align-items:baseline}
.post-body h2 .sec-no{flex:none;font:400 14px/1.6 var(--mono);letter-spacing:.14em;color:var(--terra)}
.post-body h3{margin:28px 0 12px;font:400 27px/1.15 var(--display);color:var(--navy)}
.post-body>p:first-of-type::first-letter,.post-body .dropcap::first-letter{
  float:left;font:400 76px/0.72 var(--display);color:var(--lapis);padding:8px 12px 0 0}
.post-body em{font-style:italic}
.post-body ul,.post-body ol{margin:0 0 22px;padding-left:1.3em;font:300 19px/1.6 var(--text);color:var(--body)}
.post-body li{margin-bottom:.5em}
.post-body>hr{max-width:var(--measure);margin:30px 0;border-top:1px solid var(--rule)}
.note-ref{font:500 11px/1 var(--mono);vertical-align:super;color:var(--terra);text-decoration:none;
  padding:0 1px 0 2px;letter-spacing:.04em}
.note-ref:hover{color:var(--lapis)}

/* palette components */
.lead{font:300 23px/1.5 var(--text);color:var(--body-2)}
.pullquote{margin:0 0 26px;padding:4px 0 4px 24px;border-left:3px solid var(--terra)}
.pullquote p{margin:0;font:300 italic 26px/1.35 var(--display);color:var(--lapis)}
.blockquote{margin:0 0 26px;padding:18px 22px;background:var(--band);border:1px solid var(--rule)}
.blockquote p{margin:0 0 10px;font:300 italic 20px/1.5 var(--text);color:var(--body-2)}
.blockquote cite{font:500 11px/1.5 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--stone);font-style:normal}
.callout{margin:0 0 26px;background:var(--inset);border:1px solid var(--green);border-left:5px solid var(--green);padding:18px 20px}
.callout p{margin:0;font:400 18.5px/1.55 var(--text);color:var(--body-2)}
.callout .c-tag{display:block;margin-bottom:8px;font:500 10px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--green)}
p.note{margin:0 0 26px;padding:14px 16px;background:var(--band);border:1px dashed var(--rule-dash);
  font:300 17px/1.55 var(--text);color:var(--muted)}
p.note b{font-weight:500;color:var(--lapis)}

.table-scroll{overflow-x:auto;margin:0 0 26px;-webkit-overflow-scrolling:touch}
.table-scroll>table{margin:0}
.versus,.datatable{width:100%;border-collapse:collapse;margin:0 0 26px;background:var(--inset);
  font:300 16.5px/1.5 var(--text);color:var(--body-2)}
.versus caption,.datatable caption{caption-side:top;text-align:left;padding:0 0 10px;
  font:500 10px/1.4 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--terra)}
.versus th,.versus td,.datatable th,.datatable td{border:1px solid var(--rule);padding:11px 13px;text-align:left;vertical-align:top}
.versus thead th,.datatable thead th{background:var(--lapis);color:var(--paper);
  font:500 10.5px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase}
.versus tbody th,.datatable tbody th{background:var(--band);font-weight:500;font-family:var(--text);color:var(--lapis);white-space:normal}
.datatable tbody tr:nth-child(even) td{background:#F1EADA}

.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--rule);
  border:1px solid var(--rule);margin:0 0 26px}
.statblock{background:var(--inset);padding:16px 16px 17px;display:flex;flex-direction:column;gap:7px;min-width:0}
.stat-num{font:400 34px/1 var(--display);color:var(--lapis);overflow-wrap:anywhere}
.stat-label{font:400 13px/1.45 var(--mono);letter-spacing:.03em;color:var(--muted)}

.timeline{list-style:none;margin:0 0 26px;padding:0;border-top:1px solid var(--lapis)}
.timeline li{display:grid;grid-template-columns:230px minmax(0,1fr);gap:8px 20px;padding:13px 0;
  border-bottom:1px solid var(--rule)}
.t-when{font:500 11.5px/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--terra)}
.t-what{font:300 17px/1.5 var(--text);color:var(--body-2)}

.chart{margin:0 0 26px;background:var(--inset);border:1px solid var(--rule);padding:16px 18px 14px}
.chart svg{width:100%;height:auto;display:block;overflow:visible}
.chart .bar-rect{fill:var(--lapis)}
.chart .bar-rect.alt{fill:var(--green)}
.chart .c-label{font:500 11px/1 var(--mono);fill:var(--muted);letter-spacing:.02em}
.chart .c-val{font:500 11px/1 var(--mono);fill:var(--terra);letter-spacing:.04em}
.chart .c-axis{stroke:var(--rule)}
.chart figcaption{margin-top:12px;font:400 12.5px/1.5 var(--mono);letter-spacing:.03em;color:var(--stone)}

.chart.line .line-path{fill:none;stroke:var(--lapis);stroke-width:2.5;vector-effect:non-scaling-stroke}
.chart.line .line-fill{fill:rgba(27,58,107,.09)}
.chart.line .dot{fill:var(--terra)}
.chart.line .grid-line{stroke:var(--rule)}
.chart.donut svg{max-width:260px;margin-inline:auto}
.chart.donut .d-track{fill:none;stroke:var(--grid);stroke-width:18}
.chart.donut .d-arc{fill:none;stroke:var(--green);stroke-width:18;stroke-linecap:butt}
.chart.donut .d-arc.two{stroke:var(--lapis)}
.chart.donut .d-num{font:400 34px/1 var(--display);fill:var(--lapis)}
.chart.donut .d-sub{font:500 10px/1 var(--mono);letter-spacing:.14em;fill:var(--stone)}
.chart .legend{display:flex;flex-wrap:wrap;gap:14px;margin-top:12px;
  font:500 11px/1.4 var(--mono);letter-spacing:.06em;color:var(--muted)}
.chart .legend i{display:inline-block;width:11px;height:11px;margin-right:6px;vertical-align:-1px}
.org-card.no-logo .org-logo{display:none}
.article-figure{margin:0 0 22px}
.article-figure img{width:100%;background:var(--bed)}
.article-figure figcaption,.gallery figcaption{margin-top:9px;font:400 12.5px/1.5 var(--mono);letter-spacing:.03em;color:var(--stone)}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px;margin:0 0 28px}
.gallery figure{margin:0}
.map-figure{margin:0 0 28px;border:1px solid var(--lapis);background:var(--inset);padding:12px}
.map-figure .map-slot{background:var(--paper);min-height:120px}
.map-figure svg{max-height:520px;margin-inline:auto}
.map-figure figcaption{margin-top:11px;font:400 12.5px/1.5 var(--mono);letter-spacing:.03em;color:var(--stone)}

.profile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;margin:0 0 28px}
.profile-card{background:var(--inset);border:1px solid var(--rule);border-top:3px solid var(--ochre);padding:16px;min-width:0}
.profile-card h3{font:400 21px/1.2 var(--display);color:var(--lapis);margin-bottom:6px}
.profile-card .p-role{margin:0 0 8px;font:500 10.5px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--green)}
.profile-card p{margin:0;font:300 16px/1.5 var(--text);color:var(--body-3)}
.profile-card .p-photo{width:100%;aspect-ratio:4/3;object-fit:cover;margin-bottom:12px;background:var(--bed)}
.profile-card .p-links{margin-top:10px;font:500 10.5px/1.5 var(--mono);letter-spacing:.1em;text-transform:uppercase}
.profile-card .p-attr{margin-top:8px;font:400 11px/1.5 var(--mono);color:var(--stone)}
.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin:0 0 28px}
.org-card{display:flex;flex-direction:column;gap:6px;padding:14px 15px;background:var(--inset);border:1px solid var(--rule);min-width:0}
.org-card .org-logo{height:26px;width:auto;object-fit:contain;margin-bottom:4px}
.org-card .org-name{font:400 19px/1.2 var(--display);color:var(--lapis)}
.org-card .org-host{font:400 11px/1.4 var(--mono);letter-spacing:.06em;color:var(--stone);overflow-wrap:anywhere}
.entity-ref{border-bottom:1px solid var(--ochre)}
.further-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin:0 0 10px}
.further-grid a{display:block;padding:15px 16px;background:var(--inset);border:1px solid var(--rule);
  font:400 20px/1.22 var(--display);color:var(--lapis)}
.further-grid a:hover{border-color:var(--lapis);color:var(--terra)}

.endnotes{margin:8px 0 0;padding:22px 0 0;border-top:1px solid var(--lapis);list-style:none;counter-reset:en}
.endnotes li{display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;margin-bottom:14px}
.endnotes .en-no{font:500 12px/1.6 var(--mono);color:var(--terra)}
.endnotes p{margin:0;font:300 17.5px/1.55 var(--text);color:var(--body-2)}
.endnotes a{border-bottom:1px solid var(--rule-dash)}
.vocab-band{background:var(--band);border-block:1px solid var(--rule);padding-block:28px 30px;margin-top:16px}
.related{padding-block:8px 36px}
.related h2{margin-bottom:16px;font-size:28px}
.related-links{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}
.related-links li{min-width:0}
.related-links a{display:block;padding:15px 16px;background:var(--inset);border:1px solid var(--rule);
  font:400 20px/1.22 var(--display)}
.related-links a:hover{border-color:var(--lapis);color:var(--terra)}
.related-links em{display:block;margin-top:6px;font:500 10px/1.4 var(--mono);font-style:normal;
  letter-spacing:.14em;text-transform:uppercase;color:var(--stone)}

/* ───────── category / index pages ───────── */
.cat-hero{background:var(--paper);border-bottom:1px solid var(--lapis);padding:36px 0 30px}
.cat-hero h1{font:300 clamp(38px,4.4vw,58px)/1 var(--display);letter-spacing:-.02em;color:var(--navy)}
.cat-hero .c-blurb{margin:14px 0 0;font:300 21px/1.55 var(--text);color:var(--body-3);max-width:62ch}
.cat-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:34px;align-items:start;padding-block:32px 40px}
.cat-list{list-style:none;margin:0;padding:0;border-top:2px solid var(--lapis)}
.cat-list li{display:grid;grid-template-columns:66px minmax(0,1fr) 176px;gap:20px;padding:20px 0;
  border-bottom:1px solid var(--rule);align-items:start}
.cat-list .l-no{font:400 26px/1 var(--display);color:var(--terra)}
.cat-list h2{font:400 27px/1.14 var(--display);color:var(--lapis);margin-bottom:8px}
.cat-list p{margin:0 0 10px;font:300 17px/1.55 var(--text);color:var(--body-3);max-width:56ch}
.cat-list .l-chain{font:400 12px/1.5 var(--mono);letter-spacing:.03em;color:var(--green)}
.cat-list .l-right{text-align:right}
.cat-list .l-span{font:400 11px/1.5 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--stone)}
.cat-list .l-open{display:inline-block;margin-top:12px;font:500 10.5px/1 var(--mono);letter-spacing:.14em;
  text-transform:uppercase;border-bottom:1px solid var(--ochre);padding-bottom:3px}
.aside-col{display:flex;flex-direction:column;gap:26px;background:var(--band);border:1px solid var(--rule);padding:22px 20px}
.aside-col h2,.aside-col h3{font:400 22px/1.15 var(--display);color:var(--lapis);margin-bottom:10px}
.aside-col p{font:300 16px/1.55 var(--text);color:var(--body-3)}
.aside-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px}
.aside-col ul a{font:400 18px/1.25 var(--display)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 26px;padding:0;list-style:none}
.chips a,.chips button{display:inline-block;padding:9px 13px;border:1px solid var(--rule);background:transparent;
  font:500 10.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);cursor:pointer}
.chips a:hover,.chips button:hover{border-color:var(--lapis);color:var(--lapis)}
.chips [aria-current],.chips [aria-selected=true]{background:var(--lapis);border-color:var(--lapis);color:var(--paper)}

.prose-page{background:var(--paper);padding-block:36px 46px}
.prose-page .prose{max-width:70ch;padding-inline:0}
.prose-page h1{font:300 clamp(36px,4vw,54px)/1.02 var(--display);letter-spacing:-.02em;color:var(--navy);margin-bottom:16px}
.prose-page h2{margin:32px 0 12px;font:400 30px/1.12 var(--display);color:var(--navy)}
.prose-page p{font:300 19.5px/1.62 var(--text);color:var(--body)}
.prose-page ul{font:300 19px/1.6 var(--text);color:var(--body);padding-left:1.2em}
.prose-page dl{margin:0}
.prose-page dt{font:500 10.5px/1.4 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--green);margin-top:20px}
.prose-page dd{margin:6px 0 0;font:300 19px/1.6 var(--text);color:var(--body)}

/* styleguide */
.sg-item{padding-block:30px;border-bottom:1px solid var(--rule)}
.sg-item>h2{font:400 28px/1.1 var(--display);color:var(--navy);margin-bottom:6px}
.sg-item>.sg-cls{display:block;margin-bottom:18px;font:500 11px/1.5 var(--mono);letter-spacing:.1em;color:var(--terra)}
.sg-demo{max-width:var(--measure)}
.sg-demo.wide{max-width:none}
.sg-toc{columns:2;column-gap:34px;list-style:none;margin:0;padding:0}
.sg-toc li{margin-bottom:9px}
.sg-toc a{font:400 17px/1.35 var(--text)}

/* ───────── responsive ───────── */
@media (max-width:1080px){
  .dyn-axis{grid-template-columns:150px minmax(160px,1fr)}
  .dyn-row{grid-template-columns:150px minmax(160px,1fr);gap:12px 18px}
  .dyn-row .e-body{grid-column:1 / -1}
  .lead-grid{grid-template-columns:1fr}
  .lead-grid>.lead-text{border-right:0;border-bottom:1px solid var(--rule)}
  .lead-grid>.lead-art{min-height:0;aspect-ratio:16/9}
  .lead-art img{position:static;height:100%}
  .map-layout{grid-template-columns:1fr}
  .cards,.cards.three,.cards.five{grid-template-columns:repeat(2,minmax(0,1fr))}
  .walk{grid-template-columns:repeat(2,minmax(0,1fr))}
  .walk li:nth-child(4n){border-right:1px solid var(--rule)}
  .walk li:nth-child(2n){border-right:0}
  .post-grid{grid-template-columns:1fr}
  .post-rail{border-right:0;border-bottom:1px solid var(--rule);padding:26px var(--gutter)}
  .post-body{padding-inline:var(--gutter)}
  .post-body>.bleed{margin-inline:calc(-1 * var(--gutter))}
  .post-body>.bleed>figcaption{padding-inline:var(--gutter)}
  .cat-grid{grid-template-columns:1fr}
  .sponsor-strip{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width:820px){
  :root{--gutter:22px}
  .wordmark{font-size:clamp(38px,10vw,58px)}
  h1.lead-title{font-size:clamp(32px,7vw,44px)}
  .trio{grid-template-columns:1fr;gap:16px}
  .season-grid{grid-template-columns:1fr;gap:6px 0}
  .season-label{margin-top:12px}
  .cat-list li{grid-template-columns:44px minmax(0,1fr)}
  .cat-list .l-right{grid-column:2;text-align:left}
  .timeline li{grid-template-columns:1fr;gap:5px}
  .post-hero>img{height:auto;aspect-ratio:4/3}
  .post-hero .ph-scrim,.post-hero .ph-text{position:static}
  .post-hero .ph-scrim{display:none}
  .post-hero .ph-text{background:var(--navy);padding-block:24px 26px}
  .post-hero .ph-text>div{max-width:none}
  .plan-row{height:auto;flex-direction:column;align-items:stretch;padding:18px 16px 0}
  .plan-row button{height:52px!important;flex:none;border-right:1px solid var(--rule-dash);border-bottom:0;
    align-items:center;padding-bottom:0}
  .plan-row button:last-child{border-bottom:1px solid var(--rule-dash)}
  .plan-read{flex-direction:column;gap:8px}
  .plan-read b{flex:none}
  .endnotes li{grid-template-columns:26px minmax(0,1fr);gap:8px}
  .post-body h2{font-size:29px;display:block}
  .post-body h2 .sec-no{display:block;margin-bottom:6px}
  .post-body>p:first-of-type::first-letter,.post-body .dropcap::first-letter{font-size:60px}
  .sg-toc{columns:1}
}
@media (max-width:640px){
  .cards,.cards.three,.cards.five,.walk{grid-template-columns:1fr}
  /* maps: labels are unreadable at phone width — the static station list carries the names */
  .map-pin text{display:none}
  .mapfig .map-slot,.map-figure .map-slot{min-height:0}
  .table-scroll>table{min-width:520px}
  .chips a,.chips button{min-height:44px;padding:10px 14px}
  .more-label{min-height:44px}
  .post-grid{display:flex;flex-direction:column}
  .post-body{order:1}
  .post-rail{order:2;border-bottom:0;border-top:1px solid var(--rule)}
  .walk li{border-right:0!important}
  .sponsor-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dyn-band{flex-wrap:wrap}
  .dyn-axis{display:none}
  .dyn-row{grid-template-columns:1fr;gap:10px;padding:16px}
  .e-track{margin-top:0}
  .dyn-band li{flex:1 1 33%;border-bottom:1px solid var(--rule)}
  .dyn-band button{height:52px}
  .statrow{grid-template-columns:1fr}
  /* mobile nav: tap to open */
  .sitehead .wrap{flex-wrap:wrap}
  .nav-toggle-label{display:inline-flex;align-items:center;gap:9px;cursor:pointer;margin-left:auto;
    font:500 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--lapis);
    border:1px solid var(--lapis);padding:9px 12px}
  .nav{display:none;width:100%;flex-direction:column;gap:0;border-top:1px solid var(--rule);margin-top:14px}
  .nav-toggle:checked~.nav{display:flex}
  .nav>li{border-bottom:1px solid var(--rule)}
  .nav>li>a{display:block;padding:13px 0;border-bottom:0}
  .nav-sub{position:static;opacity:1;display:none;height:auto;transform:none;border:0;
    min-width:0;max-width:none;box-shadow:none;background:var(--band);padding:0;margin:0}
  .nav>li.has-sub:focus-within .nav-sub,.nav>li.has-sub.open .nav-sub{display:block;padding:12px 0 14px;margin-bottom:12px}
  .nav-sub::before{margin-inline:14px}
  .nav-sub a{padding:8px 14px}
  .sitehead.center .wrap{justify-content:flex-start}
  .sitehead.center .brand{margin-right:auto}
}
@media print{
  .strip,.sitehead,.chandlery,.post-rail,.nav{display:none}
  body{background:#fff}
}


/* 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-blurb-rows: money blurbs ran to 6 rows at 390, 854px of tier across
   12 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-strip .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical;max-height:45px!important;min-height:0!important;overflow:hidden!important}
}

/* op-article-width: the article column was capped at 664px (78 characters per line) at every desktop width. Operator: "it should utilize more space". Widened through Design's own measure --measure (declared in .post-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){
  div.post-body{--measure:min(865px, 100%)!important}
}
@media (min-width:1600px){
  div.post-body{--measure:min(clamp(865px, 60.069vw, 1038px), 100%)!important}
  div.post-body > :is(p:not([class])){font-size:clamp(19.5px,1.3542vw,23.4px)!important}
}
/* op-article-width:end */

/* op-blurb-two-rows: money blurbs ran FIVE rows or more (desk: .sponsor-strip 6 rows at 768). Operator: "we should probably limit that to display only 2" — held to two rows in that width band only; the copy stays in the markup. */
@media (min-width:641px){
  .sponsor-strip .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;max-height:2lh!important;min-height:0!important;overflow:hidden!important}
}
/* op-blurb-two-rows:end */
/* op-heading-levels */
h2:where(.rt-h3){margin: 0px; font-family: var(--display); font-weight: 400; letter-spacing: -0.01em;}
h3:where(.rt-h4){margin: 0px; font-family: var(--display); font-weight: 400; letter-spacing: -0.01em;}
.trio h3:where(.rt-h4){font: 500 10px/1.4 var(--mono); letter-spacing: 0.16em; text-transform: uppercase; color: var(--green); margin-bottom: 7px;}
.post-body h2:where(.rt-h3){margin: 28px 0px 12px; font: 400 27px/1.15 var(--display); color: var(--navy);}
.profile-card h2:where(.rt-h3){font: 400 21px/1.2 var(--display); color: var(--lapis); margin-bottom: 6px;}
h2.rt-h3.rt-h3{display:block;column-gap:normal;row-gap:normal}
h2.rt-h4.rt-h4{height:14px;margin-bottom:7px;border-top-color:rgb(78, 122, 94);border-bottom-color:rgb(78, 122, 94);font-family:"IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;font-size:10px;font-weight:500;line-height:14px;letter-spacing:1.6px;text-transform:uppercase;text-decoration-color:rgb(78, 122, 94);color:rgb(78, 122, 94)}
/* op-heading-levels:end */

/* op-img-dims — intrinsic width/height reserve image space; the proven height:auto guard (zero specificity) */
:where(a.card > span.c-art > img,
  article > div.post-hero > img,
  div.breakout.plate-pair > figure > img,
  div.lead-grid > div.lead-art > img,
  div.post-body > figure.article-figure.bleed.tall > img){height:auto}
/* op-img-dims:end */