/* Lil' Sneakers University
   Layout concept: "Sneaker Town". Bright confetti shapes and illustrated kids in purple LSU sneakers,
   big rounded program circles, answer-first copy, one orange action per screen.
   Single light theme by design (brand-led); every color is set explicitly from tokens. */
:root{
  --ink:#23142C;          /* body text, deep purple-black */
  --ink-soft:#5E4F66;     /* secondary text, 7.5:1 on white */
  --paper:#FFFFFF;
  --wash:#F7F2F9;         /* lilac wash for alternating bands */
  --line:#E3D7EA;
  --purple:#602579;       /* brand purple, 10.3:1 on white */
  --purple-deep:#3D1652;  /* CTA bands, trust strip */
  --orange:#F2541B;       /* brand orange: decoration and large text on dark only */
  --orange-ink:#B93A0B;   /* button fill and orange text on light, 5.7:1 with white */
  --gold:#D9A93C;         /* SUTQ Gold seal */
  --green:#5DAE3B;        /* fun accents: decoration only */
  --green-ink:#2E6B17;    /* green text on light, 6.6:1 */
  --sky:#27AAE1;
  --sky-ink:#0B5F86;
  --sun:#FFC531;
  --skywash:#E4F5FD;
  --sunwash:#FFF4D1;
  --mint:#E8F6E1;
  --peach:#FFE9DF;
  --gold-ink:#5A3F05;
  --on-dark:#FFFFFF;
  --on-dark-soft:#E6D9EE;
  --font-display:"Fredoka", "Baloo 2", "Arial Rounded MT Bold", system-ui, sans-serif;
  --font-body:"Nunito", "Segoe UI", system-ui, -apple-system, sans-serif;
  --step--1:clamp(.84rem,.82rem + .1vw,.9rem);
  --step-0:clamp(1rem,.97rem + .15vw,1.08rem);
  --step-1:clamp(1.2rem,1.12rem + .4vw,1.4rem);
  --step-2:clamp(1.45rem,1.3rem + .75vw,1.9rem);
  --step-3:clamp(1.8rem,1.5rem + 1.5vw,2.7rem);
  --step-4:clamp(2.15rem,1.7rem + 2.4vw,3.6rem);
  --radius:24px;
  --wrap:72rem;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font-body);font-size:var(--step-0);line-height:1.6;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
[hidden]{display:none!important}
a{color:var(--purple);text-underline-offset:.18em;text-decoration-thickness:1px}
a:hover{color:var(--orange-ink)}
:focus-visible{outline:3px solid var(--orange-ink);outline-offset:3px;border-radius:4px}
h1,h2,h3,h4{font-family:var(--font-display);line-height:1.15;color:var(--purple-deep);text-wrap:balance;margin:0}
h1{font-size:var(--step-4);font-weight:700;letter-spacing:-.01em}
h2{font-size:var(--step-3);font-weight:600}
h3{font-size:var(--step-1);font-weight:600}
p{margin:0}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.prose{max-width:42rem;display:grid;gap:1rem}
.prose h2{margin-top:1.25rem}
.prose h3{margin-top:.75rem}
.stack{display:grid;gap:1rem}
.skip{position:absolute;left:-999px;top:0;background:var(--purple-deep);color:var(--on-dark);padding:.6rem 1rem;z-index:100}
.skip:focus{left:max(16px,env(safe-area-inset-left,0px));top:calc(env(safe-area-inset-top,0px) + 8px)}
.eyebrow{font-size:var(--step--1);font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--orange-ink)}
.answer{font-size:var(--step-1);line-height:1.5;color:var(--ink);max-width:44rem}
.muted{color:var(--ink-soft)}
.small{font-size:var(--step--1)}

/* Preview banner + facts to confirm */
.preview-banner{background:#FFF4D6;color:#4A3500;font-size:var(--step--1);border-bottom:1px solid #EAD08A}
.preview-banner .wrap{padding-block:.45rem;display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.tbc{text-decoration:underline dotted var(--orange-ink) 2px;text-underline-offset:.22em;cursor:help}
.no-preview .tbc{text-decoration:none;cursor:auto}

/* Trust strip */
.trust-strip{background:var(--purple-deep);color:var(--on-dark-soft);font-size:var(--step--1)}
.trust-strip .wrap{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem;padding-block:.45rem;align-items:center}
.trust-strip a{color:var(--on-dark);text-decoration:none;font-weight:700}
.trust-strip a:hover{text-decoration:underline;color:var(--on-dark)}
.trust-strip .seal-dot{display:inline-block;width:.6rem;height:.6rem;border-radius:50%;background:var(--gold);margin-right:.35rem;vertical-align:.05em}

/* Header */
.site-header{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:var(--paper);border-bottom:1px solid var(--line)}
.header-row{display:flex;align-items:center;gap:1rem;padding-block:.5rem;min-height:4.25rem}
.brand{flex:none;display:block;line-height:0}
.brand img{height:3.4rem;width:auto}
.main-nav{margin-left:auto}
.main-nav>ul{list-style:none;margin:0;padding:0;display:flex;gap:.15rem;align-items:center}
.main-nav a,.nav-btn{display:block;padding:.55rem .7rem;border-radius:8px;color:var(--ink);text-decoration:none;font-weight:700;font-size:.98rem;background:none;border:0;font-family:inherit;cursor:pointer}
.main-nav a:hover,.nav-btn:hover,.main-nav a[aria-current="page"]{background:var(--wash);color:var(--purple)}
.has-sub{position:relative}
.sub{list-style:none;margin:0;padding:.5rem;position:absolute;top:100%;left:0;min-width:16rem;background:var(--paper);border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 34px rgba(35,20,44,.14);display:none}
.has-sub:hover .sub,.has-sub:focus-within .sub,.has-sub.open .sub{display:block}
.sub a{font-weight:400}
.sub .sub-age{display:block;font-size:.8rem;color:var(--ink-soft)}
.header-actions{display:flex;align-items:center;gap:.75rem;flex:none}
.header-phone{font-weight:700;color:var(--purple);text-decoration:none;white-space:nowrap}
.btn.menu-toggle{display:none}

/* Buttons: one primary per screen */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:2.9rem;padding:.65rem 1.2rem;border-radius:999px;font-weight:700;text-decoration:none;font-family:var(--font-body);font-size:1rem;line-height:1.2;cursor:pointer;border:2px solid transparent;text-align:center}
.btn-primary{background:var(--orange-ink);color:var(--on-dark)}
.btn-primary:hover{background:#9C3009;color:var(--on-dark)}
.btn-secondary{background:transparent;color:var(--purple);border-color:var(--purple)}
.btn-secondary:hover{background:var(--wash);color:var(--purple)}
.on-dark .btn-secondary{color:var(--on-dark);border-color:var(--on-dark-soft)}
.on-dark .btn-secondary:hover{background:rgba(255,255,255,.1);color:var(--on-dark)}
.btn-row{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}
.phone-line{font-size:var(--step--1);color:var(--ink-soft)}
.phone-line a{font-weight:700}

/* Breadcrumbs */
.crumbs{font-size:var(--step--1);color:var(--ink-soft);padding-block:.9rem 0}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.35rem}
.crumbs li+li::before{content:"›";margin-right:.35rem;color:var(--ink-soft)}
.crumbs a{color:var(--ink-soft)}

/* Sections and laced dividers */
.band{padding-block:clamp(2.5rem,5vw,4.5rem)}
.band-wash{background:var(--wash)}
.band-dark{background:var(--purple-deep);color:var(--on-dark)}
.band-dark h2,.band-dark h3{color:var(--on-dark)}
.band-dark a{color:var(--on-dark)}
.band-dark .eyebrow{color:var(--orange)}
.lace{height:18px;background:
  radial-gradient(circle at 9px 9px,var(--paper) 3px,var(--purple) 3.5px,var(--purple) 6px,transparent 6.5px) 0 0/48px 18px repeat-x,
  linear-gradient(var(--line),var(--line)) 0 50%/100% 2px no-repeat}
.section-head{display:grid;gap:.6rem;margin-bottom:1.75rem;max-width:46rem}
.page-head{padding-block:1.5rem 2rem;display:grid;gap:1rem}
.updated{font-size:var(--step--1);color:var(--ink-soft)}

/* Hero */
.hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:2rem;align-items:center;padding-block:2rem 3rem}
.hero h1 .lace-word{position:relative;white-space:nowrap;color:var(--purple)}
.hero h1 .lace-word::after{content:"";position:absolute;left:0;right:0;bottom:-.08em;height:.18em;background:repeating-linear-gradient(90deg,var(--orange) 0 14px,transparent 14px 20px);border-radius:4px}
.hero-copy{display:grid;gap:1.25rem;min-width:0}
.hero-art{position:relative;justify-self:center;max-width:22rem;width:100%}
.hero-art .mark{width:60%;margin-left:4%}
.seal{position:absolute;right:0;top:34%;width:8.5rem;aspect-ratio:1;max-width:100%;border-radius:50%;background:var(--gold);color:var(--gold-ink);display:grid;place-content:center;text-align:center;box-shadow:inset 0 0 0 5px var(--gold),inset 0 0 0 7px rgba(90,63,5,.45);transform:rotate(8deg);font-family:var(--font-display);line-height:1.05;padding:.75rem}
.seal b{display:block;font-size:1.65rem;font-weight:800}
.seal span{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-family:var(--font-body)}
.license-tag{position:absolute;right:0;bottom:4%;background:var(--paper);border:2px dashed var(--purple);border-radius:10px;padding:.5rem .75rem;font-size:.8rem;line-height:1.3;transform:rotate(-4deg);box-shadow:0 8px 20px rgba(35,20,44,.12)}
.license-tag b{font-family:var(--font-display);font-size:1rem;color:var(--purple-deep);display:block}

/* At a glance fact block (identical wording sitewide) */
.glance{border:2px dashed var(--purple);border-radius:var(--radius);padding:clamp(1.25rem,3vw,2rem);background:var(--paper);position:relative}
.glance h2{font-size:var(--step-2);margin-bottom:1rem}
.glance dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:1rem 2rem;margin:0}
.glance dt{font-size:var(--step--1);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--orange-ink)}
.glance dd{margin:0;font-weight:700}

/* Eyelet bullets */
.eyelets{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}
.eyelets li{position:relative;padding-left:1.9rem}
.eyelets li::before{content:"";position:absolute;left:0;top:.38em;width:1.05rem;height:1.05rem;border-radius:50%;background:var(--paper);border:4px solid var(--purple);box-shadow:0 0 0 2px var(--line)}
.band-dark .eyelets li::before{background:var(--purple-deep);border-color:var(--orange);box-shadow:none}

/* Cards */
.grid{display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,16.5rem),1fr))}
.grid-3{display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,19rem),1fr))}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem;display:grid;gap:.65rem;align-content:start;min-width:0}
.card h3 a{text-decoration:none;color:var(--purple-deep)}
.card h3 a:hover{color:var(--orange-ink)}
.card .ages{font-size:var(--step--1);font-weight:700;color:var(--orange-ink)}
.card .more{font-weight:700;margin-top:auto}
.card-link{position:relative}
.card-link h3 a::after{content:"";position:absolute;inset:0}
.card-link:hover{border-color:var(--purple)}
.service-card{border-top:6px solid var(--purple)}
.service-card:nth-child(2){border-top-color:var(--orange)}
.service-card:nth-child(3){border-top-color:var(--gold)}

/* Age finder */
.finder{background:var(--paper);border-radius:var(--radius);padding:clamp(1.25rem,3vw,2rem);display:grid;gap:1rem;border:1px solid var(--line)}
.finder fieldset{border:0;margin:0;padding:0}
.finder legend{font-family:var(--font-display);font-size:var(--step-2);font-weight:700;color:var(--purple-deep);margin-bottom:.9rem}
.chips{display:flex;flex-wrap:wrap;gap:.5rem}
.chip{position:relative}
.chip input{position:absolute;opacity:0;inset:0;cursor:pointer}
.chip label{display:block;padding:.6rem 1rem;border:2px solid var(--purple);border-radius:999px;font-weight:700;color:var(--purple);cursor:pointer;background:var(--paper)}
.chip input:checked+label{background:var(--purple);color:var(--on-dark)}
.chip input:focus-visible+label{outline:3px solid var(--orange-ink);outline-offset:3px}
.finder-result{border-left:6px solid var(--orange);padding:.75rem 1rem;background:var(--wash);border-radius:0 10px 10px 0;display:grid;gap:.5rem}
.finder-result h3{font-size:var(--step-1)}

/* Video facade */
.video{position:relative;aspect-ratio:16/9;max-width:100%;border-radius:var(--radius);overflow:hidden;background:var(--purple-deep);color:var(--on-dark);display:grid;place-items:center;text-align:center}
.video::before{content:"";position:absolute;inset:0;background:
  repeating-linear-gradient(135deg,rgba(255,255,255,.04) 0 18px,transparent 18px 36px)}
.video button{position:relative;display:grid;gap:.75rem;justify-items:center;background:none;border:0;color:var(--on-dark);font:inherit;cursor:pointer;padding:1.5rem}
.video .play{width:4.5rem;height:4.5rem;border-radius:50%;background:var(--orange);display:grid;place-items:center}
.video .play::after{content:"";border-left:1.3rem solid var(--paper);border-top:.8rem solid transparent;border-bottom:.8rem solid transparent;margin-left:.3rem}
.video .v-title{font-family:var(--font-display);font-size:var(--step-1);font-weight:700}
.video .v-meta{font-size:var(--step--1);color:var(--on-dark-soft)}
.video-msg{position:relative;padding:1rem;font-size:var(--step--1)}
.transcript{border:1px solid var(--line);border-radius:10px;padding:.75rem 1rem;background:var(--paper)}
.transcript summary{font-weight:700;cursor:pointer;color:var(--purple)}

/* Split layouts */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
.split-wide{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
.aside-card{position:sticky;top:6.5rem;border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem;display:grid;gap:.9rem;background:var(--wash)}

/* Sample day timeline */
.day{list-style:none;margin:0;padding:0;display:grid;gap:0;border-left:3px dashed var(--purple);margin-left:.6rem}
.day li{position:relative;padding:.1rem 0 1.1rem 1.5rem;display:grid;grid-template-columns:6.5rem minmax(0,1fr);gap:.75rem}
.day li::before{content:"";position:absolute;left:-.62rem;top:.35rem;width:.95rem;height:.95rem;border-radius:50%;background:var(--paper);border:3px solid var(--orange)}
.day time,.day .t{font-weight:700;color:var(--purple);font-variant-numeric:tabular-nums}

/* Tables */
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px}
table{border-collapse:collapse;width:100%;min-width:34rem;font-variant-numeric:tabular-nums}
th,td{text-align:left;padding:.7rem .9rem;border-bottom:1px solid var(--line);vertical-align:top}
thead th{background:var(--wash);font-size:var(--step--1);letter-spacing:.04em;text-transform:uppercase;color:var(--purple-deep)}
tbody tr:last-child td,tbody tr:last-child th{border-bottom:0}
caption{text-align:left;padding:.75rem .9rem;font-size:var(--step--1);color:var(--ink-soft);caption-side:bottom}

/* FAQ */
.faq{display:grid;gap:.6rem;max-width:48rem}
.faq details{border:1px solid var(--line);border-radius:12px;background:var(--paper)}
.faq summary{cursor:pointer;padding:1rem 1.2rem;font-weight:700;font-size:1.05rem;list-style:none;display:flex;gap:1rem;justify-content:space-between;align-items:flex-start;color:var(--purple-deep)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--font-display);font-size:1.5rem;line-height:1;color:var(--orange-ink);flex:none}
.faq details[open] summary::after{content:"−"}
.faq .a{padding:0 1.2rem 1.1rem;display:grid;gap:.6rem}
.faq-group{display:grid;gap:1rem;margin-bottom:2rem}

/* Callouts */
.note{border-left:6px solid var(--purple);background:var(--wash);padding:1rem 1.2rem;border-radius:0 12px 12px 0;display:grid;gap:.4rem}
.note-orange{border-left-color:var(--orange)}
.checklist{counter-reset:c;list-style:none;margin:0;padding:0;display:grid;gap:1rem}
.checklist>li{counter-increment:c;position:relative;padding-left:3.2rem;min-height:2.4rem}
.checklist>li::before{content:counter(c);position:absolute;left:0;top:0;width:2.3rem;height:2.3rem;border-radius:50%;background:var(--purple);color:var(--on-dark);display:grid;place-items:center;font-family:var(--font-display);font-weight:800}
.checklist h3{font-size:var(--step-1);margin-bottom:.25rem}

/* CTA band */
.cta-band{background:var(--purple-deep);color:var(--on-dark)}
.cta-band .wrap{padding-block:clamp(2.25rem,5vw,3.5rem);display:grid;grid-template-columns:minmax(0,1.4fr) auto;gap:1.5rem;align-items:center}
.cta-band h2{color:var(--on-dark);font-size:var(--step-3)}
.cta-band p{color:var(--on-dark-soft)}
.cta-band .phone-line,.cta-band .phone-line a{color:var(--on-dark)}
.cta-band .cta-copy{display:grid;gap:.6rem;min-width:0}
.cta-band .btn-row{justify-content:flex-end}

/* Forms */
.form{display:grid;gap:1rem;max-width:36rem}
.field{display:grid;gap:.35rem}
.field label{font-weight:700}
.field .hint{font-size:var(--step--1);color:var(--ink-soft)}
.field input,.field select,.field textarea{font:inherit;padding:.7rem .85rem;border:2px solid #B7A6C2;border-radius:10px;background:var(--paper);color:var(--ink);width:100%}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--purple);outline:3px solid rgba(96,37,121,.25);outline-offset:0}
.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));gap:1rem}
.hp{position:absolute;left:-5000px}
.form-done{border:2px solid var(--purple);border-radius:12px;padding:1.2rem;background:var(--wash);display:grid;gap:.4rem}

/* Reviews empty state, people */
.person{display:grid;grid-template-columns:5rem minmax(0,1fr);gap:1rem;align-items:start}
.avatar{width:5rem;height:5rem;border-radius:50%;background:var(--wash);border:2px dashed var(--purple);display:grid;place-items:center;font-family:var(--font-display);font-weight:800;color:var(--purple);font-size:1.3rem}

/* Footer */
.site-footer{background:var(--ink);color:#D9CFE0;font-size:.95rem;padding-bottom:5rem}
.site-footer a{color:var(--on-dark)}
.site-footer h2{color:var(--on-dark);font-size:1.05rem;font-family:var(--font-body);letter-spacing:.06em;text-transform:uppercase;margin-bottom:.75rem}
.footer-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:2rem;padding-block:3rem 2rem}
.footer-grid ul{list-style:none;margin:0;padding:0;display:grid;gap:.4rem}
.nap{font-style:normal;display:grid;gap:.25rem}
.nap strong{color:var(--on-dark);font-family:var(--font-display);font-size:1.25rem}
.footer-seal{display:inline-flex;align-items:center;gap:.5rem;background:var(--gold);color:var(--gold-ink);font-weight:700;border-radius:999px;padding:.3rem .8rem;margin-top:.6rem;width:max-content;max-width:100%}
.footer-base{border-top:1px solid #4A3A55;padding-block:1.25rem;display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;font-size:.85rem}

/* Sticky mobile bar */
.mobile-bar{display:none}

@media (max-width:980px){
  .main-nav{position:fixed;inset:0;top:0;background:var(--paper);padding:calc(env(safe-area-inset-top,0px) + 5rem) max(16px,env(safe-area-inset-right,0px)) 2rem max(16px,env(safe-area-inset-left,0px));overflow-y:auto;display:none;z-index:60}
  .nav-open .main-nav{display:block}
  .main-nav>ul{flex-direction:column;align-items:stretch;gap:.25rem}
  .main-nav a,.nav-btn{font-size:1.15rem;padding:.8rem .5rem;width:100%;text-align:left}
  .sub{position:static;display:block;border:0;box-shadow:none;padding:0 0 .5rem 1rem;min-width:0}
  .btn.menu-toggle{display:inline-flex;position:relative;z-index:70;margin-left:auto}
  .header-phone{display:none}
  .header-actions .btn-primary{display:none}
  .hero{grid-template-columns:1fr;padding-block:1.25rem 2rem}
  .hero-art{max-width:19rem;justify-self:start}
  .split,.split-wide{grid-template-columns:1fr}
  .aside-card{position:static}
  .footer-grid{grid-template-columns:1fr 1fr}
  .cta-band .wrap{grid-template-columns:1fr}
  .cta-band .btn-row{justify-content:flex-start}
  .mobile-bar{display:grid;grid-template-columns:repeat(3,1fr);position:fixed;left:0;right:0;bottom:0;z-index:55;background:var(--paper);border-top:1px solid var(--line);box-shadow:0 -6px 20px rgba(35,20,44,.1);padding:.5rem max(12px,env(safe-area-inset-right,0px)) calc(.5rem + env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px));gap:.5rem;transform:translateY(110%);transition:transform .25s ease}
  .mobile-bar.show{transform:none}
  .mobile-bar a{display:grid;place-items:center;min-height:2.9rem;border-radius:999px;font-weight:700;text-decoration:none;border:2px solid var(--purple);color:var(--purple);font-size:.95rem}
  .mobile-bar a.primary{background:var(--orange-ink);border-color:var(--orange-ink);color:var(--on-dark)}
}
@media (max-width:560px){
  .brand img{height:2.8rem}
  .footer-grid{grid-template-columns:1fr}
  .seal{width:6.5rem}
  .seal b{font-size:1.25rem}
  .day li{grid-template-columns:1fr;gap:.1rem}
  .person{grid-template-columns:3.5rem minmax(0,1fr)}
  .avatar{width:3.5rem;height:3.5rem;font-size:1rem}
}


/* =================== Sneaker Town components =================== */
.eyebrow{color:var(--orange-ink);font-family:var(--font-body);font-weight:800}
.answer{font-size:var(--step-1)}
.btn{font-weight:800;min-height:3.1rem;padding:.7rem 1.5rem}
.card{border-radius:var(--radius)}
.lace{display:none}

/* Wavy and cloud edges between bands */
.wave{display:block;width:100%;height:clamp(28px,4vw,56px)}
.wave path{fill:var(--wave-fill,var(--wash))}

/* Hero */
.hero2{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(1.5rem,4vw,3rem);align-items:start;padding-block:clamp(1.5rem,4vw,3.5rem) clamp(2rem,4vw,3rem)}
.hero2 .hero-copy{display:grid;gap:1.25rem;min-width:0}
.hero2 h1{display:grid;gap:.6rem}
.hero2 .slogan{font-size:clamp(2.7rem,1.6rem + 4.6vw,5.2rem);line-height:.98;color:var(--purple);font-weight:700}
.hero2 .slogan em{font-style:normal;color:var(--orange)}
.hero2 .h1-sub{font-family:var(--font-display);font-weight:500;font-size:clamp(1.25rem,1.05rem + .7vw,1.65rem);color:var(--purple-deep);line-height:1.3;letter-spacing:.005em;max-width:34ch}
.hero2 .lead{font-size:var(--step-1);color:var(--ink-soft);max-width:36rem}
.hero2 .art{position:relative;min-width:0;align-self:start;margin-top:-.5rem}
.hero2 .art img{width:100%;max-width:560px;margin-inline:auto}
.trust-chips{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin:0;padding:0}
.trust-chips li{display:inline-flex;align-items:center;gap:.45rem;background:var(--wash);border-radius:999px;padding:.4rem .9rem .4rem .45rem;font-weight:800;font-size:.92rem;color:var(--purple-deep)}
.trust-chips li i{width:1.6rem;height:1.6rem;border-radius:50%;display:grid;place-items:center;font-style:normal;color:#fff;font-size:.85rem}
.trust-chips li:nth-child(1) i{background:var(--purple)}
.trust-chips li:nth-child(2) i{background:var(--gold);color:var(--gold-ink)}
.trust-chips li:nth-child(3) i{background:var(--green-ink)}

/* Program circles */
.programs-band{background:var(--purple);color:#fff;position:relative}
.programs-band h2,.programs-band .section-head p{color:#fff}
.programs-band .eyebrow{color:var(--sun)}
.prog-circles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(1rem,2.5vw,2rem)}
.prog-circles li{display:grid;align-content:start;justify-items:center;text-align:center;gap:.55rem;position:relative}
.prog-circles .ring{width:100%;max-width:12rem;aspect-ratio:1;border-radius:50%;overflow:hidden;border:6px solid var(--sun);background:#fff}
.prog-circles li:nth-child(2) .ring{border-color:var(--sky)}
.prog-circles li:nth-child(3) .ring{border-color:var(--green)}
.prog-circles li:nth-child(4) .ring{border-color:var(--orange)}
.prog-circles li:nth-child(5) .ring{border-color:#fff}
.prog-circles .ring img{width:100%;height:100%;object-fit:cover}
.prog-circles a.pill{margin-top:-1.6rem;position:relative;background:var(--orange-ink);color:#fff;text-decoration:none;font-family:var(--font-display);font-weight:600;font-size:1.12rem;padding:.55rem 1.2rem;border-radius:999px;box-shadow:0 6px 0 rgba(0,0,0,.18);white-space:nowrap}
.prog-circles a.pill::after{content:"";position:absolute;inset:-60% -8% -30%}
.prog-circles a.pill:hover{background:#9C3009}
.prog-circles .age{font-weight:800;color:#fff}
.prog-circles .blurb{font-size:.95rem;color:var(--on-dark-soft);max-width:14rem}

/* Beyond the classroom */
.enrich{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}
.enrich article{display:grid;gap:.7rem;align-content:start;min-width:0}
.enrich .pic{border-radius:var(--radius);overflow:hidden;aspect-ratio:3/2;max-width:100%}
.enrich .pic img{width:100%;height:100%;object-fit:cover}
.enrich h2,.enrich h3{font-size:var(--step-2);color:var(--orange-ink)}
.enrich article:nth-child(2) :is(h2,h3){color:var(--sky-ink)}
.enrich article:nth-child(3) :is(h2,h3){color:var(--green-ink)}
.enrich .tag{justify-self:start;font-size:.8rem;font-weight:800;border-radius:999px;padding:.2rem .7rem;background:var(--sunwash);color:var(--gold-ink)}

/* Day strip */
.day-strip{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:1rem;counter-reset:d}
.day-strip li{background:#fff;border-radius:20px;padding:1.1rem;display:grid;gap:.35rem;align-content:start;border-top:8px solid var(--c,var(--purple));min-width:0}
.day-strip .t{font-family:var(--font-display);font-weight:600;color:var(--c-ink,var(--purple));font-size:1.05rem}
.day-strip h3{font-size:1.1rem}
.day-strip p{font-size:.95rem;color:var(--ink-soft)}

/* Help paying */
.help-pay{background:var(--mint);border-radius:32px;padding:clamp(1.5rem,4vw,3rem);display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:1.5rem;align-items:center}
.help-pay .big{width:5.5rem;height:5.5rem;border-radius:28px;background:var(--green);display:grid;place-items:center;color:#fff;font-family:var(--font-display);font-size:2.4rem;font-weight:700;transform:rotate(-6deg)}
.help-pay h2{color:var(--green-ink);font-size:var(--step-2)}

/* Action cards */
.action-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem;padding-top:2.5rem}
.action-cards article{background:var(--c);color:#fff;border-radius:28px;padding:3.6rem 1.5rem 1.6rem;text-align:center;display:grid;gap:.75rem;justify-items:center;position:relative}
.action-cards .icon{position:absolute;top:-2.4rem;left:50%;transform:translateX(-50%);width:4.8rem;height:4.8rem;border-radius:50%;background:var(--sun);display:grid;place-items:center;border:5px solid #fff}
.action-cards .icon svg{width:2.3rem;height:2.3rem}
.action-cards h3{color:#fff;font-size:var(--step-2)}
.action-cards p{color:#fff}
.action-cards .btn{background:#fff;color:var(--purple-deep)}
.action-cards .btn:hover{background:var(--sunwash);color:var(--purple-deep)}

/* Quote / review slot */
.quote-slot{background:var(--sunwash);border-radius:28px;padding:1.75rem;display:grid;gap:.6rem;position:relative}
.quote-slot::before{content:"\201C";font-family:var(--font-display);font-size:5rem;line-height:.6;color:var(--orange)}

/* Illustrated town above footer */
.town{display:block;width:100%;height:auto;background:#F1ECF4}

/* Program page hero with art */
.prog-hero{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:clamp(1.5rem,4vw,3rem);align-items:center;padding-block:1.25rem 2.5rem}
.prog-hero .art{border-radius:40px;overflow:hidden;max-width:24rem;justify-self:end;width:100%;transform:rotate(2deg);box-shadow:0 18px 40px rgba(61,22,82,.15)}
.prog-hero .copy{display:grid;gap:1rem;min-width:0}
.explore{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr));gap:1rem}
.explore div{border-radius:20px;padding:1.1rem;display:grid;gap:.3rem;background:var(--bgc,var(--wash))}
.explore b{font-family:var(--font-display);font-weight:600;font-size:1.15rem;color:var(--c,var(--purple-deep))}
.explore span{font-size:.95rem;color:var(--ink)}
.facts-mini{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.facts-mini li{background:var(--wash);border-radius:999px;padding:.35rem .9rem;font-weight:700;font-size:.92rem}

/* Confetti accents for section heads */
.section-head h2{position:relative}
.dotted-title::after{content:"";display:block;width:4.5rem;height:.5rem;margin-top:.6rem;border-radius:999px;background:linear-gradient(90deg,var(--orange) 0 30%,transparent 30% 35%,var(--sky) 35% 65%,transparent 65% 70%,var(--green) 70%)}

/* Trust strip simplified */
.trust-strip{background:var(--purple-deep)}

@media (max-width:980px){
  .hero2{grid-template-columns:1fr}
  .hero2 .art{max-width:26rem;justify-self:center}
  .prog-circles{grid-template-columns:repeat(3,minmax(0,1fr))}
  .enrich,.action-cards{grid-template-columns:1fr}
  .action-cards{gap:3.4rem}
  .day-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .help-pay{grid-template-columns:1fr}
  .prog-hero{grid-template-columns:1fr}
  .prog-hero .art{justify-self:start;max-width:18rem;order:-1}
}
@media (max-width:560px){
  .trust-strip .wrap{font-size:.8rem;gap:.15rem .7rem}
  .trust-strip span[aria-hidden]{display:none}
  .trust-chips li{font-size:.85rem}
  .prog-circles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .prog-circles a.pill{font-size:1rem;padding:.5rem .9rem}
  .day-strip{grid-template-columns:1fr}
}

/* =================== v3: photos + illustrations, intentional doodles ===================
   Rules for accents: one doodle per section at most, always tied to a heading, a photo corner or a band edge.
   Sparkles = sun or white, stars = sky, squiggles = orange or purple. Never floating in empty space. */
.doodle{position:absolute;display:block;line-height:0;pointer-events:none;color:var(--sun)}
.doodle svg{width:100%;height:auto;display:block}
.doodle-sparkle{width:2.2rem}
.doodle-star{width:1.7rem;color:var(--sky)}
.doodle-squiggle{width:6.5rem;color:var(--orange)}
.doodle-loop{width:9rem;color:var(--purple)}
.doodle-dots{width:3.2rem;color:var(--green)}
@media (prefers-reduced-motion:no-preference){
  .doodle-sparkle{animation:twinkle 3.2s ease-in-out infinite}
  @keyframes twinkle{0%,100%{transform:scale(1) rotate(0)}50%{transform:scale(.82) rotate(12deg)}}
}

/* Heading underline: a hand-drawn squiggle instead of a bar */
.dotted-title::after{width:6.5rem;height:.85rem;margin-top:.55rem;border-radius:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 24'%3E%3Cpath d='M3 12c9-14 18-14 27 0s18 14 27 0 18-14 27 0 18 14 27 0' fill='none' stroke='%23F2541B' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E") left center/contain no-repeat}
.programs-band .dotted-title::after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 24'%3E%3Cpath d='M3 12c9-14 18-14 27 0s18 14 27 0 18-14 27 0 18 14 27 0' fill='none' stroke='%23FFC531' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E")}

/* Photo frames */
.ph{margin:0;position:relative;overflow:hidden;background:var(--wash);max-width:100%}
.ph img{width:100%;height:100%;object-fit:cover}
.ph-arch{border-radius:999px 999px 28px 28px;aspect-ratio:4/5}
.ph-round{border-radius:50%;aspect-ratio:1}
.ph-soft{border-radius:28px;aspect-ratio:3/2}
.ph-ring{border:7px solid #fff;box-shadow:0 18px 40px rgba(61,22,82,.16)}

/* Hero collage */
.hero2 .collage{position:relative;width:100%;max-width:560px;aspect-ratio:1/1.02;justify-self:center;margin-top:.5rem}
.collage .blob{position:absolute;inset:8% 4% 6% 14%;background:var(--peach);border-radius:58% 42% 52% 48%/48% 56% 44% 52%}
.collage .blob2{position:absolute;width:30%;aspect-ratio:1;left:2%;top:4%;background:var(--skywash);border-radius:50%}
.collage .main{position:absolute;right:4%;top:0;width:60%}
.collage .second{position:absolute;left:2%;bottom:6%;width:42%}
.collage .mascot{position:absolute;right:-3%;bottom:-3%;width:22%;filter:drop-shadow(0 8px 10px rgba(61,22,82,.18))}
.collage .sticker{position:absolute;left:6%;top:12%;width:7.2rem;aspect-ratio:1;border-radius:50%;background:var(--purple);color:#fff;display:grid;place-content:center;text-align:center;font-family:var(--font-display);font-weight:600;font-size:.95rem;line-height:1.1;padding:.6rem;transform:rotate(-10deg);box-shadow:0 10px 24px rgba(61,22,82,.25)}
.collage .sticker b{display:block;font-size:1.5rem;color:var(--sun)}
.collage .d1{left:44%;top:-3%;width:2.4rem}
.collage .d2{right:0;top:44%}
.collage .d3{left:16%;bottom:-2%;width:7rem}

/* Programs band photo circles */
.prog-circles .ring{box-shadow:0 12px 26px rgba(0,0,0,.18)}
.programs-band{overflow:hidden}
.programs-band .pb-s1{right:8%;top:2.2rem;color:#fff;width:2rem}
.programs-band .pb-s2{right:13%;top:4.6rem;color:var(--sun);width:1.2rem}

/* Beyond the classroom: arch-topped illustration cards */
.enrich .pic{border-radius:46% 46% 24px 24px/30% 30% 24px 24px;aspect-ratio:4/3}

/* Gallery bento */
.gallery{display:grid;grid-template-columns:1.35fr 1fr .9fr;grid-template-rows:repeat(2,14rem);gap:1.1rem;position:relative}
.gallery .g1{grid-row:1/3;aspect-ratio:auto;border-radius:32px}
.gallery .g2{grid-row:1/3;aspect-ratio:auto}
.gallery .g3{aspect-ratio:1;height:100%;width:auto;justify-self:center}
.gallery .g4{aspect-ratio:auto;border-radius:28px}
.gallery .gal-s{right:-.6rem;top:-1.2rem;width:2.6rem}
.gallery-head{display:flex;justify-content:space-between;align-items:end;gap:1rem;flex-wrap:wrap;margin-bottom:1.75rem}
.gallery-head .section-head{margin:0}

/* Teachers split with arch photo */
.teach-ph{max-width:24rem;width:100%;justify-self:center;position:relative}
.teach-ph .t-s{left:-1rem;top:1.2rem}
.teach-ph .t-d{right:-.5rem;bottom:2rem;width:3.4rem}

/* Program page hero: arch photo + illustration badge */
.prog-hero .art{transform:none;box-shadow:none;border-radius:0;overflow:visible;position:relative;max-width:24rem}
.prog-hero .art .badge{position:absolute;left:-12%;bottom:-6%;width:44%;border-radius:50%;overflow:hidden;border:6px solid #fff;box-shadow:0 12px 28px rgba(61,22,82,.18);aspect-ratio:1}
.prog-hero .art .badge img{width:100%;height:100%;object-fit:cover}
.prog-hero .art .ps{right:-.8rem;top:1.4rem}

/* Video poster photo under a brand tint */
.video .poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.video::after{content:"";position:absolute;inset:0;background:linear-gradient(160deg,rgba(61,22,82,.78),rgba(96,37,121,.55))}
.video::before{z-index:1}
.video button,.video .video-msg{z-index:2}

/* Related cards with photos */
.card-link img{border-radius:18px}

/* CTA band accents */
.cta-band{position:relative;overflow:hidden}
.cta-band .cta-s1{left:3%;top:1.4rem;width:2rem}
.cta-band .cta-s2{right:4%;bottom:1.2rem;color:var(--orange);width:1.6rem}

@media (max-width:980px){
  .hero2 .collage{max-width:26rem}
  .gallery{grid-template-columns:1fr 1fr;grid-template-rows:none}
  .gallery .g1{grid-column:1/3;grid-row:auto;aspect-ratio:3/2}
  .gallery .g2{grid-row:auto;aspect-ratio:4/5}
  .gallery .g4{aspect-ratio:3/2}
  .gallery .g3{height:auto;width:100%}
  .prog-hero .art{margin-left:8%;max-width:16rem}
  .prog-hero .art .badge{left:-6%}
}
@media (max-width:560px){
  .collage .sticker{width:5.6rem;font-size:.8rem}
  .collage .sticker b{font-size:1.15rem}
  .doodle-loop,.collage .d3{display:none}
}