.section-animation {
    display: grid;
    place-items: center;
    align-content: center;
    min-height: 100vh;

}

.scroller-hidden-x {
    opacity: 0;
    transition: all 1s;
    filter: blur(15px);
    transform: translateX(-100%);
}

.scroller-showing-x {
    opacity: 1;
    filter: blur(0);
    transform: translateX(0);
}

.scroller-hidden-y {
    opacity: 0.4;
    transition: all 1s;
    transform: translateY(75%);
}

.scroller-showing-y {
    opacity: 1;
    transform: translateY(0);
}

@media(prefers-reduced-motion) {
    .scroller-hidden {
        transition: none;
    }
}


.card-animation {
    transition-delay: calc(200ms*var(--order));
}