/* ====================================================
   BLOCKORA - ANIMATIONS STYLESHEET
   ================================================    */

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(40px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeDown {
    from {
        opacity: 0;
        transform: translateY(-40px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeLeft {
    from {
        opacity: 0;
        transform: translateX(50px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes fadeRight {
    from {
        opacity: 0;
        transform: translateX(-50px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes scaleIn {
    from {
        opacity: 0;
        transform: scale(0.85);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes float {
    0%, 100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-12px);
    }
}

@keyframes pulse {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 0 40px rgba(0, 212, 255, 0.4);
    }
    50% {
        transform: scale(1.05);
        box-shadow: 0 0 70px rgba(0, 212, 255, 0.7);
    }
}

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

@keyframes glow {
    0%, 100% {
        opacity: 0.3;
    }
    50% {
        opacity: 0.7;
    }
}

@keyframes shimmer {
    0% {
        background-position: -200% 0;
    }
    100% {
        background-position: 200% 0;
    }
}

@keyframes slideTicker {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

@keyframes gradientMove {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

@keyframes orbit {
    from {
        transform: rotate(0deg) translateX(120px) rotate(0deg);
    }
    to {
        transform: rotate(360deg) translateX(120px) rotate(-360deg);
    }
}

@keyframes nodePulse {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 0 10px var(--primary-cyan);
    }
    50% {
        transform: scale(1.3);
        box-shadow: 0 0 25px var(--primary-cyan);
    }
}

@keyframes rippleEffect {
    0% {
        transform: scale(0);
        opacity: 0.6;
    }
    100% {
        transform: scale(4);
        opacity: 0;
    }
}

/* Scroll Reveal Classes */
[data-animation] {
    opacity: 0;
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

[data-animation="fade-up"].animated {
    opacity: 1;
    transform: translateY(0);
}

[data-animation="fade-left"].animated {
    opacity: 1;
    transform: translateX(0);
}

[data-animation="fade-right"].animated {
    opacity: 1;
    transform: translateX(0);
}

[data-animation="zoom"].animated {
    opacity: 1;
    transform: scale(1);
}

/* Initial Offsets for Reveal */
[data-animation="fade-up"] {
    transform: translateY(40px);
}

[data-animation="fade-left"] {
    transform: translateX(50px);
}

[data-animation="fade-right"] {
    transform: translateX(-50px);
}

[data-animation="zoom"] {
    transform: scale(0.9);
}