.site-nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 4px clamp(12px, 4vw, 32px);
  margin: 8px auto 0;
}

.site-nav a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  border-bottom: 1px solid transparent;
  color: inherit;
  text-decoration: none;
}

.site-nav a[aria-current="page"],
.site-nav a:hover {
  border-bottom-color: var(--sand);
}

.site-nav a:focus-visible {
  outline: 2px solid var(--sand);
  outline-offset: 4px;
}