/* =====================================================
   BI Solutions.ai - Animations
   ===================================================== */

/* Particle Animation */
.particles-canvas {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  pointer-events: none;
  opacity: 0.4;
}

/* Typing Cursor */
.typing-cursor::after {
  content: '|';
  animation: blink 1s infinite;
  color: var(--accent-cyan);
}

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

/* Gradient border animation */
@keyframes borderGlow {
  0%, 100% { border-color: rgba(0, 212, 255, 0.2); }
  50% { border-color: rgba(0, 212, 255, 0.6); }
}

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

/* Counter animation */
.counter-animated {
  transition: all 0.1s ease;
}

/* Shine effect on buttons */
.btn-primary::after {
  content: '';
  position: absolute;
  top: -50%; left: -50%;
  width: 200%; height: 200%;
  background: linear-gradient(45deg, transparent 30%, rgba(255,255,255,0.2) 50%, transparent 70%);
  transform: translateX(-100%);
  transition: transform 0.6s ease;
}

.btn-primary:hover::after {
  transform: translateX(100%);
}

.btn-primary {
  position: relative;
  overflow: hidden;
}

/* Neural network animation background */
.neural-bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.neural-node {
  position: absolute;
  width: 4px;
  height: 4px;
  background: var(--accent-cyan);
  border-radius: 50%;
  opacity: 0.4;
  animation: neuralPulse 4s ease-in-out infinite;
}

@keyframes neuralPulse {
  0%, 100% { opacity: 0.2; transform: scale(1); }
  50% { opacity: 0.7; transform: scale(1.5); }
}

/* Loading bar animation */
.progress-bar {
  width: 0;
  height: 3px;
  background: var(--gradient-accent);
  border-radius: 2px;
  animation: loadProgress 2s ease-out forwards;
}

@keyframes loadProgress {
  from { width: 0; }
  to { width: var(--progress); }
}

/* Slide in from left */
@keyframes slideInLeft {
  from { opacity: 0; transform: translateX(-40px); }
  to { opacity: 1; transform: translateX(0); }
}

/* Slide in from right */
@keyframes slideInRight {
  from { opacity: 0; transform: translateX(40px); }
  to { opacity: 1; transform: translateX(0); }
}

.slide-left { animation: slideInLeft 0.7s ease forwards; }
.slide-right { animation: slideInRight 0.7s ease forwards; }

/* Scale in */
@keyframes scaleIn {
  from { opacity: 0; transform: scale(0.85); }
  to { opacity: 1; transform: scale(1); }
}

.scale-in { animation: scaleIn 0.5s ease forwards; }

/* Ripple effect */
@keyframes ripple {
  0% { transform: scale(0); opacity: 1; }
  100% { transform: scale(4); opacity: 0; }
}

/* Card Hover Gradient Sweep */
.glass-card {
  background-size: 200% 200%;
  transition: background-position 0.5s ease, transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

/* Number counter animation */
@keyframes countUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

.count-animate {
  animation: countUp 0.5s ease forwards;
}

/* Stagger children animation */
.stagger-children > * {
  opacity: 0;
  transform: translateY(20px);
}

.stagger-children.visible > *:nth-child(1) { animation: countUp 0.5s 0.0s ease forwards; }
.stagger-children.visible > *:nth-child(2) { animation: countUp 0.5s 0.1s ease forwards; }
.stagger-children.visible > *:nth-child(3) { animation: countUp 0.5s 0.2s ease forwards; }
.stagger-children.visible > *:nth-child(4) { animation: countUp 0.5s 0.3s ease forwards; }
.stagger-children.visible > *:nth-child(5) { animation: countUp 0.5s 0.4s ease forwards; }
.stagger-children.visible > *:nth-child(6) { animation: countUp 0.5s 0.5s ease forwards; }

/* Tech logo animation */
.tech-item {
  animation: fadeInUp 0.6s ease forwards;
  opacity: 0;
}

@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(15px); }
  to { opacity: 0.65; transform: translateY(0); }
}

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

/* Scrollbar accent */
.scroll-indicator {
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  background: var(--gradient-accent);
  z-index: 9999;
  transition: width 0.1s linear;
}