/* One viewport, one entrance. The surrounding application keeps its existing styles. */
html:has(.cinema-page){height:100%;overflow:hidden;overscroll-behavior:none}
.landing-page.cinema-page{--hero-night:#070808;--hero-gutter:clamp(20px,4.2vw,68px);--hero-ease:cubic-bezier(.16,1,.3,1);position:fixed;inset:0;width:100%;height:100dvh;min-height:0;display:block;overflow:hidden;overscroll-behavior:none;background:var(--hero-night)}
.cinema-page:before{display:none}
.cinema-hero,.hero-film,.hero-shade,.intro-cover{position:absolute;inset:0}
.cinema-hero{overflow:hidden;isolation:isolate}
.hero-film{z-index:0;background:var(--hero-night)}
.hero-film img,.hero-film video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 45%}
.hero-film video{opacity:0;transition:opacity .55s ease}
.hero-film video.ready{opacity:1}
.hero-shade{pointer-events:none;z-index:1;background:linear-gradient(180deg,oklch(12% .015 90 / .8),transparent 35%,oklch(12% .015 90 / .1) 48%,oklch(12% .015 90 / .78) 80%,oklch(12% .015 90 / .94))}
.intro-cover{z-index:2;overflow:hidden;background:var(--hero-night);opacity:0;pointer-events:none;transition:opacity .75s var(--hero-ease)}
.hero-intro.logo-stage{inset:0;width:100%;height:100%;transform:none;z-index:3;pointer-events:none;display:none}
.hero-intro.logo-stage canvas{inset:0;width:100%;height:100%;opacity:0;transform-origin:50% 50%;transform:scale(.28);filter:blur(18px)}
.intro-arriving .hero-intro canvas{animation:logo-materialize 1.12s cubic-bezier(.22,.61,.36,1) both;will-change:transform,opacity,filter}
@keyframes logo-materialize{0%{opacity:0;transform:scale(.28);filter:blur(18px)}28%{opacity:.4;filter:blur(12px)}68%{opacity:.94;filter:blur(3px)}100%{opacity:1;transform:scale(1);filter:blur(0)}}
.intro-smoke{position:absolute;inset:0;overflow:hidden;pointer-events:none;mask-image:radial-gradient(ellipse at 50% 50%,#fff9,transparent 78%)}
.smoke-thread{position:absolute;width:min(135vw,1000px);max-width:none;height:125%;object-fit:fill;opacity:.22;will-change:transform}
.smoke-thread-one{left:-48%;top:4%;animation:smoke-rise 15s ease-in-out -5s infinite alternate}
.smoke-thread-two{right:-52%;bottom:0;opacity:.16;animation:smoke-drift 19s ease-in-out -8s infinite alternate}
@keyframes smoke-rise{from{transform:translate3d(-3%,10%,0) rotate(-16deg) scale(.92)}to{transform:translate3d(14%,-12%,0) rotate(9deg) scale(1.12)}}
@keyframes smoke-drift{from{transform:translate3d(5%,10%,0) rotate(165deg) scale(1.15)}to{transform:translate3d(-14%,-8%,0) rotate(188deg) scale(.98)}}
.intro-revealed .smoke-thread,.hero-loading .smoke-thread{animation-play-state:paused}
.cinema-page .cinema-header{position:absolute;inset:0 0 auto;z-index:5;align-items:flex-start;gap:12px;padding:calc(23px + env(safe-area-inset-top)) var(--hero-gutter) 0;color:var(--paper)}
.cinema-page .landing-wordmark{font-size:clamp(13px,2vw,23px);letter-spacing:.095em;gap:8px;min-height:44px}
.cinema-page .landing-wordmark span{font-size:.72em;letter-spacing:.13em}
.hero-metadata{display:flex;gap:18px;font-size:9px;letter-spacing:.18em;color:oklch(88% .014 90 / .72);margin-top:8px}
.cinema-header .language select{padding:0 2px;min-width:42px;font-size:12px;min-height:44px}
.hero-location{position:absolute;top:calc(102px + env(safe-area-inset-top));right:var(--hero-gutter);z-index:4;display:flex;align-items:center;gap:9px;min-height:44px;font-size:10px;letter-spacing:.13em;color:var(--paper);text-shadow:0 1px 12px var(--ink)}
.location-arrow{color:var(--yellow);font-size:17px;margin-left:6px}
.hero-links{position:absolute;bottom:calc(100px + env(safe-area-inset-bottom));left:var(--hero-gutter);right:var(--hero-gutter);z-index:4;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;max-width:520px;margin-inline:auto}
.hero-link{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:18px 17px;min-height:60px;background:oklch(15% .01 90 / .65);border:1px solid oklch(94% .014 90 / .5);border-radius:4px;font-size:11px;font-weight:500;letter-spacing:.09em;transition:background .2s, border-color .2s}
.hero-link svg{width:19px;height:19px;fill:none;stroke:var(--yellow);stroke-width:1.6;flex-shrink:0;transition:transform .25s var(--hero-ease)}
.hero-link-book{grid-column:1/-1;min-height:66px;background:var(--yellow);border-color:var(--yellow);color:var(--ink);font-size:15px;padding-inline:22px}
.hero-link-book svg{stroke:currentColor;width:24px;height:24px}
.hero-link:active{filter:brightness(.9)}
.cinema-footer{position:absolute;inset:auto 0 0;z-index:5;display:flex;flex-direction:column;align-items:center;gap:0;padding:0 var(--hero-gutter) calc(12px + env(safe-area-inset-bottom));font-size:10px;color:oklch(86% .015 90);letter-spacing:.025em}
.cinema-footer a{min-height:30px;display:inline-flex;align-items:center}
.hero-legal{display:flex;gap:22px;font-size:10px}
.hero-legal a{min-height:32px}
.cinema-page.intro-active .intro-cover{opacity:1}
.cinema-page.intro-active .hero-intro{display:block}
.cinema-page.intro-active .hero-links,.cinema-page.intro-active .hero-location{visibility:hidden}
.cinema-page.intro-revealed .intro-cover{opacity:0}
.cinema-page.intro-revealed .hero-links,.cinema-page.intro-revealed .hero-location{visibility:visible}
.intro-revealed .hero-link{animation:hero-rise .85s var(--hero-ease) both}
.intro-revealed .hero-link:nth-child(2){animation-delay:.1s}
.intro-revealed .hero-link:nth-child(3){animation-delay:.2s}
.intro-revealed .hero-location{animation:location-arrive .9s .12s var(--hero-ease) both}
@keyframes hero-rise{from{opacity:0;transform:translate3d(0,40px,0)}to{opacity:1;transform:translateZ(0)}}
@keyframes location-arrive{from{opacity:0;transform:translate3d(0,-26px,0)}to{opacity:1;transform:translateZ(0)}}
@media(hover:hover){.hero-link:hover{border-color:var(--yellow);background:oklch(22% .018 90 / .9)}.hero-link-book:hover{background:oklch(91% .18 103);color:var(--ink)}.hero-link:hover svg{transform:translate(2px,-2px)}.hero-location:hover,.hero-legal a:hover,.hero-address:hover{color:var(--yellow)}}
@media(min-width:700px){.cinema-page .cinema-header{padding-top:calc(30px + env(safe-area-inset-top))}.hero-metadata{font-size:10px;gap:24px;margin-top:12px}.hero-location{top:calc(105px + env(safe-area-inset-top));font-size:11px}.hero-links{grid-template-columns:repeat(3,1fr);max-width:790px;gap:16px;bottom:calc(102px + env(safe-area-inset-bottom))}.hero-link-book{grid-column:auto}.hero-link{min-height:68px;padding:20px 23px;font-size:13px}.hero-link-book{font-size:14px}.cinema-footer{flex-direction:row;justify-content:space-between;align-items:center;padding-bottom:calc(22px + env(safe-area-inset-bottom));font-size:11px}.hero-legal{font-size:11px;gap:25px}.hero-legal a{min-height:44px}.hero-film img,.hero-film video{object-position:center 48%}}
@media(max-width:359px){.landing-page.cinema-page{--hero-gutter:16px}.cinema-page .landing-wordmark{font-size:12px;letter-spacing:.065em;gap:5px}.hero-link{padding-inline:12px;font-size:9px;letter-spacing:.045em;gap:6px}.hero-link svg{width:16px;height:16px}.hero-link-book{font-size:14px}.hero-metadata{font-size:8px}}
@media(max-height:540px) and (orientation:landscape){.cinema-page .cinema-header{padding-top:12px}.hero-metadata{margin-top:3px}.hero-location{top:60px}.hero-links{grid-template-columns:repeat(3,1fr);bottom:64px;max-width:760px}.hero-link-book{grid-column:auto}.hero-link{min-height:50px;padding:12px 18px;font-size:11px}.cinema-footer{flex-direction:row;justify-content:space-between;padding-bottom:8px}.hero-shade{background:linear-gradient(180deg,oklch(12% .015 90 / .85),transparent 44%,oklch(12% .015 90 / .9))}}
@media(prefers-reduced-motion:reduce){.cinema-page .hero-intro{display:none}.cinema-page .intro-cover{display:none}.hero-film video{transition:none}}

/* The loading screen exists before deferred scripts run, preventing a flat-logo flash. */
.hero-loader{position:fixed;inset:0;z-index:90;display:grid;place-items:center;background:var(--hero-night);color:var(--paper);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .24s ease,visibility .24s}
.hero-loading .hero-loader{opacity:1;visibility:visible;pointer-events:auto}
.hero-loading .cinema-hero,.hero-loading .cinema-header,.hero-loading .cinema-footer{visibility:hidden}
/* Hidden visually, but laid out so WebGL can render at the correct viewport size. */
.hero-loading .hero-intro{visibility:hidden}
.loader-content{opacity:0;transition:opacity .1s ease;width:min(220px,65vw);display:grid;justify-items:center;gap:24px}
.hero-loading .loader-content{opacity:1}
.loader-brand{font-size:13px;letter-spacing:.16em;white-space:nowrap}
.loader-track{width:82px;height:2px;overflow:hidden;background:oklch(30% .016 90)}
.loader-track:after{content:'';display:block;width:45%;height:100%;background:var(--yellow);animation:loader-sweep 1.15s cubic-bezier(.65,0,.35,1) infinite}
.loader-label{font-size:10px;letter-spacing:.12em;color:var(--muted)}
@keyframes loader-sweep{from{transform:translateX(-110%)}to{transform:translateX(330%)}}
@media(prefers-reduced-motion:reduce){.loader-track:after{width:100%;animation:none}.hero-loader{transition:none}}

@media(prefers-reduced-motion:reduce){.smoke-thread{animation:none;will-change:auto}.hero-intro.logo-stage canvas{animation:none;filter:none;transform:none;will-change:auto}}
