/* procbg — animated process-infographic backgrounds that fill slides whose
   Veo background clip is missing. On-brand pearlescent, zero dependencies.
   Sits at the same layer as a <video class="bg"> (z-index:0), under .scrim. */

canvas.procbg{
  position:absolute;inset:0;width:100%;height:100%;
  z-index:0;display:block;
  background:
    radial-gradient(120% 90% at 18% 0%, #ffffff 0%, #f4f7fb 42%, #eef1f8 100%);
}

/* where a procbg canvas is present, lighten the scrim so the animation reads
   through (matches the softer .aurora + .scrim treatment already in the deck) */
.slide.has-procbg > .scrim,
.has-procbg > .scrim{
  background:linear-gradient(120deg,
    rgba(251,251,254,.46),
    rgba(247,246,251,.30) 55%,
    rgba(243,242,249,.24)) !important;
}
/* subsea/coast scenes are deeper-toned — give them a cooler, lighter scrim */
.has-procbg.pb-deep > .scrim{
  background:linear-gradient(120deg,
    rgba(8,28,46,.34),
    rgba(10,39,64,.22) 55%,
    rgba(12,48,78,.18)) !important;
}

/* retire the older weak word-flow fallback (drifting words) on every slide —
   procbg now fills the blanks. Only targets the absolute, slide-level .wf
   (the word-flow), never the static content list .wf inside .panel. */
.slide > .wf{display:none !important}

@media (prefers-reduced-motion:reduce){
  canvas.procbg{/* engine draws a single static frame */}
}

/* ---- render budget: skip layout/paint for off-screen slides --------------
   The decks are 100+ full-viewport slides. content-visibility:auto lets the
   browser skip rendering work for any slide not near the viewport — the single
   biggest paint win on mobile. contain-intrinsic-size keeps scroll/snap stable
   by reserving each slide's box while it is skipped. */
.deck > .slide{
  content-visibility:auto;
  contain-intrinsic-size:100vw 100vh;
}
/* never skip the opener — it must paint instantly */
.deck > .slide:first-child{ content-visibility:visible; }

/* ---- aurora gradient animations for enhanced fallback slides ----------
   When aurora slides don't have SVG scenes (data-scene), they use beautiful
   animated gradient backgrounds that match the deck's visual theme.
   These animations are subtle, infinite, and reduce motion-aware. */

/* Default aurora animation (neutral/all slides) */
@keyframes aurora {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* Government theme aurora (green-tinted) */
@keyframes aurora-gov {
  0% { background-position: 0% 50%; }
  25% { background-position: 50% 100%; }
  50% { background-position: 100% 50%; }
  75% { background-position: 50% 0%; }
  100% { background-position: 0% 50%; }
}

/* Aqua/coastal theme aurora (blue-tinted) */
@keyframes aurora-aqua {
  0% { background-position: 0% 50%; }
  33% { background-position: 100% 100%; }
  66% { background-position: 0% 0%; }
  100% { background-position: 0% 50%; }
}

/* Respect prefers-reduced-motion for aurora animations */
@media (prefers-reduced-motion: reduce) {
  .bg.aurora {
    animation: none !important;
    background-position: 50% 50% !important;
  }
}