/* Design pass E/F — play-button tweaks only. Linked from index.html after design-pass-d.css. Remove that link to revert. */

/* Soft shadow + 60px disc; rest opacity 0.75 → 1 on hover/focus. */
.cf-hero-tv .hero-play__disc {
  width: 60px;
  height: 60px;
  opacity: 0.75;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
}
.cf-hero-tv .hero-play__disc svg {
  width: 22px;
  height: 22px;
  margin-left: 2px;
}
.cf-hero-tv .hero-play:hover .hero-play__disc,
.cf-hero-tv .hero-play:focus-visible .hero-play__disc {
  opacity: 1;
}

/* Desktop-fine hover: stronger glow + scale (no scale under reduced motion). */
@media (hover: hover) and (pointer: fine) {
  .cf-hero-tv .hero-play:hover .hero-play__disc,
  .cf-hero-tv .hero-play:focus-visible .hero-play__disc {
    box-shadow:
      0 8px 24px rgba(0, 0, 0, 0.45),
      0 0 0 1px rgba(228, 207, 146, 0.35),
      0 12px 36px rgba(212, 165, 116, 0.45);
  }
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .cf-hero-tv .hero-play__disc {
    transition: transform 180ms ease, box-shadow 180ms ease, opacity 160ms ease, border-color 160ms ease, background-color 160ms ease;
  }
  .cf-hero-tv .hero-play:hover .hero-play__disc,
  .cf-hero-tv .hero-play:focus-visible .hero-play__disc {
    transform: scale(1.08);
  }
}
@media (prefers-reduced-motion: reduce) {
  .cf-hero-tv .hero-play__disc {
    transition: none !important;
  }
  .cf-hero-tv .hero-play:hover .hero-play__disc,
  .cf-hero-tv .hero-play:focus-visible .hero-play__disc {
    transform: none !important;
  }
}