/* The film is the section background; copy and controls remain in document flow. */
.hero.hero--film{position:relative;isolation:isolate;display:block;overflow:hidden;min-height:calc(100svh - 88px);background:var(--site-night);color:#fff;padding:0;border:0}
.hero--film::before,.hero--film::after{display:none}
.film-backdrop{position:absolute;inset:0;z-index:-2;overflow:hidden;background:var(--site-night)}
.film-backdrop video{display:block;width:100%;height:100%;object-fit:cover;object-position:65% center}
.film-backdrop::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.88),rgba(0,0,0,.65) 50%,rgba(0,0,0,.22)),linear-gradient(0deg,var(--site-night),transparent 35%)}
[dir=rtl] .film-backdrop::after{background:linear-gradient(270deg,rgba(0,0,0,.88),rgba(0,0,0,.65) 50%,rgba(0,0,0,.22)),linear-gradient(0deg,var(--site-night),transparent 35%)}
.hero--film .film-content{min-height:calc(100svh - 88px);display:flex;flex-direction:column;justify-content:center;padding-block:clamp(64px,10vh,140px) 28px;gap:clamp(40px,8vh,100px)}
.film-message{max-width:780px;margin-block:auto}
.hero--film .kicker{color:#fff;max-width:50ch}
.hero--film h1{color:#fff;font-size:clamp(38px,5.2vw,76px);line-height:1.08;max-width:17ch;margin-block:24px;letter-spacing:-.035em}
.hero--film h1 span{display:inline}
.hero--film .hero__focus{color:var(--site-sky)}
.hero--film .film-body{max-width:55ch;color:#fff;font-size:clamp(16px,1.3vw,19px);line-height:1.75}
.hero--film .hero__actions{margin-block:28px 0;gap:24px;flex-wrap:wrap}
.hero--film .arrowlink{color:#fff}
.film-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid #ffffff33;padding-top:22px}
.hero--film .hero__capabilities{margin:0;padding:0;border:0;color:#fff;max-width:100%;gap:12px 24px;flex-wrap:wrap}
.hero--film .hero__capabilities li{color:#fff}
.film-controls{display:flex;align-items:center;gap:12px 24px;flex-wrap:wrap;font-size:14px}
.film-controls button{display:inline-flex;align-items:center;min-height:44px;color:#fff;font:inherit}
.film-toggle{border:1px solid #ffffff66;background:#0008;border-radius:999px;padding:10px 18px;cursor:pointer}
.film-toggle[hidden]{display:none}
.film-controls :focus-visible{outline:3px solid var(--site-sky);outline-offset:4px}
.film-description{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.hero--film + .section:has(.figures){background:var(--site-night);color:#fff;border-color:#ffffff22;--site-muted:#ffffffb8}
.hero--film + .section .figures,.hero--film + .section .figures p{color:#fff}
[dir=rtl] .hero--film h1{letter-spacing:0;line-height:1.35;max-width:20ch}
@media(max-width:767px){
 .hero.hero--film,.hero--film .film-content{min-height:calc(100svh - 72px)}
 .hero--film .film-content{padding-block:56px 24px;gap:48px}
 .film-backdrop video{object-position:60% center}
 .film-backdrop::after,[dir=rtl] .film-backdrop::after{background:linear-gradient(0deg,var(--site-night),rgba(0,0,0,.62) 45%,rgba(0,0,0,.68))}
 .hero--film h1{font-size:clamp(34px,8.5vw,56px)}
 .film-foot{gap:18px}.film-controls{gap:12px}
}
@media(prefers-reduced-motion:no-preference){
 @supports(animation-timeline:scroll()){
  .film-backdrop{animation:film-drift linear both;animation-timeline:view();animation-range:exit 0% exit 100%}
 }
}
@keyframes film-drift{to{transform:translateY(12%)}}
@media(forced-colors:active){.film-backdrop{display:none}.hero.hero--film{background:Canvas;color:CanvasText}.hero--film h1,.hero--film p,.hero--film a,.film-controls button{color:CanvasText}}

.hero--film .film-description{color:#fff}
.hero--film + .section .figure__pre{color:#fff}
@media(max-width:767px){.hero--film .film-content{padding-bottom:72px}}

.hero--film + .section .figure__num{color:var(--site-sky)}

@media(min-width:768px){.film-controls{margin-inline-end:88px}}

/* Section clips fill the same frames the photographs did. */
.content-video{display:block;width:100%;height:100%;object-fit:cover}