/* ========================================
   NORTH CONTABILIDADE E ASSESSORIA EMPRESARIAL - Animations
   ======================================== */

/* ── Fade In ── */
.fade-in,
.fade-in-left,
.fade-in-right,
.fade-in-up {
  opacity: 0;
  transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.fade-in { transform: translateY(30px); }
.fade-in-left { transform: translateX(-40px); }
.fade-in-right { transform: translateX(40px); }
.fade-in-up { transform: translateY(40px); }

.fade-in.visible,
.fade-in-left.visible,
.fade-in-right.visible,
.fade-in-up.visible {
  opacity: 1;
  transform: translate(0) scale(1);
}

/* Stagger delays */
.delay-1 { transition-delay: 0.1s; }
.delay-2 { transition-delay: 0.2s; }
.delay-3 { transition-delay: 0.3s; }
.delay-4 { transition-delay: 0.4s; }
.delay-5 { transition-delay: 0.5s; }
.delay-6 { transition-delay: 0.6s; }

/* ── Pulse ── */
@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.6; transform: scale(1.5); }
}

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

/* Float for centered elements */
@keyframes floatCenter {
  0%, 100% { transform: translateX(-50%) translateY(0px); }
  50% { transform: translateX(-50%) translateY(-12px); }
}

/* ── Bounce (scroll indicator) ── */
@keyframes bounce {
  0%, 20%, 50%, 80%, 100% { transform: translateX(-50%) translateY(0); }
  40% { transform: translateX(-50%) translateY(-10px); }
  60% { transform: translateX(-50%) translateY(-5px); }
}

/* ── Scroll Wheel ── */
@keyframes scrollWheel {
  0% { opacity: 1; transform: translateX(-50%) translateY(0); }
  100% { opacity: 0; transform: translateX(-50%) translateY(12px); }
}

/* ── Marquee ── */
@keyframes marqueeScroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ── Testimonial Carousel ── */
@keyframes testimonialScroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ── CTA Spin ── */
@keyframes ctaSpin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

.cta-spin {
  opacity: 0;
  transition: opacity 0.8s ease;
}

.cta-spin.visible {
  opacity: 1;
}

.cta-spin.visible .cta-image-circle::before {
  animation: ctaSpin 30s linear infinite;
}

/* ── Mobile Stats Carousel ── */
@media (max-width: 480px) {
  .hero-stats-mobile {
    display: flex;
    overflow: hidden;
    width: 100%;
  }

  .hero-stats-mobile .hero-stats-track {
    display: flex;
    animation: statsScroll 12s linear infinite;
  }

  @keyframes statsScroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
  }
}

/* ── Shimmer effect ── */
@keyframes shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

/* ── Scale In ── */
@keyframes scaleIn {
  from { transform: scale(0.9); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}

/* ── Slide Down (for FAQ answers) ── */
@keyframes slideDown {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: translateY(0); }
}

.faq-item.active .faq-answer-inner {
  animation: slideDown 0.3s ease forwards;
}

/* ── Hero stat counter glow ── */
.hero-stat-number.counted {
  text-shadow: 0 0 20px rgba(55, 71, 79, 0.15);
}
