/* ============================================================
   Mutirão de Desconto – Custom CSS
   (Complements Tailwind CSS play CDN)
   ============================================================ */

/* --- Base & Font --- */
html { scroll-behavior: smooth; }
body { font-family: 'Inter', sans-serif; }

/* ---- Navbar scroll effect ---- */
#navbar.scrolled {
  background: rgba(255,255,255,0.95) !important;
  backdrop-filter: blur(16px);
  box-shadow: 0 4px 24px rgba(0,0,0,.08);
  border-color: rgba(229,231,235,.6);
}

/* ---- Hero grid pattern ---- */
.hero-grid {
  background-image:
    linear-gradient(rgba(255,255,255,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px);
  background-size: 48px 48px;
}

/* ---- Counter animation ---- */
.counter { transition: all .4s; }

/* ---- Agenda cards hover ---- */
.agenda-card {
  transition: transform .3s cubic-bezier(.34,1.56,.64,1), box-shadow .3s;
}
.agenda-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 40px rgba(22,101,52,.15);
}

/* ---- WhatsApp float bounce ---- */
@keyframes wa-pulse {
  0%,100% { box-shadow: 0 0 0 0 rgba(34,197,94,.4); }
  50%      { box-shadow: 0 0 0 14px rgba(34,197,94,0); }
}
.wa-float { animation: wa-pulse 2.5s infinite; }

/* ---- Form inputs focus ring ---- */
input:focus, select:focus, textarea:focus {
  box-shadow: 0 0 0 3px rgba(22,163,74,.18);
}

/* ---- Button loading state ---- */
button:disabled { opacity: .65; cursor: not-allowed; }

/* ---- Smooth section entrances (AOS fallback) ---- */
[data-aos] { opacity: 0; transition: opacity .7s, transform .7s; }
[data-aos].aos-animate { opacity: 1; transform: none !important; }

/* ---- Underline decoration on headings ---- */
.heading-underline {
  background: linear-gradient(90deg,#16a34a,#d97706);
  height: 3px;
  border-radius: 999px;
  display: inline-block;
  margin-top: 6px;
}

/* ---- Stat bar progress ---- */
.progress-bar {
  transition: width 1.2s cubic-bezier(.34,1.56,.64,1);
}

/* ---- Service card ---- */
.service-card { transition: transform .25s, box-shadow .25s; }
.service-card:hover {
  transform: translateY(-4px) scale(1.02);
  box-shadow: 0 12px 24px rgba(0,0,0,.08);
}

/* ---- Step connector line ---- */
.step-connector {
  background: linear-gradient(90deg, #bbf7d0, #fcd34d, #bbf7d0);
  height: 2px;
  border-radius: 999px;
}

/* ---- Phone mask placeholder color ---- */
input[placeholder]::placeholder { color: #9ca3af; }

/* ---- Scrollbar (webkit) ---- */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: #94a3b8; border-radius: 999px; }
::-webkit-scrollbar-thumb:hover { background: #64748b; }

/* ---- Carrossel de eventos: oculta scrollbar ---- */
#carouselTrack::-webkit-scrollbar { display: none; }

/* ---- Admin sidebar active ---- */
.admin-nav-active {
  background: #15803d;
  color: #fff !important;
}

/* ---- Testimonial card quote ---- */
.testimonial-quote::before {
  content: '\201C';
  font-size: 4rem;
  line-height: 1;
  color: #bbf7d0;
  font-family: Georgia, serif;
  float: left;
  margin: -8px 8px 0 0;
}

/* ---- CTA section bg pattern ---- */
.cta-pattern {
  background-image: radial-gradient(circle at 20% 50%, rgba(245,158,11,.15) 0%, transparent 50%),
                    radial-gradient(circle at 80% 50%, rgba(16,185,129,.1) 0%, transparent 50%);
}

/* ---- Mobile menu animation ---- */
#mobileMenu {
  animation: slideDown .2s ease;
}
@keyframes slideDown {
  from { opacity:0; transform: translateY(-8px); }
  to   { opacity:1; transform: translateY(0); }
}

/* ---- Date button selected ---- */
.data-btn.selected,
.hora-btn.selected {
  background: #15803d;
  border-color: #15803d;
  color: #fff;
}
.data-btn.selected span { color: #fff !important; }

/* ============================================================
   INDEX PAGE – Enhanced Animations & Styles
   ============================================================ */

/* ---- Floating animation for SVG illustrations ---- */
@keyframes idxFloat {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-12px); }
}
.idx-float-slow {
  animation: idxFloat 5s ease-in-out infinite;
}

/* ---- Hero entrance animations ---- */
@keyframes idxFadeInUp {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes idxFadeInRight {
  from { opacity: 0; transform: translateX(40px); }
  to   { opacity: 1; transform: translateX(0); }
}
.idx-hero-text {
  animation: idxFadeInUp .8s ease-out both;
}
.idx-hero-form {
  animation: idxFadeInRight .8s ease-out .2s both;
}

/* ---- Gradient text shimmer (subtle) ---- */
@keyframes idxShimmer {
  0%   { background-position: -200% center; }
  100% { background-position: 200% center; }
}

/* ---- Evento card enhanced hover ---- */
.evento-card {
  transition: transform .35s cubic-bezier(.34,1.56,.64,1), box-shadow .35s;
}
.evento-card:hover {
  box-shadow: 0 16px 40px rgba(22,101,52,.12);
}

/* ---- Section wave dividers ---- */
.section-wave {
  display: block;
  width: 100%;
  height: auto;
}

/* ---- Dark agenda section search input ---- */
#agenda input[type="text"]::placeholder {
  color: rgba(156, 163, 175, 0.8);
}
#agenda input[type="text"]:focus {
  box-shadow: 0 0 0 3px rgba(34,197,94,.2);
}

/* ---- Stats bar counter pulse ---- */
@keyframes idxPulse {
  0%, 100% { opacity: 1; }
  50%      { opacity: .7; }
}

/* ---- Smooth gradient border glow for form ---- */
@keyframes idxGlow {
  0%, 100% { opacity: .6; }
  50%      { opacity: 1; }
}
.idx-hero-form .bg-white::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 66%;
  height: 2px;
  background: linear-gradient(90deg, transparent, #22c55e, transparent);
  animation: idxGlow 3s ease-in-out infinite;
}
