/* ==========================================================================
   SOLLUÇÃO ENERGIA - ESTILOS PRINCIPAIS
   ========================================================================== */

/* Suavização de fontes */
body { 
    -webkit-font-smoothing: antialiased; 
}

/* Fundo escurecido da imagem principal (Hero) */
.hero-gradient { 
    background: linear-gradient(to bottom, rgba(5,5,5,0.5) 0%, rgba(5,5,5,0.95) 100%); 
}

/* Efeito Vidro Claro (Calculadora) */
.glass-panel { 
    background: rgba(255, 255, 255, 0.95); 
    backdrop-filter: blur(16px); 
    border: 1px solid rgba(255,255,255,0.4); 
}

/* Efeito Vidro Escuro (Menu) */
.glass-dark { 
    background: rgba(18, 18, 18, 0.9); 
    backdrop-filter: blur(16px); 
    border: 1px solid rgba(255,255,255,0.05); 
}

/* Esconder barra de rolagem onde não é necessária */
.hide-scrollbar::-webkit-scrollbar { 
    display: none; 
}
.hide-scrollbar { 
    -ms-overflow-style: none; 
    scrollbar-width: none; 
}

/* ==========================================================================
   PERGUNTAS FREQUENTES (FAQ) - ANIMAÇÃO DE ABRIR/FECHAR
   ========================================================================== */
.faq-content { 
    max-height: 0; 
    overflow: hidden; 
    transition: max-height 0.4s ease; 
}

.faq-card.active .faq-content { 
    max-height: 500px; 
}

.faq-card.active .faq-icon { 
    transform: rotate(180deg); 
}

/* ==========================================================================
   BOTÃO WHATSAPP FLUTUANTE - ANIMAÇÃO DE PULSO
   ========================================================================== */
@keyframes pulse-ring { 
    0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7); } 
    70% { box-shadow: 0 0 0 20px rgba(37, 211, 102, 0); } 
    100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); } 
}

.btn-wpp-float { 
    animation: pulse-ring 2s infinite; 
}

/* ==========================================================================
   CARROSSEL DE DEPOIMENTOS (SWIPER)
   ========================================================================== */
.testimonials-swiper { 
    padding-bottom: 3rem !important; 
}

.swiper-pagination { 
    bottom: 0 !important; 
}

.swiper-pagination-bullet { 
    background-color: #d1d5db; 
    opacity: 1; 
    transition: all 0.3s; 
}

.swiper-pagination-bullet-active { 
    background-color: #FACC15 !important; 
    transform: scale(1.3); 
}

.swiper-slide { 
    height: auto; 
}

/* ==========================================================================
   LINHA DO TEMPO ANIMADA (COMO FUNCIONA)
   ========================================================================== */
.step-box { 
    transition: all 0.5s ease; 
}

.step-title { 
    transition: color 0.5s ease; 
}

.step-active .step-box { 
    background-color: #FACC15 !important; 
    color: #050505 !important; 
    transform: scale(1.05); 
    box-shadow: 0 10px 25px -5px rgba(250, 204, 21, 0.5) !important; 
    border-color: #FACC15 !important; 
}

.step-active .step-title { 
    color: #EAB308 !important; 
}