.cts-motion-enabled .cts-reveal {
    opacity: 0;
    transform: translate3d(0, 28px, 0);
    transition:
        opacity .72s cubic-bezier(.22, 1, .36, 1),
        transform .86s cubic-bezier(.22, 1, .36, 1);
    transition-delay: var(--cts-reveal-delay, 0ms);
    will-change: opacity, transform;
}

.cts-motion-enabled .cts-reveal--left {
    transform: translate3d(-38px, 0, 0);
}

.cts-motion-enabled .cts-reveal--right {
    transform: translate3d(42px, 0, 0);
}

.cts-motion-enabled .cts-reveal--down {
    transform: translate3d(0, -20px, 0);
}

.cts-motion-enabled .cts-reveal--scale {
    transform: translate3d(0, 22px, 0) scale(.965);
}

.cts-motion-enabled .cts-reveal.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    will-change: auto;
}

.cts-delay-1 { --cts-reveal-delay: 70ms; }
.cts-delay-2 { --cts-reveal-delay: 140ms; }
.cts-delay-3 { --cts-reveal-delay: 210ms; }
.cts-delay-4 { --cts-reveal-delay: 280ms; }
.cts-delay-5 { --cts-reveal-delay: 350ms; }
.cts-delay-6 { --cts-reveal-delay: 420ms; }

@media (prefers-reduced-motion: reduce) {
    .cts-motion-enabled .cts-reveal,
    .cts-motion-enabled .cts-reveal--left,
    .cts-motion-enabled .cts-reveal--right,
    .cts-motion-enabled .cts-reveal--down,
    .cts-motion-enabled .cts-reveal--scale {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
        will-change: auto !important;
    }
}
