/* ASK SHAI: a calm, welcoming fox identity. Replaces the oversized neon hero. */
.topbar .brand-mark img,.shop-fox-mark{object-fit:contain;background:transparent;border-radius:0;filter:none}
.topbar .brand-mark img{width:44px;height:44px}
.topbar .brand-copy small{letter-spacing:.05em}
body[data-route="home"] #main .immersive-hero{min-height:0;background:#131620;overflow:hidden}
body[data-route="home"] #main .immersive-hero .horizon-art{inset:28px 5% 28px auto;width:29%;max-width:310px;opacity:1!important}
body[data-route="home"] #main .immersive-hero .horizon-art img{width:100%;height:100%;object-fit:contain;filter:none}
body[data-route="home"] #main .immersive-hero:after{display:none}
body[data-route="home"] #main .immersive-hero-content{position:relative;z-index:1;min-height:0;padding-block:48px 36px}
body[data-route="home"] #main .immersive-hero h1{max-width:17ch;font-size:clamp(2.4rem,4.8vw,4.25rem);line-height:1.08;letter-spacing:-.045em;margin-block:18px}
body[data-route="home"] #main .immersive-hero .lead{max-width:55ch;color:#e2d9c8;font-size:1.08rem;line-height:1.6}
body[data-route="home"] #main .hero-actions{margin-top:24px}
body[data-route="home"] #main .hero-caption{margin-top:20px}
body[data-route="home"] #main .navigator-stage{margin-block:24px 48px;padding:28px;border:1px solid #686154;border-radius:22px;background:#1b1f2c;box-shadow:none}
body[data-route="home"] #main .navigator-stage-intro{margin-bottom:16px}
body[data-route="home"] #main .navigator-stage h2{font-size:clamp(1.35rem,2.5vw,2rem)}
body[data-route="home"] #main .navigator-orbit{width:40px;height:40px;box-shadow:none}
body[data-route="home"] #main .home-navigator{box-shadow:none;border-color:#8d8068}
body[data-route="home"] #main #homeQuestion{font-size:1rem;min-height:64px}
body[data-route="home"] #main .navigator-privacy{font-size:.82rem;color:#dbd0ba}
body[data-route="home"] #main .navigator-quick{gap:10px;flex-wrap:wrap}
body[data-route="home"] #main .navigator-quick button{min-height:44px;white-space:normal;text-align:start}
body[data-route="home"] #main .tutor-feature{padding-block:48px}
body[data-route="home"] #main .tutor-feature h2{font-size:clamp(1.8rem,3vw,2.8rem)}
body[data-route="home"] #main .discovery-section{padding-block:48px}
body[data-route="home"] #main :is(.button.primary,.navigator-submit){background:#e2d8c6;color:#181c28;border-color:#e2d8c6;box-shadow:none}
body[data-route="home"] #main :is(a,button,textarea):focus-visible{outline:3px solid #e2d8c6;outline-offset:4px}
/* The composer leads the studio; the existing lesson demo remains available below. */
body[data-route="ask"] .studio-topline{padding-block:24px}
body[data-route="ask"] .studio-lanes{margin-bottom:24px}
body[data-route="ask"] .studio-teaching{margin-block:0 40px;padding-top:24px}
body[data-route="ask"] .studio-teaching-heading h1{font-size:clamp(2rem,4vw,3rem)}
body[data-route="ask"] .studio-hero{padding-block:36px 48px}
body[data-route="ask"] .studio-hero h2{font-size:clamp(2.5rem,4.8vw,4.2rem)}
/* Digital catalogue: products first, advanced filters available on demand. */
body:has(#catalogue-status) .hero{padding-block:40px 30px;grid-template-columns:minmax(0,1fr) 170px;gap:36px}
body:has(#catalogue-status) .hero h1{font-size:clamp(2.2rem,4vw,3.6rem);max-width:22ch}
body:has(#catalogue-status) .hero-graphic.shai-brand-hero{min-height:0;aspect-ratio:1;border:0;background:transparent;border-radius:0}
.hero-graphic.shai-brand-hero .shai-brand-art{object-fit:contain;width:100%;height:100%}
body:has(#catalogue-status) .shop{margin-block:32px 56px}
body:has(#catalogue-status) .more-filters{grid-column:1/-1;border:1px solid #d4c7ac;border-radius:12px;padding:0 16px}
body:has(#catalogue-status) .more-filters summary{cursor:pointer;min-height:48px;display:list-item;align-content:center;color:#484339;font-weight:650}
body:has(#catalogue-status) .advanced-filters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;padding-bottom:18px}
body:has(#catalogue-status) .pillars{margin-bottom:40px}
body:has(#catalogue-status) .top{align-items:center}
body:has(#catalogue-status) .brand{align-items:center}
body:has(#catalogue-status) .top nav a{min-height:44px;display:inline-flex;align-items:center}
@media(max-width:760px){
  .topbar .brand-mark img{width:34px;height:34px}
  body[data-route="home"] #main .immersive-hero .horizon-art{display:none}
  body[data-route="home"] #main .immersive-hero-content{padding-block:32px 20px}
  body[data-route="home"] #main .immersive-hero h1{max-width:20ch;font-size:clamp(2.2rem,8vw,3.2rem)}
  body[data-route="home"] #main .navigator-stage{width:calc(100% - 32px);padding:20px;margin-block:20px 36px}
  body[data-route="home"] #main .navigator-stage-intro{gap:12px}
  body[data-route="home"] #main .navigator-quick{display:grid;grid-template-columns:1fr}
  body[data-route="ask"] .studio-teaching{padding-top:16px}
  body[data-route="ask"] .studio-hero{padding-block:28px}
  body:has(#catalogue-status) .hero{grid-template-columns:1fr;padding-block:28px 22px}
  body:has(#catalogue-status) .hero-graphic{display:none}
  body:has(#catalogue-status) .advanced-filters{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:420px){body:has(#catalogue-status) .advanced-filters{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){body:has(#catalogue-status){scroll-behavior:auto}body[data-route="home"] #main .horizon-art{animation:none}}
/* A question is available in the first screen, alongside the introduction. */
body[data-route="home"] #main .welcome-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;padding:40px max(24px,calc((100% - 1180px)/2))}
body[data-route="home"] #main .welcome-hero .horizon-art{display:none}
body[data-route="home"] #main .welcome-hero .immersive-hero-content{width:100%;margin:0;padding:0}
body[data-route="home"] #main .welcome-hero h1{font-size:clamp(2.4rem,4.2vw,3.65rem)}
body[data-route="home"] #main .welcome-hero .navigator-stage{display:block;width:100%;margin:0;align-self:center;padding:24px}
body[data-route="home"] #main .welcome-hero .navigator-stage h2{font-size:1.45rem}
body[data-route="home"] #main .welcome-hero .navigator-quick{display:flex;gap:8px}
body[data-route="home"] #main .welcome-hero .navigator-quick button{font-size:.82rem;flex:1 1 130px}
@media(max-width:900px){
 body[data-route="home"] #main .welcome-hero{grid-template-columns:1fr;gap:24px;padding:28px 20px}
 body[data-route="home"] #main .welcome-hero h1{max-width:24ch;font-size:clamp(2rem,6vw,3rem)}
 body[data-route="home"] #main .welcome-hero .navigator-stage{padding:20px}
 body[data-route="home"] #main .welcome-hero .hero-caption{display:none}
}

/* Premium vector identity: strong silhouette, readable at every size. */
.topbar .brand{gap:13px}
.topbar .brand-mark{width:64px;height:64px;flex:0 0 64px}
.topbar .brand-mark img{width:64px;height:64px}
.topbar .brand-shai{font-size:29px;font-weight:650;letter-spacing:.09em}
.topbar .brand-shai .brand-ai{font-style:normal}
.topbar .brand-ask{color:#d6c4a0}
.topbar .brand-copy small{color:#cbc4b8}
.premium-fox-signature{display:flex;align-items:center;gap:22px;margin:0 0 28px;direction:ltr}
.premium-fox-signature img{width:88px;height:88px;object-fit:contain;flex:none}
.premium-fox-signature strong{display:block;color:#f4f0e9;font:600 29px/1.1 system-ui,sans-serif;letter-spacing:.13em}
.premium-fox-signature small{display:block;color:#c9c1b5;font-size:11px;letter-spacing:.17em;margin-top:8px}
body[data-route="home"] #main .welcome-hero .immersion-kicker{margin-top:0}
body[data-route="home"] #main .welcome-hero .immersion-kicker .light-mark{display:none}
body[data-route="home"] #main .welcome-hero .immersion-kicker [data-no-translate]{display:none}
body[data-route="home"] #main .welcome-hero .immersion-kicker .kicker-line{display:none}
body[data-route="home"] #main :is(.button.primary,.navigator-submit){background:#d6c4a0;border-color:#d6c4a0;color:#161924}
body[data-route="home"] #main .immersive-hero h1 em{color:#d6c4a0}
body:has(#catalogue-status) .hero{grid-template-columns:minmax(0,1fr) 230px}
.top .brand .shop-fox-mark{width:60px;height:60px;flex-basis:60px;filter:brightness(.32)}
body:has(#catalogue-status) .shai-brand-art{filter:brightness(.32)}
@media(max-width:900px){.premium-fox-signature{margin-bottom:22px;gap:16px}.premium-fox-signature img{width:68px;height:68px}.premium-fox-signature strong{font-size:24px}}
@media(max-width:760px){.topbar .brand{gap:8px}.topbar .brand-mark{width:48px;height:48px;flex-basis:48px}.topbar .brand-mark img{width:48px;height:48px}.topbar .brand-shai{font-size:21px}.topbar .brand-ask{font-size:10px}body:has(#catalogue-status) .hero{grid-template-columns:1fr}.top .brand .shop-fox-mark{width:50px;height:50px;flex-basis:50px}}
@media(max-width:350px){.topbar .brand-mark{width:42px;height:44px;flex-basis:42px}.topbar .brand-mark img{width:42px;height:42px}.topbar .brand-shai{font-size:17px}.topbar .brand-copy small{font-size:7px}}
body[data-route="home"] #main .welcome-hero.tutor-entry-hero .hero-actions>.button.primary{background:#d6c4a0;color:#161924;border-color:#d6c4a0}
@media(max-width:400px){.topbar .topbar-inner{width:calc(100% - 20px);gap:6px}.topbar .top-actions{gap:4px}.topbar #menuBtn{white-space:nowrap;overflow-wrap:normal;min-width:44px;flex-shrink:0;padding-inline:7px}.topbar #langSelect{min-width:44px;width:50px;flex-shrink:0}.topbar #openShai{min-width:52px;padding-inline:6px;white-space:nowrap}.topbar .brand-copy strong{gap:3px}.topbar .brand-copy small{letter-spacing:0}}
