/* ═══════════════════════════════════════════════════════════
   HIDECA — CSS compartido
   Contiene únicamente la navegación: barra superior, menús
   desplegables, menú móvil y logo. Es idéntico en las 35
   páginas del sitio, por eso se centraliza acá.

   PARA CAMBIAR LOS COLORES DEL MENÚ, editar las variables
   de abajo. El cambio impacta en todo el sitio.
═══════════════════════════════════════════════════════════ */

:root{
  --nav-txt:        rgba(255,255,255,.72);  /* enlaces del menú */
  --nav-txt-hover:  #ffffff;                /* al pasar el mouse */
  --nav-activo:     #00B4D8;                /* ítem de la página actual */
  --nav-logo-sub:   rgba(255,255,255,.45);  /* bajada del logo */

  /* Panel desplegable en escritorio */
  --drop-fondo:     #ffffff;
  --drop-txt:       #0D0D0D;
  --drop-hover:     #F2F2F0;
}

html{scroll-behavior:smooth;}
body{font-family:'DM Sans',sans-serif;background:#fff;color:#0D0D0D;overflow-x:hidden;}
.logo-name{font-family:'Barlow Condensed',sans-serif;font-weight:900;font-size:24px;color:#fff;letter-spacing:5px;line-height:1;}
.logo-sub{font-size:9px;letter-spacing:5px;text-transform:uppercase;color:var(--nav-logo-sub);font-weight:300;}
.nav-links{display:flex;gap:clamp(20px,3vw,40px);list-style:none;}
.nav-links a{font-size:10px;letter-spacing:2.5px;text-transform:uppercase;color:var(--nav-txt);text-decoration:none;cursor:pointer;transition:color .2s;}
.nav-links a:hover{color:var(--nav-txt-hover);}
.nav-links a.active,.drop-btn.active{color:var(--nav-activo);}
/* ═══════════════════════════════════════
   MENÚS DESPLEGABLES (click)
═══════════════════════════════════════ */
.nav-links{align-items:center;}
.nav-links > li{display:flex;align-items:center;}
.nav-links > li > a{display:flex;align-items:center;line-height:1;}
.drop-btn{line-height:1;}
.has-drop{position:relative;}
.drop-btn{
  display:flex;align-items:center;gap:6px;
  font-family:'DM Sans',sans-serif;
  font-size:10px;letter-spacing:2.5px;text-transform:uppercase;
  color:var(--nav-txt);
  background:none;border:0;padding:0;cursor:pointer;
  transition:color .2s;
}
.drop-btn:hover{color:var(--nav-txt-hover);}
.drop-btn[aria-expanded="true"]{color:var(--nav-activo);}
.drop-btn .caret{
  width:9px;height:9px;fill:none;stroke:#fff;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round;
  transition:transform .2s;flex-shrink:0;
}
.drop-btn[aria-expanded="true"] .caret{transform:rotate(180deg);}
.dropdown{
  position:absolute;top:calc(100% + 16px);left:-16px;
  min-width:250px;
  background:var(--drop-fondo);
  padding:8px 0;
  box-shadow:0 12px 40px -8px rgba(0,0,0,.45);
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .18s ease,transform .18s ease,visibility .18s;
  z-index:120;
}
.has-drop.open .dropdown{opacity:1;visibility:visible;transform:none;}
.dropdown a{
  display:block;
  padding:11px 22px;
  font-size:13px;letter-spacing:.2px;text-transform:none;
  color:var(--drop-txt);text-decoration:none;
  transition:background .15s,padding-left .15s;
  white-space:nowrap;
}
.dropdown a:hover,.dropdown a:focus-visible{
  background:var(--drop-hover);padding-left:27px;color:#000;outline:none;
}
.drop-btn:focus-visible{outline:1px solid var(--green);outline-offset:4px;}
@media(max-width:900px){
  .nav-links{display:none;}
}
@media(prefers-reduced-motion:reduce){
  .dropdown,.drop-btn .caret{transition:none;}
}
/* ═══════════════════════════════════════
   MENÚ MÓVIL
═══════════════════════════════════════ */
.nav-toggle{
  display:none;flex-direction:column;gap:5px;
  background:none;border:0;padding:8px;cursor:pointer;margin-left:4px;
}
.nav-toggle span{display:block;width:22px;height:1.5px;background:#fff;transition:transform .25s,opacity .2s;}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6.5px) rotate(45deg);}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg);}
@media(max-width:900px){
  .nav-toggle{display:flex;}
  .nav-links{
    display:block;
    position:fixed;top:69px;left:0;right:0;
    max-height:calc(100dvh - 69px);overflow-y:auto;
    background:#06090C;
    border-top:.5px solid rgba(255,255,255,.08);
    padding:8px 0 28px;
    transform:translateY(-8px);opacity:0;visibility:hidden;
    transition:opacity .22s ease,transform .22s ease,visibility .22s;
    z-index:99;
  }
  .nav-links.open{opacity:1;visibility:visible;transform:none;}
  .nav-links > li{display:block;border-bottom:.5px solid rgba(255,255,255,.05);}
  .nav-links > li > a,.drop-btn{
    width:100%;padding:16px var(--pad);font-size:12px;letter-spacing:2px;
    justify-content:space-between;
  }
  .dropdown{
    position:static;opacity:1;visibility:visible;transform:none;
    display:none;min-width:0;box-shadow:none;
    background:#0D1117;padding:4px 0 10px;
  }
  .has-drop.open .dropdown{display:block;}
  .dropdown a{color:rgba(255,255,255,.62);padding:12px var(--pad) 12px calc(var(--pad) + 14px);font-size:13px;}
  .dropdown a:hover,.dropdown a:focus-visible{background:rgba(255,255,255,.05);color:#fff;padding-left:calc(var(--pad) + 20px);}
  .nav-social{display:flex;}
  .nav-cta{display:none;}
}
@media(max-width:520px){
  .nav-social{display:none;}
}