/* Keep the pointer inside the service navigation while it crosses into the menu. */
.top-nav-services::after {
  position: absolute;
  top: 100%;
  left: 50%;
  z-index: 34;
  width: 176px;
  height: 12px;
  content: "";
  transform: translateX(-50%);
}

.services-dropdown-menu {
  top: calc(100% + 6px) !important;
  width: 176px !important;
  padding: 7px !important;
  border: 1px solid rgb(219 231 244 / 82%) !important;
  border-radius: 10px !important;
  background: rgb(255 255 255 / 98%) !important;
  box-shadow: 0 18px 42px rgb(30 73 116 / 18%) !important;
  transform: translate(-50%) translateY(4px) !important;
}

.top-nav-services:hover .services-dropdown-menu,
.top-nav-services:focus-within .services-dropdown-menu {
  transform: translate(-50%) translateY(0) !important;
}

.services-dropdown-menu a {
  width: 100% !important;
  min-height: 42px !important;
  justify-content: flex-start !important;
  padding: 0 14px !important;
  border-radius: 6px !important;
  font-size: 15px !important;
  line-height: 1.4 !important;
}

.services-dropdown-menu a:hover,
.services-dropdown-menu a:focus-visible {
  color: #1476e8 !important;
  background: #f1f7fd !important;
  outline: none;
}

.top-nav-services:hover .top-nav-service-trigger span::before,
.top-nav-services:focus-within .top-nav-service-trigger span::before {
  transform: rotate(225deg) translate(-1px, -1px);
}

.top-nav-service-trigger span::before {
  transition: transform 180ms ease;
}