/* The first scene fills the viewport, including the transparent navigation. */
header{position:absolute;inset:0 0 auto;z-index:10;background:linear-gradient(180deg,#0c1523c9,#0c152342);border-bottom-color:#d3deea24}
.hero{height:100svh;min-height:720px;max-height:none;padding:132px 7% 148px;align-items:center}
.hero-content{width:44%;max-width:640px}
.hero-poster,.hero-video{object-position:center center}
.hero-media::after{background:linear-gradient(180deg,#0a132454 0%,transparent 22%,transparent 74%,#0a1324a8 100%),linear-gradient(90deg,#0b1426e8 0%,#0b1426d6 30%,#0b14268c 43%,#0b142620 55%,transparent 68%)}
.hero h1{font-size:clamp(42px,3.55vw,68px)}
.hero .intro{max-width:520px}
.hero .art-coordinate{top:125px;right:7%}
.hero .hero-bottom{left:7%;right:7%;bottom:27px}
.hero-media-tools{right:7%;bottom:76px;max-width:650px}
@media(min-width:1600px){.hero{padding-left:7%;padding-right:7%}.hero-content{max-width:690px}}
@media(max-width:1100px){.hero{min-height:720px;padding-top:126px}.hero-content{width:48%}.hero h1{font-size:44px}.hero .intro{font-size:14px}.hero-media::after{background:linear-gradient(180deg,#0a132454,transparent 25%,transparent 74%,#0a1324b8),linear-gradient(90deg,#0b1426ee 0%,#0b1426d4 33%,#0b14268f 48%,#0b142620 65%,transparent 78%)}}
@media(max-width:760px){header{height:76px}.hero{height:100svh;min-height:740px;padding:120px 6% 180px;align-items:flex-start}.hero-content{width:100%;max-width:440px;padding-top:0}.hero h1{font-size:36px}.hero .intro{max-width:420px;font-size:14px}.hero-poster,.hero-video{object-position:66% center}.hero-media::after{background:linear-gradient(180deg,#0b1426cc 0%,#0b1426d4 12%,#0b1426bb 42%,#0b142638 64%,#0b142645 82%,#0b1426e8 100%)}.hero .art-coordinate{display:none}.hero-media-tools{left:6%;right:6%;bottom:65px}.hero .hero-bottom{left:6%;right:6%;bottom:22px}.hero .eyebrow{font-size:8px}.hero .hero-bottom>a{font-size:8px}}
@media(max-width:380px){.hero{min-height:710px;padding-top:116px}.hero h1{font-size:31px}.hero .intro{font-size:13px}.hero .hero-actions{gap:14px}.hero-media-tools{bottom:62px}}
@media(max-height:700px) and (min-width:761px){.hero{min-height:680px;padding-top:115px;padding-bottom:130px}.hero h1{font-size:44px}.hero .hero-context{font-size:.43em}.hero .eyebrow{margin-bottom:18px}.hero .intro{margin-bottom:22px}.hero-media-tools{bottom:66px}.hero .art-coordinate{top:112px}}