/* ARCHIVO GENERADO por scripts/blindar-css.mjs desde preview/home/assets/css/cabecera.css.
   No editar aquí: editar el preview y volver a generar. La primera clase de cada
   selector va duplicada a propósito para ganar al kit de Elementor. */

/* =========================================================================
   Cabecera — Grupo Dov
   =========================================================================

   Se diseña con el home y sale a todo el sitio en la etapa 2 del roadmap,
   enganchada a `astra_header` desde el child theme (sin el constructor de
   Astra). Usa solo tokens de base.css.

   Va en AZUL MARINO: el logotipo existe en versión blanca, pensado para fondo
   oscuro, y la guía de marca dice «la marca es azul marino primero».

   Escritorio (≥1080px): menú en línea con desplegable de productos.
   Móvil: botón de menú que abre un panel a pantalla completa.
   ========================================================================= */

.gd-cabecera.gd-cabecera {
  position: sticky;
  top: 0;
  z-index: 50;
  background: var(--gd-marino);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  font-family: var(--gd-fuente-titular);
}

.gd-cabecera__barra.gd-cabecera__barra {
  display: flex;
  align-items: center;
  gap: var(--gd-e-6);
  min-height: 76px;
}

.gd-cabecera__logo.gd-cabecera__logo { display: block; flex: none; line-height: 0; }
.gd-cabecera__logo.gd-cabecera__logo img { width: 156px; height: auto; }

/* ---- Navegación de escritorio -------------------------------------- */

.gd-nav.gd-nav { margin-left: auto; }

.gd-nav__lista.gd-nav__lista {
  display: flex;
  align-items: center;
  gap: var(--gd-e-2);
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Astra da estilo a TODOS los <button> del sitio (mayúsculas, relleno de
   15 px 45 px, line-height fijo). Los dos botones de la cabecera lo anulan. */
.gd-nav__enlace.gd-nav__enlace,
.gd-cabecera__menu.gd-cabecera__menu {
  text-transform: none;
  letter-spacing: normal;
  line-height: 1.2;
  box-shadow: none;
}

.gd-nav__enlace.gd-nav__enlace {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: var(--gd-e-3) var(--gd-e-3);
  font-size: var(--gd-t-menor);
  font-weight: 600;
  color: var(--gd-acero-200);
  text-decoration: none;
  background: none;
  border: 0;
  cursor: pointer;
  font-family: inherit;
  transition: color var(--gd-transicion);
}
.gd-nav__enlace.gd-nav__enlace::after {               /* subrayado mecanizado al pasar */
  content: "";
  position: absolute;
  left: var(--gd-e-3);
  right: var(--gd-e-3);
  bottom: 4px;
  height: 2px;
  background: var(--gd-amarillo);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--gd-transicion);
}
.gd-nav__enlace.gd-nav__enlace:hover,
.gd-nav__enlace.gd-nav__enlace[aria-expanded="true"] { color: var(--gd-blanco); }
.gd-nav__enlace.gd-nav__enlace:hover::after,
.gd-nav__enlace.gd-nav__enlace[aria-expanded="true"]::after { transform: scaleX(1); }

.gd-nav__flecha.gd-nav__flecha { width: 12px; height: 12px; transition: transform var(--gd-transicion); }
.gd-nav__enlace.gd-nav__enlace[aria-expanded="true"] .gd-nav__flecha { transform: rotate(180deg); }

.gd-cabecera__cta.gd-cabecera__cta { flex: none; }
.gd-cabecera__cta.gd-cabecera__cta svg { width: 18px; height: 18px; }

/* ---- Desplegable de productos -------------------------------------- */

.gd-nav__item--productos.gd-nav__item--productos { position: static; }

.gd-desplegable.gd-desplegable {
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  background: var(--gd-blanco);
  border-bottom: 1px solid var(--gd-acero-200);
  box-shadow: var(--gd-sombra-elevada);
  font-family: var(--gd-fuente-texto);
}
.gd-desplegable.gd-desplegable[hidden] { display: none; }

.gd-desplegable__rejilla.gd-desplegable__rejilla {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: var(--gd-e-7);
  padding-block: var(--gd-e-6);
}

.gd-desplegable__categorias.gd-desplegable__categorias {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--gd-e-2);
  margin: 0;
  padding: 0;
  list-style: none;
}

.gd-desplegable__categoria.gd-desplegable__categoria {
  display: block;
  padding: var(--gd-e-4);
  border: 1px solid transparent;
  border-radius: var(--gd-radio-sm);
  text-decoration: none;
  transition: border-color var(--gd-transicion), background var(--gd-transicion);
}
.gd-desplegable__categoria.gd-desplegable__categoria:hover {
  border-color: var(--gd-acero-200);
  background: var(--gd-acero-50);
}
.gd-desplegable__nombre.gd-desplegable__nombre {
  display: block;
  font-family: var(--gd-fuente-titular);
  font-weight: 700;
  font-size: var(--gd-t-menor);
  color: var(--gd-marino);
}
.gd-desplegable__desc.gd-desplegable__desc {
  display: block;
  margin-top: 2px;
  font-size: var(--gd-t-micro);
  line-height: 1.45;
  color: var(--gd-texto-suave);
}

.gd-desplegable__lateral.gd-desplegable__lateral {
  padding-left: var(--gd-e-6);
  border-left: 1px solid var(--gd-acero-200);
}
.gd-desplegable__lateral.gd-desplegable__lateral ul { margin: 0 0 var(--gd-e-5); padding: 0; list-style: none; }
.gd-desplegable__lateral.gd-desplegable__lateral li a {
  display: block;
  padding-block: 6px;
  font-size: var(--gd-t-menor);
  color: var(--gd-texto);
  text-decoration: none;
}
.gd-desplegable__lateral.gd-desplegable__lateral li a:hover { color: var(--gd-enlace); }
.gd-desplegable__todo.gd-desplegable__todo {
  font-family: var(--gd-fuente-titular);
  font-weight: 700;
  font-size: var(--gd-t-menor);
  color: var(--gd-enlace);
  text-decoration: none;
}
.gd-desplegable__todo.gd-desplegable__todo:hover { color: var(--gd-enlace-hover); }

/* ---- Botón de menú (móvil) ----------------------------------------- */

.gd-cabecera__menu.gd-cabecera__menu {
  display: none;
  padding: 0;
  margin-left: auto;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  background: none;
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: var(--gd-radio-sm);
  color: var(--gd-blanco);
  cursor: pointer;
}
.gd-cabecera__menu.gd-cabecera__menu svg { width: 22px; height: 22px; }
.gd-cabecera__icono-cerrar.gd-cabecera__icono-cerrar,
.gd-cabecera__menu.gd-cabecera__menu[aria-expanded="true"] .gd-cabecera__icono-abrir { display: none; }
.gd-cabecera__menu.gd-cabecera__menu[aria-expanded="true"] .gd-cabecera__icono-cerrar { display: block; }

.gd-cabecera.gd-cabecera :focus-visible { outline: 3px solid var(--gd-amarillo); outline-offset: 2px; }
.gd-desplegable.gd-desplegable :focus-visible { outline-color: var(--gd-enlace); }

/* ---- Móvil y tableta ----------------------------------------------- */

@media (max-width: 1079px) {
  .gd-cabecera__barra.gd-cabecera__barra { min-height: 64px; gap: var(--gd-e-4); }
  .gd-cabecera__logo.gd-cabecera__logo img { width: 128px; }
  .gd-cabecera__menu.gd-cabecera__menu { display: inline-flex; }
  .gd-cabecera__cta.gd-cabecera__cta { display: none; }

  .gd-nav.gd-nav {
    position: fixed;
    inset: 64px 0 0 0;
    margin: 0;
    padding: var(--gd-e-5) var(--gd-e-5) var(--gd-e-7);
    background: var(--gd-marino);
    overflow-y: auto;
  }
  .gd-nav.gd-nav[hidden] { display: none; }
  .gd-nav__lista.gd-nav__lista { flex-direction: column; align-items: stretch; gap: 0; }
  .gd-nav__lista.gd-nav__lista > li { border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
  .gd-nav__enlace.gd-nav__enlace {
    width: 100%;
    justify-content: space-between;
    padding: var(--gd-e-4) 0;
    font-size: var(--gd-t-h4);
    color: var(--gd-blanco);
  }
  .gd-nav__enlace.gd-nav__enlace::after { display: none; }

  .gd-desplegable.gd-desplegable {
    position: static;
    background: none;
    border: 0;
    box-shadow: none;
  }
  .gd-desplegable.gd-desplegable .gd-contenedor { padding-inline: 0; }
  .gd-desplegable__rejilla.gd-desplegable__rejilla { grid-template-columns: 1fr; gap: var(--gd-e-4); padding-block: 0 var(--gd-e-4); }
  .gd-desplegable__categorias.gd-desplegable__categorias { grid-template-columns: 1fr; gap: 0; }
  .gd-desplegable__categoria.gd-desplegable__categoria { padding: var(--gd-e-3) 0; }
  .gd-desplegable__categoria.gd-desplegable__categoria:hover { background: none; border-color: transparent; }
  .gd-desplegable__nombre.gd-desplegable__nombre { color: var(--gd-blanco); font-weight: 600; }
  .gd-desplegable__desc.gd-desplegable__desc { display: none; }
  .gd-desplegable__lateral.gd-desplegable__lateral { padding-left: 0; border-left: 0; }
  .gd-desplegable__lateral.gd-desplegable__lateral .gd-antetitulo { color: var(--gd-acero-300); }
  .gd-desplegable__lateral.gd-desplegable__lateral li a { color: var(--gd-acero-200); }
  .gd-desplegable__todo.gd-desplegable__todo { color: var(--gd-amarillo); }

  .gd-nav__cta-movil.gd-nav__cta-movil { display: flex; margin-top: var(--gd-e-6); }
  .gd-nav__cta-movil.gd-nav__cta-movil .gd-boton { width: 100%; padding-block: var(--gd-e-4); }
}

@media (min-width: 1080px) {
  .gd-nav.gd-nav[hidden] { display: block; }   /* en escritorio el menú siempre se ve */
  .gd-nav__cta-movil.gd-nav__cta-movil { display: none; }
}

/* ---- WhatsApp flotante ---------------------------------------------
   Regla de Clientes: WhatsApp es botón flotante global, no el CTA principal.
   El verde es el de WhatsApp, no un color de marca: es la señal que el
   usuario reconoce. */

.gd-whatsapp.gd-whatsapp {
  position: fixed;
  right: var(--gd-e-5);
  bottom: var(--gd-e-5);
  z-index: 60;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #25D366;
  color: #0B3D20;
  box-shadow: var(--gd-sombra-elevada);
  transition: transform var(--gd-transicion);
}
.gd-whatsapp.gd-whatsapp:hover { transform: scale(1.06); }
.gd-whatsapp.gd-whatsapp svg { width: 30px; height: 30px; }
.gd-whatsapp.gd-whatsapp:focus-visible { outline: 3px solid var(--gd-marino); outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
  .gd-nav__enlace.gd-nav__enlace::after, .gd-nav__flecha.gd-nav__flecha, .gd-whatsapp.gd-whatsapp { transition: none; }
}