/* Film surfaces belong only to the homepage hero and its native dialog. */
.hero--film { isolation:isolate; }
.hero--film .hero-media { background:#24272A; }
.hero-film-poster,.hero-film-video { position:absolute; inset:0; display:block; width:100%; height:100%; }
.hero-film-poster img { display:block; }
.hero-film-video { opacity:0; transition:opacity .65s ease; }
.hero-film-ready .hero-film-video { opacity:1; }
.hero-film-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:22px; }
.hero-film-watch,.hero-film-toggle { display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; min-height:44px; border:1px solid rgba(200,207,204,.45); border-radius:999px; background:rgba(36,39,42,.45); color:#E5EBE7; cursor:pointer; font:500 11px/1.2 var(--font); transition:color .2s,border-color .2s,background .2s; }
.hero-film-watch { gap:11px; padding:12px 18px; text-transform:uppercase; letter-spacing:.08em; }
.hero-film-watch > i { width:0; height:0; border-top:5px solid transparent; border-bottom:5px solid transparent; border-left:8px solid #9DFFC4; }
.hero-film-toggle { width:44px; padding:0; }
.hero-film-toggle::before { content:""; width:8px; height:11px; border-left:2px solid currentColor; border-right:2px solid currentColor; }
.hero-film-toggle[data-playing="false"]::before { width:0; height:0; border:5px solid transparent; border-right:0; border-left:8px solid currentColor; }
.hero-film-watch:hover,.hero-film-toggle:hover { color:#9DFFC4; border-color:#9DFFC4; background:rgba(36,39,42,.72); }
.hero-film-watch:focus-visible,.hero-film-toggle:focus-visible,.home-film-close:focus-visible { outline:2px solid #9DFFC4; outline-offset:4px; }
.hero-film-actions [hidden] { display:none; }
body.home-film-open { overflow:hidden; }
.home-film-dialog { width:min(1160px,calc(100% - 40px)); max-width:none; max-height:calc(100dvh - 40px); margin:auto; padding:16px; overflow:auto; border:1px solid rgba(255,255,255,.2); border-radius:14px; background:#24272A; color:#E5EBE7; box-shadow:0 24px 100px #0008; }
.home-film-dialog::backdrop { background:rgba(9,13,12,.90); backdrop-filter:blur(12px); }
.home-film-head { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:12px; }
.home-film-head h2 { margin:0; color:#9DFFC4; font:500 13px/1.4 var(--font); letter-spacing:.06em; text-transform:uppercase; }
.home-film-close { display:grid; place-items:center; width:44px; height:44px; flex-shrink:0; border:1px solid #58635D; border-radius:50%; background:transparent; color:#E5EBE7; font:300 26px/1 Arial,sans-serif; cursor:pointer; }
.home-film-dialog video { display:block; width:100%; max-height:calc(100dvh - 180px); aspect-ratio:16/9; background:#111; object-fit:contain; }
.home-film-caption { margin:12px 0 0; color:#A6B0AA; font-size:11px; line-height:1.5; }
.home-film-error { margin:12px 0 0; font-size:13px; line-height:1.6; }
.home-film-error a { color:#9DFFC4; text-decoration:underline; }
@media (max-width:700px) {
  .hero-film-actions { margin-top:18px; }
  .hero-film-watch { padding:12px 15px; font-size:10px; }
  .home-film-dialog { width:calc(100% - 20px); padding:10px; max-height:calc(100dvh - 20px); }
  .home-film-dialog video { max-height:calc(100dvh - 160px); }
}
@media (prefers-reduced-motion:reduce) {
  .hero-film-video,.hero-film-watch,.hero-film-toggle { transition:none; }
}