/* ============================================================
   1. TOKENS
   ============================================================ */
:root{
  /* color */
  --green:#0F2D23;
  --green-deep:#0A1F18;
  --green-ink:#081A13;
  --cream:#F7F3EB;
  --cream-soft:#FBF8F2;
  --gold:#B89A5D;
  --gold-light:#CBAE72;
  --gold-dark:#8A713D;
  --char:#2A2A2A;
  --char-soft:#4A4A44;

  /* derived */
  --rule:rgba(184,154,93,.35);
  --rule-soft:rgba(184,154,93,.22);
  --on-dark:rgba(247,243,235,.85);
  --on-dark-dim:rgba(247,243,235,.65);

  /* type */
  --lb:"Playfair Display",Georgia,serif;
  --cg:"Cormorant Garamond",Georgia,serif;
  --in:"Inter",system-ui,-apple-system,sans-serif;

  --fs-body:clamp(17px,.55vw + 15px,19px);
  --fs-lead:clamp(18px,.9vw + 15px,21px);
  --fs-h1:clamp(32px,4.2vw,54px);
  --fs-h2:clamp(25px,3vw,40px);
  --fs-h3:clamp(19px,1.2vw + 15px,21px);
  --fs-micro:clamp(11px,.3vw + 10px,12.5px);

  /* space */
  --gutter:clamp(20px,4.5vw,32px);
  --section-y:clamp(40px,5vw,48px);
  --sec-head-gap:clamp(32px,4.5vw,42px);
  --grid-gap:clamp(18px,2.4vw,28px);
  --card-pad:clamp(28px,3.4vw,40px);
  --maxw:1200px;

  --nav-offset:92px;
}

/* ============================================================
   2. BASE
   ============================================================ */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

html{
  scroll-behavior:smooth;
  scroll-padding-top:var(--nav-offset);
  -webkit-text-size-adjust:100%;
}

body{
  font-family:var(--cg);
  font-size:var(--fs-body);
  line-height:1.55;
  color:var(--char);
  background:var(--cream);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ============================================================
   3. LAYOUT PRIMITIVES
   ============================================================ */
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
.section{padding-block:var(--section-y)}

.sec-head{margin-bottom:var(--sec-head-gap);max-width:780px}
.sec-head--center{max-width:none;text-align:center}
.sec-head--center .rule{margin-inline:auto}
.rule{width:56px;height:1px;background:var(--gold);margin-top:22px}
/* an optional paragraph under a section heading, for context the cards can't carry */
.sec-head__lead{font-size:var(--fs-lead);color:var(--char-soft);max-width:68ch;margin-top:24px}
.on-dark .sec-head__lead{color:rgba(247,243,235,.82)}
.sec-head--center .sec-head__lead{margin-inline:auto}
/* a small grey qualifier under the lead, sized to match the plan notes on the
   Hook Program and Research pages */
.sec-head__note{
  font-family:var(--in);font-weight:600;
  font-size:clamp(9.4px,.2vw + 8.5px,10.1px);
  letter-spacing:1.5px;text-transform:uppercase;
  color:rgba(42,42,42,.5);
  margin-top:20px;
}
.sec-head__note b{font-weight:800;color:inherit}
.on-dark .sec-head__note{color:rgba(236,238,234,.52)}
.sec-head--center .sec-head__note{margin-inline:auto}

/* ============================================================
   4. TYPE ROLES
   ============================================================ */
.eyebrow{
  font-family:var(--in);font-weight:600;
  font-size:clamp(11px,.25vw + 10px,12px);
  letter-spacing:4.5px;text-transform:uppercase;
  color:var(--gold-dark);
}
h2{
  font-family:var(--lb);font-weight:500;
  font-size:var(--fs-h2);line-height:1.24;
  color:var(--green);margin-top:16px;
}
h2 em{font-style:normal;color:var(--gold-dark)}

.lead{font-size:var(--fs-lead)}

/* dark-surface inversions */
.on-dark{color:var(--on-dark)}
.on-dark h2{color:var(--cream)}
.on-dark h2 em{color:var(--gold-light)}
.on-dark .eyebrow{color:var(--gold-light)}

/* ============================================================
   5. BUTTONS
   ============================================================ */
.btn{
  display:inline-block;
  font-family:var(--in);font-weight:600;
  font-size:var(--fs-micro);letter-spacing:2px;text-transform:uppercase;
  padding:15px 30px;
  border:1px solid var(--gold);
  color:var(--gold-light);
  background:transparent;
  cursor:pointer;
  transition:background .25s,color .25s;
}
.btn:hover{background:var(--gold);color:var(--green-ink)}
/* The nav CTA sits on green all the way down the page. Gold on green was the
   lowest-contrast text on the site; a filled cream block reads at a glance. */
.nav-links .btn{background:var(--cream);border-color:var(--cream);color:var(--green-ink)}
.nav-links .btn:hover{background:#fff;border-color:#fff;color:var(--green-ink)}
/* A filled cream button, for the primary action on a dark or photographic
   surface where gold doesn't separate from the background. */
.btn--white{background:var(--cream);border-color:var(--cream);color:var(--green-ink)}
.btn--white:hover{background:#fff;border-color:#fff;color:var(--green-ink)}
.btn--solid{background:var(--gold);color:var(--green-ink)}
.btn--solid:hover{background:var(--gold-light)}

/* ============================================================
   6. NAV
   ============================================================ */
.nav{
  position:fixed;inset:0 0 auto;z-index:50;
  background:rgba(15,45,35,.98);
  box-shadow:0 1px 0 var(--rule);
  padding-block:16px;
  transition:background .35s,box-shadow .35s,padding .35s;
  padding-top:max(16px,env(safe-area-inset-top));
}
.nav.is-scrolled{
  background:rgba(15,45,35,.98);
  box-shadow:0 1px 0 var(--rule);
  padding-block:14px;
  padding-top:max(14px,env(safe-area-inset-top));
}
.nav-inner{
  max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter);
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.wordmark{
  font-family:var(--lb);font-weight:500;font-size:clamp(13px,.6vw + 11px,16px);
  letter-spacing:clamp(3px,.4vw,5px);text-transform:uppercase;
  color:var(--gold-light);white-space:nowrap;
}
.nav-links{
  display:flex;align-items:center;gap:26px;
  font-family:var(--in);font-weight:600;
  font-size:12.5px;letter-spacing:1.8px;text-transform:uppercase;
}
.nav-links a:not(.btn){color:var(--cream);opacity:.85;padding:6px 0;transition:opacity .2s,color .2s}
.nav-links a{white-space:nowrap}
.nav-links a[aria-current="page"]{opacity:1;color:var(--gold-light)}

/* --- Services dropdown ------------------------------------------------- */
.nav-item{position:relative;display:flex;align-items:center;gap:5px}
.nav-sub-toggle{
  background:none;border:0;padding:0;cursor:pointer;line-height:0;
  color:currentColor;opacity:.75;
}
.nav-sub-toggle svg{width:9px;height:6px;display:block;transition:transform .2s}
.nav-sub{
  position:absolute;top:calc(100% + 17px);left:-20px;
  min-width:212px;display:flex;flex-direction:column;
  /* Fully opaque, not .98 like the bar itself: this panel floats over the hero
     photo, and 2% of a bright headline showing through reads as a glitch. */
  background:var(--green);
  border:1px solid var(--rule);
  padding:8px 0;
  box-shadow:0 18px 40px rgba(0,0,0,.34);
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .2s,transform .2s,visibility .2s;
  z-index:60;
}
/* The nav bar's own padding leaves a gap under the link; without this bridge
   the panel closes as the pointer crosses it. */
.nav-item.has-sub::after{content:"";position:absolute;top:100%;left:-20px;width:232px;height:20px}
.nav-item:hover .nav-sub,
.nav-item:focus-within .nav-sub{opacity:1;visibility:visible;transform:none}
.nav-item:hover .nav-sub-toggle svg,
.nav-item:focus-within .nav-sub-toggle svg{transform:rotate(180deg)}
.nav-sub a:not(.btn){padding:11px 24px 11px 28px;opacity:.82}
.nav-sub a:not(.btn):hover{opacity:1;color:var(--gold-light)}
.nav-links a:not(.btn):hover{opacity:1;color:var(--gold-light)}
.nav-links .btn{padding:11px 22px}

.nav-toggle{
  display:none;
  background:none;border:1px solid var(--rule);
  color:var(--gold-light);
  width:44px;height:44px;
  font-size:20px;line-height:1;cursor:pointer;
}

/* ============================================================
   7. HERO
   ============================================================ */
/* A ~1KB blurred first frame, inlined so the hero paints instantly instead of
   flashing flat black while the poster request is still in flight. */
.hero{
  position:relative;display:flex;align-items:center;
  min-height:62vh;min-height:62svh;
  background:#0A0A0A url('data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD//gAQTGF2YzYwLjMxLjEwMgD/2wBDABUOEBIQDRUSERIYFhUZHzQiHx0dH0AuMCY0TENQT0tDSUhUXnlmVFlyWkhJaY9qcnyAh4iHUWWUn5ODnXmEh4L/2wBDARYYGB8cHz4iIj6CVklWgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoL/wAARCAAOACADASIAAhEBAxEB/8QAFgABAQEAAAAAAAAAAAAAAAAABAUD/8QAIBAAAgIDAAEFAAAAAAAAAAAAAQIAAwQREiEFFDFBUf/EABUBAQEAAAAAAAAAAAAAAAAAAAEC/8QAFhEBAQEAAAAAAAAAAAAAAAAAABEB/9oADAMBAAIRAxEAPwAaWBvAXUVhVF+gRr8MhPcysCCYz0/Ot75BkQqmW3tylYG+vkwtxEoKRl1g60y/ZmD1qxII8iG0v//Z') center/cover no-repeat;
  overflow:hidden;
}
.hero__media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* No-video fallback (Low Data Mode, 2G, reduced motion): a clean cream band
   instead of a frozen poster frame. The hero type is cream by default, so
   every colour has to flip or the headline disappears. */
.hero.hero--flat{background:var(--cream)}
.hero.hero--flat .hero__media,
.hero.hero--flat .hero__tint{display:none}
.hero.hero--flat h1,
.hero.hero--flat p,
.hero.hero--flat .eyebrow,
.hero.hero--flat .hero__note{text-shadow:none}
.hero.hero--flat h1{color:var(--green)}
.hero.hero--flat h1 em{color:var(--gold-dark)}
.hero.hero--flat p{color:var(--char-soft)}
.hero.hero--flat .eyebrow{color:var(--gold-dark)}
.hero.hero--flat .hero__note{color:var(--char-soft)}
.hero.hero--flat .btn{color:var(--gold-dark);border-color:var(--gold)}
.hero.hero--flat .btn:hover{background:var(--gold);color:var(--green-ink)}
.hero.hero--flat .btn--solid{background:var(--gold);color:var(--green-ink)}
.hero.hero--flat .btn--solid:hover{background:var(--gold-light)}
.hero__tint{
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse 75% 110% at 0% 55%,rgba(0,0,0,.62) 0%,rgba(0,0,0,.42) 40%,rgba(0,0,0,0) 75%),
    linear-gradient(to right,rgba(0,0,0,.40) 0%,rgba(0,0,0,.26) 34%,rgba(0,0,0,.06) 58%,rgba(0,0,0,0) 70%),
    linear-gradient(to bottom,rgba(0,0,0,.26) 0%,rgba(0,0,0,0) 22%,rgba(0,0,0,0) 78%,rgba(0,0,0,.30) 100%);
}
.hero__inner{
  position:relative;width:100%;
  max-width:var(--maxw);margin-inline:auto;
  /* Top and bottom are deliberately uneven: the fixed nav eats the first ~76px,
     so matching padding would sit the block visibly high in the frame. */
  padding:clamp(118px,12.5vw,132px) var(--gutter) clamp(34px,4vw,44px);
}
.hero .eyebrow{color:var(--gold-light);font-size:clamp(10px,.2vw + 9px,10.5px);letter-spacing:4px}
.hero h1{
  font-family:var(--lb);font-weight:500;
  font-size:var(--fs-h1);line-height:1.22;
  color:var(--cream);max-width:22ch;
  margin-block:18px;
  text-shadow:0 2px 20px rgba(4,12,9,.5);
}
.hero h1 em{font-style:normal;color:var(--gold-light)}
.hero h1,.hero p,.hero .eyebrow,.hero .hero__note{text-shadow:0 2px 18px rgba(0,0,0,.6),0 1px 3px rgba(0,0,0,.45)}
.hero p{font-size:var(--fs-lead);font-weight:600;color:var(--cream);max-width:56ch;margin-bottom:28px}
.hero__cta{display:flex;flex-wrap:wrap;gap:18px;align-items:center}
.hero .hero__note{
  font-family:var(--in);font-weight:600;font-size:10.5px;letter-spacing:1.5px;text-transform:uppercase;
  color:rgba(247,243,235,.78);margin-top:28px;max-width:none;
}

/* ============================================================
   8. STATS
   ============================================================ */
.stats{background:var(--green);padding:clamp(40px,5vw,52px) 0 clamp(26px,3.5vw,34px)}
/* The plain-English line about what the firm does. It used to sit on the hero
   video, where it competed with the headline for a hard-to-read surface. */
.stats__intro{
  font-size:var(--fs-lead);line-height:1.6;
  color:rgba(247,243,235,.86);
  text-align:center;max-width:70ch;
  margin:0 auto clamp(34px,4.2vw,48px);
}
.stats__intro em{font-style:normal;color:var(--gold-light)}
.stats__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(28px,3.4vw,40px);text-align:center}
.stat__num{
  font-family:var(--lb);font-weight:500;
  font-size:clamp(32px,4.2vw,58px);
  color:var(--gold-light);
  font-variant-numeric:tabular-nums;
  line-height:1.1;
}
.stat__lbl{
  font-family:var(--in);font-weight:500;
  font-size:clamp(11px,.3vw + 10px,12px);
  letter-spacing:1.8px;text-transform:uppercase;
  color:rgba(247,243,235,.7);margin-top:12px;
}
.slogan{background:var(--green);text-align:center;padding:0 0 clamp(40px,5vw,56px)}
.slogan__rule{width:56px;height:1px;background:var(--gold);margin:0 auto clamp(28px,4vw,36px)}
.slogan p{
  font-family:var(--lb);font-weight:500;
  font-size:clamp(30px,4.6vw,58px);line-height:1.25;
  color:var(--cream);
}
.slogan p + p{margin-top:14px}
.slogan em{font-style:normal;color:var(--gold-light)}

/* ============================================================
   9. TRACK RECORD
   ============================================================ */
.track{background:var(--cream)}
.track__note{font-family:var(--in);font-size:14px;color:var(--gold-dark);margin-top:18px}
.track__grid{display:grid;grid-template-columns:1fr 1fr;gap:14px clamp(32px,5vw,56px)}
.trow{
  display:grid;grid-template-columns:1fr 120px 64px;
  grid-template-areas:"name bar pct";
  align-items:center;gap:16px;
  padding-block:13px;
  border-bottom:1px solid rgba(184,154,93,.3);
}
.trow__name{grid-area:name;font-family:var(--lb);font-size:clamp(15px,.6vw + 13px,17px);color:var(--green)}
.trow__bar{grid-area:bar;height:4px;background:var(--rule-soft);overflow:hidden;display:block}
.trow__bar i{display:block;height:100%;width:0;background:var(--gold);transition:width 1.4s cubic-bezier(.22,.8,.3,1)}
.trow.is-in .trow__bar i{width:var(--w)}
.trow__pct{
  grid-area:pct;font-family:var(--lb);font-weight:500;
  font-size:clamp(16px,.7vw + 14px,19px);
  color:var(--gold-dark);text-align:right;font-variant-numeric:tabular-nums;
}

/* ============================================================
   10. PRESS
   ============================================================ */
.press{padding-block:clamp(40px,5vw,52px);background:var(--cream-soft);border-bottom:1px solid rgba(184,154,93,.3)}
.press__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--grid-gap);text-align:center}
.press__item{
  padding:clamp(26px,3vw,34px) 24px;
  border:1px solid rgba(184,154,93,.4);
  background:var(--cream);
  transition:transform .3s,box-shadow .3s,border-color .3s;
}
.press__item:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(15,45,35,.1);border-color:var(--gold)}
.press__name{font-family:var(--lb);font-size:var(--fs-h3);color:var(--green);line-height:1.3}
.press__loc{
  font-family:var(--in);font-weight:600;font-size:11.5px;
  letter-spacing:2.5px;text-transform:uppercase;color:var(--gold-dark);margin-top:10px;
}

/* ============================================================
   11. MARQUEE
   ============================================================ */
.partners{background:var(--cream);padding-block:clamp(36px,4.5vw,52px);border-block:1px solid var(--rule)}
.partners__row{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  gap:clamp(34px,6vw,76px);max-width:1000px;margin-inline:auto;
}
.partners__row img{
  height:clamp(26px,3.2vw,38px);width:auto;
  filter:grayscale(1) opacity(.72);transition:filter .3s;
}
.partners__row img:hover{filter:none}
.partners__row img.is-tall{height:clamp(34px,4.2vw,50px)}
.marquee-band{
  background:var(--cream);
  padding-block:clamp(36px,4.5vw,52px);
  border-block:1px solid var(--rule);
}
.marquee-band__label{
  text-align:center;font-family:var(--in);font-weight:600;
  font-size:12px;letter-spacing:3.5px;text-transform:uppercase;
  color:var(--gold-dark);margin-bottom:clamp(24px,3vw,34px);
}
.marquee{overflow:hidden;position:relative}
.marquee__track{
  display:flex;align-items:center;
  gap:clamp(46px,8vw,90px);
  width:max-content;
  animation:marquee 32s linear infinite;
}
.marquee:hover .marquee__track{animation-play-state:paused}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.marquee__track img{
  height:clamp(38px,5.5vw,54px);width:auto;
  filter:grayscale(1) opacity(.7);transition:filter .3s;
}
.marquee__track img:hover{filter:none}
.marquee-band--schools .marquee__track img{height:clamp(42px,6.2vw,62px)}

/* ============================================================
   12. OFFERINGS
   ============================================================ */
.offerings{background:var(--cream)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--grid-gap)}
.card{
  background:var(--cream-soft);
  border:1px solid rgba(184,154,93,.4);
  padding:var(--card-pad);
  transition:transform .3s,box-shadow .3s;
}
.card:hover{transform:translateY(-6px);box-shadow:0 18px 44px rgba(15,45,35,.12)}
.card__num{font-family:var(--lb);font-style:normal;color:var(--gold);font-size:19px}
.card h3{font-family:var(--lb);font-weight:500;font-size:var(--fs-h3);color:var(--green);line-height:1.3;margin-block:14px}
.card p{font-size:clamp(16.5px,.5vw + 15px,18px);color:var(--char-soft)}

/* ============================================================
   12b. PRICING
   ============================================================ */
.pricing{background:var(--green)}
.tiers{display:grid;grid-template-columns:1fr 1fr;gap:var(--grid-gap)}
/* the same two cards on a cream surface */
.tiers--light .tier{background:var(--cream-soft);border-color:rgba(184,154,93,.4)}
.tiers--light .tier__name{color:var(--green)}
.tiers--light .tier__name em{color:var(--gold-dark)}
.tiers--light .tier p{color:var(--char-soft)}
.tiers--light .tier__tag{color:rgba(42,42,42,.5);border-top:1px solid rgba(184,154,93,.3);margin-top:auto}
.tier{
  background:rgba(247,243,235,.045);
  border:1px solid rgba(184,154,93,.42);
  padding:var(--card-pad);
  display:flex;flex-direction:column;
}
.tier__name{
  font-family:var(--lb);font-weight:500;
  font-size:var(--fs-h3);color:var(--cream);line-height:1.3;margin-bottom:14px;
}
.tier__name em{font-style:normal;color:var(--gold-light)}
.tier p{font-size:clamp(16.5px,.5vw + 15px,18px);color:rgba(247,243,235,.82)}
.tier__tag{
  font-family:var(--in);font-weight:600;
  font-size:clamp(9.4px,.2vw + 8.5px,10.1px);letter-spacing:1.5px;text-transform:uppercase;
  color:rgba(236,238,234,.52);
  margin-top:auto;padding-top:20px;
}
.pricing__foot{text-align:center;margin-top:clamp(30px,3.6vw,42px)}
.pricing__foot p{
  font-size:var(--fs-lead);color:rgba(247,243,235,.8);
  max-width:58ch;margin:0 auto 26px;
}

/* ============================================================
   13. COMPARISON
   ============================================================ */
.compare{background:var(--green-deep)}
.cmp{display:grid;grid-template-columns:1fr 1fr;gap:var(--grid-gap)}
.cmp__col{padding:clamp(30px,3.8vw,44px) clamp(26px,3.4vw,40px);border:1px solid var(--rule)}
.cmp__col h3{font-family:var(--lb);font-weight:500;font-size:clamp(20px,1.4vw + 16px,23px);margin-bottom:26px}
.cmp__col li{position:relative;padding-left:34px;margin-bottom:16px;font-size:clamp(17px,.5vw + 15px,18.5px);line-height:1.5}
.cmp__col li::before{position:absolute;left:0;top:1px;font-family:var(--in);font-size:15px}

.cmp__col--avg{background:rgba(247,243,235,.03)}
.cmp__col--avg h3{color:var(--on-dark-dim)}
.cmp__col--avg li{color:rgba(247,243,235,.62)}
.cmp__col--avg li::before{content:"\2715";color:rgba(247,243,235,.35)}

.cmp__col--ib{background:rgba(184,154,93,.1);border-color:var(--gold)}
.cmp__col--ib h3{color:var(--gold-light)}
.cmp__col--ib li{color:rgba(247,243,235,.92)}
.cmp__col--ib li::before{content:"\2713";color:var(--gold-light);font-weight:700}

/* ============================================================
   14. ROUNDTABLE
   ============================================================ */
.roundtable{background:var(--green);position:relative;overflow:hidden}
.roundtable::after{
  content:"";position:absolute;top:-140px;right:-140px;
  width:440px;height:440px;border-radius:50%;
  background:radial-gradient(circle,rgba(203,174,114,.14),transparent 65%);
  pointer-events:none;
}
.rt{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(40px,5.5vw,64px);align-items:center;position:relative}
.rt p{font-size:var(--fs-lead);max-width:52ch;margin:24px 0 38px}
.rt__visual{text-align:center}
.rt__visual img{max-width:420px;width:100%;margin-inline:auto;filter:drop-shadow(0 18px 40px rgba(4,12,9,.35))}
.big-claim{
  font-family:var(--lb);font-weight:500;
  font-size:clamp(40px,4.6vw,64px);line-height:1;
  color:var(--gold-light);text-align:center;margin-top:34px;
}
.big-claim span{
  display:block;font-family:var(--in);font-weight:600;
  font-size:13px;letter-spacing:3px;text-transform:uppercase;
  color:var(--on-dark-dim);margin-top:18px;
}

/* ============================================================
   15. TEAM
   ============================================================ */
.team__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--grid-gap)}
.member{text-align:center}
.member__ph{aspect-ratio:1;overflow:hidden;border:1px solid rgba(184,154,93,.45);background:#EFE9DD}
.member__ph img{width:100%;height:100%;object-fit:cover;filter:saturate(.9);transition:transform .5s}
.member:hover .member__ph img{transform:scale(1.05)}
.member h3{font-family:var(--lb);font-weight:500;font-size:clamp(17px,.8vw + 14px,19px);color:var(--green);margin-top:20px}
.member__role{
  font-family:var(--in);font-weight:600;font-size:11.5px;
  letter-spacing:1.8px;text-transform:uppercase;color:var(--gold-dark);margin-top:7px;
}
.profs{padding-block:calc(var(--section-y) * .55)}
.profs .sec-head{margin-bottom:28px}
.profs .sec-head h2{max-width:none}
.profs .team__grid{grid-template-columns:repeat(4,auto);justify-content:center;gap:18px 44px}
.profs .member__ph{width:112px;border:none;background:none;border-radius:50%;margin:0 auto}
.profs .member h3{margin-top:12px}
.profs .member__role{max-width:150px;margin-inline:auto}
@media (max-width:760px){.profs .team__grid{grid-template-columns:repeat(2,auto);justify-content:center}}
.approach{display:grid;grid-template-columns:3fr 2fr;background:#D5C3A7;align-items:stretch}
.approach__art{background:#112F22;display:flex;align-items:flex-end}
.approach__art img{display:block;width:100%;height:auto;aspect-ratio:2/1}
.approach__copy{padding:clamp(28px,3vw,44px) clamp(24px,3.6vw,56px);align-self:center;max-width:600px}
.approach__copy p{font-size:clamp(16px,.4vw + 14px,17.5px);line-height:1.6;color:var(--char);margin:0 0 14px}
.approach__copy p.approach__lead{font-family:var(--lb);font-weight:500;font-size:clamp(20px,.8vw + 15px,24px);line-height:1.34;color:var(--green);margin-bottom:16px}
.approach__ao{display:flex;align-items:center;gap:16px;margin-bottom:20px}
.approach__name{display:block;font-family:var(--lb);font-weight:500;font-size:19px;color:var(--green)}
.approach__ao img{width:64px;height:64px;border-radius:50%;object-fit:cover;flex:none;border:1px solid rgba(15,45,35,.25)}
.approach__ao p{margin:0;font-size:15.5px;line-height:1.5;color:var(--char-soft)}
.approach__ao strong{display:block;font-family:var(--in);font-weight:600;font-size:12.5px;letter-spacing:2px;text-transform:uppercase;color:#6B5427}
@media (max-width:1400px) and (min-width:1241px){.approach{grid-template-columns:5fr 3fr}.approach__copy{padding:22px 32px}.approach__ao{margin-bottom:14px}}
@media (max-width:1240px){.approach{grid-template-columns:1fr}.approach__copy{max-width:720px;margin-inline:auto}}
#team .member__ph{width:56%;margin-inline:auto}
.team__more{text-align:center;margin-top:clamp(34px,4.5vw,48px)}
.team__more-num{
  font-family:var(--lb);font-weight:500;
  font-size:clamp(34px,3.6vw,48px);color:var(--gold-dark);
  font-variant-numeric:tabular-nums;line-height:1.1;
}
.team__more-lbl{
  font-family:var(--in);font-weight:600;font-size:12px;
  letter-spacing:2.5px;text-transform:uppercase;color:var(--gold-dark);margin-top:8px;
}

/* ============================================================
   16. STUDENT NEWS (YouTube facade)
   ============================================================ */
.student-news{background:var(--cream)}
.yt{
  position:relative;max-width:900px;margin-inline:auto;
  aspect-ratio:16/9;cursor:pointer;
  border:1px solid rgba(184,154,93,.5);
  box-shadow:0 24px 60px rgba(15,45,35,.16);
  overflow:hidden;
}
.yt img,.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.yt img{object-fit:cover}
.yt__play{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  display:flex;align-items:center;justify-content:center;
  width:clamp(64px,9vw,84px);aspect-ratio:1;border-radius:50%;
  background:rgba(15,45,35,.88);border:1px solid var(--gold);
  color:var(--gold-light);font-size:clamp(20px,2.4vw,26px);padding-left:6px;
  transition:background .25s,color .25s,transform .25s;
}
.yt:hover .yt__play{background:var(--gold);color:var(--green-ink);transform:translate(-50%,-50%) scale(1.06)}
.yt__cap{text-align:center;font-style:normal;color:#5A5A52;font-size:clamp(16px,.6vw + 14px,18px);max-width:60ch;margin:26px auto 0}

/* ============================================================
   17. TESTIMONIALS
   ============================================================ */
.testimonials{background:var(--green-deep)}
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--grid-gap)}
.qcard{
  display:flex;flex-direction:column;
  background:rgba(247,243,235,.04);
  border:1px solid var(--rule);
  padding:var(--card-pad);
}
.qcard__mark{font-family:var(--lb);font-size:52px;line-height:.6;color:var(--gold);margin-bottom:24px}
.qcard p{flex:1;font-size:clamp(17px,.5vw + 15px,19px);font-style:normal;line-height:1.62;color:rgba(247,243,235,.88)}
.qcard__who{
  display:flex;align-items:center;gap:14px;margin-top:28px;
  font-family:var(--in);font-weight:600;font-size:12px;
  letter-spacing:1.8px;text-transform:uppercase;color:var(--gold-light);
}
.qcard__who img{
  width:52px;height:52px;flex:none;border-radius:50%;object-fit:cover;
  border:1px solid rgba(184,154,93,.55);
}

/* ============================================================
   18. PARENT VIDEOS
   ============================================================ */
.parent-videos{background:var(--cream)}
.pv{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(20px,3vw,30px);max-width:1000px;margin-inline:auto}
.pv__card--solo{grid-column:1/-1;width:min(100%,calc(50% - clamp(10px,1.5vw,15px)));margin-inline:auto}
.pv__embed{position:relative;width:100%;aspect-ratio:16/9;border:1px solid rgba(184,154,93,.5);background:var(--green-ink)}
.pv__embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
@media (max-width:768px){.pv__card--solo{width:100%}}
.pv__card video{
  width:100%;aspect-ratio:16/9;object-fit:cover;display:block;
  background:var(--green-ink);border:1px solid rgba(184,154,93,.5);
}
.pv__card figcaption{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;padding:14px 2px 0}
.pv__name{font-family:var(--lb);font-size:19px;color:var(--green)}
.pv__school{font-family:var(--in);font-weight:600;font-size:11.5px;letter-spacing:2px;text-transform:uppercase;color:var(--gold-dark)}

/* ============================================================
   19. ELITE NETWORK
   ============================================================ */
.elite{background:var(--green)}
.elite__grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(36px,5.5vw,64px);align-items:center}
.elite__photo{text-align:center}
.elite__photo img{
  width:min(320px,80%);aspect-ratio:1;object-fit:cover;
  border-radius:50%;border:1px solid var(--gold);margin-inline:auto;
}
.elite__tag{
  font-family:var(--in);font-weight:600;font-size:12px;
  letter-spacing:2.5px;text-transform:uppercase;color:var(--gold-light);margin-top:20px;
}
.elite__quote{
  font-size:clamp(19px,1vw + 16px,22px);font-style:normal;
  line-height:1.6;color:rgba(247,243,235,.9);max-width:56ch;
}
.elite__who{
  font-family:var(--in);font-weight:600;font-size:13px;
  letter-spacing:2px;text-transform:uppercase;color:var(--gold-light);margin-top:24px;
}

/* ============================================================
   20. CTA
   ============================================================ */
.cta{background:var(--green);text-align:center}
.cta h2{margin-bottom:22px}
.cta p{font-size:var(--fs-lead);color:rgba(247,243,235,.8);max-width:56ch;margin:0 auto 42px}

/* ============================================================
   21. FOOTER
   ============================================================ */
.footer{
  background:var(--green-ink);color:rgba(247,243,235,.75);
  font-family:var(--in);font-size:14px;
  padding:clamp(44px,5.5vw,56px) 0 max(46px,env(safe-area-inset-bottom));
}
.footer__grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:clamp(30px,4vw,44px);margin-bottom:clamp(38px,5vw,52px)}
.footer__grid h4{
  font-family:var(--lb);font-weight:500;font-size:14px;
  letter-spacing:3px;text-transform:uppercase;color:var(--gold-light);margin-bottom:20px;
}
.footer__grid a{display:block;margin-bottom:10px;opacity:.8;transition:opacity .2s,color .2s}
.footer__grid a:hover{opacity:1;color:var(--gold-light)}
.footer__blurb{opacity:.75;max-width:38ch;line-height:1.7}
.footer__addr{opacity:.75;margin-top:8px;font-style:normal;line-height:1.6}
.footer__bottom{
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px;
  border-top:1px solid rgba(184,154,93,.25);padding-top:28px;
  font-size:12.5px;opacity:.6;
}

/* ============================================================
   22. SOUND TOGGLE
   ============================================================ */
.sound{
  position:fixed;z-index:60;
  right:max(16px,env(safe-area-inset-right));
  bottom:max(16px,env(safe-area-inset-bottom));
  display:flex;align-items:center;gap:9px;
  background:rgba(15,45,35,.92);border:1px solid var(--gold);
  color:var(--gold-light);
  font-family:var(--in);font-weight:600;font-size:11.5px;
  letter-spacing:2px;text-transform:uppercase;
  padding:12px 18px;cursor:pointer;
  transition:background .25s,color .25s;
}
.sound:hover,.sound.is-on{background:var(--gold);color:var(--green-ink)}
.sound__icon{font-size:15px}

/* ============================================================
   23. MOTION
   ============================================================ */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s ease}
.reveal.is-in{opacity:1;transform:none}
.hero .d1{transition-delay:.05s}
.hero .d2{transition-delay:.18s}
.hero .d3{transition-delay:.32s}
.hero .d4{transition-delay:.46s}

.stagger{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease}
.stagger.is-in{opacity:1;transform:none}

/* ============================================================
   24. BREAKPOINTS
   ============================================================ */
@media (max-width:1024px){
  .stats__grid{grid-template-columns:repeat(2,1fr)}
  .cards{grid-template-columns:repeat(2,1fr)}
  .team__grid{grid-template-columns:repeat(2,1fr)}
  .quotes{grid-template-columns:1fr}
  .press__grid{grid-template-columns:1fr}
  .track__grid{grid-template-columns:1fr}
  .cmp{grid-template-columns:1fr}
  .rt{grid-template-columns:1fr;gap:44px}
  .elite__grid{grid-template-columns:1fr}
  .footer__grid{grid-template-columns:1fr 1fr}
}

/* Nav collapses to a panel as soon as the links stop fitting on one line.
   This is wider than the general mobile breakpoint on purpose: with seven
   items the row runs out of room around 1220px, well before phone widths. */
@media (max-width:1220px){
  :root{--nav-offset:76px}
  .nav-toggle{display:flex;align-items:center;justify-content:center}
  .nav-links{
    display:none;position:absolute;top:100%;left:0;right:0;
    flex-direction:column;align-items:stretch;gap:0;
    background:rgba(15,45,35,.98);
    border-top:1px solid var(--rule);
    padding:12px var(--gutter) 24px;
  }
  .nav.is-open .nav-links{display:flex}
  .nav-links a:not(.btn){padding:15px 0;border-bottom:1px solid rgba(184,154,93,.18)}
  .nav-links .btn{margin-top:18px;text-align:center;padding:15px 22px}

  /* Dropdown becomes an inline accordion once the bar has collapsed. */
  .nav-item{flex-wrap:wrap;width:100%;justify-content:space-between}
  .nav-item > .nav-top{flex:1 1 auto;padding:15px 0}
  .nav-item.has-sub::after{display:none}
  .nav-sub-toggle{padding:15px 4px 15px 16px;opacity:.9}
  .nav-sub-toggle svg{width:12px;height:8px}
  .nav-item > .nav-top,.nav-sub-toggle{border-bottom:1px solid rgba(184,154,93,.18)}
  .nav-sub{
    position:static;width:100%;min-width:0;
    background:transparent;border:0;box-shadow:none;
    padding:0 0 6px 16px;margin:0;
    opacity:1;visibility:visible;transform:none;transition:none;
    display:none;
  }
  .nav-item.is-open .nav-sub{display:flex}
  .nav-item.is-open .nav-sub-toggle svg{transform:rotate(180deg)}
  .nav-item:hover .nav-sub,.nav-item:focus-within .nav-sub{display:none}
  .nav-item.is-open:hover .nav-sub,.nav-item.is-open:focus-within .nav-sub{display:flex}
  .nav-sub a:not(.btn){padding:13px 0 13px 4px;font-size:12px;opacity:.78;border-bottom:0}
}

@media (max-width:768px){
  :root{--nav-offset:76px}

  /* nav collapses to a panel */
  .nav-toggle{display:flex;align-items:center;justify-content:center}
  .nav-links{
    display:none;position:absolute;top:100%;left:0;right:0;
    flex-direction:column;align-items:stretch;gap:0;
    background:rgba(15,45,35,.98);
    border-top:1px solid var(--rule);
    padding:12px var(--gutter) 24px;
  }
  .nav.is-open .nav-links{display:flex}
  .nav-links a:not(.btn){padding:15px 0;border-bottom:1px solid rgba(184,154,93,.18)}
  .nav-links .btn{margin-top:18px;text-align:center;padding:15px 22px}

  /* Dropdown becomes an inline accordion once the bar has collapsed. */
  .nav-item{flex-wrap:wrap;width:100%;justify-content:space-between}
  .nav-item > .nav-top{flex:1 1 auto;padding:15px 0}
  .nav-item.has-sub::after{display:none}
  .nav-sub-toggle{padding:15px 4px 15px 16px;opacity:.9}
  .nav-sub-toggle svg{width:12px;height:8px}
  .nav-item > .nav-top,.nav-sub-toggle{border-bottom:1px solid rgba(184,154,93,.18)}
  .nav-sub{
    position:static;width:100%;min-width:0;
    background:transparent;border:0;box-shadow:none;
    padding:0 0 6px 16px;margin:0;
    opacity:1;visibility:visible;transform:none;transition:none;
    display:none;
  }
  .nav-item.is-open .nav-sub{display:flex}
  .nav-item.is-open .nav-sub-toggle svg{transform:rotate(180deg)}
  .nav-item:hover .nav-sub,.nav-item:focus-within .nav-sub{display:none}
  .nav-item.is-open:hover .nav-sub,.nav-item.is-open:focus-within .nav-sub{display:flex}
  .nav-sub a:not(.btn){padding:13px 0 13px 4px;font-size:12px;opacity:.78;border-bottom:0}

  .hero{min-height:auto}
  .hero__cta{gap:12px}
  .hero__cta .btn{flex:1 1 100%;text-align:center}

  .pv{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr}
  .tiers{grid-template-columns:1fr}
}

@media (max-width:768px){
  .hero{background:#0A0A0A url('data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD//gAQTGF2YzYwLjMxLjEwMgD/2wBDABUOEBIQDRUSERIYFhUZHzQiHx0dH0AuMCY0TENQT0tDSUhUXnlmVFlyWkhJaY9qcnyAh4iHUWWUn5ODnXmEh4L/2wBDARYYGB8cHz4iIj6CVklWgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoL/wAARCAAnABgDASIAAhEBAxEB/8QAGAABAQEBAQAAAAAAAAAAAAAAAAUEAwb/xAAjEAACAgIBBAIDAAAAAAAAAAABAgADBBExBRITISJBFDKB/8QAFwEAAwEAAAAAAAAAAAAAAAAAAAECA//EABYRAQEBAAAAAAAAAAAAAAAAAAABEf/aAAwDAQACEQMRAD8AeJFxPN+xPMIK7ba1UaB5nfpykYnaw4P3NdSAOPgokapksrqrLIWHcOIk7q1nZ1LZOgIhS2KOJagqJLegZpxsmrIY+Pe1nmcJr7XI2e37lOrPrwyFK+zzDBrpm0I1xaxNhompL6ctNDRMQ00hR+Onwk260lyzezER1FdMPKeq4Mp/kREztLa//9k=') center/cover no-repeat}

  /* the left vignette is built for wide screens: on phones darken the whole frame,
     with extra weight at the top so the eyebrow and first headline line hold */
  .hero__tint{
    background:linear-gradient(to bottom,
      rgba(0,0,0,.90) 0%,
      rgba(0,0,0,.80) 12%,
      rgba(0,0,0,.58) 28%,
      rgba(0,0,0,.42) 46%,
      rgba(0,0,0,.60) 76%,
      rgba(0,0,0,.86) 100%);
  }

  .hero__inner{padding-top:clamp(84px,22vw,104px);padding-bottom:clamp(30px,7vw,40px)}
  .hero h1{margin-block:14px}
  .hero p{margin-bottom:22px}
  .hero__note{margin-top:20px;line-height:1.7}

  /* comfortable tap targets */
  .nav-brand{display:inline-block;padding:11px 0}
  .footer__grid a{padding:11px 0;margin-bottom:0}
  .quote,.card{padding:22px 20px}

  /* media never taller than the screen */
  .pv video,.rt__media img,.press__media img{max-height:70vh}
}

@media (max-width:560px){
  .stats__grid{grid-template-columns:1fr;gap:34px}

  /* track rows go two-line so the bar keeps its full span */
  .trow{
    grid-template-columns:1fr auto;
    grid-template-areas:"name pct" "bar bar";
    gap:6px 14px;
  }
  .trow__bar{width:100%}

  .team__grid{gap:20px}
  .footer__grid{grid-template-columns:1fr}
  .footer__bottom{flex-direction:column;gap:10px}
  .sound{padding:11px 14px}
  .sound__label{display:none}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .marquee__track{animation:none}
  .reveal,.stagger{opacity:1;transform:none;transition:none}
  .trow__bar i{transition:none}
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}