/* Two large frames travel on one horizontal rail, driven by native page scroll. */
.home-film{--film-shift:0px;--film-progress:0;--film-scale:1;--film-height:min(50svh,550px);--film-half-screen:calc(var(--film-height) * .8888889);position:relative;background:#101114;color:#fff;scroll-margin-top:0}
.film-sticky{display:flex;flex-direction:column;justify-content:center;gap:26px;padding:42px 0 36px;overflow:clip}
.home-film.has-film-motion{height:210svh}
.has-film-motion .film-sticky{position:sticky;top:0;height:100svh}
.film-heading{display:flex;align-items:end;justify-content:space-between;gap:30px}
.film-kicker{display:flex;align-items:center;gap:10px;color:#c6c6ca;font:700 11px/1.2 var(--body);letter-spacing:.15em;text-transform:uppercase}
.film-kicker::before{content:"";width:18px;height:2px;background:#e51c3c}
.film-heading h2{margin:12px 0 0;font:800 clamp(35px,4vw,58px)/.98 var(--display);text-transform:uppercase;letter-spacing:-.015em}
.film-heading p{max-width:270px;margin:0;color:#bcbcc2;font-size:15px;line-height:1.45}
.film-window{position:relative;flex:none;overflow:clip;width:100%;padding:calc(var(--film-height) * .045) 0}
.film-track{position:relative;left:50%;display:flex;align-items:center;gap:clamp(28px,4vw,64px);width:max-content;transform:translate3d(calc(-100% + var(--film-half-screen) + var(--film-shift)),0,0)}
.film-side{width:min(68vw,1000px);height:var(--film-height);position:relative;flex:none;margin:0;overflow:hidden;background:#26262a;opacity:var(--film-side-opacity,1)}
.film-side img{width:100%;height:100%;object-fit:cover;object-position:center 70%;opacity:.86}
.film-side::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#101114c9,transparent 65%)}
.film-side figcaption{position:absolute;bottom:28px;left:30px;right:25px;z-index:1;font:800 clamp(32px,4vw,60px)/.95 var(--display);text-transform:uppercase}
.film-side figcaption small{display:block;margin-bottom:8px;font:700 10px/1 var(--body);letter-spacing:.16em;color:#d1d1d5}
.film-screen{position:relative;display:block;flex:none;height:var(--film-height);aspect-ratio:16/9;background:#08090b;outline:1px solid #ffffff30;outline-offset:0;overflow:hidden;transform:scale(var(--film-scale));z-index:1}
.film-screen picture,.film-screen img,.film-loop{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.film-loop{opacity:0;pointer-events:none}
.film-screen.has-frames .film-loop{opacity:1}
.film-screen:focus-visible{outline:3px solid #fff;outline-offset:4px}
.film-play-badge{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:72px;height:72px;background:#fff;color:#101114;border:1px solid #10111440;outline:7px solid #10111450;border-radius:50%;transition:transform .25s,background .25s}
.film-play-badge svg{width:24px;height:24px;margin-left:4px;fill:currentColor}
.film-screen:hover .film-play-badge,.film-screen:focus-visible .film-play-badge{transform:translate(-50%,-50%) scale(1.08);background:#eee}
.film-caption{display:flex;align-items:center;gap:24px}
.film-direction{display:flex;align-items:center;gap:9px;margin-top:12px;color:#fff;font-size:11px;letter-spacing:.04em}
.film-direction svg{width:40px;height:10px;fill:none;stroke:currentColor;stroke-width:1.2}
.film-rail-position{display:flex;gap:8px;align-items:center;flex:none;color:#aaaab1;font:600 11px/1 var(--body);font-variant-numeric:tabular-nums;letter-spacing:.05em}
.film-rail-position b{color:#fff;font-weight:700}
.film-watch{display:inline-flex;align-items:center;gap:12px;min-height:44px;font:700 16px/1 var(--body);white-space:nowrap}
.film-watch span{color:#ababaf;font-size:12px;font-variant-numeric:tabular-nums}
.film-watch svg{width:13px;height:13px;fill:currentColor}
.film-watch:hover,.film-watch:focus-visible{color:#fff;text-decoration:underline;text-underline-offset:6px}
.film-scroll-meter{height:2px;background:#ffffff23;flex:1;overflow:hidden}
.film-scroll-meter span{display:block;height:100%;background:#df1435;transform:scaleX(var(--film-progress));transform-origin:left}
.film-loop-toggle{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 4px;border:0;background:transparent;color:#c8c8cc;cursor:pointer;font-size:12px}
.film-loop-toggle[hidden]{display:none}
.film-loop-toggle:hover{color:#fff}
.film-loop-toggle:focus-visible,.film-watch:focus-visible{outline:2px solid #fff;outline-offset:4px}
.film-toggle-icon{width:11px;height:12px;border-left:3px solid currentColor;border-right:3px solid currentColor}
.film-loop-toggle[data-paused="true"] .film-toggle-icon{width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-right:0;border-left:9px solid currentColor}
.film-dialog{color:#fff;background:#101114;border:1px solid #ffffff24;padding:0;width:min(1200px,calc(100% - 48px));max-width:none;max-height:calc(100dvh - 36px);overflow:auto;overscroll-behavior:contain}
.film-dialog::backdrop{background:#050607ed}
.film-dialog[open]{display:flex;flex-direction:column}
.film-dialog-top{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:10px 16px 10px 24px;flex:none;border-bottom:1px solid #ffffff26}
.film-dialog-top h2{font:700 14px/1.2 var(--body);margin:0}
.film-dialog-top h2 span{font-weight:400;color:#ababaf}
.film-dialog-close{display:flex;align-items:center;gap:12px;min-height:44px;padding:0 8px;border:0;background:transparent;color:#fff;font-size:12px;cursor:pointer}
.film-dialog-close svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.5;fill:none}
.film-dialog-close:focus-visible{outline:2px solid #fff;outline-offset:0}
.film-player{display:block;width:100%;max-height:calc(100dvh - 104px);aspect-ratio:16/9;background:#000;object-fit:contain}
.film-dialog[data-format="portrait"]{width:min(440px,calc(100% - 24px))}
.film-dialog[data-format="portrait"] .film-player{aspect-ratio:9/16}
.film-error{margin:0;padding:18px 24px;font-size:14px;background:#101114}
.film-error a{text-decoration:underline;text-underline-offset:4px}
.film-dialog-open{overflow:hidden}
@media(min-width:1600px){.home-film{--film-height:min(55svh,600px)}}
@media(max-width:1050px){.home-film{--film-height:min(45svh,42vw)}.film-heading h2{font-size:42px}.film-heading p{max-width:230px}.film-sticky{gap:24px}.film-side{width:76vw}.film-caption{padding-bottom:75px}.has-film-motion .film-sticky{height:100svh}}
@media(max-width:700px) and (orientation:portrait){
  .home-film{--film-height:min(49svh,520px);--film-half-screen:calc(var(--film-height) * .28125)}
  .home-film.has-film-motion{height:185svh}
  .has-film-motion .film-sticky{height:100svh}
  .film-sticky{gap:19px;padding:28px 0 100px}
  .film-heading{display:block}.film-heading h2{font-size:36px;margin-top:9px}
  .film-heading p{display:none}.film-direction{margin-top:12px;font-size:11px}
  .film-kicker{font-size:10px;letter-spacing:.12em}
  .film-screen{aspect-ratio:9/16}
  .film-track{gap:24px}.film-side{width:78vw;height:var(--film-height)}
  .film-side figcaption{display:block;font-size:34px;left:21px;bottom:24px}.film-side figcaption small{font-size:9px}
  .film-play-badge{width:60px;height:60px;outline-width:6px}.film-play-badge svg{width:21px;height:21px}
  .film-caption{gap:12px;padding-bottom:0}.film-watch{font-size:14px;gap:9px}.film-loop-toggle{font-size:11px}.film-watch>span{display:none}.film-rail-position{font-size:10px;gap:5px}
  .film-dialog{max-height:calc(100dvh - 20px)}.film-dialog-top{padding:6px 10px 6px 16px}.film-dialog-top h2{font-size:12px}.film-dialog-top h2 span{display:block;margin-top:3px}.film-dialog-close{gap:6px}
  .film-player{max-height:calc(100dvh - 80px)}
}
@media(max-height:540px) and (orientation:landscape){.home-film.has-film-motion{height:auto}.has-film-motion .film-sticky{position:relative;height:auto}.home-film{--film-height:65svh}.film-sticky{padding:30px 0 100px}.film-caption{padding-bottom:0}}
.home-film:not(.has-film-motion) .film-direction,.home-film:not(.has-film-motion) .film-rail-position{display:none}
@media(prefers-reduced-motion:reduce){.home-film.has-film-motion{height:auto}.has-film-motion .film-sticky{position:relative;height:auto}.film-track{transform:translateX(calc(-100% + var(--film-half-screen)))}.film-screen{transform:none}.film-scroll-meter{display:none}.film-caption{justify-content:space-between}.film-play-badge{transition:none}}
