.site-header {
  border-top: 6px solid #b3262e;
  background: #17365d;
  color: #fff;
}

.site-header-inner {
  box-sizing: border-box;
  width: min(100% - 3rem, 960px);
  margin-inline: auto;
  padding: 1.4rem 0 0;
}

.site-header .site-title {
  display: inline-block;
  color: #fff;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 2rem;
  font-weight: 720;
  line-height: 1.3;
  letter-spacing: -.025em;
  text-decoration: none;
}

.site-header .site-title:hover { color: #fff; }

.site-nav {
  display: flex;
  flex-wrap: nowrap;
  gap: .15rem;
  margin-top: 1.2rem;
  align-items: stretch;
}

.site-header .site-nav a,
.site-header .site-nav summary,
.site-header .nav-toggle {
  display: block;
  padding: .8rem .75rem;
  border: 0;
  border-bottom: 3px solid transparent;
  color: #e0e9f4;
  background: transparent;
  font: inherit;
  font-size: 1rem;
  font-weight: 550;
  line-height: 1.5;
  text-decoration: none;
  cursor: pointer;
}

.site-nav > a,
.personnel-nav > summary { white-space: nowrap; }

.site-header .site-nav a:hover,
.site-header .site-nav summary:hover,
.site-header .nav-toggle:hover {
  background: #ffffff10;
  color: #fff;
}

.site-header .site-nav a[aria-current],
.site-header .site-nav .is-current-section {
  border-bottom-color: #f0a6ab;
  background: #ffffff12;
  color: #fff;
}

.site-header :is(a, button, summary):focus-visible {
  outline: 3px solid #fff;
  outline-offset: -3px;
}

.personnel-nav { position: relative; }
.personnel-nav > summary { list-style: none; }
.personnel-nav > summary::-webkit-details-marker { display: none; }
.nav-chevron {
  display: inline-block;
  width: .45em;
  height: .45em;
  margin: 0 .15em .2em .4em;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
}
.personnel-nav[open] .nav-chevron { transform: rotate(225deg); margin-bottom: 0; }
.personnel-links {
  position: absolute;
  z-index: 20;
  top: 100%;
  left: 0;
  min-width: 100%;
  width: max-content;
  padding: .35rem;
  background: #17365d;
  border: 1px solid #526b8c;
  box-shadow: 0 .4rem .8rem #0003;
}
.site-header .nav-toggle[hidden] { display: none; }

@media (max-width: 64rem) {
  .site-header-inner { padding-bottom: .75rem; }
  .site-header .site-title { font-size: 1.5rem; }
  .site-header .nav-toggle {
    margin-top: .75rem;
    padding: .6rem .75rem;
    border: 1px solid #8ca3bf;
    border-radius: .25rem;
    font-size: 1.125rem;
  }
  .site-nav { display: block; margin-top: .5rem; }
  .site-header.nav-enhanced .site-nav:not(.is-open) { display: none; }
  .site-header .site-nav a,
  .site-header .site-nav summary {
    padding: .75rem;
    font-size: 1.125rem;
    white-space: normal;
  }
  .personnel-links {
    position: static;
    width: auto;
    min-width: 0;
    margin-left: .75rem;
    padding: 0 0 0 .5rem;
    border: 0;
    border-left: 2px solid #8ca3bf;
    box-shadow: none;
  }
}

@media (max-width: 580px) {
  .site-header-inner { width: calc(100% - 2rem); padding-top: 1rem; }
}
