/* assets/css/animation.css */

.anim-logo-left {
    animation: animLogoLeft 0.75s ease-out both;
}

.anim-button-right {
    animation: animButtonRight 0.75s ease-out 0.12s both;
}

.anim-up {
    animation: animUp 0.9s cubic-bezier(.2, .85, .25, 1) 0.2s both;
}

.anim-fade {
    animation: animFade 0.6s ease-out both;
}

.anim-card-up {
    animation: animCardUp 0.75s ease-out 0.18s both;
}

@keyframes animLogoLeft {
    from {
        opacity: 0;
        transform: translate(-55px, -22px);
    }
    to {
        opacity: 1;
        transform: translate(0, 0);
    }
}

@keyframes animButtonRight {
    from {
        opacity: 0;
        transform: translate(55px, -22px);
    }
    to {
        opacity: 1;
        transform: translate(0, 0);
    }
}

@keyframes animUp {
    from {
        opacity: 0;
        transform: translateY(130px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes animFade {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes animCardUp {
    from {
        opacity: 0;
        transform: translateY(36px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}