/* =========================================================
   Springs Pre School — Premium Website Stylesheet
   ========================================================= */

:root{
  /* Brand colors — exact client hex, with derived tints/shades for depth */
  --yellow: #FCDF03;
  --yellow-soft: #C0A902;
  --yellow-deepest: #8D7D02;
  --yellow-tint: #F6F0C1;
  --yellow-tint-2: #F8F5DD;
  --green: #19A401;
  --green-dark: #117101;
  --green-deepest: #0C5301;
  --green-soft: #CFE6CB;
  --green-tint: #B6DEAF;
  --green-tint-2: #96CE8D;
  --cream: #FFF8E7;
  --card-bg: #F4F0D7;
  --border-tint: #E1ECDF;
  --dot-inactive: #D0DECE;
  --white: #ffffff;
  --ink: #16330F;
  --ink-soft: #355C34;
  --radius-lg: 28px;
  --radius-md: 18px;
  --radius-sm: 12px;
  --shadow-soft: 0 20px 45px -20px rgba(25,164,1,0.35);
  --shadow-card: 0 12px 30px -12px rgba(42,46,35,0.18);
  --font-display: 'Fredoka', system-ui, sans-serif;
  --font-body: 'Quicksand', system-ui, sans-serif;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--ink);
  background:linear-gradient(180deg, var(--yellow-tint-2) 0%, var(--yellow-tint) 100%);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5{font-family:var(--font-display); margin:0 0 .5em; line-height:1.15; color:var(--green-dark); font-weight:600;}
p{margin:0 0 1em; color:var(--ink-soft); line-height:1.7; font-weight:500;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
ul{list-style:none; margin:0; padding:0;}
button{font-family:inherit; cursor:pointer;}

.container{max-width:1240px; margin:0 auto; padding:0 24px; position:relative; z-index:1;}

.section{
  position:relative; overflow:hidden; padding:100px 0;
  background:var(--yellow);
}
.section::before, .section::after{
  content:''; position:absolute; z-index:0; border-radius:50%; pointer-events:none; filter:blur(6px);
}
.section::before{
  top:-140px; left:-120px; width:420px; height:420px;
  background:radial-gradient(circle, rgba(25,164,1,.28) 0%, rgba(25,164,1,0) 70%);
}
.section::after{
  bottom:-160px; right:-130px; width:480px; height:480px;
  background:radial-gradient(circle, rgba(252,223,3,.26) 0%, rgba(252,223,3,0) 70%);
}
.alt-bg{
  background:var(--green-dark);
}

/* Bare text sitting directly on a solid dark-green section (not inside a
   light card) needs to flip to a light color for contrast. */
.alt-bg .section-head h2{color:#fff;}
.alt-bg .section-sub{color:rgba(255,255,255,.88);}
.alt-bg .small-note{color:rgba(255,255,255,.7);}
.alt-bg::before{
  top:-130px; right:-110px; left:auto; width:440px; height:440px;
  background:radial-gradient(circle, rgba(252,223,3,.30) 0%, rgba(252,223,3,0) 70%);
}
.alt-bg::after{
  bottom:-150px; left:-120px; right:auto; width:460px; height:460px;
  background:radial-gradient(circle, rgba(12,83,1,.35) 0%, rgba(12,83,1,0) 70%);
}

/* ---------- Scroll progress bar ---------- */
.scroll-progress{
  position:fixed; top:0; left:0; height:4px; width:0%; z-index:1200;
  background:linear-gradient(90deg, var(--yellow) 0%, var(--green) 100%);
  box-shadow:0 0 12px rgba(25,164,1,.5); transition:width .1s linear;
}
.text-gradient{
  background:linear-gradient(90deg, var(--green) 0%, var(--yellow) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.text-white{color:#fff;}
.eyebrow{
  display:inline-block; font-weight:700; letter-spacing:.04em; color:var(--green-dark);
  background:var(--green-soft); padding:6px 16px; border-radius:99px; font-size:.85rem; margin-bottom:14px;
}
.section-head{text-align:center; max-width:680px; margin:0 auto 56px;}
.section-sub{font-size:1.05rem;}
.small-note{font-size:.85rem; opacity:.7;}

/* Buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:14px 28px; border-radius:99px; font-weight:700; font-family:var(--font-display);
  font-size:.95rem; border:2px solid transparent; transition:transform .25s ease, box-shadow .25s ease, background .25s ease;
  white-space:nowrap;
}
.btn:hover{transform:translateY(-3px);}
.btn-primary{background:linear-gradient(90deg, var(--green) 0%, var(--green-dark) 100%); color:#fff; box-shadow:var(--shadow-soft); position:relative; overflow:hidden;}
.btn-primary:hover{box-shadow:0 25px 50px -18px rgba(25,164,1,0.55);}
.btn-outline-light{border-color:rgba(255,255,255,.8); color:#fff; background:rgba(255,255,255,.08); backdrop-filter:blur(6px);}
.btn-ghost-light{color:#fff; border-color:transparent; text-decoration:underline; text-underline-offset:4px;}
.btn-whatsapp{background:#25D366; color:#fff;}

/* Unique animated rainbow CTA — sets the hero's primary action apart */
.btn-rainbow{
  color:#fff; text-shadow:0 1px 4px rgba(0,0,0,.45); position:relative; overflow:hidden; z-index:0;
  background:linear-gradient(115deg, var(--green-dark) 0%, var(--green) 45%, var(--yellow) 100%);
  background-size:220% 220%;
  animation:rainbowShift 6s ease infinite;
  box-shadow:0 20px 45px -18px rgba(252,223,3,.55);
}
.btn-rainbow:hover{box-shadow:0 26px 55px -16px rgba(252,223,3,.7); transform:translateY(-4px) scale(1.03);}
@keyframes rainbowShift{
  0%{background-position:0% 50%;}
  50%{background-position:100% 50%;}
  100%{background-position:0% 50%;}
}

/* Shine sweep on solid buttons for a premium hover feel */
.btn-primary::after, .btn-rainbow::after{
  content:''; position:absolute; top:0; left:-60%; width:40%; height:100%;
  background:linear-gradient(115deg, transparent, rgba(255,255,255,.55), transparent);
  transform:skewX(-20deg); transition:left .6s ease;
}
.btn-primary:hover::after, .btn-rainbow:hover::after{left:130%;}
.btn-sm{padding:10px 20px; font-size:.85rem;}
.full-width{width:100%;}

/* =============== Loader =============== */
#loader{
  position:fixed; inset:0; z-index:9999; background:linear-gradient(135deg, var(--yellow) 0%, var(--yellow-soft) 100%);
  display:flex; align-items:center; justify-content:center; transition:opacity .6s ease, visibility .6s ease;
}
#loader.hidden{opacity:0; visibility:hidden; pointer-events:none;}
.loader-inner{text-align:center;}
.loader-logo{width:180px; margin:0 auto 22px; animation:bounceLogo 1.4s ease-in-out infinite;}
.loader-bar{width:200px; height:8px; background:rgba(255,255,255,.6); border-radius:99px; overflow:hidden; margin:0 auto;}
.loader-bar span{display:block; height:100%; width:0%; background:var(--green); animation:loadBar 1.8s ease forwards;}
.loader-inner p{color:var(--green-dark); font-family:var(--font-display); font-weight:600; margin-top:14px;}
@keyframes bounceLogo{0%,100%{transform:translateY(0) scale(1);}50%{transform:translateY(-14px) scale(1.03);}}
@keyframes loadBar{0%{width:0%;}100%{width:100%;}}

/* Cursor glow (desktop only) */
.cursor-glow{
  position:fixed; width:280px; height:280px; border-radius:50%; pointer-events:none; z-index:5;
  background:radial-gradient(circle, rgba(25,164,1,0.10) 0%, rgba(252,223,3,0.06) 45%, transparent 70%);
  transform:translate(-50%,-50%); left:-999px; top:-999px; transition:left .12s linear, top .12s linear;
}
@media (max-width:900px){.cursor-glow{display:none;}}

/* =============== Navbar =============== */
.navbar{
  position:fixed; top:0; left:0; right:0; z-index:900; transition:background .35s ease, box-shadow .35s ease, padding .35s ease;
  padding:18px 0;
}
.navbar.scrolled{background:rgba(246,240,193,.92); backdrop-filter:blur(12px); box-shadow:0 8px 30px -12px rgba(0,0,0,.15); padding:10px 0;}
.nav-container{max-width:1280px; margin:0 auto; padding:0 24px; display:flex; align-items:center; justify-content:space-between;}
.nav-logo img{height:52px; border-radius:10px; transition:height .3s ease;}
.navbar.scrolled .nav-logo img{height:42px;}
.nav-links{display:flex; gap:28px;}
.nav-links a{
  font-family:var(--font-display); font-weight:500; font-size:.95rem; color:#fff; position:relative; padding:4px 0;
  transition:color .3s ease;
}
.navbar.scrolled .nav-links a{color:var(--ink);}
.nav-links a::after{content:''; position:absolute; left:0; bottom:-4px; width:0; height:2px; background:var(--green); transition:width .3s ease;}
.nav-links a:hover::after{width:100%;}
.nav-actions{display:flex; align-items:center; gap:14px;}
.nav-toggle{display:none; flex-direction:column; gap:5px; background:none; border:none; padding:6px;}
.nav-toggle span{width:26px; height:3px; background:var(--card-bg); border-radius:2px; transition:background .3s ease;}
.navbar.scrolled .nav-toggle span{background:var(--ink);}

@media (max-width:960px){
  .nav-links{
    position:fixed; top:0; right:-100%; height:100vh; width:min(78vw,340px); background:var(--yellow-tint-2); flex-direction:column;
    padding:110px 32px; gap:22px; transition:right .4s ease; box-shadow:-10px 0 40px rgba(0,0,0,.12);
  }
  .nav-links.open{right:0;}
  .nav-links a{color:var(--ink) !important;}
  .nav-toggle{display:flex;}
  .nav-actions .btn-sm{display:none;}
}

/* =============== Hero =============== */
.hero{
  position:relative; min-height:100vh; display:flex; align-items:center; overflow:hidden;
  padding-top:100px;
}
.hero-slider{position:absolute; inset:0;}
.hero-slide{
  position:absolute; inset:0; background-size:cover; background-position:center; opacity:0;
  filter:brightness(.92) saturate(1.05); transform:scale(1.08); transition:opacity 1.6s ease, transform 8s ease;
}
.hero-slide.active{opacity:1; transform:scale(1);}
.hero-overlay{
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(12,83,1,.32) 0%, rgba(25,164,1,.22) 45%, rgba(252,223,3,.22) 100%);
}
.hero-content{
  position:relative; z-index:3; max-width:820px; margin:0 auto; padding:60px 24px 80px; text-align:center; color:#fff;
  border-radius:40px;
}
.hero-content::before{
  content:''; position:absolute; inset:-20px -16px; z-index:-1; border-radius:40px;
  background:radial-gradient(60% 90% at 50% 45%, rgba(12,83,1,.55) 0%, rgba(12,83,1,0) 75%);
}
.hero-content .eyebrow{background:rgba(255,255,255,.18); color:#fff; backdrop-filter:blur(6px);}
.hero-content h1{font-size:clamp(2.4rem, 5.4vw, 4.2rem); color:#fff; text-shadow:0 2px 8px rgba(0,0,0,.55), 0 10px 34px rgba(0,0,0,.4);}
.hero-sub{font-size:clamp(1rem,2vw,1.25rem); color:rgba(255,255,255,.95); max-width:640px; margin:0 auto 34px; text-shadow:0 2px 10px rgba(0,0,0,.5);}
.hero-ctas{display:flex; flex-wrap:wrap; gap:14px; justify-content:center;}

.scroll-cue{position:absolute; bottom:28px; left:50%; transform:translateX(-50%); z-index:3;}
.scroll-cue span{
  display:block; width:26px; height:42px; border:2px solid rgba(255,255,255,.8); border-radius:99px; position:relative;
}
.scroll-cue span::after{
  content:''; position:absolute; top:8px; left:50%; width:5px; height:5px; background:var(--card-bg); border-radius:50%;
  transform:translateX(-50%); animation:scrollDot 1.6s ease infinite;
}
@keyframes scrollDot{0%{top:8px; opacity:1;}80%{top:24px; opacity:0;}100%{top:8px; opacity:0;}}

/* Hero floaters */
.hero-floaters{position:absolute; inset:0; z-index:2; overflow:hidden; pointer-events:none;}
.floater{position:absolute; font-size:2rem; opacity:.85; will-change:transform;}
.balloon-1{left:8%; top:20%; animation:floatUp 9s ease-in-out infinite;}
.balloon-2{left:85%; top:55%; font-size:2.6rem; animation:floatUp 11s ease-in-out infinite 1s;}
.balloon-3{left:45%; top:12%; font-size:1.6rem; animation:floatUp 8s ease-in-out infinite 2s;}
.butterfly-1{left:15%; top:65%; font-size:1.8rem; animation:flutter 7s ease-in-out infinite;}
.butterfly-2{left:75%; top:22%; font-size:1.5rem; animation:flutter 9s ease-in-out infinite 1.5s;}
.bird-1{left:60%; top:15%; font-size:1.6rem; animation:flyAcross 14s linear infinite;}
.cloud-1{left:5%; top:8%; font-size:3.4rem; opacity:.55; animation:driftX 26s linear infinite;}
.cloud-2{left:60%; top:5%; font-size:2.6rem; opacity:.45; animation:driftX 32s linear infinite reverse;}
.star-1{left:25%; top:35%; color:#fff; font-size:1.2rem; animation:twinkle 3s ease-in-out infinite;}
.star-2{left:70%; top:40%; color:var(--yellow-soft); font-size:1rem; animation:twinkle 4s ease-in-out infinite .5s;}
.star-3{left:90%; top:18%; color:#fff; font-size:1.4rem; animation:twinkle 3.5s ease-in-out infinite 1s;}
.letter{font-family:var(--font-display); font-weight:700; color:rgba(255,255,255,.85); font-size:1.8rem;}
.letter-1{left:35%; top:75%; animation:floatUp 10s ease-in-out infinite;}
.letter-2{left:50%; top:82%; animation:floatUp 12s ease-in-out infinite 2s;}
.letter-3{left:20%; top:48%; animation:floatUp 9s ease-in-out infinite 1s;}
.leaf-1{left:10%; top:82%; font-size:1.6rem; animation:sway 6s ease-in-out infinite;}
.leaf-2{left:88%; top:78%; font-size:1.4rem; animation:sway 7s ease-in-out infinite 1s;}
.shape{border-radius:30%; position:absolute; opacity:.5;}
.shape-1{left:80%; top:70%; width:46px; height:46px; background:linear-gradient(135deg, var(--green), var(--yellow-tint)); animation:spin 12s linear infinite;}
.shape-2{left:30%; top:10%; width:30px; height:30px; background:linear-gradient(135deg, var(--yellow), var(--yellow-soft)); border-radius:50%; animation:spin 9s linear infinite reverse;}
.sun-rays{
  position:absolute; top:-20%; right:-10%; width:60vw; height:60vw; border-radius:50%; z-index:0;
  background:radial-gradient(circle, rgba(252,223,3,.35) 0%, transparent 60%);
  animation:pulseSun 6s ease-in-out infinite;
}
@keyframes floatUp{0%,100%{transform:translateY(0) rotate(0deg);}50%{transform:translateY(-30px) rotate(6deg);}}
@keyframes flutter{0%,100%{transform:translate(0,0) rotate(0);}25%{transform:translate(10px,-14px) rotate(10deg);}50%{transform:translate(-6px,-24px) rotate(-8deg);}75%{transform:translate(8px,-10px) rotate(6deg);}}
@keyframes flyAcross{0%{transform:translateX(-10vw);}100%{transform:translateX(60vw);}}
@keyframes driftX{0%{transform:translateX(0);}100%{transform:translateX(40vw);}}
@keyframes twinkle{0%,100%{opacity:.2; transform:scale(.8);}50%{opacity:1; transform:scale(1.2);}}
@keyframes sway{0%,100%{transform:rotate(-8deg) translateY(0);}50%{transform:rotate(8deg) translateY(-10px);}}
@keyframes spin{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}
@keyframes pulseSun{0%,100%{opacity:.6;}50%{opacity:1;}}

@media (max-width:700px){
  .floater{font-size:1.3rem;}
  .cloud-1,.cloud-2{font-size:2rem;}
}

/* =============== Scroll Reveal =============== */
.reveal, .reveal-left, .reveal-right{opacity:0; transition:opacity .7s ease, transform .7s cubic-bezier(.22,.9,.32,1);}
.reveal{transform:translateY(34px) scale(.98);}
.reveal-left{transform:translateX(-40px);}
.reveal-right{transform:translateX(40px);}
.reveal.visible, .reveal-left.visible, .reveal-right.visible{opacity:1; transform:translate(0,0) scale(1);}

/* Cascading stagger for card grids */
.why-grid .why-card:nth-child(1),.programs-grid .program-card:nth-child(1),.facility-grid .facility-item:nth-child(1),.day-timeline .day-item:nth-child(1),.timeline .timeline-item:nth-child(1){transition-delay:.03s;}
.why-grid .why-card:nth-child(2),.programs-grid .program-card:nth-child(2),.facility-grid .facility-item:nth-child(2),.day-timeline .day-item:nth-child(2),.timeline .timeline-item:nth-child(2){transition-delay:.09s;}
.why-grid .why-card:nth-child(3),.programs-grid .program-card:nth-child(3),.facility-grid .facility-item:nth-child(3),.day-timeline .day-item:nth-child(3),.timeline .timeline-item:nth-child(3){transition-delay:.15s;}
.why-grid .why-card:nth-child(4),.programs-grid .program-card:nth-child(4),.facility-grid .facility-item:nth-child(4),.day-timeline .day-item:nth-child(4),.timeline .timeline-item:nth-child(4){transition-delay:.21s;}
.why-grid .why-card:nth-child(5),.facility-grid .facility-item:nth-child(5),.day-timeline .day-item:nth-child(5),.timeline .timeline-item:nth-child(5){transition-delay:.27s;}
.why-grid .why-card:nth-child(6),.facility-grid .facility-item:nth-child(6),.day-timeline .day-item:nth-child(6),.timeline .timeline-item:nth-child(6){transition-delay:.33s;}
.why-grid .why-card:nth-child(7),.facility-grid .facility-item:nth-child(7),.day-timeline .day-item:nth-child(7){transition-delay:.39s;}
.why-grid .why-card:nth-child(8),.facility-grid .facility-item:nth-child(8),.day-timeline .day-item:nth-child(8){transition-delay:.45s;}
.why-grid .why-card:nth-child(9),.facility-grid .facility-item:nth-child(9),.day-timeline .day-item:nth-child(9){transition-delay:.51s;}
.why-grid .why-card:nth-child(10),.facility-grid .facility-item:nth-child(10),.day-timeline .day-item:nth-child(10){transition-delay:.57s;}
.why-grid .why-card:nth-child(11),.facility-grid .facility-item:nth-child(11){transition-delay:.63s;}
.why-grid .why-card:nth-child(12),.facility-grid .facility-item:nth-child(12){transition-delay:.69s;}

/* =============== About =============== */
.about-grid{display:grid; grid-template-columns:1fr 1.1fr; gap:70px; align-items:center;}
.about-media{position:relative;}
.about-media img{border-radius:var(--radius-lg); box-shadow:var(--shadow-card);}
.about-badge{
  position:absolute; bottom:-24px; left:-24px; background:var(--card-bg); border-radius:var(--radius-md); padding:18px 22px;
  box-shadow:var(--shadow-card); text-align:center;
}
.about-badge strong{display:block; font-family:var(--font-display); font-size:1.6rem; color:var(--green);}
.about-badge span{font-size:.78rem; color:var(--ink-soft);}
.about-vm{display:grid; grid-template-columns:1fr 1fr; gap:20px; margin:26px 0 34px;}
.about-vm h4{color:var(--green-dark); font-size:1.05rem;}
.about-vm p{font-size:.92rem; margin:0;}
.counters{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; border-top:2px dashed var(--border-tint); padding-top:28px;}
.counter{text-align:center;}
.counter-num,.counter-suffix{font-family:var(--font-display); font-size:1.8rem; font-weight:700; color:var(--green);}
.counter-label{display:block; font-size:.78rem; color:var(--ink-soft); margin-top:4px;}

@media (max-width:860px){
  .about-grid{grid-template-columns:1fr;}
  .about-vm{grid-template-columns:1fr;}
  .counters{grid-template-columns:repeat(2,1fr); row-gap:24px;}
}

/* =============== Cards / Grids =============== */
.card-grid{display:grid; gap:26px;}
.why-grid{grid-template-columns:repeat(4,1fr);}
.programs-grid{grid-template-columns:repeat(3,1fr);}
@media (max-width:1000px){.why-grid{grid-template-columns:repeat(2,1fr);} .programs-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:600px){.why-grid, .programs-grid{grid-template-columns:1fr;}}

.why-card{
  background:var(--card-bg); border-radius:var(--radius-md); padding:32px 26px; box-shadow:var(--shadow-card);
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease; border:1px solid var(--border-tint);
}
.why-card:hover{
  transform:translateY(-10px) scale(1.02); box-shadow:0 30px 55px -20px rgba(25,164,1,.35);
  border-color:var(--green);
}
.why-icon{font-size:2rem; display:inline-block; margin-bottom:14px; transition:transform .4s ease;}
.why-card:hover .why-icon{transform:scale(1.25) rotate(-8deg);}
.why-card h3{font-size:1.1rem; margin-bottom:8px;}
.why-card p{font-size:.88rem; margin:0;}

.program-card{
  position:relative; border-radius:var(--radius-lg); padding:38px 30px; overflow:hidden; color:#fff;
  box-shadow:var(--shadow-card); transition:transform .4s ease, box-shadow .4s ease;
}
.program-card::after{
  content:''; position:absolute; inset:0; background:linear-gradient(135deg, rgba(255,255,255,.22), transparent 55%);
  opacity:0; transition:opacity .4s ease;
}
.program-card:hover{transform:translateY(-12px) scale(1.03); box-shadow:0 30px 60px -20px rgba(0,0,0,.35);}
.program-card:hover::after{opacity:1;}
.program-card:hover .program-illustration{transform:scale(1.15) rotate(6deg);}
.program-card h3{color:#fff; font-size:1.4rem;}
.program-card p{color:rgba(255,255,255,.92); font-size:.92rem;}
.program-illustration{
  width:70px; height:70px; border-radius:50%; background:rgba(255,255,255,.22); display:flex; align-items:center;
  justify-content:center; font-size:2rem; margin-bottom:20px; backdrop-filter:blur(6px);
  transition:transform .4s ease; position:relative; z-index:1;
}
.program-card:nth-child(1){background:linear-gradient(135deg, var(--green) 0%, var(--green-dark) 100%);}
.program-card:nth-child(2){background:linear-gradient(135deg, var(--yellow) 0%, var(--yellow-soft) 100%);}
.program-card:nth-child(3){background:linear-gradient(135deg, var(--green-dark) 0%, var(--green) 100%);}
.program-card:nth-child(4){background:linear-gradient(135deg, var(--yellow-soft) 0%, var(--yellow) 100%);}
.program-card:nth-child(5){background:linear-gradient(135deg, var(--green-dark) 0%, var(--green-deepest) 100%);}
.program-card:nth-child(6){background:linear-gradient(135deg, var(--yellow) 0%, var(--yellow-deepest) 100%);}

/* Bright-yellow cards need dark text for legibility; green cards keep white */
.program-card:nth-child(2) h3, .program-card:nth-child(2) p,
.program-card:nth-child(4) h3, .program-card:nth-child(4) p,
.program-card:nth-child(6) h3, .program-card:nth-child(6) p{
  color:var(--ink); text-shadow:none;
}
.program-card:nth-child(2) p, .program-card:nth-child(4) p, .program-card:nth-child(6) p{color:var(--ink-soft);}

/* Facilities */
.facility-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
@media (max-width:860px){.facility-grid{grid-template-columns:repeat(2,1fr);}}
.facility-item{
  background:var(--card-bg); border-radius:var(--radius-md); padding:26px 14px; text-align:center; box-shadow:var(--shadow-card);
  transition:transform .3s ease, box-shadow .3s ease; border:1px solid transparent;
}
.facility-item:hover{transform:translateY(-8px) scale(1.03); box-shadow:0 22px 40px -18px rgba(25,164,1,.35); border-color:var(--green-soft);}
.facility-item span{font-size:1.8rem; display:block; margin-bottom:10px; transition:transform .4s ease;}
.facility-item:hover span{transform:scale(1.2) rotate(-6deg);}
.facility-item p{font-size:.82rem; margin:0; font-weight:600; color:var(--ink);}

/* =============== Curriculum Timeline =============== */
.timeline{display:grid; grid-template-columns:repeat(3,1fr); gap:30px 40px; margin-bottom:70px;}
@media (max-width:860px){.timeline{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.timeline{grid-template-columns:1fr;}}
.timeline-item{position:relative; padding-left:26px; border-left:3px solid var(--green-soft);}
.timeline-item .dot{position:absolute; left:-8px; top:2px; width:13px; height:13px; border-radius:50%; background:var(--green);}
.timeline-item h4{font-size:1.02rem; margin-bottom:4px;}
.timeline-item p{font-size:.86rem; margin:0;}

.daily-title{text-align:center; margin-bottom:34px;}

.day-timeline-wrap{position:relative; display:flex; align-items:center; gap:10px;}
.day-timeline{
  display:flex; overflow-x:auto; overflow-y:hidden; gap:22px; padding:4px 4px 20px; flex:1; min-width:0;
  scroll-snap-type:x proximity;
  overscroll-behavior-x:contain;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-x;
  scrollbar-width:thin;
  scrollbar-color:var(--green) var(--green-tint);
}
.day-timeline::-webkit-scrollbar{height:7px;}
.day-timeline::-webkit-scrollbar-track{background:var(--green-tint); border-radius:99px;}
.day-timeline::-webkit-scrollbar-thumb{background:var(--green); border-radius:99px;}
.day-item{
  flex:0 0 130px; scroll-snap-align:start; background:var(--card-bg); border-radius:var(--radius-md); padding:22px 12px;
  text-align:center; box-shadow:var(--shadow-card); transition:transform .3s ease, box-shadow .3s ease;
}
.day-item:hover{transform:translateY(-6px) scale(1.04); box-shadow:0 20px 36px -16px rgba(25,164,1,.35);}
.day-icon{font-size:1.7rem; display:block; margin-bottom:10px; transition:transform .35s ease;}
.day-item:hover .day-icon{transform:scale(1.2);}
.day-item h5{font-size:.85rem; margin:0;}

.day-nav{
  flex:0 0 auto; width:42px; height:42px; border-radius:50%; border:none; background:var(--green);
  color:#fff; font-size:1.4rem; line-height:1; box-shadow:var(--shadow-card); transition:transform .2s ease, background .2s ease;
}
.day-nav:hover{background:var(--green-dark); transform:scale(1.08);}
.day-nav:active{transform:scale(.95);}
@media (max-width:700px){.day-nav{display:none;}}

/* =============== Gallery =============== */
.gallery-grid{columns:3 260px; column-gap:20px;}
@media (max-width:700px){.gallery-grid{columns:1;}}
.gallery-featured{column-span:all;}
.gallery-featured img{width:100%; height:clamp(260px, 34vw, 440px); object-fit:cover;}
.gallery-item{
  break-inside:avoid; margin-bottom:20px; border-radius:var(--radius-md); overflow:hidden; position:relative;
  box-shadow:var(--shadow-card); cursor:pointer; transition:box-shadow .35s ease;
}
.gallery-item:hover{box-shadow:0 26px 50px -18px rgba(25,164,1,.4);}
.gallery-item img{transition:transform .6s ease, filter .4s ease;}
.gallery-item:hover img{transform:scale(1.1);}
.gallery-item::after{
  content:attr(data-caption); position:absolute; left:0; right:0; bottom:0; padding:16px 14px 12px;
  color:#fff; font-family:var(--font-display); font-size:.82rem; font-weight:600;
  background:linear-gradient(0deg, rgba(12,83,1,.85) 0%, rgba(12,83,1,0) 100%);
  transform:translateY(100%); transition:transform .4s ease; pointer-events:none;
}
.gallery-item:hover::after{transform:translateY(0);}
.lightbox{
  position:fixed; inset:0; background:rgba(20,25,18,.92); z-index:2000; display:none; align-items:center;
  justify-content:center; flex-direction:column; padding:30px;
}
.lightbox.open{display:flex;}
.lightbox img{max-width:90vw; max-height:80vh; border-radius:16px;}
.lightbox p{color:#fff; margin-top:14px;}
.lightbox-close{position:absolute; top:24px; right:32px; background:none; border:none; color:#fff; font-size:2.4rem;}

/* =============== Testimonials =============== */
.testimonial-track{position:relative; max-width:720px; margin:0 auto; min-height:220px;}
.testimonial-card{
  position:absolute; inset:0; opacity:0; transform:translateX(30px); transition:opacity .5s ease, transform .5s ease;
  background:var(--card-bg); border-radius:var(--radius-lg); padding:44px; box-shadow:var(--shadow-card); text-align:center;
}
.testimonial-card.active{opacity:1; transform:translateX(0); position:relative;}
.stars{color:var(--green-dark); font-size:1.2rem; margin-bottom:14px;}
.testimonial-card p{font-size:1.08rem; font-style:italic; color:var(--ink);}
.t-author{display:flex; align-items:center; justify-content:center; gap:12px; margin-top:18px;}
.t-avatar{width:44px; height:44px; border-radius:50%; background:var(--green-soft); display:flex; align-items:center; justify-content:center; font-size:1.3rem;}
.t-author strong{display:block; font-size:.92rem;}
.t-author small{color:var(--ink-soft); font-size:.78rem;}
.testimonial-dots{display:flex; justify-content:center; gap:10px; margin-top:26px;}
.testimonial-dots span{width:10px; height:10px; border-radius:50%; background:var(--dot-inactive); cursor:pointer; transition:background .3s ease;}
.testimonial-dots span.active{background:var(--green);}

/* =============== FAQ =============== */
.faq-container{max-width:820px;}
.accordion-item{border-bottom:1px solid rgba(255,255,255,.25);}
.accordion-head{
  width:100%; text-align:left; background:none; border:none; padding:22px 4px; font-family:var(--font-display);
  font-size:1.02rem; display:flex; justify-content:space-between; align-items:center; color:#fff;
}
.accordion-head span{color:var(--yellow); font-size:1.4rem; transition:transform .3s ease;}
.accordion-item.open .accordion-head span{transform:rotate(45deg);}
.accordion-body{max-height:0; overflow:hidden; transition:max-height .35s ease;}
.accordion-item.open .accordion-body{max-height:220px;}
.accordion-body p{padding:0 4px 20px; color:rgba(255,255,255,.85);}

/* =============== Admissions =============== */
.admission-steps{display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:12px; margin-bottom:40px;}
.admission-step{
  background:var(--card-bg); border-radius:var(--radius-md); padding:26px 22px; text-align:center; box-shadow:var(--shadow-card);
  min-width:140px; transition:transform .3s ease, box-shadow .3s ease;
}
.admission-step:hover{transform:translateY(-6px) scale(1.04); box-shadow:0 22px 40px -18px rgba(25,164,1,.35);}
.admission-step.final{background:linear-gradient(135deg, var(--green) 0%, var(--green-dark) 100%); color:#fff;}
.admission-step.final h4{color:#fff;}
.step-num{
  display:flex; align-items:center; justify-content:center; width:40px; height:40px; margin:0 auto 12px; border-radius:50%;
  background:var(--green-soft); color:var(--green-dark); font-weight:700; font-family:var(--font-display);
}
.admission-step.final .step-num{background:rgba(255,255,255,.25); color:#fff;}
.admission-step h4{font-size:.95rem; margin:0;}
.admission-arrow{color:var(--green); font-size:1.4rem;}
.admission-cta{text-align:center;}
@media (max-width:700px){.admission-arrow{transform:rotate(90deg);}}

/* =============== Contact =============== */
.contact-grid{display:grid; grid-template-columns:1fr 1.2fr; gap:50px; align-items:stretch;}
.contact-list li{display:flex; gap:16px; margin-bottom:22px;}
.contact-list li span{font-size:1.5rem;}
.contact-list li strong{display:block; margin-bottom:2px; font-family:var(--font-display); color:#fff;}
.contact-list li p{margin:0; font-size:.92rem; color:rgba(255,255,255,.85);}
.contact-list li a{color:var(--yellow); font-weight:700;}
.contact-map{border-radius:var(--radius-lg); overflow:hidden; min-height:340px; box-shadow:var(--shadow-card);}
.contact-map iframe{width:100%; height:100%; min-height:340px;}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr;}}

/* =============== Standalone Enquiry Section =============== */
.enquiry-section{background:var(--green-dark);}
.enquiry-section::before{background:radial-gradient(circle, rgba(252,223,3,.30) 0%, rgba(252,223,3,0) 70%);}
.enquiry-section::after{background:radial-gradient(circle, rgba(12,83,1,.35) 0%, rgba(12,83,1,0) 70%);}
.enquiry-section .section-head h2{color:#fff;}
.enquiry-section .section-sub{color:rgba(255,255,255,.88);}
.enquiry-form-card{
  max-width:640px; margin:0 auto; background:var(--card-bg); border-radius:var(--radius-lg); padding:44px;
  box-shadow:var(--shadow-card); border:1px solid var(--border-tint); position:relative; z-index:1;
}
.enquiry-form-card input, .enquiry-form-card select, .enquiry-form-card textarea{
  width:100%; padding:13px 16px; border-radius:12px; border:1.5px solid var(--border-tint); font-family:var(--font-body);
  font-size:.92rem; background:#fff; color:var(--ink);
}
.enquiry-form-card textarea{margin-bottom:16px; resize:vertical;}
.enquiry-form-card input:focus, .enquiry-form-card select:focus, .enquiry-form-card textarea:focus{
  outline:2px solid var(--green); border-color:var(--green);
}

/* =============== Footer =============== */
.footer{background:linear-gradient(180deg, var(--green-dark) 0%, var(--green-deepest) 100%); color:#fff; padding:70px 0 0;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; padding-bottom:40px;}
.footer-brand img{height:56px; border-radius:8px; margin-bottom:14px;}
.footer-brand p{color:rgba(255,255,255,.75); font-size:.9rem;}
.footer-col h4{color:#fff; font-size:.95rem; margin-bottom:16px;}
.footer-col a{display:block; color:rgba(255,255,255,.75); font-size:.9rem; margin-bottom:10px; transition:color .25s ease;}
.footer-col a:hover{color:var(--yellow);}
.footer-col p{color:rgba(255,255,255,.75); font-size:.9rem;}
.social-icons{display:flex; gap:12px;}
.social-icons a{
  width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.12); display:flex; align-items:center;
  justify-content:center; font-size:1.1rem;
}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.15); padding:22px 24px; display:flex; justify-content:space-between;
  flex-wrap:wrap; gap:8px; font-size:.82rem; color:rgba(255,255,255,.7); max-width:1240px; margin:0 auto;
}
.credit-link{
  color:var(--yellow); position:relative; transition:color .3s ease;
}
.credit-link::after{
  content:''; position:absolute; left:0; bottom:-2px; width:0; height:1px; background:var(--yellow);
  transition:width .3s ease;
}
.credit-link:hover{color:#fff;}
.credit-link:hover::after{width:100%;}
@media (max-width:800px){.footer-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:520px){.footer-grid{grid-template-columns:1fr;}}

/* =============== Floating Action Buttons =============== */
.fab-stack{position:fixed; right:22px; bottom:26px; z-index:500; display:flex; flex-direction:column; gap:14px;}
.fab{
  width:54px; height:54px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.4rem;
  box-shadow:0 10px 25px -8px rgba(0,0,0,.35); border:none; color:#fff; transition:transform .3s ease;
}
.fab:hover{transform:scale(1.1);}
.fab-whatsapp{background:#25D366;}
.fab-call{background:var(--yellow);}
.fab-admission{background:var(--green);}
.fab-top{background:var(--green-dark); opacity:0; pointer-events:none; transition:opacity .3s ease, transform .3s ease;}
.fab-top.show{opacity:1; pointer-events:auto;}

@media (max-width:600px){
  .fab-stack{right:14px; bottom:90px;}
  .fab{width:48px; height:48px; font-size:1.2rem;}
}

/* =============== Enquiry Popup =============== */
.enquiry-overlay{
  position:fixed; inset:0; background:rgba(20,30,18,.55); backdrop-filter:blur(4px); z-index:1500; display:none;
  align-items:center; justify-content:center; padding:20px;
}
.enquiry-overlay.open{display:flex;}
.enquiry-modal{
  width:100%; max-width:520px; max-height:88vh; overflow-y:auto; background:rgba(248,245,221,.9); backdrop-filter:blur(18px);
  border:1px solid rgba(255,255,255,.5); border-radius:var(--radius-lg); padding:40px; box-shadow:0 40px 80px -25px rgba(0,0,0,.4);
  position:relative; animation:popIn .45s ease;
}
@keyframes popIn{from{opacity:0; transform:scale(.9) translateY(20px);}to{opacity:1; transform:scale(1) translateY(0);}}
.enquiry-close{position:absolute; top:16px; right:18px; background:none; border:none; font-size:1.8rem; color:var(--ink-soft);}
.enquiry-modal h3{margin-bottom:6px;}
.enquiry-modal form{margin-top:20px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:12px;}
@media (max-width:520px){.form-row{grid-template-columns:1fr;}}
.enquiry-modal input, .enquiry-modal select, .enquiry-modal textarea{
  width:100%; padding:13px 16px; border-radius:12px; border:1.5px solid var(--border-tint); font-family:var(--font-body);
  font-size:.92rem; background:var(--card-bg); color:var(--ink);
}
.enquiry-modal textarea{margin-bottom:16px; resize:vertical;}
.enquiry-modal input:focus, .enquiry-modal select:focus, .enquiry-modal textarea:focus{outline:2px solid var(--green); border-color:var(--green);}
.hidden-field{position:absolute; left:-9999px;}
.form-status{text-align:center; font-size:.85rem; margin-top:10px; min-height:1.2em;}

/* =============== Chatbot =============== */
.chatbot{position:fixed; right:22px; bottom:96px; z-index:600;}
@media (max-width:600px){.chatbot{right:14px; bottom:16px;}}
.chatbot-toggle{
  width:60px; height:60px; border-radius:50%; border:none; background:linear-gradient(135deg, var(--yellow), var(--green));
  box-shadow:0 12px 28px -8px rgba(25,164,1,.5); font-size:1.6rem; animation:chatPulse 2.4s ease-in-out infinite;
}
@keyframes chatPulse{0%,100%{box-shadow:0 12px 28px -8px rgba(25,164,1,.5);}50%{box-shadow:0 12px 34px -4px rgba(252,223,3,.6);}}
.chatbot-window{
  position:absolute; bottom:74px; right:0; width:340px; max-width:88vw; height:460px; max-height:70vh; background:var(--card-bg);
  border-radius:var(--radius-lg); box-shadow:0 30px 70px -20px rgba(0,0,0,.35); display:none; flex-direction:column; overflow:hidden;
  border:1px solid var(--border-tint);
}
.chatbot.open .chatbot-window{display:flex;}
.chatbot-header{
  background:linear-gradient(90deg, var(--green) 0%, var(--green-dark) 100%); color:#fff; padding:16px 18px;
  display:flex; justify-content:space-between; align-items:center; font-family:var(--font-display); font-weight:600;
}
.chatbot-header button{background:none; border:none; color:#fff; font-size:1.4rem;}
.chatbot-messages{flex:1; overflow-y:auto; padding:16px; display:flex; flex-direction:column; gap:10px; background:var(--yellow-tint-2);}
.chat-msg{max-width:85%; padding:10px 14px; border-radius:14px; font-size:.88rem; line-height:1.5;}
.chat-msg.bot{background:var(--card-bg); align-self:flex-start; box-shadow:0 4px 12px -4px rgba(0,0,0,.1);}
.chat-msg.user{background:var(--green); color:#fff; align-self:flex-end;}
.chat-msg a{color:var(--green-dark); font-weight:700; text-decoration:underline;}
.chat-msg.user a{color:#fff;}
.chatbot-quick{display:flex; flex-wrap:wrap; gap:8px; padding:0 14px 10px;}
.chatbot-quick button{
  background:var(--green-soft); border:none; color:var(--green-dark); font-size:.76rem; padding:7px 12px; border-radius:99px;
  font-weight:600;
}
.chatbot-input{display:flex; border-top:1px solid var(--border-tint);}
.chatbot-input input{flex:1; border:none; padding:14px 16px; font-family:var(--font-body); font-size:.88rem; outline:none;}
.chatbot-input button{background:var(--green); color:#fff; border:none; width:52px; font-size:1.1rem;}

/* Utility */
::selection{background:var(--yellow); color:var(--ink);}
