/*
 * delilà Motion Core
 * Gemeinsame Zustände, Laufzeitverträge und ausfallsichere Fallbacks.
 */

:root {
    --delila-motion-x: 0px;
    --delila-motion-y: 0px;
    --delila-motion-stagger-delay: 0ms;
    --delila-parallax-y: 0px;
    --delila-parallax-scale: 1;
}

body.delila-motion-primed [data-delila-reveal-load].delila-motion-load-pending,
body.delila-motion-primed [data-delila-reveal].delila-motion-pending,
body.delila-motion-primed [data-delila-stagger-item].delila-motion-stagger-pending {
    opacity: 0;
    transform: translate3d(var(--delila-motion-x), var(--delila-motion-y), 0);
}

body.delila-motion-enabled [data-delila-reveal-load].delila-motion-load-pending {
    transition:
        opacity var(--delila-motion-load-opacity-duration) var(--delila-motion-fade-ease),
        transform var(--delila-motion-load-transform-duration) var(--delila-motion-move-ease);
    transition-delay: var(--delila-motion-load-delay);
}

body.delila-motion-enabled [data-delila-reveal].delila-motion-pending,
body.delila-motion-enabled [data-delila-stagger-item].delila-motion-stagger-pending {
    transition:
        opacity var(--delila-motion-opacity-duration) var(--delila-motion-fade-ease),
        transform var(--delila-motion-transform-duration) var(--delila-motion-move-ease);
}

body.delila-motion-enabled [data-delila-stagger-item].delila-motion-stagger-pending {
    transition-delay: var(--delila-motion-stagger-delay, 0ms);
}

body.delila-motion-enabled [data-delila-reveal-load].delila-motion-load-visible,
body.delila-motion-enabled [data-delila-reveal].delila-motion-visible,
body.delila-motion-enabled [data-delila-stagger-item].delila-motion-stagger-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

/* Google Maps lädt vor dem Footer, wird aber erst fertig initialisiert im Viewport eingeblendet. */
html.delila-motion-capable #delila-map.delila-footer-map:not(.delila-footer-map--no-key):not(.delila-footer-map-error):not(.delila-footer-map-revealed) {
    opacity: 0;
    transform: translate3d(0, var(--delila-motion-enter-distance), 0);
    will-change: opacity, transform;
}

body.delila-motion-enabled #delila-map[data-delila-map-reveal] {
    transition:
        opacity var(--delila-motion-opacity-duration) var(--delila-motion-fade-ease),
        transform var(--delila-motion-transform-duration) var(--delila-motion-move-ease);
}

body.delila-motion-enabled #delila-map.delila-footer-map-revealed {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    will-change: auto;
}

html.delila-motion-bootstrap-timeout body:not(.delila-motion-ready) #delila-map,
body.delila-motion-static #delila-map,
body.delila-motion-reduced #delila-map,
#delila-map.delila-footer-map--no-key,
#delila-map.delila-footer-map-error {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    will-change: auto;
}

[data-delila-parallax-clip] {
    overflow: hidden;
}

[data-delila-parallax-media] {
    transform: translate3d(0, var(--delila-parallax-y), 0) scale(var(--delila-parallax-scale));
    transform-origin: center;
}

body.delila-motion-enabled .delila-parallax-active [data-delila-parallax-media] {
    will-change: transform;
}

@media (prefers-reduced-motion: reduce) {
    body [data-delila-reveal-load],
    body [data-delila-reveal],
    body [data-delila-stagger-item],
    body [data-delila-parallax-media],
    body [data-delila-map-reveal] {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
        transition-duration: 0.01ms !important;
        transition-delay: 0ms !important;
    }
}
