/* perf-mobile-lcp.css — fixes for the 9.6s mobile LCP found in
   the 2026-05-10 Lighthouse run. The dazzle-heading reveal animation
   uses opacity:0 + 1.2s rowReveal + 0.2/0.4/0.6s staggered delays =
   text isn't visible until ~1.6-2s after first paint, so LCP can
   never beat that. Strip the entry animation on small viewports
   AND for prefers-reduced-motion. Hero text becomes visible
   immediately; the shimmer / pulse loops continue for decoration.

   Loaded last in the cascade (after audit-fixes) so it wins. */

@media (max-width: 768px), (prefers-reduced-motion: reduce) {
    /* Show the dazzle text instantly */
    .d-row,
    .dazzle-heading .d-row {
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
        animation-name: shimmerSweep !important;
        animation-delay: 0s !important;
    }

    /* Hero label fades in instantly */
    .hero-label {
        opacity: 1 !important;
        animation: none !important;
    }

    /* Reveal blocks no longer wait for IntersectionObserver to assign
       .active — initial state shows them so LCP candidates paint at
       first frame. Scroll-reveal still works for below-fold sections
       because .reveal.active still applies its transform/opacity over
       the base. */
    .hero-content.reveal,
    .hero-content .reveal {
        opacity: 1 !important;
        transform: none !important;
    }
}

/* Even on desktop, the .dazzle-heading should be visible faster.
   Keep the shimmer-sweep + text-pulse for visual identity, drop the
   slow row-reveal entry. Net LCP win without losing the cinematic
   feel. */
@media (min-width: 769px) and (prefers-reduced-motion: no-preference) {
    .d-row {
        /* Keep rowReveal but speed it up; remove the blur(8px) which
           keeps LCP candidates invisible during the transition. */
        animation-duration: 0.4s, 6s, 3s !important;
        filter: none !important;
    }
}
