/* ============================================
   ATAMAP ASSOCIATES — Animations
   ============================================ */

/* ---- Animated Gradient Background ---- */
.hero-gradient {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

.hero-gradient::before,
.hero-gradient::after {
  content: '';
  position: absolute;
  inset: -50%;
  background:
    radial-gradient(ellipse 600px 600px at 20% 40%, rgba(200, 164, 92, 0.06) 0%, transparent 70%),
    radial-gradient(ellipse 800px 800px at 80% 60%, rgba(36, 48, 73, 0.8) 0%, transparent 60%),
    radial-gradient(ellipse 500px 500px at 50% 20%, rgba(26, 34, 52, 0.9) 0%, transparent 50%);
  animation: gradient-shift var(--duration-gradient) ease-in-out infinite;
}

.hero-gradient::after {
  background:
    radial-gradient(ellipse 700px 700px at 70% 30%, rgba(200, 164, 92, 0.04) 0%, transparent 60%),
    radial-gradient(ellipse 600px 600px at 30% 70%, rgba(55, 65, 81, 0.6) 0%, transparent 50%),
    radial-gradient(ellipse 400px 400px at 60% 80%, rgba(26, 34, 52, 0.7) 0%, transparent 60%);
  animation: gradient-shift-reverse calc(var(--duration-gradient) * 1.3) ease-in-out infinite;
}

@keyframes gradient-shift {
  0%   { transform: translate(0%, 0%) rotate(0deg) scale(1); }
  25%  { transform: translate(-5%, 3%) rotate(2deg) scale(1.02); }
  50%  { transform: translate(3%, -4%) rotate(-1deg) scale(0.98); }
  75%  { transform: translate(-3%, -2%) rotate(1deg) scale(1.01); }
  100% { transform: translate(0%, 0%) rotate(0deg) scale(1); }
}

@keyframes gradient-shift-reverse {
  0%   { transform: translate(0%, 0%) rotate(0deg) scale(1); }
  25%  { transform: translate(4%, -3%) rotate(-2deg) scale(0.99); }
  50%  { transform: translate(-3%, 5%) rotate(1deg) scale(1.02); }
  75%  { transform: translate(2%, -4%) rotate(-1deg) scale(0.98); }
  100% { transform: translate(0%, 0%) rotate(0deg) scale(1); }
}

/* ---- Scroll Reveal ---- */
.reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity var(--duration-slow) var(--ease-spring-1),
              transform var(--duration-slow) var(--ease-spring-1);
}

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

/* Stagger children */
.reveal-stagger > * {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity var(--duration-slow) var(--ease-spring-1),
              transform var(--duration-slow) var(--ease-spring-1);
}

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

.reveal-stagger.is-visible > *:nth-child(1) { transition-delay: 0ms; }
.reveal-stagger.is-visible > *:nth-child(2) { transition-delay: 50ms; }
.reveal-stagger.is-visible > *:nth-child(3) { transition-delay: 100ms; }
.reveal-stagger.is-visible > *:nth-child(4) { transition-delay: 150ms; }
.reveal-stagger.is-visible > *:nth-child(5) { transition-delay: 200ms; }
.reveal-stagger.is-visible > *:nth-child(6) { transition-delay: 250ms; }
.reveal-stagger.is-visible > *:nth-child(7) { transition-delay: 300ms; }
.reveal-stagger.is-visible > *:nth-child(8) { transition-delay: 350ms; }
.reveal-stagger.is-visible > *:nth-child(9) { transition-delay: 400ms; }

/* ---- Fade + Slide In (mobile nav) ---- */
@keyframes fadeSlideIn {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ---- Subtle Pulse (for accent elements) ---- */
@keyframes subtle-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.7; }
}

/* ---- Reduced Motion ---- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .reveal {
    opacity: 1;
    transform: none;
  }

  .reveal-stagger > * {
    opacity: 1;
    transform: none;
  }

  .hero-gradient::before,
  .hero-gradient::after {
    animation: none;
  }
}

/* ---- Page-specific Animations ---- */

/* Hero content entrance */
.hero-content {
  animation: heroEntrance 800ms var(--ease-out-smooth) 200ms both;
}

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

/* Trust bar stat counter feel */
.trust-bar__stat-value {
  animation: fadeIn 600ms var(--ease-spring-settle) both;
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* Card hover spring */
.card {
  will-change: transform;
}

/* Button spring press feedback */
.btn {
  will-change: transform;
}