/* =========================================
   RELGO TEK ANIMATIONS
========================================= */


/* FLOATING EFFECT */

@keyframes floatY {

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

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

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

}

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


/* GLOW PULSE */

@keyframes glowPulse {

    0%{
        box-shadow: 0 0 0 rgba(193,75,255,0.0);
    }

    50%{
        box-shadow: 0 0 35px rgba(193,75,255,0.45);
    }

    100%{
        box-shadow: 0 0 0 rgba(193,75,255,0.0);
    }

}

.glow-pulse{
    animation: glowPulse 3s infinite;
}


/* BUTTON SHINE */

@keyframes shine {

    0%{
        left: -100%;
    }

    100%{
        left: 120%;
    }

}

.btn-shine{
    position: relative;
    overflow: hidden;
}

.btn-shine::before{

    content: '';

    position: absolute;

    top: 0;
    left: -100%;

    width: 50%;
    height: 100%;

    background:
    linear-gradient(
        120deg,
        transparent,
        rgba(255,255,255,0.4),
        transparent
    );

    transform: skewX(-20deg);

}

.btn-shine:hover::before{
    animation: shine 1s ease;
}


/* ROTATE GLOW */

@keyframes rotateGlow {

    0%{
        transform: rotate(0deg);
    }

    100%{
        transform: rotate(360deg);
    }

}

.rotate-glow{
    animation: rotateGlow 12s linear infinite;
}


/* FADE UP */

@keyframes fadeUp {

    from{
        opacity: 0;
        transform: translateY(40px);
    }

    to{
        opacity: 1;
        transform: translateY(0);
    }

}

.fade-up{
    animation: fadeUp 1s ease;
}


/* ZOOM IN */

@keyframes zoomIn {

    from{
        opacity: 0;
        transform: scale(0.8);
    }

    to{
        opacity: 1;
        transform: scale(1);
    }

}

.zoom-in{
    animation: zoomIn 1s ease;
}


/* FLOATING PARTICLES */

@keyframes particleMove {

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

    50%{
        opacity: 1;
    }

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

}

.particle{
    animation: particleMove 6s linear infinite;
}


/* SPIN */

@keyframes spin {

    from{
        transform: rotate(0deg);
    }

    to{
        transform: rotate(360deg);
    }

}

.spin-animation{
    animation: spin 10s linear infinite;
}


/* MARQUEE */

@keyframes marquee {

    0%{
        transform: translateX(0%);
    }

    100%{
        transform: translateX(-100%);
    }

}

.marquee{
    animation: marquee 20s linear infinite;
}


/* SCROLL DOWN */

@keyframes scrollDown {

    0%{
        transform: translateY(0);
        opacity: 1;
    }

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

}

.scroll-indicator{
    animation: scrollDown 1.5s infinite;
}