@import url("https://fonts.googleapis.com/css2?family=Bitter:wght@400;500;600;700&family=Manrope:wght@300;400;500;600;700&display=swap");

:root {
  --navy-950:#061625;
  --navy-900:#081b31;
  --navy-850:#0d2745;
  --blue-700:#245d91;
  --blue-100:#eef4f8;
  --nature:#4f7a58;
  --green-950:#061625;
  --green-850:#0d2745;
  --green-700:#245d91;
  --green-100:#eef4f8;
  --ivory:#fff;
  --warm-white:#fff;
  --mist:#f6f8fa;
  --accent:#2e7d32;
  --accent-soft:#4caf50;
  --accent-hover:#1b5e20;
  --charcoal:#101923;
  --muted:#4a555f;
  --line:rgba(8,27,49,.14);
  --shadow:0 24px 60px rgba(6,22,37,.15);
  --font-heading:Manrope, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-body:Bitter, Georgia, "Times New Roman", serif;
  --font-ui:Manrope, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --text-xs:clamp(.78rem,.74rem + .12vw,.86rem);
  --text-sm:clamp(.88rem,.84rem + .16vw,.96rem);
  --text-base:clamp(1.08rem,1.02rem + .32vw,1.2rem);
  --text-card:clamp(1rem,.96rem + .22vw,1.06rem);
  --text-lg:clamp(1.06rem,1rem + .35vw,1.25rem);
  --card-title:clamp(1.18rem,1.05rem + .55vw,1.45rem);
  --section-title:clamp(1.75rem,1.25rem + 2.35vw,2.75rem);
  --page-title:clamp(2.25rem,1.65rem + 3vw,3.5rem);
  --hero-title:clamp(2.35rem,1.35rem + 5.1vw,4.5rem);
  --lh-heading:1.08;
  --lh-title:1.18;
  --lh-body:1.66;
  --lh-ui:1.25;
}
*{box-sizing:border-box}
html.lenis,html.lenis body{height:auto;width:100%}.lenis.lenis-smooth{scroll-behavior:auto!important}.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}.lenis.lenis-stopped{overflow:hidden}.lenis.lenis-smooth iframe{pointer-events:none}
body{margin:0;background:var(--ivory);color:var(--charcoal);font-family:var(--font-body);font-size:var(--text-base);line-height:var(--lh-body);font-weight:400}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.skip-link{position:absolute;left:-999px;top:1rem;background:#fff;padding:.75rem 1rem;z-index:20}
.skip-link:focus{left:1rem}
.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}
.site-header{position:fixed;top:0;left:0;right:0;z-index:10;display:flex;align-items:center;gap:1rem;padding:1rem clamp(1rem,4vw,3rem);color:#fff;background:transparent;transition:background .18s,box-shadow .18s,color .18s}
.site-header.scrolled,.site-header.open{background:rgba(255,255,255,.97);color:var(--charcoal);box-shadow:0 12px 30px rgba(8,27,49,.08);backdrop-filter:blur(16px)}
.site-header.navigating{background:transparent;color:#fff;box-shadow:none;backdrop-filter:none;transition:none}
.brand{display:flex;align-items:center;gap:.7rem;font-family:var(--font-ui);font-weight:700;min-width:max-content}
/* Bare vector crest — no badge, no ring. The artwork is white-on-dark, so a
   navy variant is swapped in whenever the header goes light (scrolled / nav
   open); that keeps it legible without wrapping it in a container. */
.brand img{width:52px;height:52px;flex:none;object-fit:contain;display:block}
.brand .logo-dark{display:none}
.site-header.scrolled .brand .logo-light,
.site-header.open .brand .logo-light{display:none}
.site-header.scrolled .brand .logo-dark,
.site-header.open .brand .logo-dark{display:block}
@media (max-width:680px){.brand img{width:44px;height:44px}}
/* Two-line lockup:   [EMBLEM]  The Greenhills
                                PUBLIC SCHOOL
   NB: scope the grid to the DIRECT child span — `.brand span` also matched
   .brand-the and made it block-level, which stacked "The" on its own line. */
.brand > span{display:grid;line-height:1.14;align-content:center}
.brand strong{font-weight:700;font-size:1.16rem;letter-spacing:.005em;white-space:nowrap}
.brand small{font-size:.68rem;font-weight:600;letter-spacing:.19em;text-transform:uppercase;opacity:.92}
/* "The" stays inline and smaller so the pair reads as one name, with
   "Greenhills" dominant. */
.brand .brand-the{display:inline;font-size:.64em;font-weight:600;opacity:.92;letter-spacing:.03em;margin-right:.2em}
@media (max-width:680px){
  .brand{gap:.55rem}
  .brand strong{font-size:1rem}
  .brand small{font-size:.6rem;letter-spacing:.16em}
}
.main-nav{display:flex;gap:1rem;align-items:center;margin-left:auto;font-family:var(--font-ui);font-size:var(--text-sm);line-height:var(--lh-ui);font-weight:700}
.main-nav a{opacity:.9}.main-nav a:hover{color:var(--accent)}
.header-actions{display:flex;gap:.6rem;align-items:center}
.primary-button,.ghost-button,.light-button,.outline-button,.outline-light-button,.text-button,.film-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;border-radius:8px;font-family:var(--font-ui);font-size:.96rem;line-height:var(--lh-ui);font-weight:700;padding:.75rem 1rem;border:1px solid transparent;transition:transform .2s,background .2s,border-color .2s}
.primary-button{background:var(--accent);color:#fff;box-shadow:0 13px 28px rgba(46,125,50,.28)}.primary-button:hover{background:var(--accent-hover);transform:translateY(-2px);box-shadow:0 18px 38px rgba(46,125,50,.36)}.light-button:hover,.outline-button:hover{transform:translateY(-2px)}
.primary-button:focus-visible,.ghost-button:focus-visible,.light-button:focus-visible,.outline-button:focus-visible,.outline-light-button:focus-visible,.text-button:focus-visible,.film-button:focus-visible,.nav-toggle:focus-visible{outline:2px solid var(--accent-soft);outline-offset:3px}
.ghost-button{border-color:currentColor;color:inherit}.light-button{background:#fff;color:var(--navy-950)}.outline-button{border-color:rgba(13,39,69,.28);color:var(--navy-850);background:rgba(255,255,255,.55)}.outline-button:hover{border-color:var(--blue-700);background:#fff}.outline-light-button{border-color:rgba(255,255,255,.58);color:#fff}.large{padding:.95rem 1.2rem}.text-button{padding:.6rem 0}.light{color:#fff}
.nav-toggle{display:none;background:transparent;border:0;width:44px;height:44px;padding:10px}.nav-toggle span{display:block;height:2px;background:currentColor;margin:6px 0}
.hero{--hero-shift:0px;--hero-scale:1.12;position:relative;min-height:100svh;display:grid;place-items:center;overflow:hidden;background:var(--navy-950);isolation:isolate;padding:7rem 1rem 5.5rem}
.hero-video-wrap{position:absolute;inset:0;overflow:hidden;background:var(--navy-950)}
.hero-video-frame{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover;object-position:center center;border:0;pointer-events:none;opacity:1;transform:translate3d(0,calc(2vh + var(--hero-shift)),0) scale(var(--hero-scale));filter:saturate(1.03) contrast(1.06) brightness(1.06)}
.hero-shade{position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(6,22,37,.5),rgba(8,27,49,.12) 42%,rgba(6,22,37,.68)),linear-gradient(90deg,rgba(6,22,37,.56),rgba(8,27,49,.1),rgba(6,22,37,.42))}
.hero-content{position:relative;z-index:3;width:min(920px,calc(100% - 2rem));margin:auto;color:#fff;text-align:center}
h1,h2,h3{font-family:var(--font-heading);line-height:var(--lh-heading);font-weight:500;letter-spacing:.03em;margin:0 0 1rem;text-wrap:balance}
h1{font-size:var(--page-title)}
.hero h1{font-size:clamp(2.55rem,1.8rem + 3.75vw,5rem);line-height:1.04;font-weight:600;max-width:1060px;margin-left:auto;margin-right:auto}
h2{font-size:var(--section-title);line-height:var(--lh-title)}
h3{font-size:var(--card-title);line-height:1.28}
p{font-size:var(--text-base);line-height:var(--lh-body)}
.hero-line{font-family:var(--font-heading);font-size:clamp(1.25rem,1rem + 1.15vw,1.9rem);line-height:1.22;font-weight:700;max-width:820px;margin:0 auto 1rem;color:var(--accent-soft)}
.hero-copy{max-width:760px;font-size:clamp(1.02rem,.95rem + .45vw,1.28rem);line-height:1.58;color:rgba(255,255,255,.9);margin:0 auto 1.7rem;font-weight:500}
.hero-actions,.button-row{display:flex;flex-wrap:wrap;gap:.9rem;align-items:center;justify-content:center}
.film-button{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.42);font:inherit;cursor:pointer;backdrop-filter:blur(14px)}
.film-button:before{content:"";width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:9px solid currentColor;margin-right:.7rem}
.film-button:hover{background:rgba(255,255,255,.18);transform:translateY(-2px)}
.hero-film-control{position:absolute;right:clamp(1rem,3vw,2.2rem);bottom:clamp(1.2rem,3vw,2.2rem);z-index:3;width:44px;height:44px;border:1px solid rgba(255,255,255,.5);border-radius:50%;background:rgba(255,255,255,.08);backdrop-filter:blur(14px);display:grid;place-items:center;cursor:pointer;transition:transform .2s,background .2s}
.hero-film-control span{width:0;height:0;border-top:7px solid transparent;border-bottom:7px solid transparent;border-left:11px solid #fff;margin-left:3px}
.hero-film-control:hover{background:rgba(255,255,255,.18);transform:translateY(-2px)}
.scroll-cue{position:absolute;left:50%;bottom:2rem;width:28px;height:42px;border:1px solid rgba(255,255,255,.55);border-radius:20px;z-index:3;transform:translateX(-50%)}
.scroll-cue:after{content:"";position:absolute;left:50%;top:8px;width:5px;height:5px;background:#fff;border-radius:50%;transform:translateX(-50%);animation:cue 1.8s infinite}
@keyframes cue{0%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;transform:translate(-50%,18px)}}
.trust-strip{position:relative;margin:-4.5rem auto 0;width:min(1180px,calc(100% - 2rem));display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:rgba(8,27,49,.14);border-radius:8px;overflow:hidden;box-shadow:var(--shadow);z-index:2}
.stat{background:var(--warm-white);padding:1.3rem}.stat strong{display:block;font-family:var(--font-heading);font-size:clamp(1.12rem,1rem + .55vw,1.35rem);line-height:1.18;font-weight:700}.stat span{font-size:var(--text-xs);line-height:1.35;color:var(--muted);font-weight:700}
.section{padding:clamp(4rem,8vw,7.5rem) clamp(1rem,4vw,3rem)}
.boarding-preview{position:relative;background:linear-gradient(135deg,rgba(46,125,50,.04),rgba(6,22,37,.03));border-top:1px solid rgba(46,125,50,.12);border-bottom:1px solid rgba(46,125,50,.12)}
.boarding-preview::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--accent),var(--accent-soft),var(--accent));border-radius:0 4px 4px 0;opacity:0;transition:opacity .8s .2s}.boarding-preview.visible::before{opacity:1}
.split{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.section-copy{max-width:680px}.section-copy p,.section-head p{color:var(--muted);font-size:var(--text-base);line-height:var(--lh-body)}.section-kicker{font-family:var(--font-ui);font-weight:500;text-transform:uppercase;letter-spacing:.16em;color:var(--blue-700)!important;font-size:var(--text-xs)!important;line-height:1.25;margin:0 0 1rem}
.section-head{max-width:850px;margin:0 auto 2rem;text-align:center}
.reason-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.reason-grid article,.news-grid article,.testimonial-card{background:var(--warm-white);border:1px solid var(--line);border-radius:8px;padding:1.25rem;box-shadow:0 14px 35px rgba(8,27,49,.05)}
.routine-card{background:var(--warm-white);border:1px solid var(--line);border-radius:8px;padding:1.25rem;box-shadow:0 14px 35px rgba(8,27,49,.05);transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s cubic-bezier(.22,1,.36,1)}.routine-card:hover{transform:translateY(-4px);box-shadow:0 22px 50px rgba(46,125,50,.12)}
.reason-grid p,.news-grid p,.routine-card li,.content-card p,.form-card p{font-size:var(--text-card);line-height:1.66}
/* Readability: card/body copy was rendering at ~14px (--text-sm, which is meant
   for nav/buttons). Lift it to a real reading size without touching the nav. */
.reason-grid article p,.news-grid article p,.impact-card p,.journey-reveal p,
.content-grid article p,.profile-card small{font-size:var(--text-card);line-height:1.66}
.reason-grid article:first-child{grid-column:span 2;background:#fff;color:var(--charcoal);border-left:4px solid var(--accent)}.reason-grid article:first-child p{color:var(--muted)}
.muted{background:var(--mist)}.journey-grid{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(310px,31%);gap:1.1rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:clamp(1rem,4vw,3rem);padding:.5rem .1rem 1.1rem;scrollbar-width:thin}.journey-grid::-webkit-scrollbar{height:8px}.journey-grid::-webkit-scrollbar-thumb{background:rgba(8,27,49,.22);border-radius:999px}
.journey-card{min-height:460px;color:#fff;border-radius:8px;overflow:hidden;position:relative;background-image:var(--image);background-size:cover;background-position:center;scroll-snap-align:start;box-shadow:0 18px 42px rgba(19,32,25,.12);transition:transform .28s ease,box-shadow .28s ease}
.journey-card:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,22,37,.1),rgba(6,22,37,.74) 62%,rgba(6,22,37,.96));transition:background .28s ease}
.journey-card a{position:relative;z-index:1;min-height:460px;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(1.35rem,2.4vw,2rem);color:#fff}
.journey-stage{display:block;font-weight:700;text-transform:uppercase;letter-spacing:.16em;font-size:clamp(1.15rem,.9rem + .7vw,1.55rem);line-height:1.28;text-shadow:0 2px 18px rgba(0,0,0,.28)}
.journey-grade{display:block;margin:.45rem 0 0;font-family:var(--font-heading);font-weight:600;letter-spacing:.14em;font-size:clamp(1.25rem,1rem + .85vw,1.85rem);line-height:1.2;color:#fff;text-shadow:0 2px 18px rgba(0,0,0,.3)}
.journey-reveal{max-height:0;opacity:0;overflow:hidden;transform:translateY(18px);transition:max-height .36s ease,opacity .28s ease,transform .28s ease}
.journey-reveal h3{margin:1.2rem 0 .55rem;font-family:var(--font-heading);font-size:clamp(1.08rem,.95rem + .45vw,1.35rem);line-height:1.3;letter-spacing:.04em}
.journey-reveal p{font-size:var(--text-sm);line-height:1.58;color:rgba(255,255,255,.86);margin:0}
.journey-card:hover,.journey-card:focus-within{transform:translateY(-6px);box-shadow:0 28px 58px rgba(8,27,49,.18)}
.journey-card:hover:before,.journey-card:focus-within:before{background:linear-gradient(180deg,rgba(6,22,37,.28),rgba(6,22,37,.72) 42%,rgba(6,22,37,.96))}
.journey-card:hover .journey-reveal,.journey-card:focus-within .journey-reveal{max-height:190px;opacity:1;transform:translateY(0)}
.campus-story{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center}.campus-image img{border-radius:8px;box-shadow:var(--shadow);aspect-ratio:1/1;object-fit:cover}
.campus-map-section{padding-top:0}.campus-map-card{width:min(1160px,100%);margin:0 auto;background:var(--warm-white);border:1px solid var(--line);border-radius:8px;padding:clamp(.7rem,1.5vw,1rem);box-shadow:var(--shadow)}.campus-map-card img{width:100%;max-height:620px;object-fit:cover;border-radius:6px}
.check-list{padding:0;list-style:none;display:grid;gap:.6rem}.check-list li{position:relative;padding-left:1.6rem}.check-list li:before{content:"";position:absolute;left:0;top:.55rem;width:.55rem;height:.55rem;background:var(--accent);border-radius:50%}
.dark{background:linear-gradient(135deg,var(--navy-950),var(--navy-850));color:#fff}.dark .section-kicker{color:var(--accent-soft)!important}.dark p{color:rgba(255,255,255,.78)}
.tabs{max-width:1120px;margin:auto}.tab-list{display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap;margin-bottom:1rem}.tab-list button{border:1px solid var(--line);background:#fff;color:var(--green-850);border-radius:8px;padding:.8rem 1rem;font-family:var(--font-ui);font-size:var(--text-sm);line-height:var(--lh-ui);font-weight:700;cursor:pointer}.tab-list button.active{background:var(--accent);color:#fff;border-color:var(--accent)}
.tab-panel{display:none;grid-template-columns:1fr 1fr;gap:2rem;align-items:center;background:rgba(255,255,255,.98);border:1px solid rgba(255,255,255,.2);border-radius:8px;padding:1rem;color:var(--charcoal);box-shadow:0 18px 45px rgba(2,8,15,.18)}.tab-panel.active{display:grid}.tab-panel img{height:440px;width:100%;object-fit:cover;border-radius:8px}.tab-panel p{font-size:var(--text-sm);line-height:1.62;color:var(--muted)}
.routine-card ol{display:grid;gap:1rem;padding:0;margin:1rem 0 0;list-style:none}.routine-card li{border-left:3px solid var(--accent);padding-left:1rem;transition:border-color .3s,transform .3s}.routine-card li:hover{border-left-color:var(--accent-soft);transform:translateX(4px)}.routine-card span{display:block;font-weight:700;color:var(--accent)}
.testimonial-card{max-width:850px;margin:auto;text-align:center}.testimonial-card blockquote{font-family:var(--font-heading);font-size:clamp(1.35rem,2.3vw,2.05rem);line-height:1.3;font-weight:600;margin:0 0 1rem}.testimonial-controls{display:flex;justify-content:center;gap:.6rem}.testimonial-controls button,.filter-bar button{border:1px solid var(--line);background:#fff;color:var(--green-950);border-radius:8px;padding:.7rem 1rem;font-size:var(--text-sm);line-height:var(--lh-ui);font-weight:700;cursor:pointer}.filter-bar button.active{background:var(--accent);color:#fff}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.news-grid img{height:230px;width:100%;object-fit:cover;border-radius:6px;margin-bottom:1rem}.news-grid span{font-weight:700;color:var(--blue-700);font-size:.8rem;text-transform:uppercase;letter-spacing:.12em}
.review-ribbon{padding:clamp(4rem,8vw,7rem) 0;background:#fff;overflow:hidden;scroll-margin-top:92px}
.review-head{max-width:850px;margin:0 auto 2rem;padding:0 1rem;text-align:center}.review-head p:not(.section-kicker){color:var(--muted);font-size:1.04rem}
.review-stage{position:relative;overflow:hidden}.review-stage:before,.review-stage:after{content:"";position:absolute;top:0;bottom:0;width:9vw;z-index:2;pointer-events:none}.review-stage:before{left:0;background:linear-gradient(90deg,#fff,rgba(255,255,255,0))}.review-stage:after{right:0;background:linear-gradient(270deg,#fff,rgba(255,255,255,0))}
.review-track{display:flex;gap:2rem;padding:1rem 12vw 1.5rem;scroll-behavior:smooth;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x mandatory}.review-track::-webkit-scrollbar{display:none}
.review-card{position:relative;isolation:isolate;flex:0 0 min(900px,74vw);min-height:520px;display:flex;flex-direction:column;justify-content:center;padding:clamp(2rem,4vw,4rem);border-radius:8px;color:#fff;background:linear-gradient(120deg,rgba(6,22,37,.74),rgba(8,27,49,.34)),url('../assets/review-bg.jpg') center/cover;box-shadow:0 28px 60px rgba(8,27,49,.18);scroll-snap-align:center;overflow:hidden}
.review-card:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(6,22,37,.68),rgba(255,255,255,.22));backdrop-filter:saturate(.9)}
.review-card p{max-width:760px;margin:0 auto 2rem;text-align:center;font-family:var(--font-heading);font-size:clamp(1.15rem,1.45vw,1.65rem);font-weight:600;line-height:1.5;text-shadow:0 2px 20px rgba(0,0,0,.35)}
.review-person{display:flex;align-items:center;justify-content:center;gap:1rem}.review-person img{width:92px;height:92px;border-radius:50%;object-fit:cover;background:#fff;border:5px solid #fff;box-shadow:0 12px 28px rgba(0,0,0,.2)}
.review-person h3{margin:0 0 .25rem;font-family:var(--font-ui);letter-spacing:.1em;text-transform:uppercase;font-size:clamp(.96rem,.85rem + .45vw,1.12rem);line-height:1.2;font-weight:700}.review-person span{display:block;color:rgba(255,255,255,.78);font-weight:700;text-transform:uppercase;font-size:var(--text-xs);line-height:1.35;max-width:470px}
.review-controls{display:flex;justify-content:center;gap:.65rem;margin-top:1rem}.review-controls button{border:1px solid var(--line);background:var(--green-950);color:#fff;border-radius:8px;padding:.75rem 1rem;font-family:var(--font-ui);font-size:var(--text-sm);line-height:var(--lh-ui);font-weight:700;cursor:pointer}.review-controls button:hover{background:var(--green-700)}
.admission-cta{margin:0 clamp(1rem,4vw,3rem) clamp(3rem,6vw,5rem);padding:clamp(3rem,7vw,6rem);border-radius:8px;background:linear-gradient(135deg,rgba(6,22,37,.97),rgba(13,39,69,.92)),url('../assets/campus-life.jpg') center/cover;color:#fff;text-align:center;box-shadow:var(--shadow)}.admission-cta p{max-width:650px;margin:0 auto 1.4rem;color:rgba(255,255,255,.8)}
.social-sidebar{position:fixed;right:0;top:50%;transform:translateY(-45%);z-index:40;display:flex;flex-direction:column;align-items:center;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s}.cta-visible .social-sidebar{opacity:1;pointer-events:auto;transform:translateY(-50%)}.social-icons{display:flex;flex-direction:column;background:var(--navy-950);border-top-left-radius:8px;box-shadow:var(--shadow)}.social-icons a{position:relative;display:flex;align-items:center;justify-content:center;width:48px;height:48px;color:#fff;transition:background .2s,color .2s}.social-icons a:not(:last-child){border-bottom:1px solid rgba(255,255,255,.06)}.social-icons a:hover{background:var(--navy-850)}.social-icons svg{width:20px;height:20px}.social-tooltip{position:absolute;right:100%;top:50%;transform:translate(10px,-50%);background:var(--navy-950);color:#fff;padding:.4rem .8rem;border-radius:4px;font-size:.8rem;font-family:var(--font-ui);font-weight:700;opacity:0;pointer-events:none;visibility:hidden;transition:opacity .2s,transform .2s,visibility .2s;white-space:nowrap}.social-icons a:hover .social-tooltip{opacity:1;visibility:visible;transform:translate(-4px,-50%)}.social-sidebar .register-btn{background:var(--accent);color:#fff;font-family:var(--font-ui);font-weight:700;font-size:.95rem;letter-spacing:.05em;padding:1.2rem .5rem;text-align:center;writing-mode:vertical-rl;text-orientation:mixed;border-bottom-left-radius:8px;transition:background .2s;box-shadow:var(--shadow);text-transform:uppercase}.social-sidebar .register-btn:hover{background:var(--accent-hover)}
.site-footer{background:linear-gradient(135deg,var(--navy-950),#091d33);color:#fff;padding:3rem clamp(1rem,4vw,3rem);display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:2rem}.site-footer h3{font-size:var(--text-base);line-height:1.25;font-weight:700}.site-footer a{display:block;color:rgba(255,255,255,.78);font-size:var(--text-sm);line-height:1.45;margin:.35rem 0}.site-footer p{color:rgba(255,255,255,.68);font-size:var(--text-sm);line-height:1.62}.footer-brand{margin-bottom:1rem}
.page-hero{position:relative;isolation:isolate;min-height:clamp(430px,42vw,580px);display:flex;flex-direction:column;justify-content:flex-end;padding:8.5rem clamp(1rem,4vw,3rem) clamp(3rem,6vw,5.5rem);background:linear-gradient(90deg,rgba(6,22,37,.92),rgba(8,27,49,.62) 52%,rgba(8,27,49,.2)),linear-gradient(0deg,rgba(6,22,37,.85),rgba(6,22,37,.12) 52%),var(--hero-image,url('../assets/campus-life.jpg')) center/cover;color:#fff;overflow:hidden}.page-hero:after{content:"";position:absolute;inset:auto clamp(1rem,4vw,3rem) 0;height:1px;background:linear-gradient(90deg,var(--accent),rgba(46,125,50,0));opacity:.85}.page-hero h1,.page-hero p,.page-hero .hero-breadcrumb,.page-hero .hero-actions{position:relative;z-index:1;max-width:860px}.page-hero h1{font-size:clamp(2.6rem,1.7rem + 4vw,5.2rem);line-height:1.02;margin-bottom:1rem}.page-hero p{max-width:760px;color:rgba(255,255,255,.84);font-size:var(--text-lg);line-height:1.62}.page-hero .hero-breadcrumb{margin:0 0 1rem;color:var(--accent-soft);font-size:var(--text-xs);line-height:1.25;font-weight:700;letter-spacing:.16em;text-transform:uppercase}.page-hero .hero-actions{justify-content:flex-start;margin-top:1.25rem}
.page-hero--about{--hero-image:url('../assets/highlights.jpg')}.page-hero--management{--hero-image:url('../assets/management/governance-hero.jpg')}.page-hero--academics{--hero-image:url('../assets/senior.jpg')}.page-hero--school-life{--hero-image:url('../assets/activities.jpg')}.page-hero--boarding{--hero-image:url('../assets/residential.jpg')}.page-hero--admissions{--hero-image:url('../assets/campus-life.jpg')}.page-hero--news{--hero-image:url('../assets/event-2.jpg')}.page-hero--gallery{--hero-image:url('../assets/highlights.jpg')}.page-hero--contact{--hero-image:url('../assets/management/greenhills-school.png')}.page-hero--audit{--hero-image:url('../assets/management/faq-hero.png')}
.staff-photo-hero{min-height:clamp(520px,56vw,760px);display:flex;flex-direction:column;justify-content:flex-end;background:linear-gradient(90deg,rgba(6,22,37,.9),rgba(6,22,37,.52) 58%,rgba(6,22,37,.18)),linear-gradient(0deg,rgba(6,22,37,.88),rgba(6,22,37,.08) 46%),url('../assets/management/about-banner.jpg') center top/cover}
.content-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.content-card{background:var(--warm-white);border:1px solid var(--line);border-radius:8px;padding:1.25rem;box-shadow:0 12px 32px rgba(8,27,49,.045)}.content-card img{height:230px;width:100%;object-fit:cover;border-radius:6px;margin-bottom:1rem}.wide{grid-column:span 2}.form-card{background:var(--warm-white);border-radius:8px;padding:1.25rem;border:1px solid var(--line);box-shadow:0 18px 44px rgba(8,27,49,.06)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.form-grid label{display:grid;gap:.35rem;font-size:var(--text-sm);line-height:1.35;font-weight:700}.form-grid input,.form-grid select,.form-grid textarea{width:100%;border:1px solid var(--line);border-radius:8px;padding:.85rem;font:inherit;font-size:1rem;line-height:1.45;background:#fff}.form-grid textarea{min-height:120px}.full{grid-column:1/-1}
.profile-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.staff-group .profile-grid{display:flex;gap:1.1rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 1rem;padding:.5rem .1rem 1.2rem;scrollbar-width:thin;scrollbar-color:rgba(8,27,49,.22) transparent}.staff-group .profile-grid::-webkit-scrollbar{height:8px}.staff-group .profile-grid::-webkit-scrollbar-thumb{background:rgba(8,27,49,.22);border-radius:999px}.staff-group .profile-grid .profile-card{flex:0 0 min(260px,72vw);scroll-snap-align:start}.staff-group{position:relative;margin-top:clamp(2.5rem,5vw,4.5rem);scroll-margin-top:92px}.staff-group::after{content:"";position:absolute;right:0;top:0;bottom:0;width:clamp(2rem,4vw,4rem);background:linear-gradient(270deg,var(--ivory),rgba(255,255,255,0));pointer-events:none;z-index:1}.profile-card{background:var(--warm-white);border:1px solid var(--line);border-radius:8px;overflow:hidden;box-shadow:0 14px 35px rgba(8,27,49,.07);transition:transform .2s,box-shadow .2s}.profile-card:hover{transform:translateY(-3px);box-shadow:0 20px 45px rgba(8,27,49,.12)}.profile-card img{width:100%;aspect-ratio:4/5;object-fit:cover;background:var(--blue-100)}.profile-card div{padding:1rem}.profile-card h3{margin-bottom:.35rem}.profile-card p{margin:.1rem 0;color:var(--blue-700);font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:var(--text-xs);line-height:1.35}.profile-card small{display:block;color:var(--muted);font-size:var(--text-sm);line-height:1.5;margin-top:.45rem}.management-leaders{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.impact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.impact-card{background:var(--warm-white);border:1px solid var(--line);border-radius:8px;overflow:hidden;box-shadow:0 14px 35px rgba(8,27,49,.07)}.impact-card img{height:230px;width:100%;object-fit:cover}.impact-card h3,.impact-card p{padding:0 1.15rem}.impact-card h3{padding-top:1.15rem}.impact-card p{padding-bottom:1.15rem;color:var(--muted)}.quote-panel{max-width:980px;margin:auto;text-align:center;background:linear-gradient(135deg,var(--navy-950),var(--navy-850));color:#fff;border-radius:8px;padding:clamp(2rem,5vw,4rem);box-shadow:var(--shadow)}.quote-panel blockquote{font-family:var(--font-heading);font-size:clamp(1.45rem,2.6vw,2.35rem);line-height:1.32;margin:0 0 1.5rem}.quote-panel p{color:rgba(255,255,255,.78)}.staff-filter{max-width:1080px;margin:0 auto 2rem}.staff-filter button{color:var(--navy-950);border-color:var(--line);background:#fff}.staff-filter button.active{background:var(--accent);color:#fff}.section-head.compact{margin-bottom:1.25rem}.section-head.compact h2{font-size:clamp(1.55rem,1.2rem + 1.5vw,2.35rem)}
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.gallery-item{border:0;padding:0;background:transparent;cursor:pointer}.gallery-item img{height:260px;width:100%;object-fit:cover;border-radius:8px;box-shadow:0 14px 30px rgba(8,27,49,.1)}
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.86);display:none;align-items:center;justify-content:center;z-index:30;padding:1rem}.lightbox.active{display:flex}.lightbox img{max-height:86vh;border-radius:8px}.lightbox button{position:absolute;top:1rem;right:1rem;border:0;border-radius:8px;padding:.8rem 1rem;font-weight:700}
.film-modal{position:fixed;inset:0;z-index:40;display:none;align-items:center;justify-content:center;padding:clamp(1rem,4vw,3rem)}
.film-modal.active{display:flex}.film-modal-backdrop{position:absolute;inset:0;background:rgba(3,10,18,.88);backdrop-filter:blur(8px)}
.film-dialog{position:relative;width:min(1080px,100%);background:#06111f;border:1px solid rgba(255,255,255,.16);border-radius:8px;box-shadow:0 30px 80px rgba(0,0,0,.45);padding:clamp(.5rem,1.4vw,1rem)}
.film-player{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:6px;background:#000}.film-player iframe{width:100%;height:100%;border:0}
.film-close{position:absolute;right:0;top:-3rem;border:1px solid rgba(255,255,255,.32);border-radius:8px;background:rgba(255,255,255,.1);color:#fff;padding:.7rem 1rem;font-weight:700;cursor:pointer}
.reveal,.reveal-up,.reveal-scale,.reveal-left,.reveal-right{opacity:0;transition:opacity .8s cubic-bezier(.22,1,.36,1),transform .8s cubic-bezier(.22,1,.36,1)}.reveal-up{transform:translateY(40px)}.reveal-scale{transform:scale(.95)}.reveal-left{transform:translateX(-50px)}.reveal-right{transform:translateX(50px)}.reveal-stagger > *{opacity:0;transform:translateY(40px);transition:opacity .8s cubic-bezier(.22,1,.36,1),transform .8s cubic-bezier(.22,1,.36,1)}.visible.reveal,.visible.reveal-up,.visible.reveal-left,.visible.reveal-right{opacity:1;transform:translate(0)}.visible.reveal-scale{opacity:1;transform:scale(1)}.visible.reveal-stagger > *{opacity:1;transform:translateY(0)}.visible.reveal-stagger > *:nth-child(1){transition-delay:0s}.visible.reveal-stagger > *:nth-child(2){transition-delay:.1s}.visible.reveal-stagger > *:nth-child(3){transition-delay:.2s}.visible.reveal-stagger > *:nth-child(4){transition-delay:.3s}.visible.reveal-stagger > *:nth-child(5){transition-delay:.4s}.visible.reveal-stagger > *:nth-child(6){transition-delay:.5s}.visible.reveal-stagger > *:nth-child(7){transition-delay:.6s}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-video-frame{display:none}.hero-video-wrap{background:linear-gradient(135deg,rgba(6,22,37,.9),rgba(13,39,69,.78)),url('../assets/school-film-poster.jpg') center/cover}.scroll-cue:after{animation:none}}
@media (max-width:1100px){.main-nav{position:fixed;inset:74px 1rem auto 1rem;background:rgba(255,255,255,.97);color:var(--charcoal);display:none;flex-direction:column;gap:0;padding:.6rem;border:1px solid var(--line);border-radius:8px;font-size:1rem;line-height:1.4;box-shadow:0 24px 60px rgba(8,27,49,.16);backdrop-filter:blur(18px);max-height:calc(100svh - 92px);overflow:auto}.site-header.open .main-nav{display:flex}.main-nav a{width:100%;padding:.9rem 1rem;border-radius:6px;border-bottom:1px solid rgba(8,27,49,.08);opacity:1}.main-nav a:last-child{border-bottom:0}.main-nav a:hover{background:var(--blue-100);color:var(--navy-850)}.nav-toggle{display:block;margin-left:auto;color:inherit}.header-actions{display:none}.trust-strip{grid-template-columns:repeat(2,1fr)}.split,.campus-story,.tab-panel,.site-footer{grid-template-columns:1fr}.news-grid,.content-grid,.gallery-grid,.profile-grid,.impact-grid{grid-template-columns:repeat(2,1fr)}.management-leaders{grid-template-columns:1fr 1fr}}
@media (max-width:680px){.site-header{padding:.8rem 1rem}.hero{min-height:92svh;padding:5.8rem 1rem 4.5rem}.hero-video-frame{opacity:.98;object-position:center center;filter:saturate(1) contrast(1.06) brightness(1.03)}.hero-shade{background:linear-gradient(180deg,rgba(6,22,37,.72),rgba(6,22,37,.32) 42%,rgba(6,22,37,.78)),linear-gradient(90deg,rgba(6,22,37,.56),rgba(8,27,49,.14),rgba(6,22,37,.52))}.hero-content{width:100%;margin:auto}.hero h1{font-size:clamp(2.45rem,13vw,4rem)}.hero-line{font-size:clamp(1.08rem,5vw,1.4rem);max-width:21rem}.hero-copy{font-size:.95rem;line-height:1.48;margin-bottom:1.15rem}.hero-actions{align-items:stretch}.hero-actions a,.hero-actions button{width:100%}.hero-film-control{display:none}.scroll-cue{display:none}.page-hero{min-height:430px;padding:7rem 1rem 3rem;background-position:center}.page-hero h1{font-size:clamp(2.4rem,13vw,4rem)}.page-hero p{font-size:1rem;line-height:1.5}.page-hero .hero-actions a{width:100%}.staff-photo-hero{min-height:560px;background-position:center top}.trust-strip,.reason-grid,.news-grid,.content-grid,.gallery-grid,.form-grid,.profile-grid,.impact-grid,.management-leaders{grid-template-columns:1fr}.journey-grid{grid-template-columns:none;grid-auto-columns:minmax(82vw,1fr);margin-inline:-.2rem}.journey-card,.journey-card a{min-height:420px}.journey-reveal{max-height:180px;opacity:1;transform:none}.reason-grid article:first-child,.wide{grid-column:auto}.section{padding:3.5rem 1rem}.campus-map-section{padding-top:0}.tab-panel img{height:300px}.review-ribbon{padding:3.5rem 0}.review-track{gap:1rem;padding:1rem}.review-stage:before,.review-stage:after{display:none}.review-card{flex-basis:calc(100vw - 2rem);min-height:620px;padding:1.4rem}.review-card p{text-align:left;font-size:clamp(1.03rem,.96rem + .35vw,1.12rem);line-height:1.5}.review-person{align-items:flex-start;justify-content:flex-start}.review-person img{width:72px;height:72px}.review-person h3{font-size:.95rem}.review-person span{font-size:.76rem;line-height:1.35}.social-sidebar{top:50%;bottom:auto;transform:translateY(-45%)}.cta-visible .social-sidebar{transform:translateY(-50%)}.social-icons a{width:38px;height:38px}.social-icons svg{width:16px;height:16px}.social-tooltip{display:none}.social-sidebar .register-btn{padding:.9rem .35rem;font-size:.78rem;letter-spacing:.03em}.site-footer{padding-bottom:2rem}.film-close{top:auto;bottom:-3.4rem;right:0}}
