/* ============================================================
   airos-nav2.css — Fase 452
   Menú de escritorio de las plantillas de vinoteca con el formato
   del de Equinobike: letra más grande y clara, links centrados,
   franja oscura a todo el ancho y zona de hover alta.
   SOLO estética (la plantilla pone class="airos-nav2" en el <nav>).
   Lo usan: landings/vinoteca y landings/lacuadra (y vinoteca-3d).
   Celular: el menú móvil ya es el mismo que el de Equinobike.
   ============================================================ */
@media (min-width: 1024px) {
  nav.airos-nav2 {
    position: relative;
    isolation: isolate;
    height: auto !important;
    min-height: 54px;
    justify-content: center !important;
    column-gap: 2.5rem;
    color: #f3f4f6;
  }
  /* Franja oscura a todo el ancho de la pantalla (detrás del contenido del menú) */
  nav.airos-nav2::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0; bottom: 0;
    left: 50%;
    width: 100vw;
    transform: translateX(-50%);
    background: color-mix(in srgb, var(--brand-dark, var(--bg-dark, #0B0E14)) 88%, #000);
    border-top: 1px solid var(--brand-border, var(--bg-border, rgba(255, 255, 255, .12)));
    pointer-events: none;
  }
  /* Separación pareja entre items (reemplaza los space-x-* de la plantilla) */
  nav.airos-nav2 > div { gap: 2rem; }
  nav.airos-nav2 > div > * { margin-left: 0 !important; }
  @media (min-width: 1280px) { nav.airos-nav2 > div { gap: 2.5rem; } }

  /* Los items principales: más grandes, más claros, sin letra espaciada */
  nav.airos-nav2 > div > a:not(.text-lg),
  nav.airos-nav2 > div > .has-mega-menu > a {
    font-size: 14px !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
    text-transform: uppercase;
    white-space: nowrap;
  }
  @media (min-width: 1280px) {
    nav.airos-nav2 > div > a:not(.text-lg),
    nav.airos-nav2 > div > .has-mega-menu > a { font-size: 15px !important; }
  }
  /* Zona de hover que ocupa toda la altura de la franja */
  nav.airos-nav2 .has-mega-menu { height: 54px !important; align-items: stretch; }
  nav.airos-nav2 .has-mega-menu > a { display: inline-flex; align-items: center; }
  /* Flechitas legibles (antes quedaban en gris oscuro) */
  nav.airos-nav2 .fa-chevron-down { color: currentColor !important; opacity: .85; font-size: 10px !important; }
  /* Íconos sociales un poco más claros */
  nav.airos-nav2 > div > a.text-lg { color: #cbd5e1; }
  nav.airos-nav2 > div > a.text-lg:hover { color: var(--brand-wine, #fff); }
}
