/* === CLÍNICA === */
.clinica {
  padding: 2rem 1rem;
  max-width: 100%;
}

.clinica-inner {
  display: flex;
  flex-wrap: nowrap;         /* mantém lado a lado em telas grandes */
  gap: 2rem;
  align-items: stretch;      /* força mesma altura entre imagem e texto */
}

.clinica-img {
  flex: 1;
  min-height: 100%;
}

.clinica-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;         /* imagem preenche a altura sem distorcer */
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.clinica-text {
  flex: 1;
  min-height: 100%;
  background: #fff;
  padding: 2rem;
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
  display: flex;
  flex-direction: column;
  justify-content: center;   /* centraliza verticalmente o texto */
}

.clinica-text h2 {
  color: #005b99;
  font-size: 1.6rem;
  margin-bottom: 0.5rem;
  border-left: 4px solid #005b99;
  padding-left: 0.6rem;
}

.clinica-text p {
  line-height: 1.7;
  margin-bottom: 1rem;
  color: #444;
  text-align: justify;       /* texto sempre justificado */
}

/* Forçar texto do banner à esquerda sem alterar o resto */
.banner-content .banner-text {
  left: 0 !important;
  right: auto !important;
  text-align: left !important;
  transform: translateY(-50%) !important;
}

/* === TABLETS (max-width: 1024px) === */
@media (max-width: 1024px) {
  .clinica-text h2 {
    font-size: 1.4rem;
  }
  .clinica-text p {
    font-size: 0.95rem;
  }
}

/* === SMARTPHONES (max-width: 768px) === */
@media (max-width: 768px) {
  .clinica-inner {
    flex-direction: column;  /* empilha no mobile */
  }
  .clinica-img img {
    height: auto;            /* volta ao tamanho natural */
    object-fit: contain;
  }
  .clinica-text {
    padding: 1.5rem;
  }
  .clinica-text h2 {
    font-size: 1.3rem;
  }
  .clinica-text p {
    font-size: 0.9rem;
  }
}

/* === SMARTPHONES PEQUENOS (max-width: 480px) === */
@media (max-width: 480px) {
  .clinica-text {
    padding: 1rem;
  }
  .clinica-text h2 {
    font-size: 1.1rem;
  }
  .clinica-text p {
    font-size: 0.85rem;
  }
}

/* === TELAS MUITO PEQUENAS (max-width: 360px) === */
@media (max-width: 360px) {
  .clinica-text h2 {
    font-size: 1rem;
  }
  .clinica-text p {
    font-size: 0.8rem;
  }
}
