/* Ajuste da grid no mobile */
@media (max-width: 768px) {
  .menu {
    display: none;
  }

  .hero {
    text-align: center;
    padding: 5rem 0;
  }

  p {
    margin-left: auto;
    margin-right: auto;
  }

  /* GRID do formulário e info passa para 1 coluna */
  .contato-grid {
    grid-template-columns: 1fr;
    gap: 2rem; /* reduz o gap para ficar mais agradável no mobile */
  }

  .contato-form, 
  .contato-info {
    width: 100%; /* garante que cada bloco ocupe a largura total */
  }
}