/* ═══════════════════════════════════════════════════════════════
   animations.css — حركات التمرير والتوهج والـ 3D
   ═══════════════════════════════════════════════════════════════ */

/* ─── Title Glow ─── */
.hero-content h1 {
  animation: titleGlow 3s ease-in-out infinite alternate;
}

@keyframes titleGlow {
  0%   { text-shadow: 0 0 20px rgba(0,245,255,0.4), 0 0 60px rgba(0,245,255,0.1); }
  50%  { text-shadow: 0 0 30px rgba(157,0,255,0.4), 0 0 80px rgba(157,0,255,0.1); }
  100% { text-shadow: 0 0 20px rgba(0,245,255,0.4), 0 0 60px rgba(0,245,255,0.1); }
}

/* ─── Scroll Reveal Animation ─── */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1), transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}

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

/* Staggered children */
.reveal-stagger > * {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}

.reveal-stagger.visible > *:nth-child(1) { transition-delay: 0.05s; }
.reveal-stagger.visible > *:nth-child(2) { transition-delay: 0.1s; }
.reveal-stagger.visible > *:nth-child(3) { transition-delay: 0.15s; }
.reveal-stagger.visible > *:nth-child(4) { transition-delay: 0.2s; }
.reveal-stagger.visible > *:nth-child(5) { transition-delay: 0.25s; }
.reveal-stagger.visible > *:nth-child(6) { transition-delay: 0.3s; }
.reveal-stagger.visible > *:nth-child(7) { transition-delay: 0.35s; }
.reveal-stagger.visible > *:nth-child(8) { transition-delay: 0.4s; }
.reveal-stagger.visible > *:nth-child(9) { transition-delay: 0.45s; }

.reveal-stagger.visible > * {
  opacity: 1;
  transform: translateY(0);
}

/* ─── Fade In ─── */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

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

@keyframes fadeInScale {
  from {
    opacity: 0;
    transform: scale(0.95);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* ─── Pulse ─── */
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.6; }
}

.animate-pulse {
  animation: pulse 2s ease-in-out infinite;
}

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

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

/* ─── Gradient Border Rotate ─── */
@keyframes borderRotate {
  0% { --angle: 0deg; }
  100% { --angle: 360deg; }
}

/* ─── Navbar scroll effect ─── */
.navbar {
  transition: background 0.3s ease, box-shadow 0.3s ease, padding 0.3s ease;
}

.navbar.scrolled {
  padding-top: 8px;
  padding-bottom: 8px;
}

/* ─── Card entrance animation ─── */
.neon-card {
  animation: fadeInUp 0.5s ease both;
}

.grid .neon-card:nth-child(1)  { animation-delay: 0.03s; }
.grid .neon-card:nth-child(2)  { animation-delay: 0.06s; }
.grid .neon-card:nth-child(3)  { animation-delay: 0.09s; }
.grid .neon-card:nth-child(4)  { animation-delay: 0.12s; }
.grid .neon-card:nth-child(5)  { animation-delay: 0.15s; }
.grid .neon-card:nth-child(6)  { animation-delay: 0.18s; }
.grid .neon-card:nth-child(7)  { animation-delay: 0.21s; }
.grid .neon-card:nth-child(8)  { animation-delay: 0.24s; }
.grid .neon-card:nth-child(9)  { animation-delay: 0.27s; }

/* ─── Counter animation ─── */
@keyframes countUp {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

.stat-number {
  animation: countUp 0.8s ease both;
}

/* ─── Smooth page transition ─── */
main {
  animation: fadeIn 0.4s ease;
}