/* ═══════════════════════════════════════════════════════════
   AuralogicX — Navigation Bar
   css/navbar.css
═══════════════════════════════════════════════════════════ */

.nav {
  position:   fixed;
  top:0; left:0; right:0;
  z-index:    1000;
  padding:    0;
  transition: .4s var(--ease);
  background: linear-gradient(90deg,
    #03060f 0%, #04080f 15%, rgba(12,6,32,.97) 38%,
    rgba(40,10,90,.95) 60%, rgba(90,24,170,.92) 78%,
    rgba(124,58,237,.98) 88%, rgba(124,58,237,.98) 100%);
  border-bottom:   1px solid rgba(124,58,237,.28);
  backdrop-filter: blur(20px);
}
.nav.scrolled {
  background: linear-gradient(90deg,
    #02040c 0%, #03060e 12%, rgba(10,5,28,.98) 35%,
    rgba(32,8,72,.97) 58%, rgba(76,18,140,.96) 78%,
    rgba(124,58,237,.99) 88%, rgba(124,58,237,.99) 100%);
  border-bottom:   1px solid rgba(124,58,237,.4);
  backdrop-filter: blur(28px);
  box-shadow:      0 2px 40px rgba(0,0,0,.5);
}

.nav-inner {
  max-width:       1200px;
  margin:          0 auto;
  display:         flex;
  align-items:     center;
  justify-content: space-between;
  height:          76px;
  padding:         0 28px;
}

/* ─── Logo ───────────────────────────────────────────────── */
.nav-logo          { margin-left: 0 }
.nav-logo img {
  height:      64px;
  object-fit:  contain;
  cursor:      pointer;
  display:     block;
  transition:  filter .3s var(--ease);
}
.nav-logo img:hover {
  filter: brightness(1.35) drop-shadow(0 0 10px rgba(0,212,255,.55));
}

/* ─── Links ──────────────────────────────────────────────── */
.nav-links {
  display:     flex;
  gap:         34px;
  align-items: center;
}
.nav-links a {
  font-family:    var(--ff-display);
  font-size:      11.5px;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  font-weight:    700;
  color:          rgba(224,230,255,.9);
  transition:     .25s var(--ease);
  text-shadow:    0 0 14px rgba(0,212,255,.12);
}
.nav-links a:hover { color: var(--cyan) }
.nav-links a.active { color: var(--cyan) }
.nav-cta { padding:9px 22px !important; font-size:10.5px !important }

/* ─── Mobile hamburger ───────────────────────────────────── */
.nav-toggle {
  display:    none;
  flex-direction: column;
  gap:        5px;
  cursor:     pointer;
  padding:    4px;
}
.nav-toggle span {
  width:         24px;
  height:        2px;
  background:    var(--cyan);
  border-radius: 2px;
  transition:    .3s;
}

@media (max-width:920px) {
  .nav-links {
    display:         none;
    flex-direction:  column;
    gap:             0;
    position:        absolute;
    top:             76px;
    left:0; right:0;
    background:      rgba(3,6,15,.97);
    backdrop-filter: blur(20px);
    border-bottom:   1px solid var(--border);
    padding:         20px 28px;
  }
  .nav-links.open { display:flex }
  .nav-links a {
    padding:      13px 0;
    border-bottom:1px solid var(--border);
    font-size:    12px;
  }
  .nav-toggle { display:flex }
}