.desktop-header {
  display: flex;
  gap: 3.0625rem;
  justify-content: center;
  /* Fixed at the top on desktop to mirror mobile */
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 1200;
  /* Spacing similar to mobile header */
  margin: 0;
  padding: 1.25rem 2.5rem;
  /* Match mobile header's subtle separation */
  border-bottom: 1px solid #151515;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.35);
  background-color: #0f0f0f;
}

/* Normalize logo box so link vs non-link renders identically */
.desktop-header .site-logo {
  display: block;
  height: 4.375rem;
  line-height: 0; /* remove inline baseline gap */
}
.desktop-header .site-logo img {
  display: block;
  height: 100%;
  width: auto;
}

.desktop-menu {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0;
}

.desktop-menu a {
  color: #a9a9a9;
  text-decoration: none;
  font-size: 1.125rem;
  padding: 0 0.75rem;
  border: 2px solid transparent;
  border-radius: 8px;
  transition: background-color 0.3s, color 0.3s, border 0.3s;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 2.75rem;
}

.desktop-menu a:hover {
  color: #fff;
}

.desktop-menu a.active-link {
  border-color: #fff;
  color: #fff;
}

.desktop-header nav {
  padding-top: 0.875rem;
}

/* Offset main content for fixed desktop header (above mobile breakpoint) */
@media (min-width: 56.9375em) {
  body:not(.login-page) .core { padding-top: 6.875rem; }
}
