/* =============================================================
   SCROLL PERFORMANCE FIX — Site-Wide
   Eliminates all scroll-sticking causes across all pages
   ============================================================= */

/* ── 1. CORE: Smooth scroll & hardware acceleration baseline ── */
html {
  scroll-behavior: smooth;
  /* Avoid sub-pixel repaints on scroll */
  -webkit-text-size-adjust: 100%;
}

body {
  /* Tell browser this element is the scroll root — prevents jank */
  overscroll-behavior: none;
  /* Isolate body's stacking context to reduce repaint scope */
  isolation: isolate;
}

/* ── 2. FIX: background-attachment: fixed causes full-page repaint on EVERY scroll frame.
         Replace with scroll (no parallax) to stop the jank.          ── */
.rb-about-section::before {
  background-attachment: scroll !important;
}

/* ── 3. FIX: Promote animated elements to their own GPU layer so
         they don't trigger main-thread repaints during scroll.       ── */
.experience-floating-card,
.garnet-razor-plaque,
.rb-badge,
.celestial-contact-card,
.shiva-quote-card,
.slider__item img,
.slider {
  will-change: transform;
  transform: translateZ(0); /* Force GPU compositing layer */
}

/* ── 4. FIX: Contain layout/paint to each section so one section
         repainting doesn't invalidate the whole page.               ── */
section,
.rb-about-section,
.sp-why-section,
.celestial-contact-card,
.slider-section {
  contain: layout paint;
}

/* ── 5. FIX: backdrop-filter is expensive; contain it to a layer.   ── */
.shiva-quote-box,
.about-contact-box,
.celestial-contact-card {
  transform: translateZ(0);
  isolation: isolate;
}

/* ── 6. FIX: Reduce animation workload on mobile (prefers-reduced-motion) ── */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ── 7. FIX: Disable expensive animations on low-power mobile devices.
         Prevents scroll jank on weaker Android/iOS hardware.         ── */
@media (max-width: 767px) {
  .experience-floating-card {
    animation: none !important;
  }
  .garnet-razor-plaque {
    animation: none !important;
  }
  .rb-badge {
    animation: none !important;
    background-position: 0% center !important;
  }
  .celestial-contact-card h5 {
    animation: none !important;
  }
  /* Disable heavy box-shadow animations on mobile */
  .garnet-razor-plaque {
    box-shadow: 0 0 30px rgba(26, 45, 107, 0.4) !important;
  }
}

/* ── 8. FIX: Owl carousel and slider — prevent touch scroll interference ── */
.owl-carousel,
.owl-stage-outer,
.slider-container {
  touch-action: pan-y !important;
}

/* ── 9. FIX: Images — prevent layout thrash during scroll ── */
img {
  content-visibility: auto;
}

/* ── 10. FIX: Cards with hover transitions — use transform-only
          (not box-shadow on hover) to keep animations compositor-only ── */
.rb-about-list li,
.sp-stat-card,
.btn-celestial,
.btn-emerald-glow,
.btn-royal-gold,
.rb-about-btn {
  will-change: transform;
}
