/* ==========================================================================
   VJKF — Verna J. Kirkness Education Foundation
   Design system. Tokens and component language carried over from the
   approved "About v2" build (Aug 2026) + the 2022 brand guide.
   ========================================================================== */

:root{
  /* Brand */
  --navy:#001F34;
  --navy-hover:#013a5e;
  /* navy used as a panel background, kept separate from navy-as-text so that
     dark mode can lighten the text without lightening the panels */
  --band:#001F34;
  --band-hover:#013a5e;
  --header-bg:rgba(253,252,249,.94);
  --nav-bg:rgba(0,31,52,.97);
  --navy-tint:#eef3f6;
  --tint-olive:#eef3e2;     /* soft brand tints for icon chips and accents */
  --tint-red:#fbeced;
  --tint-cream:#f8f2d6;
  --olive:#829F39;          /* brand olive: graphics, rules, button fills */
  --olive-hover:#74902f;
  --olive-dark:#5c7326;     /* darkened so small olive TEXT clears AA */
  --olive-deep:#5e7623;     /* olive surfaces that carry white text */
  --olive-cream:#4e621e;    /* olive text on the cream ground */
  --on-olive:#001F34;       /* fixed ink for text on brand olive, both themes */
  --red:#CA2A31;
  --cream:#F1E9B6;

  /* Neutrals */
  --ink:#2B2A29;
  --body:#3a3a38;
  --body-soft:#4a4a48;
  --gray:#6b6b6b;
  --line:#e2e2e0;
  --paper:#fdfcf9;
  --white:#fff;

  /* On-navy text */
  --on-navy:#dbe6ec;
  --on-navy-soft:#9fb3bf;

  --wrap:1180px;
  --gutter:32px;
  --header-h:92px;

  --shadow-photo:0 1px 3px rgba(0,0,0,.08), 0 20px 44px rgba(0,31,52,.14);
  --shadow-card:0 1px 3px rgba(0,0,0,.08), 0 4px 14px rgba(0,31,52,.06);
  --ease:.14s ease;

  --font:"Helvetica Neue",Helvetica,Arial,"Segoe UI",sans-serif;
}

/* ---------- reset / base ---------- */
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 64px);overflow-x:clip;}
body{
  font-family:var(--font);
  color:var(--ink);
  background:var(--paper);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
/* height:auto is load-bearing — without it the width/height attributes on <img>
   fight the CSS width and squash the image. */
img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;}
:focus-visible{outline:2px solid var(--olive);outline-offset:3px;border-radius:2px;}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter);width:100%;}

.skip-link{
  position:absolute;left:-9999px;top:0;z-index:2000;
  background:var(--band);color:#fff;padding:12px 20px;font-weight:700;font-size:14px;
}
.skip-link:focus{left:0;}

/* ---------- typography ---------- */
.eyebrow{
  font-size:12.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--olive-dark);
}
.eyebrow-rule{display:flex;align-items:center;gap:14px;}
.eyebrow-rule::before{content:"";width:34px;height:2px;background:var(--olive);flex:none;}
/* a page whose eyebrow is its name (Pamela: the small green title got lost) */
.eyebrow.is-page-title{font-size:15px;letter-spacing:.12em;}
.hero-credit{margin-top:18px;font-size:14px;}
.eyebrow.is-page-title::before{width:44px;}

h1,h2,h3,h4{
  color:var(--navy);letter-spacing:-.01em;line-height:1.15;font-weight:800;
  text-wrap:balance;              /* Baseline since 2024 — headings only */
}
p{text-wrap:pretty;}              /* kills orphans; degrades to normal */
a{text-decoration-skip-ink:all;}
blockquote{text-wrap:balance;}
.h1,h1{font-size:clamp(32px,4.2vw,46px);line-height:1.14;}
.h2,h2{font-size:clamp(27px,3.7vw,42px);}
.h3,h3{font-size:19px;letter-spacing:-.005em;}
p{font-size:16.5px;color:var(--body);}
.lead{font-size:17px;color:var(--body);}
.muted{color:var(--gray);}
.small{font-size:14px;}

.section-head{max-width:660px;margin-bottom:52px;}
.section-head .eyebrow{margin-bottom:14px;display:block;}
.section-head p{margin-top:16px;}

section{padding:100px 0;}
.section-tight{padding:84px 0;}
.section-tint{background:var(--navy-tint);}
.section-cream{background:var(--cream);}
.section-cream p{color:#4a4736;}
.section-paper{background:var(--paper);}
.section-white{background:var(--white);}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-size:13.5px;font-weight:700;letter-spacing:.03em;
  padding:11px 22px;border-radius:4px;border:none;
  font-family:var(--font);
  transition:background var(--ease), color var(--ease), border-color var(--ease);
  white-space:nowrap;cursor:pointer;
}
.btn-olive{background:var(--olive);color:var(--on-olive);}
.btn-olive:hover{background:var(--olive-hover);color:var(--on-olive);}
.btn-navy{background:var(--band);color:#fff;}
.btn-navy:hover{background:var(--band-hover);color:#fff;}
.btn-outline{border:1.5px solid var(--navy);color:var(--navy);background:none;}
.btn-outline:hover{background:var(--band);color:#fff;}
.btn-outline-white{border:1.5px solid rgba(255,255,255,.7);color:#fff;background:none;}
.btn-outline-white:hover{background:#fff;color:var(--navy);border-color:#fff;}
.btn-lg{font-size:14.5px;padding:14px 28px;}
.btn-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px;}

/* ==========================================================================
   TOP UTILITY BAR — scrolls away; the header below it sticks
   ========================================================================== */
.topbar{background:var(--band);color:var(--on-navy);}
.topbar .wrap{
  display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:40px;
}
.topbar-left,.topbar-right{display:flex;align-items:center;gap:22px;}
.topbar a,.topbar span{font-size:13px;letter-spacing:.01em;}
.topbar a{padding:11px 0;display:inline-block;}  /* 24px+ touch target */
.topbar a{color:var(--on-navy);transition:color var(--ease);}
.topbar a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px;
  text-decoration-color:var(--olive);}
.topbar-tag{
  color:var(--on-navy-soft);border-right:1px solid rgba(255,255,255,.18);padding-right:22px;
}
@media (max-width:880px){
  .topbar-tag{display:none;}
}
@media (max-width:560px){
  .topbar .wrap{justify-content:center;gap:18px;min-height:36px;}
  .topbar-phone,.topbar-right a[href="/contact/"]{display:none;}
}

/* ==========================================================================
   HEADER
   ========================================================================== */
.site-header{
  position:sticky;top:0;z-index:900;
  background:var(--header-bg);
  border-bottom:1px solid var(--line);
  transition:box-shadow var(--ease);
}
/* backdrop-filter creates a containing block for position:fixed descendants, so
   it may only be applied at widths where .main-nav is NOT fixed. Applying it at
   mobile clips the menu panel to the header's height. Do not move this. */
@media (min-width:1181px){
  .site-header{
    backdrop-filter:saturate(180%) blur(10px);
    -webkit-backdrop-filter:saturate(180%) blur(10px);
  }
}
.site-header.is-scrolled{box-shadow:0 1px 3px rgba(0,31,52,.06), 0 6px 20px rgba(0,31,52,.06);}
.site-header .wrap{
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  height:var(--header-h);
}
.brand{display:flex;align-items:center;flex:none;}
.brand img{height:56px;width:auto;}

.nav-toggle{
  display:none;background:none;border:1px solid var(--line);border-radius:4px;
  width:42px;height:42px;cursor:pointer;position:relative;flex:none;
}
.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{
  content:"";position:absolute;left:11px;width:20px;height:2px;background:var(--navy);
  transition:transform .2s ease, opacity .2s ease;
}
.nav-toggle span{top:20px;}
.nav-toggle span::before{top:-6px;left:0;}
.nav-toggle span::after{top:6px;left:0;}
.nav-toggle[aria-expanded="true"] span{background:transparent;}
.nav-toggle[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg);}
.nav-toggle[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg);}

.main-nav{display:flex;align-items:center;gap:4px;}
.main-nav > li{position:relative;list-style:none;}
.nav-link{
  display:inline-flex;align-items:center;gap:6px;
  font-size:14.5px;font-weight:600;color:var(--navy);
  padding:10px 14px;border-radius:4px;
  border-bottom:2px solid transparent;
  transition:color var(--ease), border-color var(--ease);
  background:none;border-left:none;border-right:none;border-top:none;cursor:pointer;
}
.nav-link:hover{color:var(--olive-dark);border-bottom-color:var(--olive);}
.nav-link[aria-current="page"],
.main-nav li.is-active > .nav-link{color:var(--navy);border-bottom-color:var(--olive);}
.nav-caret{width:8px;height:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(45deg) translate(-1px,-1px);transition:transform var(--ease);flex:none;}
.has-dropdown[aria-expanded="true"] .nav-caret{transform:rotate(-135deg) translate(-2px,-2px);}

.dropdown{
  position:absolute;top:calc(100% + 8px);left:0;min-width:250px;
  background:var(--white);border:1px solid var(--line);border-radius:8px;
  box-shadow:var(--shadow-card);padding:8px;
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .16s ease, transform .16s ease, visibility .16s ease;
  list-style:none;
}
.main-nav li:hover > .dropdown,
.has-dropdown[aria-expanded="true"] + .dropdown{opacity:1;visibility:visible;transform:translateY(0);}
.dropdown a{
  display:block;padding:10px 14px;border-radius:5px;
  font-size:14px;font-weight:600;color:var(--navy);
  transition:background var(--ease), color var(--ease);
}
.dropdown a span{display:block;font-size:12.5px;font-weight:400;color:var(--gray);margin-top:2px;}
.dropdown a:hover{background:var(--navy-tint);}
.dropdown a:hover span{color:var(--body-soft);}

.header-cta{display:flex;align-items:center;gap:8px;flex:none;}
.btn-header{white-space:nowrap;}

@media (max-width:1180px){
  .nav-toggle{display:block;}
  .main-nav{
    position:fixed;top:var(--header-h);left:0;right:0;
    height:calc(100dvh - var(--header-h));
    flex-direction:column;align-items:stretch;gap:0;
    background:var(--paper);border-top:1px solid var(--line);
    padding:16px var(--gutter) 48px;overflow-y:auto;
    transform:translateX(100%);transition:transform .24s ease;
  }
  .main-nav.is-open{transform:translateX(0);}
  .nav-link{width:100%;justify-content:space-between;padding:16px 4px;font-size:17px;
    border-bottom:1px solid var(--line);border-radius:0;}
  .nav-link:hover,.main-nav li.is-active > .nav-link{border-bottom-color:var(--line);}
  .dropdown{
    position:static;opacity:1;visibility:visible;transform:none;
    border:none;box-shadow:none;padding:4px 0 12px 4px;background:none;
    display:none;
  }
  .has-dropdown[aria-expanded="true"] + .dropdown{display:block;}
  .dropdown a{padding:12px 12px;font-size:15px;}
  .header-cta .btn-header{display:none;}
  .nav-toggle{order:3;}
  .header-cta{order:2;}
  .main-nav .nav-donate{display:flex;flex-direction:column;gap:10px;margin-top:24px;}
  .main-nav .nav-donate .btn{width:100%;padding:15px;font-size:15px;}
}
@media (min-width:1181px){
  .main-nav .nav-donate{display:none;}
}
@media (max-width:520px){
  .brand img{height:44px;}
}

/* ==========================================================================
   COMPONENTS
   ========================================================================== */

/* ---------- page hero (editorial split, on paper) ---------- */
.page-hero{background:var(--paper);padding:88px 0 76px;}
.page-hero .wrap{display:grid;grid-template-columns:1.12fr .88fr;gap:60px;align-items:center;}
.page-hero .eyebrow{margin-bottom:20px;}
.page-hero h1{margin-bottom:22px;}
.page-hero p.lead{max-width:520px;margin-bottom:32px;}
.hero-meta{
  display:flex;flex-wrap:wrap;gap:8px 0;
  padding-top:24px;border-top:1px solid var(--line);
  font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--gray);
}
/* ::after on the preceding item, so a wrapped line never starts with a stray
   separator the way a leading ::before does. */
.hero-meta span:not(:last-child)::after{
  content:"\00b7";color:var(--olive);font-weight:800;margin:0 10px;
}
/* single-column variant for short pages — stays left-aligned with the content
   below it rather than centring in a narrower column */
.page-hero.is-narrow{padding:76px 0 56px;}
.page-hero.is-narrow .wrap{grid-template-columns:1fr;}
.page-hero.is-narrow h1{max-width:820px;}
.page-hero.is-narrow p.lead{max-width:660px;margin-bottom:0;}

/* ---------- cost pledge: the single most important message for a student ---------- */
.pledge{background:var(--band);color:#fff;padding:96px 0;}
.pledge .wrap{max-width:900px;text-align:center;}
.pledge .eyebrow{color:var(--cream);display:block;margin-bottom:22px;}
.pledge h2{
  font-size:clamp(30px,4.6vw,52px);color:#fff;line-height:1.14;letter-spacing:-.02em;
  margin-bottom:26px;
}
.pledge h2 em{font-style:normal;color:var(--cream);}
.pledge p{font-size:17.5px;color:var(--on-navy);max-width:620px;margin:0 auto;}
.pledge-items{
  display:flex;flex-wrap:wrap;justify-content:center;gap:14px 0;
  margin-top:44px;padding-top:36px;border-top:1px solid rgba(255,255,255,.16);
}
.pledge-item{
  padding:0 20px;font-size:13.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;
  color:var(--on-navy);border-right:1px solid rgba(255,255,255,.16);
}
.pledge-item:last-child{border-right:none;}
@media (max-width:640px){
  .pledge{padding:68px 0;}
  .pledge-items{flex-direction:column;gap:14px;}
  .pledge-item{border-right:none;padding:0;}
}

/* ---------- embedded donation form ---------- */
.donate-head{max-width:720px;margin:0 auto 40px;text-align:center;}
.donate-head .eyebrow{display:block;margin-bottom:14px;}
.donate-head h2{margin-bottom:16px;}
.donate-head p{font-size:15px;}
.donate-embed{
  max-width:820px;margin:0 auto;background:#fff;border-radius:12px;overflow:hidden;
  box-shadow:0 1px 3px rgba(0,0,0,.10), 0 20px 44px rgba(0,0,0,.22);
}
.donate-embed iframe{display:block;width:100%;height:1500px;border:0;}
.donate-fallback{
  text-align:center;margin-top:24px;font-size:14px;color:var(--on-navy-soft);
  display:flex;flex-direction:column;align-items:center;gap:12px;
}
.donate-fallback a{
  color:var(--cream);font-weight:600;
  text-decoration:underline;text-underline-offset:3px;
}
.donate-fallback a:hover{color:#fff;}
@media (max-width:640px){
  .donate-embed iframe{height:1750px;}
}

/* ---------- eligibility: copy left, photo right ---------- */
.eligibility-wrap{display:grid;grid-template-columns:1.02fr .98fr;gap:64px;align-items:center;}
.eligibility-wrap .checklist{max-width:520px;}
.eligibility-wrap .checklist li{border-bottom-color:#dbe4ea;}
@media (max-width:920px){
  .eligibility-wrap{grid-template-columns:1fr;gap:40px;}
  .eligibility-wrap .checklist{max-width:none;}
}

/* ---------- university list ---------- */
.uni-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:2px;background:var(--line);border-radius:10px;overflow:hidden;
}
@media (max-width:860px){ .uni-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){ .uni-grid{grid-template-columns:1fr;} }
.uni{
  background:var(--white);padding:24px 26px;
  border-left:3px solid transparent;transition:border-color var(--ease), background var(--ease);
}
.uni:hover{background:var(--navy-tint);border-left-color:var(--olive);}
.uni-name{display:block;font-size:16px;font-weight:800;color:var(--navy);line-height:1.35;letter-spacing:-.005em;}
.uni-place{
  display:block;margin-top:6px;
  font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gray);
}

/* ---------- compact campus band ---------- */
.campus-note{display:grid;grid-template-columns:1.25fr .75fr;gap:56px;align-items:center;}
.campus-note h2{font-size:clamp(24px,3vw,32px);margin-bottom:16px;}
.campus-note p{margin-bottom:14px;}
.campus-note .note{margin-top:0;}
.campus-figures{display:flex;flex-direction:column;gap:2px;background:var(--line);
  border-radius:10px;overflow:hidden;}
.campus-figures > div{background:var(--white);padding:22px 26px;display:flex;align-items:baseline;gap:16px;}
.campus-figures strong{font-size:34px;font-weight:800;color:var(--navy);letter-spacing:-.02em;
  line-height:1;min-width:64px;}
.campus-figures span{font-size:14px;color:var(--body-soft);}
@media (max-width:900px){
  .campus-note{grid-template-columns:1fr;gap:34px;}
}

/* ---------- how to apply steps ---------- */
.howto-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-bottom:36px;}
.howto-step{
  background:rgba(255,255,255,.6);border-radius:10px;padding:32px 30px;
  border-top:3px solid var(--olive);
}
.howto-num{
  width:38px;height:38px;border-radius:50%;background:var(--band);color:var(--cream);
  font-size:15px;font-weight:800;display:flex;align-items:center;justify-content:center;margin-bottom:20px;
}
.howto-step h3{font-size:17.5px;margin-bottom:9px;}
.howto-step p{font-size:14.5px;color:#4a4736;}
.callout-on-cream{background:rgba(255,255,255,.62);border-left-color:var(--navy);}
/* a callout closing off a full-width grid should span the same width */
.callout.is-full-row{max-width:none;display:grid;grid-template-columns:auto 1fr;
  gap:6px 28px;align-items:baseline;padding:26px 30px;}
.callout.is-full-row strong{margin-bottom:0;white-space:nowrap;}
@media (max-width:720px){
  .callout.is-full-row{grid-template-columns:1fr;gap:6px;}
  .callout.is-full-row strong{white-space:normal;}
}
@media (max-width:820px){
  .howto-steps{grid-template-columns:1fr;gap:2px;}
}

.inline-link{
  color:var(--navy);font-weight:600;
  text-decoration:underline;text-underline-offset:2px;text-decoration-color:var(--olive);
}
.inline-link:hover{color:var(--olive-dark);}

/* olive text on cream needs to go darker still to clear AA */
.section-cream .eyebrow,.reassure .eyebrow,.notice-bar .eyebrow{color:var(--olive-cream);}

/* ---------- reassurance block ---------- */
.reassure{background:var(--cream);}
.reassure .wrap{display:grid;grid-template-columns:1.02fr .98fr;gap:64px;align-items:center;}
.reassure-inner{max-width:560px;}
.reassure .eyebrow{display:block;margin-bottom:14px;color:var(--olive-dark);}
.reassure h2{font-size:clamp(26px,3.2vw,36px);margin-bottom:20px;}
.reassure p{font-size:16.5px;color:#4a4736;margin-bottom:16px;}
.reassure .btn{margin-top:14px;}
.reassure .photo img{box-shadow:0 1px 3px rgba(0,0,0,.08), 0 20px 44px rgba(90,80,30,.22);}
@media (max-width:920px){
  .reassure .wrap{grid-template-columns:1fr;gap:40px;}
  .reassure-inner{max-width:none;}
}

/* ---------- feature quote (a scholar, full width) ---------- */
.feature-quote{background:var(--navy-tint);}
.feature-quote .wrap{display:grid;grid-template-columns:.85fr 1.15fr;gap:64px;align-items:center;}
.feature-quote blockquote{
  font-size:clamp(19px,2.2vw,25px);line-height:1.45;color:var(--navy);
  font-weight:400;letter-spacing:-.01em;margin-bottom:26px;
}
.feature-quote cite{
  display:block;font-style:normal;font-size:13px;font-weight:700;
  letter-spacing:.09em;text-transform:uppercase;color:var(--olive-dark);
}
.feature-quote cite span{
  display:block;margin-top:5px;font-size:13px;font-weight:400;
  letter-spacing:0;text-transform:none;color:var(--gray);
}
@media (max-width:920px){
  .feature-quote .wrap{grid-template-columns:1fr;gap:36px;}
  .feature-quote .photo{order:-1;max-width:420px;}
}

/* ---------- notice bar (application status) ---------- */
.notice-bar{background:var(--cream);border-top:3px solid var(--red);border-bottom:1px solid #e4d98f;padding:14px 0;}
.notice-bar p{font-size:14.5px;color:var(--ink);text-align:center;margin:0;}
.notice-bar strong{color:var(--navy);}
.notice-bar a{color:var(--navy);font-weight:700;text-decoration:underline;text-underline-offset:2px;}
.notice-bar a:hover{color:var(--olive-dark);}

/* ---------- sticky section wayfinding (long pages) ---------- */
.section-nav{
  position:sticky;top:var(--header-h);z-index:800;
  background:var(--nav-bg);
  backdrop-filter:saturate(180%) blur(8px);
  -webkit-backdrop-filter:saturate(180%) blur(8px);
}
.section-nav-progress{height:3px;background:rgba(255,255,255,.12);}
.section-nav-progress span{
  display:block;height:100%;width:0;background:var(--olive);transition:width .1s linear;
}
.section-nav ul{
  display:flex;list-style:none;gap:2px;overflow-x:auto;
  scrollbar-width:none;-ms-overflow-style:none;
}
.section-nav ul::-webkit-scrollbar{display:none;}
.section-nav a{
  display:block;white-space:nowrap;padding:15px 16px;
  font-size:13px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  color:var(--on-navy-soft);border-bottom:2px solid transparent;
  transition:color var(--ease), border-color var(--ease);
}
.section-nav a:hover{color:#fff;}
.section-nav a.is-current{color:var(--cream);border-bottom-color:var(--olive);}
@media (max-width:720px){
  .section-nav a{padding:13px 13px;font-size:12px;}
}

/* ---------- program week: tabbed, one day at a time ---------- */
.week{background:var(--white);border-radius:12px;overflow:hidden;box-shadow:var(--shadow-card);}
.week-tablist{display:grid;grid-template-columns:repeat(6,1fr);background:var(--band);}
.week-tab{
  background:none;border:none;cursor:pointer;padding:16px 10px 14px;
  font-family:var(--font);text-align:center;
  border-bottom:3px solid transparent;border-right:1px solid rgba(255,255,255,.10);
  transition:background var(--ease), border-color var(--ease);
}
.week-tab:last-child{border-right:none;}
.week-tab:hover{background:rgba(255,255,255,.06);}
.week-tab.is-active{background:rgba(255,255,255,.09);border-bottom-color:var(--olive);}
.wt-day{
  display:block;font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:var(--cream);margin-bottom:3px;
}
.wt-what{display:block;font-size:12px;color:var(--on-navy-soft);letter-spacing:.02em;}
.week-tab.is-active .wt-what{color:var(--on-navy);}

.week-panel{display:grid;grid-template-columns:1.05fr .95fr;align-items:stretch;}
.week-panel[hidden]{display:none;}
.week-panel-copy{padding:44px 42px;display:flex;flex-direction:column;justify-content:center;}
.week-day-label{
  font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--olive-dark);margin-bottom:12px;
}
.week-panel-copy h3{font-size:24px;margin-bottom:14px;line-height:1.25;}
.week-panel-copy p{font-size:16px;color:var(--body-soft);}
.week-panel-photo{min-height:300px;}
.week-panel-photo img{width:100%;height:100%;object-fit:cover;}

.week-everyday{border-top:1px solid var(--line);background:var(--paper);padding:26px 42px 30px;}
.week-everyday-head{
  font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--gray);margin-bottom:16px;
}
.week-everyday-items{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.week-everyday-items > div{font-size:14px;color:var(--body-soft);line-height:1.55;}
.week-everyday-items strong{
  display:block;color:var(--navy);font-size:14.5px;margin-bottom:4px;
}
@media (max-width:860px){
  .week-panel{grid-template-columns:1fr;}
  .week-panel-photo{order:-1;min-height:220px;max-height:260px;}
  .week-panel-copy{padding:32px 28px;}
  .week-everyday{padding:24px 28px 28px;}
  .week-everyday-items{grid-template-columns:1fr;gap:16px;}
}
@media (max-width:600px){
  .week-tablist{grid-template-columns:repeat(3,1fr);}
  .week-tab{border-bottom-width:3px;}
  .wt-what{display:none;}
}

/* ---------- in-page anchor nav ---------- */
.about-nav-wrap{background:var(--navy-tint);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.about-nav{padding:18px 0;display:flex;gap:8px;flex-wrap:wrap;}
.about-nav a{
  flex:none;font-size:12.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  color:var(--navy);padding:9px 16px;background:var(--white);
  border:1px solid var(--line);border-radius:20px;white-space:nowrap;
  transition:color var(--ease), background var(--ease), border-color var(--ease);
}
.about-nav a:hover{background:var(--band);border-color:var(--band);color:#fff;}

/* ---------- photo with corner tag ---------- */
.photo{position:relative;}
.photo img{
  border-radius:10px;box-shadow:var(--shadow-photo);
  width:100%;aspect-ratio:4/3;object-fit:cover;object-position:center;
}
.photo.is-portrait img{aspect-ratio:4/5;}
.photo.is-square img{aspect-ratio:1/1;}
.photo.is-wide img{aspect-ratio:3/2;}
.photo.is-tall img{aspect-ratio:3/4;}
.photo.top img{object-position:center top;}
.photo .tag{
  position:absolute;left:-16px;bottom:-16px;
  background:var(--band);color:#fff;padding:13px 18px;border-radius:8px;
  font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  box-shadow:0 10px 24px rgba(0,31,52,.28);
}
.photo .tag.is-olive{background:var(--olive-deep);}

/* ---------- editorial two-column ---------- */
.editorial .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:72px;align-items:center;}
.editorial.is-reversed .wrap{grid-template-columns:.95fr 1.05fr;}
/* opt a wrap out of the two-column grid — otherwise a single child leaves
   the second column empty and opens a large gap */
.editorial .wrap.is-block,
.editorial.is-reversed .wrap.is-block{display:block;}
.editorial.is-reversed .photo{order:-1;}
.editorial-copy .eyebrow{margin-bottom:16px;display:block;}
.editorial-copy h2{font-size:clamp(26px,3.2vw,36px);line-height:1.2;margin-bottom:20px;}
.editorial-copy p{margin-bottom:16px;max-width:500px;}
.editorial-copy p:last-child{margin-bottom:0;}

/* pull-line with circular mark (mission / founder credit) */
.mark-line{
  display:flex;gap:14px;align-items:flex-start;
  margin-top:26px;padding-top:22px;border-top:1px solid var(--line);
}
.mark{
  width:36px;height:36px;border-radius:50%;background:var(--band);color:var(--cream);
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px;flex:none;
}
.mark-line p{font-size:14px;color:var(--gray);margin:0;max-width:none;}
.mark-line strong{color:var(--ink);}

/* ---------- hairline card grids ---------- */
.card-grid{
  display:grid;gap:2px;background:var(--line);
  border-radius:10px;overflow:hidden;
}
.card-grid.cols-2{grid-template-columns:repeat(2,1fr);}
.card-grid.cols-3{grid-template-columns:repeat(3,1fr);}
.card-grid.cols-4{grid-template-columns:repeat(4,1fr);}
.card{background:var(--white);padding:38px 34px;}
.card.is-tight{padding:30px 28px;}
.card h3{margin-bottom:12px;}
.card p{font-size:14.5px;color:var(--body-soft);}
.card-index{
  width:34px;height:34px;border-radius:50%;background:var(--navy-tint);color:var(--navy);
  font-size:13px;font-weight:800;display:flex;align-items:center;justify-content:center;margin-bottom:22px;
}
.card-year{font-size:13px;font-weight:800;letter-spacing:.06em;color:var(--olive-dark);margin-bottom:12px;}
.card h4{font-size:16.5px;margin-bottom:8px;line-height:1.25;}

/* ---------- numbered process steps ---------- */
.process-steps{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;
  margin:32px 0 34px;max-width:480px;position:relative;
}
.process-steps::before{
  content:"";position:absolute;top:16px;left:16px;right:16px;height:2px;background:var(--line);z-index:0;
}
.process-step{display:flex;flex-direction:column;gap:12px;position:relative;z-index:1;}
.process-num{
  width:32px;height:32px;border-radius:50%;background:var(--band);color:#fff;
  font-size:13px;font-weight:800;display:flex;align-items:center;justify-content:center;flex:none;
}
.process-step p{font-size:13.5px;font-weight:600;color:var(--ink);margin:0;line-height:1.4;}

/* ---------- stat strip ---------- */
.stat-strip{background:var(--band);}
.stat-strip .wrap{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));padding-top:0;padding-bottom:0;
}
.stat{padding:36px 20px;text-align:center;border-right:1px solid rgba(255,255,255,.1);}
.stat:last-child{border-right:none;}
.stat-num{font-size:38px;font-weight:800;color:var(--cream);line-height:1;margin-bottom:8px;letter-spacing:-.02em;}
.stat-label{font-size:12.5px;color:rgba(255,255,255,.68);text-transform:uppercase;letter-spacing:.08em;font-weight:600;}

/* light variant */
.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--line);border-radius:10px;overflow:hidden;}
.stat-card{background:var(--white);padding:44px 32px;text-align:center;}
.stat-card .stat-num{font-size:56px;color:var(--navy);}
.stat-card .stat-num em{font-style:normal;color:var(--olive);}
.stat-card .stat-label{color:var(--body-soft);text-transform:none;letter-spacing:0;font-size:15px;font-weight:400;}

/* ---------- navy band ---------- */
/* ---------- About: who we are (heading left, copy right, mission panel) ---------- */
.who{padding-top:72px;}
.who-intro{display:grid;grid-template-columns:.8fr 1.2fr;gap:72px;align-items:start;}
.who-head .eyebrow{display:block;margin-bottom:16px;}
.who-head h2{font-size:clamp(26px,3.2vw,36px);line-height:1.2;}
.who-copy p{font-size:18px;line-height:1.65;margin-bottom:16px;max-width:640px;}
.who-copy p:last-child{margin-bottom:0;}
.mission-panel{
  margin-top:56px;background:var(--band);color:#fff;border-radius:14px;
  padding:44px 48px;display:flex;gap:28px;align-items:flex-start;
}
.mission-panel .mark{width:52px;height:52px;font-size:17px;background:var(--olive);color:var(--band);}
.mission-panel .eyebrow{display:block;color:var(--cream);margin-bottom:10px;}
.mission-text{font-size:clamp(20px,2.4vw,27px);line-height:1.38;font-weight:600;color:#fff;margin:0;max-width:820px;}
.who-tiles{margin-top:16px;}
[data-theme="dark"] .mission-panel{box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);}
@media (max-width:880px){
  .who{padding-top:56px;}
  .who-intro{grid-template-columns:1fr;gap:18px;}
  .mission-panel{margin-top:40px;padding:32px 24px;flex-direction:column;gap:16px;}
}

.band-navy{background:var(--band);color:#fff;}
.band-navy h2,.band-navy h3,.band-navy h4{color:#fff;}
.band-navy p{color:var(--on-navy);}
.band-navy .eyebrow{color:var(--cream);}
.band-navy .mark-line{border-top-color:rgba(255,255,255,.18);}
.band-navy .mark-line p{color:var(--on-navy-soft);}
.band-navy .mark-line strong{color:#fff;}

.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px;}
.chip{
  font-size:12px;font-weight:700;letter-spacing:.03em;color:var(--on-navy);
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);
  border-radius:20px;padding:8px 14px;
}

/* ---------- quote ---------- */
.pull-quote{
  margin-top:44px;padding-top:32px;border-top:1px solid var(--line);
  font-size:clamp(19px,2.2vw,24px);font-weight:400;color:var(--navy);line-height:1.4;max-width:680px;
}

.quote-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;margin-top:44px;}
.quote-card{background:rgba(255,255,255,.05);border-radius:8px;padding:34px 30px;transition:background .3s ease;}
.quote-card:hover{background:rgba(255,255,255,.09);}
.quote-card blockquote{font-size:16px;color:rgba(255,255,255,.9);line-height:1.7;margin-bottom:22px;}
.quote-card cite{display:block;font-style:normal;font-size:13px;color:var(--cream);font-weight:700;letter-spacing:.03em;}
.quote-card cite span{display:block;font-size:12px;color:var(--on-navy-soft);font-weight:400;margin-top:3px;letter-spacing:0;}

/* ---------- full-bleed photo band ---------- */
/* Taller on wide screens, and cropped from the upper third rather than the middle:
   every band photo is people, and a centred crop cut their heads off. */
.photo-band{position:relative;height:clamp(420px, 36vw, 620px);overflow:hidden;}
.photo-band img{width:100%;height:100%;object-fit:cover;object-position:center 22%;}
.photo-band-caption{
  position:absolute;left:0;bottom:0;width:100%;
  /* the old scrim faded to nothing too early, leaving light text on bright
     photo. This holds enough density behind the text to clear AA. */
  background:linear-gradient(to top, rgba(0,31,52,.92) 0%, rgba(0,31,52,.72) 38%, rgba(0,31,52,.15) 75%, rgba(0,31,52,0) 100%);
  padding:88px 0 30px;
}
.photo-band-caption .wrap{color:#fff;}
.photo-band-caption .eyebrow{color:var(--cream);margin-bottom:6px;display:block;}
.photo-band-caption p{font-size:15px;color:var(--on-navy);max-width:520px;}

/* ---------- CTA band ---------- */
.cta-band{background:var(--olive-deep);color:#fff;padding:64px 0;}
.cta-band .wrap{display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap;}
.cta-band h2{font-size:clamp(22px,2.8vw,30px);max-width:560px;color:#fff;}
.cta-band p{margin-top:8px;color:#eef4de;font-size:15px;max-width:560px;}
.cta-band p a{color:#fff;text-decoration:underline;text-underline-offset:3px;}
.cta-band.is-navy{background:var(--band);}
.cta-band.is-navy p{color:var(--on-navy);}

/* ---------- people grid (board & team) ---------- */
.people-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:2px;background:var(--line);border-radius:10px;overflow:hidden;}
.person{background:var(--white);padding:28px 26px;}
.person-photo{
  width:76px;height:76px;border-radius:50%;object-fit:cover;margin-bottom:18px;
  background:var(--navy-tint);
}
.person-photo-fallback{
  width:76px;height:76px;border-radius:50%;margin-bottom:18px;
  background:var(--navy-tint);color:var(--navy);
  display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:800;letter-spacing:.02em;
}
.person h3{font-size:16.5px;margin-bottom:4px;}
.person .role{font-size:13px;font-weight:700;color:var(--olive-dark);letter-spacing:.03em;margin-bottom:10px;}
.person p{font-size:14px;color:var(--body-soft);}

/* ---------- board gallery (click for bio) ---------- */
.board-gallery{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:2px;background:var(--line);border-radius:10px;overflow:hidden;
}
@media (max-width:820px){ .board-gallery{grid-template-columns:repeat(2,1fr);} }
.board-card{
  background:var(--white);border:none;padding:34px 24px 30px;
  display:flex;flex-direction:column;align-items:center;text-align:center;
  cursor:pointer;font-family:var(--font);width:100%;
  transition:background var(--ease);
}
.board-card:hover,.board-card:focus-visible{background:var(--navy-tint);}
.board-card img{
  width:172px;height:172px;border-radius:50%;object-fit:cover;object-position:center top;
  background:var(--navy-tint);margin-bottom:20px;
  box-shadow:0 0 0 1px var(--line), 0 6px 18px rgba(0,31,52,.10);
  transition:box-shadow .25s ease, transform .25s ease;
}
.board-card:hover img,.board-card:focus-visible img{
  box-shadow:0 0 0 3px var(--olive), 0 12px 28px rgba(0,31,52,.18);
  transform:translateY(-3px);
}
.board-card{padding:38px 24px 32px;}
.board-gallery.is-staff{grid-template-columns:repeat(2,1fr);max-width:640px;}
@media (max-width:640px){
  .board-card img{width:132px;height:132px;}
  .board-gallery.is-staff{max-width:none;}
}
.board-card .name{
  display:block;font-size:17px;font-weight:800;color:var(--navy);
  letter-spacing:-.005em;line-height:1.3;margin-bottom:5px;
}
.board-card .role{
  display:block;font-size:11.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  color:var(--olive-dark);line-height:1.4;
}
.board-card .more{
  display:inline-block;margin-top:14px;font-size:12.5px;font-weight:700;color:var(--navy);
  border-bottom:1.5px solid var(--olive);padding-bottom:2px;
}
@media (max-width:520px){
  .board-gallery{grid-template-columns:repeat(2,1fr);}
  .board-card{padding:26px 14px 22px;}
  .board-card img{width:96px;height:96px;}
}

/* ---------- modal ---------- */
.modal{
  position:fixed;inset:0;background:rgba(0,15,26,.66);
  display:flex;align-items:center;justify-content:center;padding:24px;z-index:1000;
  opacity:0;visibility:hidden;transition:opacity .2s ease, visibility .2s ease;
}
.modal.is-open{opacity:1;visibility:visible;}
.modal-card{
  background:var(--paper);border-radius:12px;max-width:660px;width:100%;
  padding:42px 44px;position:relative;box-shadow:0 24px 60px rgba(0,31,52,.35);
  transform:translateY(14px) scale(.985);transition:transform .25s cubic-bezier(.18,1,.32,1);
  max-height:86vh;overflow-y:auto;
}
.modal.is-open .modal-card{transform:none;}
.modal-close{
  position:absolute;top:14px;right:16px;background:none;border:none;
  font-size:28px;line-height:1;color:var(--gray);cursor:pointer;border-radius:4px;
  min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;
}
.modal-close:hover{color:var(--navy);background:var(--navy-tint);}
.modal-head{display:flex;gap:22px;align-items:center;margin-bottom:26px;padding-right:30px;}
.modal-head img{
  width:96px;height:96px;border-radius:50%;object-fit:cover;object-position:center top;flex:none;
  background:var(--navy-tint);
}
.modal-head h3{font-size:23px;margin-bottom:5px;}
.modal-head .role{
  font-size:12px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--olive-dark);
}
.modal-body p{font-size:15.5px;color:var(--body-soft);margin-bottom:15px;}
.modal-body p:last-child{margin-bottom:0;}
/* a note in a modal that must not be skimmed past */
.callout.is-note{margin:6px 0 22px;max-width:none;border-left-width:4px;}
.callout.is-note strong{font-size:15.5px;}
.modal-body .callout.is-note p{font-size:15px;color:var(--body);margin-bottom:0;}
.modal-body h4{
  font-size:12.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--olive-dark);margin:26px 0 12px;
}
.modal-body ul{margin:0 0 16px 20px;}
.modal-body li{font-size:15px;color:var(--body-soft);margin-bottom:8px;line-height:1.55;}
.modal-body li:last-child{margin-bottom:0;}
.modal-body a{
  color:var(--navy);font-weight:600;
  text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--olive);
}
@media (max-width:560px){
  .modal-card{padding:34px 26px;}
  .modal-head{flex-direction:column;text-align:center;gap:16px;padding-right:0;}
}

/* ---------- finance panel ---------- */
.finance-panel{background:var(--navy-tint);border-radius:10px;padding:36px 34px;}
.finance-row{padding:20px 0;border-bottom:1px solid var(--line);display:flex;align-items:baseline;gap:18px;}
.finance-row:first-child{padding-top:0;}
.finance-num{
  font-size:32px;font-weight:800;color:var(--olive-dark);letter-spacing:-.02em;line-height:1;
  flex:none;min-width:118px;text-align:right;font-variant-numeric:tabular-nums;
}
.finance-label{font-size:14.5px;color:var(--body-soft);}
.finance-note{font-size:14px;color:var(--gray);margin-top:20px;line-height:1.6;}

/* ---------- scholarship gallery ---------- */
.sch-gallery{
  display:grid;grid-template-columns:repeat(2,1fr);
  gap:2px;background:var(--line);border-radius:10px;overflow:hidden;margin-top:40px;
}
@media (max-width:720px){ .sch-gallery{grid-template-columns:1fr;} }
.sch-card{
  background:var(--white);border:none;padding:0;cursor:pointer;
  font-family:var(--font);text-align:left;width:100%;
  display:flex;flex-direction:column;
  transition:background var(--ease);
}
.sch-card:hover,.sch-card:focus-visible{background:var(--navy-tint);}
.sch-card > img{
  width:100%;aspect-ratio:3/2;object-fit:cover;flex:none;
  transition:opacity var(--ease);
}
.sch-card:hover > img{opacity:.92;}
.sch-body{display:block;padding:26px 26px 28px;}
.sch-amount{
  display:inline-block;margin-bottom:12px;
  font-size:22px;font-weight:800;color:var(--navy);letter-spacing:-.02em;
  border-bottom:2px solid var(--olive);padding-bottom:3px;
}
.sch-amount small{font-size:12px;font-weight:700;color:var(--gray);letter-spacing:.06em;
  text-transform:uppercase;margin-left:8px;border:none;}
.sch-card .name{
  display:block;font-size:17px;font-weight:800;color:var(--navy);
  line-height:1.32;letter-spacing:-.005em;margin-bottom:10px;
}
.sch-card .desc{display:block;font-size:14.5px;color:var(--body-soft);line-height:1.6;}
.sch-card .more{
  display:inline-block;margin-top:16px;font-size:12.5px;font-weight:700;color:var(--navy);
  border-bottom:1.5px solid var(--olive);padding-bottom:2px;
}

/* modal head with no photo (scholarships) */
.modal-head.is-stacked{display:block;}
.modal-head img[hidden]{display:none;}
.modal-head.is-stacked h3{font-size:24px;}

/* ---------- FAQ layout: questions + sticky help sidebar ---------- */
.faq-layout{display:grid;grid-template-columns:1fr 320px;gap:64px;align-items:start;}
.faq-aside{position:sticky;top:calc(var(--header-h) + 28px);display:flex;flex-direction:column;gap:18px;}
.help-card{
  background:var(--navy-tint);border-radius:12px;padding:30px 28px;
  border-top:3px solid var(--olive);
}
.help-card .eyebrow{display:block;margin-bottom:12px;}
.help-card h3{font-size:19px;margin-bottom:12px;}
.help-card p{font-size:14.5px;color:var(--body-soft);margin-bottom:20px;}
.help-card .btn{width:100%;}
.help-meta{
  display:flex;flex-direction:column;gap:8px;
  margin-top:20px;padding-top:18px;border-top:1px solid #dbe4ea;
}
.help-meta a{font-size:14px;font-weight:600;color:var(--navy);}
.help-meta a:hover{color:var(--olive-dark);text-decoration:underline;text-underline-offset:3px;}
.help-card.is-quiet{background:none;border:1px solid var(--line);border-top:3px solid var(--line);}
.help-card.is-quiet p{margin-bottom:14px;}
@media (max-width:960px){
  .faq-layout{grid-template-columns:1fr;gap:44px;}
  .faq-aside{position:static;flex-direction:row;flex-wrap:wrap;}
  .help-card{flex:1 1 280px;}
}

/* ---------- FAQ accordion ---------- */
.faq-list{border-top:1px solid var(--line);max-width:780px;}
.faq-item{border-bottom:1px solid var(--line);}
.faq-q{
  width:100%;text-align:left;background:none;border:none;cursor:pointer;
  display:flex;align-items:flex-start;justify-content:space-between;gap:20px;
  padding:24px 0;font-size:17px;font-weight:700;color:var(--navy);line-height:1.35;
  font-family:var(--font);
}
.faq-q:hover{color:var(--olive-dark);}
.faq-icon{
  flex:none;width:22px;height:22px;position:relative;margin-top:3px;
}
.faq-icon::before,.faq-icon::after{
  content:"";position:absolute;background:var(--olive);border-radius:1px;
  transition:transform .2s ease, opacity .2s ease;
}
.faq-icon::before{top:10px;left:2px;width:18px;height:2px;}
.faq-icon::after{top:2px;left:10px;width:2px;height:18px;}
.faq-q[aria-expanded="true"] .faq-icon::after{transform:scaleY(0);opacity:0;}
.faq-a{display:none;padding:0 0 26px;max-width:720px;}
.faq-a.is-open{display:block;}
.faq-a p{margin-bottom:14px;}
.faq-a p:last-child{margin-bottom:0;}
.faq-a ul{margin:0 0 14px 20px;}
.faq-a li{font-size:16px;color:var(--body);margin-bottom:8px;}

/* ---------- prose (privacy, long copy) ---------- */
.prose{max-width:760px;}
.prose h2{font-size:26px;margin:44px 0 16px;}
.prose h3{font-size:19px;margin:32px 0 12px;}
.prose h2:first-child,.prose h3:first-child{margin-top:0;}
.prose p{margin-bottom:16px;}
.prose ul,.prose ol{margin:0 0 18px 22px;}
.prose li{font-size:16.5px;color:var(--body);margin-bottom:8px;}
.prose a{color:var(--navy);text-decoration:underline;text-underline-offset:2px;text-decoration-color:var(--olive);}
.prose a:hover{color:var(--olive-dark);}
.prose strong{color:var(--ink);}

/* ---------- info / contact panels ---------- */
.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:2px;background:var(--line);border-radius:10px;overflow:hidden;}
.info-card{background:var(--white);padding:34px 32px;}
.info-card .eyebrow{margin-bottom:12px;display:block;}
.info-card p,.info-card address{font-size:15.5px;color:var(--body);font-style:normal;line-height:1.7;}
.info-card a{color:var(--navy);font-weight:600;text-decoration:underline;text-underline-offset:2px;text-decoration-color:var(--olive);}
.info-card a:hover{color:var(--olive-dark);}

/* ---------- forms ---------- */
.form-panel{
  margin-top:48px;background:var(--white);border:1px solid var(--line);border-radius:12px;
  box-shadow:var(--shadow-card);overflow:hidden;
  display:grid;grid-template-columns:.85fr 1.15fr;
}
.form-intro{background:var(--navy-tint);padding:44px 40px;border-right:1px solid var(--line);}
.form-intro .eyebrow{display:block;margin-bottom:14px;}
.form-intro h2{font-size:24px;line-height:1.25;margin-bottom:14px;}
.form-intro p{font-size:15px;color:var(--body-soft);}
.form-intro a{color:var(--navy);font-weight:600;text-decoration:underline;
  text-underline-offset:2px;text-decoration-color:var(--olive);}

.contact-form{padding:44px 40px;}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.field-row.is-three{grid-template-columns:1.4fr 1.4fr 1fr;}
@media (max-width:620px){.field-row,.field-row.is-three{grid-template-columns:1fr;gap:0;}}
.field{margin-bottom:20px;}
.field[hidden]{display:none;}
.field label{
  display:block;font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--navy);margin-bottom:7px;
}
.field label span[aria-hidden]{color:var(--red);margin-left:2px;}
.field label .optional{
  font-weight:400;letter-spacing:0;text-transform:none;color:var(--gray);font-size:12px;margin-left:4px;
}
.field input,.field select,.field textarea{
  width:100%;font-family:var(--font);font-size:15.5px;color:var(--ink);
  background:var(--paper);border:1px solid var(--line);border-radius:6px;
  padding:12px 14px;transition:border-color var(--ease), box-shadow var(--ease);
}
.field textarea{resize:vertical;min-height:130px;}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--olive);box-shadow:0 0 0 3px rgba(130,159,57,.16);
}
.field input:user-invalid,
.field textarea:user-invalid{border-color:var(--red);}
.form-note{margin-top:18px;font-size:13px;color:var(--gray);}
.form-note a{color:var(--navy);font-weight:600;text-decoration:underline;text-underline-offset:2px;}
.form-status{margin-top:18px;padding:14px 16px;border-radius:8px;font-size:14.5px;font-weight:600;line-height:1.5;}
.form-status.is-ok{background:var(--navy-tint);color:var(--navy);border-left:3px solid var(--olive);}
.form-status.is-error{background:var(--navy-tint);color:var(--red);border-left:3px solid var(--red);}

@media (max-width:880px){
  .form-panel{grid-template-columns:1fr;}
  .form-intro{border-right:none;border-bottom:1px solid var(--line);padding:34px 28px;}
  .contact-form{padding:34px 28px;}
}
@media (max-width:560px){
  .field-row{grid-template-columns:1fr;gap:0;}
}

/* callout — light tint fill, per brand "tint not solid block" */
.callout{
  background:var(--navy-tint);border-left:3px solid var(--olive);
  padding:22px 26px;border-radius:0 8px 8px 0;margin:28px 0;max-width:640px;
}
.callout strong{display:block;font-size:14.5px;color:var(--navy);margin-bottom:5px;}
.callout p{font-size:14.5px;color:var(--body-soft);margin:0;}

/* ---------- checklist ---------- */
.checklist{list-style:none;margin-top:24px;}
/* Not flex: in a flex row every text node becomes its own item, so the gap
   landed between "consent" and ", if you're under 18". Absolute-positioning the
   tick keeps the text as one continuous inline flow. */
.checklist li{
  font-size:16px;color:var(--body);padding:14px 0 14px 40px;
  border-bottom:1px solid var(--line);line-height:1.55;position:relative;
}
.checklist li:last-child{border-bottom:none;}
.check{
  position:absolute;left:0;top:16px;
  width:24px;height:24px;background:var(--olive-deep);border-radius:50%;color:#fff;
  font-size:12px;display:flex;align-items:center;justify-content:center;
}

/* ---------- sponsor logo grid ---------- */
.partner-text{
  font-size:14px;font-weight:700;color:var(--navy);text-align:center;line-height:1.35;
  letter-spacing:-.005em;opacity:.62;transition:opacity .3s ease;
}
.partner-logo:hover .partner-text{opacity:1;}
[data-theme="dark"] .partner-text{color:var(--band);}
.partner-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));
  gap:2px;background:var(--line);border-radius:10px;overflow:hidden;
}
.partner-logo{
  background:var(--white);padding:30px 26px;
  display:flex;align-items:center;justify-content:center;min-height:132px;
}
.partner-logo img{
  max-height:62px;width:auto;max-width:100%;object-fit:contain;
  filter:grayscale(1);opacity:.62;
  transition:filter .3s ease, opacity .3s ease;
}
.partner-logo:hover img{filter:grayscale(0);opacity:1;}
@media (max-width:520px){
  .partner-grid{grid-template-columns:repeat(2,1fr);}
  .partner-logo{padding:22px 16px;min-height:110px;}
  .partner-logo img{max-height:46px;}
}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-footer{background:var(--band);color:var(--on-navy);padding:72px 0 0;}
.footer-top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:48px;padding-bottom:56px;}
.footer-brand img{height:52px;width:auto;margin-bottom:20px;}
.footer-brand p{font-size:14.5px;color:var(--on-navy-soft);max-width:320px;margin-bottom:18px;}
.footer-charity{font-size:12.5px;color:var(--on-navy-soft);line-height:1.7;}
.footer-charity strong{color:var(--on-navy);font-weight:700;}

.footer-col h4{font-size:12.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--cream);margin-bottom:18px;}
.footer-col ul{list-style:none;}
.footer-col li{margin-bottom:11px;}
.footer-col a{font-size:14.5px;color:var(--on-navy);transition:color var(--ease);}
.footer-col a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--olive);}
.footer-col address{font-style:normal;font-size:14.5px;color:var(--on-navy);line-height:1.8;}
.footer-social{display:flex;gap:10px;margin-top:20px;}
.footer-social a{
  width:36px;height:36px;border-radius:50%;
  border:1px solid rgba(255,255,255,.2);color:var(--on-navy);
  display:flex;align-items:center;justify-content:center;
  transition:background var(--ease), color var(--ease), border-color var(--ease);
}
.footer-social a:hover{background:var(--olive-deep);border-color:var(--olive-deep);color:#fff;}

.footer-bottom{
  border-top:1px solid rgba(255,255,255,.14);
  padding:24px 0 32px;
  display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;
}
.footer-bottom p,.footer-bottom a{font-size:13px;color:var(--on-navy-soft);}
.footer-bottom a:hover{color:#fff;}
.footer-links{display:flex;gap:20px;flex-wrap:wrap;}

@media (max-width:980px){
  .footer-top{grid-template-columns:1fr 1fr;gap:40px;}
}
@media (max-width:560px){
  .footer-top{grid-template-columns:1fr;gap:36px;}
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:920px){
  section{padding:72px 0;}
  .section-tight{padding:64px 0;}
  .page-hero{padding:60px 0 56px;}
  .page-hero .wrap,
  .editorial .wrap,
  .editorial.is-reversed .wrap{grid-template-columns:1fr;gap:44px;}
  .page-hero .photo{order:-1;max-width:460px;}
  .editorial.is-reversed .photo{order:0;}
  .card-grid.cols-3,.card-grid.cols-4{grid-template-columns:repeat(2,1fr);}
  .stat-grid{grid-template-columns:1fr;}
  .section-head{margin-bottom:40px;}
}
@media (max-width:640px){
  :root{--gutter:20px;}
  .card-grid.cols-2,.card-grid.cols-3,.card-grid.cols-4{grid-template-columns:1fr;}
  .process-steps{grid-template-columns:1fr;gap:16px;max-width:none;}
  .process-steps::before{display:none;}
  .photo-band{height:320px;}
  .cta-band .wrap{flex-direction:column;align-items:flex-start;}
  .photo .tag{left:0;bottom:-14px;font-size:11px;padding:11px 14px;}
  .stat{border-right:none;border-bottom:1px solid rgba(255,255,255,.1);}
  .stat:last-child{border-bottom:none;}
}

/* ---------- reveal on scroll (subtle; JS adds .is-visible) ---------- */
.reveal{opacity:0;transform:translateY(10px);transition:opacity .45s ease, transform .45s ease;}
.reveal.is-visible{opacity:1;transform:none;}
/* the staggered-cascade look reads as templated, so delays are deliberately
   no-ops — the classes stay so markup doesn't need rewriting */
.reveal-d1,.reveal-d2,.reveal-d3{transition-delay:0s;}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{transition:none!important;animation:none!important;}
  .reveal{opacity:1;transform:none;}
}

/* cheap win on the long program/apply pages */
.week,.faq-list,.review{content-visibility:auto;contain-intrinsic-size:auto 600px;}

/* ---------- cross-document view transitions ----------
   Root crossfade only. Named element morphs are the thing that makes a site
   look templated, so the one exception is pinning the header so it doesn't
   flash between pages. Unsupported browsers simply navigate as normal. */
@view-transition{navigation:auto;}
.site-header{view-transition-name:site-header;}
.topbar{view-transition-name:site-topbar;}
@media (prefers-reduced-motion:reduce){
  @view-transition{navigation:none;}
}

@media print{
  .site-header,.site-footer,.cta-band,.nav-toggle{display:none;}
  body{background:#fff;}
  section{padding:24px 0;}
}

/* ==========================================================================
   GUIDED APPLICATION
   ========================================================================== */
.demo-bar{background:var(--ink);color:#fff;}
.demo-bar .wrap{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding-top:12px;padding-bottom:12px;flex-wrap:wrap;
}
.demo-bar-text{font-size:13.5px;color:#e8e6e0;}
.demo-bar-text strong{color:#fff;}
.demo-bar-actions{display:flex;gap:8px;flex:none;}
.demo-btn{
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.26);color:#fff;
  font-family:var(--font);font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  padding:8px 14px;border-radius:4px;cursor:pointer;white-space:nowrap;
  transition:background var(--ease), border-color var(--ease);
}
.demo-btn:hover{background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.45);}
.demo-btn.is-inline{
  background:none;border:1px solid var(--line);color:var(--navy);
  text-transform:none;letter-spacing:.02em;font-size:12.5px;padding:6px 12px;
}
.demo-btn.is-inline:hover{background:var(--navy-tint);border-color:var(--olive);}

.apply-hero{background:var(--paper);padding:72px 0 56px;}
.apply-hero .eyebrow{margin-bottom:18px;}
.apply-hero h1{margin-bottom:18px;max-width:820px;}
.apply-hero p.lead{max-width:620px;}
/* quiet, factual — not a box, and not phrased as an invitation to leave */
.apply-orient{max-width:620px;margin-top:26px;}
.apply-hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center;}
@media (max-width:920px){ .apply-hero-grid{grid-template-columns:1fr;gap:40px;} .apply-hero-grid .photo{max-width:560px;} }

/* a slimmer photo band, for use as a break rather than a feature */
.photo-band.is-slim{height:clamp(300px, 26vw, 440px);}
@media (max-width:640px){ .photo-band.is-slim{height:230px;} }

.apply-shell{background:var(--navy-tint);padding:44px 0 84px;}

/* stepper */
.stepper{
  display:grid;grid-template-columns:repeat(7,1fr);gap:2px;list-style:none;
  background:var(--line);border-radius:10px;overflow:hidden;margin-bottom:22px;
}
.stepper li{display:flex;}
.step{
  flex:1;background:var(--white);border:none;cursor:pointer;font-family:var(--font);
  padding:16px 10px;display:flex;flex-direction:column;align-items:center;gap:8px;
  border-bottom:3px solid transparent;transition:background var(--ease), border-color var(--ease);
}
.step:hover{background:var(--paper);}
.step-num{
  width:28px;height:28px;border-radius:50%;flex:none;
  background:var(--navy-tint);color:var(--navy);
  font-size:12.5px;font-weight:800;display:flex;align-items:center;justify-content:center;
  transition:background var(--ease), color var(--ease);
}
.step-label{
  font-size:12px;font-weight:700;letter-spacing:.04em;color:var(--gray);
  text-align:center;line-height:1.3;
}
.step.is-current{border-bottom-color:var(--olive);background:var(--paper);}
.step.is-current .step-num{background:var(--band);color:#fff;}
.step.is-current .step-label{color:var(--navy);}
.step.is-done .step-num{background:var(--olive-deep);color:#fff;}
.step.is-done .step-label{color:var(--body-soft);}

/* progress */
.apply-progress{margin-bottom:26px;}
.apply-progress-bar{height:6px;background:#dbe4ea;border-radius:99px;overflow:hidden;}
.apply-progress-bar span{
  display:block;height:100%;background:var(--olive);border-radius:99px;
  transition:width .3s cubic-bezier(.4,1,.4,1);
}
.apply-progress-text{
  display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:10px;
  font-size:13px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--gray);
}

/* form panels */
.apply-form{background:var(--white);border-radius:12px;box-shadow:var(--shadow-card);overflow:hidden;}
.apply-step{border:none;padding:44px 46px;}
.apply-step[hidden]{display:none;}
/* A <legend> normally renders at the fieldset's top BORDER edge, ignoring its
   padding — which pinned "Step 1" to the top of the card. Floating it puts it
   back in normal flow so the padding and margins apply. */
.apply-step-head{float:left;width:100%;display:block;margin:0 0 14px;padding:0;}
.apply-step-eyebrow{
  display:block;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--olive-dark);margin-bottom:12px;
}
.apply-step-head h2{font-size:27px;margin:0;}
.apply-step-desc{clear:both;font-size:16px;color:var(--body-soft);max-width:620px;
  margin:0 0 32px;padding-bottom:22px;border-bottom:1px solid var(--line);}

.req{color:var(--red);margin-left:2px;}
.hint{font-size:13px;color:var(--gray);margin-top:6px;line-height:1.5;}
.label-as-legend{
  display:block;font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--navy);margin-bottom:12px;
}
.label-as-legend .optional,.field label .optional{
  font-weight:400;letter-spacing:0;text-transform:none;color:var(--gray);font-size:12px;margin-left:6px;
}

/* choices */
.choice-list{display:flex;flex-direction:column;gap:8px;}
.choice-list.is-inline{flex-direction:row;flex-wrap:wrap;gap:8px;}
.choice-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.choice-grid.is-compact{grid-template-columns:repeat(auto-fill,minmax(185px,1fr));gap:6px;}
.choice-grid.is-compact label.choice{padding:8px 11px;border-radius:6px;gap:8px;}
.choice-grid.is-compact label.choice span{font-size:13.5px;line-height:1.35;}
.choice-grid.is-compact label.choice input{width:15px;height:15px;margin-top:0;}
label.choice{
  display:flex;align-items:flex-start;gap:10px;cursor:pointer;
  border:1px solid var(--line);border-radius:7px;padding:12px 14px;
  background:var(--paper);transition:border-color var(--ease), background var(--ease);
  /* undo .field label — these are choices, not field captions */
  font-weight:400;letter-spacing:0;text-transform:none;margin-bottom:0;
}
label.choice:hover{border-color:var(--olive);background:#fff;}
label.choice input{
  flex:none;margin-top:1px;width:17px;height:17px;accent-color:var(--olive);cursor:pointer;
}
label.choice span{
  font-size:14.5px;color:var(--ink);line-height:1.45;
  font-weight:400;letter-spacing:0;text-transform:none;
}
label.choice:has(input:checked){border-color:var(--olive);background:#f6f9ee;}
label.choice.is-block{width:100%;margin-bottom:10px;}
label.choice.is-block span{font-size:14.5px;color:var(--body-soft);}
@media (max-width:820px){ .choice-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){
  .choice-grid{grid-template-columns:1fr;}
  .choice-grid.is-compact{grid-template-columns:repeat(2,1fr);}
}

/* essay */
.essay-meta{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-top:8px;}
.essay-meta .hint{margin-top:0;}
.wordcount{font-size:13px;color:var(--gray);white-space:nowrap;}
.wordcount strong{color:var(--navy);font-size:15px;}
.wordcount.is-over,.wordcount.is-over strong{color:var(--red);}
/* essay prompt choices: a bold title over the prompt text */
label.choice.is-prompt span strong{display:block;color:var(--navy);font-size:15px;margin-bottom:4px;}
label.choice.is-prompt span{line-height:1.55;}

/* review */
.review{display:flex;flex-direction:column;gap:2px;background:var(--line);border-radius:10px;overflow:hidden;}
.review-group{background:var(--paper);padding:22px 24px;}
.review-group h3{
  font-size:12.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--olive-dark);margin-bottom:14px;
}
.review-row{display:grid;grid-template-columns:220px 1fr;gap:18px;padding:7px 0;align-items:baseline;}
.review-key{font-size:13.5px;color:var(--gray);}
.review-val{font-size:15px;color:var(--ink);white-space:pre-wrap;}
.review-val.is-empty{color:#b3b3ae;font-style:italic;}
.review-edit{
  margin-top:14px;font-size:12.5px;font-weight:700;color:var(--navy);background:none;border:none;
  cursor:pointer;font-family:var(--font);
  border-bottom:1.5px solid var(--olive);padding:6px 0;min-height:24px;
}
.review-edit:hover{color:var(--olive-dark);}
@media (max-width:640px){
  .review-row{grid-template-columns:1fr;gap:2px;}
}

.submit-box{
  margin-top:32px;padding:28px;background:var(--navy-tint);border-radius:10px;text-align:center;
}
.submit-note{font-size:13.5px;color:var(--body-soft);margin-bottom:18px;}

/* nav */
.apply-nav{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:22px 46px;border-top:1px solid var(--line);background:var(--paper);
}
.apply-nav[hidden]{display:none;}
.apply-nav-save{font-size:12.5px;color:var(--gray);letter-spacing:.03em;}
.apply-nav-save.is-flash{color:var(--olive-dark);font-weight:700;}

/* confirmation */
.apply-done{padding:72px 46px;text-align:center;}
.apply-done[hidden]{display:none;}
.apply-done-mark{
  width:64px;height:64px;border-radius:50%;background:var(--olive-deep);color:#fff;
  font-size:30px;display:flex;align-items:center;justify-content:center;margin:0 auto 26px;
}
.apply-done h2{font-size:30px;margin-bottom:16px;}
.apply-done p{max-width:520px;margin:0 auto 14px;}
.apply-done-next{
  background:var(--navy-tint);border-radius:8px;padding:18px 22px;
  font-size:15px;max-width:560px;margin:24px auto 0;text-align:left;
}
.apply-done-ref{font-size:14.5px;color:var(--body-soft);margin-top:4px;}
.apply-done-ref strong{color:var(--navy);font-family:ui-monospace,Menlo,monospace;letter-spacing:.04em;}
.apply-done-next strong{color:var(--navy);}

@media (max-width:900px){
  .stepper{grid-template-columns:repeat(4,1fr);}
  .apply-step{padding:34px 26px;}
  .apply-nav{padding:20px 26px;}
  .apply-done{padding:54px 26px;}
}
@media (max-width:560px){
  .stepper{grid-template-columns:repeat(2,1fr);}
  .step-label{font-size:11.5px;}
  .apply-nav{flex-wrap:wrap;}
  .apply-nav-save{order:3;width:100%;text-align:center;}
}

/* ---------- file upload ---------- */
.upload{
  border:1.5px dashed #c3cfd8;border-radius:10px;background:var(--paper);
  padding:26px 24px;text-align:center;transition:border-color var(--ease), background var(--ease);
  position:relative;
}
.upload:hover,.upload.is-hover{border-color:var(--olive);background:#f6f9ee;}
.upload input[type="file"]{
  position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;
}
.upload-icon{
  width:40px;height:40px;margin:0 auto 12px;border-radius:50%;
  background:var(--navy-tint);color:var(--navy);
  display:flex;align-items:center;justify-content:center;font-size:19px;font-weight:800;
}
.upload-main{font-size:15px;font-weight:700;color:var(--navy);margin-bottom:5px;}
.upload-main span{color:var(--olive-dark);text-decoration:underline;text-underline-offset:2px;}
.upload-sub{font-size:13px;color:var(--gray);}

.upload-file{
  display:none;align-items:center;gap:14px;margin-top:12px;
  background:var(--white);border:1px solid var(--line);border-radius:8px;padding:14px 16px;
}
.upload-file.is-set{display:flex;}
.upload-file-mark{
  width:34px;height:34px;border-radius:6px;flex:none;background:var(--olive-deep);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;letter-spacing:.04em;
}
.upload-file-meta{flex:1;min-width:0;text-align:left;}
.upload-file-name{
  font-size:14.5px;font-weight:700;color:var(--navy);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.upload-file-size{font-size:12.5px;color:var(--gray);margin-top:2px;}
.upload-remove{
  background:none;border:none;cursor:pointer;flex:none;font-family:var(--font);
  font-size:12.5px;font-weight:700;color:var(--red);border-radius:4px;
  min-width:44px;min-height:44px;padding:0 10px;
}
.upload-remove:hover{background:#fdeaea;}
.upload-error{
  display:none;margin-top:10px;font-size:13px;font-weight:600;color:var(--red);text-align:left;
}
.upload-error.is-shown{display:block;}
.upload-alt{
  margin-top:12px;font-size:13.5px;color:var(--body-soft);text-align:left;
}

/* ---------- downloadable document (the consent form) ---------- */
.doc-download{
  display:flex;align-items:center;gap:14px;max-width:420px;
  background:var(--white);border:1px solid var(--line);border-left:3px solid var(--olive);
  border-radius:0 8px 8px 0;padding:14px 18px;text-decoration:none;
  transition:border-color var(--ease), background var(--ease);
}
.doc-download:hover{background:var(--navy-tint);border-color:var(--olive);}
.doc-download-mark{
  width:40px;height:40px;border-radius:6px;flex:none;background:var(--olive-deep);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;letter-spacing:.04em;
}
.doc-download-text{display:flex;flex-direction:column;min-width:0;}
.doc-download-text strong{font-size:15px;color:var(--navy);text-decoration:underline;text-underline-offset:3px;}
.doc-download-text span{font-size:12.5px;color:var(--gray);margin-top:2px;}
.checklist + .doc-download{margin-top:22px;}
.doc-download.is-compact{padding:10px 12px;gap:10px;margin-top:16px;}
.doc-download.is-compact .doc-download-mark{width:32px;height:32px;font-size:10px;}
.doc-download.is-compact .doc-download-text strong{font-size:14px;}

.doc-steps{
  display:grid;grid-template-columns:minmax(0,380px) 1fr;gap:20px 28px;align-items:start;
  background:var(--navy-tint);border-radius:10px;padding:22px 24px;margin:4px 0 32px;
}
.doc-steps .doc-download{max-width:none;}
.doc-steps-list{margin:0;padding-left:20px;font-size:14px;color:var(--body-soft);line-height:1.55;}
.doc-steps-list li+li{margin-top:6px;}
.doc-steps-list strong{color:var(--navy);}
@media (max-width:820px){ .doc-steps{grid-template-columns:1fr;} }

/* ---------- weeks NOT available ---------- */
.label-as-legend .is-emphasis{color:var(--red);text-decoration:underline;text-underline-offset:3px;}
.callout.is-tip{margin:14px 0 20px;max-width:none;}
.week-months{display:grid;gap:14px;}
.week-month{display:grid;grid-template-columns:84px 1fr;gap:12px;align-items:start;}
.week-month-name{font-size:14px;font-weight:700;color:var(--navy);padding-top:9px;}
.choice-grid.is-weeks{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));}
.week-dates{display:block;font-size:12px;color:var(--gray);}
/* a ticked week means "I can't come" — red, struck through, not the olive "yes" */
.choice-grid.is-weeks label.choice:has(input:checked){border-color:var(--red);background:#fdeaea;}
.choice-grid.is-weeks label.choice:has(input:checked) span{text-decoration:line-through;}
.choice-grid.is-weeks label.choice input{accent-color:var(--red);}
.week-summary{margin-top:14px;font-size:14px;font-weight:600;color:var(--navy);}
.week-summary.is-warn{color:var(--red);}
@media (max-width:560px){
  .week-month{grid-template-columns:1fr;gap:6px;}
  .week-month-name{padding-top:0;}
}

/* ==========================================================================
   RHYTHM — replaces the ad-hoc inline margins that had crept in.
   One value per job, so vertical spacing stays consistent across pages.
   ========================================================================== */

/* a section sitting directly under a page hero shouldn't double the gap */
.flush-top{padding-top:0;}
/* a section that is immediately followed by another related section should not
   pay full bottom padding as well as the next section's top padding */
.flush-bottom{padding-bottom:56px;}

/* Where two neighbouring sections share a background there is no visual
   boundary between them, so their facing paddings read as one dead gap of
   ~170px rather than as two bands. Collapse the second one's top padding.
   Sections with DIFFERENT backgrounds keep their full padding — there the
   space is doing real work. */
.section-tint + .section-tint,
.section-cream + .section-cream,
.band-navy + .band-navy,
.section-tint + .section-tint.section-tight,
.reassure + .reassure{padding-top:0;}

/* footnote under a grid, table or stat row */
.note{font-size:14px;color:var(--gray);margin-top:20px;line-height:1.6;}
.band-navy .note,.pledge .note{color:var(--on-navy-soft);}

/* a block that needs clear separation from what precedes it */
.stack-lg{margin-top:56px;}
.stack-md{margin-top:40px;}

.btn-row.is-center{justify-content:center;}
.page-hero .btn-row{margin-top:0;}
.editorial-copy > .btn{margin-top:26px;}

.callout.is-wide{max-width:820px;}
.callout.is-full{max-width:none;}
.apply-step .callout{max-width:none;}

.section-head.is-tight{margin-bottom:32px;}
.eyebrow.is-block{display:block;margin-bottom:14px;}

.info-card .small{margin-top:8px;}
.eligibility-wrap h2{margin-bottom:10px;}
.editorial-copy .checklist{margin-top:16px;}

/* ==========================================================================
   DARK THEME
   Palette from the VJKF brand doc's dark-mode reference. Applied via a
   data-theme attribute set before first paint by an inline script in <head>,
   so there is no flash of the wrong theme. --band stays *lighter* than
   --paper here, so navy panels still read as panels on a dark page.
   ========================================================================== */
[data-theme="dark"]{
  color-scheme:dark;

  --navy:#e6eef4;          /* navy-as-text inverts */
  --navy-hover:#ffffff;
  --navy-tint:#122636;
  --tint-olive:#1a2a1c;
  --tint-red:#2c181b;
  --tint-cream:#28261a;
  --band:#14304a;          /* navy-as-panel stays dark, but above --paper */
  --band-hover:#1c3d5b;
  --header-bg:rgba(8,19,31,.92);
  --nav-bg:rgba(11,26,40,.97);

  --olive:#8cab41;
  --olive-hover:#9cbb4d;   /* hover lightens on dark rather than darkening */
  --olive-dark:#a7c85e;    /* olive text on dark grounds */
  --olive-deep:#5e7623;
  --olive-cream:#a7c85e;
  --red:#e8676d;

  --ink:#dfe9f0;
  --body:#b7c8d5;
  --body-soft:#a9bbc9;
  --gray:#8ba0b1;
  --line:#22364a;
  --paper:#08131f;
  --white:#0f2233;         /* card surface */

  --shadow-photo:0 1px 3px rgba(0,0,0,.55), 0 20px 44px rgba(0,0,0,.45);
  --shadow-card:0 1px 3px rgba(0,0,0,.45), 0 4px 14px rgba(0,0,0,.3);
}

/* cream sections would glare on a dark page */
[data-theme="dark"] .section-cream,
[data-theme="dark"] .reassure{background:#152232;}
[data-theme="dark"] .section-cream p,
[data-theme="dark"] .reassure p{color:var(--body);}
/* the step cards were a white wash over the dark cream band, with light text on top */
[data-theme="dark"] .howto-step{background:var(--white);}
[data-theme="dark"] .reassure .photo img{box-shadow:var(--shadow-photo);}
[data-theme="dark"] .notice-bar{background:#1b2a1c;border-bottom-color:#2b3d2c;}
[data-theme="dark"] .notice-bar p{color:var(--ink);}
[data-theme="dark"] .callout-on-cream,
[data-theme="dark"] .apply-step .callout{background:var(--navy-tint);}
[data-theme="dark"] .apply-step-eyebrow{color:var(--olive-dark);}

/* demo bar keyed off --ink, which inverts — pin it dark */
[data-theme="dark"] .demo-bar{background:#101c27;}
[data-theme="dark"] .demo-bar-text{color:var(--body);}

/* hairlines that were hardcoded */
[data-theme="dark"] .help-meta,
[data-theme="dark"] .eligibility-wrap .checklist li{border-color:var(--line);}
[data-theme="dark"] .apply-progress-bar{background:var(--line);}
[data-theme="dark"] .upload{border-color:var(--line);}
[data-theme="dark"] .upload:hover,
[data-theme="dark"] .upload.is-hover{background:#12283a;border-color:var(--olive);}
[data-theme="dark"] label.choice:has(input:checked){background:#16281a;}
[data-theme="dark"] .upload-remove:hover{background:#33191b;}
[data-theme="dark"] .choice-grid.is-weeks label.choice:has(input:checked){background:#33191b;}
[data-theme="dark"] .review-val.is-empty{color:var(--gray);}

/* sponsor logos are dark artwork on transparency — keep their tile light
   so they stay legible instead of disappearing */
[data-theme="dark"] .partner-logo{background:#eef1f4;}

/* the donation iframe renders its own light UI */
[data-theme="dark"] .donate-embed{background:#fff;}

/* logo swap — brand rule: white-trim mark on dark grounds only */
.brand .logo-light{display:none;}
[data-theme="dark"] .brand .logo-dark{display:none;}
[data-theme="dark"] .brand .logo-light{display:block;}

/* ---------- theme toggle ---------- */
.theme-toggle{
  width:40px;height:40px;flex:none;border-radius:6px;cursor:pointer;
  background:none;border:1px solid var(--line);color:var(--navy);
  display:flex;align-items:center;justify-content:center;
  transition:background var(--ease), border-color var(--ease), color var(--ease);
}
.theme-toggle:hover{background:var(--navy-tint);border-color:var(--olive);color:var(--olive-dark);}
.theme-toggle svg{width:18px;height:18px;}
.theme-toggle .icon-moon{display:none;}
[data-theme="dark"] .theme-toggle .icon-sun{display:none;}
[data-theme="dark"] .theme-toggle .icon-moon{display:block;}

/* ==========================================================================
   STORY RAIL — horizontally scrolling photo cards (the AWS pattern).
   Native scroll-snap does the work, so touch, trackpad and keyboard all
   behave correctly with no JS. The arrows are an enhancement on top.
   ========================================================================== */
.rail-head{
  display:flex;align-items:flex-end;justify-content:space-between;gap:24px;
  margin-bottom:32px;flex-wrap:wrap;
}
.rail-head .section-head{margin-bottom:0;}
.rail-controls{display:flex;gap:8px;flex:none;}
.rail-btn{
  width:44px;height:44px;border-radius:50%;cursor:pointer;
  background:none;border:1.5px solid var(--line);color:var(--navy);
  display:flex;align-items:center;justify-content:center;
  transition:background var(--ease), border-color var(--ease), color var(--ease), opacity var(--ease);
}
.rail-btn:hover:not(:disabled){background:var(--band);border-color:var(--band);color:#fff;}
.rail-btn:disabled{opacity:.3;cursor:default;}
.rail-btn svg{width:17px;height:17px;}
.band-navy .rail-btn{border-color:rgba(255,255,255,.3);color:#fff;}
.band-navy .rail-btn:hover:not(:disabled){background:#fff;color:var(--band);border-color:#fff;}

.rail-viewport{
  overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x mandatory;scroll-behavior:smooth;
  scrollbar-width:none;-ms-overflow-style:none;
  /* bleed to the window edge so cards run off-screen rather than stopping short */
  margin-inline:calc(50% - 50vw);
  padding-inline:max(var(--gutter), calc(50vw - var(--wrap)/2 + var(--gutter)));
  padding-bottom:8px;
}
.rail-viewport::-webkit-scrollbar{display:none;}
.rail{display:flex;gap:24px;width:max-content;}

.rail-card{
  scroll-snap-align:start;flex:none;width:340px;
  background:var(--white);border-radius:12px;overflow:hidden;
  box-shadow:var(--shadow-card);
  display:flex;flex-direction:column;
  transition:transform .25s ease, box-shadow .25s ease;
}
.rail-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-photo);}
.rail-card > img{width:100%;aspect-ratio:4/3;object-fit:cover;flex:none;}
.rail-card-body{padding:26px 26px 28px;display:flex;flex-direction:column;flex:1;}
.rail-tag{
  font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--olive-dark);margin-bottom:10px;
}
.rail-card h3{font-size:18px;margin-bottom:10px;line-height:1.32;}
.rail-card p{font-size:14.5px;color:var(--body-soft);line-height:1.6;}
.rail-quote{
  font-size:16px;color:var(--ink);line-height:1.6;margin-bottom:18px;flex:1;
}
.rail-cite{
  display:block;font-style:normal;font-size:13px;font-weight:700;
  letter-spacing:.04em;color:var(--navy);
}
.rail-cite span{
  display:block;margin-top:3px;font-size:12.5px;font-weight:400;
  letter-spacing:0;color:var(--gray);
}
.band-navy .rail-card{background:rgba(255,255,255,.06);box-shadow:none;}
.band-navy .rail-card h3{color:#fff;}
.band-navy .rail-quote{color:rgba(255,255,255,.92);}
.band-navy .rail-cite{color:var(--cream);}
.band-navy .rail-cite span{color:var(--on-navy-soft);}
.band-navy .rail-card p{color:var(--on-navy);}

.rail-hint{
  margin-top:16px;font-size:13px;color:var(--gray);
}
/* arrows sit with the hint, under the cards they move */
.rail-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:16px;}
.rail-foot .rail-hint{margin-top:0;}
@media (max-width:560px){
  .rail-card{width:270px;}
  .rail{gap:16px;}
}
@media (prefers-reduced-motion:reduce){
  .rail-viewport{scroll-behavior:auto;}
  .rail-card:hover{transform:none;}
}

/* ---------- spotlight profiles ---------- */
.spotlight-grid{
  display:grid;grid-template-columns:repeat(2,1fr);
  gap:2px;background:var(--line);border-radius:10px;overflow:hidden;
}
.spotlight-card{
  background:var(--white);border:none;padding:0;cursor:pointer;
  font-family:var(--font);text-align:left;width:100%;
  display:grid;grid-template-columns:190px 1fr;align-items:stretch;
  transition:background var(--ease);
}
.spotlight-card:hover,.spotlight-card:focus-visible{background:var(--navy-tint);}
.spotlight-card > img{width:100%;height:100%;object-fit:cover;object-position:center top;}
.spotlight-body{display:block;padding:28px 28px 30px;}
.spotlight-card .name{
  display:block;font-size:20px;font-weight:800;color:var(--navy);
  letter-spacing:-.01em;line-height:1.25;margin-bottom:5px;
}
.spotlight-card .meta{
  display:block;font-size:13px;color:var(--gray);margin-bottom:14px;
}
.spotlight-card .desc{display:block;font-size:14.5px;color:var(--body-soft);line-height:1.6;}
.spotlight-card .more{
  display:inline-block;margin-top:16px;font-size:12.5px;font-weight:700;color:var(--navy);
  border-bottom:1.5px solid var(--olive);padding-bottom:2px;
}
@media (max-width:980px){ .spotlight-grid{grid-template-columns:1fr;} }
@media (max-width:560px){
  .spotlight-card{grid-template-columns:1fr;}
  .spotlight-card > img{aspect-ratio:3/2;height:auto;}
}

/* ---------- news list ---------- */
.news-list{border-top:1px solid var(--line);max-width:840px;}
.news-item{border-bottom:1px solid var(--line);padding-top:22px;}
.news-meta{
  display:flex;align-items:center;gap:14px;
  font-size:12px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--gray);
}
.news-cat{
  color:var(--olive-dark);border-left:1px solid var(--line);padding-left:14px;
}
.news-list .faq-q{padding:8px 0 24px;font-size:19px;}
.news-list .faq-a{padding-bottom:28px;}
.news-list blockquote{
  border-left:3px solid var(--olive);padding:4px 0 4px 20px;margin:18px 0;
  font-size:16.5px;color:var(--ink);line-height:1.6;
}
.news-list blockquote cite{
  display:block;margin-top:10px;font-style:normal;font-size:13px;font-weight:700;
  letter-spacing:.04em;color:var(--gray);
}

/* host university list reuses the campus figures layout, wider label column */
.campus-figures.host-list{max-width:760px;}
.campus-figures.host-list strong{min-width:104px;font-size:20px;color:var(--olive-dark);}
.campus-figures.host-list span{font-size:15px;color:var(--ink);}
.footer-tf{font-size:12px;color:var(--on-navy-soft);}


/* accessible-but-invisible heading text */
.visually-hidden{
  position:absolute;width:1px;height:1px;margin:-1px;padding:0;
  overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;
}

/* FAQ questions are headings now; the button keeps all the styling */
.faq-h{margin:0;font-size:inherit;font-weight:inherit;letter-spacing:normal;line-height:inherit;}
.help-h{font-size:19px;margin-bottom:12px;}

/* the rail is scrollable, so it takes focus — show that it has */
.rail-viewport:focus-visible{outline:2px solid var(--olive);outline-offset:4px;border-radius:12px;}


/* ---------- P5 mobile refinements ---------- */
@media (max-width:600px){
  /* separators orphaned at the start of a wrapped line; stack instead */
  .hero-meta{flex-direction:column;gap:6px;}
  .hero-meta span:not(:first-child)::before{content:none;}

  /* hero buttons were stacking at different widths */
  .page-hero .btn-row,.apply-hero .btn-row{flex-direction:column;align-items:stretch;}
  .page-hero .btn-row .btn,.apply-hero .btn-row .btn{width:100%;}

  /* header + section nav were eating ~140px of a phone viewport */
  .section-nav ul{gap:0;}
  .section-nav a{padding:11px 12px;font-size:11.5px;}
  .section-nav-progress{height:2px;}
}

/* honeypot: present for bots, invisible and unreachable for people */
.hp-field{position:absolute!important;left:-9999px!important;width:1px;height:1px;
  overflow:hidden;}

/* ---------- apply: intro, timeline, notify ---------- */
.apply-intro{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:start;}
.apply-intro .checklist{margin-top:18px;}
.timeline{background:var(--white);border-radius:12px;padding:30px 32px;box-shadow:var(--shadow-card);}
.timeline-head{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--gray);margin-bottom:20px;}
.timeline ol{list-style:none;margin:0;padding:0;}
.timeline li{padding:0 0 20px 26px;position:relative;border-left:2px solid var(--line);
  margin-left:5px;}
.timeline li:last-child{padding-bottom:0;border-left-color:transparent;}
.timeline li::before{content:"";position:absolute;left:-7px;top:4px;width:12px;height:12px;
  border-radius:50%;background:var(--olive);box-shadow:0 0 0 3px var(--white);}
.timeline strong{display:block;font-size:15.5px;color:var(--navy);margin-bottom:2px;}
.timeline span{font-size:14px;color:var(--body-soft);}

.notify-panel{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:start;
  background:var(--white);border:1px solid var(--line);border-radius:12px;
  box-shadow:var(--shadow-card);padding:44px 46px;}
.notify-copy h2{font-size:26px;margin-bottom:14px;}
.notify-copy p{font-size:15.5px;color:var(--body-soft);}
.notify-form .btn{width:100%;margin-top:6px;}

.nav-apply{font-weight:700;}

@media (max-width:900px){
  .apply-intro,.notify-panel{grid-template-columns:1fr;gap:32px;}
  .notify-panel{padding:32px 26px;}
}

/* ==========================================================================
   APPLICATION PORTAL — the form on its own page, with reduced chrome so it
   reads as a task rather than another marketing section.
   ========================================================================== */
body.is-app{background:var(--navy-tint);}

.app-bar{
  position:sticky;top:0;z-index:900;background:var(--paper);
  border-bottom:1px solid var(--line);
}
.app-bar-inner{
  max-width:1240px;margin:0 auto;padding:0 var(--gutter);
  display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:72px;
}
.app-brand img{height:40px;width:auto;}
.app-brand .logo-light{display:none;}
[data-theme="dark"] .app-brand .logo-dark{display:none;}
[data-theme="dark"] .app-brand .logo-light{display:block;}
.app-bar-title{
  font-size:12.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--gray);
}
.app-bar-right{display:flex;align-items:center;gap:16px;}
.app-save{font-size:12.5px;color:var(--gray);white-space:nowrap;}
.app-save.is-flash{color:var(--olive-dark);font-weight:700;}
.app-exit{padding:8px 16px;font-size:12.5px;}

.app-layout{
  max-width:1240px;margin:0 auto;padding:34px var(--gutter) 64px;
  display:grid;grid-template-columns:280px 1fr;gap:34px;align-items:start;
}
.app-side,.app-main{min-width:0;}   /* keep long words from blowing out the grid */
.app-side-inner{position:sticky;top:104px;display:flex;flex-direction:column;gap:2px;
  background:var(--line);border-radius:12px;overflow:hidden;}
.app-side-block{background:var(--white);padding:24px 22px;}
.app-side-block .eyebrow{margin-bottom:16px;}

.side-steps{list-style:none;margin:0;padding:0;}
.side-step{
  display:flex;align-items:center;gap:12px;width:100%;
  background:none;border:none;cursor:pointer;font-family:var(--font);text-align:left;
  padding:9px 10px;border-radius:7px;color:var(--body-soft);font-size:14.5px;
  transition:background var(--ease), color var(--ease);
}
.side-step:hover{background:var(--navy-tint);color:var(--navy);}
.side-num{
  width:26px;height:26px;border-radius:50%;flex:none;
  background:var(--navy-tint);color:var(--navy);
  font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;
}
.side-step.is-current{background:var(--navy-tint);color:var(--navy);font-weight:700;}
.side-step.is-current .side-num{background:var(--band);color:#fff;}
.side-step.is-done .side-num{background:var(--olive-deep);color:#fff;}

.side-needs{list-style:none;margin:0;padding:0;}
.side-needs li{
  font-size:13.5px;color:var(--body-soft);line-height:1.5;
  padding:8px 0 8px 20px;position:relative;border-bottom:1px solid var(--line);
}
.side-needs li:last-child{border-bottom:none;}
.side-needs li::before{
  content:"";position:absolute;left:0;top:14px;width:8px;height:8px;
  border-radius:50%;background:var(--olive);
}
.side-note{font-size:12.5px;color:var(--gray);margin-top:14px;line-height:1.55;}

.apply-pane .apply-progress{margin-bottom:18px;}
.app-help{font-size:13.5px;color:var(--gray);margin:18px 2px 0;line-height:1.6;}
.app-help a{color:var(--navy);font-weight:600;
  text-decoration:underline;text-underline-offset:2px;text-decoration-color:var(--olive);}

/* the launch call to action on the overview page */
.launch{background:var(--band);color:#fff;padding:72px 0;}
.launch-inner{max-width:640px;}
.launch .eyebrow{color:var(--cream);}
.launch h2{color:#fff;font-size:clamp(26px,3.4vw,36px);margin-bottom:14px;}
.launch p{color:var(--on-navy);margin-bottom:26px;}
.launch-note{font-size:14px;color:var(--cream);margin:16px 0 0;}
.launch-btn{padding:16px 34px;font-size:15.5px;}

@media (max-width:1000px){
  .app-layout{grid-template-columns:1fr;gap:22px;}
  .app-side-inner{position:static;flex-direction:row;flex-wrap:wrap;}
  .app-side-block{flex:1 1 280px;}
  .side-steps{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;}
}
@media (max-width:640px){
  .app-bar-title{display:none;}
  .app-layout{padding:20px var(--gutter) 48px;}
  .side-steps{grid-template-columns:1fr;}
}

.app-foot{border-top:1px solid var(--line);background:var(--paper);}
.app-foot .app-bar-inner{min-height:64px;flex-wrap:wrap;}
.app-foot p{font-size:13px;color:var(--gray);margin:0;}
.app-foot a{color:var(--navy);font-weight:600;
  text-decoration:underline;text-underline-offset:2px;text-decoration-color:var(--olive);}

/* application status, stamped on <body> by the build — keeps the open and
   opening-soon copy out of each other's way without a JS toggle */
body:not(.apps-open) [data-when-open],
body.apps-open [data-when-soon]{display:none;}
/* staff-testing mode: the form is locked, so the public pages don't link to it */
body.app-private [data-needs-app]{display:none !important;}
.app-testing-bar{
  background:var(--cream);color:#2B2A29;border-bottom:1px solid #d9cf8f;
  padding:10px 20px;font-size:13.5px;text-align:center;line-height:1.5;
}
.app-testing-bar strong{color:#001F34;}

/* the "what counts as documentation" disclosure, and the field pairs that
   only appear once the student has picked the answer that needs them */
.apply-details{margin-top:14px;border:1px solid var(--line);border-radius:9px;background:var(--navy-tint);}
.apply-details summary{
  cursor:pointer;padding:12px 16px;font-size:14px;font-weight:700;color:var(--navy);
  list-style:none;
}
.apply-details summary::-webkit-details-marker{display:none;}
.apply-details summary::before{content:"+ ";font-weight:800;color:var(--olive-dark);}
.apply-details[open] summary::before{content:"\2212 ";}
.apply-details > :not(summary){padding:0 16px;}
.apply-details > :last-child{padding-bottom:14px;}
.docs-list{margin:0 0 10px;}
.docs-list dt{font-size:13px;font-weight:800;color:var(--navy);margin-top:12px;}
.docs-list dd{margin:4px 0 0;font-size:13.5px;line-height:1.55;color:var(--body-soft);}
.choice-list.is-inline{display:flex;flex-wrap:wrap;gap:10px;}
.choice-list.is-inline .choice{flex:0 1 auto;min-width:120px;}
.submit-error{
  margin:14px 0 0;padding:12px 16px;border-radius:8px;
  background:#fdeceb;border:1px solid #f0b4ae;color:#7d241b;
  font-size:14px;line-height:1.5;
}
[data-theme="dark"] .submit-error{background:#3a1d1a;border-color:#6b2f28;color:#f5c6c0;}

/* ==========================================================================
   STUDENT EXPERIENCE — an "On this page" panel beside one consistent section
   style. Desktop: the panel sits to the left and stays put, numbering the
   sections, marking the current one and filling a progress rail. Below 1100px
   it becomes a slim sticky bar under the header that scrolls itself so the
   current section stays visible.
   ========================================================================== */
.xp{background:var(--paper);}
.xp-grid{display:grid;grid-template-columns:220px minmax(0,1fr);gap:72px;align-items:start;}
.xp-main{max-width:820px;min-width:0;}

.xp-section{padding:72px 0;border-top:1px solid var(--line);}
.xp-section:first-child{border-top:none;padding-top:64px;}
.xp-head{margin-bottom:20px;}
.xp-head .eyebrow{display:flex;align-items:center;gap:12px;margin-bottom:14px;}
.xp-num{
  font-size:12px;font-weight:800;letter-spacing:.04em;color:var(--cream);background:var(--band);
  border-radius:999px;padding:4px 10px;line-height:1.3;
}
.xp-section > p{max-width:680px;margin-bottom:14px;}
.xp-section > p.note{margin-top:4px;}
.xp-block{margin-top:32px;}
.xp-after-list{margin-top:20px;}
.xp .callout{max-width:none;}
.xp .callout.xp-block{margin:32px 0 0;}
.xp .btn.xp-block{display:inline-flex;}

/* a quote that sits in the reading column rather than its own band */
.xp-quote{margin:40px 0 0;padding:4px 0 4px 26px;border-left:3px solid var(--olive);}
.xp-quote blockquote{font-size:clamp(19px,2vw,23px);line-height:1.45;color:var(--navy);margin:0;}
.xp-quote figcaption{
  margin-top:14px;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--olive-dark);
}
.xp-quote figcaption span{
  display:block;margin-top:4px;font-size:13px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--gray);
}


/* the panel */
.toc{
  --toc-stacked:0;
  position:sticky;top:calc(var(--header-h) + 28px);align-self:start;padding:64px 0 40px;
}
.toc-label{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gray);margin-bottom:16px;}
.toc-list{position:relative;border-left:2px solid var(--line);}
.toc-rail{position:absolute;left:-2px;top:0;bottom:0;width:2px;}
.toc-rail span{display:block;width:100%;height:var(--toc-progress,0%);background:var(--olive);transition:height .15s linear;}
.toc ol{list-style:none;margin:0;padding:0;}
.toc ol a{
  display:flex;gap:12px;align-items:baseline;position:relative;
  padding:9px 0 9px 18px;font-size:14.5px;line-height:1.35;color:var(--body-soft);text-decoration:none;
  transition:color var(--ease);
}
.toc ol a:hover{color:var(--navy);}
.toc ol a.is-current{color:var(--navy);font-weight:700;}
.toc ol a::before{
  content:"";position:absolute;left:-2px;top:7px;bottom:7px;width:3px;border-radius:2px;background:var(--olive-deep);
  opacity:0;transform:scaleY(.3);transition:opacity .25s ease, transform .25s ease;
}
.toc ol a.is-current::before{opacity:1;transform:none;}
.toc-num{font-size:12px;font-weight:700;color:var(--gray);min-width:20px;font-variant-numeric:tabular-nums;}
.toc ol a.is-current .toc-num{color:var(--olive-dark);}
.toc-cta{margin-top:28px;width:100%;justify-content:center;}

@media (max-width:1100px){
  .xp-grid{grid-template-columns:minmax(0,1fr);gap:0;}
  .toc{
    --toc-stacked:1;
    top:var(--header-h);z-index:800;padding:0;
    margin:0 calc(-1 * var(--gutter));background:var(--nav-bg);
  }
  .toc-label,.toc-cta,.toc-num{display:none;}
  .toc-list{border-left:none;}
  .toc-rail{left:0;right:0;top:auto;bottom:0;width:auto;height:2px;background:rgba(255,255,255,.12);}
  .toc-rail span{height:100%;width:var(--toc-progress,0%);transition:width .15s linear;}
  .toc ol{display:flex;overflow-x:auto;scrollbar-width:none;padding:0 calc(var(--gutter) - 12px);}
  .toc ol::-webkit-scrollbar{display:none;}
  .toc ol a{padding:14px 12px;font-size:12.5px;font-weight:600;white-space:nowrap;color:var(--on-navy);}
  .toc ol a:hover{color:#fff;}
  .toc ol a.is-current{color:var(--cream);font-weight:700;}
  .toc ol a::before{left:12px;right:12px;top:auto;bottom:0;width:auto;height:3px;border-radius:0;background:var(--olive);transform:scaleX(.3);}
  .toc ol a.is-current::before{transform:none;}
  .xp-section:first-child{padding-top:48px;}
}
@media (max-width:640px){
  .xp-section{padding:56px 0;}
}
@media (prefers-reduced-motion:reduce){
  .toc-rail span,.toc ol a::before{transition:none;}
}

/* ---------- Student Experience: tiles, panel, rows (colour + motion) ---------- */
.xp-tiles{display:grid;gap:16px;list-style:none;padding:0;}
.xp-tiles.is-2{grid-template-columns:repeat(2,1fr);}
.xp-tiles.is-3{grid-template-columns:repeat(3,1fr);}
.xp-tile{
  --accent:var(--navy);--chip:var(--navy-tint);
  position:relative;background:var(--white);border:1px solid var(--line);border-radius:14px;
  padding:24px 24px 22px;overflow:hidden;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.xp-tile::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--accent);}
.xp-tile.is-olive{--accent:var(--olive-dark);--chip:var(--tint-olive);}
.xp-tile.is-red{--accent:var(--red);--chip:var(--tint-red);}
.xp-tile.is-cream{--accent:var(--olive-cream);--chip:var(--tint-cream);}
.xp-tile.is-cream::before{background:var(--cream);}
.xp-tile h3{font-size:17px;margin:14px 0 6px;}
.xp-tile p{font-size:14.5px;color:var(--body-soft);line-height:1.55;margin:0;}
.xp-tile:hover{transform:translateY(-3px);box-shadow:var(--shadow-card);border-color:transparent;}
.xp-icon{
  width:44px;height:44px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;
  background:var(--chip,var(--navy-tint));color:var(--accent,var(--navy));
  transition:transform .25s ease;
}
.xp-icon svg{width:22px;height:22px;}
.xp-tile:hover .xp-icon{transform:scale(1.06);}
.xp-step-num{margin-top:14px;font-size:11.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);}
.xp-tiles.is-steps h3{margin-top:4px;}

/* "is it for you?": text beside a modest photo, not a full-width one */
.xp-split{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;}
.xp-photo img{aspect-ratio:4/5;object-fit:cover;object-position:center 30%;}
.xp-split .checklist{margin-top:0;}

/* what it costs: the one navy moment on the page */
.xp-panel{background:var(--band);color:#fff;border-radius:16px;padding:28px 30px 30px;}
.xp-panel-head{display:flex;align-items:baseline;gap:14px;padding-bottom:20px;margin-bottom:6px;border-bottom:1px solid rgba(255,255,255,.14);}
.xp-panel-head strong{font-size:44px;font-weight:800;line-height:1;color:var(--cream);letter-spacing:-.02em;}
.xp-panel-head span{font-size:15px;color:var(--on-navy);}
.xp-covered{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:4px 28px;}
.xp-covered li{position:relative;padding:16px 0 4px 40px;font-size:14px;color:var(--on-navy-soft);line-height:1.5;}
.xp-covered strong{display:block;font-size:15.5px;color:#fff;margin-bottom:2px;}
.xp-covered .check{left:0;top:16px;background:var(--olive);color:var(--on-olive);}

/* where & when: three coloured figures */
.xp-figures{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.xp-figures > div{
  --accent:var(--navy);background:var(--white);border:1px solid var(--line);border-left:4px solid var(--accent);
  border-radius:12px;padding:18px 22px;
}
.xp-figures > .is-olive{--accent:var(--olive-dark);}
.xp-figures > .is-red{--accent:var(--red);}
.xp-figures > .is-cream{--accent:var(--olive-cream);border-left-color:var(--cream);}
.xp-figures.is-4{grid-template-columns:repeat(4,1fr);}
.about-figures{margin-top:56px;}
.xp-figures strong{display:block;font-size:36px;font-weight:800;line-height:1.1;letter-spacing:-.02em;color:var(--accent);}
.xp-figures span{font-size:14px;color:var(--body-soft);}

/* for families: icon rows, no boxes */
.xp-rows{display:grid;grid-template-columns:repeat(2,1fr);gap:30px 40px;}
.xp-row{display:grid;grid-template-columns:44px 1fr;gap:16px;align-items:start;}
.xp-row h3{font-size:17px;margin:2px 0 6px;}
.xp-row p{font-size:14.5px;color:var(--body-soft);line-height:1.6;margin:0;}

.callout.is-cream{background:var(--tint-cream);border-left-color:var(--cream);}
.xp-quote{position:relative;}
.xp-quote blockquote::before{
  content:"\201C";position:absolute;left:22px;top:-26px;font-size:64px;line-height:1;color:var(--olive);opacity:.35;font-family:var(--font);font-weight:800;
}

@media (max-width:820px){
  .xp-tiles.is-3{grid-template-columns:1fr;}
  .xp-split{grid-template-columns:1fr;gap:28px;}
  .xp-photo{max-width:420px;}
  .xp-photo img{aspect-ratio:4/3;}
}
@media (max-width:640px){
  .xp-tiles.is-2,.xp-covered,.xp-figures,.xp-rows{grid-template-columns:1fr;}
  .xp-panel{padding:24px 22px;}
}
@media (max-width:880px){
  .xp-figures.is-4{grid-template-columns:repeat(2,1fr);}
  .about-figures{margin-top:40px;}
}
@media (prefers-reduced-motion:reduce){
  .xp-tile,.xp-icon{transition:none;}
  .xp-tile:hover,.xp-tile:hover .xp-icon{transform:none;}
}

/* icon chips can carry their own tone outside a tile */
.xp-icon.is-navy{--accent:var(--navy);--chip:var(--navy-tint);}
.xp-icon.is-olive{--accent:var(--olive-dark);--chip:var(--tint-olive);}
.xp-icon.is-red{--accent:var(--red);--chip:var(--tint-red);}
.xp-icon.is-cream{--accent:var(--olive-cream);--chip:var(--tint-cream);}

/* ---------- Questions & Answers: topic groups, rounded question rows, search ---------- */
.faq-group-head{display:flex;gap:18px;align-items:flex-start;}
.faq-group-head .xp-icon{margin-top:2px;flex:none;}
.faq-group-head .eyebrow{margin-bottom:8px;}
.xp .faq-list{border-top:none;max-width:none;display:grid;gap:10px;margin-top:24px;}
.xp .faq-item{
  background:var(--white);border:1px solid var(--line);border-radius:12px;padding:0 24px;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.xp .faq-item:hover{border-color:#cfd6da;}
.xp .faq-item:has(.faq-q[aria-expanded="true"]){border-color:var(--olive);box-shadow:var(--shadow-card);}
.xp .faq-q{padding:20px 0;font-size:16.5px;}
.xp .faq-a{padding:0 0 22px;}
.xp .faq-a.is-open{animation:faq-open .25s ease;}
@keyframes faq-open{from{opacity:0;transform:translateY(-4px);}to{opacity:1;transform:none;}}
.faq-item[hidden],.faq-group[hidden]{display:none;}

.faq-search{position:relative;margin-top:64px;}
.faq-search input{
  width:100%;font-family:var(--font);font-size:16px;color:var(--ink);
  background:var(--white);border:1.5px solid var(--line);border-radius:999px;
  padding:16px 22px 16px 54px;transition:border-color .2s ease, box-shadow .2s ease;
}
.faq-search input:focus{outline:none;border-color:var(--olive);box-shadow:0 0 0 4px var(--tint-olive);}
.faq-search-icon{position:absolute;left:20px;top:15px;width:22px;height:22px;color:var(--gray);pointer-events:none;}
.faq-search-icon svg{width:22px;height:22px;}
.faq-search-status{margin:12px 4px 0;font-size:14px;color:var(--body-soft);min-height:1.4em;}
.xp .faq-search + .xp-section{border-top:none;padding-top:48px;}
@media (max-width:1100px){ .faq-search{margin-top:40px;} }
@media (prefers-reduced-motion:reduce){ .xp .faq-a.is-open{animation:none;} }

/* ---------- floating Apply button: phones only ---------- */
.float-apply{display:none;}
@media (max-width:820px){
  .float-apply{
    display:inline-flex;align-items:center;gap:8px;position:fixed;z-index:850;
    right:16px;bottom:calc(16px + env(safe-area-inset-bottom));
    background:var(--olive);color:var(--on-olive);font-weight:800;font-size:14.5px;letter-spacing:.01em;
    padding:13px 20px;border-radius:999px;text-decoration:none;
    box-shadow:0 6px 20px rgba(0,31,52,.28);
    transform:translateY(140%);opacity:0;pointer-events:none;
    transition:transform .3s ease, opacity .3s ease;
  }
  .float-apply svg{width:17px;height:17px;}
  .float-apply.is-shown{transform:none;opacity:1;pointer-events:auto;}
}
@media (prefers-reduced-motion:reduce){ .float-apply{transition:none;} }

/* ---------- Apply page: download row and the year track ---------- */
.apply-download{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:28px;}
.apply-download .note{margin:0;max-width:440px;}
.year-track{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative;}
.year-track li{position:relative;padding:34px 22px 0 0;}
.year-track li::before{ /* the connecting line */
  content:"";position:absolute;left:0;right:0;top:9px;height:2px;background:var(--line);
}
.year-track li:last-child::before{right:auto;width:22px;}
.year-dot{
  position:absolute;left:0;top:0;width:20px;height:20px;border-radius:50%;
  background:var(--white);border:2px solid var(--line);z-index:1;
}
.year-track strong{display:block;font-size:17px;color:var(--navy);margin-bottom:4px;}
.year-track span:not(.year-dot){font-size:14.5px;color:var(--body-soft);line-height:1.5;}
.year-track li.is-done::before{background:var(--olive);}
.year-track li.is-done .year-dot{background:var(--olive);border-color:var(--olive);}
.year-track li.is-now .year-dot,.year-track li.is-next .year-dot{border-color:var(--olive-deep);background:var(--white);}
.year-track li.is-now .year-dot::after,.year-track li.is-next .year-dot::after{
  content:"";position:absolute;inset:3px;border-radius:50%;background:var(--olive-deep);
}
.year-track li.is-now .year-dot{box-shadow:0 0 0 6px var(--tint-olive);}
.year-track li[data-label]::after{
  content:attr(data-label);position:absolute;left:30px;top:1px;
  font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--olive-dark);
}
@media (max-width:820px){
  .year-track{grid-template-columns:1fr;gap:0;}
  .year-track li{padding:0 0 26px 40px;}
  .year-track li::before{left:9px;right:auto;top:20px;bottom:0;width:2px;height:auto;}
  .year-track li:last-child::before{display:none;}
  .year-track li[data-label]::after{position:static;display:block;margin-bottom:4px;}
}

/* ---------- About: milestones as a vertical timeline ---------- */
.milestones{list-style:none;margin:8px 0 0;padding:0;max-width:880px;position:relative;}
.milestones li{
  --accent:var(--navy);
  display:grid;grid-template-columns:150px 1fr;gap:0 36px;position:relative;padding:0 0 34px;
}
.milestones li.is-olive{--accent:var(--olive-dark);}
.milestones li.is-red{--accent:var(--red);}
.milestones li.is-cream{--accent:var(--olive-cream);}
.milestones li::before{ /* the rail */
  content:"";position:absolute;left:168px;top:10px;bottom:-10px;width:2px;background:var(--line);
}
.milestones li:last-child::before{display:none;}
.milestones li::after{ /* the marker */
  content:"";position:absolute;left:162px;top:6px;width:14px;height:14px;border-radius:50%;
  background:var(--accent);box-shadow:0 0 0 5px var(--paper);
}
.section-tint .milestones li::after{box-shadow:0 0 0 5px var(--navy-tint);}
.milestone-year{text-align:right;font-size:22px;font-weight:800;color:var(--accent);letter-spacing:-.01em;line-height:1.2;}
.milestone-body{padding-left:20px;}
.milestone-body h3{font-size:18px;margin:0 0 6px;}
.milestone-body p{font-size:15px;color:var(--body-soft);margin:0;max-width:600px;}
@media (max-width:640px){
  .milestones li{grid-template-columns:1fr;padding:0 0 28px 30px;}
  .milestones li::before{left:6px;top:20px;}
  .milestones li::after{left:0;top:4px;}
  .milestone-year{text-align:left;font-size:18px;margin-bottom:4px;}
  .milestone-body{padding-left:0;}
}

/* ---------- Home: coloured impact numbers, a link inside a tile heading ---------- */
.stat-card{position:relative;}
.stat-card::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--accent,transparent);}
.stat-card.is-navy{--accent:var(--navy);}
.stat-card.is-olive{--accent:var(--olive-dark);}
.stat-card.is-red{--accent:var(--red);}
.stat-card.is-olive .stat-num{color:var(--olive-dark);}
.stat-card.is-red .stat-num{color:var(--red);}
.stat-card.is-olive .stat-num em,.stat-card.is-red .stat-num em{color:inherit;opacity:.7;}
.tile-link{color:inherit;text-decoration:underline;text-decoration-color:var(--olive);text-underline-offset:3px;}
.tile-link:hover{color:var(--olive-dark);}

/* ---------- application form: warmer touches ---------- */
.apply-step-eyebrow{
  display:inline-block;background:var(--band);color:var(--cream);border-radius:999px;
  padding:5px 12px;font-size:11.5px;letter-spacing:.1em;margin-bottom:14px;
}
.apply-step.is-current{animation:step-in .3s ease;}
@keyframes step-in{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}
.apply-progress-bar span{background:linear-gradient(90deg,var(--olive-deep),var(--olive));transition:width .4s ease;}

.apply-welcome{
  clear:both;background:var(--tint-cream);border-radius:14px;padding:20px 22px;margin:4px 0 24px;
  border-left:4px solid var(--cream);
}
.apply-welcome-title{font-size:17px;font-weight:800;color:var(--navy);margin:0 0 14px;}
.apply-welcome ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.apply-welcome li,.apply-done-next li{display:flex;gap:12px;align-items:flex-start;font-size:13.5px;color:var(--body-soft);line-height:1.45;}
.apply-welcome strong,.apply-done-next li strong{display:block;color:var(--navy);font-size:14.5px;}
.apply-welcome .xp-icon,.apply-done-next .xp-icon{width:38px;height:38px;border-radius:10px;flex:none;}
.apply-welcome .xp-icon svg,.apply-done-next .xp-icon svg{width:19px;height:19px;}

.side-step.is-done .side-num{font-size:0;}
.side-step.is-done .side-num::after{content:"\2713";font-size:13px;}

.apply-done-mark{width:76px;height:76px;background:var(--olive-deep);animation:done-pop .5s cubic-bezier(.2,1.4,.4,1) both;}
.apply-done-mark svg{width:38px;height:38px;}
@keyframes done-pop{from{transform:scale(.4);opacity:0;}to{transform:none;opacity:1;}}
.apply-done-next{text-align:left;padding:22px 24px;}
.apply-done-next-title{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--olive-dark);margin:0 0 14px;}
.apply-done-next ol{list-style:none;margin:0;padding:0;display:grid;gap:16px;}
@media (max-width:820px){ .apply-welcome ul{grid-template-columns:1fr;} }
@media (prefers-reduced-motion:reduce){
  .apply-step.is-current,.apply-done-mark{animation:none;}
  .apply-progress-bar span{transition:none;}
}

[data-theme="dark"] .apply-step-eyebrow{color:var(--cream);}