/* 顶部导航栏 */
.navbar {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999;
  padding: 0.7813vw 0;
  /* 15px → 15/1920×100≈0.7813vw */
  transition: all 0.3s ease;
  background-color: transparent;
  height: 4.0625vw;
}

.navbar.scrolled {
  background-color: #fff;
  box-shadow: 0 0.1042vw 0.5208vw rgba(0, 0, 0, 0.1);
  /* 2px→0.1042vw，10px→0.5208vw */
}

.navbar .container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.logo {
  height: 2.7083vw;
  width: auto;
}

.nav-menu {
  display: flex;
  list-style: none;
  height: 2.7083vw;
}

.nav-menu li {
  margin-left: 1.5625vw;
  /* 30px → 30/1920×100≈1.5625vw */
  position: relative;
}

.nav-menu a {
  color: #fff;
  text-decoration: none;
  font-size: 0.8333vw;
  transition: color 0.3s;
  display: flex;
  align-items: center;
  height: 100%;
  padding: 0 0.2604vw;
  cursor: pointer;
}

.navbar.scrolled .nav-menu a {
  color: #333;
}

.nav-menu a:hover,
.nav-menu a.active,
.dropdown-item:hover>a {
  /* color: #007bff; */
  position: relative;
}

.nav-menu a.active::after,
.dropdown-item:hover>a::after {
  content: '';
  position: absolute;
  bottom: 0.5208vw;
  /* 10px/1920×100≈0.5208vw */
  left: 0;
  width: 100%;
  height: 0.1563vw;
  /* 3px → 3/1920×100≈0.1563vw */
  background: linear-gradient(90deg, #31CFFB, #066FF4);
  border-radius: 0.1563vw;
  /* 3px → 0.1563vw */
}

/* 下拉菜单显示控制 */
.dropdown-content.show {
  display: block;
}

.dropdown-item {
  position: relative;
}

.dropdown-content {
  display: none;
  position: absolute;
  top: 2.3438vw;
  /* 45px/1920×100≈2.3438vw */
  left: 0;
  min-width: 9.375vw;
  /* 180px → 180/1920×100≈9.375vw */
  background-color: #fff;
  box-shadow: 0 0.2083vw 0.625vw rgba(0, 0, 0, 0.1);
  /* 4px→0.2083vw，12px→0.625vw */
  border-radius: 0 0 0.2083vw 0.2083vw;
  /* 4px → 0.2083vw */
  z-index: 999;
}

.dropdown-content a {
  display: block;
  padding: 0.5208vw 0.7813vw;
  /* 10px→0.5208vw，15px→0.7813vw */
  color: #333;
  text-decoration: none;
  transition: background-color 0.2s;
}

.dropdown-content a:hover,
.dropdown-content a.active {
  background-color: #f0f8ff;
  color: #007bff;
}

/* 触发下拉显示 */
.dropdown-item:hover .dropdown-content,
.dropdown-item:focus-within .dropdown-content {
  display: block;
}

/* 导航项 hover 样式优化 */
.dropdown-item a {
  display: flex;
  align-items: center;
  gap: 0.2604vw;
  /* 5px → 0.2604vw */
}

.search-container {
  display: flex;
  align-items: center;
  border-radius: 0.2083vw;
  /* 4px/1920×100≈0.2083vw */
  padding: 0vw 0.625vw;
  width: 12.5vw;
  height: 1.6667vw;
  /* 32px/1920×100≈1.6667vw */
}

.search-inputW {
  background: rgba(255, 255, 255, 0.3);
}

.search-inputB {
  background: #F2F3F4;
}

.search-inputW .search-input {
  caret-color: #ffffff;
  color: #FFF;
}

.search-inputB .search-input {
  caret-color: #333;
  color: #333;
}

.search-inputW .search-input::placeholder {
  color: #FFF;
  opacity: 1;
}

.search-inputW .search-icon {
  background: url('../img/icon/searchIcon2.png') no-repeat 0 0 / 100% 100%;
  width: 0.625vw;
  /* 12px/1920×100≈0.625vw */
  height: 0.625vw;
  /* 12px/1920×100≈0.625vw */
  margin-right: 0.4167vw;
  /* 8px/1920×100≈0.4167vw */
}

.search-inputB .search-icon {
  background: url('../img/icon/searchIcon.png') no-repeat 0 0 / 100% 100%;
  width: 0.625vw;
  /* 12px/1920×100≈0.625vw */
  height: 0.625vw;
  /* 12px/1920×100≈0.625vw */
  margin-right: 0.4167vw;
  /* 8px/1920×100≈0.4167vw */
}

.servicePage .navbar .search-icon {}

.search-input {
  flex: 1;
  border: none;
  outline: none;
  font-size: 0.7292vw;
  /* 14px/1920×100≈0.7292vw */
  background-color: #ffffff00;
}

/* 可选：hover和focus样式 */
.search-container:hover,
.search-container:focus-within {
  /* border-color: #007bff; */
}

.search-container:hover .search-icon,
.search-container:focus-within .search-icon {
  /* stroke: #007bff; */
}