/* =========================================================
   GLOBAL SECTION ANIMATION
========================================================= */

.animate-section {
    opacity: 0;
    transform: translateY(70px) scale(.98);

    transition:
        opacity .9s ease,
        transform .9s cubic-bezier(.2, .65, .2, 1);
}

/* SHOW ACTIVE */
.animate-section.show {
    opacity: 1;
    transform: translateY(0) scale(1);
}

/* =========================================================
   DIFFERENT ANIMATION TYPES
========================================================= */

/* LEFT */
.animate-left {
    opacity: 0;
    transform: translateX(-80px);
    transition:
        opacity .9s ease,
        transform .9s cubic-bezier(.2, .65, .2, 1);
}

.animate-left.show {
    opacity: 1;
    transform: translateX(0);
}

/* RIGHT */
.animate-right {
    opacity: 0;
    transform: translateX(80px);
    transition:
        opacity .9s ease,
        transform .9s cubic-bezier(.2, .65, .2, 1);
}

.animate-right.show {
    opacity: 1;
    transform: translateX(0);
}

/* ZOOM */
.animate-zoom {
    opacity: 0;
    transform: scale(.85);
    transition:
        opacity .8s ease,
        transform .8s ease;
}

.animate-zoom.show {
    opacity: 1;
    transform: scale(1);
}

/* ROTATE */
.animate-rotate {
    opacity: 0;
    transform: rotate(6deg) scale(.92);
    transition:
        opacity .9s ease,
        transform .9s ease;
}

.animate-rotate.show {
    opacity: 1;
    transform: rotate(0) scale(1);
}

/* =========================================================
   STAGGER ANIMATION
========================================================= */

.stagger-item {
    opacity: 0;
    transform: translateY(40px);

    transition:
        opacity .7s ease,
        transform .7s ease;
}

.stagger-item.show {
    opacity: 1;
    transform: translateY(0);
}

/* Delay */
.stagger-item:nth-child(1) {
    transition-delay: .1s;
}

.stagger-item:nth-child(2) {
    transition-delay: .2s;
}

.stagger-item:nth-child(3) {
    transition-delay: .3s;
}

.stagger-item:nth-child(4) {
    transition-delay: .4s;
}

.stagger-item:nth-child(5) {
    transition-delay: .5s;
}

.stagger-item:nth-child(6) {
    transition-delay: .6s;
}

/* =========================================================
   FLOAT ANIMATION
========================================================= */

.float-animation {
    animation: floatingMove 4s ease-in-out infinite;
}

@keyframes floatingMove {

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

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

/* =========================================================
   SHIMMER HOVER
========================================================= */

.shimmer-effect {
    position: relative;
    overflow: hidden;
}

.shimmer-effect::before {
    content: "";

    position: absolute;
    top: 0;
    left: -120%;

    width: 70%;
    height: 100%;

    background:
        linear-gradient(to right,
            transparent,
            rgba(255, 255, 255, 0.35),
            transparent);

    transform: skewX(-25deg);

    transition: .8s;
}

.shimmer-effect:hover::before {
    left: 130%;
}