/* ── Hamburger ── */
.hamburger {
  position: fixed;
  top: 24px;
  right: 24px;
  z-index: 1000;
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 8px;
}

.hamburger span {
  display: block;
  width: 26px;
  height: 2px;
  background: var(--cyan);
  border-radius: 2px;
  transition: transform .35s ease, opacity .35s ease;
  transform-origin: center;
}

.hamburger.open span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.hamburger.open span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

/* ── Nav overlay ── */
.nav-overlay {
  position: fixed;
  inset: 0;
  z-index: 999;
  background:
    radial-gradient(ellipse at 80% 20%, rgba(139,92,246,.22) 0%, transparent 50%),
    radial-gradient(ellipse at 20% 80%, rgba(34,211,238,.12) 0%, transparent 50%),
    rgba(7, 11, 26, .97);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 48px;
  padding-left: 10%;
  opacity: 0;
  pointer-events: none;
  transition: opacity .4s ease;
}

.nav-overlay.open {
  opacity: 1;
  pointer-events: all;
}

.nav-overlay ul {
  list-style: none;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 28px;
}

.nav-overlay a {
  font-family: 'Sora', sans-serif;
  font-size: clamp(2rem, 8vw, 3.8rem);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 3px;
  color: var(--muted);
  text-decoration: none;
  transition: color .2s ease;
  display: block;
  text-align: left;
}

.nav-overlay a:hover,
.nav-overlay a.active {
  color: var(--cyan);
}

.nav-overlay .nav-tagline {
  font-size: .75rem;
  letter-spacing: 3.5px;
  color: #334155;
  text-transform: uppercase;
}