.desktop-nav { align-items: center; }
.nav-category { position: relative; }
.nav-category > summary {
  display: flex;
  align-items: center;
  gap: .55rem;
  min-height: 44px;
  color: #445766;
  font-size: .875rem;
  line-height: 1.4;
  list-style: none;
  cursor: pointer;
}
.nav-category > summary::-webkit-details-marker { display: none; }
.nav-category > summary:hover,
.nav-category[open] > summary { color: var(--teal); }
.nav-category > summary:focus-visible { outline: 3px solid #1983d1; outline-offset: 5px; border-radius: 4px; }
.nav-chevron { width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-2px) rotate(45deg); }
.nav-category[open] .nav-chevron { transform: translateY(2px) rotate(225deg); }
.desktop-nav .nav-submenu {
  position: absolute;
  top: calc(100% + 8px);
  left: -.75rem;
  width: 15.5rem;
  padding: .5rem;
  background: #fff;
  border: 1px solid #dfe7ef;
  border-radius: 12px;
  box-shadow: 0 12px 32px #11264b1a;
}
.desktop-nav .nav-submenu a { display: block; padding: .8rem .85rem; border-radius: 7px; line-height: 1.4; }
.desktop-nav .nav-submenu a:hover,
.desktop-nav .nav-submenu a:focus-visible { background: #eef4fc; color: var(--navy); }
.mobile-nav .nav-category > summary { justify-content: space-between; padding: 12px 0; font-size: 1rem; }
.mobile-nav .nav-submenu { margin: 0 0 8px 4px; padding-left: 18px; border-left: 2px solid #dfe7ef; }
.mobile-nav .nav-submenu a { padding: 11px 0; font-size: .875rem; }
