.film{text-align:center;padding-bottom:0;position:relative}.film-intro{max-width:760px;margin:0 auto}.film-intro .eyebrow{justify-content:center;margin-bottom:24px}.film-intro h2 em{padding-right:.05em}.film-intro>p:not(.eyebrow){color:#a8937a;text-wrap:balance;max-width:560px;margin:24px auto 0;font-size:16px}.film-stage{--w:min(100%,1400px,max(calc((100svh - 170px)*16/9),560px));isolation:isolate;width:var(--w);margin:clamp(44px,5vw,68px) 0 0 calc((100% - var(--w))/2);position:relative}.film-stage:before{content:"";z-index:-1;pointer-events:none;background:radial-gradient(50% 50% at 50% 47%,#ff7a2e33,#b0451a14 50%,#0000 72%);position:absolute;inset:-16% -9% -26%}.film-stage:after{content:"";z-index:-1;pointer-events:none;background:radial-gradient(50% 50% at 50% 28%,#ff8a3d24,#0000 72%);height:24%;position:absolute;bottom:-12%;left:10%;right:10%}.film-frame{aspect-ratio:16/9;color:#f3e9dc;text-align:left;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;background:#000;border-radius:18px;position:relative;overflow:hidden;box-shadow:0 0 0 5px #15110d,0 0 0 6px #4a33204d,0 60px 120px -40px #000,0 0 180px -40px #ff6a2a70}.film-frame:after{content:"";z-index:5;border-radius:inherit;pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 0 1px #c08a5a70,inset 0 1px #ffdcb42e}.film-frame video,.film-poster,.film-poster img{border-radius:inherit;width:100%;height:100%;position:absolute;inset:0}.film-frame video{object-fit:cover;background:#000}.film-poster{pointer-events:none;transition:opacity 1s var(--ease)}.film-poster img{object-fit:cover;display:block}.film-frame[data-started] .film-poster{opacity:0}.film-start{all:unset;z-index:3;cursor:pointer;transition:opacity .5s var(--ease),visibility 0s;place-items:center;display:grid;position:absolute;inset:0}.film-frame:is([data-state=playing],[data-started][data-state=paused]) .film-start{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .5s var(--ease),visibility 0s .5s}.film-disc{aspect-ratio:1;-webkit-backdrop-filter:blur(10px)saturate(1.25);backdrop-filter:blur(10px)saturate(1.25);width:clamp(58px,6.4vw,92px);transition:transform .6s var(--ease),box-shadow .6s var(--ease),border-color .6s var(--ease);background:radial-gradient(circle at 50% 28%,#3b2a1dc7,#120d09d9 62%,#0b0806eb);border:1px solid #f4c79aa6;border-radius:50%;place-items:center;display:grid;position:relative;box-shadow:0 0 0 6px #0b08061c,0 0 0 7px #f4c79a1c,0 16px 40px -8px #000d,0 0 60px 4px #ff7a2e3d,inset 0 1px #ffe8cc40,inset 0 -8px 18px #0006}.film-disc svg{filter:drop-shadow(0 0 6px #ff9a4e66);width:40%;height:40%;margin-left:7%;transition:opacity .3s}@media (hover:hover){.film-start:hover .film-disc{border-color:#ffdcb8;transform:scale(1.06);box-shadow:0 0 0 7px #0b08061c,0 0 0 8px #f4c79a33,0 18px 44px -8px #000d,0 0 80px 8px #ff7a2e59,inset 0 1px #ffe8cc59,inset 0 -8px 18px #0006}}.film-start:active .film-disc{transform:scale(.97)}.film-start:focus-visible{outline:none}.film-start:focus-visible .film-disc{outline:2px solid var(--gold);outline-offset:6px}.film-cta{letter-spacing:.28em;text-transform:uppercase;color:#ecd6bb;white-space:nowrap;height:12.8%;transition:opacity .5s var(--ease);justify-content:center;align-items:center;gap:12px;font-size:clamp(10px,.78vw,11px);font-weight:600;display:flex;position:absolute;bottom:0;left:0;right:0}.film-cta b{font-weight:600}.film-cta i{background:#ffbd83;border-radius:50%;width:4px;height:4px;box-shadow:0 0 10px 2px #ff7a2e99}.film-cta small{font:inherit;font-family:var(--mono);letter-spacing:.08em;color:#e8a56a;font-weight:500}.film-cta [data-when=ended],.film-frame[data-state=ended] .film-cta [data-when=idle]{display:none}.film-frame[data-state=ended] .film-cta [data-when=ended]{display:inline}.film-frame[data-started] .film-cta{opacity:0}.film-status{color:#ffc29b;margin-top:18px;font-size:13px}.film-status:empty{margin:0}.film-sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}@media (max-width:860px){.film-stage{--w:min(calc(100vw - 32px),max(calc((100svh - 150px)*16/9),560px))}}@media (max-width:600px){.film-frame{border-radius:12px;box-shadow:0 0 0 4px #15110d,0 0 0 5px #4a33204d,0 40px 80px -30px #000,0 0 90px -30px #ff6a2a66}}