/* 3. Trailer – Cinema band, large still with play button.
   On mouse devices a "Abspielen" label follows the cursor over the still. */
.featured-film__player { position: relative; }

.film-facade, .film-embed {
  position: relative; display: block; width: 100%;
  aspect-ratio: 16 / 9;
  padding: 0; border: 0;
  border-radius: var(--radius-sm); overflow: hidden;
  background: var(--surface-300);
  box-shadow: var(--shadow-frame);
}
.film-facade picture { display: block; height: 100%; }
.film-facade img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform var(--duration-slow) var(--ease-out);
}
.film-embed iframe { width: 100%; height: 100%; border: 0; display: block; }

.film-facade__play {
  position: absolute; left: 50%; top: 50%; translate: -50% -50%;
  display: grid; place-items: center;
  width: var(--space-8); height: var(--space-8); border-radius: var(--radius-full);
  background: var(--accent); color: var(--on-accent);
  transition: transform var(--duration-fast) var(--ease-out), opacity var(--duration-fast) var(--ease-out);
}
.film-facade__play svg { margin-left: var(--space-1); }
.film-facade:hover img { transform: scale(1.02); }
.film-facade:hover .film-facade__play, .film-facade:focus-visible .film-facade__play { transform: scale(1.08); }

/* Cursor label (positioned by js/animations/featured-film.js) */
.film-cursor {
  position: absolute; left: 0; top: 0; z-index: 2;
  display: none; align-items: center; gap: var(--space-2);
  padding: var(--space-3) var(--space-5);
  border-radius: var(--radius-full);
  background: var(--accent); color: var(--on-accent);
  font-size: var(--fs-button); line-height: var(--lh-button);
  font-weight: var(--fw-button); letter-spacing: var(--ls-button); text-transform: uppercase;
  pointer-events: none; white-space: nowrap;
  opacity: 0;
}
.has-film-cursor .film-cursor { display: inline-flex; }
.has-film-cursor .film-facade { cursor: none; }
.has-film-cursor .film-facade__play { opacity: 0; }

@media (max-width: 767px) {
  .film-facade__play { width: var(--space-7); height: var(--space-7); }
}
