/* Estilos responsivos para Seguro Residencial (até 768px) */

/* Ajuste para o conteúdo não ficar atrás do header fixo */
body {
    padding-top: 70px !important;
}

/* Ajuste para o hero não ficar atrás do header */
.hero-residencial {
    padding-top: 80px !important;
    margin-top: 0 !important;
    min-height: 60vh !important;
    padding: 20px 16px 60px !important;
    background-position: center !important;
}

/* ---------- HERO ---------- */
.hero-residencial h1 {
    font-size: 1.8rem !important;
    line-height: 1.2;
    margin-bottom: 12px !important;
}

.hero-residencial p {
    font-size: 1rem !important;
    margin: 0 auto 20px !important;
    padding: 0 6px;
}

/* ---------- FORMULÁRIO DE COTAÇÃO ---------- */
.quote-section {
    padding: 40px 15px !important;
}

.quote-form {
    padding: 20px !important;
    margin: 0 !important;
    width: 100% !important;
}

.form-group {
    margin-bottom: 15px;
    width: 100% !important;
}

.form-group input,
.form-group select {
    width: 100% !important;
    padding: 12px 15px !important;
    font-size: 0.9rem !important;
}

/* ---------- BENEFÍCIOS ---------- */
.benefits-grid {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    padding: 0 15px !important;
}

.benefit-card {
    padding: 20px !important;
    margin: 0 !important;
}

/* ---------- COBERTURAS ---------- */
.coverage-grid {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    padding: 0 15px !important;
}

.coverage-card {
    padding: 20px !important;
    margin: 0 !important;
}

/* ---------- PROTEÇÃO ---------- */
.protection-steps {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    padding: 0 15px !important;
}

.step-card {
    padding: 20px !important;
    margin: 0 !important;
}

/* ---------- DEPOIMENTOS ---------- */
.testimonials-slider {
    padding: 0 15px !important;
}

.testimonial-card {
    padding: 20px !important;
    margin: 0 10px !important;
}

/* ---------- FAQ ---------- */
.faq-container {
    padding: 0 15px !important;
}

.faq-item {
    margin-bottom: 15px !important;
}

.faq-question {
    padding: 15px !important;
    font-size: 1rem !important;
}

.faq-answer {
    padding: 0 15px 15px !important;
}

/* ---------- CTA ---------- */
.cta-section {
    padding: 40px 15px !important;
    text-align: center;
}

.cta-content h2 {
    font-size: 1.5rem !important;
    margin-bottom: 15px !important;
}

.cta-buttons {
    flex-direction: column;
    gap: 15px;
}

.cta-button {
    width: 100% !important;
    margin: 0 !important;
    text-align: center;
}

/* Ajustes gerais para telas pequenas */
@media (max-width: 480px) {
    .hero-residencial h1 {
        font-size: 1.6rem !important;
    }
    
    .section-title h2 {
        font-size: 1.5rem !important;
    }
    
    .btn {
        width: 100% !important;
        margin: 5px 0 !important;
    }
}