/* First screen: dance names drift behind a cut-out couple, row 3 repeats as an outline in front of them. */
.hero{--hm-fs:min(11.6vw,17vh);--hm-top:clamp(70px,11vh,104px);--hm-mx:0;--hm-my:0;background:radial-gradient(60% 75% at 66% 58%,var(--bg2) 0%,color-mix(in srgb,var(--bg2) 45%,transparent) 48%,transparent 76%),var(--bg)!important}
.hero:before,.hero:after{display:none!important}
.hero>.nav,.hero>.hero-content,.hero>.scroll{z-index:2}
.hero>.hero-content,.hero>.scroll{position:relative}

.hm{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.hm-rows{position:absolute;inset:var(--hm-top) 0 auto;transform:translate3d(calc(var(--hm-mx)*-14px),calc(var(--hm-my)*-6px),0)}
.hm-back{z-index:1}
.hm-front{z-index:4;padding-top:calc(var(--hm-fs)*.94*2)}
.hm-row{position:relative;height:calc(var(--hm-fs)*.94);overflow:hidden;white-space:nowrap;display:flex;font:900 var(--hm-fs)/.94 Unbounded,sans-serif;letter-spacing:-.04em;opacity:0;transition:opacity .9s ease}
.hm-on .hm-row{opacity:1}
.hm-track{display:flex;flex:none;will-change:transform;animation:hm-slide var(--hm-t) linear infinite}
.hm-rev .hm-track{animation-direction:reverse}
.hm-track span{position:relative;flex:none;padding-right:.32em}
.hm-track span:before{content:attr(data-w)}
.hm-track svg{position:absolute;left:0;top:0;overflow:visible}
.hm-defs{position:absolute;width:0;height:0}
@keyframes hm-slide{to{transform:translate3d(-50%,0,0)}}
.hm-r1{color:var(--ink);--hm-t:46s}
.hm-r2{color:transparent;--hm-t:58s;--hm-stroke:color-mix(in srgb,var(--ink) 42%,transparent)}
.hm-r3{color:var(--accent);--hm-t:40s}
.hm-r4{color:color-mix(in srgb,var(--c2,#dcc08f) 72%,transparent);--hm-t:52s}
.hm-front .hm-r3{color:transparent;--hm-stroke:var(--ink)}

.hm-scrim{position:absolute;inset:0;z-index:2;background:linear-gradient(to top,var(--bg) 0%,color-mix(in srgb,var(--bg) 70%,transparent) 16%,transparent 40%),radial-gradient(52% 58% at 0% 100%,color-mix(in srgb,var(--bg) 96%,transparent) 42%,transparent 100%)}

.hm-couple{position:absolute;z-index:3;bottom:-1vh;left:66%;height:86vh;aspect-ratio:650/841;opacity:0;transform:translate3d(calc(-50% + var(--hm-mx)*12px),calc(var(--hm-my)*5px + 40px),0);transition:opacity .9s ease .15s,transform 1.3s cubic-bezier(.16,1,.3,1) .15s}
.hm-on .hm-couple{opacity:1;transform:translate3d(calc(-50% + var(--hm-mx)*12px),calc(var(--hm-my)*5px),0)}
.hm-couple img{display:block;width:100%;height:100%;transform-origin:50% 100%;animation:hm-sway 7s ease-in-out infinite alternate;filter:drop-shadow(0 0 34px color-mix(in srgb,var(--accent) 28%,transparent))}
@keyframes hm-sway{from{transform:rotate(-.7deg)}to{transform:rotate(.7deg) scale(1.012)}}
.hm-off *{animation-play-state:paused!important}

/* Copy moves to the lower left so the couple stays clear. */
.hero>.hero-content{display:flex;align-items:flex-end;justify-content:flex-start;width:100%;max-width:none;margin:0;padding:0 clamp(16px,3vw,48px) clamp(64px,10vh,96px);text-align:left}
.hero .hero-copy{max-width:min(600px,100%);margin:0}
.hero .hero-copy:before{display:none}
.hero .hero-copy h1{margin:0;font-size:clamp(25px,2.7vw,40px);line-height:1.1;letter-spacing:-.02em;font-weight:800;text-shadow:none}
.hero .hero-copy h1 br{display:none}
.hero .hero-copy h1 .dance-list{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.hero .hero-copy>p:not(.availability){max-width:500px;margin:12px 0 0;padding:0;font-size:clamp(14px,1.05vw,16px);line-height:1.5;color:var(--muted)}
.hero .hero-copy>p:not(.availability):before{display:none}
.hero .hero-actions{justify-content:flex-start;margin-top:18px}
.hero .hero-copy .availability{margin:14px 0 0}

/* Panel mode: the site's bottom bar is fixed over the hero, so everything stays above it. */
html.pm .hm-couple{bottom:calc(var(--hm-foot) - 4px);height:calc(100vh - var(--hm-foot) - 124px)}
html.pm .hero{--hm-foot:84px}
html.pm .hero>.hero-content{padding-bottom:calc(var(--hm-foot) + 20px)}
.hero>.scroll{display:none}

@media(max-width:760px){
.hero{--hm-fs:min(23vw,12vh);--hm-top:76px;min-height:max(100svh,680px)}
.hm-couple{left:54%;height:50vh;bottom:auto;top:13vh}
.hm-scrim{background:linear-gradient(to top,var(--bg) 0%,color-mix(in srgb,var(--bg) 96%,transparent) 34%,transparent 54%)}
.hero>.hero-content{padding-bottom:76px}
.hero .hero-copy .hero-actions{display:flex;flex-wrap:nowrap;gap:8px;width:100%;margin-inline:0}
.hero .hero-copy .hero-actions .button{flex:1 1 auto;width:auto;padding:12px 10px;font-size:12.5px;white-space:nowrap}
}
@media(max-width:350px){
.hero .hero-copy .hero-actions{flex-wrap:wrap}
.hero .hero-copy .hero-actions .button{flex-basis:100%}
}
@media(prefers-reduced-motion:reduce){
.hm-track,.hm-couple img{animation:none}
.hm-row,.hm-couple{transition:none}
}
