@keyframes floatProduct {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-10px);
    }

    100% {
        transform: translateY(0);
    }
}

/* TEXT ANIMATION */
@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* IMAGE ENTRANCE */
@keyframes imageEnter {
    from {
        opacity: 0;
        transform: translateX(60px) scale(0.95);
    }

    to {
        opacity: 1;
        transform: translateX(0) scale(1);
    }
}


@media (max-width: 768px) {

    .showcase-row {
        flex-direction: column;
        text-align: center;
    }

    .showcase-row.reverse {
        flex-direction: column;
    }

    .showcase-image img {
        margin: 0 auto;
    }

    .showcase-title {
        font-size: 32px;
    }

}

