/* ============================================================
   css/nav.css — Navigation Bar & Mobile Menu
   ============================================================ */

nav {
  position:        fixed;
  top:             0;
  left:            0;
  right:           0;
  height:          var(--nav-h);
  background:      var(--nav-bg);
  backdrop-filter: blur(20px);
  border-bottom:   1px solid var(--border);
  z-index:         1000;
  display:         flex;
  align-items:     center;
  transition:      all var(--transition);
}

.nav-inner {
  max-width:       var(--max-width);
  margin:          0 auto;
  padding:         0 var(--container-pad);
  width:           100%;
  display:         flex;
  align-items:     center;
  justify-content: space-between;
}

/* Logo */
.logo {
  font-family:    var(--font-display);
  font-size:      2rem;
  letter-spacing: 0.05em;
  color:          var(--text-primary);
  display:        flex;
  align-items:    center;
  gap:            0.5rem;
}

.logo span { color: var(--yellow); }

/* Desktop nav links */
.nav-links {
  display:     flex;
  align-items: center;
  gap:         2rem;
  list-style:  none;
}

.nav-links a {
  font-family:    var(--font-cond);
  font-size:      0.85rem;
  font-weight:    600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color:          var(--text-secondary);
  transition:     color var(--transition);
}

.nav-links a:hover { color: var(--yellow); }

/* Nav actions */
.nav-actions {
  display:     flex;
  align-items: center;
  gap:         1rem;
}

.btn-nav {
  font-family:    var(--font-cond);
  font-size:      0.8rem;
  font-weight:    700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  background:  var(--yellow);
  color:       var(--black);
  padding:     0.6rem 1.5rem;
  border:      none;
  transition:  all var(--transition);
}

.btn-nav:hover { background: var(--yellow-dark); }

/* Theme toggle */
.theme-toggle {
  background:  none;
  border:      1px solid var(--border);
  padding:     0.5rem;
  color:       var(--text-secondary);
  font-size:   1rem;
  display:     flex;
  align-items: center;
  transition:  all var(--transition);
}

.theme-toggle:hover {
  border-color: var(--yellow);
  color:        var(--yellow);
}

/* Hamburger */
.hamburger {
  display:        none;
  flex-direction: column;
  gap:            5px;
  background:     none;
  border:         none;
  padding:        0.5rem;
}

.hamburger span {
  width:      24px;
  height:     2px;
  background: var(--text-primary);
  transition: all var(--transition);
  display:    block;
}

/* Mobile menu */
.mobile-menu {
  display:    none;
  position:   fixed;
  top:        var(--nav-h);
  left:       0;
  right:      0;
  background: var(--nav-bg);
  border-bottom: 1px solid var(--border);
  padding:    2rem;
  z-index:    999;
}

.mobile-menu.open {
  display:        flex;
  flex-direction: column;
  gap:            1.5rem;
}

.mobile-menu a {
  font-family:    var(--font-cond);
  font-size:      1.2rem;
  font-weight:    600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color:          var(--text-secondary);
}

.mobile-menu a:hover { color: var(--yellow); }