.site-navigation { margin: 18px 0 24px; border: 1px solid #cad8e3; border-radius: 12px; background: #fff; overflow: hidden; grid-column: 1 / -1; }
.site-navigation .site-nav-primary { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; padding: 7px; margin: 0; border: 0; background: #f0f5f9; }
.site-navigation .site-nav-primary button, .site-navigation .site-nav-primary > a { display: inline-flex; justify-content: center; align-items: center; min-height: 44px; margin: 0; padding: 10px 18px; border: 1px solid transparent; border-radius: 7px; font: inherit; font-weight: 650; font-size: 15px; color: #284358; background: transparent; text-decoration: none; cursor: pointer; }
.site-navigation .site-nav-primary button:hover, .site-navigation .site-nav-primary > a:hover { background: #dfeaf3; }
.site-navigation .site-nav-primary button.is-open, .site-navigation .site-nav-primary > a[aria-current="page"] { background: #174b70; color: #fff; }
.site-navigation .site-nav-secondary { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; padding: 7px 12px; border-top: 1px solid #cad8e3; }
.site-navigation .site-nav-secondary[hidden] { display: none !important; }
.site-navigation .site-nav-secondary > a, .site-navigation .site-nav-logout button { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 12px; border: 1px solid transparent; border-radius: 6px; font: inherit; font-size: 14px; color: #174b70; background: transparent; text-decoration: none; cursor: pointer; }
.site-navigation .site-nav-secondary > a:hover, .site-navigation .site-nav-logout button:hover { background: #eef4f8; }
.site-navigation .site-nav-secondary > a[aria-current="page"] { background: #e1edf5; font-weight: 700; color: #123e5e; }
.site-navigation .site-nav-logout { display: inline-flex; gap: 0; margin: 0 0 0 auto; padding: 0; border: 0; background: transparent; }
.site-navigation .site-nav-logout button { color: #9d2525; }
.site-navigation :is(a, button):focus-visible { outline: 3px solid #d98c14; outline-offset: -3px; }
@media (max-width: 700px) {
  .site-navigation { margin: 14px 0 18px; border-radius: 9px; }
  .site-navigation .site-nav-primary { gap: 3px; padding: 5px; }
  .site-navigation .site-nav-primary button { flex: 1 1 0; padding: 9px 7px; font-size: 14px; }
  .site-navigation .site-nav-secondary { padding: 5px; gap: 2px; }
  .site-navigation .site-nav-secondary > a, .site-navigation .site-nav-logout button { padding: 8px 9px; font-size: 13px; }
}
