/* =====================================================================
   SKILL-ED  •  Kindergarten & Day Care  •  Playful Design System
   Colours pulled from the Skill-ed logo: coral, sky, sunshine, leaf
   ===================================================================== */

/* ------------------------- 1. TOKENS ------------------------- */
:root{
  /* brand palette */
  --coral:#f8732e;   --coral-d:#e85c1a;
  --sky:#2dbeec;     --sky-d:#179ec9;
  --sun:#ffc02e;     --sun-d:#f3a712;
  --leaf:#8cc63e;    --leaf-d:#6fae26;
  --berry:#f0568c;   --berry-d:#d63d73;
  --grape:#9b6dde;   --grape-d:#7d4fc4;

  --ink:#3a2f55;          /* friendly deep purple instead of black */
  --ink-soft:#6c6286;
  --cream:#fff8ec;        /* warm page background */
  --cream-2:#fdeede;
  --paper:#ffffff;

  /* type */
  --display:'Fredoka', 'Baloo 2', system-ui, sans-serif;
  --body:'Nunito', system-ui, sans-serif;

  /* shape & depth */
  --r-sm:14px; --r:22px; --r-lg:32px; --r-xl:44px; --r-pill:999px;
  --shadow-sm:0 8px 20px rgba(58,47,85,.10);
  --shadow:0 18px 40px rgba(58,47,85,.14);
  --shadow-lg:0 30px 60px rgba(58,47,85,.18);
  --line:#f0e2d2;        /* soft warm border */
  --line-2:#e6d4c0;
  --ring:4px solid #fff;
  --glow-coral:0 22px 45px -14px rgba(248,115,46,.55);
  --glow-sky:0 22px 45px -14px rgba(45,190,236,.55);
  --glow-sun:0 22px 45px -14px rgba(255,192,46,.6);
  --glow-leaf:0 22px 45px -14px rgba(140,198,62,.55);
  --glow-berry:0 22px 45px -14px rgba(240,86,140,.5);
  --glow-grape:0 22px 45px -14px rgba(155,109,222,.5);

  --maxw:1200px;
  --gut:clamp(20px,5vw,64px);
}

/* ------------------------- 2. RESET ------------------------- */
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--body);
  color:var(--ink);
  background:var(--cream);
  line-height:1.7;
  font-size:1.05rem;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{font-family:inherit;cursor:pointer;border:none;background:none}
input,textarea,select{font-family:inherit;font-size:1rem}
:focus-visible{outline:3px dashed var(--grape);outline-offset:3px}

/* ------------------------- 3. TYPOGRAPHY ------------------------- */
h1,h2,h3,h4,.display{font-family:var(--display);font-weight:600;line-height:1.08;color:var(--ink);letter-spacing:-.01em}
h1{font-size:clamp(2.4rem,6vw,4.4rem)}
h2{font-size:clamp(2rem,4.6vw,3.2rem)}
h3{font-size:clamp(1.35rem,2.4vw,1.7rem)}
p{margin-bottom:1rem}
.lead{font-size:clamp(1.05rem,1.6vw,1.25rem);color:var(--ink-soft)}
strong{font-weight:800}

.script{font-family:var(--display);font-weight:500;color:var(--coral);
  font-size:clamp(1.1rem,2vw,1.45rem);transform:rotate(-3deg);display:inline-block}

/* gradient & highlight helpers */
.grad-text{background:linear-gradient(100deg,var(--coral),var(--berry) 45%,var(--grape));
  -webkit-background-clip:text;background-clip:text;color:transparent}
.hl{position:relative;white-space:nowrap;z-index:0}
.hl::after{content:"";position:absolute;left:-4px;right:-4px;bottom:.06em;height:.42em;
  background:var(--sun);z-index:-1;border-radius:8px;transform:rotate(-1.2deg);opacity:.85}
.hl.sky::after{background:var(--sky)}
.hl.leaf::after{background:var(--leaf)}
.hl.berry::after{background:var(--berry);opacity:.6}

/* ------------------------- 4. LAYOUT ------------------------- */
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gut)}
.wrap-wide{max-width:1360px;margin:0 auto;padding-inline:var(--gut)}
section{position:relative}
.section{padding:clamp(60px,9vw,120px) 0}
.center{text-align:center}
.nowrap{white-space:nowrap}
.grid{display:grid;gap:clamp(20px,2.4vw,34px)}
.g-2{grid-template-columns:repeat(2,1fr)}
.g-3{grid-template-columns:repeat(3,1fr)}
.g-4{grid-template-columns:repeat(4,1fr)}
.stack-lead{max-width:680px}
.center .stack-lead{margin-inline:auto}

/* eyebrow / kicker */
.kicker{display:inline-flex;align-items:center;gap:.5em;font-family:var(--display);
  font-weight:600;color:var(--coral-d);background:#fff;border:2px solid var(--cream-2);
  padding:.4em 1em;border-radius:var(--r-pill);font-size:.95rem;box-shadow:var(--shadow-sm);
  text-transform:uppercase;letter-spacing:.04em}
.kicker .dot{width:.6em;height:.6em;border-radius:50%;background:var(--coral)}
.kicker.sky{color:var(--sky-d)} .kicker.sky .dot{background:var(--sky)}
.kicker.leaf{color:var(--leaf-d)} .kicker.leaf .dot{background:var(--leaf)}
.kicker.berry{color:var(--berry-d)} .kicker.berry .dot{background:var(--berry)}
.kicker.grape{color:var(--grape-d)} .kicker.grape .dot{background:var(--grape)}

.section-head{margin-bottom:clamp(36px,5vw,64px)}
.section-head .kicker{margin-bottom:1rem}

/* ------------------------- 5. BUTTONS ------------------------- */
.btn{display:inline-flex;align-items:center;gap:.6em;font-family:var(--display);
  font-weight:600;font-size:1.05rem;padding:.85em 1.7em;border-radius:var(--r-pill);
  background:var(--coral);color:#fff;border:2px solid transparent;
  box-shadow:var(--shadow-sm);transition:transform .12s ease,box-shadow .12s ease,background .2s;
  position:relative;will-change:transform}
.btn:hover{transform:translateY(-3px);box-shadow:var(--shadow);background:var(--coral-d)}
.btn:active{transform:translateY(3px);box-shadow:none}
.btn .ic{font-size:1.15em;line-height:1}
.btn.sky{background:var(--sky)} .btn.sky:hover{background:var(--sky-d)}
.btn.leaf{background:var(--leaf)} .btn.leaf:hover{background:var(--leaf-d)}
.btn.sun{background:var(--sun);color:var(--ink)} .btn.sun:hover{background:var(--sun-d)}
.btn.berry{background:var(--berry)} .btn.berry:hover{background:var(--berry-d)}
.btn.grape{background:var(--grape)} .btn.grape:hover{background:var(--grape-d)}
.btn.ghost{background:#fff;color:var(--ink)}
.btn.ghost:hover{background:var(--cream-2)}
.btn.lg{font-size:1.18rem;padding:1em 2em}
.btn-row{display:flex;gap:1rem;flex-wrap:wrap}
.btn-row.center{justify-content:center}
.btn[href^="tel:"]{white-space:nowrap}
.center .btn-row{justify-content:center}

/* simple text link with arrow */
.tlink{font-family:var(--display);font-weight:600;color:var(--coral-d);
  display:inline-flex;align-items:center;gap:.4em;transition:gap .2s,color .2s}
.tlink:hover{gap:.8em;color:var(--coral)}

/* ------------------------- 6. HEADER / NAV ------------------------- */
.topbar{background:linear-gradient(90deg,var(--grape),var(--berry));color:#fff;font-weight:700;
  font-size:.92rem}
.topbar .wrap-wide{display:flex;gap:1.4rem;align-items:center;justify-content:space-between;
  padding-block:.5rem;flex-wrap:wrap}
.topbar a{display:inline-flex;align-items:center;gap:.45em;transition:opacity .2s}
.topbar a:hover{opacity:.8}
.topbar .tb-left{display:flex;gap:1.4rem;flex-wrap:wrap}
.topbar .tb-social{display:flex;gap:.7rem}
.topbar .tb-social a{width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.18);
  justify-content:center;font-size:.9rem}
.topbar .tb-social a:hover{background:rgba(255,255,255,.32);opacity:1}

.site-header{position:sticky;top:0;z-index:100;background:rgba(255,248,236,.86);
  backdrop-filter:blur(10px);border-bottom:3px solid var(--cream-2);transition:padding .25s,box-shadow .25s}
.site-header.shrunk{box-shadow:var(--shadow-sm);background:rgba(255,248,236,.96)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;
  padding-block:.7rem;transition:padding .25s}
.site-header.shrunk .nav{padding-block:.35rem}
.brand{display:flex;align-items:center;gap:.6rem;flex-shrink:0;z-index:2}
.brand img{height:clamp(42px,5vw,58px);transition:height .25s}
.site-header.shrunk .brand img{height:42px}

.menu{display:flex;align-items:center;gap:.2rem}
.menu>li{position:relative}
.menu>li>a{display:flex;align-items:center;gap:.35em;font-family:var(--display);font-weight:500;
  color:var(--ink);padding:.6em .85em;border-radius:var(--r-pill);transition:color .2s,background .2s}
.menu>li>a .caret{font-size:.6em;transition:transform .2s}
.menu>li:hover>a{color:var(--coral-d);background:#fff}
.menu>li:hover>a .caret{transform:rotate(180deg)}
.menu>li>a.active{color:var(--coral-d)}

/* dropdowns */
.submenu{position:absolute;top:calc(100% + 10px);left:0;min-width:248px;background:#fff;
  border:2px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);
  padding:.5rem;opacity:0;visibility:hidden;transform:translateY(10px) scale(.98);
  transition:opacity .2s,transform .2s,visibility .2s;z-index:30}
.menu>li:hover>.submenu{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.submenu::before{content:"";position:absolute;top:-8px;left:28px;width:16px;height:16px;
  background:#fff;border-left:2px solid var(--line);border-top:2px solid var(--line);transform:rotate(45deg)}
.submenu li{position:relative}
.submenu a{display:flex;align-items:center;justify-content:space-between;gap:.5em;
  padding:.6em .85em;border-radius:var(--r-sm);font-weight:700;color:var(--ink-soft);transition:.18s}
.submenu a:hover{background:var(--cream);color:var(--coral-d);transform:translateX(3px)}
.submenu .emoji{font-size:1.1em}
.submenu .sub-arrow{font-size:.7em;opacity:.6}
/* nested submenu */
.submenu .submenu{top:-.5rem;left:calc(100% + 8px)}
.submenu li:hover>.submenu{opacity:1;visibility:visible;transform:translateY(0) scale(1)}

.nav-cta{display:flex;align-items:center;gap:.7rem;flex-shrink:0}
.burger{display:none;width:50px;height:50px;border-radius:var(--r-sm);border:2px solid var(--line);
  background:#fff;flex-direction:column;justify-content:center;align-items:center;gap:5px}
.burger span{width:24px;height:3px;background:var(--ink);border-radius:3px;transition:.25s}
.burger.open span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* ------------------------- 7. HERO ------------------------- */
.hero{position:relative;padding:clamp(48px,7vw,96px) 0 clamp(100px,12vw,160px);overflow:hidden;isolation:isolate}
.hero-bg-blob{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-2;background:
  radial-gradient(55% 70% at 85% 15%,rgba(45,190,236,.22),transparent 62%),
  radial-gradient(45% 55% at 5% 25%,rgba(248,115,46,.16),transparent 60%),
  radial-gradient(40% 50% at 30% 100%,rgba(155,109,222,.14),transparent 60%),
  radial-gradient(55% 55% at 65% 95%,rgba(140,198,62,.18),transparent 60%),
  linear-gradient(180deg,#fffdf7 0%,var(--cream) 100%)}
.hero-dots{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;pointer-events:none;
  background-image:radial-gradient(rgba(58,47,85,.09) 1.6px,transparent 1.6px);background-size:26px 26px;
  -webkit-mask-image:radial-gradient(60% 70% at 50% 40%,#000 30%,transparent 100%);
  mask-image:radial-gradient(60% 70% at 50% 40%,#000 30%,transparent 100%)}
.hero-doodle{opacity:.85;z-index:0}
.hero-inner{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,5vw,64px);align-items:center;position:relative;z-index:1}
.hero-copy h1{margin:.6rem 0 1.2rem;font-size:clamp(2.5rem,6.2vw,4.6rem)}
.h1-emoji{display:inline-block;animation:wobble 4s ease-in-out infinite;transform-origin:bottom center}
.hero-copy .lead{max-width:48ch;margin-bottom:1.9rem}

/* pulsing primary button */
.pulse-glow{box-shadow:0 10px 26px -8px rgba(248,115,46,.7);animation:pulseGlow 2.6s ease-in-out infinite}
.pulse-glow:hover{animation:none}
@keyframes pulseGlow{0%,100%{box-shadow:0 10px 26px -8px rgba(248,115,46,.7),0 0 0 0 rgba(248,115,46,.35)}
  60%{box-shadow:0 10px 26px -8px rgba(248,115,46,.7),0 0 0 14px rgba(248,115,46,0)}}

/* social proof strip */
.hero-trust{display:inline-flex;align-items:center;gap:.9rem;margin-top:1.9rem;padding:.6rem 1.1rem .6rem .7rem;
  background:rgba(255,255,255,.75);backdrop-filter:blur(6px);border:2px solid var(--line);border-radius:var(--r-pill);
  box-shadow:var(--shadow-sm);font-size:.95rem;line-height:1.3}
.hero-trust .avatars{display:flex;align-items:center}
.hero-trust .avatars img,.hero-trust .avatars span{width:38px;height:38px;border-radius:50%;border:3px solid #fff;
  object-fit:cover;margin-left:-12px;box-shadow:0 2px 6px rgba(58,47,85,.15)}
.hero-trust .avatars img:first-child{margin-left:0}
.hero-trust .avatars span{display:grid;place-items:center;background:var(--grape);color:#fff;font-weight:800;font-size:1rem}
.hero-trust .stars{display:block;color:var(--sun-d);letter-spacing:.08em;font-size:.9rem;line-height:1}
.hero-trust b{font-family:var(--display);font-weight:600;color:var(--ink)}
.hero-trust small{color:var(--ink-soft);font-weight:700;font-size:.82rem}

/* feature badges */
.hero-badges{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.6rem}
.hero-badge{display:flex;align-items:center;gap:.6rem;font-weight:800;color:var(--ink);font-size:.95rem;line-height:1.25;
  background:#fff;border:2px solid var(--line);border-radius:var(--r-pill);padding:.4rem 1rem .4rem .45rem;
  box-shadow:var(--shadow-sm);transition:transform .2s,box-shadow .2s}
.hero-badge:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.hero-badge .hb-ic{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;
  font-size:1.2rem;border:3px solid #fff;box-shadow:var(--shadow-sm);background:var(--sun)}
.hero-badge:nth-child(2) .hb-ic{background:var(--sky)}
.hero-badge:nth-child(3) .hb-ic{background:var(--leaf)}
.hero-badge small{display:block;font-weight:700;color:var(--ink-soft);font-size:.76rem}

/* art composition */
.hero-art{position:relative;padding:3% 6% 6% 14%;max-width:560px;margin-left:auto;width:100%}
.hero-halo{position:absolute;inset:4% 0 6% 6%;z-index:0;border-radius:50%;
  background:conic-gradient(from 20deg,var(--sun),var(--coral),var(--berry),var(--grape),var(--sky),var(--leaf),var(--sun));
  filter:blur(48px);opacity:.36;animation:spin 40s linear infinite}
.hero-ring{position:absolute;inset:-2% -2% 4% 4%;z-index:0;border-radius:50%;border:3px dashed rgba(58,47,85,.2);
  animation:spin 60s linear infinite}
.hero-ring::before,.hero-ring::after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;
  background:var(--coral);border:3px solid #fff;box-shadow:var(--shadow-sm)}
.hero-ring::before{top:12%;left:6%}
.hero-ring::after{bottom:14%;right:4%;background:var(--sky)}
/* tall arch window for the portrait photo */
.hero-photo{position:relative;z-index:1;overflow:hidden;aspect-ratio:4/5;
  border-radius:50% 50% 30px 30px/36% 36% 30px 30px;border:7px solid #fff;
  box-shadow:var(--glow-sun),var(--shadow-lg);background:var(--cream-2)}
.hero-photo::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,transparent 55%,rgba(58,47,85,.22))}
.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:60% 20%;transform:scale(1.02);transition:transform .8s}
.hero-art:hover .hero-photo img{transform:scale(1.07)}
/* cut-out reading boy on a pastel card, popping above the card edge */
.hero-photo-sm{position:absolute;z-index:3;left:-4%;bottom:0;width:44%;aspect-ratio:1.15;border-radius:28px;
  background:linear-gradient(160deg,#eaf7d6,#c9ecf9);border:6px solid #fff;box-shadow:var(--glow-leaf),var(--shadow)}
.hero-photo-sm::before{content:"";position:absolute;inset:0;border-radius:22px;pointer-events:none;
  background:radial-gradient(rgba(58,47,85,.08) 1.4px,transparent 1.4px) 0 0/18px 18px}
.hero-photo-sm img{position:absolute;left:50%;bottom:0;width:112%;height:auto;max-width:none;transform:translateX(-50%);
  filter:drop-shadow(0 10px 14px rgba(58,47,85,.22))}
@keyframes blobMorph{
  0%,100%{border-radius:46% 54% 56% 44%/52% 46% 54% 48%}
  33%{border-radius:58% 42% 40% 60%/45% 58% 42% 55%}
  66%{border-radius:42% 58% 60% 40%/55% 44% 56% 45%}
}
.hero-float{position:absolute;font-size:2.2rem;z-index:4;filter:drop-shadow(0 6px 8px rgba(0,0,0,.12))}
.hero-chip{position:absolute;background:rgba(255,255,255,.92);backdrop-filter:blur(6px);border:2px solid var(--line);border-radius:var(--r);
  padding:.55rem .95rem .55rem .6rem;box-shadow:var(--shadow);display:flex;align-items:center;gap:.6rem;
  font-weight:800;font-family:var(--display);z-index:4;line-height:1.15;font-size:1.05rem}
.hero-chip small{font-family:var(--body);font-weight:700;color:var(--ink-soft);font-size:.74rem;display:block}
.hero-chip .hc-ic{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-size:1.1rem;flex-shrink:0}
.chip-a{top:8%;right:-6%;animation:floatY 4s ease-in-out infinite}
.chip-a .hc-ic{background:var(--berry);color:#fff}
.chip-b{top:30%;left:-12%;animation:floatY 5s ease-in-out infinite .6s}
.chip-b .hc-ic{background:var(--leaf);color:#fff}
.chip-c{bottom:4%;right:-4%;animation:floatY 4.6s ease-in-out infinite 1.2s}
.chip-c .hc-ic{background:var(--sky);color:#fff}


/* ------------------------- HERO VINE + SQUIRRELS ------------------------- */
.vine-band{position:relative;height:190px;margin-bottom:-30px;z-index:3;pointer-events:none}
.vine-stage{position:absolute;top:0;left:0;right:0;height:220px;z-index:2;pointer-events:none;overflow:visible}
.vine-svg{width:100%;height:100%;display:block;overflow:visible}
.vine-path{fill:none;stroke:#6fae26;stroke-width:7;stroke-linecap:round;transition:d .5s ease}
.vine.broken .vine-path{stroke:#8cc63e}
.squirrel{transition:opacity .3s}
.sq-inner{animation:sqBounce .32s ease-in-out infinite alternate;transform-origin:0 0}
.sq-leg1{animation:legA .32s ease-in-out infinite alternate;transform-origin:-6px -2px}
.sq-leg2{animation:legB .32s ease-in-out infinite alternate;transform-origin:8px -2px}
.sq-tail{animation:tailWag .6s ease-in-out infinite alternate;transform-origin:-14px -8px}
@keyframes sqBounce{from{transform:translateY(0)}to{transform:translateY(-3px)}}
@keyframes legA{from{transform:rotate(-20deg)}to{transform:rotate(20deg)}}
@keyframes legB{from{transform:rotate(20deg)}to{transform:rotate(-20deg)}}
@keyframes tailWag{from{transform:rotate(-8deg)}to{transform:rotate(10deg)}}
.squirrel.dangling .sq-inner{animation:none;transform:rotate(180deg) translate(-6px,-4px)}
.squirrel.dangling .sq-leg1,.squirrel.dangling .sq-leg2{animation:kick .25s ease-in-out infinite alternate}
@keyframes kick{from{transform:rotate(-35deg)}to{transform:rotate(35deg)}}
.squirrel.saved .sq-inner{animation:sqJump .5s ease-in-out infinite alternate}
@keyframes sqJump{from{transform:translateY(0) scale(1)}to{transform:translateY(-10px) scale(1.05)}}
.squirrel.falling .sq-inner,.squirrel.falling .sq-leg1,.squirrel.falling .sq-leg2{animation:none}
.sq-bubble{transition:opacity .25s;filter:drop-shadow(0 8px 14px rgba(58,47,85,.18))}
.sq-bubble-text{font-family:var(--display);font-weight:600;font-size:22px;fill:var(--ink)}
.sq-bubble-sub{font-family:var(--body);font-weight:800;font-size:13px;fill:var(--ink-soft)}
.sq-bubble.help .sq-bubble-text{fill:var(--coral-d)}
.sq-bubble.happy .sq-bubble-text{fill:var(--leaf-d)}
.sq-bubble.oops .sq-bubble-text{fill:var(--sky-d)}
.sq-count{transition:opacity .2s}
.sq-count.bump{animation:countBump .35s ease-out}
@keyframes countBump{0%{r:16}40%{r:22}100%{r:16}}
.sq-count-text{font-family:var(--display);font-weight:700;font-size:20px;fill:var(--coral-d)}
.sq-star{animation:starFly 1.3s ease-out forwards}
@keyframes starFly{to{transform:translate(var(--dx),var(--dy)) rotate(200deg);opacity:0}}
.leaf-pile{transition:opacity .3s}
.leaf-pile .dizzy{animation:spin 1.2s linear infinite;transform-origin:0 -42px}
/* the Enroll button begs for a click while the squirrel dangles */
.rescue-me{animation:rescuePulse .6s ease-in-out infinite alternate;
  box-shadow:0 0 0 6px rgba(255,192,46,.55),0 14px 30px -8px rgba(248,115,46,.8)}
@keyframes rescuePulse{from{transform:scale(1) rotate(-1.5deg)}to{transform:scale(1.07) rotate(1.5deg)}}
@media(max-width:760px){.vine-band{display:none}
  .bee-fly{display:none}}

/* ------------------------- 8. DECORATIONS + KEYFRAMES ------------------------- */
.deco{position:absolute;z-index:0;pointer-events:none;user-select:none}
.spin-slow{animation:spin 18s linear infinite}
.float-y{animation:floatY 5s ease-in-out infinite}
.float-y.d1{animation-delay:.8s}
.float-y.d2{animation-delay:1.6s}
.wobble{animation:wobble 6s ease-in-out infinite}
.blob-spin{animation:spin 26s linear infinite}
@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}
@keyframes floatX{0%,100%{transform:translateX(0)}50%{transform:translateX(18px)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes wobble{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}
@keyframes pop{0%{transform:scale(0)}70%{transform:scale(1.12)}100%{transform:scale(1)}}
@keyframes bobScale{0%,100%{transform:scale(1)}50%{transform:scale(1.07)}}

/* the flying bee that crosses a section */
.bee-fly{position:absolute;width:120px;top:12%;left:-60px;z-index:5;overflow:visible;
  animation:beePath 16s linear infinite}
.bee-body{animation:beeBob .5s ease-in-out infinite alternate}
@keyframes beeBob{from{transform:translateY(0)}to{transform:translateY(-3px)}}
.bee-wing{transform-origin:108px 15px;animation:beeFlap .12s ease-in-out infinite alternate}
.bee-wing.w2{animation-delay:-.06s}
@keyframes beeFlap{from{transform:scaleY(1)}to{transform:scaleY(.35)}}
@keyframes beePath{
  0%{transform:translate(-60px,0) rotate(6deg)}
  25%{transform:translate(28vw,-40px) rotate(-6deg)}
  50%{transform:translate(55vw,24px) rotate(8deg)}
  75%{transform:translate(80vw,-30px) rotate(-5deg)}
  100%{transform:translate(108vw,10px) rotate(6deg)}
}
.cloud-drift{position:absolute;animation:cloudDrift 30s linear infinite;opacity:.9}
@keyframes cloudDrift{from{transform:translateX(-12vw)}to{transform:translateX(112vw)}}

/* floating background dots */
.bg-dots{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;
  background-image:radial-gradient(var(--cream-2) 2.5px,transparent 2.5px);
  background-size:30px 30px;opacity:.6;-webkit-mask-image:linear-gradient(transparent,#000 30%,#000 70%,transparent)}

/* ------------------------- 9. SECTION DIVIDERS ------------------------- */
.wave-top,.wave-bottom{position:absolute;left:0;width:100%;line-height:0;z-index:1}
.wave-top{top:-1px}.wave-bottom{bottom:-1px}
.wave-top svg,.wave-bottom svg{width:100%;height:auto;display:block}
.tilt{transform:rotate(-1.4deg)}

/* coloured band */
.band{position:relative}
.band-cream2{background:var(--cream-2)}
.band-sky{background:linear-gradient(180deg,#eafaff,#d6f2fc)}
.band-leaf{background:linear-gradient(180deg,#f1fae0,#e4f4cd)}
.band-ink{background:linear-gradient(160deg,#46396a,#3a2f55);color:#fff}
.band-ink h1,.band-ink h2,.band-ink h3{color:#fff}
.band-ink .lead{color:rgba(255,255,255,.8)}

/* ------------------------- 10. CARDS ------------------------- */
.card{background:var(--paper);border:2px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--shadow-sm);transition:transform .22s ease,box-shadow .22s ease;position:relative;
  overflow:hidden}
.card:hover{transform:translateY(-10px) rotate(-1deg);box-shadow:var(--shadow-lg)}

/* value card (why choose us) */
.value-card{padding:2rem 1.6rem;text-align:center}
.value-card .v-ic{width:96px;height:96px;margin:0 auto 1.1rem;border-radius:50%;
  display:grid;place-items:center;border:2px solid var(--line);overflow:hidden;background:var(--cream-2)}
.value-card .v-ic img{width:100%;height:100%;object-fit:cover}
.value-card.c1{border-top:10px solid var(--coral)} .value-card.c1 .v-ic{background:#ffe3d3}
.value-card.c2{border-top:10px solid var(--sky)}   .value-card.c2 .v-ic{background:#d4f1fb}
.value-card.c3{border-top:10px solid var(--berry)} .value-card.c3 .v-ic{background:#fcdfeb}
.value-card.c4{border-top:10px solid var(--leaf)}  .value-card.c4 .v-ic{background:#e8f5d2}
.value-card h3{margin-bottom:.5rem}
.value-card p{color:var(--ink-soft);font-size:.98rem;margin:0}

/* ------------------------- ACTIVITIES / PLAY SECTION (logo colours only) ------------------------- */
.play-section{overflow:hidden;padding-bottom:0}
.play-section .section-head{position:relative;z-index:2}
.play-bg{position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(circle at 12% 30%,rgba(255,192,46,.22),transparent 28%),
    radial-gradient(circle at 88% 70%,rgba(140,198,62,.22),transparent 30%),
    radial-gradient(rgba(45,190,236,.18) 2px,transparent 2px) 0 0/28px 28px}
.play-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(30px,5vw,72px);align-items:center;position:relative;z-index:2}

/* stage with the reading child and orbiting activity orbs */
.play-stage{position:relative;aspect-ratio:1;max-width:520px;margin:0 auto;width:100%}
.ps-circle{position:absolute;inset:8%;border-radius:50%;background:linear-gradient(160deg,#2dbeec,#8cc63e);
  box-shadow:inset 0 -30px 60px rgba(255,255,255,.35),var(--glow-sky)}
.ps-circle::after{content:"";position:absolute;inset:14%;border-radius:50%;border:3px dashed rgba(255,255,255,.55)}
.ps-ring{position:absolute;inset:0;border-radius:50%;border:3px dashed rgba(58,47,85,.18);animation:spin 70s linear infinite}
.ps-kid{position:absolute;left:50%;bottom:6%;width:96%;max-width:none;transform:translateX(-50%);z-index:2;
  filter:drop-shadow(0 18px 24px rgba(58,47,85,.28));
  -webkit-mask-image:linear-gradient(180deg,#000 78%,transparent 100%);mask-image:linear-gradient(180deg,#000 78%,transparent 100%)}
.ps-orb{position:absolute;width:clamp(52px,6vw,74px);height:clamp(52px,6vw,74px);border-radius:50%;background:var(--c);
  display:grid;place-items:center;border:4px solid #fff;box-shadow:var(--shadow);z-index:3;padding:11px;
  animation:floatY 5s ease-in-out infinite}
.ps-orb svg{width:100%;height:100%}
.ps-orb.o1{top:6%;left:4%}
.ps-orb.o2{top:2%;right:8%;animation-delay:-1.2s}
.ps-orb.o3{bottom:26%;left:-2%;animation-delay:-2.4s}
.ps-orb.o4{bottom:20%;right:-2%;animation-delay:-3.6s}
.ps-note{position:absolute;left:50%;bottom:-4%;transform:translateX(-50%);z-index:4;background:#fff;border:2px solid var(--line);
  border-radius:var(--r-pill);padding:.5rem 1.3rem;box-shadow:var(--shadow);text-align:center;line-height:1.15;white-space:nowrap}
.ps-note b{font-family:var(--display);font-weight:600;font-size:1.05rem;display:block;color:var(--ink)}
.ps-note small{font-weight:700;color:var(--ink-soft);font-size:.78rem}

/* 2x2 activity tiles */
.play-tiles{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,1.8vw,24px)}
.play-tile{--c:var(--coral);--c-soft:#ffe6d6;position:relative;background:#fff;border:2px solid var(--line);border-radius:var(--r-lg);
  padding:1.5rem 1.4rem 1.4rem;box-shadow:var(--shadow-sm);overflow:hidden;transition:transform .25s,box-shadow .25s}
.play-tile.t2{--c:var(--sky);--c-soft:#d8f2fb}
.play-tile.t3{--c:var(--sun);--c-soft:#fff1c9}
.play-tile.t4{--c:var(--leaf);--c-soft:#e6f4d3}
.play-tile::before{content:"";position:absolute;top:-40px;right:-40px;width:130px;height:130px;border-radius:50%;background:var(--c-soft);z-index:0;transition:transform .35s}
.play-tile:hover{transform:translateY(-8px) rotate(-1deg);box-shadow:var(--shadow-lg)}
.play-tile:hover::before{transform:scale(1.6)}
.play-tile>*{position:relative;z-index:1}
.play-tile .pt-ic{width:64px;height:64px;border-radius:22px;background:var(--c);display:grid;place-items:center;padding:12px;
  border:3px solid #fff;box-shadow:var(--shadow-sm);transform:rotate(-5deg);transition:transform .3s;margin-bottom:1rem}
.play-tile:hover .pt-ic{transform:rotate(5deg) scale(1.06)}
.play-tile .pt-ic svg{width:100%;height:100%}
.play-tile h3{font-size:1.25rem;margin-bottom:.4rem}
.play-tile p{color:var(--ink-soft);font-size:.93rem;margin:0 0 .9rem}
.play-tile .pt-tags{display:flex;flex-wrap:wrap;gap:.35rem}
.play-tile .pt-tags span{font-size:.74rem;font-weight:800;color:var(--ink);background:var(--c-soft);padding:.22em .7em;border-radius:var(--r-pill)}

/* scrolling ticker of activities */
.play-ticker{position:relative;z-index:2;margin-top:clamp(48px,6vw,80px);padding:1rem 0 clamp(70px,8vw,110px);overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.play-ticker ul{display:flex;gap:2.6rem;width:max-content;animation:ticker 40s linear infinite}
.play-ticker li{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--display);font-weight:600;font-size:clamp(1.1rem,1.8vw,1.5rem);
  color:var(--ink);white-space:nowrap}
.play-ticker li svg{width:1.2em;height:1.2em;animation:spin 8s linear infinite}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.play-ticker:hover ul{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.play-ticker ul,.ps-orb,.ps-ring,.play-ticker li svg{animation:none}}

/* activity / feature card */
.act-card{padding:1.9rem 1.5rem 1.7rem;text-align:center;background:#fff;position:relative;overflow:hidden}
.act-card::before{content:"";position:absolute;top:-46px;left:50%;transform:translateX(-50%);
  width:150px;height:150px;border-radius:50%;background:var(--ac-soft,#fff1c9);z-index:0;transition:transform .35s}
.act-card:hover::before{transform:translateX(-50%) scale(1.35)}
.act-card>*{position:relative;z-index:1}
.act-card .a-ic{width:82px;height:82px;margin:0 auto 1.1rem;border-radius:26px;display:grid;
  place-items:center;font-size:2.2rem;line-height:1;background:var(--ac,var(--sun));
  border:4px solid #fff;box-shadow:var(--shadow);transform:rotate(-5deg);transition:transform .3s}
.act-card:hover .a-ic{transform:rotate(6deg) scale(1.07)}
.act-card.a1{--ac:var(--sun);--ac-soft:#fff1c9}
.act-card.a2{--ac:var(--coral);--ac-soft:#ffe6d6}
.act-card.a2 .a-ic{color:#fff}
.act-card.a3{--ac:var(--sky);--ac-soft:#d8f2fb}
.act-card.a4{--ac:var(--leaf);--ac-soft:#e6f4d3}
.act-card h3{font-size:1.22rem;margin-bottom:.45rem}
.act-card p{color:var(--ink-soft);font-size:.95rem;margin:0}

/* event cards */
.event-card{background:#fff;border:2px solid var(--line);border-radius:var(--r-lg);overflow:hidden;
  box-shadow:var(--shadow-sm);transition:transform .25s,box-shadow .25s;display:flex;flex-direction:column}
.event-card:hover{transform:translateY(-8px) rotate(-1deg);box-shadow:var(--shadow-lg)}
.event-card .ec-top{position:relative;height:118px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--ec),var(--ec-d))}
.event-card .ec-top::before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;
  background-image:radial-gradient(rgba(255,255,255,.35) 2px,transparent 2px);background-size:20px 20px}
.event-card .ec-emoji{position:relative;font-size:2.9rem;line-height:1;filter:drop-shadow(0 6px 8px rgba(58,47,85,.28));transition:transform .3s}
.event-card:hover .ec-emoji{transform:scale(1.14) rotate(-8deg)}
.event-card .ec-curve{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:30px}
.event-card .ec-body{padding:1.1rem 1.4rem 1.5rem}
.event-card .ec-body h3{font-size:1.22rem;margin-bottom:.35rem}
.event-card .ec-body h3::after{content:"";display:block;width:34px;height:4px;border-radius:4px;background:var(--ec);margin-top:.4rem}
.event-card .ec-body p{color:var(--ink-soft);font-size:.95rem;margin:0}

/* ------------------------- PROGRAMMES SECTION (logo colours only) ------------------------- */
.prog-section{overflow:hidden;padding-bottom:clamp(170px,22vw,260px);
  background:linear-gradient(180deg,#fff8ec 0%,#e9f7fd 45%,#f3fae8 100%)}
.prog-section .section-head{position:relative;z-index:2}
.prog-sun{position:absolute;top:3%;right:4%;width:clamp(70px,9vw,130px);z-index:0;opacity:.95;
  filter:drop-shadow(0 10px 24px rgba(255,192,46,.45))}
.prog-butterfly{position:absolute;top:8%;left:-80px;width:56px;z-index:3;animation:flyAcross 24s linear infinite}
.prog-butterfly .wing-l{transform-origin:32px 24px;animation:flapL .45s ease-in-out infinite alternate}
.prog-butterfly .wing-r{transform-origin:32px 24px;animation:flapR .45s ease-in-out infinite alternate}
@keyframes flapL{from{transform:scaleX(1)}to{transform:scaleX(.35)}}
@keyframes flapR{from{transform:scaleX(1)}to{transform:scaleX(.35)}}
@keyframes flyAcross{
  0%{transform:translate(0,0) rotate(6deg)}
  25%{transform:translate(28vw,-40px) rotate(-6deg)}
  50%{transform:translate(56vw,20px) rotate(8deg)}
  75%{transform:translate(84vw,-30px) rotate(-6deg)}
  100%{transform:translate(112vw,0) rotate(6deg)}
}

.prog-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,2.2vw,30px);position:relative;z-index:2}
.prog-card{--c:var(--coral);--c-d:var(--coral-d);--c-soft:#ffe6d6;
  display:flex;flex-direction:column;background:#fff;border-radius:var(--r-lg);border:2px solid var(--line);
  box-shadow:var(--shadow-sm);position:relative;overflow:hidden;
  transition:transform .28s cubic-bezier(.2,.8,.3,1.2),box-shadow .28s}
.prog-card.p2{--c:var(--sky);--c-d:var(--sky-d);--c-soft:#d8f2fb}
.prog-card.p3{--c:var(--sun);--c-d:var(--sun-d);--c-soft:#fff1c9}
.prog-card.p4{--c:var(--leaf);--c-d:var(--leaf-d);--c-soft:#e6f4d3}
.prog-card:hover{transform:translateY(-10px) rotate(-1deg);box-shadow:var(--shadow-lg)}
.prog-card::before{content:"";position:absolute;top:0;left:0;right:0;height:8px;background:var(--c);z-index:3}
.prog-card .p-img{position:relative;aspect-ratio:16/11;overflow:hidden;background:var(--c-soft)}
.prog-card .p-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.prog-card:hover .p-img img{transform:scale(1.08)}
.prog-card .p-curve{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:34px;z-index:2}
.prog-card .p-tag{position:absolute;top:20px;left:14px;background:var(--c);color:#fff;
  font-family:var(--display);font-weight:600;padding:.3em 1em;border-radius:var(--r-pill);
  border:2px solid #fff;font-size:.82rem;box-shadow:var(--shadow-sm);z-index:3}
.prog-card.p3 .p-tag{color:var(--ink)}
.prog-card .p-ic{position:absolute;right:16px;bottom:-4px;z-index:4;width:60px;height:60px;border-radius:50%;
  background:var(--c);display:grid;place-items:center;font-size:1.7rem;border:4px solid #fff;
  box-shadow:var(--shadow);transform:rotate(-6deg);transition:transform .3s}
.prog-card:hover .p-ic{transform:rotate(8deg) scale(1.08)}
.prog-card .p-body{padding:1.1rem 1.4rem 1.5rem;display:flex;flex-direction:column;gap:.7rem;flex:1}
.prog-card .p-body h3{font-size:1.35rem;color:var(--ink)}
.prog-card .p-body h3::after{content:"";display:block;width:38px;height:4px;border-radius:4px;background:var(--c);margin-top:.4rem}
.prog-card .p-body p{color:var(--ink-soft);font-size:.95rem;margin:0;flex:1}
.prog-card .p-chips{display:flex;flex-wrap:wrap;gap:.4rem}
.prog-card .p-chips li{font-size:.78rem;font-weight:800;color:var(--ink);background:var(--c-soft);
  padding:.25em .75em;border-radius:var(--r-pill);display:inline-flex;align-items:center;gap:.35em}
.prog-card .p-chips li::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--c)}
.prog-card .p-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;margin-top:.3rem;
  font-family:var(--display);font-weight:600;font-size:1rem;padding:.65em 1.3em;border-radius:var(--r-pill);
  background:var(--c);color:#fff;border:2px solid transparent;box-shadow:var(--shadow-sm);transition:.2s}
.prog-card.p3 .p-btn{color:var(--ink)}
.prog-card .p-btn:hover{background:var(--c-d);transform:translateY(-2px);box-shadow:var(--shadow)}
.prog-card .p-btn span{transition:transform .2s}
.prog-card .p-btn:hover span{transform:translateX(4px)}

/* meadow with plants + animals */
.meadow{position:absolute;left:0;right:0;bottom:0;height:clamp(196px,20vw,272px);z-index:1;pointer-events:none}
.meadow-hills{position:absolute;left:0;bottom:0;width:100%;height:100%}
.meadow>svg:not(.meadow-hills){position:absolute}
/* the purple ground wave only belongs where the footer follows */
.prog-section .m-ground{display:none}

.m-tree{left:3%;width:clamp(104px,10.5vw,152px);bottom:13%}
.m-bird{transform-origin:106px 40px;animation:birdBob 2.4s ease-in-out infinite}
@keyframes birdBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px) rotate(-4deg)}}

.m-bush{width:clamp(56px,6vw,86px)}
.m-bush.b1{left:24%;bottom:12%}
.m-bush.b2{right:12%;bottom:11%}
.m-mushroom{width:clamp(20px,2.2vw,30px);left:38%;bottom:13%}

.m-flower{width:clamp(40px,4.2vw,58px);transform-origin:bottom center}
.m-flower.f1{left:16%;bottom:15%}
.m-flower.f2{right:24%;bottom:13%}
.m-flower.f3{right:6%;bottom:16%}
.m-sprout{width:clamp(22px,2.4vw,32px)}
.m-sprout.s1{left:32%;bottom:12%}
.m-sprout.s2{right:38%;bottom:14%}
.m-snail{width:clamp(60px,6vw,88px);bottom:11%;left:0;animation:crawl 64s linear infinite}
@keyframes crawl{from{transform:translateX(-150px)}to{transform:translateX(100vw)}}
.m-bug{width:clamp(28px,3vw,40px);left:46%;bottom:17%;animation:bobScale 3s ease-in-out infinite}
.m-bunny{width:clamp(56px,5.6vw,80px);right:30%;bottom:13%;transform-origin:bottom center;
  animation:hop 3.2s ease-in-out infinite}
@keyframes hop{0%,55%,100%{transform:translateY(0) scaleY(1)}62%{transform:translateY(0) scaleY(.92)}78%{transform:translateY(-20px) scaleY(1.05)}}
.m-butterfly{width:clamp(30px,3.2vw,44px);bottom:44%;left:-70px;animation:meadowFly 26s linear infinite}
.m-butterfly .wing-l{transform-origin:32px 24px;animation:flapL .45s ease-in-out infinite alternate}
.m-butterfly .wing-r{transform-origin:32px 24px;animation:flapR .45s ease-in-out infinite alternate}
@keyframes meadowFly{
  0%{transform:translate(0,0) rotate(6deg)}
  25%{transform:translate(28vw,30px) rotate(-6deg)}
  50%{transform:translate(56vw,-16px) rotate(8deg)}
  75%{transform:translate(84vw,26px) rotate(-6deg)}
  100%{transform:translate(112vw,0) rotate(6deg)}
}

/* the programmes-section meadow mirrors the footer one so the two scenes differ */
.prog-section .m-tree{left:auto;right:4%}
.prog-section .m-bunny{right:auto;left:22%}
.prog-section .m-flower.f1{left:auto;right:19%}
.prog-section .m-flower.f2{right:auto;left:26%}
.prog-section .m-flower.f3{right:auto;left:7%}
.prog-section .m-bush.b1{left:auto;right:26%}
.prog-section .m-bush.b2{right:auto;left:13%}
.prog-section .m-mushroom{left:auto;right:37%}
.prog-section .m-bug{left:auto;right:44%}
.prog-section .m-sprout.s1{left:auto;right:32%}
.prog-section .m-sprout.s2{right:auto;left:37%}
@media(prefers-reduced-motion:reduce){.prog-butterfly,.m-butterfly,.m-snail,.m-bunny,.m-bug,.m-bird,.m-flower{animation:none}}

/* class card (rounded photo + ribbon) */
.class-card{background:#fff;text-align:center;padding:1.4rem 1.4rem 1.8rem}
.class-card .cl-img{aspect-ratio:1/1;border-radius:24px;overflow:hidden;border:2px solid var(--line);
  margin-bottom:1.1rem;position:relative}
.class-card .cl-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.class-card:hover .cl-img img{transform:scale(1.07)}
.class-card .cl-age{position:absolute;bottom:10px;right:10px;background:#fff;border:2px solid var(--line);
  border-radius:var(--r-pill);font-weight:800;font-size:.78rem;padding:.25em .8em}
.class-card h3{font-size:1.35rem;margin-bottom:.1rem}
.class-card .cl-sub{font-family:var(--display);color:var(--coral-d);font-weight:600;margin-bottom:.6rem}
.class-card p{color:var(--ink-soft);font-size:.92rem;margin-bottom:1rem}
.class-card.k1 .cl-img{box-shadow:var(--glow-coral)}
.class-card.k2 .cl-img{box-shadow:var(--glow-sky)}
.class-card.k3 .cl-img{box-shadow:var(--glow-sun)}
.class-card.k4 .cl-img{box-shadow:var(--glow-leaf)}
.class-card.k5 .cl-img{box-shadow:var(--glow-berry)}
.class-card.k6 .cl-img{box-shadow:var(--glow-grape)}

/* team card */
.team-card{background:#fff;text-align:center;padding:1.5rem;overflow:visible}
.team-card .t-img{width:160px;height:160px;margin:0 auto 1rem;border-radius:50%;overflow:hidden;
  border:2px solid var(--line);box-shadow:var(--glow-sky)}
.team-card .t-img img{width:100%;height:100%;object-fit:cover}
.team-card h3{font-size:1.3rem;margin-bottom:.1rem}
.team-card .t-role{color:var(--ink-soft);font-weight:700;margin-bottom:.7rem}
.team-card .t-social{display:flex;gap:.5rem;justify-content:center}
.team-card .t-social a{width:36px;height:36px;border-radius:50%;background:var(--cream);
  display:grid;place-items:center;border:2px solid var(--line);transition:.2s}
.team-card .t-social a:hover{background:var(--sun);transform:translateY(-3px)}

/* testimonial card */
.quote-card{background:#fff;padding:2rem;display:flex;flex-direction:column;gap:1rem}
.quote-card .stars{color:var(--sun);font-size:1.1rem;letter-spacing:2px}
.quote-card .q-text{font-size:1.05rem;color:var(--ink);font-style:italic;flex:1}
.quote-card .q-who{display:flex;align-items:center;gap:.8rem;margin-top:.4rem}
.quote-card .q-who img{width:54px;height:54px;border-radius:50%;border:3px solid #fff;box-shadow:var(--shadow-sm);object-fit:cover}
.quote-card .q-who b{font-family:var(--display);font-size:1.05rem}
.quote-card .q-who small{color:var(--ink-soft);font-weight:700}
.quote-card .q-mark{font-family:var(--display);font-size:3rem;color:var(--cream-2);line-height:.6;height:.5em}

/* blog card */
.blog-card{background:#fff;display:flex;flex-direction:column}
.blog-card .b-img{aspect-ratio:16/10;overflow:hidden;border-bottom:2px solid var(--line);position:relative}
.blog-card .b-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.blog-card:hover .b-img img{transform:scale(1.08)}
.blog-card .b-date{position:absolute;top:12px;left:12px;background:#fff;border:2px solid var(--line);
  border-radius:14px;text-align:center;padding:.3em .7em;font-family:var(--display);font-weight:600;line-height:1}
.blog-card .b-date b{display:block;font-size:1.2rem;color:var(--coral-d)}
.blog-card .b-date span{font-size:.7rem;text-transform:uppercase}
.blog-card .b-body{padding:1.4rem;display:flex;flex-direction:column;gap:.6rem;flex:1}
.blog-card .b-body h3{font-size:1.2rem;line-height:1.25}
.blog-card .b-body .tlink{margin-top:auto}

/* ------------------------- 11. STATS ------------------------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem}
.stat{background:#fff;border:2px solid var(--line);border-radius:var(--r-lg);padding:1.8rem 1rem;
  text-align:center;box-shadow:var(--shadow);transition:transform .2s}
.stat:hover{transform:translateY(-6px) rotate(-1.5deg)}
.stat .s-ic{font-size:2rem;margin-bottom:.3rem}
.stat .s-num{font-family:var(--display);font-weight:600;font-size:clamp(2.2rem,4vw,3rem);line-height:1;
  color:var(--coral-d)}
.stat:nth-child(2) .s-num{color:var(--sky-d)}
.stat:nth-child(3) .s-num{color:var(--leaf-d)}
.stat:nth-child(4) .s-num{color:var(--grape-d)}
.stat .s-label{font-weight:800;color:var(--ink-soft);margin-top:.3rem}

/* ------------------------- 12. ENROLL STEPS ------------------------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem;counter-reset:step}
.step{position:relative;background:#fff;border:2px solid var(--line);border-radius:var(--r-lg);
  padding:2.2rem 1.4rem 1.6rem;text-align:center}
.step .s-no{counter-increment:step;position:absolute;top:-22px;left:50%;transform:translateX(-50%);
  width:48px;height:48px;border-radius:50%;background:var(--coral);color:#fff;border:2px solid transparent;
  display:grid;place-items:center;font-family:var(--display);font-weight:600;font-size:1.3rem}
.step .s-no::after{content:counter(step)}
.step:nth-child(2) .s-no{background:var(--sky)}
.step:nth-child(3) .s-no{background:var(--leaf)}
.step:nth-child(4) .s-no{background:var(--berry)}
.step .s-emoji{font-size:2.2rem;margin-bottom:.4rem}
.step h3{font-size:1.18rem;margin-bottom:.4rem}
.step p{font-size:.92rem;color:var(--ink-soft);margin:0}

/* ------------------------- 13. SPLIT / FEATURE ------------------------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,64px);align-items:center}
.split.flip .split-media{order:2}
.split-media{position:relative}
.split-media .sm-photo{border-radius:var(--r-xl);overflow:hidden;border:6px solid #fff;
  box-shadow:var(--glow-sky)}
.split-media.alt .sm-photo{box-shadow:var(--glow-coral)}
.split-media .sm-photo img{width:100%;display:block}
.feature-list{display:grid;gap:1rem;margin-top:1.4rem}
.feature-list li{display:flex;gap:.9rem;align-items:flex-start;font-weight:700}
.feature-list .fl-ic{flex-shrink:0;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;
  font-size:1.2rem;border:3px solid #fff;box-shadow:var(--shadow-sm);background:var(--sun)}
.feature-list li:nth-child(2) .fl-ic{background:var(--sky)}
.feature-list li:nth-child(3) .fl-ic{background:var(--leaf)}
.feature-list li:nth-child(4) .fl-ic{background:var(--berry)}
.feature-list small{display:block;font-weight:600;color:var(--ink-soft)}

/* ------------------------- 14. GALLERY ------------------------- */
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.gallery a{position:relative;overflow:hidden;border-radius:var(--r);border:2px solid var(--line);
  aspect-ratio:1/1;display:block}
.gallery a:nth-child(3n){aspect-ratio:auto}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.gallery a::after{content:"🔍";position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-size:1.6rem;
  background:rgba(58,47,85,.55);opacity:0;transition:.25s}
.gallery a:hover img{transform:scale(1.12)}
.gallery a:hover::after{opacity:1}
.gallery.masonry a:nth-child(1){grid-row:span 2}
.gallery.masonry a:nth-child(6){grid-row:span 2}

/* ------------------------- 15. CTA BANNER ------------------------- */
.cta-band{position:relative;overflow:hidden;background:linear-gradient(120deg,var(--coral),var(--berry));
  color:#fff;border-radius:var(--r-xl);padding:clamp(40px,6vw,72px);text-align:center;
  border:2px solid var(--line);box-shadow:var(--shadow)}
.cta-band h2{color:#fff}
.cta-band .lead{color:rgba(255,255,255,.92)}
.cta-band .deco{opacity:.5}

/* ------------------------- 16. FOOTER ------------------------- */
.site-footer{position:relative;background:#3a2f55;color:#d9d2e8;padding-top:120px;margin-top:0}
.footer-wave{position:absolute;top:-1px;left:0;width:100%;line-height:0;z-index:1}
.footer-wave svg{width:100%;height:clamp(40px,6vw,90px);display:block}
.site-footer>.wrap-wide{position:relative;z-index:2}
.footer-top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:2.4rem}
.footer-brand img{height:54px;margin-bottom:1rem;background:#fff;padding:8px 12px;border-radius:16px}
.footer-brand p{color:#b3a9c9;font-size:.95rem}
.footer-social{display:flex;gap:.6rem;margin-top:1.1rem}
.footer-social a{width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.1);
  display:grid;place-items:center;transition:.2s;font-size:1rem}
.footer-social a:hover{background:var(--coral);transform:translateY(-4px)}
.footer-col h4{color:#fff;font-size:1.15rem;margin-bottom:1.1rem;position:relative;padding-bottom:.5rem}
.footer-col h4::after{content:"";position:absolute;left:0;bottom:0;width:36px;height:4px;border-radius:4px;background:var(--sun)}
.footer-col ul{display:grid;gap:.6rem}
.footer-col a{color:#c4bbd8;transition:.2s;display:inline-flex;gap:.5em;align-items:center}
.footer-col a:hover{color:#fff;transform:translateX(4px)}
.footer-contact li{display:flex;gap:.7rem;margin-bottom:.9rem;color:#c4bbd8;align-items:flex-start}
.footer-contact .fc-ic{flex-shrink:0}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:3rem;padding:1.6rem 0;
  display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;color:#9c93b5;font-size:.9rem}
.footer-bottom a:hover{color:#fff}

/* back to top */
.to-top{position:fixed;right:22px;bottom:22px;width:54px;height:54px;border-radius:50%;
  background:var(--coral);color:#fff;border:2px solid transparent;box-shadow:var(--shadow-sm);
  display:grid;place-items:center;font-size:1.3rem;z-index:80;opacity:0;visibility:hidden;
  transform:translateY(20px);transition:.3s}
.to-top.show{opacity:1;visibility:visible;transform:translateY(0)}
.to-top:hover{background:var(--coral-d);transform:translateY(-3px)}

/* whatsapp / call float */
.float-call{position:fixed;left:22px;bottom:22px;z-index:80;display:flex;flex-direction:column;gap:.7rem}
.float-call a{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;font-size:1.4rem;
  border:3px solid #fff;box-shadow:var(--shadow-sm);transition:.2s;color:#fff}
.float-call a:hover{transform:translateY(-3px)}
.float-call .wa{background:#25d366}
.float-call .ph{background:var(--sky);animation:ring 2s ease-in-out infinite}
@keyframes ring{0%,100%{transform:rotate(0)}10%,30%{transform:rotate(-12deg)}20%,40%{transform:rotate(12deg)}}

/* ------------------------- 17. PAGE HEADER (sub pages) ------------------------- */
.page-hero{position:relative;isolation:isolate;color:var(--ink);
  background:linear-gradient(180deg,#d7f1fb 0%,#e8f7fb 45%,#f0f9e4 100%);
  padding:clamp(80px,11vw,140px) 0 clamp(90px,12vw,150px);overflow:hidden;text-align:center}
.page-hero::before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;
  background-image:radial-gradient(rgba(58,47,85,.09) 2px,transparent 2px);background-size:26px 26px;
  -webkit-mask-image:radial-gradient(70% 70% at 50% 40%,#000 20%,transparent 100%);
  mask-image:radial-gradient(70% 70% at 50% 40%,#000 20%,transparent 100%)}
.page-hero .wrap{position:relative;z-index:5}
.page-hero h1{color:var(--ink);position:relative}
.page-hero .crumbs{position:relative;display:inline-flex;flex-wrap:wrap;justify-content:center;gap:.5em;align-items:center;
  font-weight:800;color:var(--ink-soft);margin-top:1rem;background:#fff;border:2px solid var(--line);
  padding:.5em 1.2em;border-radius:var(--r-pill);box-shadow:var(--shadow-sm)}
.page-hero .crumbs a{color:var(--coral-d)}
.page-hero .crumbs a:hover{color:var(--coral)}
.page-hero .crumbs .sep{opacity:.5}
.page-hero .deco{opacity:.95}
/* sky layer: rainbow, clouds, bee */
.ph-sky{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none}
.ph-rainbow{position:absolute;left:50%;top:-8%;width:clamp(240px,34vw,440px);transform:translateX(-50%);
  opacity:.3;animation:rainbowGlow 6s ease-in-out infinite alternate}
@keyframes rainbowGlow{from{opacity:.22}to{opacity:.42}}
.ph-doodle{z-index:4;filter:drop-shadow(0 6px 10px rgba(58,47,85,.15))}
.ph-hills{position:absolute;left:0;right:0;bottom:0;z-index:2;line-height:0;pointer-events:none}
.ph-hills svg{width:100%;height:clamp(70px,9vw,120px);display:block}
.page-hero .vine-stage{z-index:3}
.page-hero .wave-bottom{z-index:4}

/* meadow strip above the footer on every page */
.meadow-strip{position:relative;height:clamp(196px,20vw,272px);margin-top:-1px;margin-bottom:-1px;overflow:hidden;pointer-events:none}
.meadow-strip .meadow{height:100%}

/* friendlier tick lists */
.prose ul.kid-ticks li::before,ul.kid-ticks li::before{background:var(--leaf)}
ul.kid-ticks{display:grid;gap:.7rem;margin:1.2rem 0}
ul.kid-ticks li{display:flex;gap:.7rem;align-items:flex-start;font-weight:700;color:var(--ink)}
ul.kid-ticks li::before{content:"✓";flex-shrink:0;width:28px;height:28px;border-radius:50%;
  background:var(--leaf);color:#fff;display:grid;place-items:center;font-weight:800;font-size:.9rem;
  border:3px solid #fff;box-shadow:var(--shadow-sm)}
ul.kid-ticks li:nth-child(4n+2)::before{background:var(--sky)}
ul.kid-ticks li:nth-child(4n+3)::before{background:var(--sun);color:var(--ink)}
ul.kid-ticks li:nth-child(4n+4)::before{background:var(--coral)}



/* tick lists work anywhere on the site, not just inside .prose */
ul.ticks{display:grid;gap:.7rem;margin:1.2rem 0;list-style:none}
ul.ticks li{display:flex;gap:.7rem;align-items:flex-start;font-weight:700;color:var(--ink)}
ul.ticks li::before{content:"✓";flex-shrink:0;width:28px;height:28px;border-radius:50%;
  background:var(--leaf);color:#fff;display:grid;place-items:center;font-weight:800;font-size:.9rem;
  border:3px solid #fff;box-shadow:var(--shadow-sm)}
ul.ticks li:nth-child(4n+2)::before{background:var(--sky)}
ul.ticks li:nth-child(4n+3)::before{background:var(--sun);color:var(--ink)}
ul.ticks li:nth-child(4n+4)::before{background:var(--coral)}

/* rainbow scroll progress bar */
.scroll-rainbow{position:fixed;top:0;left:0;height:5px;width:0;z-index:200;pointer-events:none;
  background:linear-gradient(90deg,#f8732e,#ffc02e,#8cc63e,#2dbeec);
  border-radius:0 6px 6px 0;transition:width .1s linear}
.scroll-rainbow::after{content:"";position:absolute;right:-7px;top:-4px;width:13px;height:13px;border-radius:50%;
  background:#fff;border:3px solid #2dbeec;box-shadow:0 2px 6px rgba(58,47,85,.25)}

/* playful numbered headings on text pages */
.prose h3{position:relative;padding-left:2.6rem;display:flex;align-items:center;gap:.2rem}
.prose h3::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:30px;height:30px;border-radius:50%;background:var(--sun);border:3px solid #fff;box-shadow:var(--shadow-sm)}
.prose h3:nth-of-type(4n+2)::before{background:var(--sky)}
.prose h3:nth-of-type(4n+3)::before{background:var(--leaf)}
.prose h3:nth-of-type(4n+4)::before{background:var(--coral)}
.prose blockquote{border-radius:var(--r)}

/* prose for content pages */
.prose{max-width:820px;margin:0 auto;font-size:1.08rem}
.prose h2{margin:2.2rem 0 1rem}
.prose h3{margin:1.8rem 0 .8rem;color:var(--coral-d)}
.prose p{margin-bottom:1.2rem;color:#4a4068}
.prose ul.ticks{display:grid;gap:.7rem;margin:1.2rem 0}
.prose ul.ticks li{display:flex;gap:.7rem;align-items:flex-start;font-weight:600}
.prose ul.ticks li::before{content:"✓";flex-shrink:0;width:26px;height:26px;border-radius:50%;
  background:var(--leaf);color:#fff;display:grid;place-items:center;font-size:.85rem;font-weight:900}
.prose blockquote{border-left:6px solid var(--sun);background:var(--cream-2);padding:1.2rem 1.6rem;
  border-radius:0 var(--r) var(--r) 0;font-style:italic;font-size:1.15rem;margin:1.6rem 0}
.info-card{background:#fff;border:2px solid var(--line);border-radius:var(--r-lg);padding:1.8rem;
  box-shadow:var(--shadow-sm)}

/* contact */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,48px);align-items:start}
.field{margin-bottom:1.1rem}
.field label{display:block;font-weight:800;margin-bottom:.4rem;font-family:var(--display)}
.field input,.field textarea,.field select{width:100%;padding:.85em 1.1em;border:2px solid var(--line);
  border-radius:var(--r-sm);background:var(--cream);transition:.2s}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--coral);
  background:#fff;box-shadow:0 0 0 4px rgba(248,115,46,.15)}
.info-row{display:flex;gap:1rem;align-items:flex-start;margin-bottom:1.4rem}
.info-row .ir-ic{flex-shrink:0;width:54px;height:54px;border-radius:16px;display:grid;place-items:center;
  font-size:1.4rem;border:3px solid #fff;box-shadow:var(--shadow-sm);background:var(--sun)}
.info-row:nth-child(2) .ir-ic{background:var(--sky)}
.info-row:nth-child(3) .ir-ic{background:var(--leaf)}
.info-row:nth-child(4) .ir-ic{background:var(--berry)}
.info-row b{font-family:var(--display);font-size:1.1rem}

/* faq accordion */
.faq{max-width:820px;margin:0 auto;display:grid;gap:1rem}
.faq details{background:#fff;border:2px solid var(--line);border-radius:var(--r);overflow:hidden;
  box-shadow:var(--shadow-sm)}
.faq summary{padding:1.1rem 1.4rem;font-family:var(--display);font-weight:600;font-size:1.1rem;
  cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1rem;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:1.6rem;color:var(--coral);transition:transform .2s;flex-shrink:0}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details[open] summary{background:var(--cream-2)}
.faq .faq-body{padding:0 1.4rem 1.2rem;color:var(--ink-soft)}

/* simple chip list */
.chips{display:flex;flex-wrap:wrap;gap:.7rem;justify-content:center}
.chips a,.chips span{background:#fff;border:2px solid var(--line);border-radius:var(--r-pill);
  padding:.45em 1.1em;font-weight:700;transition:.2s}
.chips a:hover{background:var(--sun);transform:translateY(-3px)}

/* ------------------------- 17b. SLIDER / LIGHTBOX / FORM ------------------------- */
.slider{position:relative}
.slider-viewport{overflow:hidden;border-radius:var(--r-lg);margin-inline:8px}
.slider-track{display:flex;transition:transform .55s cubic-bezier(.4,0,.2,1)}
.slider-track .slide{min-width:100%;padding:.4rem}
.slider-dots{display:flex;gap:.5rem;justify-content:center;margin-top:1.6rem}
.sl-dot{width:12px;height:12px;border-radius:50%;background:var(--cream-2);border:2px solid var(--line);transition:.2s}
.sl-dot.on{background:var(--coral);width:30px;border-radius:var(--r-pill)}
.sl-prev,.sl-next{position:absolute;top:50%;transform:translateY(-50%);width:50px;height:50px;border-radius:50%;
  background:#fff;border:2px solid var(--line);box-shadow:var(--shadow-sm);font-size:1.5rem;color:var(--ink);
  display:grid;place-items:center;z-index:5;transition:.15s}
.sl-prev:hover,.sl-next:hover{background:var(--sun)}
.sl-prev{left:-6px}.sl-next{right:-6px}
@media(max-width:680px){.sl-prev,.sl-next{display:none}}

.lightbox{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(34,27,53,.92);z-index:120;display:none;
  align-items:center;justify-content:center;padding:4vw}
.lightbox.on{display:flex}
.lightbox img{max-width:90vw;max-height:86vh;border-radius:var(--r);border:4px solid #fff;
  box-shadow:0 30px 80px rgba(0,0,0,.5)}
.lightbox button{position:absolute;background:#fff;border:2px solid var(--line);border-radius:50%;
  width:52px;height:52px;font-size:1.5rem;color:var(--ink);display:grid;place-items:center;transition:.15s}
.lightbox button:hover{background:var(--sun)}
.lb-close{top:22px;right:22px}
.lb-prev{left:22px;top:50%;transform:translateY(-50%)}
.lb-next{right:22px;top:50%;transform:translateY(-50%)}

.form-note{display:none;margin-top:1rem;background:var(--leaf);color:#fff;font-weight:800;
  padding:.9em 1.2em;border-radius:var(--r-sm);border:2px solid var(--line)}
.form-note.show{display:block;animation:pop .4s}

/* ------------------------- 18. SCROLL REVEAL ------------------------- */
.reveal{opacity:0;transform:translateY(34px);transition:opacity .7s cubic-bezier(.2,.7,.3,1),transform .7s cubic-bezier(.2,.7,.3,1)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.1s}.reveal.d2{transition-delay:.2s}
.reveal.d3{transition-delay:.3s}.reveal.d4{transition-delay:.4s}
.reveal.d5{transition-delay:.5s}.reveal.d6{transition-delay:.6s}
.reveal-pop{opacity:0;transform:scale(.8)}
.reveal-pop.in{opacity:1;transform:scale(1);transition:opacity .5s,transform .55s cubic-bezier(.3,1.4,.5,1)}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .reveal,.reveal-pop{opacity:1;transform:none}
}

/* ------------------------- 19. RESPONSIVE ------------------------- */
@media(max-width:1024px){
  .footer-top{grid-template-columns:1fr 1fr}
  .g-4{grid-template-columns:repeat(2,1fr)}
  .prog-grid{grid-template-columns:repeat(2,1fr)}
  .stats,.steps{grid-template-columns:repeat(2,1fr)}
  .gallery{grid-template-columns:repeat(3,1fr)}
}
/* drawer menu up to 1024px: the full desktop menu needs 1025px (main.js uses the same width) */
@media(max-width:1024px){
  /* a backdrop-filter ancestor becomes the containing block for position:fixed,
     which would trap the drawer inside the header, disable it on mobile */
  .site-header{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(255,248,236,.97)}
  .site-header.shrunk{background:rgba(255,248,236,.99)}
  .nav-cta .btn:not(.burger-cta){display:none}
  .burger{display:flex;position:relative;z-index:96}   /* stays above the open drawer as its close button */
  .menu{position:fixed;top:0;right:0;bottom:0;left:auto;width:min(360px,86vw);background:var(--cream);
    flex-direction:column;align-items:stretch;gap:.2rem;padding:6rem 1.2rem 2rem;overflow-y:auto;
    transform:translateX(110%);transition:transform .32s cubic-bezier(.4,0,.2,1);
    box-shadow:-20px 0 60px rgba(0,0,0,.2);border-left:2px solid var(--line);z-index:95}
  .menu.open{transform:translateX(0)}
  .menu>li>a{justify-content:space-between;font-size:1.15rem;padding:.85em 1em;border-radius:var(--r-sm)}
  .menu>li>a:hover{background:#fff}
  .submenu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:none;
    border-left:3px dashed var(--cream-2);border-radius:0;margin:.2rem 0 .4rem 1rem;padding:0;
    max-height:0;overflow:hidden;transition:max-height .3s}
  .submenu::before{display:none}
  .menu>li.open-sub>.submenu{max-height:600px;padding:.2rem 0}
  .submenu .submenu{margin-left:.8rem;max-height:none;padding:.2rem 0}
  .menu>li>a .caret{transition:transform .25s}
  .menu>li.open-sub>a .caret{transform:rotate(180deg)}
  .nav-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(58,47,85,.5);opacity:0;visibility:hidden;
    transition:.3s;z-index:94}
  .nav-overlay.show{opacity:1;visibility:visible}
}
@media(max-width:900px){
  .hero-inner,.split,.split.flip{grid-template-columns:1fr}
  .play-layout{grid-template-columns:1fr}
  .play-stage{max-width:400px}
  .split.flip .split-media{order:0}
  .hero-art{max-width:400px;margin:0 auto;order:-1;padding:4% 8% 10% 12%}
  .hero-trust{display:flex}
  .hero-doodle{display:none}
  .contact-grid{grid-template-columns:1fr}
}
@media(max-width:680px){
  .g-2,.g-3,.g-4,.stats,.steps{grid-template-columns:1fr}
  .prog-grid{grid-template-columns:1fr;max-width:420px;margin:0 auto}
  .play-tiles{grid-template-columns:1fr}
  .play-stage{max-width:320px}
  .m-flower.f2,.m-sprout.s2,.m-mushroom,.m-bush.b2{display:none}
  .gallery{grid-template-columns:repeat(2,1fr)}
  .gallery.masonry a:nth-child(1),.gallery.masonry a:nth-child(6){grid-row:auto}
  .footer-top{grid-template-columns:1fr;gap:2rem}
  .topbar .tb-left{font-size:.82rem;gap:.9rem}
  .cta-band{box-shadow:var(--shadow)}
  .hero-chip{display:none}
  .hero-photo-sm{width:50%;left:-8%}
  .hero-trust{font-size:.88rem;gap:.7rem}
  .hero .kicker{font-size:.8rem;padding:.35em .9em}
  .hero-badge{padding:.35rem .8rem .35rem .4rem;font-size:.88rem}
}
@media(max-width:400px){
  .topbar .tb-left a span{display:none}
}

@media(max-width:680px){
  .float-call{left:12px;bottom:12px;flex-direction:row;gap:.5rem}
  .float-call a{width:46px;height:46px;font-size:1.15rem;border-width:2px}
  .to-top{right:12px;bottom:12px;width:46px;height:46px;font-size:1.1rem}
  .scroll-rainbow{height:4px}
}

/* =====================================================================
   LEAD GENERATION LAYER: icons, admissions strip, mobile action bar,
   tour modal, lead forms, day timeline, video tour, Google badge,
   safety facts, fees page, thank-you, articles, tour prompt
   ===================================================================== */

/* ---- inline icon system (replaces emoji) ---- */
.ic{width:1.2em;height:1.2em;display:inline-block;vertical-align:-.22em;flex-shrink:0}
.btn .ic{width:1.15em;height:1.15em}
.tlink .ic,.hero-mini-links .ic,.as-link .ic,.gb-text .ic{width:1em;height:1em;vertical-align:-.15em}
.a-ic,.p-ic,.hb-ic,.hc-ic,.ir-ic{color:#fff}
.a-ic .ic{width:46%;height:46%}
.p-ic .ic,.hb-ic .ic,.hc-ic .ic,.ir-ic .ic{width:54%;height:54%}
.act-card.a1 .a-ic,.prog-card.p3 .p-ic,.hero-badge:first-child .hb-ic,.info-row .ir-ic{color:var(--ink)}
.info-row .ir-ic{background:var(--sun)}
.ec-emoji .ic{width:2.7rem;height:2.7rem;color:#fff}
.fc-ic{color:var(--sun);display:inline-flex;margin-top:.15em}
.fc-ic .ic{width:1.1rem;height:1.1rem}
.to-top .ic{width:44%;height:44%}
.s-ic{width:60px;height:60px;border-radius:20px;background:rgba(255,255,255,.14);color:var(--sun);display:grid;place-items:center;margin:0 auto .7rem}
.s-ic .ic{width:50%;height:50%}
.st-ic{color:#fff}
.st-ic .ic{width:1.5rem;height:1.5rem}
.t-qual{color:var(--ink-soft);font-size:.9rem;margin:.4rem 0 .7rem;line-height:1.45}
/* calmer chrome */
.play-ticker li svg{animation:none}
.prog-sun{animation:none}

/* ---- admissions strip ---- */
.admit-strip{background:linear-gradient(90deg,#fff3c4,#ffe3d0);border-bottom:2px solid var(--line);position:relative;z-index:99;transition:opacity .3s,transform .3s}
.admit-strip.gone{opacity:0;transform:translateY(-8px)}
.as-inner{display:flex;align-items:center;gap:.9rem;padding:.55rem 0;font-size:.95rem;flex-wrap:wrap}
.as-pulse{width:10px;height:10px;border-radius:50%;background:var(--coral);flex-shrink:0;animation:asPulse 1.8s ease-out infinite}
@keyframes asPulse{0%{box-shadow:0 0 0 0 rgba(248,115,46,.5)}100%{box-shadow:0 0 0 10px rgba(248,115,46,0)}}
.as-inner p{margin:0;color:var(--ink);flex:1;min-width:220px}
.as-link{font-family:var(--display);font-weight:600;color:var(--coral-d);display:inline-flex;gap:.3em;align-items:center;white-space:nowrap}
.as-link:hover{color:var(--coral)}
.as-close{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;color:var(--ink-soft)}
.as-close:hover{background:rgba(58,47,85,.08)}

/* ---- mobile sticky action bar ---- */
.mobile-bar{display:none}
@media(max-width:760px){
  body{padding-bottom:74px}
  .mobile-bar{position:fixed;left:0;right:0;bottom:0;z-index:90;display:grid;grid-template-columns:1fr 1fr 1.7fr;gap:6px;
    padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:rgba(255,255,255,.96);backdrop-filter:blur(10px);
    border-top:2px solid var(--line);box-shadow:0 -8px 24px rgba(58,47,85,.12)}
  .mobile-bar a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-family:var(--display);
    font-weight:600;font-size:.72rem;color:var(--ink);border-radius:14px;padding:.4rem .2rem;background:var(--cream)}
  .mobile-bar a .ic{width:1.35rem;height:1.35rem;color:var(--sky-d)}
  .mobile-bar a[data-track=whatsapp] .ic{color:#25d366}
  .mobile-bar .mb-primary{background:var(--coral);color:#fff;flex-direction:row;gap:.45rem;font-size:.95rem}
  .mobile-bar .mb-primary .ic{color:#fff}
  .float-call{display:none}
  .to-top{bottom:86px}
  .as-inner{font-size:.85rem;gap:.6rem;padding:.45rem 0}
  .as-inner p{min-width:0}
}

/* ---- modals ---- */
body.modal-open{overflow:hidden}
.tour-modal,.video-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;display:grid;place-items:center;padding:16px}
.tour-modal[hidden],.video-modal[hidden]{display:none}
.tm-backdrop,.vm-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:rgba(34,27,53,.62);backdrop-filter:blur(3px)}
.tm-card{position:relative;background:#fff;border-radius:var(--r-xl);padding:clamp(1.4rem,3vw,2.2rem);width:min(520px,100%);
  box-shadow:var(--shadow-lg);animation:pop .35s cubic-bezier(.3,1.4,.5,1);max-height:92vh;overflow:auto}
.tm-close{position:absolute;top:12px;right:12px;width:40px;height:40px;border-radius:50%;background:var(--cream-2);display:grid;place-items:center;color:var(--ink);z-index:2}
.tm-close .ic{width:45%;height:45%}
.tm-card h3{font-size:1.6rem;margin:.6rem 0 .3rem}
.tm-lead{color:var(--ink-soft);margin-bottom:1rem}
.tm-alt{margin:1rem 0 0;font-size:.9rem;color:var(--ink-soft);text-align:center}
.tm-alt a{color:var(--coral-d);font-weight:800}
.vm-frame{position:relative;width:min(960px,100%);aspect-ratio:16/9;background:#000;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-lg)}
.vm-embed,.vm-embed iframe{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;border:0}

/* ---- three-field lead form ---- */
.lead-form{display:grid;gap:.8rem}
.lf-row{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.lf-field{display:grid;gap:.3rem;font-size:.85rem;color:var(--ink)}
.lf-field>span{font-family:var(--display);font-weight:600}
.lf-field input,.lf-field select{width:100%;padding:.8em 1em;border:2px solid var(--line);border-radius:var(--r-sm);background:var(--cream);font-size:1rem;transition:.2s;color:var(--ink)}
.lf-field input:focus,.lf-field select:focus{outline:none;border-color:var(--coral);background:#fff;box-shadow:0 0 0 4px rgba(248,115,46,.15)}
.lead-form .btn{justify-content:center;width:100%}
.lead-form .btn.busy{opacity:.7;pointer-events:none}
.lf-note{display:flex;align-items:center;gap:.4em;color:var(--ink-soft);font-weight:700;font-size:.8rem;justify-content:center}
.form-note{display:none;margin-top:.4rem;font-weight:800;color:var(--leaf-d)}
.form-note.show{display:block}
.form-note.err{color:var(--coral-d)}
@media(max-width:480px){.lf-row{grid-template-columns:1fr}}

/* ---- hero lead card ---- */
.hero-lead{background:rgba(255,255,255,.9);backdrop-filter:blur(8px);border:2px solid var(--line);border-radius:var(--r-lg);
  padding:1.2rem 1.3rem 1.1rem;box-shadow:var(--shadow);max-width:520px;margin-top:.4rem}
.hl-head{display:flex;align-items:center;gap:.8rem;margin-bottom:.9rem}
.hl-badge{width:44px;height:44px;border-radius:14px;background:var(--coral);color:#fff;display:grid;place-items:center;box-shadow:var(--shadow-sm);flex-shrink:0}
.hl-badge .ic{width:55%;height:55%}
.hl-head b{font-family:var(--display);font-weight:600;font-size:1.15rem;display:block;line-height:1.1;color:var(--ink)}
.hl-head small{color:var(--ink-soft);font-weight:700;font-size:.8rem}
.hero-lead .lead-form{gap:.6rem}
.hero-lead .lf-field input,.hero-lead .lf-field select{padding:.65em .9em}
.hero-mini-links{display:flex;gap:1.2rem;flex-wrap:wrap;margin-top:1rem}
.hero-mini-links a{font-family:var(--display);font-weight:600;color:var(--sky-d);display:inline-flex;align-items:center;gap:.3em}
.hero-mini-links a:hover{color:var(--coral-d)}
.hero-copy .hero-trust{margin-top:1.1rem}

/* ---- a day at Skill-ed ---- */
.day-section{background:linear-gradient(180deg,#fff8ec,#fff2df)}
.day-timeline{list-style:none;position:relative;max-width:880px;margin:0 auto;padding:0}
.day-timeline::before{content:"";position:absolute;left:50%;top:10px;bottom:10px;width:4px;border-radius:4px;
  background:linear-gradient(180deg,var(--sun),var(--coral),var(--leaf),var(--sky));transform:translateX(-50%)}
.dt-item{position:relative;display:grid;grid-template-columns:1fr 64px 1fr;align-items:center;gap:1rem;margin-bottom:1.1rem}
.dt-time{font-family:var(--display);font-weight:700;font-size:1.3rem;color:var(--c);text-align:right}
.dt-ic{width:56px;height:56px;border-radius:50%;background:var(--c);color:#fff;display:grid;place-items:center;border:4px solid #fff;box-shadow:var(--shadow);justify-self:center;z-index:1}
.dt-ic .ic{width:48%;height:48%}
.dt-item[style*="--sun"] .dt-ic{color:var(--ink)}
.dt-body{background:#fff;border:2px solid var(--line);border-radius:var(--r);padding:.9rem 1.1rem;box-shadow:var(--shadow-sm)}
.dt-body h3{font-size:1.1rem;margin-bottom:.2rem}
.dt-body p{margin:0;color:var(--ink-soft);font-size:.93rem}
.dt-item:nth-child(even) .dt-time{order:3;text-align:left}
.dt-item:nth-child(even) .dt-body{order:1}
.dt-item:nth-child(even) .dt-ic{order:2}
@media(max-width:680px){
  .day-timeline::before{left:22px}
  .dt-item,.dt-item:nth-child(even){grid-template-columns:44px 1fr;gap:.4rem .8rem;align-items:start}
  .dt-ic{width:44px;height:44px;grid-row:1/3;order:0}
  .dt-time,.dt-item:nth-child(even) .dt-time{grid-column:2;text-align:left;font-size:1rem;order:0;line-height:1}
  .dt-body,.dt-item:nth-child(even) .dt-body{grid-column:2;order:0}
}

/* ---- video tour ---- */
.video-card{position:relative;border-radius:var(--r-xl);overflow:hidden;border:6px solid #fff;box-shadow:var(--glow-sky),var(--shadow-lg);aspect-ratio:16/7;min-height:320px}
.video-card img{width:100%;height:100%;object-fit:cover}
.vc-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.7rem;
  text-align:center;padding:1.5rem;background:linear-gradient(180deg,rgba(58,47,85,.25),rgba(58,47,85,.62));color:#fff}
.vc-overlay h2{color:#fff;font-size:clamp(1.5rem,3.4vw,2.4rem);max-width:18ch;text-shadow:0 2px 12px rgba(0,0,0,.25)}
.vc-overlay p{margin:0;font-weight:700;opacity:.92}
.vc-overlay .kicker{background:rgba(255,255,255,.18);color:#fff;border-color:transparent;box-shadow:none}
.vc-overlay .kicker .dot{background:#fff}
.vc-play{width:84px;height:84px;border-radius:50%;background:var(--coral);color:#fff;display:grid;place-items:center;border:5px solid #fff;
  animation:pulseRing 2s ease-out infinite;transition:transform .2s}
.vc-play .ic{width:40%;height:40%;margin-left:5px}
.vc-play:hover{transform:scale(1.08)}
@keyframes pulseRing{0%{box-shadow:0 0 0 0 rgba(255,255,255,.55)}100%{box-shadow:0 0 0 24px rgba(255,255,255,0)}}
/* phones: the text sets the height (a min-height with an aspect-ratio would force the card wider than the screen) */
@media(max-width:680px){
  .video-card{aspect-ratio:auto;min-height:0}
  .video-card img{position:absolute;top:0;left:0}
  .vc-overlay{position:relative;min-height:300px}
}

/* ---- Google reviews badge ---- */
.g-badge{display:inline-flex;align-items:center;gap:.8rem;background:#fff;border:2px solid var(--line);border-radius:var(--r-pill);
  padding:.5rem 1.2rem .5rem .6rem;box-shadow:var(--shadow-sm);margin-top:1rem;text-align:left;transition:.2s}
.g-badge:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.gb-g{width:38px;height:38px;border-radius:50%;background:#fff;border:2px solid var(--line);display:grid;place-items:center;font-family:var(--display);font-weight:700;font-size:1.3rem;color:#4285f4}
.gb-stars{color:var(--sun-d);letter-spacing:.06em;font-size:1rem}
.gb-text b{display:block;font-family:var(--display);font-weight:600;font-size:.98rem;line-height:1.1;color:var(--ink)}
.gb-text small{color:var(--ink-soft);font-weight:700;font-size:.78rem;display:inline-flex;align-items:center;gap:.3em}
.section-head .g-badge{margin-top:1.2rem}

/* ---- safety facts ---- */
.fact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.fact{background:#fff;border:2px solid var(--line);border-radius:var(--r-lg);padding:1.5rem 1.3rem;box-shadow:var(--shadow-sm);display:flex;gap:1rem;align-items:flex-start}
.fact-ic{flex-shrink:0;width:52px;height:52px;border-radius:16px;background:var(--leaf);color:#fff;display:grid;place-items:center;border:3px solid #fff;box-shadow:var(--shadow-sm)}
.fact-ic .ic{width:50%;height:50%}
.fact:nth-child(2) .fact-ic{background:var(--sky)}
.fact:nth-child(3) .fact-ic{background:var(--coral)}
.fact:nth-child(4) .fact-ic{background:var(--sun);color:var(--ink)}
.fact:nth-child(5) .fact-ic{background:var(--sky)}
.fact:nth-child(6) .fact-ic{background:var(--coral)}
.fact h3{font-size:1.1rem;margin-bottom:.25rem}
.fact p{margin:0;color:var(--ink-soft);font-size:.93rem}
@media(max-width:900px){.fact-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.fact-grid{grid-template-columns:1fr}}

/* ---- fees & eligibility ---- */
.age-table{background:#fff;border:2px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-sm);max-width:920px;margin:0 auto}
.at-head,.at-row{display:grid;grid-template-columns:1.2fr 1fr 1fr auto;gap:1rem;align-items:center;padding:.9rem 1.4rem}
.at-head{background:var(--cream-2);font-family:var(--display);font-weight:600;color:var(--ink-soft);font-size:.85rem;text-transform:uppercase;letter-spacing:.04em}
.at-row{border-top:2px solid var(--line)}
.at-row:hover{background:#fffdf7}
.at-class{font-family:var(--display);font-weight:600;font-size:1.15rem;display:flex;align-items:center;gap:.6rem;color:var(--ink)}
.at-class i{width:12px;height:12px;border-radius:50%;background:var(--c);display:inline-block}
.at-sub{color:var(--ink-soft);font-weight:700}
.at-age{font-weight:800}
@media(max-width:640px){.at-head{display:none}.at-row{grid-template-columns:1fr auto;row-gap:.25rem}.at-class{grid-column:1/-1}}
.fee-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem}
.fee-card{background:#fff;border:2px solid var(--line);border-top:8px solid var(--c);border-radius:var(--r-lg);padding:1.5rem 1.3rem;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:.5rem}
.fee-ic{width:56px;height:56px;border-radius:18px;background:var(--c);color:#fff;display:grid;place-items:center;border:3px solid #fff;box-shadow:var(--shadow-sm)}
.fee-ic .ic{width:50%;height:50%}
.fee-card[style*="--sun"] .fee-ic{color:var(--ink)}
.fee-card h3{font-size:1.3rem;margin:0}
.fee-sub{color:var(--ink-soft);font-weight:700;margin:0;font-size:.9rem}
.fee-amount{margin:.4rem 0 .6rem}
.fee-amount b{font-family:var(--display);font-weight:700;font-size:1.5rem;color:var(--c);display:block;line-height:1.1}
.fee-amount small{color:var(--ink-soft);font-weight:700;font-size:.8rem}
.fee-card ul.ticks{margin:.2rem 0 .8rem;gap:.5rem;flex:1}
.fee-card ul.ticks li{font-size:.9rem;font-weight:700}
.fee-card ul.ticks li::before{width:22px;height:22px;font-size:.72rem}
.fee-card .btn{justify-content:center;font-size:.95rem}
@media(max-width:1000px){.fee-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.fee-grid{grid-template-columns:1fr}}
.mini-steps{list-style:none;display:grid;gap:.8rem;padding:0;margin:0}
.mini-steps li{display:flex;gap:.8rem;align-items:flex-start;font-weight:700}
.mini-steps span{flex-shrink:0;width:30px;height:30px;border-radius:50%;background:var(--sun);color:var(--ink);display:grid;place-items:center;font-family:var(--display);font-weight:700}

/* ---- thank you ---- */
.thanks-hero{padding-top:clamp(50px,7vw,90px);background:linear-gradient(180deg,#f1fae0,var(--cream))}
.thanks-badge{width:92px;height:92px;border-radius:50%;background:var(--leaf);color:#fff;display:grid;place-items:center;margin:0 auto 1.2rem;border:6px solid #fff;box-shadow:var(--glow-leaf),var(--shadow)}
.thanks-badge .ic{width:50%;height:50%}
.thanks-hero h1{font-size:clamp(2rem,5vw,3.4rem);margin:.6rem 0 .8rem}
.thanks-hero .lead{margin-inline:auto}

/* ---- blog articles ---- */
.blog-card .b-body h3 a{color:inherit}
.blog-card .b-body h3 a:hover{color:var(--coral-d)}
.blog-card .b-body p{color:var(--ink-soft);font-size:.93rem;margin:.4rem 0 .8rem}
.article-wrap{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(280px,.9fr);gap:clamp(24px,4vw,56px);align-items:start}
.article-side{position:sticky;top:110px}
.more-reads{list-style:none;display:grid;gap:.6rem;padding:0;margin:0}
.more-reads a{font-weight:800;color:var(--sky-d)}
.more-reads a:hover{color:var(--coral-d)}
@media(max-width:900px){.article-wrap{grid-template-columns:1fr}.article-side{position:static}}

/* ---- tour prompt ---- */
.tour-prompt{position:fixed;right:20px;bottom:90px;z-index:95;width:min(370px,calc(100vw - 32px));background:#fff;border:2px solid var(--line);
  border-radius:var(--r-lg);padding:1.1rem 1.1rem 1.1rem 1rem;box-shadow:var(--shadow-lg);display:flex;gap:.9rem;align-items:flex-start;
  transform:translateY(20px);opacity:0;transition:transform .35s cubic-bezier(.2,.8,.3,1.2),opacity .35s}
.tour-prompt.on{transform:none;opacity:1}
.tour-prompt[hidden]{display:none}
.tp-ic{flex-shrink:0;width:46px;height:46px;border-radius:14px;background:var(--coral);color:#fff;display:grid;place-items:center}
.tp-ic .ic{width:55%;height:55%}
.tp-body b{font-family:var(--display);font-weight:600;font-size:1.05rem;display:block;color:var(--ink)}
.tp-body p{margin:.2rem 0 .7rem;color:var(--ink-soft);font-size:.9rem}
.tp-actions{display:flex;gap:.5rem;flex-wrap:wrap}
.tp-actions .btn{font-size:.9rem;padding:.55em 1.1em}
.tp-close{position:absolute;top:8px;right:8px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;color:var(--ink-soft)}
.tp-close .ic{width:50%;height:50%}
@media(max-width:760px){.tour-prompt{right:12px;left:12px;width:auto;bottom:88px}}
@media(prefers-reduced-motion:reduce){.as-pulse,.vc-play{animation:none}}

/* closed dropdowns are removed from paint entirely; hover fades them in */
@media(min-width:1025px){
  .menu>li>.submenu,.submenu li>.submenu{display:none;opacity:1;visibility:visible;transform:none}
  .menu>li:hover>.submenu,.submenu li:hover>.submenu{display:block;animation:menuIn .22s ease-out}
  @keyframes menuIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
}

/* ---- hero: copy left, tour form right ---- */
.hero{padding:clamp(36px,5vw,64px) 0 clamp(90px,10vw,140px)}
.hero-inner{grid-template-columns:1.05fr .95fr;gap:clamp(28px,4vw,56px);align-items:center}
.hero-copy h1{font-size:clamp(2.3rem,4.6vw,3.7rem);margin:.5rem 0 1rem}
.hero-copy .lead{max-width:50ch;margin-bottom:1.2rem;font-size:clamp(1rem,1.3vw,1.12rem)}
.hero-points{display:grid;gap:.45rem;margin-bottom:1.2rem}
.hero-points span{display:inline-flex;align-items:center;gap:.55rem;font-weight:800;color:var(--ink);font-size:.95rem}
.hero-points .ic{width:1.5rem;height:1.5rem;color:#fff;background:var(--leaf);border-radius:50%;padding:.28rem;box-sizing:border-box}
.hero-points span:nth-child(2) .ic{background:var(--sky)}
.hero-points span:nth-child(3) .ic{background:var(--coral)}
.hero-copy .hero-trust{margin-top:.4rem}
.hero-side{position:relative;padding:52px 0 0 0;min-height:520px}
.hero-photo-bg{position:absolute;top:0;right:-4%;width:72%;aspect-ratio:4/3;border-radius:var(--r-xl);overflow:hidden;border:6px solid #fff;box-shadow:var(--glow-sun),var(--shadow)}
.hero-photo-bg img{width:100%;height:100%;object-fit:cover;object-position:60% 20%}
.hero-side .hero-chip{position:absolute;top:22px;left:2%;z-index:3;animation:floatY 5s ease-in-out infinite}
.hero-side .hero-lead{position:relative;z-index:2;max-width:440px;margin:120px auto 0 0;background:rgba(255,255,255,.96)}
@media(max-width:1024px){
  .hero-inner{grid-template-columns:1fr}
  .hero-side{padding-top:0;min-height:0;max-width:520px;margin:0 auto;width:100%}
  .hero-photo-bg{position:relative;right:auto;width:100%;aspect-ratio:16/9;margin-bottom:-56px}
  .hero-side .hero-chip{top:14px;left:14px}
  .hero-side .hero-lead{margin:0 auto;max-width:none}
  .hero-copy .hero-trust{display:inline-flex}
}
@media(max-width:680px){.hero-chip{display:flex}.hero-side .hero-chip{transform:scale(.9);transform-origin:top left}}

/* =====================================================================
   2026 PHOTOS: responsive frames, polaroids, gallery filters,
   events timeline, Grandparents Day journey
   ===================================================================== */
[hidden]{display:none!important}
.hl.grape::after{background:var(--grape);opacity:.4}

/* photos keep one frame shape whatever the source orientation */
.split-media .sm-photo img{width:100%;height:auto;aspect-ratio:5/6;object-fit:cover}
@media(max-width:1024px){.split-media .sm-photo img{aspect-ratio:4/3}}
.cd-photo img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r-lg);border:6px solid #fff;box-shadow:var(--glow),var(--shadow)}
.article-figure{margin:0 0 1.8rem}
.article-figure img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:var(--r-lg);border:6px solid #fff;box-shadow:var(--shadow)}
.article-figure figcaption{font-size:.85rem;color:var(--ink-soft);font-weight:700;margin-top:.55rem}
.gallery a::after{content:"+";font-family:var(--display);font-size:2.4rem;font-weight:500}
.camp-ic{width:52px;height:52px;margin:0 auto .7rem;border-radius:16px;display:grid;place-items:center;color:#fff;background:var(--leaf);border:3px solid #fff;box-shadow:var(--shadow-sm)}
.camp-ic .ic{width:50%;height:50%}
.camp-ic.c2{background:var(--sky)}.camp-ic.c3{background:var(--coral)}.camp-ic.c4{background:var(--sun);color:var(--ink)}

/* ---- polaroid frame ---- */
.polaroid{--r:0deg;--y:0px;--s:1;display:block;position:relative;background:#fff;padding:8px 8px 0;border-radius:10px;color:var(--ink);
  box-shadow:0 12px 26px -10px rgba(58,47,85,.38),0 2px 6px rgba(58,47,85,.12);
  transform:translateY(var(--y)) rotate(var(--r)) scale(var(--s));opacity:var(--o,1);
  transition:transform .45s cubic-bezier(.2,.8,.3,1.2),opacity .6s ease,box-shadow .35s}
.polaroid.nocap{padding-bottom:8px}
.polaroid .pol-img{display:block;overflow:hidden;border-radius:6px;aspect-ratio:4/5;background:var(--cream-2)}
.polaroid .pol-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s}
.polaroid .pol-cap{display:block;font-family:var(--display);font-weight:500;font-size:.86rem;line-height:1.2;text-align:center;padding:.5rem .3rem .6rem;color:var(--ink-soft)}
.polaroid:hover,.polaroid:focus-visible{--y:-6px;--s:1.04;z-index:5;box-shadow:0 22px 40px -12px rgba(58,47,85,.5)}
.polaroid:hover .pol-img img{transform:scale(1.05)}
.polaroid.rv:not(.in){--o:0;--y:30px}
.polaroid.rv.in{transition-delay:var(--dl,0s)}
.polaroid.rv.in:hover{transition-delay:0s}

/* ---- Grandparents intro + homepage teaser ---- */
.gp-intro{background:linear-gradient(180deg,#fff8ec,#f7f1ff)}
.gp-teaser{background:linear-gradient(180deg,#fff8ec 0%,#f7f1ff 55%,#fff8ec 100%)}
.gp-intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,64px);align-items:center}
.gp-intro-grid h2{margin:.7rem 0 1rem}
.gp-stack{position:relative;height:clamp(330px,34vw,450px)}
.gp-stack.reveal{opacity:1;transform:none}
.gp-stack .st{--tx:-50%;--ty:-50%;position:absolute;left:50%;top:50%;width:min(44%,240px);
  transform:translate(var(--tx),calc(var(--ty) + var(--y))) rotate(var(--r)) scale(var(--s));
  transition:transform 1s cubic-bezier(.2,.9,.25,1.12),box-shadow .35s}
.gp-stack .st1{z-index:1}.gp-stack .st2{z-index:3}.gp-stack .st3{z-index:2}
.gp-stack.in .st1{--tx:-114%;--ty:-45%;--r:-9deg}
.gp-stack.in .st2{--tx:-50%;--ty:-56%;--r:2deg;transition-delay:.12s}
.gp-stack.in .st3{--tx:14%;--ty:-43%;--r:9deg;transition-delay:.24s}
.gp-stack.in .st:hover{transition-delay:0s}
.gp-float{position:absolute;width:28px;height:28px;color:var(--berry);opacity:.85;pointer-events:none;animation:gpFloat 6s ease-in-out infinite}
.gp-float .ic{width:100%;height:100%}
.gp-float.f1{top:3%;left:6%;color:var(--grape)}
.gp-float.f2{top:8%;right:4%;width:22px;height:22px;animation-delay:-2s}
.gp-float.f3{bottom:6%;left:14%;width:20px;height:20px;color:var(--coral);animation-delay:-4s}
.gp-float.f4{bottom:2%;right:12%;width:32px;height:32px;color:var(--grape);animation-delay:-1s}
@keyframes gpFloat{0%,100%{transform:translateY(0) rotate(-8deg)}50%{transform:translateY(-14px) rotate(8deg)}}
@media(max-width:900px){.gp-intro-grid{grid-template-columns:1fr}.gp-stack{max-width:520px;width:100%;margin:0 auto}}
@media(max-width:560px){.gp-stack .st{width:42%}.gp-stack.in .st1{--tx:-98%}.gp-stack.in .st3{--tx:-2%}}

/* ---- the journey ---- */
.journey{background:linear-gradient(180deg,#f7f1ff 0%,#fff8ec 100%);overflow:hidden}
.journey-track{position:relative;max-width:1080px;margin:0 auto;padding-bottom:10px}
.journey-svg{position:absolute;top:0;left:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:0}
.jp-base{fill:none;stroke:rgba(155,109,222,.28);stroke-width:4;stroke-linecap:round;stroke-dasharray:1 12}
.jp-draw{fill:none;stroke-width:6;stroke-linecap:round}
.journey-heart{position:absolute;top:0;left:0;width:40px;height:40px;margin:-20px 0 0 -20px;color:var(--berry);z-index:4;pointer-events:none;
  will-change:transform;filter:drop-shadow(0 4px 8px rgba(240,86,140,.45));opacity:0;transition:opacity .4s}
.journey-heart .ic{width:100%;height:100%;animation:beat 1.3s ease-in-out infinite}
.journey.path-ready .journey-heart{opacity:1}
@keyframes beat{0%,100%{transform:scale(1)}15%{transform:scale(1.18)}30%{transform:scale(1)}45%{transform:scale(1.1)}}
.journey-list{list-style:none;margin:0;padding:0;position:relative;z-index:1}
.jstop{display:grid;grid-template-columns:1fr 72px 1fr;align-items:center;gap:0 clamp(12px,2.4vw,34px);margin-bottom:clamp(52px,7vw,100px)}
.jstop:last-child{margin-bottom:0}
.jtext{grid-column:1;grid-row:1;text-align:right;background:rgba(255,255,255,.92);border:2px solid var(--line);border-radius:var(--r-lg);padding:1.3rem 1.4rem;box-shadow:var(--shadow-sm)}
.jtext h3{font-size:clamp(1.2rem,2vw,1.5rem);margin:.75rem 0 .35rem}
.jtext p{margin:0;color:var(--ink-soft)}
.jtime{display:inline-flex;align-items:center;gap:.45em;font-family:var(--display);font-weight:600;font-size:.9rem;color:#fff;background:var(--grape);
  padding:.3em .95em;border-radius:var(--r-pill);box-shadow:var(--shadow-sm);transition:transform .45s cubic-bezier(.3,1.6,.5,1)}
.jtime .ic{width:1em;height:1em}
.jdot{grid-column:2;grid-row:1;justify-self:center;width:26px;height:26px;border-radius:50%;background:#fff;border:5px solid var(--grape);
  box-shadow:0 0 0 7px rgba(155,109,222,.16);transition:transform .45s cubic-bezier(.3,1.6,.5,1),background .3s;z-index:2}
.jphotos{grid-column:3;grid-row:1;display:flex;gap:clamp(8px,1.4vw,16px);justify-content:flex-start;align-items:flex-start}
.jstop:nth-child(even) .jtext{grid-column:3;text-align:left}
.jstop:nth-child(even) .jphotos{grid-column:1;justify-content:flex-end}
.jstop.on .jdot{background:var(--grape);transform:scale(1.22)}
.jstop.on .jtime{transform:scale(1.06)}
.jphotos.reveal{opacity:1;transform:none}
.jphotos .polaroid{flex:1 1 0;min-width:0;max-width:200px}
.jphotos.jp-1 .polaroid{max-width:250px}
.jphotos .polaroid:nth-child(1){--r:-3deg}
.jphotos .polaroid:nth-child(2){--r:2.5deg;margin-top:22px}
.jphotos .polaroid:nth-child(3){--r:-1.5deg;margin-top:6px}
.jphotos:not(.in) .polaroid{--o:0;--y:34px}
.jphotos.in .polaroid:nth-child(2){transition-delay:.12s}
.jphotos.in .polaroid:nth-child(3){transition-delay:.24s}
.jphotos.in .polaroid:hover{transition-delay:0s}
@media(max-width:760px){
  .jstop,.jstop:nth-child(even){grid-template-columns:34px 1fr;gap:14px 12px;align-items:start}
  .jdot{grid-column:1;grid-row:1;margin-top:20px;width:22px;height:22px;border-width:4px}
  .jtext,.jstop:nth-child(even) .jtext{grid-column:2;grid-row:1;text-align:left;padding:1.1rem 1.1rem}
  .jphotos,.jstop:nth-child(even) .jphotos{grid-column:2;grid-row:2;justify-content:flex-start}
  .jphotos .polaroid,.jphotos.jp-1 .polaroid{max-width:none}
  .jphotos.jp-1 .polaroid{max-width:62%}
}

/* ---- portrait wall + thank you ---- */
.gp-portraits{background:#fff}
.portrait-wall{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2vw,28px)}
.portrait-wall .polaroid .pol-img{aspect-ratio:10/11}
.portrait-wall .polaroid:nth-child(4n+1){--r:-2deg}
.portrait-wall .polaroid:nth-child(4n+2){--r:1.5deg}
.portrait-wall .polaroid:nth-child(4n+3){--r:-1deg}
.portrait-wall .polaroid:nth-child(4n){--r:2deg}
@media(max-width:900px){.portrait-wall{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.portrait-wall{grid-template-columns:repeat(2,1fr)}}
.gp-thanks{background:linear-gradient(180deg,#fff,#f7f1ff)}
.gp-thanks-card{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(24px,4vw,52px);align-items:center;background:#fff;border:2px solid var(--line);
  border-radius:var(--r-xl);padding:clamp(20px,3vw,40px);box-shadow:var(--shadow)}
.gp-thanks-photos{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.gp-thanks-photos .polaroid{--r:-2deg}
.gp-thanks-photos .polaroid + .polaroid{--r:2deg;margin-top:28px}
.gp-thanks-photos .pol-img{aspect-ratio:4/3}
.gp-thanks-text h2{margin:.7rem 0 .8rem}
@media(max-width:900px){.gp-thanks-card{grid-template-columns:1fr}}

/* ---- gallery page: filters + masonry wall ---- */
.gfilters{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;margin:0 auto 1.8rem;max-width:1000px}
.gfilters.reveal{opacity:1;transform:none}
.gchip{display:inline-flex;align-items:center;gap:.45em;font-family:var(--display);font-weight:600;font-size:.92rem;color:var(--ink);
  padding:.5em 1em;border-radius:var(--r-pill);background:#fff;border:2px solid var(--line);cursor:pointer;transition:.2s}
.gchip span{font-size:.74rem;background:var(--cream-2);color:var(--ink-soft);border-radius:var(--r-pill);padding:.1em .55em}
.gchip:hover{border-color:var(--sky);transform:translateY(-2px)}
.gchip.on{background:var(--sky);border-color:var(--sky);color:#fff}
.gchip.on span{background:rgba(255,255,255,.25);color:#fff}
.gwall{columns:4 230px;column-gap:14px}
.gtile{position:relative;display:block;break-inside:avoid;margin:0 0 14px;border-radius:var(--r);overflow:hidden;border:4px solid #fff;
  box-shadow:var(--shadow-sm);background:var(--cream-2);transition:transform .25s,box-shadow .25s}
.gtile img{width:100%;height:auto;display:block;transition:transform .6s}
.gtile:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.gtile:hover img{transform:scale(1.05)}
.gtag{position:absolute;left:8px;bottom:8px;background:rgba(58,47,85,.8);color:#fff;font-weight:800;font-size:.72rem;line-height:1.3;
  padding:.28em .75em;border-radius:var(--r-pill);pointer-events:none;max-width:calc(100% - 16px)}
@media(max-width:560px){.gwall{columns:2 140px;column-gap:10px}.gtile{margin-bottom:10px}}
.strip-4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.strip-4 .gtile{margin:0;aspect-ratio:4/5}
.strip-4 .gtile img{height:100%;object-fit:cover}
@media(max-width:760px){.strip-4{grid-template-columns:repeat(2,1fr)}}

/* ---- events: 2026 so far ---- */
.year-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:clamp(14px,2vw,24px)}
.year-card{display:flex;flex-direction:column;background:#fff;border:2px solid var(--line);border-radius:var(--r-lg);overflow:hidden;
  box-shadow:var(--shadow-sm);transition:transform .25s,box-shadow .25s}
.year-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.year-card.featured{border-color:var(--grape);box-shadow:0 0 0 4px rgba(155,109,222,.15),var(--shadow-sm)}
.yc-img{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;background:var(--cream-2)}
.yc-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.year-card:hover .yc-img img{transform:scale(1.06)}
.yc-month{position:absolute;top:10px;left:10px;background:#fff;color:var(--ink);font-family:var(--display);font-weight:600;font-size:.8rem;
  padding:.25em .8em;border-radius:var(--r-pill);box-shadow:var(--shadow-sm)}
.year-card.featured .yc-month{background:var(--grape);color:#fff}
.yc-body{display:flex;flex-direction:column;gap:.35rem;flex:1;padding:1rem 1.1rem 1.2rem}
.yc-body h3{font-size:1.1rem}
.yc-body p{margin:0;color:var(--ink-soft);font-size:.92rem;flex:1}

/* ---- lightbox caption ---- */
.lightbox figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:.8rem;max-width:90vw}
.lightbox img{max-height:80vh}
.lb-cap{color:#fff;font-weight:700;text-align:center;max-width:60ch;font-size:.95rem;opacity:.92;margin:0}
.lb-cap:empty{display:none}

@media(prefers-reduced-motion:reduce){
  .gp-float,.journey-heart .ic{animation:none}
  .polaroid,.gp-stack .st{transition:none}
}

/* hero: the alumni chip had left and right offsets, which stretched it over the photo */
.hero-side .hero-chip{right:auto;left:0;top:14px}

/* tall gallery tiles fill both rows they span */
.gallery.masonry a:nth-child(1),.gallery.masonry a:nth-child(6){aspect-ratio:auto}
@media(max-width:680px){.gallery.masonry a:nth-child(1),.gallery.masonry a:nth-child(6){aspect-ratio:1}}

/* ten 2026 events: two full rows of five on wide screens */
@media(min-width:1100px){.year-grid{grid-template-columns:repeat(5,1fr)}}

/* small screens: tighter polaroids so captions and fans stay inside the frame */
@media(max-width:760px){
  .jphotos{gap:8px;padding-right:4px}
  .jphotos .polaroid{padding:5px 5px 0}
  .jphotos .polaroid.nocap{padding-bottom:5px}
  .jphotos .pol-cap{font-size:.7rem;padding:.35rem .15rem .45rem;overflow-wrap:anywhere;hyphens:auto}
}

/* =====================================================================
   AWARDS: homepage section, awards page, hero pill
   ===================================================================== */
.kicker.sun{color:var(--sun-d)} .kicker.sun .dot{background:var(--sun)}
.awards-section{background:linear-gradient(180deg,#fffaf0 0%,#fff2d4 100%)}
.aw-layout{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(16px,2.4vw,28px);align-items:stretch}

/* featured ranking: black and gold, like the certificate */
.aw-feature{position:relative;overflow:hidden;isolation:isolate;border-radius:var(--r-xl);color:#fff;display:grid;gap:1.3rem;align-content:center;
  padding:clamp(1.6rem,3.2vw,2.6rem);background:radial-gradient(120% 90% at 0% 0%,#4f4078 0%,#3a2f55 48%,#231b37 100%);
  box-shadow:0 30px 60px -26px rgba(35,27,55,.65)}
.aw-feature::before{content:"";position:absolute;inset:10px;border:1.5px solid rgba(255,192,46,.35);border-radius:calc(var(--r-xl) - 8px);pointer-events:none}
.aw-feature::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:38%;transform:skewX(-18deg);pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,236,190,.16),transparent)}
.aw-feature.in::after{animation:awShine 1.5s .6s ease-out forwards}
@keyframes awShine{to{left:135%}}
.awf-body{position:relative;z-index:2}
.awf-org{display:block;font-weight:700;font-size:.92rem;color:rgba(255,255,255,.74)}
.awf-org b{display:block;font-family:var(--display);font-weight:600;font-size:clamp(1.4rem,2.4vw,1.7rem);color:var(--sun);margin-bottom:.1rem}
.aw-feature h3{color:#fff;font-size:clamp(1.7rem,3.2vw,2.4rem);margin:.35rem 0 1.1rem}
.aw-feature p{color:rgba(255,255,255,.84);max-width:52ch;margin:-.4rem 0 1.3rem}
.awf-ranks{display:flex;gap:clamp(8px,2vw,24px)}
.rank{flex:1 1 0;max-width:132px;display:flex;flex-direction:column;align-items:center;gap:.45rem;text-align:center}
.rank-disc{position:relative;width:min(100%,108px);aspect-ratio:1;display:grid;place-items:center;border-radius:50%;
  background:radial-gradient(circle at 50% 42%,rgba(255,192,46,.2),rgba(255,192,46,.03) 68%,transparent 70%)}
.star-ring{position:absolute;inset:0;width:100%;height:100%;color:var(--sun)}
.star-ring use{transform-box:fill-box;transform-origin:center}
.aw-feature:not(.in) .star-ring use{opacity:0;transform:scale(.2)}
.aw-feature.in .star-ring use{animation:starPop .5s cubic-bezier(.3,1.7,.5,1) both;animation-delay:calc(var(--d) + .35s)}
@keyframes starPop{from{opacity:0;transform:scale(.2) rotate(-90deg)}to{opacity:1;transform:none}}
.rank-disc b{position:relative;font-family:var(--display);font-weight:700;font-size:clamp(2.2rem,4.2vw,3rem);line-height:1;color:var(--sun);
  text-shadow:0 3px 14px rgba(255,192,46,.35)}
.rank-disc b small{font-size:.44em;vertical-align:.95em;margin-right:1px;opacity:.85}
.rank > span{font-family:var(--display);font-weight:600;font-size:.86rem;letter-spacing:.05em;text-transform:uppercase;color:#fff}

/* the other awards */
.aw-list{display:grid;gap:clamp(12px,1.6vw,18px);align-content:stretch}
.aw-card{--c:var(--coral);position:relative;z-index:1;display:flex;gap:1.05rem;align-items:center;background:#fff;border:2px solid var(--line);
  border-radius:var(--r-lg);padding:1.1rem 1.3rem;box-shadow:var(--shadow-sm);transition:transform .25s,box-shadow .25s}
.aw-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.aw-ic{flex-shrink:0;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;color:#fff;background:var(--c);
  border:4px solid #fff;box-shadow:var(--shadow-sm);outline:2px dashed var(--c);outline-offset:3px}
.aw-ic .ic{width:48%;height:48%}
.aw-body{min-width:0}
.aw-year{display:inline-block;font-family:var(--display);font-weight:600;font-size:.76rem;color:var(--ink);background:#fff2d4;
  border-radius:var(--r-pill);padding:.12em .7em;margin-bottom:.35rem}
.aw-card h3{font-size:1.1rem;line-height:1.25;margin:0 0 .2rem}
.aw-org{margin:0;color:var(--ink-soft);font-weight:700;font-size:.88rem}
.aw-more{margin-top:1.9rem}

/* awards page: timeline of earlier awards */
.aw-feature.big{max-width:980px;margin:0 auto}
.aw-timeline{position:relative;display:grid;gap:clamp(16px,2vw,24px);max-width:860px;margin:0 auto}
.aw-timeline::before{content:"";position:absolute;left:calc(1.5rem + 29.5px);top:40px;bottom:40px;border-left:3px dashed rgba(58,47,85,.16)}
.aw-timeline .aw-card{align-items:flex-start;padding:1.4rem 1.5rem}
.aw-text{margin:.55rem 0 .6rem;color:var(--ink)}
.aw-meta{display:flex;flex-wrap:wrap;gap:.3rem 1.1rem;margin:0;font-size:.85rem;font-weight:700;color:var(--ink-soft)}
.aw-meta span{display:inline-flex;align-items:center;gap:.35em}
.aw-meta .ic{width:1em;height:1em;color:var(--c)}

/* with photos (only when files exist in assets/images/awards/) */
.aw-feature.has-photo{grid-template-columns:1.15fr .85fr;align-items:center}
.awf-photo{position:relative;z-index:2;display:block;border-radius:var(--r);overflow:hidden;border:4px solid rgba(255,192,46,.55);
  box-shadow:0 18px 40px -14px rgba(0,0,0,.55);transform:rotate(2deg);transition:transform .3s}
.awf-photo:hover{transform:rotate(0) scale(1.02)}
.awf-photo img{width:100%;height:auto;display:block}
.aw-photo{flex-shrink:0;width:112px;aspect-ratio:3/2;border-radius:var(--r-sm);overflow:hidden;display:block;box-shadow:var(--shadow-sm)}
.aw-photo img{width:100%;height:100%;object-fit:cover}
.aw-timeline .aw-photo{width:170px}
.aw-timeline:has(.has-photo)::before{display:none}

.awf-cert{display:inline-flex;align-items:center;gap:.45em;margin-top:1.2rem;font-family:var(--display);font-weight:600;font-size:.92rem;
  color:var(--sun);border-bottom:2px solid rgba(255,192,46,.4);padding-bottom:2px;transition:color .2s,border-color .2s}
.awf-cert:hover{color:#fff;border-color:#fff}
.awf-cert .ic{width:1.1em;height:1.1em}
/* hero: one-line ranking pill */
.hero-award{display:flex;width:fit-content;max-width:100%;align-items:center;gap:.7rem;margin-top:.9rem;padding:.45rem 1.1rem .45rem .45rem;
  border-radius:var(--r-pill);background:linear-gradient(135deg,#3a2f55,#4f4078);color:#fff;font-size:.9rem;line-height:1.3;
  box-shadow:var(--shadow-sm);transition:transform .2s,box-shadow .2s}
.hero-award:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.ha-ic{flex-shrink:0;width:36px;height:36px;border-radius:50%;background:var(--sun);color:var(--ink);display:grid;place-items:center}
.ha-ic .ic{width:58%;height:58%}
.hero-award b{color:var(--sun);font-family:var(--display);font-weight:600}
.hero-award small{display:block;color:rgba(255,255,255,.7);font-weight:700;font-size:.74rem}

/* centred like the certificate itself (photo layout stays left-aligned beside the photo) */
.aw-feature:not(.has-photo) .awf-body{text-align:center}
.aw-feature:not(.has-photo) .awf-ranks{justify-content:center}
.aw-feature:not(.has-photo) p{margin-inline:auto}
@media(max-width:1024px){.aw-layout{grid-template-columns:1fr}.aw-feature.has-photo{grid-template-columns:1fr}}
@media(max-width:560px){
  .aw-card{align-items:flex-start;padding:1rem 1.05rem}
  .aw-ic{width:50px;height:50px}
  .aw-timeline::before{left:calc(1.05rem + 25.5px)}
  .aw-timeline .aw-card{padding:1.1rem 1.05rem}
  .aw-photo,.aw-timeline .aw-photo{width:96px}
  .rank > span{font-size:.74rem;letter-spacing:.03em}
}
@media(prefers-reduced-motion:reduce){
  .aw-feature::after{display:none}
  .aw-feature .star-ring use{animation:none!important;opacity:1!important;transform:none!important}
}

/* desktop header: with four dropdowns the menu no longer fits on laptop widths,
   so it tightens in two steps instead of pushing "Book a Tour" off the edge */
@media(min-width:1025px) and (max-width:1340px){
  .menu>li>a{font-size:.95rem;padding:.55em .6em}
  .nav{gap:1rem}
  .brand img{height:50px}
  .nav-cta .btn{font-size:.98rem;padding:.72em 1.2em}
}
@media(min-width:1025px) and (max-width:1180px){
  .site-header .wrap-wide{padding-inline:24px}
  .menu>li>a{font-size:.9rem;padding:.5em .45em}
  .brand img{height:40px}
  .nav-cta .btn{font-size:.92rem;padding:.62em .95em}
}

/* the smallest phones (320px): headings a size down so a highlighted phrase, which never wraps, still fits */
@media(max-width:359px){
  h2{font-size:1.6rem}
  .thanks-hero h1{font-size:1.75rem}
}

/* phones: tighter layouts from the mobile check */
@media(max-width:680px){
  .stats{grid-template-columns:repeat(2,1fr);gap:.8rem}
  .stat{padding:1.3rem .6rem}
  .btn.lg{font-size:1.05rem;padding:.9em 1.5em}
  .cta-band{padding:36px 18px}
  .cta-band h2 br{display:none}   /* the desktop line break strands a short line on phones */
  /* feature cards lie flat, icon beside the text, so a list of them is a short scroll */
  .act-card{display:grid;grid-template-columns:64px 1fr;column-gap:1rem;align-items:center;text-align:left;padding:1rem 1.1rem}
  .act-card::before{top:-40px;left:-40px;transform:none;width:130px;height:130px}
  .act-card:hover::before{transform:scale(1.2)}
  .act-card .a-ic{grid-row:span 2;width:64px;height:64px;margin:0;border-radius:20px;font-size:1.7rem;border-width:3px}
  .act-card h3{align-self:end;margin-bottom:.15rem}
  .act-card p{align-self:start}
  .act-card h3:last-child{grid-row:span 2;align-self:center;margin:0}
  /* name-only activity chips: two to a row, icon above the name */
  .grid.act-chips{grid-template-columns:repeat(2,1fr);gap:.8rem}
  .act-chips .act-card{display:block;text-align:center;padding:1rem .5rem .9rem}
  .act-chips .act-card::before{left:50%;top:-56px;transform:translateX(-50%);width:120px;height:120px}
  .act-chips .act-card:hover::before{transform:translateX(-50%) scale(1.2)}
  .act-chips .act-card .a-ic{width:56px;height:56px;margin:0 auto .6rem}
  /* gallery filters: one swipeable row instead of seven wrapped ones */
  .gfilters{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;margin-inline:-20px;padding:4px 20px 8px;
    scroll-padding-inline:20px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .gfilters::-webkit-scrollbar{display:none}
  .gchip{flex:0 0 auto}
}
@media(max-width:760px){
  .footer-bottom{padding-bottom:calc(1.6rem + 60px)}   /* last links clear the back-to-top button */
}
/* safety, cleanliness and hygiene videos on /health-and-safety/ (hidden until links are added in generate.js) */
.sv-card{display:block;width:100%;text-align:left;background:#fff;border:2px solid var(--line);border-radius:var(--r-lg);overflow:hidden;
  box-shadow:var(--shadow-sm);transition:transform .25s,box-shadow .25s;color:var(--ink);font:inherit;padding:0;cursor:pointer}
.sv-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.sv-thumb{position:relative;display:grid;place-items:center;aspect-ratio:16/9;background:linear-gradient(135deg,var(--sky),var(--leaf))}
.sv-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sv-play{position:relative;width:60px;height:60px;border-radius:50%;background:var(--coral);color:#fff;display:grid;place-items:center;
  border:4px solid #fff;box-shadow:var(--shadow-sm)}
.sv-play .ic{width:40%;height:40%;margin-left:3px}
.sv-title{display:block;padding:.9rem 1.1rem 1rem;font-family:var(--display);font-weight:600;font-size:1.08rem}

@media(max-width:480px){
  .as-more{display:none}   /* keeps the admissions strip to two lines */
  .page-hero .crumbs{font-size:.88rem;padding:.45em 1em}   /* most trails fit on one line */
}