/* Film atmosphere: static grain and a slow light leak at the section edge.
   The seed-field owns clipping and stacking; these layers never cover controls. */
.atmosphere-scene {
  --cinema-grain-opacity: .04;
  --cinema-light-rest: .34;
  --cinema-light-peak: .58;
  --cinema-light-edge: 100%;
  --cinema-light-drift: -3%;
}

.atmosphere-scene[data-atmosphere-tone="light"] {
  --cinema-grain-opacity: .025;
  --cinema-light-rest: .24;
  --cinema-light-peak: .4;
}

.atmosphere-scene > .seed-field > .cinema-grain,
.atmosphere-scene > .seed-field > .cinema-light {
  position: absolute;
  pointer-events: none;
  user-select: none;
}

/* A small, seamless SVG is rasterized once and repeated. No moving noise,
   blend modes, animated filters, scratches, or film perforations. */
.atmosphere-scene > .seed-field > .cinema-grain {
  inset: 0;
  opacity: var(--cinema-grain-opacity);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='128' height='128' viewBox='0 0 128 128'%3E%3Cfilter id='grain' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.84' numOctaves='2' seed='13' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='128' height='128' filter='url(%23grain)'/%3E%3C/svg%3E");
  background-repeat: repeat;
  background-size: 128px 128px;
}

.atmosphere-scene > .seed-field > .cinema-light {
  top: 0;
  right: -8%;
  width: clamp(170px, 25vw, 400px);
  max-width: 40%;
  height: min(760px, 100%);
  opacity: var(--cinema-light-rest);
  background: radial-gradient(
    ellipse at var(--cinema-light-edge) 24%,
    rgba(229, 158, 75, .22) 0%,
    rgba(229, 158, 75, .075) 38%,
    rgba(229, 158, 75, 0) 74%
  );
  transform-origin: var(--cinema-light-edge) 30%;
  animation: cinema-light-breathe 18s ease-in-out -4s infinite;
  animation-play-state: paused;
}

/* Alternate edges without changing layout or adding a second animated layer. */
.atmosphere-scene:nth-of-type(even) {
  --cinema-light-edge: 0%;
  --cinema-light-drift: 3%;
}
.atmosphere-scene:nth-of-type(even) > .seed-field > .cinema-light {
  right: auto;
  left: -8%;
  animation-duration: 20s;
  animation-delay: -9s;
}

.atmosphere-scene.is-atmosphere-active > .seed-field > .cinema-light {
  animation-play-state: running;
}
body.atmosphere-paused .atmosphere-scene > .seed-field > .cinema-light,
.nav-open .atmosphere-scene > .seed-field > .cinema-light,
.intro-active .atmosphere-scene > .seed-field > .cinema-light,
.intro-revealing .atmosphere-scene > .seed-field > .cinema-light {
  animation-play-state: paused;
}

/* Existing hero beams retain their own two-layer lighting. */
.atmosphere-scene:is(.hero, .page-hero) > .seed-field > .cinema-light {
  display: none;
}

@keyframes cinema-light-breathe {
  0%, 100% {
    opacity: var(--cinema-light-rest);
    transform: translate(0, 0) scale(1);
  }
  50% {
    opacity: var(--cinema-light-peak);
    transform: translate(var(--cinema-light-drift), 3%) scale(1.045);
  }
}

@media (max-width: 680px) {
  .atmosphere-scene > .seed-field > .cinema-light {
    width: 36%;
    max-width: 150px;
    height: min(560px, 100%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .atmosphere-scene > .seed-field > .cinema-light {
    animation: none;
    transform: none;
    opacity: var(--cinema-light-rest);
  }
}