#nav {
  padding: var(--s3) calc(var(--s4) * 1.5);
  border-bottom: var(--border-width) solid var(--f2-border);
  display: flex;
  align-items: center;
  gap: calc(var(--s4) * 2);
  flex-shrink: 0;
}

.nav-links {
  display: flex;
  gap: var(--s4);
}

.nav-link {
  text-decoration: none;
  padding: var(--s1) var(--s2);
  color: var(--text);
}

.nav-link:hover {
  color: var(--text);
}

.nav-link.active {
  color: var(--text);
  border-bottom: 2px solid var(--primary);
}