/* The stage owns exactly the viewport below the header. Its two content cells
   are fitted independently, leaving a separate strip for the ticket carousel. */
#homeHero{height:calc(var(--home-viewport-height,100dvh) - var(--home-header-height,74px));min-height:0;container-type:size}
#homeHero .hero-layout{height:100%;min-height:0;display:grid;align-items:stretch;grid-template-columns:minmax(0,1.05fr) minmax(0,.55fr);grid-template-rows:minmax(0,1fr);gap:4vw;padding:clamp(12px,3cqh,32px) 0 clamp(64px,18cqh,160px)}
.hero-copy-frame{min-width:0;min-height:0;display:flex;align-items:center}
#homeHero .hero-copy{flex:none;width:100%;min-width:0}
#homeHero .hero-copy h1{letter-spacing:0;line-height:1}
#homeHero .hero-subtitle{letter-spacing:0;line-height:1.12}
html #homeHero .hero-ticket-zone{position:relative;inset:auto;translate:none;transform:none;width:100%;min-width:0;min-height:0;margin:0;align-items:center;justify-content:center}
#homeHero .main-ticket{flex:none;width:360px;aspect-ratio:.55}
#homeHero .ticket-fan{translate:none}
body.home-scenes-ready[data-home-scene=hero]{overflow-y:hidden}
@media(max-width:760px) and (orientation:portrait){
  #homeHero .hero-layout{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,.8fr) minmax(0,1.2fr);gap:12px;padding-top:12px;padding-bottom:clamp(62px,13cqh,110px)}
  #homeHero .hero-copy h1{font-size:clamp(36px,10vw,58px)}
  #homeHero .hero-subtitle{font-size:clamp(24px,7vw,38px)}
  #homeHero .hero-kicker{margin-bottom:12px}
  #homeHero .hero-actions{margin-top:16px}
}
@media(max-width:1100px) and (orientation:landscape){
  #homeHero .hero-layout{grid-template-columns:minmax(0,1.2fr) minmax(0,.7fr);gap:24px}
  #homeHero .hero-copy h1{font-size:clamp(36px,7vw,78px)}
  #homeHero .hero-subtitle{font-size:clamp(24px,4.8vw,52px)}
}