.reveal-up,
.reveal-left,
.reveal-right {
    opacity: 0;
    transition:
        opacity .8s ease,
        transform .8s ease;
}

.reveal-up {
    transform: translateY(40px);
}

.reveal-left {
    transform: translateX(-50px);
}

.reveal-right {
    transform: translateX(50px);
}

.reveal-up.show,
.reveal-left.show,
.reveal-right.show {
    opacity: 1;
    transform: translate(0);
}


/* Floating product */

.hero-product {
    animation: productFloat 4s ease-in-out infinite;
}

@keyframes productFloat {

    0%,
    100% {
        transform: translateY(0) rotate(6deg);
    }

    50% {
        transform: translateY(-20px) rotate(3deg);
    }

}


/* Floating cards */

.card-top {
    animation: cardFloat 3s ease-in-out infinite;
}

.card-bottom {
    animation: cardFloat 3.5s ease-in-out infinite reverse;
}

@keyframes cardFloat {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-12px);
    }

}


/* Orbit */

.orbit-one {
    animation: orbitRotate 20s linear infinite;
}

.orbit-two {
    animation: orbitRotate 30s linear infinite reverse;
}

@keyframes orbitRotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}


/* Button arrow */

.btn i,
.product-link i,
.text-link i {
    transition: .3s ease;
}

.btn:hover i,
.product-link:hover i,
.text-link:hover i {
    transform: translateX(5px);
}


/* Glow */

.hero-glow {
    animation: glowPulse 4s ease-in-out infinite;
}

@keyframes glowPulse {

    0%,
    100% {
        transform: scale(1);
        opacity: .7;
    }

    50% {
        transform: scale(1.12);
        opacity: 1;
    }

}