.menu-level-1 > li > a,
.menu-level-2 > li > a {
  transition: background-color 0.2s ease, color 0.2s ease;
}

.menu-level-2 {
  min-width: 240px;
}

@media (min-width: 992px) {
  .menu-level-1 > li > .menu-level-2 {
    top: 100% !important;
  }
}

.menu-level-1 > li:hover > a,
.menu-level-1 > li > a:hover,
.menu-level-1 > li > a[aria-expanded="true"],
.menu-level-2 > li:hover > a,
.menu-level-2 > li > a:hover,
.menu-level-2 > li > a:focus-visible {
  background-color: var(--color-secondary) !important;
  color: #fff !important;
}

.menu-level-1 > li:hover > a b,
.menu-level-1 > li > a:hover b,
.menu-level-1 > li > a[aria-expanded="true"] b,
.menu-level-2 > li:hover > a span,
.menu-level-2 > li > a:hover span,
.menu-level-2 > li > a:focus-visible span {
  color: #fff !important;
}