/* Lightweight scroll motion for public pages. Motion uses compositor-friendly properties only. */
html {
    scroll-behavior: smooth;
    scroll-padding-top: 96px;
}

@media (prefers-reduced-motion: no-preference) {
    [data-scroll-reveal] {
        --scroll-reveal-y: 24px;
        --scroll-reveal-duration: 760ms;
        opacity: 0;
        transform: translate3d(0, var(--scroll-reveal-y), 0);
        transition:
            opacity var(--scroll-reveal-duration) cubic-bezier(0.22, 1, 0.36, 1),
            transform 900ms cubic-bezier(0.22, 1, 0.36, 1);
        transition-delay: var(--scroll-delay, 0ms);
    }

    [data-scroll-reveal="left"] {
        transform: translate3d(-28px, 0, 0);
    }

    [data-scroll-reveal="right"] {
        transform: translate3d(28px, 0, 0);
    }

    [data-scroll-reveal="scale"] {
        transform: translate3d(0, 16px, 0) scale(0.97);
    }

    [data-scroll-reveal].is-visible {
        opacity: 1;
        transform: none;
    }
}

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

    [data-scroll-reveal] {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}
