:root {
    --motion-fast: 140ms;
    --motion-standard: 220ms;
    --motion-enter: 400ms;
    --motion-ease: cubic-bezier(.2, .7, .2, 1);
    --motion-enter-distance: 10px;
    --motion-stagger: 40ms;
    --motion-hero-stagger: 70ms;
    --motion-hero-duration: 400ms;
    --motion-hero-art-duration: 720ms;
    --motion-hover-shift: 4px;
    --motion-hover-nudge: 3px;
    --motion-hover-lift: -1px;
    --motion-card-lift: -2px;
    --motion-hover-scale: 1.03;
    --motion-hover-scale-soft: 1.02;
}

html.motion-enabled [data-motion-reveal].is-motion-entering {
    animation: wgda-motion-enter var(--motion-enter) var(--motion-ease) both;
    animation-delay: var(--motion-delay, 0ms);
}

html.home-hero-motion-enabled .home-hero [data-home-hero-motion].is-home-hero-entering {
    animation: wgda-motion-enter var(--motion-hero-duration) var(--motion-ease) both;
    animation-delay: var(--home-hero-delay, 0ms);
}

html.home-hero-motion-enabled .home-hero [data-home-hero-art-motion].is-home-hero-art-entering {
    animation: wgda-home-hero-art-enter var(--motion-hero-art-duration) var(--motion-ease) both;
}

@keyframes wgda-motion-enter {
    from {
        opacity: 0;
        transform: translate3d(0, var(--motion-enter-distance), 0);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes wgda-home-hero-art-enter {
    from {
        opacity: 0;
        transform: scale(1.015);
    }

    to {
        opacity: var(--home-hero-art-opacity, 1);
        transform: scale(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto !important;
    }

    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition: none !important;
        animation: none !important;
    }

    :root {
        --motion-hover-shift: 0px;
        --motion-hover-nudge: 0px;
        --motion-hover-lift: 0px;
        --motion-card-lift: 0px;
        --motion-hover-scale: 1;
        --motion-hover-scale-soft: 1;
    }
}