/* =====================================================================
   Design tokens
   ===================================================================== */
:root{
    /* Brand colors */
    --navy:#061e3d;
    --navy-2:#0a2b52;
    --navy-hero:#173b55;
    --navy-footer:#031a35;
    --ink:#13233b;
    --ink-soft:#48505a;
    --gold:#c88b20;
    --gold-light:#e3ad48;
    --gold-text:#96650f;
    --gold-2:#efbc58;
    --gradient-gold:linear-gradient(135deg,#d79d2c,#b97812);
    --cream:#fbfaf6;
    --line:#e7e2d8;
    --border-card:#eeeae3;
    --muted:#6b7078;
    --footer-muted:#aeb8c5;
    --footer-line:#c7cedb;
    --white:#fff;

    /* Elevation scale */
    --shadow-sm:0 4px 14px rgba(17,35,57,.06);
    --shadow:0 10px 28px rgba(17,35,57,.08);
    --shadow-lg:0 20px 42px rgba(17,35,57,.16);

    /* Radius scale */
    --radius-sm:8px;
    --radius:11px;
    --radius-lg:14px;

    /* Motion */
    --ease-out:cubic-bezier(.16,1,.3,1);
    --ease-standard:cubic-bezier(.22,1,.36,1);
    --navy-tint:rgba(6,30,61,.05);
}

/* =====================================================================
   Base / reset
   ===================================================================== */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:'DM Sans',Arial,sans-serif;font-size:16px;line-height:1.6}
img{display:block;width:100%;height:100%;object-fit:cover}
a{color:inherit;text-decoration:none}
button,input{font:inherit}
.container{width:min(100% - 84px,1240px);margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:1rem;top:-100px;background:var(--gold);color:#111;padding:.6rem 1rem;z-index:100}
.skip-link:focus{top:1rem}

/* =====================================================================
   Icon system (inline SVG sprite, see assets/icons/sprite.svg)
   ===================================================================== */
.icon{display:inline-block;flex-shrink:0;fill:none;stroke:currentColor;vertical-align:middle;transition:transform .25s var(--ease-out)}

/* =====================================================================
   Topbar
   ===================================================================== */
.topbar{background:var(--navy);color:#f4f5f6;font-size:11px}
.topbar__inner{min-height:36px;display:flex;align-items:center;gap:28px}
.topbar span{white-space:nowrap}
.topbar__item{display:inline-flex;align-items:center;gap:6px}
.topbar__item .icon{width:12px;height:12px;stroke-width:2.2;color:var(--gold-light)}
.topbar__contact{display:flex;gap:24px;margin-left:auto}

/* =====================================================================
   Navbar / brand / menu
   ===================================================================== */
.navbar{background:var(--white);box-shadow:0 2px 12px rgba(3,21,42,.07);position:relative;z-index:10}
.navbar__inner{min-height:100px;display:flex;align-items:center;justify-content:space-between;gap:32px}
.brand{display:flex;align-items:center;gap:13px;color:var(--navy)}
.brand__crest{display:grid;place-items:center;width:60px;height:66px;border:2px solid var(--gold);border-radius:48% 48% 45% 45%;background:#fff;padding:4px;overflow:hidden;flex-shrink:0}
.brand__crest img{width:100%;height:100%;object-fit:contain}
.brand strong{display:block;font:700 18.5px/1.08 'Playfair Display',Georgia,serif;letter-spacing:.3px}
.brand small{display:block;margin-top:5px;font-size:9px;letter-spacing:.3px;color:#596273}
.navbar__menu{display:flex;align-items:center;gap:29px;font-weight:600;font-size:13px}
.navbar__menu>a:not(.button){position:relative;padding-block:34px}
.navbar__menu>a:not(.button):after{content:"";position:absolute;left:0;right:0;bottom:24px;height:2px;background:var(--gold);transform:scaleX(0);transition:transform .3s var(--ease-out)}
.navbar__menu>a:hover:after,.navbar__menu>a.is-active:after{transform:scaleX(1)}
.menu-toggle{display:none;border:0;background:transparent;padding:9px;cursor:pointer}
.menu-toggle span{display:block;width:24px;height:2px;background:var(--navy);margin:5px;transition:transform .2s var(--ease-out),opacity .2s var(--ease-out)}

.nav-dropdown{position:relative}
.nav-dropdown__trigger{position:relative;display:flex;align-items:center;gap:5px;padding-block:34px;background:transparent;border:0;cursor:pointer;color:var(--ink);font:inherit;font-weight:600;font-size:13px}
.nav-dropdown__trigger:after{content:"";position:absolute;left:0;right:0;bottom:24px;height:2px;background:var(--gold);transform:scaleX(0);transition:transform .3s var(--ease-out)}
.nav-dropdown:hover .nav-dropdown__trigger:after,.nav-dropdown.is-open .nav-dropdown__trigger:after{transform:scaleX(1)}
.nav-dropdown__trigger.is-active:after{transform:scaleX(1)}
.nav-dropdown__caret{width:10px;height:10px;color:var(--gold);transition:transform .25s var(--ease-out)}
.nav-dropdown.is-open .nav-dropdown__caret{transform:rotate(180deg)}
.nav-dropdown__panel{position:absolute;top:100%;left:0;min-width:210px;background:#fff;border-radius:var(--radius);box-shadow:var(--shadow-lg);padding:8px;display:none;z-index:20}
.nav-dropdown:hover .nav-dropdown__panel,.nav-dropdown:focus-within .nav-dropdown__panel,.nav-dropdown.is-open .nav-dropdown__panel{display:block}
.nav-dropdown__panel a{display:block;padding:10px 12px;border-radius:var(--radius-sm);font-size:12px;font-weight:600;color:var(--ink);white-space:nowrap;transition:background .2s var(--ease-out),color .2s var(--ease-out)}
.nav-dropdown__panel a:hover{background:var(--cream);color:var(--navy)}

/* =====================================================================
   Buttons
   ===================================================================== */
.button{display:inline-flex;align-items:center;justify-content:center;gap:13px;border:1px solid transparent;border-radius:4px;padding:14px 25px;font-size:13px;font-weight:700;transition:transform .25s var(--ease-out),background .25s var(--ease-out),box-shadow .25s var(--ease-out)}
.button:hover{transform:translateY(-2px);box-shadow:0 7px 16px rgba(6,30,61,.16)}
.button:hover span{transform:translateX(3px)}
.button span{display:inline-block;transition:transform .25s var(--ease-out)}
.button--gold{background:var(--gradient-gold);color:#fff}
.button--outline-light{border-color:#fff;color:#fff;background:rgba(0,0,0,.08)}
.button--outline-light:hover{background:#fff;color:var(--navy)}
.button--small{padding:12px 20px}
.text-button{display:inline-flex;align-items:center;gap:14px;color:var(--gold-text);border:1px solid var(--gold-text);border-radius:4px;padding:10px 16px;font-size:12px;font-weight:700;transition:background .25s var(--ease-out),color .25s var(--ease-out)}
.text-button:hover{background:var(--gold);color:#fff}
.text-button:hover span{transform:translateX(3px)}
.text-button span{display:inline-block;transition:transform .25s var(--ease-out)}
.button,.text-button{min-height:44px}

/* =====================================================================
   Hero
   ===================================================================== */
.hero{min-height:500px;position:relative;overflow:hidden;background:var(--navy-hero);color:#fff}
.hero__backdrop{position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,24,51,.95) 0%,rgba(3,24,51,.72) 37%,rgba(3,24,51,.1) 77%),var(--hero-bg-image,url('https://images.unsplash.com/photo-1580582932707-520aed937b7b?auto=format&fit=crop&w=2000&q=85')) center/cover;transition:transform 7s var(--ease-standard);transform:scale(1.001)}
.hero.is-animating-backdrop .hero__backdrop{transform:scale(1.07)}
.hero__inner{min-height:500px;display:flex;align-items:center;justify-content:space-between;gap:50px;position:relative;z-index:1}
.hero__copy{max-width:660px;padding-block:55px}
.eyebrow{color:var(--gold-text);font-size:11px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;margin:0 0 10px}
.eyebrow--light{color:#e7b755}
.hero h1{font:700 clamp(44px,4.2vw,72px)/1.05 'Playfair Display',Georgia,serif;letter-spacing:-1.4px;margin:0 0 18px}
.hero h1 span{color:#e0a337}
.hero__intro{font-size:17.5px;max-width:330px;color:#f1f3f4;margin:0 0 28px}
.hero__actions{display:flex;gap:14px;flex-wrap:wrap}
.hero__stats{display:grid;gap:11px;width:225px}
.hero-stat{display:flex;align-items:center;gap:14px;border:1px solid rgba(255,255,255,.22);border-radius:var(--radius-sm);background:rgba(4,26,52,.46);padding:14px 15px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:transform .3s var(--ease-out),background .3s var(--ease-out)}
.hero-stat:hover{transform:translateY(-3px);background:rgba(4,26,52,.66)}
.hero-stat__icon{display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--gold);color:#e5b350;border-radius:50%;flex-shrink:0}
.hero-stat__icon .icon{width:20px;height:20px}
.hero-stat strong,.hero-stat small{display:block}
.hero-stat strong{font:700 25px/1 'Playfair Display',Georgia,serif}
.hero-stat small{font-size:12.5px;color:#d5dbe3;margin-top:4px}
.hero__ornament{position:absolute;bottom:-22px;left:-8px;font-size:170px;color:rgba(212,161,64,.2);font-family:Georgia,serif;transform:rotate(-20deg)}

.hero__dots{display:flex;gap:8px;margin-top:26px}
.hero__dot{width:8px;height:8px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.35);cursor:pointer;transition:background .25s var(--ease-out),width .25s var(--ease-out)}
.hero__dot:hover{background:rgba(255,255,255,.6)}
.hero__dot.is-active{background:var(--gold-light);width:22px;border-radius:5px}

/* =====================================================================
   Section headings
   ===================================================================== */
.section{padding:82px 0}
.section-heading h2{font:700 37px/1.18 'Playfair Display',Georgia,serif;margin:0;color:var(--navy);letter-spacing:-.5px}
.section-heading h2 span,.about-copy h2 span{color:var(--navy)}
.section-heading h2:after{content:"";display:block;width:46px;height:8px;border-top:2px solid var(--gold);border-bottom:2px solid var(--gold);margin-top:16px}
.section-heading--center{text-align:center;margin-bottom:34px}
.section-heading--center h2:after{margin-inline:auto}
.section-heading--left{margin-bottom:28px}
.section-heading--with-action{display:flex;align-items:end;justify-content:space-between;gap:20px}
.section--tight{padding-top:0}
.section--intro-text{max-width:760px;margin:0 auto;text-align:center;color:var(--muted);font-size:14px;line-height:1.8}

/* =====================================================================
   Feature marquee
   ===================================================================== */
.section--features{background:#fff;padding-top:27px;padding-bottom:57px}
.feature-marquee{position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.feature-track{display:flex;width:max-content;animation:featureMarquee 32s linear infinite}
.feature-marquee:hover .feature-track{animation-play-state:paused}
.feature-track__set{display:flex;gap:14px;padding:4px 7px 16px}
@keyframes featureMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.feature-card{flex:0 0 232px;min-height:186px;background:#fff;border:1px solid var(--border-card);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:26px 18px;text-align:center;transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out)}
.feature-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.feature-card:hover .feature-card__icon{transform:scale(1.1) rotate(-4deg)}
.feature-card__icon{display:grid;place-items:center;width:38px;height:38px;margin:0 auto 12px;background:var(--navy);color:var(--gold-light);border-radius:50%;transition:transform .3s var(--ease-out)}
.feature-card__icon .icon{width:19px;height:19px}
.feature-card h3{font-size:15px;line-height:1.3;margin:0 0 10px}
.feature-card p{color:var(--muted);font-size:13px;line-height:1.55;margin:0}

/* =====================================================================
   About
   ===================================================================== */
.section--about{background:#fcfbf8}
.about-grid{display:grid;grid-template-columns:1.1fr 1.35fr .8fr;align-items:center;gap:38px}
.about-gallery__image{height:120px;border-radius:var(--radius);overflow:hidden}
.about-gallery__image--large{height:228px}
.about-gallery__image img{transition:transform .5s var(--ease-out)}
.about-gallery__image:hover img{transform:scale(1.06)}
.about-copy h2{font-size:33px;margin-bottom:14px}
.about-copy>p:not(.eyebrow){color:var(--ink-soft);font-size:15px;line-height:1.8;margin:0 0 22px}
.about-copy .icon-list{margin:0 0 26px}
.gold-rule{width:46px;border-top:2px solid var(--gold);border-bottom:2px solid var(--gold);height:8px;margin:16px 0 20px}

.about-stats{margin-top:52px;display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow);overflow:hidden}
.about-stat{padding:28px 20px;text-align:center;border-right:1px solid var(--line)}
.about-stat:last-child{border-right:0}
.about-stat strong{display:block;color:var(--navy);font:700 32px 'Playfair Display',Georgia,serif}
.about-stat span{display:block;color:var(--muted);font-size:12.5px;margin-top:6px}

.about-grid--split{grid-template-columns:1.15fr 1fr}
.about-grid--split-reverse{grid-template-columns:1fr 1.15fr}
.about-grid--split .about-gallery__image,.about-grid--split-reverse .about-gallery__image{height:auto;aspect-ratio:4/3}

/* =====================================================================
   Programs
   ===================================================================== */
.section--programs{background:#fff}
.programs-grid{display:grid;grid-template-columns:235px 1fr;gap:38px;align-items:center}
.section-heading--left>p:last-child{color:var(--muted);font-size:12px}
.program-panel{border:1px solid #e4e1dc;border-radius:var(--radius-sm);overflow:hidden}
.program-tabs{display:flex;background:#f5f5f4}
.program-tab{border:0;border-right:1px solid #ddd;background:transparent;cursor:pointer;flex:1;padding:14px 12px;color:var(--ink);font-size:13.5px;font-weight:700;white-space:nowrap;min-height:44px;transition:background .3s var(--ease-out),color .3s var(--ease-out)}
.program-tab.is-active{background:var(--navy);color:#fff}
.program-content{display:none;grid-template-columns:250px 1fr;gap:25px;padding:0 20px 0 0;min-height:144px}
.program-content.is-active{display:grid}
.program-content{opacity:1;transition:opacity .22s var(--ease-out)}
.program-content.is-switching{opacity:0}
.program-image{height:165px;overflow:hidden;border-radius:var(--radius-sm)}
.program-details{padding:22px 0}
.program-details h3{font:700 18px 'Playfair Display',Georgia,serif;color:var(--navy);margin:0 0 14px}
.program-details ul{list-style:none;padding:0;margin:0 0 14px;display:grid;grid-template-columns:1fr 1fr;gap:9px 25px}
.program-details li{font-size:13px;color:#424a53;display:flex;align-items:center;gap:8px}
.program-details li .icon{width:12px;height:12px;color:var(--gold);flex-shrink:0}

/* =====================================================================
   Facilities
   ===================================================================== */
.section--facilities{background:#fcfbf8;padding-top:47px}
.facility-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.facility-grid--list{grid-template-columns:repeat(3,1fr)}
.facility-grid--list .facility-card{height:220px}
.facility-card{height:156px;border-radius:var(--radius);overflow:hidden;position:relative;background:#ddd;box-shadow:var(--shadow-sm);transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out)}
.facility-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.facility-card img{transition:transform .5s var(--ease-out)}
.facility-card:hover img{transform:scale(1.15)}
.facility-card:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 32%,rgba(3,20,41,.85))}
.facility-card__overlay{position:absolute;bottom:15px;left:17px;right:12px;display:flex;align-items:center;gap:10px;color:#fff;z-index:1}
.facility-card__icon{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--navy);color:var(--gold-light);flex-shrink:0;transition:transform .3s var(--ease-out)}
.facility-card__icon .icon{width:17px;height:17px}
.facility-card:hover .facility-card__icon{transform:scale(1.12)}
.facility-card h3{font:600 16px 'DM Sans',Arial,sans-serif;margin:0}

/* =====================================================================
   Student life / achievements / principal
   ===================================================================== */
.section--life{background:#fff}
.life-cards{display:grid;grid-template-columns:1.15fr 1fr;gap:28px;align-items:stretch}
.story-card{background:#fff;border:1px solid var(--border-card);border-radius:var(--radius-lg);box-shadow:var(--shadow);overflow:hidden;transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out)}
.story-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.story-card__media{height:230px;overflow:hidden}
.story-card__media img{transition:transform .5s var(--ease-out)}
.story-card:hover .story-card__media img{transform:scale(1.05)}
.story-card__body{padding:32px}
.story-card--media-bottom .story-card__media{height:180px}
.story-card__body .icon-list{margin:0 0 22px}
.icon-list{list-style:none;padding:0;margin:0;display:grid;gap:11px;color:#4f5761;font-size:13.5px}
.icon-list li{display:flex;align-items:center;gap:10px}
.icon-list li .icon{width:14px;height:14px;color:var(--gold);flex-shrink:0}
.timeline{list-style:none;margin:0 0 18px;padding:0 0 0 18px;border-left:1px solid #d9c59e;display:grid;gap:11px}
.timeline li{display:flex;gap:14px;font-size:13px;position:relative}
.timeline li:before{content:"";position:absolute;width:7px;height:7px;background:var(--gold);border-radius:50%;left:-22px;top:5px}
.timeline b{color:var(--gold);font-weight:700}
.timeline span{color:#4f5761}
.principal-card{margin-top:28px;display:flex;min-height:210px;border-radius:var(--radius-lg);overflow:hidden;background:var(--navy);color:#fff;position:relative;box-shadow:var(--shadow-lg)}
.principal-card__copy{padding:28px 34px;max-width:53%;position:relative;z-index:1}
.principal-card blockquote{font:500 22px/1.45 'Playfair Display',Georgia,serif;margin:12px 0 16px}
.principal-card cite,.principal-card small{display:block;font-family:'Playfair Display',Georgia,serif}
.principal-card cite{font-size:17px;color:var(--gold-2)}
.principal-card small{font-size:11px;margin-top:1px}
.principal-card__portrait{width:44%;margin-left:auto;overflow:hidden;opacity:.96}
.principal-card__portrait img{object-position:center 15%;filter:saturate(.8)}

.desk-message{display:flex;align-items:stretch;min-height:210px;border-radius:var(--radius-lg);overflow:hidden;background:var(--navy);color:#fff;box-shadow:var(--shadow-lg)}
.desk-message__copy{padding:32px 36px;max-width:56%;display:flex;flex-direction:column;justify-content:center}
.desk-message__copy blockquote{font:500 21px/1.5 'Playfair Display',Georgia,serif;margin:12px 0 16px}
.desk-message__copy cite,.desk-message__copy small{display:block;font-family:'Playfair Display',Georgia,serif}
.desk-message__copy cite{font-size:17px;color:var(--gold-2);font-style:normal}
.desk-message__copy small{font-size:11px;margin-top:1px}
.desk-message__portrait{width:44%;margin-left:auto;overflow:hidden}
.desk-message__portrait img{width:100%;height:100%;object-fit:cover;object-position:center 15%;filter:saturate(.8)}

.letter-card{display:grid;grid-template-columns:.85fr 1.15fr;gap:38px;align-items:start;background:#fff;border:1px solid var(--border-card);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:38px}
.letter-card__portrait{border-radius:var(--radius-sm);overflow:hidden;aspect-ratio:3/4}
.letter-card__salutation{font:700 29px 'Playfair Display',Georgia,serif;color:var(--navy);margin:0 0 6px}
.letter-card__body p{color:#424a53;font-size:14.5px;line-height:1.85;margin:0 0 16px}
.letter-card__signoff{margin:22px 0 0;font:600 14px 'DM Sans',Arial,sans-serif;color:var(--ink)}
.letter-card__name{margin:4px 0 0;font:700 20px 'Playfair Display',Georgia,serif;color:var(--navy)}
.letter-card__role{margin:2px 0 0;font-size:12px;color:var(--muted)}

/* =====================================================================
   Gallery
   ===================================================================== */
.section--gallery{padding-top:52px}
.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.gallery-grid--photos{grid-template-columns:repeat(3,1fr)}
.gallery-grid--photos .gallery-item{height:260px}
.gallery-item{height:220px;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);transition:box-shadow .3s var(--ease-out)}
.gallery-item:hover{box-shadow:var(--shadow)}
.gallery-figure[hidden]{display:none}
/* Gallery photo with its admin-written Title underneath (Academics/Achievements galleries) */
.gallery-figure{margin:0}
.gallery-figure figcaption{margin-top:10px;padding:0 4px;text-align:center;color:var(--navy);font:600 14px/1.45 'DM Sans',Arial,sans-serif;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media(max-width:760px){.gallery-figure figcaption{font-size:13px;margin-top:8px}}
.gallery-item img{transition:transform .4s var(--ease-out);cursor:zoom-in}

.filter-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:0 0 28px}
.filter-tab{border:1px solid var(--border-card);border-radius:999px;background:#fff;color:var(--ink);font:700 13px 'DM Sans',Arial,sans-serif;padding:9px 22px;cursor:pointer;transition:background .25s var(--ease-out),color .25s var(--ease-out),border-color .25s var(--ease-out)}
.filter-tab:hover{border-color:var(--navy)}
.filter-tab.is-active{background:var(--navy);border-color:var(--navy);color:#fff}
.gallery-item a img{cursor:pointer}
.gallery-item:hover img{transform:scale(1.15)}

/* =====================================================================
   Admissions / testimonial / events / community
   ===================================================================== */
.section--community{background:#fff;border-top:1px solid #f0ede7;padding-top:48px}
.community-grid{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:32px}
.community-grid h2{font-size:24px}
.steps{display:flex;align-items:center;justify-content:space-between;margin:26px 0 22px}
.step{text-align:center}
.step b{display:block;font:700 19px 'Playfair Display',Georgia,serif;color:var(--navy)}
.step__icon{display:grid;place-items:center;color:var(--gold);margin:0 auto}
.step__icon .icon{width:24px;height:24px}
.step p{font-size:12px;line-height:1.35;margin:2px 0;color:#4f5761}
.steps>i{font-style:normal;color:#89909a}
.testimonial{position:relative;padding-left:2px}
.quote-mark{position:absolute;left:0;top:82px;color:var(--gold);font:700 42px Georgia,serif}
.testimonial blockquote{margin:31px 0 12px;padding:26px 25px 22px 37px;background:#fbfaf7;border-radius:var(--radius-sm);font:500 17px/1.7 'Playfair Display',Georgia,serif;color:#39404a}
.testimonial cite{font-size:13px;margin-left:35px}
.slider-dots{display:flex;gap:5px;justify-content:center;margin-top:16px}
.slider-dots span{width:5px;height:5px;background:#d7d3cb;border-radius:50%}
.slider-dots span.is-active{background:var(--gold);width:8px;border-radius:5px}
.event-list{border:1px solid #e8e4dc;border-radius:var(--radius-sm);overflow:hidden;margin:25px 0 15px}
.event-list>div,.event-list>a{display:flex;align-items:center;gap:15px;border-bottom:1px solid #eeeae2;padding:9px 12px;color:inherit;text-decoration:none;transition:background .2s var(--ease-out)}
.event-list>a:hover{background:var(--cream)}
.event-list>div:last-child,.event-list>a:last-child{border-bottom:0}
.event-list b{font:700 21px/1 'Playfair Display',Georgia,serif;color:var(--navy);text-align:center;min-width:32px}
.event-list small{display:block;font:700 10.5px 'DM Sans',Arial,sans-serif;color:var(--gold);margin-top:3px}
.event-list span{font-size:13px}

/* =====================================================================
   Events listing (events.php)
   ===================================================================== */
.events-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:24px}
.event-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--border-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow:hidden;text-decoration:none;color:inherit;transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out)}
.event-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.event-card__media{height:240px;overflow:hidden;background:#ddd}
.event-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease-out)}
.event-card:hover .event-card__media img{transform:scale(1.15)}
.event-card__body{padding:18px 22px 22px}
.event-card__date{display:inline-block;font:700 11px 'DM Sans',Arial,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.event-card__body h3{font:700 19px 'Playfair Display',Georgia,serif;color:var(--navy);margin:0 0 8px}
.event-card__body p{color:var(--muted);font-size:13.5px;line-height:1.6;margin:0}

/* Facility/event detail pages: the page-hero banner already carries the
   title in large type over the photo, so the body below never repeats it --
   just an optional short intro line, then the photo grid takes over. */
.detail-intro{display:flex;flex-wrap:wrap;align-items:center;gap:16px 22px;margin-bottom:18px}
.detail-intro__date{display:inline-block;font:700 12px 'DM Sans',Arial,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:var(--gold)}
.detail-intro__text{color:var(--ink-soft);font-size:17px;line-height:1.85;margin:0 0 8px;max-width:640px}
.detail-photos-label{text-align:center;margin-bottom:22px}

/* Enlargeable images: the photo-highlights grid on the event/facility detail
   pages -- clicking opens assets/js/main.js's lightbox; hovering hints at that. */
.gallery-grid--photos .gallery-item img{cursor:zoom-in;transition:transform .4s var(--ease-out)}
.gallery-grid--photos .gallery-item:hover img{transform:scale(1.04)}

.lightbox{position:fixed;inset:0;z-index:200;display:flex;flex-direction:column;background:rgba(3,20,41,.97);opacity:0;visibility:hidden;transition:opacity .25s var(--ease-out)}
.lightbox.is-open{opacity:1;visibility:visible}
.lightbox__image{flex:1 1 0;min-height:0;width:100%;object-fit:contain;cursor:default}
.lightbox__close{position:absolute;top:20px;right:24px;width:40px;height:40px;border-radius:50%;border:0;background:rgba(255,255,255,.12);color:#fff;font-size:22px;line-height:1;cursor:pointer;transition:background .2s var(--ease-out)}
.lightbox__close:hover{background:rgba(255,255,255,.22)}
.lightbox__caption{flex:0 0 auto;max-height:34vh;overflow-y:auto;padding:18px 32px 24px;background:#031429;border-top:1px solid rgba(255,255,255,.14);color:#fff;text-align:center}
.lightbox__caption[hidden]{display:none}
.lightbox__caption strong{display:block;font:700 22px 'Playfair Display',Georgia,serif}
.lightbox__caption p{margin:8px auto 0;max-width:760px;font-size:15px;line-height:1.7;white-space:pre-line}
.lightbox__caption p:empty{display:none}
.lightbox__link{display:inline-block;margin-top:12px;color:var(--gold-light);font:700 13px 'DM Sans',Arial,sans-serif;letter-spacing:.04em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid currentColor}
.lightbox__link[hidden]{display:none}
@media(max-width:760px){.lightbox__caption{padding:14px 18px 18px}.lightbox__caption strong{font-size:18px}.lightbox__caption p{font-size:14px}}

/* =====================================================================
   Metrics band
   ===================================================================== */
.metrics-band{background:var(--navy);color:#fff;padding:24px 0}
.metrics-grid{display:grid;grid-template-columns:repeat(6,1fr)}
.metrics-grid>div{text-align:center;border-right:1px solid rgba(255,255,255,.17)}
.metrics-grid>div:last-child{border-right:0}
.metrics-grid strong{display:block;color:#fff;font:700 30px 'Playfair Display',Georgia,serif}
.metrics-grid span{display:block;color:#dce1e8;font-size:12px}

/* =====================================================================
   Footer
   ===================================================================== */
.site-footer{background:var(--navy-footer);color:#e5e9ed}
.footer-main{display:grid;grid-template-columns:1.4fr .8fr .8fr 1.1fr;gap:32px;padding:56px 0 40px}
.brand--footer{color:#fff}
.brand--footer .brand__crest{color:var(--gold-2);border-color:var(--gold-2)}
.brand--footer small{color:var(--footer-muted)}
.footer-brand>p{font-size:12px;color:var(--footer-muted);max-width:260px;line-height:1.75;margin-top:14px}
.socials{display:flex;gap:10px;margin-top:18px}
.socials a{display:grid;place-items:center;border:1px solid #6d7987;border-radius:50%;width:36px;height:36px;transition:background .25s var(--ease-out),border-color .25s var(--ease-out),transform .25s var(--ease-out)}
.socials a .icon{width:15px;height:15px}
.socials a:hover{background:var(--gold);border-color:var(--gold);color:var(--navy-footer);transform:translateY(-3px)}
.footer-column h3{color:var(--gold-2);font-size:11px;text-transform:uppercase;letter-spacing:.7px;margin:4px 0 16px}
.footer-column a,.footer-contact p{display:block;color:#b7c0cc;font-size:13px;margin:9px 0;transition:color .2s var(--ease-out)}
.footer-column a:hover{color:var(--gold-light)}
.footer-contact p{display:flex;align-items:flex-start;gap:8px;line-height:1.55}
.footer-contact p .icon{width:13px;height:13px;margin-top:2px;color:var(--gold-2);flex-shrink:0}
.footer-contact__cta{margin-top:16px;color:var(--gold-2);border-color:var(--gold-2)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.15);display:flex;justify-content:space-between;padding:13px 0;font-size:11px;color:#aab4c0}
.footer-bottom b{color:var(--gold-2)}
.footer-bottom__credit{display:inline-flex;align-items:center;gap:5px}
.footer-bottom__heart{width:12px;height:12px;color:var(--gold-2)}

/* =====================================================================
   Accessibility / touch-target utilities
   ===================================================================== */
:focus-visible{outline:3px solid #f1bd55;outline-offset:3px}
html,body{overflow-x:hidden}
img{max-width:100%}
.menu-toggle{min-width:44px;min-height:44px}

.mobile-call-fab{display:none;position:fixed;right:16px;bottom:16px;z-index:50;width:52px;height:52px;border-radius:50%;background:var(--navy);color:#e5b350;box-shadow:0 8px 20px rgba(6,30,61,.35);align-items:center;justify-content:center}
.mobile-call-fab .icon{width:22px;height:22px}
@media(max-width:760px){
    .mobile-call-fab{display:flex}
    .navbar__menu{max-height:calc(100vh - 74px);overflow-y:auto;overscroll-behavior:contain}
    .program-panel{min-width:0;max-width:100%}
    .program-tabs{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin}
    .program-tab{min-height:44px}
    .program-content{min-width:0}
    .program-details{min-width:0}
    .program-details ul{min-width:0}
    .program-details li{overflow-wrap:anywhere}
    .text-button{max-width:100%;white-space:normal;text-align:left}
}
@media(max-width:430px){
    .container{width:calc(100% - 28px)}
    .navbar__inner{gap:8px}
    .brand{gap:8px;min-width:0}
    .brand__crest{flex:0 0 39px;width:39px;height:44px;font-size:22px}
    .brand strong{font-size:11.5px;letter-spacing:0}
    .brand small{font-size:6px;white-space:nowrap}
    .hero,.hero__inner{min-height:650px}
    .hero__inner{padding-top:52px}
    .hero h1{font-size:clamp(33px,10vw,40px);letter-spacing:-.8px}
    .hero__intro{font-size:13px;max-width:270px}
    .hero__actions{display:grid;grid-template-columns:1fr;gap:9px;max-width:260px}
    .hero__actions .button{width:100%}
    .hero__stats{grid-template-columns:1fr 1fr;gap:7px;margin-top:34px}
    .hero-stat{min-width:0;padding:9px 8px;gap:8px}
    .hero-stat__icon{width:29px;height:29px;flex:0 0 29px}
    .hero-stat__icon .icon{width:15px;height:15px}
    .hero-stat strong{font-size:17px}
    .hero-stat small{font-size:8px;line-height:1.2}
    .hero__ornament{font-size:110px;bottom:-12px}
    .section{padding:40px 0}
    .section-heading h2{font-size:25px}
    .section-heading--center{margin-bottom:23px}
    .feature-track__set{gap:7px}
    .feature-card{min-height:162px;padding:16px 10px}
    .feature-card h3{font-size:12.5px}
    .feature-card p{font-size:10.5px}
    .about-gallery__image{height:86px}
    .about-gallery__image--large{height:164px}
    .about-copy h2{font-size:25px}
    .about-copy>p:not(.eyebrow){font-size:11px}
    .about-stats{margin-top:34px}
    .about-stat{padding:18px 8px}
    .about-stat strong{font-size:22px}
    .about-stat span{font-size:10px}
    .program-details ul{grid-template-columns:1fr;gap:6px}
    .program-details{padding:16px 14px}
    .program-image{height:165px}
    .facility-card{height:118px}
    .section-heading--with-action .text-button{align-self:flex-start}
    .story-card__media{height:190px}
    .story-card--media-bottom .story-card__media{height:140px}
    .story-card__body{padding:22px}
    .principal-card{display:flex;flex-direction:column;min-height:0;margin-top:30px}
    .principal-card__copy{max-width:100%;padding:23px 18px 10px}
    .principal-card blockquote{font-size:17px;margin:11px 0 13px}
    .principal-card__portrait{position:relative;right:auto;bottom:auto;width:100%;height:185px;margin:8px 0 0;opacity:.9}
    .gallery-item{height:88px}
    .steps{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:22px 0}
    .steps>i{display:none}
    .step{min-height:88px;padding:8px 4px;border:1px solid #eee8dd;border-radius:var(--radius-sm)}
    .step p{font-size:9px}
    .metrics-grid{grid-template-columns:1fr 1fr;row-gap:14px}
    .metrics-grid>div:nth-child(2n){border-right:0}
    .metrics-grid>div:nth-child(3){border-right:1px solid rgba(255,255,255,.17)}
    .metrics-grid strong{font-size:20px}
    .footer-bottom{overflow-wrap:anywhere}
}
@media(max-width:360px){
    .container{width:calc(100% - 24px)}
    .brand strong{font-size:10.5px}
    .brand small{display:none}
    .hero,.hero__inner{min-height:700px}
    .hero__inner{padding-top:44px}
    .hero h1{font-size:32px}
    .hero__stats{grid-template-columns:1fr}
    .hero-stat{padding:10px 12px}
    .hero-stat small{font-size:9px}
    .feature-card{flex:0 0 78vw;max-width:260px;min-height:auto;padding:16px 18px}
    .feature-track{animation-duration:18s}
    .about-stats{grid-template-columns:1fr}
    .about-stat{border-right:0;border-bottom:1px solid var(--line)}
    .about-stat:last-child{border-bottom:0}
    .about-gallery__image{height:76px}
    .about-gallery__image--large{height:146px}
    .facility-grid{grid-template-columns:1fr}
    .gallery-grid{grid-template-columns:1fr 1fr}
    .gallery-item{height:82px}
    .steps{grid-template-columns:1fr}
    .step{min-height:74px}
    .metrics-grid{grid-template-columns:1fr 1fr}
    .footer-main{grid-template-columns:1fr}
    .footer-column,.footer-contact{grid-column:auto}
}
@media(min-width:1101px){
    .hero__students{position:absolute;right:220px;bottom:0;width:43%;height:96%;z-index:0;overflow:hidden;pointer-events:none;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 17%,#000 88%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0%,#000 17%,#000 88%,transparent 100%)}
    .hero__students img{object-position:center center;filter:saturate(.82) contrast(1.03)}
}
@media(min-width:761px) and (max-width:1100px){
    .hero__students{position:absolute;right:190px;bottom:0;width:45%;height:92%;z-index:0;overflow:hidden;opacity:.86;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 20%,#000 90%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0%,#000 20%,#000 90%,transparent 100%)}
}
@media(max-width:760px){
    .hero__students{display:none}
}

/* =====================================================================
   Inner-page components (subpages: about, contact, admissions, etc.)
   NOTE: this section's base/unconditional rules must stay ABOVE the
   "Responsive — general layout breakpoints" section below, since that
   section contains narrower-viewport overrides for these same classes
   (.card-grid--4, .contact-grid, .page-hero, .desk-message, etc.) —
   if this block moves after that one, the overrides get cascade-
   shadowed by these unconditional rules and mobile layouts break.
   ===================================================================== */
.page-hero{position:relative;overflow:hidden;background:var(--navy-hero);color:#fff;min-height:330px;display:flex;align-items:center}
.page-hero__backdrop{position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,24,51,.93) 0%,rgba(3,24,51,.82) 45%,rgba(3,24,51,.55) 100%)}
.page-hero__backdrop img{width:100%;height:100%;object-fit:cover;opacity:.55}
.page-hero__inner{position:relative;z-index:1;padding-block:40px}
.breadcrumb{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:0 0 16px;padding:0;font-size:12px;color:var(--footer-line)}
.breadcrumb li{display:flex;align-items:center;gap:6px}
.breadcrumb li+li:before{content:"›";color:var(--gold-light)}
.breadcrumb a{color:var(--footer-line);transition:color .2s var(--ease-out)}
.breadcrumb a:hover{color:var(--gold-light)}
.breadcrumb li[aria-current="page"]{color:var(--gold-light);font-weight:600}
.page-hero__title{margin:0 0 12px;font:700 clamp(34px,4.4vw,54px)/1.1 'Playfair Display',Georgia,serif;color:#fff}
.page-hero__subtitle{margin:0;max-width:580px;font-size:15.5px;line-height:1.65;color:#e3e7ee}

.card-grid{display:grid;gap:22px}
.card-grid--2{grid-template-columns:1fr 1fr}
.card-grid--3{grid-template-columns:repeat(3,1fr)}
.card-grid--4{grid-template-columns:repeat(4,1fr)}
.card-grid--5{grid-template-columns:repeat(5,1fr)}
.info-card{background:#fff;border:1px solid var(--border-card);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:28px 24px;text-align:left;transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out)}
.info-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.info-card:hover .info-card__icon{transform:scale(1.1) rotate(-4deg)}
.info-card__icon{display:grid;place-items:center;width:52px;height:52px;margin-bottom:16px;background:var(--navy);color:var(--gold-light);border-radius:50%;transition:transform .3s var(--ease-out)}
.info-card__icon .icon{width:23px;height:23px}
.info-card h3{font:700 17px 'Playfair Display',Georgia,serif;color:var(--navy);margin:0 0 9px}
.info-card p{color:var(--muted);font-size:13px;line-height:1.6;margin:0}
.info-card p+p{margin-top:2px;font-weight:600;color:var(--ink)}

.value-card{text-align:center;padding:26px 18px}
.value-card .info-card__icon{margin-inline:auto}

.big-card{background:#fff;border:1px solid var(--border-card);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:40px 32px;transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out)}
.big-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.big-card__icon{display:grid;place-items:center;width:66px;height:66px;margin:0 auto 20px;background:var(--navy);color:var(--gold-light);border-radius:50%;transition:transform .3s var(--ease-out)}
.big-card__icon .icon{width:28px;height:28px}
.big-card:hover .big-card__icon{transform:scale(1.08) rotate(-4deg)}
.big-card h3{text-align:center;font:700 25px 'Playfair Display',Georgia,serif;color:var(--navy);margin:0 0 8px}
.big-card .gold-rule{margin-inline:auto}
.big-card p{text-align:center;color:var(--muted);font-size:14px;line-height:1.8;margin:0}

.pullquote-banner{background:var(--navy);color:#fff;padding:64px 0;text-align:center;position:relative;box-shadow:var(--shadow-lg)}
.pullquote-banner__mark{color:var(--gold-light);font:700 50px Georgia,serif;line-height:1;margin-bottom:6px}
.pullquote-banner blockquote{max-width:860px;margin:0 auto;font:500 clamp(19px,2.1vw,26px)/1.55 'Playfair Display',Georgia,serif;color:#f3f0e8}

.cta-banner{background:linear-gradient(135deg,var(--navy),var(--navy-2));color:#fff;border-radius:var(--radius-lg);padding:44px 40px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;box-shadow:var(--shadow-lg)}
.cta-banner--gold{background:var(--gradient-gold)}
.cta-banner h3{margin:0 0 5px;font:700 25px 'Playfair Display',Georgia,serif}
.cta-banner p{margin:0;font-size:13px;color:rgba(255,255,255,.85)}
.cta-banner__actions{display:flex;gap:12px;flex-wrap:wrap}

.contact-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:32px;align-items:start}
.contact-panel{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:34px}
.contact-panel h2{font:700 27px 'Playfair Display',Georgia,serif;color:var(--navy);margin:0 0 9px}
.contact-panel>p{color:var(--muted);font-size:13px;margin:0 0 24px}
.contact-form{display:grid;gap:16px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form-field{display:grid;gap:7px}
.form-field label{font-size:11px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--muted)}
.form-field input,.form-field textarea{border:1px solid var(--line);border-radius:var(--radius-sm);padding:13px 15px;font-size:13.5px;color:var(--ink);background:#fff;width:100%;transition:border-color .2s var(--ease-out)}
.form-field textarea{resize:vertical;min-height:130px}
.form-field input:focus,.form-field textarea:focus{outline:2px solid var(--gold-light);outline-offset:1px}

.map-block{border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow);background:#fff}
.map-block__frame{width:100%;aspect-ratio:16/11;border:0;display:block}
.map-block__address{padding:22px 24px}
.map-block__address h3{font:700 17px 'Playfair Display',Georgia,serif;color:var(--navy);margin:0 0 9px}
.map-block__address p{margin:0 0 13px;font-size:13px;color:var(--muted);line-height:1.6}

.data-table-wrap{overflow-x:auto;border-radius:var(--radius);box-shadow:var(--shadow)}
.data-table{width:100%;border-collapse:collapse;background:#fff;min-width:640px}
.data-table th{background:var(--navy);color:#fff;text-align:left;padding:16px 18px;font-size:11.5px;text-transform:uppercase;letter-spacing:.5px;font-weight:700;white-space:nowrap}
.data-table td{padding:16px 18px;border-bottom:1px solid var(--line);font-size:13.5px;color:var(--ink)}
.data-table tbody tr:nth-child(even){background:var(--cream)}
.data-table tbody tr:last-child td{border-bottom:0}
.data-table tbody tr{transition:background .2s var(--ease-out)}
.data-table tbody tr:hover{background:var(--navy-tint)}
.data-table tr.data-table__group td{background:#f1ecdf;font-weight:700;color:var(--navy);font-size:12px;text-transform:uppercase;letter-spacing:.4px}

.note-banner{background:var(--navy);color:#fff;border-radius:var(--radius-lg);padding:30px 32px;box-shadow:var(--shadow-lg)}
.note-banner h3{margin:0 0 14px;color:var(--gold-2);font:700 16px 'Playfair Display',Georgia,serif}
.note-banner ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.note-banner li{font-size:13px;line-height:1.5;color:#e6e9ee;padding-left:22px;position:relative}
.note-banner li:before{content:"✓";position:absolute;left:0;color:var(--gold-2)}

.bullet-card{background:#fff;border:1px solid var(--border-card);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:30px}
.bullet-card h3{margin:0 0 18px;font:700 18px 'Playfair Display',Georgia,serif;color:var(--navy)}
.bullet-card ul{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.bullet-card li{font-size:13.5px;color:#424a53;padding-left:24px;position:relative;line-height:1.5}
.bullet-card li:before{content:"✓";position:absolute;left:0;color:var(--gold);font-weight:700}

.help-card{background:var(--cream);border:1px dashed var(--gold);border-radius:var(--radius-lg);padding:28px 32px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.help-card h3{margin:0 0 5px;font:700 18px 'Playfair Display',Georgia,serif;color:var(--navy)}
.help-card p{margin:0;font-size:13px;color:var(--muted)}

/* =====================================================================
   Responsive — general layout breakpoints
   (must stay BELOW "Inner-page components" — see note above)
   ===================================================================== */
@media(max-width:1100px){
    .container{width:min(100% - 42px,1000px)}
    .topbar__inner{gap:15px}
    .topbar__contact{gap:13px}
    .navbar__menu{gap:15px}
    .feature-card{flex:0 0 195px}
    .feature-track{animation-duration:26s}
    .about-grid{grid-template-columns:1fr 1fr}
    .community-grid{gap:20px}
    .footer-main{grid-template-columns:1fr 1fr;row-gap:35px}
    .footer-brand{grid-column:1/-1}
    .card-grid--4{grid-template-columns:repeat(2,1fr)}
    .card-grid--5{grid-template-columns:repeat(3,1fr)}
    .contact-grid{grid-template-columns:1fr}
    .about-grid--split,.about-grid--split-reverse{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
    body{font-size:14px}
    .container{width:min(100% - 32px,600px)}
    .topbar{display:none}
    .navbar__inner{min-height:74px}
    .brand__crest{width:43px;height:48px;font-size:24px}
    .brand strong{font-size:13px}
    .brand small{font-size:7px}
    .menu-toggle{display:block}
    .navbar__menu{display:none;position:absolute;top:74px;left:0;right:0;padding:16px;background:#fff;border-top:1px solid var(--line);box-shadow:var(--shadow);flex-direction:column;align-items:stretch;gap:0}
    .navbar__menu.is-open{display:flex}
    .navbar__menu>a:not(.button){padding:11px 8px}
    .navbar__menu>a:not(.button):after{bottom:5px}
    .navbar__menu .button{margin-top:8px}
    .navbar__menu .nav-dropdown{width:100%}
    .navbar__menu .nav-dropdown__trigger{width:100%;justify-content:space-between;padding:11px 8px}
    .navbar__menu .nav-dropdown__panel{position:static;display:none;box-shadow:none;padding:0 0 0 14px;background:transparent}
    .navbar__menu .nav-dropdown.is-open .nav-dropdown__panel{display:block}
    .navbar__menu .nav-dropdown__panel a{padding:9px 8px;font-size:11px}
    .hero,.hero__inner{min-height:610px}
    .hero__backdrop{background:linear-gradient(180deg,rgba(3,24,51,.65),rgba(3,24,51,.96) 72%),var(--hero-bg-image,url('https://images.unsplash.com/photo-1580582932707-520aed937b7b?auto=format&fit=crop&w=1000&q=85')) center/cover}
    .hero__inner{display:block;padding-top:72px}
    .hero__copy{padding:0}
    .hero h1{font-size:42px}
    .hero__intro{font-size:14px}
    .hero__stats{width:100%;grid-template-columns:1fr 1fr;margin-top:43px}
    .hero-stat{padding:10px}
    .hero-stat strong{font-size:19px}
    .section{padding:48px 0}
    .section-heading h2{font-size:27px}
    .feature-card{flex:0 0 185px;min-height:158px}
    .feature-track{animation-duration:22s}
    .about-grid,.programs-grid,.life-cards,.community-grid{display:block}
    .about-copy{margin-top:29px}
    .about-stats{margin-top:34px;grid-template-columns:1fr 1fr}
    .about-stat{border-bottom:1px solid var(--line)}
    .about-stat:nth-child(2n){border-right:0}
    .about-stat:nth-last-child(-n+2){border-bottom:0}
    .programs-grid>.section-heading{margin-bottom:25px}
    .program-tabs{overflow-x:auto}
    .program-tab{flex:0 0 auto}
    .program-content{grid-template-columns:1fr;padding:0 0 20px}
    .program-image{height:180px}
    .program-details{padding:18px}
    .facility-grid{grid-template-columns:1fr 1fr}
    .facility-card{height:130px}
    .section-heading--with-action{align-items:start;flex-direction:column}
    .story-card+.story-card{margin-top:24px}
    .story-card__media{height:220px}
    .story-card--media-bottom .story-card__media{height:170px}
    .principal-card{margin-top:35px;min-height:370px}
    .principal-card__copy{max-width:100%;padding:25px 22px;align-self:flex-start}
    .principal-card__portrait{position:absolute;bottom:0;right:0;height:190px;width:50%;opacity:.85}
    .principal-card blockquote{font-size:18px}
    .gallery-grid{grid-template-columns:repeat(3,1fr)}
    .gallery-item{height:95px}
    .admission-process,.testimonial,.events{margin-bottom:44px}
    .steps{gap:5px}
    .steps>i{font-size:12px}
    .step p{font-size:8px}
    .community-grid h2{font-size:24px}
    .metrics-grid{grid-template-columns:repeat(3,1fr);row-gap:16px}
    .metrics-grid>div:nth-child(3){border-right:0}
    .footer-main{grid-template-columns:1fr 1fr;gap:30px}
    .footer-brand{grid-column:1/-1}
    .footer-bottom{gap:10px;flex-direction:column}
    .footer-contact{grid-column:auto}
    .page-hero{min-height:0}
    .page-hero__inner{padding-block:28px}
    .page-hero__subtitle{font-size:13px}
    .about-grid--split,.about-grid--split-reverse{display:block}
    .about-grid--split .about-copy,.about-grid--split-reverse .about-copy{margin-top:24px}
    .about-grid--split-reverse .about-gallery__image{order:-1}
    .desk-message{flex-direction:column;min-height:0}
    .desk-message__copy{max-width:100%;padding:24px 22px}
    .desk-message__portrait{width:100%;height:220px;margin-left:0}
    .letter-card{grid-template-columns:1fr;padding:24px}
    .letter-card__portrait{max-height:280px}
    .card-grid--2,.card-grid--3,.card-grid--4,.card-grid--5{grid-template-columns:1fr 1fr}
    .cta-banner{flex-direction:column;text-align:center;padding:30px 24px}
    .cta-banner__actions{justify-content:center}
    .contact-panel{padding:22px}
    .form-row{grid-template-columns:1fr}
    .help-card{flex-direction:column;text-align:center}
}
@media(max-width:400px){
    .hero h1{font-size:36px}
    .hero__stats{grid-template-columns:1fr}
    .facility-grid{grid-template-columns:1fr}
    .gallery-grid{grid-template-columns:repeat(2,1fr)}
    .footer-main{grid-template-columns:1fr}
    .footer-column,.footer-contact{grid-column:auto}
}
@media(max-width:430px){
    .card-grid--2,.card-grid--3,.card-grid--4,.card-grid--5{grid-template-columns:1fr}
    .big-card{padding:26px 20px}
    .page-hero__title{font-size:26px}
    .desk-message__portrait{height:180px}
}

/* =====================================================================
   Homepage entrance + scroll-reveal animation
   ===================================================================== */
@keyframes heroFadeUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
.hero__copy{animation:heroFadeUp .8s var(--ease-out) both}
.hero__stats{animation:heroFadeUp .8s var(--ease-out) .15s both}
.hero__students{animation:heroFadeUp 1s var(--ease-out) .1s both}

.reveal-target{opacity:0;transform:translateY(28px);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}
.reveal-target.is-visible{opacity:1;transform:none}

.hero__rotate-text{transition:opacity .4s var(--ease-out)}
.hero__rotate-text.is-fading{opacity:0}

@media(prefers-reduced-motion:reduce){
    .hero__copy,.hero__stats,.hero__students{animation:none}
    .reveal-target{opacity:1;transform:none;transition:none}
    .feature-marquee{overflow-x:auto;-webkit-overflow-scrolling:touch}
    .feature-track{animation:none;width:auto}
    .feature-track__set:last-child{display:none}
    .hero__rotate-text{transition:none}
    .hero__backdrop{transition:none}
    .hero.is-animating-backdrop .hero__backdrop{transform:none}
    .icon,.button span,.text-button span,.feature-card__icon,.info-card__icon,.big-card__icon,.facility-card__icon,.feature-card,.info-card,.big-card,.story-card,.hero-stat,.socials a{transition:none}
    .feature-card:hover,.info-card:hover,.big-card:hover,.story-card:hover,.hero-stat:hover,.socials a:hover{transform:none}
    .feature-card:hover .feature-card__icon,.info-card:hover .info-card__icon,.big-card:hover .big-card__icon,.facility-card:hover .facility-card__icon{transform:none}
    .about-gallery__image img,.facility-card img,.story-card__media img,.gallery-item img{transition:none}
    .program-content{transition:none}
}