/* Smooth scroll for WORK anchor link */
html {
  scroll-behavior: smooth;
}

#navbar {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  width: 100%;
  height: 80px;
  padding-left: var(--edge-margin);
  padding-right: 23px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: var(--color-background);
  transition: transform 300ms ease;
}

#navbar.navbar--hidden {
  transform: translateY(-100%);
}

.navbar__logo {
  font-family: var(--font-display);
  font-size: 32px;
  font-weight: var(--font-regular);
  line-height: var(--leading-default);
  letter-spacing: -0.96px;
  color: var(--color-primary);
}

.navbar__links {
  display: flex;
  align-items: center;
}

.navbar__links a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 104px;
  padding-left: 24px;
  padding-right: 24px;
  font-family: var(--font-mono);
  font-size: 15px;
  font-weight: var(--font-light);
  line-height: var(--leading-default);
  letter-spacing: var(--tracking-default);
  color: var(--color-primary);
  transition: color 150ms ease;
}

.navbar__links a:hover {
  color: var(--color-secondary-1);
}

.navbar__links a.navbar__link--active {
  color: var(--color-secondary-1);
}

/* Mobile — breakpoint styles added in a later pass */