.nav-account [hidden] {
  display: none !important;
}

.site-navigation,
.nav-account {
  align-items: center;
}

.site-navigation > a,
.nav-account > a,
.nav-account > button {
  min-height: 44px;
}

.nav-account > button {
  color: var(--muted, #a8b7d6);
}

.nav-account > button:hover {
  color: #fff;
}

@media (min-width: 1181px) {
  .site-navigation {
    flex-wrap: nowrap;
    gap: .1rem;
    font-size: 13px;
  }

  .site-navigation > a,
  .nav-account > a,
  .nav-account > button {
    padding-inline: .48rem;
  }

  .nav-account {
    min-width: 480px;
    justify-content: flex-end;
    gap: .1rem;
  }
}

@media (max-width: 1180px) {
  .nav-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .site-navigation {
    position: absolute;
    top: calc(100% - 1px);
    left: 1rem;
    right: 1rem;
    display: none;
    max-height: calc(100vh - 90px);
    overflow-y: auto;
    flex-direction: column;
    align-items: stretch;
    padding: .75rem;
    background: #0A1633;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 10px;
    box-shadow: 0 16px 30px rgba(0,0,0,.25);
  }

  .site-navigation[data-open="true"] {
    display: flex;
  }

  .site-navigation > a,
  .nav-account > a,
  .nav-account > button {
    justify-content: flex-start;
    width: 100%;
    padding: .65rem .8rem;
  }

  .nav-account {
    display: flex;
    flex-direction: column;
    align-items: stretch;
  }
}