/**
 * Level 99 Mindset — Hero entrance animation.
 *
 * Children of the hero animate in on page load:
 *   1. opacity: 0 → 1
 *   2. filter: blur(14px) → blur(0)        (the "luxury" feel)
 *   3. transform: translateY(32px) → 0     (rises into place)
 *
 * Easing: cubic-bezier(0.22, 1, 0.36, 1) — ease-out-quint.
 * Starts moving quickly then decelerates into a soft landing — the "linear
 * acceleration to eased landing" Joey asked for. No bounce, no overshoot.
 *
 * Each child has a longer stagger than typical (0 / 150 / 320 / 500 ms) so
 * the full reveal feels cinematic rather than punchy. Image / video side
 * lasts a bit longer (1400 ms) to anchor the composition.
 *
 * `animation-fill-mode: both` holds the start frame before play begins
 * (prevents flash of final state) AND keeps the end frame after.
 *
 * Respects `prefers-reduced-motion`.
 */

@keyframes l99-hero-enter {
    0% {
        opacity: 0;
        filter: blur(14px);
        transform: translate3d(0, 32px, 0);
    }
    100% {
        opacity: 1;
        filter: blur(0);
        transform: translate3d(0, 0, 0);
    }
}

/* Text children — luxe stagger */
.wp-block-l99-hero .l99-hero__badge,
.wp-block-l99-hero .l99-hero__heading,
.wp-block-l99-hero .l99-hero__subheading,
.wp-block-l99-hero .l99-hero__buttons {
    animation: l99-hero-enter 1200ms cubic-bezier(0.22, 1, 0.36, 1) both;
    will-change: opacity, filter, transform;
    transform-origin: center bottom;
}

.wp-block-l99-hero .l99-hero__badge       { animation-delay: 0ms;   }
.wp-block-l99-hero .l99-hero__heading     { animation-delay: 150ms; }
.wp-block-l99-hero .l99-hero__subheading  { animation-delay: 320ms; }
.wp-block-l99-hero .l99-hero__buttons     { animation-delay: 500ms; }

/* Visual side (image/video) — slightly longer for cinematic anchor */
.wp-block-l99-hero .l99-hero__image-side,
.wp-block-l99-hero .l99-hero__image-placeholder,
.wp-block-l99-hero .l99-hero__video-side,
.wp-block-l99-hero .l99-hero__video-wrap,
.wp-block-l99-hero .l99-hero__video-placeholder {
    animation: l99-hero-enter 1400ms cubic-bezier(0.22, 1, 0.36, 1) both;
    animation-delay: 200ms;
    will-change: opacity, filter, transform;
}

/* Drop will-change once the animation finishes so we're not leaving GPU
 * memory pinned. Browsers will read this when the animation ends. */
.wp-block-l99-hero .l99-hero__badge,
.wp-block-l99-hero .l99-hero__heading,
.wp-block-l99-hero .l99-hero__subheading,
.wp-block-l99-hero .l99-hero__buttons,
.wp-block-l99-hero .l99-hero__image-side,
.wp-block-l99-hero .l99-hero__video-side {
    animation-fill-mode: both;
}

/* Editor — never animate while the user is editing the block */
.block-editor-block-list__layout .wp-block-l99-hero * {
    animation: none !important;
}

/* Accessibility — respect reduced motion preference */
@media (prefers-reduced-motion: reduce) {
    .wp-block-l99-hero .l99-hero__badge,
    .wp-block-l99-hero .l99-hero__heading,
    .wp-block-l99-hero .l99-hero__subheading,
    .wp-block-l99-hero .l99-hero__buttons,
    .wp-block-l99-hero .l99-hero__image-side,
    .wp-block-l99-hero .l99-hero__image-placeholder,
    .wp-block-l99-hero .l99-hero__video-side,
    .wp-block-l99-hero .l99-hero__video-wrap,
    .wp-block-l99-hero .l99-hero__video-placeholder {
        animation: none !important;
        opacity: 1 !important;
        filter: none !important;
        transform: none !important;
    }
}