.hero-art:has(.hero-film){padding:8px 0;isolation:isolate}
.hero-art:has(.hero-film):before{content:"";position:absolute;inset:8% -10%;z-index:-1;background:radial-gradient(ellipse,#bd734221,transparent 65%);pointer-events:none}
.hero-film{width:290px;max-width:100%;margin:auto}
.film-heading{display:flex;align-items:center;justify-content:space-between;margin:0 0 12px;color:#9b9591;font-size:9px;letter-spacing:.13em}
.film-heading>span:first-child{color:#d0a084}
.film-frame{border:1px solid #57504b;border-radius:15px;overflow:hidden;background:#101113;box-shadow:0 20px 60px #0005}
.film-frame video{display:block;width:100%;height:auto;aspect-ratio:9/16;object-fit:contain;background:#101113}
.film-controls{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:13px}
.film-controls[hidden]{display:none}
.film-controls button{border:1px solid #393638;background:#1b1b1f;color:#ded9d4;font-size:11px;padding:7px 15px;border-radius:30px;min-height:36px;font-weight:500}
.film-controls button:hover{border-color:#a6795d;background:#282320}
.film-controls button[aria-pressed=true]{border-color:#bc875e;color:#f5bd96}
.film-controls button:disabled{cursor:default;color:#aaa}
.hero .film-caption{font-size:10px;color:#91857d;line-height:1.8;text-align:center;margin:13px 0 0;letter-spacing:.01em}
@media(max-width:780px){.hero-art:has(.hero-film){padding:8px 0 0}.hero-film{width:270px}.film-controls button{min-height:42px;padding:8px 18px;font-size:12px}.hero .film-caption{font-size:11px}}
@media(prefers-reduced-motion:reduce){.hero-film *{scroll-behavior:auto}}