/* ------------------------------------------------------------------
   Scroll performance
   Decorative infinite animations (big blurred conic glows, hue shifts
   on full-width gradients, floating cards) repaint large areas every
   frame and make scrolling stutter — especially near the top of the
   page. Keep the look, cut the per-frame cost.
   ------------------------------------------------------------------ */

/* Promote animated decorations to their own layer so they never
   repaint the surrounding content while scrolling. */
[style*="animation:floaty"],
[style*="animation: floaty"],
[style*="animation:rise"],
[style*="animation: rise"],
[style*="animation:glowspin"],
[style*="animation: glowspin"],
[style*="animation:dashspin"],
[style*="animation: dashspin"],
[style*="animation:scanline"],
[style*="animation: scanline"] {
  will-change: transform;
  transform: translateZ(0);
  backface-visibility: hidden;
}

/* Very expensive: large blur filters animated forever. */
[style*="animation:sheen"],
[style*="animation: sheen"],
[style*="animation:hueshift"],
[style*="animation: hueshift"] {
  animation: none !important;
}

/* While the page is being scrolled (finger, wheel or trackpad) every running
   animation is frozen. Painting an animation frame and scrolling in the same
   frame is what makes the page feel like it sticks. Everything resumes ~140ms
   after the gesture ends, so a still page looks unchanged. */
html.rp-scrolling *,
html.rp-scrolling *::before,
html.rp-scrolling *::after {
  animation-play-state: paused !important;
  transition: none !important;
}

/* Blurred glows and the animated phone repaint a large area on every scroll
   step; isolate them so the rest of the page is not repainted with them. */
[style*="filter:blur"],
[style*="filter: blur"] {
  transform: translateZ(0);
  backface-visibility: hidden;
}

@media (max-width: 1180px) {
  iframe {
    contain: paint;
  }
}

/* Mobile and tablet: drop the remaining always-on decoration loops and
   render off-screen sections lazily. */
@media (max-width: 1180px) {
  [style*="animation:floaty"],
  [style*="animation: floaty"],
  [style*="animation:glowspin"],
  [style*="animation: glowspin"],
  [style*="animation:dashspin"],
  [style*="animation: dashspin"],
  [style*="animation:logopulse"],
  [style*="animation: logopulse"],
  [style*="animation:glowpulse"],
  [style*="animation: glowpulse"],
  [style*="animation:blink"],
  [style*="animation: blink"],
  [style*="animation:scanline"],
  [style*="animation: scanline"],
  [style*="animation:rise"],
  [style*="animation: rise"],
  [style*="animation:flowdot"],
  [style*="animation: flowdot"],
  [style*="animation:sdkglow"],
  [style*="animation: sdkglow"],
  [style*="animation:boltlight"],
  [style*="animation: boltlight"],
  [style*="animation:boltflash"],
  [style*="animation: boltflash"],
  [style*="animation:pillpress"],
  [style*="animation: pillpress"],
  [style*="animation:typeline"],
  [style*="animation: typeline"],
  [style*="animation:caretblink"],
  [style*="animation: caretblink"] {
    animation: none !important;
    will-change: auto;
  }

  section[data-screen-label] ~ section[data-screen-label],
  footer {
    content-visibility: auto;
    contain-intrinsic-size: auto 900px;
  }
}

@media (prefers-reduced-motion: reduce) {
  [style*="animation:"] {
    animation: none !important;
  }
}
