/* RM Show Jumping — "The Course Walk"
   Pine & brass on sand paper. Newsreader (variable) + IBM Plex Mono label system. */

:root{
  --paper:#E9E2D4;
  --paper-hi:#F3EEE3;
  --ink:#15281F;
  --pine:#1E3A2F;
  --brass:#B4884A;
  --arena:#22412f;
  --water:#4a7183;

  --ink-55:rgba(21,40,31,.55);
  --ink-60:rgba(21,40,31,.6);
  --ink-72:rgba(21,40,31,.72);
  --ink-78:rgba(21,40,31,.78);
  --ink-82:rgba(21,40,31,.82);
  --ink-85:rgba(21,40,31,.85);
  --hair-14:rgba(21,40,31,.14);
  --hair-18:rgba(21,40,31,.18);
  --hair-20:rgba(21,40,31,.2);
  --hair-25:rgba(21,40,31,.25);
  --hair-30:rgba(21,40,31,.3);

  --sand-50:rgba(233,226,212,.5);
  --sand-55:rgba(233,226,212,.55);
  --sand-60:rgba(233,226,212,.6);
  --sand-78:rgba(233,226,212,.78);
  --sand-82:rgba(233,226,212,.82);
  --sand-85:rgba(233,226,212,.85);
  --brass-22:rgba(180,136,74,.22);
  --brass-30:rgba(180,136,74,.3);
  --brass-35:rgba(180,136,74,.35);
  --brass-40:rgba(180,136,74,.4);
  --brass-50:rgba(180,136,74,.5);

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

  --gut:clamp(20px,4vw,44px);
  --maxw:1280px;
  --measure:68ch;
}

*,*::before,*::after{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:19.5px;line-height:1.55;font-weight:400;
  -webkit-font-smoothing:antialiased;text-wrap:pretty;
}
img{max-width:100%;display:block}
a{color:var(--pine);text-decoration:none}
a:hover{color:var(--brass)}
::selection{background:var(--brass);color:var(--paper-hi)}
h1,h2,h3,h4{margin:0;font-weight:300;letter-spacing:-.02em;line-height:1.06}
p{margin:0 0 1.1em}
table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px}

/* ---------- shared atoms ---------- */
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gut)}
.mono{font-family:var(--mono)}
.kicker{font-family:var(--mono);font-size:11.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--brass);margin:0 0 18px;display:block}
.label{font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-55)}
.band-pine{background:var(--pine);color:var(--paper)}
.band-ink{background:var(--ink);color:var(--paper)}
.band-pine a,.band-ink a{color:var(--paper)}
.band-pine a:hover,.band-ink a:hover{color:var(--brass)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;z-index:99;background:var(--brass);color:var(--ink);padding:10px 14px;font-family:var(--mono);font-size:12px}

.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:24px;flex-wrap:wrap;
  border-bottom:1px solid var(--hair-20);padding-bottom:16px;margin-bottom:34px}
.section-head h2{font-size:clamp(26px,3vw,33px);font-weight:400;letter-spacing:-.01em}
.section{padding-block:clamp(46px,6vw,78px)}
.section-tight{padding-block:clamp(34px,4vw,52px)}

.btn{display:inline-block;font-family:var(--mono);font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;
  padding:16px 27px;border:1px solid transparent;cursor:pointer}
.btn-primary{background:var(--brass);color:var(--ink)}
.btn-primary:hover{background:var(--paper);color:var(--ink)}
.btn-ghost{border-color:rgba(233,226,212,.45);color:var(--paper)}
.btn-ghost:hover{border-color:var(--brass);color:var(--brass)}
.btn-ghost-ink{border-color:var(--hair-30);color:var(--ink)}
.btn-ghost-ink:hover{border-color:var(--brass);color:var(--brass)}
.cta{font-family:var(--mono);font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;
  border-bottom:1px solid var(--brass);padding-bottom:3px;display:inline-block}
.caption{font-family:var(--mono);font-size:12.5px;line-height:1.65;color:var(--ink-60);margin:14px 0 0}
.band-ink .caption,.band-pine .caption{color:var(--sand-55)}

/* ---------- utility bar ---------- */
.utility{background:var(--ink);color:var(--brass);font-family:var(--mono);font-size:11.5px;
  letter-spacing:.14em;text-transform:uppercase}
.utility .wrap{display:flex;justify-content:space-between;align-items:center;gap:18px;padding-block:10px;flex-wrap:wrap}
.utility a{color:var(--paper);border-bottom:1px solid rgba(233,226,212,.35)}
.utility a:hover{color:var(--brass);border-color:var(--brass)}

/* ---------- header ---------- */
.masthead{background:var(--pine);color:var(--paper)}
.masthead-top{display:flex;align-items:flex-end;justify-content:space-between;gap:36px;flex-wrap:wrap;padding-top:32px}
.eyebrow{font-family:var(--mono);font-size:11.5px;letter-spacing:.34em;text-transform:uppercase;color:var(--brass);margin-bottom:8px}
.wordmark{font-size:clamp(30px,4.4vw,42px);line-height:1;letter-spacing:-.015em;font-weight:400;color:var(--paper);display:block}
a.wordmark-link:hover .wordmark{color:var(--brass)}
.rail-note{font-family:var(--mono);font-size:12px;line-height:1.7;color:var(--sand-60);max-width:30ch;padding-bottom:4px}

/* nav rail with dropdowns */
.nav{margin-top:26px}
.nav-rail{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;border-top:1px solid var(--brass-40)}
.nav-rail>li{flex:1 1 150px;position:relative;border-right:1px solid var(--brass-22);min-width:0}
.nav-rail>li:last-child{border-right:0}
.nav-rail>li>a{display:flex;gap:10px;align-items:baseline;padding:15px 16px 17px;color:var(--paper)}
.nav-rail>li>a .n{font-family:var(--mono);font-size:11.5px;color:var(--brass)}
.nav-rail>li>a .t{font-size:17.5px;line-height:1.25}
.nav-rail>li:hover>a,.nav-rail>li:focus-within>a{background:rgba(180,136,74,.16)}
.nav-rail>li[aria-current="true"]>a,.nav-rail>li.is-current>a{background:rgba(180,136,74,.16)}
.nav-rail>li.is-current>a .t{color:var(--brass)}
.nav-browse>a .t{letter-spacing:.02em}
.nav-toggle{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}
.nav-caret{display:none}
.nav-sub{list-style:none;margin:0;padding:0}

@media (min-width:820px){
  .nav-rail>li.has-sub::after{content:"";position:absolute;left:0;right:0;top:100%;height:10px}
  .nav-sub{position:absolute;top:100%;left:-1px;min-width:308px;z-index:30;
    background:var(--ink);border:1px solid var(--brass-40);border-top:2px solid var(--brass);
    padding:8px 0;display:none;box-shadow:0 18px 40px rgba(10,20,15,.35)}
  .nav-rail>li.has-sub:hover .nav-sub,
  .nav-rail>li.has-sub:focus-within .nav-sub{display:block}
  .nav-sub li+li{border-top:1px solid var(--brass-22)}
  .nav-sub a{display:block;padding:12px 20px;font-size:17px;line-height:1.3;color:var(--paper)}
  .nav-sub a:hover{background:rgba(180,136,74,.18);color:var(--brass)}
  .nav-sub .sub-head{display:block;padding:8px 20px 10px;font-family:var(--mono);font-size:10.5px;
    letter-spacing:.2em;text-transform:uppercase;color:var(--brass)}
}
@media (max-width:819px){
  .nav-rail{border-top:1px solid var(--brass-40)}
  .nav-rail>li{flex:1 1 100%;border-right:0;border-bottom:1px solid var(--brass-22)}
  .nav-rail>li>a{padding:16px 4px}
  .nav-caret{display:flex;align-items:center;justify-content:center;position:absolute;right:0;top:0;
    width:56px;height:56px;cursor:pointer;color:var(--brass)}
  .nav-caret svg{width:16px;height:16px;transition:transform .15s}
  .nav-sub{display:none;padding:0 0 12px 0}
  .nav-toggle:checked ~ .nav-sub{display:block}
  .nav-toggle:checked ~ .nav-caret svg{transform:rotate(180deg)}
  .nav-sub a{display:block;padding:11px 4px 11px 22px;font-size:17px;color:var(--sand-85);
    border-left:1px solid var(--brass-30);margin-left:2px}
  .nav-sub .sub-head{display:none}
}

/* ---------- hero ---------- */
.hero{background:var(--pine);color:var(--paper)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(28px,4vw,56px);align-items:stretch}
.hero-copy{padding-block:clamp(46px,6vw,74px);display:flex;flex-direction:column;justify-content:center;min-width:0}
.hero-copy h1{font-size:clamp(40px,5.6vw,66px);line-height:1.02;letter-spacing:-.025em;font-weight:300;margin-bottom:26px}
.hero-dek{font-size:clamp(19px,2vw,22.5px);line-height:1.5;color:var(--sand-82);margin-bottom:34px;max-width:34ch}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap}
.hero-media{position:relative;min-height:520px;min-width:0}
.hero-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* ---------- six steps grid ---------- */
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--hair-18)}
.step-card{background:var(--paper);padding:30px 28px 32px;display:flex;flex-direction:column;gap:13px;min-height:246px;color:var(--ink)}
.step-card:hover{background:var(--paper-hi)}
.step-card .n{font-family:var(--mono);font-size:12.5px;letter-spacing:.16em;color:var(--brass)}
.step-card .t{font-size:clamp(23px,2.4vw,27px);line-height:1.14;letter-spacing:-.012em;display:block}
.step-card .d{font-size:18.5px;line-height:1.5;color:var(--ink-72);flex:1}
.step-card .go{font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--pine)}
.step-card:hover .go{color:var(--brass)}

/* ---------- the walkable course plan ---------- */
.plan-head{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;flex-wrap:wrap;margin-bottom:34px}
.plan-head h2{font-size:clamp(30px,4vw,46px);font-weight:300;letter-spacing:-.02em;max-width:24ch}
.plan-meta{display:grid;grid-template-columns:auto auto;gap:7px 28px;font-family:var(--mono);font-size:12.5px}
.plan-meta dt{color:var(--sand-55);letter-spacing:.1em;text-transform:uppercase;font-size:11px;align-self:center}
.plan-meta dd{margin:0;color:var(--paper)}
.plan-box{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,1fr);border:1px solid var(--brass-35)}
.plan-figure{background:var(--pine);padding:18px 18px 12px;border-right:1px solid var(--brass-35);min-width:0}
.plan-figure svg{width:100%;height:auto;display:block}
.fence{cursor:pointer}
.fence .rail{fill:var(--paper)}
.fence.is-sel .rail{fill:var(--brass)}
.fence .halo{display:none}
.fence.is-sel .halo{display:block}
.badge{cursor:pointer}
.badge circle{fill:var(--ink);stroke:var(--paper);stroke-width:1.5}
.badge text{fill:var(--paper);font-family:var(--mono);font-size:13.5px}
.badge.is-sel circle{fill:var(--brass);stroke:var(--brass)}
.badge.is-sel text{fill:var(--ink)}
.plan-marker{font-family:var(--mono);font-size:13px}
.chips{display:flex;gap:6px;flex-wrap:wrap;padding:14px 2px 6px}
.chip{background:transparent;color:var(--paper);border:1px solid var(--brass-50);
  font-family:var(--mono);font-size:12.5px;padding:8px 13px;cursor:pointer}
.chip:hover{border-color:var(--brass);color:var(--brass)}
.chip.is-sel{background:var(--brass);color:var(--ink);border-color:var(--brass)}
.plan-readouts{background:var(--paper);color:var(--ink);padding:30px 30px 32px;display:flex;flex-direction:column;min-width:0}
.readout{display:flex;flex-direction:column;flex:1}
.readout[hidden]{display:none}
.readout .kicker{margin-bottom:10px;letter-spacing:.2em;font-size:11px}
.readout h3{font-size:clamp(24px,2.6vw,31px);font-weight:400;letter-spacing:-.015em;line-height:1.1;margin-bottom:22px}
.spec{display:grid;grid-template-columns:auto 1fr;gap:9px 20px;font-family:var(--mono);font-size:13px;
  padding-bottom:20px;margin-bottom:20px;border-bottom:1px solid var(--hair-20)}
.spec dt{color:var(--ink-55);letter-spacing:.08em;text-transform:uppercase;font-size:11px;align-self:center}
.spec dd{margin:0}
.readout h4{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass);margin-bottom:7px;font-weight:500}
.readout p{font-size:19px;line-height:1.5;margin-bottom:20px}
.readout .why{flex:1}
.plan-nav{display:flex;gap:10px;margin-top:8px}
.plan-nav button{flex:1;font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;padding:14px 8px;cursor:pointer;background:transparent}
.plan-nav .next{background:var(--pine);color:var(--paper);border:1px solid var(--pine)}
.plan-nav .next:hover{background:var(--brass);border-color:var(--brass);color:var(--ink)}
.plan-nav .prev{border:1px solid var(--hair-30);color:var(--ink)}
.plan-nav .prev:hover{border-color:var(--brass);color:var(--brass)}
.plan-table{margin-top:26px}
.plan-table summary{font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--brass);cursor:pointer}
.plan-table table{margin-top:18px;color:var(--paper)}
.plan-table th{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--sand-60);
  text-align:left;font-weight:500;padding:0 14px 10px 0;border-bottom:1px solid var(--brass-30)}
.plan-table td{padding:12px 14px 12px 0;border-bottom:1px solid var(--brass-22);font-size:17px;vertical-align:top}
.plan-table td:first-child{font-family:var(--mono);font-size:13px;color:var(--brass)}

/* ---------- calculator ---------- */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(28px,4vw,56px);align-items:start}
.split h2{font-size:clamp(30px,3.6vw,44px);font-weight:300;letter-spacing:-.02em;margin-bottom:22px}
.split p{font-size:20px;line-height:1.55;color:var(--ink-82);max-width:38ch}
.calc{border:1px solid var(--hair-25);background:var(--paper-hi)}
.calc-head{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 26px;border-bottom:1px solid var(--hair-18)}
.calc-head .label{letter-spacing:.18em;font-size:11.5px}
.calc-reset{background:none;border:0;font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--brass);cursor:pointer;padding:0}
.calc-body{padding:24px 26px;display:flex;flex-direction:column;gap:20px}
.dial{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 16px;align-items:center}
.dial .dl{font-size:20px;line-height:1.2;display:block}
.dial .dn{font-family:var(--mono);font-size:12px;color:var(--ink-60);margin-top:4px;display:block}
.stepper{display:flex;align-items:center;gap:2px}
.stepper button{width:44px;height:44px;border:1px solid var(--hair-30);background:var(--paper);
  font-family:var(--mono);font-size:17px;cursor:pointer;line-height:1}
.stepper button:hover{border-color:var(--brass);color:var(--brass)}
.stepper output{width:56px;text-align:center;font-family:var(--mono);font-size:19px}
.toggle{background:transparent;border:1px solid var(--hair-30);font-family:var(--mono);font-size:11.5px;
  letter-spacing:.12em;text-transform:uppercase;padding:14px;cursor:pointer;text-align:left;color:var(--ink)}
.toggle[aria-pressed="true"]{background:var(--brass);border-color:var(--brass);color:var(--ink)}
.calc-total{background:var(--ink);color:var(--paper);padding:24px 26px;display:grid;
  grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:end}
.calc-break{display:flex;flex-direction:column;gap:5px;font-family:var(--mono);font-size:12.5px;color:var(--sand-78)}
.calc-break span{display:flex;justify-content:space-between;gap:14px;min-width:190px}
.calc-score{text-align:right}
.calc-score .label{color:var(--brass);letter-spacing:.18em;font-size:11px;display:block;margin-bottom:2px}
.calc-score output{font-size:56px;line-height:.95;letter-spacing:-.03em;font-family:var(--serif)}
.calc-elim{background:var(--brass);color:var(--ink);padding:14px 26px;font-family:var(--mono);font-size:12px;letter-spacing:.06em}
.calc-elim[hidden]{display:none}

/* ---------- tables ---------- */
.datatable,.versus{font-size:18px}
.datatable th,.versus th{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-60);font-weight:500;text-align:left;padding:0 18px 12px 0;border-bottom:1px solid var(--hair-30)}
.datatable td,.versus td{padding:15px 18px 15px 0;border-bottom:1px solid var(--hair-14);vertical-align:top}
.datatable td:first-child,.datatable td:last-child{font-family:var(--mono);font-size:15px}
.datatable td:first-child{color:var(--pine)}
.datatable td:nth-child(4){color:var(--ink-78)}
.versus th:first-child,.versus td:first-child{width:26%}
.versus tbody th{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:none;color:var(--pine);
  border-bottom:1px solid var(--hair-14);padding:15px 18px 15px 0;vertical-align:top}
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* ---------- explainer cards ---------- */
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,2.4vw,30px)}
.card{border-top:2px solid var(--pine);padding-top:20px;display:flex;flex-direction:column;gap:12px;color:var(--ink);min-height:100%}
.card:hover{border-color:var(--brass)}
.card .thumb{aspect-ratio:16/10;overflow:hidden;background:var(--pine)}
.card .thumb img{width:100%;height:100%;object-fit:cover}
.card .k{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass)}
.card .t{font-size:clamp(22px,2.3vw,28px);line-height:1.12;letter-spacing:-.015em;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.24em}
.card .d{font-size:18px;line-height:1.5;color:var(--ink-72);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card .m{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;color:var(--ink-55);margin-top:auto}
.more-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,2.4vw,30px);margin-top:clamp(20px,2.4vw,30px)}
.expander{margin-top:26px;display:flex;justify-content:space-between;gap:20px;align-items:baseline;flex-wrap:wrap}
.exp-toggle{position:absolute;opacity:0;pointer-events:none}
.exp-label{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  border-bottom:1px solid var(--brass);padding-bottom:3px;cursor:pointer;color:var(--pine)}
.exp-label:hover{color:var(--brass)}
.exp-label .less{display:none}
.exp-toggle:checked ~ .expander .exp-label .less{display:inline}
.exp-toggle:checked ~ .expander .exp-label .more{display:none}
.exp-panel{display:none}
.exp-toggle:checked ~ .exp-panel{display:block}

/* ---------- fences split (image left) ---------- */
.split-media{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,4vw,44px);align-items:stretch}
.split-media .media{position:relative;min-height:400px;min-width:0}
.split-media .media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.split-media .body{display:flex;flex-direction:column;justify-content:center;min-width:0}

/* ---------- supporters strip ---------- */
.supporters{background:var(--paper-hi);border-top:1px solid var(--hair-20)}
.sup-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:28px}
.sup-head h2{font-size:clamp(25px,2.8vw,32px);font-weight:400;letter-spacing:-.01em}
.sup-row{display:grid;gap:14px;grid-template-columns:repeat(4,minmax(0,1fr))}
.sup-row.quiet{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:14px}
.sup-row.quiet-3{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:14px}
.sponsor{display:flex;flex-direction:column;gap:9px;background:var(--ink);border:1px solid var(--hair-25);
  padding:16px;min-height:96px;justify-content:center}
.sponsor:hover{border-color:var(--brass)}
.sponsor img{width:100%;height:auto;aspect-ratio:4/1;object-fit:contain}
.sponsor-blurb{font-family:var(--mono);font-size:12px;line-height:1.5;color:var(--sand-60);display:block}
.sponsor-blurb:empty{display:none}
.sup-note{font-family:var(--mono);font-size:12px;color:var(--ink-60);margin:18px 0 0}
.sponsor-reserve{border:1px dashed var(--hair-30);padding:22px;text-align:center;
  font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-55)}

/* ---------- footer ---------- */
.foot{background:var(--ink);color:var(--sand-78);margin-top:clamp(48px,6vw,88px);padding-block:clamp(40px,5vw,58px) 40px}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,4vw,48px);
  padding-bottom:36px;border-bottom:1px solid var(--brass-30)}
.foot-grid .fm{font-size:clamp(24px,2.6vw,29px);color:var(--paper);margin-bottom:12px;display:block;letter-spacing:-.015em}
.foot-grid p{font-size:18px;line-height:1.5;max-width:30ch}
.foot-col{display:flex;flex-direction:column;gap:9px}
.foot-col .ch{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--brass);margin-bottom:4px}
.foot-col a{font-size:17.5px;color:var(--sand-78)}
.foot-line{font-family:var(--mono);font-size:12px;letter-spacing:.04em;color:var(--sand-55);margin:22px 0 0}

/* ---------- breadcrumb ---------- */
.crumb{font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-60);
  padding-top:clamp(24px,3vw,40px);margin-bottom:26px}
.crumb a{color:var(--pine)}
.crumb .sep{color:var(--brass);padding:0 6px}

/* ---------- category / section page ---------- */
.cat-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,320px);gap:clamp(30px,4vw,64px);align-items:start}
.cat-head h1{font-size:clamp(38px,5.4vw,58px);font-weight:300;letter-spacing:-.025em;line-height:1.04;margin-bottom:20px}
.cat-dek{font-size:clamp(20px,2.2vw,24px);line-height:1.45;color:var(--ink-82);margin-bottom:42px;max-width:30ch}
.cat-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--hair-25)}
.cat-list li{border-bottom:1px solid var(--hair-18)}
.cat-list a{display:grid;grid-template-columns:56px minmax(0,1fr);gap:24px;padding:28px 8px 28px 0;color:var(--ink);align-items:start}
.cat-list a:hover{background:var(--paper-hi)}
.cat-list .ix{font-family:var(--mono);font-size:12.5px;color:var(--brass);padding-top:8px}
.cat-list .t{font-size:clamp(24px,3vw,32px);line-height:1.1;letter-spacing:-.018em;display:block}
.cat-list .d{font-size:19px;line-height:1.5;color:var(--ink-78);display:block;margin-top:10px;max-width:46ch}
.cat-list .m{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-55);display:block;margin-top:10px}
.cat-media{margin-top:48px;height:340px;position:relative}
.cat-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.aside-stack{position:sticky;top:20px;display:flex;flex-direction:column;gap:30px}
.where{background:var(--pine);color:var(--paper);padding:26px}
.where .ch{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--brass);margin-bottom:14px;display:block}
.where ol{list-style:none;margin:0;padding:0}
.where li{border-bottom:1px solid var(--brass-22)}
.where a{display:grid;grid-template-columns:34px minmax(0,1fr);gap:8px;padding:11px 0;color:var(--paper);font-size:18px;line-height:1.25}
.where .n{font-family:var(--mono);font-size:11.5px;color:var(--brass);padding-top:4px}
.where li.is-current a{color:var(--brass)}
.terms{border:1px solid var(--hair-25);padding:24px}
.terms .ch{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--brass);margin-bottom:14px;display:block}
.terms dl{margin:0;display:flex;flex-direction:column;gap:15px}
.terms dt{font-size:19px;line-height:1.2}
.terms dd{margin:3px 0 0;font-size:17px;line-height:1.45;color:var(--ink-72)}

/* ---------- sections hub ---------- */
.hub{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--hair-18);margin-top:34px}
.hub-cell{background:var(--paper);padding:28px}
.hub-cell h2{font-size:clamp(24px,2.6vw,30px);font-weight:400;letter-spacing:-.012em;margin-bottom:8px}
.hub-cell h2 a{color:var(--ink)}
.hub-cell .n{font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;color:var(--brass);display:block;margin-bottom:12px}
.hub-cell p{font-size:18px;color:var(--ink-72);margin-bottom:16px}
.hub-cell ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--hair-18)}
.hub-cell li{border-bottom:1px solid var(--hair-14)}
.hub-cell li a{display:flex;justify-content:space-between;gap:14px;padding:11px 0;font-size:18px;align-items:baseline}
.hub-cell li .rt{font-family:var(--mono);font-size:11.5px;color:var(--ink-55);white-space:nowrap}

/* ---------- article ---------- */
.article-top{border-bottom:1px solid var(--hair-25)}
.article-title{max-width:34ch}
.article-title h1{font-size:clamp(38px,6vw,62px);font-weight:300;letter-spacing:-.028em;line-height:1.03;margin-bottom:22px}
.article-dek{font-family:var(--serif);font-style:italic;font-size:clamp(20px,2.4vw,25px);line-height:1.42;color:var(--ink-82);margin-bottom:28px;max-width:44ch}
.article-meta{display:flex;gap:22px;flex-wrap:wrap;font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-60);border-top:1px solid var(--hair-25);padding:15px 0 0;margin-bottom:clamp(26px,3vw,40px)}
.lead-media{position:relative;margin:0;width:100%;height:clamp(260px,42vw,520px);background:var(--pine)}
.lead-media img{width:100%;height:100%;object-fit:cover;display:block}
.lead-caption{font-family:var(--mono);font-size:12.5px;line-height:1.6;color:var(--ink-60);padding-top:14px;max-width:70ch}

.article-body{display:grid;align-items:start;grid-template-columns:118px minmax(0,var(--measure)) minmax(0,1fr);
  gap:0 clamp(24px,3vw,52px);padding-top:clamp(30px,4vw,52px)}
.article-body>*{grid-column:2}
.article-body .rail{grid-column:1;justify-self:end;text-align:right;font-family:var(--mono);
  font-size:12.5px;letter-spacing:.14em;color:var(--brass);padding-top:.7em}
.article-body .breakout{grid-column:2}
.article-body .fullbleed{grid-column:1/-1}
.article-body p:not([class]){font-size:21px;line-height:1.62;margin:0 0 26px}
.article-body p.lead{margin:0 0 26px}
.article-body figcaption{font-family:var(--mono);font-size:12.5px;line-height:1.6;color:var(--ink-60);margin-top:12px}
.article-body .band-ink p:not([class]){font-size:inherit;line-height:inherit;margin:0}
.article-body h2{font-size:clamp(25px,3vw,31px);font-weight:400;letter-spacing:-.015em;margin:0 0 18px;padding-top:16px;border-top:1px solid var(--hair-20)}
.article-body h2 .hn{font-family:var(--mono);font-size:13px;letter-spacing:.16em;color:var(--brass);display:block;margin-bottom:10px}
.article-body h3{font-size:23px;font-weight:400;margin:0 0 12px}
.article-body>h2{margin-top:44px}
.article-body>h2:first-of-type{margin-top:16px}
.article-body a{border-bottom:1px solid var(--brass-50)}
.article-body a:hover{border-color:var(--brass)}
.article-body ul:not([class]){margin:0 0 28px;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px}
.article-body ul:not([class]) li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;font-size:20px;line-height:1.5}
.article-body ul:not([class]) li::before{content:"—";color:var(--brass);font-family:var(--mono);font-size:13px;padding-top:5px}
.article-body .related-links li{display:block}
.article-body .related-links li::before{content:none}
.article-foot{display:flex;justify-content:space-between;gap:26px;align-items:baseline;flex-wrap:wrap;
  border-top:2px solid var(--pine);padding-top:22px;margin-top:52px}
.article-foot .nk{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--brass);display:block;margin-bottom:8px}
.article-foot .nt{font-size:clamp(22px,2.6vw,30px);line-height:1.12;letter-spacing:-.015em}

/* inline note markers + end notes */
.notemark{font-family:var(--mono);font-size:.62em;letter-spacing:.04em;color:var(--brass);
  vertical-align:super;line-height:0;padding-left:2px;border-bottom:0}
.endnotes{border-top:1px solid var(--hair-25);margin-top:44px;padding-top:22px}
.endnotes .ch{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--brass);display:block;margin-bottom:16px}
.endnotes ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px;counter-reset:en}
.endnotes li{display:grid;grid-template-columns:30px minmax(0,1fr);gap:12px;font-size:18.5px;line-height:1.5;color:var(--ink-82)}
.endnotes li::before{counter-increment:en;content:counter(en);font-family:var(--mono);font-size:12.5px;color:var(--brass);padding-top:6px}
.endnotes .back{font-family:var(--mono);font-size:11.5px;color:var(--brass);border-bottom:0;padding-left:6px}
.related-links{list-style:none;margin:0;padding:0;display:grid;gap:1px;background:var(--hair-18);
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.related-links li{background:var(--paper)}
.related-links a{display:flex;flex-direction:column;gap:8px;padding:22px;height:100%;color:var(--ink);border-bottom:0}
.related-links a:hover{background:var(--paper-hi)}
.related-links .rk{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass)}
.related-links .rt{font-size:22px;line-height:1.15;letter-spacing:-.012em}

/* ---------- palette components ---------- */
.lead{font-size:24px;line-height:1.48;color:var(--ink)}
.lead::first-letter{font-size:86px;line-height:.78;float:left;padding:8px 14px 0 0;color:var(--pine);font-weight:300}
.pullquote{margin:38px 0;padding:0 0 0 28px;border-left:3px solid var(--brass)}
.pullquote p{font-size:clamp(24px,3vw,29px);line-height:1.28;font-style:italic;color:var(--pine);letter-spacing:-.015em;margin:0}
.blockquote{margin:34px 0;padding:24px 26px;background:var(--paper-hi);border:1px solid var(--hair-18)}
.blockquote p{font-size:21px;line-height:1.5;font-style:italic;margin:0 0 12px}
.blockquote cite{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-60);font-style:normal}
.callout{margin:34px 0;background:var(--pine);color:var(--paper);padding:26px 28px;border-left:4px solid var(--brass)}
.callout .ch{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--brass);display:block;margin-bottom:10px}
.callout p{font-size:20px;line-height:1.5;margin:0;color:var(--paper)}
.note{font-family:var(--mono);font-size:14px;line-height:1.65;color:var(--ink-72);
  border-top:1px solid var(--hair-20);border-bottom:1px solid var(--hair-20);padding:14px 0;margin:30px 0}

.statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1px;background:var(--hair-18);
  margin:34px 0;border:1px solid var(--hair-18)}
.statblock{background:var(--paper-hi);padding:22px;display:flex;flex-direction:column;gap:8px}
.stat-num{font-size:clamp(30px,3.4vw,40px);line-height:1;letter-spacing:-.02em;color:var(--pine);display:block}
.stat-label{font-family:var(--mono);font-size:12.5px;line-height:1.5;color:var(--ink-72);display:block}

.timeline{list-style:none;margin:34px 0;padding:0;border-top:1px solid var(--hair-25)}
.timeline li{display:grid;grid-template-columns:minmax(120px,190px) minmax(0,1fr);gap:8px 22px;
  padding:16px 0;border-bottom:1px solid var(--hair-14);position:relative}
.t-when{font-family:var(--mono);font-size:13px;letter-spacing:.06em;color:var(--brass);text-transform:uppercase;line-height:1.5}
.t-what{font-size:19px;line-height:1.5;color:var(--ink-82)}

.chart{margin:36px 0}
.chart svg{width:100%;height:auto;display:block;overflow:visible}
.chart .c-bar{fill:var(--pine)}
.chart .c-bar.alt{fill:var(--brass)}
.chart .c-axis{stroke:var(--hair-30)}
.chart .c-grid{stroke:var(--hair-14)}
.chart .c-lbl{font-family:var(--mono);font-size:13px;fill:var(--ink-72)}
.chart .c-val{font-family:var(--mono);font-size:13px;fill:var(--pine)}
.chart .c-line{fill:none;stroke:var(--brass);stroke-width:3}
.chart .c-dot{fill:var(--pine)}
.chart figcaption,.article-figure figcaption,.map-figure figcaption,.gallery figcaption{
  font-family:var(--mono);font-size:12.5px;line-height:1.6;color:var(--ink-60);margin-top:12px}
.chart-legend{display:flex;gap:18px;flex-wrap:wrap;font-family:var(--mono);font-size:12px;color:var(--ink-72);margin-top:12px}
.chart-legend span{display:flex;align-items:center;gap:7px}
.chart-legend i{width:14px;height:14px;display:block}

.article-figure{margin:36px 0}
.article-figure img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin:36px 0}
.gallery figure{margin:0}
.gallery img{aspect-ratio:4/3;object-fit:cover;width:100%;height:auto}
.map-figure{margin:36px 0}
.map-slot{aspect-ratio:16/9;border:1px dashed var(--hair-30);background:var(--paper-hi)}

.profile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin:34px 0}
.profile-card{border:1px solid var(--hair-25);padding:22px;display:flex;flex-direction:column;gap:8px;background:var(--paper-hi)}
.profile-card .p-photo{width:72px;height:72px;object-fit:cover;border-radius:50%;margin-bottom:6px}
.profile-card h3{font-size:23px;font-weight:400}
.profile-card .p-role{font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--brass);margin:0}
.profile-card p{font-size:18px;line-height:1.5;margin:0;color:var(--ink-78)}
.profile-card .p-links{font-family:var(--mono);font-size:12.5px;margin-top:auto}
.profile-card .p-attr{font-family:var(--mono);font-size:11.5px;color:var(--ink-55)}
.profile-card.no-photo{border-left:3px solid var(--brass)}
.org-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin:34px 0}
.org-card{display:flex;flex-direction:column;gap:6px;border:1px solid var(--hair-25);padding:18px;background:var(--paper-hi);color:var(--ink)}
.org-card:hover{border-color:var(--brass)}
.org-logo{width:44px;height:44px;object-fit:contain;margin-bottom:6px}
.org-name{font-size:21px;line-height:1.2;display:block}
.org-host{font-family:var(--mono);font-size:12px;color:var(--ink-55);display:block}
.entity-ref{font-family:var(--mono);font-size:.86em;letter-spacing:.04em;border-bottom:1px solid var(--brass-50)}
.further-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin:34px 0}
.further-grid a{border:1px solid var(--hair-25);padding:20px;font-size:20px;line-height:1.2;color:var(--ink);display:block}
.further-grid a:hover{border-color:var(--brass);background:var(--paper-hi)}

/* ---------- simple pages ---------- */
.page-grid{display:grid;grid-template-columns:minmax(0,var(--measure)) minmax(0,1fr);gap:clamp(30px,4vw,56px);align-items:start}
.page-body h1{font-size:clamp(36px,5vw,56px);font-weight:300;letter-spacing:-.025em;line-height:1.05;margin-bottom:22px}
.page-body .lede{font-size:clamp(20px,2.2vw,23px);line-height:1.5;color:var(--ink-85,var(--ink-82));margin-bottom:28px}
.page-body h2{font-size:clamp(23px,2.6vw,28px);font-weight:400;margin:40px 0 16px;padding-top:14px;border-top:1px solid var(--hair-20)}
.page-body p{font-size:20.5px;line-height:1.62}
.dashlist{list-style:none;margin:0 0 28px;padding:0;display:flex;flex-direction:column;gap:12px}
.dashlist li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;font-size:20px;line-height:1.5}
.dashlist li::before{content:"—";color:var(--brass);font-family:var(--mono);font-size:13px;padding-top:5px}
.oneline{background:var(--pine);color:var(--paper);padding:26px}
.oneline .ch{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--brass);display:block;margin-bottom:12px}
.oneline p{font-size:20px;line-height:1.45;margin:0}
.page-media{position:relative;height:320px;margin-top:24px}
.page-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.contact-list{list-style:none;margin:0 0 30px;padding:0;display:flex;flex-direction:column;gap:16px}
.contact-list li{display:grid;grid-template-columns:26px minmax(0,1fr);gap:14px;align-items:start;font-size:20px;line-height:1.5}
.contact-list svg{width:22px;height:22px;stroke:var(--brass);fill:none;stroke-width:1.6;margin-top:4px}
.err{padding-block:clamp(50px,9vw,120px);text-align:left}
.err h1{font-size:clamp(40px,7vw,72px);font-weight:300;letter-spacing:-.03em;margin-bottom:20px}
.err p{font-size:22px;max-width:44ch}

/* ---------- styleguide ---------- */
.sg-nav{display:flex;gap:16px;flex-wrap:wrap;font-family:var(--mono);font-size:12px;letter-spacing:.1em;
  text-transform:uppercase;padding:18px 0;border-bottom:1px solid var(--hair-20)}
.sg-item{padding-block:clamp(30px,4vw,50px);border-bottom:1px solid var(--hair-18)}
.sg-item>h2{font-size:clamp(24px,2.8vw,32px);font-weight:400;letter-spacing:-.01em;margin-bottom:6px}
.sg-item>.label{display:block;margin-bottom:26px}
.sg-demo{max-width:var(--measure)}
.sg-wide{max-width:none}

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .article-body{grid-template-columns:74px minmax(0,1fr) 0}
  .article-body .fullbleed{grid-column:1/3}
}
@media (max-width:940px){
  .hero-grid{grid-template-columns:minmax(0,1fr)}
  .hero-media{min-height:min(56vw,380px);order:-1}
  .hero-copy{padding-block:38px 46px}
  .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .plan-box{grid-template-columns:minmax(0,1fr)}
  .plan-figure{border-right:0;border-bottom:1px solid var(--brass-35)}
  .split,.split-media,.cat-grid,.page-grid{grid-template-columns:minmax(0,1fr)}
  .split-media .media{min-height:min(58vw,340px)}
  .aside-stack{position:static}
  .cards,.more-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hub{grid-template-columns:minmax(0,1fr)}
  .foot-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .sup-row,.sup-row.quiet{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sup-row.quiet-3{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:700px){
  body{font-size:18.5px}
  .article-body p:not([class]){font-size:19.5px}
  .steps{grid-template-columns:minmax(0,1fr)}
  .cards,.more-cards{grid-template-columns:minmax(0,1fr)}
  .article-body{grid-template-columns:minmax(0,1fr);gap:0}
  .article-body>*{grid-column:1}
  .article-body .rail{grid-column:1;justify-self:start;text-align:left;padding:0 0 6px}
  .article-body .breakout,.article-body .fullbleed{grid-column:1}
  .lead{font-size:21px}
  .lead::first-letter{font-size:64px;padding-right:11px}
  .cat-list a{grid-template-columns:38px minmax(0,1fr);gap:14px}
  .calc-total{grid-template-columns:minmax(0,1fr);gap:14px}
  .calc-score{text-align:left}
  .foot-grid{grid-template-columns:minmax(0,1fr)}
  .timeline li{grid-template-columns:minmax(0,1fr)}
  .versus th:first-child,.versus td:first-child{width:auto}
  .dial{grid-template-columns:minmax(0,1fr)}
  .stepper{justify-content:flex-start}
}
@media (max-width:420px){
  .sup-row,.sup-row.quiet,.sup-row.quiet-3{grid-template-columns:minmax(0,1fr)}
  .article-meta{gap:10px 18px}
  .plan-readouts{padding:22px 20px 24px}
  .plan-figure{padding:12px 12px 8px}
}
@media print{
  .utility,.nav,.chips,.plan-nav,.calc,.supporters{display:none}
  body{background:#fff}
}

/* donut + inline code */
.chart.donut svg{max-width:300px}
.chart .d-track{fill:none;stroke:var(--hair-18);stroke-width:26}
.chart .d-seg{fill:none;stroke:var(--pine);stroke-width:26}
.chart .d-seg.alt{stroke:var(--brass)}
.chart .d-num{font-family:var(--serif);font-size:40px;fill:var(--pine)}
code.mono{font-size:.82em;letter-spacing:.02em;background:var(--paper-hi);padding:2px 6px;border:1px solid var(--hair-14)}

/* inline stride diagram */
.stride-diagram{margin:40px 0}
.stride-diagram svg{width:100%;height:auto;overflow:visible;background:var(--paper-hi);border:1px solid var(--hair-18);padding:8px 0}
.stride-diagram .sd-ground{stroke:var(--hair-30);stroke-width:1.5}
.stride-diagram .sd-tick{stroke:var(--hair-30);stroke-width:1}
.stride-diagram .sd-arc{fill:none;stroke:var(--pine);stroke-width:2;stroke-dasharray:5 5}
.stride-diagram .sd-jump{stroke:var(--brass);stroke-width:2.5;stroke-dasharray:none}
.stride-diagram .sd-fence rect{fill:var(--pine)}
.stride-diagram .sd-seg{font-family:var(--mono);font-size:12.5px;fill:var(--ink-60)}
.stride-diagram .sd-end{font-family:var(--mono);font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;fill:var(--brass)}
.stride-diagram .sd-dim{stroke:var(--brass);stroke-width:1}
.stride-diagram .sd-dim-l{font-family:var(--mono);font-size:13px;letter-spacing:.08em;fill:var(--pine)}
.stride-diagram .sd-scale{font-family:var(--mono);font-size:11.5px;fill:var(--ink-55)}


/* warm-up sequence figure */
.warmup-figure{margin:40px 0}
.warmup-figure .wu-panel{background:var(--ink);padding:22px 18px 20px}
.warmup-figure svg{width:100%;height:auto;display:block;overflow:visible}
.wu-ground{stroke:rgba(233,226,212,.4);stroke-width:1.5}
.wu-rail{fill:var(--paper)}
.wu-rail-hot{fill:var(--brass)}
.wu-post{fill:rgba(233,226,212,.55)}
.wu-canter,.wu-arrow{fill:none;stroke:var(--brass);stroke-width:2.5}
.wu-arrow-h{fill:var(--brass)}
.wu-flow{stroke:var(--brass-40);stroke-width:1.5}
.wu-tick{stroke:var(--brass-50);stroke-width:1.5}
.wu-limit{stroke:var(--brass);stroke-width:1.5;stroke-dasharray:5 6}
.wu-limit-l{font-family:var(--mono);font-size:11.5px;fill:var(--brass)}
.wu-num{font-family:var(--mono);font-size:12.5px;letter-spacing:.08em;fill:var(--brass)}
.wu-steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;
  margin-top:18px;padding-top:18px;border-top:1px solid var(--brass-22)}
.wu-step{display:flex;flex-direction:column;gap:5px;min-width:0}
.wu-step .wu-n{font-family:var(--mono);font-size:11px;letter-spacing:.18em;color:var(--brass)}
.wu-step .wu-h{font-size:19px;line-height:1.15;color:var(--paper);letter-spacing:-.01em}
.wu-step .wu-d{font-family:var(--mono);font-size:12.5px;line-height:1.5;color:var(--sand-60)}
@media (max-width:820px){
  .wu-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 22px}
}
@media (max-width:480px){
  .warmup-figure .wu-panel{padding:16px 14px 18px}
  .wu-steps{grid-template-columns:minmax(0,1fr)}
  .wu-limit-l,.wu-num{font-size:15px}
  .wu-step .wu-d{font-size:13.5px}
}

/* inline glossary tooltips */
.article-body p{position:relative}
.gloss{border-bottom:1px dashed var(--brass);cursor:help}
.gloss:hover,.gloss:focus{color:var(--pine);background:rgba(180,136,74,.14)}
.gloss-pop{position:absolute;z-index:20;background:var(--ink);color:var(--sand-85);
  border-top:2px solid var(--brass);padding:14px 16px;font-family:var(--mono);font-size:13.5px;
  line-height:1.55;text-align:left;box-shadow:0 16px 34px rgba(10,20,15,.28);
  opacity:0;visibility:hidden;transition:opacity .12s ease;left:0;right:0;top:calc(100% + 8px)}
.gloss:hover .gloss-pop,.gloss:focus .gloss-pop,.gloss:focus-within .gloss-pop{opacity:1;visibility:visible}
.gp-t{display:block;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--brass);
  font-weight:500;margin-bottom:7px}
@media (min-width:1081px){
  .gloss{position:relative}
  .gloss-pop{left:50%;right:auto;transform:translateX(-50%);width:330px;top:calc(100% + 9px)}
}
@media (hover:none){
  .gloss-pop{transition:none}
}

/* fault-count sidebar */
.faultcount{font-family:var(--mono);min-width:0;border-top:2px solid var(--brass);padding-top:14px;margin:4px 0 30px}
.fc-h{display:block;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--brass);margin-bottom:10px}
.faultcount dl{margin:0}
.faultcount dl>div{display:flex;justify-content:space-between;align-items:baseline;gap:14px;
  padding:9px 0;border-bottom:1px solid var(--hair-14);font-size:12.5px;line-height:1.4}
.faultcount dt{color:var(--ink-72)}
.faultcount dd{margin:0;color:var(--pine);font-weight:500;font-size:14px}
.faultcount dd.el{color:var(--brass)}
.fc-link{display:inline-block;margin-top:15px;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;
  border-bottom:1px solid var(--brass);padding-bottom:3px}
@media (min-width:1081px){
  .article-body .faultcount{grid-column:3;align-self:start;margin-top:8px}
}
@media (max-width:1080px){
  .article-body .faultcount{grid-column:2}
  .faultcount dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:32px}
}
@media (max-width:700px){
  .article-body .faultcount{grid-column:1}
  .faultcount dl{grid-template-columns:minmax(0,1fr)}
}

/* ---- phone legibility: diagrams and wide tables scroll instead of shrinking ---- */
.plan-reprise-foot{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;
  margin-top:20px;padding-top:18px;border-top:1px solid var(--brass-30)}
.plan-scroll,.chart-scroll{min-width:0}
@media (max-width:700px){
  .plan-reprise-foot{grid-template-columns:minmax(0,1fr);gap:20px}
  .plan-scroll,.chart-scroll{overflow-x:auto;padding-bottom:6px}
  .plan-scroll>svg{min-width:640px}
  .chart-scroll>svg{min-width:600px}
  .chart.donut .chart-scroll>svg{min-width:0}
  .badge text{font-size:19px}
  .plan-marker text{font-size:17px}
  .chart .c-lbl,.chart .c-val{font-size:16px}
  .stride-diagram .sd-seg,.stride-diagram .sd-end{font-size:16px}
  .stride-diagram .sd-dim-l{font-size:17px}
  .stride-diagram .sd-scale{font-size:15px}
  .wu-limit-l,.wu-num{font-size:17px}
  .table-scroll>table{min-width:600px}
  .datatable td,.datatable th{white-space:nowrap}
  .datatable td:nth-child(4){white-space:normal;min-width:190px}
}


/* sp-contain-guard: sponsor logos are wordmarks — never object-fit:cover (crops).
   object-fit ONLY. This block used to also set width:auto, padding:4px 10px,
   max-width:calc(100% - 20px) and min/max-height, which overrode Design's own frame and
   let every plate shrink-wrap its logo — the recurring "inconsistent sizing" and
   "lacks padding". Geometry belongs to Design. */
.sponsor img{object-fit:contain!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}

/* op-mobile-scroller: the SVG carries min-width:640px inside div.plan-scroll — a container whose
   NAME says it is meant to scroll sideways, but it was not actually scrolling, so the page grew
   instead. The container scrolls and is capped to its column; the drawing keeps its own width. */
@media (max-width:640px){
  .plan-scroll{overflow-x:auto!important;max-width:100%!important;-webkit-overflow-scrolling:touch}
}
/* ⚠️ THE PREVIOUS BLOCK DID NOTHING ON ITS OWN. A flex or grid item defaults to min-width:auto,
   which means it cannot shrink below its content's min-content width — so the scroll container
   kept being stretched to the child's own min-width (640px / 1400px / 560px) and overflow-x:auto
   had nothing to scroll. min-width:0 has to travel up the chain from the scroller to its
   formatting context, which is what actually lets the container narrow to the column. */
@media (max-width:640px){
  .plan-scroll,.alm-scroll,.waterband__fig,.map-figure,pre.tok,
  .plan-scroll *,.alm-scroll > *,
  figure,section,article,main,div[class*="scroll"],div[class*="pair"],div[class*="band"]{min-width:0!important}
  img,svg,table,pre,code,figure{max-width:100%!important}
}

/* op-overflow-pinned: span overhung the viewport by 121px at 320 on
   index.html — width 190px reaching x=441, white-space:normal,
   min-width:190px, inside span (flex/nowrap,
   tracks none). Closed at the element that causes it, phone
   widths only. */
@media (max-width:640px){
  .calc-break span > span{min-width:0;max-width:100%}
}

/* op-footer-compact: the footer printed 12 rows for 12 link(s) in
   2 list(s) — 804px at 390, 6% of the whole page. Design's own
   good case (evbb) has no list at all: its footer links simply flow inline, 479px in total.
   Here the lists flow inline too, and the group holder takes two columns,
   measured 804 -> 657px (18% shorter) with no new overflow. Both shapes were
   tried and the shorter one kept — two columns helps a wide group set and hurts a narrow one.
   Phone widths only; the desktop footer is untouched. */
@media (max-width:640px){
  footer ul,footer ol{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;column-gap:22px!important;row-gap:8px!important}
  footer ul > li,footer ol > li{width:auto!important;flex:0 0 auto;max-width:100%}
  footer [class*=grid],footer [class*=index],footer [class*=cols]{grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:24px}
}

/* op-money-columns: the supporters block ran one tile per row — 12 tiles,
   2112px at 390, 17% of the whole page. Two columns bring it to
   821px (61% shorter). Checked before writing: no new overflow, smallest mark still
   131px wide, longest blurb 3 lines, tile heights 130-130px.
   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.
   The blurb is held to three rows at phone width, because a nine- or eleven-line blurb in a narrow column made two columns TALLER than one. The copy stays in the markup. Only the tier(s) that were one-per-row are touched (.sup-row, .sup-row.quiet, .sup-row.quiet-3), never the section
   that holds several tiers: forcing a grid on that would put a featured row and a regulars run
   side by side. Phone widths only. */
@media (max-width:640px){
  .sup-row{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:14px!important}
    .sup-row > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .sup-row > * *{min-width:0!important;max-width:100%}
    .sup-row img,.sup-row svg{max-width:100%;height:auto}
  .sup-row.quiet{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:14px!important}
    .sup-row.quiet > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .sup-row.quiet > * *{min-width:0!important;max-width:100%}
    .sup-row.quiet img,.sup-row.quiet svg{max-width:100%;height:auto}
  .sup-row.quiet-3{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:14px!important}
    .sup-row.quiet-3 > *{min-width:0!important;max-width:100%;width:auto!important;flex:0 1 auto!important}
    .sup-row.quiet-3 > * *{min-width:0!important;max-width:100%}
    .sup-row.quiet-3 img,.sup-row.quiet-3 svg{max-width:100%;height:auto}
  .sup-row .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical;overflow:hidden!important}
  .sup-row.quiet .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical;overflow:hidden!important}
  .sup-row.quiet-3 .sponsor-blurb{display:-webkit-box!important;-webkit-line-clamp:3!important;-webkit-box-orient:vertical;overflow:hidden!important}
}
/* op-heading-levels */
h2:where(.rt-h3){margin: 0px; font-weight: 300; letter-spacing: -0.02em; line-height: 1.06;}
h2:where(.rt-h3pdc7ea8){margin: 0px; font-weight: 300; letter-spacing: -0.02em; line-height: 1.06;}
.readout h2:where(.rt-h3){font-size: clamp(24px, 2.6vw, 31px); font-weight: 400; letter-spacing: -0.015em; line-height: 1.1; margin-bottom: 22px;}
.readout h2:where(.rt-h3pdc7ea8){font-size: clamp(24px, 2.6vw, 31px); font-weight: 400; letter-spacing: -0.015em; line-height: 1.1; margin-bottom: 22px;}
.article-body h2:where(.rt-h3){font-size: 23px; font-weight: 400; margin: 0px 0px 12px;}
.article-body h2:where(.rt-h3pdc7ea8){font-size: 23px; font-weight: 400; margin: 0px 0px 12px;}
.profile-card h2:where(.rt-h3){font-size: 23px; font-weight: 400;}
h2.rt-h3.rt-h3{height:24.375px;padding-top:0px;border-top-width:0px;border-top-style:none;border-top-color:rgb(21, 40, 31)}
h2.rt-h3.rt-h3{height:auto;border-top-color:rgb(233, 226, 212)}
h2.rt-h3.rt-h3{border-top-color:rgb(21, 40, 31)}
h2.rt-h3pdc7ea8.rt-h3pdc7ea8{padding-top:0px;border-top-width:0px;border-top-style:none;border-top-color:rgb(233, 226, 212)}
/* op-heading-levels:end */

/* op-img-dims — intrinsic width/height reserve image space; the proven height:auto guard (zero specificity) */
:where(aside.aside-stack > div.page-media > img,
  div.cat-head > div.cat-media > img,
  div.hero-grid.wrap > div.hero-media > img,
  div.split-media.wrap > div.media > img,
  main > figure.lead-media > img){height:auto}
/* op-img-dims:end */