/* ════════════════════════════════════════════════════════════════════
   perf-rocket.css — whole-page "rocket" pass (loaded LAST).
   --------------------------------------------------------------------
   The home page is ~15,800px tall, 16 sections, with ~75 backdrop-filter
   (blur) elements. Painting & compositing all of that on every scroll
   frame made the page feel heavy and stutter between sections.
   ══════════════════════════════════════════════════════════════════ */

/* ── 1. Skip rendering off-screen sections — DESKTOP ONLY ─────────────
   content-visibility:auto lets the browser skip layout+paint for
   off-screen sections (big win on a long page). BUT on mobile it caused
   the scroll to "jump back up" a little while scrolling down: when a
   section above re-hides, it collapses to its estimated intrinsic size,
   shifting the page (scroll-anchoring jump) — older mobile browsers
   ignore the `auto` size-memory keyword. So we gate this to wide screens
   (pointer:fine desktops) where it behaves and the win matters most.
   Mobile still gets the big wins below (scroll-blur kill + the debounced
   observers in scroll-perf.js). EXCLUDES hero, #works, sticky-story,
   before/after — containment interferes with those. */
@media (min-width: 1025px) and (pointer: fine) {
  .imp-section,
  .services-section,
  .proc-section,
  .plans-section,
  .workflow-section,
  .faq-section,
  .testimonials {
    content-visibility: auto;
    contain-intrinsic-size: auto 720px;
  }
  .footer-v2,
  footer.site-footer {
    content-visibility: auto;
    contain-intrinsic-size: auto 480px;
  }
}

/* Belt-and-braces: never let content-visibility steal scroll position. */
html { overflow-anchor: auto; }

/* ── 2. Drop blur while scrolling (all devices) ──────────────────────
   body.is-scrolling is toggled by scroll-perf.js. During motion every
   backdrop-filter is neutralised so the compositor isn't blurring 75
   layers per frame; it returns the instant scrolling stops. */
body.is-scrolling *,
body.is-scrolling *::before,
body.is-scrolling *::after {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Park big decorative animations while scrolling (cheap insurance on
   top of what apple-perf already pauses). */
body.is-scrolling .wrk::before,
body.is-scrolling [class*="glow"],
body.is-scrolling [class*="orb"],
body.is-scrolling [class*="particle"] {
  animation-play-state: paused !important;
}

/* ── 3. Show the language toggle on the top bar ───────────────────────
   apple-perf.css hides #homeLangBtn (it had been moved into the user
   dropdown). The user wants it visible on the bar in BOTH states
   (logged-in and logged-out). It lives in .nav-right which is always
   present, and its click handler (home-v2.js) already toggles AR/EN. */
#homeLangBtn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}