/* Responsivo exclusivo da página planos de saúde (até 768px) */

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

/* ---------- HERO ---------- */
.hero-saude {
  padding: 140px 16px 60px;
  min-height: 60vh;
  background-position: center;
  text-align: center;
}
.hero-saude h1 {
  font-size: 1.8rem;
  line-height: 1.2;
  margin-bottom: 12px;
}
.hero-saude p {
  font-size: 1rem;
  margin: 0 auto 20px;
  padding: 0 6px;
}

/* ---------- FEATURES GRID ---------- */
.features-grid {
  grid-template-columns: 1fr;
  gap: 16px;
  margin-top: 30px;
  padding: 0 12px;
}
.feature-card {
  padding: 18px 16px;
}
.feature-icon { font-size: 2rem; }
.feature-card h3 { font-size: 1.1rem; }

/* ---------- OPERADORAS ---------- */
.operadoras { padding: 40px 0; }
.operadoras-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 0 12px;
  max-width: 100%;
}
.operadora-item { padding: 12px 8px; }
.operadora-img { width: 90px; height: 50px; }

/* ---------- BENEFÍCIOS ---------- */
.benefits { padding: 40px 0; }
.benefits-grid {
  grid-template-columns: 1fr;
  gap: 16px;
  padding: 0 12px;
}
.benefit-item { padding: 20px 16px; }
.benefit-icon { font-size: 2rem; }

/* ---------- PLANOS (TIPOS) ---------- */
.plan-types-section { padding: 50px 0; }
.plan-types-section .section-title { margin-bottom: 30px; padding: 0 12px; }
.plan-types-section .section-title h2 { font-size: 1.5rem; }
.plan-types-section .section-title p { font-size: 0.95rem; }
.plan-types-grid { grid-template-columns: 1fr; gap: 20px; padding: 0 12px; }
.plan-type-card { padding: 22px 16px; }
.plan-icon i { font-size: 40px; }
.plan-content h3 { font-size: 1.1rem; }
.plan-features { margin: 18px 0; }
.plan-features li { font-size: 0.9rem; }

/* ---------- COMPARAÇÃO (TABELA) ---------- */
.plans-comparison { padding: 50px 0; }
.comparison-table {
  display: block;
  width: 100%;
  overflow-x: auto;
  border-collapse: collapse;
}
.comparison-table th,
.comparison-table td {
  padding: 10px;
  white-space: nowrap; /* Evita quebra descontrolada */
}
.comparison-table .feature-name { position: sticky; left: 0; }

/* ---------- REDE / MAPA ---------- */
.network-section { padding: 50px 0; }
.network-map { margin-top: 24px; padding: 0 12px; }
.network-map img { width: 100%; height: auto; }

/* ---------- DEPOIMENTOS ---------- */
.testimonials-section { padding: 50px 0; }
.testimonials-grid { grid-template-columns: 1fr; gap: 16px; padding: 0 12px; }
.testimonial-card { padding: 20px 16px; }

/* ---------- FAQ ---------- */
.faq-section { padding: 50px 0; }
.faq-item { margin: 0 12px 12px; }
.faq-question { padding: 14px; }
.faq-answer { padding: 0 14px; }
.faq-item.active .faq-answer { padding: 14px; }

/* ---------- CTA ---------- */
.cta-section { padding: 60px 16px; }

/* ---------- TIPOGRAFIA E BOTÕES ---------- */
.btn,
.btn-gold,
.btn-orange,
.btn-white,
.btn-outline {
  font-size: 0.95rem;
  padding: 12px 18px;
  width: 100%;
  max-width: 320px;
}

/* ---------- ESPAÇAMENTOS GERAIS ---------- */
.section-title { padding: 0 12px; }
.container { padding-left: 12px; padding-right: 12px; }

/* ---------- BREAKPOINTS MENORES ---------- */
@media (max-width: 576px) {
  .hero-saude { padding: 120px 14px 50px; min-height: 55vh; }
  .hero-saude h1 { font-size: 1.6rem; }
  .hero-saude p { font-size: 0.95rem; }
  .operadoras-grid { gap: 10px; }
  .plan-type-card { padding: 20px 14px; }
}

@media (max-width: 480px) {
  .operadoras-grid { grid-template-columns: 1fr 1fr; }
  .operadora-img { width: 80px; height: 45px; }
  .feature-card { padding: 16px 12px; }
  .plan-features li { font-size: 0.85rem; }
}
