/* Efeitos de Corrupção e Glitch - MELHORADOS */

/* Efeito de ruído/corrupção de fundo - INTENSIFICADO */
.corruption-effect {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0.4;
    background-image: 
        radial-gradient(circle at 20% 80%, rgba(220, 38, 127, 0.4) 0%, transparent 50%),
        radial-gradient(circle at 80% 20%, rgba(255, 119, 198, 0.35) 0%, transparent 50%),
        radial-gradient(circle at 40% 40%, rgba(120, 119, 198, 0.35) 0%, transparent 50%),
        radial-gradient(circle at 60% 70%, rgba(220, 38, 127, 0.3) 0%, transparent 40%);
    background-size: 250px 250px, 350px 350px, 180px 180px, 220px 220px;
    animation: corruption-move 10s ease-in-out infinite;
    mix-blend-mode: screen;
}

@keyframes corruption-move {
    0%, 100% { 
        background-position: 0% 0%, 100% 100%, 50% 50%, 75% 25%; 
        filter: hue-rotate(0deg) brightness(1);
    }
    25% { 
        background-position: 100% 0%, 0% 100%, 80% 20%, 25% 75%; 
        filter: hue-rotate(90deg) brightness(1.1);
    }
    50% { 
        background-position: 100% 100%, 0% 0%, 20% 80%, 60% 40%; 
        filter: hue-rotate(180deg) brightness(0.9);
    }
    75% { 
        background-position: 0% 100%, 100% 0%, 60% 40%, 40% 60%; 
        filter: hue-rotate(270deg) brightness(1.05);
    }
}

/* Linhas de interferência - APRIMORADAS */
.glitch-lines {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: repeating-linear-gradient(
        90deg,
        transparent,
        transparent 2px,
        rgba(255, 0, 0, 0.05) 2px,
        rgba(255, 0, 0, 0.05) 4px,
        transparent 4px,
        transparent 8px,
        rgba(0, 255, 255, 0.05) 8px,
        rgba(0, 255, 255, 0.05) 10px
    );
    animation: glitch-lines 2.5s linear infinite;
    pointer-events: none;
}

@keyframes glitch-lines {
    0% { transform: translateX(0); }
    10% { transform: translateX(-3px); }
    20% { transform: translateX(3px); }
    30% { transform: translateX(-2px); }
    40% { transform: translateX(2px); }
    50% { transform: translateX(-4px); }
    60% { transform: translateX(4px); }
    70% { transform: translateX(-2px); }
    80% { transform: translateX(2px); }
    90% { transform: translateX(-3px); }
    100% { transform: translateX(0); }
}

/* Efeito glitch no texto - INTENSIFICADO */
.glitch-text {
    position: relative;
    animation: glitch-text 5s infinite;
}

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

.glitch-text::before {
    animation: glitch-before 2.5s infinite;
    color: #ff0000;
    opacity: 0.9;
    text-shadow: 2px 0 #ff0000;
}

.glitch-text::after {
    animation: glitch-after 2s infinite;
    color: #00ffff;
    opacity: 0.9;
    text-shadow: -2px 0 #00ffff;
}

@keyframes glitch-text {
    0%, 90%, 100% {
        transform: translate(0);
    }
    10% {
        transform: translate(-3px, 3px);
    }
    20% {
        transform: translate(3px, -3px);
    }
    30% {
        transform: translate(-3px, 3px);
    }
    40% {
        transform: translate(3px, -3px);
    }
    50% {
        transform: translate(-2px, 2px);
    }
    60% {
        transform: translate(2px, -2px);
    }
    70% {
        transform: translate(-3px, 3px);
    }
    80% {
        transform: translate(3px, -3px);
    }
}

@keyframes glitch-before {
    0%, 90%, 100% {
        transform: translate(0);
        opacity: 0.9;
    }
    10% {
        transform: translate(3px, 0);
        opacity: 1;
    }
    20% {
        transform: translate(-3px, 0);
        opacity: 0.8;
    }
    30% {
        transform: translate(3px, 0);
        opacity: 1;
    }
    40% {
        transform: translate(-3px, 0);
        opacity: 0.9;
    }
    50% {
        transform: translate(2px, 0);
        opacity: 1;
    }
    60% {
        transform: translate(-2px, 0);
        opacity: 0.8;
    }
    70% {
        transform: translate(3px, 0);
        opacity: 0.9;
    }
    80% {
        transform: translate(-3px, 0);
        opacity: 1;
    }
}

@keyframes glitch-after {
    0%, 90%, 100% {
        transform: translate(0);
        opacity: 0.9;
    }
    10% {
        transform: translate(-3px, 0);
        opacity: 1;
    }
    20% {
        transform: translate(3px, 0);
        opacity: 0.8;
    }
    30% {
        transform: translate(-2px, 0);
        opacity: 1;
    }
    40% {
        transform: translate(2px, 0);
        opacity: 0.9;
    }
    50% {
        transform: translate(-3px, 0);
        opacity: 1;
    }
    60% {
        transform: translate(3px, 0);
        opacity: 0.8;
    }
    70% {
        transform: translate(-2px, 0);
        opacity: 0.9;
    }
    80% {
        transform: translate(2px, 0);
        opacity: 1;
    }
}

/* Linha com efeito glitch */
.glitch-line {
    position: relative;
    animation: glitch-line 4s infinite;
}

@keyframes glitch-line {
    0%, 90%, 100% {
        transform: scaleX(1);
        opacity: 1;
    }
    10% {
        transform: scaleX(1.15);
        opacity: 0.8;
    }
    20% {
        transform: scaleX(0.85);
        opacity: 1;
    }
    30% {
        transform: scaleX(1.08);
        opacity: 0.9;
    }
}

/* Card com efeito glitch sutil */
.glitch-card {
    position: relative;
    animation: glitch-card 10s infinite;
}

@keyframes glitch-card {
    0%, 95%, 100% {
        transform: translate(0);
        box-shadow: 0 0 0 rgba(220, 38, 127, 0);
    }
    2% {
        transform: translate(2px, -2px);
        box-shadow: 0 0 15px rgba(220, 38, 127, 0.4);
    }
    4% {
        transform: translate(-2px, 2px);
        box-shadow: 0 0 20px rgba(220, 38, 127, 0.3);
    }
    6% {
        transform: translate(0);
        box-shadow: 0 0 0 rgba(220, 38, 127, 0);
    }
}

/* Efeito de scan lines */
.scan-lines {
    position: relative;
}

.scan-lines::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(
        transparent 50%,
        rgba(0, 255, 0, 0.04) 50%
    );
    background-size: 100% 4px;
    animation: scan-lines 0.08s linear infinite;
    pointer-events: none;
}

@keyframes scan-lines {
    0% { transform: translateY(0); }
    100% { transform: translateY(4px); }
}

/* Efeito de interferência RGB */
.rgb-shift {
    position: relative;
}

.rgb-shift::before,
.rgb-shift::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    mix-blend-mode: screen;
    pointer-events: none;
}

.rgb-shift::before {
    background: rgba(255, 0, 0, 0.15);
    animation: rgb-shift-red 2.5s infinite;
}

.rgb-shift::after {
    background: rgba(0, 255, 255, 0.15);
    animation: rgb-shift-cyan 2s infinite;
}

@keyframes rgb-shift-red {
    0%, 90%, 100% { transform: translate(0); }
    10% { transform: translate(3px, 0); }
    20% { transform: translate(-3px, 0); }
    30% { transform: translate(2px, 0); }
    40% { transform: translate(-2px, 0); }
}

@keyframes rgb-shift-cyan {
    0%, 90%, 100% { transform: translate(0); }
    15% { transform: translate(-3px, 0); }
    25% { transform: translate(3px, 0); }
    35% { transform: translate(-2px, 0); }
    45% { transform: translate(2px, 0); }
}

/* Efeito de distorção digital */
.digital-distortion {
    position: relative;
    overflow: hidden;
}

.digital-distortion::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(220, 38, 127, 0.2),
        rgba(255, 255, 255, 0.1),
        rgba(220, 38, 127, 0.2),
        transparent
    );
    animation: digital-sweep 5s infinite;
}

@keyframes digital-sweep {
    0% { left: -100%; }
    50% { left: 100%; }
    100% { left: 100%; }
}

/* Efeito de pixelização */
.pixelate {
    image-rendering: pixelated;
    image-rendering: -moz-crisp-edges;
    image-rendering: crisp-edges;
    filter: contrast(1.3) brightness(1.1);
    animation: pixelate-flicker 8s infinite;
}

@keyframes pixelate-flicker {
    0%, 95%, 100% { 
        filter: contrast(1.3) brightness(1.1); 
    }
    2% { 
        filter: contrast(1.6) brightness(0.8) hue-rotate(15deg); 
    }
    4% { 
        filter: contrast(0.9) brightness(1.4) hue-rotate(-15deg); 
    }
    6% { 
        filter: contrast(1.3) brightness(1.1); 
    }
}

/* Efeito de static/ruído */
.static-noise {
    position: relative;
}

.static-noise::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: 
        radial-gradient(circle at 1px 1px, rgba(255,255,255,0.2) 1px, transparent 0);
    background-size: 20px 20px;
    animation: static-move 0.3s infinite;
    pointer-events: none;
    opacity: 0.15;
}

@keyframes static-move {
    0% { transform: translate(0, 0); }
    10% { transform: translate(-2px, 2px); }
    20% { transform: translate(2px, -2px); }
    30% { transform: translate(-2px, -2px); }
    40% { transform: translate(2px, 2px); }
    50% { transform: translate(-2px, 0); }
    60% { transform: translate(2px, 0); }
    70% { transform: translate(0, -2px); }
    80% { transform: translate(0, 2px); }
    90% { transform: translate(-2px, 2px); }
    100% { transform: translate(0, 0); }
}

/* Efeito de hologram */
.hologram {
    position: relative;
    background: linear-gradient(
        45deg,
        transparent 30%,
        rgba(220, 38, 127, 0.15) 50%,
        transparent 70%
    );
    background-size: 20px 20px;
    animation: hologram-shift 4s infinite;
}

@keyframes hologram-shift {
    0%, 100% { 
        background-position: 0 0; 
        filter: brightness(1);
    }
    50% { 
        background-position: 20px 20px; 
        filter: brightness(1.1);
    }
}

/* Efeitos de hover específicos */
.btn:hover {
    animation: button-glitch 0.3s ease;
}

@keyframes button-glitch {
    0%, 100% { transform: translate(0); }
    25% { transform: translate(2px, -2px); }
    50% { transform: translate(-2px, 2px); }
    75% { transform: translate(2px, 2px); }
}

.nav-link:hover {
    animation: nav-glitch 0.5s ease;
}

@keyframes nav-glitch {
    0%, 100% { transform: translateY(-2px); }
    25% { transform: translateY(-3px) translateX(1px); }
    50% { transform: translateY(-2px) translateX(-1px); }
    75% { transform: translateY(-3px) translateX(1px); }
}

/* Efeito de loading/carregamento */
.loading-glitch {
    position: relative;
    overflow: hidden;
}

.loading-glitch::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(220, 38, 127, 0.4),
        rgba(255, 255, 255, 0.3),
        rgba(220, 38, 127, 0.4),
        transparent
    );
    animation: loading-sweep 1.5s infinite;
}

@keyframes loading-sweep {
    0% { left: -100%; }
    100% { left: 100%; }
}

/* Efeito de pulsação */
.pulse-glow {
    animation: pulse-glow 2s ease-in-out infinite;
}

@keyframes pulse-glow {
    0%, 100% {
        box-shadow: 0 0 10px rgba(220, 38, 127, 0.3);
    }
    50% {
        box-shadow: 0 0 20px rgba(220, 38, 127, 0.6);
    }
}

/* Responsividade para efeitos em mobile */
@media (max-width: 768px) {
    .corruption-effect {
        background-size: 180px 180px, 250px 250px, 130px 130px, 160px 160px;
        opacity: 0.3;
    }
    
    .glitch-text {
        animation-duration: 7s;
    }
    
    .glitch-card {
        animation-duration: 12s;
    }
    
    /* Reduzir intensidade dos efeitos em dispositivos móveis */
    .glitch-text::before,
    .glitch-text::after {
        opacity: 0.6;
    }
    
    .static-noise::after {
        opacity: 0.08;
    }
    
    .glitch-lines {
        opacity: 0.5;
    }
}

/* Animações de entrada suaves */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.fade-in-up {
    animation: fadeInUp 0.8s ease forwards;
}

/* Efeito de shimmer */
.shimmer {
    position: relative;
    overflow: hidden;
}

.shimmer::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 50%;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(255, 255, 255, 0.1),
        transparent
    );
    animation: shimmer 3s infinite;
}

@keyframes shimmer {
    0% { left: -100%; }
    100% { left: 100%; }
}