/**
 * Vanilla Blocks - Anchor Overlay Parallax
 *
 * `vb-parallax` marks a sticky rear section. The following page content
 * receives a higher painting layer, so it scrolls over that sticky section
 * as one continuous page. The rear section itself moves subtly on desktop
 * for a light 3D/parallax feel.
 */
@media (min-width: 768px) and (prefers-reduced-motion: no-preference) {
    :root {
        --vb-parallax-base-shift: 60px;
    }

    .is-vb-parallax-base.is-vb-parallax-ready {
        position: sticky !important;
        top: var(--vb-parallax-top, 0px) !important;
        z-index: var(--vb-parallax-base-z-index, 30) !important;
        isolation: isolate;
        transform: translate3d(0, var(--vb-parallax-base-y, 0px), 0) !important;
        will-change: transform;
    }

    .is-vb-parallax-overlay:not(.is-vb-parallax-base) {
        position: relative !important;
        z-index: var(--vb-parallax-overlay-z-index, 31) !important;
        isolation: isolate;
    }

    .is-vb-parallax-scroll-parent {
        overflow: visible !important;
        overflow-x: visible !important;
        overflow-y: visible !important;
    }
}

@media (max-width: 767px), (prefers-reduced-motion: reduce) {
    .is-vb-parallax-base,
    .is-vb-parallax-base.is-vb-parallax-ready,
    .is-vb-parallax-overlay {
        position: relative !important;
        top: auto !important;
        z-index: auto !important;
        isolation: auto !important;
        transform: none !important;
        will-change: auto !important;
    }
}