/* Yuwan Yoga — HEADER styles (top bar + navigation). Loaded on every page. */
.topbar{background:#1C1436;color:var(--on-ink-muted);font-size:.8rem}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-block:7px;flex-wrap:wrap}
.topbar a{color:#fff}
.region-pick{width:auto;background:transparent;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:8px;padding:3px 6px;font-size:.8rem}
.region-pick option{color:#000}
header.site{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(42,31,78,.9);backdrop-filter:blur(14px) saturate(140%);border-bottom:1px solid rgba(255,255,255,.08)}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;height:76px;gap:16px}
.logo{white-space:nowrap;display:flex;align-items:center;gap:10px;font:600 1.5rem var(--display);color:#fff!important;text-decoration:none!important;letter-spacing:.01em}
.logo svg{width:36px;height:36px}
nav.main{display:flex;gap:2px;align-items:center}
nav.main a{white-space:nowrap;color:#E3ECEA;padding:8px 11px;border-radius:999px;font-weight:600;font-size:.92rem}
nav.main a:hover,nav.main a.active{background:rgba(255,255,255,.1);color:#fff;text-decoration:none}
nav.main a.active{color:var(--marigold)}
.nav-cta{display:flex;gap:8px;align-items:center}
.nav-cta .btn-ghost{border-color:rgba(255,255,255,.5);color:#fff}.nav-cta .btn-ghost:hover{background:#fff;color:var(--ink)}
.burger{display:none;background:none;border:0;padding:8px;cursor:pointer}
.burger span{display:block;width:24px;height:2px;background:#fff;margin:5px 0}
@media (max-width:1140px){
  nav.main{position:fixed;inset:76px 0 auto 0;background:var(--ink);flex-direction:column;align-items:stretch;padding:12px 20px 24px;display:none;max-height:calc(100vh - 76px);overflow:auto}
  nav.main.open{display:flex}
  nav.main a{padding:14px;font-size:1.05rem;border-radius:12px}
  .burger{display:block}
  .nav-cta .btn-ghost{display:none}
}
header.site{background:rgba(255,255,255,.95);border-bottom:1px solid var(--line)}
.logo{color:var(--ink)!important}
nav.main a{color:var(--text)}
nav.main a:hover{background:var(--mist);color:var(--ink)}
nav.main a.active{color:var(--marigold-d);background:var(--mist)}
.nav-cta .btn-ghost{border-color:var(--ink);color:var(--ink)}.nav-cta .btn-ghost:hover{background:var(--ink);color:#fff}
.burger span{background:var(--ink)}
@media (max-width:1140px){nav.main{background:#fff;border-bottom:1px solid var(--line)}}
.topbar{background:var(--ink)}
.top-free{color:#FFD9A8;font-weight:800}
/* Small phones: keep logo, "Book a class" and menu button on one line without sideways scrolling */
@media (max-width:480px){
  header.site .wrap{gap:8px}
  header.site .logo{font-size:1.15rem;gap:7px}
  header.site .logo svg{width:30px;height:30px}
  main .btn{max-width:100%;white-space:normal;text-align:center}
  .nav-cta{gap:4px}
  .nav-cta .btn-accent{padding:9px 13px;font-size:.84rem}
  .burger{padding:6px}
}
@media (max-width:360px){.nav-cta .btn-accent{padding:8px 10px;font-size:.78rem}header.site .logo{font-size:1.02rem}}
