/* estilo padrão (mobile first) */
.menu-toggle {
  display: block; /* aparece no celular */
  font-size: 1.5rem;
  background: none;
  border: none;
  cursor: pointer;
  color: #f4d58d;
  padding: 0.2rem;
}

.navbar {
  display: none; /* começa escondido no celular */
  flex-direction: column;
}

.navbar.active {
  display: flex; 
  height: auto;/* aparece quando clica no botão */
}

/* telas grandes (desktop) */
@media (min-width: 769px) {
  .menu-toggle {
    display: none; /* esconde o hamburguer no desktop */
  }

  .navbar {
    display: flex !important; /* sempre visível no desktop */
    flex-direction: row;
    gap: 1rem;
    height: auto;
  }
}