:root{
  --sand:#f2ede3;--cream:#faf7f0;--sage:#64796a;--sage-d:#46584c;--ink:#2c352d;--mut:#6f7a6c;
  --line:#e0d9c8;--line2:#d2c9b4;--gold:#c9a86b;
  --ff-d:"Marcellus",Georgia,serif;--ff-b:"Karla",ui-sans-serif,system-ui,sans-serif;
  --rad:20px;--shadow:0 24px 60px rgba(44,53,45,.14);
  --panel:#fff;--nav-bg:rgba(242,237,227,.9);--float-bg:rgba(250,247,240,.92);--accent-soft:#dbe5da;
  --foot-bg:#2c352d;--foot-ink:#fff;--foot-mut:#b9c1b6;--foot-faint:#8d978a;--foot-line:#3c463d;
  --ok-bg:#e7efe4;--ok-line:#c2d4bd;--ok-ink:#31502f;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--sand);color:var(--ink);font:16px/1.7 var(--ff-b);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block;height:auto}
a{color:inherit}
.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--cream);padding:.6rem 1rem;z-index:99}
.skip:focus{left:0}
.wrap{max-width:70rem;margin:0 auto;padding:0 1.4rem}

/* nav */
.nav{position:sticky;top:0;z-index:40;background:var(--nav-bg);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav .in{max-width:70rem;margin:0 auto;padding:.9rem 1.4rem;display:flex;align-items:center;gap:1.6rem}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;font:400 1.25rem/1 var(--ff-d);letter-spacing:.04em;color:var(--sage-d)}
.brand svg{color:var(--sage)}
.navlinks{display:flex;gap:1.5rem;margin-left:auto;align-items:center}
.navlinks a{text-decoration:none;font-size:.92rem;font-weight:600;color:var(--mut);padding:.3rem 0;border-bottom:2px solid transparent}
.navlinks a:hover{color:var(--ink)}
.navlinks a[aria-current]{color:var(--sage-d);border-bottom-color:var(--sage)}
.nav-cta{background:var(--sage);color:#fff!important;border-radius:99px;padding:.6rem 1.2rem!important;font-weight:700;border-bottom:0!important}
.nav-cta:hover{background:var(--sage-d)}
.burger{display:none;margin-left:auto;background:none;border:1px solid var(--line2);border-radius:10px;padding:.5rem .6rem;cursor:pointer;color:var(--ink)}

/* type */
.kicker{font-size:.74rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--sage);margin:0 0 1rem}
h1{font:400 clamp(2.6rem,6vw,4.6rem)/1.06 var(--ff-d);letter-spacing:.01em;margin:0 0 1.1rem;color:var(--ink)}
h2{font:400 clamp(1.9rem,3.4vw,2.7rem)/1.15 var(--ff-d);margin:0 0 .7rem;color:var(--ink)}
.lede{font-size:1.12rem;color:var(--mut);max-width:33rem;margin:0 0 1.8rem}

/* hero */
.hero{padding:4rem 0 4.6rem}
.hero .in{display:grid;grid-template-columns:1fr 1fr;gap:3.6rem;align-items:center}
.arch{border-radius:14rem 14rem var(--rad) var(--rad);overflow:hidden;box-shadow:var(--shadow);position:relative}
.arch img{width:100%;height:100%;object-fit:cover}
.hero .chip-float{position:absolute;bottom:1.2rem;left:1.2rem;right:1.2rem;background:var(--float-bg);backdrop-filter:blur(6px);border-radius:14px;padding:.85rem 1.1rem;display:flex;gap:.8rem;align-items:center;font-size:.88rem}
.hero .chip-float svg{color:var(--sage);flex:none}
.hero .chip-float b{display:block}
.hero .chip-float span{color:var(--mut);font-size:.82rem}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;background:var(--sage);color:#fff;text-decoration:none;padding:.9rem 1.7rem;border-radius:99px;font:700 .98rem var(--ff-b);border:1px solid var(--sage);cursor:pointer;transition:background .2s,transform .15s}
.btn:hover{background:var(--sage-d);border-color:var(--sage-d);transform:translateY(-1px)}
.btn.ghost{background:transparent;color:var(--sage-d);border-color:var(--line2)}
.btn.ghost:hover{background:var(--cream);transform:none}
.btn.ink{background:var(--ink);border-color:var(--ink)}
.btn.ink:hover{background:#1e241f}
.cta-row{display:flex;gap:.8rem;flex-wrap:wrap}

/* sections */
section{padding:4.2rem 0}
.sec-head{max-width:38rem;margin-bottom:2.6rem}
.sec-head.center{margin-left:auto;margin-right:auto;text-align:center}
.sec-head p{color:var(--mut);margin:0;font-size:1.04rem}
.band{background:var(--cream);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.band.sage{background:var(--sage);border-color:var(--sage-d);color:#fff}
.band.sage h2{color:#fff}
.band.sage .sec-head p{color:var(--accent-soft)}

/* intro trio */
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;text-align:center}
.tri-i .ic{width:3.4rem;height:3.4rem;margin:0 auto 1rem;border-radius:50%;background:var(--cream);border:1px solid var(--line);display:grid;place-items:center;color:var(--sage)}
.tri-i h3,.tri-i h2{font:400 1.35rem/1.2 var(--ff-d);margin:0 0 .4rem}
.tri-i p{margin:0;color:var(--mut);font-size:.94rem}

/* class cards */
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.card{background:var(--cream);border:1px solid var(--line);border-radius:var(--rad);overflow:hidden;transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.card .ph{aspect-ratio:4/3;overflow:hidden}
.card .ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.card:hover .ph img{transform:scale(1.04)}
.card .bd{padding:1.2rem 1.3rem 1.4rem;display:flex;flex-direction:column;gap:.4rem;flex:1}
.card h3{font:400 1.3rem/1.2 var(--ff-d);margin:0}
.card p{margin:0;color:var(--mut);font-size:.92rem;flex:1}
.lvl{display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:var(--sand);border:1px solid var(--line2);border-radius:99px;padding:.2rem .6rem;color:var(--mut);align-self:flex-start}

/* schedule */
.dtabs{display:flex;gap:.45rem;justify-content:center;flex-wrap:wrap;margin:0 0 2rem}
.dtabs button{font:700 .85rem var(--ff-b);border:1px solid var(--line2);background:var(--cream);color:var(--mut);border-radius:99px;padding:.55rem 1.05rem;cursor:pointer;position:relative}
.dtabs button:hover{color:var(--ink);border-color:var(--sage)}
.dtabs button.on{background:var(--sage);border-color:var(--sage);color:#fff}
.dtabs button .dot{position:absolute;top:.3rem;right:.55rem;width:.4rem;height:.4rem;border-radius:50%;background:var(--gold)}
.day{display:none}
.day.on{display:block}
.sched{background:var(--cream);border:1px solid var(--line);border-radius:var(--rad);overflow:hidden}
.srow{display:grid;grid-template-columns:6rem 1fr auto auto;gap:1.2rem;padding:1.05rem 1.4rem;border-bottom:1px solid var(--line);align-items:center}
.srow:last-child{border-bottom:0}
.srow .tm{font:400 1.15rem/1 var(--ff-d);color:var(--sage-d);font-variant-numeric:tabular-nums}
.srow .cl b{display:block;font-size:1.02rem}
.srow .cl span{color:var(--mut);font-size:.85rem}
.srow .who{color:var(--mut);font-size:.88rem}
.sched-note{text-align:center;color:var(--mut);font-size:.88rem;margin-top:1.4rem}

/* teachers */
.teachers{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem}
.teach{text-align:center}
.teach .ph{border-radius:12rem 12rem var(--rad) var(--rad);overflow:hidden;margin-bottom:1.1rem;box-shadow:var(--shadow)}
.teach .ph img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/5}
.teach h3,.teach h2{font:400 1.4rem/1.2 var(--ff-d);margin:0 0 .2rem}
.teach .role{color:var(--sage);font-size:.82rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.teach p{color:var(--mut);font-size:.92rem;margin:.6rem 0 0}
.tchips{display:flex;gap:.4rem;justify-content:center;flex-wrap:wrap;margin-top:.8rem}
.tchips span{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:var(--cream);border:1px solid var(--line);border-radius:99px;padding:.25rem .7rem;color:var(--mut)}

/* quote */
.quote{max-width:42rem;margin:0 auto;text-align:center}
.quote blockquote{font:400 clamp(1.5rem,3vw,2.1rem)/1.45 var(--ff-d);margin:0 0 1.2rem;color:var(--ink)}
.quote cite{font-style:normal;font-size:.85rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mut);font-weight:700}

/* pricing */
.prices{display:grid;grid-template-columns:repeat(4,1fr);gap:1.3rem;align-items:stretch}
.price{background:var(--cream);border:1px solid var(--line);border-radius:var(--rad);padding:1.7rem 1.5rem;text-align:center;display:flex;flex-direction:column}
.price.hl{background:var(--sage);border-color:var(--sage);color:#fff}
.price .n{font-size:.76rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--mut);margin-bottom:.8rem}
.price.hl .n{color:var(--accent-soft)}
.price .pr{font:400 2.2rem/1 var(--ff-d);margin-bottom:.3rem}
.price .per{font-size:.82rem;color:var(--mut);margin-bottom:1rem}
.price.hl .per{color:var(--accent-soft)}
.price p{font-size:.88rem;color:var(--mut);margin:0 0 1.2rem;flex:1}
.price.hl p{color:var(--accent-soft)}
.price .btn{width:100%}
.price.hl .btn{background:#fff;color:var(--sage-d);border-color:#fff}

/* forms */
.form-card{background:var(--cream);border:1px solid var(--line);border-radius:var(--rad);padding:2rem;box-shadow:var(--shadow)}
.form-card label{display:block;font-size:.76rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--mut);margin:1.1rem 0 .35rem}
.form-card label:first-of-type{margin-top:0}
.form-card input,.form-card select,.form-card textarea{width:100%;font:inherit;padding:.8rem .95rem;border:1px solid var(--line2);border-radius:12px;background:var(--panel);color:var(--ink)}
.form-card input:focus,.form-card select:focus,.form-card textarea:focus{outline:2px solid var(--sage);outline-offset:1px;border-color:var(--sage)}
.form-card button{margin-top:1.4rem;width:100%}
.form-note{font-size:.8rem;color:var(--mut);margin-top:.9rem;text-align:center}
.toast{display:none;background:var(--ok-bg);border:1px solid var(--ok-line);color:var(--ok-ink);border-radius:12px;padding:.9rem 1.1rem;font-size:.95rem;margin-bottom:1.2rem}
.toast.on{display:flex;gap:.6rem;align-items:center}

/* panels + faq */
.panel{background:var(--cream);border:1px solid var(--line);border-radius:var(--rad);padding:1.6rem}
.panel h3,.panel h2{font:400 1.25rem/1.2 var(--ff-d);margin:0 0 .9rem;display:flex;gap:.6rem;align-items:center}
.panel h3 svg,.panel h2 svg{color:var(--sage)}
.panel p{margin:.2rem 0;font-size:.95rem;color:var(--mut)}
.panel p b{color:var(--ink)}
.hours{margin:0;padding:0;list-style:none;font-size:.94rem}
.hours li{display:flex;justify-content:space-between;padding:.5rem 0;border-bottom:1px dashed var(--line2)}
.hours li:last-child{border:0}
details.faq{background:var(--cream);border:1px solid var(--line);border-radius:14px;padding:1.05rem 1.3rem;margin-bottom:.8rem}
details.faq summary{font-weight:700;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1rem;list-style:none}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary:after{content:"+";font:400 1.5rem/1 var(--ff-d);color:var(--sage);transition:transform .2s}
details.faq[open] summary:after{transform:rotate(45deg)}
details.faq p{color:var(--mut);margin:.7rem 0 0;font-size:.95rem}

/* split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
.split .ph{border-radius:var(--rad);overflow:hidden;box-shadow:var(--shadow)}
.split .ph img{width:100%;height:100%;object-fit:cover}

/* footer */
footer{background:var(--foot-bg);color:var(--foot-mut)}
.foot-in{max-width:70rem;margin:0 auto;padding:3.2rem 1.4rem 1.4rem;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2.4rem}
.foot-in .fh{color:var(--foot-ink);font:400 1.05rem var(--ff-d);margin:0 0 .9rem;letter-spacing:.04em}
.foot-in .fb{font:400 1.4rem/1 var(--ff-d);color:var(--foot-ink);margin-bottom:.8rem;display:block;text-decoration:none}
.foot-in p{font-size:.92rem;margin:0;max-width:22rem}
.foot-in ul{margin:0;padding:0;list-style:none;font-size:.94rem}
.foot-in li{padding:.28rem 0}
.foot-in a{color:var(--foot-mut);text-decoration:none}
.foot-in a:hover{color:var(--foot-ink)}
.foot-bar{border-top:1px solid var(--foot-line);text-align:center;font-size:.82rem;padding:1.2rem;color:var(--foot-faint)}
.foot-bar a{color:var(--foot-mut)}

/* reveal */
.js .rev{opacity:0;transform:translateY(16px);transition:opacity .8s ease,transform .8s ease}
.js .rev.in{opacity:1;transform:none}
.js .rev.d1{transition-delay:.1s}.js .rev.d2{transition-delay:.2s}.js .rev.d3{transition-delay:.3s}
@media(prefers-reduced-motion:reduce){.js .rev{opacity:1;transform:none;transition:none}}

/* responsive */
@media(max-width:960px){
  .hero .in{grid-template-columns:1fr;gap:2.6rem}
  .trio,.cards3,.teachers{grid-template-columns:1fr 1fr}
  .prices{grid-template-columns:1fr 1fr}
  .split{grid-template-columns:1fr;gap:2.2rem}
  .foot-in{grid-template-columns:1fr 1fr}
  .srow{grid-template-columns:5rem 1fr;gap:.4rem 1rem}
  .srow .who{grid-column:2}
}
@media(max-width:700px){
  .navlinks{display:none;position:absolute;top:100%;left:0;right:0;background:var(--sand);border-bottom:1px solid var(--line);flex-direction:column;gap:0;padding:.6rem 1.4rem 1rem;align-items:flex-start}
  .navlinks.open{display:flex}
  .navlinks a{padding:.7rem 0;width:100%;border-bottom:1px solid var(--line)}
  .navlinks a:last-child{border-bottom:0}
  .nav-cta{text-align:center;margin-top:.5rem;width:100%}
  .burger{display:block}
  .trio,.cards3,.teachers,.prices{grid-template-columns:1fr}
  .foot-in{grid-template-columns:1fr}
}

/* ---- colour themes + dark mode ---- */
[data-theme="clay"]{--sand:#f4ede4;--cream:#fbf6f0;--sage:#b0674a;--sage-d:#8e4f36;--ink:#33281f;--mut:#7d685a;--line:#e7dacc;--line2:#d9c6b3;--accent-soft:#f0d9cd;--nav-bg:rgba(244,237,228,.9);--float-bg:rgba(251,246,240,.92);--foot-bg:#2b211a;--foot-mut:#cdbba9;--foot-faint:#a08d7a;--foot-line:#453629;--shadow:0 24px 60px rgba(51,40,31,.14)}
[data-theme="mist"]{--sand:#edf1f2;--cream:#f9fbfb;--sage:#54788a;--sage-d:#41616e;--ink:#26333a;--mut:#64757e;--line:#dbe3e6;--line2:#c8d4d9;--gold:#b7a06b;--accent-soft:#d8e4e9;--nav-bg:rgba(237,241,242,.9);--float-bg:rgba(249,251,251,.92);--foot-bg:#223036;--foot-mut:#b4c2c8;--foot-faint:#8698a0;--foot-line:#35464e;--shadow:0 24px 60px rgba(38,51,58,.14)}
[data-theme="dark"]{--sand:#151a16;--cream:#1e2620;--panel:#242c26;--ink:#e7ece5;--mut:#a0ab9c;--sage:#8fb29a;--sage-d:#75957e;--line:#2a332c;--line2:#3a463c;--gold:#d4b57e;--accent-soft:#cfdcd0;--nav-bg:rgba(21,26,22,.9);--float-bg:rgba(30,38,32,.92);--foot-bg:#0f1410;--foot-ink:#eef2ec;--ok-bg:#1b2a1f;--ok-line:#2f4a37;--ok-ink:#abd8b6;--shadow:0 24px 60px rgba(0,0,0,.55)}
[data-theme="dark"] .btn{color:#131813}
[data-theme="dark"] .btn.ghost{color:var(--ink)}
[data-theme="dark"] .btn.ink{background:var(--cream);border-color:var(--line2);color:var(--ink)}
[data-theme="dark"] .nav-cta{color:#131813!important}
[data-theme="dark"] .dtabs button.on{color:#131813}
[data-theme="dark"] .band.sage{background:#232f27;border-color:#2c3b31}
[data-theme="dark"] .price.hl{background:#232f27;border-color:#2c3b31}
[data-theme="dark"] .price.hl .btn{background:var(--sage);color:#131813;border-color:var(--sage)}
