/* ============================================================
   VEHIX — Performance hardening (loaded LAST, after the design
   CSS and responsive-fixes). No visual redesign — this trims the
   few effects that force a full-frame repaint while scrolling,
   which is what makes scroll "not keep up". Kept separate so the
   design files stay byte-faithful and every change is auditable.
   ============================================================ */

/* 1) Remove the FIXED full-viewport film-grain overlay.
   It uses position:fixed + mix-blend-mode:multiply, so the whole
   screen re-composites on every scroll frame — the single biggest
   cause of scroll jank here. It sits at opacity .035 (barely
   visible); the richer per-section grain on the bright app
   "worlds" is kept, so the texture you see most still remains. */
body::before { display: none !important; }

/* 2) Drop the sticky-nav backdrop blur.
   `backdrop-filter: saturate(180%) blur(22px)` is recomputed every
   frame as the page scrolls under the fixed nav. A near-opaque
   solid looks almost identical and costs nothing. */
.nav { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
.nav:not(.app-nav)          { background: rgba(251, 250, 246, .92); }
.nav:not(.app-nav).scrolled { background: rgba(251, 250, 246, .96); }
/* world-page colored navs: keep the tint, just make it opaque (no blur) */
.nav.app-nav          { background: color-mix(in srgb, var(--fc) 90%, transparent); }
.nav.app-nav.scrolled { background: color-mix(in srgb, var(--fc-deep, var(--fc)) 94%, transparent); }

/* 3) Stop continuously animating a BLURRED element.
   `.hero-lite::after` is a large filter:blur(10px) glow driven by
   the vx-drift keyframe → full repaint every frame. Keep the glow,
   drop the motion. (Sharp transform/opacity motion stays — those
   composite on the GPU and are cheap.) */
.hero-lite::after,
.hero::after { animation: none !important; }

/* 4) Give the idle floating mocks their own GPU layer so their
   transform animation composites instead of repainting siblings. */
.aw-media > *,
.fhero-media > * { will-change: transform; }

/* 5) Skip rendering work for the footer until it nears the
   viewport. Footer only — not anchor-target or animated sections —
   so in-page links and scroll-reveals are unaffected. */
footer.site { content-visibility: auto; contain-intrinsic-size: 1px 320px; }
