/* ==============================
   小天互连 - 导航专用样式
   仅导航，不影响其他任何模块
   文件名：im-navigation.css
============================== */
.nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  height: 60px;
  background: #fff;
  border-bottom: 1px solid #eee;
  position: relative;
  z-index: 999;
}
.nav-logo {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 18px;
  font-weight: 600;
  color: #176AFF;
  text-decoration: none;
}
.nav-logo-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}
.nav-links {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 24px;
}
.nav-item {
  position: relative;
  display: flex;
  align-items: center;
}
.nav-item a {
  color: #333;
  text-decoration: none;
  font-size: 15px;
  padding: 8px 4px;
}
.nav-item a:hover {
  color: #176AFF;
}
.nav-parent {
  display: flex;
  align-items: center;
  gap: 4px;
}
.nav-arrow {
  width: 10px;
  height: 10px;
}

/* 下拉菜单 */
.has-dropdown:hover .nav-dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.nav-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  background: #fff;
  border: 1px solid #eee;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  padding: 16px;
  display: flex;
  gap: 30px;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  transform: translateY(6px);
  transition: all 0.2s ease;
  z-index: 9999;
}
.dropdown-col {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.dropdown-col-label {
  font-size: 13px;
  color: #999;
  margin-bottom: 4px;
  font-weight: 500;
}
.dropdown-col a {
  font-size: 14px;
  color: #333;
  padding: 4px 0;
}
.dropdown-col a:hover {
  color: #176AFF;
}
.dropdown-col a.active {
  color: #176AFF;
  font-weight: 500;
}

/* 试用按钮 */
.nav-cta {
  background: #176AFF;
  color: #fff !important;
  padding: 6px 14px !important;
  border-radius: 4px;
  font-weight: 500;
}
.nav-cta:hover {
  background: #0052cc !important;
}

/* 产品能力菜单分组样式补丁：总览 + 分隔线 + 两类能力 */
.nav-dropdown-product{
  min-width: 560px;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
}

.nav-dropdown-product .dropdown-overview{
  grid-column: 1 / -1;
}

.nav-dropdown-product .dropdown-overview a{
  display: block;
  padding: 12px 14px;
  border-radius: 12px;
  color: #176AFF;
  background: #EEF5FF;
  font-size: 15px;
  font-weight: 900;
}

.nav-dropdown-product .dropdown-overview a:hover{
  background: #E3EEFF;
  color: #0B49D1;
}

.nav-dropdown-product .dropdown-divider{
  grid-column: 1 / -1;
  height: 1px;
  background: #E7EAF0;
  margin: 2px 0 6px;
}

.nav-dropdown-product .dropdown-col-label{
  color: #1F2937;
  font-size: 13px;
  font-weight: 900;
  padding: 8px 10px 6px;
  cursor: default;
}

.nav-dropdown-product .dropdown-col-label::before{
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 2px;
  background: #176AFF;
  margin-right: 8px;
  vertical-align: 1px;
}
/* 产品能力菜单分组样式补丁（横向列表版） */
.nav-dropdown-product{
  min-width: 760px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
}

.nav-dropdown-product .dropdown-overview{
  grid-column: 1 / -1;
}

.nav-dropdown-product .dropdown-overview a{
  display: block;
  padding: 14px 18px;
  border-radius: 16px;
  color: #176AFF;
  background: #EEF5FF;
  font-size: 15px;
  font-weight: 900;
}

.nav-dropdown-product .dropdown-overview a:hover{
  background: #E3EEFF;
  color: #0B49D1;
}

.nav-dropdown-product .dropdown-divider{
  grid-column: 1 / -1;
  height: 1px;
  background: #E7EAF0;
  margin: 16px 0 18px;
}

.nav-dropdown-product .dropdown-groups{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
}

.nav-dropdown-product .dropdown-col{
  min-width: 0;
}

.nav-dropdown-product .dropdown-col-label{
  color: #1F2937;
  font-size: 14px;
  font-weight: 900;
  padding: 0;
  margin-bottom: 14px;
  cursor: default;
  display: flex;
  align-items: center;
}

.nav-dropdown-product .dropdown-col-label::before{
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 3px;
  background: #176AFF;
  margin-right: 10px;
  flex: 0 0 auto;
}

.nav-dropdown-product .dropdown-links{
  display: flex;
  flex-wrap: wrap;
  gap: 12px 14px;
}

.nav-dropdown-product .dropdown-links a{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 16px;
  border-radius: 12px;
  background: #F7F8FA;
  border: 1px solid #E7EAF0;
  color: #4B5563;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  transition: all .18s ease;
}

.nav-dropdown-product .dropdown-links a:hover{
  color: #176AFF;
  background: #EEF5FF;
  border-color: #D9E6FF;
  transform: translateY(-1px);
}

/* 小屏时自动改成单列 */
@media (max-width: 900px){
  .nav-dropdown-product{
    min-width: 620px;
  }
  .nav-dropdown-product .dropdown-groups{
    grid-template-columns: 1fr;
    gap: 22px;
  }
}

/* 产品能力菜单：精致小卡片版 */
.nav-dropdown-product-fine{
  width: 860px;
  min-width: 860px;
  padding: 18px;
  display: block;
  border-radius: 22px;
  background:
    linear-gradient(180deg, rgba(248,250,252,.98) 0%, rgba(255,255,255,.98) 40%),
    #fff;
  border: 1px solid rgba(226,232,240,.95);
  box-shadow: 0 26px 70px rgba(15,23,42,.16);
}

.product-overview-card{
  margin-bottom: 14px;
}

.product-overview-card a{
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  column-gap: 12px;
  row-gap: 4px;
  padding: 16px 18px;
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(23,106,255,.11), rgba(23,106,255,.035)),
    #F8FBFF;
  border: 1px solid #DCE8FF;
  color: #1F2937;
}

.product-overview-card a:hover{
  background:
    linear-gradient(135deg, rgba(23,106,255,.16), rgba(23,106,255,.055)),
    #F6FAFF;
  border-color: #C8DAFF;
  color: #176AFF;
}

.product-overview-card .overview-badge{
  grid-row: 1 / span 2;
  align-self: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 16px;
  background: #176AFF;
  color: #fff;
  font-size: 14px;
  font-weight: 900;
  box-shadow: 0 12px 24px rgba(23,106,255,.18);
}

.product-overview-card strong{
  display: block;
  color: #176AFF;
  font-size: 18px;
  line-height: 1.25;
  font-weight: 900;
}

.product-overview-card em{
  display: block;
  color: #6B7280;
  font-style: normal;
  font-size: 13px;
  line-height: 1.55;
}

.product-menu-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

.product-menu-group{
  min-width: 0;
  padding: 16px;
  border-radius: 18px;
  background: #fff;
  border: 1px solid #E7EAF0;
}

.product-menu-title{
  display: flex;
  align-items: center;
  gap: 9px;
  color: #1F2937;
  font-size: 14px;
  font-weight: 900;
  margin-bottom: 12px;
  padding: 0 2px;
}

.product-menu-title span{
  width: 10px;
  height: 10px;
  border-radius: 3px;
  background: linear-gradient(135deg, #176AFF, #73A6FF);
  flex: 0 0 auto;
}

.product-menu-links{
  display: grid;
  grid-template-columns: 1fr;
  gap: 9px;
}

.product-menu-links a{
  display: grid;
  grid-template-columns: 42px 1fr;
  grid-template-rows: auto auto;
  column-gap: 12px;
  row-gap: 2px;
  align-items: center;
  min-height: 64px;
  padding: 12px;
  border-radius: 15px;
  background: #F8F9FB;
  border: 1px solid transparent;
  color: #4B5563;
  transition: all .18s ease;
}

.product-menu-links a:hover{
  background: #F4F8FF;
  border-color: #DCE8FF;
  color: #176AFF;
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(15,23,42,.06);
}

.product-menu-links i{
  grid-row: 1 / span 2;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #EEF5FF;
  color: #176AFF;
  font-style: normal;
  font-size: 14px;
  font-weight: 900;
}

.product-menu-links strong{
  display: block;
  color: #1F2937;
  font-size: 15px;
  line-height: 1.25;
  font-weight: 900;
}

.product-menu-links em{
  display: block;
  color: #8B95A5;
  font-style: normal;
  font-size: 12px;
  line-height: 1.45;
}

.product-menu-links a:hover i{
  background: #176AFF;
  color: #fff;
}

.product-menu-links a:hover strong{
  color: #176AFF;
}

@media (max-width: 980px){
  .nav-dropdown-product-fine{
    width: 680px;
    min-width: 680px;
  }
  .product-menu-grid{
    grid-template-columns: 1fr;
  }
}

/* 产品能力菜单：稳重文字标签版 */
.nav-dropdown-product-steady{
  width: 760px;
  min-width: 760px;
  padding: 18px 20px 20px;
  display: block;
  border-radius: 18px;
  background: rgba(255,255,255,.98);
  border: 1px solid #E5E7EB;
  box-shadow: 0 22px 54px rgba(15,23,42,.13);
}

.steady-overview a{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 14px 16px;
  border-radius: 12px;
  background: #F7F8FA;
  border: 1px solid #E7EAF0;
  color: #1F2937;
}

.steady-overview a:hover{
  background: #F3F7FF;
  border-color: #DCE8FF;
  color: #176AFF;
}

.steady-overview strong{
  font-size: 16px;
  font-weight: 900;
  color: #176AFF;
}

.steady-overview span{
  font-size: 13px;
  color: #6B7280;
  font-weight: 600;
}

.steady-divider{
  height: 1px;
  background: #E7EAF0;
  margin: 16px 0 18px;
}

.steady-groups{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
}

.steady-title{
  display: flex;
  align-items: center;
  margin-bottom: 12px;
  color: #1F2937;
  font-size: 14px;
  font-weight: 900;
}

.steady-title::before{
  content: "";
  width: 4px;
  height: 16px;
  border-radius: 99px;
  background: #176AFF;
  margin-right: 10px;
}

.steady-links{
  display: flex;
  flex-wrap: wrap;
  gap: 10px 12px;
}

.steady-links a{
  display: inline-flex;
  align-items: center;
  height: 38px;
  padding: 0 14px;
  border-radius: 8px;
  background: #fff;
  border: 1px solid #E7EAF0;
  color: #4B5563;
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
  transition: all .16s ease;
}

.steady-links a:hover{
  background: #176AFF;
  border-color: #176AFF;
  color: #fff;
  transform: translateY(-1px);
}

@media (max-width: 900px){
  .nav-dropdown-product-steady{
    width: 620px;
    min-width: 620px;
  }
  .steady-groups{
    grid-template-columns: 1fr;
    gap: 20px;
  }
}
/* =========================
   产品能力菜单：稳重文字标签版（强覆盖版）
   追加到导航 CSS 最后面
========================= */

/* 只覆盖产品能力这个下拉，不影响解决方案菜单 */
.nav .nav-dropdown-product-steady{
  width: 760px !important;
  min-width: 760px !important;
  padding: 18px 20px 20px !important;
  display: block !important;
  grid-template-columns: none !important;
  gap: 0 !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.98) !important;
  border: 1px solid #E5E7EB !important;
  box-shadow: 0 22px 54px rgba(15,23,42,.13) !important;
}

/* 总览入口 */
.nav .nav-dropdown-product-steady .steady-overview{
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}

.nav .nav-dropdown-product-steady .steady-overview a{
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 14px !important;
  width: 100% !important;
  padding: 14px 16px !important;
  border-radius: 12px !important;
  background: #F7F8FA !important;
  border: 1px solid #E7EAF0 !important;
  color: #1F2937 !important;
  line-height: 1.4 !important;
}

.nav .nav-dropdown-product-steady .steady-overview a:hover{
  background: #F3F7FF !important;
  border-color: #DCE8FF !important;
  color: #176AFF !important;
}

.nav .nav-dropdown-product-steady .steady-overview strong{
  display: inline-block !important;
  flex: 0 0 auto !important;
  font-size: 16px !important;
  line-height: 1.35 !important;
  font-weight: 900 !important;
  color: #176AFF !important;
}

.nav .nav-dropdown-product-steady .steady-overview span{
  display: inline-block !important;
  color: #6B7280 !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  font-weight: 600 !important;
}

/* 分隔线 */
.nav .nav-dropdown-product-steady .steady-divider{
  display: block !important;
  height: 1px !important;
  background: #E7EAF0 !important;
  margin: 16px 0 18px !important;
}

/* 两组内容 */
.nav .nav-dropdown-product-steady .steady-groups{
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 28px !important;
}

.nav .nav-dropdown-product-steady .steady-group{
  display: block !important;
  min-width: 0 !important;
}

/* 分类标题 */
.nav .nav-dropdown-product-steady .steady-title{
  display: flex !important;
  align-items: center !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  color: #1F2937 !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
  font-weight: 900 !important;
  cursor: default !important;
}

.nav .nav-dropdown-product-steady .steady-title::before{
  content: "" !important;
  display: inline-block !important;
  width: 4px !important;
  height: 16px !important;
  border-radius: 99px !important;
  background: #176AFF !important;
  margin-right: 10px !important;
  flex: 0 0 auto !important;
}

/* 横向标签 */
.nav .nav-dropdown-product-steady .steady-links{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px 12px !important;
}

.nav .nav-dropdown-product-steady .steady-links a{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 14px !important;
  border-radius: 8px !important;
  background: #fff !important;
  border: 1px solid #E7EAF0 !important;
  color: #4B5563 !important;
  font-size: 14px !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  transition: all .16s ease !important;
}

.nav .nav-dropdown-product-steady .steady-links a:hover{
  background: #176AFF !important;
  border-color: #176AFF !important;
  color: #fff !important;
  transform: translateY(-1px) !important;
}

/* 小屏时变单列 */
@media (max-width: 900px){
  .nav .nav-dropdown-product-steady{
    width: 620px !important;
    min-width: 620px !important;
  }

  .nav .nav-dropdown-product-steady .steady-groups{
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
}