/* Solo para móvil y tablet */
@media (max-width: 1024px) {

  /* Contenedor del menú hamburguesa */
  .wp-block-navigation__responsive-container {
      width: 100px;
      max-width: 80%;

      background-color: rgba(255, 255, 255, 0.7) !important; /* transparente solo móvil */
      backdrop-filter: blur(5px);
      box-shadow: 0 0 10px rgba(0,0,0,0.2);

      font-size: 0.9rem;
      padding: 10px;

      position: fixed;
      top: 50px;  /* Ajusta según tu header */
      right: 0 !important;
      left: auto !important;

      max-height: 250px; /* Ajustable a tu gusto */
      overflow-y: auto;

      z-index: 9999;
      transform: translateX(100%); /* oculto al inicio */
      transition: transform 0.3s ease-in-out;
  }

  /* Forzar que pseudo-elementos no tapen la transparencia */
  .wp-block-navigation__responsive-container::before,
  .wp-block-navigation__responsive-container::after {
      background: transparent !important;
  }

  /* Cuando está abierto */
  .wp-block-navigation__responsive-container.toggled {
      transform: translateX(0);
  }

  /* Ítems del menú */
  .wp-block-navigation__responsive-container .wp-block-navigation-item a {
      color: #000;
      background: transparent !important; /* solo palabras flotando */
      display: block;
      padding: 5px 0;
      text-decoration: none;
  }

  .wp-block-navigation__responsive-container .wp-block-navigation-item a:hover {
      color: #0073aa;
  }

}


  /* Forzar que ningún pseudo-elemento bloquee la transparencia */
  .wp-block-navigation__responsive-container::before,
  .wp-block-navigation__responsive-container::after {
      background: transparent !important;
  }

  /* Cuando está abierto */
  .wp-block-navigation__responsive-container.toggled {
      transform: translateX(0); /* se despliega desde el botón */
  }

  /* Ítems del menú */
  .wp-block-navigation__responsive-container .wp-block-navigation-item a {
      color: #000;
      background: transparent !important; /* sin contenedor sólido */
      display: block;
      padding: 5px 0;
      text-decoration: none;
  }

  .wp-block-navigation__responsive-container .wp-block-navigation-item a:hover {
      color: #0073aa;
  }
}