/* --- Efecto de slide para los submenús --- */
.menu-sub {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  visibility: hidden;
  transition:
    max-height 0.3s ease,
    opacity 0.25s ease,
    visibility 0s linear 0.3s; /* visibilidad se oculta después de animar */
}

/* Cuando el padre tiene .open */
.menu-item.open > .menu-sub {
  max-height: 600px; /* valor mayor a la altura real */
  opacity: 1;
  visibility: visible;
  transition:
    max-height 0.3s ease,
    opacity 0.25s ease;
}