/* ══════════════════════════════════════════════════
   SPROUT — daycare & early years template
   A Designs by Delia design

   Sixth distinct language — the only genuinely COLOURFUL one:
   Saffron   warm dark   · serif      · brass
   Haven     bone        · roman      · sage
   Sanctuary warm paper  · soft serif · clay        (one warm accent)
   Aperture  cool dark   · sans+mono  · monochrome
   Lumen     blush       · Syne       · rose        (one cool accent)
   Sprout    BRIGHT      · Fredoka    · RAINBOW     (five accents at once)
   ══════════════════════════════════════════════════ */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}

:root{
  --cream:#FFFCF2;
  --butter:#FFE9A8;
  --sun:#FFC93C;
  --sky:#5BC0EB;
  --sky-dk:#2E9BC9;
  --coral:#FF6B6B;
  --mint:#7BD389;
  --grape:#9B6BD6;
  --ink:#2F2A3D;
  --slate:#6D6880;
  --r:26px;
  --r-sm:16px;
  --pill:999px;
  --disp:'Fredoka',sans-serif;
  --sans:'Nunito',sans-serif;
}

html{scroll-behavior:smooth;}
body{
  font-family:var(--sans);background:var(--cream);color:var(--ink);
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
a{text-decoration:none;color:inherit;}
img{display:block;width:100%;height:100%;object-fit:cover;}
::selection{background:var(--sun);color:var(--ink);}

.wrap{max-width:1200px;margin:0 auto;padding:0 clamp(20px,4vw,44px);}

/* ── type ── */
.eyebrow{
  font-family:var(--sans);font-size:13px;font-weight:800;
  letter-spacing:.1em;text-transform:uppercase;color:var(--coral);
}
h1,h2,h3{font-family:var(--disp);font-weight:600;line-height:1.08;letter-spacing:-.015em;}
h1 em,h2 em,h3 em{font-style:normal;color:var(--sky-dk);}

.btn{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--disp);font-size:16px;font-weight:500;
  padding:15px 30px;border-radius:var(--pill);border:3px solid transparent;
  transition:transform .3s cubic-bezier(.34,1.5,.5,1),box-shadow .3s,background .3s,color .3s;
}
.btn:hover{transform:translateY(-4px) rotate(-1deg);}
.btn-coral{background:var(--coral);color:#fff;box-shadow:0 6px 0 #D64C4C;}
.btn-coral:hover{box-shadow:0 10px 0 #D64C4C;}
.btn-sky{background:var(--sky);color:#fff;box-shadow:0 6px 0 var(--sky-dk);}
.btn-sky:hover{box-shadow:0 10px 0 var(--sky-dk);}
.btn-sun{background:var(--sun);color:var(--ink);box-shadow:0 6px 0 #E0A81F;}
.btn-sun:hover{box-shadow:0 10px 0 #E0A81F;}
.btn-out{border-color:var(--ink);color:var(--ink);}
.btn-out:hover{background:var(--ink);color:var(--cream);}

/* ── reveal: a cheerful bounce-in ── */
.js .rv{opacity:0;transform:translateY(26px) scale(.96);transition:opacity .6s ease,transform .75s cubic-bezier(.34,1.5,.5,1);}
.js .rv.in{opacity:1;transform:none;}
.js .rv.d1{transition-delay:.1s;} .js .rv.d2{transition-delay:.2s;}
.js .rv.d3{transition-delay:.3s;} .js .rv.d4{transition-delay:.4s;}

/* ══ NAV ══ */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:90;
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:16px clamp(20px,4vw,44px);transition:background .4s,box-shadow .4s,padding .4s;
}
.nav.stuck{background:rgba(255,252,242,.96);backdrop-filter:blur(10px);box-shadow:0 4px 20px rgba(47,42,61,.08);padding:11px clamp(20px,4vw,44px);}
.nav-logo{display:flex;align-items:center;gap:10px;font-family:var(--disp);font-weight:600;font-size:26px;}
.nav-logo .leaf{
  width:34px;height:34px;flex:0 0 auto;position:relative;
  background:var(--mint);border-radius:50% 12px 50% 50%;transform:rotate(-8deg);
}
.nav-logo .leaf::after{
  content:'';position:absolute;left:52%;top:18%;width:3px;height:64%;
  background:rgba(255,255,255,.75);border-radius:2px;transform:rotate(12deg);
}
.nav-links{display:flex;gap:26px;align-items:center;}
.nav-links a{font-size:16px;font-weight:700;color:var(--ink);opacity:.8;transition:opacity .25s,color .25s;}
.nav-links a:hover{opacity:1;color:var(--coral);}
.burger{display:none;background:none;border:none;cursor:pointer;padding:8px;}
.burger span{display:block;width:24px;height:3px;border-radius:3px;background:var(--ink);margin:5px 0;}

/* ══ HERO ══ */
.hero{padding:clamp(104px,13vh,150px) 0 clamp(40px,5vw,70px);position:relative;overflow:hidden;}
.blob{position:absolute;border-radius:50%;z-index:0;filter:blur(2px);opacity:.55;}
.blob.b1{width:min(380px,42vw);aspect-ratio:1;background:var(--butter);top:4%;right:-6%;}
.blob.b2{width:min(240px,26vw);aspect-ratio:1;background:#CDEBFB;bottom:-8%;left:-5%;}
.blob.b3{width:min(150px,17vw);aspect-ratio:1;background:#FFD5D5;top:52%;right:18%;}
.hero .wrap{position:relative;z-index:2;}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(26px,4vw,58px);align-items:center;}
.hero-copy .eyebrow{display:block;margin-bottom:16px;}
.hero h1{font-size:clamp(42px,6.4vw,84px);margin-bottom:20px;}
.hero h1 .pop{display:inline-block;transform:translateY(20px) scale(.9);opacity:0;transition:transform .7s cubic-bezier(.34,1.6,.5,1),opacity .5s;}
.hero h1 .pop.in{transform:none;opacity:1;}
.hero-copy > p{font-size:18px;font-weight:600;line-height:1.75;color:var(--slate);max-width:42ch;margin-bottom:26px;}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:26px;}
.chips{display:flex;gap:9px;flex-wrap:wrap;}
.chip{
  font-size:13.5px;font-weight:800;padding:9px 16px;border-radius:var(--pill);
}
.chip.a{background:#DFF3E2;color:#3E7A4A;}
.chip.b{background:#D9EEFA;color:#22698C;}
.chip.c{background:#FFE6E6;color:#C44B4B;}
.hero-art{position:relative;}
.hero-art .shot{border-radius:var(--r);overflow:hidden;aspect-ratio:7/5;box-shadow:0 20px 44px rgba(47,42,61,.14);transform:rotate(1.4deg);}
.hero-sticker{
  position:absolute;left:-16px;bottom:-18px;z-index:3;
  background:var(--sun);color:var(--ink);border-radius:var(--r-sm);
  padding:14px 18px;box-shadow:0 10px 26px rgba(47,42,61,.16);transform:rotate(-4deg);
}
.hero-sticker .n{font-family:var(--disp);font-weight:600;font-size:26px;line-height:1;}
.hero-sticker .l{font-size:12.5px;font-weight:800;margin-top:3px;}

/* ══ COLOUR STRIP ══ */
.strip{display:grid;grid-template-columns:repeat(4,1fr);}
.strip div{padding:clamp(18px,2.2vw,28px) clamp(14px,1.8vw,24px);text-align:center;color:#fff;}
.strip div:nth-child(1){background:var(--coral);}
.strip div:nth-child(2){background:var(--sun);color:var(--ink);}
.strip div:nth-child(3){background:var(--mint);}
.strip div:nth-child(4){background:var(--sky);}
.strip .k{font-family:var(--disp);font-weight:600;font-size:clamp(22px,2.6vw,30px);}
.strip .v{font-size:13px;font-weight:800;opacity:.9;margin-top:3px;}

/* ══ SECTION ══ */
.sec{padding:clamp(56px,7vw,104px) 0;}
.sec-butter{background:#FFF6DC;}
.sec-sky{background:#EAF7FD;}
.sec-ink{background:var(--ink);color:var(--cream);}
.sec-ink .eyebrow{color:var(--sun);}
.sec-ink h2 em{color:var(--sun);}
.sec-ink p{color:rgba(255,252,242,.78);}

.head{text-align:center;max-width:660px;margin:0 auto clamp(30px,3.6vw,52px);}
.head .eyebrow{display:block;margin-bottom:12px;}
.head h2{font-size:clamp(32px,4.8vw,60px);}
.head p{font-size:17px;font-weight:600;line-height:1.75;color:var(--slate);margin-top:14px;}

/* ══ AGE GROUPS — colour-coded cards ══ */
.rooms{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,26px);}
.room{
  background:#fff;border-radius:var(--r);overflow:hidden;
  box-shadow:0 10px 26px rgba(47,42,61,.09);
  transition:transform .4s cubic-bezier(.34,1.5,.5,1),box-shadow .4s;
}
.room:hover{transform:translateY(-8px) rotate(-1deg);box-shadow:0 20px 40px rgba(47,42,61,.15);}
.room:nth-child(2):hover{transform:translateY(-8px) rotate(1deg);}
.room-img{aspect-ratio:1;overflow:hidden;position:relative;}
.room-img img{transition:transform .9s cubic-bezier(.2,.8,.2,1);}
.room:hover .room-img img{transform:scale(1.06);}
.room-age{
  position:absolute;top:14px;left:14px;z-index:2;color:#fff;
  font-family:var(--disp);font-weight:500;font-size:15px;
  padding:8px 16px;border-radius:var(--pill);
}
.room:nth-child(1) .room-age{background:var(--coral);}
.room:nth-child(2) .room-age{background:var(--mint);}
.room:nth-child(3) .room-age{background:var(--grape);}
.room-body{padding:22px 24px 26px;}
.room-body h3{font-size:26px;margin-bottom:8px;}
.room-body p{font-size:15px;font-weight:600;line-height:1.7;color:var(--slate);margin-bottom:14px;}
.room-meta{display:flex;gap:8px;flex-wrap:wrap;}
.room-meta span{font-size:12px;font-weight:800;background:#F3F1F7;color:var(--slate);padding:6px 12px;border-radius:var(--pill);}

/* ══ DAILY RHYTHM ══ */
.rhythm{max-width:760px;margin:0 auto;position:relative;}
.rhythm::before{
  content:'';position:absolute;left:58px;top:14px;bottom:14px;width:4px;
  background:repeating-linear-gradient(var(--sky) 0 10px,transparent 10px 20px);
  border-radius:3px;
}
.slot{display:grid;grid-template-columns:auto 1fr;gap:26px;align-items:start;padding:14px 0;position:relative;}
.slot-time{
  font-family:var(--disp);font-weight:500;font-size:15px;color:#fff;
  background:var(--sky);border-radius:var(--pill);padding:9px 0;width:120px;text-align:center;
  position:relative;z-index:2;
}
.slot:nth-child(2n) .slot-time{background:var(--mint);}
.slot:nth-child(3n) .slot-time{background:var(--grape);}
.slot-body h3{font-size:21px;margin-bottom:4px;}
.slot-body p{font-size:15px;font-weight:600;color:var(--slate);line-height:1.65;}

/* ══ GALLERY ══ */
.snaps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.4vw,18px);}
.snaps a{border-radius:var(--r-sm);overflow:hidden;display:block;aspect-ratio:4/3;background:#EFEAF5;}
.snaps a:nth-child(3n){aspect-ratio:1;}
.snaps img{transition:transform .9s cubic-bezier(.2,.8,.2,1);}
.snaps a:hover img{transform:scale(1.07) rotate(1deg);}

/* ══ TEAM ══ */
.people{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(18px,2.4vw,34px);max-width:820px;margin:0 auto;}
.person{text-align:center;}
.person-img{
  width:clamp(150px,20vw,210px);aspect-ratio:1;margin:0 auto 16px;
  border-radius:50%;overflow:hidden;border:6px solid #fff;
  box-shadow:0 12px 28px rgba(47,42,61,.14);
}
.person h3{font-size:24px;margin-bottom:4px;}
.person .role{font-size:13.5px;font-weight:800;color:var(--coral);margin-bottom:10px;}
.person p{font-size:15px;font-weight:600;line-height:1.7;color:var(--slate);}

/* ══ QUOTE ══ */
.quote{max-width:780px;margin:0 auto;text-align:center;}
.quote blockquote{font-family:var(--disp);font-weight:400;font-size:clamp(22px,3vw,36px);line-height:1.35;margin-bottom:20px;}
.quote cite{font-style:normal;font-size:14px;font-weight:800;color:var(--sun);}

/* ══ FAQ ══ */
.faq{max-width:800px;margin:0 auto;}
.faq details{background:#fff;border-radius:var(--r-sm);margin-bottom:12px;overflow:hidden;box-shadow:0 5px 16px rgba(47,42,61,.07);}
.faq summary{
  cursor:pointer;list-style:none;padding:19px 24px;
  font-family:var(--disp);font-weight:500;font-size:19px;
  display:flex;justify-content:space-between;align-items:center;gap:16px;
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:'+';font-size:26px;color:var(--sky);transition:transform .3s;}
.faq details[open] summary::after{content:'–';}
.faq p{padding:0 24px 22px;font-size:15.5px;font-weight:600;line-height:1.8;color:var(--slate);}

/* ══ TOUR FORM ══ */
.tour{display:grid;grid-template-columns:1fr 1fr;gap:clamp(26px,4vw,64px);align-items:start;}
.tour-side h2{font-size:clamp(30px,4.2vw,54px);margin-bottom:16px;}
.tour-side > p{font-size:17px;font-weight:600;line-height:1.75;color:var(--slate);margin-bottom:22px;}
.hours div{display:flex;justify-content:space-between;gap:14px;padding:12px 0;border-bottom:2px dotted #E4DFEC;font-size:15px;font-weight:700;}
.hours .t{color:var(--slate);font-weight:600;}
.form-card{background:#fff;border-radius:var(--r);padding:clamp(24px,3vw,38px);box-shadow:0 12px 32px rgba(47,42,61,.1);}
.field{margin-bottom:16px;}
.field label{display:block;font-size:13px;font-weight:800;color:var(--ink);margin-bottom:7px;}
.field input,.field select,.field textarea{
  width:100%;background:#FAF8FC;border:2px solid #EAE5F2;border-radius:var(--r-sm);
  padding:13px 16px;font-family:var(--sans);font-size:15.5px;font-weight:600;color:var(--ink);
  outline:none;transition:border-color .3s;
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--sky);}
.field textarea{resize:vertical;min-height:92px;}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.form-card button{width:100%;justify-content:center;cursor:pointer;margin-top:6px;}

/* ══ FOOTER ══ */
.foot{background:var(--ink);color:var(--cream);padding:clamp(46px,5.5vw,76px) 0 26px;}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:clamp(22px,3vw,44px);padding-bottom:36px;}
.foot h4{font-family:var(--disp);font-weight:500;font-size:17px;color:var(--sun);margin-bottom:14px;}
.foot p,.foot a{font-size:15px;font-weight:600;line-height:1.95;color:rgba(255,252,242,.68);display:block;transition:color .3s;}
.foot a:hover{color:var(--cream);}
.foot-logo{display:flex;align-items:center;gap:10px;font-family:var(--disp);font-weight:600;font-size:26px;color:var(--cream);margin-bottom:10px;}
.foot-logo .leaf{width:30px;height:30px;background:var(--mint);border-radius:50% 12px 50% 50%;transform:rotate(-8deg);flex:0 0 auto;}
.foot-bot{border-top:2px solid rgba(255,252,242,.16);padding-top:20px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:13px;font-weight:600;color:rgba(255,252,242,.55);}
.foot-bot a{display:inline;color:var(--sun);}

.badge{
  position:fixed;right:16px;bottom:16px;z-index:120;background:var(--ink);color:var(--cream);
  font-family:var(--sans);font-size:12px;font-weight:800;
  padding:11px 17px;border-radius:var(--pill);box-shadow:0 10px 26px rgba(47,42,61,.28);
  transition:transform .3s;
}
.badge:hover{transform:translateY(-3px) rotate(-2deg);}

/* ══ RESPONSIVE ══ */
@media(max-width:900px){
  .nav-links{display:none;}
  .burger{display:block;}
  .hero-grid,.tour{grid-template-columns:1fr;gap:32px;}
  .hero-art .shot{transform:none;aspect-ratio:4/3;}
  .strip{grid-template-columns:1fr 1fr;}
  .rooms{grid-template-columns:1fr;}
  .snaps{grid-template-columns:1fr 1fr;}
  .people{grid-template-columns:1fr;}
  .rhythm::before{left:44px;}
  .slot{gap:16px;}
  .slot-time{width:92px;font-size:13.5px;}
  .f2{grid-template-columns:1fr;gap:0;}
  .foot-grid{grid-template-columns:1fr 1fr;}
}

@media(prefers-reduced-motion:reduce){
  .js .rv{opacity:1;transform:none;transition:none;}
  .hero h1 .pop{opacity:1;transform:none;}
  .btn:hover,.room:hover{transform:none;}
}