[data-animate] {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity var(--duration-slow) var(--easing-enter),
        transform var(--duration-slow) var(--easing-enter);
}

[data-animate].animate-in {
    opacity: 1;
    transform: translateY(0);
}

[data-animate].animate-in {
    transition-delay: var(--delay, 0ms);
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes textFade {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes gentleBounce {
    0%, 100% {
        transform: translateX(-50%) translateY(0);
    }

    50% {
        transform: translateX(-50%) translateY(8px);
    }
}

@media (prefers-reduced-motion: reduce) {
    [data-animate],
    [data-animate].animate-in {
        opacity: 1;
        transform: none;
        transition: none;
    }
}