.hero-content {

    animation: heroFade .8s ease both;

}


.collection-card {

    animation: cardFade .8s ease both;

}


@keyframes heroFade {

    from {

        opacity: 0;

        transform: translateY(18px);

    }

    to {

        opacity: 1;

        transform: translateY(0);

    }

}


@keyframes cardFade {

    from {

        opacity: 0;

        transform: translateY(15px);

    }

    to {

        opacity: 1;

        transform: translateY(0);

    }

}


@media (prefers-reduced-motion: reduce) {

    * {

        animation: none !important;

        transition: none !important;

    }

}