.header {
  position: sticky;
  top: 0;
  z-index: 10;

  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 56px;

  background: rgba(28, 28, 28, 0.55);
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);

  box-shadow:
    0 8px 24px rgba(0, 0, 0, 0.35),
    inset 0 -1px rgba(255, 255, 255, 0.04);
}

.nav a {
  margin-left: 28px;
  text-decoration: none;
  color: var(--text-secondary);
}

.nav a:hover {
  color: var(--accent-light);
  text-shadow:
    0 0 12px rgba(63, 192, 198, 0.6),
    0 0 32px rgba(20, 155, 159, 0.45);
}

.active {
  color: var(--accent-light);
  text-shadow:
    0 0 12px rgba(63, 192, 198, 0.6),
    0 0 32px rgba(20, 155, 159, 0.45);
}

.terminal-text {
  font: Jetbrains Mono;
}