/* ========== HOLO-CHROME ANIMATIONS ========== */

/* Holographic Shimmer (Background) */
@keyframes holo-shimmer {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

/* Text Gradient Shine */
@keyframes text-shine {
    to {
        background-position: 200% center;
    }
}

/* Smooth Card Deal */
@keyframes card-deal {
    from {
        opacity: 0;
        transform: translateY(-20px) scale(0.9);
        filter: blur(4px);
    }

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

/* Soft Floating Effect */
@keyframes float {

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

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

/* Subtle Pulse */
@keyframes chrome-pulse {

    0%,
    100% {
        opacity: 1;
        box-shadow: 0 0 10px rgba(255, 255, 255, 0.1);
    }

    50% {
        opacity: 0.8;
        box-shadow: 0 0 20px rgba(255, 255, 255, 0.2);
    }
}

/* Slide Up Fade */
@keyframes slide-up-fade {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

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

/* Modal Zoom In */
@keyframes modal-zoom {
    from {
        opacity: 0;
        transform: scale(0.95);
    }

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

/* ========== NEW ENHANCED ANIMATIONS ========== */

/* Glitch Effect for Titles */
@keyframes glitch {

    0%,
    100% {
        transform: translate(0);
        text-shadow:
            2px 0 #c084fc,
            -2px 0 #60a5fa;
    }

    10% {
        transform: translate(-2px, 1px);
        text-shadow:
            3px 0 #c084fc,
            -3px 0 #60a5fa;
    }

    20% {
        transform: translate(2px, -1px);
        text-shadow:
            -2px 0 #c084fc,
            2px 0 #60a5fa;
    }

    30%,
    50%,
    70%,
    90% {
        transform: translate(0);
        text-shadow:
            2px 0 #c084fc,
            -2px 0 #60a5fa;
    }

    40% {
        transform: translate(-1px, 2px);
    }

    60% {
        transform: translate(1px, -2px);
    }

    80% {
        transform: translate(2px, 1px);
    }
}

/* Badge Pulse Animation */
@keyframes badge-pulse {

    0%,
    100% {
        transform: scale(1);
        box-shadow: 0 0 10px currentColor;
    }

    50% {
        transform: scale(1.05);
        box-shadow: 0 0 20px currentColor, 0 0 30px currentColor;
    }
}

/* Button Glow Pulse */
@keyframes glow-pulse {

    0%,
    100% {
        box-shadow:
            0 0 5px currentColor,
            0 0 10px currentColor,
            inset 0 0 20px rgba(255, 255, 255, 0.1);
    }

    50% {
        box-shadow:
            0 0 10px currentColor,
            0 0 20px currentColor,
            0 0 30px currentColor,
            inset 0 0 20px rgba(255, 255, 255, 0.15);
    }
}

/* Ripple Click Effect */
@keyframes ripple {
    0% {
        transform: scale(0);
        opacity: 0.6;
    }

    100% {
        transform: scale(2.5);
        opacity: 0;
    }
}

/* Scanning Effect for Mines */
@keyframes scan-pulse {
    0% {
        box-shadow: inset 0 0 0 0 rgba(45, 212, 191, 0.4);
    }

    50% {
        box-shadow: inset 0 0 20px 5px rgba(45, 212, 191, 0.4);
    }

    100% {
        box-shadow: inset 0 0 0 0 rgba(45, 212, 191, 0.4);
    }
}

/* Scroll Indicator Bounce */
@keyframes scroll-bounce {

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

    50% {
        transform: translateY(8px);
        opacity: 0.6;
    }
}

/* Entry Stagger for Cards */
@keyframes stagger-in {
    from {
        opacity: 0;
        transform: translateY(30px) scale(0.95);
    }

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

/* Icon Pop */
@keyframes icon-pop {
    0% {
        transform: scale(0);
        opacity: 0;
    }

    60% {
        transform: scale(1.2);
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

/* ========== UTILITY CLASSES ========== */

.animate-shimmer {
    background-size: 200% auto;
    animation: text-shine 3s linear infinite;
}

.animate-float {
    animation: float 6s ease-in-out infinite;
}

.animate-deal {
    animation: card-deal 0.5s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

.animate-glitch {
    animation: glitch 3s ease-in-out infinite;
}

.animate-pulse-badge {
    animation: badge-pulse 2s ease-in-out infinite;
}

.animate-glow {
    animation: glow-pulse 2s ease-in-out infinite;
}

.animate-scroll-bounce {
    animation: scroll-bounce 1.5s ease-in-out infinite;
}

/* Hover trigger for glitch */
.hover-glitch:hover {
    animation: glitch 0.4s ease-in-out;
}

/* Button ripple container */
.btn {
    position: relative;
    overflow: hidden;
}

.btn .ripple {
    position: absolute;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.4);
    pointer-events: none;
    animation: ripple 0.6s ease-out forwards;
}