/* Hennigen & Martins — responsividade mobile (Android/iPhone · Chrome, Safari, Edge, Opera) */

/* Tablet e abaixo */
@media (max-width: 860px) {
  /* barra superior utilitária: centraliza e quebra linha */
  .topbar {
    flex-wrap: wrap;
    justify-content: center !important;
    gap: 4px 14px !important;
    text-align: center;
    line-height: 1.5;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }

  /* menu fixo: logo + WhatsApp na 1ª linha; links centralizados e quebrando abaixo
     (sem rolagem horizontal — todos os itens aparecem, nada de "Contato" cortado) */
  .navbar {
    flex-wrap: wrap !important;
    gap: 8px 12px;
    padding-top: 13px !important;
    padding-bottom: 13px !important;
  }
  .nav-links {
    order: 3;
    width: 100%;
    flex-wrap: wrap !important;
    justify-content: center !important;
    white-space: normal;
    gap: 9px 20px !important;
    font-size: 13.5px !important;
    padding-top: 4px;
  }

  /* todas as grades viram coluna única no celular */
  div[style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }
  /* feed do Instagram mantém 3 colunas (como o app) */
  .ig-grid[style*="grid-template-columns"] {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
  }

  /* imagens de coluna lateral: limita a altura quando empilhadas */
  div[style*="min-height:600px"],
  div[style*="min-height:560px"],
  div[style*="min-height:540px"],
  div[style*="min-height:520px"],
  div[style*="min-height:460px"] {
    min-height: 320px !important;
  }

  /* retratos das sócias um pouco menores */
  div[style*="height:420px"] { height: 360px !important; }
}

/* Barra superior — alinhamento no celular: grupos empilhados e centralizados */
@media (max-width: 600px) {
  .topbar {
    flex-direction: column !important;
    align-items: center !important;
    gap: 6px !important;
    text-align: center;
  }
  .topbar > div {
    justify-content: center !important;
    flex-wrap: wrap;
    gap: 4px 12px !important;
  }
  /* frases não quebram no meio da palavra */
  .topbar > div span { white-space: nowrap; }
  /* esconde o separador "•" do 1º grupo para não ficar solto ao quebrar */
  .topbar > div:first-child > span:nth-child(2) { display: none; }
}

/* Celular */
@media (max-width: 480px) {
  .nav-links { gap: 8px 16px !important; font-size: 13px !important; }
  .topbar { font-size: 11.5px !important; }
}