/**
 * Lite FX mode — paired with device-fx-boot.js (html.fx-lite).
 * Cuts GPU-heavy glass / infinite motion on weak devices.
 */

html.fx-lite .bg-blobs,
html.fx-lite .max-urgent-glow,
html.fx-lite .blob {
  display: none !important;
}

html.fx-lite {
  --glass-blur: none;
  --transition-speed: 0.15s;
}

/* Kill expensive compositing */
html.fx-lite *,
html.fx-lite *::before,
html.fx-lite *::after {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Static reveal instead of scroll choreography */
html.fx-lite .animate-on-scroll {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
  filter: none !important;
}

/* Pause decorative infinite animations (keep essential UI transitions short) */
html.fx-lite .max-urgent-glow,
html.fx-lite .pricing-timer,
html.fx-lite .pricing-timer::after,
html.fx-lite .pricing-timer__face,
html.fx-lite .pricing-timer__face::after,
html.fx-lite .pricing-warm,
html.fx-lite .pricing-warm::before,
html.fx-lite .pricing-warm::after,
html.fx-lite .pricing-warm strong,
html.fx-lite .price-new,
html.fx-lite .price-new::before,
html.fx-lite .price-new::after,
html.fx-lite .pricing-cta,
html.fx-lite .header .pricing-cta::before,
html.fx-lite .header .pricing-cta::after,
html.fx-lite .hero-services__tab.is-active::before,
html.fx-lite .live-dot,
html.fx-lite .pulse,
html.fx-lite .blob,
html.fx-lite .blob-1,
html.fx-lite .blob-2,
html.fx-lite .blob-3 {
  animation: none !important;
}

/* Drop spinning conic glow layers (GPU) — solid chrome below replaces them */
html.fx-lite .max-btn-urgent::before,
html.fx-lite .max-btn-urgent::after,
html.fx-lite .max-btn-urgent-wrap::after,
html.fx-lite .max-urgent-content .max-btn-urgent::before,
html.fx-lite .max-urgent-content .max-btn-urgent::after,
html.fx-lite .max-urgent-content .max-btn-urgent-wrap::after {
  display: none !important;
  content: none !important;
  animation: none !important;
}

/* No glow pad needed without ::after — keep CTAs full-size and readable */
html.fx-lite .max-btn-urgent-wrap {
  padding: 2px !important;
  margin-inline: 0 !important;
  margin-bottom: 0 !important;
}

html.fx-lite .max-urgent-content .max-btn-urgent-wrap {
  padding: 2px !important;
  margin-inline: 0 !important;
  margin-bottom: 0 !important;
  width: 100% !important;
  max-width: min(380px, calc(100% - 24px)) !important;
}

html.fx-lite .max-btn-urgent-wrap--block {
  padding: 8px 0 !important;
  margin-inline: 0 !important;
  margin-bottom: 0 !important;
  width: 100% !important;
}

html.fx-lite .max-btn-urgent {
  min-height: 58px !important;
  padding: 16px 36px !important;
  font-size: 1.12rem !important;
  font-weight: 600 !important;
  color: #fff !important;
  border: 2px solid rgba(68, 204, 255, 0.65) !important;
  background:
    linear-gradient(180deg, rgba(68, 204, 255, 0.28) 0%, rgba(15, 23, 42, 0.98) 48%, #0a1626 100%) !important;
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.42),
    0 0 0 1px rgba(85, 83, 238, 0.4),
    inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
}

html.fx-lite .max-urgent-content .max-btn-urgent {
  min-height: 72px !important;
  width: 100% !important;
  padding: 18px 24px !important;
  font-size: 1.22rem !important;
}

html.fx-lite .max-btn-urgent-wrap--block .max-btn-urgent {
  min-height: 58px !important;
  width: 100% !important;
}

html.fx-lite .cta-btn--inline.pricing-cta {
  border: 2px solid rgba(85, 83, 238, 0.55) !important;
  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

/* Flatten heavy shadows a bit for fill-rate */
html.fx-lite .max-urgent-card,
html.fx-lite .order-card,
html.fx-lite .pricing-card,
html.fx-lite .work-card,
html.fx-lite .feature-card,
html.fx-lite .tabs-content {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28) !important;
}

/* Also honor OS reduced-motion even if boot missed */
@media (prefers-reduced-motion: reduce) {
  html:not(.fx-full) .bg-blobs {
    display: none !important;
  }
}