.artwork-stage { position: relative; }
.embedded-clips { position: absolute; inset: 0; pointer-events: none; }
.embedded-film { position: absolute; margin: 0; pointer-events: auto; overflow: hidden; background: #000; }
.embedded-film video { display: block; width: 100%; height: 100%; object-fit: contain; }
.film-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: clamp(44px, 4vw, 64px); aspect-ratio: 1; padding: 0; border: 1px solid #ffffffa0; border-radius: 50%; background: #151515b8; color: #fff; backdrop-filter: blur(8px); box-shadow: 0 4px 24px #0004; transition: background .25s, box-shadow .25s; }
.film-play span { display: inline-block; margin-left: 3px; font-size: 20px; }
.film-play:hover { background: #e95327; box-shadow: 0 4px 30px #e9532755; }
.film-play:focus-visible { outline: 3px solid #e95327; outline-offset: 4px; }
.film-play:disabled { opacity: .55; }
.mobile-films { display: none; }
.film-card { position: relative; margin: 0; min-width: 0; }
.film-card video { display: block; width: 100%; max-height: 65dvh; aspect-ratio: 16 / 9; object-fit: contain; background: #111; }
.film-card figcaption { color: #c1bab4; font-size: 14px; line-height: 1.6; padding: 14px 0 0; }
.film-card .film-play { top: calc(50% - 18px); }
@media(max-width: 600px) {
  .embedded-clips { display: none; }
  .mobile-films:not([hidden]) { display: grid; gap: 28px; padding: 28px 20px; }
  .film-card[data-clip="portrait"] video, .film-card[data-clip="young-vision"] video { aspect-ratio: 9 / 16; }
}
@media(prefers-reduced-motion: reduce) { .film-play { transition: none; } }
