html {
    scroll-behavior: smooth !important;
}

[data-animate="item"] {
    opacity: 0 !important;
    transform: translateY(24px) !important;
    transition: opacity 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94),
        transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    will-change: transform, opacity !important;
}

[data-animate="media"] {
    opacity: 0 !important;
    transform: translateX(32px) !important;
    transition: opacity 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94),
        transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    will-change: transform, opacity !important;
}

[data-animate="cta"] {
    opacity: 0 !important;
    transform: scale(0.95) !important;
    transition: opacity 0.4s ease-out, transform 0.4s ease-out !important;
    will-change: transform, opacity !important;
}

[data-animate="cta"].in-view:hover {
    transform: scale(1.035) !important;
}

[data-animate].in-view {
    opacity: 1 !important;
    transform: none !important;
    will-change: auto !important;
}

[data-stagger]>* {
    transition-delay: calc(var(--i, 0) * 0.08s) !important;
}

[data-animate] {
    transition-delay: calc(var(--i, 0) * 0.08s);
}

@media (max-width: 767px) {
    [data-animate="item"] {
        transform: translateY(18px) !important;
        transition-duration: 0.5s !important;
    }

    [data-animate="media"] {
        transform: translateX(20px) !important;
        transition-duration: 0.55s !important;
    }
}

@media (prefers-reduced-motion: reduce) {

    [data-animate],
    [data-stagger]>* {
        transition: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}