:root { color-scheme: dark; --ink: #fff; --serif: Georgia, 'Times New Roman', serif; }
*, *::before, *::after { box-sizing: border-box; }
html { margin: 0; scroll-behavior: smooth; }
body { margin: 0; background: #100e0d; color: var(--ink); -webkit-font-smoothing: antialiased; }
.hero { position: relative; isolation: isolate; min-height: 100vh; min-height: 100svh; overflow: hidden; display: grid; place-items: center; }
.hero__background, .hero__shade { position: absolute; inset: 0; pointer-events: none; }
.hero__background { z-index: -2; background: url('assets/images/landscape.jpg') center 48% / cover no-repeat; }
.hero__shade { z-index: -1; background: linear-gradient(to bottom, rgba(16,12,14,.13) 0%, rgba(8,7,9,.02) 31%, rgba(8,7,9,.12) 58%, rgba(0,0,0,.81) 100%); }
.hero__content { width: 100%; display: flex; flex-direction: column; align-items: center; padding: clamp(20px, 4vh, 52px) 24px; text-align: center; }
.hero__eyebrow { margin: 0 0 clamp(34px, 5.4vh, 66px); font: italic 400 clamp(9px, .75vw, 13px)/1.5 var(--serif); letter-spacing: .13em; text-transform: uppercase; color: rgba(255,255,255,.77); }
.hero__title { width: min(68vw, 1060px); margin: 0; line-height: 0; font-size: 0; }
.hero__title-video { display: block; width: 100%; height: auto; mix-blend-mode: screen; pointer-events: none; }
.hero__credits { display: flex; align-items: center; justify-content: center; column-gap: clamp(25px, 2.3vw, 50px); row-gap: 7px; margin-top: clamp(42px, 5.6vh, 76px); }
.hero__credits p { margin: 0; font: 400 clamp(13px, 1.2vw, 20px)/1.5 var(--serif); white-space: nowrap; }
.visually-hidden { position: absolute!important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@media (max-width: 767px) {
  .hero { min-height: 100svh; }
  .hero__background { background-position: 50% center; }
  .hero__shade { background: linear-gradient(to bottom,rgba(12,10,12,.22) 0%, rgba(10,9,10,.07) 35%,rgba(0,0,0,.8) 100%); }
  .hero__content { padding: 24px 12px; }
  .hero__eyebrow { font-size: 9px; letter-spacing: .11em; margin-bottom: 30px; }
  .hero__title { width: min(96vw, 650px); }
  .hero__credits { margin-top: 38px; flex-wrap: wrap; column-gap: 18px; }
  .hero__credits p { font-size: clamp(11px, 3vw, 15px); }
}
@media (max-width: 430px) { .hero__credits { flex-direction: column; row-gap: 4px; } }
@media (max-height: 520px) and (min-width: 768px) { .hero__content { padding-block: 12px; } .hero__eyebrow { margin-bottom: 20px; } .hero__title { width: min(62vw, 800px); } .hero__credits { margin-top: 22px; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* SECTION 02 — FILM INTRODUCTION */
.film-intro {
  background: #000;
  color: #f5f1ec;
  min-height: 40vh;
  min-height: 40svh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(30px, 5vh, 58px) 24px;
  text-align: center;
}
.film-intro__text {
  width: 100%;
  max-width: 550px;
  margin: 0;
  font-family: var(--serif);
  font-size: clamp(17px, 1.24vw, 21px);
  font-weight: 400;
  line-height: 1.46;
  letter-spacing: .005em;
  text-wrap: pretty;
}
@media (max-width: 767px) {
  .film-intro { min-height: 40svh; padding: 44px 28px; }
  .film-intro__text { max-width: 500px; font-size: clamp(17px, 4.15vw, 20px); line-height: 1.55; }
}

/* SECTION 03 — TRAILER */
.trailer-section { position: relative; min-height: 100vh; min-height: 100svh; display: grid; place-items: center; background: #080609 url('assets/images/trailer-background.jpg') center center / cover no-repeat; }
.trailer-section__play { display: grid; place-items: center; width: 73px; height: 73px; padding: 0; border: 1px solid rgba(255,255,255,.48); border-radius: 50%; color: #fff; background: rgba(5,5,12,.45); cursor: pointer; transition: background .2s, transform .2s, border-color .2s; }
.trailer-section__play svg { display: block; transform: none; }
.trailer-section__play:hover { background: rgba(0,0,0,.77); border-color: #fff; transform: scale(1.06); }
.trailer-section__play:focus-visible, .trailer-modal button:focus-visible, .trailer-modal input:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.trailer-modal[hidden], .trailer-modal__error[hidden] { display: none !important; }
.trailer-modal { position: fixed; z-index: 1000; inset: 0; display: grid; place-items: center; padding: 22px; }
.trailer-modal__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.87); }
.trailer-modal__panel { position: relative; z-index: 1; width: 100%; color: #fff; }
.trailer-modal__panel--password { max-width: 420px; padding: 50px clamp(25px, 5vw, 48px) 42px; background: #101014; border: 1px solid rgba(255,255,255,.22); font-family: var(--serif); text-align: center; }
.trailer-modal__panel--password h2 { margin: 0 0 12px; font-size: clamp(25px, 5vw, 31px); font-weight: 400; }
.trailer-modal__panel--password p { margin: 0 0 30px; color: #cecece; font-size: 15px; line-height: 1.5; }
.trailer-modal__panel--password form { display: flex; flex-direction: column; gap: 13px; text-align: left; }
.trailer-modal__panel--password label { font-size: 13px; }
.trailer-modal__panel--password input { width: 100%; min-height: 48px; padding: 12px 14px; color: #fff; background: #050507; border: 1px solid #666; border-radius: 0; font: 16px var(--serif); }
.trailer-modal__panel--password .trailer-modal__error { margin: 0; color: #ffb9b9; font: 13px/1.4 Arial, sans-serif; }
.trailer-modal__submit { min-height: 48px; margin-top: 12px; border: 1px solid #fff; background: #fff; color: #000; font: 12px Arial, sans-serif; letter-spacing: .12em; cursor: pointer; }
.trailer-modal__submit:hover { background: #ddd; }
.trailer-modal__close { position: absolute; right: 13px; top: 10px; z-index: 2; border: 0; padding: 0 8px; color: #fff; background: transparent; font: 32px/1.25 Arial, sans-serif; cursor: pointer; }
.trailer-modal__panel--video { max-width: 1120px; }
.trailer-modal__video { width: 100%; aspect-ratio: 16 / 9; background: #000; box-shadow: 0 12px 70px rgba(0,0,0,.65); }
.trailer-modal__video iframe { display: block; width: 100%; height: 100%; border: 0; }
.trailer-modal__close--video { top: -46px; right: 0; }
body.trailer-modal-open { overflow: hidden; }
@media (max-width: 767px) { .trailer-section { background-position: center; } .trailer-section__play { width: 68px; height: 68px; } .trailer-modal { padding: 16px; } .trailer-modal__panel--password { padding: 44px 25px 32px; } }
@media (prefers-reduced-motion: reduce) { .trailer-section__play { transition: none; } }


/* SECTION 04 — THE FILM / DECK COVER */
.film-deck { position:relative; isolation:isolate; min-height:860px; min-height:100svh; overflow:hidden; background:#000; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:86px 20px 108px; text-align:center; }
.film-deck__glow { position:absolute; z-index:-1; left:50%; top:50%; width:min(1100px,110vw); height:min(690px,80vh); transform:translate(-50%,-50%); pointer-events:none; background:radial-gradient(ellipse at center,rgba(75,37,118,.42) 0%,rgba(39,24,68,.27) 36%,rgba(0,0,0,0) 74%); filter:blur(30px); }
.film-deck__heading { margin:0 0 51px; font:italic 400 clamp(28px,2.2vw,39px)/1.2 var(--serif); color:#f4f0ed; }
.film-deck__cover-button { display:flex; flex-direction:column; align-items:center; padding:0; border:0; background:transparent; color:#fff; cursor:pointer; }
.film-deck__cover-frame { position:relative; display:block; width:clamp(220px,20vw,345px); aspect-ratio: .71; overflow:hidden; border:2px solid rgba(97,35,157,.75); background:#1d1230; box-shadow:6px 6px 0 rgba(0,0,0,.8),8px 8px 0 rgba(155,148,154,.32),0 25px 85px rgba(17,6,39,.48); transition:transform .35s ease,box-shadow .35s ease; }
.film-deck__cover-frame img { width:100%; height:100%; display:block; object-fit:cover; object-position:center; filter:brightness(.48); }
.film-deck__cover-scrim { position:absolute; inset:0; background:linear-gradient(0deg,rgba(4,0,11,.37),rgba(39,9,58,.2)); }
.film-deck__cover-type { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:13px; color:white; text-align:center; text-shadow:0 2px 15px #000; }
.film-deck__cover-type>span { font:italic 400 clamp(25px,2vw,33px)/1.12 var(--serif); }
.film-deck__cover-type small { font:500 10px/1.5 Arial,sans-serif; letter-spacing:.14em; }
.film-deck__open-label { margin-top:23px; font:500 12px/1.3 Arial,sans-serif; letter-spacing:.055em; color:#bcb6b6; }
.film-deck__open-label span { color:#a85ce3; font-size:15px; margin-left:3px; }
.film-deck__cover-button:hover .film-deck__cover-frame { transform:translateY(-7px) rotate(-.7deg); box-shadow:7px 13px 0 rgba(0,0,0,.75),9px 15px 0 rgba(155,148,154,.27),0 30px 100px rgba(92,29,138,.45); }
.film-deck__cover-button:focus-visible,.deck-reader button:focus-visible,.deck-reader__stage:focus-visible { outline:2px solid #c591ef; outline-offset:6px; }

/* Fullscreen reader */
.deck-reader[hidden],.deck-reader__rotate[hidden] { display:none!important; }
.deck-reader { position:fixed; inset:0; z-index:2000; width:100%; height:100vh; height:100dvh; display:flex; flex-direction:column; padding:env(safe-area-inset-top) max(12px,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(12px,env(safe-area-inset-left)); background:#050407; color:#fff; overflow:hidden; }
body.deck-reader-open { overflow:hidden; }
.deck-reader__ambient { position:absolute; inset:-30%; z-index:-1; pointer-events:none; background:radial-gradient(ellipse at center,rgba(55,27,81,.26),transparent 51%); }
.deck-reader__topbar { flex:0 0 auto; display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; min-height:68px; padding:0 clamp(14px,3vw,50px); }
.deck-reader__brand { font:500 clamp(10px,.92vw,13px)/1.4 Arial,sans-serif; letter-spacing:.14em; }
.deck-reader__brand span { color:#8a8290; }
.deck-reader__toolbar { display:flex; align-items:center; gap:clamp(14px,2vw,30px); }
.deck-reader__counter { color:#b6abbc; font:12px Arial,sans-serif; white-space:nowrap; font-variant-numeric:tabular-nums; }
.deck-reader__close { display:grid; place-items:center; width:42px; height:42px; background:transparent; border:1px solid #524959; border-radius:50%; color:white; cursor:pointer; }
.deck-reader__close svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.5; }
.deck-reader__stage { position:relative; flex:1 1 auto; min-height:0; width:100%; display:flex; align-items:center; justify-content:center; gap:clamp(6px,2vw,40px); padding:5px clamp(0px,2vw,30px); touch-action:pan-y; }
.deck-reader__paper { position:relative; flex:0 1 auto; max-width:min(1370px,calc(100% - 110px)); width:auto; height:auto; max-height:100%; aspect-ratio:16/9; box-shadow:0 22px 80px rgba(0,0,0,.65); background:#101014; overflow:hidden; }
.deck-reader__page { display:block; width:100%; height:100%; max-height:100%; object-fit:contain; user-select:none; -webkit-user-drag:none; }
.deck-reader__paper { width:min(100%,calc((100dvh - 172px)*16/9),1370px); }
.deck-reader__page.is-changing { opacity:.2; transform:translateX(var(--page-direction,16px)) scale(.992); }
.deck-reader__page { transition:opacity .16s ease,transform .16s ease; }
.deck-reader__loading { position:absolute; inset:0; display:flex; gap:9px; justify-content:center; align-items:center; background:rgba(8,5,12,.91); color:#d4c5dd; font:500 11px Arial,sans-serif; letter-spacing:.15em; }
.deck-reader__loading[hidden] { display:none; }
.deck-reader__loading-dots { color:#a762d4; }
.deck-reader__arrow { flex:0 0 auto; width:44px; height:44px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.22); border-radius:50%; background:rgba(17,13,21,.6); color:white; cursor:pointer; transition:background .2s; }
.deck-reader__arrow svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; }
.deck-reader__arrow:hover:not(:disabled) { background:#39204c; }
.deck-reader__arrow:disabled { opacity:.2; cursor:default; }
.deck-reader__footer { flex:0 0 auto; display:flex; align-items:center; justify-content:space-between; gap:18px; min-height:66px; padding:0 clamp(14px,3vw,50px); color:#8e8591; }
.deck-reader__hint,.deck-reader__foot-counter { font:500 10px/1.3 Arial,sans-serif; letter-spacing:.12em; white-space:nowrap; }
.deck-reader__progress { flex:1 1 auto; max-width:330px; height:1px; background:#3a3040; }
.deck-reader__progress span { display:block; width:3.448%; height:100%; background:#ad68d5; transition:width .25s ease; }
.deck-reader__rotate { position:absolute; z-index:3; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:38px; background:rgba(6,4,10,.96); text-align:center; }
.deck-reader__rotate svg { color:#c58be8; transform:rotate(-10deg); }
.deck-reader__rotate h3 { margin:25px 0 10px; font:italic 30px/1.2 var(--serif); }
.deck-reader__rotate p { max-width:280px; font:15px/1.5 var(--serif); color:#c7bccd; }
.deck-reader__rotate button { margin-top:24px; padding:12px 16px; border:1px solid #81708a; background:transparent; color:#d3c4dc; font:11px Arial,sans-serif; letter-spacing:.11em; cursor:pointer; }
@media(max-width:767px) { .film-deck { min-height:650px; padding:85px 20px; } .film-deck__heading { margin-bottom:42px; } .film-deck__cover-frame { width:min(63vw,310px); } .deck-reader__topbar { min-height:56px; } .deck-reader__brand { font-size:10px; } .deck-reader__brand span { display:none; } .deck-reader__stage { gap:4px; padding:0; } .deck-reader__paper { width:min(100%,calc((100dvh - 125px)*16/9)); max-width:calc(100% - 58px); } .deck-reader__arrow { width:27px; height:38px; border:0; background:transparent; } .deck-reader__arrow svg { width:17px; } .deck-reader__footer { min-height:45px; } .deck-reader__hint { font-size:9px; } .deck-reader__progress { max-width:130px; } }
@media(max-width:480px) { .deck-reader__progress { display:none; } .deck-reader__footer { justify-content:center; } .deck-reader__foot-counter { display:none; } }
@media(max-height:500px) and (orientation:landscape) { .deck-reader__topbar { min-height:43px; } .deck-reader__footer { min-height:30px; } .deck-reader__paper { width:min(100%,calc((100dvh - 80px)*16/9),1370px); } }
@media(prefers-reduced-motion:reduce) { .film-deck__cover-frame,.deck-reader__page,.deck-reader__progress span { transition:none; } }

/* SECTION 05 — CONTACT FOOTER / PATCH 06 */
.site-footer { background:#000; color:#fff; min-height:clamp(390px,57svh,650px); display:grid; place-items:center; padding:clamp(80px,11vh,130px) 24px; text-align:center; }
.site-footer__inner { display:flex; flex-direction:column; align-items:center; width:100%; }
.site-footer__credit { margin:0; font:400 clamp(18px,1.45vw,23px)/1.35 Arial,Helvetica,sans-serif; }
.site-footer__email { display:inline-block; margin-top:22px; color:rgba(255,255,255,.9); font:400 clamp(13px,1vw,16px)/1.5 Arial,Helvetica,sans-serif; text-decoration:underline; text-underline-offset:3px; transition:opacity .2s; }
.site-footer__email:hover { opacity:.65; }
.site-footer__email:focus-visible { outline:2px solid #fff; outline-offset:6px; }
.site-footer__logo { display:block; width:clamp(105px,9vw,132px); height:auto; margin-top:clamp(54px,7vh,80px); object-fit:contain; }
@media(max-width:767px) { .site-footer { min-height:390px; padding:85px 20px 100px; } .site-footer__logo { width:118px; margin-top:62px; } }
@media(prefers-reduced-motion:reduce) { .site-footer__email { transition:none; } }

/* PATCH 07 — Responsive hero centering & compact trailer on phones */
.hero { place-items: center; }
.hero__content { justify-content: center; margin-inline: auto; }
@media (max-width: 767px) {
  .trailer-section { min-height: 55vh; min-height: 55svh; }
}
@media (max-height: 480px) {
  .hero__content { padding-block: 10px; }
  .hero__eyebrow { margin-bottom: clamp(8px, 3vh, 20px); }
  .hero__credits { margin-top: clamp(8px, 3vh, 20px); }
  .hero__title { width: min(64vw, 720px); }
}

/* PATCH 09 — Safari native fullscreen + genuine viewport overlay fallback. */
body.deck-reader-open { position:fixed; width:100%; left:0; right:0; overflow:hidden; }
.deck-reader:not([hidden]) { position:fixed; top:0; left:0; right:0; bottom:0; width:100vw; width:100%; height:var(--deck-view-height,100dvh); min-height:0; z-index:99999; box-sizing:border-box; }
.deck-reader:fullscreen,.deck-reader:-webkit-full-screen { width:100%; height:100%; inset:0; max-height:none; background:#050407; }
.deck-reader:fullscreen .deck-reader__paper,.deck-reader:-webkit-full-screen .deck-reader__paper { max-height:100%; }
@supports (-webkit-touch-callout:none) { .deck-reader:not([hidden]) { height:var(--deck-view-height,100dvh); } }

/* PATCH 16 — Audio control above Vimeo trailer (not the deck). */
.trailer-modal__unmute[hidden] { display:none !important; }
.trailer-modal__unmute { position:absolute; z-index:4; top:-47px; left:0; display:inline-flex; gap:9px; align-items:center; justify-content:center; min-height:37px; padding:7px 13px; color:#fff; background:rgba(16,12,22,.9); border:1px solid rgba(255,255,255,.55); border-radius:22px; font:600 11px/1 Arial,sans-serif; letter-spacing:.12em; cursor:pointer; }
.trailer-modal__unmute svg { width:18px; height:18px; }
.trailer-modal__unmute:hover { background:#292333; }
.trailer-modal__unmute:disabled { opacity:.65; cursor:wait; }
@media (max-width:767px) { .trailer-modal__unmute { top:-45px; left:0; } }


/* PATCH 17 — Mobile landscape presentation start (desktop unaffected). */
.deck-reader__start[hidden] { display:none!important; }
.deck-reader__start {
  position:absolute; inset:0; z-index:5;
  display:flex; align-items:center; justify-content:center;
  background:rgba(4,3,7,.985); color:#fff; text-align:center;
  padding:24px max(24px,env(safe-area-inset-right)) 24px max(24px,env(safe-area-inset-left));
}
.deck-reader__start-content { display:flex; align-items:center; flex-direction:column; gap:14px; max-width:340px; }
.deck-reader__start-content svg { color:#c49dde; }
.deck-reader__start-content h3 { margin:6px 0 0; font:italic 400 clamp(23px,5vw,34px)/1.2 var(--serif); }
.deck-reader__start-content p { margin:0 0 13px; color:#c5bccb; font:15px/1.4 var(--serif); }
#deck-start-button { padding:15px 25px; border:1px solid #eee; color:#111; background:#fff; font:600 11px/1.2 Arial,sans-serif; letter-spacing:.12em; cursor:pointer; }
#deck-start-button:focus-visible { outline:2px solid #ba8dde; outline-offset:4px; }
@media (min-width:768px) and (pointer:fine) { .deck-reader__start { display:none!important; } }

/* PATCH 18 — Vimeo fullscreen action next to UNMUTE. */
.trailer-modal__fullscreen[hidden] { display:none!important; }
.trailer-modal__fullscreen {
  position:absolute; z-index:4; top:-47px; left:132px;
  display:inline-flex; gap:9px; align-items:center; justify-content:center;
  min-height:37px; padding:7px 13px; color:#fff;
  background:rgba(16,12,22,.9); border:1px solid rgba(255,255,255,.55);
  border-radius:22px; font:600 11px/1 Arial,sans-serif; letter-spacing:.12em; cursor:pointer;
}
.trailer-modal__fullscreen svg { width:18px; height:18px; }
.trailer-modal__fullscreen:hover { background:#292333; }
.trailer-modal__fullscreen:focus-visible { outline:2px solid #fff; outline-offset:3px; }
@media(max-width:767px){ .trailer-modal__fullscreen {top:-45px;left:130px;} }
