/* Global Animations */

@keyframes pulseGlow {
  0% { box-shadow: 0 0 10px rgba(6, 182, 212, 0.2); }
  50% { box-shadow: 0 0 30px rgba(6, 182, 212, 0.6); }
  100% { box-shadow: 0 0 10px rgba(6, 182, 212, 0.2); }
}

@keyframes glitch {
  0% { transform: translate(0) }
  20% { transform: translate(-5px, 5px) }
  40% { transform: translate(-5px, -5px) }
  60% { transform: translate(5px, 5px) }
  80% { transform: translate(5px, -5px) }
  100% { transform: translate(0) }
}

.glitch-anim {
  animation: glitch 0.3s cubic-bezier(.25, .46, .45, .94) both infinite;
}

@keyframes dissolve {
  0% { opacity: 1; filter: blur(0px); transform: scale(1); }
  100% { opacity: 0; filter: blur(20px); transform: scale(1.1); }
}

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

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

/* Data Flow background effect */
@keyframes dataFlow {
  0% { background-position: 0 0; }
  100% { background-position: 0 100px; }
}

.data-bg {
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  pointer-events: none;
  background-image: linear-gradient(rgba(6,182,212,0.1) 1px, transparent 1px);
  background-size: 100% 50px;
  animation: dataFlow 3s linear infinite;
  opacity: 0.5;
  z-index: -1;
}

/* Particle Motion */
.particles {
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  overflow: hidden;
  z-index: -1;
}

.particle {
  position: absolute;
  background: var(--accent-cyan);
  border-radius: 50%;
  opacity: 0.5;
  animation: floatUp 10s infinite linear;
}

@keyframes floatUp {
  0% {
    transform: translateY(100vh) scale(0);
    opacity: 0;
  }
  50% {
    opacity: 0.6;
  }
  100% {
    transform: translateY(-100px) scale(1);
    opacity: 0;
  }
}