/* ==========================================================
   AURAMIND V3
   ANIMATION LIBRARY
========================================================== */


/* ==========================================================
   TRANSITIONS
========================================================== */

.am-transition{

    transition:var(--transition);

}


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

.am-float{

    animation:amFloat 6s ease-in-out infinite;

}

@keyframes amFloat{

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

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

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

}


/* ==========================================================
   PULSE
========================================================== */

.am-pulse{

    animation:amPulse 2.5s infinite;

}

@keyframes amPulse{

    0%{

        transform:scale(1);

    }

    50%{

        transform:scale(1.05);

    }

    100%{

        transform:scale(1);

    }

}


/* ==========================================================
   ROTATE
========================================================== */

.am-rotate{

    animation:amRotate 20s linear infinite;

}

@keyframes amRotate{

    from{

        transform:rotate(0deg);

    }

    to{

        transform:rotate(360deg);

    }

}


/* ==========================================================
   GLOW
========================================================== */

.am-glow{

    animation:amGlow 3s ease-in-out infinite;

}

@keyframes amGlow{

    0%{

        box-shadow:0 0 0 rgba(108,62,244,0);

    }

    50%{

        box-shadow:0 18px 45px rgba(108,62,244,.35);

    }

    100%{

        box-shadow:0 0 0 rgba(108,62,244,0);

    }

}


/* ==========================================================
   HOVER LIFT
========================================================== */

.am-hover-lift{

    transition:var(--transition);

}

.am-hover-lift:hover{

    transform:translateY(-10px);

}


/* ==========================================================
   HOVER SCALE
========================================================== */

.am-hover-scale{

    transition:var(--transition);

}

.am-hover-scale:hover{

    transform:scale(1.04);

}


/* ==========================================================
   HOVER ROTATE
========================================================== */

.am-hover-rotate{

    transition:var(--transition);

}

.am-hover-rotate:hover{

    transform:rotate(-3deg);

}


/* ==========================================================
   FADE UP
========================================================== */

.am-fade-up{

    opacity:0;

    transform:translateY(40px);

    transition:
        opacity .8s ease,
        transform .8s ease;

}

.am-fade-up.am-visible{

    opacity:1;

    transform:none;

}


/* ==========================================================
   FADE LEFT
========================================================== */

.am-fade-left{

    opacity:0;

    transform:translateX(-40px);

    transition:
        opacity .8s ease,
        transform .8s ease;

}

.am-fade-left.am-visible{

    opacity:1;

    transform:none;

}


/* ==========================================================
   FADE RIGHT
========================================================== */

.am-fade-right{

    opacity:0;

    transform:translateX(40px);

    transition:
        opacity .8s ease,
        transform .8s ease;

}

.am-fade-right.am-visible{

    opacity:1;

    transform:none;

}


/* ==========================================================
   ZOOM
========================================================== */

.am-zoom{

    opacity:0;

    transform:scale(.9);

    transition:
        opacity .8s ease,
        transform .8s ease;

}

.am-zoom.am-visible{

    opacity:1;

    transform:scale(1);

}


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

.am-shimmer{

    position:relative;

    overflow:hidden;

}

.am-shimmer::after{

    content:"";

    position:absolute;

    inset:0;

    transform:translateX(-100%);

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.35),
            transparent
        );

    animation:amShimmer 3.5s infinite;

}

@keyframes amShimmer{

    100%{

        transform:translateX(100%);

    }

}


/* ==========================================================
   BLOB
========================================================== */

.am-blob{

    animation:amBlob 16s ease-in-out infinite;

}

@keyframes amBlob{

    0%{

        border-radius:35% 65% 55% 45%;

    }

    25%{

        border-radius:55% 45% 35% 65%;

    }

    50%{

        border-radius:60% 40% 55% 45%;

    }

    75%{

        border-radius:45% 55% 60% 40%;

    }

    100%{

        border-radius:35% 65% 55% 45%;

    }

}


/* ==========================================================
   DELAY HELPERS
========================================================== */

.am-delay-1{

    transition-delay:.15s;

}

.am-delay-2{

    transition-delay:.3s;

}

.am-delay-3{

    transition-delay:.45s;

}

.am-delay-4{

    transition-delay:.6s;

}