/* DroppXAI — the site's top menu ONLY, for pages that do not load style.css
   (today: the lock page, /lock/). COPIED from site/css/style.css (the NAVBAR,
   button and menu rules); style.css stays the source for every other page.
   Everything is scoped under .navbar, and the variables are declared on .navbar
   itself, so nothing outside the menu changes on the page that loads this file.
   The selectors are .navbar-prefixed on purpose: they must win over a page's own
   generic rules (e.g. the lock page's lime `a` and `.btn`). The hamburger needs a
   toggle script (the lock page uses /lock/nav.js). */
.navbar {
  --white: #e9ecf2;
  --grey: #b9bfcc;
  --blue: #ccff00;
  --blue-light: #d8ff33;
  --border: rgba(255, 255, 255, 0.09);
  --transition: 0.25s ease;
  --font: 'Manrope', sans-serif;
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  padding: 0 24px;
  background: rgba(4, 5, 10, 0.85);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border);
  font-family: var(--font);
  line-height: 1.6;
  color: var(--white);
}
.navbar, .navbar *, .navbar *::before, .navbar *::after { box-sizing: border-box; }
.navbar ul, .navbar li { margin: 0; padding: 0; }
.navbar a { color: inherit; text-decoration: none; }
.navbar .nav-inner {
  max-width: 1140px;
  margin: 0 auto;
  height: 68px;
  display: flex;
  align-items: center;
  gap: 32px;
}
.navbar .nav-logo {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 1.3rem;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.navbar .logo-icon { width: 36px; height: 36px; }
.navbar .logo-accent { color: var(--blue); }
.navbar .nav-links {
  display: flex;
  list-style: none;
  gap: 28px;
  margin-left: auto;
}
.navbar .nav-links a {
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--grey);
  transition: color var(--transition);
}
.navbar .nav-links a:hover { color: var(--white); }
.navbar .nav-links a[aria-current="page"] { color: var(--white); }
.navbar .btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 22px;
  border-radius: 8px;
  font: 600 0.95rem var(--font);
  cursor: pointer;
  transition: var(--transition);
  filter: none;
}
.navbar .btn-ghost {
  background: transparent;
  color: var(--white);
  border: 1.5px solid rgba(255, 255, 255, 0.25);
}
.navbar .btn:hover { filter: none; }
.navbar .btn-ghost:hover {
  border-color: var(--blue);
  color: var(--blue-light);
  transform: translateY(-1px);
}
.navbar .nav-cta { margin-left: 12px; padding: 9px 20px; font-size: 0.9rem; }
.navbar .nav-toggle {
  display: none;
  background: none;
  border: none;
  color: var(--white);
  font-size: 1.4rem;
  cursor: pointer;
  margin-left: auto;
}
.navbar .nav-mobile-cta { display: none; }
/* Six items: fold into the hamburger below 860 px (same as style.css). */
@media (max-width: 859px) {
  .navbar .nav-links, .navbar .nav-cta { display: none; }
  .navbar .nav-toggle { display: block; }
  .navbar .nav-mobile-cta { display: block; }
}