:where(.etg-dfsb-dynamic-background) {
    position: relative;
    isolation: isolate;
}

.etg-dfsb-dynamic-background > .etg-dfsb-background-stage {
    position: absolute;
    inset: 0;
    z-index: -1;
    overflow: hidden;
    contain: paint;
    pointer-events: none;
    border-radius: inherit;
    background: transparent;
}

.etg-dfsb-dynamic-background > .etg-dfsb-background-stage[hidden] {
    display: none !important;
}

.etg-dfsb-background-stage__slide {
    position: absolute;
    inset: -1px;
    opacity: 0;
    background-repeat: no-repeat;
    background-size: var(--etg-dfsb-background-fit, cover);
    background-position: var(--etg-dfsb-background-position, center center);
    transition-property: opacity, transform;
    transition-duration: var(--etg-dfsb-background-transition-duration, 800ms);
    transition-timing-function: ease;
    transform: scale(1.001);
}

.etg-dfsb-background-stage[data-transition="fade"] .etg-dfsb-background-stage__slide,
.etg-dfsb-background-stage[data-transition="crossfade"] .etg-dfsb-background-stage__slide {
    transform: scale(1.001);
}

.etg-dfsb-background-stage[data-transition="slide"] .etg-dfsb-background-stage__slide {
    transform: translate3d(100%, 0, 0);
}

.etg-dfsb-background-stage__slide.is-active {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1.001);
}

.etg-dfsb-background-stage[data-transition="slide"] .etg-dfsb-background-stage__slide.is-active {
    transform: translate3d(0, 0, 0);
}

.etg-dfsb-background-stage[data-ken-burns="1"] .etg-dfsb-background-stage__slide.is-active {
    animation: etg-dfsb-background-ken-burns var(--etg-dfsb-background-duration, 5000ms) ease-out both;
}

.etg-dfsb-background-stage__overlay {
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    background: var(--etg-dfsb-background-overlay-color, transparent);
    opacity: var(--etg-dfsb-background-overlay-opacity, 0);
}

/*
 * ETG owns only its isolated negative background stage. Elementor, UAE, Jet
 * shape dividers, particles, overlays, sticky/motion layers and widgets retain
 * their native stacking order.
 */

@keyframes etg-dfsb-background-ken-burns {
    from { transform: scale(1.001); }
    to { transform: scale(1.08); }
}

@media (prefers-reduced-motion: reduce) {
    .etg-dfsb-background-stage__slide {
        transition: none !important;
        animation: none !important;
    }
}