:root{
  --navy:#16294A;
  --navy-deep:#0D1B33;
  --gold:#A9823C;
  --gold-light:#C9A25C;
  --parchment:#F8F3E7;
  --terra:#4A6B4F;
  --ignis:#A63A3A;
  --solis:#C9A227;
  --hydra:#3A6B8C;
  --serif:'Cormorant Garamond',serif;
  --sans:'Mukta',sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
::selection{background:var(--gold);color:var(--navy)}
body{
  font-family:var(--sans);background:var(--parchment);color:var(--navy);
  overflow-x:hidden;cursor:none;
}
@media (hover:none){body{cursor:auto}}

/* ===== overlays ===== */
.grain{
  position:fixed;inset:0;z-index:9998;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.cursor-dot,.cursor-ring{position:fixed;top:0;left:0;pointer-events:none;z-index:9999;border-radius:50%;transform:translate(-50%,-50%)}
.cursor-dot{width:6px;height:6px;background:var(--gold)}
.cursor-ring{width:34px;height:34px;border:1px solid rgba(169,130,60,.55);transition:width .25s,height .25s,border-color .25s}
.cursor-ring.hovering{width:64px;height:64px;border-color:var(--gold)}
@media (hover:none){.cursor-dot,.cursor-ring{display:none}}
.progress{position:fixed;top:0;left:0;height:2px;background:var(--gold);width:0%;z-index:2000}

/* ===== nav ===== */
nav{
  position:fixed;top:0;left:0;width:100%;z-index:1000;
  display:flex;justify-content:space-between;align-items:center;
  padding:1.6rem 3rem;
  transition:background .45s,padding .45s,box-shadow .45s,transform .35s cubic-bezier(.4,0,.2,1);
}
nav.scrolled{
  background:rgba(248,243,231,.94);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  padding:.85rem 3rem;box-shadow:0 1px 0 rgba(22,41,74,.09);
}
nav.nav-hidden{transform:translateY(-100%)}
.logo{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--navy)}
.logo-mark{
  width:38px;height:38px;background:var(--navy);border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:var(--gold);font-family:var(--serif);font-size:1.3rem;transition:transform .5s cubic-bezier(.19,1,.22,1);
}
.logo:hover .logo-mark{transform:rotate(180deg)}
.logo span{font-weight:700;font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;transition:letter-spacing .45s}
.logo:hover span{letter-spacing:.38em}
.nav-links{display:flex;gap:2.2rem}
.nav-links a{
  position:relative;color:var(--navy);text-decoration:none;
  font-size:.66rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;
}
.nav-links a::after{
  content:'';position:absolute;left:0;bottom:-4px;width:100%;height:1px;
  background:var(--gold);transform:scaleX(0);transform-origin:right;
  transition:transform .4s cubic-bezier(.77,0,.18,1);
}
.nav-links a:hover::after,.nav-links a.active::after{transform:scaleX(1);transform-origin:left}
.nav-links a.active{color:var(--gold)}
.nav-right{display:flex;align-items:center;gap:1.2rem}
.nav-cta{
  border:1.5px solid var(--navy);padding:.55rem 1.4rem;border-radius:999px;
  font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;font-weight:700;
  color:var(--navy);text-decoration:none;transition:all .35s cubic-bezier(.19,1,.22,1);
}
.nav-cta:hover{background:var(--gold);border-color:var(--gold);color:var(--navy);transform:translateY(-2px)}

/* hamburger */
.hamburger{
  display:none;flex-direction:column;justify-content:center;gap:5px;
  width:36px;height:36px;background:none;border:none;cursor:pointer;padding:4px;
}
.hamburger span{
  display:block;width:100%;height:1.5px;background:var(--navy);
  transition:transform .38s cubic-bezier(.19,1,.22,1),opacity .25s;transform-origin:center;
}
.hamburger.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.hamburger.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.hamburger.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

/* mobile menu */
.mobile-menu{
  position:fixed;inset:0;z-index:1002;background:var(--navy-deep);
  display:flex;flex-direction:column;
  transform:translateX(-100%);transition:transform .45s cubic-bezier(.77,0,.18,1);
  pointer-events:none;
}
.mobile-menu.open{transform:translateX(0);pointer-events:auto}
.mobile-menu-inner{display:flex;flex-direction:column;height:100%;padding:0 2rem 3rem}
.mobile-menu-top{
  display:flex;justify-content:space-between;align-items:center;
  padding:1.4rem 0;border-bottom:1px solid rgba(248,243,231,.1);margin-bottom:2rem;
}
.mobile-menu-top .logo{color:var(--parchment)}
.mobile-menu-top .logo-mark{background:rgba(248,243,231,.1)}
.mobile-close{
  background:none;border:1.5px solid rgba(248,243,231,.3);color:var(--parchment);
  width:38px;height:38px;border-radius:50%;cursor:pointer;font-size:1.4rem;line-height:1;
  display:flex;align-items:center;justify-content:center;transition:border-color .3s,transform .3s;
}
.mobile-close:hover{border-color:var(--gold);transform:rotate(90deg)}
.mobile-links{display:flex;flex-direction:column;gap:0;flex:1}
.mobile-links a{
  font-family:var(--serif);font-size:clamp(1.8rem,5vw,2.6rem);font-weight:500;
  color:rgba(248,243,231,.7);text-decoration:none;
  padding:.9rem 0;border-bottom:1px solid rgba(248,243,231,.08);
  transition:color .3s,padding-left .35s cubic-bezier(.19,1,.22,1);display:block;
}
.mobile-links a:hover{color:var(--parchment);padding-left:.8rem}
.mobile-links a.active{color:var(--gold)}
.mobile-cta{
  display:block;margin-top:2.5rem;padding:1rem 2rem;background:var(--gold);color:var(--navy);
  text-align:center;font-weight:700;font-size:.85rem;letter-spacing:.18em;text-transform:uppercase;
  border-radius:999px;text-decoration:none;transition:transform .3s,box-shadow .3s;
}
.mobile-cta:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(169,130,60,.35)}
.mobile-overlay{
  position:fixed;inset:0;z-index:1001;background:rgba(0,0,0,.5);backdrop-filter:blur(2px);
  opacity:0;pointer-events:none;transition:opacity .4s;
}
.mobile-overlay.open{opacity:1;pointer-events:auto}

@media(max-width:1080px){
  .nav-links{display:none}
  .hamburger{display:flex}
  nav{padding:1.1rem 1.4rem}
  nav.scrolled{padding:.8rem 1.4rem}
}
@media(min-width:1081px){
  .hamburger{display:none}
  .mobile-menu,.mobile-overlay{display:none}
}

/* ===== shared atoms ===== */
.section-label{
  display:inline-flex;align-items:center;gap:.8rem;
  font-size:.64rem;letter-spacing:.34em;text-transform:uppercase;font-weight:600;color:var(--gold);
}
.section-label::before{content:'';width:36px;height:1px;background:var(--gold)}
.reveal{opacity:0;transform:translateY(46px);transition:opacity 1s cubic-bezier(.19,1,.22,1),transform 1s cubic-bezier(.19,1,.22,1)}
.reveal.in{opacity:1;transform:none}
.btn{
  position:relative;display:inline-flex;align-items:center;gap:.7rem;
  padding:1rem 2.2rem;border-radius:999px;text-decoration:none;
  font-size:.68rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;
  transition:.4s;overflow:hidden;border:0;cursor:pointer;font-family:var(--sans);
}
.btn-solid{background:var(--navy);color:var(--parchment)}
.btn-solid::before{
  content:'';position:absolute;inset:0;background:var(--gold);
  transform:translateY(101%);transition:transform .45s cubic-bezier(.77,0,.18,1);
}
.btn-solid:hover::before{transform:translateY(0)}
.btn-solid span{position:relative;z-index:1}
.btn-solid:hover{color:var(--navy)}
.btn-ghost{border:1px solid rgba(22,41,74,.35);color:var(--navy);background:transparent}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold)}
.btn-gold{background:var(--gold);color:var(--navy)}
.btn-gold::before{background:var(--parchment)}

/* ===== page hero ===== */
.page-hero{
  min-height:78vh;display:flex;flex-direction:column;justify-content:center;
  padding:9rem 3rem 5rem;position:relative;overflow:hidden;
}
.page-hero.dark{background:linear-gradient(160deg,var(--navy) 0%,var(--navy-deep) 100%);color:var(--parchment)}
.page-hero h1{
  font-family:var(--serif);font-weight:500;
  font-size:clamp(2.6rem,5.6vw,5.2rem);line-height:1.05;max-width:18ch;margin-top:1.8rem;
}
.page-hero h1 em{font-style:italic;color:var(--gold)}
.page-hero .lede{
  margin-top:2.2rem;max-width:46ch;font-weight:300;line-height:1.8;
  color:rgba(22,41,74,.7);font-size:1.02rem;
}
.page-hero.dark .lede{color:rgba(248,243,231,.68)}
.page-hero .hero-actions{display:flex;gap:1.2rem;margin-top:2.8rem;flex-wrap:wrap}
.hero-watermark{
  position:absolute;right:-3%;top:50%;transform:translateY(-50%);
  font-family:var(--serif);font-size:min(38vw,26rem);line-height:1;
  color:transparent;-webkit-text-stroke:1px rgba(22,41,74,.09);
  user-select:none;pointer-events:none;white-space:nowrap;
}
.page-hero.dark .hero-watermark{-webkit-text-stroke-color:rgba(248,243,231,.07)}
@media(max-width:1100px){.hero-watermark{display:none}}
@media(max-width:900px){.page-hero{padding:7.5rem 1.4rem 4rem;min-height:64vh}}

/* ===== IB World School badge ===== */
.ib-badge{
  position:absolute;top:7.2rem;right:3rem;z-index:5;pointer-events:none;
  opacity:0;transform:translateY(-14px);
  animation:ibIn .9s .5s cubic-bezier(.19,1,.22,1) forwards;
}
.ib-badge img{display:block;width:86px;height:auto;background:none;border:0}
@keyframes ibIn{to{opacity:1;transform:translateY(0)}}
@media(max-width:900px){.ib-badge{top:5.2rem;right:1.4rem}.ib-badge img{width:56px}}
@media(prefers-reduced-motion:reduce){.ib-badge{opacity:1;transform:none;animation:none}}

/* ===== footer admissions CTA ===== */
.foot-cta{
  display:inline-block;margin-top:1.6rem;padding:.8rem 1.8rem;border-radius:999px;
  background:var(--gold);color:var(--navy);text-decoration:none;
  font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;font-weight:700;
  transition:transform .35s cubic-bezier(.19,1,.22,1),box-shadow .35s;
}
.foot-cta:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(169,130,60,.35);color:var(--navy)}

/* ===== sections ===== */
.section{padding:8rem 3rem}
.section.tight{padding:6rem 3rem}
.section.dark{background:var(--navy);color:var(--parchment)}
.section.darker{background:var(--navy-deep);color:var(--parchment)}
.wrap{max-width:1500px;margin:0 auto}
.wrap-narrow{max-width:1100px;margin:0 auto}
.sec-title{
  font-family:var(--serif);font-weight:500;
  font-size:clamp(2.2rem,4.4vw,4rem);line-height:1.06;margin-top:1.6rem;
}
.sec-title em{font-style:italic;color:var(--gold)}
.sec-sub{margin-top:1.6rem;max-width:56ch;font-weight:300;line-height:1.85;color:rgba(22,41,74,.68)}
.section.dark .sec-sub,.section.darker .sec-sub{color:rgba(248,243,231,.62)}
@media(max-width:900px){.section{padding:5rem 1.4rem}.section.tight{padding:4rem 1.4rem}}

/* ===== editorial numbered rows ===== */
.ed-row{
  position:relative;padding:3.6rem 0 3.6rem 7.5rem;border-bottom:1px solid rgba(22,41,74,.12);
}
.section.dark .ed-row,.section.darker .ed-row{border-color:rgba(248,243,231,.12)}
.ed-num{
  position:absolute;left:0;top:3rem;
  font-family:var(--serif);font-size:5rem;line-height:1;font-weight:400;
  color:transparent;-webkit-text-stroke:1px rgba(169,130,60,.55);
}
.ed-row h3{
  font-family:var(--serif);font-weight:500;font-size:clamp(1.6rem,2.4vw,2.4rem);line-height:1.18;
}
.ed-row h3 em{font-style:italic;color:var(--gold)}
.ed-row p{margin-top:1rem;color:rgba(22,41,74,.62);font-weight:300;max-width:56ch;line-height:1.8}
.section.dark .ed-row p,.section.darker .ed-row p{color:rgba(248,243,231,.6)}
@media(max-width:900px){.ed-row{padding-left:0;padding-top:6rem}.ed-num{top:1rem}}

/* ===== vertical timeline ===== */
.timeline{position:relative;max-width:1100px;margin:4rem auto 0;padding-left:3.4rem}
.tl-rail{position:absolute;left:14px;top:0;bottom:0;width:1px;background:rgba(248,243,231,.15)}
.tl-fill{position:absolute;left:14px;top:0;width:1px;height:0;background:var(--gold);transition:height .1s linear}
.tl-item{position:relative;padding:0 0 4.6rem}
.tl-item:last-child{padding-bottom:1rem}
.tl-dot{
  position:absolute;left:-3.4rem;top:.55em;width:11px;height:11px;border-radius:50%;
  background:var(--navy);border:2px solid var(--gold);transform:translateX(9px);
}
.tl-item.lit .tl-dot{background:var(--gold)}
.tl-year{
  font-family:var(--serif);font-size:clamp(2rem,3.6vw,3.2rem);line-height:1;color:var(--gold);
}
.tl-year small{font-family:var(--sans);font-size:.62rem;letter-spacing:.26em;text-transform:uppercase;color:rgba(248,243,231,.45);margin-left:1rem;font-weight:600}
.tl-item h3{font-family:var(--serif);font-weight:500;font-size:clamp(1.4rem,2.2vw,2rem);margin-top:.9rem;line-height:1.2}
.tl-item h3 em{font-style:italic;color:var(--gold)}
.tl-item p{margin-top:.8rem;max-width:58ch;font-weight:300;line-height:1.8;color:rgba(248,243,231,.6)}
.tl-award{
  display:inline-block;margin-top:1rem;margin-right:.6rem;
  font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;
  border:1px solid rgba(169,130,60,.5);color:var(--gold-light);
  padding:.4rem .9rem;border-radius:999px;
}

/* ===== card grids ===== */
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:1.6rem}
@media(max-width:1100px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}
.card{
  background:#fff;border:1px solid rgba(22,41,74,.08);border-radius:6px;
  padding:2.2rem;box-shadow:0 18px 44px rgba(22,41,74,.06);
  transition:transform .4s,box-shadow .4s,border-color .4s;
}
.card:hover{transform:translateY(-5px);box-shadow:0 28px 60px rgba(22,41,74,.1);border-color:rgba(169,130,60,.4)}
.card h4{font-family:var(--serif);font-weight:600;font-size:1.35rem;line-height:1.25}
.card p{margin-top:.8rem;font-weight:300;line-height:1.75;color:rgba(22,41,74,.65);font-size:.95rem}
.card .k{
  font-size:.58rem;letter-spacing:.28em;text-transform:uppercase;font-weight:700;color:var(--gold);
  display:block;margin-bottom:1rem;
}

/* ===== accordion ===== */
.acc{border-top:1px solid rgba(22,41,74,.12)}
.acc-item{border-bottom:1px solid rgba(22,41,74,.12)}
.acc-head{
  width:100%;display:flex;justify-content:space-between;align-items:center;gap:2rem;
  background:none;border:0;text-align:left;cursor:pointer;padding:1.8rem 0;
  font-family:var(--serif);font-weight:500;font-size:clamp(1.15rem,1.9vw,1.6rem);color:var(--navy);
}
.acc-head .ai{
  flex-shrink:0;width:34px;height:34px;border:1px solid rgba(169,130,60,.6);border-radius:50%;
  position:relative;transition:transform .45s cubic-bezier(.77,0,.18,1),background .3s;
}
.acc-head .ai::before,.acc-head .ai::after{
  content:'';position:absolute;left:50%;top:50%;background:var(--gold);
  transform:translate(-50%,-50%);
}
.acc-head .ai::before{width:12px;height:1.5px}
.acc-head .ai::after{width:1.5px;height:12px;transition:opacity .3s}
.acc-item.open .ai{transform:rotate(135deg);background:rgba(169,130,60,.12)}
.acc-body{
  max-height:0;overflow:hidden;transition:max-height .55s cubic-bezier(.77,0,.18,1);
}
.acc-body-in{padding:0 0 2rem;max-width:64ch;font-weight:300;line-height:1.85;color:rgba(22,41,74,.68)}

/* ===== forms ===== */
.f-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem}
@media(max-width:700px){.f-grid{grid-template-columns:1fr}}
.f-field{display:flex;flex-direction:column;gap:.5rem}
.f-field.full{grid-column:1/-1}
.f-field label{font-size:.6rem;letter-spacing:.26em;text-transform:uppercase;font-weight:700;color:var(--gold)}
.f-field input,.f-field select,.f-field textarea{
  font-family:var(--sans);font-size:.98rem;font-weight:300;color:var(--navy);
  background:transparent;border:0;border-bottom:1px solid rgba(22,41,74,.25);
  padding:.7rem 0;transition:border-color .3s;border-radius:0;
}
.f-field textarea{resize:vertical;min-height:110px}
.f-field input:focus,.f-field select:focus,.f-field textarea:focus{outline:none;border-bottom-color:var(--gold)}

/* ===== cta band ===== */
.cta-band{
  background:var(--navy);color:var(--parchment);text-align:center;position:relative;overflow:hidden;
  padding:8rem 3rem;
}
.cta-band .big-inf{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  font-family:var(--serif);font-size:50rem;line-height:0;color:transparent;
  -webkit-text-stroke:1px rgba(248,243,231,.05);pointer-events:none;user-select:none;
}
.cta-band h2{
  position:relative;font-family:var(--serif);font-weight:500;
  font-size:clamp(2.6rem,6.4vw,5.6rem);line-height:1.04;
}
.cta-band h2 em{font-style:italic;color:var(--gold)}
.cta-band p{position:relative;margin:2rem auto 0;max-width:48ch;color:rgba(248,243,231,.65);font-weight:300;line-height:1.85}
.cta-band .row{position:relative;display:flex;gap:1.2rem;justify-content:center;flex-wrap:wrap;margin-top:3rem}
.cta-band .btn-ghost{border-color:rgba(248,243,231,.35);color:var(--parchment)}
.cta-band .btn-ghost:hover{border-color:var(--gold);color:var(--gold)}
@media(max-width:900px){.cta-band{padding:5.5rem 1.4rem}}

/* ===== footer ===== */
footer{background:var(--navy-deep);color:rgba(248,243,231,.7);padding:5rem 3rem 2.4rem}
.foot-grid{
  max-width:1500px;margin:0 auto;display:grid;
  grid-template-columns:2fr 1fr 1fr 1.4fr;gap:3rem;padding-bottom:3.6rem;
  border-bottom:1px solid rgba(248,243,231,.1);
}
.foot-brand .logo span{color:var(--parchment)}
.foot-brand p{margin-top:1.4rem;font-weight:300;font-size:.9rem;max-width:30ch;line-height:1.8;color:rgba(248,243,231,.5)}
footer h4{
  font-size:.64rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);
  margin-bottom:1.4rem;font-family:var(--sans);font-weight:600;
}
footer ul{list-style:none}
footer li{margin-bottom:.7rem}
footer a{color:rgba(248,243,231,.7);text-decoration:none;font-size:.9rem;font-weight:300;transition:color .3s}
footer a:hover{color:var(--gold)}
.foot-contact p{font-size:.9rem;font-weight:300;line-height:1.9;color:rgba(248,243,231,.6)}
.foot-bottom{
  max-width:1500px;margin:2.2rem auto 0;display:flex;justify-content:space-between;
  font-size:.7rem;letter-spacing:.1em;color:rgba(248,243,231,.35);flex-wrap:wrap;gap:1rem;
}
@media(max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}footer{padding:4rem 1.4rem 2rem}}


/* ============ HOVER POLISH ============ */
.card .k{transition:letter-spacing .45s cubic-bezier(.19,1,.22,1),color .35s}
.card:hover .k{letter-spacing:.34em}
.logo span{transition:letter-spacing .45s cubic-bezier(.19,1,.22,1)}
.logo:hover span{letter-spacing:.38em}
footer li a{display:inline-block;transition:transform .35s cubic-bezier(.19,1,.22,1),color .3s}
footer li a:hover{transform:translateX(5px)}
.stat{transition:border-color .45s,transform .45s cubic-bezier(.19,1,.22,1)}
.stat:hover{border-left-color:var(--gold);transform:translateX(4px)}
.stat .stat-value{transition:color .4s}
.stat:hover .stat-value{color:var(--gold)}
.acc-head{transition:color .35s}
.acc-head:hover{color:var(--gold)}
.tl-dot{transition:transform .45s cubic-bezier(.19,1,.22,1),background .35s}
.tl-item:hover .tl-dot{transform:translateX(9px) scale(1.5);background:var(--gold)}
.film-frame,.exhib-visual,.map-card{transition:box-shadow .5s,transform .5s cubic-bezier(.19,1,.22,1)}
.film-frame:hover,.exhib-visual:hover,.map-card:hover{transform:translateY(-4px);box-shadow:0 46px 100px rgba(22,41,74,.28)}
.branch-line{transition:padding-left .4s cubic-bezier(.19,1,.22,1)}
.branch-line:hover{padding-left:.9rem}
.branch-line .tel{transition:color .35s}
.section-label::before{transition:width .5s cubic-bezier(.19,1,.22,1)}
.section-label:hover::before{width:56px}
.btn{transition:.4s cubic-bezier(.19,1,.22,1)}
.btn-ghost:hover,.nav-cta:hover{transform:translateY(-2px)}
.f-field input,.f-field select,.f-field textarea{transition:border-color .35s,background .35s}
.f-field input:hover,.f-field select:hover,.f-field textarea:hover{border-bottom-color:rgba(169,130,60,.6)}
.pol-toc a{transition:color .3s,padding-left .35s cubic-bezier(.19,1,.22,1)}
.h-row,.hs-row{transition:background .5s}

/* ============ MOBILE HEIGHT TRIM ============ */
@media(max-width:768px){
  .section{padding:3.2rem 1.2rem}
  .section.tight{padding:2.6rem 1.2rem}
  .page-hero{min-height:auto;padding:6.6rem 1.2rem 2.8rem}
  .page-hero h1{font-size:clamp(2.05rem,8.4vw,2.9rem)}
  .page-hero .lede{margin-top:1.2rem;font-size:.95rem;line-height:1.7}
  .page-hero .hero-actions{margin-top:1.6rem;gap:.7rem}
  .sec-title{margin-top:1rem;font-size:clamp(1.75rem,7.4vw,2.4rem)}
  .sec-sub{margin-top:1rem;font-size:.94rem;line-height:1.72}
  .btn{padding:.85rem 1.6rem;font-size:.62rem}
  .grid-2,.grid-3,.grid-4{gap:1rem}
  .card{padding:1.4rem}
  .card h4{font-size:1.22rem}
  .card p{margin-top:.6rem;font-size:.92rem;line-height:1.62}
  .ed-row{padding:4.2rem 0 2rem}
  .ed-num{font-size:3.6rem;top:.6rem}
  .ed-row p{margin-top:.7rem;line-height:1.65}
  .timeline{margin-top:2.2rem;padding-left:2.6rem}
  .tl-item{padding-bottom:2.4rem}
  .tl-dot{left:-2.6rem}
  .tl-year{font-size:clamp(1.7rem,8vw,2.2rem)}
  .tl-item h3{margin-top:.5rem;font-size:clamp(1.2rem,5.6vw,1.5rem)}
  .tl-item p{margin-top:.5rem;font-size:.92rem;line-height:1.68}
  .tl-award{margin-top:.7rem;font-size:.55rem;padding:.3rem .7rem}
  .acc-head{padding:1.15rem 0;font-size:1.08rem;gap:1rem}
  .acc-head .ai{width:28px;height:28px}
  .acc-body-in{padding-bottom:1.3rem;font-size:.93rem;line-height:1.72}
  .cta-band{padding:3.6rem 1.2rem}
  .cta-band h2{font-size:clamp(1.95rem,9vw,2.7rem)}
  .cta-band p{margin-top:1rem;font-size:.94rem;line-height:1.7}
  .cta-band .row{margin-top:1.6rem;gap:.7rem}
  .cta-band .big-inf{font-size:24rem}
  footer{padding:2.8rem 1.2rem 1.6rem}
  .foot-grid{gap:1.6rem 1.2rem;padding-bottom:2rem}
  .foot-brand p{margin-top:.9rem;font-size:.85rem;line-height:1.65}
  footer h4{margin-bottom:.9rem}
  footer li{margin-bottom:.5rem}
  .foot-contact p{font-size:.85rem;line-height:1.75}
  .foot-bottom{margin-top:1.4rem;font-size:.62rem}
  .hero-watermark{display:none}
}
@media(max-width:768px){
  /* subpage specifics */
  .contrast>div{padding:2.6rem 1.2rem}
  .contrast li{padding:.72rem 0;font-size:.94rem}
  .assess-item{padding:1.2rem 0;gap:1rem}
  .assess-item .tick{width:34px;height:34px}
  .assess-item p{margin-top:.35rem;font-size:.88rem;line-height:1.6}
  .continuum .cont-stage{padding:1.8rem 1.3rem}
  .cont-stage p{margin-top:.9rem;font-size:.9rem;line-height:1.62}
  .cont-stage .u{margin-top:1rem;font-size:2rem}
  .studio{padding:1.5rem 1.2rem}
  .step{padding:2.2rem 0}
  .step p{margin-top:.8rem;font-size:.94rem;line-height:1.7}
  .fit .card li{padding:.6rem 0;font-size:.92rem}
  .pol-sec{padding-bottom:2.2rem}
  .pol-sec p{margin-top:.7rem;font-size:.94rem;line-height:1.72}
  .pol-sec h3{margin-top:1.4rem;font-size:1.15rem}
  .pol-docs{gap:1rem;margin-bottom:2.4rem}
  .pol-doc{padding:1.4rem}
  .c-item{padding:1.15rem 0}
  .c-item .val{font-size:1.1rem}
  .hours{margin-top:1.8rem}
  .contact-form-panel,.apply-panel{padding:1.5rem 1.2rem}
  .featured .fbody{padding:1.5rem 1.2rem}
  .featured .fx{min-height:150px}
  .featured h2{font-size:1.45rem;margin-top:.8rem}
  .featured p{margin-top:.8rem;font-size:.93rem;line-height:1.68}
  .post .px{height:130px}
  .post .pbody{padding:1.3rem 1.2rem}
  .post h3{font-size:1.2rem;margin-top:.7rem}
  .post p{margin-top:.6rem;font-size:.9rem;line-height:1.6}
  .art-body p{font-size:1rem;line-height:1.78;margin-bottom:1.1rem}
  .art-body h2{margin:2.2rem 0 .8rem;font-size:1.55rem}
  .art-body h3{margin:1.6rem 0 .6rem;font-size:1.2rem}
  .art-body li{padding:.38rem 0;font-size:.95rem;line-height:1.65}
  .pull{margin:2rem 0;padding:1.3rem 1.4rem}
  .pull p{font-size:1.15rem;line-height:1.4}
  .np{padding:1.3rem}
  .unit-top{padding:1.2rem 1.2rem 1rem}
  .unit-body{padding:1rem 1.2rem 1.2rem}
  .unit-ci{font-size:1.08rem;margin-top:.6rem}
  .unit-sec{margin-bottom:.9rem}
  .unit-sec li{padding:.24rem 0;font-size:.84rem;line-height:1.48}
  .unit-stretch{padding:.7rem .85rem;font-size:.92rem}
  .units{gap:1rem}
  .grade-head{margin:1.8rem 0 1.2rem}
  .theme-line{padding:1.15rem 0}
  .theme-line p{font-size:.9rem;line-height:1.68}
  .spine{gap:1rem;margin-top:2rem}
  .hs-row{padding:2.4rem 0;gap:1.4rem}
  .hs-body{margin-top:.8rem;font-size:.94rem;line-height:1.72}
  .hs-lead{margin-top:1rem;font-size:1.22rem}
  .hs-earn{margin-top:1rem;padding:.85rem 1rem;font-size:.9rem;line-height:1.6}
  .pt{padding:1.3rem}
  .pt p{margin-top:.5rem;font-size:.9rem;line-height:1.62}
  .q-text{font-size:clamp(1.3rem,6.4vw,1.8rem);margin-top:.8rem}
  .q-opts{margin-top:1.6rem;gap:.6rem}
  .q-opt{padding:.95rem 1rem;font-size:.92rem;gap:.9rem}
  .res-panel{padding:1.4rem 1.2rem}
  .res-lede{margin-top:1rem;font-size:.96rem;line-height:1.72}
}

/* ===== footer IB World School lockup (bottom-left) ===== */
.foot-ib{
  display:flex;align-items:center;gap:.9rem;margin-top:2rem;
  padding-top:1.6rem;border-top:1px solid rgba(248,243,231,.1);max-width:30ch;
}
.foot-ib img{width:58px;height:auto;flex-shrink:0;display:block}
.foot-ib span{
  font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;
  color:rgba(248,243,231,.75);line-height:1.7;
}
.foot-ib small{
  display:block;margin-top:.35rem;font-size:.56rem;letter-spacing:.12em;
  font-weight:400;text-transform:none;color:rgba(248,243,231,.42);line-height:1.5;
}
@media(max-width:900px){.foot-ib{margin-top:1.4rem;padding-top:1.2rem}.foot-ib img{width:48px}}

/* ===== mobile nav: keep the header legible over any hero ===== */
@media(max-width:1080px){
  nav#nav{
    background:rgba(248,243,231,.96);
    -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
    box-shadow:0 1px 0 rgba(22,41,74,.08);
  }
  nav#nav .logo span{color:var(--navy)}
  nav#nav .hamburger span{background:var(--navy)}
}
/* lock scroll behind the open menu without layout shift */
body.menu-open{overflow:hidden}

/* nav over a dark hero — desktop only; below 1080px the header has a solid
   parchment background, so the light treatment would render it invisible */
@media(min-width:1081px){
  nav.on-dark:not(.scrolled) .nav-links a,
  nav.on-dark:not(.scrolled) .logo span{color:var(--parchment)}
  nav.on-dark:not(.scrolled) .logo .logo-mark{background:rgba(248,243,231,.15);color:var(--gold)}
  nav.on-dark:not(.scrolled) .nav-cta{border-color:rgba(248,243,231,.5);color:var(--parchment)}
}
/* ============================================================
   MOBILE MENU + FOOTER FIXES
   ============================================================ */

/* Footer wordmark: .logo inherits navy, which is invisible on the
   navy-deep footer. Applies to the footer and the mobile menu header. */
footer .logo span,
.foot-brand .logo span,
.mobile-menu-top .logo span{color:var(--parchment)}
footer .logo .logo-mark,
.mobile-menu-top .logo .logo-mark{background:rgba(248,243,231,.12);color:var(--gold)}
.foot-brand p{
  margin-top:1.4rem;font-weight:300;font-size:.9rem;max-width:30ch;
  line-height:1.8;color:rgba(248,243,231,.5);
}

/* Hamburger: 44x44 minimum touch target (was 36x36) */
.hamburger{
  width:44px;height:44px;padding:9px 4px;
  -webkit-tap-highlight-color:transparent;touch-action:manipulation;
  position:relative;z-index:2;
}

/* Mobile menu: full height on browsers with dynamic toolbars, and
   scrollable so the Admissions button is always reachable. */
.mobile-menu{
  height:100vh;height:100dvh;
  overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
}
.mobile-menu-inner{min-height:100%;height:auto;padding-bottom:2.5rem}
.mobile-links{flex:0 0 auto}
.mobile-close{
  width:44px;height:44px;flex-shrink:0;
  -webkit-tap-highlight-color:transparent;touch-action:manipulation;
}
.mobile-cta{margin-top:2rem;-webkit-tap-highlight-color:transparent}
.mobile-links a{-webkit-tap-highlight-color:transparent}

/* blur is expensive and janky on mid-range Android */
.mobile-overlay{background:rgba(6,14,28,.62);backdrop-filter:none;-webkit-backdrop-filter:none}

/* the body is pinned by JS while the menu is open */
body.menu-open{overflow:hidden}

/* preloader must never intercept taps once dismissed */
.preloader.done{pointer-events:none}

/* hover styles must not stick on touch devices */
@media(hover:none){
  .mobile-links a:hover{padding-left:0;color:rgba(248,243,231,.7)}
  .mobile-close:hover{transform:none}
  .mobile-cta:hover{transform:none;box-shadow:none}
}

/* ============================================================
   MOBILE MENU V2 — authoritative. Loaded last; hard values, no
   variables, !important where an older rule could interfere.
   The panel is solid ink navy, the text is solid parchment, and
   the close control is always visible. This block is the final
   word on the menu's appearance.
   ============================================================ */
@media(max-width:1080px){
  .mobile-menu{
    position:fixed !important;inset:0 !important;z-index:1002 !important;
    background:#0D1B33 !important;
    display:flex !important;flex-direction:column !important;
    height:100vh;height:100dvh;
    overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
    transform:translateX(-102%);
    transition:transform .42s cubic-bezier(.77,0,.18,1),visibility 0s linear .42s;
    pointer-events:none;visibility:hidden;
  }
  .mobile-menu.open{
    transform:translateX(0);pointer-events:auto;visibility:visible;
    transition:transform .42s cubic-bezier(.77,0,.18,1),visibility 0s;
  }
  .mobile-menu-inner{
    display:flex;flex-direction:column;min-height:100%;height:auto;
    padding:0 1.6rem 2.4rem;background:transparent !important;
  }
  .mobile-menu-top{
    display:flex;justify-content:space-between;align-items:center;
    padding:1.1rem 0;border-bottom:1px solid rgba(248,243,231,.14);
    margin-bottom:1.2rem;
  }
  .mobile-menu-top .logo span{color:#F8F3E7 !important}
  .mobile-menu-top .logo-mark{background:rgba(248,243,231,.12) !important;color:#C9A25C !important}
  .mobile-close{
    background:rgba(248,243,231,.06) !important;
    border:1.5px solid rgba(248,243,231,.45) !important;
    color:#F8F3E7 !important;
    width:46px !important;height:46px !important;border-radius:50% !important;
    font-size:1.5rem;line-height:1;flex-shrink:0;
    display:flex !important;align-items:center;justify-content:center;
    -webkit-tap-highlight-color:transparent;touch-action:manipulation;cursor:pointer;
  }
  .mobile-links{display:flex;flex-direction:column;flex:0 0 auto}
  .mobile-links a{
    font-family:'Cormorant Garamond',serif !important;
    font-size:clamp(1.7rem,7.5vw,2.4rem) !important;font-weight:500 !important;
    color:#F8F3E7 !important;opacity:.92;
    text-decoration:none !important;text-align:left !important;
    padding:.85rem 0 !important;display:block !important;
    border-bottom:1px solid rgba(248,243,231,.1) !important;
    -webkit-tap-highlight-color:transparent;
    transform:translateX(-14px);opacity:0;
    transition:transform .45s cubic-bezier(.19,1,.22,1),opacity .45s;
  }
  .mobile-menu.open .mobile-links a{transform:translateX(0);opacity:.92}
  .mobile-menu.open .mobile-links a:nth-child(1){transition-delay:.06s}
  .mobile-menu.open .mobile-links a:nth-child(2){transition-delay:.11s}
  .mobile-menu.open .mobile-links a:nth-child(3){transition-delay:.16s}
  .mobile-menu.open .mobile-links a:nth-child(4){transition-delay:.21s}
  .mobile-menu.open .mobile-links a:nth-child(5){transition-delay:.26s}
  .mobile-menu.open .mobile-links a:nth-child(6){transition-delay:.31s}
  .mobile-links a.active{color:#C9A25C !important}
  .mobile-links a:active{opacity:.6}
  .mobile-cta{
    display:block !important;margin-top:1.8rem;padding:1.05rem 2rem;
    background:#A9823C !important;color:#0D1B33 !important;
    text-align:center;font-weight:700;font-size:.85rem;letter-spacing:.18em;
    text-transform:uppercase;border-radius:999px;text-decoration:none;
    -webkit-tap-highlight-color:transparent;
  }
  .mobile-cta:active{transform:scale(.97)}
  .mobile-menu .foot-note{
    margin-top:auto;padding-top:1.8rem;display:flex;align-items:center;gap:.8rem;
    color:rgba(248,243,231,.55);font-size:.6rem;letter-spacing:.18em;
    text-transform:uppercase;font-weight:600;line-height:1.6;
  }
  .mobile-menu .foot-note img{width:40px;height:auto;flex-shrink:0}
  .mobile-overlay{
    position:fixed;inset:0;z-index:1001;background:rgba(6,14,28,.62);
    opacity:0;pointer-events:none;transition:opacity .35s;
    backdrop-filter:none;-webkit-backdrop-filter:none;
  }
  .mobile-overlay.open{opacity:1;pointer-events:auto}

  /* hamburger: distinct pill, 46px target, animates to an X */
  .hamburger{
    display:flex !important;flex-direction:column;justify-content:center;align-items:center;
    gap:5px;width:46px !important;height:46px !important;padding:0 11px !important;
    background:rgba(22,41,74,.06) !important;border:1px solid rgba(22,41,74,.22) !important;
    border-radius:50%;cursor:pointer;
    -webkit-tap-highlight-color:transparent;touch-action:manipulation;
  }
  .hamburger span{
    display:block;width:100%;height:1.8px;background:#16294A !important;
    transition:transform .34s cubic-bezier(.19,1,.22,1),opacity .2s;transform-origin:center;
  }
  .hamburger.open span:nth-child(1){transform:translateY(6.8px) rotate(45deg)}
  .hamburger.open span:nth-child(2){opacity:0;transform:scaleX(0)}
  .hamburger.open span:nth-child(3){transform:translateY(-6.8px) rotate(-45deg)}

  /* header always legible over any hero */
  nav#nav{
    background:rgba(248,243,231,.97) !important;
    -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
    box-shadow:0 1px 0 rgba(22,41,74,.08) !important;
  }
  nav#nav .logo span{color:#16294A !important}
  nav#nav .logo .logo-mark{background:#16294A !important;color:#C9A25C !important}
  nav#nav .nav-cta{border-color:#16294A !important;color:#16294A !important}
}
@media(min-width:1081px){
  .hamburger{display:none !important}
  .mobile-menu,.mobile-overlay{display:none !important}
}
body.menu-open{overflow:hidden}
.preloader.done{pointer-events:none}

/* ============================================================
   MOBILE MOTION POLISH
   ============================================================ */
@media(max-width:900px){
  .reveal{transform:translateY(26px);transition-duration:.7s}
  .btn:active,.nav-cta:active,.foot-cta:active{transform:scale(.97)}
  .card:active{transform:translateY(-2px)}
  .studio:active img{transform:translateY(-3px)}
}
@media(prefers-reduced-motion:reduce){
  .reveal{opacity:1 !important;transform:none !important;transition:none !important}
  .mobile-links a{transition:none !important;transform:none !important;opacity:.92 !important}
}

/* ============================================================
   MOBILE TYPOGRAPHIC RHYTHM
   Measured on real renders at 390px: headings sat 6-19px from
   their body copy regardless of heading size, so large headings
   looked cramped and small ones looked glued down. Spacing is
   now proportional to the size of the type it follows.
   Appended last so it settles the cascade.
   ============================================================ */
@media(max-width:900px){

  /* --- hero: H1 -> lede --- */
  .page-hero h1{margin-top:1.15rem;line-height:1.1}
  .page-hero .lede{margin-top:1.55rem;line-height:1.75}
  .hero h1{line-height:1.1}
  .hero-sub{margin-top:1.55rem;line-height:1.75}
  .page-hero .hero-actions,.hero .hero-actions{margin-top:2rem}

  /* --- section heads: label -> title -> sub --- */
  .sec-title{margin-top:1.15rem;line-height:1.12}
  .sec-sub{margin-top:1.4rem;line-height:1.8}

  /* --- editorial numbered rows (the manifesto) --- */
  .mani-item{padding-top:4.4rem;padding-bottom:2.2rem}
  .mani-item:first-child{padding-top:2.2rem}
  .mani-num{top:.7rem;font-size:3.1rem}
  .mani-item h3{line-height:1.24}
  .mani-item p{margin-top:1rem;line-height:1.7}
  .ed-row{padding-top:5rem;padding-bottom:2.4rem}
  .ed-num{top:1.1rem}
  .ed-row h3{line-height:1.24}
  .ed-row p{margin-top:.95rem;line-height:1.72}

  /* --- cards --- */
  .card{padding:1.6rem 1.4rem}
  .card .k{margin-bottom:.9rem}
  .card h4{line-height:1.28}
  .card p{margin-top:.8rem;line-height:1.7}

  /* --- vertical timeline --- */
  .tl-item{padding-bottom:2.8rem}
  .tl-year{line-height:1.05}
  .tl-item h3{margin-top:.85rem;line-height:1.26}
  .tl-item p{margin-top:.8rem;line-height:1.72}
  .tl-award{margin-top:.95rem}

  /* --- IB continuum stages --- */
  .cont-stage{padding:2rem 1.4rem}
  .cont-stage h3{margin-top:.85rem;line-height:1.2}
  .cont-stage .prog{margin-top:.5rem}
  .cont-stage p{margin-top:1.15rem;line-height:1.72}
  .cont-stage .u{margin-top:1.3rem}

  /* --- horizontal history panels --- */
  .hist-panel h3{margin-top:1.5rem;line-height:1.22}
  .hist-panel p{margin-top:1.2rem;line-height:1.78}

  /* --- accordions --- */
  .acc-head{padding:1.25rem 0;line-height:1.3}
  .acc-body-in{padding-bottom:1.5rem;line-height:1.78}

  /* --- studios --- */
  .studio-caption{padding-top:1.15rem;margin-top:1.15rem}
  .studio-caption h4{line-height:1.24}
  .studio-caption p{margin-top:.5rem;line-height:1.6}

  /* --- articles --- */
  .art-body h2{margin-top:2.6rem;margin-bottom:.9rem;line-height:1.24}
  .art-body h3{margin-top:1.9rem;margin-bottom:.7rem;line-height:1.28}
  .art-body p{margin-bottom:1.25rem;line-height:1.8}
  .art-body li{line-height:1.72}
  .pull{margin:2.3rem 0;padding:1.5rem 1.5rem}
  .pull p{line-height:1.5}

  /* --- minimum legible sizes (measured 9.9px on the review note) --- */
  .rw-note{font-size:.68rem;margin-top:1.8rem;line-height:1.6}
  .note,.foot-contact p{font-size:.88rem;line-height:1.8}
  .cont-stage .u small,.tl-year small{line-height:1.5}

  /* --- footer: readable, tappable --- */
  footer{padding:3.2rem 1.4rem 1.8rem}
  .foot-grid{gap:2.2rem 1.4rem;padding-bottom:2.4rem}
  footer h4{margin-bottom:1.1rem}
  footer li{margin-bottom:.15rem}
  footer li a{display:block;padding:.5rem 0;line-height:1.5}
  .foot-brand p{margin-top:1.1rem;line-height:1.8}
  .foot-bottom{margin-top:1.8rem;gap:.6rem;line-height:1.6}

  /* --- forms breathe --- */
  .f-grid{gap:1.6rem}
  .f-field label{margin-bottom:.15rem}
  .f-field input,.f-field select,.f-field textarea{padding:.8rem 0}

  /* --- CTA bands --- */
  .cta-band h2{line-height:1.1}
  .cta-band p{margin-top:1.3rem;line-height:1.8}
  .cta-band .row{margin-top:2rem}
}

/* very small phones: stop large display type from crowding */
@media(max-width:380px){
  .sec-title{font-size:clamp(1.6rem,7.6vw,2.1rem)}
  .mani-item h3,.ed-row h3{font-size:1.22rem}
  .mani-num{font-size:2.8rem}
  .page-hero h1,.hero h1{font-size:clamp(1.95rem,8.6vw,2.5rem)}
}

/* ============================================================
   INFINITY MARK — vector, identical on every device
   The text glyph rendered differently on mobile whenever
   Cormorant Garamond had not loaded yet and a system serif
   substituted its own infinity sign. This is the same shape
   everywhere, at any size, and needs no font.
   ============================================================ */
.inf-mark{display:block;width:100%;height:auto;overflow:visible}
.logo-mark{padding:0;overflow:visible}
.logo-mark .inf-mark{width:21px;color:var(--gold)}
.mobile-menu-top .logo-mark .inf-mark,
footer .logo-mark .inf-mark{color:var(--gold-light)}
.preloader .mark{
  display:flex;align-items:center;justify-content:center;
  width:6.5rem;color:var(--gold);
}
.preloader .mark .inf-mark{width:100%;stroke-width:3.4}
@media(max-width:900px){
  .logo-mark .inf-mark{width:19px}
  .preloader .mark{width:5.2rem}
}

/* ============================================================
   DESCENDER ROOM ON DISPLAY TYPE
   Measured: an italic Cormorant line box is ~47px tall inside a
   41px heading line box, so descenders on words like "every
   grade." pushed into whatever followed. Slightly looser leading
   plus a hair of padding gives them room without loosening the
   look of the headline.
   ============================================================ */
.sec-title,.page-hero h1,.hero h1,.cta-band h2,.cta h2,
.mani-item h3,.ed-row h3,.tl-item h3,.hist-panel h3,
.cont-stage h3,.card h4,.studio-caption h4,.acc-head{
  padding-bottom:.06em;
}
.sec-title em,.page-hero h1 em,.hero h1 em,.cta-band h2 em,
.mani-item h3 em,.ed-row h3 em{line-height:inherit}
@media(max-width:900px){
  .sec-title{line-height:1.16}
  .page-hero h1,.hero h1{line-height:1.14}
  .cta-band h2,.cta h2{line-height:1.14}
  .mani-item h3,.ed-row h3{line-height:1.28}
  .tl-item h3,.hist-panel h3,.cont-stage h3{line-height:1.26}
  .card h4,.studio-caption h4{line-height:1.3}
}

/* ============================================================
   NUMBERED EDITORIAL ROWS — mobile
   The numeral is absolutely positioned and sits ABOVE the
   heading on phones, so the row needs padding-top greater than
   the numeral's height or the two collide.
   ============================================================ */
@media(max-width:900px){
  .mani-item,.mani-item:first-child{padding:4.6rem 0 2.4rem}
  .mani-num,.mani-item:first-child .mani-num{top:.2rem;font-size:2.9rem;line-height:1}
  .ed-row,.ed-row:first-child{padding:5.2rem 0 2.6rem}
  .ed-num,.ed-row:first-child .ed-num{top:.6rem;font-size:3.2rem;line-height:1}
}

/* legible minimums */
@media(max-width:900px){
  .rw-note{font-size:.74rem}
  .cont-stage .u small,.tl-year small{font-size:.6rem}
}

/* The desktop nav gained a longer label; tighten the gap just above the
   breakpoint so six items never crowd or wrap on smaller laptops. */
@media(min-width:1081px) and (max-width:1300px){
  nav#nav{padding-left:1.8rem;padding-right:1.8rem}
  nav#nav.scrolled{padding-left:1.8rem;padding-right:1.8rem}
  .nav-links{gap:1.45rem}
  .nav-links a{letter-spacing:.16em;font-size:.63rem}
  .nav-cta{padding:.5rem 1.05rem;letter-spacing:.16em}
  .logo span{letter-spacing:.26em}
}
@media(min-width:1301px) and (max-width:1460px){
  .nav-links{gap:1.9rem}
  .nav-links a{letter-spacing:.19em}
}
.nav-links a{white-space:nowrap}

/* ============================================================
   INQUIRY HERO — clear the fixed header
   This hero is bottom-aligned (justify-content:flex-end) with no
   top padding. When its content is taller than the viewport, a
   flex container overflows its START edge, so the eyebrow and
   headline slid up underneath the fixed nav. Measured at a
   637px-tall viewport: 57px of overlap. A top padding larger
   than the header height removes the overlap and lets the hero
   grow instead of clipping.
   ============================================================ */
.inquiry-hero{padding-top:7.5rem}
@media(max-width:900px){.inquiry-hero{padding-top:6.4rem}}

/* ============================================================
   LOGO DISC ON DARK HEROES
   The on-dark treatment filled the disc with translucent
   parchment, so on the Inquiry Cycle page the mark read lighter
   than the solid navy disc used everywhere else. Same dark disc
   and gold mark as the rest of the site now, with a gold hairline
   so it still separates from the navy hero behind it.
   ============================================================ */
@media(min-width:1081px){
  nav.on-dark:not(.scrolled) .logo .logo-mark{
    background:var(--navy);
    box-shadow:inset 0 0 0 1px rgba(201,162,92,.45);
    color:var(--gold);
  }
}