/* Ambient section background videos — Daniel's footage playing quietly behind
   the work sections. Injected by js/modules/ambient.js; markup stays frozen. */

.section-bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  z-index: 0;
  pointer-events: none;
}

.section-bg video,
.section-bg img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  filter: saturate(0.8) brightness(0.85);
  transition: opacity 1.1s ease;
}

/* video fades in only once playing; reduced-motion poster img just sits at rest */
.section-bg.is-on video,
.section-bg img {
  opacity: 0.13;
}

/* shader section backgrounds (prism-bg.js #colour, blinds-bg.js #ai) — a full
   section-height canvas that scrolls with the page like everything else (no
   sticky). The effect is scroll-reactive in-shader instead: the prism's fan
   angle sweeps with scroll; the blinds fill the whole section. */
.section-bg canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 1.2s ease;
  pointer-events: none;
}
.section-bg.is-on canvas {
  opacity: var(--bg-op, 0.5);
}

/* VITRIUM scrim exemption (#ai only) — same treatment as .prism-fixed-bg:
   the glass ribs ARE the light, so no darkening veil on top. The ::after
   scrim below exists to dim raw ambient VIDEO footage for text legibility;
   over the vitrium shader it read as a flat grey-tinted layer (72%->5%
   left-dark wash) that crushed the left half and shifted the whole section's
   colour away from the prism sections' look. In-shader floor/vignette + the
   content's own contrast carry legibility here, exactly like the prism. */
#ai .section-bg::after {
  content: none;
}

.section-bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, var(--void) 0%, rgba(10, 9, 11, 0.25) 26%, rgba(10, 9, 11, 0.25) 72%, var(--void) 100%),
    linear-gradient(90deg, rgba(10, 9, 11, 0.72) 0%, rgba(10, 9, 11, 0.28) 55%, rgba(10, 9, 11, 0.05) 100%);
}

/* PRISM-FIXED-BG — the spectral prism canvas that carries across #colour and
   #edit. A position:fixed full-viewport layer inside <main> at z-index 0, so
   it paints behind both transparent sections while their z-index:1 content
   scrolls over it. Fades in/out with .is-on (toggled by the prism-bg
   IntersectionObserver on #colour + #edit). No scrim here — the prism is the
   light itself; in-shader scene floor + the section content's own contrast
   carry legibility. */
.prism-fixed-bg {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0;
  transition: opacity 1.2s ease;
}
.prism-fixed-bg canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}
.prism-fixed-bg.is-on {
  opacity: var(--bg-op, 0.82);
}

/* content lift — section children paint above the ambient background.
   .ai-beam is excluded so its own stylesheet (#ai .ai-beam) keeps it position:absolute. */
.section > :not(.section-bg):not(.ai-beam) {
  position: relative;
  z-index: 1;
}