/* A direct destination and a separate native disclosure for each menu group. */
.nav-group { position: relative; padding-right: 32px; }
.nav-parent {
  display: flex; align-items: center; min-height: 48px; color: inherit;
  font-size: 16px; line-height: 1.5; text-decoration: none; white-space: nowrap;
}
.nav-submenu > summary {
  position: absolute; top: 0; right: 0; display: flex; align-items: center;
  justify-content: center; width: 32px; height: 48px; padding: 0;
  color: inherit; list-style: none; cursor: pointer;
}
.nav-submenu > summary::marker { content: ''; }
.nav-submenu > summary::-webkit-details-marker { display: none; }
.nav-submenu > summary svg { pointer-events: none; }
.nav-submenu[open] > summary svg { transform: rotate(180deg); }
.nav-parent:hover, .nav-submenu > summary:hover, .nav-submenu[open] > summary { color: #f2d9a5; }
.nav-parent:hover { text-decoration: underline; text-underline-offset: 5px; }
.nav-parent:focus-visible, .nav-submenu > summary:focus-visible {
  outline: 2px solid #f2d9a5; outline-offset: -3px;
}
.nav-submenu .nav-dropdown { top: 100%; left: 0; }
.nav-dropdown a:focus-visible { outline: 2px solid var(--green); outline-offset: -2px; background: var(--cream); }
@media (max-width: 760px) {
  .nav-group { padding-right: 0; }
  .nav-parent { min-height: 48px; padding-right: 52px; white-space: normal; }
  .nav-submenu > summary { width: 44px; height: 48px; }
  .nav-submenu .nav-dropdown { position: static; width: 100%; }
}