/* ===== NAV MÓVIL compartido (hamburguesa + menú desplegable) — carga DESPUÉS de los estilos de cada página para sobrescribir el .navlinks{display:none} viejo ===== */
header{position:sticky;top:0}
.nav-toggle{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1.5px solid rgba(120,116,100,.42);border-radius:11px;background:transparent;color:inherit;cursor:pointer;padding:0}
.nav-toggle svg{width:22px;height:22px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round}
.nav-toggle .x{display:none}
header.open .nav-toggle .bars{display:none}
header.open .nav-toggle .x{display:block}

/* mobile-first: navlinks = panel desplegable full-width, oculto salvo header.open */
.navlinks{display:flex;flex-direction:column;align-items:stretch;gap:2px;
  position:absolute;top:100%;left:0;right:0;background:var(--off);padding:8px 20px 22px;
  border-bottom:1px solid rgba(120,116,100,.28);box-shadow:0 26px 46px -24px rgba(15,4,4,.42);
  transform:translateY(-12px);opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease;z-index:70}
header.open .navlinks{transform:none;opacity:1;pointer-events:auto}
.navlinks a,.nav-drop-menu a,.nav-drop-t,.brand{text-decoration:none}
.navlinks a{padding:14px 6px;border-bottom:1px solid rgba(120,116,100,.16);font-size:1rem}
.navlinks a[hidden]{display:none}
.navlinks a.nav-cta{margin-top:14px;text-align:center;border-bottom:none;padding:15px;font-size:.92rem}

/* layout base del nav (garantiza brand | acciones) */
nav{display:flex;align-items:center;justify-content:space-between}

/* estado activo del link */
.navlinks a.on{color:var(--yellow)}

/* ===== DROPDOWN "Servicios" ===== */
/* mobile-first: acordeón dentro del panel */
.nav-drop-t{width:100%;display:flex;align-items:center;justify-content:space-between;gap:6px;
  background:none;border:none;cursor:pointer;color:inherit;font-family:var(--head);font-size:1rem;
  padding:14px 6px;border-bottom:1px solid rgba(120,116,100,.16)}
.nav-drop-t .chev{width:15px;height:15px;stroke:currentColor;stroke-width:2.2;fill:none;transition:transform .2s}
.nav-drop.open .nav-drop-t .chev{transform:rotate(180deg)}
.nav-drop-menu{display:none;flex-direction:column;background:rgba(120,116,100,.07);border-radius:8px;margin:4px 0 6px;padding:2px 0}
.nav-drop.open .nav-drop-menu{display:flex}
.nav-drop-menu a{padding:12px 22px;border-bottom:none;font-size:.94rem;color:var(--gray)}

@media(min-width:920px){
  .nav-toggle{display:none}
  .navlinks{position:static;flex-direction:row;align-items:center;gap:26px;font-size:.82rem;
    background:none;padding:0;border:none;box-shadow:none;transform:none;opacity:1;pointer-events:auto}
  .navlinks a{padding:0;border:none;font-size:inherit}
  .navlinks a.nav-cta{margin-top:0;padding:9px 16px;font-size:.78rem}
  /* dropdown en desktop: panel flotante en hover/focus */
  .nav-drop{position:relative}
  .nav-drop-t{width:auto;padding:0;border:none;font-size:.82rem;gap:5px}
  .nav-drop-t .chev{width:13px;height:13px}
  .nav-drop::after{content:"";position:absolute;top:100%;left:0;right:0;height:16px}
  .nav-drop-menu{position:absolute;top:calc(100% + 15px);left:-16px;min-width:236px;
    background:var(--off);border:1px solid rgba(120,116,100,.2);border-radius:12px;padding:8px;margin:0;
    box-shadow:0 26px 46px -22px rgba(15,4,4,.42);gap:2px;z-index:80;
    opacity:0;transform:translateY(-8px);pointer-events:none;transition:opacity .18s ease,transform .18s ease}
  .nav-drop:hover .nav-drop-menu,.nav-drop:focus-within .nav-drop-menu,.nav-drop.open .nav-drop-menu{display:flex;opacity:1;transform:none;pointer-events:auto}
  .nav-drop:hover .nav-drop-t .chev{transform:rotate(180deg)}
  .nav-drop-menu a{padding:11px 14px;border-radius:8px;font-size:.86rem;white-space:nowrap;color:var(--black)}
  .nav-drop-menu a:hover{background:rgba(229,255,53,.18);color:var(--black)}
}
