/* ============================================
   VEXOBRAVELMORA — ANIMATION SYSTEM
   ============================================ */

/* ---- KEYFRAMES ---- */
@keyframes pulse-dot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.5; transform: scale(0.85); }
}

@keyframes scroll-line-anim {
  0% { transform: scaleY(0); transform-origin: top; }
  50% { transform: scaleY(1); transform-origin: top; }
  51% { transform: scaleY(1); transform-origin: bottom; }
  100% { transform: scaleY(0); transform-origin: bottom; }
}

@keyframes float-orb {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33% { transform: translate(20px, -30px) scale(1.05); }
  66% { transform: translate(-15px, 15px) scale(0.97); }
}

@keyframes fade-in-up {
  from {
    opacity: 0;
    transform: translateY(28px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fade-in-left {
  from {
    opacity: 0;
    transform: translateX(-28px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes fade-in-right {
  from {
    opacity: 0;
    transform: translateX(28px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes shimmer {
  0% { background-position: -200% center; }
  100% { background-position: 200% center; }
}

@keyframes count-up {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* ---- ORB ANIMATION ---- */
.hero-gradient-orb {
  animation: float-orb 12s ease-in-out infinite;
}

.orb-two {
  animation-delay: -5s;
  animation-duration: 15s;
}

/* ---- SCROLL-TRIGGERED REVEAL ---- */
.fade-up,
.fade-left,
.fade-right,
.fade-in {
  opacity: 0;
  will-change: opacity, transform;
  transition: none;
}

.fade-up.in-view {
  animation: fade-in-up 0.65s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.fade-left.in-view {
  animation: fade-in-left 0.65s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.fade-right.in-view {
  animation: fade-in-right 0.65s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.fade-in.in-view {
  animation: fade-in 0.65s ease forwards;
}

/* Stagger delays */
.stagger-1 { animation-delay: 0.05s; }
.stagger-2 { animation-delay: 0.15s; }
.stagger-3 { animation-delay: 0.25s; }
.stagger-4 { animation-delay: 0.35s; }
.stagger-5 { animation-delay: 0.45s; }

/* ---- SHIMMER GRADIENT (loading / decorative) ---- */
.shimmer-text {
  background: linear-gradient(
    90deg,
    var(--text-primary) 0%,
    var(--accent-primary) 40%,
    var(--accent-secondary) 60%,
    var(--text-primary) 100%
  );
  background-size: 200% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: shimmer 4s linear infinite;
}

/* ---- STAT COUNTER ANIMATION ---- */
.stat-number {
  animation: count-up 0.3s ease forwards;
}

/* ---- HOVER LIFT ---- */
.hover-lift {
  transition: transform var(--transition-bounce), box-shadow var(--transition-base);
}

.hover-lift:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg);
}

/* ---- BUTTON PULSE ---- */
@keyframes btn-pulse {
  0%, 100% { box-shadow: 0 4px 16px rgba(79, 124, 255, 0.3); }
  50% { box-shadow: 0 4px 30px rgba(79, 124, 255, 0.55); }
}

.btn-primary.pulse {
  animation: btn-pulse 2.5s ease-in-out infinite;
}

/* ---- SMOOTH PAGE TRANSITIONS ---- */
body {
  animation: fade-in 0.4s ease forwards;
}

/* ---- PARTICLES FADE ---- */
.hero-particles {
  opacity: 0.6;
  transition: opacity 1s ease;
}

/* ---- ACTIVE STATES ---- */
.feature-card,
.discipline-card,
.team-card,
.value-card,
.timeline-content {
  transition:
    transform 0.3s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.3s ease,
    border-color 0.3s ease,
    background 0.3s ease;
}
/* ENDFILE */