.wr-animate {
    --wr-animation-duration: 700ms;
    --wr-animation-delay: 0ms;
    --wr-animation-distance: 50px;
    --wr-animation-distance-negative: -50px;
    --wr-animation-easing: ease-out;
    --wr-animation-order-delay: 0ms;
    opacity: 1;
    translate: 0 0;
    scale: 1;
    transition-delay: calc(var(--wr-animation-delay) + var(--wr-animation-order-delay));
    transition-duration: var(--wr-animation-duration);
    transition-property: opacity, translate, scale;
    transition-timing-function: var(--wr-animation-easing);
    will-change: opacity, translate, scale;
}

.wr-animation-fade:not(.wr-animation-active),
.wr-animation-fade-up:not(.wr-animation-active),
.wr-animation-fade-down:not(.wr-animation-active),
.wr-animation-fade-left:not(.wr-animation-active),
.wr-animation-fade-right:not(.wr-animation-active),
.wr-animation-scale-in:not(.wr-animation-active),
.wr-animation-scale-out:not(.wr-animation-active) {
    opacity: 0;
}

.wr-animation-fade-up:not(.wr-animation-active),
.wr-animation-slide-up:not(.wr-animation-active) {
    translate: 0 var(--wr-animation-distance);
}

.wr-animation-fade-down:not(.wr-animation-active),
.wr-animation-slide-down:not(.wr-animation-active) {
    translate: 0 var(--wr-animation-distance-negative);
}

.wr-animation-fade-left:not(.wr-animation-active),
.wr-animation-slide-left:not(.wr-animation-active) {
    translate: var(--wr-animation-distance-negative) 0;
}

.wr-animation-fade-right:not(.wr-animation-active),
.wr-animation-slide-right:not(.wr-animation-active) {
    translate: var(--wr-animation-distance) 0;
}

.wr-animation-scale-in:not(.wr-animation-active) {
    scale: var(--wr-animation-initial-scale, 0.85);
}

.wr-animation-scale-out:not(.wr-animation-active) {
    scale: var(--wr-animation-initial-scale, 1.15);
}

.elementor-editor-active .wr-animate:not(.wr-animation-preview-pending) {
    opacity: 1;
    translate: 0 0;
    scale: 1;
    transition: none;
}

@media (prefers-reduced-motion: reduce) {
    .wr-animate {
        opacity: 1;
        translate: 0 0;
        scale: 1;
        transition: none;
    }
}

@supports not (translate: 0 0) {
    .wr-animate {
        transform: translate(0, 0) scale(1);
        transition-property: opacity, transform;
        will-change: opacity, transform;
    }

    .wr-animation-fade-up:not(.wr-animation-active),
    .wr-animation-slide-up:not(.wr-animation-active) {
        transform: translate(0, var(--wr-animation-distance));
    }

    .wr-animation-fade-down:not(.wr-animation-active),
    .wr-animation-slide-down:not(.wr-animation-active) {
        transform: translate(0, var(--wr-animation-distance-negative));
    }

    .wr-animation-fade-left:not(.wr-animation-active),
    .wr-animation-slide-left:not(.wr-animation-active) {
        transform: translate(var(--wr-animation-distance-negative), 0);
    }

    .wr-animation-fade-right:not(.wr-animation-active),
    .wr-animation-slide-right:not(.wr-animation-active) {
        transform: translate(var(--wr-animation-distance), 0);
    }

    .wr-animation-scale-in:not(.wr-animation-active) {
        transform: scale(var(--wr-animation-initial-scale, 0.85));
    }

    .wr-animation-scale-out:not(.wr-animation-active) {
        transform: scale(var(--wr-animation-initial-scale, 1.15));
    }

    .wr-animation-active,
    .elementor-editor-active .wr-animate:not(.wr-animation-preview-pending) {
        transform: translate(0, 0) scale(1);
    }
}