.cri-home-film { background: radial-gradient(ellipse at 80% 40%, #e8f1e8, transparent 67%), #f4f6f1; }
.cri-film-player { position: relative; overflow: hidden; border: 0; border-radius: 24px; background: #f5f7ef; box-shadow: 0 18px 48px #2852411f; isolation: isolate; }
.cri-film-cover { position: absolute; inset: 0; z-index: 2; }
.cri-film-cover[hidden] { display: none; }
.cri-film-cover picture, .cri-film-cover img { display: block; width: 100%; height: 100%; }
.cri-film-cover img { object-fit: cover; }
.cri-film-play { position: absolute; right: 6%; top: 45%; display: grid; justify-items: center; gap: 12px; transform: translateY(-50%); padding: 12px; color: #153e3b; border: 0; background: transparent; font: inherit; font-weight: 700; cursor: pointer; }
.cri-film-play-icon { display: grid; place-items: center; width: 76px; height: 76px; border-radius: 50%; background: #fffffff2; box-shadow: 0 8px 30px #173b3c38; transition: transform .2s ease; }
.cri-film-play svg { width: 25px; height: 25px; margin-left: 4px; fill: currentColor; }
.cri-film-play-label { font-size: .85rem; line-height: 1.3; padding: 8px 12px; background: #fffffff2; border-radius: 20px; white-space: nowrap; }
.cri-film-play:hover .cri-film-play-icon { transform: scale(1.05); }
.cri-film-play:focus-visible { outline: 3px solid #197984; outline-offset: 4px; border-radius: 18px; }
@media (max-width: 650px) {
  .cri-film-player { margin-inline: 0; border-radius: 20px; }
  .cri-film-play { top: 56%; right: 50%; transform: translate(50%, -50%); }
  .cri-film-play-icon { width: 66px; height: 66px; }
}
@media (prefers-reduced-motion: reduce) {
  .cri-film-play-icon { transition: none; }
}