@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,400&family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;0,9..144,700;0,9..144,800;1,9..144,400;1,9..144,600&display=swap');

:root {
  --brand-teal:  #2D6F8A;
  --brand-teal-light: #E8F3F8;
  --sage:        #4A7C6B;
  --sage-dark:   #3A6359;
  --sage-light:  #EBF2EE;
  --sage-bg:     #EBF2EE;
  --coral:       #E07060;
  --coral-dark:  #B85A4D;
  --coral-light: #FDEEED;
  --coral-bg:    #FDEEED;
  --cream:       #FDF8F0;
  --cream-dark:  #F4EDE3;
  --gold:        #C9952A;
  --gold-light:  #FDF6E8;
  --gold-bg:     #FDF6E8;
  --lav:         #9B8EC4;
  --lav-light:   #EEEAF6;
  --sky:         #6BA8C4;
  --sky-light:   #E8F3F8;
  --ink:         #2C2A27;
  --mid:         #56514A;
  --muted:       #6B7280;
  --faint:       #b8b0a4;
  --white:       #ffffff;
  --border:      #E4DDD4;
  --radius:      18px;
  --radius-sm:   12px;
  --shadow-xs:   0 1px 3px rgba(0,0,0,.03);
  --shadow-sm:   0 2px 10px rgba(0,0,0,.05);
  --shadow:      0 4px 24px rgba(0,0,0,.07);
  --shadow-lg:   0 12px 48px rgba(0,0,0,.10);
  --shadow-cozy: 0 4px 20px rgba(44, 42, 39, .06);
  --shadow-cozy-lift: 0 10px 34px rgba(44, 42, 39, .10);
  --radius-soft: 20px;
  --radius-blob: 28px 22px 26px 20px;
  --accent: #2D6F8A;
  --hairline: #EAE2D4;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;background-color:var(--cream);color-scheme:light}
body{
  font-family:'DM Sans',sans-serif;
  color:var(--ink);background:var(--cream);
  line-height:1.72;min-height:100vh;
  display:flex;flex-direction:column;
  -webkit-font-smoothing:antialiased;
}
body::after{
  content:none;display:none;opacity:0;background-image:none;
}
h1,h2,h3,h4{font-family:'Fraunces',serif;font-weight:600;letter-spacing:-.3px;line-height:1.2}
a{color:var(--brand-teal);text-decoration:none;transition:color .2s}
a:hover{color:var(--coral)}
img{max-width:100%;display:block}

/* ── Skip ── */
.skip{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip:focus{left:12px;top:12px;width:auto;height:auto;padding:10px 16px;border-radius:10px;background:var(--white);border:1px solid var(--border);box-shadow:var(--shadow);z-index:9999}

/* ══════════════════════════════
   HEADER
══════════════════════════════ */
.header,
.site-header{
  position:sticky;top:0;z-index:100;
  background:rgba(250,248,244,.88);
  backdrop-filter:saturate(160%) blur(18px);
  -webkit-backdrop-filter:saturate(160%) blur(18px);
  border-bottom:1px solid var(--border);
}
.header-inner,
.bar{
  max-width:1200px;margin:0 auto;padding:10px 24px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0}
.brand-logo,
.brand img{display:none}
.brand-text .name{font-family:'Fraunces',serif;font-weight:800;font-size:16px;color:var(--brand-teal)}
.brand-text .tag{font-size:10px;color:var(--muted);margin-top:1px}

.nav{display:flex;flex-wrap:wrap;gap:2px;justify-content:center}
.nav a{
  font-size:11px;font-weight:600;color:var(--mid);
  padding:5px 9px;border-radius:8px;
  border:1px solid transparent;transition:all .2s;
}
.nav a:hover{background:var(--brand-teal-light);border-color:var(--brand-teal-light);color:var(--brand-teal)}
.nav a.active{background:var(--brand-teal);color:#fff;border-color:var(--brand-teal)}
.nav a:focus-visible{outline:2px solid var(--brand-teal);outline-offset:1px}

.header-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}
.btn-login{
  font-size:11.5px;font-weight:600;color:var(--mid);
  border:1px solid var(--border);border-radius:22px;
  padding:5px 14px;background:var(--white);
  transition:all .2s;cursor:pointer;
}
.btn-login:hover{border-color:var(--brand-teal);color:var(--brand-teal);background:var(--brand-teal-light)}
.btn-join{
  font-size:11.5px;font-weight:700;
  background:var(--coral);color:#fff;
  border:none;border-radius:22px;
  padding:6px 16px;cursor:pointer;
  transition:all .2s;box-shadow:0 2px 8px rgba(232,112,106,.3);
}
.btn-join:hover{background:var(--coral-dark);transform:translateY(-1px);box-shadow:0 4px 12px rgba(224,112,96,.28)}

.lang-sw{
  border:1px solid var(--border);background:var(--white);
  border-radius:22px;padding:3px 4px;
  display:inline-flex;align-items:center;gap:3px;
  cursor:pointer;box-shadow:var(--shadow-xs);flex-shrink:0;
  position:relative;
}
.ll{font-size:10px;font-weight:700;color:var(--muted);padding:3px 7px;border-radius:18px;transition:all .2s;z-index:1}
.lk{
  width:16px;height:16px;border-radius:50%;
  background:var(--brand-teal);box-shadow:0 2px 6px rgba(45,111,138,.24);
  transition:transform .25s cubic-bezier(.4,0,.2,1);
  position:absolute;left:5px;
}
.lang-sw.en .lk{transform:translateX(26px)}
.lang-sw:not(.en) .ll.t{color:var(--brand-teal);background:var(--brand-teal-light)}
.lang-sw.en .ll.e{color:var(--brand-teal);background:var(--brand-teal-light)}

.lang {
  align-items: center;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 22px;
  box-shadow: var(--shadow-xs);
  color: var(--muted);
  cursor: pointer;
  display: inline-flex;
  flex-shrink: 0;
  gap: 4px;
  padding: 4px 6px;
}

.lang span {
  border-radius: 16px;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  padding: 5px 8px;
}

.lang:not(.en) span:first-child,
.lang.en span:last-child {
  background: var(--sage-bg);
  color: var(--sage-dark);
}

/* ══════════════════════════════
   MAIN LAYOUT
══════════════════════════════ */
main{flex:1;max-width:1200px;margin:0 auto;padding:32px 24px 72px;width:100%}
.sec{margin-top:32px}
.pt{margin-bottom:24px}
.pt h1{font-size:clamp(1.8rem,4vw,2.6rem);margin-bottom:8px}
.pt .sub{color:var(--mid);max-width:680px;line-height:1.65;font-size:.93rem}

/* ══════════════════════════════
   HERO — HOMEPAGE SPECIAL
══════════════════════════════ */
.hero-home{
  background:linear-gradient(135deg,rgba(122,158,126,.07),rgba(200,220,201,.04),rgba(250,248,244,0));
  border:1px solid var(--border);border-radius:var(--radius);
  overflow:hidden;box-shadow:var(--shadow-lg);margin-bottom:28px;
  position:relative;
}
.hero-home::before{
  content:'';position:absolute;top:-60px;right:-60px;
  width:340px;height:340px;border-radius:50%;
  background:radial-gradient(circle,rgba(122,158,126,.10),transparent 70%);
  pointer-events:none;
}
.hero-home::after{
  content:'';position:absolute;bottom:-80px;left:20%;
  width:280px;height:280px;border-radius:50%;
  background:radial-gradient(circle,rgba(212,168,83,.07),transparent 70%);
  pointer-events:none;
}
.hero-home-inner{
  display:grid;grid-template-columns:1.4fr 1fr;
  gap:24px;padding:40px 36px;align-items:center;
  position:relative;z-index:1;
}
.hero-home h1{
  font-size:clamp(1.9rem,3.5vw,2.8rem);
  line-height:1.12;margin-bottom:14px;
}
.hero-home h1 em{
  font-style:italic;color:var(--brand-teal);
}
.hero-home .hero-sub{
  color:var(--mid);font-size:.95rem;
  line-height:1.7;margin-bottom:22px;max-width:520px;
}
.hero-home .hero-tag{
  display:inline-flex;align-items:center;gap:6px;
  background:var(--sage-bg);border:1px solid var(--sage-light);
  border-radius:100px;padding:5px 12px;
  font-size:.73rem;font-weight:700;color:var(--sage-dark);
  text-transform:uppercase;letter-spacing:.5px;margin-bottom:18px;
}
.hero-home .hero-tag > span:first-child{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--sage);animation:pulse 2s infinite;flex:0 0 6px}

/* Standard hero banners (inner pages) */
.hero{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);margin-bottom:24px}
.hero-inner{display:grid;grid-template-columns:1.3fr .7fr;gap:18px;padding:28px 32px;align-items:center}
.hero h2{font-size:clamp(1.3rem,2.5vw,1.7rem);margin-bottom:10px}
.hero p{color:var(--mid);font-size:.9rem;line-height:1.65}
.hero-sage{background:linear-gradient(135deg,rgba(122,158,126,.07),rgba(200,220,201,.09))}
.hero-coral{background:linear-gradient(135deg,rgba(232,112,106,.05),rgba(247,196,193,.08))}
.hero-gold{background:linear-gradient(135deg,rgba(212,168,83,.05),rgba(245,230,192,.08))}
.hero-lav{background:linear-gradient(135deg,rgba(165,147,194,.05),rgba(228,221,240,.08))}

/* ══════════════════════════════
   CARDS & GRIDS
══════════════════════════════ */
.g{display:grid;gap:16px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}

.card{
  background:var(--white);border:1px solid var(--border);
  border-radius:var(--radius);padding:20px;
  box-shadow:var(--shadow-xs);
  transition:transform .22s,box-shadow .22s;
}
.card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.card h4{font-size:.98rem;margin-bottom:6px}
.card p{font-size:.84rem;color:var(--mid);line-height:1.6}
.clean-list{margin-top:12px;padding-left:18px;color:var(--mid);font-size:.84rem;line-height:1.7}
.clean-list li{margin:4px 0}

/* Coloured top-border cards */
.ct  {border-top:3px solid var(--sage)}
.ct-c{border-top:3px solid var(--coral)}
.ct-g{border-top:3px solid var(--gold)}
.ct-l{border-top:3px solid var(--lav)}
.ct-s{border-top:3px solid var(--sky)}

/* Highlighted card */
.highlight{
  background:linear-gradient(135deg,var(--sage-bg),rgba(238,244,239,.4));
  border:1.5px solid var(--sage-light);border-radius:var(--radius);
  padding:24px 28px;
}

.form-card{
  background:var(--white);border:1px solid var(--border);
  border-radius:var(--radius);padding:22px;box-shadow:var(--shadow-sm);
}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.form-full{grid-column:1/-1}
.form-field{display:flex;flex-direction:column;gap:6px}
.form-field span,.check-row span:first-child{font-size:.74rem;font-weight:800;color:var(--mid);text-transform:uppercase;letter-spacing:.04em}
.form-field input,.form-field select,.form-field textarea{
  width:100%;border:1px solid var(--border);border-radius:12px;background:var(--cream);
  color:var(--ink);font:inherit;font-size:.9rem;padding:10px 12px;outline:none;
}
.form-field textarea{min-height:96px;resize:vertical}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:var(--brand-teal);box-shadow:0 0 0 3px rgba(45,111,138,.14)}
.check-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.check-row{
  display:flex;align-items:flex-start;gap:8px;border:1px solid var(--border);
  border-radius:12px;background:var(--cream);padding:10px 12px;font-size:.84rem;color:var(--mid);
}
.check-row input{margin-top:3px}
.form-honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.form-status{min-height:22px;font-size:.86rem;font-weight:700;color:var(--mid)}
.form-status.success{color:var(--sage-dark)}
.form-status.error{color:var(--coral-dark)}

/* Info card */
.info-card{
  background:var(--white);border:1px solid var(--border);
  border-radius:var(--radius-sm);padding:16px 18px;
  display:flex;align-items:flex-start;gap:12px;
}
.info-card .ic-icon{font-size:1.4rem;flex-shrink:0;margin-top:2px}

/* ══════════════════════════════
   BADGES & TAGS
══════════════════════════════ */
.badge{
  display:inline-flex;align-items:center;gap:6px;
  background:var(--cream-dark);border:1px solid var(--border);
  border-radius:100px;padding:4px 10px;
  font-size:.72rem;font-weight:700;color:var(--mid);
  margin-bottom:10px;
}
.dot{width:7px;height:7px;border-radius:50%;display:inline-block}
.d-sage{background:var(--sage)}
.d-coral{background:var(--coral)}
.d-gold{background:var(--gold)}
.d-lav{background:var(--lav)}
.d-sky{background:var(--sky)}

.tag-pill{
  display:inline-flex;align-items:center;gap:5px;
  border-radius:100px;padding:3px 10px;
  font-size:.7rem;font-weight:700;
}
.tp-sage{background:var(--sage-bg);color:var(--sage-dark);border:1px solid var(--sage-light)}
.tp-coral{background:var(--coral-bg);color:var(--coral-dark);border:1px solid var(--coral-light)}
.tp-gold{background:var(--gold-bg);color:#8a6a1f;border:1px solid var(--gold-light)}
.tp-lav{background:var(--lav-light);color:#5a4180;border:1px solid var(--lav)}
.tp-sky{background:var(--sky-light);color:#2d6a94;border:1px solid var(--sky)}

/* ══════════════════════════════
   BUTTONS
══════════════════════════════ */
.btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.btn{
  display:inline-flex;align-items:center;gap:6px;
  border:1.5px solid var(--border);border-radius:100px;
  padding:8px 18px;font-size:.83rem;font-weight:600;
  color:var(--mid);background:var(--white);
  transition:all .2s;cursor:pointer;
}
.btn:hover{border-color:var(--brand-teal);background:var(--brand-teal-light);color:var(--brand-teal)}
.btn-p{
  background:var(--brand-teal);color:#fff;border-color:var(--brand-teal);
  box-shadow:0 2px 8px rgba(45,111,138,.24);
}
.btn-p:hover{background:var(--sage-dark);border-color:var(--sage-dark);color:#fff;box-shadow:0 4px 12px rgba(45,111,138,.24);transform:translateY(-1px)}
.btn-coral{background:var(--coral);color:#fff;border-color:var(--coral);box-shadow:0 2px 8px rgba(224,112,96,.24)}
.btn-coral:hover{background:var(--coral-dark);border-color:var(--coral-dark);color:#fff;transform:translateY(-1px)}
.btn-lg{padding:11px 26px;font-size:.93rem}

/* ══════════════════════════════
   SECTION LABELS
══════════════════════════════ */
.sec-label{
  font-size:.71rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.7px;color:var(--sage-dark);
  display:flex;align-items:center;gap:8px;margin-bottom:10px;
}
.sec-label::after{content:'';flex:1;height:1px;background:var(--sage-light)}
h2.sec-h{font-size:clamp(1.35rem,2.5vw,1.9rem);margin-bottom:8px}
p.desc{color:var(--mid);font-size:.9rem;line-height:1.65;max-width:680px;margin-bottom:20px}

/* ══════════════════════════════
   MEMBERSHIP TIERS
══════════════════════════════ */
.tier-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:20px}
.tier-card{
  border:2px solid var(--border);border-radius:var(--radius);
  padding:20px 16px 18px;background:var(--white);
  display:flex;flex-direction:column;
  transition:transform .22s,box-shadow .22s,border-color .22s;
  position:relative;
}
.tier-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.tier-card.featured{border-color:var(--sage);box-shadow:0 0 0 1px var(--sage)}
.tier-badge{
  position:absolute;top:-1px;left:50%;transform:translateX(-50%);
  background:var(--sage);color:#fff;
  font-size:.65rem;font-weight:700;letter-spacing:.4px;text-transform:uppercase;
  padding:3px 12px;border-radius:0 0 10px 10px;
}
.tier-icon{font-size:1.6rem;margin-bottom:10px}
.tier-name{font-family:'Fraunces',serif;font-weight:700;font-size:.9rem;margin-bottom:4px}
.tier-price{font-family:'Fraunces',serif;font-size:1.5rem;font-weight:800;color:var(--ink);line-height:1}
.tier-price span{font-size:.72rem;font-weight:500;color:var(--muted);font-family:'DM Sans',sans-serif}
.tier-desc{font-size:.75rem;color:var(--mid);line-height:1.5;margin:8px 0 12px;flex:1}
.tier-features{list-style:none;font-size:.72rem;color:var(--mid);line-height:1.6}
.tier-features li{padding:3px 0;border-bottom:1px solid var(--cream-dark);display:flex;align-items:flex-start;gap:5px}
.tier-features li:last-child{border:none}
.tier-features li::before{content:'✓';color:var(--sage);font-weight:700;flex-shrink:0;margin-top:1px}

/* ══════════════════════════════
   TESTIMONIALS
══════════════════════════════ */
.testimonial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px}
.testimonial{
  background:var(--white);border:1px solid var(--border);
  border-radius:var(--radius);padding:22px;
  box-shadow:var(--shadow-xs);position:relative;
}
.testimonial::before{
  content:'\201C';font-family:'Fraunces',serif;
  font-size:4rem;color:var(--sage-light);line-height:1;
  position:absolute;top:10px;left:16px;
}
.testimonial .t-text{
  font-size:.88rem;color:var(--mid);line-height:1.65;
  margin-top:18px;font-style:italic;
}
.testimonial .t-author{
  margin-top:14px;font-size:.78rem;font-weight:600;
  color:var(--ink);
}
.testimonial .t-role{font-size:.72rem;color:var(--muted)}

/* ══════════════════════════════
   STATS ROW
══════════════════════════════ */
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:24px}
.stat{
  text-align:center;padding:20px 12px;
  border:1px solid var(--border);border-radius:var(--radius);
  background:var(--white);box-shadow:var(--shadow-xs);
}
.stat .s-num{font-family:'Fraunces',serif;font-size:2rem;font-weight:800;color:var(--sage);line-height:1}
.stat .s-label{font-size:.76rem;color:var(--muted);margin-top:4px;font-weight:500}

/* ══════════════════════════════
   OPEN HOURS
══════════════════════════════ */
.hours-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.hours-card{
  background:var(--white);border:1px solid var(--border);
  border-radius:var(--radius);padding:20px;
}
.hours-card h4{font-size:1rem;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.hours-row{display:flex;justify-content:space-between;align-items:center;padding:6px 0;border-bottom:1px solid var(--cream-dark);font-size:.83rem}
.hours-row:last-child{border:none}
.hours-row .day{color:var(--mid)}
.hours-row .time{font-weight:600;color:var(--ink)}

/* ══════════════════════════════
   LOCATION MAP PLACEHOLDER
══════════════════════════════ */
.map-placeholder{
  background:var(--sage-bg);border:1px solid var(--sage-light);
  border-radius:var(--radius);padding:32px;
  text-align:center;color:var(--sage-dark);
  font-weight:600;font-size:.9rem;
}
.branch-contact-actions{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;margin:12px 0 14px;
}
.branch-contact-action{
  display:flex;align-items:center;gap:10px;
  border:1px solid var(--border);border-radius:14px;
  padding:10px 12px;background:var(--white);
  color:var(--ink);box-shadow:var(--shadow-xs);
}
.branch-contact-action:hover{
  border-color:var(--sage-light);background:var(--sage-bg);color:var(--sage-dark);
}
.branch-contact-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:28px;height:28px;border-radius:999px;
  background:var(--gold-bg);color:#7a5a0a;
  font-size:.85rem;font-weight:800;flex-shrink:0;
}
.branch-contact-action strong{display:block;font-size:.82rem}
.branch-contact-action small{display:block;margin-top:2px;color:var(--muted);font-size:.72rem;line-height:1.25}

/* ══════════════════════════════
   DIFF CARDS (six things)
══════════════════════════════ */
.diff-card{
  background:var(--white);border:1px solid var(--border);
  border-radius:var(--radius);padding:20px;
  border-top:3px solid;box-shadow:var(--shadow-xs);
  transition:transform .2s,box-shadow .2s;
}
.diff-card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.diff-card .dc-icon{font-size:1.6rem;margin-bottom:10px}
.diff-card h4{font-size:.95rem;margin-bottom:6px}
.diff-card p{font-size:.82rem;color:var(--mid);line-height:1.6}

/* ══════════════════════════════
   CATEGORY BANNER
══════════════════════════════ */
.category-banner{
  background:linear-gradient(135deg,rgba(44,44,44,.03),rgba(122,158,126,.05));
  border:1.5px solid var(--border);border-radius:var(--radius);
  padding:28px 32px;margin-top:28px;
  display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;
}
.category-banner h3{font-size:1.15rem;margin-bottom:6px}
.category-banner p{font-size:.87rem;color:var(--mid);line-height:1.65}
.cb-quote{
  font-family:'Fraunces',serif;font-size:2rem;font-weight:800;
  color:var(--sage);line-height:1;text-align:center;min-width:90px;
}
.cb-quote span{font-size:.65rem;font-family:'DM Sans',sans-serif;font-weight:700;color:var(--muted);display:block;text-transform:uppercase;letter-spacing:.5px;margin-top:5px}

/* ══════════════════════════════
   MISSION BAR
══════════════════════════════ */
.mission-bar{
  background:linear-gradient(135deg,var(--sage-bg),var(--cream-dark));
  border:1px solid var(--sage-light);border-radius:var(--radius);
  padding:22px 28px;margin-bottom:28px;text-align:center;
}
.mission-bar .mb-top{
  font-family:'Fraunces',serif;font-size:clamp(1.1rem,2.5vw,1.4rem);
  font-weight:600;color:var(--ink);margin-bottom:8px;line-height:1.3;
}
.mission-bar .mb-sub{font-size:.88rem;color:var(--mid);max-width:620px;margin:0 auto;line-height:1.65}

/* ══════════════════════════════
   FOOTER
══════════════════════════════ */
footer{
  background:var(--ink);color:rgba(255,255,255,.65);
  padding:48px 0 28px;margin-top:auto;
}
.footer-inner{
  max-width:1200px;margin:0 auto;padding:0 24px;
  display:grid;grid-template-columns:1.6fr .9fr .9fr .9fr 1.45fr;gap:28px;
}
.footer-brand{
  font-family:'Fraunces',serif;font-weight:700;font-size:1.15rem;
  color:#fff;margin-bottom:10px;
}
.footer-note{font-size:.82rem;line-height:1.65;max-width:280px}
.footer-col h5{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:rgba(255,255,255,.4);margin-bottom:12px}
.footer-col a{display:block;font-size:.82rem;color:rgba(255,255,255,.6);margin-bottom:6px;transition:color .2s}
.footer-col a:hover{color:#fff}
.footer-branches{display:flex;flex-direction:column;gap:8px}
.footer-branch-row{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:7px 8px;border:1px solid rgba(255,255,255,.08);
  border-radius:12px;background:rgba(255,255,255,.035);
}
.footer-branch-label,
.footer-main-social,
.footer-branch-actions a{
  display:inline-flex;align-items:center;gap:6px;
}
.footer-branch-label{font-size:.82rem;color:rgba(255,255,255,.78);font-weight:700}
.footer-branch-actions{display:flex;align-items:center;gap:5px;flex-shrink:0}
.footer-branch-actions a,
.footer-main-social{
  width:auto;margin:0;border-radius:999px;
  color:rgba(255,255,255,.68);
}
.footer-branch-actions a{
  padding:5px 7px;background:rgba(255,255,255,.06);
  font-size:.7rem;font-weight:700;
}
.footer-branch-actions a:hover,
.footer-main-social:hover{color:#fff;background:rgba(255,255,255,.1)}
.footer-main-social{
  padding:4px 2px;font-size:.78rem;
}
.footer-branch-label svg,
.footer-branch-actions svg,
.footer-main-social svg{
  width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;
}
.footer-main-social svg rect,
.footer-main-social svg circle,
.footer-branch-actions svg rect,
.footer-branch-actions svg circle{stroke:currentColor}
.footer-bottom{
  max-width:1200px;margin:32px auto 0;padding:20px 24px 0;
  border-top:1px solid rgba(255,255,255,.08);
  display:flex;justify-content:space-between;align-items:center;
  font-size:.76rem;color:rgba(255,255,255,.35);flex-wrap:wrap;gap:8px;
}
.footer-bottom a{color:rgba(255,255,255,.4)}
.footer-bottom a:hover{color:rgba(255,255,255,.7)}

/* ══════════════════════════════
   FADE-IN ANIMATION
══════════════════════════════ */
.fi{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s ease}
.fi.visible{opacity:1;transform:none}
.fi-d1{transition-delay:.05s}
.fi-d2{transition-delay:.1s}
.fi-d3{transition-delay:.15s}
.fi-d4{transition-delay:.2s}

@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

/* ══════════════════════════════
   LANGUAGE TOGGLE
══════════════════════════════ */
.en-only,
.en-only-b,
.en-only-flex,
[lang='en'] .tr-only,
[lang='en'] .tr-only-b,
[lang='en'] .tr-only-flex {
  display: none !important;
}

.tr-only {
  display: inline;
}

.tr-only-b {
  display: block;
}

.tr-only-flex {
  display: flex;
}

[lang='en'] .en-only {
  display: inline !important;
}

[lang='en'] .en-only-b {
  display: block !important;
}

[lang='en'] .en-only-flex {
  display: flex !important;
}

/* ══════════════════════════════
   RESPONSIVE
══════════════════════════════ */
@media(max-width:1080px){
  .tier-grid{grid-template-columns:repeat(3,1fr)}
  .footer-inner{grid-template-columns:1fr 1fr}
}
@media(max-width:920px){
  .hero-home-inner,.hero-inner{grid-template-columns:1fr}
  .stats-row{grid-template-columns:repeat(2,1fr)}
  .testimonial-grid,.g3{grid-template-columns:1fr 1fr}
  .tier-grid{grid-template-columns:repeat(2,1fr)}
  .category-banner{grid-template-columns:1fr}
}
@media(max-width:680px){
  .g2,.g3,.g4,.g{grid-template-columns:1fr}
  .branch-contact-actions{grid-template-columns:1fr}
  .stats-row{grid-template-columns:repeat(2,1fr)}
  .testimonial-grid{grid-template-columns:1fr}
  .hours-grid{grid-template-columns:1fr}
  .tier-grid{grid-template-columns:1fr 1fr}
  .footer-inner{grid-template-columns:1fr}
  .nav{display:none}
  main{padding:20px 16px 56px}
  .hero-home-inner{padding:24px 20px}
  .header-inner{padding:10px 16px}
}
@media(max-width:420px){
  .tier-grid{grid-template-columns:1fr}
}

/* ══════════════════════════════
   MOBILE NAV DRAWER
══════════════════════════════ */
.hamburger{
  display:none;flex-direction:column;gap:4px;
  background:none;border:none;cursor:pointer;padding:8px;
}
.hamburger span{display:block;width:20px;height:2px;background:var(--ink);border-radius:2px;transition:all .2s}
@media(max-width:680px){.hamburger{display:flex}}
.mobile-nav{
  display:none;position:fixed;inset:0;z-index:200;
  background:rgba(44,44,44,.5);backdrop-filter:blur(4px);
}
.mobile-nav.open{display:block}
.mobile-nav-inner{
  position:absolute;right:0;top:0;bottom:0;width:280px;
  background:var(--white);padding:24px;
  box-shadow:var(--shadow-lg);overflow-y:auto;
}
.nav-open{overflow:hidden}
.mobile-nav-brand{
  font-family:'Fraunces',serif;
  font-weight:700;
  padding:6px 42px 18px 4px;
  border-bottom:1px solid var(--border);
  margin-bottom:12px;
}
.mobile-nav-close{
  position:absolute;top:16px;right:16px;
  background:var(--cream-dark);border:none;border-radius:8px;
  width:32px;height:32px;cursor:pointer;font-size:1rem;
  display:flex;align-items:center;justify-content:center;
}
.mobile-nav-inner .nav-links a{
  display:block;padding:10px 12px;border-radius:10px;
  font-size:.9rem;font-weight:600;color:var(--mid);
  border-bottom:1px solid var(--border);
  transition:background .15s;
}
.mobile-nav-inner .nav-links a:hover{background:var(--sage-bg)}
.mobile-nav-inner .nav-links a.active{color:var(--sage-dark)}
.mobile-nav-actions{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  margin-top:18px;
  padding-top:16px;
  border-top:1px solid var(--border);
}

/* App store badges placeholder */
.app-cta{
  display:flex;align-items:center;gap:10px;
  background:var(--ink);color:#fff;border-radius:var(--radius);
  padding:20px 24px;
}
.app-cta .ac-text h4{color:#fff;margin-bottom:4px}
.app-cta .ac-text p{font-size:.83rem;color:rgba(255,255,255,.6);line-height:1.5}
.app-cta-icon{font-size:2.5rem;flex-shrink:0}

/* Membership CTA banner */
.join-banner{
  background:var(--brand-teal);
  border-radius:var(--radius);padding:36px 40px;
  color:#fff;display:grid;grid-template-columns:1fr auto;
  align-items:center;gap:24px;margin-top:32px;
  box-shadow:0 8px 32px rgba(45,111,138,.24);
}
.join-banner h2{color:#fff;font-size:clamp(1.3rem,2.5vw,1.9rem);margin-bottom:8px}
.join-banner p{color:rgba(255,255,255,.8);font-size:.9rem;line-height:1.6}
.btn-white{
  background:#fff;color:var(--sage-dark);border:none;
  border-radius:100px;padding:11px 26px;font-size:.9rem;font-weight:700;
  white-space:nowrap;transition:all .2s;box-shadow:0 4px 16px rgba(0,0,0,.12);
}
.btn-white:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(0,0,0,.15);color:var(--sage-dark)}
@media(max-width:640px){.join-banner{grid-template-columns:1fr;padding:24px 20px}}

/* ══════════════════════════════
   v8.1 DESIGN FIXES
══════════════════════════════ */

/* Fix: footer needs explicit dark background on all elements */
footer { background: #1e1e1e !important; color: rgba(255,255,255,.65) }
footer a { color: rgba(255,255,255,.6) }
footer a:hover { color: #fff }
.footer-brand { color: #fff }
.footer-col h5 { color: rgba(255,255,255,.38) }
.footer-bottom { color: rgba(255,255,255,.32) }
.footer-bottom a { color: rgba(255,255,255,.38) }
.footer-bottom a:hover { color: rgba(255,255,255,.7) }

/* Fix: hero-home needs min-height on mobile so content isn't crushed */
.hero-home { min-height: unset }
@media(max-width:680px) { .hero-home-inner { gap: 16px; padding: 20px 16px } }

/* Fix: tier-grid on medium screens */
@media(min-width:681px) and (max-width:920px) {
  .tier-grid { grid-template-columns: repeat(2,1fr) }
}

/* Fix: btn-white hover text colour */
.btn-white:hover { color: var(--sage-dark) !important }

/* Fix: join-banner on mobile */
@media(max-width:640px) {
  .join-banner { padding: 24px 20px; gap: 16px }
  .join-banner h2 { font-size: 1.3rem }
  .btn-white { width: 100%; text-align: center; display: block; padding: 12px }
}

/* ── DYNAMIC FEED SECTION ── */
.dynamic-section {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 24px 28px;
  margin-top: 28px;
}
.dynamic-section .ds-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 16px;
}
.dynamic-section .ds-header h3 { margin: 0; font-size: 1.05rem }
.dynamic-section .ds-header a { font-size: .8rem; font-weight: 600; color: var(--sage-dark) }
.dynamic-feed { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px }
@media(max-width:760px) { .dynamic-feed { grid-template-columns: 1fr 1fr } }
@media(max-width:480px) { .dynamic-feed { grid-template-columns: 1fr } }
.feed-card {
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  padding: 14px; background: var(--cream);
  transition: transform .18s, box-shadow .18s;
}
.feed-card:hover { transform: translateY(-2px); box-shadow: var(--shadow) }
.feed-card .fc-tag {
  font-size: .68rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .4px; color: var(--sage-dark);
  background: var(--sage-bg); border: 1px solid var(--sage-light);
  border-radius: 100px; padding: 2px 8px; display: inline-block; margin-bottom: 7px;
}
.feed-card .fc-tag.coral { color: var(--coral-dark); background: var(--coral-bg); border-color: var(--coral-light) }
.feed-card .fc-tag.gold  { color: #7a5a0a; background: var(--gold-bg); border-color: var(--gold-light) }
.feed-card h4 { font-size: .88rem; margin-bottom: 4px; line-height: 1.3 }
.feed-card .fc-meta { font-size: .76rem; color: var(--muted); margin-top: 6px }
.feed-card .fc-branch {
  font-size: .7rem; font-weight: 600; color: var(--mid);
  display: inline-flex; align-items: center; gap: 4px; margin-top: 8px;
}
.feed-empty {
  grid-column: 1 / -1; text-align: center; padding: 32px;
  color: var(--muted); font-size: .88rem;
}
.feed-loading { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: .85rem; padding: 20px 0 }
.feed-spinner {
  width: 18px; height: 18px; border: 2px solid var(--sage-light);
  border-top-color: var(--sage); border-radius: 50%;
  animation: spin .7s linear infinite; flex-shrink: 0;
}
@keyframes spin { to { transform: rotate(360deg) } }

/* ══════════════════════════════
   v9 DESIGN SYSTEM IMPROVEMENTS
══════════════════════════════ */

/* ── FORM INPUTS ── */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="date"],
input[type="number"],
textarea,
select {
  width: 100%;
  padding: 12px 14px;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--white);
  font-family: 'DM Sans', sans-serif;
  font-size: .95rem;
  color: var(--ink);
  line-height: 1.5;
  transition: all .2s;
  -webkit-appearance: none;
  appearance: none;
}

input[type="text"]::placeholder,
input[type="email"]::placeholder,
input[type="tel"]::placeholder,
textarea::placeholder {
  color: var(--muted);
  opacity: 1;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="date"]:focus,
input[type="number"]:focus,
textarea:focus,
select:focus {
  outline: none;
  border-color: var(--sage);
  box-shadow: 0 0 0 3px rgba(122,158,126,.1);
  background: var(--white);
}

textarea {
  resize: vertical;
  min-height: 110px;
}

select {
  cursor: pointer;
  padding-right: 36px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='%235a5a5a' d='M3 6l5 4 5-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 16px;
  padding-right: 38px;
}

/* ── FORM LABELS & STRUCTURE ── */
label {
  display: block;
  margin-bottom: 6px;
  font-weight: 600;
  font-size: .9rem;
  color: var(--ink);
}

.form-group {
  margin-bottom: 18px;
}

.form-group:last-child {
  margin-bottom: 0;
}

.form-hint {
  display: block;
  margin-top: 4px;
  font-size: .8rem;
  color: var(--muted);
}

.form-error {
  margin-top: 6px;
  font-size: .8rem;
  color: var(--coral);
}

/* ── BUTTON SYSTEM ── */
.btn,
button:not(.hamburger):not(.mobile-nav-close):not([class*="btn-"]),
input[type="submit"],
input[type="button"],
input[type="reset"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 24px;
  border: none;
  border-radius: 100px;
  font-family: 'DM Sans', sans-serif;
  font-weight: 700;
  font-size: .9rem;
  letter-spacing: .3px;
  cursor: pointer;
  transition: all .25s;
  text-decoration: none;
  white-space: nowrap;
  user-select: none;
  -webkit-user-select: none;
}

/* Primary button (sage) */
.btn-primary,
.btn,
button[type="submit"] {
  background: var(--sage);
  color: #fff;
  box-shadow: 0 4px 16px rgba(122,158,126,.25);
}

.btn-primary:hover,
.btn:hover,
button[type="submit"]:hover {
  background: var(--sage-dark);
  transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(122,158,126,.35);
}

.btn-primary:active,
.btn:active,
button[type="submit"]:active {
  transform: translateY(0);
}

/* Secondary button (outline) */
.btn-secondary {
  background: var(--white);
  color: var(--sage-dark);
  border: 1.5px solid var(--sage-light);
  box-shadow: var(--shadow-xs);
}

.btn-secondary:hover {
  background: var(--sage-bg);
  border-color: var(--sage);
  color: var(--sage);
  transform: translateY(-1px);
  box-shadow: var(--shadow-sm);
}

/* Tertiary button (text) */
.btn-tertiary {
  background: transparent;
  color: var(--sage-dark);
  padding: 8px 16px;
}

.btn-tertiary:hover {
  background: var(--sage-bg);
  transform: none;
}

/* Coral accent button */
.btn-coral {
  background: var(--coral);
  color: #fff;
  box-shadow: 0 4px 16px rgba(232,112,106,.25);
}

.btn-coral:hover {
  background: var(--coral-dark);
  transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(232,112,106,.35);
}

/* Small button */
.btn-sm {
  padding: 8px 16px;
  font-size: .85rem;
}

/* Large button */
.btn-lg {
  padding: 14px 32px;
  font-size: 1rem;
}

/* Full width button */
.btn-full {
  width: 100%;
}

/* Disabled state */
.btn:disabled,
button:disabled,
input[type="submit"]:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none !important;
}

/* ── VISUAL HIERARCHY & SPACING ── */
.card {
  transition: all .22s;
}

.card:hover {
  border-color: var(--sage-light);
}

/* Better spacing for sections */
.sec {
  margin-top: 48px;
  padding: 0;
}

.sec:first-of-type {
  margin-top: 24px;
}

/* Improved grid gaps */
.g {
  gap: 20px;
}

@media(max-width: 768px) {
  .g2 {
    grid-template-columns: 1fr !important;
  }
  .g3 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  .g4 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* ── TYPOGRAPHY IMPROVEMENTS ── */
h1, h2, h3, h4, h5, h6 {
  font-weight: 700;
  color: var(--ink);
}

h1 {
  font-size: clamp(1.8rem, 5vw, 3rem);
  line-height: 1.1;
  margin-bottom: 16px;
}

h2 {
  font-size: clamp(1.4rem, 3.5vw, 2rem);
  line-height: 1.15;
  margin-bottom: 14px;
}

h3 {
  font-size: clamp(1.1rem, 2.5vw, 1.5rem);
  line-height: 1.2;
  margin-bottom: 12px;
}

h4 {
  font-size: clamp(.95rem, 2vw, 1.15rem);
  margin-bottom: 10px;
}

p {
  line-height: 1.7;
  margin-bottom: 16px;
}

p:last-child {
  margin-bottom: 0;
}

/* Bilingual visibility is controlled in the language toggle section above. */

/* Improved link styling */
a {
  position: relative;
}

a:not(.btn):not(.card) {
  text-decoration: none;
  color: var(--sage-dark);
  font-weight: 500;
  transition: all .2s;
}

a:not(.btn):not(.card):hover {
  color: var(--coral);
}

/* ── CTA IMPROVEMENTS ── */
.highlight {
  background: var(--sage-bg);
  border: 1px solid var(--sage-light);
  border-radius: var(--radius-sm);
  padding: 20px 24px;
  margin: 20px 0;
}

.highlight h4 {
  color: var(--sage-dark);
  margin-bottom: 8px;
}

.cta-section {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 24px;
  padding: 24px;
  background: var(--cream-dark);
  border-radius: var(--radius-sm);
  align-items: flex-start;
}

.cta-section .btn {
  align-self: flex-start;
}

@media(max-width: 640px) {
  .cta-section {
    padding: 16px;
  }
  .cta-section .btn {
    align-self: stretch;
    justify-content: center;
  }
}

/* ── RESPONSIVE IMPROVEMENTS ── */
@media(max-width: 768px) {
  main {
    padding: 24px 16px 48px;
  }

  .sec {
    margin-top: 36px;
  }

  input, textarea, select {
    font-size: 16px; /* Prevents zoom on iOS */
  }
}

/* ── ACCESSIBILITY ── */
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
.btn:focus-visible {
  outline: 2px solid var(--sage);
  outline-offset: 2px;
}

/* Improve button text legibility */
.btn {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Public-site polish pass */
:root {
  --ink: #262624;
  --mid: #4d514c;
  --muted: #6f746d;
  --border: #ded8cc;
  --cream: #FDF8F0;
  --cream-dark: #f1ede5;
  --sage-dark: #456f4a;
  --coral-dark: #b94742;
}

body {
  line-height: 1.62;
  text-rendering: optimizeLegibility;
  background-color: #FDF8F0;
}

h1,
h2,
h3,
h4 {
  letter-spacing: 0;
}

main {
  padding-top: 28px;
}

.hero-home {
  background: linear-gradient(135deg, rgba(122,158,126,.10), rgba(255,255,255,.72) 48%, rgba(245,230,192,.22));
}

.hero-home::before,
.hero-home::after {
  display: none;
}

.hero-home-inner {
  align-items: start;
  gap: 34px;
  padding: 46px 42px;
}

.hero-home .hero-tag {
  flex-wrap: wrap;
  max-width: 100%;
  width: fit-content;
  margin-bottom: 22px;
  padding: 7px 13px;
  line-height: 1.25;
}

.hero-home .hero-tag .tr-only,
.hero-home .hero-tag .en-only {
  width: auto;
  height: auto;
  border-radius: 0;
  background: transparent;
  animation: none;
  white-space: normal;
}

.hero-home h1 {
  max-width: 680px;
  margin-bottom: 18px;
  color: var(--ink);
}

.hero-home h1 em {
  color: var(--sage-dark);
}

.hero-home .hero-sub {
  max-width: 640px;
  color: var(--mid);
  font-size: 1rem;
}

.card,
.tier-card,
.diff-card,
.testimonial,
.stat,
.hours-card,
.category-banner,
.mission-bar,
.dynamic-section,
.feed-card {
  border-color: var(--border);
  box-shadow: 0 1px 2px rgba(44,44,44,.03), 0 8px 28px rgba(44,44,44,.055);
}

.card p,
.diff-card p,
.tier-desc,
.tier-features,
.testimonial .t-text,
.category-banner p,
.mission-bar .mb-sub,
p.desc,
.pt .sub,
.hero p {
  color: var(--mid);
}

.badge,
.tp,
.fc-tag {
  color: var(--ink);
}

.btn,
.btn-primary,
.btn-secondary,
.btn-coral,
.btn-white,
.btn-login,
.btn-join {
  letter-spacing: 0;
  min-height: 40px;
}

.btn {
  border-color: var(--border);
}

.btn-p,
.btn-primary,
button[type="submit"] {
  background: var(--brand-teal);
  border-color: var(--brand-teal);
}

.btn-p:hover,
.btn-primary:hover,
button[type="submit"]:hover {
  background: var(--sage-dark);
  border-color: var(--sage-dark);
}

.btn-coral,
.btn-join {
  background: var(--coral);
}

.btn-coral:hover,
.btn-join:hover {
  background: var(--coral-dark);
}

.nav a,
.footer-col a,
.mobile-nav-inner .nav-links a {
  letter-spacing: 0;
}

.sec {
  margin-top: 44px;
}

.sec-h {
  max-width: 760px;
}

@media(max-width: 920px) {
  .hero-home-inner {
    grid-template-columns: 1fr;
    padding: 34px 28px;
  }

  .hero-home h1 {
    font-size: clamp(2rem, 8vw, 3rem);
  }
}

@media(max-width: 680px) {
  .header-inner {
    gap: 10px;
  }

  .brand-text .tag {
    display: none;
  }

  .hero-home-inner {
    padding: 28px 20px;
  }

  .hero-home .hero-tag {
    font-size: .68rem;
  }

  .hero-home h1 {
    font-size: 2.15rem;
    line-height: 1.08;
  }

  .hero-home .hero-sub {
    font-size: .96rem;
  }

  .btns {
    gap: 10px;
  }

  .btns .btn {
    width: 100%;
  }

  .g3,
  .g4,
  .dynamic-feed {
    grid-template-columns: 1fr !important;
  }
}

/* Clean card treatment for the workshop and play pages */
.cmp {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin: 24px 0;
}

.cbox {
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  padding: 24px 26px !important;
  box-shadow: 0 1px 2px rgba(44,44,44,.03), 0 10px 30px rgba(44,44,44,.06);
}

.cbox .ctag,
.ctag {
  display: inline-flex;
  width: auto;
  align-items: center;
  border-radius: 999px;
  padding: 5px 11px;
  margin-bottom: 12px;
  background: var(--sage-bg) !important;
  border: 1px solid var(--sage-light);
  color: var(--sage-dark);
  font-size: .72rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0;
}

.cbox h4 {
  margin-bottom: 8px;
  font-size: 1.08rem;
  line-height: 1.25;
}

.cbox p {
  color: var(--mid);
  margin-bottom: 0;
  line-height: 1.6;
}

.tbl {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: 0 1px 2px rgba(44,44,44,.03), 0 8px 24px rgba(44,44,44,.05);
}

.tbl th,
.tbl td {
  padding: 13px 16px;
  text-align: left;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
  color: var(--mid);
}

.tbl th {
  color: var(--ink);
  background: var(--cream-dark);
  font-size: .82rem;
}

.tbl tr:last-child td {
  border-bottom: 0;
}

.slot-label {
  min-width: 24px;
  text-align: center;
}

.track-header {
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  box-shadow: 0 1px 2px rgba(44,44,44,.03), 0 8px 24px rgba(44,44,44,.05);
  align-items: center;
}

.track-header .th-left p {
  color: var(--mid) !important;
}

.track-toggle {
  background: var(--cream);
}

.session-grid {
  gap: 14px;
}

.scard,
.ageband,
.incl-bar {
  border-color: var(--border) !important;
  box-shadow: 0 1px 2px rgba(44,44,44,.03), 0 8px 24px rgba(44,44,44,.045);
}

.scard {
  border-left-width: 0 !important;
  border-top: 3px solid var(--sage-light);
}

.scard h4 {
  line-height: 1.25;
}

.sc-pill,
.track-header .tag {
  color: var(--ink);
  background: var(--cream-dark);
}

.lego-banner,
.incl-bar {
  background: var(--white) !important;
  border-color: var(--border) !important;
}

.availability-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.availability-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  background: var(--white);
  border: 1px solid var(--border);
  border-left: 4px solid var(--sage);
  border-radius: var(--radius);
  padding: 16px 18px;
  box-shadow: 0 1px 2px rgba(44,44,44,.03), 0 8px 24px rgba(44,44,44,.05);
}

.availability-card.limited {
  border-left-color: var(--gold);
}

.availability-card.full {
  border-left-color: var(--coral);
}

.availability-card strong {
  display: block;
  font-family: 'Fraunces', serif;
  font-size: 1rem;
}

.availability-card span {
  display: block;
  color: var(--mid);
  font-size: .83rem;
  margin-top: 2px;
}

.menu-highlight-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.menu-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 16px 18px;
  box-shadow: 0 1px 2px rgba(44,44,44,.03), 0 8px 24px rgba(44,44,44,.045);
}

.mc-top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
  margin-bottom: 7px;
}

.mc-top strong {
  font-family: 'Fraunces', serif;
  line-height: 1.2;
}

.mc-top span {
  color: var(--sage-dark);
  font-weight: 800;
  white-space: nowrap;
}

.menu-card p {
  color: var(--mid);
  font-size: .82rem;
  line-height: 1.55;
  margin: 0;
}

.track-header {
  min-height: 124px;
}

.track-header .tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.track-header .tag,
.tags .tag {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--border);
  background: var(--white);
  border-radius: 999px;
  padding: 4px 9px;
  font-size: .7rem;
  font-weight: 700;
  color: var(--mid);
}

@media(max-width: 760px) {
  .cmp {
    grid-template-columns: 1fr;
  }

  .cbox {
    padding: 20px !important;
  }

  .availability-grid,
  .menu-highlight-grid {
    grid-template-columns: 1fr;
  }

  .availability-card {
    align-items: flex-start;
    flex-direction: column;
  }

  .availability-card .btn {
    width: 100%;
  }

  .track-header {
    min-height: 0;
  }
}

/* v10 public page polish: Workshops and Play */
.feature-card {
  min-height: 190px;
}

.feature-card h3,
.price-card strong,
.track-card h3 {
  letter-spacing: 0;
}

.price-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.price-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 20px;
  box-shadow: 0 1px 2px rgba(44,44,44,.03), 0 8px 24px rgba(44,44,44,.05);
}

.price-card strong {
  display: block;
  margin: 12px 0 6px;
  font-family: 'Fraunces', serif;
  font-size: clamp(1.4rem, 3vw, 2rem);
  line-height: 1;
  color: var(--ink);
}

.price-card p {
  color: var(--mid);
  font-size: .86rem;
  line-height: 1.55;
}

.track-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.track-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-top: 4px solid var(--sage);
  border-radius: var(--radius);
  padding: 18px;
  box-shadow: 0 1px 2px rgba(44,44,44,.03), 0 8px 24px rgba(44,44,44,.05);
}

.track-card > span {
  display: inline-flex;
  margin-bottom: 10px;
  border-radius: 999px;
  background: var(--cream-dark);
  color: var(--mid);
  padding: 4px 9px;
  font-size: .68rem;
  font-weight: 800;
}

.track-card h3 {
  font-size: 1.05rem;
}

.track-card p {
  margin: 0;
  color: var(--mid);
  font-size: .83rem;
  line-height: 1.55;
}

.track-blue { border-top-color: var(--sky); }
.track-lav { border-top-color: var(--lav); }
.track-gold { border-top-color: var(--gold); }
.track-coral { border-top-color: var(--coral); }

.hero .card h3 {
  margin-bottom: 8px;
}

.hero .btns {
  margin-top: 16px;
}

.dynamic-section {
  box-shadow: 0 1px 2px rgba(44,44,44,.03), 0 10px 30px rgba(44,44,44,.055);
}

@media(max-width: 920px) {
  .track-grid,
  .price-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media(max-width: 640px) {
  .hero-inner {
    grid-template-columns: 1fr;
    padding: 24px 20px;
  }

  .track-grid,
  .price-grid {
    grid-template-columns: 1fr;
  }

  .price-card,
  .track-card,
  .feature-card {
    min-height: 0;
  }

  .dynamic-section {
    padding: 20px;
  }

  .dynamic-section .ds-header {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }
}

/* v11 homepage polish: real centre imagery and cleaner section rhythm */
.hero-branch-stack {
  display: grid;
  gap: 12px;
}

.hero-branch-card {
  position: relative;
  overflow: hidden;
}

.hero-branch-card-main {
  border-left: 4px solid var(--sage);
}

.hero-branch-card-satellite {
  border-left: 4px solid var(--gold);
}

.micro-location {
  margin-top: 10px;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 700;
}

.home-centres {
  display: grid;
  grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr);
  gap: 24px;
  align-items: end;
  margin-top: 28px;
  padding: 28px;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background:
    linear-gradient(135deg, rgba(121, 158, 125, .12), rgba(255, 255, 255, .88) 46%, rgba(233, 181, 78, .12)),
    var(--white);
  box-shadow: 0 1px 2px rgba(44,44,44,.03), 0 18px 46px rgba(44,44,44,.07);
}

.home-centres .centre-copy {
  max-width: 440px;
}

.home-centres .sec-h {
  margin-bottom: 10px;
}

.centre-photo-grid {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 12px;
}

.centre-photo-card {
  position: relative;
  min-height: 220px;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(44, 44, 44, .14);
  border-radius: var(--radius);
  background: var(--white);
  box-shadow: 0 12px 34px rgba(44,44,44,.12);
}

.centre-photo-card-wide {
  grid-row: span 2;
  min-height: 452px;
}

.centre-photo-card img {
  width: 100%;
  height: 100%;
  min-height: inherit;
  display: block;
  object-fit: cover;
}

.centre-photo-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0) 45%, rgba(0,0,0,.58));
  pointer-events: none;
}

.centre-photo-card figcaption {
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 14px;
  z-index: 1;
  color: #fff;
  display: grid;
  gap: 2px;
  text-shadow: 0 1px 8px rgba(0,0,0,.38);
}

.centre-photo-card figcaption strong {
  font-family: 'Fraunces', serif;
  font-size: 1.1rem;
}

.centre-photo-card figcaption span {
  font-size: .78rem;
  font-weight: 700;
}

.category-banner {
  margin-top: 28px;
}

.sec.fi {
  margin-top: 28px;
}

.sec.fi > .g.g3,
.sec.fi > .testimonial-grid,
.sec.fi > .tier-grid {
  margin-top: 16px;
}

.diff-card {
  min-height: 210px;
}

.diff-card .dc-icon {
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: var(--cream-dark);
  font-size: 1.35rem;
}

.dynamic-section {
  margin-top: 28px;
}

.dynamic-feed:empty {
  min-height: 120px;
}

.card h4,
.hours-card h4 {
  letter-spacing: 0;
}

.hours-card h4 {
  margin: 0 0 12px;
}

@media(max-width: 980px) {
  .home-centres {
    grid-template-columns: 1fr;
  }

  .home-centres .centre-copy {
    max-width: 680px;
  }
}

@media(max-width: 720px) {
  .home-centres {
    padding: 18px;
  }

  .centre-photo-grid {
    grid-template-columns: 1fr;
  }

  .centre-photo-card,
  .centre-photo-card-wide {
    min-height: 260px;
    grid-row: auto;
  }
}

@media(max-width: 520px) {
  .hero-home-inner {
    padding: 20px 16px;
  }

  .home-centres {
    margin-top: 20px;
  }

  .centre-photo-card,
  .centre-photo-card-wide {
    min-height: 220px;
  }

  .stats-row {
    gap: 10px;
  }
}

/* v12 site-wide page consistency and public-page polish */
.pt h1 {
  font-size: clamp(2rem, 3.2vw, 2.45rem);
  line-height: 1.08;
}

.pt .sub {
  font-size: .94rem;
  line-height: 1.55;
}

.sec h3,
.sec-h {
  font-size: clamp(1.35rem, 2.4vw, 1.75rem);
  line-height: 1.12;
}

.hero h2 {
  font-size: clamp(1.25rem, 2.2vw, 1.7rem);
  line-height: 1.18;
}

.hero p,
.card p,
.highlight p,
.info-grid span {
  font-size: .88rem;
  line-height: 1.58;
}

.clean-card-grid .card,
.price-card,
.track-card,
.feature-card {
  min-height: 0;
}

.clean-card-grid .card h4,
.track-card h3,
.feature-card h3 {
  font-size: 1rem;
  line-height: 1.28;
}

.price-card strong {
  font-size: clamp(1.35rem, 2.4vw, 1.8rem);
  line-height: 1.08;
}

.metric-card {
  text-align: center;
}

.metric-number {
  color: var(--sage-dark);
  font-family: 'Fraunces', serif;
  font-size: 3rem;
  font-weight: 800;
  line-height: 1;
}

.metric-label {
  color: var(--muted);
  font-size: .76rem;
  font-weight: 800;
  margin-top: 6px;
  text-transform: uppercase;
}

.info-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.info-grid > div {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-sm);
  padding: 14px 16px;
}

.info-grid strong {
  color: var(--ink);
  display: block;
  font-size: .82rem;
  margin-bottom: 4px;
}

.info-grid span {
  color: var(--mid);
  display: block;
}

.section-actions {
  margin-top: 16px;
}

.membership-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.membership-grid .tier-card {
  display: flex;
  flex-direction: column;
  min-height: 360px;
}

.membership-grid .tier-card .btn {
  justify-content: center;
  margin-top: auto;
}

.tier-card.premium {
  background: var(--gold-bg);
  border-color: var(--gold);
}

.btn-gold {
  background: var(--gold);
  border-color: var(--gold);
  color: #fff;
  font-weight: 800;
}

.btn-gold:hover {
  background: #be9139;
  border-color: #be9139;
  color: #fff;
}

footer .footer-bottom {
  display: block;
}

@media(max-width: 900px) {
  .info-grid,
  .membership-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media(max-width: 640px) {
  .pt h1 {
    font-size: 2rem;
  }

  .info-grid,
  .membership-grid {
    grid-template-columns: 1fr;
  }
}

/* v13 tighter public typography: calmer content hierarchy */
.sec h3,
.sec-h {
  font-size: clamp(1.18rem, 1.9vw, 1.48rem);
  letter-spacing: 0;
}

.hero h2 {
  font-size: clamp(1.12rem, 1.8vw, 1.42rem);
  letter-spacing: 0;
}

.clean-card-grid .card h4,
.card h4,
.track-card h3,
.feature-card h3,
.tier-name {
  font-size: .92rem;
  letter-spacing: 0;
}

.card p,
.track-card p,
.feature-card p,
.tier-card p,
.desc {
  font-size: .82rem;
}

.tier-price {
  font-size: clamp(1.35rem, 2.1vw, 1.7rem);
}

/* v14 visual warmth pass: restore pastel character without losing polish */
.hero {
  position: relative;
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 14% 18%, rgba(122, 158, 126, .12), transparent 32%),
    radial-gradient(circle at 88% 16%, rgba(212, 168, 83, .13), transparent 30%),
    radial-gradient(circle at 78% 88%, rgba(232, 112, 106, .09), transparent 34%);
  pointer-events: none;
}

.hero-inner {
  position: relative;
  z-index: 1;
}

.hero-sage {
  background:
    linear-gradient(135deg, rgba(238, 244, 239, .92), rgba(255, 255, 255, .82) 48%, rgba(245, 230, 192, .28)),
    var(--white);
}

.hero-coral {
  background:
    linear-gradient(135deg, rgba(254, 242, 241, .92), rgba(255, 255, 255, .84) 50%, rgba(238, 244, 239, .34)),
    var(--white);
}

.hero-gold {
  background:
    linear-gradient(135deg, rgba(253, 248, 237, .95), rgba(255, 255, 255, .84) 50%, rgba(212, 232, 245, .26)),
    var(--white);
}

.hero-lav {
  background:
    linear-gradient(135deg, rgba(228, 221, 240, .54), rgba(255, 255, 255, .86) 50%, rgba(238, 244, 239, .34)),
    var(--white);
}

.clean-card-grid .card,
.feature-card,
.track-card,
.price-card,
.hours-card,
.info-grid > div,
.feed-card,
.menu-card {
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .94), rgba(250, 248, 244, .72)),
    var(--white);
}

.clean-card-grid .card:nth-child(4n + 1),
.track-card:nth-child(4n + 1),
.feature-card:nth-child(4n + 1) {
  border-top: 3px solid var(--sage-light);
  background:
    linear-gradient(145deg, rgba(238, 244, 239, .72), rgba(255, 255, 255, .94)),
    var(--white);
}

.clean-card-grid .card:nth-child(4n + 2),
.track-card:nth-child(4n + 2),
.feature-card:nth-child(4n + 2) {
  border-top: 3px solid var(--gold-light);
  background:
    linear-gradient(145deg, rgba(253, 248, 237, .74), rgba(255, 255, 255, .94)),
    var(--white);
}

.clean-card-grid .card:nth-child(4n + 3),
.track-card:nth-child(4n + 3),
.feature-card:nth-child(4n + 3) {
  border-top: 3px solid var(--coral-light);
  background:
    linear-gradient(145deg, rgba(254, 242, 241, .74), rgba(255, 255, 255, .94)),
    var(--white);
}

.clean-card-grid .card:nth-child(4n + 4),
.track-card:nth-child(4n + 4),
.feature-card:nth-child(4n + 4) {
  border-top: 3px solid var(--sky-light);
  background:
    linear-gradient(145deg, rgba(212, 232, 245, .62), rgba(255, 255, 255, .94)),
    var(--white);
}

.highlight {
  background:
    linear-gradient(135deg, rgba(238, 244, 239, .96), rgba(255, 255, 255, .72) 58%, rgba(245, 230, 192, .46)),
    var(--sage-bg);
  border-color: rgba(122, 158, 126, .24);
}

.badge {
  background:
    linear-gradient(135deg, rgba(250, 248, 244, .95), rgba(255, 255, 255, .82));
  border-color: rgba(184, 176, 164, .36);
}

.badge .dot,
.dot {
  box-shadow: 0 0 0 4px rgba(122, 158, 126, .12);
}

.chip-row span {
  background: rgba(238, 244, 239, .82);
  border: 1px solid rgba(122, 158, 126, .22);
  border-radius: 999px;
  color: var(--sage-dark);
  display: inline-flex;
  font-size: .78rem;
  font-weight: 800;
  margin: 4px 6px 4px 0;
  padding: 7px 12px;
}

.membership-grid .tier-card:nth-child(1) {
  background: linear-gradient(145deg, rgba(238, 244, 239, .78), rgba(255, 255, 255, .94));
}

.membership-grid .tier-card:nth-child(2) {
  background: linear-gradient(145deg, rgba(253, 248, 237, .76), rgba(255, 255, 255, .94));
}

.membership-grid .tier-card:nth-child(3) {
  background: linear-gradient(145deg, rgba(238, 244, 239, .88), rgba(255, 255, 255, .94));
}

.membership-grid .tier-card:nth-child(4) {
  background: linear-gradient(145deg, rgba(212, 232, 245, .62), rgba(255, 255, 255, .94));
}

.membership-grid .tier-card:nth-child(5),
.tier-card.premium {
  background: linear-gradient(145deg, rgba(253, 248, 237, .9), rgba(255, 255, 255, .92));
}

.tier-icon {
  align-items: center;
  color: var(--brand-teal);
  display: inline-flex;
  filter: none;
  justify-content: center;
  min-height: 34px;
}

.gb-line-icon {
  align-items: center;
  color: var(--brand-teal);
  display: inline-flex;
  justify-content: center;
}

.gb-line-icon svg {
  display: block;
  height: 24px;
  width: 24px;
}

.card h4 .gb-line-icon {
  margin-right: 8px;
  transform: translateY(3px);
}

.diff-card .dc-icon.gb-line-icon {
  color: var(--brand-teal);
  font-size: 1rem;
}

.tier-icon .gb-line-icon svg {
  height: 28px;
  width: 28px;
}

.card:hover,
.track-card:hover,
.feature-card:hover,
.price-card:hover,
.tier-card:hover,
.info-grid > div:hover {
  border-color: rgba(122, 158, 126, .36);
  box-shadow: 0 1px 2px rgba(44,44,44,.03), 0 12px 34px rgba(122, 158, 126, .13);
}

.home-centres {
  background:
    linear-gradient(135deg, rgba(238, 244, 239, .86), rgba(255, 255, 255, .88) 44%, rgba(253, 248, 237, .76)),
    var(--white);
}

/* Warmth Sprint v2: additive cozy polish, no operational/print surfaces. */
.card,
.tier-card,
.hours-card,
.feed-card,
.testimonial-grid > *,
.hero-branch-card {
  border: 1px solid var(--hairline);
  border-radius: var(--radius-soft);
  box-shadow: var(--shadow-cozy);
}

.diff-card {
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .96), rgba(253, 248, 240, .72)),
    var(--white);
  border: 1px solid var(--hairline) !important;
  border-top: 1px solid var(--hairline) !important;
  border-radius: var(--radius-blob);
  box-shadow: var(--shadow-cozy);
  min-height: 222px;
  padding: 26px 24px;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.diff-card.fi-d1,
.diff-card.fi-d2,
.diff-card.fi-d3,
.diff-card.fi-d4,
.diff-card.fi-d5,
.diff-card.fi-d6 {
  border-top-color: var(--hairline) !important;
}

.diff-card:hover {
  border-color: rgba(45, 111, 138, .26) !important;
  box-shadow: var(--shadow-cozy-lift);
  transform: translateY(-3px);
}

.diff-card .dc-icon,
.diff-card .dc-icon.gb-line-icon {
  align-items: center;
  background: #F3EEE4;
  border-radius: 16px 14px 18px 13px;
  color: var(--accent);
  display: flex;
  font-size: 1rem;
  height: 52px;
  justify-content: center;
  margin-bottom: 14px;
  width: 52px;
}

.diff-card .dc-icon svg,
.diff-card .dc-icon.gb-line-icon svg {
  height: 26px;
  width: 26px;
}

.diff-card h4 {
  color: var(--accent);
  font-family: 'Fraunces', Georgia, serif;
  font-size: 1.12rem;
  line-height: 1.2;
  margin: 0 0 6px;
}

.today-card {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(251, 246, 236, .94)),
    var(--white);
  border-left: 0;
}

.today-head {
  align-items: center;
  color: var(--accent);
  display: flex;
  font-size: .78rem;
  font-weight: 700;
  gap: 8px;
  letter-spacing: .04em;
  line-height: 1.35;
  text-transform: uppercase;
}

.today-time {
  color: #8A8273;
  letter-spacing: 0;
  margin-left: auto;
  text-transform: none;
  white-space: nowrap;
}

.today-dot {
  background: var(--sage);
  border-radius: 50%;
  box-shadow: 0 0 0 4px rgba(74, 124, 107, .15);
  flex: 0 0 auto;
  height: 8px;
  width: 8px;
}

.today-line {
  color: #3A372F;
  font-family: 'Fraunces', Georgia, serif;
  font-size: 1.06rem;
  line-height: 1.5;
  margin: 10px 0 0;
}

.hero-branch-card-main,
.hero-branch-card-satellite {
  border-left-color: var(--accent);
}

@media(max-width: 560px) {
  .today-head {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .today-time {
    margin-left: 16px;
  }
}

/* Public colour warmth pass.
   Public website only: restore cosy pillar colour while keeping teal as chrome. */
.hero-home {
  background:
    linear-gradient(135deg, rgba(238, 244, 239, .68), rgba(255, 255, 255, .82) 48%, rgba(253, 246, 232, .42)),
    var(--white);
}

.hero-home::before,
.hero-home::after {
  display: block;
}

.hero-home::before {
  background: radial-gradient(circle, rgba(155, 142, 196, .14), transparent 68%);
}

.hero-home::after {
  background: radial-gradient(circle, rgba(201, 149, 42, .12), transparent 68%);
}

.hero-sage,
.hero-coral,
.hero-gold,
.hero-lav,
.hero-sky {
  border-left: 3px solid var(--sage);
}

.hero-sage {
  background:
    linear-gradient(135deg, rgba(235, 242, 238, .95), rgba(255, 255, 255, .86) 50%, rgba(253, 246, 232, .26)),
    var(--white);
  border-left-color: var(--sage);
}

.hero-coral {
  background:
    linear-gradient(135deg, rgba(253, 238, 237, .95), rgba(255, 255, 255, .86) 50%, rgba(235, 242, 238, .26)),
    var(--white);
  border-left-color: var(--coral);
}

.hero-gold {
  background:
    linear-gradient(135deg, rgba(253, 246, 232, .98), rgba(255, 255, 255, .86) 50%, rgba(232, 243, 248, .26)),
    var(--white);
  border-left-color: var(--gold);
}

.hero-lav {
  background:
    linear-gradient(135deg, rgba(237, 233, 247, .96), rgba(255, 255, 255, .86) 50%, rgba(235, 242, 238, .26)),
    var(--white);
  border-left-color: var(--lav);
}

.hero-sky {
  background:
    linear-gradient(135deg, rgba(235, 245, 251, .96), rgba(255, 255, 255, .88) 50%, rgba(253, 246, 232, .22)),
    var(--white);
  border-left-color: var(--sky);
}

.btn-p:hover,
.btn-primary:hover {
  background: #245a70;
  border-color: #245a70;
  color: #fff;
}

.join-banner {
  background:
    linear-gradient(135deg, rgba(224, 112, 96, .96) 0%, rgba(184, 90, 77, .98) 100%),
    var(--coral);
  box-shadow: 0 8px 32px rgba(224, 112, 96, .28);
}

.join-banner p {
  color: rgba(255, 255, 255, .86);
}

.btn-white,
.btn-white:hover {
  color: var(--coral-dark) !important;
}

.badge-sage {
  background: var(--sage-bg);
  border-color: var(--sage-light);
  color: var(--sage-dark);
}

.badge-coral {
  background: var(--coral-bg);
  border-color: var(--coral-light);
  color: var(--coral-dark);
}

.badge-gold {
  background: var(--gold-bg);
  border-color: var(--gold-light);
  color: #7a5a0a;
}

.badge-lav {
  background: var(--lav-light);
  border-color: rgba(155, 142, 196, .32);
  color: #5a4180;
}

.badge-sky {
  background: var(--sky-light);
  border-color: rgba(107, 168, 196, .32);
  color: #2d6a94;
}

.diff-card:nth-child(1) { border-top: 3px solid var(--sage) !important; }
.diff-card:nth-child(2) { border-top: 3px solid var(--gold) !important; }
.diff-card:nth-child(3) { border-top: 3px solid var(--coral) !important; }
.diff-card:nth-child(4) { border-top: 3px solid var(--lav) !important; }
.diff-card:nth-child(5) { border-top: 3px solid var(--sky) !important; }
.diff-card:nth-child(6) { border-top: 3px solid var(--coral) !important; }

.diff-card:nth-child(1) .dc-icon { background: var(--sage-bg); color: var(--sage-dark); }
.diff-card:nth-child(2) .dc-icon { background: var(--gold-bg); color: #7a5a0a; }
.diff-card:nth-child(3) .dc-icon { background: var(--coral-bg); color: var(--coral-dark); }
.diff-card:nth-child(4) .dc-icon { background: var(--lav-light); color: #5a4180; }
.diff-card:nth-child(5) .dc-icon { background: var(--sky-light); color: #2d6a94; }
.diff-card:nth-child(6) .dc-icon { background: var(--coral-bg); color: var(--coral-dark); }

.diff-card:nth-child(1) h4 { color: var(--sage-dark); }
.diff-card:nth-child(2) h4 { color: #7a5a0a; }
.diff-card:nth-child(3) h4 { color: var(--coral-dark); }
.diff-card:nth-child(4) h4 { color: #5a4180; }
.diff-card:nth-child(5) h4 { color: #2d6a94; }
.diff-card:nth-child(6) h4 { color: var(--coral-dark); }

.clean-card-grid .ct { border-top-color: var(--sage) !important; }
.clean-card-grid .ct-c { border-top-color: var(--coral) !important; }
.clean-card-grid .ct-g { border-top-color: var(--gold) !important; }
.clean-card-grid .ct-l { border-top-color: var(--lav) !important; }
.clean-card-grid .ct-s { border-top-color: var(--sky) !important; }

/* Public navigation and icon rhythm pass.
   Keep teal for portal/system actions; let public pages carry warmer pillar colour. */
.nav a:hover,
.mobile-nav-inner .nav-links a:hover {
  background: var(--cream-dark);
  border-color: rgba(184, 176, 164, .36);
  color: var(--ink);
}

.nav a.active,
.mobile-nav-inner .nav-links a.active {
  background: rgba(255, 255, 255, .72);
  border-color: rgba(184, 176, 164, .42);
  box-shadow: inset 0 -2px 0 var(--coral);
  color: var(--ink);
}

.nav a.active[href*="workshops"],
.mobile-nav-inner .nav-links a.active[href*="workshops"] {
  box-shadow: inset 0 -2px 0 var(--sage);
}

.nav a.active[href*="library"],
.nav a.active[href*="membership"],
.mobile-nav-inner .nav-links a.active[href*="library"],
.mobile-nav-inner .nav-links a.active[href*="membership"] {
  box-shadow: inset 0 -2px 0 var(--gold);
}

.nav a.active[href*="wellbeing"],
.nav a.active[href*="social-lab"],
.mobile-nav-inner .nav-links a.active[href*="wellbeing"],
.mobile-nav-inner .nav-links a.active[href*="social-lab"] {
  box-shadow: inset 0 -2px 0 var(--lav);
}

.nav a.active[href*="workspaces"],
.mobile-nav-inner .nav-links a.active[href*="workspaces"] {
  box-shadow: inset 0 -2px 0 var(--sky);
}

.clean-card-grid .card h4,
.g.g4 > .card h4 {
  align-items: center;
  display: flex;
  gap: 9px;
}

.gb-card-icon {
  align-items: center;
  border-radius: 11px;
  display: inline-flex;
  flex: 0 0 auto;
  height: 32px;
  justify-content: center;
  width: 32px;
}

.gb-card-icon svg {
  height: 19px;
  width: 19px;
}

.gb-card-icon-1 { background: var(--sage-bg); color: var(--sage-dark); }
.gb-card-icon-2 { background: var(--coral-bg); color: var(--coral-dark); }
.gb-card-icon-3 { background: var(--gold-bg); color: #7a5a0a; }
.gb-card-icon-4 { background: var(--lav-light); color: #5a4180; }
.gb-card-icon-5 { background: var(--sky-light); color: #2d6a94; }
.gb-card-icon-6 { background: rgba(253, 238, 237, .72); color: var(--coral-dark); }

.tier-card .tier-icon {
  border-radius: 14px;
  box-shadow: none;
  height: 44px;
  margin-bottom: 12px;
  min-height: 44px;
  width: 44px;
}

.tier-card:nth-child(1) .tier-icon { background: var(--sage-bg); color: var(--sage-dark); }
.tier-card:nth-child(2) .tier-icon { background: var(--gold-bg); color: #7a5a0a; }
.tier-card:nth-child(3) .tier-icon { background: var(--coral-bg); color: var(--coral-dark); }
.tier-card:nth-child(4) .tier-icon { background: var(--sky-light); color: #2d6a94; }
.tier-card:nth-child(5) .tier-icon { background: var(--lav-light); color: #5a4180; }

.tier-card:nth-child(1) .gb-line-icon,
.tier-card:nth-child(1) .tier-icon .gb-line-icon { color: var(--sage-dark); }
.tier-card:nth-child(2) .gb-line-icon,
.tier-card:nth-child(2) .tier-icon .gb-line-icon { color: #7a5a0a; }
.tier-card:nth-child(3) .gb-line-icon,
.tier-card:nth-child(3) .tier-icon .gb-line-icon { color: var(--coral-dark); }
.tier-card:nth-child(4) .gb-line-icon,
.tier-card:nth-child(4) .tier-icon .gb-line-icon { color: #2d6a94; }
.tier-card:nth-child(5) .gb-line-icon,
.tier-card:nth-child(5) .tier-icon .gb-line-icon { color: #5a4180; }

.tier-card:nth-child(1) .btn { background: var(--sage); border-color: var(--sage); color: #fff; }
.tier-card:nth-child(2) .btn { background: #8a6a1f; border-color: #8a6a1f; color: #fff; }
.tier-card:nth-child(3) .btn { background: var(--coral); border-color: var(--coral); color: #fff; }
.tier-card:nth-child(4) .btn { background: #2d6a94; border-color: #2d6a94; color: #fff; }
.tier-card:nth-child(5) .btn { background: #5a4180; border-color: #5a4180; color: #fff; }