/* nav.css — cabecera unificada de toda la web Aquoric (la inyecta nav.js). */
.aqn{
  position:sticky; top:0; z-index:1000; display:flex; align-items:center; justify-content:space-between;
  gap:14px; height:var(--aqn-height); flex-shrink:0; padding:0 clamp(14px,3vw,28px);
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:var(--aqn-bg); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid var(--aqn-border);
}
:root{ --aqn-height:64px; --aqn-bg:rgba(247,248,246,0.88); --aqn-fg:#5C6873; --aqn-fg-hover:#1E2A36; --aqn-hover:rgba(30,107,122,0.08); --aqn-border:#D9E1DC; --aqn-accent:#1E6B7A; }
[data-theme="dark"]{ --aqn-bg:rgba(18,24,31,0.88); --aqn-fg:rgba(232,236,233,0.68); --aqn-fg-hover:#E8ECE9; --aqn-hover:rgba(43,138,153,0.14); --aqn-border:rgba(255,255,255,0.10); --aqn-accent:#2B8A99; }

.aqn-brand{ display:flex; align-items:center; flex-shrink:0; }
.aqn-logo, .aqn-brand img{ height:27px; width:auto; display:block; transition:filter .2s ease, opacity .2s ease; }
[data-theme="dark"] .aqn-logo{ filter:brightness(0) invert(1); }

.aqn-links{ display:flex; align-items:center; gap:2px; }
.aqn-links a{
  color:var(--aqn-fg); font-size:0.86rem; font-weight:500; text-decoration:none;
  padding:8px 11px; border-radius:8px; transition:color .15s, background .15s, transform .15s; white-space:nowrap;
}
.aqn-links a:hover{ color:var(--aqn-fg-hover); background:var(--aqn-hover); transform:translateY(-1px); }
.aqn-links a.active{ color:#fff; background:var(--aqn-accent); }

.aqn-tools{ display:flex; align-items:center; gap:6px; flex-shrink:0; }
/* Botones de idioma: píldoras individuales (mismo estilo que .lang-btn en etapas) */
.aqn-lang{ display:inline-flex; gap:4px; }
.aqn-lang button{ background:var(--aqn-bg2,rgba(238,241,237,0.9)); color:var(--aqn-fg); border:1px solid var(--aqn-border); padding:5px 8px; font-size:0.78rem; font-weight:700; cursor:pointer; font-family:inherit; border-radius:6px; line-height:1; transition:background .15s, color .15s; }
.aqn-lang button:hover{ border-color:var(--aqn-accent); color:var(--aqn-accent); }
.aqn-lang button.active{ background:var(--aqn-accent); color:#fff; border-color:var(--aqn-accent); }
[data-theme="dark"] .aqn-lang button{ background:rgba(27,36,45,0.7); }
/* .lang-btn (usado en etapas con <a>) — mismos estilos para consistencia */
.lang-btn{ display:inline-block; font-size:0.78rem; font-weight:700; padding:5px 8px; border-radius:6px; text-decoration:none; color:var(--aqn-fg,#5C6873); background:var(--bg-secondary,#EEF1ED); border:1px solid var(--aqn-border,#D9E1DC); line-height:1; transition:background .15s, color .15s; }
.lang-btn:hover{ border-color:var(--aqn-accent,#1E6B7A); color:var(--aqn-accent,#1E6B7A); }
.lang-btn.active{ background:var(--aqn-accent,#1E6B7A); color:#fff; border-color:var(--aqn-accent,#1E6B7A); }
.aqn-theme{ width:36px; height:36px; border:1px solid var(--aqn-border); border-radius:6px; background:var(--aqn-bg2,rgba(238,241,237,0.9)); color:var(--aqn-fg); cursor:pointer; font-size:15px; line-height:1; }
[data-theme="dark"] .aqn-theme{ background:rgba(27,36,45,0.7); }
.aqn-theme:hover{ color:var(--aqn-fg-hover); }

/* Botón de Ayuda: pastilla a la derecha del todo, coherente con el menú */
.aqn-help{ display:inline-flex; align-items:center; gap:6px; text-decoration:none; font-size:0.82rem; font-weight:700; padding:6px 12px; border-radius:8px; line-height:1; color:var(--aqn-accent); background:transparent; border:1px solid var(--aqn-accent); transition:background .15s, color .15s, transform .15s; white-space:nowrap; }
.aqn-help:hover{ background:var(--aqn-accent); color:#fff; transform:translateY(-1px); }
.aqn-help.active{ background:var(--aqn-accent); color:#fff; }
.aqn-help-i{ display:inline-flex; align-items:center; justify-content:center; width:16px; height:16px; border-radius:50%; border:1.5px solid currentColor; font-size:0.7rem; font-weight:800; }

/* ===== Menú hamburguesa (sólo móvil) ===== */
.aqn-burger{ display:none; flex-direction:column; justify-content:center; align-items:center; gap:4px;
  width:38px; height:38px; border:1px solid var(--aqn-border); border-radius:8px;
  background:var(--aqn-bg2,rgba(238,241,237,0.9)); cursor:pointer; flex-shrink:0; padding:0; }
[data-theme="dark"] .aqn-burger{ background:rgba(27,36,45,0.7); }
.aqn-burger span{ display:block; width:20px; height:2px; border-radius:2px; background:var(--aqn-fg); transition:transform .2s ease, opacity .2s ease; }
.aqn-burger.open span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
.aqn-burger.open span:nth-child(2){ opacity:0; }
.aqn-burger.open span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

.aqn-menu{ display:none; position:absolute; top:100%; left:0; right:0; flex-direction:column; gap:2px;
  padding:8px; background:var(--aqn-bg); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid var(--aqn-border); box-shadow:0 10px 26px rgba(0,0,0,0.14); max-height:calc(100dvh - var(--aqn-height)); overflow-y:auto; }
.aqn-menu.open{ display:flex; }
.aqn-mlink{ color:var(--aqn-fg); text-decoration:none; font-size:0.95rem; font-weight:600; padding:12px 14px; border-radius:8px; }
.aqn-mlink:hover{ background:var(--aqn-hover); color:var(--aqn-fg-hover); }
.aqn-mlink.active{ background:var(--aqn-accent); color:#fff; }
.aqn-mhelp{ border-top:1px solid var(--aqn-border); border-radius:0 0 8px 8px; margin-top:4px; padding-top:14px; }

@media(max-width:720px){
  :root{ --aqn-height:58px; }
  .aqn-links{ display:none; }
  .aqn-logo, .aqn-brand img{ height:24px; }
  .aqn-theme{ width:36px; height:36px; }
  .aqn-help{ display:none; }               /* en móvil, Ayuda vive en el menú hamburguesa */
  .aqn-burger{ display:flex; }
}