/* assets/css/animations.css */

.text-animate-gradient {
    background: linear-gradient(to right, #0ea5e9, #6366f1, #0ea5e9);
    background-size: 200% auto;
    color: transparent;
    -webkit-background-clip: text;
    animation: gradientMove 4s linear infinite;
}

.dark .text-animate-gradient {
    background: linear-gradient(to right, #38BDF8, #818CF8, #38BDF8);
    background-size: 200% auto;
    -webkit-background-clip: text;
}

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

.reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: all 0.8s cubic-bezier(0.5, 0, 0, 1);
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

@keyframes pulse-dot {
    0%,
    100% {
        opacity: 1;
    }
    50% {
        opacity: 0.4;
    }
}

.t-blink-cursor {
    display: inline-block;
    width: 9px;
    height: 15px;
    background: #00ff00;
    margin-left: 2px;
    vertical-align: middle;
    animation: blink-block 1s step-start infinite;
}

@keyframes blink-block {
    0%,
    100% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
}

/* ── Custom Cursor ─────────────────────────────────────────── */
body {
    cursor: none;
}

#terminal-input {
    cursor: text;
}

#cursor-dot,
#cursor-ring {
    position: fixed;
    top: 0;
    left: 0;
    border-radius: 50%;
    pointer-events: none !important;
    z-index: 40;
    will-change: transform;
}

#cursor-dot {
    width: 8px;
    height: 8px;
    background: #6366f1;
    box-shadow: 0 0 10px 3px rgba(99, 102, 241, .7),
        0 0 20px 6px rgba(99, 102, 241, .35);
    transform: translate(-50%, -50%);
    transition: opacity .2s ease, transform .15s ease;
}

#cursor-ring {
    width: 36px;
    height: 36px;
    border: 2px solid rgba(99, 102, 241, .55);
    background: transparent;
    transform: translate(-50%, -50%) scale(1);
    transition: width .25s ease, height .25s ease,
        border-width .25s ease, border-color .25s ease,
        transform .25s cubic-bezier(.22, 1, .36, 1);
}

body.cursor-hover #cursor-ring {
    width: 54px;
    height: 54px;
    border-width: 1px;
    border-color: rgba(99, 102, 241, .9);
    background: rgba(99, 102, 241, .06);
}

body.cursor-hover #cursor-dot {
    transform: translate(-50%, -50%) scale(1.5);
}

@media (hover: none) {
    #cursor-dot,
    #cursor-ring {
        display: none;
    }
    body {
        cursor: auto;
    }
}

/* =============================================
   PROFILE LOADER ANIMATIONS
   ============================================= */
@keyframes breathe {
    0%,
    100% {
        opacity: .85;
        transform: scale(1);
    }
    50% {
        opacity: 1;
        transform: scale(1.02);
    }
}

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