/* Shared homepage and guide navigation. */
.site-header {
  background: rgb(16 23 37 / 95%);
}
.nav {
  gap: 24px;
}
.nav-links {
  color: #c3cee1;
  gap: 24px;
}
.nav-links a[aria-current="page"] {
  color: var(--brand-light);
}
.language-switch {
  display: flex;
  align-items: center;
  padding: 3px;
  gap: 2px;
  border: 1px solid #3b4e70;
  border-radius: 6px;
  flex-shrink: 0;
}
.language-switch button {
  border: 0;
  background: transparent;
  color: #b1c2df;
  border-radius: 3px;
  min-height: 30px;
  min-width: 34px;
  padding: 3px 7px;
  font-size: 11px;
  font-weight: 650;
}
.language-switch button[aria-pressed="true"] {
  background: #2e4671;
  color: #fff;
}
.language-switch button:hover {
  color: #fff;
  background: #243c65;
}
html[lang="en"] .nav-links {
  font-size: 13px;
  gap: 21px;
}
@media (max-width: 1100px) {
  .nav,
  .nav-links {
    gap: 18px;
  }
}
@media (min-width: 701px) and (max-width: 950px) {
  .nav {
    gap: 12px;
  }
  .nav-links,
  html[lang="en"] .nav-links {
    gap: 14px;
  }
  .nav-links a:nth-child(3) {
    display: none;
  }
  .nav-download {
    padding-inline: 12px;
    gap: 10px;
  }
  .language-switch button {
    min-width: 29px;
  }
}
@media (min-width: 701px) and (max-width: 760px) {
  .nav {
    gap: 10px;
  }
  .nav .brand {
    font-size: 21px;
    gap: 8px;
  }
  .nav .brand img {
    width: 27px;
    height: 27px;
  }
  html[lang="en"] .nav-links {
    font-size: 12px;
    gap: 13px;
  }
  .nav-download {
    font-size: 12px;
    gap: 9px;
    padding-inline: 11px;
  }
}
@media (max-width: 700px) {
  .nav {
    gap: 12px;
  }
  .nav .brand {
    margin-right: auto;
  }
  .language-switch {
    order: 1;
  }
  .nav-download {
    order: 2;
    margin-left: 0;
  }
  .menu-toggle {
    order: 3;
  }
  .menu-toggle > span {
    background: #c7d7f1;
  }
  .nav-links {
    background: #17243c;
    border-color: #34496e;
  }
  .nav-links,
  html[lang="en"] .nav-links {
    gap: 0;
    font-size: 15px;
  }
}
@media (max-width: 540px) {
  .nav-download {
    min-width: 34px;
    padding: 7px 11px;
  }
  .download-nav-label {
    display: none;
  }
}
@media (max-width: 380px) {
  .nav {
    gap: 8px;
  }
  .nav .brand {
    font-size: 19px;
  }
  .language-switch button {
    min-width: 27px;
    padding-inline: 4px;
  }
  .nav-download {
    min-width: 30px;
    padding-inline: 9px;
  }
  .menu-toggle {
    width: 28px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .language-switch button {
    transition: none;
  }
}