/* ══════════════════════════════════════════
   MORENTY Animations
   ══════════════════════════════════════════ */

/* ── GLITCH EFFECT ── */
.glitch {
    position: relative;
    display: inline-block;
}

.glitch::before, .glitch::after {
    content: attr(data-text);
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    opacity: 0.8;
}

.glitch::before {
    color: #0ff;
    z-index: -1;
    animation: glitch-1 3s infinite linear alternate-reverse;
}

.glitch::after {
    color: #f0f;
    z-index: -2;
    animation: glitch-2 2s infinite linear alternate-reverse;
}

@keyframes glitch-1 {
    0%, 90% { clip-path: inset(0 0 0 0); transform: translate(0); }
    91% { clip-path: inset(20% 0 60% 0); transform: translate(-3px, 1px); }
    92% { clip-path: inset(50% 0 20% 0); transform: translate(3px, -1px); }
    93% { clip-path: inset(10% 0 70% 0); transform: translate(-2px, 2px); }
    94% { clip-path: inset(60% 0 10% 0); transform: translate(2px, -2px); }
    95% { clip-path: inset(30% 0 40% 0); transform: translate(-1px, 1px); }
    96%, 100% { clip-path: inset(0 0 0 0); transform: translate(0); }
}

@keyframes glitch-2 {
    0%, 88% { clip-path: inset(0 0 0 0); transform: translate(0); }
    89% { clip-path: inset(40% 0 30% 0); transform: translate(2px, -1px); }
    90% { clip-path: inset(10% 0 60% 0); transform: translate(-2px, 1px); }
    91% { clip-path: inset(70% 0 5% 0); transform: translate(1px, 2px); }
    92% { clip-path: inset(25% 0 50% 0); transform: translate(-3px, -1px); }
    93%, 100% { clip-path: inset(0 0 0 0); transform: translate(0); }
}

/* ── PULSE ── */
@keyframes pulse-red {
    0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(230, 25, 60, 0.5); }
    50% { opacity: 0.7; box-shadow: 0 0 0 8px rgba(230, 25, 60, 0); }
}

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

/* ── BLINK CURSOR ── */
@keyframes blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0; }
}

/* ── SPIN ── */
@keyframes spin {
    to { transform: rotate(360deg); }
}

/* ── SLIDE IN ── */
@keyframes slideInRight {
    from { transform: translateX(100%); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}

@keyframes fadeOut {
    to { opacity: 0; transform: translateX(20px); }
}

/* ── FADE IN UP ── */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ── STAGGER CARDS ── */
.stagger-item {
    opacity: 0;
    transform: translateY(30px);
    animation: fadeInUp 0.6s var(--ease) forwards;
}

.stagger-item:nth-child(1) { animation-delay: 0.05s; }
.stagger-item:nth-child(2) { animation-delay: 0.1s; }
.stagger-item:nth-child(3) { animation-delay: 0.15s; }
.stagger-item:nth-child(4) { animation-delay: 0.2s; }
.stagger-item:nth-child(5) { animation-delay: 0.25s; }
.stagger-item:nth-child(6) { animation-delay: 0.3s; }
.stagger-item:nth-child(7) { animation-delay: 0.35s; }
.stagger-item:nth-child(8) { animation-delay: 0.4s; }

/* ── BORDER GLOW ── */
@keyframes borderGlow {
    0%, 100% { border-color: rgba(230, 25, 60, 0.2); }
    50% { border-color: rgba(230, 25, 60, 0.5); }
}

.glow-border {
    animation: borderGlow 3s infinite;
}

/* ── SCANNER LINE ── */
@keyframes scanLine {
    0% { top: -5%; }
    100% { top: 105%; }
}

.scan-effect::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--accent), transparent);
    animation: scanLine 4s linear infinite;
    opacity: 0.4;
    z-index: 1;
}

/* ── NEON TEXT ── */
.neon-text {
    text-shadow: 0 0 7px var(--accent), 0 0 20px var(--accent), 0 0 40px rgba(230, 25, 60, 0.3);
}

/* ── APPEAR ON SCROLL ── */
.reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.8s var(--ease), transform 0.8s var(--ease);
}

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