/* ==========================================================
   NSD Global — design layer.
   Kept out of index.html on purpose: another session edits that
   file, and changes made inside it were repeatedly overwritten.
   Everything here is additive and loads after the template's own
   <style>, so it wins on equal specificity.
   ========================================================== */

/* ---------- the closing band ----------
   The template's panel reveal leaves .band translated down and
   scaled, which exposes the white section above it as a strip.
   GSAP writes an inline transform, so this needs !important. */
.band{
  transform:none !important;
  opacity:1 !important;
  visibility:visible !important;
  /* flat navy: no gradient, no drifting light layers */
  background:var(--navy-900) !important
}
.band::before,
.band::after{display:none !important}

/* ---------- the chakra turns ---------- */
.brass-chakra{
  width:clamp(104px,10vw,148px);
  margin:0 auto clamp(30px,3.6vw,44px);
  filter:drop-shadow(0 18px 40px rgba(0,0,0,.5));
  animation:nsd-chakra-turn 72s linear infinite;
  will-change:transform
}
@keyframes nsd-chakra-turn{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

/* ---------- counters ----------
   The reveal wrapper is a <span>, so label rules land on it and
   cap the mask width, shearing the wider figures. */
.counters{overflow:visible}
.counters .counter-mask{
  display:block;
  max-width:none;
  width:auto;
  font-size:inherit;
  letter-spacing:inherit;
  line-height:inherit;
  text-transform:none;
  color:inherit;
  overflow:hidden;
  padding:.16em .22em .08em 0;
  margin:-.08em -.22em 0 0
}
.counters b{
  white-space:nowrap;
  font-size:clamp(2rem,4.3vw,3.35rem);
  letter-spacing:-.038em;
  line-height:1.12
}
.counters span:not(.counter-mask){
  display:block;
  max-width:14ch;
  font-size:.78rem;
  letter-spacing:.11em;
  line-height:1.45
}
.counters div{padding-right:26px}
.counters div:not(:first-child){padding-left:28px}

@media(max-width:720px){
  .counters{grid-template-columns:repeat(2,1fr);row-gap:34px}
  .counters div:nth-child(3){border-left:0;padding-left:0}
}

/* ---------- contact ---------- */
.cform{display:grid;gap:18px;max-width:520px}
.cform label{
  display:grid;gap:8px;
  font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);font-weight:600
}
.cform input,.cform select,.cform textarea{
  padding:14px 16px;
  border:1px solid #E2E7EC;border-radius:12px;background:#fff;
  font-family:var(--sans);font-size:.98rem;color:var(--ink);
  letter-spacing:0;text-transform:none;font-weight:400
}
.cform textarea{resize:vertical;min-height:120px}
.cform input:focus,.cform select:focus,.cform textarea:focus{
  outline:none;
  border-color:var(--bronze);
  box-shadow:0 0 0 4px rgba(176,141,87,.16)
}
.cform .btn{justify-self:start;margin-top:6px}
.cform-note{margin:0;font-size:.9rem;min-height:1.2em}

.routes{display:grid;border-top:1px solid var(--line)}
.route{display:grid;gap:5px;padding:17px 0;border-bottom:1px solid var(--line)}
.route b{font-family:var(--serif);font-size:1.08rem;font-weight:500;color:var(--navy)}
.route span{font-size:.92rem;color:var(--muted);line-height:1.5}

@media(prefers-reduced-motion:reduce){
  .brass-chakra{animation:none}
}

/* ---------- filter selects ----------
   The native chevron is the browser's, not ours: it sits in a
   different grey, a different weight and a different position on
   every platform. Replace it with our own and give the control a
   real hover and focus state. */
.filters select{
  -webkit-appearance:none;
  appearance:none;
  padding:11px 40px 11px 16px;
  border:1px solid #E2E7EC;
  border-radius:999px;
  background-color:#fff;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%23B08D57' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 15px center;
  background-size:11px 7px;
  font-family:var(--sans);
  font-size:.88rem;
  color:var(--ink);
  cursor:pointer;
  transition:border-color .18s ease,box-shadow .18s ease
}
.filters select:hover{border-color:var(--bronze)}
.filters select:focus{
  outline:none;
  border-color:var(--bronze);
  box-shadow:0 0 0 4px rgba(176,141,87,.16)
}
.filters input{
  border-radius:999px;
  padding:11px 18px;
  border:1px solid #E2E7EC
}
.filters input:hover{border-color:var(--bronze)}
.filters input:focus{
  outline:none;
  border-color:var(--bronze);
  box-shadow:0 0 0 4px rgba(176,141,87,.16)
}

/* ---------- verification ----------
   The search sat inside a card which sat inside a section, so the
   result card was a box inside a box. Flatten the wrapper and let
   the returned credential be the only lifted object on the page. */
.verify-box{
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  max-width:760px
}
.vsearch input{
  height:60px;
  padding:0 22px;
  border-radius:14px;
  font-size:1.05rem;
  letter-spacing:.03em
}
.vsearch .btn,
.vsearch button{
  height:60px;
  padding:0 34px;
  border-radius:14px;
  font-size:.95rem
}
.verify-box .muted{margin-top:14px;font-size:.88rem}

.result{
  margin-top:30px;
  border-radius:18px;
  box-shadow:0 1px 2px rgba(6,26,46,.06),0 18px 44px rgba(6,26,46,.1)
}
.res-grid div{padding:22px 24px}
.res-grid small{
  font-size:.66rem;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--muted)
}
.res-grid strong{
  font-family:var(--serif);
  font-size:1.22rem;
  font-weight:500;
  color:var(--ink)
}
.res-head{padding:28px 30px}
.res-foot{padding:18px 30px}

/* ---------- the statement reads as two lines, not four ---------- */
.statement p{
  max-width:52ch;
  font-size:clamp(1.5rem,3.1vw,2.55rem);
  line-height:1.16;
  letter-spacing:-.022em
}
@media(max-width:900px){
  .statement p{max-width:26ch;font-size:clamp(1.5rem,5.4vw,2rem)}
}

/* ---------- chapters map ---------- */
.chapter-map-wrap{position:relative;margin:34px 0 40px}
.chapter-map{
  height:clamp(320px,42vw,460px);
  border-radius:20px;
  overflow:hidden;
  background:#EFF2F6;
  box-shadow:0 1px 2px rgba(6,26,46,.05),0 14px 36px rgba(6,26,46,.08)
}
.chapter-map .leaflet-container{font-family:var(--sans);background:#EFF2F6}
.chapter-map .leaflet-tile-pane{filter:saturate(.4) contrast(.96)}
.chapter-map .leaflet-control-zoom{
  margin:16px 16px 0 0;border:1px solid #E0D6C4;border-radius:10px;overflow:hidden;
  box-shadow:0 6px 18px rgba(6,26,46,.1)
}
.chapter-map .leaflet-control-zoom a{
  width:32px;height:32px;line-height:32px;color:var(--navy);
  border-bottom-color:#EFE6D7;font-size:17px
}
.chapter-map .leaflet-control-attribution{
  padding:3px 8px;background:rgba(255,255,255,.86);
  color:var(--muted);font-size:10.5px
}
.chapter-map .leaflet-control-attribution a{color:var(--navy)}

.chapter-pin{display:grid;place-items:center}
.chapter-pin-dot{
  display:block;width:12px;height:12px;
  border:2px solid #fff;border-radius:50%;
  background:var(--navy);
  box-shadow:0 2px 8px rgba(6,26,46,.4);
  transition:transform .22s cubic-bezier(.22,.61,.36,1),background .18s ease
}
.chapter-pin em{
  position:absolute;top:50%;left:17px;transform:translateY(-50%);
  padding:3px 9px;border-radius:5px;
  background:rgba(255,255,255,.92);
  color:var(--navy);font-style:normal;font-size:11.5px;font-weight:600;
  letter-spacing:.03em;white-space:nowrap;
  opacity:0;transition:opacity .2s ease
}
.chapter-pin:hover .chapter-pin-dot{transform:scale(1.25)}
.chapter-pin:hover em,.chapter-pin.is-active em{opacity:1}
.chapter-pin.is-active .chapter-pin-dot{
  background:var(--bronze);
  transform:scale(1.45);
  box-shadow:0 0 0 7px rgba(176,141,87,.24),0 2px 8px rgba(6,26,46,.35)
}

.chapter-legend{
  margin:18px 0 0;padding:0;list-style:none;
  display:flex;flex-wrap:wrap;gap:9px
}
.chapter-legend button{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 15px 8px 11px;
  border:1px solid #E2E7EC;border-radius:999px;background:#fff;
  color:var(--navy);font-family:var(--sans);font-size:.83rem;font-weight:500;
  cursor:pointer;transition:border-color .16s ease,background .16s ease,color .16s ease
}
.chapter-legend button span{
  width:7px;height:7px;border-radius:50%;background:#CFC0A6;transition:background .16s ease
}
.chapter-legend button:hover{border-color:var(--bronze)}
.chapter-legend button.is-active{background:var(--navy);border-color:var(--navy);color:#fff}
.chapter-legend button.is-active span{background:var(--bronze)}

/* ---------- the falcon on the home grades section ---------- */
.home-falcon{
  position:absolute;top:8%;right:6%;z-index:0;
  width:clamp(120px,13vw,190px);height:auto;
  filter:drop-shadow(0 20px 38px rgba(6,26,46,.2));
  pointer-events:none
}
@media(max-width:1100px){.home-falcon{display:none}}

/* ---------- the active pin pulses; everything else stays quiet ----------
   Only the selected chapter is named. Inactive pins are smaller and
   muted so the eye goes to one place. */
.chapter-pin-dot{position:relative}

.chapter-pin:not(.is-active) .chapter-pin-dot{
  width:9px;height:9px;
  background:#8FA3BC;
  box-shadow:0 1px 4px rgba(6,26,46,.28)
}
.chapter-pin:not(.is-active):hover .chapter-pin-dot{background:var(--navy)}

/* the selected pin: solid bronze centre, with a ring that expands and fades */
.chapter-pin.is-active .chapter-pin-dot{
  background:var(--bronze);
  transform:scale(1.3);
  box-shadow:0 2px 8px rgba(6,26,46,.35)
}
.chapter-pin.is-active .chapter-pin-dot::after,
.chapter-pin.is-active .chapter-pin-dot::before{
  content:"";
  position:absolute;
  inset:-2px;
  border-radius:50%;
  border:2px solid var(--bronze);
  pointer-events:none;
  animation:nsd-pin-pulse 2.6s cubic-bezier(.22,.61,.36,1) infinite
}
/* the second ring is offset half a cycle so the pulse never stops */
.chapter-pin.is-active .chapter-pin-dot::before{animation-delay:1.3s}

@keyframes nsd-pin-pulse{
  0%   {transform:scale(1);   opacity:.75}
  70%  {opacity:.12}
  100% {transform:scale(4.2); opacity:0}
}

/* names: the active chapter only, plus whatever the cursor is over */
.chapter-pin em{opacity:0}
.chapter-pin.is-active em{opacity:1}
.chapter-pin:not(.is-active):hover em{opacity:.72}

@media(prefers-reduced-motion:reduce){
  .chapter-pin.is-active .chapter-pin-dot::after,
  .chapter-pin.is-active .chapter-pin-dot::before{animation:none;opacity:.35}
}

/* ---------- footer: deeper navy, dawn rising off the bottom edge ----------
   The glow lives in the background itself, layered radial gradients rather
   than blurred pseudo-elements. A blurred box inside overflow:hidden shows
   its own edge where the clip cuts it, which is what broke the first pass.
   The base stays firmly navy: blue channel well ahead of red. */
footer,
.site-footer{
  position:relative;
  background:
    /* the warm horizon, centred below the bottom edge */
    radial-gradient(115% 62% at 50% 116%,
      rgba(212,166,92,.22) 0%,
      rgba(178,134,66,.12) 26%,
      rgba(120,92,48,.05) 46%,
      transparent 64%),
    /* the cooler lift just above it */
    radial-gradient(95% 50% at 50% 110%,
      rgba(52,104,180,.26) 0%,
      rgba(38,78,140,.12) 38%,
      transparent 66%),
    /* navy base, only a shade deeper than the band above it */
    linear-gradient(180deg, #061a38 0%, #05142c 55%, #04101f 100%) !important
}

/* ---------- verification: heading beside the state key ----------
   Restored: an earlier footer rewrite truncated the file from the
   footer marker onward and took this block with it. */
.verify-head{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(250px,.62fr);
  gap:clamp(30px,5vw,72px);
  align-items:start
}
.verify-head > div:first-child{min-width:0}

.state-key{
  padding:26px 28px;
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  box-shadow:0 1px 2px rgba(6,26,46,.04),0 10px 28px rgba(6,26,46,.05)
}
.state-key-title{
  margin:0 0 16px;
  font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;
  font-weight:600;color:var(--muted)
}
.state-row{
  display:flex;align-items:baseline;gap:12px;
  padding:11px 0;border-top:1px solid #EFF2F5
}
.state-row:first-of-type{border-top:0;padding-top:0}
.state-chip{
  flex:0 0 auto;
  padding:4px 11px;border-radius:999px;
  font-size:.66rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase
}
.state-row.is-active  .state-chip{background:#E8F3EC;color:var(--ok)}
.state-row.is-lapsed  .state-chip{background:#F1F0EC;color:#7C7568}
.state-row.is-revoked .state-chip{background:#F7E9E9;color:var(--stop)}
.state-note{font-size:.86rem;color:var(--muted);line-height:1.45}
.state-key-foot{
  margin:16px 0 0;padding-top:14px;
  border-top:1px solid #EFF2F5;
  font-family:var(--serif);font-size:.98rem;line-height:1.35;color:var(--navy)
}

@media(max-width:900px){
  .verify-head{grid-template-columns:minmax(0,1fr);gap:30px}
}

/* ---------- the archive, carried by its captions ---------- */
.archive-list{
  margin-top:30px;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:1px;
  background:var(--line);
  border-block:1px solid var(--line)
}
.archive-row{
  display:grid;gap:6px;
  padding:24px 26px 26px 0;
  background:#F3F0E9
}
.archive-row b{
  font-family:var(--serif);font-size:1.1rem;font-weight:500;
  color:var(--navy);line-height:1.25
}
.archive-row span{font-size:.86rem;color:var(--muted);line-height:1.45}

/* the Verify control is a span, so it needs a visible focus ring of its own */
.vsearch .btn[role="button"]:focus-visible{
  outline:none;
  box-shadow:0 0 0 4px rgba(199,154,78,.4)
}

/* ---------- Verify control: centre the label ----------
   .btn is inline-block with text-align:center, so giving it a fixed
   height leaves the label sitting on the first line box at the top.
   Flex centres it on both axes regardless of height. */
.vsearch .btn,
.vsearch button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
  white-space:nowrap
}
.vsearch{align-items:stretch}
.vsearch .btn{min-width:132px}

/* ==========================================================
   Responsive + accessibility pass.
   Addresses an audit at 1280 / 768-820 / 320-390.
   ========================================================== */

/* --- 1. tablet header ---------------------------------------------------
   The template swaps to the burger at 760px, but the desktop nav needs
   ~910px, so 761-909px clipped the Portal button and forced h-scroll.
   Move the swap above the nav's real minimum. */
@media(max-width:1010px){
  .burger{display:block}
  nav.main{
    display:none;
    position:absolute;top:100%;left:0;right:0;
    flex-direction:column;align-items:stretch;gap:0;
    padding:10px 28px 22px;
    background:var(--navy-900);
    border-bottom:1px solid var(--line-dark)
  }
  nav.main.open{display:flex}
  nav.main a{padding:14px 0;border-bottom:1px solid var(--line-dark)}
  nav.main a.portal{
    padding:10px 19px;
    border:1px solid rgba(232,200,122,.55);
    border-radius:999px;
    color:var(--gold-hi);
    align-self:flex-start;
    margin-top:14px
  }
  .portal{align-self:flex-start;margin-top:14px}
  .bar{flex-wrap:nowrap}
  .brand .word{white-space:nowrap}
}

/* the burger was 59x34; touch targets want 44 */
.burger{min-height:44px;min-width:52px;border-radius:8px}

/* --- 3. mobile spacing cascade -----------------------------------------
   An earlier typography pass set section padding with no media query, so
   it beat the template's own mobile rule on source order alone. */
@media(max-width:760px){
  section{padding:54px 0}
  .tight{padding:38px 0}
  .band{padding:62px 0}
  .hero{padding:56px 0 50px}
  .statement{padding:66px 0}
  footer .footer-main,.footer-main{padding:54px 0 40px}
  h1{font-size:clamp(1.9rem,7.4vw,2.4rem)}
  h2{font-size:clamp(1.5rem,6.2vw,1.95rem)}
  .lede{font-size:1rem}
}
@media(max-width:420px){
  section{padding:44px 0}
  .band{padding:52px 0}
}

/* --- 4. verification card at 320 ---------------------------------------
   .res-head stayed a single flex row, pushing the status chip out of view
   and wrapping the name to three lines. */
@media(max-width:560px){
  .res-head{flex-wrap:wrap;gap:14px;padding:22px 20px}
  .res-head > div{flex:1 1 100%;min-width:0}
  .status{margin-left:0;width:100%;text-align:left}
  .res-head b{font-size:1.15rem;overflow-wrap:anywhere}
  .res-grid div{padding:16px 20px}
  .res-foot{padding:16px 20px}
  .vsearch{flex-direction:column;align-items:stretch}
  .vsearch .btn{width:100%}
}

/* --- 5. rail affordance on small screens -------------------------------
   The arrow was hidden and the next card barely peeked, so the rail did
   not read as scrollable. */
@media(max-width:760px){
  .rail-track > .grid > *{flex:0 0 76vw}
  .rail-track > .grid{padding-right:16vw}
  .rail-next{
    display:grid;
    width:40px;height:40px;
    right:2px;font-size:22px
  }
  .rail::after{
    content:"";
    position:absolute;top:0;right:0;bottom:22px;
    width:56px;
    background:linear-gradient(90deg,transparent,var(--paper));
    pointer-events:none
  }
}

/* --- 6. one focus and active language for every control ---------------- */
.btn,.portal,.more,[data-go],.rail-next,.chapter-legend button,
.filters select,.filters input,nav.main a,.burger,.vsearch input{
  outline:none
}
.btn:focus-visible,
.portal:focus-visible,
.more:focus-visible,
[data-go]:focus-visible,
.rail-next:focus-visible,
.chapter-legend button:focus-visible,
.filters select:focus-visible,
.filters input:focus-visible,
.burger:focus-visible,
.vsearch input:focus-visible,
.cform input:focus-visible,
.cform select:focus-visible,
.cform textarea:focus-visible,
nav.main a:focus-visible{
  box-shadow:0 0 0 3px var(--paper),0 0 0 6px rgba(199,154,78,.7);
  border-radius:6px
}
.btn-gold:focus-visible,.btn-navy:focus-visible,.portal:focus-visible{border-radius:999px}

/* pressed state, which nothing had */
.btn:active,.portal:active,.rail-next:active,.chapter-legend button:active{
  transform:translateY(1px)
}

/* an element that cannot act must not look like it can */
[aria-disabled="true"]{cursor:default;opacity:.62}
[aria-disabled="true"]:hover{background:inherit;color:inherit;transform:none}

/* --- 7. tablet grids ---------------------------------------------------- */
@media(max-width:1010px) and (min-width:761px){
  .counters{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:30px}
  .counters div,.counters div:not(:first-child){
    padding:20px 20px 20px 0;border-left:0
  }
  .counters div:nth-child(even){border-left:1px solid var(--line);padding-left:26px}
  /* five steps in a 2-col grid orphaned step five */
  .steps{grid-template-columns:repeat(3,minmax(0,1fr))}
  .step:nth-child(4){border-left:0}
  .step:nth-child(n+4){border-top:1px solid var(--line)}
  .g4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .steps{grid-template-columns:minmax(0,1fr)}
  .step{border-right:0;border-bottom:1px solid var(--line)}
  .step:last-child{border-bottom:0}
}

/* --- 8. one spacing step between a heading block and what follows ------- */
.lede + .grid,.lede + .ladder,.lede + .sched,.lede + .steps,
.lede + .filters,.lede + table,.lede + .verify-box,.lede + .rail,
.lede + .chapter-map-wrap{margin-top:38px}
.rail{margin-top:38px}
.chapter-map-wrap{margin-top:38px}
h2 + .grid,h2 + .rail,h2 + .sched{margin-top:34px}
.chap + .btn{margin-top:30px}
.chapters-actions{margin-top:var(--space-6,48px)}

/* --- 9. only things that act should behave like it ---------------------- */
.card:hover,.mcard:hover,.chap:hover,.post:hover{transform:none;box-shadow:0 1px 2px rgba(6,26,46,.05),0 10px 30px rgba(6,26,46,.06)}
.card.is-actionable:hover,.mcard.is-actionable:hover,
.chap.is-actionable:hover,.post.is-actionable:hover{
  transform:translateY(-3px);
  box-shadow:0 2px 4px rgba(6,26,46,.06),0 18px 44px rgba(6,26,46,.11)
}
.card.is-actionable,.mcard.is-actionable,.chap.is-actionable,.post.is-actionable{cursor:pointer}

/* --- 10. contrast ------------------------------------------------------
   The muted half of a two-tone heading was #9AA7B4 on white, about 2.4:1.
   Large text needs 3:1. Small gold labels were under 4.5:1. */
h2 span{color:#68778A}
.eyebrow{color:#8A6526}
.state-note,.route span,.archive-row span{color:#55636F}
.muted,.lede{color:#55636F}

/* --- 11. mobile menu ---------------------------------------------------- */
nav.main[hidden]{display:none}

/* --- the tablet nowrap must not reach the phone -------------------------
   .brand .word{white-space:nowrap} was scoped to max-width:1010px, which
   included 320px and stopped the wordmark shrinking, pushing the burger
   9px past the viewport. Bound it at both ends. */
@media(max-width:760px){
  .brand .word{white-space:normal}
  .bar{gap:14px;min-height:64px}
  .brand{min-width:0}
  .brand .word{font-size:1.05rem;line-height:1.1;min-width:0}
  .brand .word small{font-size:.52rem;letter-spacing:.16em}
}
@media(max-width:400px){
  .wrap{padding:0 18px}
  .brand .seal,.seal{width:34px;height:34px;flex-basis:34px}
  .burger{min-width:46px;padding:8px 10px}
}

/* ---------- verification: one status language, and a refusal state ----------
   Standing is read from the rendered badge after every lookup, so Lapsed
   renders as itself rather than borrowing the Active green. */
.nsd-sr-only{
  position:absolute!important;width:1px;height:1px;
  padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0
}

#v-verify .result[data-standing]{--st-tint:#F1F3F5;--st-ink:var(--muted);--st-line:var(--line)}
#v-verify .result[data-standing="active"] {--st-tint:#E8F3EE;--st-ink:#1F6448;--st-line:#B2D3C1}
#v-verify .result[data-standing="lapsed"] {--st-tint:#F2F0EA;--st-ink:#6B5A38;--st-line:#DED6C4}
#v-verify .result[data-standing="revoked"]{--st-tint:#F7E9E9;--st-ink:var(--stop);--st-line:#E2BEBE}
#v-verify .result[data-standing="none"],
#v-verify .result.nomatch{--st-tint:#F1F3F5;--st-ink:#5A6672;--st-line:#DCE1E6}

#v-verify .result .badge{
  background:var(--st-tint)!important;
  color:var(--st-ink)!important;
  box-shadow:inset 0 0 0 1px var(--st-line);
  border-radius:999px
}
#v-verify .result::before{background:var(--st-line)!important}

/* the refusal reads as a refusal, not a broken success */
#v-verify .result.nomatch .avatar{
  background:#EDF0F3;color:#5A6672;
  box-shadow:inset 0 0 0 1px #DCE1E6
}
#v-verify .result.nomatch .res-head b{color:#37424D}
#v-verify .result.nomatch .res-grid strong{color:#8A949E}

/* ---------- the supplied white mark, on navy, with no disc ---------- */
.seal-white{
  background:none!important;
  border-radius:0!important;
  box-shadow:none!important;
  object-fit:contain
}
header .seal-white{width:46px;height:46px;flex-basis:46px}
footer .seal-white{width:52px;height:52px}
@media(max-width:400px){header .seal-white{width:36px;height:36px;flex-basis:36px}}

/* ---------- the flat gold mark in the closing band ---------- */
.nsd-gold-flat{
  display:block;
  width:clamp(112px,11vw,164px);
  height:auto;
  margin:0 auto clamp(30px,3.6vw,44px);
  filter:drop-shadow(0 14px 30px rgba(0,0,0,.45));
  animation:none
}

/* ---------- hero: white mark on navy, no photographic backdrop ---------- */
.hero{
  background:linear-gradient(152deg,var(--navy-900) 0%,var(--navy) 54%,#123C6B 100%)!important
}
.hero .hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:clamp(30px,5vw,76px)
}
.hero .hero-mark{
  position:relative;
  display:grid;place-items:center;
  width:clamp(200px,25vw,340px);
  aspect-ratio:1
}
.hero .hero-mark img{
  width:100%;height:100%;
  object-fit:contain;
  background:none!important;
  border-radius:0!important;
  box-shadow:none!important;
  filter:drop-shadow(0 20px 46px rgba(0,0,0,.45))
}
@media(max-width:860px){
  .hero .hero-grid{grid-template-columns:minmax(0,1fr);justify-items:start}
  .hero .hero-mark{order:-1;width:clamp(140px,34vw,200px);margin-bottom:8px}
}

/* the hero mark, 20% larger */
.hero .hero-mark{width:clamp(240px,30vw,408px)}
@media(max-width:860px){
  .hero .hero-mark{width:clamp(168px,41vw,240px)}
}

/* ---------- registry: opening soon ---------- */
.soon{
  margin-top:38px;
  padding:clamp(30px,3.6vw,46px);
  border-radius:20px;
  background:#fff;
  box-shadow:0 1px 2px rgba(6,26,46,.05),0 12px 34px rgba(6,26,46,.06);
  max-width:760px
}
.soon-tag{
  margin:0 0 14px;
  display:inline-block;
  padding:5px 13px;
  border-radius:999px;
  background:#F2EEE4;
  color:#8A6420;
  font-size:.66rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase
}
.soon h3{
  margin:0 0 16px;
  font-family:var(--serif);
  font-size:clamp(1.4rem,2.5vw,1.95rem);
  font-weight:500;line-height:1.2;letter-spacing:-.018em;
  color:var(--navy)
}
.soon-body{
  margin:0 0 14px;
  max-width:58ch;
  color:#55636F;
  line-height:1.62
}
.soon-body:last-of-type{margin-bottom:26px}
.soon-actions{display:flex;flex-wrap:wrap;gap:12px}
@media(max-width:560px){
  .soon-actions .btn{width:100%}
}

/* the hidden attribute loses to display:grid / display:flex on the same
   element, so it needs to be asserted */
[hidden]{display:none!important}

/* ---------- registry notice: use the full measure ----------
   The card was capped at 760px, which left a third of the container
   empty on the right. It now runs the full width with the reason on
   the left and the route that works today on the right. */
.soon{
  max-width:none;
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(260px,.72fr);
  gap:clamp(28px,4.5vw,64px);
  align-items:start
}
.soon-main{min-width:0}
.soon-side{
  min-width:0;
  padding-left:clamp(0px,2.5vw,34px);
  border-left:1px solid var(--line)
}
.soon-side-title{
  margin:0 0 12px;
  font-size:.68rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;
  color:var(--muted)
}
.soon-side .soon-body{margin-bottom:22px;max-width:36ch}
.soon-actions{flex-direction:column;align-items:stretch;gap:10px}
.soon-actions .btn{width:100%}

@media(max-width:860px){
  .soon{grid-template-columns:minmax(0,1fr);gap:28px}
  .soon-side{padding-left:0;border-left:0;border-top:1px solid var(--line);padding-top:26px}
  .soon-actions{flex-direction:row;flex-wrap:wrap}
  .soon-actions .btn{width:auto}
}
@media(max-width:560px){
  .soon-actions .btn{width:100%}
}

/* ---------- newsroom index ---------- */
.cat-bar,.cat-chips{
  display:flex;flex-wrap:wrap;gap:10px;
  margin:32px 0 0;padding-bottom:30px;
  border-bottom:1px solid var(--line)
}
.cat-chips{border-bottom:0;padding-bottom:0}
.cat-chip{
  padding:8px 16px;
  border:1px solid #E2E7EC;border-radius:999px;background:#fff;
  color:var(--navy);font-family:var(--sans);font-size:.83rem;font-weight:500;
  cursor:pointer;transition:border-color .16s ease,background .16s ease,color .16s ease
}
.cat-chip:hover{border-color:var(--bronze)}
.cat-chip.is-active{background:var(--navy);border-color:var(--navy);color:#fff}

.bgrid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:26px;
  margin-top:34px
}
.bpost{
  display:grid;
  grid-template-rows:auto 1fr;
  align-content:stretch;
  gap:0;
  padding:0;
  overflow:hidden;
  border-radius:18px;background:#fff;
  box-shadow:0 1px 2px rgba(6,26,46,.05),0 10px 30px rgba(6,26,46,.06);
  transition:transform .28s cubic-bezier(.22,.61,.36,1),box-shadow .28s cubic-bezier(.22,.61,.36,1)
}
.bpost:hover{
  transform:translateY(-3px);
  box-shadow:0 2px 4px rgba(6,26,46,.06),0 18px 44px rgba(6,26,46,.11)
}
.bpost-art{
  display:block;
  aspect-ratio:16 / 10;
  background:linear-gradient(160deg,#071A33 0%,#0C2748 55%,#12345C 100%);
  overflow:hidden;
  text-decoration:none
}
.bpost-art img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .45s cubic-bezier(.22,.61,.36,1)
}
.bpost:hover .bpost-art img{transform:scale(1.035)}
.bpost-art.is-empty{
  display:grid;
  place-items:center
}
.bpost-art.is-empty img{
  width:min(88px,28%);
  height:auto;
  object-fit:contain;
  opacity:.9;
  transform:none
}
.bpost:hover .bpost-art.is-empty img{transform:none}
.bpost-copy{
  display:grid;
  gap:10px;
  align-content:start;
  padding:22px 24px 24px;
  min-width:0
}
.bpost-meta{
  display:flex;flex-wrap:wrap;gap:10px;align-items:center;
  margin:0;font-size:.68rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase
}
.bpost-cat{color:#8A6420}
.bpost-date{color:var(--muted)}
.bpost h3{
  margin:0;font-family:var(--serif);font-size:1.2rem;font-weight:500;
  line-height:1.28;letter-spacing:-.01em;color:var(--navy)
}
.bpost h3 a{
  color:inherit;text-decoration:none
}
.bpost h3 a:hover{color:var(--bronze)}
.bpost-body{margin:0;color:#55636F;font-size:.95rem;line-height:1.55}
.bpost .more{margin-top:auto;padding-top:8px}
.bempty{margin-top:34px;color:var(--muted)}

/* ---------- grade pages ---------- */
.gfact{display:grid;gap:8px;align-content:start}
.gfact small{
  font-size:.66rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--muted)
}
.gfact p{
  margin:0;font-family:var(--serif);font-size:1.15rem;
  line-height:1.35;color:var(--navy)
}

/* a rung is now a route */
.rung-link{cursor:pointer;transition:background .18s ease}
.rung-link:hover{background:rgba(199,154,78,.07)}
.rung-link:hover b{color:var(--bronze)}
.grade-link{cursor:pointer;border-bottom:1px solid rgba(199,154,78,.5)}
.grade-link:hover{color:var(--bronze)}
.grade-note{margin-top:14px;color:#55636F;font-size:1rem}

/* ---------- grouped navigation ---------- */
nav.main{gap:clamp(8px,1.4vw,22px)}
.navgroup{position:relative}

.navtop{
  display:inline-flex;align-items:center;gap:7px;
  padding:8px 2px;
  border:0;background:none;
  color:rgba(255,255,255,.86);
  font-family:var(--sans);font-size:.87rem;font-weight:400;
  white-space:nowrap;cursor:pointer;
  border-bottom:2px solid transparent;
  transition:color .16s ease,border-color .16s ease
}
.navtop::after{
  content:"";
  width:5px;height:5px;
  border-right:1.5px solid currentColor;
  border-bottom:1.5px solid currentColor;
  transform:rotate(45deg) translate(-1px,-1px);
  opacity:.65;
  transition:transform .2s ease
}
.navtop:hover{color:#fff;border-color:var(--gold-hi)}
/* "Updates" is an anchor, not a button, because the newsroom is a real page.
   The client's own `nav.main a` rule is more specific than `.navtop` and was
   winning on padding, so the one link sat a couple of pixels off its
   neighbours. This restates the button's geometry for it. */
nav.main a.navtop{
  display:inline-flex;align-items:center;gap:7px;
  padding:8px 2px;text-decoration:none;
  color:rgba(255,255,255,.86);
  border-bottom:2px solid transparent
}
nav.main a.navtop:hover{color:#fff;border-color:var(--gold-hi)}

.navgroup.is-open .navtop{color:#fff;border-color:var(--gold-hi)}
.navgroup.is-open .navtop::after{transform:rotate(225deg) translate(-2px,-2px)}
.navgroup.is-current .navtop{color:#fff;border-color:var(--gold-hi)}

.navmenu{
  position:absolute;top:calc(100% + 12px);left:-14px;z-index:80;
  min-width:238px;
  display:none;
  padding:10px;
  border-radius:14px;
  background:#fff;
  box-shadow:0 2px 6px rgba(6,26,46,.1),0 22px 54px rgba(6,26,46,.24)
}
.navgroup.is-open .navmenu{display:block}
.navmenu::before{
  content:"";position:absolute;top:-14px;left:0;right:0;height:14px
}
.navmenu a{
  display:block;
  padding:10px 13px;
  border-radius:9px;
  color:var(--navy);
  font-size:.89rem;line-height:1.3;
  white-space:nowrap;cursor:pointer;
  transition:background .14s ease,color .14s ease
}
.navmenu a:hover{background:#F4F1EA;color:var(--navy)}
.navmenu a:focus-visible{background:#F4F1EA}

/* once the burger takes over the groups stack open, no nested tapping */
@media(max-width:1010px){
  nav.main{gap:0}
  .navgroup{width:100%}
  .navtop{
    width:100%;justify-content:space-between;
    padding:15px 0;
    border-bottom:1px solid var(--line-dark);
    font-size:1rem
  }
  .navtop::after{opacity:.5}
  .navmenu{
    position:static;display:none;
    min-width:0;padding:6px 0 12px;
    background:none;box-shadow:none;border-radius:0
  }
  .navgroup.is-open .navmenu{display:block}
  .navmenu a{
    color:rgba(255,255,255,.82);
    padding:11px 14px;white-space:normal
  }
  .navmenu a:hover{background:rgba(255,255,255,.08);color:#fff}
}

/* ==========================================================
   Mega menu.
   The panel was rendering blank because the template's
   `nav.main a` rule (0,1,2) outranked `.navmenu a` (0,1,1) and
   painted the links white on white. Every rule below is scoped
   under nav.main so it wins on specificity, not on order.
   ========================================================== */

nav.main .navmenu{
  position:absolute;top:calc(100% + 14px);left:50%;z-index:80;
  width:min(760px,calc(100vw - 56px));
  transform:translateX(-50%);
  display:none;
  padding:0;
  border-radius:16px;
  background:#fff;
  box-shadow:0 2px 8px rgba(6,26,46,.12),0 28px 64px rgba(6,26,46,.28);
  overflow:hidden
}
nav.main .navmenu.is-wide{width:min(1080px,calc(100vw - 56px))}
nav.main .navgroup.is-open .navmenu{display:block}

.mega-inner{
  display:grid;
  grid-template-columns:minmax(0,.7fr) minmax(0,2fr);
  min-height:100%
}

/* the lead column: the mark, the group, one line of what it is */
.mega-lead{
  padding:30px 28px;
  background:linear-gradient(165deg,#0A2647 0%,#061733 100%);
  color:#fff
}
.mega-mark{
  display:block;width:56px;height:56px;
  object-fit:contain;margin-bottom:18px;
  filter:drop-shadow(0 8px 18px rgba(0,0,0,.4))
}
.mega-label{
  margin:0 0 10px;
  font-size:.66rem;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;
  color:var(--gold-hi)
}
.mega-lead-text{
  margin:0;
  font-family:var(--serif);font-size:1.12rem;line-height:1.3;
  letter-spacing:-.01em;color:#fff
}

/* the links */
.mega-links{
  display:grid;align-content:start;
  gap:2px;padding:18px
}
.mega-links.is-two{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:10px}

nav.main .mega-links a{
  display:block;
  padding:11px 14px;
  border:0;border-radius:10px;
  color:var(--navy);
  white-space:normal;
  cursor:pointer;
  transition:background .14s ease
}
nav.main .mega-links a:hover{background:#F4F1EA;border-color:transparent}
nav.main .mega-links a:focus-visible{background:#F4F1EA}
nav.main .mega-links a b{
  display:block;
  font-family:var(--sans);font-size:.92rem;font-weight:600;
  line-height:1.25;color:var(--navy)
}
nav.main .mega-links a span{
  display:block;margin-top:3px;
  font-size:.8rem;line-height:1.4;color:#55636F
}

/* stacked accordion once the burger takes over */
@media(max-width:1010px){
  nav.main .navmenu,
  nav.main .navmenu.is-wide{
    position:static;width:auto;transform:none;
    background:none;box-shadow:none;border-radius:0;
    padding:4px 0 12px
  }
  .mega-inner{grid-template-columns:minmax(0,1fr)}
  .mega-lead{display:none}
  .mega-links,.mega-links.is-two{grid-template-columns:minmax(0,1fr);padding:0;gap:0}
  nav.main .mega-links a{padding:12px 14px;border-radius:8px}
  nav.main .mega-links a b{color:#fff;font-weight:500;font-size:.95rem}
  nav.main .mega-links a span{color:rgba(255,255,255,.6)}
  nav.main .mega-links a:hover{background:rgba(255,255,255,.08)}
}

/* the lead column sat at almost the same navy as the hero behind it, so the
   panel's left half dissolved into the page. Darken it, edge the panel, and
   put a gold hairline on the seam. */
nav.main .navmenu{
  box-shadow:
    0 0 0 1px rgba(6,26,46,.1),
    0 2px 8px rgba(6,26,46,.14),
    0 30px 70px rgba(6,26,46,.34)
}
.mega-lead{
  position:relative;
  background:linear-gradient(165deg,#05142B 0%,#020A16 100%)
}
.mega-lead::after{
  content:"";
  position:absolute;top:0;right:0;bottom:0;
  width:1px;
  background:linear-gradient(180deg,transparent,rgba(199,154,78,.55) 22%,rgba(199,154,78,.55) 78%,transparent)
}
@media(max-width:1010px){.mega-lead::after{display:none}}

/* ---------- newsroom article ---------- */
.article{max-width:760px}
.backlink{
  display:inline-block;margin-bottom:26px;
  font-size:.86rem;font-weight:500;color:var(--navy);
  cursor:pointer;border-bottom:1px solid rgba(199,154,78,.5);padding-bottom:2px
}
.backlink:hover{color:var(--bronze)}
.article-meta{
  display:flex;flex-wrap:wrap;gap:10px;align-items:center;
  margin:0 0 14px;font-size:.68rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase
}
.article h2{max-width:20ch}
.article-stand{
  margin:18px 0 0;max-width:56ch;
  font-size:1.16rem;line-height:1.55;color:#41505E
}
.article-body{
  margin-top:34px;padding-top:28px;
  border-top:1px solid var(--line)
}
.article-pending{
  margin:0;max-width:54ch;
  color:#55636F;line-height:1.62
}
#v-blog .bpost{cursor:pointer}

/* ---------- registry notice: single column again ----------
   The "What works today" side panel is gone; the card keeps the
   full container width while the prose holds a readable measure. */
.soon{
  display:block;
  padding:clamp(30px,3.4vw,44px) clamp(30px,3.4vw,46px)
}
.soon-main{max-width:none}
.soon .soon-body{max-width:62ch}
.soon-actions{
  flex-direction:row;flex-wrap:wrap;
  gap:12px;margin-top:26px
}
.soon-actions .btn{width:auto}
@media(max-width:560px){
  .soon-actions .btn{width:100%}
}

/* with the state key gone, the heading block takes the full measure */
#v-verify .verify-head{grid-template-columns:minmax(0,1fr)}

/* ---------- application form ---------- */
.aform{display:grid;gap:34px;max-width:860px}
.afield{
  margin:0;padding:30px 30px 28px;
  border:0;border-radius:18px;background:#fff;
  box-shadow:0 1px 2px rgba(6,26,46,.05),0 10px 30px rgba(6,26,46,.05)
}
.afield legend{
  padding:0;margin-bottom:20px;
  font-family:var(--serif);font-size:1.2rem;font-weight:500;color:var(--navy)
}
.agrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.aform label{
  display:grid;gap:8px;
  font-size:.72rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--muted)
}
.aform label em{
  font-style:normal;color:#8A6420;letter-spacing:.1em;margin-left:6px;font-size:.62rem
}
.aform input[type="text"],.aform input[type="email"],.aform input[type="url"],
.aform select{
  padding:13px 15px;
  border:1px solid #E2E7EC;border-radius:11px;background:#fff;
  font-family:var(--sans);font-size:.97rem;color:var(--ink);
  letter-spacing:0;text-transform:none;font-weight:400
}
.aform input:focus,.aform select:focus{
  outline:none;border-color:var(--bronze);
  box-shadow:0 0 0 4px rgba(176,141,87,.16)
}
.ahint{
  margin:0 0 16px;font-size:.85rem;color:#55636F;
  letter-spacing:0;text-transform:none;font-weight:400
}

/* track choice */
.atracks{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin-bottom:20px}
.atrack{
  display:flex;gap:12px;align-items:flex-start;
  padding:16px 18px;
  border:1px solid #E2E7EC;border-radius:14px;cursor:pointer;
  transition:border-color .16s ease,background .16s ease
}
.atrack:hover{border-color:var(--bronze)}
.atrack input{margin-top:3px;accent-color:var(--navy)}
.atrack span{display:grid;gap:4px}
.atrack b{
  font-family:var(--sans);font-size:.95rem;font-weight:600;color:var(--navy);
  letter-spacing:0;text-transform:none
}
.atrack small{
  font-size:.83rem;color:#55636F;line-height:1.45;
  letter-spacing:0;text-transform:none;font-weight:400
}
.atrack:has(input:checked){border-color:var(--navy);background:#F7F5F0}
.agrade{max-width:340px}

/* domains */
.adomains{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:10px}
.adomain{
  display:flex;gap:11px;align-items:center;
  padding:12px 14px;
  border:1px solid #E2E7EC;border-radius:11px;cursor:pointer;
  font-size:.9rem;font-weight:400;color:var(--ink);
  letter-spacing:0;text-transform:none;
  transition:border-color .16s ease,background .16s ease
}
.adomain:hover{border-color:var(--bronze)}
.adomain input{accent-color:var(--navy)}
.adomain:has(input:checked){border-color:var(--navy);background:#F7F5F0}

/* uploads */
.afile input[type="file"]{
  padding:11px 14px;
  border:1px dashed #CBD4DD;border-radius:11px;background:#FBFAF8;
  font-family:var(--sans);font-size:.86rem;color:#55636F;
  letter-spacing:0;text-transform:none;font-weight:400;cursor:pointer
}
.afile input[type="file"]::file-selector-button{
  margin-right:12px;padding:7px 14px;
  border:0;border-radius:999px;background:var(--navy);color:#fff;
  font-family:var(--sans);font-size:.8rem;font-weight:500;cursor:pointer
}
.afile-name{
  font-size:.8rem;color:var(--muted);
  letter-spacing:0;text-transform:none;font-weight:400
}

.aactions{display:grid;gap:14px;justify-items:start}
.aform-note{margin:0;font-size:.92rem;min-height:1.2em}

@media(max-width:560px){
  .afield{padding:24px 20px}
  .aactions .btn{width:100%}
}

/* `.aform label` is 0,2,0 and was outranking `.adomain` / `.atrack` at
   0,1,0, so the chips inherited the uppercase field-label treatment and
   the grid display that stacked the box above its text. Match the weight. */
.aform .adomain{
  display:flex;align-items:center;gap:11px;
  font-size:.9rem;font-weight:400;color:var(--ink);
  letter-spacing:0;text-transform:none;line-height:1.35
}
.aform .atrack{display:flex;align-items:flex-start;gap:12px}
.aform .atrack span{display:grid;gap:4px}
.aform .ahint{
  letter-spacing:0;text-transform:none;font-weight:400;color:#55636F
}

/* the native control already says "No file chosen"; only speak when there
   is something to say */
.afile-name:empty{display:none}

/* the gold falcon is withdrawn from the grades section */
.home-falcon{display:none!important}

/* ---------- article: proper editorial layout ---------- */
.wrap.wide{max-width:1180px}
.article-art{
  margin:40px 0 8px;
  border-radius:18px;overflow:hidden;
  box-shadow:0 1px 2px rgba(6,26,46,.06),0 16px 40px rgba(6,26,46,.1)
}
.article-art img{display:block;width:100%;height:auto}
.article-art-caption{
  margin:0;padding:14px 18px 16px;
  background:#F7F4EE;border-top:1px solid var(--line);
  font-family:var(--sans);font-size:.92rem;line-height:1.45;color:#5A6672
}
.event-extra{margin-top:8px}
.event-extra .more{font-weight:500}

.article-body{margin-top:34px;padding-top:0;border-top:0}
.article-lead{
  margin:0 0 26px;max-width:58ch;
  font-size:1.14rem;line-height:1.6;color:#41505E
}
.article-sub{
  margin:34px 0 14px;
  font-family:var(--serif);font-size:1.34rem;font-weight:500;
  letter-spacing:-.012em;color:var(--navy)
}
.article-body p{max-width:58ch;line-height:1.72;color:#3C4A57;margin-bottom:18px}
.article-quote{
  margin:32px 0;padding:4px 0 4px 26px;
  border-left:3px solid var(--bronze);
  max-width:50ch;
  font-family:var(--serif);font-size:1.3rem;line-height:1.36;
  letter-spacing:-.012em;color:var(--navy);font-style:normal
}
.article-facts{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:1px;margin:34px 0 0;
  background:var(--line);border-block:1px solid var(--line)
}
.article-facts div{display:grid;gap:6px;padding:20px 22px 22px 0;background:var(--paper)}
.article-facts small{
  font-size:.64rem;font-weight:600;
  letter-spacing:.15em;text-transform:uppercase;color:var(--muted)
}
.article-facts span{
  font-family:var(--serif);font-size:1.06rem;line-height:1.3;color:var(--navy)
}
.article-draft{
  margin-top:30px;padding-top:16px;
  border-top:1px solid var(--line);
  font-size:.8rem;color:#8A949E;letter-spacing:.02em
}
@media(max-width:560px){
  .article-facts div{padding:16px 16px 18px 0}
}

/* the facts grid used a background-bleed for its rules, which left empty
   cells painting as grey blocks on the last row; rule each cell instead */
.article-facts{
  background:transparent;
  gap:0 34px;
  border-bottom:0
}
.article-facts div{
  background:transparent;
  padding:18px 0 20px;
  border-top:1px solid var(--line)
}

/* event rows are routes */
.ev.is-actionable,.sched-row.is-actionable{cursor:pointer;transition:background .16s ease}
.ev.is-actionable:hover,.sched-row.is-actionable:hover{background:rgba(199,154,78,.06)}
.ev.is-actionable:hover h3,.sched-row.is-actionable:hover .nm{color:var(--bronze)}

/* ---------- application form: one centred column ---------- */
#v-apply .wrap{max-width:920px}
.aform{max-width:none}

/* A fieldset legend is laid out against the border box, not inside the
   padding, so every section title was sitting on the card's top edge.
   Floating it puts it back in normal flow. */
.afield legend{float:left;width:100%;margin-bottom:22px}
.afield legend + *{clear:both}

/* The label was a grid, so "required" was dropping onto its own row
   under the field name. Kept off the chips, which are labels too. */
.aform label:not(.adomain):not(.atrack){display:block}
.aform label:not(.adomain):not(.atrack) > input,
.aform label:not(.adomain):not(.atrack) > select{display:block;width:100%;margin-top:9px}
.aform label em{margin-left:8px}

/* the upload sits as a full-width dropzone under its label */
.afile input[type="file"]{display:block;width:100%;margin-top:9px}

/* The form selects were still drawing the browser's own chevron, which
   sits hard against the right edge. Same custom mark as the filters. */
.aform select,#v-about .cform-on-dark select{
  -webkit-appearance:none;
  appearance:none;
  padding-right:44px;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%23B08D57' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 17px center;
  background-size:11px 7px
}

/* programs filter sits between the lede and the cards */
.pfilter{margin-top:34px;padding-bottom:26px}
.pfilter-empty{margin:26px 0 0;color:var(--muted);font-size:.95rem}
/* a flat nav item has no panel, so it needs no caret */
.navgroup.is-flat .navtop::after{display:none}

/* ---------- utility bar: what is next ---------- */
.utility .wrap{gap:22px;flex-wrap:nowrap}
.uev-label{
  display:inline-flex;align-items:center;gap:8px;flex:none;
  color:var(--bronze-soft);font-weight:500;letter-spacing:.08em;text-transform:uppercase;
  font-size:.66rem;white-space:nowrap
}
.uev-cal{width:13px;height:13px;fill:none;stroke:var(--bronze);stroke-width:1.3;stroke-linecap:round}
.uev-mask{
  flex:1;min-width:0;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 26px,#000 calc(100% - 26px),transparent);
  mask-image:linear-gradient(90deg,transparent,#000 26px,#000 calc(100% - 26px),transparent)
}
.uev-track{display:flex;width:max-content;animation:uev-run 40s linear infinite}
.uev-run{display:flex;align-items:center;gap:14px;padding-right:14px}
.uev-mask:hover .uev-track,.uev-track:focus-within{animation-play-state:paused}
@keyframes uev-run{to{transform:translateX(-50%)}}
.uev-item{
  /* These are anchors now, not buttons: real links to /events/<slug>.
     Anchors underline and buttons do not, hence the reset. */
  display:inline-block;text-decoration:none;
  padding:8px 0;border:0;background:none;cursor:pointer;
  font-family:var(--sans);font-size:.73rem;letter-spacing:.02em;
  color:rgba(255,255,255,.62);white-space:nowrap;
  transition:color .16s ease
}
.uev-item:hover{color:#fff}
.uev-date{color:var(--bronze-soft);margin-right:8px}
.uev-sep{color:rgba(255,255,255,.26)}
.uev-all{
  display:inline-block;text-decoration:none;
  flex:none;padding:8px 0;border:0;background:none;cursor:pointer;
  font-family:var(--sans);font-size:.73rem;color:var(--bronze-soft);white-space:nowrap;
  transition:color .16s ease
}
.uev-all:hover{color:#fff}
.uev-item:focus-visible,.uev-all:focus-visible{outline:2px solid var(--bronze);outline-offset:3px}

@media(prefers-reduced-motion:reduce){
  .uev-track{animation:none}
  .uev-mask{overflow-x:auto}
  .uev-mask::-webkit-scrollbar{display:none}
  .uev-track [data-clone]{display:none}
}
@media(max-width:700px){
  .uev-label span,.uev-all{display:none}
  .utility .wrap{gap:12px}
}

/* the full-calendar CTA */
.btn.btn-cal{
  display:inline-flex;align-items:center;gap:10px;
  padding:15px 28px;font-size:.95rem;letter-spacing:.01em
}
.btn-cal-icon{
  width:16px;height:16px;flex:none;
  fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round
}

/* the calendar CTA is centred under the schedule it belongs to */
#v-home .sched + div:has(.btn-cal),
.sched + div:has(.btn-cal){text-align:center;margin-top:34px}

/* ---------- hero seal as a route into About ---------- */
.hero .heromark{
  display:grid;justify-items:center;gap:20px;
  padding:0;border:0;background:none;color:inherit;font:inherit;
  cursor:pointer;-webkit-tap-highlight-color:transparent
}
.hero .heromark .hero-mark{
  transition:transform .34s cubic-bezier(.2,.7,.3,1),filter .34s ease
}
.hero .heromark:hover .hero-mark{transform:translateY(-5px) scale(1.015)}
.heromark-cap{display:grid;gap:9px;justify-items:center;text-align:center}
.heromark-name{
  font-family:var(--sans);font-size:.66rem;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;color:var(--bronze-soft)
}
.heromark-go{
  display:inline-flex;align-items:center;gap:9px;
  padding:9px 20px;border:1px solid rgba(255,255,255,.22);border-radius:999px;
  font-family:var(--sans);font-size:.85rem;color:rgba(255,255,255,.8);
  transition:border-color .2s ease,background .2s ease,color .2s ease
}
.hero .heromark:hover .heromark-go{
  border-color:var(--bronze);background:rgba(176,141,87,.12);color:#fff
}
.heromark-go i{font-style:normal;transition:transform .24s ease}
.hero .heromark:hover .heromark-go i{transform:translateX(4px)}
.hero .heromark:focus-visible{outline:2px solid var(--bronze);outline-offset:10px;border-radius:20px}
@media(max-width:860px){
  .hero .heromark{order:-1;justify-self:start;justify-items:start;gap:16px;margin-bottom:10px}
  .heromark-cap{justify-items:start;text-align:left}
}
@media(prefers-reduced-motion:reduce){
  .hero .heromark .hero-mark,.heromark-go,.heromark-go i{transition:none}
  .hero .heromark:hover .hero-mark{transform:none}
}

/* ---------- the utility strip stays put ----------
   It carries the schedule now, so scrolling past the first 38px
   should not take it away. It docks above the header, and the
   header sticks below it rather than under it. */
@media(min-width:761px){
  .utility{position:sticky;top:0;z-index:61}
  header{top:var(--util-h,38px)}
}

/* ==========================================================
   LEVEL PAGES
   One template for the seven grades and the membership page.
   "At a glance" is a fact panel pinned to the right on desktop
   and stacked under the hero on mobile, per the brief.
   ========================================================== */
.lv-hero{
  background:var(--navy-900);color:#fff;
  padding:44px 0 66px;
  background-image:radial-gradient(120% 80% at 78% 0%,rgba(176,141,87,.16),transparent 60%)
}
.lv-hero .backlink{color:rgba(255,255,255,.6);margin-bottom:26px;display:inline-block}
.lv-hero .backlink:hover{color:#fff}
.lv-hero .eyebrow{color:var(--bronze-soft)}
.lv-headline{
  margin:14px 0 0;max-width:17ch;
  font-family:var(--serif);font-weight:400;color:#fff;
  font-size:clamp(2.3rem,4.6vw,3.5rem);line-height:1.06;letter-spacing:-.02em;
  text-wrap:balance
}
.lv-stand{
  margin:22px 0 0;max-width:62ch;
  font-size:clamp(1.02rem,1.35vw,1.16rem);line-height:1.62;color:rgba(255,255,255,.8)
}
.lv-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.lv-hero .btn-out{border-color:rgba(255,255,255,.3);color:#fff}
.lv-hero .btn-out:hover{border-color:var(--bronze);background:rgba(176,141,87,.14)}
.lv-detail{
  margin:22px 0 0;font-size:.85rem;letter-spacing:.02em;color:rgba(255,255,255,.55)
}

.lv-body{padding-top:60px}
.lv-grid{
  display:grid;grid-template-columns:minmax(0,1fr) 310px;
  gap:clamp(34px,5vw,72px);align-items:start
}
.lv-main{min-width:0}

/* the fact panel */
.lv-glance{
  position:sticky;top:150px;
  padding:26px 26px 22px;border-radius:18px;background:#fff;
  box-shadow:0 1px 2px rgba(6,26,46,.05),0 10px 30px rgba(6,26,46,.06)
}
.lv-glance h4{
  margin:0 0 16px;font-family:var(--sans);font-size:.66rem;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;color:var(--bronze)
}
.lv-glance dl{margin:0;display:grid;gap:14px}
.lv-glance dl > div{display:grid;gap:3px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.lv-glance dl > div:last-child{border-bottom:0;padding-bottom:0}
.lv-glance dt{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.lv-glance dd{margin:0;font-size:.93rem;line-height:1.45;color:var(--ink)}

/* sections */
.lv-section{margin-bottom:46px}
.lv-h{
  display:flex;align-items:baseline;gap:14px;
  margin:0 0 18px;font-family:var(--serif);font-weight:400;
  font-size:clamp(1.35rem,2.1vw,1.72rem);line-height:1.2;color:var(--navy)
}
.lv-sub{
  margin:26px 0 12px;font-family:var(--sans);font-size:.98rem;font-weight:600;color:var(--navy)
}
.lv-main p{margin:0 0 14px;font-size:1rem;line-height:1.68;color:#3D4A57;max-width:70ch}
.lv-list{margin:0 0 16px;padding:0;list-style:none;display:grid;gap:9px;max-width:70ch}
.lv-list li{
  position:relative;padding-left:22px;font-size:.98rem;line-height:1.6;color:#3D4A57
}
.lv-list li::before{
  content:"";position:absolute;left:2px;top:.62em;
  width:6px;height:6px;border-radius:50%;background:var(--bronze)
}

/* tables inside a level page */
.lv-tablewrap{overflow-x:auto;margin:0 0 20px;border-radius:14px;border:1px solid var(--line)}
.lv-table{width:100%;border-collapse:collapse;font-size:.92rem;min-width:420px}
.lv-table th{
  padding:12px 16px;text-align:left;background:#FBFAF8;
  font-family:var(--sans);font-size:.7rem;font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;color:var(--muted);
  border-bottom:1px solid var(--line)
}
.lv-table td{padding:13px 16px;border-bottom:1px solid var(--line);color:#3D4A57;vertical-align:top}
.lv-table tr:last-child td{border-bottom:0}
.lv-table .lv-k{color:var(--navy);font-weight:500;white-space:nowrap}

/* the routes component: one, two or three */
.lv-routes{display:grid;gap:16px;margin:0 0 34px}
.lv-routes-2,.lv-routes-3{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.lv-route{
  padding:24px 24px 10px;border-radius:18px;background:#fff;
  box-shadow:0 1px 2px rgba(6,26,46,.05),0 10px 30px rgba(6,26,46,.05)
}
.lv-route-tag{
  display:inline-block;margin-bottom:10px;
  font-family:var(--sans);font-size:.64rem;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;color:var(--bronze)
}
.lv-route h4{
  margin:0 0 12px;font-family:var(--serif);font-weight:400;
  font-size:1.14rem;line-height:1.3;color:var(--navy)
}
.lv-route .lv-tablewrap{margin-top:16px}

/* the four shared blocks */
.lv-standard{display:grid;gap:2px;margin:52px 0 46px;border-top:1px solid var(--line)}
.lv-std{padding:24px 0;border-bottom:1px solid var(--line)}
.lv-std h4{
  margin:0 0 8px;font-family:var(--sans);font-size:.7rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--muted)
}
.lv-std p{margin:0;max-width:70ch}
/* S4 must not be missable: the credential is free to keep */
.lv-std.is-key{
  margin-top:10px;padding:26px 28px;border:0;border-radius:16px;
  background:#FBF6EC;box-shadow:inset 0 0 0 1px rgba(176,141,87,.28)
}
.lv-std.is-key h4{color:var(--bronze)}
.lv-std.is-key p{color:var(--navy)}

/* frequently asked */
.lv-faq{margin-top:8px}
.lv-q{border-bottom:1px solid var(--line);padding:2px 0}
.lv-q summary{
  padding:15px 0;cursor:pointer;list-style:none;
  font-size:.99rem;font-weight:500;color:var(--navy);
  display:flex;align-items:center;justify-content:space-between;gap:16px
}
.lv-q summary::-webkit-details-marker{display:none}
.lv-q summary::after{
  content:"+";flex:none;color:var(--bronze);font-size:1.1rem;line-height:1;transition:transform .2s ease
}
.lv-q[open] summary::after{transform:rotate(45deg)}
.lv-q p{margin:0 0 15px}

.lv-quiet{margin-top:30px}
.lv-closing{text-align:left}
.lv-closing h2{margin:0 0 26px}

/* Lancer breaks the template: quieter type, longer measure, more air */
.lv-body.is-conferred{padding-top:74px}
.is-conferred .lv-main p,.is-conferred .lv-list{max-width:74ch}
.is-conferred .lv-section{margin-bottom:58px}

@media(max-width:1010px){
  .lv-grid{grid-template-columns:minmax(0,1fr)}
  .lv-glance{position:static;order:-1;margin-bottom:34px}
}
@media(max-width:560px){
  .lv-hero{padding:32px 0 48px}
  .lv-cta .btn{width:100%;text-align:center}
  .lv-glance{padding:22px 20px}
  .lv-std.is-key{padding:22px 20px}
}

/* the break between Falcon and Lancer: you cannot climb it */
.rung-break{
  display:flex;align-items:center;gap:12px;
  margin:6px 0;padding:0 2px;color:var(--bronze)
}
.rung-break::before,.rung-break::after{
  content:"";flex:1;height:1px;
  background:repeating-linear-gradient(90deg,currentColor 0 4px,transparent 4px 9px);
  opacity:.5
}
.rung-break span{
  font-family:var(--sans);font-size:.62rem;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;white-space:nowrap
}
.ladder .rung[data-go]{cursor:pointer;transition:background .16s ease}
.ladder .rung[data-go]:hover{background:rgba(176,141,87,.08)}
.ladder .rung[data-go]:hover b{color:var(--bronze)}

/* a value the client has still to supply */
.lv-tbc{
  display:inline-block;padding:1px 7px;border-radius:5px;
  background:#FBF1DC;color:#7A5A1E;
  font-family:var(--sans);font-size:.82em;letter-spacing:.01em;white-space:normal
}
.lv-glance .lv-tbc{font-size:.78em}

/* ---------- level pages: chapter rhythm ---------- */
.lv-h{
  display:block;
  margin:0 0 22px
}
.lv-num{display:none}
.lv-section{margin-bottom:56px}
.lv-section:last-child{margin-bottom:0}

.lv-main > .lv-section > p,
.lv-main > .lv-section > .lv-list,
.lv-main > .lv-section > .lv-tablewrap,
.lv-main > .lv-section > .lv-sub{margin-left:0}
.lv-routes{margin-left:0}

.lv-sub{
  margin:30px 0 12px;
  font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted)
}
.lv-sub:first-child{margin-top:0}

.lv-main p{margin:0 0 16px}
.lv-main p:last-child{margin-bottom:0}
.lv-list{gap:13px;margin:0 0 18px}
.lv-list li{padding-left:24px;line-height:1.62}
.lv-list li::before{top:.82em;transform:translateY(-50%)}

.lv-tablewrap{margin:6px 0 22px}

/* the shared blocks and the questions keep the same left edge */
.lv-standard,.lv-faq .lv-q,.lv-quiet{margin-left:0}
.lv-faq .lv-h{margin-bottom:10px}
.lv-standard{margin-top:56px}

@media(max-width:700px){
  .lv-main > .lv-section > p,
  .lv-main > .lv-section > .lv-list,
  .lv-main > .lv-section > .lv-tablewrap,
  .lv-main > .lv-section > .lv-sub,
  .lv-routes,.lv-standard,.lv-faq .lv-q,.lv-quiet{margin-left:0}
  .lv-section{margin-bottom:44px}
}

/* the routes read across, so their comparison sits under all of them */
.lv-compare{margin:0 0 34px}
.lv-compare .lv-table th:first-child{width:1%}
.lv-compare .lv-tablewrap{overflow:visible}
.lv-compare .lv-table{min-width:0;table-layout:fixed;width:100%}
.lv-compare .lv-table th,
.lv-compare .lv-table td{overflow-wrap:anywhere;word-break:break-word}
.lv-compare .lv-table .lv-k{white-space:normal}

/* Route A / B comparison as cards — no horizontal scroll */
.lv-compare-cards{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));
  gap:14px;
  margin:0
}
.lv-compare-card{
  padding:22px 22px 18px;
  border-radius:16px;
  background:#fff;
  border:1px solid var(--line);
  min-width:0
}
.lv-compare-card h4{
  margin:0 0 16px;
  font-family:var(--serif);font-weight:400;
  font-size:1.12rem;line-height:1.3;color:var(--navy)
}
.lv-compare-card dl{margin:0;display:grid;gap:12px}
.lv-compare-card dl > div{
  display:grid;gap:3px;
  padding-bottom:12px;border-bottom:1px solid var(--line)
}
.lv-compare-card dl > div:last-child{border-bottom:0;padding-bottom:0}
.lv-compare-card dt{
  font-family:var(--sans);font-size:.68rem;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:var(--muted)
}
.lv-compare-card dd{
  margin:0;font-size:.92rem;line-height:1.5;color:#3D4A57;
  overflow-wrap:anywhere
}
@media(max-width:700px){.lv-compare{margin-left:0}}

/* .lv-section is a <section>, so the template's own section{padding:98px 0}
   was landing on it and opening ~200px between every block */
.lv-section{padding:0}

/* the ladder graphic inside a level page */
.lv-ladder{margin:0 0 40px}
.lv-ladder .track h4{
  margin:0 0 14px;font-family:var(--sans);font-size:.72rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--muted)
}
/* membership benefits must not read as included with the grade */
.lv-table tr.is-member td{background:#FBFAF8}
.lv-table tr.is-member td:nth-child(2){color:#7A5A1E;font-weight:500}
.lv-cta-inline{margin-top:20px}
@media(max-width:700px){.lv-ladder{margin-left:0}}

/* A page with no fact panel takes the full column: the hub page and the
   membership page were being squeezed into two thirds for nothing. */
.lv-grid.is-single{grid-template-columns:minmax(0,1fr)}
.lv-grid.is-single .lv-main p,
.lv-grid.is-single .lv-list{max-width:78ch}

/* The motion layer sets .rung{opacity:0} and animates it in on scroll.
   Rungs rendered into a level page are never picked up by it, so they
   would sit invisible. */
.lv-ladder .rung{opacity:1!important;transform:none!important}
.lv-ladder{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:clamp(24px,4vw,54px)}
.lv-ladder .rung{padding:13px 0}

/* The motion layer sets visibility:hidden inline as well as opacity, so
   rungs it never animates need both overridden. */
.lv-ladder .rung{visibility:visible!important}

/* the dashed break is withdrawn; Lancer carries the distinction itself */
.rung-break{display:none!important}
.rung-tag{
  display:inline-block;margin-left:10px;padding:2px 8px;
  border:1px solid rgba(176,141,87,.5);border-radius:999px;
  font-family:var(--sans);font-style:normal;font-size:.58rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--bronze);
  vertical-align:middle
}

/* a status pill was pushing the schedule row past the viewport at 320px */
@media(max-width:360px){
  .ev{flex-wrap:wrap}
  .ev .pill{margin-left:0}
  .sched-row,.ev{min-width:0}
  .sched-row .pill,.ev .pill{white-space:nowrap;flex:none}
  #v-events .wrap,#v-events .ev{max-width:100%;overflow-wrap:anywhere}
}

/* external destination inside the home schedule strip */
#v-home .sched-extlink,
.sched-extlink{
  color:var(--bronze) !important;
  font-weight:600;
  text-decoration:underline !important;
  text-underline-offset:3px;
  cursor:pointer;
  pointer-events:auto;
  position:relative;
  z-index:2
}
#v-home .sched-extlink:hover,
.sched-extlink:hover{color:var(--navy) !important}
#v-home .sched-row .nm{max-width:54ch}

/* a word that is also a route */
.xlink{
  color:var(--navy);cursor:pointer;
  border-bottom:1px solid rgba(176,141,87,.55);
  transition:color .15s ease,border-color .15s ease
}
.xlink:hover{color:var(--bronze);border-bottom-color:var(--bronze)}
.xlink:focus-visible{outline:2px solid var(--bronze);outline-offset:2px;border-radius:2px}
.lv-glance .xlink,.lv-table .xlink{border-bottom-color:rgba(176,141,87,.4)}

.lv-table .xlink{border-bottom-color:rgba(176,141,87,.45)}

/* About-page typography stays in the NSD brand layer; its geometry lives in
   the central UI system. */
.about-standing-card p{color:var(--ink)}
.about-person-name{
  display:block;font-family:var(--serif);font-size:1.05rem;color:var(--navy)
}
.about-person-role{font-size:.85rem}

/* an outstanding value: quiet in public, the client's own note in review */
.lv-tbc{
  display:inline;padding:0;border-radius:0;background:none;
  color:var(--muted);font-size:.94em;font-style:normal
}
.lv-tbc-note{display:none}
.nsd-review .lv-tbc-public{display:none}
.nsd-review .lv-tbc-note{
  display:inline-block;padding:1px 7px;border-radius:5px;
  background:#FBF1DC;color:#7A5A1E;font-size:.92em
}
/* a marker that is an instruction, not a value: nothing to show a reader */
.lv-tbc.is-note{display:none}
.nsd-review .lv-tbc.is-note{display:inline}
/* an unfilled name reads as pending, not as a person */
.person .lv-tbc-public,.row .lv-tbc-public{font-style:normal;color:var(--muted)}
/* the rung already says it in words */
.rung-tag{display:none!important}

/* ==========================================================
   FINAL DESIGN-SYSTEM CONVERGENCE
   A consistent editorial rhythm, interaction language and
   responsive surface model across every public view.
   ========================================================== */
:root{
  --space-1:8px;
  --space-2:12px;
  --space-3:16px;
  --space-4:24px;
  --space-5:32px;
  --space-6:48px;
  --space-7:64px;
  --space-8:88px;
  --space-9:112px;
  --page-gutter:clamp(18px,4vw,28px);
  --section-space:clamp(64px,7vw,88px);
  --section-space-tight:clamp(44px,5vw,64px);
  --section-space-feature:clamp(80px,9vw,112px);
  --content-gap:clamp(28px,3vw,36px);
  --grid-gap:clamp(20px,2.2vw,28px);
  --surface-pad:clamp(24px,2.4vw,30px);
  --radius-card:24px;
  --radius-compact:16px;
  --radius-control:999px;
  --surface-border:rgba(10,38,71,.1);
  --surface-shadow:0 1px 2px rgba(6,26,46,.04),0 10px 28px rgba(6,26,46,.055);
  --focus-ring:0 0 0 3px var(--paper),0 0 0 6px rgba(199,154,78,.72)
}

html{scroll-padding-top:128px}
.wrap{padding-inline:var(--page-gutter)}
section{padding-block:var(--section-space)}
.tight{padding-block:var(--section-space-tight)}
.band{padding-block:var(--section-space-feature)}
.grid{gap:var(--grid-gap)}
.lede + .grid,.lede + .ladder,.lede + .sched,.lede + .steps,
.lede + .filters,.lede + table,.lede + .verify-box,.lede + .rail,
.lede + .chapter-map-wrap,h2 + .grid,h2 + .rail,h2 + .sched{
  margin-top:var(--content-gap)
}

/* Surfaces align to one density. Text no longer manufactures empty card height. */
.card{padding:var(--surface-pad)}
.mcard,.chap{padding:var(--surface-pad)}
.bpost{padding:0}
.afield{padding:var(--surface-pad)}
.card p{flex:none}
.card .more{margin-top:auto;padding-top:var(--space-3)}
.card,.mcard,.chap,.post,.bpost,.afield,.lv-route,.lv-glance,.state-key{
  box-shadow:var(--surface-shadow)
}
.card,.mcard,.chap,.post,.bpost{border-radius:var(--radius-card)}
.lv-route,.lv-glance,.lv-panel,.lv-benefit,.lv-outcome-card{
  border-radius:var(--radius-compact)
}
.card h3,.mcard b,.lv-route h4{
  font-family:var(--sans);font-weight:500;letter-spacing:-.012em
}

/* Icon-only menu with a real open/close state. */
.burger{
  width:48px;height:48px;min-width:48px;min-height:48px;padding:0;
  place-items:center;border-radius:50%;
  transition:background .18s ease,border-color .18s ease,color .18s ease
}
.burger:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.62)}
.burger-icon,.burger-icon::before,.burger-icon::after{
  display:block;width:22px;height:2px;border-radius:2px;background:currentColor;
  transition:transform .24s ease,top .24s ease,opacity .16s ease,background .16s ease
}
.burger-icon{position:relative}
.burger-icon::before,.burger-icon::after{content:"";position:absolute;left:0}
.burger-icon::before{top:-7px}
.burger-icon::after{top:7px}
.burger[aria-expanded="true"] .burger-icon{background:transparent}
.burger[aria-expanded="true"] .burger-icon::before{top:0;transform:rotate(45deg)}
.burger[aria-expanded="true"] .burger-icon::after{top:0;transform:rotate(-45deg)}
body.nsd-menu-open{overflow:hidden}

@media(max-width:1010px){
  .burger{display:grid}
  nav.main{
    max-height:calc(100dvh - var(--util-h,0px) - 78px);
    overflow-y:auto;overscroll-behavior:contain;
    padding:var(--space-2) var(--page-gutter) var(--space-4);
    box-shadow:0 22px 48px rgba(2,10,22,.3)
  }
}
@media(min-width:1011px){
  .navtop{padding:9px 10px;border-radius:8px 8px 0 0}
  .navtop:hover,.navgroup.is-open .navtop{
    color:#fff;background:rgba(255,255,255,.075);border-color:transparent
  }
  .navgroup.is-current .navtop{
    color:#fff;background:transparent;border-color:var(--gold-hi)
  }
}

/* Grade names stand on their own; hover uses a quiet padded surface rather
   than a number rail or an inset bar. */
.ladder .rung[data-go]{
  display:block;
  min-height:56px;margin-inline:-16px;padding:14px 16px;border-radius:var(--radius-compact);
  transition:background .18s ease,box-shadow .18s ease,color .18s ease
}
.lv-ladder .rung[data-go]{padding-block:14px}
.ladder .rung[data-go]:hover{background:transparent;box-shadow:none}
.ladder .rung[data-go]:hover b{color:var(--navy)}
.ladder .rung[data-go]:focus-visible{
  outline:none;background:rgba(176,141,87,.06);box-shadow:var(--focus-ring)
}
.ladder .rung[data-go]:focus-visible b{color:var(--navy)}
@media(hover:hover) and (pointer:fine){
  .ladder .rung[data-go]:hover{
    background:rgba(176,141,87,.06);box-shadow:none
  }
  .ladder .rung[data-go]:hover b{color:var(--navy)}
}
@media(min-width:961px){
  /* Equal columns, top-aligned: a short management stack reads cleaner
     than stretching/bookending two grades across five rungs. */
  #v-home .ladder{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:clamp(28px,4vw,48px);
    align-items:start
  }
  #v-home .ladder .track{
    display:flex;
    flex-direction:column;
    min-width:0
  }
}

/* Rails are a desktop grid and a deliberate, readable touch rail below it. */
.rail{margin-top:var(--content-gap)}
.rail-track > .grid{margin-top:0!important}
.rail-next:active{transform:translateY(-50%) scale(.96)}
@media(min-width:1180px){
  .rail-track{overflow:visible;padding:0}
  .rail-track > .grid{
    display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
    gap:var(--grid-gap);width:auto;padding-right:0
  }
  .rail-track > .grid > *{min-width:0;flex:auto}
  .rail-next{display:none!important}
}
@media(max-width:760px){
  .rail-track > .grid > *{flex-basis:min(78vw,320px)}
  .rail-track > .grid{padding-right:14vw}
}

/* Employer actions are core choices, so the full set stays visible in an
   adaptive grid. Their brass illustrations share one optical media zone. */
.employer-actions{
  grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));
  margin-top:var(--content-gap)
}
.employer-actions .card{min-width:0;min-height:440px;overflow:hidden}
.employer-actions .card .brass{
  width:100%;height:210px;margin:auto auto 0;
  object-fit:contain;object-position:center bottom;
  filter:drop-shadow(0 10px 22px rgba(6,26,46,.14))
}
.employer-actions .card .brass[src*="brass-medallion"]{max-width:184px}
.employer-actions .card .brass[src*="brass-starsarc"]{max-width:230px}
.employer-actions .card .brass[src*="brass-wreath"]{max-width:190px}
.employer-actions .card h3{font-size:1.16rem}
.employer-actions .card p{max-width:38ch}
@media(max-width:700px){
  .employer-actions .card{min-height:0}
  .employer-actions .card .brass{height:170px;margin-top:var(--space-4)}
}

/* Only a surface that itself routes gets elevation and a pointer. */
.card.is-actionable,.mcard.is-actionable,.chap.is-actionable,.post.is-actionable{cursor:default}
.card.is-actionable:hover,.mcard.is-actionable:hover,
.chap.is-actionable:hover,.post.is-actionable:hover{transform:none}
.bpost:hover{
  transform:none;
  box-shadow:0 1px 2px rgba(6,26,46,.05),0 10px 28px rgba(6,26,46,.055)
}
.card[data-go],.mcard[data-go],.chap[data-go],.post[data-go],.bpost[data-go]{cursor:pointer}
@media(hover:hover) and (pointer:fine){
  .card[data-go]:hover,.mcard[data-go]:hover,.chap[data-go]:hover,
  .post[data-go]:hover,.bpost[data-go]:hover{
    transform:translateY(-2px);
    box-shadow:0 2px 4px rgba(6,26,46,.06),0 16px 38px rgba(6,26,46,.1)
  }
  .more:not([aria-disabled="true"]):hover,.xlink:hover{color:var(--bronze)}
}

/* Page-specific patterns: scannable events, calmer forms and compact grade pages. */
#v-events .ev{
  display:grid;grid-template-columns:84px minmax(0,1fr) auto;
  gap:var(--space-4);align-items:center;padding-block:var(--space-4)
}
#v-events .ev[data-go]{margin-inline:-14px;padding-inline:14px;border-radius:12px}
#v-events .ev[data-go]:focus-visible{background:rgba(176,141,87,.07);box-shadow:var(--focus-ring)}
@media(hover:hover) and (pointer:fine){
  #v-events .ev[data-go]:hover{background:rgba(176,141,87,.07)}
}
.atrack:has(input:focus-visible),.adomain:has(input:focus-visible){
  border-color:var(--bronze);box-shadow:0 0 0 4px rgba(176,141,87,.16)
}
.lv-section{margin-bottom:var(--space-6)}
.is-conferred .lv-section{margin-bottom:var(--space-7)}
.lv-standard{margin-top:var(--space-6);margin-bottom:var(--space-6)}
.lv-closing{padding-block:var(--section-space)}
.lv-q summary{margin-inline:-12px;padding-inline:12px;border-radius:10px}
@media(hover:hover) and (pointer:fine){
  .lv-q summary:hover{background:rgba(10,38,71,.045)}
}

/* A single focus language, including controls that were previously missed. */
.navtop:focus-visible,.cat-chip:focus-visible,.lv-q summary:focus-visible,
.afile input[type="file"]:focus-visible,.chapter-pin:focus-visible,
.chapter-map .leaflet-control a:focus-visible{
  outline:none;box-shadow:var(--focus-ring);border-radius:8px
}
.heromark:focus-visible,.xlink:focus-visible{box-shadow:none}
.heromark:focus-visible{outline:2px solid var(--bronze);outline-offset:8px}
.xlink:focus-visible{outline:2px solid var(--bronze);outline-offset:3px}

/* Dead footer copy is copy; only real destinations advertise interaction. */
footer li{cursor:default;transition:color .16s ease}
footer li:hover{color:inherit}
footer li[data-go],footer a[href]{cursor:pointer}
footer li[data-go]:hover,footer a[href]:hover{color:#fff}
footer{padding-top:var(--space-7)}
.fcols{padding-bottom:var(--space-6)}
.legal{padding-block:var(--space-4) var(--space-5)}

/* ==========================================================
   FOOTER — layout
   Template still declares a 5-col grid, but markup only has
   brand + 3 link columns. That phantom fifth column left a
   dead rail on the right and made the brand→nav gap look
   wider than the nav gutters.
   ========================================================== */
footer .fcols{
  display:grid;
  grid-template-columns:minmax(220px,1.35fr) repeat(3,minmax(0,1fr));
  gap:clamp(28px,3.5vw,44px) clamp(24px,3.2vw,40px);
  align-items:start;
  padding-bottom:var(--space-7)
}
footer .fcols > div{min-width:0}
footer .fcols > div:first-child{
  padding-right:clamp(8px,1.5vw,20px)
}
footer .fcols > div:first-child > div:first-child{
  display:flex;
  gap:12px;
  align-items:center;
  margin-bottom:14px
}
footer .fcols > div:first-child .seal,
footer .fcols > div:first-child .seal-white{
  width:44px;height:44px;flex:0 0 auto;
  object-fit:contain
}
footer .fcols > div:first-child p{
  margin:0;
  max-width:34ch;
  line-height:1.55
}
footer h5{margin:0 0 14px}
footer ul{display:grid;gap:2px}
footer li{margin:0;padding:5px 0;line-height:1.4}

footer .legal{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:20px 32px;
  padding-block:var(--space-4) var(--space-6)
}
footer .legal > span:first-child{
  flex:1 1 36ch;
  max-width:62ch;
  line-height:1.5
}
footer .legal > span:last-child{
  flex:0 1 auto;
  white-space:nowrap
}

@media(max-width:960px){
  footer .fcols{
    grid-template-columns:minmax(0,1.2fr) repeat(3,minmax(0,1fr));
    gap:clamp(24px,3vw,36px)
  }
}
@media(max-width:820px){
  footer .fcols{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:var(--space-6) var(--space-5)
  }
  footer .fcols > div:first-child{
    grid-column:1 / -1;
    padding-right:0;
    padding-bottom:var(--space-4);
    margin-bottom:var(--space-2);
    border-bottom:1px solid var(--line-dark)
  }
  footer .fcols > div:first-child > div:first-child{
    margin-bottom:12px
  }
}
@media(max-width:520px){
  footer .fcols{grid-template-columns:minmax(0,1fr)}
  footer .fcols > div:first-child{
    border-bottom:0;
    padding-bottom:0;
    margin-bottom:0
  }
  footer .legal > span:last-child{white-space:normal}
}

@media(max-width:760px){
  :root{
    --section-space:48px;
    --section-space-tight:40px;
    --section-space-feature:64px;
    --surface-pad:24px
  }
  html{scroll-padding-top:76px}
  section,.tight,.band{padding-block:var(--section-space)}
  .tight{padding-block:var(--section-space-tight)}
  .band{padding-block:var(--section-space-feature)}
  .ladder .rung[data-go]{margin-inline:0;padding:14px 16px}
  #v-events .ev{
    grid-template-columns:68px minmax(0,1fr);gap:var(--space-3);
    align-items:start
  }
  #v-events .ev .pill{grid-column:2;justify-self:start}
  #v-events .ev[data-go]{margin-inline:-10px;padding-inline:10px}
  .lv-section,.is-conferred .lv-section{margin-bottom:44px}
  footer{padding-top:var(--space-6)}
}

@media(prefers-reduced-motion:reduce){
  .burger-icon,.burger-icon::before,.burger-icon::after,.rail-track,
  .lv-q summary::after,.card,.mcard,.chap,.post,.bpost,.rung,.rail-next{
    transition:none;scroll-behavior:auto
  }
}

/* ==========================================================
   LONG-FORM READABILITY
   Preserve every word while restoring the Heading2/Heading3
   hierarchy from the source specifications. Narrative remains
   open; only parallel choices, evidence and benefits use panels.
   ========================================================== */
.lv-grid.is-single.has-index{
  grid-template-columns:minmax(0,1fr) 250px;
  gap:clamp(36px,4.5vw,64px)
}
.lv-index{
  position:sticky;top:150px;align-self:start;
  padding-left:22px;border-left:1px solid var(--line)
}
.lv-index-label{
  margin:0 0 14px;font-size:.66rem;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;color:var(--bronze)
}
.lv-index ol{display:grid;gap:2px;margin:0;padding:0;list-style:none}
.lv-index a{
  display:block;
  padding:8px 9px;border-radius:8px;
  color:#465463;font-size:.79rem;line-height:1.35;
  transition:background .16s ease,color .16s ease
}
.lv-index a:hover{background:#F5F1E9;color:var(--navy)}
.lv-index a:focus-visible{outline:none;box-shadow:var(--focus-ring)}
.lv-section[id]{scroll-margin-top:165px}

/* Numbered headings are chapters, not a stream of equal siblings. */
.lv-chapter{
  padding-top:var(--space-6);
  border-top:1px solid var(--line)
}
.lv-main > .lv-chapter:first-child{
  padding-top:0;border-top:0
}
.lv-chapter.has-followups,.lv-chapter.is-heading-only{margin-bottom:var(--space-4)}

/* The first two grade chapters read as an editorial 7/5 spread. */
.lv-intro-grid{
  display:grid;grid-template-columns:minmax(0,1.2fr) minmax(250px,.8fr);
  gap:0;margin-bottom:0;
  border-top:1px solid var(--line);border-bottom:0
}
.lv-intro-cell{
  margin:0;padding:var(--space-5) 0;border:0
}
.lv-intro-cell + .lv-intro-cell{
  padding-left:var(--space-5);border-left:1px solid var(--line)
}
@media(min-width:701px){
  .lv-intro-cell:first-child{padding-right:var(--space-5)}
}
.lv-intro-cell > p,.lv-intro-cell > .lv-list{margin-left:0!important}

/* Dependent Heading3 blocks become one visible, parallel group. */
.lv-subgrid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:var(--space-3);margin:0 0 var(--space-6);
  align-items:stretch
}
.lv-panel{
  min-width:0;align-self:stretch;height:100%;
  display:flex;flex-direction:column;
  padding:var(--space-4);
  border:1px solid #E5DED1;border-radius:16px;background:#F8F5EF
}
.lv-panel .lv-sub{margin:0 0 var(--space-3);color:var(--navy)}
.lv-panel .lv-list,.lv-panel .lv-tablewrap{margin-left:0!important}
.lv-panel .lv-tablewrap{margin-bottom:0}

/* Five benefit categories stay intact but stop reading as five more pages. */
.lv-benefit-deck{
  display:grid;grid-template-columns:minmax(0,1fr);
  gap:var(--space-3);margin:0 0 var(--space-6)
}
.lv-benefit{
  align-self:start;overflow:hidden;
  border:1px solid var(--line);border-radius:16px;background:#fff
}
.lv-benefit[open]{grid-column:auto}
.lv-benefit summary{
  min-height:56px;display:flex;align-items:center;justify-content:space-between;
  gap:var(--space-3);padding:15px 20px;cursor:pointer;list-style:none;
  font-family:var(--sans);font-size:1rem;font-weight:500;color:var(--navy)
}
.lv-benefit summary::-webkit-details-marker{display:none}
.lv-benefit summary::after{content:"+";flex:none;color:var(--bronze);font-family:var(--sans)}
.lv-benefit[open] summary::after{content:"−"}
.lv-benefit summary:hover{background:#FBF8F2}
.lv-benefit summary:focus-visible{
  outline:none;box-shadow:inset 0 0 0 3px rgba(199,154,78,.72)
}
.lv-benefit-body{padding:0 20px 20px}
.lv-benefit-body .lv-tablewrap{margin:0}
.lv-benefit-body .lv-table{min-width:0;table-layout:fixed;font-size:.84rem}
.lv-benefit-body .lv-table th,.lv-benefit-body .lv-table td{padding:11px 10px}
.lv-benefit-body .lv-table .lv-k{white-space:normal;overflow-wrap:anywhere}

/* Benefits and fees are complementary outcomes, so compare them side by side. */
.lv-outcome-grid{
  display:grid;grid-template-columns:minmax(220px,.75fr) minmax(360px,1.25fr);
  gap:var(--space-3);margin:0 0 var(--space-6)
}
.lv-outcome-card{
  min-width:0;margin:0;padding:var(--space-4);
  border:1px solid var(--line);border-radius:16px;background:#fff
}
.lv-outcome-card .lv-h{
  display:block;
  margin:0 0 18px;padding:0 0 14px;border-bottom:1px solid var(--line);
  font-family:var(--sans);font-size:1.2rem;font-weight:500;
  line-height:1.2;letter-spacing:-.015em
}
.lv-fees-panel{background:#FBFAF8}
.lv-outcome-card > p,.lv-outcome-card > .lv-list,
.lv-outcome-card > .lv-tablewrap,.lv-outcome-card > .lv-fee-list{margin-left:0!important}

/* Fee mappings are grouped rows, not sideways comparison tables. */
.lv-fee-list{min-width:0;margin:0}
.lv-fee-head,.lv-fee-row{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(112px,.46fr);
  gap:var(--space-3)
}
.lv-fee-head{
  padding:0 0 10px;border-bottom:1px solid var(--line);
  font-size:.68rem;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:var(--muted)
}
.lv-fee-head span:last-child{text-align:right}
.lv-fee-list dl{margin:0}
.lv-fee-row{
  padding:14px 0;border-bottom:1px solid var(--line);align-items:start
}
.lv-fee-row:last-child{border-bottom:0;padding-bottom:0}
.lv-fee-row dt{
  min-width:0;color:var(--navy);font-weight:500;line-height:1.45;
  overflow-wrap:anywhere
}
.lv-fee-row dd{
  min-width:0;margin:0;text-align:right;color:#4C5967;line-height:1.45;
  overflow-wrap:anywhere
}
.lv-fee-row.is-member dt,.lv-fee-row.is-member dd{color:#7A5A1E}

@media(max-width:1180px){
  .lv-outcome-grid{grid-template-columns:minmax(0,1fr)}
}

/* Route cards hold at three columns instead of leaving an orphan card. */
@media(min-width:1100px){
  .lv-routes-3{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* Shared standing policies form one compact cluster; Lancer stays editorial. */
.lv-body:not(.is-conferred) .lv-standard{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--space-3);border-top:0
}
.lv-body:not(.is-conferred) .lv-standard.lv-standard-2{
  grid-template-columns:repeat(2,minmax(0,1fr))
}
.lv-body:not(.is-conferred) .lv-standard.lv-standard-1{
  grid-template-columns:minmax(0,1fr)
}
.lv-body:not(.is-conferred) .lv-std{
  padding:var(--space-4);border:1px solid var(--line);
  border-radius:14px;background:rgba(255,255,255,.76)
}
.lv-body:not(.is-conferred) .lv-std.is-key{
  grid-column:1 / -1;margin:0
}

@media(max-width:1010px){
  .lv-grid.is-single.has-index{grid-template-columns:minmax(0,1fr)}
  .lv-index{
    position:static;order:-1;padding:0 0 var(--space-3);border:0;
    overflow:hidden
  }
  .lv-index ol{
    display:flex;gap:8px;overflow-x:auto;padding:2px 2px 10px;
    scroll-snap-type:x proximity;scrollbar-width:thin
  }
  .lv-index li{flex:0 0 auto;scroll-snap-align:start}
  .lv-index a{
    padding:9px 12px;
    border:1px solid var(--line);border-radius:999px;background:#fff;white-space:nowrap
  }
}

@media(max-width:700px){
  .lv-intro-grid,.lv-outcome-grid,.lv-benefit-deck,
  .lv-body:not(.is-conferred) .lv-standard{grid-template-columns:minmax(0,1fr)}
  .lv-intro-grid{border-bottom:0}
  .lv-intro-cell{padding:var(--space-4) 0}
  .lv-intro-cell + .lv-intro-cell{
    padding-left:0;border-left:0;border-top:1px solid var(--line)
  }
  .lv-subgrid,.lv-benefit-deck,.lv-outcome-grid{margin-left:0}
  .lv-benefit[open],.lv-body:not(.is-conferred) .lv-std.is-key{grid-column:auto}
  .lv-panel,.lv-outcome-card{padding:20px}
  .lv-benefit-body{padding-inline:14px}
  .lv-benefit-body .lv-table{min-width:520px;table-layout:auto}
  .lv-benefit-body .lv-table .lv-k{white-space:normal}
}

@media(max-width:520px){
  .lv-fee-head{
    position:absolute;width:1px;height:1px;padding:0;margin:-1px;
    overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap
  }
  .lv-fee-row{grid-template-columns:minmax(0,1fr);gap:4px;padding:14px 0}
  .lv-fee-row dd{text-align:left}
}

@media(prefers-reduced-motion:reduce){
  .lv-index a{transition:none}
}

/* "National Security Database" is longer than the line it replaced and
   was wrapping under the wordmark. Slightly tighter tracking holds it
   on one line without shrinking it below legibility. */
.brand .word{
  white-space:nowrap;line-height:1.14;
  font-size:clamp(1.02rem,1.5vw,1.3rem)
}
@media(max-width:940px){.brand .word{font-size:1rem}}
@media(max-width:420px){.brand .word{font-size:.9rem}}

/* the marquee is clipped by its mask, but the mask's own overflow was
   still reaching the document at the width where the strip is fullest */
.utility{overflow:hidden}
.utility .wrap{min-width:0}
.uev-mask{min-width:0;max-width:100%}

/* ---------- Empanelment: the two-track panel ----------
   The overview button sits under the lede in the dark panel; the
   grades run in two columns, one per track, on the right. */
.mega-ctas{
  display:flex;flex-direction:column;align-items:stretch;gap:10px;
  margin-top:20px;width:100%;max-width:280px
}
.mega-cta{
  display:inline-flex;align-items:center;justify-content:space-between;gap:10px;
  width:100%;box-sizing:border-box;
  padding:10px 18px;
  border:1px solid rgba(212,175,110,.5);border-radius:999px;
  font-family:var(--sans);font-size:.82rem;font-weight:500;
  color:#fff;background:transparent;
  transition:border-color .16s ease,background .16s ease,color .16s ease
}
.mega-cta i{font-style:normal;transition:transform .2s ease}
.mega-cta:hover{
  border-color:var(--bronze);background:rgba(176,141,87,.16);color:#fff
}
.mega-cta:hover i{transform:translateX(3px)}
.mega-cta:focus-visible{outline:2px solid var(--bronze);outline-offset:2px}

.mega-links.is-tracks{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;padding:22px 18px
}
.mega-track{display:grid;align-content:start;gap:2px}
.mega-track-h{
  margin:0 0 8px;padding:0 14px;
  font-family:var(--sans);font-size:.62rem;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;color:var(--muted)
}

@media(max-width:720px){
  .mega-links.is-tracks{grid-template-columns:minmax(0,1fr);gap:6px}
  .mega-track+.mega-track{margin-top:8px}
  .mega-ctas{margin-top:14px}
}

/* the .navmenu a hover rules were fighting the button: force our own
   colours, and give the dark panel room for the button underneath */
nav.main .mega-lead{padding:30px 28px 34px;display:flex;flex-direction:column}
nav.main .mega-lead .mega-cta{
  align-self:stretch;color:#fff;background:transparent
}
nav.main .mega-lead .mega-cta:hover,
nav.main .mega-lead .mega-cta:focus-visible{
  background:rgba(176,141,87,.2);color:#fff;border-color:var(--bronze)
}

/* the numeral sits beside the name, not above it */
nav.main .mega-links a:has(.mega-n){
  display:grid;grid-template-columns:auto minmax(0,1fr);
  align-items:baseline;column-gap:10px
}
nav.main .mega-n{
  font-family:var(--sans);font-style:normal;font-weight:500;
  font-size:.78rem;font-variant-numeric:tabular-nums;color:var(--muted)
}
nav.main .mega-links a:has(.mega-n) b{grid-column:2;display:inline}

/* dividers between grades, mirroring the reference */
nav.main .mega-track a{
  padding:16px 14px;
  border-radius:0;
  border-bottom:1px solid var(--line)
}
nav.main .mega-track a:last-child{border-bottom:0}
nav.main .mega-track a:hover{background:#F8F5EF;border-bottom-color:var(--line)}
nav.main .mega-track-h{margin-bottom:6px;padding:0 14px 14px;border-bottom:1px solid var(--line)}
nav.main .mega-track a b{font-size:.98rem}
nav.main .mega-n{font-size:.85rem;padding-right:4px}

/* the tracks column: bit more air, matches the reference proportions */
.mega-links.is-tracks{padding:26px 22px;column-gap:36px}

/* the button reads too tight — give the label real breathing room */
nav.main .mega-lead .mega-cta{padding:14px 22px;gap:14px;font-size:.88rem}

/* the dark panel needs headroom under the button so its border-radius
   is never clipped by the menu's own overflow */
nav.main .mega-lead{padding-bottom:48px;min-height:100%}
nav.main .mega-inner{align-items:stretch}

/* ==========================================================
   The current page, marked in the mega menu.
   Without it a visitor lands on Falcon and cannot tell which
   grade they are looking at when they reopen the menu.
   ========================================================== */
nav.main .mega-track a.is-current{background:#F8F5EF;position:relative}
nav.main .mega-track a.is-current::before{
  content:"";position:absolute;left:0;top:14px;bottom:14px;
  width:3px;border-radius:3px;background:var(--bronze)
}
nav.main .mega-track a.is-current .mega-n{color:var(--bronze)}
nav.main .navgroup:has(.is-current) .navtop{color:var(--gold-hi)}

/* ---------- where you are ----------
   One shape on every page: a quiet way back, then the page you are
   on, set as a chip so it cannot be mistaken for the eyebrow that
   follows it. */
.crumbs{
  display:flex;align-items:center;flex-wrap:wrap;gap:16px;
  margin-bottom:28px;
  font-family:var(--sans);font-size:.82rem;letter-spacing:.01em
}
.crumb{
  display:inline-flex;align-items:center;gap:8px;
  color:rgba(255,255,255,.55);cursor:pointer;transition:color .15s ease
}
.crumb i{font-style:normal;transition:transform .2s ease}
.crumb[data-go]:hover{color:#fff}
.crumb[data-go]:hover i{transform:translateX(-3px)}
.crumb[data-go]:focus-visible{outline:2px solid var(--bronze);outline-offset:3px;border-radius:3px}

.crumb-now{
  display:inline-flex;align-items:center;
  padding:6px 14px;
  border:1px solid rgba(255,255,255,.2);border-radius:999px;
  background:rgba(255,255,255,.07);
  font-size:.8rem;font-weight:600;color:#fff;letter-spacing:.01em
}

/* on a light header the same shape inverts */
.paper .crumbs .crumb,.stone .crumbs .crumb{color:var(--muted)}
.paper .crumbs .crumb[data-go]:hover,.stone .crumbs .crumb[data-go]:hover{color:var(--navy)}
.paper .crumb-now,.stone .crumb-now{
  border-color:rgba(176,141,87,.4);background:#FBF6EC;color:var(--navy)
}

/* the track a reader asked for, marked on arrival */
.lv-ladder .track{
  border-radius:14px;
  transition:background 1s ease,box-shadow 1s ease
}
.lv-ladder .track.is-target{
  background:#FBF6EC;
  box-shadow:0 0 0 1px rgba(176,141,87,.3), 0 0 0 12px #FBF6EC;
  transition:background .18s ease,box-shadow .18s ease
}

/* the client's slogan, beneath the page's own name */
.lv-slogan{
  margin:14px 0 0;max-width:34ch;
  font-family:var(--sans);font-weight:500;
  font-size:clamp(1.08rem,1.6vw,1.3rem);line-height:1.35;
  letter-spacing:-.005em;color:var(--gold-hi)
}
.lv-slogan + .lv-stand{margin-top:20px}
.crumb-now{display:none}

/* ==========================================================
   SCHOLAR — NCSSP programme page components
   ========================================================== */
.sch-stat{
  display:grid;grid-template-columns:auto minmax(0,1fr);
  align-items:center;gap:clamp(20px,3vw,40px);
  margin:8px 0 32px;padding:26px 30px;
  border-radius:18px;background:#FBF6EC;
  box-shadow:inset 0 0 0 1px rgba(176,141,87,.24)
}
.sch-stat b{
  font-family:var(--serif);font-weight:400;
  font-size:clamp(3rem,6vw,4.6rem);line-height:.9;
  color:var(--navy);font-variant-numeric:tabular-nums
}
.sch-stat span{font-size:1rem;line-height:1.6;color:#3D4A57;max-width:46ch}
.sch-stat.is-inline{margin-bottom:26px}


/* the big figures */
/* four figures: one row at desktop, two by two on a tablet, stacked on a
   phone. auto-fit was leaving a single orphan card on its own row. */
.sch-figs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin:0 0 30px}
@media(max-width:1010px){.sch-figs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.sch-figs{grid-template-columns:minmax(0,1fr)}}
.sch-fig{
  padding:24px 22px;border-radius:16px;background:#fff;
  box-shadow:0 1px 2px rgba(6,26,46,.05),0 10px 30px rgba(6,26,46,.05)
}
.sch-fig b{
  display:block;font-family:var(--serif);font-weight:400;
  font-size:3rem;line-height:1;color:var(--navy);font-variant-numeric:tabular-nums
}
.sch-fig em{
  display:block;margin:10px 0 12px;font-style:normal;
  font-family:var(--sans);font-size:.68rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--bronze)
}
.sch-fig span{font-size:.92rem;line-height:1.55;color:#3D4A57}

/* simulate · practice · validate */
.sch-modes{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:0;margin:0 0 26px;border:1px solid var(--line);border-radius:14px;overflow:hidden
}
.sch-modes span{padding:18px 20px;border-right:1px solid var(--line);display:block}
.sch-modes span:last-child{border-right:0}
.sch-modes b{
  display:block;margin-bottom:4px;
  font-family:var(--sans);font-size:.95rem;font-weight:600;color:var(--navy)
}
.sch-modes span{font-size:.88rem;color:var(--muted)}


.sch-role{
  display:block;margin-bottom:9px;
  font-family:var(--sans);font-size:.72rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--bronze)
}
.sch-person p{margin:0;font-size:.92rem;line-height:1.55}

/* the organizations cloud */
.sch-orgs{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 8px}
.sch-orgs span{
  padding:7px 13px;border:1px solid var(--line);border-radius:999px;
  font-family:var(--sans);font-size:.82rem;color:#3D4A57;background:#fff
}

.sch-note{
  margin:22px 0 0;padding:18px 22px;border-radius:14px;
  background:#FBFAF8;box-shadow:inset 0 0 0 1px var(--line);
  font-size:.94rem;line-height:1.6;color:#3D4A57
}
.sch-curriculum td:first-child{width:1%;font-variant-numeric:tabular-nums}

/* the two messages */
.sch-letters{background:var(--navy-900);color:#fff}
.sch-letters .eyebrow{color:var(--bronze-soft)}
.sch-letters .sch-letter{
  max-width:74ch;margin:34px 0 0;padding-top:26px;border-top:1px solid rgba(255,255,255,.14)
}
.sch-letters blockquote{
  margin:0;font-family:var(--serif);font-weight:400;
  font-size:clamp(1.14rem,2vw,1.5rem);line-height:1.42;color:#fff
}
.sch-sig{
  margin:16px 0 0;font-family:var(--sans);font-size:.82rem;
  letter-spacing:.02em;color:rgba(255,255,255,.6)
}
.sch-contacts{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:20px;margin-top:34px;padding-top:26px;border-top:1px solid rgba(255,255,255,.14)
}
.sch-contacts p{margin:0;font-size:.9rem;line-height:1.7;color:rgba(255,255,255,.72)}
.sch-contacts b{color:#fff;font-weight:600}

@media(max-width:560px){
  .sch-stat{grid-template-columns:minmax(0,1fr);gap:12px;padding:22px 20px}
  .sch-modes{grid-template-columns:minmax(0,1fr)}
  .sch-modes span{border-right:0;border-bottom:1px solid var(--line)}
  .sch-modes span:last-child{border-bottom:0}
}

/* programme photography */
.sch-fig-img{margin:8px 0 28px}
.sch-fig-img img{
  display:block;width:100%;height:auto;border-radius:16px;
  box-shadow:0 1px 2px rgba(6,26,46,.06),0 14px 40px rgba(6,26,46,.09)
}
.sch-fig-img figcaption{
  margin-top:12px;font-family:var(--sans);font-size:.85rem;color:var(--muted)
}
.sch-partners{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:0 34px;margin-bottom:8px
}
.sch-partners .lv-sub{margin-top:0}
.sch-logos{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 28px}
.sch-logos span{
  padding:10px 16px;border:1px solid var(--line);border-radius:10px;background:#fff;
  font-family:var(--sans);font-size:.82rem;font-weight:500;color:var(--navy)
}
.sch-refs{margin:6px 0 0;font-size:.82rem;color:var(--muted);word-break:break-word}

/* numerals are hidden site-wide by the chapter-rhythm rules; the Scholar
   page follows suit rather than reintroducing them */

/* the organizations, running */
.sch-ticker{
  overflow:hidden;margin:0 0 8px;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 40px,#000 calc(100% - 40px),transparent);
  mask-image:linear-gradient(90deg,transparent,#000 40px,#000 calc(100% - 40px),transparent)
}
.sch-ticker-track{display:flex;width:max-content;animation:sch-run 90s linear infinite}
.sch-ticker-run{display:flex;gap:18px;padding-right:18px}
.sch-ticker:hover .sch-ticker-track{animation-play-state:paused}
@keyframes sch-run{to{transform:translateX(-50%)}}
.sch-ticker span{
  flex:none;padding:9px 16px;border:1px solid var(--line);border-radius:999px;
  font-family:var(--sans);font-size:.86rem;color:#3D4A57;background:#fff;white-space:nowrap
}
@media(prefers-reduced-motion:reduce){
  .sch-ticker-track{animation:none}
  .sch-ticker{overflow-x:auto}
  .sch-ticker-run[aria-hidden]{display:none}
}

/* the roll of organizations, directly under the hero */
.sch-serve{padding:54px 0 58px}
.sch-serve .eyebrow{margin-bottom:12px}
.sch-serve-lede{
  margin:0 0 30px;max-width:60ch;
  font-size:clamp(1rem,1.4vw,1.12rem);line-height:1.6;color:#3D4A57
}
/* The cohort photograph is full-bleed and the ticker is a row of white
   pills, so with no space between them the pills read as a caption bar
   stuck to the bottom of the picture. The band needs air under it. */
.sch-serve .sch-bleed{margin-bottom:clamp(30px,3.6vw,46px)}
.sch-serve .sch-ticker{margin-bottom:0}

/* ==========================================================
   Scholar — cards and rails
   Long lists read as objects rather than paragraphs: a card grid
   where the set is small, a snap rail where it is long.
   ========================================================== */
.sch-grid{display:grid;gap:16px;margin:0 0 30px}
.sch-grid.is-two{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.sch-grid.is-three{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}

.sch-card{
  display:flex;flex-direction:column;
  padding:24px 24px 22px;border-radius:18px;background:#fff;
  box-shadow:0 1px 2px rgba(6,26,46,.05),0 10px 30px rgba(6,26,46,.05);
  transition:transform .28s cubic-bezier(.2,.7,.3,1),box-shadow .28s ease
}
.sch-card:hover{
  transform:translateY(-3px);
  box-shadow:0 1px 2px rgba(6,26,46,.06),0 18px 44px rgba(6,26,46,.1)
}
.sch-card.is-quiet{background:#FBFAF8;box-shadow:inset 0 0 0 1px var(--line)}
.sch-card.is-quiet:hover{transform:none;box-shadow:inset 0 0 0 1px rgba(176,141,87,.4)}
.sch-card-n{
  display:block;margin-bottom:12px;
  font-family:var(--sans);font-size:.68rem;font-weight:600;
  letter-spacing:.16em;color:var(--bronze);font-variant-numeric:tabular-nums
}
.sch-card h4{
  margin:0 0 9px;font-family:var(--sans);font-size:1rem;font-weight:600;
  line-height:1.3;color:var(--navy)
}
.sch-card p{margin:0;font-size:.93rem;line-height:1.6;color:#3D4A57}
.sch-card-out p{font-size:.95rem}

/* the rail */
.sch-rail{
  margin:0 0 30px;
  -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 60px),transparent);
  mask-image:linear-gradient(90deg,#000 calc(100% - 60px),transparent)
}
.sch-rail-track{
  display:flex;gap:16px;
  overflow-x:auto;scroll-snap-type:x mandatory;
  padding:4px 60px 18px 0;scrollbar-width:none;-webkit-overflow-scrolling:touch
}
.sch-rail-track::-webkit-scrollbar{display:none}
.sch-rail .sch-card{scroll-snap-align:start;flex:0 0 300px}
.sch-rail.is-weeks .sch-card{flex-basis:280px}

.sch-wk{
  display:inline-block;margin-bottom:12px;padding:5px 12px;
  border-radius:999px;background:#FBF6EC;
  font-family:var(--sans);font-size:.66rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--bronze);align-self:flex-start
}
.sch-card-week h4{font-family:var(--serif);font-weight:400;font-size:1.2rem;line-height:1.22}
.sch-card-week dl{margin:16px 0 0;display:grid;gap:14px}
.sch-card-week dt{
  font-family:var(--sans);font-size:.62rem;font-weight:600;
  letter-spacing:.15em;text-transform:uppercase;color:var(--muted);margin-bottom:4px
}
.sch-card-week dd{margin:0;font-size:.9rem;line-height:1.5;color:#3D4A57}

.sch-card-person{padding:0;overflow:hidden}
.sch-card-person img{
  display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:top;
  background:#EEF1F4
}
.sch-card-body{padding:20px 22px 22px}
.sch-card-person h4{margin:0 0 4px;font-size:.98rem}

@media(max-width:560px){
  .sch-rail .sch-card{flex-basis:82vw}
  .sch-card{padding:20px 20px 18px}
}
@media(prefers-reduced-motion:reduce){
  .sch-card{transition:none}
  .sch-card:hover{transform:none}
}

/* the question the programme answers, lifted onto its own surface */
.sch-feature{
  margin-left:0!important;
  padding:clamp(28px,4vw,48px);
  border-radius:26px;
  background:linear-gradient(180deg,#F6F6F8 0%,#F1F1F4 100%);
  box-shadow:0 1px 2px rgba(6,26,46,.04),0 20px 50px rgba(6,26,46,.07);
  margin-bottom:56px
}
.sch-feature .lv-h{
  color:var(--bronze);
  max-width:20ch
}
.sch-feature p{max-width:66ch}
.lv-main > .sch-feature > p{margin-left:0}
@media(max-width:700px){.sch-feature{border-radius:20px}}

/* ---------- the rail decides, it does not restate ---------- */
.lv-decide h4{margin-bottom:18px}
.lv-next{
  margin:0 0 18px;padding:16px 18px;border-radius:14px;
  background:#FBF6EC;box-shadow:inset 0 0 0 1px rgba(176,141,87,.26)
}
.lv-next-k{
  display:block;margin-bottom:6px;
  font-family:var(--sans);font-size:.62rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--bronze)
}
.lv-next b{
  display:block;font-family:var(--serif);font-weight:400;
  font-size:1.42rem;line-height:1.05;color:var(--navy);font-variant-numeric:tabular-nums
}
.lv-next span:not(.lv-next-k){
  display:block;margin-top:6px;font-size:.84rem;line-height:1.4;color:#55636F
}
.lv-decide-facts{margin:0 0 20px;display:grid;gap:12px}
.lv-decide-facts > div{
  display:grid;gap:3px;padding-bottom:12px;border-bottom:1px solid var(--line)
}
.lv-decide-facts > div:last-child{border-bottom:0;padding-bottom:0}
.lv-decide-actions{display:grid;gap:9px;margin-bottom:14px}
.lv-decide-actions .btn{width:100%;text-align:center;justify-content:center}
.lv-decide-note{
  margin:0;font-size:.8rem;line-height:1.5;color:var(--muted)
}
.lv-decide-more{margin-top:16px;border-top:1px solid var(--line);padding-top:14px}
.lv-decide-more summary{
  cursor:pointer;list-style:none;
  font-family:var(--sans);font-size:.8rem;font-weight:500;color:var(--navy);
  display:flex;align-items:center;justify-content:space-between
}
.lv-decide-more summary::-webkit-details-marker{display:none}
.lv-decide-more summary::after{content:"+";color:var(--bronze);transition:transform .2s ease}
.lv-decide-more[open] summary::after{transform:rotate(45deg)}
.lv-decide-more dl{margin:14px 0 0;display:grid;gap:12px}
.lv-decide-more dl > div{display:grid;gap:3px}
/* the actions need clear air after the facts */
.lv-decide-facts{margin-bottom:26px}
.lv-decide-actions{margin-bottom:16px}

/* ---------- the rail: more air, and details that scroll in place ---------- */
.lv-glance.lv-decide{padding:30px 28px 26px}
.lv-decide h4{margin-bottom:22px}
.lv-next{margin-bottom:26px;padding:18px 20px}
.lv-decide-facts{margin:0 0 32px;gap:18px}
.lv-decide-facts > div{padding-bottom:18px}
.lv-decide-facts dd{line-height:1.5}
.lv-decide-actions{gap:11px;margin-bottom:20px}
.lv-decide-actions .btn{padding:14px 20px}
.lv-decide-note{margin-bottom:2px}
.lv-decide-more{margin-top:22px;padding-top:18px}
.lv-decide-more summary{padding:2px 0}

/* the full table scrolls inside the disclosure rather than pushing the
   card past the viewport */
.lv-decide-more dl{
  margin-top:18px;
  max-height:min(46vh,320px);
  overflow-y:auto;
  padding-right:10px;
  gap:16px;
  overscroll-behavior:contain;
  -webkit-mask-image:linear-gradient(180deg,#000 calc(100% - 22px),transparent);
  mask-image:linear-gradient(180deg,#000 calc(100% - 22px),transparent)
}
.lv-decide-more dl::-webkit-scrollbar{width:5px}
.lv-decide-more dl::-webkit-scrollbar-thumb{
  background:rgba(6,26,46,.18);border-radius:99px
}
.lv-decide-more dl::-webkit-scrollbar-track{background:transparent}
.lv-decide-more dl{scrollbar-width:thin;scrollbar-color:rgba(6,26,46,.18) transparent}
.lv-decide-more dd{padding-bottom:2px}
/* `.lv-glance dl` is 0,1,1 and was outranking `.lv-decide-facts` at
   0,1,0, so the space under the facts collapsed to nothing */
.lv-decide dl.lv-decide-facts{margin:0 0 32px;gap:18px}
.lv-decide-more dl{margin:18px 0 0}

/* ---------- who can attend ---------- */
.sch-gate{
  display:grid;gap:8px;
  margin:0 0 34px;padding:26px 28px;
  border-radius:18px;background:#FBF6EC;
  box-shadow:inset 0 0 0 1px rgba(176,141,87,.28)
}
.sch-gate-k{
  font-family:var(--sans);font-size:.64rem;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;color:var(--bronze)
}
.sch-gate p{
  margin:0;font-family:var(--serif);font-weight:400;
  font-size:clamp(1.08rem,1.7vw,1.32rem);line-height:1.4;color:var(--navy);max-width:46ch
}

.sch-who{
  margin:0 0 8px;padding:0;list-style:none;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:0 40px;align-items:start
}
.sch-who li{
  display:grid;gap:5px;
  padding:18px 0;border-top:1px solid var(--line)
}
.sch-who-k{
  font-family:var(--sans);font-size:.66rem;font-weight:600;
  letter-spacing:.15em;text-transform:uppercase;color:var(--bronze)
}
.sch-who-v{font-size:.97rem;line-height:1.55;color:#3D4A57}
@media(max-width:700px){.sch-who li{padding:15px 0}}
/* the feature heading was breaking to four short lines; give it the
   width to land in two */
.sch-feature .lv-h{max-width:none;text-wrap:balance}
@media(min-width:760px){.sch-feature .lv-h{max-width:44ch}}

/* ---------- the rail scrolls, not the page ----------
   With Full details open the card can outgrow the viewport and its
   bottom is cut off by the fold. The card itself becomes the scroll
   surface, capped to the space between the sticky header and the
   bottom of the screen. One scroll region, so the inner disclosure no
   longer needs its own. */
.lv-glance.lv-decide{
  /* the rail sticks 150px down, so that is what it must subtract */
  max-height:calc(100vh - 174px);
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:rgba(6,26,46,.16) transparent
}
.lv-glance.lv-decide::-webkit-scrollbar{width:6px}
.lv-glance.lv-decide::-webkit-scrollbar-thumb{
  background:rgba(6,26,46,.16);border-radius:99px
}
.lv-glance.lv-decide::-webkit-scrollbar-track{background:transparent}

/* the disclosure expands naturally inside the scrolling card */
.lv-decide-more dl{
  max-height:none;
  overflow:visible;
  padding-right:0;
  -webkit-mask-image:none;
  mask-image:none
}

/* on a phone the rail is not sticky, so it must not cap either */
@media(max-width:1010px){
  .lv-glance.lv-decide{max-height:none;overflow:visible}
}

/* ---------- curriculum table ---------- */
/* Three columns since the theme moved out to the roll above, so the table
   now fits the reading column; the floor only holds it readable on a phone,
   where the wrap still scrolls. */
.sch-curriculum{min-width:560px;font-size:.9rem}
.sch-curriculum th{vertical-align:bottom}
.sch-curriculum td{padding:15px 16px;line-height:1.5}
.sch-curriculum .sch-wkn{
  width:1%;white-space:nowrap;text-align:center;
  font-variant-numeric:tabular-nums;color:var(--bronze);font-weight:600
}
.sch-curriculum .sch-theme{font-weight:600;color:var(--navy)}
.sch-kind{
  display:block;margin-bottom:4px;
  font-family:var(--sans);font-size:.62rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--bronze)
}
.sch-curriculum tbody tr:nth-child(even){background:#FBFAF8}
.sch-mix{
  margin:14px 0 0;font-size:.84rem;line-height:1.55;color:var(--muted)
}

/* the faculty portraits come from mixed sources, some colour, some
   already mono. One treatment so the row reads as one set. */
.sch-card-person img{filter:grayscale(1) contrast(1.03)}

/* ---------- Scholar: photograph as the page hero ----------
   Titles sit in the sky. The prospectus (stand, facts, CTAs)
   is a separate section so the picture can carry the page. */
#v-grade-scholar .lv-hero.sch-hero-frame{
  padding:0;overflow:hidden;color:var(--navy);
  background:#c5d0d8;background-image:none
}
#v-grade-scholar .lv-hero.sch-hero-frame::after{display:none}
.sch-hero-shot{
  position:relative;margin:0;
  aspect-ratio:1024 / 576;background:#c5d0d8
}
.sch-hero-photo{
  display:block;width:100%;height:100%;
  object-fit:cover;object-position:center center
}
.sch-hero-titles{
  position:absolute;inset:0;
  display:flex;align-items:flex-start;justify-content:center;
  padding-top:clamp(18px,3.2vw,36px);
  pointer-events:none
}
.sch-hero-titles .wrap{
  pointer-events:auto;width:100%;
  display:flex;flex-direction:column;align-items:center
}
.sch-hero-titles .backlink{
  align-self:flex-start;color:rgba(10,38,71,.55);margin:0 0 14px
}
.sch-hero-titles .backlink:hover{color:var(--navy)}
.sch-hero-lockup{
  display:grid;grid-template-columns:auto minmax(0,max-content);
  align-items:start;column-gap:18px;width:max-content;max-width:100%
}
.sch-hero-mark-slot{
  display:block;align-self:start;flex-shrink:0
}
.sch-hero-mark{
  display:block;width:104px;height:104px;flex-shrink:0;
  object-fit:contain;
  filter:drop-shadow(0 10px 18px rgba(10,38,71,.16))
}
.sch-hero-copy{
  min-width:0;text-align:left;
  display:flex;flex-direction:column;align-items:flex-start
}
.sch-hero-titles .eyebrow,
.sch-hero-copy .eyebrow{
  color:rgba(10,38,71,.72);margin:0 0 5px;max-width:none;
  font-size:.68rem;letter-spacing:.16em
}
#v-grade-scholar .sch-hero-h{
  max-width:none;margin:0;white-space:nowrap;
  color:var(--navy);
  font-size:clamp(1.18rem,2.2vw,1.92rem);
  line-height:1.06;letter-spacing:-.028em;font-weight:400;
  text-shadow:0 1px 0 rgba(255,255,255,.28)
}
.sch-hero-sub{
  margin:5px 0 0;max-width:none;white-space:nowrap;
  font-family:var(--serif);font-style:normal;font-weight:400;
  font-size:clamp(.98rem,1.4vw,1.22rem);line-height:1.2;
  letter-spacing:-.01em;color:#6E4E1D
}
#v-grade-scholar .sch-hero-copy .lv-cta{
  display:flex;flex-wrap:nowrap;justify-content:flex-start;gap:10px;margin-top:12px
}
#v-grade-scholar .sch-hero-copy .lv-cta .btn{
  width:auto;flex:0 0 auto;white-space:nowrap
}
.sch-hero-copy .btn-gold{
  box-shadow:0 8px 18px rgba(199,154,78,.28)
}
.sch-hero-copy .btn-out{
  border-color:rgba(10,38,71,.28);color:var(--navy);background:transparent
}
.sch-hero-copy .btn-out:hover{
  border-color:var(--bronze);background:rgba(176,141,87,.12);color:var(--navy)
}

/* ----------------------------------------------------------
   Scholar hero, set to the Figma composition (node 6:713).
   The photograph is aspect-locked, so the lockup has to scale
   with it or the two drift apart. --u is one pixel of the
   1470-wide Figma frame, measured off the picture itself, so
   every number below is the Figma number and the composition
   holds at any width.
   ---------------------------------------------------------- */
@media(min-width:761px){
  .sch-hero-shot{container-type:inline-size}

  .sch-hero-titles{
    --u:calc(100cqw / 1470);
    padding-top:calc(36 * var(--u))
  }
  .sch-hero-titles .wrap{
    max-width:none;padding:0;align-items:flex-start
  }

  /* the breadcrumb is centred on the frame, above the lockup, and
     drops the underline the rest of the site's backlinks carry */
  .sch-hero-titles .backlink{
    align-self:center;margin:0 0 calc(2.56 * var(--u));
    padding-bottom:0;border-bottom:0;
    font-size:calc(13.1 * var(--u));line-height:1.653;letter-spacing:.01em
  }

  .sch-hero-lockup{
    margin-left:calc(282 * var(--u));
    column-gap:calc(27.2 * var(--u))
  }
  .sch-hero-mark{
    width:calc(200 * var(--u));height:calc(200 * var(--u));
    border-radius:50%;filter:none;
    box-shadow:0 calc(6 * var(--u)) calc(14 * var(--u)) rgba(10,38,71,.14)
  }

  /* the type column starts 25px below the seal's top edge */
  .sch-hero-copy{padding-top:calc(25 * var(--u))}

  #v-grade-scholar .sch-hero-copy .eyebrow{
    margin:0;font-size:calc(11.2 * var(--u));line-height:1.65;
    letter-spacing:.2em;font-weight:600;color:rgba(10,38,71,.72)
  }
  #v-grade-scholar .sch-hero-h{
    margin:calc(10.52 * var(--u)) 0 0;font-weight:400;
    font-size:calc(51.068 * var(--u));line-height:1.08;letter-spacing:-.025em;
    text-shadow:0 calc(1.485 * var(--u)) 0 rgba(255,255,255,.28)
  }
  #v-grade-scholar .sch-hero-sub{
    margin:calc(10.85 * var(--u)) 0 0;
    font-size:calc(20.5 * var(--u));line-height:1.199;letter-spacing:-.01em
  }

  #v-grade-scholar .sch-hero-copy .lv-cta{
    margin-top:calc(10.42 * var(--u));gap:calc(12 * var(--u))
  }
  #v-grade-scholar .sch-hero-copy .lv-cta .btn{
    display:inline-flex;align-items:center;justify-content:center;
    height:calc(52.7 * var(--u));padding:0 calc(28 * var(--u));
    border-radius:999px;font-size:calc(13.8 * var(--u));line-height:1.645
  }
  .sch-hero-copy .btn-gold{
    background:linear-gradient(177.94deg,var(--gold-hi) 0%,var(--bronze) 62%,#B0863C 100%);
    border-color:transparent;color:#14202C;
    box-shadow:inset 0 calc(1 * var(--u)) 0 rgba(255,255,255,.42),
               0 calc(8 * var(--u)) calc(11 * var(--u)) rgba(199,154,78,.3)
  }
  .sch-hero-copy .btn-out{
    border-color:rgba(10,38,71,.32);color:var(--navy);background:transparent
  }
}

/* ----------------------------------------------------------
   Photographs on this page, three ways. They are spread down
   the article rather than gathered into a gallery, and each
   treatment is different so no two read as the same tile:
     .sch-plate   a contained cinematic plate
     .sch-bleed   one full-bleed band, edge to edge
     .sch-figure  a figure inline in the reading column
   ---------------------------------------------------------- */
.sch-plate,.sch-bleed,.sch-figure{margin:0;background:#c5d0d8}
.sch-plate img,.sch-bleed img,.sch-figure img{
  display:block;width:100%;height:auto;object-fit:cover
}

/* runs straight on from the intro copy, so the words and the
   object they name read as one movement */
.sch-plate{padding-top:0;padding-bottom:clamp(48px,6vw,84px);background:none}
.sch-plate figure{margin:0;overflow:hidden;background:#c5d0d8}
/* a still life, so it takes the wide crop the group shots could not */
.sch-plate img{aspect-ratio:21 / 9;object-position:center 64%}

/* the group sits low in the frame; the crop is weighted down to it so
   no one is cut at the head or the feet */
.sch-bleed{overflow:hidden}
.sch-bleed img{aspect-ratio:2 / 1;object-position:center 82%}

/* medals still life at the foot of the Scholar page — panoramic, edge to edge */
.sch-bleed--medals{margin:0;background:#061A2E}
.sch-bleed--medals img{
  aspect-ratio:1024 / 364;
  object-fit:cover;
  object-position:center center
}

.sch-figure{
  overflow:hidden;
  margin-top:clamp(22px,2.6vw,34px)
}
.sch-figure img{aspect-ratio:3 / 2}

/* the work itself, not a speaker: crisis table, range, field */
.sch-acts{
  display:grid;grid-template-columns:1.35fr 1fr;grid-template-rows:1fr 1fr;
  gap:8px;margin-top:clamp(22px,2.6vw,34px)
}
.sch-acts figure{margin:0;overflow:hidden;background:#c5d0d8;min-height:0}
.sch-acts figure:first-child{grid-row:1 / span 2}
.sch-acts img{display:block;width:100%;height:100%;object-fit:cover}
.sch-acts figure:first-child img{aspect-ratio:3 / 4;height:100%;object-position:center 42%}
.sch-acts figure:nth-child(2) img{aspect-ratio:16 / 10;object-position:center 38%}
.sch-acts figure:nth-child(3) img{aspect-ratio:16 / 10;object-position:center 42%}

@media(max-width:760px){
  .sch-plate img{aspect-ratio:3 / 2}
  .sch-bleed img{aspect-ratio:4 / 3;object-position:center 78%}
  .sch-bleed--medals img{aspect-ratio:16 / 9;object-position:center center}
  /* Stacked, the three photographs ran to well over a screen and a half and
     buried the section under them. They become a rail instead — the same
     swipe the card lists use — so the section ends on one picture with the
     other two a nudge away, and the fade tells you they are there. */
  .sch-acts{
    display:flex;grid-template-columns:none;grid-template-rows:none;gap:8px;
    overflow-x:auto;scroll-snap-type:x mandatory;
    padding-bottom:4px;scrollbar-width:none;-webkit-overflow-scrolling:touch;
    -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 44px),transparent);
    mask-image:linear-gradient(90deg,#000 calc(100% - 44px),transparent)
  }
  .sch-acts::-webkit-scrollbar{display:none}
  .sch-acts figure{flex:0 0 82%;scroll-snap-align:start}
  .sch-acts figure:first-child{grid-row:auto}
  /* one crop for all three, or the rail steps up and down as you swipe.
     Matched selector for selector against the desktop rules above, which
     give each figure its own ratio. */
  .sch-acts figure:first-child img,
  .sch-acts figure:nth-child(2) img,
  .sch-acts figure:nth-child(3) img{aspect-ratio:4 / 3;height:auto}
}

.sch-intro{padding-block:clamp(48px,6.5vw,88px)}
.sch-intro-stand{
  margin:0;max-width:62ch;
  font-size:clamp(1.05rem,1.4vw,1.22rem);line-height:1.65;color:var(--ink)
}
.sch-intro-stand b{color:var(--navy);font-weight:600}
.sch-intro-facts{
  display:block;margin:22px 0 0;padding:0;list-style:none;
  max-width:64ch;
  font-family:var(--sans);font-size:.9rem;line-height:1.75;
  color:var(--muted);cursor:default
}
.sch-intro-facts li{display:inline}
.sch-intro-facts li:not(:last-child)::after{
  content:" · ";color:var(--bronze)
}
.sch-intro .lv-cta{margin-top:28px}
.sch-intro-detail{
  margin:20px 0 0;font-size:.85rem;color:var(--muted)
}

@media(max-width:760px){
  .sch-hero-shot{aspect-ratio:auto;display:flex;flex-direction:column}
  .sch-hero-titles{
    position:static;padding:22px 0 12px;background:#d7e0e6
  }
  .sch-hero-photo{
    aspect-ratio:16 / 9;height:auto;
    object-position:center 42%
  }
  #v-grade-scholar .sch-hero-h,.sch-hero-sub{white-space:normal}
  .sch-hero-lockup{width:100%;max-width:100%}
  #v-grade-scholar .sch-hero-h{max-width:16ch;font-size:clamp(1.2rem,5.6vw,1.7rem);margin:0}
  #v-grade-scholar .sch-hero-copy .lv-cta{flex-wrap:wrap}
  #v-grade-scholar .sch-hero-copy .lv-cta .btn{width:100%}
}

/* ==========================================================
   Scholar — journey, audience/eligibility, fees & admissions
   (from the client's NCSSP programme page, set in house style)
   ========================================================== */
.sch-eyebrow{
  margin:0 0 10px;
  font-family:var(--sans);font-size:.68rem;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;color:var(--bronze)
}
.sch-lede{margin:0 0 26px;max-width:66ch;font-size:1.02rem;line-height:1.65;color:#3D4A57}

/* the journey: five steps behind left rules */
.sch-journey{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:0;margin:8px 0 10px
}
.sch-journey-step{
  padding:24px 22px 22px;border-left:2px solid var(--line);position:relative
}
.sch-step-n{
  display:block;margin-bottom:10px;
  font-family:var(--sans);font-size:.68rem;font-weight:600;
  letter-spacing:.16em;color:var(--bronze);font-variant-numeric:tabular-nums
}
.sch-journey-step h4{
  margin:0 0 8px;font-family:var(--sans);font-size:1rem;font-weight:600;
  line-height:1.3;color:var(--navy)
}
.sch-journey-step p{margin:0;font-size:.9rem;line-height:1.55;color:#55636F}
.sch-step-tag{
  display:inline-block;margin-top:10px;
  font-family:var(--sans);font-size:.62rem;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:#B4531F
}
@media(max-width:960px){
  .sch-journey{grid-template-columns:minmax(0,1fr)}
  .sch-journey-step{padding:20px 0 20px 22px}
}

/* who it is for + the navy eligibility card */
.sch-audience-grid{
  display:grid;grid-template-columns:1.05fr .95fr;
  gap:clamp(28px,5vw,56px);align-items:start
}
@media(max-width:900px){.sch-audience-grid{grid-template-columns:minmax(0,1fr)}}
.sch-audience-list{margin:22px 0 0;padding:0;list-style:none}
.sch-audience-list li{
  position:relative;padding:12px 0 12px 26px;
  border-bottom:1px solid var(--line);
  font-size:.98rem;line-height:1.55;color:#3D4A57
}
.sch-audience-list li::before{
  content:"";position:absolute;left:2px;top:22px;
  width:8px;height:8px;border-radius:50%;background:var(--bronze)
}
.sch-eligibility{
  background:var(--navy-900);color:#fff;
  border-radius:18px;padding:32px 30px;
  box-shadow:0 1px 2px rgba(6,26,46,.08),0 18px 44px rgba(6,26,46,.16)
}
.sch-eligibility h4{
  margin:0 0 4px;font-family:var(--serif);font-weight:400;
  font-size:1.4rem;color:#fff
}
.sch-elig-lede{margin:0 0 16px;font-size:.85rem;color:rgba(255,255,255,.6)}
.sch-eligibility ul{margin:0;padding:0;list-style:none}
.sch-eligibility li{
  padding:12px 0;border-bottom:1px solid rgba(255,255,255,.13);
  font-size:.94rem;line-height:1.5;color:rgba(255,255,255,.88)
}
.sch-eligibility li:last-child{border-bottom:0}
.sch-eligibility li b{color:var(--gold-hi);font-weight:600}

/* fees & admissions */
.sch-fees-grid{
  display:grid;grid-template-columns:.9fr 1.1fr;
  gap:clamp(26px,4vw,44px);align-items:start
}
@media(max-width:900px){.sch-fees-grid{grid-template-columns:minmax(0,1fr)}}
.sch-fee-card{
  background:#fff;border-radius:18px;padding:32px 30px;
  box-shadow:0 1px 2px rgba(6,26,46,.05),0 14px 40px rgba(6,26,46,.08)
}
.sch-fee-k{
  margin:0;font-family:var(--sans);font-size:.66rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--muted)
}
.sch-fee-n{
  margin:8px 0 2px;font-family:var(--serif);font-weight:400;
  font-size:clamp(2.4rem,4vw,3rem);line-height:1;color:var(--navy);
  font-variant-numeric:tabular-nums
}
.sch-fee-sub{margin:0 0 20px;font-size:.88rem;color:var(--muted)}
.sch-fee-includes{margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}
.sch-fee-includes li{
  position:relative;padding:11px 0 11px 26px;
  border-bottom:1px solid var(--line);font-size:.92rem;color:#3D4A57
}
.sch-fee-includes li::before{
  content:"✓";position:absolute;left:0;top:10px;
  color:#2E7D5B;font-weight:700
}
.sch-fee-note{margin:16px 0 0;font-size:.84rem;line-height:1.55;color:var(--muted)}

.sch-admit ol{margin:0;padding:0;list-style:none}
.sch-admit li{
  display:flex;gap:18px;padding:18px 0;
  border-bottom:1px solid rgba(176,141,87,.3)
}
.sch-admit-n{
  flex:none;width:34px;height:34px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--navy);color:#fff;
  font-family:var(--serif);font-size:.95rem;font-variant-numeric:tabular-nums
}
.sch-admit h4{
  margin:0 0 3px;font-family:var(--serif);font-weight:600;
  font-size:1.05rem;color:var(--navy)
}
.sch-admit p{margin:0;font-size:.9rem;line-height:1.55;color:#55636F}
.sch-dates{
  margin-top:26px;background:#fff;border-radius:14px;padding:22px 26px;
  box-shadow:inset 0 0 0 1px var(--line)
}
.sch-dates dl{margin:0;display:grid;gap:0}
.sch-dates dl > div{
  display:flex;justify-content:space-between;gap:16px;
  padding:9px 0;border-bottom:1px solid var(--line);font-size:.9rem
}
.sch-dates dl > div:last-child{border-bottom:0}
.sch-dates dt{color:#3D4A57}
.sch-dates dd{margin:0;color:var(--muted)}

/* the fee card and the admissions column top-align as one band, and the
   dates panel closes flush with the card beside it */
.sch-fees-grid{align-items:stretch}
.sch-fees-grid > .sch-admit{display:flex;flex-direction:column}
.sch-admit ol{flex:none}
.sch-admit .sch-dates{margin-top:auto}
.sch-admit li:first-child{padding-top:0}

/* .lv-main p (0,1,1) was flattening the fee figure to body size */
.lv-main .sch-fee-n{
  font-size:clamp(2.4rem,4vw,3rem);line-height:1;max-width:none
}
.lv-main .sch-fee-k{font-size:.66rem}

/* the curriculum as the client's table */
.sch-curriculum td{font-size:.9rem;line-height:1.5}
.sch-cur-theme{font-weight:600;color:var(--navy)}
.sch-sat-tag{
  display:block;margin-bottom:3px;
  font-family:var(--sans);font-size:.64rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--bronze)
}
.sch-mix-note{
  margin:14px 0 0;font-size:.84rem;font-style:italic;color:var(--muted)
}

/* ==========================================================
   Standing policies, restacked
   Side-by-side cards forced the same short paragraphs into narrow
   columns and made two blocks look like a comparison. Vertically
   these read as what they are: a short list of the terms attached
   to a grade, with the label carried in a fixed left column so the
   prose starts on one line the whole way down.
   ========================================================== */
.lv-body .lv-standard{
  display:block;
  margin-top:var(--space-6, 56px);
  padding:0;
  border-top:1px solid var(--line);
  border-radius:0;background:none;gap:0
}
.lv-body .lv-std,
.lv-body:not(.is-conferred) .lv-std{
  display:grid;
  grid-template-columns:minmax(150px,.28fr) minmax(0,1fr);
  gap:clamp(18px,3vw,44px);
  padding:26px 0;margin:0;
  border:0;border-bottom:1px solid var(--line);
  border-radius:0;background:none;
  transition:background .2s ease
}
.lv-body .lv-std:hover{background:rgba(6,26,46,.018)}
.lv-body .lv-std h4{
  margin:0;align-self:start;
  font-family:var(--sans);font-size:.68rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--muted);
  line-height:1.5
}
.lv-body .lv-std p{
  margin:0;max-width:68ch;
  font-size:1rem;line-height:1.65;color:#3D4A57
}

/* the membership block still has to be the one nobody misses */
.lv-body .lv-std.is-key,
.lv-body:not(.is-conferred) .lv-std.is-key{
  grid-column:auto;
  margin:14px 0 0;padding:26px 28px;
  border:0;border-radius:16px;
  background:#FBF6EC;
  box-shadow:inset 0 0 0 1px rgba(176,141,87,.28)
}
.lv-body .lv-std.is-key:hover{background:#FBF6EC}
.lv-body .lv-std.is-key h4{color:var(--bronze)}
.lv-body .lv-std.is-key p{color:var(--navy)}

@media(max-width:760px){
  .lv-body .lv-std,
  .lv-body:not(.is-conferred) .lv-std{
    grid-template-columns:minmax(0,1fr);gap:10px;padding:22px 0
  }
  .lv-body .lv-std.is-key,
  .lv-body:not(.is-conferred) .lv-std.is-key{padding:22px 20px}
}
@media(prefers-reduced-motion:reduce){.lv-body .lv-std{transition:none}}

/* CERT-In was breaking across the hyphen at the end of a line */
.sch-nowrap{white-space:nowrap}

/* ---------- Scholar: the closing band goes to paper ----------
   Cream rather than navy, so the page ends warm. Everything that was
   set for a dark ground is inverted: the heading, the ghost button's
   rule and label, and the focus ring. */
#v-grade-scholar .lv-closing, .lv-closing{
  /* .band carries background with !important to beat the motion layer's
     inline styles, so this has to answer in kind */
  background:var(--bronze-pale, #F4EDE2) !important;
  color:var(--ink)
}
#v-grade-scholar .lv-closing, .lv-closing h2{color:var(--navy)}
#v-grade-scholar .lv-closing, .lv-closing .eyebrow,
#v-grade-scholar .lv-closing, .lv-closing .sch-eyebrow{color:var(--bronze)}
#v-grade-scholar .lv-closing, .lv-closing .lv-stand{color:#3D4A57}

/* the ghost button was white-on-dark */
#v-grade-scholar .lv-closing, .lv-closing .btn-ghost{
  border-color:rgba(10,37,64,.28);color:var(--navy);background:transparent
}
#v-grade-scholar .lv-closing, .lv-closing .btn-ghost:hover{
  border-color:var(--navy);background:rgba(10,37,64,.05);color:var(--navy)
}
#v-grade-scholar .lv-closing, .lv-closing .btn-out{
  border-color:rgba(10,37,64,.28);color:var(--navy)
}
#v-grade-scholar .lv-closing, .lv-closing .btn-out:hover{
  border-color:var(--bronze);background:rgba(176,141,87,.12);color:var(--navy)
}
#v-grade-scholar .lv-closing, .lv-closing .btn:focus-visible{outline-color:var(--navy)}

/* Scholar closing: cream field, navy eagle plate on the right */
#v-grade-scholar .sch-closing{
  overflow:hidden;
  position:relative;
  padding-block:clamp(28px,3.5vw,44px) !important
}
#v-grade-scholar .sch-closing-inner{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(200px,.85fr);
  align-items:center;
  gap:clamp(20px,3vw,40px);
  position:relative;
  min-height:0
}
#v-grade-scholar .sch-closing-copy{
  min-width:0;
  position:relative;
  z-index:1;
  max-width:none
}
#v-grade-scholar .sch-closing-copy h2{
  white-space:nowrap;
  max-width:none;
  margin:0 0 26px;
  font-size:clamp(2rem,3.2vw,3.1rem)
}
@media(max-width:900px) and (min-width:761px){
  #v-grade-scholar .sch-closing-copy h2{font-size:clamp(1.7rem,3.4vw,2.3rem)}
}
#v-grade-scholar .sch-closing-eagle{
  display:block;
  width:min(100%,392px);
  max-width:100%;
  height:auto;
  aspect-ratio:1;
  object-fit:contain;
  justify-self:end;
  align-self:center;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  pointer-events:none;
  user-select:none
}
@media(max-width:760px){
  #v-grade-scholar .sch-closing-inner{
    grid-template-columns:minmax(0,1fr);
    min-height:0;
    gap:22px
  }
  #v-grade-scholar .sch-closing-copy{max-width:none}
  #v-grade-scholar .sch-closing-copy h2{
    white-space:normal;
    font-size:clamp(1.85rem,7vw,2.4rem)
  }
  #v-grade-scholar .sch-closing-eagle{
    width:min(308px,70vw);
    justify-self:end
  }
}

/* the pill's lower edge was washing out against the panel's gradient */
nav.main .mega-lead .mega-cta{
  border-color:rgba(212,175,110,.75);
  box-shadow:0 1px 0 rgba(0,0,0,.18)
}
nav.main .mega-lead .mega-cta:hover{border-color:var(--gold-hi)}

/* the history timeline was boxed and ruled, which read as a table
   rather than a sequence; the dots and dates carry it on their own */
#v-about .tl.about-history-list{border:0;background:none}
#v-about .tl .item{border-top:0}
#v-about .tl .item p{border-top:0}

/* ---------- share row ----------
   Sits at the foot of an article or event page. Uses the existing button
   family rather than inventing a second one, so it reads as part of the
   page and not as a widget bolted on. */
.share-row{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-top:var(--space-6,48px);
  padding-top:var(--space-4,24px);
  border-top:1px solid var(--line)
}
.share-label{
  font-family:var(--sans);
  font-size:.7rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--muted);
  margin-right:2px
}
.share-row .btn{cursor:pointer}
@media(max-width:560px){
  .share-row{gap:8px}
  .share-label{width:100%;margin-bottom:2px}
}

/* ---------- event registration ----------
   Sits inside .article-body on an event page. Uses the page's own field and
   button styles rather than a second form language. */
.register{
  margin-top:var(--space-6,48px);
  padding:var(--surface-pad,28px);
  border:1px solid var(--surface-border);
  border-radius:var(--radius-compact,16px);
  background:#fff;
  box-shadow:var(--surface-shadow)
}
.register h3{margin:0 0 6px;font-size:1.15rem}
.register-note,.register-privacy{color:var(--muted);font-size:.84rem;margin:0}
.register-note{margin-bottom:14px}
.register-privacy{margin-top:14px}
.register-error{
  margin:0 0 14px;padding:10px 13px;border-radius:8px;
  background:#FDF4F4;border:1px solid #E8C9C9;color:#A32B2B;font-size:.88rem
}
.register-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;margin:14px 0 18px
}
.register-grid label{
  display:grid;gap:6px;font-family:var(--sans);
  font-size:.78rem;letter-spacing:.02em;color:var(--ink);font-weight:500
}
.register-grid input,.register-grid select{
  font-family:var(--sans);font-size:.92rem;color:var(--ink);
  background:#fff;border:1px solid #D3DAE1;border-radius:12px;
  padding:11px 13px;width:100%;min-height:var(--ui-field-height,48px)
}
.register-grid input:focus,.register-grid select:focus{
  outline:0;border-color:var(--navy);box-shadow:0 0 0 3px rgba(10,38,71,.1)
}
/* The honeypot: out of sight, out of the tab order, and hidden from
   assistive technology, but a real field in the DOM. */
.register-trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.register-done{
  margin-top:var(--space-6,48px);
  padding:var(--surface-pad,28px);
  border-radius:var(--radius-compact,16px);
  border:1px solid #C6E3D3;background:#F2F9F5
}
.register-done.waitlisted{border-color:#E8DCC0;background:#FDF9F0}
.register-done h3{margin:0 0 6px;font-size:1.1rem}
.register-done p{margin:0;color:var(--muted);font-size:.9rem}

@media(max-width:620px){
  .register-grid{grid-template-columns:minmax(0,1fr)}
}

/* the empanelment form's honeypot: in the DOM, out of sight, out of the tab
   order and hidden from assistive technology */
.aform-trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---------- cohort interest, and the newsroom subscribe strip ---------- */
.pform,.subform{
  background:#fff;border:1px solid var(--surface-border);
  border-radius:var(--radius-compact,16px);padding:var(--surface-pad,28px);
  box-shadow:var(--surface-shadow);max-width:760px
}
.pform h3,.subform h3{margin:0 0 6px;font-size:1.15rem}
.pform-lede,.subform-lede,.pform-note,.subform-note{color:var(--muted);font-size:.86rem;margin:0}
.pform-lede,.subform-lede{margin-bottom:18px}
.pform-note,.subform-note{margin-top:14px}
.pform-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:18px}
.pform-grid label,.subform label{
  display:grid;gap:6px;font-family:var(--sans);font-size:.78rem;
  letter-spacing:.02em;color:var(--ink);font-weight:500
}
.pform-grid input,.pform-grid select,.subform input{
  font-family:var(--sans);font-size:.92rem;color:var(--ink);background:#fff;
  border:1px solid #D3DAE1;border-radius:12px;padding:11px 13px;width:100%;
  min-height:var(--ui-field-height,48px)
}
.pform-grid input:focus,.pform-grid select:focus,.subform input:focus{
  outline:0;border-color:var(--navy);box-shadow:0 0 0 3px rgba(10,38,71,.1)
}
.subform-row{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.subform-row label{flex:1 1 260px}
@media(max-width:620px){
  .pform-grid{grid-template-columns:minmax(0,1fr)}
  .subform-row .btn{width:100%;justify-content:center}
}

/* ==========================================================
   HOME — layout pass (structure / spacing / alignment only)
   No content, color, or typography changes.
   ========================================================== */

/* Hero: fill the first viewport as one composition, not a tall empty navy. */
#v-home .hero{
  min-height:calc(100svh - var(--util-h,38px) - 78px);
  padding-block:clamp(64px,9vh,104px);
  display:flex;
  align-items:center
}
#v-home .hero .hero-grid{
  width:100%;
  grid-template-columns:minmax(0,1.2fr) minmax(260px,.9fr);
  gap:clamp(28px,4vw,56px);
  align-items:center
}
#v-home .hero .hero-copy{max-width:none}
#v-home .hero .heromark{
  justify-self:end;
  gap:16px
}
#v-home .hero .heromark .hero-mark{
  width:clamp(220px,26vw,360px)
}
@media(max-width:860px){
  #v-home .hero{
    min-height:0;
    padding-block:clamp(48px,8vh,72px);
    display:block
  }
  #v-home .hero .hero-grid{
    grid-template-columns:minmax(0,1fr);
    gap:22px
  }
  #v-home .hero .heromark{
    justify-self:start;
    order:-1
  }
  #v-home .hero .heromark .hero-mark{width:clamp(148px,38vw,220px)}
}

/* Trust + counters read as one proof strip under the hero. */
#v-home > .trust{padding-block:18px}
#v-home > .tight{padding-block:clamp(28px,3.6vw,40px)}
#v-home > .tight .counters{margin:0}

/* Misted intro: heading block leaves a right pocket for the ribbon;
   the two cards stay full-bleed under that intro. */
@media(min-width:1101px){
  #v-home .misted > .wrap > .eyebrow,
  #v-home .misted > .wrap > h2,
  #v-home .misted > .wrap > .lede{
    max-width:calc(100% - clamp(200px,22vw,280px))
  }
  #v-home .misted .form-ribbon{
    top:clamp(96px,12vw,140px);
    right:max(36px,calc((100vw - var(--maxw)) / 2 + 36px));
    width:clamp(170px,15vw,230px)
  }
  #v-home .misted .form-ribbon.sectionform{display:block}
}
#v-home .misted .lede[style*="margin-bottom"]{margin-bottom:var(--content-gap)!important}
#v-home .misted .grid.g2{align-items:stretch}
#v-home .misted .grid.g2 > .card{min-height:100%}

/* Ladder intro: keep the lede from inventing a second margin system. */
#v-home .ladder{margin-top:0}
#v-home section .lede[style*="margin-bottom"]{margin-bottom:var(--content-gap)!important}

/* Intakes / why / chapters cards share one row height. */
#v-home .rail-track > .grid > .card,
#v-home .grid.g3 > .card,
#v-home .grid.g2 > .card{
  min-height:100%
}

/* Schedule: fixed columns so date / title / place / status don't drift.
   Title is capped so location/status sit as a tight trailing group. */
@media(min-width:761px){
  #v-home .sched-row{
    display:grid;
    grid-template-columns:6.5rem minmax(0,1fr) auto auto;
    column-gap:clamp(18px,2vw,28px);
    align-items:center
  }
  #v-home .sched-row .nm{flex:none;min-width:0;max-width:46ch}
  #v-home .sched-row > .muted{white-space:nowrap}
  #v-home .sched-row > .pill{justify-self:end}
}
#v-home .sched + div{margin-top:var(--content-gap)}

/* Newsroom: header and rail share one vertical rhythm; tweets become a
   quieter secondary band under the editorial cards. */
#v-home .paper > .wrap > div:has(> .eyebrow){
  margin-bottom:var(--content-gap)
}
#v-home .paper > .wrap > .rail + .grid.g3{
  margin-top:var(--space-5);
  padding-top:var(--space-5);
  border-top:1px solid var(--line)
}

/* Closing band: keep the mark + CTA as a compact centered stack. */
#v-home .band{
  padding-block:clamp(72px,8vw,96px)
}
#v-home .band .wrap{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:0
}
#v-home .band h2{max-width:18ch;margin-inline:auto}
#v-home .band p{max-width:42ch;margin-inline:auto}
#v-home .band .row{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:12px;
  margin-top:var(--space-5)
}
#v-home .band .brass{margin-bottom:var(--space-4)}

@media(max-width:760px){
  #v-home > .tight{padding-block:32px}
  #v-home .band{padding-block:64px}
}

/* ==========================================================
   EMPANELMENT — layout pass (structure / spacing / alignment)
   ========================================================== */

/* Hero: copy + CTA on the left; the fact line becomes a right rail
   that wraps into a compact key-points panel. */
@media(min-width:901px){
  #v-empanelment .lv-hero .wrap{
    display:grid;
    grid-template-columns:minmax(0,1.35fr) minmax(220px,.7fr);
    column-gap:clamp(28px,4.5vw,64px);
    align-items:center
  }
  #v-empanelment .lv-hero .crumbs{grid-column:1 / -1}
  #v-empanelment .lv-hero .eyebrow,
  #v-empanelment .lv-hero .lv-headline,
  #v-empanelment .lv-hero .lv-stand,
  #v-empanelment .lv-hero .lv-cta{grid-column:1;max-width:34rem}
  #v-empanelment .lv-hero .lv-detail{
    grid-column:2;
    grid-row:3 / 6;
    align-self:stretch;
    justify-self:stretch;
    display:grid;
    place-content:center;
    margin:0;
    padding:28px 30px;
    border:1px solid rgba(255,255,255,.16);
    border-radius:var(--radius-compact,16px);
    line-height:1.7;
    max-width:none;
    width:100%;
    box-sizing:border-box;
    text-wrap:pretty
  }
}
#v-empanelment .lv-hero{
  padding-block:clamp(36px,5vw,56px) clamp(48px,6vw,72px)
}
#v-empanelment .lv-hero .lv-cta{margin-top:var(--space-5)}
#v-empanelment .lv-hero .lv-stand{margin-top:18px}

/* Reading column takes more of the measure; sticky index stays a slim rail. */
#v-empanelment .lv-body{padding-block:clamp(48px,5vw,72px) var(--section-space)}
#v-empanelment .lv-grid.is-single.has-index,
#v-empanelment .lv-body > .wrap.lv-grid.is-single.has-index,
#v-empanelment .lv-body > .wrap{
  grid-template-columns:minmax(0,1fr) minmax(200px,230px);
  gap:clamp(28px,3.5vw,48px)
}
#v-empanelment .lv-index{
  top:calc(var(--util-h,38px) + 88px);
  padding-left:18px
}
#v-empanelment .lv-index ol{gap:1px}
#v-empanelment .lv-section[id]{
  scroll-margin-top:calc(var(--util-h,38px) + 100px)
}

/* Grades ladder: same equal, top-aligned columns as home. */
@media(min-width:961px){
  #v-empanelment .lv-ladder,
  #v-empanelment .ladder{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:clamp(20px,3vw,40px);
    align-items:start
  }
}

/* Benefits: closed categories as a 2-up board; open one takes the row. */
@media(min-width:820px){
  #v-empanelment .lv-benefit-deck{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:var(--space-3)
  }
  #v-empanelment .lv-benefit[open]{grid-column:1 / -1}
}

/* Tables and outcome blocks use the full main column. */
#v-empanelment .lv-tablewrap,
#v-empanelment .lv-standard,
#v-empanelment .lv-outcome-grid{max-width:none}
#v-empanelment .lv-chapter{padding-top:var(--space-6)}
#v-empanelment .lv-main > .lv-chapter:first-child{padding-top:0}

/* Closing band stays a short centered stack. */
#v-empanelment .lv-closing{
  padding-block:clamp(64px,7vw,88px)
}
#v-empanelment .lv-closing .wrap{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center
}
#v-empanelment .lv-closing h2{max-width:18ch;margin-inline:auto}
#v-empanelment .lv-closing .lv-cta{
  justify-content:center;
  margin-top:var(--space-5)
}

@media(max-width:900px){
  #v-empanelment .lv-body > .wrap{
    grid-template-columns:minmax(0,1fr);
    gap:var(--space-5)
  }
  #v-empanelment .lv-index{
    position:static;
    padding:0 0 var(--space-4);
    border-left:0;
    border-bottom:1px solid var(--line)
  }
}

/* ==========================================================
   PROGRAMS — layout pass (structure / spacing / alignment)
   ========================================================== */

#v-programs > section.paper{
  padding-block:clamp(56px,6vw,80px)
}
#v-programs > section.paper > .wrap > .lede{
  margin-bottom:0;
  max-width:62ch
}
#v-programs .pfilter{
  margin-top:var(--content-gap);
  margin-bottom:0;
  padding-bottom:var(--space-5);
  border-bottom:1px solid var(--line)
}
#v-programs .grid.g2{
  margin-top:var(--space-6);
  align-items:stretch
}
#v-programs .grid.g2 > .card{
  min-height:100%;
  height:100%;
  display:flex;
  flex-direction:column
}
#v-programs .grid.g2 > .card .more{
  margin-top:auto;
  padding-top:var(--space-3)
}

/* Campus Alliance: full-width featured strip under the program grid. */
@media(min-width:821px){
  #v-programs > section.paper > .wrap > .card.dark{
    margin-top:var(--space-6);
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:
      "eye cta"
      "title cta"
      "body cta";
    column-gap:clamp(24px,4vw,48px);
    row-gap:8px;
    align-items:center;
    padding:clamp(28px,3vw,36px) clamp(28px,3vw,40px)
  }
  #v-programs > section.paper > .wrap > .card.dark .eyebrow{grid-area:eye;margin:0}
  #v-programs > section.paper > .wrap > .card.dark h3{grid-area:title;margin:0}
  #v-programs > section.paper > .wrap > .card.dark p{
    grid-area:body;margin:0;max-width:58ch
  }
  #v-programs > section.paper > .wrap > .card.dark .more{
    grid-area:cta;
    margin:0;
    justify-self:end;
    align-self:center
  }
}
@media(max-width:820px){
  #v-programs > section.paper > .wrap > .card.dark{margin-top:var(--space-5)}
}

/* Training / partners table: air under the lede, full measure. */
#v-programs > .stone .lede{margin-bottom:var(--content-gap);max-width:60ch}
#v-programs > .stone table{width:100%;margin:0}

/* Cohort interest: form as a contained block, not a floating island. */
#v-programs > .stone:has(.pform){
  padding-block:clamp(56px,6vw,80px)
}
#v-programs > .stone .pform{
  max-width:720px;
  margin-inline:auto
}

/* ==========================================================
   EVENTS / CHAPTERS / ABOUT / CONTACT — layout pass
   ========================================================== */

/* ----- Events ----- */
#v-events > section.paper{
  padding-block:clamp(56px,6vw,80px)
}
#v-events .lede{max-width:58ch;margin-bottom:0}
#v-events .filters{
  margin-top:var(--content-gap);
  margin-bottom:0;
  padding-bottom:var(--space-5);
  border-bottom:1px solid var(--line);
  display:flex;flex-wrap:wrap;gap:12px
}
#v-events .event-list{
  margin-top:var(--space-6);
  border-radius:var(--radius-card,24px);
  overflow:hidden
}
@media(min-width:761px){
  #v-events .ev{
    grid-template-columns:84px minmax(0,1fr) auto;
    column-gap:clamp(16px,2vw,24px)
  }
  #v-events .ev .body{max-width:52ch}
  #v-events .ev .pill{justify-self:end;align-self:center}
}
#v-events > .stone{
  padding-block:clamp(48px,5vw,72px)
}
#v-events > .stone .grid,
#v-events > .stone .archive-list{margin-top:var(--content-gap)}

/* ----- Chapters ----- */
#v-chapters > section.paper{
  padding-block:clamp(56px,6vw,80px)
}
#v-chapters .lede{max-width:58ch;margin-bottom:0}
#v-chapters .chapter-map-wrap{
  margin-top:var(--space-6);
  margin-bottom:var(--space-6)
}
#v-chapters .grid.g3{
  align-items:stretch;
  margin-top:0
}
#v-chapters .grid.g3 > .chap,
#v-chapters .grid.g3 > .card{
  min-height:100%;
  height:100%;
  display:flex;
  flex-direction:column
}
#v-chapters .chapters-actions{
  margin-top:var(--space-6);
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  justify-content:flex-start
}

/* ----- About ----- */
#v-about > section.paper{
  padding-block:clamp(56px,6vw,72px)
}
#v-about > section.paper .lede{max-width:60ch;margin:0}
#v-about .statement{
  padding-block:clamp(64px,8vw,96px)
}
#v-about .statement .wrap{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:var(--space-5)
}
#v-about .statement p{
  margin:0 auto;
  max-width:28ch
}
#v-about .about-facts-grid,
#v-about .grid.g2.about-facts-grid{
  align-items:stretch;
  gap:var(--grid-gap)
}
#v-about .about-facts-grid > *{min-height:100%}
#v-about .band{
  padding-block:clamp(72px,8vw,96px)
}
#v-about .band .wrap{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center
}
#v-about .band .row,
#v-about .band .lv-cta{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:12px;
  margin-top:var(--space-5)
}

/* Contact form lives on About: intro left, form right */
#v-about .about-contact{
  padding-block:clamp(72px,9vw,112px)
}
#v-about .about-contact > .wrap.about-contact-wrap,
#v-about .about-contact .about-contact-wrap{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.15fr);
  gap:clamp(40px,6vw,80px);
  align-items:start;
  max-width:1120px;
  text-align:left;
  flex-direction:unset
}
#v-about .about-contact-intro{
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  align-items:flex-start;
  align-self:start;
  gap:18px;
  max-width:28ch;
  min-height:0;
  padding-top:0
}
#v-about .about-contact-intro .brass{
  margin:0 0 6px;
  width:clamp(72px,8vw,96px);
  height:auto
}
#v-about .about-contact-intro h2{
  margin:0;
  color:#fff;
  font-size:clamp(2.4rem,4.2vw,3.4rem);
  line-height:1.05;
  letter-spacing:-.01em;
  white-space:nowrap
}
#v-about .about-contact-intro p{
  margin:0;
  max-width:28ch;
  color:rgba(255,255,255,.72);
  font-size:1.02rem;
  line-height:1.55
}
#v-about .cform-on-dark{
  display:grid;
  gap:16px;
  max-width:none;
  width:100%
}
#v-about .cform-on-dark .cform-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px
}
#v-about .cform-on-dark label{
  color:rgba(255,255,255,.58);
  letter-spacing:.16em
}
#v-about .cform-on-dark input,
#v-about .cform-on-dark select,
#v-about .cform-on-dark textarea{
  background:rgba(255,255,255,.05);
  border-color:rgba(255,255,255,.2);
  color:#fff;
  border-radius:10px;
  padding:13px 15px
}
#v-about .cform-on-dark textarea{
  min-height:132px
}
#v-about .cform-on-dark input::placeholder,
#v-about .cform-on-dark textarea::placeholder{color:rgba(255,255,255,.35)}
#v-about .cform-on-dark input:focus,
#v-about .cform-on-dark select:focus,
#v-about .cform-on-dark textarea:focus{
  border-color:var(--bronze);
  box-shadow:0 0 0 4px rgba(176,141,87,.22);
  background:rgba(255,255,255,.08)
}
#v-about .cform-on-dark select{
  -webkit-appearance:none;
  appearance:none;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%23B08D57' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 15px center;
  background-size:11px 7px;
  padding-right:40px
}
#v-about .cform-on-dark select option{color:var(--ink);background:#fff}
#v-about .cform-on-dark .btn{margin-top:4px}
#v-about .cform-on-dark .cform-note{color:rgba(255,255,255,.7)}
@media(max-width:900px){
  #v-about .about-contact > .wrap.about-contact-wrap,
  #v-about .about-contact .about-contact-wrap{
    grid-template-columns:1fr;
    gap:36px;
    justify-items:stretch;
    align-items:start
  }
  #v-about .about-contact-intro{
    align-items:center;
    justify-content:flex-start;
    text-align:center;
    max-width:none;
    min-height:0
  }
  #v-about .about-contact-intro p{max-width:40ch}
}
@media(max-width:560px){
  #v-about .cform-on-dark .cform-row{grid-template-columns:1fr}
}

/* ----- Contact (legacy view removed; form is on About) ----- */
@media(max-width:760px){
  #v-events .filters{gap:10px}
}

/* ==========================================================
   Empanelment panel, to the Figma (file 6Dn5XYG3, node 53:369).
   Foundation and Technical run as a pair of columns; Management
   is promoted out of the third column into a full-width band on
   a cream field with the line-drawn eagle set into it, and a
   gold rule closes the panel along the bottom of the white side.
   Desktop only: below 1010px the menu is the dark accordion and
   none of this applies.
   ========================================================== */
@media(min-width:1011px){
  /* the Figma card is 833px: a 280px rail against 553px of white. The
     1080px `is-wide` panel left the two columns swimming, so this one
     panel is sized to the drawing. */
  nav.main .navmenu:has(.mega-links.is-tracks){
    width:min(860px,calc(100vw - 56px))
  }
  nav.main .navmenu:has(.mega-links.is-tracks) .mega-inner{
    grid-template-columns:280px minmax(0,1fr)
  }

  .mega-links.is-tracks{
    position:relative;
    grid-template-columns:repeat(2,minmax(0,1fr));
    row-gap:14px;
    padding-bottom:24px           /* 18px of air + the 6px rule */
  }

  /* the gold rule, flush to the bottom edge of the white side */
  .mega-links.is-tracks::after{
    content:"";
    position:absolute;left:0;right:0;bottom:0;height:6px;
    background:var(--gold-hi)
  }

  /* ---- Management, as the band ---- */
  .mega-links.is-tracks .mega-track[data-track="Management"]{
    position:relative;
    grid-column:1 / -1;
    min-height:154px;
    padding:18px;
    border-radius:12px;
    background:rgba(253,221,168,.25)   /* Figma fill, over the white panel */
  }

  /* the eagle, centred in the band and set to its right half */
  .mega-links.is-tracks .mega-track[data-track="Management"]::after{
    content:"";
    position:absolute;top:50%;right:11.5%;
    width:201px;height:201px;transform:translateY(-50%);
    background:url("/img/eagle-line.png") center/contain no-repeat;
    pointer-events:none
  }

  /* the band's rows are tighter than the columns', carry no rules
     between them, and stop short of the eagle */
  nav.main .mega-track[data-track="Management"] .mega-track-h{
    margin-bottom:8px;padding:0 14px;border-bottom:0
  }
  nav.main .mega-track[data-track="Management"] a{
    position:relative;z-index:1;
    max-width:min(280px,48%);
    padding:12px 14px;
    border-bottom:0;border-radius:8px
  }
  nav.main .mega-track[data-track="Management"] a:hover,
  nav.main .mega-track[data-track="Management"] a:focus-visible,
  nav.main .mega-track[data-track="Management"] a.is-current{
    background:rgba(253,221,168,.5)
  }
}

/* ==========================================================
   Progressive disclosure
   The Scholar page carries a prospectus worth of detail. A reader
   arriving cold should meet the argument, not the whole file, so the
   elaboration folds away behind a labelled toggle and the claim stays
   in the open.

   Two shapes, one language, both borrowing the bronze marker the FAQ
   and the decide rail already use so a fold reads as the same gesture
   everywhere on the site:
     .lv-more   one fold under a passage — the detail for whoever wants it
     .lv-fold   a fold per item — titles are the scannable layer
   Both are real <details>, so in-page search, deep links and print
   still reach the content.
   ========================================================== */
.lv-more{margin-top:clamp(18px,2vw,26px)}
.lv-more > summary{
  display:flex;align-items:center;gap:10px;
  padding:13px 0;cursor:pointer;list-style:none;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  font-family:var(--sans);font-size:.88rem;font-weight:500;color:var(--navy)
}
.lv-more > summary::-webkit-details-marker{display:none}
.lv-more > summary::after{
  content:"+";margin-left:auto;flex:none;
  color:var(--bronze);font-size:1.05rem;line-height:1;transition:transform .2s ease
}
.lv-more[open] > summary{border-bottom-color:transparent}
.lv-more[open] > summary::after{transform:rotate(45deg)}
.lv-more > summary:hover{color:var(--bronze)}
.lv-more > summary:focus-visible{
  outline:none;border-radius:8px;
  box-shadow:0 0 0 3px rgba(199,154,78,.72)
}
.lv-more-body{padding-top:clamp(14px,1.6vw,20px)}
.lv-more-body > :first-child{margin-top:0}
.lv-more-body > :last-child{margin-bottom:0}
.lv-more-body .lv-tablewrap{margin-top:0}

/* a fold per item: the titles carry the scan, the paragraphs wait */
.lv-folds{margin-top:clamp(18px,2vw,26px);border-top:1px solid var(--line)}
.lv-fold{border-bottom:1px solid var(--line)}
.lv-fold > summary{
  display:flex;align-items:baseline;gap:16px;
  padding:16px 0;cursor:pointer;list-style:none;
  font-family:var(--sans);font-size:.99rem;font-weight:500;color:var(--navy)
}
.lv-fold > summary::-webkit-details-marker{display:none}
.lv-fold > summary::after{
  content:"+";margin-left:auto;flex:none;
  color:var(--bronze);font-size:1.05rem;line-height:1;transition:transform .2s ease
}
.lv-fold[open] > summary::after{transform:rotate(45deg)}
.lv-fold > summary:hover{color:var(--bronze)}
.lv-fold > summary:focus-visible{
  outline:none;border-radius:8px;
  box-shadow:inset 0 0 0 3px rgba(199,154,78,.72)
}
.lv-fold-body{padding:0 0 18px}
.lv-fold-body p{margin:0;max-width:68ch}

@media(prefers-reduced-motion:reduce){
  .lv-more > summary::after,.lv-fold > summary::after{transition:none}
}

/* The twelve themes, in the open: the roll a reader scans before deciding
   whether the full schedule is worth opening. Numbers come from the data,
   so the week column is the label rather than a list marker. */
.sch-cur-themes{
  margin:clamp(18px,2vw,26px) 0 0;padding:0;list-style:none;
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:2px clamp(20px,2.4vw,34px)
}
.sch-cur-themes li{
  display:flex;align-items:baseline;gap:12px;
  padding:9px 0;border-bottom:1px solid var(--line);
  font-size:.95rem;line-height:1.45;color:var(--navy)
}
.sch-cur-wk{
  flex:none;min-width:1.9em;
  font-family:var(--sans);font-size:.76rem;font-weight:600;
  letter-spacing:.06em;color:var(--bronze)
}
@media(max-width:760px){
  .sch-cur-themes{grid-template-columns:minmax(0,1fr)}
}

/* ==========================================================
   Schedule surfaces fed by /api/schedule
   ========================================================== */

/* The strip's rows became links when they started carrying real events, so
   each one can reach its own page. They keep reading as rows rather than as
   a stack of blue links. */
#v-home .sched-row{
  color:inherit;text-decoration:none;
  transition:background .18s ease
}
#v-home a.sched-row:hover{background:#FBF8F2}
#v-home a.sched-row:focus-visible{
  outline:none;box-shadow:inset 0 0 0 3px rgba(199,154,78,.72)
}

/* A grade with no published sitting says so, quietly. Left at the muted
   weight so an announced date still wins the eye on a page that has one. */
.lv-next-tbc{color:#3D4A57;font-weight:500}

/* ==========================================================
   Edit mode, seen only inside the studio's preview frame
   ========================================================== */
body.nsd-editing [data-slot]{
  outline:1px dashed rgba(176,141,87,.55);outline-offset:2px;
  cursor:pointer;transition:outline-color .12s ease,background .12s ease
}
body.nsd-editing [data-slot]:hover{
  outline:2px solid var(--bronze);background:rgba(199,154,78,.09)
}
body.nsd-editing [data-slot].nsd-slot-active{
  outline:2px solid var(--navy);background:rgba(10,38,71,.07)
}
/* A hidden section stays visible while editing, greyed, so it can be brought
   back. Hiding it outright would make it unreachable from the preview. */
body.nsd-editing [data-section][hidden]{
  display:block !important;opacity:.34;filter:grayscale(1)
}
body.nsd-editing [data-section][hidden]::before{
  content:"Hidden";position:sticky;top:0;z-index:5;display:block;
  padding:5px 10px;background:var(--navy);color:#fff;
  font-family:var(--sans);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase
}
