/* CSL Academic Centre — site framework
   Layout concept: print brochure on screen. Each program owns a colour panel
   (SuperKids green, Tutoring blue, Brain Power gold); gold "sun" arcs peek from
   panel corners; leaf-cut corners (big radius on two opposite corners) echo the tree logo. */
:root{
  /* brand colour — sampled from the trifold brochure */
  --green:#2b6e17; --green-2:#3e9424; --green-soft:#eaf5e3; --green-mid:#d8ecca;
  --blue:#0b2a96;  --blue-2:#1d3fb0;  --blue-soft:#e9eefb;
  --gold:#f2b84b;  --gold-2:#f6c96b;  --gold-soft:#fdf1d8; --gold-ink:#6a4a06;
  --coral:#d9644a; --coral-soft:#fbe7e1;
  --ink:#16213f;   --ink-2:#4a5470;   --line:#dfe6da; --paper:#ffffff; --wash:#f6faf3;
  /* type */
  --font:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --fs-hero:clamp(2.6rem,6.2vw,4.6rem);
  --fs-h1:clamp(2.2rem,4.6vw,3.4rem);
  --fs-h2:clamp(1.7rem,3.2vw,2.5rem);
  --fs-h3:1.3rem; --fs-body:1.0625rem; --fs-small:.9rem; --fs-label:.78rem;
  /* shape + space */
  --leaf:44px 12px 44px 12px; --r:18px; --r-sm:10px;
  --wrap:1180px; --gut:max(20px,env(safe-area-inset-left,0px));
  --gut-r:max(20px,env(safe-area-inset-right,0px));
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;background:var(--paper);color:var(--ink);font:400 var(--fs-body)/1.6 var(--font);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,h4{margin:0;line-height:1.05;letter-spacing:-.02em;text-wrap:balance;font-weight:900}
h1{font-size:var(--fs-h1)} h2{font-size:var(--fs-h2)} h3{font-size:var(--fs-h3);font-weight:800;letter-spacing:-.01em}
p{margin:0;max-width:62ch}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:6px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.wrap{max-width:var(--wrap);margin-inline:auto;padding-left:var(--gut);padding-right:var(--gut-r)}
.band{padding-block:clamp(56px,8vw,104px);position:relative}
.band.tight{padding-block:clamp(36px,5vw,56px)}
.band.wash{background:var(--green-soft)} .band.cream{background:var(--gold-soft)} .band.sky{background:var(--blue-soft)}
.band.deep{background:var(--green);color:#fff} .band.navy{background:var(--blue);color:#fff}
.stack{display:grid;gap:18px} .stack-l{display:grid;gap:32px}

/* labels */
.eyebrow{font-size:var(--fs-label);font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--green)}
.eyebrow.gold{color:var(--gold)} .eyebrow.blue{color:var(--blue)} .eyebrow.ink{color:var(--gold-ink)}
.dash{display:inline-flex;align-items:center;gap:12px;font-weight:700;font-size:1.05rem}
.dash::before{content:"";width:28px;height:5px;border-radius:3px;background:var(--gold);flex:none}
.sec-head{display:grid;gap:14px;margin-bottom:clamp(28px,4vw,48px)}
.sec-head p{color:var(--ink-2)}
.band.deep .sec-head p,.band.navy .sec-head p{color:rgba(255,255,255,.82)}
.lead{font-size:1.2rem;color:var(--ink-2);max-width:52ch}
.muted{color:var(--ink-2)} .small{font-size:var(--fs-small)}

/* pills — the brochure's tag chips */
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pill{display:inline-block;padding:6px 14px;border-radius:999px;font-weight:700;font-size:.88rem;background:var(--green-mid);color:var(--green);text-decoration:none}
.pill.blue{background:#dfe6fa;color:var(--blue)} .pill.gold{background:#f9e3b4;color:var(--gold-ink)}
.pill.solid{background:var(--green);color:#fff} .pill.solid.blue{background:var(--blue);color:#fff} .pill.solid.gold{background:var(--gold);color:var(--ink)}
.pill.tiny{font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;padding:4px 10px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border-radius:999px;border:0;cursor:pointer;
  font:800 1rem/1 var(--font);text-decoration:none;background:var(--gold);color:var(--ink);transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 0 -2px var(--ink)}
.btn.green{background:var(--green);color:#fff} .btn.blue{background:var(--blue);color:#fff}
.btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink)}
.btn.ghost:hover{box-shadow:inset 0 0 0 2px var(--ink),0 6px 0 -2px var(--ink)}
.btn.sm{min-height:42px;padding:0 18px;font-size:.92rem}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px}
.arrow{font-weight:800;text-decoration:none;color:var(--green);display:inline-flex;gap:8px;align-items:center}
.arrow::after{content:"→";transition:transform .15s} .arrow:hover::after{transform:translateX(4px)}

/* ---------- topbar + header ---------- */
.topbar{background:var(--green);color:#fff;font-size:.86rem}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:40px}
.topbar a{text-decoration:none;font-weight:600}
.topbar .promo b{color:var(--gold)}
.topbar .tb-r{display:flex;gap:20px;align-items:center}
.topbar .tb-r a:hover{text-decoration:underline}
@media (max-width:860px){.topbar .tb-r .tb-mail{display:none}}
@media (max-width:560px){.topbar .tb-r{display:none}.topbar .promo{font-size:.8rem}}

body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--paper)}
header.site{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;gap:24px;min-height:78px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;flex:none}
.brand .m{width:58px;height:auto} .brand .w{width:158px;height:auto}
.menu{display:flex;align-items:center;gap:4px;list-style:none;margin:0 0 0 auto;padding:0}
.menu>li{position:relative}
.menu>li>a,.menu>li>button{white-space:nowrap;display:flex;align-items:center;gap:6px;padding:10px 14px;border-radius:999px;border:0;background:none;cursor:pointer;
  font:700 .98rem/1 var(--font);color:var(--ink);text-decoration:none}
.menu>li>a:hover,.menu>li>button:hover,.menu>li.open>button{background:var(--green-soft)}
.menu a[aria-current="page"],.menu button.current{color:var(--green)}
.menu .feat>a{background:var(--green-soft);color:var(--green)}
.menu .feat>a .pill{margin-left:4px}
.chev{width:12px;height:12px;transition:transform .2s} .open>button .chev{transform:rotate(180deg)}
.sub{position:absolute;top:calc(100% + 10px);left:-8px;min-width:300px;list-style:none;margin:0;padding:10px;background:#fff;border-radius:var(--r);
  box-shadow:0 18px 40px -12px rgba(22,33,63,.25),0 0 0 1px var(--line);display:none}
.open>.sub{display:grid;gap:2px}
.sub a{display:grid;gap:2px;padding:10px 14px;border-radius:var(--r-sm);text-decoration:none;font-weight:800}
.sub a small{font-weight:500;color:var(--ink-2);font-size:.84rem}
.sub a:hover{background:var(--wash)}
.sub .kids{display:flex;flex-wrap:wrap;gap:4px;padding:0 14px 10px}
.sub .kids a{display:inline;padding:3px 10px;border-radius:999px;background:var(--blue-soft);color:var(--blue);font-size:.8rem;font-weight:700}
.sub .sw{width:10px;height:10px;border-radius:3px;display:inline-block;margin-right:8px;vertical-align:1px}
.nav-cta{display:flex;gap:10px;align-items:center;flex:none}
.burger{display:none;margin-left:auto;width:48px;height:48px;border:0;border-radius:12px;background:var(--green-soft);cursor:pointer}
@media (max-width:1120px){.brand .w{display:none}}
@media (max-width:980px){
  .burger{display:grid;place-items:center}
  .nav-cta .btn.ghost{display:none}
  .menu{position:absolute;top:100%;left:0;right:0;max-height:calc(100dvh - 90px);overflow:auto;flex-direction:column;align-items:stretch;gap:0;background:#fff;
    padding:12px var(--gut-r) 28px var(--gut);border-bottom:1px solid var(--line);box-shadow:0 30px 40px -30px rgba(0,0,0,.3);display:none}
  .menu.show{display:flex}
  .menu>li>a,.menu>li>button{width:100%;justify-content:space-between;padding:16px 8px;border-radius:0;border-bottom:1px solid var(--line);font-size:1.08rem}
  .sub{position:static;box-shadow:none;min-width:0;padding:4px 0 10px 8px}
  .nav-cta{margin-left:0}
}
@media (max-width:560px){.nav{gap:12px;min-height:68px}.nav-cta .btn{min-height:42px;padding:0 16px;font-size:.88rem}}

/* ---------- page heads (inner pages) ---------- */
.phead{position:relative;overflow:hidden;color:#fff;padding-block:clamp(48px,7vw,88px)}
.phead.green{background:var(--green)} .phead.blue{background:var(--blue)} .phead.gold{background:var(--gold);color:var(--ink)}
.phead.ink{background:var(--ink)} .phead.coral{background:var(--coral)} .phead.light{background:var(--green-soft);color:var(--ink)}
.phead::after{content:"";position:absolute;width:min(46vw,520px);aspect-ratio:1;border-radius:50%;right:-8%;bottom:-62%;background:rgba(255,255,255,.12)}
.phead.green::after{background:var(--green-2)} .phead.blue::after{background:var(--blue-2)} .phead.gold::after{background:var(--gold-2)}
.phead.light::after{background:var(--green-mid)}
.phead .wrap{position:relative;z-index:1;display:grid;gap:16px}
.phead h1{font-size:clamp(2.6rem,6vw,4.4rem)}
.phead .eyebrow{color:var(--gold)} .phead.gold .eyebrow{color:var(--gold-ink)} .phead.light .eyebrow{color:var(--green)}
.phead .dash{font-size:1.2rem}
.phead .lead{color:inherit;opacity:.9}
.crumbs{font-size:.84rem;font-weight:600;opacity:.8;display:flex;gap:8px;flex-wrap:wrap}
.crumbs a{text-decoration:none} .crumbs a:hover{text-decoration:underline}

/* ---------- home hero ---------- */
.hero{background:var(--green-soft);overflow:hidden;position:relative}
.hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,72px);align-items:center;padding-block:clamp(44px,7vw,96px)}
.hero h1{font-size:var(--fs-hero);color:var(--green);line-height:.98;letter-spacing:-.035em}
.hero .copy{display:grid;gap:24px;min-width:0}
.hero .photo{position:relative;min-width:0}
.hero .photo img{border-radius:var(--leaf);aspect-ratio:1/1;height:auto;object-fit:cover;width:100%;position:relative;z-index:1}
.hero .photo::before{content:"";position:absolute;width:46%;aspect-ratio:1;border-radius:50%;background:var(--gold);right:-9%;top:-8%;z-index:0}
.hero .photo .stamp{position:absolute;z-index:2;left:-14px;bottom:24px;background:#fff;border-radius:var(--r);padding:14px 18px;box-shadow:0 14px 30px -14px rgba(22,33,63,.35);
  display:grid;gap:2px;font-size:.84rem;font-weight:600;color:var(--ink-2)}
.hero .photo .stamp b{font-size:1.05rem;color:var(--ink)}
.hero .stars{color:var(--gold);letter-spacing:2px}
@media (max-width:860px){.hero .wrap{grid-template-columns:1fr}.hero .photo{max-width:520px}.hero .photo .stamp{left:10px}}

/* trust row */
.trust{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.trust a{display:flex;gap:14px;align-items:center;text-decoration:none;font-weight:700;line-height:1.3;font-size:.96rem}
.trust .ic{width:52px;height:52px;border-radius:50%;flex:none;display:grid;place-items:center;background:var(--green);color:#fff;font-weight:900}
.trust .ic.gold{background:var(--gold);color:var(--ink)} .trust .ic.blue{background:var(--blue)}
@media (max-width:900px){.trust{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.trust{grid-template-columns:1fr}}

/* ---------- program panels (brochure columns) ---------- */
.programs{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.prog{border-radius:var(--r);overflow:hidden;background:#fff;box-shadow:0 0 0 1px var(--line);display:flex;flex-direction:column;min-width:0}
.prog .top{position:relative;padding:28px 26px 26px;color:#fff;overflow:hidden;display:grid;gap:8px}
.prog .top::after{content:"";position:absolute;width:190px;aspect-ratio:1;border-radius:50%;right:-50px;bottom:-110px}
.prog .top>*{position:relative;z-index:1}
.prog .top h3{font-size:2rem;font-weight:900;letter-spacing:-.03em}
.prog .top .eyebrow{color:var(--gold)}
.prog.green .top{background:var(--green)} .prog.green .top::after{background:var(--green-2)}
.prog.blue .top{background:var(--blue)}   .prog.blue .top::after{background:var(--blue-2)}
.prog.gold .top{background:var(--gold);color:var(--ink)} .prog.gold .top::after{background:var(--gold-2)} .prog.gold .top .eyebrow{color:var(--gold-ink)}
.prog .body{padding:24px 26px 26px;display:grid;gap:18px;flex:1;align-content:start}
.prog .foot{margin-top:auto;padding:18px 26px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:12px}
.price{font-weight:900;font-size:1.25rem;line-height:1.1} .price small{display:block;font-weight:600;font-size:.78rem;color:var(--ink-2)}
.ticks{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.ticks li{position:relative;padding-left:22px}
.ticks li::before{content:"";position:absolute;left:2px;top:.58em;width:9px;height:9px;border-radius:50%;background:var(--green)}
.blue .ticks li::before,.ticks.blue li::before{background:var(--blue)} .gold .ticks li::before,.ticks.gold li::before{background:var(--gold)}
@media (max-width:960px){.programs{grid-template-columns:1fr}}

.more-progs{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:22px}
.mini{border-radius:var(--r);padding:26px;display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;text-decoration:none;background:#fff;box-shadow:0 0 0 1px var(--line);transition:box-shadow .15s}
.mini:hover{box-shadow:0 0 0 2px var(--ink)}
.mini .badge{width:56px;height:56px;border-radius:16px 4px 16px 4px;display:grid;place-items:center;font-weight:900;font-size:1.3rem}
.mini h3{margin-bottom:6px}
@media (max-width:760px){.more-progs{grid-template-columns:1fr}}

/* marketing slot — swap each season */
.slot{position:relative;overflow:hidden;border-radius:var(--leaf);background:var(--ink);color:#fff;padding:clamp(28px,4vw,48px);display:grid;grid-template-columns:1.4fr 1fr;gap:28px;align-items:center}
.slot::after{content:"";position:absolute;width:280px;aspect-ratio:1;border-radius:50%;background:var(--gold);right:-80px;top:-120px}
.slot>*{position:relative;z-index:1}
.slot h2{color:#fff} .slot .eyebrow{color:var(--gold)}
.slot .facts{display:grid;gap:10px;background:#26314f;border-radius:var(--r);padding:20px}
.slot .facts div{display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed rgba(255,255,255,.22);padding-bottom:8px}
.slot .facts div:last-child{border:0;padding:0}
.slot .facts span{opacity:.75}
@media (max-width:820px){.slot{grid-template-columns:1fr}}

/* steps — a real sequence */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;counter-reset:s}
.steps li{counter-increment:s;display:grid;gap:10px;padding-top:62px;position:relative}
.steps li::before{content:counter(s);position:absolute;top:0;left:0;width:46px;height:46px;border-radius:50%;background:var(--gold);color:var(--ink);font-weight:900;font-size:1.2rem;display:grid;place-items:center}
.steps li::after{content:"";position:absolute;top:22px;left:58px;right:-10px;height:2px;background:repeating-linear-gradient(90deg,var(--green) 0 6px,transparent 6px 12px)}
.steps li:last-child::after{display:none}
.steps b{font-size:1.15rem}
@media (max-width:760px){.steps{grid-template-columns:1fr}.steps li::after{display:none}}

/* teachers */
.team{display:grid;grid-template-columns:repeat(6,1fr);gap:18px}
.t{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;text-decoration:none;min-width:0}
.t .more{overflow:hidden}
.t img,.t .more{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:22px 6px 22px 6px;border:3px solid var(--green);background:var(--blue-soft)}
.t .more{display:grid;place-items:center;background:var(--green);color:#fff;font-weight:900;text-align:center;font-size:1rem;line-height:1.2}
.t b{font-size:1.05rem} .t span{font-size:.86rem;color:var(--green);font-weight:700;line-height:1.3}
@media (max-width:900px){.team{grid-template-columns:repeat(3,1fr)}}
@media (max-width:440px){.team{grid-template-columns:repeat(2,1fr)}}

/* reviews */
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.rev{background:#fff;border-radius:var(--r);padding:28px;display:grid;gap:16px;align-content:start}
.rev q{font-size:1.08rem;font-weight:600;line-height:1.5;quotes:none}
.rev q::before{content:"“";display:block;font:900 3.4rem/0.6 var(--font);color:var(--blue);margin:14px 0 6px}
.rev .who{font-size:.9rem;color:var(--ink-2);font-weight:600}
.rev .who .stars{color:var(--gold)}
.rev.ph{background:transparent;border:2px dashed var(--green-mid)}
@media (max-width:900px){.reviews{grid-template-columns:1fr}}

/* price tables — brochure style */
.ptable{width:100%;border-collapse:separate;border-spacing:0;border-radius:var(--r);overflow:hidden;box-shadow:0 0 0 1.5px var(--green-mid);font-variant-numeric:tabular-nums;background:#fff}
.ptable th{text-align:left;font-size:var(--fs-label);letter-spacing:.1em;text-transform:uppercase;padding:14px 18px;background:var(--green-soft);color:var(--green)}
.ptable td{padding:13px 18px;border-top:1px solid var(--line)}
.ptable td:not(:first-child),.ptable th:not(:first-child){text-align:right}
.ptable td.hl{color:var(--green);font-weight:800}
.ptable tr.best td{background:var(--gold-soft);font-weight:800}
.ptable tr.grp td{background:var(--blue-soft);color:var(--blue);font-size:var(--fs-label);letter-spacing:.1em;text-transform:uppercase;font-weight:800;padding-block:10px}
.ptable.blue{box-shadow:0 0 0 1.5px #c9d4f4} .ptable.blue th{background:var(--blue-soft);color:var(--blue)}
.ptable.gold{box-shadow:0 0 0 1.5px #f3dca8} .ptable.gold th{background:var(--gold-soft);color:var(--gold-ink)}
.tscroll{overflow-x:auto;border-radius:var(--r)}

/* generic layout pieces */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,64px);align-items:start}
.split>*{min-width:0}
.split.r{grid-template-columns:1.2fr .8fr} .split.l{grid-template-columns:.8fr 1.2fr}
@media (max-width:860px){.split,.split.r,.split.l{grid-template-columns:1fr}}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px} .grid2{display:grid;grid-template-columns:1fr 1fr;gap:22px}
@media (max-width:860px){.grid3,.grid2{grid-template-columns:1fr}}
.box{border-radius:var(--r);padding:26px;background:#fff;box-shadow:0 0 0 1px var(--line);display:grid;gap:12px;align-content:start}
.box.green{background:var(--green-soft);box-shadow:none} .box.blue{background:var(--blue-soft);box-shadow:none} .box.gold{background:var(--gold-soft);box-shadow:none}
.callout{border-radius:var(--leaf);padding:28px 30px;display:grid;gap:10px}
.callout.green{background:var(--green-soft)} .callout.green h3{color:var(--green)}
.callout.blue{background:var(--blue-soft)} .callout.blue h3{color:var(--blue)}
.callout.gold{background:var(--gold-soft)} .callout.gold h3{color:var(--gold-ink)}

/* subject jump chips (tutoring) */
.jump{position:sticky;top:calc(env(safe-area-inset-top,0px) + 78px);z-index:20;background:#fff;border-bottom:1px solid var(--line)}
.jump .wrap{display:flex;gap:8px;overflow-x:auto;padding-block:12px;scrollbar-width:none}
.jump a{flex:none}
@media (max-width:560px){.jump{top:calc(env(safe-area-inset-top,0px) + 68px)}}
.subject{display:grid;grid-template-columns:240px 1fr;gap:clamp(24px,4vw,56px);padding-block:44px;border-top:1px solid var(--line)}
.subject:first-child{border-top:0}
.subject h2{color:var(--blue)}
.subject>*{min-width:0}
@media (max-width:760px){.subject{grid-template-columns:1fr}}

/* to-be-filled markers — remove before launch */
.todo{border:2px dashed var(--coral);background:var(--coral-soft);color:#7a2c1b;border-radius:var(--r-sm);padding:14px 16px;font-size:.9rem;font-weight:600;display:grid;gap:4px}
.todo b{font-size:var(--fs-label);letter-spacing:.12em;text-transform:uppercase}
.ph-img{border-radius:var(--leaf);background:repeating-linear-gradient(135deg,var(--green-soft) 0 14px,#fff 14px 28px);aspect-ratio:4/3;display:grid;place-items:center;
  text-align:center;padding:20px;color:var(--green);font-weight:700;font-size:.92rem;border:2px dashed var(--green-mid)}

/* FAQ */
.faq{display:grid;gap:10px}
.faq details{background:#fff;border-radius:var(--r-sm);box-shadow:0 0 0 1px var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:18px 54px 18px 20px;font-weight:800;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:20px;top:50%;transform:translateY(-50%);font-size:1.5rem;color:var(--green);font-weight:700}
.faq details[open] summary::after{content:"–"}
.faq details>div{padding:0 20px 20px;color:var(--ink-2)}

/* forms */
.form{display:grid;gap:16px;background:#fff;border-radius:var(--r);padding:clamp(22px,3vw,34px);box-shadow:0 0 0 1px var(--line)}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:560px){.form .row{grid-template-columns:1fr}}
.field{display:grid;gap:6px;min-width:0}
.field label{font-weight:700;font-size:.92rem}
.field input,.field select,.field textarea{font:500 1rem var(--font);color:var(--ink);padding:13px 14px;border-radius:12px;border:1.5px solid #c9d3c3;background:#fff;width:100%}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px var(--green-mid)}
.chips{display:flex;flex-wrap:wrap;gap:8px;position:relative}
.chips input{position:absolute;left:0;top:0;width:1px;height:1px;opacity:0;pointer-events:none}
.chips label{padding:8px 14px;border-radius:999px;border:1.5px solid #c9d3c3;font-weight:700;font-size:.9rem;cursor:pointer}
.chips input:checked+label{background:var(--green);border-color:var(--green);color:#fff}
.chips input:focus-visible+label{outline:3px solid var(--gold);outline-offset:2px}
.form .ok{background:var(--green-soft);color:var(--green);border-radius:12px;padding:16px;font-weight:700}

/* contact list */
.clist{list-style:none;margin:0;padding:0;display:grid;gap:18px}
.clist li{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:start}
.clist .ic{width:44px;height:44px;border-radius:12px;background:var(--green-soft);display:grid;place-items:center;color:var(--green)}
.clist small{display:block;font-size:.8rem;font-weight:700;color:var(--ink-2);text-transform:uppercase;letter-spacing:.08em}
.clist a,.clist span.v{font-weight:800;font-size:1.12rem;color:var(--blue);text-decoration:none}

/* events */
.events{display:grid;gap:14px}
.ev{display:grid;grid-template-columns:96px 1fr auto;gap:22px;align-items:center;background:#fff;border-radius:var(--r);padding:20px 24px;box-shadow:0 0 0 1px var(--line)}
.ev .date{text-align:center;border-radius:16px 4px 16px 4px;background:var(--gold-soft);padding:10px 6px;font-weight:900;line-height:1}
.ev .date small{display:block;font-size:.72rem;letter-spacing:.12em;color:var(--gold-ink);margin-bottom:4px}
.ev .date b{font-size:1.9rem}
@media (max-width:640px){.ev{grid-template-columns:72px 1fr}.ev .btn{grid-column:1/-1}}

/* footer */
footer.site{background:var(--ink);color:#d8deec;padding-top:clamp(48px,6vw,72px);position:relative;overflow:hidden}
footer.site a{text-decoration:none} footer.site a:hover{color:#fff;text-decoration:underline}
.news{display:grid;grid-template-columns:1.1fr 1fr;gap:28px;align-items:center;padding-bottom:44px;border-bottom:1px solid rgba(255,255,255,.12)}
.news h2{color:#fff;font-size:clamp(1.6rem,3vw,2.2rem)}
.news form{display:flex;gap:10px;flex-wrap:wrap}
.news input{flex:1 1 220px;min-height:52px;border-radius:999px;border:0;padding:0 22px;font:500 1rem var(--font)}
.news .ok{color:var(--gold);font-weight:700;width:100%}
@media (max-width:820px){.news{grid-template-columns:1fr}}
.fcols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px;padding-block:44px}
.fcols h4{color:#fff;font-size:var(--fs-label);letter-spacing:.14em;text-transform:uppercase;margin-bottom:14px;font-weight:800}
.fcols ul{list-style:none;margin:0;padding:0;display:grid;gap:9px;font-size:.95rem}
.fcols .fb{display:grid;gap:14px;font-size:.95rem}
.fcols .fb>img{width:72px;height:72px;border-radius:50%}
.soc img{width:20px;height:20px}
.soc{display:flex;gap:10px}
.soc a{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.1);display:grid;place-items:center;font-weight:800;font-size:.8rem}
@media (max-width:860px){.fcols{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.fcols{grid-template-columns:1fr}}
.legal{border-top:1px solid rgba(255,255,255,.12);padding-block:20px;font-size:.84rem;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;opacity:.75}

/* mobile sticky CTA */
.mcta{display:none}
@media (max-width:700px){
  .mcta{display:grid;grid-template-columns:1fr 1.6fr;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:40;background:#fff;border-top:1px solid var(--line);
    padding:10px max(14px,env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(14px,env(safe-area-inset-left,0px))}
  .mcta .btn{min-height:48px;padding:0 12px}
  body{padding-bottom:72px}
}

/* brand tagline — Build now, shine tomorrow */
.spark{width:.9em;height:.9em;fill:var(--gold);flex:none}
.tagline{display:inline-flex;align-items:center;gap:10px;font-weight:800;font-size:1.05rem;letter-spacing:-.005em;color:var(--blue)}
.tagline .spark{width:1.1em;height:1.1em}
.fcols .sig{font-weight:900;font-size:1.6rem;line-height:1.1;letter-spacing:-.02em;color:#fff;display:flex;gap:10px;align-items:flex-start}
.fcols .sig .spark{margin-top:.15em}

/* location layer */
.where{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:.95rem;background:rgba(255,255,255,.16);border-radius:999px;padding:6px 16px 6px 6px;width:max-content;max-width:100%}
.where span{background:var(--gold);color:var(--ink);border-radius:999px;padding:3px 10px;font-size:var(--fs-label);letter-spacing:.1em;text-transform:uppercase;font-weight:800}
.phead.gold .where{background:rgba(255,255,255,.4)}
.phead.light .where{background:#fff}
.centres{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,520px),1fr));gap:22px}
.centre{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:center;background:var(--wash);border-radius:var(--r);padding:22px}
.centre>*{min-width:0}
@media (max-width:640px){.centre{grid-template-columns:1fr}}

/* hero proof points (replaces the old trust band) */
.proof{list-style:none;margin:4px 0 0;padding:20px 0 0;border-top:1.5px dashed var(--green-mid);display:grid;gap:12px}
.proof a{display:flex;align-items:center;gap:12px;text-decoration:none;font-weight:700;font-size:.98rem;line-height:1.3}
.proof a:hover{color:var(--green)}
.proof .pm{width:30px;height:30px;border-radius:50%;flex:none;display:grid;place-items:center;background:var(--green);color:#fff}
.proof .pm.blue{background:var(--blue)}
.proof .pm svg{width:15px;height:15px;fill:currentColor}

/* =========================================================
   MOBILE — built for visitors arriving from Google Maps.
   They already know CSL: phone, directions, hours, prices first.
   ========================================================= */
.m-only{display:none}
.proof .pm.gold{background:var(--gold);color:var(--ink)}
.quick{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;min-width:0}
.quick a{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:10px;align-items:center;text-decoration:none;
  background:#fff;border-radius:14px;padding:12px;box-shadow:0 0 0 1px var(--line);min-height:64px;min-width:0;grid-template-columns:auto minmax(0,1fr)}
.quick a svg{grid-row:1/3;color:var(--green);width:22px;height:22px}
.quick b{font-size:.95rem;line-height:1.2}
.quick span{font-size:.8rem;color:var(--ink-2);font-weight:600;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.quick a:active{background:var(--green-soft)}

@media (max-width:700px){
  .m-only{display:revert} .quick.m-only{display:grid} .d-only{display:none}
  .topbar{display:none}
  .band{padding-block:44px} .band.tight{padding-block:32px}
  .sec-head{margin-bottom:22px;gap:10px}
  h2{font-size:1.7rem}

  /* hero: everything a Maps visitor needs above the fold */
  .hero .wrap{padding-block:22px 28px;gap:22px}
  .hero .copy{gap:14px}
  .hero .eyebrow{font-size:.7rem}
  .hero h1{font-size:2.5rem}
  .hero .lead{font-size:1.02rem}
  .hero .actions .btn{width:100%}
  .proof{padding-top:14px;gap:10px} .proof a{font-size:.92rem}
  .hero .photo::before{display:none}
  .hero .photo img{aspect-ratio:16/9;border-radius:28px 8px 28px 8px}
  .hero .photo .stamp{display:none}

  /* program cards: tighter, same information */
  .prog .top{padding:20px 20px 18px;gap:4px} .prog .top h3{font-size:1.6rem} .prog .top::after{width:130px;bottom:-80px;right:-40px}
  .prog .body{padding:16px 20px} .prog .foot{padding:14px 20px}
  .ticks{gap:6px;font-size:.96rem}
  .programs,.more-progs{gap:14px} .more-progs{margin-top:14px}
  .mini{padding:18px;gap:14px} .mini .badge{width:44px;height:44px;font-size:1.1rem}

  /* horizontal swipe for team + reviews (decorative depth, not core info) */
  .swipe{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin-inline:calc(-1 * var(--gut));padding-inline:var(--gut);scrollbar-width:none}
  .swipe::-webkit-scrollbar{display:none}
  .team.swipe>*{flex:0 0 38%;scroll-snap-align:start}
  .reviews.swipe>*{flex:0 0 84%;scroll-snap-align:start}
  .rev{padding:22px}

  .slot{padding:24px;border-radius:28px 8px 28px 8px} .slot::after{width:180px;right:-70px;top:-90px}
  .steps{gap:18px} .steps li{padding-top:0;padding-left:60px;min-height:46px}
  .centre{padding:16px;gap:16px}

  /* inner pages */
  .phead{padding-block:30px 34px} .phead h1{font-size:2.4rem} .phead .lead{font-size:1rem} .phead .wrap{gap:10px}
  .crumbs{display:none}
  .subject{padding-block:30px;gap:14px}
  .box,.callout{padding:20px}
  .footer-gap{display:none}
  .fcols{padding-block:32px;gap:22px}
}

/* bottom action bar */
@media (max-width:700px){
  .mcta{grid-template-columns:64px 64px 1fr;align-items:stretch}
  .mcta .mb{display:grid;place-items:center;gap:2px;text-decoration:none;font-size:.7rem;font-weight:800;color:var(--green);border-radius:12px;background:var(--green-soft);padding:6px 0}
  .mcta .mb svg{width:20px;height:20px}
  .mcta .btn{font-size:.95rem}
}

@media (max-width:700px){
  /* bottom bar carries the CTA on phones; header shows the full brand instead */
  .nav-cta{display:none}
  .brand .w{display:block;width:150px}
  .burger{margin-left:auto}
}

/* =========================================================
   CONFIG-DRIVEN MODULES
   ========================================================= */
.row-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap}
.pill.sample{background:var(--coral-soft);color:#9a3a24;vertical-align:middle;margin-left:6px}
[data-item][hidden],[data-module][hidden]{display:none!important}
.promos{min-width:0}.promos .promo{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* campaign slots: 1 = full width, 2 = side by side */
.slots{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr));gap:22px}
.slots .slot{grid-template-columns:1fr}
.slots.one .slot{grid-template-columns:1.4fr 1fr}
@media (max-width:820px){.slots.one .slot{grid-template-columns:1fr}}
.slot .sbody{opacity:.85}
.slot.t-green{background:var(--green)} .slot.t-green::after{background:var(--green-2)}
.slot.t-blue{background:var(--blue)} .slot.t-blue::after{background:var(--blue-2)}
.slot.t-green .facts,.slot.t-blue .facts{background:rgba(255,255,255,.12)}
.slot.t-green .facts,.slot.t-blue .facts{background:rgba(0,0,0,.18)}
.slot .pill.sample{background:#fff}

/* events compact (home) */
.ev.compact{grid-template-columns:76px 1fr auto;padding:14px 18px;gap:16px}
.ev.compact .date b{font-size:1.5rem}
.ev .date .dow{margin:4px 0 0;color:var(--ink-2)}
@media (max-width:640px){.ev.compact{grid-template-columns:64px 1fr}.ev.compact .btn{grid-column:auto;grid-row:1/3;grid-column:3}}
@media (max-width:420px){.ev.compact{grid-template-columns:60px 1fr}.ev.compact .btn{display:none}.ev.compact{position:relative}}

/* gallery */
.gtrack{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px}
.gtrack::-webkit-scrollbar{display:none}
.gslide{flex:0 0 clamp(240px,30%,360px);margin:0;scroll-snap-align:start;position:relative}
.gslide img,.gslide .ph-img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:28px 8px 28px 8px}
.gslide figcaption{position:absolute;left:12px;bottom:12px;background:#fff;border-radius:999px;padding:6px 14px;font-weight:800;font-size:.85rem}
.arrows{display:flex;gap:8px}
.arrows button{width:46px;height:46px;border-radius:50%;border:2px solid var(--ink);background:#fff;font:800 1.4rem/1 var(--font);cursor:pointer;transition:background .15s,color .15s}
.arrows button:hover{background:var(--ink);color:#fff}
@media (max-width:700px){.gtrack{margin-inline:calc(-1 * var(--gut));padding-inline:var(--gut)}.gslide{flex-basis:72%}}

/* program cards: whole card clickable + hover */
.prog{position:relative;transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s}
.prog .arrow.stretch::before{content:"";position:absolute;inset:0;z-index:2}
.prog .top::after{transition:transform .5s cubic-bezier(.2,.8,.2,1)}
@media (hover:hover){.prog:hover{transform:translateY(-6px);box-shadow:0 0 0 1px var(--line),0 22px 40px -22px rgba(22,33,63,.45)}
  .prog:hover .top::after{transform:scale(1.35) translate(-14px,-10px)}}

/* =========================================================
   GROWTH — the kid reaches for the CSL star
   ========================================================= */
.growth{background:var(--green-soft);overflow:hidden}
.growth .wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(24px,5vw,72px);align-items:end}
.g-copy{display:grid;gap:16px;align-self:center;min-width:0}
.replay{justify-self:start;display:inline-flex;align-items:center;gap:8px;border:0;background:none;color:var(--green);font:800 .9rem var(--font);padding:6px 0;cursor:pointer;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:2px}
.g-copy .actions{margin-top:6px}
@media (max-width:700px){.g-copy .actions .btn{width:100%}}
.replay svg{width:18px;height:18px;transition:transform .5s}
.replay:hover svg{transform:rotate(-300deg)}
.g-stage{position:relative;display:grid;grid-template-columns:minmax(120px,240px) 34px 1fr;align-items:end;min-height:560px;margin-bottom:calc(-1 * clamp(56px,8vw,104px));min-width:0}
.g-stage::before{content:"";position:absolute;right:-12%;top:-6%;width:62%;aspect-ratio:1;border-radius:50%;background:var(--green-mid);z-index:0}
.kid{position:relative;z-index:1;width:100%;height:auto;align-self:end;transform-origin:50% 100%}
.g-line{position:relative;z-index:1;align-self:stretch;display:flex;justify-content:center;padding-top:34px}
.g-line .stem{display:block;width:5px;border-radius:3px;background:var(--green);height:100%;transform-origin:50% 100%}
.g-ms{position:relative;z-index:1;list-style:none;margin:0;padding:0 0 34px;display:flex;flex-direction:column-reverse;justify-content:space-between;align-self:stretch;gap:18px;min-width:0}
.ms{position:relative;display:grid;gap:4px;padding-left:22px;min-width:0}
.ms .tick{position:absolute;left:-36px;top:.55em;width:30px;height:5px;border-radius:3px;background:var(--green)}
.ms .age{font-weight:900;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--green)}
.ms p{font-weight:800;font-size:1.15rem;line-height:1.25;max-width:24ch}
.ms .pill{justify-self:start;margin-top:4px}
.star-ms{padding-left:22px}
.g-star{position:absolute;left:-60px;top:-14px;width:54px;height:54px;color:var(--gold)}
.g-star .spark{width:100%;height:100%;fill:var(--gold);filter:drop-shadow(0 6px 10px rgba(242,184,75,.55))}
.star-ms .age{color:var(--gold-ink)} .star-ms p{font-size:1.6rem;color:var(--green)}
@media (max-width:860px){
  .growth .wrap{grid-template-columns:1fr}
  .g-stage{grid-template-columns:minmax(110px,40%) 28px 1fr;min-height:440px}
  .g-ms{gap:12px}
  .ms p{font-size:1rem} .star-ms p{font-size:1.3rem}
  .ms .tick{left:-31px;width:24px} .g-star{left:-50px;width:44px;height:44px}
}

/* growth animation — only armed when the section starts off-screen (JS), so the page is complete at rest */
.growth.armed .stem{transform:scaleY(0)}
.growth.armed .ms{opacity:0;transform:translateY(14px)}
.growth.armed .kid{transform:scale(.94)}
.growth.armed .g-star{transform:scale(0) rotate(-90deg)}
.growth.play .stem{transform:scaleY(1);transition:transform 1.6s cubic-bezier(.45,.05,.3,1)}
.growth.play .ms{opacity:1;transform:none;transition:opacity .5s,transform .5s cubic-bezier(.2,.8,.2,1);transition-delay:calc(.25s + var(--i) * .32s)}
.growth.play .kid{transform:scale(1);transition:transform 1.6s cubic-bezier(.3,1.3,.5,1)}
.growth.play .g-star{transform:scale(1) rotate(0);transition:transform .7s cubic-bezier(.3,1.6,.5,1) 1.55s}
.growth.play .g-star .spark{animation:twinkle 2.8s ease-in-out 2.4s infinite}
@keyframes twinkle{0%,100%{transform:scale(1) rotate(0)}50%{transform:scale(1.12) rotate(45deg)}}

/* =========================================================
   MOTION: scroll reveal, loader, star burst
   ========================================================= */
.rv{opacity:0;transform:translateY(18px)}
.rv.in{opacity:1;transform:none;transition:opacity .6s ease,transform .6s cubic-bezier(.2,.8,.2,1);transition-delay:var(--d,0s)}

/* loader: the CSL star grows on a stem, then the page shows. First visit per session only. */
#csl-loader{position:fixed;inset:0;z-index:200;background:var(--green-soft);display:grid;place-items:center;transition:opacity .45s ease,visibility .45s}
#csl-loader.done{opacity:0;visibility:hidden}
#csl-loader svg{width:120px;height:160px;overflow:visible}
#csl-loader .ld-stem{stroke:var(--green);stroke-width:6;stroke-linecap:round;fill:none;stroke-dasharray:100;stroke-dashoffset:100;animation:ld-draw .55s cubic-bezier(.45,.05,.3,1) forwards}
#csl-loader .ld-leaf{fill:var(--green-2);transform-origin:60px 112px;transform:scale(0);animation:ld-pop .35s cubic-bezier(.3,1.6,.5,1) .3s forwards}
#csl-loader .ld-leaf.r{transform-origin:60px 98px;animation-delay:.4s}
#csl-loader .ld-star{fill:var(--gold);transform-origin:60px 40px;transform:scale(0) rotate(-120deg);animation:ld-star .6s cubic-bezier(.3,1.6,.5,1) .5s forwards,ld-spin 1.6s ease-in-out 1.1s infinite}
#csl-loader .ld-word{font:900 15px var(--font);letter-spacing:.18em;fill:var(--green);opacity:0;animation:ld-fade .4s ease .75s forwards}
@keyframes ld-draw{to{stroke-dashoffset:0}}
@keyframes ld-pop{to{transform:scale(1)}}
@keyframes ld-star{to{transform:scale(1) rotate(0)}}
@keyframes ld-spin{50%{transform:scale(1.12) rotate(45deg)}}
@keyframes ld-fade{to{opacity:1}}

.burst{position:fixed;pointer-events:none;z-index:150;width:14px;height:14px;margin:-7px 0 0 -7px}
.burst svg{width:100%;height:100%;fill:var(--gold)}
.burst{animation:burst .7s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes burst{0%{transform:translate(0,0) scale(.4) rotate(0);opacity:1}100%{transform:translate(var(--x),var(--y)) scale(1.2) rotate(140deg);opacity:0}}

/* small motion */
.btn .spark{width:1em;height:1em;fill:currentColor;transition:transform .4s cubic-bezier(.3,1.6,.5,1)}
.btn:hover .spark{transform:rotate(90deg) scale(1.15)}
.menu .sub{transform-origin:20px 0}
.open>.sub{animation:dd .18s ease-out}
@keyframes dd{from{opacity:0;transform:translateY(-6px) scale(.98)}}
.pill.solid.gold{animation:none}
.feat .pill{position:relative}
.feat .pill::after{content:"";position:absolute;inset:-3px;border-radius:999px;border:2px solid var(--gold);opacity:0;animation:ping 2.4s ease-out 1.5s infinite}
@keyframes ping{0%{opacity:.8;transform:scale(.9)}70%,100%{opacity:0;transform:scale(1.25)}}
.quick a,.mcta a{transition:transform .12s}
.quick a:active,.mcta a:active{transform:scale(.96)}
.mini{transition:box-shadow .15s,transform .2s} @media (hover:hover){.mini:hover{transform:translateY(-3px)}}

@media (prefers-reduced-motion:reduce){
  #csl-loader{display:none}
  .rv,.growth.armed .stem,.growth.armed .ms,.growth.armed .kid,.growth.armed .g-star{opacity:1!important;transform:none!important}
}

/* growth: compact sizing */
.g-stage{grid-template-columns:minmax(96px,160px) 30px minmax(0,1fr);min-height:0;height:430px}
.kid{max-height:100%;width:auto;justify-self:end}
.g-ms{gap:10px;padding-bottom:24px}
.ms{gap:2px} .ms p{font-size:1rem;max-width:30ch} .ms .pill{margin-top:2px}
.star-ms p{font-size:1.3rem}
.g-star{width:44px;height:44px;left:-52px;top:-10px}
.g-line{padding-top:26px}
.g-stage::before{width:48%;top:2%;right:-6%}
@media (max-width:860px){
  .g-stage{grid-template-columns:minmax(80px,28%) 26px minmax(0,1fr);height:360px}
  .ms p{font-size:.9rem} .star-ms p{font-size:1.15rem}
  .ms .tick{left:-29px;width:22px} .g-star{left:-46px;width:38px;height:38px}
}
.g-stage{grid-template-columns:auto 30px minmax(0,1fr)}
.kid{height:100%;width:auto;max-width:none;align-self:stretch;object-fit:contain;object-position:bottom}
@media (max-width:860px){
  .g-stage{grid-template-columns:auto 24px minmax(0,1fr);height:380px}
  .g-ms{gap:6px;padding-bottom:18px}
  .ms p{font-size:.86rem;line-height:1.2} .ms .age{font-size:.7rem}
  .ms .pill.tiny{font-size:.6rem;padding:3px 8px}
}
.g-stage{--gh:430px;height:var(--gh)}
.kid{height:var(--gh);width:calc(var(--gh) * 279 / 719);align-self:end}
@media (max-width:860px){.g-stage{--gh:340px}}
.ev-tags{display:flex;gap:6px;flex-wrap:wrap}
.ev-tags:empty{display:none}
.pill.cat{background:var(--blue-soft);color:var(--blue)}
.pill.full{background:var(--ink);color:#fff}
.ev.feat{box-shadow:0 0 0 2px var(--gold)}
.ev .pill.sample{margin-left:0}

/* "More at CSL" — compact service index under the 3 core programs */
.svc{margin-top:28px;background:#fff;border-radius:var(--r);box-shadow:0 0 0 1px var(--line);padding:8px 8px 8px}
.svc-head{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;padding:16px 18px 10px}
.svc-head h3{font-size:1.15rem}
.svc-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;column-gap:8px}
.svc-list a{display:grid;grid-template-columns:12px minmax(0,1fr) auto 20px;grid-template-areas:"d n w g" ". l l g";column-gap:12px;row-gap:2px;align-items:center;
  padding:14px 14px;border-radius:12px;text-decoration:none;border-top:1px solid var(--line);transition:background .15s}
.svc-list li:nth-child(-n+2) a{border-top-color:transparent}
.svc-list a:hover{background:var(--wash)}
.svc-list .dot{grid-area:d;width:10px;height:10px;border-radius:3px}
.dot.coral{background:var(--coral)} .dot.green{background:var(--green)} .dot.blue{background:var(--blue)} .dot.gold{background:var(--gold)} .dot.ink{background:var(--ink)}
.svc-list .nm{grid-area:n;font-weight:800}
.svc-list .ln{grid-area:l;font-size:.88rem;color:var(--ink-2);line-height:1.35}
.svc-list .who{grid-area:w;font-size:.72rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);background:var(--wash);border-radius:999px;padding:3px 10px;white-space:nowrap}
.svc-list .go{grid-area:g;font-weight:800;color:var(--green);transition:transform .15s}
.svc-list a:hover .go{transform:translateX(4px)}
@media (max-width:760px){
  .svc{margin-top:16px;padding:4px}
  .svc-list{grid-template-columns:1fr}
  .svc-list li:nth-child(2) a{border-top-color:var(--line)}
  .svc-list a{padding:12px}
}
@media (max-width:700px){
  .programs{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin-inline:calc(-1 * var(--gut));padding:4px var(--gut) 8px;scrollbar-width:none}
  .programs::-webkit-scrollbar{display:none}
  .programs .prog{flex:0 0 84%;scroll-snap-align:start}
  .prog .body{padding:14px 18px}
  .swipe-dots{display:flex;justify-content:center;gap:6px;margin-top:6px}
  .swipe-dots i{width:7px;height:7px;border-radius:50%;background:var(--green-mid);transition:width .2s,background .2s}
  .swipe-dots i.on{width:20px;border-radius:4px;background:var(--green)}
}
@media (min-width:701px){.swipe-dots{display:none}}
@media (max-width:700px){.programs,.swipe,.gtrack{scroll-padding-inline:var(--gut)}}

/* newsletter inside growth section */
.nl{display:grid;gap:12px;margin-top:6px;max-width:460px}
.nl-row{display:grid;grid-template-columns:1.4fr 1fr;gap:10px}
.nl .field label{font-size:.82rem}
.nl .field input,.nl .field select{padding:12px 13px}
.nl .btn{justify-self:start}
.nl .ok{background:#fff;color:var(--green);border-radius:12px;padding:12px 14px;font-weight:700}
@media (max-width:560px){.nl-row{grid-template-columns:1fr}.nl .btn{width:100%}}
.growth .g-copy{align-self:center;padding-block:10px}
.footer-news-off{display:none}

/* blog */
.posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
@media (max-width:900px){.posts{grid-template-columns:1fr}}
.post-card a{display:grid;gap:10px;height:100%;padding:24px;border-radius:var(--r);background:#fff;box-shadow:0 0 0 1px var(--line);text-decoration:none;transition:box-shadow .15s,transform .2s;align-content:start}
@media (hover:hover){.post-card a:hover{box-shadow:0 0 0 2px var(--ink);transform:translateY(-3px)}}
.post-card h3{font-size:1.2rem;line-height:1.2}
.pc-cat{font-size:var(--fs-label);font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--green);display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.pc-meta{font-size:.84rem;font-weight:600;color:var(--ink-2)}
.cat-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}
.post-head{background:var(--green-soft);padding-block:clamp(36px,6vw,72px)}
.post-head .wrap{display:grid;gap:14px;max-width:860px}
.post-head h1{font-size:clamp(2rem,4.4vw,3.2rem);color:var(--ink)}
.post-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:clamp(28px,5vw,64px);padding-block:clamp(36px,5vw,64px);align-items:start}
@media (max-width:900px){.post-grid{grid-template-columns:1fr}}
.prose{max-width:68ch;font-size:1.08rem;line-height:1.75}
.prose h2{font-size:1.45rem;margin:1.8em 0 .5em;line-height:1.2}
.prose p{margin:0 0 1em;max-width:none}
.post-cta{margin-top:2em;padding:24px;border-radius:var(--leaf);background:var(--gold-soft);display:grid;gap:14px;justify-items:start}
.post-side{display:grid;gap:18px;position:sticky;top:110px}
.post-side .box .arrow{line-height:1.35}
@media (max-width:900px){.post-side{position:static}}
[hidden]{display:none!important}
/* nav fit with Blog added */
.menu>li>a,.menu>li>button{padding:10px 12px}
@media (max-width:1300px){.nav-cta .btn.ghost{display:none}}
@media (max-width:1100px) and (min-width:981px){.nav{gap:14px}.menu>li>a,.menu>li>button{padding:10px 9px;font-size:.94rem}.menu .feat .pill{display:none}}
#faq .todo{margin-bottom:12px}
.faq-side{position:sticky;top:110px;align-self:start}
@media (max-width:860px){.faq-side{position:static}}
.faq details{transition:box-shadow .15s}
.faq details[open]{box-shadow:0 0 0 2px var(--green)}
.faq summary:hover{color:var(--green)}

/* Visit us: centre + Google rating + map */
.visit{display:grid;grid-template-columns:1.25fr 1fr;gap:22px;align-items:start}
.visit>*{min-width:0}
@media (max-width:900px){.visit{grid-template-columns:1fr}}
.visit-card{background:var(--wash);border-radius:var(--r);padding:16px;display:grid;gap:18px}
.visit-card .clist{padding-inline:6px}
.visit-card .actions{padding:0 6px 6px}
.visit-card .btn svg{width:18px;height:18px}
.map-card{position:relative;display:block;border-radius:28px 8px 28px 8px;overflow:hidden;aspect-ratio:16/8;text-decoration:none;color:var(--ink);box-shadow:0 0 0 1px var(--line)}
.map-art{position:absolute;inset:0;width:100%;height:100%}
.map-art .m-bg{fill:#eef4ea}.map-art .m-park{fill:var(--green-mid)}.map-art .m-water{fill:#d6e2f7}
.map-art .m-road{fill:none;stroke:#fff;stroke-width:10;stroke-linecap:round}.map-art .m-road.big{stroke-width:16;stroke:#fdf1d8}.map-art .m-road.thin{stroke-width:5}
.map-pin{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);display:grid;justify-items:center;gap:2px;text-align:center}
.map-pin .pin{width:46px;height:46px;border-radius:50% 50% 50% 4px;transform:rotate(-45deg);background:var(--green);display:grid;place-items:center;box-shadow:0 8px 16px -8px rgba(22,33,63,.6);margin-bottom:6px;transition:transform .25s cubic-bezier(.3,1.6,.5,1)}
.map-pin .pin .spark{width:22px;height:22px;fill:var(--gold);transform:rotate(45deg)}
.map-pin b{background:#fff;padding:4px 10px;border-radius:8px;font-size:.88rem;box-shadow:0 2px 8px -4px rgba(0,0,0,.3)}
.map-pin small{font-weight:700;font-size:.78rem;color:var(--ink-2);background:rgba(255,255,255,.85);padding:1px 8px;border-radius:6px}
.map-open{position:absolute;right:12px;bottom:12px;background:var(--ink);color:#fff;font-weight:800;font-size:.84rem;padding:8px 14px;border-radius:999px}
@media (hover:hover){.map-card:hover .pin{transform:rotate(-45deg) translate(4px,-4px) scale(1.08)}}
.gbox{background:#fff;border-radius:var(--r);box-shadow:0 0 0 1px var(--line);padding:24px;display:grid;gap:18px}
.g-score{display:flex;align-items:center;gap:16px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.g-score img{width:80px;height:auto}
.g-score div{display:grid;grid-template-columns:auto auto;column-gap:10px;align-items:center}
.g-score b{font-size:2.4rem;font-weight:900;line-height:1;grid-row:1/3}
.g-score .stars{color:var(--gold);letter-spacing:2px;font-size:1.05rem}
.g-score small{color:var(--ink-2);font-weight:600;font-size:.84rem}
.gq{margin:0;display:grid;gap:8px}
.gq q{font-weight:600;line-height:1.5;quotes:none}
.gq q::before{content:"“";color:var(--blue);font-weight:900;font-size:1.6em;line-height:0;vertical-align:-.35em;margin-right:2px}
.gq figcaption{font-size:.86rem;color:var(--ink-2);font-weight:600}.gq .stars{color:var(--gold)}
.gq+.gq{padding-top:16px;border-top:1px dashed var(--line)}
.g-actions{display:flex;gap:20px;flex-wrap:wrap;padding-top:4px}
@media (max-width:600px){.map-card{aspect-ratio:16/11}.map-pin{top:40%}.map-open{font-size:.76rem;padding:6px 11px;right:10px;bottom:10px}.visit-card .actions .btn{width:100%}}

/* =========================================================
   FLAT INTERACTION STATES (overrides everything above)
   Rule: no lift, no drop shadow, no offset outline.
   hover = one step darker fill · active = two steps darker · focus = 2px ring in the same hue
   ========================================================= */
:root{
  --gold-h:#e9ab36; --gold-a:#d99a22;
  --green-h:#235c12; --green-a:#1c4a0e;
  --blue-h:#08217a; --blue-a:#061a62;
  --ink-h:#0d1630;
}
html{-webkit-tap-highlight-color:transparent}
.btn{transition:background-color .15s ease,color .15s ease,box-shadow .15s ease;box-shadow:none;transform:none}
.btn:hover{transform:none;box-shadow:none;background:var(--gold-h)}
.btn:active{background:var(--gold-a)}
.btn.green:hover{background:var(--green-h)} .btn.green:active{background:var(--green-a)}
.btn.blue:hover{background:var(--blue-h)} .btn.blue:active{background:var(--blue-a)}
.btn.ghost{box-shadow:inset 0 0 0 2px var(--ink)}
.btn.ghost:hover{background:var(--ink);color:#fff;box-shadow:inset 0 0 0 2px var(--ink)}
.btn.ghost:active{background:var(--ink-h);box-shadow:inset 0 0 0 2px var(--ink-h)}
.btn[disabled]{opacity:.6;cursor:default;background:var(--green-mid);color:var(--green)}
.btn:hover .spark{transform:none}

/* keyboard focus: flat 2px ring, only for keyboard users */
:focus{outline:none}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:8px}
.btn:focus-visible{outline-offset:3px;border-radius:999px}
.chips input:focus-visible+label{outline:2px solid var(--blue);outline-offset:2px}
.field input:focus,.field select:focus,.field textarea:focus{box-shadow:none;border-color:var(--green);outline:none}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{outline:none}

/* nav */
.menu>li>a:active,.menu>li>button:active{background:var(--green-mid)}
.menu a[aria-current="page"],.menu button.current{color:var(--green);background:transparent;box-shadow:inset 0 -3px 0 var(--green);border-radius:0}
.menu .feat>a[aria-current="page"]{background:var(--green-soft);box-shadow:none;border-radius:999px}
.sub a:active{background:var(--green-soft)}

/* text links */
.arrow:hover{color:var(--green-h)} .arrow:active{color:var(--green-a)}

/* cards: flat — border colour change only */
.prog,.mini,.post-card a,.svc-list a{transition:box-shadow .15s ease,background-color .15s ease}
@media (hover:hover){
  .prog:hover{transform:none;box-shadow:0 0 0 2px var(--ink)}
  .prog:hover .top::after{transform:none}
  .mini:hover{transform:none;box-shadow:0 0 0 2px var(--ink)}
  .post-card a:hover{transform:none;box-shadow:0 0 0 2px var(--ink)}
  .map-card:hover{box-shadow:0 0 0 2px var(--ink)}
  .map-card:hover .pin{transform:rotate(-45deg)}
}
.prog:active,.mini:active,.post-card a:active{box-shadow:0 0 0 2px var(--green)}
.quick a:active,.mcta a:active{transform:none}
.quick a:active{background:var(--green-soft);box-shadow:0 0 0 2px var(--green)}
.mcta .mb:active{background:var(--green-mid)}

/* remove decorative shadows that read as depth */
.hero .photo .stamp{box-shadow:0 0 0 1px var(--line)}
.sub{box-shadow:0 0 0 1px var(--line)}
.map-pin .pin{box-shadow:none}
.map-pin b{box-shadow:0 0 0 1px var(--line)}
.replay{box-shadow:none}
.faq details[open]{box-shadow:0 0 0 2px var(--green)}
.arrows button:active{background:var(--ink-h)}
.topbar :focus-visible,footer.site :focus-visible,.slot :focus-visible,.phead:not(.light):not(.gold) :focus-visible,.band.deep :focus-visible,.band.navy :focus-visible,.prog .top :focus-visible{outline-color:#fff}

/* footer: follow-us channels (matches the Follow-us poster) */
.follow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.2fr);gap:24px;align-items:center;padding-block:28px;border-top:1px solid rgba(255,255,255,.12)}
.follow h4{color:#fff;font-size:var(--fs-label);letter-spacing:.14em;text-transform:uppercase;font-weight:800;margin:0}
.follow p{font-size:.92rem}
.chan{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.chan a{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:#fff;color:var(--ink);text-decoration:none;transition:background-color .15s,box-shadow .15s}
footer.site .chan a:hover{background:var(--gold-soft);color:var(--ink);text-decoration:none}
footer.site .chan a:active{box-shadow:inset 0 0 0 2px var(--gold)}
.chan img{width:28px;height:28px;object-fit:contain;flex:none}
.chan span{display:grid;min-width:0}
.chan b{font-size:.92rem}
.chan small{font-size:.76rem;color:var(--ink-2);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:980px){.follow{grid-template-columns:1fr}}
@media (max-width:640px){.chan{grid-template-columns:1fr 1fr}}
.follow{grid-template-columns:minmax(0,1fr) minmax(0,3fr)}
.chan small{white-space:normal;overflow:visible;line-height:1.25}
.chan a{padding:10px 12px;gap:10px}
@media (max-width:480px){
  .fcols{grid-template-columns:1fr 1fr;gap:22px 16px}
  .fcols>div:first-child,.fcols>div:last-child{grid-column:1/-1}
}

/* =========================================================
   TEACHER CAROUSEL — echoes the "Meet our tutor" posters
   ========================================================= */
.tc{display:grid;gap:18px}
.tc-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;gap:20px;scrollbar-width:none;border-radius:var(--r)}
.tc-track::-webkit-scrollbar{display:none}
.tc-slide{flex:0 0 100%;scroll-snap-align:start;display:grid;grid-template-columns:minmax(220px,340px) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center;background:#fff;border-radius:var(--r);padding:clamp(18px,3vw,32px);box-shadow:0 0 0 1px var(--line)}
.tc-photo{position:relative;padding:0 0 14px 14px}
.tc-photo::before{content:"";position:absolute;left:0;bottom:0;width:62%;height:72%;background:var(--green);border-radius:28px 6px 28px 6px}
.c-blue .tc-photo::before{background:var(--blue)} .c-gold .tc-photo::before{background:var(--gold)} .c-coral .tc-photo::before{background:var(--coral)}
.tc-photo img{position:relative;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:28px 6px 28px 6px}
.tc-info{display:grid;gap:12px;min-width:0;align-content:center}
.tc-info h3{font-size:clamp(2rem,4vw,3rem);font-weight:900;letter-spacing:-.03em;color:var(--green);line-height:1}
.c-blue .tc-info h3{color:var(--blue)} .c-gold .tc-info h3{color:var(--gold-ink)} .c-coral .tc-info h3{color:var(--coral)}
.tc-title{font-weight:800;font-size:1.05rem;text-transform:uppercase;letter-spacing:.06em;color:var(--ink)}
.tc-info dl{margin:6px 0 0;display:grid;gap:12px}
.tc-info dl div{display:grid;grid-template-columns:110px minmax(0,1fr);gap:12px;padding-top:12px;border-top:1px solid var(--line)}
.tc-info dt{font-size:var(--fs-label);font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2);padding-top:3px}
.tc-info dd{margin:0;line-height:1.5}
.tc-info blockquote{margin:4px 0 0;padding:14px 18px;background:var(--gold-soft);border-radius:14px;font-weight:700;font-size:1.02rem}
.tc-bar{display:flex;align-items:center;justify-content:space-between;gap:16px}
.tc-thumbs{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:4px 2px;min-width:0}
.tc-thumbs::-webkit-scrollbar{display:none}
.tc-th{flex:none;display:grid;justify-items:center;gap:4px;border:0;background:none;padding:4px;border-radius:12px;cursor:pointer;font:700 .74rem var(--font);color:var(--ink-2)}
.tc-th img{width:48px;height:60px;object-fit:cover;border-radius:12px 4px 12px 4px;box-shadow:0 0 0 2px transparent;transition:box-shadow .15s,opacity .15s;opacity:.55}
.tc-th:hover img{opacity:1}
.tc-th.on img{opacity:1;box-shadow:0 0 0 3px var(--green)}
.tc-th.on{color:var(--ink)}
.tc-cta{display:flex;align-items:center;gap:14px 20px;flex-wrap:wrap}
.tc-mail svg{width:20px;height:20px}
.tc-cta .sel{user-select:all;color:var(--ink)}
.copy{border:0;background:var(--green-soft);color:var(--green);font:800 .78rem var(--font);padding:4px 10px;border-radius:999px;cursor:pointer;margin-left:4px}
.copy:hover{background:var(--green-mid)}
@media (max-width:760px){
  .tc-slide{grid-template-columns:1fr;gap:16px;padding:16px;align-items:start}
  .tc-photo{max-width:260px}
  .tc-photo img{aspect-ratio:4/4.2}
  .tc-info dl div{grid-template-columns:1fr;gap:2px}
  .tc-bar .arrows{display:none}
  .tc-cta .btn{width:100%}
}
.tc{grid-template-columns:minmax(0,1fr)}
@media (max-width:760px){
  .tc-photo{max-width:none;padding:0}
  .tc-photo::before{display:none}
  .tc-photo img{aspect-ratio:16/10;object-position:50% 22%;border-radius:20px 6px 20px 6px}
  .tc-info{gap:8px} .tc-info h3{font-size:1.9rem} .tc-title{font-size:.88rem}
  .tc-info dl{gap:8px} .tc-info dl div{padding-top:8px} .tc-info dd{font-size:.95rem}
}

/* footer brand lockup */
.fcols .fb{gap:18px;align-content:start}
.f-brand{display:inline-flex;align-items:center;gap:12px;background:#fff;border-radius:16px;padding:10px 16px 10px 10px;text-decoration:none;justify-self:start;max-width:100%}
footer.site .f-brand:hover{text-decoration:none;background:#fff}
.f-brand .m{width:52px;height:auto}
.f-brand span{display:grid;gap:4px;min-width:0}
.f-brand .w{width:170px;max-width:100%;height:auto}
.f-brand small{font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2)}
.fcols .fb>img{display:none}
.fcols .sig{font-size:1.5rem;line-height:1.15;align-items:center}
.fcols .sig .spark{margin-top:0;width:22px;height:22px}
.arrows button.off{visibility:hidden}
.arrows[hidden]{display:none!important}
.gtrack{scroll-behavior:smooth}

/* ---- photo fitting: keep each photo near its native ratio ---- */
/* teacher card on phones: portrait photo beside the name, details full width below */
@media (max-width:760px){
  .tc-slide{grid-template-columns:min(38%,150px) minmax(0,1fr);column-gap:14px;row-gap:12px;align-items:start}
  .tc-info{display:contents}
  .tc-photo{grid-row:1 / span 3;align-self:start}
  .tc-photo img{aspect-ratio:4/5;object-position:50% 20%;border-radius:16px 4px 16px 4px}
  .tc-slide .pills{grid-column:2;align-self:end}
  .tc-slide h3{grid-column:2}
  .tc-slide .tc-title{grid-column:2;align-self:start}
  .tc-slide dl,.tc-slide blockquote{grid-column:1 / -1}
  .tc-slide .pill.tiny{font-size:.58rem;padding:3px 7px}
}
/* hero photo on phones: 4:3 instead of 16:9, framed on the children */
@media (max-width:700px){.hero .photo img{aspect-ratio:4/3;object-position:50% 35%}}
/* gallery: one consistent portrait frame; landscape shots are centred on their subject */
.gslide img{object-position:50% 45%}

/* =========================================================
   GROWTH v2 — hand-drawn stem grows from the floor, the star rides
   the tip to the top, then keeps spinning. Matches the original hero.
   ========================================================= */
.growth{position:relative}
.growth::after{content:"";position:absolute;left:0;right:0;bottom:0;height:46px;background:#dde9d2;z-index:0}
.growth .wrap{position:relative;z-index:1}
.g-stage{--gh:470px;--floor:24px;height:var(--gh);grid-template-columns:auto 64px minmax(0,1fr);column-gap:0}
.g-stage::before{width:52%;right:-8%;top:-4%}
.kid{height:calc(var(--gh) - 60px);width:auto;align-self:end;margin-bottom:var(--floor);position:relative;z-index:2;transform-origin:50% 100%}
.g-shadow{position:absolute;z-index:1;left:0;bottom:calc(var(--floor) - 9px);width:calc((var(--gh) - 60px) * 279 / 757 * 1.05);height:18px;border-radius:50%;background:#c9dcbc}
.g-line{position:relative;align-self:stretch;padding:0;display:block;z-index:2}
.g-line .stem{display:none}
.g-stem{position:absolute;left:0;right:0;top:40px;bottom:var(--floor);width:100%;height:calc(100% - 40px - var(--floor));overflow:visible}
.g-stem path{fill:none;stroke:var(--green);stroke-width:7px;stroke-linecap:round;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:0}
.g-star{position:absolute;left:50%;top:0;width:84px;height:84px;margin-left:-42px;color:var(--gold);transform:none;z-index:3}
.g-star svg{width:100%;height:100%;display:block;fill:var(--gold);animation:gspin 7s linear infinite}
@keyframes gspin{to{transform:rotate(360deg)}}
.g-ms{padding:22px 0 calc(var(--floor) + 6px);gap:14px;justify-content:space-between}
.ms .tick{left:-46px;width:34px;height:7px;top:.45em}
.star-ms{padding-left:22px}
.star-ms .age{color:var(--green)} .star-ms p{font-size:1.15rem;color:var(--ink)}
@media (min-width:861px){.star-ms p{font-size:1.25rem}}

/* animation states (armed = before it plays; play = growing) */
.growth.armed .g-stem path{stroke-dashoffset:1}
.growth.play .g-stem path{stroke-dashoffset:0;transition:stroke-dashoffset 1.8s cubic-bezier(.45,.05,.3,1)}
.growth.armed .g-star{transform:translateY(calc(var(--gh) - 40px - var(--floor) - 42px)) scale(.35)}
.growth.play .g-star{transform:none;transition:transform 1.8s cubic-bezier(.45,.05,.3,1)}
.growth.armed:not(.play) .g-star svg{animation:none}
.growth.play .g-star svg{animation:gspin 7s linear 1.8s infinite}
.growth.armed .kid{transform:scaleY(.9)}
.growth.play .kid{transform:none;transition:transform 1.8s cubic-bezier(.3,1.2,.5,1)}
.growth.play .g-star .spark{animation:none}

@media (max-width:860px){
  .g-stage{--gh:400px;grid-template-columns:auto 48px minmax(0,1fr)}
  .g-star{width:64px;height:64px;margin-left:-32px}
  .g-stem{top:32px;height:calc(100% - 32px - var(--floor))}
  .growth.armed .g-star{transform:translateY(calc(var(--gh) - 32px - var(--floor) - 32px)) scale(.35)}
  .ms .tick{left:-37px;width:26px;height:6px}
  .growth::after{height:40px}
}
@media (prefers-reduced-motion:reduce){.g-star svg{animation:none!important}.growth.armed .g-stem path{stroke-dashoffset:0!important}.growth.armed .g-star{transform:none!important}}
/* stem reveal: clip from the floor up (robust with non-scaling stroke) */
.g-stem path{stroke-dasharray:none;stroke-dashoffset:0}
.g-stem{clip-path:inset(0 -20px 0 -20px)}
.growth.armed .g-stem{clip-path:inset(100% -20px 0 -20px)}
.growth.play .g-stem{clip-path:inset(0 -20px 0 -20px);transition:clip-path 1.8s cubic-bezier(.45,.05,.3,1)}
.growth.armed .g-stem path,.growth.play .g-stem path{stroke-dashoffset:0;transition:none}
@media (prefers-reduced-motion:reduce){.growth.armed .g-stem{clip-path:none!important}}
/* start the stem + star a beat later (0.6s), keep ages and spin in sync */
.growth{--gdelay:.6s}
.growth.play .g-stem{transition:clip-path 1.8s cubic-bezier(.45,.05,.3,1) var(--gdelay)}
.growth.play .g-star{transition:transform 1.8s cubic-bezier(.45,.05,.3,1) var(--gdelay)}
.growth.play .g-star svg{animation:gspin 7s linear calc(1.8s + var(--gdelay)) infinite}
.growth.play .ms{transition-delay:calc(var(--gdelay) + .25s + var(--i) * .4s)}
.growth.play .kid{transition-delay:var(--gdelay)}
@media (max-width:860px){.growth.play .g-star{transform:none}}
/* footer brand v2: one logo lockup + slogan, no repeated names */
.f-brand{background:none;padding:0;gap:14px;border-radius:0}
footer.site .f-brand:hover{background:none}
.f-mark{width:58px;height:58px;border-radius:50%;background:#fff;display:grid;place-items:center;flex:none}
.f-mark img{width:44px;height:auto}
.f-word{width:180px;height:auto}
.fcols .sig{color:var(--gold-2)}
.fcols .sig span{color:#fff}
.fcols .sig{align-items:flex-start}.fcols .sig .spark{margin-top:.18em}
.open-pill{font-style:normal;margin-left:6px;padding:2px 8px;border-radius:999px;font-size:.66rem;letter-spacing:.06em;background:var(--coral-soft);color:#9a3a24}
.open-pill.is-open{background:var(--green-mid);color:var(--green)}
[data-open-status].is-open{color:var(--green)}

/* teacher photos: full original frame (1:2), never zoomed or distorted */
.tc-slide{grid-template-columns:minmax(180px,250px) minmax(0,1fr)}
.tc-photo img{aspect-ratio:1/2;object-fit:cover;object-position:50% 50%}
.tc-photo::before{height:60%}
.tc-th img{object-position:50% 18%}
@media (max-width:760px){
  .tc-slide{grid-template-columns:min(34%,130px) minmax(0,1fr)}
  .tc-photo{grid-row:1 / span 3}
  .tc-photo img{aspect-ratio:1/2;object-position:50% 50%}
}
.g-shadow{width:calc((var(--gh) - 60px) * 405 / 1100 * 1.05)}
.kid{margin-right:-34px}
@media (max-width:860px){.kid{margin-right:-22px}}
.kid{margin-right:-24px}
@media (max-width:860px){.kid{margin-right:-16px}}

/* =========================================================
   FREE ASSESSMENT — notebook path: You are here → Next step
   ========================================================= */
:root{--coral-d:#b8433a;--coral-bg:#fde9e6}
.assess{background:var(--coral-bg);overflow:hidden}
.assess .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,72px);align-items:center}
.as-copy{display:grid;gap:18px;min-width:0}
.as-eyebrow{color:var(--coral-d)}
.assess h2{font-size:clamp(2rem,3.6vw,3rem);line-height:1.08}
.as-rule{width:56px;height:5px;border-radius:3px;background:var(--coral-d)}
.as-steps{list-style:none;margin:8px 0 6px;padding:0;display:grid;gap:22px;counter-reset:as}
.as-steps li{counter-increment:as;display:grid;grid-template-columns:52px minmax(0,1fr);column-gap:18px;row-gap:2px;align-items:start}
.as-steps li::before{content:counter(as);grid-row:1 / span 2;width:52px;height:52px;border-radius:50%;background:var(--coral-d);color:#fff;font-weight:900;font-size:1.3rem;display:grid;place-items:center}
.as-steps b{font-size:1.2rem;padding-top:4px}
.as-steps span{color:var(--ink-2);line-height:1.5}
.as-free{font-weight:800;color:var(--coral-d)}
.as-art{min-width:0}
.nb{width:100%;height:auto;display:block;overflow:visible}
.nb-shadow{fill:#f6d4cf}
.nb-page{fill:#fff;stroke:#efc9c3;stroke-width:2}
.nb-fold{stroke:#efc9c3;stroke-width:2}
.nb-lines line{stroke:#f3dcd8;stroke-width:1.6}
.nb-path{fill:none;stroke:none}
.nb-dots{fill:none;stroke:var(--coral-d);stroke-width:6;stroke-linecap:round;stroke-dasharray:0 15}
.nb-reveal{fill:none;stroke:#fff;stroke-width:14;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0}
.nb-dot{fill:var(--coral-d)}
.nb-ring{fill:none;stroke:var(--coral-d);stroke-width:3;opacity:.5;transform-box:fill-box;transform-origin:center;animation:nbping 2.2s ease-out infinite}
@keyframes nbping{0%{transform:scale(.6);opacity:.7}100%{transform:scale(1.5);opacity:0}}
.nb-label{font:800 22px var(--font);fill:var(--coral-d)}
.nb-star path{fill:var(--gold)}
.nb-star{animation:nbspin 7s linear infinite}
@keyframes nbspin{from{transform:translate(492px,104px) rotate(0)}to{transform:translate(492px,104px) rotate(360deg)}}
.pc-body{fill:var(--gold)} .pc-end{fill:#e2a43a} .pc-wood{fill:#f6dfb4} .pc-tip{fill:var(--ink)}
@media (max-width:860px){.assess .wrap{grid-template-columns:1fr}.as-art{max-width:520px;margin:0 auto;width:100%}}
@media (max-width:560px){.as-steps li{grid-template-columns:42px minmax(0,1fr);column-gap:14px}.as-steps li::before{width:42px;height:42px;font-size:1.1rem}.assess .actions .btn{width:100%}}

/* animation: path draws from "You are here" to the star; star pops in, then keeps spinning */
.assess.armed .nb-reveal{stroke-dashoffset:1}
.assess.play .nb-reveal{stroke-dashoffset:0;transition:stroke-dashoffset 2s cubic-bezier(.45,.05,.3,1) .3s}
.assess.armed .nb-star{animation:none;transform:translate(492px,104px) scale(0) rotate(-90deg)}
.assess.play .nb-star{transform:translate(492px,104px) scale(1);transition:transform .6s cubic-bezier(.3,1.6,.5,1) 2.1s;animation:nbspin 7s linear 2.7s infinite}
.assess.armed .nb-label:last-of-type{opacity:0}
.assess.play .nb-label:last-of-type{opacity:1;transition:opacity .4s 2.1s}
.assess.armed .nb-pencil{transform:translate(10px,470px) rotate(28deg)}
.assess.play .nb-pencil{transform:translate(40px,440px) rotate(28deg);transition:transform .8s cubic-bezier(.2,.8,.2,1)}
@media (prefers-reduced-motion:reduce){.nb-ring,.nb-star{animation:none!important}.assess.armed .nb-reveal{stroke-dashoffset:0!important}.assess.armed .nb-star{transform:translate(492px,104px)!important}.assess.armed .nb-label{opacity:1!important}}
.nw{white-space:nowrap}
/* footer brand v3: name first, slogan as a quiet sign-off */
.fcols .fb{gap:14px}
.f-brand{gap:12px}
.f-mark{width:46px;height:46px}
.f-mark img{width:34px}
.f-word{width:210px}
.fcols .sig{font-size:.95rem;font-weight:700;letter-spacing:.02em;line-height:1.3;color:rgba(255,255,255,.72);gap:8px;align-items:center;padding-left:58px}
.fcols .sig span{color:inherit}
.fcols .sig .spark{width:14px;height:14px;margin-top:0;fill:var(--gold)}
@media (max-width:480px){.fcols .sig{padding-left:0}}
/* photo stays crisp: no scaling of the cutout during the animation */
.kid{image-rendering:auto;backface-visibility:hidden}

/* the girl grows with the stem: same start, same duration, same easing; ends at transform:none so the photo is crisp at rest */
.kid{transform-origin:50% 100%}
.growth.armed .kid{transform:scale(.55)}
.growth.play .kid{transform:none;transition:transform 1.8s cubic-bezier(.45,.05,.3,1) var(--gdelay)}
.growth.armed .g-shadow{transform:scaleX(.6)}
.growth.play .g-shadow{transform:none;transition:transform 1.8s cubic-bezier(.45,.05,.3,1) var(--gdelay)}
@media (prefers-reduced-motion:reduce){.growth.armed .kid,.growth.armed .g-shadow{transform:none!important}}

/* map pin: star keeps spinning, pin drops in on scroll, a ripple marks the spot */
.map-pin .pin .spark{animation:pinspin 7s linear infinite}
@keyframes pinspin{from{transform:rotate(45deg)}to{transform:rotate(405deg)}}
.map-pin{--drop:0}
.map-pin .pin{position:relative}
.map-pin::before{content:"";position:absolute;left:50%;top:44px;width:34px;height:12px;margin-left:-17px;border-radius:50%;
  border:2px solid var(--green);opacity:0;animation:pinripple 2.2s ease-out infinite;pointer-events:none}
@keyframes pinripple{0%{transform:scale(.4);opacity:.7}100%{transform:scale(2.2);opacity:0}}
.map-card.armed .pin{transform:translateY(-70px) rotate(-45deg);opacity:0}
.map-card.play .pin{transform:rotate(-45deg);opacity:1;transition:transform .7s cubic-bezier(.3,1.5,.5,1),opacity .2s}
@media (prefers-reduced-motion:reduce){.map-pin .pin .spark,.map-pin::before{animation:none}.map-card.armed .pin{transform:rotate(-45deg);opacity:1}}
.pill.hot{background:var(--coral-soft);color:#9a3a24}
.ev .date.any{background:var(--green-soft)}
.ev .date.any b{display:block;height:1.5rem}
.ev .date.any .spark{width:22px;height:22px;fill:var(--gold);animation:pinspin 7s linear infinite}
.ev .date.any small{color:var(--green)}
.slots .slot::after{width:170px;right:-70px;top:-95px}
/* group price ladder */
.tiers{display:grid;gap:8px;margin-top:6px;padding-top:12px;border-top:1px dashed rgba(255,255,255,.22)}
.tiers small{font-size:var(--fs-label);font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}
.tiers ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.tiers li{display:grid;gap:2px;border-radius:10px;padding:8px 10px;background:rgba(255,255,255,.08)}
.tiers li span{font-size:.74rem;opacity:.8}
.tiers li b{font-size:1.3rem;font-weight:900;font-variant-numeric:tabular-nums}
.tiers li:last-child{background:var(--gold);color:var(--ink)}
.tiers p{font-size:.78rem;opacity:.8}
.slot .facts div:has(+ .tiers){border-bottom:0}
.callout .tiers{border-top-color:#c9d4f4}
.callout .tiers small{color:var(--blue)}
.callout .tiers li{background:#fff}
.callout .tiers li:last-child{background:var(--blue);color:#fff}
.callout .tiers p{color:var(--ink-2);opacity:1}
.slot>*{min-width:0}
.slot .facts{min-width:0}
.slot .facts .tiers{display:grid;justify-content:stretch;border-bottom:0;padding-bottom:0}
.slot .facts .tiers ul{display:grid}
.slot .facts .tiers li{display:grid;border:0;padding:8px 10px;justify-content:start}
.slot .facts>div:not(.tiers){flex-wrap:wrap;gap:4px 12px}
.slot .facts>div:not(.tiers) b{text-align:right;margin-left:auto}

/* What's next: stacked full-width rows (distinct from the 3-column program cards below) */
.slots{grid-template-columns:1fr;gap:16px}
.slots .slot,.slots.one .slot{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(20px,4vw,48px);align-items:center}
.slots .slot::after{width:220px;right:-80px;top:-120px}
/* compact row for "coming soon" items */
.slot.compact{grid-template-columns:minmax(0,1fr) auto;padding:20px clamp(20px,3vw,32px);border-radius:20px 6px 20px 6px;align-items:center}
.slot.compact::after{width:120px;right:-50px;top:-70px}
.slot.compact .stack{gap:6px;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:28px}
.slot.compact .stack>*{grid-column:1}
.slot.compact h2{font-size:1.35rem}
.slot.compact .sbody{font-size:.95rem}
.slot.compact .actions{grid-column:2;grid-row:1 / span 3;margin:0}
.slot.compact .facts{display:none}
@media (max-width:820px){
  .slots .slot,.slots.one .slot{grid-template-columns:1fr}
  .slot.compact .stack{grid-template-columns:1fr}
  .slot.compact .actions{grid-column:1;grid-row:auto}
}
.slot .arrow{color:var(--gold)} .slot .arrow:hover{color:#fff}
@media (max-width:820px){.slot .facts>div:not(.tiers){display:grid;gap:2px}.slot .facts>div:not(.tiers) b{text-align:left;margin-left:0}}

/* What's next v3: every card is text on top, facts in one row underneath; same structure for every card */
.slots .slot,.slots.one .slot{grid-template-columns:1fr;gap:22px;align-items:start}
.slots .slot>.stack{max-width:760px}
.slot .facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,170px),1fr));gap:0;padding:0;background:rgba(255,255,255,.08);border-radius:16px;overflow:hidden}
.slot.t-green .facts,.slot.t-blue .facts{background:rgba(0,0,0,.18)}
.slot .facts>div:not(.tiers){display:grid;gap:4px;padding:14px 18px;border:0;border-right:1px solid rgba(255,255,255,.12)}
.slot .facts>div:not(.tiers):last-of-type{border-right:0}
.slot .facts>div:not(.tiers) span{font-size:var(--fs-label);letter-spacing:.1em;text-transform:uppercase;opacity:.7}
.slot .facts>div:not(.tiers) b{text-align:left;margin-left:0;font-size:1.02rem}
.slot .facts .tiers{grid-column:1 / -1;margin:0;padding:14px 18px;border-top:1px solid rgba(255,255,255,.12);grid-template-columns:auto minmax(0,1fr) minmax(0,1.2fr);align-items:center;column-gap:18px}
.slot .facts .tiers ul{grid-template-columns:repeat(3,minmax(0,1fr))}
.slot .facts .tiers li{grid-template-columns:auto auto;align-items:baseline;gap:8px}
.slot .facts .tiers p{margin:0}
@media (max-width:900px){.slot .facts .tiers{grid-template-columns:1fr;row-gap:10px}.slot .facts .tiers li{grid-template-columns:1fr;gap:2px}}
@media (max-width:560px){.slot .facts>div:not(.tiers){border-right:0;border-bottom:1px solid rgba(255,255,255,.12)}}
.slot .facts{grid-template-columns:repeat(var(--n,4),minmax(0,1fr))}
.slot .facts .tiers{display:grid;grid-template-columns:1fr;row-gap:10px}
.slot .facts .tiers ul{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.slot .facts .tiers li{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:10px 14px}
.slot .facts .tiers li span{font-size:.82rem}
@media (max-width:900px){.slot .facts{grid-template-columns:repeat(2,minmax(0,1fr))}.slot .facts .tiers li{display:grid;gap:2px}}
@media (max-width:560px){.slot .facts{grid-template-columns:1fr}}
.slot .facts .tiers{padding:14px 18px 16px!important;border-top:1px solid rgba(255,255,255,.12)}
.slot>.actions{margin-top:2px}
.slot .snote{font-size:.84rem;opacity:.8;max-width:760px;margin:-6px 0 0}
/* teacher portraits: normalised 4:5, face-matched crops */
.tc-slide{grid-template-columns:minmax(200px,300px) minmax(0,1fr)}
.tc-photo img{aspect-ratio:4/5;object-position:50% 50%}
.tc-photo::before{height:72%}
.tc-th img{object-position:50% 30%}
@media (max-width:760px){.tc-slide{grid-template-columns:min(36%,140px) minmax(0,1fr)}.tc-photo img{aspect-ratio:4/5}}

/* ---- carousel arrows: small, quiet, icon-only ---- */
.arrows{gap:6px}
.arrows button{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--ink);display:grid;place-items:center;padding:0;font-size:0;transition:background-color .15s,border-color .15s,color .15s}
.arrows button svg{width:16px;height:16px}
.arrows button:hover{background:var(--ink);border-color:var(--ink);color:#fff}
.arrows button:active{background:var(--ink-h)}
.arrows button.off{visibility:visible;opacity:.35;pointer-events:none}
.gprog{height:3px;border-radius:2px;background:var(--line);margin-top:16px;overflow:hidden}
.gprog span{display:block;height:100%;width:0;background:var(--green);border-radius:2px;transition:width .3s ease}

/* ---- What's next: colours matched to each event poster ---- */
.slot.t-poster-blue{background:#0c2a96;
  background-image:repeating-linear-gradient(-20deg,transparent 0 90px,rgba(255,255,255,.04) 90px 150px)}
.slot.t-poster-blue::after{background:var(--gold)}
.slot.t-poster-blue::before{content:"π  ×  √  ÷";position:absolute;right:28px;top:38%;font:900 4.5rem/1 var(--font);letter-spacing:.2em;color:rgba(255,255,255,.07);pointer-events:none;white-space:nowrap}
.slot.t-poster-blue .facts{background:rgba(255,255,255,.1)}
.slot.t-poster-blue .tiers li{background:rgba(255,255,255,.12)}

.slot.t-poster-paper{background:#fff;color:var(--ink);box-shadow:0 0 0 1px var(--line)}
.slot.t-poster-paper::after{background:var(--green-2)}
.slot.t-poster-paper h2{color:var(--ink)}
.slot.t-poster-paper .eyebrow{color:var(--coral-d)}
.slot.t-poster-paper .sbody,.slot.t-poster-paper .snote{color:var(--ink-2);opacity:1}
.slot.t-poster-paper .facts{background:#fdf1d9;color:var(--ink);border-radius:12px;position:relative;overflow:visible;box-shadow:inset 0 0 0 1.5px #e9d3a6}
.slot.t-poster-paper .facts::before,.slot.t-poster-paper .facts::after{content:"";position:absolute;top:50%;width:18px;height:18px;margin-top:-9px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1.5px #e9d3a6}
.slot.t-poster-paper .facts::before{left:-9px;clip-path:inset(0 0 0 50%)} .slot.t-poster-paper .facts::after{right:-9px;clip-path:inset(0 50% 0 0)}
.slot.t-poster-paper .facts>div:not(.tiers){border-right:1.5px dashed #e3c891}
.slot.t-poster-paper .facts>div:not(.tiers):last-of-type{border-right:0}
.slot.t-poster-paper .facts>div span{color:var(--coral-d);opacity:1}
.slot.t-poster-paper .btn{background:var(--green);color:#fff} .slot.t-poster-paper .btn:hover{background:var(--green-h)}
.slot.t-poster-paper .arrow{color:var(--green)} .slot.t-poster-paper .arrow:hover{color:var(--green-h)}
@media (max-width:560px){.slot.t-poster-paper .facts>div:not(.tiers){border-right:0;border-bottom:1.5px dashed #e3c891}.slot.t-poster-blue::before{display:none}}
.slot.t-poster-blue .tiers li:last-child{background:var(--gold);color:var(--ink)}
.slot.t-poster-blue::before{top:64px;right:170px;font-size:3.6rem}
@media (max-width:1000px){.slot.t-poster-blue::before{display:none}}

/* =========================================================
   VISUAL SYSTEM v2 — colour lives on objects, not on grounds.
   Grounds: white + brand mist only, strictly alternating.
   ========================================================= */
:root{--mist:#eef6e8}
.hero,#programs,[data-module=gallery],[data-module=events],#growth{background:var(--mist)}
[data-module=whats_on],#assess,.band.wash:has([data-carousel]),[data-module=blog],#centre,#faq{background:#fff}
.band.sky{background:var(--mist)}
#centre{border-top:1px solid var(--line)}

/* campaign cards: one structure, poster colour only */
.slot.t-blue{background:#0c2a96;background-image:none}
.slot.t-blue::after{background:var(--gold)}
.slot.t-green{background:var(--green);background-image:none}
.slot.t-green::after{background:var(--gold)}
.slot::before{display:none!important}
.slot .facts,.slot.t-green .facts,.slot.t-blue .facts{background:rgba(255,255,255,.1);box-shadow:none}
.slot .facts>div:not(.tiers){border-right:1px solid rgba(255,255,255,.14)}
.slot .facts>div span{color:inherit;opacity:.7}
.slot .tiers li{background:rgba(255,255,255,.12)}
.slot .tiers li:last-child{background:var(--gold);color:var(--ink)}
.slot .eyebrow{color:var(--gold)}
.slot .btn{background:var(--gold);color:var(--ink)}
.slot .btn:hover{background:var(--gold-h)}
.slot .arrow{color:var(--gold)} .slot .arrow:hover{color:#fff}
.slot .sbody,.slot .snote{color:#fff;opacity:.85}

/* free assessment: white ground, brand green steps and path, gold star */
.as-eyebrow{color:var(--green)}
.as-rule{background:var(--gold)}
.as-steps li::before{background:var(--green)}
.nb-shadow{fill:var(--mist)}
.nb-page{stroke:var(--line)}
.nb-fold{stroke:var(--line)}
.nb-lines line{stroke:#e6ede1}
.nb-dots{stroke:var(--green)}
.nb-dot{fill:var(--green)}
.nb-ring{stroke:var(--green)}
.nb-label{fill:var(--green)}

/* teacher block on white: keep the card distinguishable */
.band.wash:has([data-carousel]) .tc-slide{background:var(--mist);box-shadow:none}
.band.wash:has([data-carousel]) .tc-th img{opacity:.6}

/* =========================================================
   BUTTON HIERARCHY
   1 Primary   solid green  — Book a free assessment, form submits, Talk to
   2 Secondary outline green — per-item actions in lists (Register, trial class), Contact us
   3 Tertiary  text + arrow  — Details, See all
   Exception: on coloured campaign cards the primary is solid gold (green on green/blue has no contrast)
   ========================================================= */
.btn[data-track="cta_book_assessment"],
form .btn[type=submit],
.news .btn{background:var(--green);color:#fff;box-shadow:none}
.btn[data-track="cta_book_assessment"]:hover,form .btn[type=submit]:hover,.news .btn:hover{background:var(--green-h)}
.btn[data-track="cta_book_assessment"]:active,form .btn[type=submit]:active,.news .btn:active{background:var(--green-a)}

.ev .btn,.btn[data-track="cta_trial_class"]{background:transparent;color:var(--green);box-shadow:inset 0 0 0 2px var(--green)}
.ev .btn:hover,.btn[data-track="cta_trial_class"]:hover{background:var(--green);color:#fff}
.ev .btn:active,.btn[data-track="cta_trial_class"]:active{background:var(--green-h);color:#fff}
.btn.ghost{color:var(--green);box-shadow:inset 0 0 0 2px var(--green)}
.btn.ghost:hover{background:var(--green);color:#fff;box-shadow:inset 0 0 0 2px var(--green)}

.slot .btn{background:var(--gold);color:var(--ink)}
.slot .btn:hover{background:var(--gold-h)}
footer.site .news .btn{background:var(--green-2)}
footer.site .news .btn:hover{background:var(--green)}

/* Free assessment block: keep the coral identity */
#assess{background:var(--coral-bg)}
.as-eyebrow{color:var(--coral-d)}
.as-rule{background:var(--coral-d)}
.as-steps li::before{background:var(--coral-d)}
.nb-shadow{fill:#f6d4cf}
.nb-page{stroke:#efc9c3}
.nb-fold{stroke:#efc9c3}
.nb-lines line{stroke:#f3dcd8}
.nb-dots{stroke:var(--coral-d)}
.nb-dot{fill:var(--coral-d)}
.nb-ring{stroke:var(--coral-d)}
.nb-label{fill:var(--coral-d)}
/* grounds after swapping programs / what's next */
#programs{background:#fff}
[data-module=whats_on]{background:var(--mist)}
#programs .svc{background:var(--mist);box-shadow:none}

/* =========================================================
   PROGRAM CAROUSEL — every program as a SuperKids-style card
   ========================================================= */
.prog.ink .top{background:var(--ink)} .prog.ink .top::after{background:#26314f} .prog.ink .top .eyebrow{color:var(--gold)}
.prog.coral .top{background:var(--coral-d)} .prog.coral .top::after{background:var(--coral)} .prog.coral .top .eyebrow{color:#fff;opacity:.85}
.prog.plum .top{background:#6b3d7a} .prog.plum .top::after{background:#834d95} .prog.plum .top .eyebrow{color:var(--gold)}
.ink .ticks li::before{background:var(--ink)} .coral .ticks li::before{background:var(--coral-d)} .plum .ticks li::before{background:#6b3d7a}
.prog .top .dash::before{background:var(--gold)}
.prog.gold .top .dash::before{background:#fff}

.pc{display:grid;gap:18px;grid-template-columns:minmax(0,1fr)}
.pc-track{display:flex!important;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding:4px 2px 8px;margin:0}
.pc-track::-webkit-scrollbar{display:none}
.pc-track .prog{flex:0 0 calc((100% - 40px) / 3);scroll-snap-align:start;min-height:100%}
.pc-track .prog .top{min-height:142px;align-content:end}
.pc-track .prog .body{flex:1}
@media (max-width:1000px){.pc-track .prog{flex-basis:calc((100% - 20px) / 2)}}
@media (max-width:700px){.pc-track{gap:12px;margin-inline:calc(-1 * var(--gut));padding-inline:var(--gut);scroll-padding-inline:var(--gut)}.pc-track .prog{flex-basis:84%}}
.pc-dots{display:flex;justify-content:center;gap:4px}
.pc-dots button{border:0;background:none;padding:8px 4px;cursor:pointer}
.pc-dots span{display:block;width:8px;height:8px;border-radius:4px;background:var(--line);transition:width .25s,background-color .25s;position:relative;overflow:hidden}
.pc-dots button.on span{width:28px;background:var(--green-mid)}
.pc-dots button.on span::after{content:"";position:absolute;inset:0;background:var(--green);transform-origin:left;transform:scaleX(0)}
.pc.playing .pc-dots button.on span::after{animation:pcfill var(--pcdur,4s) linear forwards}
@keyframes pcfill{to{transform:scaleX(1)}}
#programs .sec-head .arrows{align-self:end}
@media (max-width:700px){#programs .sec-head .arrows{display:none}}
/* grounds for order: hero / programs / assess / what's next / team / gallery / events / blog / visit / newsletter / faq */
[data-module=whats_on]{background:#fff}
.band.wash:has([data-carousel]){background:var(--mist)}
.band.wash:has([data-carousel]) .tc-slide{background:#fff;box-shadow:0 0 0 1px var(--line)}
[data-module=gallery]{background:#fff}
[data-module=events]{background:var(--mist)}

/* StarKid: a sky of small stars, every child can shine */
.prog.plum .top{background-color:#6b3d7a;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22220%22%20height%3D%22140%22%20viewBox%3D%220%200%20220%20140%22%3E%3Cpath%20transform%3D%22translate%2826%2030%29%20scale%280.9%29%22%20d%3D%22M0%20-10Q1.6%20-1.6%2010%200Q1.6%201.6%200%2010Q-1.6%201.6%20-10%200Q-1.6%20-1.6%200%20-10Z%22%20fill%3D%22%23f2b84b%22%20fill-opacity%3D%220.55%22/%3E%3Cpath%20transform%3D%22translate%2892%2018%29%20scale%280.45%29%22%20d%3D%22M0%20-10Q1.6%20-1.6%2010%200Q1.6%201.6%200%2010Q-1.6%201.6%20-10%200Q-1.6%20-1.6%200%20-10Z%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.5%22/%3E%3Cpath%20transform%3D%22translate%28150%2046%29%20scale%280.7%29%22%20d%3D%22M0%20-10Q1.6%20-1.6%2010%200Q1.6%201.6%200%2010Q-1.6%201.6%20-10%200Q-1.6%20-1.6%200%20-10Z%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.35%22/%3E%3Cpath%20transform%3D%22translate%28196%2022%29%20scale%281.1%29%22%20d%3D%22M0%20-10Q1.6%20-1.6%2010%200Q1.6%201.6%200%2010Q-1.6%201.6%20-10%200Q-1.6%20-1.6%200%20-10Z%22%20fill%3D%22%23f2b84b%22%20fill-opacity%3D%220.6%22/%3E%3Cpath%20transform%3D%22translate%2860%2082%29%20scale%280.5%29%22%20d%3D%22M0%20-10Q1.6%20-1.6%2010%200Q1.6%201.6%200%2010Q-1.6%201.6%20-10%200Q-1.6%20-1.6%200%20-10Z%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.35%22/%3E%3Cpath%20transform%3D%22translate%28122%20104%29%20scale%281%29%22%20d%3D%22M0%20-10Q1.6%20-1.6%2010%200Q1.6%201.6%200%2010Q-1.6%201.6%20-10%200Q-1.6%20-1.6%200%20-10Z%22%20fill%3D%22%23f2b84b%22%20fill-opacity%3D%220.5%22/%3E%3Cpath%20transform%3D%22translate%28184%2096%29%20scale%280.45%29%22%20d%3D%22M0%20-10Q1.6%20-1.6%2010%200Q1.6%201.6%200%2010Q-1.6%201.6%20-10%200Q-1.6%20-1.6%200%20-10Z%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.45%22/%3E%3Cpath%20transform%3D%22translate%2818%20118%29%20scale%280.55%29%22%20d%3D%22M0%20-10Q1.6%20-1.6%2010%200Q1.6%201.6%200%2010Q-1.6%201.6%20-10%200Q-1.6%20-1.6%200%20-10Z%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.35%22/%3E%3C/svg%3E");background-size:220px 140px;background-repeat:repeat;animation:skydrift 40s linear infinite}
@keyframes skydrift{to{background-position:220px 0}}
.prog.plum .top h3::after{content:"";display:inline-block;width:.55em;height:.55em;margin-left:.25em;vertical-align:.35em;background:var(--gold);
  clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%);animation:pinspin 7s linear infinite}
@media (prefers-reduced-motion:reduce){.prog.plum .top{animation:none}.prog.plum .top h3::after{animation:none}}

/* =========================================================
   EDUCATION LAYER — How we teach · Founder · Learning Hub
   Calmer, editorial: more white space, serif-free, no prices
   ========================================================= */
.approach{background:#fff}
.ap-head{max-width:720px}
.ap-head h2{font-size:clamp(2rem,3.6vw,3rem)}
.pillars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.pillar{display:grid;gap:10px;align-content:start;padding:28px 26px;border-radius:var(--r);background:var(--mist);position:relative}
.pillar h3{font-size:1.35rem}
.pillar p{color:var(--ink-2)}
.pl-mark{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;margin-bottom:6px}
.pl-mark .spark{width:22px;height:22px;fill:#fff;animation:pinspin 9s linear infinite}
.pillar.c-blue .pl-mark{background:var(--blue)} .pillar.c-gold .pl-mark{background:var(--gold)} .pillar.c-green .pl-mark{background:var(--green)}
.pillar.c-gold .pl-mark .spark{fill:var(--ink)}
@media (max-width:860px){.pillars{grid-template-columns:1fr}}
.ap-lesson{margin-top:28px;padding:28px;border-radius:var(--r);box-shadow:0 0 0 1px var(--line);display:grid;gap:18px}
.ap-lesson h3{font-size:1.15rem}
.lesson{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;counter-reset:ls}
.lesson li{counter-increment:ls;display:grid;gap:4px;padding-top:42px;position:relative}
.lesson li::before{content:counter(ls);position:absolute;top:0;left:0;width:30px;height:30px;border-radius:50%;background:var(--green-soft);color:var(--green);font-weight:900;display:grid;place-items:center;font-size:.9rem}
.lesson li::after{content:"";position:absolute;top:14px;left:40px;right:-8px;height:2px;background:var(--line)}
.lesson li:last-child::after{display:none}
.lesson span{color:var(--ink-2);font-size:.95rem}
@media (max-width:860px){.lesson{grid-template-columns:1fr 1fr}.lesson li::after{display:none}}
@media (max-width:480px){.lesson{grid-template-columns:1fr}}
.approach .actions{margin-top:24px}

.founder{background:var(--mist)}
.fd-grid{display:grid;grid-template-columns:minmax(220px,380px) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:center}
.fd-photo img,.fd-photo .ph-img{width:100%;border-radius:28px 8px 28px 8px}
.fd-copy{display:grid;gap:16px;min-width:0}
.fd-quote{margin:0;font-size:clamp(1.5rem,2.6vw,2.1rem);font-weight:800;line-height:1.25;letter-spacing:-.01em;color:var(--ink);position:relative;padding-left:22px;border-left:4px solid var(--gold)}
.fd-by{font-size:.95rem;color:var(--ink-2)}
.chapters{display:grid;gap:22px;margin-top:8px}
.chapters h3{font-size:1.2rem;margin-bottom:6px}
.chapters p{color:var(--ink-2)}
@media (max-width:760px){.fd-grid{grid-template-columns:1fr}.fd-photo{max-width:320px}}
.timeline{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:18px}
.timeline li{display:grid;gap:4px;padding-top:16px;border-top:3px solid var(--green)}
.timeline b{font-size:1.4rem;font-weight:900;color:var(--green)}

.hub{background:#fff}
.hub-topics{display:flex;gap:8px;flex-wrap:wrap;margin:-12px 0 22px}
.hub-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:24px;align-items:stretch}
.hub-feat{display:grid;gap:12px;align-content:start;text-decoration:none;padding:18px;border-radius:var(--r);box-shadow:0 0 0 1px var(--line);transition:box-shadow .15s}
.hub-feat:hover{box-shadow:0 0 0 2px var(--ink)}
.hub-img{aspect-ratio:16/9;border-radius:14px}
.hub-feat h3{font-size:1.5rem;line-height:1.2}
.hub-list{display:grid;gap:0;align-content:start}
.hub-row{display:grid;gap:6px;padding:18px 4px;border-top:1px solid var(--line);text-decoration:none;transition:background-color .15s}
.hub-row:first-child{border-top:0;padding-top:4px}
.hub-row:hover b{color:var(--green)}
.hub-row b{font-size:1.08rem;line-height:1.3}
@media (max-width:860px){.hub-grid{grid-template-columns:1fr}}
.cat-sec{margin-top:36px}
.cat-sec:first-of-type{margin-top:8px}
.cat-h{font-size:1.4rem;margin-bottom:16px}
.cat-row a.pill{text-decoration:none}

/* grounds for the new order */
#programs{background:#fff}
#approach{background:var(--mist)}
#approach .pillar{background:#fff}
#approach .ap-lesson{background:#fff;box-shadow:none}
[data-module=whats_on]{background:#fff}
.band.wash:has([data-carousel]){background:#fff}
.band.wash:has([data-carousel]) .tc-slide{background:var(--mist);box-shadow:none}
[data-module=blog]{background:var(--mist)}
[data-module=blog] .hub-feat{background:#fff;box-shadow:none}
[data-module=gallery]{background:#fff}
[data-module=events]{background:var(--mist)}
@media (max-width:1440px){.nav-cta .btn.ghost{display:none}}
@media (max-width:1200px) and (min-width:981px){.menu>li>a,.menu>li>button{padding:10px 8px;font-size:.92rem}.brand .w{display:none}}

/* ---- Our philosophy page ---- */
.story-head h1{max-width:18ch}
.ph-prose{max-width:760px;display:grid;gap:18px}
.ph-prose h2{font-size:clamp(1.6rem,2.6vw,2.1rem);margin-bottom:4px}
.ph-prose p{font-size:1.12rem;line-height:1.75;color:var(--ink);max-width:none}
.ph-prose p:first-of-type{font-size:1.3rem;line-height:1.6;font-weight:600}
.founder .fd-copy h2{font-size:clamp(1.7rem,3vw,2.4rem)}
.founder .fd-copy p{font-size:1.08rem;line-height:1.7;max-width:60ch}
.awaken{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.aw{display:grid;gap:10px;align-content:start;padding:28px;border-radius:var(--r);background:var(--mist);text-decoration:none;transition:box-shadow .15s}
.aw:hover{box-shadow:0 0 0 2px var(--ink)}
.aw h3{font-size:1.3rem}
.aw p{color:var(--ink-2);line-height:1.6}
.aw.c-green .pl-mark{background:var(--green)} .aw.c-gold .pl-mark{background:var(--gold)} .aw.c-blue .pl-mark{background:var(--blue)} .aw.c-plum .pl-mark{background:#6b3d7a}
.aw.c-gold .pl-mark .spark{fill:var(--ink)}
@media (max-width:760px){.awaken{grid-template-columns:1fr}}
.belief{background:var(--ink);color:#fff;text-align:center}
.belief .wrap{display:grid;justify-items:center;gap:20px;max-width:880px}
.belief-star .spark{width:44px;height:44px;fill:var(--gold);animation:pinspin 7s linear infinite}
.belief blockquote{margin:0;font-size:clamp(1.4rem,2.6vw,2rem);font-weight:800;line-height:1.35;letter-spacing:-.01em}
.belief-line{color:var(--gold);font-weight:700;max-width:none}
.belief .actions{justify-content:center}
.belief .arrow{color:#fff}
.belief .btn.green{background:var(--gold);color:var(--ink)}

/* ---- price disclosure: value first ---- */
.price.soft{font-size:1.02rem;font-weight:800}
.price.soft small{font-size:.74rem;max-width:22ch;line-height:1.3;margin-top:2px}
.page-jump{position:sticky;top:calc(env(safe-area-inset-top,0px) + 78px);z-index:20;background:#fff;border-bottom:1px solid var(--line)}
.page-jump .wrap{display:flex;gap:6px;overflow-x:auto;padding-block:10px;scrollbar-width:none}
.page-jump a{flex:none;padding:7px 14px;border-radius:999px;font-weight:700;font-size:.9rem;text-decoration:none;color:var(--ink-2)}
.page-jump a:hover{background:var(--mist);color:var(--ink)}
.page-jump .pj-price{color:var(--green);box-shadow:inset 0 0 0 1.5px var(--green)}
@media (max-width:560px){.page-jump{top:calc(env(safe-area-inset-top,0px) + 68px)}}
.day{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.day li{display:grid;gap:6px;align-content:start;padding:20px;border-radius:var(--r);background:var(--mist)}
.day b{font-size:1.5rem;font-weight:900;color:var(--green);font-variant-numeric:tabular-nums}
.day h3{font-size:1.1rem} .day p{color:var(--ink-2);font-size:.95rem}
@media (max-width:860px){.day{grid-template-columns:1fr 1fr}} @media (max-width:480px){.day{grid-template-columns:1fr}}
.mts{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,420px),1fr));gap:20px}
.mt{display:grid;grid-template-columns:120px minmax(0,1fr);gap:18px;align-items:start;background:#fff;border-radius:var(--r);padding:18px}
.mt img{width:120px;height:150px;object-fit:cover;border-radius:16px 4px 16px 4px}
.mt b{font-size:1.2rem;display:block} .mt span{font-size:.84rem;font-weight:700;color:var(--green);display:block;margin-bottom:6px}
.mt .arrow{margin-top:8px}
.vstack{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.vstack li{position:relative;padding-left:34px;font-weight:700;font-size:1.05rem}
.vstack li::before{content:"";position:absolute;left:0;top:.1em;width:22px;height:22px;border-radius:50%;background:var(--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3.2 3.2L15 7' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat}

/* hero CTA: the star breathes to draw the eye */
.hero .btn .spark{fill:var(--gold);width:1.1em;height:1.1em;animation:breathe 2.4s ease-in-out infinite;transform-origin:center;filter:drop-shadow(0 0 0 rgba(242,184,75,0))}
@keyframes breathe{0%,100%{transform:scale(.85);opacity:.8;filter:drop-shadow(0 0 0 rgba(242,184,75,0))}50%{transform:scale(1.25);opacity:1;filter:drop-shadow(0 0 6px rgba(242,184,75,.9))}}
.hero .btn:hover .spark{animation-duration:1.2s}
@media (prefers-reduced-motion:reduce){.hero .btn .spark{animation:none}}
.proof .pm.g{background:#fff;box-shadow:0 0 0 1px var(--line)}
.proof .pm.g svg{width:16px;height:16px}

/* program card skies: SuperKids flowers · Tutoring symbols · Brain Power lightning */
.prog.green .top{background-color:var(--green);background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22220%22%20height%3D%22140%22%20viewBox%3D%220%200%20220%20140%22%3E%3Cg%20transform%3D%22translate%2824%2028%29%20scale%281.1%29%22%20opacity%3D%220.55%22%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%280%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%2872%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28144%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28216%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28288%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20r%3D%222.8%22%20fill%3D%22%23f2b84b%22/%3E%3C/g%3E%3Cg%20transform%3D%22translate%2896%2020%29%20scale%280.6%29%22%20opacity%3D%220.45%22%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%280%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%2872%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28144%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28216%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28288%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20r%3D%222.8%22%20fill%3D%22%23f2b84b%22/%3E%3C/g%3E%3Cg%20transform%3D%22translate%28156%2048%29%20scale%280.9%29%22%20opacity%3D%220.4%22%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%280%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%2872%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28144%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28216%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28288%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20r%3D%222.8%22%20fill%3D%22%23f2b84b%22/%3E%3C/g%3E%3Cg%20transform%3D%22translate%28200%2018%29%20scale%281.2%29%22%20opacity%3D%220.6%22%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%280%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%2872%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28144%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28216%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28288%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20r%3D%222.8%22%20fill%3D%22%23f2b84b%22/%3E%3C/g%3E%3Cg%20transform%3D%22translate%2858%2086%29%20scale%280.7%29%22%20opacity%3D%220.35%22%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%280%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%2872%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28144%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28216%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28288%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20r%3D%222.8%22%20fill%3D%22%23f2b84b%22/%3E%3C/g%3E%3Cg%20transform%3D%22translate%28126%20108%29%20scale%281.1%29%22%20opacity%3D%220.5%22%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%280%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%2872%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28144%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28216%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28288%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20r%3D%222.8%22%20fill%3D%22%23f2b84b%22/%3E%3C/g%3E%3Cg%20transform%3D%22translate%28186%2098%29%20scale%280.6%29%22%20opacity%3D%220.4%22%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%280%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%2872%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28144%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28216%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28288%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20r%3D%222.8%22%20fill%3D%22%23f2b84b%22/%3E%3C/g%3E%3Cg%20transform%3D%22translate%2818%20120%29%20scale%280.7%29%22%20opacity%3D%220.35%22%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%280%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%2872%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28144%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28216%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28288%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20r%3D%222.8%22%20fill%3D%22%23f2b84b%22/%3E%3C/g%3E%3C/svg%3E");background-size:220px 140px;animation:skydrift 40s linear infinite}
.prog.blue .top{background-color:var(--blue);background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22220%22%20height%3D%22140%22%20viewBox%3D%220%200%20220%20140%22%3E%3Ctext%20x%3D%2222%22%20y%3D%2234%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2222%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.45%22%20text-anchor%3D%22middle%22%3E%2B%3C/text%3E%3Ctext%20x%3D%2280%22%20y%3D%2226%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2216%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.4%22%20text-anchor%3D%22middle%22%3EA%3C/text%3E%3Ctext%20x%3D%22140%22%20y%3D%2240%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2222%22%20fill%3D%22%23f2b84b%22%20fill-opacity%3D%220.45%22%20text-anchor%3D%22middle%22%3E%CF%80%3C/text%3E%3Ctext%20x%3D%22196%22%20y%3D%2230%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2220%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.45%22%20text-anchor%3D%22middle%22%3E%C3%B7%3C/text%3E%3Ctext%20x%3D%2250%22%20y%3D%2286%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2220%22%20fill%3D%22%23f2b84b%22%20fill-opacity%3D%220.4%22%20text-anchor%3D%22middle%22%3E%E2%88%9A%3C/text%3E%3Ctext%20x%3D%22108%22%20y%3D%2296%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2218%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.4%22%20text-anchor%3D%22middle%22%3E%C3%A9%3C/text%3E%3Ctext%20x%3D%22168%22%20y%3D%2292%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2222%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.45%22%20text-anchor%3D%22middle%22%3E%C3%97%3C/text%3E%3Ctext%20x%3D%2224%22%20y%3D%22128%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2218%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.35%22%20text-anchor%3D%22middle%22%3E%CE%A3%3C/text%3E%3Ctext%20x%3D%22130%22%20y%3D%22130%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2216%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.35%22%20text-anchor%3D%22middle%22%3Eb%3C/text%3E%3Ctext%20x%3D%22200%22%20y%3D%22128%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2220%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.4%22%20text-anchor%3D%22middle%22%3E%3D%3C/text%3E%3C/svg%3E");background-size:220px 140px;animation:skydrift 46s linear infinite reverse}
.prog.gold .top{background-color:var(--gold);background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22220%22%20height%3D%22140%22%20viewBox%3D%220%200%20220%20140%22%3E%3Cpath%20transform%3D%22translate%2826%2030%29%20scale%281.1%29%22%20d%3D%22M2%20-12%20L-6%202%20L0%202%20L-2%2012%20L6%20-2%20L0%20-2%20Z%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.55%22/%3E%3Cpath%20transform%3D%22translate%2892%2020%29%20scale%280.6%29%22%20d%3D%22M2%20-12%20L-6%202%20L0%202%20L-2%2012%20L6%20-2%20L0%20-2%20Z%22%20fill%3D%22%2316213f%22%20fill-opacity%3D%220.5%22/%3E%3Cpath%20transform%3D%22translate%28150%2046%29%20scale%280.9%29%22%20d%3D%22M2%20-12%20L-6%202%20L0%202%20L-2%2012%20L6%20-2%20L0%20-2%20Z%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.4%22/%3E%3Cpath%20transform%3D%22translate%28198%2022%29%20scale%281.2%29%22%20d%3D%22M2%20-12%20L-6%202%20L0%202%20L-2%2012%20L6%20-2%20L0%20-2%20Z%22%20fill%3D%22%2316213f%22%20fill-opacity%3D%220.5%22/%3E%3Cpath%20transform%3D%22translate%2858%2086%29%20scale%280.7%29%22%20d%3D%22M2%20-12%20L-6%202%20L0%202%20L-2%2012%20L6%20-2%20L0%20-2%20Z%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.4%22/%3E%3Cpath%20transform%3D%22translate%28124%20106%29%20scale%281.1%29%22%20d%3D%22M2%20-12%20L-6%202%20L0%202%20L-2%2012%20L6%20-2%20L0%20-2%20Z%22%20fill%3D%22%2316213f%22%20fill-opacity%3D%220.45%22/%3E%3Cpath%20transform%3D%22translate%28186%2096%29%20scale%280.6%29%22%20d%3D%22M2%20-12%20L-6%202%20L0%202%20L-2%2012%20L6%20-2%20L0%20-2%20Z%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.45%22/%3E%3Cpath%20transform%3D%22translate%2820%20120%29%20scale%280.7%29%22%20d%3D%22M2%20-12%20L-6%202%20L0%202%20L-2%2012%20L6%20-2%20L0%20-2%20Z%22%20fill%3D%22%2316213f%22%20fill-opacity%3D%220.35%22/%3E%3C/svg%3E");background-size:220px 140px;animation:skyrise 34s linear infinite}
@keyframes skyrise{to{background-position:0 -140px}}
.prog .top h3::after{content:"";display:inline-block;width:.6em;height:.6em;margin-left:.25em;vertical-align:.3em;background-size:contain;background-repeat:no-repeat;background-position:center}
.prog.green .top h3::after{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%22-12%20-12%2024%2024%22%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-6%22%20r%3D%224.4%22%20transform%3D%22rotate%280%29%22%20fill%3D%22%23f2b84b%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-6%22%20r%3D%224.4%22%20transform%3D%22rotate%2872%29%22%20fill%3D%22%23f2b84b%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-6%22%20r%3D%224.4%22%20transform%3D%22rotate%28144%29%22%20fill%3D%22%23f2b84b%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-6%22%20r%3D%224.4%22%20transform%3D%22rotate%28216%29%22%20fill%3D%22%23f2b84b%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-6%22%20r%3D%224.4%22%20transform%3D%22rotate%28288%29%22%20fill%3D%22%23f2b84b%22/%3E%3Ccircle%20r%3D%223.4%22%20fill%3D%22%23fff%22/%3E%3C/svg%3E");animation:pinspin 8s linear infinite}
.prog.blue .top h3::after{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M4%2020l1-5L16%204l4%204L9%2019z%22%20fill%3D%22%23f2b84b%22/%3E%3Cpath%20d%3D%22M14%206l4%204%22%20stroke%3D%22%230b2a96%22%20stroke-width%3D%221.6%22/%3E%3Cpath%20d%3D%22M4%2020l1-5%204%204z%22%20fill%3D%22%23fff%22/%3E%3C/svg%3E");animation:write 1.6s ease-in-out infinite}
.prog.gold .top h3::after{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%22-8%20-13%2016%2026%22%3E%3Cpath%20d%3D%22M2%20-12%20L-6%202%20L0%202%20L-2%2012%20L6%20-2%20L0%20-2%20Z%22%20fill%3D%22%2316213f%22/%3E%3C/svg%3E");width:.42em;animation:zap 1.8s ease-in-out infinite}
@keyframes write{0%,100%{transform:rotate(0) translate(0,0)}25%{transform:rotate(-10deg) translate(-1px,1px)}50%{transform:rotate(6deg) translate(2px,0)}75%{transform:rotate(-6deg) translate(0,1px)}}
@keyframes zap{0%,70%,100%{transform:scale(1);opacity:1}78%{transform:scale(1.35);opacity:.6}86%{transform:scale(.9);opacity:1}}
@media (prefers-reduced-motion:reduce){.prog .top,.prog .top h3::after{animation:none!important}}

/* Tutoring v2: calm graph paper; a few symbols fade in place. No movement across the card. */
.prog.blue .top{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2222%22%20height%3D%2222%22%3E%3Cpath%20d%3D%22M22%200H0V22%22%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-opacity%3D%22.09%22%20stroke-width%3D%221%22/%3E%3C/svg%3E");background-size:22px 22px;animation:none}
.prog.blue .top::before{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22320%22%20height%3D%22150%22%20viewBox%3D%220%200%20320%20150%22%3E%3Ctext%20x%3D%22250%22%20y%3D%2240%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2230%22%20fill%3D%22%23f2b84b%22%20fill-opacity%3D%220.35%22%20text-anchor%3D%22middle%22%3E%CF%80%3C/text%3E%3Ctext%20x%3D%22296%22%20y%3D%2296%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2224%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.3%22%20text-anchor%3D%22middle%22%3E%C3%B7%3C/text%3E%3Ctext%20x%3D%22205%22%20y%3D%22120%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2220%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.28%22%20text-anchor%3D%22middle%22%3EA%3C/text%3E%3Ctext%20x%3D%22150%22%20y%3D%2232%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2222%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.22%22%20text-anchor%3D%22middle%22%3E%E2%88%9A%3C/text%3E%3C/svg%3E") right top/320px 150px no-repeat;opacity:.5;animation:symfade 6s ease-in-out infinite;pointer-events:none;z-index:0}
@keyframes symfade{0%,100%{opacity:.35}50%{opacity:1}}
@media (prefers-reduced-motion:reduce){.prog.blue .top::before{animation:none;opacity:.7}}

.prog.blue .top::before{background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22200%22%20height%3D%22120%22%20viewBox%3D%220%200%20200%20120%22%3E%3Ctext%20x%3D%22168%22%20y%3D%2244%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2232%22%20fill%3D%22%23f2b84b%22%20fill-opacity%3D%220.5%22%20text-anchor%3D%22middle%22%3E%CF%80%3C/text%3E%3Ctext%20x%3D%22118%22%20y%3D%2230%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2222%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.35%22%20text-anchor%3D%22middle%22%3E%C3%B7%3C/text%3E%3Ctext%20x%3D%22186%22%20y%3D%2292%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2218%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.35%22%20text-anchor%3D%22middle%22%3EA%3C/text%3E%3Ctext%20x%3D%22132%22%20y%3D%2276%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2220%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.3%22%20text-anchor%3D%22middle%22%3E%E2%88%9A%3C/text%3E%3C/svg%3E") right 8px top 4px/200px 120px no-repeat}
.prog.blue .top::before{z-index:1}.prog.blue .top>*{z-index:2}

/* ===== Program skins v3: one calm system, card = page header =====
   static faint texture + a small cluster that fades in place (6s). Nothing travels. */
.prog.green .top,.phead.th-superkids{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2228%22%20height%3D%2228%22%20viewBox%3D%220%200%2028%2028%22%3E%3Ccircle%20cx%3D%2214%22%20cy%3D%2214%22%20r%3D%221.6%22%20fill%3D%22%23fff%22%20fill-opacity%3D%22.12%22/%3E%3C/svg%3E");background-repeat:repeat;animation:none!important}
.prog.green .top::before,.phead.th-superkids::before{content:"";position:absolute;pointer-events:none;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22200%22%20height%3D%22120%22%20viewBox%3D%220%200%20200%20120%22%3E%3Cg%20transform%3D%22translate%28168%2040%29%20scale%282.1%29%22%20opacity%3D%220.9%22%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%280%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%2872%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28144%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28216%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28288%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20r%3D%222.8%22%20fill%3D%22%23f2b84b%22/%3E%3C/g%3E%3Cg%20transform%3D%22translate%28122%2026%29%20scale%281.2%29%22%20opacity%3D%220.6%22%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%280%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%2872%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28144%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28216%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28288%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20r%3D%222.8%22%20fill%3D%22%23f2b84b%22/%3E%3C/g%3E%3Cg%20transform%3D%22translate%28186%2092%29%20scale%281.1%29%22%20opacity%3D%220.55%22%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%280%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%2872%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28144%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28216%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28288%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20r%3D%222.8%22%20fill%3D%22%23f2b84b%22/%3E%3C/g%3E%3Cg%20transform%3D%22translate%28134%2074%29%20scale%280.9%29%22%20opacity%3D%220.45%22%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%280%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%2872%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28144%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28216%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20cx%3D%220%22%20cy%3D%22-5%22%20r%3D%223.6%22%20transform%3D%22rotate%28288%29%22%20fill%3D%22%23fff%22/%3E%3Ccircle%20r%3D%222.8%22%20fill%3D%22%23f2b84b%22/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat;animation:symfade 6s ease-in-out infinite}
.prog.blue .top,.phead.th-tutoring{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2222%22%20height%3D%2222%22%20viewBox%3D%220%200%2022%2022%22%3E%3Cpath%20d%3D%22M22%200H0V22%22%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-opacity%3D%22.09%22/%3E%3C/svg%3E");background-repeat:repeat;animation:none!important}
.prog.blue .top::before,.phead.th-tutoring::before{content:"";position:absolute;pointer-events:none;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22200%22%20height%3D%22120%22%20viewBox%3D%220%200%20200%20120%22%3E%3Ctext%20x%3D%22168%22%20y%3D%2244%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2232%22%20fill%3D%22%23f2b84b%22%20fill-opacity%3D%220.5%22%20text-anchor%3D%22middle%22%3E%CF%80%3C/text%3E%3Ctext%20x%3D%22118%22%20y%3D%2230%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2222%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.35%22%20text-anchor%3D%22middle%22%3E%C3%B7%3C/text%3E%3Ctext%20x%3D%22186%22%20y%3D%2292%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2218%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.35%22%20text-anchor%3D%22middle%22%3EA%3C/text%3E%3Ctext%20x%3D%22132%22%20y%3D%2276%22%20font-family%3D%22Inter%2CArial%2Csans-serif%22%20font-weight%3D%22800%22%20font-size%3D%2220%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.3%22%20text-anchor%3D%22middle%22%3E%E2%88%9A%3C/text%3E%3C/svg%3E") center/contain no-repeat;animation:symfade 6s ease-in-out infinite}
.prog.gold .top,.phead.th-brainpower{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2226%22%20height%3D%2226%22%20viewBox%3D%220%200%2026%2026%22%3E%3Cpath%20d%3D%22M0%2026L26%200%22%20stroke%3D%22%2316213f%22%20stroke-opacity%3D%22.06%22%20stroke-width%3D%221.2%22/%3E%3C/svg%3E");background-repeat:repeat;animation:none!important}
.prog.gold .top::before,.phead.th-brainpower::before{content:"";position:absolute;pointer-events:none;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22200%22%20height%3D%22120%22%20viewBox%3D%220%200%20200%20120%22%3E%3Cpath%20transform%3D%22translate%28168%2042%29%20scale%282.2%29%22%20d%3D%22M2%20-12%20L-6%202%20L0%202%20L-2%2012%20L6%20-2%20L0%20-2%20Z%22%20fill%3D%22%2316213f%22%20fill-opacity%3D%220.75%22/%3E%3Cpath%20transform%3D%22translate%28124%2028%29%20scale%281.2%29%22%20d%3D%22M2%20-12%20L-6%202%20L0%202%20L-2%2012%20L6%20-2%20L0%20-2%20Z%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.5%22/%3E%3Cpath%20transform%3D%22translate%28186%2094%29%20scale%281.1%29%22%20d%3D%22M2%20-12%20L-6%202%20L0%202%20L-2%2012%20L6%20-2%20L0%20-2%20Z%22%20fill%3D%22%2316213f%22%20fill-opacity%3D%220.45%22/%3E%3Cpath%20transform%3D%22translate%28136%2078%29%20scale%280.9%29%22%20d%3D%22M2%20-12%20L-6%202%20L0%202%20L-2%2012%20L6%20-2%20L0%20-2%20Z%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.45%22/%3E%3C/svg%3E") center/contain no-repeat;animation:symfade 6s ease-in-out infinite}
.prog.plum .top,.phead.th-starkid{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2240%22%20height%3D%2240%22%20viewBox%3D%220%200%2040%2040%22%3E%3Ccircle%20cx%3D%228%22%20cy%3D%2210%22%20r%3D%221%22%20fill%3D%22%23fff%22%20fill-opacity%3D%22.25%22/%3E%3Ccircle%20cx%3D%2230%22%20cy%3D%2228%22%20r%3D%22.8%22%20fill%3D%22%23fff%22%20fill-opacity%3D%22.2%22/%3E%3C/svg%3E");background-repeat:repeat;animation:none!important}
.prog.plum .top::before,.phead.th-starkid::before{content:"";position:absolute;pointer-events:none;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22200%22%20height%3D%22120%22%20viewBox%3D%220%200%20200%20120%22%3E%3Cpath%20transform%3D%22translate%28168%2042%29%20scale%282.2%29%22%20d%3D%22M0%20-10Q1.6%20-1.6%2010%200Q1.6%201.6%200%2010Q-1.6%201.6%20-10%200Q-1.6%20-1.6%200%20-10Z%22%20fill%3D%22%23f2b84b%22%20fill-opacity%3D%220.9%22/%3E%3Cpath%20transform%3D%22translate%28122%2026%29%20scale%281%29%22%20d%3D%22M0%20-10Q1.6%20-1.6%2010%200Q1.6%201.6%200%2010Q-1.6%201.6%20-10%200Q-1.6%20-1.6%200%20-10Z%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.6%22/%3E%3Cpath%20transform%3D%22translate%28186%2094%29%20scale%281.1%29%22%20d%3D%22M0%20-10Q1.6%20-1.6%2010%200Q1.6%201.6%200%2010Q-1.6%201.6%20-10%200Q-1.6%20-1.6%200%20-10Z%22%20fill%3D%22%23fff%22%20fill-opacity%3D%220.6%22/%3E%3Cpath%20transform%3D%22translate%28134%2076%29%20scale%280.8%29%22%20d%3D%22M0%20-10Q1.6%20-1.6%2010%200Q1.6%201.6%200%2010Q-1.6%201.6%20-10%200Q-1.6%20-1.6%200%20-10Z%22%20fill%3D%22%23f2b84b%22%20fill-opacity%3D%220.6%22/%3E%3C/svg%3E") center/contain no-repeat;animation:symfade 6s ease-in-out infinite}

.prog .top::before{inset:4px 8px auto auto;width:200px;height:120px;z-index:1}
.prog .top>*{z-index:2}
.phead::before{right:max(4%, calc((100% - var(--wrap)) / 2 + 20px));top:50%;width:min(42vw,420px);height:min(25vw,252px);transform:translateY(-50%);z-index:1}
.phead .wrap{z-index:2}
.phead.th-superkids{background-color:var(--green)}
.phead.th-tutoring{background-color:var(--blue)}
.phead.th-brainpower{background-color:var(--gold)}
.phead.plum{background-color:#6b3d7a;color:#fff}
.phead.plum::after{background:#834d95}
.phead.plum .eyebrow{color:var(--gold)}
@media (max-width:700px){.phead::before{opacity:.5;width:220px;height:132px;top:auto;bottom:10px;transform:none}}
.prog .top h3::after{animation-duration:10s}
.prog.blue .top h3::after{animation:none}
.prog.gold .top h3::after{animation:none}
@media (prefers-reduced-motion:reduce){.prog .top::before,.phead::before{animation:none;opacity:.8}}
.prog .top::before{inset:auto 4px 2px auto;width:150px;height:90px}
.phead.gold .dash::before{background:var(--ink)}
.prog.blue .top::before,.prog.green .top::before,.prog.gold .top::before,.prog.plum .top::before{inset:auto 4px 2px auto;width:150px;height:90px;opacity:1}
/* ===== Brain Power page ===== */
.bp-why{max-width:760px;display:grid;gap:14px}
.bp-why p{font-size:1.15rem;line-height:1.6;margin:0}
.b368s{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.b368{background:#fff;border-radius:var(--r);padding:28px;display:grid;gap:16px;align-content:start;box-shadow:0 0 0 1px var(--line)}
.b368-n{display:flex;align-items:baseline;gap:12px}
.b368-n b{font-size:4.2rem;line-height:.85;font-weight:900;letter-spacing:-.04em}
.b368-n span{font-size:1.35rem;font-weight:800}
.b368.c-green .b368-n b{color:var(--green)} .b368.c-blue .b368-n b{color:var(--blue)} .b368.c-gold .b368-n b{color:#c98a12}
.b368 ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.b368 li{padding:6px 12px;border-radius:999px;font-size:.92rem;font-weight:600}
.b368.c-green li{background:var(--green-soft);color:var(--green)} .b368.c-blue li{background:var(--blue-soft);color:var(--blue)} .b368.c-gold li{background:var(--gold-soft);color:var(--gold-ink)}
.b368 p{margin:0;color:var(--ink-2);border-top:1px solid var(--line);padding-top:14px}
.bclasses{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.bclass{border-radius:var(--r);padding:24px;background:#fff;box-shadow:0 0 0 1px var(--line);display:flex;flex-direction:column;gap:12px}
.bclass h3{margin:0}
.bclass .muted{margin:0}
.bc-age{align-self:flex-start;font-size:.8rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-ink);background:var(--gold-soft);padding:5px 10px;border-radius:999px}
.bclass .ticks{flex:1}
.bc-fast{border-top:1px solid var(--line);padding-top:10px}
.bc-fast summary{cursor:pointer;font-weight:700;color:var(--blue);list-style:none;display:flex;align-items:center;gap:8px;min-height:32px}
.bc-fast summary::-webkit-details-marker{display:none}
.bc-fast summary::after{content:"+";font-size:1.2rem;line-height:1}
.bc-fast[open] summary::after{content:"–"}
.bc-fast p{margin:6px 0 0;font-size:.95rem;color:var(--ink-2)}
.bc-fee{font-weight:700;color:var(--ink)}
@media (max-width:1100px){.bclasses{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:820px){.b368s{grid-template-columns:1fr}}
@media (max-width:560px){.bclasses{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -20px;padding:4px 20px 8px}.bclass{flex:0 0 82%;scroll-snap-align:start}.b368-n b{font-size:3.4rem}}
.wrap.bp-why{max-width:var(--wrap)} .bp-why>*{max-width:760px}
.bclass .ticks{flex:0 0 auto;align-content:start} .bclass .bc-fast{margin-top:auto}
@media (max-width:560px){.bclasses{margin:0 calc(-1 * var(--gut,16px));padding:4px var(--gut,16px) 8px;scroll-padding-left:var(--gut,16px)}}
/* ===== StarKid page ===== */
.eyebrow.plum{color:#834d95}
.pill.plum{background:#f1e6f4;color:#6b3d7a}
.callout.plum{background:#f1e6f4} .callout.plum h3{color:#6b3d7a}
.sk-n{font-size:.85rem;font-weight:800;letter-spacing:.1em;color:#834d95}
.sk-offer h3{margin:0}
.sk-lead{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:48px;align-items:center}
.sk-lead img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:top;border-radius:var(--r)}
.sk-facts{margin:0;display:grid;gap:14px}
.sk-facts div{display:grid;grid-template-columns:130px 1fr;gap:16px;padding-top:14px;border-top:1px solid var(--line)}
.sk-facts dt{font-weight:800;color:#6b3d7a} .sk-facts dd{margin:0}
.plumband{background:#6b3d7a;color:#fff}
.plumband h2{color:#fff}
@media (max-width:760px){.sk-lead{grid-template-columns:1fr;gap:24px}.sk-lead img{max-width:280px}.sk-facts div{grid-template-columns:1fr;gap:4px}}
/* ===== Summer camps ===== */
.sc-facts{margin:0 0 22px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.sc-facts div{background:var(--green-soft);border-radius:var(--r);padding:18px 20px}
.sc-facts dt{font-size:.8rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--green)}
.sc-facts dd{margin:6px 0 0;font-weight:700;font-size:1.05rem}
.sc-daily{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;padding:16px 0 30px}
.sc-daily ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.sc-daily li{padding:7px 14px;border-radius:999px;box-shadow:inset 0 0 0 1.5px var(--line);font-weight:600;font-size:.92rem}
.sc-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px;margin-bottom:16px;border-top:1px solid var(--line);padding-top:26px}
.sc-head h3{margin:0}
.wks{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.wk{border-radius:var(--r);padding:20px;background:#fff;box-shadow:0 0 0 1px var(--line);display:flex;flex-direction:column;gap:8px;border-top:6px solid var(--c,var(--green))}
.wk h3{margin:0;font-size:1.08rem} .wk p{margin:0;font-size:.93rem}
.wk-d{font-size:.8rem;font-weight:800;color:var(--ink-2);letter-spacing:.04em}
.wk.c-blue{--c:var(--blue)} .wk.c-green{--c:var(--green)} .wk.c-coral{--c:var(--coral)} .wk.c-gold{--c:var(--gold)} .wk.c-plum{--c:#6b3d7a}
@media (max-width:1100px){.wks{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:700px){.sc-facts{grid-template-columns:1fr}.wks{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 calc(-1*var(--gut));padding:4px var(--gut) 8px;scroll-padding-left:var(--gut)}.wk{flex:0 0 72%;scroll-snap-align:start}}
@media (max-width:700px){.sc-facts{gap:8px}.sc-facts div{padding:12px 16px;display:flex;justify-content:space-between;align-items:baseline;gap:12px}.sc-facts dd{margin:0;text-align:right;font-size:.95rem}}
/* ===== Tutoring why + crosslink ===== */
.tw-n{font-size:.85rem;font-weight:800;letter-spacing:.1em;color:var(--blue)}
.tw-pt h3{margin:0}
.tx{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 24px;margin-top:28px;padding:22px 26px;border-radius:var(--r);background:var(--green-soft);text-decoration:none;color:var(--ink)}
.tx div{display:grid;gap:4px} .tx b{font-size:1.08rem} .tx div span{color:var(--ink-2)}
.tx:hover{box-shadow:inset 0 0 0 2px var(--green)}
.fd-photo img{height:auto;aspect-ratio:4/5;object-fit:cover;display:block}
/* founder: pillars inline */
.fd-train{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px}
.fd-train span{font-size:.85rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);margin-right:4px}
.fd-train b{padding:7px 14px;border-radius:999px;font-size:.95rem}
.fd-train b.c-blue{background:var(--blue-soft);color:var(--blue)} .fd-train b.c-gold{background:var(--gold-soft);color:var(--gold-ink)} .fd-train b.c-green{background:#fff;color:var(--green);box-shadow:inset 0 0 0 1.5px var(--green-mid)}
/* what's next: events under campaigns */
.wn-more{margin-top:22px}
.wn-more:empty{display:none}
/* ===== Home grounds v4 (after trimming): strict white / mist alternation ===== */
body[data-page="home"] #programs{background:#fff}
body[data-page="home"] [data-module=whats_on]{background:var(--mist)}
body[data-page="home"] .band.founder{background:#fff}
body[data-page="home"] .band.wash:has([data-carousel]){background:var(--mist)}
body[data-page="home"] .band.wash:has([data-carousel]) .tc-slide{background:#fff;box-shadow:0 0 0 1px var(--line)}
body[data-page="home"] [data-module=gallery]{background:#fff}
body[data-page="home"] #centre{background:var(--mist)}
body[data-page="home"] #growth{background:#fff}
body[data-page="home"] #faq{background:var(--mist)}
/* ===== Teachers page ===== */
.tcards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.tcard{display:grid;grid-template-columns:180px minmax(0,1fr);gap:22px;padding:22px;border-radius:var(--r);background:#fff;box-shadow:0 0 0 1px var(--line);scroll-margin-top:120px}
.tcard img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:top;border-radius:16px 6px 16px 6px}
.tc-b{display:flex;flex-direction:column;gap:8px;min-width:0}
.tc-roles{display:flex;flex-wrap:wrap;gap:6px}
.tc-roles .pill{background:var(--green-soft);color:var(--green)}
.tcard h3{margin:0;font-size:1.35rem} .tcard h3 small{font-weight:600;color:var(--ink-2);font-size:.85rem}
.tc-title{margin:0;font-weight:700;color:var(--green);font-size:.92rem}
.tcard dl{margin:4px 0 6px;display:grid;gap:8px}
.tcard dl div{display:grid;gap:2px}
.tcard dt{font-size:.75rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}
.tcard dd{margin:0;font-size:.94rem;line-height:1.5}
.tcard .arrow{margin-top:auto}
@media (max-width:980px){.tcards{grid-template-columns:1fr}}
@media (max-width:520px){.tcard{grid-template-columns:110px minmax(0,1fr);gap:16px;padding:16px}.tcard dl{grid-column:1/-1}}
/* ===== Button hierarchy v2: the ONLY solid primary site-wide is "Book a free assessment".
   Everything else is a secondary outline. Exception: gold buttons on coloured campaign cards. ===== */
.btn:not([data-track="cta_book_assessment"]):not([data-form="assessment"] .btn):not(.slot .btn):not(.ghost){background:transparent;color:var(--green);box-shadow:inset 0 0 0 2px var(--green)}
.btn:not([data-track="cta_book_assessment"]):not([data-form="assessment"] .btn):not(.slot .btn):not(.ghost):hover{background:var(--green-soft);color:var(--green);box-shadow:inset 0 0 0 2px var(--green)}
.btn:not([data-track="cta_book_assessment"]):not([data-form="assessment"] .btn):not(.slot .btn):not(.ghost):active{background:var(--green-mid)}
.btn.ghost{color:var(--green);box-shadow:inset 0 0 0 2px var(--green)}
.btn.ghost:hover{background:var(--green-soft);color:var(--green);box-shadow:inset 0 0 0 2px var(--green)}
[data-form="assessment"] .btn,[data-track="cta_book_assessment"].btn{background:var(--green);color:#fff;box-shadow:none}
/* on dark grounds the outline flips to light */
footer.site .btn:not([data-track="cta_book_assessment"]),.plumband .btn:not([data-track="cta_book_assessment"]),.navy .btn:not([data-track="cta_book_assessment"]){color:#fff;box-shadow:inset 0 0 0 2px rgba(255,255,255,.85);background:transparent}
footer.site .btn:not([data-track="cta_book_assessment"]):hover,.plumband .btn:not([data-track="cta_book_assessment"]):hover{background:rgba(255,255,255,.12);color:#fff}
.tc-mail svg{stroke:currentColor}
footer.site .btn:not([data-track="cta_book_assessment"]),.plumband .btn:not([data-track="cta_book_assessment"]),.navy .btn:not([data-track="cta_book_assessment"]){color:#fff!important;box-shadow:inset 0 0 0 2px rgba(255,255,255,.85)!important;background:transparent!important}
footer.site .btn:not([data-track="cta_book_assessment"]):hover,.plumband .btn:not([data-track="cta_book_assessment"]):hover,.navy .btn:not([data-track="cta_book_assessment"]):hover{background:rgba(255,255,255,.12)!important}
/* ===== Campaign cards v2: poster logic — value first, logistics last ===== */
.slot.v2{display:flex;flex-direction:column;gap:26px}
.slot.v2 h2{font-size:clamp(1.9rem,3.6vw,2.9rem);line-height:1.02;letter-spacing:-.02em;text-transform:none;max-width:22ch}
.slot.v2 h2 em{font-style:normal;color:var(--gold);display:block}
.sben{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.sben li{display:grid;gap:6px;align-content:start}
.sben i{font-style:normal;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:1.1rem;margin-bottom:6px;background:var(--gold);color:var(--ink)}
.sben li:nth-child(2) i{background:var(--coral);color:#fff} .sben li:nth-child(3) i{background:#8a4cc9;color:#fff}
.sben b{font-size:1.2rem;font-weight:900;line-height:1.15}
.sben span{opacity:.85;line-height:1.45}
.sinc{background:#fff;color:var(--ink);border-radius:16px;padding:18px 22px 20px}
.sinc>p{margin:0 0 10px;text-align:center;font-size:.8rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--coral-d,#c4513a)}
.sinc-g{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr))}
.sinc-g div{display:grid;justify-items:center;text-align:center;gap:4px;padding:4px 10px;border-right:1px solid var(--line)}
.sinc-g div:last-child{border-right:0}
.sinc-g b{font-size:clamp(1.8rem,3vw,2.5rem);font-weight:900;line-height:1;color:var(--blue);letter-spacing:-.02em}
.slot.t-green .sinc-g b{color:var(--green)}
.sinc-g span{font-size:.88rem;font-weight:600;color:var(--ink-2);line-height:1.3}
.swhen{margin:0;display:flex;flex-wrap:wrap;gap:6px 18px;font-weight:700}
.swhen span{white-space:nowrap} .swhen small{font-weight:600;opacity:.7;margin-right:4px}
.slot.v2 .tiers{background:rgba(255,255,255,.1);border-radius:14px;padding:16px 18px;margin:0}
.slot.v2 .actions{margin-top:0}
@media (max-width:760px){.sben{grid-template-columns:1fr;gap:16px}.sben li{grid-template-columns:40px 1fr;column-gap:14px}.sben i{grid-row:span 2;margin:0}.sinc-g{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:14px}.sinc-g div:nth-child(2n){border-right:0}.swhen span{white-space:normal}}
.slot.v2 .sinc,.slot.v2 .tiers{width:100%;max-width:none;box-sizing:border-box}
.slot.v2 .sinc>p{max-width:none;width:100%}
.slot.v2 .snote,.slot.v2 .sbody{max-width:70ch}
@media (max-width:760px){.slot.v2::after{width:84px!important;height:84px!important;top:-42px!important;right:-42px!important}.slot.v2 .eyebrow{padding-right:40px}}
/* "From" price, single line */
.pfrom{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.pfrom span{font-weight:700;opacity:.8}
.pfrom b{font-size:clamp(2rem,3.4vw,2.6rem);font-weight:900;letter-spacing:-.02em;color:var(--gold);line-height:1}
.pfrom p{flex-basis:100%;margin:2px 0 0;font-size:.92rem;opacity:.8}
.callout .pfrom b{color:var(--blue)} .callout .pfrom span,.callout .pfrom p{color:var(--ink-2);opacity:1}
/* campaign footer: price/note left, actions right */
.slot.v2 .sfoot{display:flex;align-items:center;justify-content:space-between;gap:18px 40px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.18);padding-top:22px}
.slot.v2 .sfoot-l{flex:1 1 360px;min-width:0;display:grid;gap:8px}
.slot.v2 .sfoot-l .snote{margin:0;font-size:.9rem}
.slot.v2 .sfoot .actions{flex:0 0 auto;margin:0;flex-direction:row-reverse;align-items:center;gap:22px}
@media (max-width:760px){.slot.v2 .sfoot .actions{flex-direction:row;width:100%}}
.tc-cta{justify-content:center;margin-top:8px}
.visit-cta{justify-content:center;align-items:center;margin-top:32px;gap:16px 26px}
/* newsletter: consent line + double opt-in confirmation */
.nl-consent{margin:6px 0 0;font-size:.85rem;color:var(--ink-2)}
footer.site .nl-consent{color:rgba(255,255,255,.65);flex-basis:100%}
.nl-done{display:grid;gap:4px;padding:16px 18px;border-radius:14px;background:var(--green-soft);color:var(--ink)}
.nl-done b{color:var(--green);font-size:1.1rem}
.nl-done[hidden]{display:none}
footer.site .nl-done{background:rgba(255,255,255,.1);color:#fff;flex-basis:100%} footer.site .nl-done b{color:var(--gold)}
form .ok.nl-done{display:grid;gap:4px;padding:16px 18px;border-radius:14px;background:var(--green-soft);font-weight:400}
form .ok.nl-done span{font-weight:500;color:var(--ink);font-size:.95rem;line-height:1.5}
form .ok.nl-done[hidden]{display:none}
footer.site form .ok.nl-done{background:rgba(255,255,255,.1)} footer.site form .ok.nl-done span{color:#fff}
/* Talk-to now lives inside each teacher card, under their facts */
.tc-info .tc-talk{align-self:flex-start;margin-top:6px;gap:8px}
.tc-info .tc-talk svg{width:18px;height:18px;stroke:currentColor}
@media (max-width:700px){.tc-info .tc-talk{align-self:stretch}}
.tc-info .tc-talk{justify-self:start;width:auto} @media (max-width:700px){.tc-info .tc-talk{justify-self:stretch;width:100%}}
/* ===== Secondary v3 (option D): brand leaf — white fill, fine green edge, leaf corners, one step smaller than primary ===== */
.btn:not([data-track="cta_book_assessment"]):not([data-form="assessment"] .btn):not(.slot .btn),
.btn.ghost{background:#fff;color:#1f5410;box-shadow:inset 0 0 0 1.5px var(--green);border-radius:23px 6px 23px 6px;min-height:46px;padding:0 22px;font-weight:700}
.btn.sm:not([data-track="cta_book_assessment"]):not([data-form="assessment"] .btn):not(.slot .btn){min-height:40px;padding:0 18px;border-radius:20px 5px 20px 5px}
.btn:not([data-track="cta_book_assessment"]):not([data-form="assessment"] .btn):not(.slot .btn):hover,
.btn.ghost:hover{background:var(--green-soft);color:#1f5410;box-shadow:inset 0 0 0 1.5px var(--green)}
.btn:not([data-track="cta_book_assessment"]):not([data-form="assessment"] .btn):not(.slot .btn):active{background:var(--green-mid)}
.btn:not([data-track="cta_book_assessment"]):not([data-form="assessment"] .btn):not(.slot .btn):focus-visible{border-radius:23px 6px 23px 6px}
/* dark grounds keep the leaf, flip to light */
footer.site .btn:not([data-track="cta_book_assessment"]),.plumband .btn:not([data-track="cta_book_assessment"]),.navy .btn:not([data-track="cta_book_assessment"]){border-radius:23px 6px 23px 6px!important;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.85)!important}
.fcols .sig span{white-space:nowrap} @media (max-width:1040px){.fcols .sig{padding-left:0}}
@media (max-width:1560px){.nav-cta .btn.ghost{display:none}} @media (max-width:1260px) and (min-width:981px){.menu>li>a,.menu>li>button{padding:10px 8px;font-size:.92rem}.brand .w{display:none}}
/* social: icon-only round buttons, no handles */
.follow{display:flex;align-items:center;justify-content:space-between;gap:18px 32px;flex-wrap:wrap}
.chan.icons{display:flex;gap:12px;grid-template-columns:none}
.chan.icons a{width:52px;height:52px;padding:0;border-radius:50%;justify-content:center;background:#fff;transition:transform .15s,background-color .15s}
.chan.icons a:hover{transform:translateY(-2px)}
.chan.icons img{width:26px;height:26px}
@media (max-width:640px){.chan.icons{grid-template-columns:none}}
/* growth: warm ground so it no longer echoes the green buttons; ties to the gold star */
.g-stage::before{background:var(--gold-soft)}
.growth::after{background:#f6e7c4}
.g-shadow{background:#ead39f}
/* benefits: number sits beside the title, not on its own row */
.sben li{grid-template-columns:32px minmax(0,1fr);column-gap:12px;row-gap:4px;align-items:start}
.sben i{grid-row:span 2;width:32px;height:32px;font-size:.95rem;margin:0}
.sben b{align-self:center;min-height:32px;display:flex;align-items:center}
/* Brain Power: each class gets its own age-tag colour */
#babies .bc-age{background:#fde3dc;color:#a8402a}
#toddlers .bc-age{background:var(--gold-soft);color:var(--gold-ink)}
#kids .bc-age{background:var(--blue-soft);color:var(--blue)}
#calligraphy .bc-age{background:#f1e6f4;color:#6b3d7a}
/* events page: campaigns first, then the Eventbrite list */
.ev-camps{margin-bottom:34px}
.ev-sub{margin:0 0 14px;font-size:1.25rem}
/* PA Day style campaign: content leads, numbers step back */
.slot.v2.story .sben{gap:14px}
.slot.v2.story .sben li{background:rgba(255,255,255,.1);border-radius:18px 6px 18px 6px;padding:20px 20px 22px;grid-template-columns:1fr;row-gap:8px}
.slot.v2.story .sben i{grid-row:auto;width:34px;height:34px;margin-bottom:4px}
.slot.v2.story .sben b{font-size:1.3rem;min-height:0}
.slot.v2.story .sben span{font-size:1rem}
/* growth: warm cream ground instead of white */
body[data-page="home"] #growth{background:#fbf5e6}
.g-stage::before{background:#f6e3b4}
.growth::after{background:#f0dcaa}
.g-shadow{background:#e3c88a}
/* ===== Learning Hub v2: a parent's exercise book ===== */
.hub2 .wrap{display:grid;gap:30px}
.hfeat{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);border-radius:28px 8px 28px 8px;overflow:hidden;text-decoration:none;color:#fff;background:var(--blue);min-height:320px}
.hfeat.c-gold{background:var(--gold);color:var(--ink)} .hfeat.c-green{background:var(--green)} .hfeat.c-coral{background:var(--coral)} .hfeat.c-plum{background:#6b3d7a}
.hf-copy{padding:clamp(28px,4vw,48px);display:flex;flex-direction:column;gap:14px;justify-content:center}
.hf-tag{font-size:.8rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
.hfeat.c-gold .hf-tag{color:var(--ink)}
.hfeat h2{margin:0;font-size:clamp(1.7rem,3.2vw,2.6rem);line-height:1.08;letter-spacing:-.02em;color:inherit}
.hfeat p{margin:0;opacity:.88;font-size:1.05rem;line-height:1.55;max-width:46ch}
.hf-meta{display:flex;gap:18px;align-items:center;font-weight:700;opacity:.9}
.hf-meta .ha{color:var(--gold);transition:transform .2s}
.hfeat:hover .hf-meta .ha{transform:translateX(4px)}
/* the art side: a ruled page with a giant question mark and the CSL spark */
.hf-art{position:relative;background:#fffdf6;background-image:repeating-linear-gradient(#fffdf6 0 31px,#cfdcf3 31px 32px);border-left:3px solid #f0a99a;display:grid;place-items:center;overflow:hidden}
.hf-q{font-size:clamp(9rem,16vw,14rem);font-weight:900;line-height:1;color:var(--blue);transform:rotate(-8deg);letter-spacing:-.05em}
.hfeat.c-gold .hf-q{color:var(--gold-ink)} .hfeat.c-green .hf-q{color:var(--green)}
.hf-art .spark{position:absolute;right:16%;top:16%;width:54px;height:54px;fill:var(--gold);animation:breathe 2.6s ease-in-out infinite}
/* topic filter */
.hub-filter{display:flex;flex-wrap:wrap;gap:8px}
.hub-filter button{display:inline-flex;align-items:center;gap:8px;border:0;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line);border-radius:999px;padding:9px 16px;font:700 .92rem var(--font);color:var(--ink);cursor:pointer;min-height:40px}
.hub-filter button i{width:10px;height:10px;border-radius:50%;background:var(--green)}
.hub-filter button.on{background:var(--ink);color:#fff;box-shadow:none}
/* ruled table of contents with a red margin line */
.hlist{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink);position:relative}
.hlist::before{content:"";position:absolute;left:64px;top:0;bottom:0;width:2px;background:#f0a99a;opacity:.7}
.hlist li{border-bottom:1px solid #cfdcf3}
.hlist li[hidden]{display:none}
.hlist a{display:grid;grid-template-columns:64px minmax(0,1fr) auto auto 28px;gap:10px 22px;align-items:center;padding:22px 6px 22px 0;text-decoration:none;color:var(--ink);transition:background-color .15s}
.hlist a:hover{background:#fbf8ee}
.hn{font-weight:900;font-size:1.4rem;color:#9aa3b8;text-align:center;letter-spacing:-.02em}
.ht{display:grid;gap:4px;padding-left:12px}
.ht b{font-size:1.18rem;line-height:1.3}
.ht small{color:var(--ink-2);font-size:.95rem;line-height:1.45}
.hc{font-size:.78rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:6px 10px;border-radius:999px;white-space:nowrap}
.hc.c-blue{background:var(--blue-soft);color:var(--blue)} .hc.c-gold{background:var(--gold-soft);color:var(--gold-ink)} .hc.c-green{background:var(--green-soft);color:var(--green)} .hc.c-coral{background:#fde3dc;color:#a8402a} .hc.c-plum{background:#f1e6f4;color:#6b3d7a}
.hub-filter i.c-blue{background:var(--blue)} .hub-filter i.c-gold{background:var(--gold)} .hub-filter i.c-coral{background:var(--coral)} .hub-filter i.c-plum{background:#6b3d7a}
.hm{font-size:.88rem;color:var(--ink-2);white-space:nowrap}
.ha{font-weight:800;color:var(--green);transition:transform .2s}
.hlist a:hover .ha{transform:translateX(4px)}
@media (max-width:820px){
  .hfeat{grid-template-columns:1fr}.hf-art{min-height:150px;border-left:0;border-top:3px solid #f0a99a}.hf-q{font-size:8rem}
  .hlist::before{left:40px}
  .hlist a{grid-template-columns:40px minmax(0,1fr) 20px;padding:18px 0}
  .hn{font-size:1.1rem}
  .ht{grid-column:2;grid-row:1}
  .hc,.hm{grid-column:2;justify-self:start;margin-left:12px}
  .hc{grid-row:2} .hm{grid-row:3}
  .ha{grid-column:3;grid-row:1}
}
/* ===== SuperKids weekly timetable ===== */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.tt-wrap{border-radius:20px 6px 20px 6px;overflow:hidden;box-shadow:0 0 0 1px var(--line)}
.tt{width:100%;border-collapse:collapse;table-layout:fixed;font-size:.98rem}
.tt thead th{background:var(--green);color:#fff;font-size:.8rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;padding:14px 10px}
.tt thead th:first-child{background:var(--ink);width:150px}
.tt tbody th{text-align:left;padding:16px 16px;background:#fff;border-top:1px solid var(--line);vertical-align:middle}
.tt tbody th b{display:block;font-size:1.02rem}
.tt tbody th span{display:block;font-size:.72rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2);margin-top:3px}
.tt td{padding:16px 10px;text-align:center;font-weight:700;border-top:1px solid var(--line);border-left:1px solid rgba(255,255,255,.7);line-height:1.3}
.tt tr.t-plain td{background:#f4f7f1;font-weight:600}
.tt tr.t-blue td{background:var(--blue-soft)} .tt tr.t-blue th span{color:var(--blue)}
.tt tr.t-gold td{background:var(--gold-soft)} .tt tr.t-gold th span{color:var(--gold-ink)}
.tt tr.t-pink td{background:#fce6ec} .tt tr.t-pink th span{color:#a03358}
.tt tr.t-green td{background:var(--green-soft);font-weight:600} .tt tr.t-green th span{color:var(--green)}
.tt-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;align-items:center;margin:14px 0 0;color:var(--ink-2);font-size:.95rem}
/* phones: each time block becomes a card; weekday cells become a labelled list */
@media (max-width:760px){
  .tt,.tt tbody,.tt tr,.tt th,.tt td{display:block;width:auto}
  .tt thead{display:none}
  .tt-wrap{box-shadow:none;border-radius:0;overflow:visible;display:grid;gap:10px}
  .tt tbody{display:grid;gap:10px}
  .tt tr{border-radius:16px 5px 16px 5px;overflow:hidden;box-shadow:0 0 0 1px var(--line)}
  .tt tbody th{border-top:0;display:flex;justify-content:space-between;align-items:baseline;padding:12px 14px}
  .tt tbody th span{margin:0}
  .tt td{border:0;text-align:left;padding:8px 14px;display:grid;grid-template-columns:44px 1fr;gap:10px;border-top:1px solid rgba(255,255,255,.8)}
  .tt td::before{content:attr(data-day);font-size:.75rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);align-self:center}
  .tt tr.all td{display:block;padding:12px 14px}
  .tt tr.all td::before{content:none}
}
/* newsletter: multi-select child ages */
.nl-ages{border:0;padding:0;margin:4px 0 2px;display:grid;gap:8px;min-width:0}
.nl-ages legend{font-size:.82rem;font-weight:700;margin-bottom:6px;padding:0}
.nl-ages .chips{gap:6px}
.nl-ages .chips label{padding:7px 12px;font-size:.86rem;background:#fff}

/* newsletter: inline error + welcome-back toast (Brevo double opt-in) */
.nl-err{margin:.5rem 0 0;padding:.6rem .85rem;border-radius:12px 4px 12px 4px;background:#fdecea;color:#8a2a1c;font-size:.9rem;line-height:1.45}
.site .news .nl-err{background:rgba(255,255,255,.12);color:#ffd9d2}
.sub-toast{position:fixed;z-index:90;left:0;right:0;margin:0 auto;width:fit-content;top:18px;transform:translateY(-160%);display:flex;align-items:center;gap:.8rem;max-width:min(560px,calc(100vw - 32px));padding:.85rem 1rem .85rem .9rem;background:#fff;color:#16213f;border:1.5px solid #2b6e17;border-radius:23px 6px 23px 6px;box-shadow:0 14px 40px rgba(22,33,63,.18);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.sub-toast.in{transform:translateY(0)}
.sub-toast p{margin:0;font-weight:600;line-height:1.4;font-size:.95rem}
.sub-toast .st-star{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#f2b84b;color:#16213f;font-size:1.05rem}
.sub-toast button{flex:none;border:0;background:none;font-size:1.4rem;line-height:1;color:#16213f;cursor:pointer;padding:.2rem .3rem}
@media (prefers-reduced-motion:reduce){.sub-toast{transition:none}}

/* =========================================================
   HOME HERO · PROMO WINDOW (brand block left, promos right)
   ========================================================= */
.hero.pw .wrap{grid-template-columns:5fr 7fr;gap:clamp(28px,4vw,56px);padding-block:clamp(32px,4vw,48px)}
.hero.pw .copy{position:relative;gap:20px}
.hero.pw h1 .pw-shine{color:var(--blue)}
.pw-stem{position:absolute;right:-6px;bottom:0;width:72px;height:120px;color:var(--green);opacity:.9;pointer-events:none}
.pw-window{display:grid;gap:14px;min-width:0}
.pw-slides{list-style:none;margin:0;padding:0;position:relative;height:clamp(400px,39vw,560px);border-radius:44px 12px 44px 12px;overflow:hidden;background:#dfe8d6;box-shadow:0 18px 44px -18px rgba(22,33,63,.28)}
.pw-slide{display:none;position:absolute;inset:0}
.pw-slide.on{display:block;animation:pwfade .5s ease}
.pw-slide picture{display:contents}
.pw-media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0}
.pw-bar{position:absolute;left:16px;right:16px;bottom:16px;display:flex;align-items:center;gap:18px;padding:12px 14px 12px 18px;border-radius:24px 6px 24px 6px;
  background:rgba(255,255,255,.66);-webkit-backdrop-filter:blur(16px) saturate(150%);backdrop-filter:blur(16px) saturate(150%);border:1px solid rgba(255,255,255,.55);box-shadow:0 8px 24px rgba(22,33,63,.12)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.pw-bar{background:rgba(255,255,255,.92)}}
.pw-bar::before{content:"";width:4px;align-self:stretch;border-radius:2px;background:var(--pw-c)}
.pw-txt{flex:1;min-width:0;display:grid;gap:2px}
.pw-status{font-size:.7rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--pw-t)}
.pw-title{margin:0;font-size:1.2rem;line-height:1.25;font-weight:900;letter-spacing:-.015em;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pw-title em{font-style:normal;color:var(--pw-hl)}
.pw-cta{flex-shrink:0}
.btn.gold{background:var(--gold);color:var(--ink)}
.pw-sound{position:absolute;right:16px;top:16px;width:44px;height:44px;border-radius:50%;border:0;display:grid;place-items:center;cursor:pointer;color:var(--ink);
  background:rgba(255,255,255,.7);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.pw-sound svg{width:20px;height:20px}.pw-sound svg+svg,.pw-sound[aria-pressed="true"] svg:first-child{display:none}.pw-sound[aria-pressed="true"] svg+svg{display:block}
.pw-tabs{list-style:none;margin:0;padding:0;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:14px}
.pw-tabs li[hidden]{display:none}
.pw-tab{all:unset;box-sizing:border-box;display:grid;gap:10px;width:100%;cursor:pointer;padding:2px 0 6px}
.pw-tab:focus-visible{outline:2px solid var(--green);outline-offset:4px;border-radius:4px}
.pw-prog{display:block;height:4px;border-radius:2px;background:#cfdcc4;overflow:hidden}
.pw-prog i{display:block;height:100%;width:0;background:var(--green)}
.pw-tab.on .pw-prog i{width:100%}
.pw-window.playing .pw-tab.on .pw-prog i{width:0;animation:pwfill var(--pw-dur,6s) linear forwards}
.pw-window.playing.hold .pw-tab.on .pw-prog i{animation-play-state:paused}
.pw-tl{font-size:.95rem;font-weight:800;color:var(--ink-2);line-height:1.3}
.pw-tl b{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);margin-right:6px}
.pw-tab.on .pw-tl{color:var(--ink)}.pw-tab.on .pw-tl b{color:var(--green)}
@keyframes pwfill{from{width:0}to{width:100%}}
@keyframes pwfade{from{opacity:.3}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.pw-slide.on{animation:none}}

@media (max-width:980px){
  .hero.pw .wrap{grid-template-columns:1fr;padding-block:16px 40px}
  .pw-window{order:-1}
  .pw-stem{display:none}
}
@media (max-width:700px){
  .pw-slides{height:auto;border-radius:30px 8px 30px 8px;overflow:visible;background:none;box-shadow:none}
  .pw-slide{position:relative;inset:auto}
  .pw-slide.on{display:block}
  .pw-slide .pw-media{position:relative;display:block;aspect-ratio:16/10;height:auto;border-radius:30px 8px 0 0}
  .pw-bar{position:relative;left:auto;right:auto;bottom:auto;flex-wrap:wrap;gap:12px;padding:16px 16px 16px 18px;border-radius:0 0 30px 8px;background:#fff;
    -webkit-backdrop-filter:none;backdrop-filter:none;border:0;box-shadow:0 10px 28px -12px rgba(22,33,63,.2)}
  .pw-bar::before{position:absolute;left:0;top:0;right:0;width:auto;height:4px;border-radius:0}
  .pw-title{white-space:normal;font-size:1.15rem}
  .pw-cta{width:100%;justify-content:center}
  .pw-tabs{grid-auto-flow:column;grid-auto-columns:auto;justify-content:center;gap:8px}
  .pw-tab{width:auto;padding:8px 0}
  .pw-tl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .pw-prog{width:10px;height:10px;border-radius:5px}
  .pw-tab.on .pw-prog{width:30px}
}
/* promo window: CTA colours win over the global secondary-button rule (gold = campaign exception, green = free assessment) */
.pw .btn.pw-cta.gold{background:var(--gold)!important;color:var(--ink)!important;box-shadow:none!important}
.pw .btn.pw-cta.gold:hover{background:#e9a92f!important}
.pw .btn.pw-cta.green{background:var(--green)!important;color:#fff!important;box-shadow:none!important}
.pw .btn.pw-cta{border-radius:23px 6px 23px 6px}
.pw-title{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.hero.pw h1{font-size:clamp(2.6rem,5vw,4.6rem)}
.hero.pw h1 .pw-shine{position:relative;display:inline-block}
.pw-twinkle{position:absolute;right:-.52em;top:-.18em;width:.46em;height:.46em;fill:var(--gold)}
@media (prefers-reduced-motion:no-preference){.pw-twinkle{animation:pwtw 3.2s ease-in-out infinite}}
@keyframes pwtw{0%,100%{transform:scale(1) rotate(0)}50%{transform:scale(.72) rotate(45deg)}}
/* promo window v2: stage wrapper, posters, lighter glass, height fits the first screen */
@media (min-width:981px){.hero.pw .wrap{grid-template-columns:minmax(0,4.2fr) minmax(0,7.8fr);align-items:center}}
@media (min-width:701px){.pw-slides{height:clamp(360px,min(38vw,calc(100vh - 330px)),540px)}}
.pw-stage{position:absolute;inset:0;overflow:hidden}
.pw-stage picture{display:contents}
.pw-backdrop{transform:scale(1.04)}
.pw-poster{position:absolute;left:50%;top:18px;bottom:98px;height:calc(100% - 116px);width:auto;max-width:calc(100% - 36px);transform:translateX(-50%);object-fit:contain;border-radius:10px;box-shadow:0 18px 40px -12px rgba(22,33,63,.45)}
.pw-bar{background:rgba(255,255,255,.44);-webkit-backdrop-filter:blur(20px) saturate(170%);backdrop-filter:blur(20px) saturate(170%);border-color:rgba(255,255,255,.5)}
.pw-title{text-shadow:0 1px 0 rgba(255,255,255,.35)}
@media (max-width:700px){
  .pw-slide .pw-media{position:absolute;inset:0;aspect-ratio:auto;height:100%;border-radius:0}
  .pw-stage{position:relative;inset:auto;aspect-ratio:16/9;border-radius:30px 8px 0 0}
  .pw-stage.poster{aspect-ratio:1/1}
  .pw-poster{top:14px;bottom:14px;height:calc(100% - 28px)}
  .pw-slides{height:auto}
  .pw-bar{background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none}
}
@media (min-width:701px){.pw-slides{height:auto;aspect-ratio:16/9}}
.pw-link{display:block;position:absolute;inset:0;color:inherit}
.pw-link:focus-visible{outline:3px solid var(--gold);outline-offset:-6px}
@media (max-width:700px){.pw-link{position:relative;inset:auto}}


/* hero: keep brand | promo side by side on tablets; stack only on phones */
@media (min-width:701px) and (max-width:980px){
  .hero.pw .wrap{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:24px;padding-block:28px 36px;align-items:center}
  .pw-window{order:0}
  .hero.pw h1{font-size:clamp(2.2rem,5.2vw,3rem)}
  .hero.pw .lead{font-size:1rem}
  .pw-title{font-size:1rem}
  .pw-bar{gap:12px;padding:10px 10px 10px 14px}
  .pw-cta{padding-inline:14px}
  .pw-tl{font-size:.82rem}.pw-tl b{display:block;margin:0 0 2px}
}
.pw-year{justify-self:start;font-size:.95rem}
@media (max-width:700px){.pw-year{justify-self:center}}

/* topbar: Ask a question · phone */
.topbar .tb-r{display:flex;align-items:center;gap:10px}
.topbar .tb-r span{opacity:.6}

/* local SEO strip under Visit us / on Contact */
.area-strip{margin-top:28px;padding:22px 24px;border-radius:24px 6px 24px 6px;background:var(--green-soft);display:grid;gap:12px}
.area-strip h3{font-size:1.05rem;margin:0}
.area-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.area-chips li{background:#fff;border-radius:999px;padding:6px 14px;font-size:.88rem;font-weight:700;color:var(--ink);box-shadow:0 0 0 1px var(--line)}
.area-strip p{margin:0}

/* school year at a glance */
.year-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.ym{background:#fff;border-radius:18px 5px 18px 5px;padding:16px 16px 14px;display:grid;gap:10px;align-content:start;box-shadow:0 0 0 1px var(--line)}
.ym h3{margin:0;font-size:1.25rem;font-weight:900;color:var(--ink)}
.ym h3 small{font-size:.75rem;font-weight:700;color:var(--ink-2);margin-left:4px}
.ym ul{list-style:none;margin:0;padding:0;display:grid;gap:5px}
.ym-school li{font-size:.84rem;line-height:1.35;color:var(--ink-2);padding-left:14px;position:relative}
.ym-school li::before{content:"";position:absolute;left:0;top:.5em;width:6px;height:6px;border-radius:50%;background:#b9c2cf}
.ym-csl{border-top:1.5px dashed var(--line);padding-top:8px!important}
.ym-csl a{display:block;font-size:.86rem;font-weight:800;line-height:1.3;text-decoration:none;color:var(--ink);padding-left:14px;position:relative}
.ym-csl a::before{content:"";position:absolute;left:0;top:.35em;width:8px;height:8px;border-radius:4px 1px 4px 1px;background:var(--c)}
.ym-csl a:hover{color:var(--green)}
.ym-key{display:flex;align-items:center;gap:8px;margin-top:14px}
.ym-key .k1{width:8px;height:8px;border-radius:50%;background:#b9c2cf}.ym-key .k2{width:10px;height:10px;border-radius:5px 1px 5px 1px;background:var(--green);margin-left:10px}
@media (max-width:560px){.year-grid{grid-template-columns:1fr 1fr}.ym{padding:12px}}
.area-strip{background:#fff;box-shadow:0 0 0 1px var(--line)}
.area-chips li{background:var(--green-soft);box-shadow:none}
@media (min-width:701px) and (max-width:980px){.pw-status{display:none}}
/* founder: copy left, photo right (desktop); photo stays on top on phones */
@media (min-width:761px){.fd-grid{grid-template-columns:minmax(0,1fr) minmax(220px,380px)}.fd-photo{order:2}}
.area-strip p,.area-strip .muted{max-width:none!important}
.hero.pw .pw-twinkle{right:-.36em;top:.02em;width:.38em;height:.38em}
/* reviews box: proudly local badge */
.local-badge{display:flex;gap:12px;align-items:center;margin-top:4px;padding:12px 14px;border-radius:16px 4px 16px 4px;background:#fff4f2;border:1px solid #f6d3cd}
.lb-leaf{flex:none;width:40px;height:40px;border-radius:50%;background:#d52b1e;color:#fff;display:grid;place-items:center}
.lb-leaf svg{width:24px;height:24px}
.local-badge b{display:block;font-size:.95rem;color:var(--ink)}
.local-badge small{display:block;font-size:.84rem;line-height:1.4;color:var(--ink-2)}
.cal-src{font-size:1rem;margin:28px 0 12px}
.area-chips li{background:var(--blue-soft)!important;color:var(--blue)}
/* newsletter: what you'll get (fills the column, sells the signup) */
.g-perks{list-style:none;margin:4px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.g-perks li{background:#fff;border-radius:16px 4px 16px 4px;padding:12px 14px 12px 34px;position:relative;box-shadow:0 0 0 1px var(--line)}
.g-perks li::before{content:"";position:absolute;left:14px;top:16px;width:11px;height:11px;border-radius:6px 1px 6px 1px;background:var(--c)}
.g-perks b{display:block;font-size:.95rem;color:var(--ink);line-height:1.3}
.g-perks span{display:block;font-size:.82rem;color:var(--ink-2);line-height:1.35;margin-top:2px}
.g-freq{margin:-4px 0 0}
#growth{padding-top:clamp(40px,5vw,64px)}
@media (max-width:420px){.g-perks{grid-template-columns:1fr}}

/* newsletter v5: services laid across the full width; form left, growth illustration right (original size) */
@media (min-width:861px){
  #growth .wrap{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);grid-template-rows:auto auto auto auto 1fr;row-gap:14px;align-items:start}
  #growth .g-copy{display:contents}
  #growth .g-copy>.eyebrow{grid-column:1 / -1;grid-row:1}
  #growth .g-copy>h2{grid-column:1 / -1;grid-row:2;margin:0}
  #growth .g-perks{grid-column:1 / -1;grid-row:3;grid-template-columns:repeat(4,minmax(0,1fr));margin:10px 0 6px}
  #growth .g-freq{grid-column:1;grid-row:4;margin:0}
  #growth .g-copy>form{grid-column:1;grid-row:5;align-self:start;margin-top:8px}
  #growth .g-stage{grid-column:2;grid-row:4 / span 2;align-self:end}
}

/* promo window: fixed height on phones — all slides share one grid cell, so the box is as tall as the tallest slide and never jumps */
@media (max-width:700px){
  .pw-slides{display:grid}
  .pw-slide{display:flex!important;flex-direction:column;grid-area:1 / 1;visibility:hidden;opacity:0;animation:none}
  .pw-slide.on{visibility:visible;opacity:1;transition:opacity .45s ease}
  .pw-slide .pw-link{flex:none}
  .pw-stage.poster{aspect-ratio:16/9}
  .pw-bar{flex:1;align-content:flex-start}
}

/* newsletter Subscribe = primary (marketing priority): solid green pill, same as Book a free assessment */
form[data-form="newsletter"] .btn[type=submit]{background:var(--green)!important;color:#fff!important;box-shadow:none!important;border-radius:999px!important;min-height:52px;padding:0 28px;font-weight:800}
form[data-form="newsletter"] .btn[type=submit]:hover{background:var(--green-h)!important;color:#fff!important}
form[data-form="newsletter"] .btn[type=submit]:active{background:#1f5410!important}

/* newsletter perks v2: light checklist — leaf icon + one line, no card borders */
.g-perks{display:flex;flex-wrap:wrap;gap:8px 28px;margin:6px 0 0}
.g-perks li{background:none;box-shadow:none;border-radius:0;padding:0 0 0 22px;display:flex;align-items:center;min-height:24px}
.g-perks li::before{left:0;top:50%;transform:translateY(-50%);width:12px;height:12px}
.g-perks b{font-size:1rem;font-weight:700}
@media (min-width:861px){#growth .g-perks{display:flex;margin:4px 0 10px}}
@media (max-width:420px){.g-perks{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px}.g-perks b{font-size:.92rem}}

/* proudly-local badge moved to the top-right of the Visit us section */
.centre-head{align-items:flex-end}
.centre-head .local-badge{margin:0;max-width:340px;transform:rotate(-1.5deg);box-shadow:0 10px 24px -14px rgba(213,43,30,.45)}
.g-ask{font-size:.86rem;color:var(--ink-2);margin:2px 0 0}
@media (max-width:700px){.centre-head .local-badge{transform:none;max-width:none}}

/* responsive pass (Nov 5): keep the glass bar short on small laptops/tablets so it never covers the banner art */
@media (min-width:701px) and (max-width:1180px){
  .pw-status{display:none}
  .pw-bar{padding:10px 10px 10px 14px;gap:12px}
  .pw-title{font-size:.95rem;line-height:1.3;-webkit-line-clamp:3}
  .pw .btn.pw-cta{min-height:42px;padding:0 16px;font-size:.9rem;white-space:nowrap}
}
/* newsletter perks: 2×2 on tablets so no single item is orphaned */
@media (min-width:421px) and (max-width:1000px){.g-perks,#growth .g-perks{display:grid;grid-template-columns:repeat(2,max-content);gap:10px 28px}}

/* multilingual hook: switcher shows only when 2+ languages are enabled in content.json */
.lang-sw{display:inline-flex;gap:2px;margin-right:10px;padding-right:10px;border-right:1px solid currentColor;border-color:color-mix(in srgb,currentColor 30%,transparent)}
.lang-sw a{padding:0 6px;text-decoration:none;opacity:.75}
.lang-sw a[aria-current]{opacity:1;font-weight:700}
[dir=rtl] .wrap{direction:rtl}

/* Brain Power video: click-to-play poster (player loads only on click) */
.m-head.has-video{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center;margin-bottom:clamp(24px,3vw,40px)}
.m-head.has-video .sec-head{margin:0}
@media (max-width:860px){.m-head.has-video{grid-template-columns:minmax(0,1fr)}}
.ytv{position:relative;display:block;margin:0;aspect-ratio:16/9;max-width:100%;border-radius:28px 8px 28px 8px;overflow:hidden;color:#fff;background:#16213f;box-shadow:0 18px 40px -22px rgba(22,33,63,.55)}
.ytv video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.ytv.playing video{object-fit:contain;background:#000}
.ytv-btn{position:absolute;inset:0;border:0;padding:0;background:linear-gradient(to top,rgba(22,33,63,.8),rgba(22,33,63,0) 50%);color:#fff;cursor:pointer;font:inherit;text-align:left}
.ytv.playing .ytv-btn{display:none}
.ytv-play{position:absolute;z-index:1;left:50%;top:44%;width:76px;height:76px;margin:-38px 0 0 -38px;border-radius:50%;background:var(--gold);color:var(--ink);display:grid;place-items:center;transition:transform .2s;box-shadow:0 0 0 10px rgba(242,184,75,.28)}
.ytv-play svg{width:34px;height:34px;margin-left:4px}
.ytv-btn:hover .ytv-play,.ytv-btn:focus-visible .ytv-play{transform:scale(1.08)}
.ytv-cap{position:absolute;z-index:1;left:22px;right:22px;bottom:18px;display:grid;gap:2px}
.ytv-cap b{font-size:1.15rem;letter-spacing:-.01em}
.ytv-cap small{font-size:.86rem;opacity:.85}
.yt-modal video{position:absolute;inset:0;width:100%;height:100%;background:#000}
.pc-watch{position:relative;z-index:3;border:0;cursor:pointer;font-family:inherit;width:max-content;display:inline-flex;align-items:center;gap:8px;margin-top:14px;padding:7px 14px 7px 8px;border-radius:99px;background:var(--gold-soft,#fdf1d8);color:var(--ink);font-size:.86rem;font-weight:700;text-decoration:none}
.pc-watch svg{width:16px;height:16px;padding:3px;border-radius:50%;background:var(--gold);box-sizing:content-box}
.pc-watch:hover{background:var(--gold)}
.yt-modal{position:fixed;inset:0;z-index:200;background:rgba(10,16,30,.82);display:grid;place-items:center;padding:max(16px,env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) max(16px,env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
.yt-modal .box{position:relative;width:min(960px,100%);aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:#000}
.yt-modal .x{position:absolute;top:max(14px,env(safe-area-inset-top,0px));right:max(14px,env(safe-area-inset-right,0px));width:44px;height:44px;border-radius:50%;border:0;background:#fff;color:var(--ink);font-size:22px;cursor:pointer}
/* the poster already carries the title: keep the overlay small, bottom-left */
.ytv-btn{background:linear-gradient(to top,rgba(22,33,63,.55),rgba(22,33,63,0) 32%)}
.ytv-play{left:20px;top:auto;bottom:16px;margin:0;width:56px;height:56px;box-shadow:0 0 0 7px rgba(242,184,75,.3)}
.ytv-play svg{width:26px;height:26px}
.ytv-cap{left:92px;bottom:24px;right:20px}
.ytv-cap b{display:none}
.ytv-cap small{font-size:.9rem;font-weight:600;opacity:1;text-shadow:0 1px 2px rgba(0,0,0,.4)}
.ytv-btn{background:linear-gradient(to top,rgba(22,33,63,.72),rgba(22,33,63,0) 38%)}
@media (max-width:560px){.ytv-cap{display:none}.ytv-play{left:14px;bottom:12px;width:48px;height:48px}}

/* ===== Site-wide card interaction (Nov 6): every clickable card lifts; no outline on hover or press.
   Rest: hairline. Hover: rise 4px + soft shadow. Press: settle back 2px. Keyboard focus keeps its visible ring. ===== */
:root{--lift-shadow:0 0 0 1px var(--line),0 18px 36px -20px rgba(22,33,63,.38);--rest-shadow:0 0 0 1px var(--line)}
.prog,.mini,.post-card a,.map-card,.hub-feat,.aw,.tx{transition:transform .22s cubic-bezier(.2,.7,.3,1),box-shadow .22s ease!important}
@media (hover:hover){
  .prog:hover,.mini:hover,.post-card a:hover,.map-card:hover,.hub-feat:hover,.aw:hover,.tx:hover{transform:translateY(-4px)!important;box-shadow:var(--lift-shadow)!important}
  .prog:hover .top::after{transform:none}
}
.prog:active,.mini:active,.post-card a:active,.map-card:active,.hub-feat:active,.aw:active,.tx:active{transform:translateY(-2px)!important;box-shadow:0 0 0 1px var(--line),0 10px 22px -16px rgba(22,33,63,.35)!important}
[data-module=blog] .hub-feat:hover{box-shadow:var(--lift-shadow)!important}
@media (prefers-reduced-motion:reduce){.prog,.mini,.post-card a,.map-card,.hub-feat,.aw,.tx{transition:box-shadow .15s ease!important}
  .prog:hover,.mini:hover,.post-card a:hover,.map-card:hover,.hub-feat:hover,.aw:hover,.tx:hover,.prog:active,.mini:active,.post-card a:active,.map-card:active,.hub-feat:active,.aw:active,.tx:active{transform:none!important}}
/* room inside scroll tracks so a lifted card's shadow isn't clipped */
.pc-track{padding-top:10px!important;padding-bottom:28px!important;margin-top:-6px!important;margin-bottom:-20px!important}
@media (max-width:700px){.pc-track{padding-top:10px!important;padding-bottom:28px!important}}
