/* ═══════════════════════════════════════════════════
   NAVIGATION
   ═══════════════════════════════════════════════════ */

.nav {
  position: fixed; top: 0; left: 0; right: 0; height: var(--nav-height);
  z-index: 1000; display: flex; align-items: center;
  transition: background 400ms, backdrop-filter 400ms, box-shadow 400ms;
}
.nav.scrolled {
  background: rgba(12,18,30,0.88);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  box-shadow: 0 1px 0 rgba(255,255,255,0.05);
}
.nav__inner {
  width: 100%; max-width: var(--content-max); margin: 0 auto;
  padding: 0 var(--space-md); display: flex; align-items: center; justify-content: space-between;
}
.nav__logo {
  font-family: var(--font-display); font-size: 1.1rem; color: var(--text-primary);
  letter-spacing: 0.04em; white-space: nowrap; z-index: 1001;
  display: flex; align-items: center; gap: 10px;
}
.nav__logo-text {
  opacity: 0; max-width: 0; overflow: hidden;
  transition: opacity 300ms ease, max-width 400ms ease;
}
.nav.scrolled .nav__logo-text {
  opacity: 1; max-width: 250px;
}
.nav__logo-text span { color: var(--blob-blue) }
.nav__links { display: none; list-style: none; gap: var(--space-md); align-items: center }
@media(min-width:768px) { .nav__links { display: flex } }
.nav__links a {
  font-size: 0.88rem; color: var(--text-secondary); letter-spacing: 0.02em;
  position: relative; transition: color 200ms;
}
.nav__links a::after {
  content: ''; position: absolute; bottom: -4px; left: 0; width: 0; height: 1.5px;
  background: var(--c-blue); transition: width 250ms cubic-bezier(0.25,0.46,0.45,0.94);
}
@media(hover:hover) {
  .nav__links a:hover { color: var(--text-primary) }
  .nav__links a:hover::after { width: 100% }
}
.nav__links a:focus-visible, .btn:focus-visible {
  outline: 2px solid var(--c-blue); outline-offset: 3px; border-radius: 2px;
}

/* Hamburger */
.nav__hamburger {
  display: flex; flex-direction: column; justify-content: center; gap: 5px;
  width: 44px; height: 44px; padding: 10px; z-index: 1001;
}
@media(min-width:768px) { .nav__hamburger { display: none } }
.nav__hamburger span {
  display: block; width: 100%; height: 1.5px; background: var(--text-primary);
  transition: transform 300ms cubic-bezier(0.4,0,0.2,1), opacity 200ms;
  transform-origin: center;
}
.nav__hamburger.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg) }
.nav__hamburger.open span:nth-child(2) { opacity: 0 }
.nav__hamburger.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg) }

/* Mobile Overlay */
.nav__overlay {
  position: fixed; inset: 0; background: rgba(12,18,30,0.97);
  backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
  z-index: 999; display: flex; align-items: center; justify-content: center;
  opacity: 0; pointer-events: none; transition: opacity 400ms;
}
.nav__overlay.open { opacity: 1; pointer-events: auto }
.nav__overlay ul { list-style: none; text-align: center; display: flex; flex-direction: column; gap: var(--space-md) }
.nav__overlay li {
  opacity: 0; transform: translateY(12px);
  transition: opacity 350ms ease-out, transform 350ms ease-out;
}
.nav__overlay.open li { opacity: 1; transform: translateY(0) }
.nav__overlay.open li:nth-child(1) { transition-delay: 80ms }
.nav__overlay.open li:nth-child(2) { transition-delay: 160ms }
.nav__overlay.open li:nth-child(3) { transition-delay: 240ms }
.nav__overlay.open li:nth-child(4) { transition-delay: 320ms }
.nav__overlay a {
  font-family: var(--font-display); font-size: 1.5rem;
  color: var(--text-secondary); transition: color 200ms;
}