/* === ANIMAÇÕES — Bomber Mídia === */

/* Ícones do método — rotação única no hover */
.metodo-passo-icon {
  display: inline-block;
  transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.metodo-passo:hover .metodo-passo-icon {
  transform: rotate(360deg) scale(1.2);
}

/* WhatsApp — onda de luz */
.whatsapp-flutuante {
  animation: whatsapp-pulse 3s ease-in-out infinite;
}

@keyframes whatsapp-pulse {
  0%, 100% { box-shadow: 0 4px 16px rgba(37,211,102,0.4); }
  50%       { box-shadow: 0 4px 32px rgba(37,211,102,0.7), 0 0 0 8px rgba(37,211,102,0.1); }
}

@media (prefers-reduced-motion: reduce) {
  .whatsapp-flutuante { animation: none; }
}

/* Hero — brilho pulsante sutil no CTA */
.btn-primario.btn-grande {
  animation: cta-glow 3s ease-in-out infinite;
}

@keyframes cta-glow {
  0%, 100% { box-shadow: 0 8px 32px rgba(255,54,19,0.4); }
  50%       { box-shadow: 0 8px 48px rgba(255,54,19,0.7), 0 0 0 4px rgba(255,54,19,0.1); }
}

@media (prefers-reduced-motion: reduce) {
  .btn-primario.btn-grande { animation: none; }
}

/* Seção urgência — fundo laranja com pulso leve */
.secao-laranja {
  animation: urgencia-pulse 4s ease-in-out infinite;
}

@keyframes urgencia-pulse {
  0%, 100% { background-color: #FF3613; }
  50%       { background-color: #E02D0F; }
}

@media (prefers-reduced-motion: reduce) {
  .secao-laranja { animation: none; }
}

/* Entrada do formulário — cada passo */
.form-step.ativo {
  animation: fadeInUp 0.35s ease;
}

/* Underline laranja em links */
.nav-links a, .rodape-col a {
  position: relative;
}

.nav-links a::after, .rodape-col a::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 2px;
  background: var(--laranja);
  transition: width 0.25s ease;
}

.nav-links a:hover::after, .rodape-col a:hover::after {
  width: 100%;
}

/* Fade in up genérico */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Slide Down para popups */
@keyframes slideDown {
  from { transform: translateY(-60px); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}

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

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