/* =====================================================
   CTA.CSS
   Seção "Manda mensagem e a quadra é sua"
   ===================================================== */

.cta {
  background-color: var(--color-green);
  padding: 80px 0;
}

.cta__title {
  color: var(--color-white);
  font-size: clamp(2rem, 4.5vw, 3.2rem);
  margin-bottom: 24px;
}

.cta__text {
  font-family: var(--font-body);
  color: rgba(255, 255, 255, 0.9);
  font-size: 1rem;
  max-width: 480px;
  margin-bottom: 32px;
}

.cta__buttons {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

/* Pulso sutil e contínuo só no botão de WhatsApp (o CTA principal
   do site)*/
.cta__buttons .btn--bright {
  animation: ctaWhatsappPulse 2.6s ease-in-out infinite;
}

.cta__buttons .btn--bright:hover {
  animation-play-state: paused;
}

@keyframes ctaWhatsappPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.35); }
  50%      { box-shadow: 0 0 0 12px rgba(255, 255, 255, 0); }
}