/* v14-perf-overhaul-v20260514a.css — 2026-05-14
 *
 * Performance overrides for issues identified in the full-site audit:
 *
 *   - CRITICAL: kill the scroll-driven backdrop-filter on the nav. The
 *     `calc(var(--nav-scrolled, 0) * 12px)` pattern would force a full-
 *     viewport backdrop redraw on every scroll frame if any script ever
 *     starts setting --nav-scrolled. No script sets it today, but the rule
 *     is a tripwire. Replace with a static 8px frosted-glass blur (the same
 *     visual effect, no scroll cost).
 *
 *   - HIGH: cap the animated mesh `filter: blur(48px)` — 48px radius blur
 *     is among the most expensive GPU operations and was running on an
 *     infinite 36s animation. Reduce to 24px and shorten cycle.
 *
 *   - HIGH: contain hints on long static sections so paint doesn't propagate.
 *
 *   - MEDIUM: kill backdrop-filter entirely on prefers-reduced-motion +
 *     low-end mobile (no `hover: hover`).
 *
 * Loaded LAST so the cascade wins.
 */

/* CRITICAL — neutralize scroll-driven nav backdrop blur.
   Match the nav blur selector and force a constant low-cost backdrop. */
.dr-canon-nav,
.dr-canon-nav .inner,
nav.dr-canon-nav {
  backdrop-filter: saturate(140%) blur(8px) !important;
  -webkit-backdrop-filter: saturate(140%) blur(8px) !important;
}

/* HIGH — reduce the 48px blurred animated mesh.
   Any element that uses dr-clay-haze with the dr-mesh-breath animation. */
@keyframes dr-mesh-breath-tame {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); opacity: 0.55; }
  50%      { transform: translate3d(0, 0, 0) scale(1.06); opacity: 0.7; }
}
[style*="dr-mesh-breath"],
.dr-mesh-breath {
  filter: blur(24px) !important;
  animation: dr-mesh-breath-tame 24s ease-in-out infinite !important;
}

/* HIGH — paint/layout containment on tall, mostly-static sections. */
.section,
.dr-social-proof,
.dr-product-preview,
.dr-faq,
footer.minimal {
  contain: layout style;
}

/* HIGH — content-visibility skip for off-screen sections.
   Browsers skip paint+layout for these until they near the viewport.
   Reduces hero-section scroll cost significantly. */
.section + .section,
.dr-social-proof,
.dr-product-preview,
.dr-faq {
  content-visibility: auto;
  contain-intrinsic-size: auto 600px;
}

/* MEDIUM — disable backdrop-filter on touch devices without hover (mobile).
   These compositors take a heavy hit on backdrop-filter. */
@media (hover: none) and (pointer: coarse) {
  .dr-canon-nav,
  .dr-canon-nav .inner,
  nav.dr-canon-nav,
  .home-sticky-buy,
  .dr-exit-popup,
  .deskrune-proof-toast {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
}

/* MEDIUM — kill heavy filters under reduced-motion. */
@media (prefers-reduced-motion: reduce) {
  [style*="dr-mesh-breath"],
  .dr-mesh-breath,
  .aurora-stage,
  .dr-hero-canvas-wrap {
    animation: none !important;
    filter: none !important;
  }
}

/* LOW — cursor trail z-index correction so it doesn't invert sticky bars.
   (dr-engine-v20260514a already removed mix-blend-mode:difference, but the
   trail z-index 80 still landed on top of home-sticky-buy at z-index 90.
   Push trail behind sticky bars.) */
.dr-cursor-trail {
  z-index: 70 !important;
  mix-blend-mode: normal !important;
}

/* MEDIUM — `transition: all` overrides → scoped transitions where found
   in cta-microinteractions. Keeping the visual identical, just listing
   the properties so the browser doesn't track every property change. */
.deskrune-sticky-buy {
  transition-property: transform, box-shadow !important;
}
