/* Cinematic media lives inside the existing homepage and CMS version workflow. */
body.public-site.public-home #home.ce-hero-cinema { isolation: isolate; overflow: hidden; }
body.public-site.public-home #home.ce-hero-cinema .ce-hero-bg { z-index: -3; }
body.public-site.public-home #home.ce-hero-cinema .ce-hero-bg img {
  animation: none; transform: none; inset: 0; width: 100%; height: 100%;
  filter: none; object-fit: cover;
}
body.public-site.public-home #home .ce-hero-video {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  opacity: 0; transition: opacity .7s ease; pointer-events: none;
}
body.public-site.public-home #home.is-film-playing .ce-hero-video { opacity: 1; }
body.public-site.public-home #home.ce-hero-cinema::before {
  animation: none; z-index: -2;
  background: linear-gradient(90deg,rgba(4,24,27,.63),rgba(4,24,27,.19) 68%,rgba(4,24,27,.1)),
    linear-gradient(0deg,rgba(4,24,27,.7),transparent 68%);
}
/* Keep grading on the media, with a separate neutral scrim behind HTML copy. */
body.public-site.public-home #home.ce-hero-cinema[data-colour-tone="balanced"] .ce-hero-bg img,
body.public-site.public-home #home.ce-hero-cinema[data-colour-tone="balanced"] .ce-hero-video {
  filter: saturate(1.1) contrast(1.03) brightness(1.04);
}
body.public-site.public-home #home.ce-hero-cinema[data-colour-tone="bright"] .ce-hero-bg img,
body.public-site.public-home #home.ce-hero-cinema[data-colour-tone="bright"] .ce-hero-video {
  filter: saturate(1.22) contrast(1.04) brightness(1.08);
}
body.public-site.public-home #home.ce-hero-cinema:is([data-colour-tone="balanced"],[data-colour-tone="bright"])::before {
  background: linear-gradient(90deg,rgba(5,15,20,.48),rgba(5,15,20,.08) 62%,transparent),
    linear-gradient(0deg,rgba(5,15,20,.64),transparent 72%);
}
body.public-site.public-home #home.ce-hero-cinema:is([data-colour-tone="balanced"],[data-colour-tone="bright"]) .ce-hero-copy {
  text-shadow: 0 2px 20px #0006;
}
body.public-site.public-home #home.ce-hero-cinema::after,
body.public-site.public-home #home.ce-hero-cinema .ce-hero-motion { display: none; }
body.public-site.public-home #home .ce-hero-controls {
  position: absolute; z-index: 3; right: var(--ce-gutter); bottom: 32px;
  display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 8px;
  max-width: calc(100% - 40px);
}
body.public-site.public-home #home .ce-film-control {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 44px; padding: 10px 17px; border: 1px solid #ffffff70;
  border-radius: 4px; background: #0a222c99; color: white; font-size: 12px;
  font-weight: 600; letter-spacing: .02em; cursor: pointer; backdrop-filter: blur(8px);
}
body.public-site.public-home #home .ce-film-control[hidden] { display: none; }
body.public-site.public-home #home .ce-film-control:hover { background: #0a222c; }
body.public-site.public-home #home .ce-film-control[aria-pressed="true"] { background: #173c3bd9; border-color: #ffffffb3; }
body.public-site.public-home #home .ce-film-control:disabled { cursor: default; opacity: .75; }
.ce-music-volume { display: flex; align-items: center; min-height: 44px; margin: 0; padding: 0 9px; border: 1px solid #ffffff70; border-radius: 4px; background: #0a222c99; }
.ce-music-volume[hidden] { display: none; }
.ce-music-volume input { width: 68px; accent-color: white; cursor: pointer; }
.ce-film-symbol { width: 12px; font-size: 12px; }
.studio-image-preview video { width: 100%; max-height: 140px; object-fit: contain; }
@media (max-width: 600px) {
  body.public-site.public-home #home.ce-hero-cinema .ce-hero-grid { padding-bottom: 96px !important; }
  body.public-site.public-home #home .ce-hero-controls { right: 20px; bottom: 22px; }
  body.public-site.public-home #home .ce-film-control { padding-inline: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  body.public-site.public-home #home .ce-hero-video { transition: none; }
}