.header-nav-wrapper {
  background: #F7F7F7;
  border-top: 1px solid rgba(255, 255, 255, 0.4);
}
.header-nav-wrapper .nav-list {
  display: flex;
  align-items: center;
  gap: 76px;
  font-family: 'OPPOSans-B';
}
.header-nav-wrapper .nav-list .nav-item a {
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  line-height: 1.2;
  text-align: center;
  color: #D9D9D9;
  position: relative;
  white-space: nowrap;
}
.header-nav-wrapper .nav-list .nav-item a::after {
  display: none;
  content: '';
  position: absolute;
  left: 0;
  bottom: -12px;
  width: 100%;
  height: 6px;
  background: linear-gradient(90deg, var(--primary-color) 0%, var(--primary-color-light) 50%, var(--primary-color) 100%);
}
.header-nav-wrapper .nav-list .nav-item a:hover {
  color: var(--primary-color);
}
.header-nav-wrapper .nav-list .nav-item a.active {
  color: #111111;
}
.header-nav-wrapper .nav-list .nav-item a.active::after {
  display: block;
}
@media screen and (max-width: 1400px) {
  .header-nav-wrapper .nav-list {
    gap: 36px;
  }
}
@media screen and (max-width: 992px) {
  .header-nav-wrapper {
    display: none;
  }
}