  
:root{
  --peach-50:#FFF6EC;
  --peach-100:#FDE7CE;
  --peach:#F3903F;        /* primary brand orange, matched to live site CTAs */
  --peach-700:#B85F1B;
  --sage:#6FA267;         /* leafy green, "Tree" half of the brand */
  --sage-100:#EAF3E6;
  --sky:#7BC4E0;          /* playful accent for kid decorations */
  --violet-100:#F6E9F9;
  --sun:#FFC845;          /* playful accent for kid decorations */
  --ink:#3A2E22;
  --ink-soft:#3f3f3f;
  --cream:#FFFDF9;
  --white:#FFFFFF;
  --line:#F1E3CE;
  --orange:#fc742c;
  --violet:#b434b4;
  --font-display:'Comic Sans MS'; 
  --font-body:"Roboto", sans-serif;
} 


@font-face {
    font-family: 'Comic Sans MS';
    src: url('../fonts/ComicSansMS-Italic.eot');
    src: url('../fonts/ComicSansMS-Italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/ComicSansMS-Italic.woff2') format('woff2'),
        url('../fonts/ComicSansMS-Italic.woff') format('woff'),
        url('../fonts/ComicSansMS-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}




*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font-body);
  background:var(--cream);
  color:var(--ink-soft);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:1140px;margin:0 auto;padding:0 28px;position:relative;z-index:2;}

h1,h2,h3{font-family:var(--font-display);font-weight:700;color:var(--violet);margin:0;}
h1 {
  font-size: clamp(32px,4.4vw,50px);
  line-height: 1.2;
  max-width: 700px;
  margin-bottom: 22px;
}
h2{font-size:clamp(26px,3vw,38px);line-height:1.18; margin-bottom: 24px;}
h2.center{text-align:center;}
h3{font-size:19px;}
p{font-size:16px;line-height:1.7;color:var(--ink-soft);margin:0 0 16px; font-weight: 300;}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 14px;
  color: var(--white);
  background: var(--orange);
  border-radius: 100px;
  padding: 6px 16px;
  margin-bottom: 14px;
}
.eyebrow.center{display:inline-flex;}

/* ---------- program highlight cards (below sliding banner) ---------- */
.programs-strip{padding:90px 0 20px;position:relative;background:var(--cream);}
.program-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:22px;
  align-items:stretch;
}
.program-card{
  background:#fff;
  border-radius:22px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  /*box-shadow:0 10px 26px rgba(58,46,34,.10);*/
  transition:transform .3s cubic-bezier(.22,1,.36,1), box-shadow .3s ease;
}
.program-card:hover{
  transform:translateY(-6px);
  box-shadow:0 20px 40px rgba(58,46,34,.16);
}
.card-photo{position:relative;aspect-ratio:1/1;overflow:hidden;}
.card-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease;}
.program-card:hover .card-photo img{transform:scale(1.08);}
.age-badge{
  position:absolute;top:12px;right:12px;
  background:#fff;color:var(--ink);
  font-family:var(--font-body);font-weight:800;font-size:11.5px;letter-spacing:.02em;
  padding:6px 14px;border-radius:100px;
  box-shadow:0 4px 10px rgba(0,0,0,.14);
  white-space:nowrap;
}
.card-body{
  padding:22px 20px 24px;
  flex:1;
  display:flex;
  flex-direction:column;
}
.card-body h3 {
  font-family: var(--font-display);
  font-weight: 700;
  color: var(--ink);
  font-size: 22px;
  line-height: 1.2;
  margin: 0 0 14px;
}
.card-body p{
  font-size:14px;line-height:1.6;
  color:var(--ink-soft);font-weight:300;
  margin:0 0 20px;
  flex:1;
}
/* card colour variants — cycled through the brand palette */
.card-mint .card-body{background: rgb(255, 236, 237);}

.card-sky .card-body {background: rgb(222, 251, 245);}

.card-violet .card-body{background:var(--violet-100);}

.card-coral .card-body{background: rgb(243, 244, 224);}

.card-peach .card-body{background:#fff2ff;}

@media (max-width:1080px){
  .program-grid{grid-template-columns:repeat(3,1fr);}
}
@media (max-width:680px){
  .program-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:460px){
  .program-grid{grid-template-columns:1fr;}
  .program-card{max-width:360px;margin:0 auto;}
}
.section-head.center{text-align:center;max-width:640px;margin:0 auto 8px;}
.section-head.center .eyebrow{margin-left:auto;margin-right:auto;}

/* ---------- buttons (bouncy, rounded, kid-friendly) ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 17px;
  padding: 13px 34px;
  border-radius: 100px;
  border: none;
  cursor: pointer;
  transition: transform .18s cubic-bezier(.34,1.56,.64,1), box-shadow .18s ease, background .18s ease;
  text-transform: uppercase;
}
.btn-lg {
  padding: 13px 34px;
  font-size: 17px;
}
.btn-primary{background:var(--violet);color:#fff;}
.btn-primary:hover{background:var(--orange);transform:translateY(-3px);}
.btn-primary:active{transform:translateY(0);box-shadow:0 3px 0 var(--peach-700);}
.btn-outline{border:2px solid var(--orange);color:var(--orange);background:transparent;}
.btn-outline:hover{background:var(--orange);color:#fff;transform:translateY(-3px);}
.btn-light {
  background: #fff;
  color: var(--orange);
  box-shadow: 0 10px 24px rgba(0,0,0,.18), 0 2px 0 rgba(0,0,0,.06);
  padding: 14px 44px;
  font-size: 22px;
}
.btn-light:hover{background:var(--peach-50);transform:translateY(-3px);box-shadow:0 14px 28px rgba(0,0,0,.22), 0 2px 0 rgba(0,0,0,.06);}

/* ---------- image placeholders (swap in images/*.jpg) ---------- */

.ph{
  position:relative;overflow:hidden;border-radius:20px;
  display:flex;align-items:center;justify-content:center;
}

.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:18px;}
.ph span{position:relative;z-index:1;color:var(--peach-700);font-size:12.5px;font-weight:700;text-align:center;padding:14px;}


/* ---------- top utility bar ---------- */
.topbar{background:var(--orange);color:#fff;font-size:16px;}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;padding:13px 28px;gap:16px;flex-wrap:wrap;}
.topbar .phone {
  font-weight: 700;
  display: flex;
  align-items: center;
}
.topbar a:hover{text-decoration:underline;}

/* ---------- header (logo + CTA only, no site menu — this is a landing page) ---------- */
header.site{
  position:sticky;top:0;z-index:40;
  background:rgba(255,253,249,.94);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;padding:14px 28px;gap:20px;}
.brand{display:flex;align-items:center;gap:10px;}

/* Offset anchor-scroll targets by the sticky header's height so
   "Enquire Now" / "Explore Our Centre" links don't scroll past their
   top edge underneath it. Reduced in the 767px breakpoint below to
   match the shorter mobile header. */
#top, #why-us, #enquire{scroll-margin-top:116px;}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--peach-50) 0%, var(--cream) 70%);}
.hero-wrap {
  /* display: grid; */
  grid-template-columns: 1.05fr .95fr;
  gap: 48px;
  align-items: center;
  padding-bottom: 20px;
  position: absolute;
  top: 50%;
  right: 0;
  left: 0;
  transform: translateY(-50%);
}
.hero-copy p.sub {
  font-size: 20px;
  max-width: 530px;
  color: #fff;
  line-height: 29px;
  font-weight: 300;
}
.cta-row{display:flex;gap:16px;flex-wrap:wrap;margin:24px 0 10px;}

/* ---------- generic section ---------- */
.section{padding:86px 0;position:relative;}
.section.tight {
  padding: 80px 0 90px;
}
.section.alt{background:#fff1ff;}
.intro{text-align:center;}
.intro .wrap{max-width:900px;}
.intro p{font-size:18px;}
.gallery-section {
  background: var(--peach-50);
  position: relative;
  /* overflow: hidden; */
}
.gallery-dots{
  position:absolute;inset:0;z-index:0;opacity:.55;pointer-events:none;
  background-image:radial-gradient(rgba(243,144,63,.25) 1.6px, transparent 1.6px);
  background-size:26px 26px;
  -webkit-mask-image:linear-gradient(180deg, transparent, #000 18%, #000 82%, transparent);
  mask-image:linear-gradient(180deg, transparent, #000 18%, #000 82%, transparent);
}
.gallery-sub {
  color: var(--ink-soft);
  font-size: 16.5px;
  /* max-width: 520px; */
  margin: 0 auto 50px;
  font-weight: 300;
}

/* ---------- gallery ---------- */
.gallery-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;grid-template-rows:1fr 1fr;gap:18px;height:540px;margin-top:32px;position:relative;z-index:1;}
.gallery-grid .g1{grid-row:1/3;}

/* ---------- split (curriculum / nutrition) ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:52px;}
#nutrition .blob-frame, #nutrition .blob-frame img {
  height: 100%;
}

.stat-badge {
  display: flex;
  gap: 0;
  /* border: 2px dashed rgb(204, 212, 44); */
  border-radius: 40px;
  padding: 20px 22px 30px;
  margin: 8px 0 20px;
  background: rgb(254, 255, 231);
  position: absolute;
  left: 20px;
  top: 11px;
  flex-wrap: wrap;
  text-align: center;
  width: 188px;
  box-shadow: 0 0 18px rgba(0,0,0,.5);
  z-index: 1;
}
.stat-badge .num {
  font-family: var(--font-display);
  font-size: 57px;
  font-weight: 700;
  color: var(--orange);
  display: block;
  width: 100%;
}
.stat-badge .label {
  font-size: 16px;
  color: var(--ink-soft);
  font-weight: 300;
  /* max-width: 230px; */
  line-height: 1.2;
  width: 100%;
  text-transform: capitalize;
}
.icon-row{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:24px 0 8px;}
.icon-card {
  /* border: 2px solid rgb(204, 212, 44); */
  border-radius: 36px;
  padding: 16px 12px;
  text-align: center;
  background: rgb(244, 246, 205);
  transition: transform .15s ease;
  margin-bottom: 10px;
}
.icon-card:hover{transform:translateY(-4px);}
.icon-card .dot{font-size:24px;margin-bottom:8px;}
.icon-card span {
  font-size: 14px;
  line-height: 1.4;
  display: block;
  color: var(--ink);
}

/* ---------- why choose ---------- */
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:32px;}
.why-card {
  background: rgb(253, 255, 219);
  /* border: 2px solid rgb(204, 212, 44); */
  border-radius: 40px;
  padding: 26px 22px;
  transition: transform .15s ease, box-shadow .15s ease;
}

.why-card:hover {
  transform: translateY(-5px);
  box-shadow: 0px 21px 20px -14px rgb(205, 208, 150);
  /* border-color: var(--peach-100); */
}
.why-card .dot {
  width: 68px;
  height: 68px;
  border-radius: 44px;
  margin-bottom: 16px;
  background: rgb(229, 231, 181);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px;
}
.why-card h3 {
  font-size: 20px;
  margin-bottom: 11px;
}.why-card p{font-size:16px;margin:0;}

/* ---------- visit ---------- */
.visit-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:44px;align-items:stretch;margin-top:28px;}
.visit-details {
  background: var(--white);
  /* border: 1px solid var(--violet); */
  border-radius: 40px;
  padding: 28px;
  box-shadow: 0 0 20px rgba(0,0,0,.12);
}
.visit-row{display:flex;gap:14px;padding:14px 0;border-bottom:1px dashed var(--line);}
.visit-row:last-child{border-bottom:none;}
.visit-row .ico{
  width:40px;height:40px;border-radius:50%;flex:none;
  background:#f9e7f9;
  display:flex;align-items:center;justify-content:center;font-size:17px;
}
.visit-row .lbl {
  font-size: 11.5px;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-weight: 800;
  margin-bottom: 3px;
  color: var(--violet);
}
.visit-row .val{font-size:15px;font-weight:700;}
.map-embed {
  border-radius: 40px;
  overflow: hidden;
  /* border: 2px solid var(--line); */
  height: 100%;
  min-height: 320px;
  box-shadow: 0 0 20px rgba(0,0,0,.12);
}
.map-embed iframe{width:100%;height:100%;min-height:320px;border:0;display:block;}

/* ---------- testimonial slider ---------- */
.testimonial-section{
  background:linear-gradient(180deg, var(--peach-50) 0%, #fff 100%);
  position:relative;overflow:hidden;isolation:isolate;
}
.testi-blob{position:absolute;border-radius:50%;z-index:0;pointer-events:none;}
.testi-blob.blob-a{
  width:360px;height:360px;top:-170px;left:-120px;
  background:radial-gradient(circle at 40% 40%, var(--sage-100), rgba(234,243,230,0) 72%);
}
.testi-blob.blob-b {
  width: 480px;
  height: 480px;
  top: -160px;
  left: -110px;
  background: radial-gradient(circle at 50% 50%, var(--peach-100), rgba(253,231,206,0) 72%);
  opacity: .7;
}
.testimonial-section .wrap{position:relative;z-index:1;}

.testi-slider{
  display:flex;align-items:center;gap:14px;
  margin-top:34px;position:relative;
}
.testi-track{
  display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;
  scroll-behavior:smooth;padding:10px 4px 26px;flex:1;
  -ms-overflow-style:none;scrollbar-width:none;
}
.testi-track::-webkit-scrollbar{display:none;}
.testi-card {
  scroll-snap-align: start;
  flex: 0 0 100%;
  max-width: 420px;
  background: var(--white);
  border: 1px solid var(--peach-100);
  border-radius: 28px;
  padding: 32px 28px 26px;
  position: relative;
  box-shadow: 0 16px 14px rgba(58,46,34,.08);
  transition: transform .3s cubic-bezier(.22,1,.36,1), box-shadow .3s ease;
}
.testi-card:hover{
  transform: translateY(-6px);
}
.quote-mark{
  position:absolute;top:14px;right:22px;
  font-family:var(--font-display);font-size:64px;line-height:1;
  color:var(--peach-100);z-index:0;pointer-events:none;
}

.stars{color:var(--sun);letter-spacing:3px;font-size:18px;margin-bottom:12px;position:relative;z-index:1;}
.quote{font-size:15px;line-height:1.7;color:var(--ink-soft);position:relative;z-index:1;margin-bottom:22px;}
.testi-person{display:flex;align-items:center;gap:12px;position:relative;z-index:1;}
.testi-avatar{
  width:38px;height:38px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-weight:700;font-size:16px;color:#fff;
  background:linear-gradient(135deg,var(--peach),var(--violet));
}
.testi-name{font-family:var(--font-display);font-weight:700;color:var(--violet);font-size:15px;}
.testi-loc{display:block;font-family:var(--font-body);font-weight:400;color:var(--ink-soft);font-size:12.5px;margin-top:2px;}

.testi-dots{display:flex;justify-content:center;gap:8px;margin-top:6px;}
.testi-dots button{
  width:9px;height:9px;border-radius:50%;border:none;padding:0;
  background:var(--peach-100);cursor:pointer;transition:background .2s ease, transform .2s ease;
}
.testi-dots button.active{background:var(--peach);transform:scale(1.3);}



/* ---------- enquiry form ---------- */
.enquire{
  color:var(--ink);
  position:relative;overflow:hidden;
  background:linear-gradient(180deg,var(--peach-50) 0%, #fff 100%);
  isolation:isolate;
}
.enquire-blob{position:absolute;border-radius:50%;z-index:0;pointer-events:none;}
.enquire-blob.blob-a {
  width: 580px;
  height: 580px;
  top: -160px;
  right: -120px;
  background: radial-gradient(circle at 40% 40%, var(--peach-100), rgba(253,231,206,0) 72%);
  opacity: .8;
}
.enquire-blob.blob-b{
  width:320px;height:320px;bottom:-150px;left:-110px;
  background:radial-gradient(circle at 50% 50%, var(--sage-100), rgba(234,243,230,0) 72%);
}
.enquire .wrap{position:relative;z-index:2;}
.enquire h2 {
  margin-bottom: 14px;
}
.enquire-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 40px;
  align-items: center;
}
.contact-info{text-align:left;}
.enquire-perks{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:14px;}
.enquire-perks li{
  display:flex;gap:10px;align-items:center;font-size:15px;color:var(--ink);font-weight:600;
}
.enquire-perks li::before {
  content: "✓";
  flex-shrink: 0;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--sage-100);
  color: var(--sage);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 18px;
}
.enquire-call{
  margin-top:32px;display:inline-flex;align-items:center;gap:14px;
  padding:14px 22px;border-radius:20px;
  background:#fff;border:1.5px solid var(--line);
  box-shadow:0 10px 26px rgba(58,46,34,.08);
  transition:transform .18s cubic-bezier(.34,1.56,.64,1), box-shadow .18s ease, border-color .18s ease;
}
.enquire-call:hover{transform:translateY(-3px);border-color:var(--peach);box-shadow:0 14px 30px rgba(58,46,34,.12);}
.enquire-call-icon{
  width:42px;height:42px;border-radius:50%;flex-shrink:0;
  background:var(--orange);display:flex;align-items:center;justify-content:center;
}
.enquire-call-icon img{width:18px;height:18px;}
.enquire-call-lbl{display:block;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);}
.enquire-call-num{display:block;font-family:var(--font-display);font-size:19px;color:var(--orange); font-weight: 700;}

form.card {
  background: #fff;
  border-radius: 32px;
  padding: 36px;
  color: var(--ink);
  box-shadow: 0 24px 60px rgba(58,46,34,.14);
  border:1px solid var(--peach-100);
  position:relative;
}
.field{margin-bottom:16px;}
/* Honeypot field (index.html #f-website): kept in the DOM and tab order
   is disabled via tabindex="-1", but visually hidden off-screen rather
   than display:none, so simple spam bots still fill it in. */
.field-hp{position:absolute;left:-9999px;top:-9999px;width:1px;height:1px;overflow:hidden;margin:0;}
.field label{display:block;font-size:12px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:6px;}
.field input,.field textarea{
  width:100%;border:2px solid var(--line);border-radius:14px;
  padding:15px 16px;font-family:var(--font-body);font-size:14.5px;color:var(--ink);
  background:var(--peach-50);
  transition:border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.field input::placeholder,.field textarea::placeholder{color:#b7a68e;}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--peach);background:#fff;box-shadow:0 0 0 4px var(--peach-100);}
.field textarea{min-height:130px;resize:vertical;}
.row-2{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.submit-btn{
  width:100%;font-family:var(--font-display);
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
}
.req-note{font-size:12px;color:var(--ink-soft);margin-top:14px;text-align:center;}

/* ---------- closing cta ---------- */
.closing{
  position:relative;overflow:hidden;text-align:center;
  padding:96px 0;
  background:
    radial-gradient(120% 160% at 15% -10%, rgba(255,255,255,.18), transparent 55%),
    radial-gradient(90% 140% at 100% 115%, rgba(255,255,255,.14), transparent 50%),
    linear-gradient(135deg,var(--peach) 0%, var(--orange) 55%, #e85f1c 100%);
  color:#fff;
  isolation:isolate;
}
.closing-blob{position:absolute;border-radius:50%;filter:blur(2px);z-index:0;pointer-events:none;}
.closing-blob.blob-1{
  width:340px;height:340px;top:-140px;left:-90px;
  background:radial-gradient(circle at 30% 30%, rgba(255,255,255,.22), rgba(255,255,255,0) 70%);
}
.closing-blob.blob-2{
  width:420px;height:420px;bottom:-220px;right:-120px;
  background:radial-gradient(circle at 60% 40%, rgba(255,255,255,.16), rgba(255,255,255,0) 70%);
}
.closing-dots{
  position:absolute;inset:0;z-index:0;opacity:.5;pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.35) 1.6px, transparent 1.6px);
  background-size:26px 26px;
  -webkit-mask-image:radial-gradient(120% 120% at 50% 40%, #000 15%, transparent 78%);
  mask-image:radial-gradient(120% 120% at 50% 40%, #000 15%, transparent 78%);
}
.closing-wrap{position:relative;z-index:2;}
.closing-badge{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--font-body);font-weight:700;font-size:13px;letter-spacing:.03em;
  text-transform:uppercase;color:#fff;
  background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.35);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  border-radius:100px;padding:8px 20px;margin-bottom:18px;
}
.closing h2{
  color:#fff;
  text-shadow:0 2px 18px rgba(0,0,0,.12);
}
.closing p {
  color: rgba(255,255,255,.92);
  max-width: 560px;
  margin: 12px auto 36px;
  font-size: 19px;
}
.closing-actions{
  display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:22px;
}
.closing-phone-link{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--font-body);font-weight:700;font-size:16px;color:#fff;
  padding:12px 22px;border-radius:100px;
  border:1.5px solid rgba(255,255,255,.55);
  background:rgba(255,255,255,.08);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  transition:background .18s ease, transform .18s cubic-bezier(.34,1.56,.64,1);
}
.closing-phone-link:hover{background:rgba(255,255,255,.2);transform:translateY(-2px);}
.closing-phone-icon {
  /* width: 26px; */
  /* height: 26px; */
  border-radius: 50%;
  /* background: #fff; */
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* ---------- footer ---------- */
footer {
  background: var(--peach-50);
  padding: 30px 0 30px;
  font-size: 13.5px;
}
.footer-bottom span {
  width: 100%;
}
.footer-bottom {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  padding-top: 0;
  font-size: 16px;
  text-align: center;
}
.footer-bottom a{text-decoration:underline;}

.topbar .addr {
  display: flex;
  align-items: center;
  gap: 4px;
}

.brand img {
  max-width: 220px;
}

.hero{min-height:clamp(500px,90vh,900px);}
.hero-media {
  position: absolute;
  inset: 0;
  height: 100%;
  z-index: 0;
}

.hero-copy h1 {
  color: #fff;
}
.hero::before {
  content: "";
  position: absolute;
  background: #000;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: .4;
  z-index: 1;
}

/* ---------- hero banner slider ---------- */
.hero-slider{position:relative;width:100%;height:100%;}
.hero-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity 1.1s ease;z-index:0;}
.hero-slide.active{opacity:1;visibility:visible;z-index:1;}
.hero-slide img{width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.06);animation:hero-kenburns 8s ease-out forwards;}
@keyframes hero-kenburns{
  0%{transform:scale(1.12);}
  100%{transform:scale(1.0);}
}
.hero-arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:6;
  width:48px;height:48px;border-radius:50%;
  background:rgba(255,255,255,.14);border:2px solid rgba(255,255,255,.6);color:#fff;
  font-size:24px;cursor:pointer;display:flex;align-items:center;justify-content:center;
  backdrop-filter:blur(6px);transition:transform .2s ease, background .2s ease, border-color .2s ease;
}
.hero-arrow:hover{background:var(--orange);border-color:var(--orange);transform:translateY(-50%) scale(1.08);}
.hero-arrow.prev{left:24px;}
.hero-arrow.next{right:24px;}
.hero-dots{
  position:absolute;left:50%;bottom:26px;transform:translateX(-50%);z-index:6;
  display:flex;gap:9px;
}
.hero-dots button {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  border: 0 solid rgba(255,255,255);
  background: rgba(255,255,255,.60);
  padding: 0;
  cursor: pointer;
  transition: all .25s cubic-bezier(.34,1.56,.64,1);
}
.hero-dots button.active{background:#fff;border-color:var(--orange);width:26px;border-radius:6px;}

/* falling leaves over the hero banner, generated in main.js */
.hero-leaves{position:absolute;inset:0;z-index:4;overflow:hidden;pointer-events:none;}
.hero-leaf{position:absolute;top:-8%;opacity:0;animation-name:leaf-fall;animation-timing-function:linear;animation-iteration-count:infinite;filter:drop-shadow(0 4px 6px rgba(0,0,0,.25));}
.hero-leaf svg{width:100%;height:100%;display:block;}

@keyframes leaf-fall{
  0%   {top:-8%;opacity:0;transform:translateX(0) rotate(0deg);}
  8%   {opacity:.95;}
  30%  {transform:translateX(26px) rotate(70deg);}
  55%  {transform:translateX(-22px) rotate(160deg);}
  80%  {transform:translateX(20px) rotate(255deg);opacity:.9;}
  100% {top:104%;opacity:0;transform:translateX(-10px) rotate(320deg);}
}
@media (prefers-reduced-motion: reduce){
  .hero-leaf{animation:none;transition:none;}
}

@media (max-width:640px){
  .hero-arrow{width:38px;height:38px;font-size:19px;}
  .hero-arrow.prev{left:12px;}
  .hero-arrow.next{right:12px;}
  .hero-dots{bottom:16px;}
}

.hero-copy .btn.btn-outline {
  border: 2px solid var(--white);
  color: var(--white);
}
.hero-copy .btn.btn-outline:hover {
  border: 2px solid var(--orange);
 }

.section.tight.intro .btn.btn-outline {
  margin-top: 30px;
}

.gallery-section .wrap {
  text-align: center;
}
.gallery-section h2 {
  margin-bottom: 12px;
}

.gallery-grid .ph::before {
  content: "";
  position: absolute;
  top: 10px;
  left: 10px;
  right: 10px;
  bottom: 10px;
  z-index: 1;
  border-radius: 40px;
  opacity: .4;
  transition:.4s ease;
}
.gallery-grid .ph:hover::before {
  opacity: 0;
  transition:.4s ease;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
}

.split-media {
  border-radius: 40px;
  overflow: hidden;
  position: relative;
}
.split-media img{transition:transform .6s ease;}
.split-media:hover img{transform:scale(1.08);}

/* ---------- scroll-in zoom reveal ---------- */
.reveal-zoom{
  opacity:0;
  transform:scale(.82);
  transition:opacity .8s cubic-bezier(.22,1,.36,1), transform .8s cubic-bezier(.22,1,.36,1);
  will-change:transform, opacity;
}
.reveal-zoom.in-view{
  opacity:1;
  transform:scale(1);
}
.icon-card.reveal-zoom .dot,
.why-card.reveal-zoom .dot{transition:transform .3s ease;}

/* logo zoom */
.brand img{transition:transform .3s ease;}
.brand:hover img{transform:scale(1.08);}

/* icon zoom inside cards */
.icon-card .dot img{transition:transform .3s ease;}
.icon-card:hover .dot img{transform:scale(1.15);}
.why-card .dot img{transition:transform .3s ease;}
.why-card:hover .dot img{transform:scale(1.15);}

.icon-card img {
  width: 50px;
  display: block;
  margin: 0 auto 10px;
}

#visit .section-head {
  text-align: center;
  margin-bottom: 46px;
}

.contact-info {
  text-align: left;
}



/* ==========================================================
   INTRO — flying butterfly (left) & rising hearts
   ========================================================== */
.intro{position:relative;overflow:hidden;}
.intro-fly{position:absolute;top:0;z-index:1;pointer-events:none;}
.intro-fly-left{left:3%;top:28%;animation:butterfly-path 9s ease-in-out infinite;}

.butterfly {
  width: 340px;
  height: 332px;
  display: block;
  filter: drop-shadow(0 6px 10px rgba(58,46,34,.18));
}
.butterfly .wing-left{transform-origin:29px 24px;animation:flap-left .72s ease-in-out infinite;}
.butterfly .wing-right{transform-origin:30px 24px;animation:flap-right .72s ease-in-out infinite;}

@keyframes flap-left{0%,100%{transform:scaleX(1);}50%{transform:scaleX(.35);}}
@keyframes flap-right{0%,100%{transform:scaleX(1);}50%{transform:scaleX(.35);}}

@keyframes butterfly-path{
  0%  {transform:translate(0,0) rotate(0deg);}
  20% {transform:translate(34px,-36px) rotate(12deg);}
  40% {transform:translate(14px,-84px) rotate(-10deg);}
  60% {transform:translate(46px,-108px) rotate(8deg);}
  80% {transform:translate(20px,-56px) rotate(-6deg);}
  100%{transform:translate(0,0) rotate(0deg);}
}

/* rising colourful hearts, generated in main.js */
.intro-hearts{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none;}
.intro-heart{position:absolute;bottom:-8%;opacity:0;animation-name:heart-rise;animation-timing-function:ease-in-out;animation-iteration-count:infinite;filter:drop-shadow(0 4px 8px rgba(58,46,34,.18));}
.intro-heart svg{width:100%;height:100%;display:block;}

@keyframes heart-rise{
  0%   {bottom:-8%;opacity:0;transform:translateX(0) scale(.7) rotate(0deg);}
  12%  {opacity:.95;}
  50%  {transform:translateX(16px) scale(1) rotate(8deg);}
  88%  {opacity:.9;}
  100% {bottom:108%;opacity:0;transform:translateX(-14px) scale(.8) rotate(-6deg);}
}

@media (prefers-reduced-motion: reduce){
  .intro-fly-left,.butterfly .wing-left,.butterfly .wing-right,.intro-heart{animation:none;}
}
@media (max-width:920px){
  .intro-hearts{opacity:.7;}
}

/* ==========================================================
   GALLERY — hover effect + click-to-open lightbox
   ========================================================== */
.gallery-grid .ph{
  cursor:pointer;
  border-radius:28px;
  transition:box-shadow .4s ease, transform .35s cubic-bezier(.22,1,.36,1);
  box-shadow:0 14px 30px rgba(58,46,34,.12);
}
.gallery-grid .ph img{
  border-radius:28px;
  transition:transform .6s cubic-bezier(.22,1,.36,1), filter .4s ease;
}
.gallery-grid .ph::after{
  content:"";
  position:absolute;inset:0;z-index:1;
  opacity:0;transition:opacity .4s ease;
  background: linear-gradient(180deg, rgba(58,46,34,0) 40%, rgba(30,20,10,.68) 100%);
}

.gallery-grid .ph:hover{transform:translateY(-6px);box-shadow:0 22px 44px rgba(58,46,34,.22);}
.gallery-grid .ph:hover img{transform:scale(1.08);filter:saturate(1.08);}
.gallery-grid .ph:hover::after{opacity:1;}

.gallery-grid .ph .zoom-icon{
  position:absolute;inset:0;z-index:2;
  display:flex;align-items:center;justify-content:center;
  opacity:0;transform:scale(.6);
  transition:opacity .3s ease, transform .3s cubic-bezier(.34,1.56,.64,1);
}
.gallery-grid .ph:hover .zoom-icon{opacity:1;transform:scale(1);}
.gallery-grid .ph .zoom-icon span{
  width:58px;height:58px;border-radius:50%;
  background:rgba(255,255,255,.18);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border:1.5px solid rgba(255,255,255,.6);
  display:flex;align-items:center;justify-content:center;
  font-size:19px;color:#fff;
  box-shadow:0 8px 20px -6px rgba(0,0,0,.35);
}
.gallery-grid .ph .zoom-icon img {
  position: static;
  width: 30px;
  height: 30px;
  border-radius: 0;
  filter: brightness(0) invert(1);
}
.gallery-grid .ph .ph-caption{
  position:absolute;left:16px;bottom:16px;z-index:2;
  transform:translateY(8px);
  padding:7px 16px;border-radius:100px;
  background:rgba(255,255,255,.18);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.4);
  color:#fff;font-family:var(--font-body);font-weight:700;
  font-size:12px;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;
  opacity:0;transition:opacity .3s ease .05s, transform .3s ease .05s;
}
.gallery-grid .ph:hover .ph-caption{opacity:1;transform:translateY(0);}

/* falling leaves over the gallery, generated in main.js */
.gallery-leaves{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;}
.gallery-leaves .hero-leaf{filter:drop-shadow(0 4px 6px rgba(0,0,0,.15));}

/* lightbox modal */
.lightbox{
  position:fixed;inset:0;z-index:200;
  background:rgba(20,13,7,.92);
  display:none;align-items:center;justify-content:center;
  padding:60px 24px;opacity:0;transition:opacity .3s ease;
}
.lightbox.show{display:flex;opacity:1;}
.lightbox-inner{
  max-width:920px;width:100%;max-height:80vh;
  transform:scale(.92);transition:transform .3s cubic-bezier(.34,1.4,.64,1);
  border-radius:0;overflow:hidden;
}
.lightbox.show .lightbox-inner{transform:scale(1);}
.lightbox-inner img{
  width:100%;height:100%;max-height:80vh;object-fit:contain;
  display:block;
}
.lightbox-close{
  position:absolute;top:22px;right:26px;z-index:2;
  width:42px;height:42px;border-radius:50%;
  background:rgba(255,255,255,.12);border:2px solid rgba(255,255,255,.5);color:#fff;
  font-size:22px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:background .2s ease, transform .2s ease;
}
.lightbox-close:hover{background:var(--orange);border-color:var(--orange);}
.lightbox-arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:2;
  width:48px;height:48px;border-radius:50%;
  background:rgba(255,255,255,.12);border:2px solid rgba(255,255,255,.5);color:#fff;
  font-size:24px;cursor:pointer;display:flex;align-items:center;justify-content:center;
}
.lightbox-arrow:hover{background:var(--orange);border-color:var(--orange);}
.lightbox-arrow.prev{left:24px;}
.lightbox-arrow.next{right:24px;}
.lightbox-count{
  position:absolute;bottom:22px;left:50%;transform:translateX(-50%);
  color:#fff;font-size:13px;font-weight:700;letter-spacing:.04em;
  background:rgba(255,255,255,.12);padding:6px 16px;border-radius:100px;
}

.visit-row .ico img {
  width: 21px;
}

.gallery-section .butterfly {
  width: 220px;
  height: 230px;
}
.gallery-section .intro-fly.intro-fly-left {
  right: 6%;
  left: auto;
  top: -2%;
}

#curriculum .butterfly {
  width: 100px;
  height: 100px;
}

#curriculum .intro-fly {
  top: -1%;
}

#why-us .intro-fly {
  left: auto;
  right: 5%;
  top: -3%;
}
#visit .intro-fly {
  top: auto;
  bottom: -20%;
  left: 3%;
}

#visit .intro-fly .butterfly {
  width: 200px;
  height: 200px;
}

.section.testimonial-section .section-head.center {
  max-width: 700px;
}

@media (max-width:1599px){
 .butterfly {
  width: 240px;
  height: 232px;
} 
.intro-fly-left {
  left: 0;
  top: 28%;
}

#visit .intro-fly .butterfly {
  width: 160px;
  height: 160px;
}
#visit .intro-fly {
  top: auto;
  bottom: -30%;
  left: 2%;
}

}



@media (max-width:1199px){
 .butterfly {
  width: 140px;
  height: 132px;
} 
.intro-fly-left {
  left: 0;
  top: 18%;
}
}


@media (max-width:1023px){
.enquire-blob.blob-a {
  width: 400px;
  height: 400px;
 }
#visit .intro-fly {
  top: auto;
  bottom: -20%;
  left: 1%;
} 
}

@media (max-width:920px){
  .hero-wrap{grid-template-columns:1fr;}
  .hero-media{order:-1;}
  .split{grid-template-columns:1fr;}
  .split.reverse .split-media{order:0;}
  .why-grid{grid-template-columns:1fr 1fr;}
  .icon-row{grid-template-columns:1fr 1fr;}
  .visit-grid{grid-template-columns:1fr;}
  .enquire-grid{grid-template-columns:1fr;}

.gallery-grid {
  grid-template-columns: 1fr 1fr;
  grid-template-rows: repeat(3,300px);
  height: auto;
}

  .gallery-grid .g1{grid-row:auto;grid-column:1/3;}
  .row-2{grid-template-columns:1fr;}

.split.reverse .split-media {
  order: 1;
}
#nutrition .split.reverse {
  gap: 20px;
}

}

@media (max-width:767px){
#top, #why-us, #enquire{scroll-margin-top:90px;}
.intro-fly-left {
  left: 0;
  top: 12%;
}
.butterfly {
  width: 100px;
  height: 112px;
}  
.brand img {
  max-width: 150px;
}
.btn {
  font-size: 15px;
  padding: 11px 24px;
}
header.site .wrap {
  padding: 14px 14px;
}
.topbar .wrap {
  padding: 7px 20px;
 }
.cta-row .btn.btn-primary.btn-lg {
  width: 200px;
}
.cta-row .btn {
  font-size: 13px;
  padding: 11px 22px;
}
.cta-row {
  gap: 8px;
 }

.gallery-grid {
  grid-template-rows: inherit;
}
.gallery-grid .ph {
  padding-bottom: 80%;
}

.field input, .field textarea {
  padding: 12px 14px;
}
.enquire-grid .row-2 {
  gap: 0;
}

.wrap {
  padding: 0 18px;
}
.gallery-section .butterfly {
  width: 120px;
  height: 110px;
}
#visit .intro-fly .butterfly {
  width: 100px;
  height: 100px;
}
#visit .intro-fly {
  top: auto;
  bottom: -14%;
  left: 1%;
}
.closing-phone-link {
  font-size: 16px;
  padding: 9px 17px;
}

#why-us .intro-fly {
  z-index: 111111;
}

}


@media (min-width:640px){
  .testi-card{flex:0 0 calc(50% - 11px);}
}

@media (min-width:980px){
  .testi-card{flex:0 0 calc(33.333% - 15px);}
}

@media (min-width:921px){
  .enquire-grid{grid-template-columns: 1fr 1.05fr;text-align:left;}
}

@media (max-width:560px){
  .why-grid{grid-template-columns:1fr;}
  .icon-row{grid-template-columns:1fr 1fr;}
  .topbar .wrap{font-size:12px;}
}


@media (max-width:640px){
  .lightbox{padding:20px 12px;}
  .lightbox-arrow{width:38px;height:38px;font-size:19px;}
  .lightbox-arrow.prev{left:8px;}
  .lightbox-arrow.next{right:8px;}
  .lightbox-close{top:12px;right:12px;width:36px;height:36px;font-size:18px;}
}


@media (max-width:419px){
 .brand img {
  max-width: 140px;
}
.topbar .wrap {
  padding: 7px 7px;
}
.topbar img {
  width: 18px;
}
}