/* Nunky design system: shared components.
   Header, navigation, buttons, footer and reusable component corrections. */

/* Preserve hover while the pointer crosses the visual gap between a desktop
   navigation trigger and its dropdown. The dropdown itself remains above the
   bridge because it already has z-index: 50. */
@media (min-width: 1181px) and (hover: hover) and (pointer: fine) {
  .nav-dropdown::before {
    content: "";
    position: absolute;
    z-index: 49;
    top: 100%;
    left: -8px;
    right: -8px;
    height: 18px;
  }
}

/* =========================================================
   NUNKY — NAVEGACIÓN / USABILIDAD V3
   Fecha: 2026-09-08
   Alcance: interacción del header únicamente. No cambia contenido,
   rutas, breakpoints ni composición visual del menú.
========================================================= */

/* Amplía el área efectiva de clic de los enlaces de primer nivel sin
   modificar su caja de layout ni desplazar el subrayado/los textos. */
@media (min-width: 1181px) {
  .nav .nav-link {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }

  .nav .nav-link::before {
    content: "";
    position: absolute;
    top: -13px;
    bottom: -13px;
    left: 0;
    right: 0;
  }

  /* Blog es el único enlace superior cuyo texto puede quedar por debajo de
     44 px de ancho. Ampliamos solo su zona invisible hacia los lados. */
  .nav > a.nav-link::before {
    left: -7px;
    right: -7px;
  }

  /* Smart Company usa enlace + botón de flecha separados. El área extra
     crece hacia el espacio libre de la derecha, no encima del enlace. */
  .dropdown-arrow-button {
    position: relative;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }

  .dropdown-arrow-button::before {
    content: "";
    position: absolute;
    top: -3px;
    bottom: -3px;
    left: 0;
    right: -14px;
  }

  /* El teclado abre los desplegables de forma explícita con Enter/Espacio.
     Evitamos que solo recibir foco abra un megamenú automáticamente. Hover
     sigue funcionando exactamente como antes en ratón. */
  .nav-dropdown:not(.is-open):focus-within:not(:hover) > .dropdown-menu {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  .nav-dropdown:not(.is-open):focus-within:not(:hover) .dropdown-arrow {
    transform: none !important;
  }

  /* Objetivo de interacción mínimo para enlaces dentro de menús, sin
     aumentar innecesariamente el padding horizontal. */
  .dropdown-menu .dropdown-link,
  .dropdown-menu .product-mega-family > a,
  .dropdown-menu .service-mega-title,
  .dropdown-menu .services-mega-all {
    min-height: 44px;
  }

}

/* Indica con claridad el estado abierto en los desplegables móviles nativos. */
.mobile-dropdown[open] > summary .dropdown-arrow {
  transform: rotate(180deg);
}

.nav a,
.nav button,
.mobile-menu a,
.mobile-menu summary,
.header-actions a,
.menu-toggle {
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.footer-brand .footer-social-links{display:flex;flex-wrap:wrap;gap:1.4rem;margin-top:1rem}
.footer-brand .footer-social-links a{color:inherit;text-decoration:none;font-size:.95rem;font-weight:500}
.footer-brand .footer-social-links a:hover,.footer-brand .footer-social-links a:focus-visible{text-decoration:underline;text-underline-offset:.25em}

/* Cambios solicitados: equipo, navegacion y redes. */
#siteHeader .smart-company-nav-dropdown > .nav-parent-link,
#siteHeader .mobile-dropdown:first-child > summary,
.footer .smart-nav-accent { color:#00bcd4 !important; }
.footer-social-links a { display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px; }
.footer-social-links svg { width:25px;height:25px; }
.team-card-nunky .team-role { font-size:14px !important;line-height:1.4 !important;white-space:normal; }
