/* --- 基础重置与高端工业变量 --- */
:root {
    --bg-white: #ffffff;
    /* 极致白 */
    --bg-dark: #0d1117;
    --bg-card: #fff;
    /* 深钛黑 */
    --accent-blue: #0066ff;
    /* 科技工业蓝 */
    --color-accent: #3b8fee;
    /* 科技工业蓝 */
    --text-light: #e6edf3;
    --color-text-muted: #64748b;
    --color-border: #e2e8f0;
    /* 金属灰白 */
    --text-black: #131313;
    --card-bg: #ffffff;
    /* 黑色字体 */
    --text-muted: #5f6163;
    /* 哑光工业灰 */
    --border-color: #e8ecf1;
    --bg-subtle: #f4fdff;
    /* 机械缝隙线 */
    --font-main: Microsoft JhengHei,Source Han Sans CN,PingFang SC,Source Han Serif SC,Microsoft YaHei,sans-serif;
    --color-cyan-400: oklch(78.9% 0.154 211.53);
    --color-black-400: oklch(18.22% 0.00002 271.152);
    --shadow-card: 0 4px 20px -2px rgba(15, 23, 42, 0.08);
    --shadow: 0 10px 30px rgba(0, 82, 204, 0.08);
    --box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    /* 高端商务/科技蓝 */
    --primary-accent: #0066ff;
    --secondary-accent: #3385ff;
    --text-main: #000000;
    /* 接近纯黑的深灰，提升高级感 */
    --text-muted: #636366;
    /* 浅灰色文本 */
    /* 中轴线轨道颜色 */
    --track-color: rgba(0, 102, 255, 0.15);
    /* 稍微加深一点点虚线的颜色，使其清晰 */
    --card-border: rgba(0, 0, 0, 0.04);
    --shadow-card: 0 10px 30px -5px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.02);
    --shadow-hover: 0 20px 35px -10px rgba(0, 119, 255, 0.15);
    --transition-base: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 20px;
    --radius-full: 50px;
        --header-height: 2.5rem;
    --anchor-nav-height: 0.6rem;
          --color-primary: #0f172a;
      --color-secondary: #475569;
      --color-accent: #94a3b8;
      --color-bg-light: #f8fafc;
      --color-bg-white: #ffffff;
      --color-border: #e2e8f0;
      --color-border-dark: #334155;
      --font-main: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
      --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      --clr-bg-main: #f8fafc;
    --clr-bg-card: #ffffff;
    --clr-bg-input: #f1f5f9;
    --clr-primary: #0284c7;
    --clr-primary-glow: rgba(2, 132, 199, 0.15);
    --clr-secondary: #0369a1;
    --clr-text-main: #0f172a;
    --clr-text-muted: #64748b;
    --clr-border: #e2e8f0;
    --clr-table-stripe: #f8fafc;
    --clr-highlight: #b45309;
}
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
html {
    scroll-behavior: smooth;
    font-family: var(--font-main);
    background-color: var(--bg-white);
    color: var(--text-black);
    font-size: calc(100vw/19.2);
}
@media (max-width: 1600px) {
    html {
        font-size: 66px;
    }
}
@media (max-width: 767px) {
    html {
        font-size: 60px;
    }
}
/* 1. 设置极细宽度 */
::-webkit-scrollbar {
    width: 4px;
    height: 4px;
}
/* 2. 彻底隐藏箭头（包含单箭头、双箭头和拐角） */
::-webkit-scrollbar-button,
::-webkit-scrollbar-button:single-button,
::-webkit-scrollbar-button:vertical:decrement,
::-webkit-scrollbar-button:vertical:increment,
::-webkit-scrollbar-button:horizontal:decrement,
::-webkit-scrollbar-button:horizontal:increment {
    display: none;
    width: 0;
    height: 0;
    background: transparent;
}
/* 3. 清除角落交叉区域（避免产生灰块） */
::-webkit-scrollbar-corner {
    background: transparent;
}
/* 4. 轨道背景透明 */
::-webkit-scrollbar-track {
    background: transparent;
}
/* 5. 滑块样式（绿色细线条） */
::-webkit-scrollbar-thumb {
    background-color: #1c5bd7;
    border-radius: 999px;
    min-height: 150px;
}
::-webkit-scrollbar-thumb:hover {
    background-color: #1c5bd7;
}
video {
    will-change: transform;
    transform: translateZ(0);
    backface-visibility: hidden;
}
.wow {
    will-change: transform, opacity;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    -webkit-font-smoothing: subpixel-antialiased;
}
@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 60px, 0);
        transform: translate3d(0, 60px, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
}
@keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 60px, 0);
        transform: translate3d(0, 60px, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
}
.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
}
@-webkit-keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -60px, 0);
        transform: translate3d(0, -60px, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
}
@keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -60px, 0);
        transform: translate3d(0, -60px, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
}
.fadeInDown {
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
}
.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
.icon-sm {
    width: 0.18rem;
    height: 0.18rem;
}
.icon-md {
    width: 0.2rem;
    height: 0.2rem;
}
.icon-lg {
    width: 0.3rem;
    height: 0.3rem;
}
body {
    overflow-x: hidden;
    background-size: cover;
  min-height: 200vh;
  color: #fff;
  font-family: 'Plus Jakarta Sans';
  font-size: 0.16rem; /* 兜底基础字号 16px */
}
/* 确保 html 的滚动行为是 auto，否则会与 Lenis 冲突 */
html.lenis,
html.lenis body {
    height: auto;
}
.lenis.lenis-smooth {
    scroll-behavior: auto !important;
}
.lenis.lenis-smooth [data-lenis-prevent] {
    overscroll-behavior: contain;
}
.lenis.lenis-stopped {
    overflow: hidden;
}
.lenis.lenis-scrolling iframe {
    pointer-events: none;
}
a {
    text-decoration: none;
    color: inherit;
}
ul {
    list-style: none;
}
.solution,.product{
  background: #eef0f2;
}
/*面包屑导航*/
.breadcrumb-bar {
         width: 100%;
    height: 48px;
    display: flex;
    align-items: center;
    padding: 0 0.8rem;
    position: fixed;
    top: 1.2rem;
    z-index: 3;
    }
    .breadcrumb {
      display: flex;
      align-items: center;
      list-style: none;
      font-size: 14px;
    }
    .breadcrumb-item {
      display: flex;
      align-items: center;
    }
    .breadcrumb-item a {
      color: #f2f1f1;
      text-decoration: none;
      display: inline-flex;
      align-items: center;
      transition: color 0.2s ease;
    }
    .home-icon {
      width: 18px;
      height: 18px;
      fill: currentColor;
    }
    .breadcrumb-item a:hover {
      color: #ffffff;
    }
    .breadcrumb-separator {
      margin: 0 10px;
      color: #f2f1f1;
      font-size: 12px;
      user-select: none;
    }
    .breadcrumb-item.active {
      color: #ffffff;
      font-weight: 500;
    }
/* ---------------- Header 基础样式 ---------------- */
/* 1. Header 默认设置为完全透明，过渡效果设为 0.3 秒 */
/* 1. Header 默认基础样式 */
/* 1. 顶部 Header 基础设置 */
.site-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  background-color: transparent;
  transition: background-color 0.35s ease;
}
/* 2. 背景层：实现整体向下延伸的黑色半透明背景 */
.site-header::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; /* 默认只有 Header 的高度 */
  background-color: transparent;
  z-index: -1;
  transition: height 0.35s cubic-bezier(0.25, 1, 0.5, 1), background-color 0.35s ease, backdrop-filter 0.35s ease;
}
/* 3. 页面滚动后的背景 */
.site-header.is-scrolled::before {
  background-color: rgba(0, 0, 0, 0.75);
}
/* 4. 菜单展开状态：背景拉伸变深并向下覆盖二级菜单 */
.site-header.menu-open::before {
  background-color: rgba(0, 0, 0, 0.6) !important; /* 黑色加深覆盖 */
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  height: var(--header-expand-height, 100%); /* 动态获取展开后的总高度 */
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
/* 5. 确保下拉菜单背景透明（由 site-header::before 统一提供背景） */
.mega-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  background: transparent !important;
  display: none;
  opacity: 0;
  padding-top: 20px;
  padding-bottom: 30px;
}
.header-container {
  margin: 0 auto;
  padding: 0 0.8rem;
  height: 1.2rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}
/* PC端全屏统一背景遮罩 */
.header-container::before {
  content: '';
  position: absolute;
  top: 0.8rem;
  left: -50vw;
  right: -50vw;
  height: 0;
  background: rgba(10, 10, 10, 0.45);
  backdrop-filter: blur(0.2rem);
  -webkit-backdrop-filter: blur(0.2rem);
  border-bottom: 0.01rem solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.6);
  transition: height 0.3s cubic-bezier(0.25, 1, 0.5, 1), opacity 0.3s ease;
  opacity: 0;
  pointer-events: none;
  z-index: 998;
}
.header-container.menu-open::before {
  height: 2.8rem;
  opacity: 1;
}
.logo {
  display: flex;
  align-items: center;
  text-decoration: none;
  color: #ffffff;
  font-weight: 800;
  font-size: 0.26rem;
  letter-spacing: 0.015rem;
  z-index: 1002;
  margin-right: auto;
}
.logo-img{
    width: 1.2rem;
}
/* ---------------- PC端 导航菜单 ---------------- */
.nav-wrapper {
  display: flex;
  align-items: center;
  margin-left: 3rem;
}
.nav-active{
    color: var(--accent-blue) !important;
}
.nav-list {
  display: flex;
  list-style: none;
  gap: 1.25rem;
}
.nav-item {
  position: relative;
}
.nav-link {
  color: #ffffff;
  text-decoration: none;
  font-size: 0.16rem;
  font-weight: 700;
  line-height: 0.8rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: color 0.3s;
  white-space: nowrap;
  font-family: Noto Sans SC;
}
.nav-item:hover .nav-link {
  color: var(--accent-blue);
}
.dropdown-arrow {
  display: none;
}
/* PC端 下拉菜单 */
.mega-dropdown {
  position: absolute;
  top: 0.8rem;
  left: 0;
  min-width: 1.8rem;
  display: none;
  opacity: 0;
  transform: translateY(-0.08rem);
  z-index: 999;
}
.sub-menu {
  list-style: none;
  padding: 0 0 0.25rem 0;
}
.sub-menu li {
  margin-bottom: 0.12rem;
  width:160px ;
  line-height: 1.8;
}
.sub-menu a {
  color: #cccccc;
  text-decoration: none;
  font-size: 0.14rem;
  font-weight: 500;
  transition: all 0.2s ease;
  display: inline-block;
}
.sub-menu a:hover {
  color: var(--accent-blue);
  transform: translateX(0.04rem);
}
/* CTA 按钮与汉堡按钮 */
.cta-btn {
    background-color: var(--accent-blue);
    color: var(--bg-white);
    padding: 0.12rem 0.28rem;
    border-radius: 0.3rem;
    text-decoration: none;
    font-weight: 500;
    font-size: 0.18rem;
    transition: all 0.3s ease;
    z-index: 1002;
    font-family: 'NOTO SANS SC';
}
.cta-btn:hover {
  background-color: var(--accent-blue);
  box-shadow: 0 0 0.15rem rgba(0, 174, 255, 0.4);
  transform: translateY(-0.02rem);
}
.mobile-toggle {
  display: none;
  flex-direction: column;
  justify-content: space-between;
  width: 0.28rem;
  height: 0.2rem;
  background: transparent;
  border: none;
  cursor: pointer;
  z-index: 1002;
}
.mobile-toggle span {
  width: 100%;
  height: 0.02rem;
  background-color: #fff;
  transition: all 0.3s ease;
}
/*首屏hero*/
/* --- 首屏重工业巨幕 --- */
/* 模拟钛金工业质感背景图 */
/* --- 首屏重工业视频巨幕 --- */
.hero-section {
    position: relative;
    height: 80vh;
    display: flex;
    align-items: center;
    padding: 0 0.8rem;
    overflow: hidden;
    height: 100vh;
}
.site-header {
    opacity: 0;
    transform: translateY(-30px);
}
/* Hero 文字与按钮初始隐藏 */
.hero-title, 
.hero-subtitle, 
.hero-buttons .btn-explore {
    opacity: 0;
    transform: translateY(40px);
}
.hero-subtitle span{
    font-weight: bold;
    color: var(--bg-white);
    font-family: Noto Sans SC;
}
/* 视频容器与高级工业滤镜 */
.hero-video-wrap {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}
.hero-video {
    width: 100%;
    height: 100vh;
    object-fit: cover;
    /* 确保视频完美裁剪填充，不拉伸变形 */
    /* 渐变遮罩：左侧深色便于看清文字，整体压暗突出高端暗黑工厂质感 */
}
/* 遮罩层：双重保障文字清晰度 */
.hero-video-wrap::after, .video-container:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, rgba(13, 17, 23, 0.7) 20%, rgba(13, 17, 23, 0.2) 70%);
}
.hero-image-wrap {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}
.hero-image-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* 确保视频完美裁剪填充，不拉伸变形 */
    /* 渐变遮罩：左侧深色便于看清文字，整体压暗突出高端暗黑工厂质感 */
}
/* 遮罩层：双重保障文字清晰度 */
.hero-image-wrap::after, .video-container:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, rgba(13, 17, 23, 0.7) 20%, rgba(13, 17, 23, 0.2) 70%);
}
.hero-content {
    max-width: 100%;
    position: relative;
    z-index: 2;
}
.hero-content .btn-explore {
    color: var(--bg-white);
    font-size: 0.2rem;
    font-weight: 600;
    width: 3.4rem;
    height: 0.7rem;
    margin-right: 0.5rem;
    font-family: Noto Sans SC;
}
.hero-content .btn-explore::before {
    width: 0.7rem;
    height: 0.7rem;
}
.hero-content .btn-explore .icon {
    width: 42px;
}
.hero-content .btn-explore .icon svg {
    width: 40px;
}
.hero-title {
    font-size: clamp(36px, 5vw, 49px);
    color: var(--bg-white);
    font-weight: 600;
    margin-bottom: 0.4rem;
    font-family: Noto Sans SC;
}
.hero-subtitle {
    font-size: clamp(18px, 2vw, 20px);
    color: #cdcdcd;
    margin-bottom: 0.8rem;
    line-height: 2;
    font-family: Noto Sans SC;
    letter-spacing: 0.01rem;
}
/* 按钮容器 */
.btn-explore {
    position: relative;
    display: inline-flex;
    align-items: center;
    height: 50px;
    padding: 0 24px 0 16px;
    border-radius: 25px;
    cursor: pointer;
    text-decoration: none;
    color: var(--accent-blue);
    font-weight: 500;
    overflow: hidden;
    user-select: none;
    width: 2rem;
    font-size: 0.18rem;
}
.btn-explore:hover {
    color: #fff;
}
.btn-explore::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 50px;
    /* 初始状态：与按钮高度一致的圆球 */
    height: 100%;
    background-color: var(--accent-blue);
    border-radius: 1rem;
    z-index: 1;
    /* 宽度过渡动画 */
    transition: width 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}
/* 鼠标悬停时：背景宽度从 50px 展开至 100% */
.btn-explore:hover::before {
    width: 100%;
}
/* 图标样式 */
.btn-explore .icon {
    position: relative;
    z-index: 2;
    /* 保证图标在背景层之上 */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 100%;
    margin-right: 0.2rem;
    transition: transform 0.3s ease;
}
.btn-explore .icon svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: #ffffff;
    stroke-width: 1;
    stroke-linecap: round;
    stroke-linejoin: round;
}
/* 悬停微调效果：图标轻微向右移动增加灵动感（可选） */
.btn-explore:hover .icon {
    transform: translateX(2px);
}
/* 文本内容 */
.btn-explore .text {
    position: relative;
    z-index: 2;
    /* 保证文字在背景层之上 */
    white-space: nowrap;
    letter-spacing: 0.5px;
}
/* 悬停微调效果：图标轻微向右移动增加灵动感（可选） */
.btn-explore:hover .icon {
    transform: translateX(2px);
}
/* 指引组件定位在 Hero 底部居中 */
.scroll-down-indicator {
  position: absolute;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  text-decoration: none;
  z-index: 10;
  cursor: pointer;
  opacity: 0.8;
  transition: opacity 0.3s ease;
}
.scroll-down-indicator:hover {
  opacity: 1;
}
/* 文字样式 */
.scroll-text {
  font-size: 0.14rem;
  font-weight: 600;
  letter-spacing: 2px;
  color: #ffffff;
  text-transform: uppercase;
  opacity: 0.7;
}
/* SVG 图标样式 */
.scroll-icon {
  width: 40px;
  height: 40px;
  fill: none;
  stroke: #ffffff;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
/* 箭头循环下潜脉冲动画 */
.scroll-icon .arrow {
  animation: scrollDown 1.8s infinite ease-in-out;
}
.scroll-icon .arrow-1 {
  animation-delay: 0s;
}
.scroll-icon .arrow-2 {
  animation-delay: 0.3s; /* 第二层箭头延迟触发，形成波浪推感 */
}
@keyframes scrollDown {
  0% {
    opacity: 0;
    transform: translateY(-6px);
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: translateY(6px);
  }
}
@keyframes trackBallSlide {
    0% {
        opacity: 1;
        -webkit-transform: scale(1) translateY(-8px);
        transform: scale(1) translateY(-8px);
    }
    34% {
        opacity: 1;
        -webkit-transform: scale(1) translateY(4px);
        transform: scale(1) translateY(4px);
    }
    68% {
        opacity: 0.2;
        -webkit-transform: scale(1) translateY(16px);
        transform: scale(1) translateY(16px);
    }
    100% {
        opacity: 0.2;
        -webkit-transform: scale(1) translateY(-8px);
        transform: scale(1) translateY(-8px);
    }
}
/* ---------------- 移动端响应式 (<= 1024px) ---------------- */
@media (max-width: 1024px) {
  .header-container::before {
    display: none;
  }
  .header-container {
    padding: 0 0.2rem;
    height: 0.7rem;
  }
  .mobile-toggle {
    display: flex;
  }
  .cta-btn {
    display: none;
  }
  /* 移动端侧滑抽屉 */
  .nav-wrapper {
    position: fixed;
    top: 0;
    right: -100%;
    width: 85%;
    max-width: 3.8rem;
    height: 100vh;
    background: rgba(12, 12, 12, 0.98);
    backdrop-filter: blur(0.2rem);
    padding: 0.9rem 0.24rem 0.4rem;
    flex-direction: column;
    align-items: flex-start;
    overflow-y: auto;
    transition: right 0.4s cubic-bezier(0.77, 0, 0.175, 1);
    box-shadow: -0.1rem 0 0.3rem rgba(0, 0, 0, 0.8);
  }
  .nav-wrapper.active {
    right: 0;
  }
  .nav-list {
    flex-direction: column;
    width: 100%;
    gap: 0;
  }
  .nav-item {
    width: 100%;
    border-bottom: 0.01rem solid rgba(255, 255, 255, 0.08);
  }
  .nav-link {
    line-height: 0.55rem;
    font-size: 0.17rem;
  }
  .has-dropdown > .nav-link .dropdown-arrow {
    display: inline-block;
    font-size: 0.18rem;
    font-style: normal;
    transition: transform 0.3s ease;
    color: #888;
  }
  .has-dropdown.open > .nav-link .dropdown-arrow {
    transform: rotate(45deg);
    color: var(--accent-blue);
  }
  .mega-dropdown {
    position: static;
    display: none;
    opacity: 1 !important;
    transform: none !important;
    min-width: auto;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 0.08rem;
    margin-bottom: 0.1rem;
  }
  .sub-menu {
    padding: 0.12rem 0.2rem;
  }
  .sub-menu li {
    margin-bottom: 0.1rem;
  }
  .sub-menu li:last-child {
    margin-bottom: 0;
  }
  .sub-menu a {
    font-size: 0.14rem;
    color: #aaaaaa;
  }
  .sub-menu a:hover {
    transform: none;
  }
  .mobile-toggle.active span:nth-child(1) {
    transform: translateY(0.09rem) rotate(45deg);
  }
  .mobile-toggle.active span:nth-child(2) {
    opacity: 0;
  }
  .mobile-toggle.active span:nth-child(3) {
    transform: translateY(-0.09rem) rotate(-45deg);
  }
}
/*关于我们*/
.about-main{
  color: var(--color-primary);
}
/* 容器布局：100vh 满屏 + Flex 上下居中 */
    .about-section {
      position: relative;
      width: 100%;
      min-height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 0.9rem 0.8rem;
      background-color: #eef0f2;
      overflow: hidden;
    }
    /* 采用 CSS Grid 区域布局，彻底放弃绝对定位 */
    .about-container {
    width: 100%;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto 1fr;
    grid-template-areas:         ".tag"        "grid content";
    column-gap: 80px;
    row-gap: 84px;
    align-items: center;
    position: relative;
    z-index: 2;
    margin-bottom: 160px;
    }
    /* 顶角 Tag 区域：绑定到 grid-area: tag，依靠 Flex 靠右 */
    .top-header-tag {
      grid-area: tag;
      display: flex;
      justify-content: flex-end;
      align-items: center;
    }
/* 修改后的样式：用首字母 K 替代黄色竖线 */
.top-header-tag .tag-text {
  font-weight: 600;
  font-size: 0.3rem;
  color: #111;
  display: inline-flex;
  align-items: center;
  gap: 6px; /* 控制 K 与后续文字的间距 */
  font-family: Noto Sans;
}
.top-header-tag .tag-text::before {
    content: 'K';
    font-weight: 900;
    color: var(--accent-blue);
    font-size: 52px;
    position: relative;
    line-height: 1;
    top: -8px;
}
    /* 左侧 2x2 网格容器 */
    .stats-wrapper {
      grid-area: grid;
    }
    .stats-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 50px;
      position: relative;
      z-index: 2;
    }
    .stat-card {
      background: rgba(255, 255, 255, 0.85);
      backdrop-filter: blur(8px);
      border-radius: 16px;
      padding: 30px 24px;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03);
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      min-height: 180px;
    }
    .stat-icon {
      width: 50px;
      height: 50px;
      margin-bottom: 20px;
          stroke: var(--accent-blue);
    }
    .stat-number-box {
      text-align: right;
    }
    .stat-number-box .prefix,
    .stat-number-box .suffix {
      font-size: 24px;
      font-weight: 700;
      color: #111;
    }
    .stat-number {
      font-size: 48px;
      font-weight: 800;
      color: #111;
      line-height: 1;
    }
    .stats-grid .stat-label {
      text-align: right;
      font-size: 13px;
      color: #666;
      margin-top: 8px;
      line-height: 1.3;
    }
    /* 右侧文本内容 */
    .about-content {
      grid-area: content;
      align-self: center;
    }
    .about-content h2 {
      font-size: 40px;
    line-height: 1.15;
    color: #111;
    font-weight: 800;
    margin-bottom:40px;
    font-family: 'Noto Sans SC';
    }
    .about-content p {
      font-size: 15px;
      line-height: 1.6;
      color: #666;
    }
    .bg-letter-k {
       position: absolute;
    left: 1%;
    top: -6%;
    width: 550px;
    height: 120%;
    z-index: 1;
    pointer-events: none;
    display: flex;
    justify-content: center;
    align-items: center;
    }
    /* 响应式适配 */
    @media (max-width: 992px) {
      .about-section {
        height: auto;
        min-height: 100vh;
        padding: 60px 0.8rem;
      }
      .about-container {
        grid-template-columns: 1fr;
        grid-template-areas: 
          "tag"
          "content"
          "grid";
        row-gap: 24px;
      }
      .bg-letter-a {
        width: 100%;
        left: 0;
        opacity: 0.5;
      }
    }
    @media (max-width: 576px) {
      .stats-grid {
        grid-template-columns: 1fr;
      }
    }
    /* 顶部与底部占位，便于展示滚动效果 */
    .spacer {
      height: 60vh;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 24px;
      color: #666;
    }
    /* 整体容器 */
    .solutions-section {
      width: 100%;
      margin: 0 auto;
      padding: 0.6rem 0.8rem;
    }
    .top-header-tag {
      margin-bottom: 40px;
    }
    /* 卡片固定包裹区 */
    .cards-wrapper {
      position: relative;
      width: 100%;
      height: 80vh; /* 每次固定显示的高 */
    }
    /* 单个卡片样式 (参考参考图布局) */
    .solution-card {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: #eef0f2;
      border-radius: 24px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 60px;
      box-shadow: 0 10px 30px rgba(0,0,0,0.05);
      overflow: hidden;
    }
    /* 左侧文本内容 */
    .card-content {
      flex: 0 0 35%;
      max-width: 450px;
    }
    .card-icon {
      width: 60px;
      height: 60px;
      margin-bottom: 24px;
      stroke: var(--accent-blue);
    }
    .card-title {
      font-size: 42px;
      font-weight: 700;
      line-height: 1.15;
      margin-bottom: 20px;
      color: #1a1a1a;
    }
    .card-desc {
      font-size: 14px;
      line-height: 1.6;
      color: #666;
      margin-bottom: 32px;
    }
    .more-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 14px 32px;
      background-color: var(--accent-blue);
      color: #fff;
      font-weight: 600;
      font-size: 15px;
      border-radius: 30px;
      text-decoration: none;
      transition: transform 0.2s ease, background-color 0.2s ease;
    }
    .more-btn:hover {
      transform: translateY(-2px);
      background-color: rgb(5, 84, 231);
    }
    .more-btn span {
      margin-left: 6px;
    }
    /* 右侧图片容器 */
    .card-image {
      flex: 0 0 60%;
      height: 100%;
      border-radius: 20px;
      overflow: hidden;
      background-color: #000;
	  	  max-height: 600px;
    }
    .card-image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    /*首页产品*/
 .products-section {
      width: 100%;
      padding: 0.6rem 0.8rem;
      margin: 0 auto;
      position: relative;
      background: #eef0f2;
    }
    .swiper-outer-wrapper {
      position: relative;
      width: 100%;
      padding: 50px 0 60px 0;
    }
    .products-section .swiper {
      width: 100%;
      overflow: visible;
    }
    /* 滑块渲染优化：开启 GPU 硬件加速以实现极致丝滑 */
     .productSwiper .swiper-slide {
      width: 100%;
      transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1), opacity 0.6s ease, filter 0.6s ease;
      opacity: 0.4;
      transform: scale(0.9) translateZ(0);
      filter: blur(2px);
      pointer-events: auto;
      will-change: transform, opacity, filter;
      backface-visibility: hidden;
    }
    .productSwiper .swiper-slide-active {
      opacity: 1;
      transform: scale(1.05) translateZ(0);
      filter: blur(0px);
      z-index: 10;
    }
    .tpc-card {
      position: relative;
      height: 440px;
      background-color: #ffffff;
      border-radius: 24px;
      overflow: hidden;
      cursor: pointer;
      box-shadow: 0 20px 45px rgba(0, 0, 0, 0.08);
      border: 1px solid rgba(255, 255, 255, 0.6);
      transform: translateZ(0);
      will-change: transform;
    }
    .tpc-img-wrapper {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 1;
      clip-path: circle(0% at 50% 50%);
      will-change: clip-path;
    }
    .tpc-img-wrapper img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
    .tpc-img-wrapper::after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(180deg, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.85) 100%);
      pointer-events: none;
    }
    /* 内部排版优化：放大内容与边距 */
    .tpc-body {
      position: relative;
      z-index: 2;
      height: 100%;
      padding: 44px 40px;
      display: flex;
      flex-direction: column;
      pointer-events: none;
    }
    /* 放大图标 */
    .tpc-icon {
      width: 68px;
      height: 68px;
      margin-bottom: auto;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: filter 0.4s ease;
    }
    .tpc-icon svg {
      width: 100%;
      height: 100%;
    }
    .tpc-info {
      margin-top: auto;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
    }
    /* 放大标题 */
    .tpc-title {
      font-size: 32px;
      font-weight: 700;
      line-height: 1.25;
      color: #1a1a1a;
      margin-bottom: 16px;
      transition: color 0.4s ease;
    }
    /* 放大描述文案 */
    .tpc-desc {
      font-size: 17px;
      line-height: 1.65;
      color: #555555;
      margin-bottom: 28px;
      transition: color 0.4s ease;
    }
    /* 放大按钮 */
    .tpc-btn {
         display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    background-color: var(--accent-blue);
    padding: 0 24px;
    border-radius: 30px;
    text-decoration: none;
    line-height: 0.4rem;
    height: 0.4rem;
    pointer-events: auto;
    transition: all 0.4s ease;
    }
    .tpc-btn span {
      font-size: 18px;
      transition: transform 0.3s ease;
    }
    .tpc-btn:hover span {
      transform: translate(3px, -3px);
    }
    /* Hover 悬停响应状态 */
    .tpc-card.is-hovered .tpc-title { color: #ffffff; }
    .tpc-card.is-hovered .tpc-desc { color: rgba(255, 255, 255, 0.9); }
    .tpc-card.is-hovered .tpc-icon { filter: brightness(0) invert(1); }
    .tpc-card.is-hovered .tpc-btn {
      background-color: #ffffff;
      color: #111111;
      box-shadow: 0 6px 20px rgba(0,0,0,0.25);
    }
    /* 导航按钮 */
    .swiper-nav-btn {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      width: 68px;
      height: 68px;
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.85);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      box-shadow: 0 10px 25px rgba(0,0,0,0.12);
      border: 1px solid rgba(255, 255, 255, 0.9);
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      color: #111;
      z-index: 20;
      transition: all 0.3s ease;
    }
    .swiper-nav-btn:hover {
      background: #ffffff;
      transform: translateY(-50%) scale(1.1);
      box-shadow: 0 12px 30px rgba(0,0,0,0.18);
    }
    .btn-prev { left: calc(50% - 400px); }
    .btn-next { right: calc(50% - 400px); }
    @media (max-width: 768px) {
      .swiper-nav-btn { width: 52px; height: 52px; }
      .btn-prev { left: 10px; }
      .btn-next { right: 10px; }
      .tpc-card { height: 460px; }
      .tpc-title { font-size: 24px; }
      .tpc-desc { font-size: 15px; }
      .swiper-slide-active { transform: scale(1.05); }
    }
/* 按钮容器 */
.view-more-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 0.6rem; /* 与上边轮播图的间距 */
}
/* 按钮基础样式（还原设计图：深色椭圆、黄色箭头） */
.view-more-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background-color: #22252a; /* 深灰色背景 */
  color: #ffffff;            /* 白色文字 */
  font-size: 16px;
  font-weight: 600;
  padding: 14px 32px;
  border-radius: 50px;      /* 胶囊圆角 */
  text-decoration: none;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}
/* 箭头颜色 */
.view-more-btn .arrow {
  color: var(--accent-blue);            /* 亮黄色箭头 */
  font-size: 18px;
  font-weight: bold;
  display: inline-block;
  transition: transform 0.3s ease;
}
/* 悬停效果 (Hover State) */
.view-more-btn:hover {
  background-color: var(--accent-blue); /* 悬停时转为主题绿色（可按需改为 #000） */
  color: #ffffff;
  transform: translateY(-2px); /* 轻微上浮 */
  box-shadow: 0 8px 20px rgba(14, 165, 225, 0.25);
}
/* 悬停时箭头的位移动画 */
.view-more-btn:hover .arrow {
  transform: translate(3px, -3px); /* 箭头向右上角微动 */
  color: #ffffff;                   /* 悬停时箭头变白（如需保持黄色删除此行） */
}
/* 点击按下效果 */
.view-more-btn:active {
  transform: translateY(0);
} 
/*客户案例*/
/* 合作伙伴区域容器 */
.case-section {
    width: 100%;
    padding: 0.2rem 0.8rem;
      margin: 0 auto;
          background: #eef0f2;
    }
    /* Swiper 跑马灯样式 */
    .partnerSwiper {
      width: 100%;
      margin: 40px 0;
      padding: 10px 0;
      user-select: none; /* 防止拖拽时选中文字或SVG */
    }
    /* 匀速无缝滚动核心 */
    .partnerSwiper .swiper-wrapper {
      transition-timing-function: linear !important;
    }
    .partner-item {
      display: flex;
      align-items: center;
      justify-content: center;
      height: 50px;
          filter: none;
          opacity: 1;
    }
    /* SVG Logo 样式、灰度与悬停效果 */
    .logo-svg {
      width: 180px;
      height: 47px;
      filter: grayscale(100%);
      opacity: 0.5;
      transition: filter 0.3s ease, opacity 0.3s ease, transform 0.3s ease;
      pointer-events: none; /* 优化拖拽手感 */
    }
    .partner-item:hover .logo-svg {
      filter: grayscale(0%);
      opacity: 1;
      transform: scale(1.08);
    }
/*客户案例*/
.testimonial-section {
      position: relative;
      /* 视差背景核心属性 */
      background-image: url('https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?w=1920&q=80'); /* 可替换为你自己的工厂/背景图片链接 */
      background-size: cover;
      background-position: center;
      background-attachment: fixed; /* 开启视差滚动效果 */
      padding: 2rem 0.8rem;
      overflow: hidden;
    }
    /* 半透明深色遮罩：确保背景图不会太亮，压暗后文字更清晰 */
    .testimonial-section::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(26, 29, 33, 0.35); /* 85%不透明度的深色滤镜 */
      z-index: 1;
    }
    /* 让内部内容层级高于遮罩 */
    .testimonial-section > * {
      position: relative;
      z-index: 2;
    }
    .testimonial-header {
      text-align: center;
      font-size: 36px;
      font-weight: 700;
      margin-bottom: 50px;
      letter-spacing: -0.5px;
      color: #ffffff;
    }
    .testimonial-section-inner {
      max-width: 1200px;
      margin: 0 auto;
      padding: 0 20px;
    }
    .testimonial-swiper-container {
      width: 100%;
      padding: 20px 10px 50px;
    }
    /* Swiper 幻灯片等高处理 */
    .testimonial-swiper-container .swiper-slide {
      height: auto;
      display: flex;
    }
    /* 卡片设计 */
    .testimonial-card {
      background: #ffffff;
      color: #333333;
      border-radius: 16px;
      padding: 36px 28px;
      box-shadow: 0 15px 35px rgba(0, 0, 0, 0.3);
      width: 100%;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      transition: transform 0.3s ease, box-shadow 0.3s ease;
    }
    .testimonial-card:hover {
      transform: translateY(-5px);
      box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
    }
    .testimonial-text {
      font-size: 15px;
      font-style: italic;
      line-height: 1.6;
      color: #444444;
      margin-bottom: 24px;
      flex-grow: 1;
    }
    .testimonial-text span.highlight {
      color: #d81b60;
      font-weight: 600;
      font-style: normal;
    }
    /* 客户信息区域 */
    .client-info {
      display: flex;
      align-items: center;
      gap: 14px;
      border-top: 1px solid #f0f0f0;
      padding-top: 20px;
      margin-top: auto;
    }
    .client-avatar {
      width: 48px;
      height: 48px;
      border-radius: 50%;
      object-fit: cover;
    }
    .client-details .client-name {
      font-size: 16px;
      font-weight: 700;
      color: #111111;
      margin-bottom: 2px;
    }
    .client-details .client-location {
      font-size: 13px;
      color: #007bff;
    }
    /* 自定义 Swiper 分页器 */
    .testimonial-swiper-container .swiper-pagination-bullet {
      background: #ffffff;
      opacity: 0.4;
      width: 10px;
      height: 10px;
    }
    .testimonial-swiper-container .swiper-pagination-bullet-active {
      opacity: 1;
      background: var(--accent-blue);
      width: 24px;
      border-radius: 5px;
      transition: width 0.3s ease;
    }
/*首页新闻*/
.news-section {
            position: relative;
            width: 100%;
            min-height: 100vh;
            align-items: center;
            overflow: hidden;
            background-color: #eef0f3;
            padding: 0.6rem 0.8rem;
        }
.bg-k {
  position: absolute;
  top: 7%;
  left: 1%;
  width: 550px;  /* 根据需要调整宽度 */
  z-index: 1;    /* 放在底层 */
  pointer-events: none; /* 防止遮挡鼠标点击事件 */
}
.news-container, 
.news-section .top-header-tag {
  position: relative;
  z-index: 2;
}
        .news-container {
            position: relative;
            z-index: 2;
            width: 100%;
            max-width: 1400px;
            margin: 0 auto;
            padding: 0 40px;
        }
        .news-pagination-counter {
            text-align: right;
            font-size: 24px;
            font-weight: 600;
            color: #222;
            margin-bottom: 20px;
            letter-spacing: 1px;
        }
        .news-pagination-counter .current {
            font-size: 40px;
            color: var(--accent-blue);
        }
        .news-pagination-counter .total {
            color: var(--accent-blue);
            font-size: 20px;
        }
        /* 独立命名，避免全局污染 */
        .news-swiper {
            width: 100%;
            padding: 20px 0 80px 0 !important;
            overflow: visible !important;
        }
        .news-slide {
            background: #ffffff;
            border-radius: 16px;
            overflow: hidden;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.44);
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            height: 500px;
            opacity: 0.55;
            transform: scale(0.92);
            transition: all 0.4s ease;
        }
         .news-wrapper .swiper-slide-active {
            opacity: 1;
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
            z-index: 10;
            border:2px solid  var(--accent-blue);
        }
        .news-card-content {
            padding: 24px 30px 10px 30px;
            flex-grow: 1;
        }
        .news-date {
            font-size: 13px;
            color: #888;
            margin-bottom: 8px;
        }
        .news-title {
            font-size:20px;
            line-height: 1.4;
            color: #222;
            font-weight: 600;
            margin-bottom: 12px;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
            font-family: Noto Sans;
        }
        .news-desc {
            font-size: 14px;
            line-height: 1.5;
            color: #666;
            display: -webkit-box;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }
        .news-card-image {
            width: 100%;
            height: 150px;
            background-color: #111;
            overflow: hidden;
            position: relative;
            transition: height 0.4s ease;
        }
         .news-wrapper .swiper-slide-active .news-card-image {
            height: 282px;
        }
        .news-card-image img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: all 0.5s ease;
        }
        .news-slide:not(.swiper-slide-active) .news-card-image img {
            transform: scale(1.05); 
        }
        .news-controls-row {
            display: flex;
            align-items: center;
            justify-content: flex-start;
            margin-top: 40px;
            position: relative;
        }
        .news-nav-buttons {
            display: flex;
            gap: 12px;
        }
        .news-button-prev,
        .news-button-next {
            width: 70px;
            height: 70px;
            border-radius: 50%;
            background-color: #ffffff;
            border: none;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow: 0 4px 12px rgba(0,0,0,0.08);
            transition: all 0.2s ease;
        }
        .news-button-prev:hover,
        .news-button-next:hover {
            background-color: var(--accent-blue);
            color: #fff;
        }
        .news-button-prev svg,
        .news-button-next svg {
            width: 30px;
            height: 30px;
            fill: currentColor;
        }
        @media (max-width: 1024px) {
            .news-container {
                padding: 0 20px;
            }
        }
        @media (max-width: 768px) {
            .news-controls-row {
                flex-direction: column;
                gap: 20px;
                align-items: stretch;
            }
            .news-more-btn {
                margin-left: 0;
                justify-content: center;
            }
        }
/*首页表单提交*/
.ccta-section {
  background-color: #eef0f3; /* 与上一区间的浅灰底色保持协调 */
  padding: 0 20px 1rem 20px;
}
.ccta-container {
  max-width: 1300px;
  margin: 0 auto;
  background-color: #ffffff;
  border-radius: 16px;
  padding: 30px 48px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}
/* 文案区域 */
.ccta-content {
  flex: 1;
  max-width: 420px;
}
.ccta-title {
font-size: 28px;
    font-weight: 600;
    color: #111827;
    line-height: 1.55;
    margin-bottom: 35px;
    font-family: "Noto Sans";
}
.ccta-desc {
  font-size: 14px;
  color: #6b7280;
  line-height: 1.5;
  margin: 0;
}
/* 表单区域 */
.ccta-form {
  flex: 1.2;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.ccta-input-group {
  flex: 1 1 calc(50% - 6px); /* Name 和 Email 并排 */
}
/* 需求输入框独占一行 */
.ccta-input-group:nth-child(3) {
  flex: 1 1 100%;
}
.ccta-form input {
  width: 100%;
  height: 48px;
  padding: 0 16px;
  background-color: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  font-size: 14px;
  color: #1f2937;
  outline: none;
  transition: all 0.2s ease;
  box-sizing: border-box;
}
.ccta-form input:focus {
  background-color: #ffffff;
  border-color: #1d4ed8; /* 匹配 kintonti 品牌蓝色 */
  box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.1);
}
.ccta-form input::placeholder {
  color: #9ca3af;
}
/* 按钮样式（与页面的 More News 按钮胶囊风/黑色系或蓝色系呼应） */
.ccta-btn {
  width: 100%;
  height: 48px;
  background-color: #22252a; /* 或使用品牌蓝 #0052cc */
  color: #ffffff;
  border: none;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: background-color 0.2s ease, transform 0.1s ease;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}
.ccta-btn .arrow {
  color: var(--accent-blue);            /* 亮黄色箭头 */
  font-size: 18px;
  font-weight: bold;
  display: inline-block;
  transition: transform 0.3s ease;
}
.ccta-btn:hover {
    background-color: var(--accent-blue); /* 悬停时转为主题绿色（可按需改为 #000） */
  color: #ffffff;
  transform: translateY(-2px); /* 轻微上浮 */
  box-shadow: 0 8px 20px rgba(14, 165, 225, 0.25);
}
.ccta-btn:hover .arrow {
  transform: translate(3px, -3px); /* 箭头向右上角微动 */
  color: #ffffff;                   /* 悬停时箭头变白（如需保持黄色删除此行） */
} {
  transform: scale(0.99);
}
.ccta-btn:active {
  transform: scale(0.99);
}
/* 移动端响应式适配 */
@media (max-width: 992px) {
  .ccta-container {
    flex-direction: column;
    padding: 32px 24px;
    gap: 24px;
  }
  .ccta-content {
    max-width: 100%;
    text-align: center;
  }
  .ccta-form {
    width: 100%;
  }
  .ccta-input-group {
    flex: 1 1 100%; /* 移动端全宽堆叠 */
  }
}
/*网站底部*/
.footer {
  background-color: #1a1c1e;
  color: #8c9095;
  font-size: 14px;
  padding: 0.6rem 0.8rem;
}
.footer-container {
  margin: 0 auto;
  padding: 0 20px;
}
.footer a {
  color: #8c9095;
  text-decoration: none;
  transition: color 0.3s;
}
.footer a:hover {
  color: var(--accent-blue);
}
/* 上半部分布局 */
.footer-top {
  display: flex;
  justify-content: space-between;
  margin-bottom: 40px;
}
.footer-brand img {
  height: 80px;
  width:220xpx;
}
.footer-nav {
  display: flex;
  gap: 100px;
}
.footer-column h4 {
  color: #ffffff;
  font-size: 16px;
  margin-bottom: 16px;
  font-weight: 600;
}
.footer-column ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.footer-column li {
  margin-bottom: 18px;
}
/* 中间联系方式与社交栏 */
.footer-middle {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  padding-bottom: 30px;
}
.footer-contact p {
  margin: 8px 0;
}
.footer-social {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}
.social-title {
  color: var(--accent-blue); /* 品牌黄色 */
  font-weight: bold;
}
.social-icons {
  display: flex;
  gap: 12px;
}
.social-icon {
  width: 36px;
  height: 36px;
  background-color: #ffffff;
  color: #1a1c1e;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
}
.social-icon:hover {
  background-color: var(--accent-blue);
  color: #000000;
}
/* 底部版权栏 */
.footer-bottom {
  border-top: 1px solid #2d3035;
  padding-top: 20px;
  display: flex;
  justify-content: space-between;
  font-size: 13px;
}
/* Background Soft Glow Decorators */
        .glow-sphere {
            position: absolute;
            border-radius: 50%;
            filter: blur(1.4rem);
            pointer-events: none;
            z-index: 1;
        }
        .glow-1 { top: -1rem; left: 50%; transform: translateX(-50%); width: 6rem; height: 6rem; background: rgba(37, 99, 235, 0.05); }
        .glow-2 { top: 30%; right: -1rem; width: 5rem; height: 5rem; background: rgba(2, 132, 199, 0.06); }
        /* Light Glass Header */
        /* Hero Section Styling */
        .hero { 
            position: relative;
            padding: 3rem 6% 1.1rem; 
            text-align: center; 
            background: linear-gradient(180deg, #FFFFFF 0%, var(--bg-main) 100%);
            border-bottom: 1px solid var(--border-color);
            height: 100vh;
        }
        .hero h1 { font-size: clamp(0.38rem, 5vw, 0.6rem); line-height: 1.15; max-width: 10.5rem; margin: 0 auto 0.45rem; color: var(--text-light); }
        .hero p { font-size: 0.184rem; color: var(--bg-subtle); max-width: 7.2rem; margin: 0 auto 0.5rem; font-weight: 300; line-height: 1.7;}
        .container { width: 100%;    padding: 1rem 0.8rem; background: #eef0f2; }
        .section-header { text-align: center; max-width: 7rem; margin: 0 auto 0.6rem; }
        .section-header h2 { font-size: 0.35rem; margin-bottom: 0.15rem; color: var(--text-main); }
        .section-header p { color: var(--text-muted); font-size: 0.16rem; }
        .grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(3.2rem, 1fr)); gap: 0.3rem; }
        /* Modern White Cards - Namespace Isolated to solutions-card */
        .solutions-card { 
            background: var(--bg-subtle); 
            border: 1px solid var(--border-color); 
            padding: 0.35rem; 
            border-radius: 0.16rem; 
            transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1); 
            position: relative;
            overflow: hidden;
            box-shadow: 0 0.04rem 0.2rem rgba(0, 0, 0, 0.03);
        }
        .solutions-card:hover { 
            transform: translateY(-0.06rem); 
            border-color: var(--border-light); 
            box-shadow: 0 0.2rem 0.4rem rgba(15, 23, 42, 0.08); 
        }
        .solutions-card h3 { font-size: 0.216rem; margin-bottom: 0.12rem; color: var(--text-main); }
        .solutions-card p { color: var(--text-muted); font-size: 0.152rem; }
        /* Product Cards Upgrade */
        .product-card { display: flex; flex-direction: column;  padding: 0; }
        .product-card-body { padding: 0.3rem; }
        .product-img-wrapper { overflow: hidden; height: 2.2rem; width: 100%; position: relative; border-bottom: 1px solid var(--border-color); background: var(--bg-subtle); }
        .product-img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1); opacity: 0.95; }
        .product-card:hover .product-img { transform: scale(1.06); opacity: 1; }
        .product-card ul { list-style: none; margin: 0.2rem 0; padding: 0; border-top: 1px solid var(--border-color); padding-top: 0.15rem; }
        .product-card ul li { color: var(--text-muted); font-size: 0.14rem; margin-bottom: 0.08rem; display: flex; align-items: center; gap: 0.08rem; }
        .solutions .product-card ul li::before { content: "―"; color: var(--primary-accent); font-weight: bold; }
        .badge { display: inline-block; background: rgba(2, 132, 199, 0.08); border: 1px solid rgba(2, 132, 199, 0.2); color: var(--primary-accent); padding: 0.04rem 0.12rem; border-radius: 1rem; font-size: 0.12rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 0.15rem; }
        /* High-End Clean Buttons */
        .btn { 
          display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-dark);
    border: 1px solid var(--text-black);
    color: #FFF;
    padding: 0.14rem 0.32rem;
    text-decoration: none;
    border-radius: 0.08rem;
    font-size: 0.152rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    position: relative;
    z-index: 2;
        }
        .btn:hover { 
            background: var(--primary-accent); 
            border-color: var(--primary-accent);
            box-shadow: 0 0.1rem 0.25rem var(--primary-glow);
            transform: translateY(-0.02rem); 
        }
        /* Case Studies Section */
        .case-card { background: #FFFFFF; }
        .stat-grid { width: 100%; display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.15rem; margin-top: 0.25rem; padding-top: 0.2rem; border-top: 1px solid var(--border-color); }
        .stat-box { background: var(--bg-subtle); padding: 0.15rem; border-radius: 0.1rem; border: 1px solid var(--border-color); text-align: left; }
        .stat-number { font-size: 0.32rem; font-family: var(--font-heading); color: var(--primary-accent); font-weight: 700; line-height: 1; margin-bottom: 0.05rem; }
        .stat-box div:last-child { font-size: 0.125rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 500; }
        /* Accordion FAQ Style */
        .faq-item { 
            background: var(--bg-card); 
            border: 1px solid var(--border-color); 
            border-radius: 0.12rem; 
            margin-bottom: 0.16rem; 
            padding: 0.24rem 0.3rem; 
            cursor: pointer; 
            transition: all 0.3s ease; 
            box-shadow: 0 0.02rem 0.1rem rgba(0,0,0,0.02);
        }
        .faq-item:hover { border-color: var(--border-light); box-shadow: 0 0.08rem 0.25rem rgba(0,0,0,0.05); }
        .faq-item h3 { margin: 0; color: var(--text-main); font-size: 0.176rem; position: relative; padding-right: 0.4rem; font-weight: 600; }
        .faq-item h3::after { content: '+'; position: absolute; right: 0; top: 50%; transform: translateY(-50%); font-size: 0.224rem; transition: transform 0.4s ease; color: var(--primary-accent); font-weight: 400; }
        .faq-item.active h3::after { transform: translateY(-50%) rotate(45deg); }
        .faq-answer { display: none; padding-top: 0.18rem; border-top: 1px solid var(--border-color); margin-top: 0.15rem; }
        .faq-answer p { margin: 0; color: var(--text-muted); font-size: 0.152rem; }
        /* Light Technical Table */
        .table-wrapper { overflow-x: auto; border-radius: 0.12rem; border: 1px solid var(--border-color); background: var(--bg-card); box-shadow: 0 0.04rem 0.2rem rgba(0,0,0,0.02); }
        table { width: 100%; border-collapse: collapse; text-align: left; }
        th, td { padding: 0.18rem 0.24rem; border-bottom: 1px solid var(--border-color); font-size: 0.147rem; }
        th { background: var(--bg-subtle); color: var(--text-main); font-weight: 600; font-family: var(--font-heading); letter-spacing: 0.05em; text-transform: uppercase; font-size: 0.128rem; }
        td { color: var(--text-muted); }
        .solutions tr:last-child td { border-bottom: none; }
        tbody tr:hover { background: rgba(241, 245, 249, 0.6); }
.solutions-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.solution .card-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 86px;
    height: 86px;
    margin-bottom: 0.5rem;
    border-radius: 8px;
    background-color: rgba(0, 102, 204, 0.1); /* Soft background accent */
    color: var(--accent-blue); /* Brand accent color */
}
/*产品*/
/* GEO Highlight Block: B2B Advantages Grid */
        .advantages-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(2.8rem, 1fr));
            gap: 0.25rem;
            margin-bottom: 0.8rem;
        }
        .adv-card {
            background: var(--bg-card);
            border: 1px solid var(--border-color);
            border-radius: 0.14rem;
            padding: 0.3rem 0.25rem;
            transition: all 0.3s ease;
            box-shadow: 0 0.02rem 0.1rem rgba(0,0,0,0.02);
        }
        .adv-card:hover {
            border-color: var(--primary-accent);
            transform: translateY(-0.04rem);
            box-shadow: 0 0.12rem 0.3rem rgba(2, 132, 199, 0.08);
        }
        .adv-icon { font-size: 0.32rem; color: var(--primary-accent); margin-bottom: 0.15rem; font-weight: 700; }
        .adv-card h3 { font-size: 0.18rem; margin: 0 0 0.1rem 0; color: var(--text-main); font-weight: 700; }
        .adv-card p { font-size: 0.14rem; color: var(--text-muted); margin: 0; line-height: 1.5; }
        /* Filter Tabs Control */
        .filter-wrapper {
            display: flex;
            justify-content: center;
            gap: 0.12rem;
            margin-bottom: 0.5rem;
            flex-wrap: wrap;
        }
        .filter-btn {
            background: var(--bg-card);
            border: 1px solid var(--border-color);
            color: var(--text-muted);
            padding: 0.1rem 0.24rem;
            border-radius: 0.5rem;
            font-size: 0.14rem;
            font-weight: 300;
            cursor: pointer;
            transition: all 0.3s ease;
            box-shadow: 0 0.02rem 0.08rem rgba(0,0,0,0.02);
        }
        .filter-btn:hover, .filter-btn.active {
            background: var(--primary-accent);
            color: #FFFFFF;
            border-color: var(--primary-accent);
            box-shadow: 0 0.08rem 0.2rem var(--primary-glow);
        }
        /* Product Grid & Card Styling */
        .grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(3.5rem, 1fr)); gap: 0.35rem; }
        .solutions-card { 
            background: var(--bg-card); 
            border: 1px solid var(--border-color); 
            border-radius: 0.16rem; 
            transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1); 
            position: relative;
            overflow: hidden;
            box-shadow: 0 0.04rem 0.2rem rgba(0, 0, 0, 0.03);
            display: flex;
            flex-direction: column;
            justify-content: space-between;
        }
        .solutions-card:hover { 
            transform: translateY(-0.08rem); 
            border-color: var(--border-light); 
            box-shadow: 0 0.2rem 0.4rem rgba(15, 23, 42, 0.08); 
        }
        .pro-list .product-img-wrapper { 
            overflow: hidden; 
            height: 3.5rem; 
            position: relative; 
            border-bottom: 1px solid var(--border-color); 
            background: var(--bg-subtle); 
        }
        .product-img { 
            width: 100%; 
            height: 100%; 
            object-fit: cover; 
            transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1); 
            opacity: 0.95; 
        }
        .solutions-card:hover .product-img { transform: scale(1.06); opacity: 1; }
       .product .product-card-body { padding: 0.3rem; flex-grow: 1; display: flex; flex-direction: column; justify-content: space-between; }
        .badge-group { display: flex; gap: 0.08rem; flex-wrap: wrap; margin-bottom: 0.15rem; }
        .badge { 
            display: inline-block; 
            background: rgba(2, 132, 199, 0.08); 
            border: 1px solid rgba(2, 132, 199, 0.2); 
            color: var(--primary-accent); 
            padding: 0.04rem 0.12rem; 
            border-radius: 1rem; 
            font-size: 0.12rem; 
            font-weight: 600; 
            text-transform: uppercase; 
            letter-spacing: 0.05em; 
        }
        .badge-secondary {
            background: rgba(100, 116, 139, 0.08);
            border-color: rgba(100, 116, 139, 0.2);
            color: var(--color-text-muted);
        }
        .solutions-card h3 { font-size: 0.216rem; margin: 0 0 0.12rem 0; color: var(--text-main); font-weight: 700; }
        .solutions-card p { color: var(--text-muted); font-size: 0.148rem; line-height: 1.55; margin-bottom: 0.18rem; }
        /* Technical Property List for GEO Search Engines */
        .tech-features {
            background: var(--bg-subtle);
            border-radius: 0.08rem;
            padding: 0.12rem 0.15rem;
            margin-bottom: 0.18rem;
        }
        .tech-features-title { font-size: 0.125rem; font-weight: 700; text-transform: uppercase; color: var(--text-main); letter-spacing: 0.05em; margin-bottom: 0.06rem; }
        .tech-features-list { list-style: none; padding: 0; margin: 0; font-size: 0.132rem; color: var(--text-muted); }
        .tech-features-list li { margin-bottom: 0.04rem; display: flex; justify-content: space-between; }
        .tech-features-list span { font-weight: 600; color: var(--text-main); }
        .specs-list { list-style: none; margin: 0 0 0.25rem 0; padding: 0.15rem 0 0 0; border-top: 1px solid var(--border-color); }
        .specs-list li { color: var(--text-muted); font-size: 0.138rem; margin-bottom: 0.08rem; display: flex; align-items: center; gap: 0.08rem; }
        .specs-list li::before { content: "―"; color: var(--primary-accent); font-weight: bold; }
        /* Metrics Grid */
        .section-header { text-align: center; max-width: 7.5rem; margin: 0.9rem auto 0.5rem; }
        .section-header h2 { font-size: 0.32rem; margin-bottom: 0.12rem; color: var(--text-main); font-weight: 700; }
        .section-header p { color: var(--text-muted); font-size: 0.16rem; }
        .product .stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.2rem; margin: 0.4rem 0 0.8rem; }
        .stat-box { background: var(--bg-card); padding: 0.25rem 0.2rem; border-radius: 0.12rem; border: 1px solid var(--border-color); text-align: center; box-shadow: 0 0.02rem 0.1rem rgba(0,0,0,0.02); }
        .stat-number { font-size: 0.38rem; font-family: var(--font-heading); color: var(--primary-accent); font-weight: 800; line-height: 1; margin-bottom: 0.08rem; }
        .stat-label { font-size: 0.13rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600; }
/*产品列表*/
/* Page Banner */
        .page-banner {
            background: #eef0f2;
            border-bottom: 1px solid var(--border-color);
            padding: 0.8rem 6% 0.5rem;
            text-align: center;
        }
        .page-banner h1 { font-size: clamp(0.32rem, 4vw, 0.48rem); font-weight: 800; margin: 0 0 0.15rem; color: var(--text-main); }
        .page-banner p { font-size: 0.17rem; color: var(--text-muted); max-width: 7.5rem; margin: 0 auto; }
        /* Catalog Layout Grid */
        .catalog-container {
           background: #eef0f2;
            width: 100%;
             padding: 0 0.8rem;
           padding-top: 0.5rem;
            display: grid;
            grid-template-columns: 2.8rem 1fr;
            gap: 0.4rem;
            align-items: start;
        }
        #faq{
          background: #eef0f2;
        }
        .sr-only{
          color: #000;
          margin-bottom: 0.3rem;
        }
        /* Sidebar Filter */
        .filter-sidebar {
            background: var(--bg-card);
            border: 1px solid var(--border-color);
            border-radius: 0.14rem;
            padding: 0.25rem;
            box-shadow: 0 0.02rem 0.1rem rgba(0,0,0,0.02);
            box-sizing: border-box;
            max-height: calc(100vh - 1.2rem);
            overflow-y: auto;
        }
        .filter-group { margin-bottom: 0.25rem; }
        .filter-group:last-child { margin-bottom: 0; }
        .filter-title { font-size: 0.15rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-main); margin-bottom: 0.12rem; display: flex; justify-content: space-between; align-items: center; }
        .filter-options { list-style: none; padding: 0; margin: 0; }
        .filter-options li { margin-bottom: 0.08rem; }
        .filter-checkbox { display: flex; align-items: center; gap: 0.08rem; font-size: 0.14rem; color: var(--text-muted); cursor: pointer; }
        .filter-checkbox input { accent-color: var(--primary-accent); cursor: pointer; }
        /* Search Input */
        .catalog-container .search-box {
            width: 100%;
            padding: 0.1rem 0.14rem;
            border: 1px solid var(--border-color);
            border-radius: 0.06rem;
            font-size: 0.138rem;
            background: var(--bg-subtle);
            box-sizing: border-box;
            margin-bottom: 0.15rem;
        }
        .catalog-container .search-box:focus { outline: none; border-color: var(--primary-accent); background: #FFF; }
        /* Toolbar Controls */
        .catalog-toolbar {
            display: flex;
            justify-content: space-between;
            align-items: center;
            background: var(--bg-card);
            border: 1px solid var(--border-color);
            border-radius: 0.12rem;
            padding: 0.15rem 0.25rem;
            margin-bottom: 0.3rem;
        }
        .result-count { font-size: 0.14rem; color: var(--text-muted); font-weight: 500; }
        .view-controls { display: flex; gap: 0.1rem; align-items: center; }
        .view-btn {
            background: var(--bg-subtle);
            border: 1px solid var(--border-color);
            padding: 0.06rem 0.12rem;
            border-radius: 0.06rem;
            cursor: pointer;
            font-size: 0.13rem;
            font-weight: 600;
            color: var(--text-muted);
            transition: all 0.2s;
        }
        .view-btn.active { background: var(--primary-accent); color: #FFF; border-color: var(--primary-accent); }
        /* Listing Cards (Grid & List View) */
        .list-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(4.1rem, 1fr)); gap: 0.25rem; }
        .list-grid.list-view { grid-template-columns: 1fr; }
        .list-grid.list-view .product-card {
            display: grid;
            grid-template-columns: 2.2rem 1fr;
            align-items: center;
        }
        .list-grid.list-view .product-img-wrapper { height: 100%; border-bottom: none; border-right: 1px solid var(--border-color); }
        .product-card {
            background: var(--bg-card);
            border: 1px solid var(--border-color);
            border-radius: 0.12rem;
            overflow: hidden;
            transition: border-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
            box-shadow: 0 0.02rem 0.08rem rgba(0,0,0,0.02);
            opacity: 1;
        }
        .product-card:hover { border-color: var(--primary-accent); transform: translateY(-0.04rem); box-shadow: 0 0.12rem 0.25rem rgba(2, 132, 199, 0.08); }
        .product-img-wrapper { height: 2.9rem; background: var(--bg-subtle); overflow: hidden; position: relative; }
        .product-img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease; }
        .product-card:hover .product-img { transform: scale(1.05); }
        .product-info { padding: 0.2rem; }
        .product-title { font-size: 0.18rem; font-weight: 700; color: var(--text-main); margin: 0 0 0.08rem; }
        .product-desc { font-size: 0.135rem; color: var(--text-muted); line-height: 1.5; margin-bottom: 0.12rem; }
        .meta-tags { display: flex; gap: 0.06rem; flex-wrap: wrap; margin-bottom: 0.12rem; }
        .tag { font-size: 0.115rem; padding: 0.02rem 0.08rem; background: var(--bg-subtle); border: 1px solid var(--border-color); border-radius: 0.04rem; color: var(--text-black); font-weight: 500; }
        .card-action { display: flex; justify-content: space-between; align-items: center; padding-top: 0.12rem; border-top: 1px solid var(--border-color); }
        .spec-badge { font-size: 0.125rem; font-weight: 600; color: var(--primary-accent); }
        .btn-sm {
            padding: 0.06rem 0.14rem;
            font-size: 0.13rem;
            border-radius: 0.06rem;
            background: var(--text-main);
            color: #FFF;
            text-decoration: none;
            font-weight: 600;
            transition: background 0.3s;
        }
        .btn-sm:hover { background: var(--primary-accent); }
        /* Pagination */
        .pagination { display: flex; justify-content: center; gap: 0.08rem; margin-top: 0.5rem; }
        .page-link {
            padding: 0.08rem 0.16rem;
            border: 1px solid var(--border-color);
            background: var(--bg-card);
            color: var(--text-main);
            border-radius: 0.06rem;
            text-decoration: none;
            font-size: 0.14rem;
            font-weight: 600;
            cursor: pointer;
            transition: all 0.2s;
        }
        .page-link.active, .page-link:hover { background: var(--primary-accent); color: #FFF; border-color: var(--primary-accent); }
/*产品内容页*/
/* Product Hero Grid */
        .product-hero {
            width: 90%;
            max-width: 13.6rem;
            margin: 0.9rem auto 0.6rem;
            display: grid;
            grid-template-columns: 5.5rem 1fr;
            gap: 0.6rem;
        }
        /* Gallery System */
        .gallery-container { display: flex; flex-direction: column; gap: 0.15rem; }
        .main-img-box {
            width: 100%;
            height: 4.2rem;
            background: var(--bg-card);
            border: 1px solid var(--border-color);
            border-radius: 0.14rem;
            overflow: hidden;
            position: relative;
        }
        .main-img-box img { width: 100%; height: 100%; object-fit: cover; transition: opacity 0.3s; }
        .thumb-list { display: flex; gap: 0.12rem; }
        .thumb-item {
            width: 1.0rem;
            height: 0.8rem;
            border: 1px solid var(--border-color);
            border-radius: 0.08rem;
            overflow: hidden;
            cursor: pointer;
            opacity: 0.6;
            transition: all 0.2s;
            background: var(--bg-card);
        }
        .thumb-item.active, .thumb-item:hover { opacity: 1; border-color: var(--primary-accent); box-shadow: 0 0 0 0.02rem var(--primary-glow); }
        .thumb-item img { width: 100%; height: 100%; object-fit: cover; }
        /* Product Info Summary */
        .product-summary { display: flex; flex-direction: column; justify-content: center; }
        .product-tag-bar { display: flex; gap: 0.08rem; margin-bottom: 0.15rem; }
        .product-tag { font-size: 0.12rem; font-weight: 600; padding: 0.04rem 0.1rem; background: var(--accent-blue); border: 1px solid var(--border-color); border-radius: 0.04rem; color: var(--bg-white) }
        .product-title-main { font-size: 0.36rem; font-weight: 800; line-height: 1.25; margin: 0 0 0.15rem; color: var(--text-main); }
        .product-short-desc { font-size: 0.16rem; color: var(--text-muted); margin-bottom: 0.3rem; line-height: 1.6; }
        /* Quick Specs Table Grid */
        .quick-specs-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 0.15rem;
            margin-bottom: 0.35rem;
            background: var(--bg-card);
            padding: 0.2rem;
            border: 1px solid var(--border-color);
            border-radius: 0.12rem;
        }
        .spec-item { font-size: 0.138rem; }
        .spec-item label { color: var(--text-black); display: block; font-size: 0.125rem; font-weight: 500; }
        .spec-item span { color: var(--text-main); font-weight: 700; }
        /* Action Buttons */
        .action-group { display: flex; gap: 0.15rem; align-items: center; }
        .btn-outline {
            border: 1px solid var(--border-light);
            background: var(--bg-card);
            color: var(--text-main);
            padding: 0.14rem 0.25rem;
            border-radius: 0.08rem;
            text-decoration: none;
            font-size: 0.15rem;
            font-weight: 600;
            transition: all 0.3s;
        }
        .btn-outline:hover { border-color: var(--primary-accent); color: var(--primary-accent); }
        /* ================= 锚点吸顶导航条 (Sticky Anchor Bar) ================= */
    .sticky-anchor-wrapper {
    position: relative;
    width: 100%;
    background: rgba(248, 250, 252, 0.95);
    z-index: 99;
    transition: box-shadow 0.3s ease;
    margin-bottom: 0.4rem;
}
.sticky-anchor-wrapper.is-sticky {
  position: fixed;
  top: 1.5rem; /* 配合滚动后已缩小的 Header 高度 */
  left: 0;
  width: 100%;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
}
        .sticky-anchor-inner {
            width: 90%;
            max-width: 13.6rem;
            margin: 0 auto;
            display: flex;
            gap: 0.4rem;
            height: var(--anchor-nav-height);
            align-items: center;
        }
        .anchor-link {
            text-decoration: none;
            font-size: 0.15rem;
            font-weight: 700;
            color: var(--bg-dark);
            padding: 0.15rem 0;
            position: relative;
            transition: color 0.3s ease;
            cursor: pointer;
        }
        .anchor-link:hover, .anchor-link.active {
            color: var(--primary-accent);
        }
        .anchor-link.active::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 3px;
            background-color: var(--primary-accent);
            border-radius: 2px 2px 0 0;
        }
        /* ================= 单页锚点内容板块 ================= */
        .content-sections-wrapper {
            width: 90%;
            max-width: 13.6rem;
            margin: 0 auto 0.8rem;
            display: flex;
            flex-direction: column;
            gap: 0.5rem;
            color: #000;
        }
        .section-block {
            background: var(--bg-card);
            border: 1px solid var(--border-color);
            border-radius: 0.14rem;
            padding: 0.35rem;
            box-shadow: 0 0.02rem 0.1rem rgba(0,0,0,0.02);
            /* 防止锚点定位被 Header 和 Sticky Nav 遮挡 */
          scroll-margin-top: 4.5rem;
        }
        .section-block h2 {
            font-size: 0.22rem;
            font-weight: 800;
            color: var(--text-main);
            margin-top: 0;
            margin-bottom: 0.2rem;
            padding-bottom: 0.1rem;
            border-bottom: 1px solid var(--border-color);
        }
        /* Table Styling */
        .tech-table {
            width: 100%;
            border-collapse: collapse;
            margin-top: 0.15rem;
            font-size: 0.14rem;
        }
        .tech-table th, .tech-table td {
            border: 1px solid var(--border-color);
            padding: 0.12rem 0.16rem;
            text-align: left;
        }
        .tech-table th { background: var(--bg-subtle); color: var(--text-main); font-weight: 700; }
        .tech-table td { color: var(--text-muted); }   
        /* Inquiry Form Container */
        .inquiry-block {
            width: 90%;
            max-width: 13.6rem;
            margin: 0 auto 0.8rem;
            background: #FFFFFF;
            border: 1px solid var(--border-color);
            border-radius: 0.16rem;
            padding: 0.4rem;
            box-shadow: 0 0.04rem 0.2rem rgba(0,0,0,0.03);
            scroll-margin-top: calc(var(--header-height) + 0.2rem);
        }
        .inquiry-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.25rem; }
        .form-group { margin-bottom: 0.15rem; }
        .form-group label { display: block; font-size: 0.135rem; font-weight: 600; margin-bottom: 0.06rem; color: var(--text-main); }
        .form-input {
            width: 100%;
            padding: 0.12rem;
            border: 1px solid var(--border-color);
            border-radius: 0.06rem;
            font-size: 0.14rem;
            background: var(--bg-subtle);
            box-sizing: border-box;
        }
        .form-input:focus { outline: none; border-color: var(--primary-accent); background: #FFF; }
        textarea.form-input { height: 1.2rem; resize: vertical; } 
.faq-wrapper{
max-width: 1300px;
margin: 0 auto;
}
/*关于我们*/
/* ==========================================
   5. DATA METRICS SECTION
   ========================================== */
.metrics-bar {
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
  background-color: rgba(248, 250, 252, 0.5);
  padding: 0.48rem 0; /* 48px */
}
.metrics-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.32rem; /* 32px */
  text-align: center;
}
.metric-item__value {
  font-size: 0.4rem; /* 40px */
  font-weight: 800;
  color: var(--accent-blue);
  line-height: 1;
  margin-bottom: 0.08rem; /* 8px */
}
.metric-item__label {
  font-size: 0.12rem; /* 12px */
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color:#475569;
  font-weight: 600;
}
.container-about {
    max-width: var(--max-width);
    margin-left: auto;
    margin-right: auto;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}
/* ==========================================
   6. CAPABILITIES SECTION
   ========================================== */
.capabilities-section {
  padding: 0.96rem 0; /* 96px */
  background-color: var(--color-bg-white);
}
.about-header {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 0.64rem; /* 64px */
}
.about-header__title {
  font-size: 0.36rem; /* 36px */
  font-weight: 700;
  color: var(--color-primary);
}
.about-header__desc {
    color: var(--color-secondary);
    font-size: 0.16rem;
    max-width: 546px;
    margin-top: 0.16rem;
}
.cards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.32rem; /* 32px */
}
.capability-card {
  padding: 0.4rem; /* 40px */
  border-radius: 0.16rem; /* 16px */
  background-color: var(--color-bg-light);
  border: 1px solid var(--color-border);
  transition: var(--transition);
}
.capability-card:hover {
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.05);
  transform: translateY(-4px);
}
.capability-card__icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background-color: var(--accent-blue);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.2rem; /* 20px */
  margin-bottom: 0.32rem; /* 32px */
}
.capability-card__title {
  font-size: 0.2rem; /* 20px */
  font-weight: 700;
  margin-bottom: 0.12rem; /* 12px */
  color: var(--color-primary);
}
.capability-card__desc {
  font-size: 0.14rem; /* 14px */
  color: var(--color-secondary);
  margin-bottom: 0.24rem; /* 24px */
}
.capability-card__specs {
  border-top: 1px solid var(--color-border);
  padding-top: 0.16rem; /* 16px */
}
.capability-card__specs li {
  font-size: 0.12rem; /* 12px */
  font-weight: 600;
  color: var(--color-secondary);
  margin-bottom: 0.08rem; /* 8px */
  display: flex;
  align-items: center;
  gap: 0.08rem; /* 8px */
}
/* ==========================================
   7. QUALITY CONTROL SECTION (DARK THEME)
   ========================================== */
.quality-section {
  padding: 0.96rem 0; /* 96px */
  background-color: var(--color-primary);
  color: #ffffff;
}
.quality-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.64rem; /* 64px */
  align-items: center;
}
.quality-info__title {
  font-size: 0.36rem; /* 36px */
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 0.24rem; /* 24px */
}
.quality-info__desc {
  color: var(--color-accent);
  font-size: 0.14rem; /* 14px */
  margin-bottom: 0.32rem; /* 32px */
}
/* Accordion Block */
.accordion-list {
  margin-top: 0.32rem; /* 32px */
}
.accordion-item {
  border-bottom: 1px solid var(--color-border-dark);
  padding-bottom: 0.16rem; /* 16px */
  margin-bottom: 0.16rem; /* 16px */
}
.accordion-trigger {
  width: 100%;
  background: none;
  border: none;
  color: #ffffff;
  font-family: inherit;
  font-weight: 600;
  font-size: 0.16rem; /* 16px */
  text-align: left;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.08rem 0; /* 8px */
  cursor: pointer;
}
.accordion-trigger i {
  font-size: 0.12rem; /* 12px */
  transition: transform 0.3s ease;
}
.accordion-panel {
  display: none;
  font-size: 0.14rem; /* 14px */
  color: var(--color-accent);
  padding-top: 0.08rem; /* 8px */
}
.accordion-trigger.active i {
  transform: rotate(45deg);
}
/* Grid Badge Icons */
.cert-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.16rem; /* 16px */
}
.cert-card {
  padding: 0.24rem; /* 24px */
  background-color: rgba(30, 41, 59, 0.5);
  border: 1px solid var(--color-border-dark);
  border-radius: 0.16rem; /* 16px */
  text-align: center;
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
/* 悬停效果：手型光标 + 背景变蓝 */
.cert-card:hover {
  cursor: pointer; /* 鼠标变为手型 */
  background-color: var(--accent-blue); /* 此处可根据需要调整蓝色值，如 rgba(30, 58, 138, 0.8) 或 var(--color-blue) */
   box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.05);
    transform: translateY(-4px);
}
.cert-card__icon {
  font-size: 0.28rem; /* 28px */
  color: var(--color-accent);
  margin-bottom: 0.16rem; /* 16px */
}
.cert-card__title {
  font-weight: 700;
  font-size: 0.14rem; /* 14px */
}
.cert-card__sub {
  font-size: 0.12rem; /* 12px */
  color: var(--color-accent);
}
/* ==========================================
   8. TIMELINE SECTION
   ========================================== */
.timeline-section {
  padding: 0.96rem 0; /* 96px */
  background-color: var(--color-bg-light);
}
.timeline-wrapper {
  position: relative;
  border-left: 2px solid var(--color-border);
  margin-left: 0.16rem; /* 16px */
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}
.timeline-item {
  position: relative;
  padding-left: 0.32rem; /* 32px */
  margin-bottom: 0.48rem; /* 48px */
}
.timeline-item__node {
  position: absolute;
  left: -9px;
  top: 4px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background-color: var(--color-primary);
  border: 4px solid var(--color-bg-light);
}
.timeline-item__year {
  font-size: 0.14rem; /* 14px */
  font-weight: 700;
  color: var(--color-accent);
  margin-bottom: 0.04rem; /* 4px */
          position: absolute;
        left: -100px;
        top: 0;
}
.timeline-item__title {
  font-size: 0.18rem; /* 18px */
  font-weight: 700;
  margin-bottom: 0.04rem; /* 4px */
}
.timeline-item__desc {
  font-size: 0.14rem; /* 14px */
  color: var(--color-secondary);
}
/* ==========================================
   9. CTA & FOOTER
   ========================================== */
.cta-section {
  padding: 0.8rem 0; /* 80px */
  background-color: var(--color-bg-white);
}
.cta-box {
  background-color: var(--color-primary);
  color: #ffffff;
  border-radius: 0.24rem; /* 24px */
  padding: 0.48rem 0.24rem; /* 48px 24px */
  text-align: center;
}
.cta-box__title {
  font-size: 0.32rem; /* 32px */
  font-weight: 700;
  margin-bottom: 0.16rem; /* 16px */
}
.cta-box__desc {
  color: var(--color-accent);
  font-size: 0.14rem; /* 14px */
  max-width: 500px;
  margin: 0 auto 0.32rem; /* 32px */
}
.site-footer {
  background-color: var(--color-bg-light);
  border-top: 1px solid var(--color-border);
  padding: 0.48rem 0; /* 48px */
  font-size: 0.12rem; /* 12px */
  color: var(--color-secondary);
}
.site-footer__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.24rem; /* 24px */
  text-align: center;
}
.site-footer__links {
  display: flex;
  gap: 0.24rem; /* 24px */
}
/*blog*/
        /* Container & Header */
        .main-container {
            margin: 0 auto;
            padding: 0.9rem 0.8rem;
            background: #eef0f2;
        }
        .section-header {
            margin-bottom: 0.35rem;
        }
        .section-subtitle {
            font-size: 0.08rem;
            font-weight: 700;
            letter-spacing: 2px;
            color: var(--accent-blue);
            text-transform: uppercase;
            display: block;
            margin-bottom: 0.05rem;
        }
        .section-title {
            font-size: clamp(0.2rem, 3.5vw, 0.275rem);
            font-weight: 600;
            letter-spacing: -0.5px;
            color: var(--text-main);
        }
        /* B2B News Grid */
        .news-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(480px, 1fr));
            gap: 0.65rem;
        }
        /* Card Styling - High-End B2B */
        .news-card {
            background: var(--card-bg);
            border: 1px solid var(--border-color);
            border-radius: 8px; /* 极简小圆角，显得工业且专业 */
            overflow: hidden;
            display: flex;
            flex-direction: column;
            transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
        }
        .news-card:hover {
            transform: translateY(-6px);
            box-shadow: 0 20px 25px -5px rgba(15, 23, 42, 0.08);
            border-color: var(--accent-blue);
        }
        .card-image-wrap {
            position: relative;
            width: 100%;
            overflow: hidden;
            background-color: #E2E8F0;
        }
        .card-image-wrap img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
        }
        .news-card:hover .card-image-wrap img {
            transform: scale(1.06);
        }
        .card-body {
            padding: 0.2rem;
            display: flex;
            flex-direction: column;
            flex-grow: 1;
        }
        .card-meta {
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-size: 0.14rem;
            font-weight: 600;
            letter-spacing: 0.5px;
            margin-bottom: 0.1rem;
        }
        .card-tag {
              color: var(--bg-card);
    background: var(--accent-blue);
    padding: 0.05rem 0.1rem;
    border-radius: 23px;
    text-transform: uppercase;
    font-size: 0.12rem;
        }
        .card-date {
            color: var(--text-muted);
            font-weight: 500;
        }
        .card-title {
            font-size: 0.22rem;
             margin: 0.12rem 0;
            line-height: 1.4;
            color: var(--text-main);
            margin-bottom: 0.08rem;
            transition: color 0.2s ease;
                font-weight: 700;
        }
        .news-card:hover .card-title {
            color: var(--accent-blue);
        }
        .card-excerpt {
            font-size: 0.14rem;
            color: var(--text-muted);
            font-weight: 400;
            margin-bottom: 0.18rem;
            line-height: 1.6;
            display: -webkit-box;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }
        .card-footer {
            margin-top: auto;
            padding-top: 0.1rem;
            border-top: 1px solid #F1F5F9;
        }
.main-container .top-header-tag{
  justify-content:left
}
        .read-more {
            text-decoration: none;
            color: var(--text-main);
            font-weight: 600;
            display: inline-flex;
            align-items: center;
            gap: 0.05rem;
            transition: color 0.2s ease, transform 0.2s ease;
        }
        .news-card:hover .read-more {
            color: var(--accent-blue);
            transform: translateX(4px);
        }
        @media (max-width: 768px) {
            .news-grid {
                grid-template-columns: 1fr;
            }
            .main-container {
                padding: 0.6rem 0.125rem;
            }
        }
/* Pagination Styling */
        .pagination-wrapper {
            display: flex;
            justify-content: center;
            align-items: center;
            gap: 0.15rem;
            margin-top: 0.5rem;
            padding-top: 0.3rem;
            border-top: 1px solid var(--border-color);
        }
        .page-btn, .page-num {
            background: var(--card-bg);
            border: 1px solid var(--border-color);
            color: var(--text-main);
            font-family: var(--font-family);
            font-size: 0.14rem; /* 14px */
            font-weight: 600;
            padding: 0.08rem 0.16rem;
            border-radius: 4px;
            cursor: pointer;
            transition: all 0.2s ease;
        }
        .page-num {
            min-width: 0.36rem;
            text-align: center;
        }
        .page-btn:hover:not(:disabled),
        .page-num:hover:not(.active) {
            border-color: var(--accent-blue);
            color: var(--accent-blue);
        }
        .page-num.active {
            background: var(--accent-blue);
            color: #FFFFFF;
            border-color: var(--accent-blue);
        }
        .page-btn:disabled {
            opacity: 0.4;
            cursor: not-allowed;
        }
        .page-numbers {
            display: flex;
            gap: 0.08rem;
        }
/*faq*/
/* FAQ  页面 */
.lh-faq-hero {
            position: relative;
            background: linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #090d16 100%);
            color: #ffffff;
           padding: 1.8rem 0 1rem 0;
            border-bottom: 1px solid #1e293b;
            overflow: hidden;
        }
        .lh-faq-hero__grid {
            position: absolute;
            inset: 0;
            background-image: radial-gradient(rgba(255, 255, 255, 0.1) 1px, transparent 1px);
            background-size: 0.24rem 0.24rem;
            opacity: 0.2;
            pointer-events: none;
        }
        .lh-faq-hero__glow {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 6rem;
            height: 3rem;
            background: rgba(2, 132, 199, 0.12);
            filter: blur(120px);
            border-radius: 50%;
            pointer-events: none;
        }
        .lh-faq-hero__container {
            max-width: 11rem;
            margin: 0 auto;
            padding: 0 0.16rem;
            text-align: center;
            position: relative;
            z-index: 10;
        }
        .lh-faq-hero__badge {
            display: inline-flex;
            align-items: center;
            gap: 0.06rem;
            font-size: 0.18rem;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.1em;
            color: #38bdf8;
            background: rgba(56, 189, 248, 0.1);
            border: 1px solid rgba(56, 189, 248, 0.2);
            padding: 0.06rem 0.14rem;
            border-radius: var(--radius-full);
            margin-bottom: 0.16rem;
        }
        .lh-faq-hero__title {
             font-size: clamp(0.38rem, 5vw, 0.6rem);
    line-height: 1.15;
    max-width: 10.5rem;
    margin: 0 auto 0.45rem;
    color: var(--text-light);
        }
        .lh-faq-hero__title span{
            color: rgb(56 189 248 / var(--tw-text-opacity, 1));
        }
        .lh-faq-hero__subtitle {
         font-size: 0.184rem;
    color: var(--bg-subtle);
    max-width: 7.2rem;
    margin: 0 auto 0.5rem;
    font-weight: 300;
    line-height: 1.7;
        }
        .lh-faq-hero__search-box {
            margin-top: 0.32rem;
            max-width: 5.76rem;
            margin-left: auto;
            margin-right: auto;
        }
        .lh-search-input-group {
            position: relative;
            display: flex;
            align-items: center;
        }
        .lh-search-input-group__icon {
            position: absolute;
            left: 0.16rem;
            color: var(--color-text-light);
            pointer-events: none;
        }
        .lh-search-input {
            width: 100%;
            padding: 0.16rem 0.96rem 0.16rem 0.44rem;
            background-color: rgba(30, 41, 59, 0.8);
            border: 1px solid rgba(51, 65, 85, 0.8);
            border-radius: var(--radius-xl);
            color: #ffffff;
            font-size: 0.15rem;
            outline: none;
            backdrop-filter: blur(8px);
            transition: all 0.3s ease;
            box-shadow: 0 0.2rem 0.25rem -0.05rem rgba(0, 0, 0, 0.3);
        }
        .lh-search-input::placeholder { color: var(--color-text-light); }
        .lh-search-input:focus {
            border-color: #38bdf8;
            background-color: #0f172a;
            box-shadow: 0 0 0 2px rgba(56, 189, 248, 0.4);
        }
        .lh-search-count {
            position: absolute;
            right: 0.16rem;
            font-size: 0.12rem;
            font-weight: 500;
            color: #38bdf8;
            background: rgba(8, 47, 73, 0.6);
            border: 1px solid rgba(12, 74, 110, 0.5);
            padding: 0.04rem 0.1rem;
            border-radius: var(--radius-full);
        }
        .lh-search-count.is-hidden { display: none; }
        /* ==========================================================================
           4. 主体布局 (隔离 class 名称)
           ========================================================================== */
        .lh-faq-main {
            padding-top: 0.48rem;
            padding-bottom: 0.48rem;
            background: #eef0f2;
        }
        .lh-faq-main__grid {
            display: grid;
            grid-template-columns: 1fr;
            gap: 0.32rem;
            align-items: start;
        }
        @media (min-width: 1024px) {
            .lh-faq-main__grid { grid-template-columns: 3.2rem 1fr; }
        }
        .lh-faq-sidebar {
            display: flex;
            flex-direction: column;
            gap: 0.16rem;
        }
        @media (min-width: 1024px) {
            .lh-faq-sidebar { position: sticky; top: 1.12rem; }
        }
        .lh-faq-sidebar__nav-card { padding: 0 0.16rem 0.16rem; }
        .lh-sidebar-header {
            font-size: 0.2rem;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 0.05em;
            color: var(--bg-dark);
            text-align: left;
            margin-bottom: 0.2rem;
        }
        .lh-category-nav {
            display: flex;
            flex-direction: column;
            gap: 0.14rem;
            margin-top: 0.04rem;
        }
        .lh-category-nav__item {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 0.15rem;
            font-size: 0.16rem;
            font-weight: 500;
            color: #334155;
            border-left: 3px solid transparent;
            transition: all 0.2s ease;
        }
        .lh-category-nav__item:hover { background-color: #f8fafc; }
        .lh-category-nav__item.is-active {
            background-color: var(--color-primary-light);
            color: var(--color-primary);
            border-left-color: var(--accent-blue);
            font-weight: 600;
        }
        .lh-category-nav__label { display: flex; align-items: center; gap: 0.08rem; }
        .lh-category-nav__icon { color: var(--color-primary); }
        .lh-category-nav__arrow { opacity: 0.4; }
        .lh-support-card {
            padding: 0.24rem;
            background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
            color: #ffffff;
            border-radius: var(--radius-sm);
            text-align: left;
        }
        .lh-support-card__icon {
            width: 0.4rem;
            height: 0.4rem;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.1);
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 0.16rem;
            color: #38bdf8;
        }
        .lh-support-card__title { font-size: 0.18rem; font-weight: 700; }
        .lh-support-card__desc { font-size: 0.12rem; color: #cbd5e1; margin-top: 0.08rem; line-height: 1.8; }
        .lh-support-card__tell {   
              font-size: 0.2rem;
    font-weight: 700;
    color: #cbd5e1;
    margin-top: 0.1rem;
    line-height: 1.6; }
        .lh-support-card__link {
            display: inline-flex;
            align-items: center;
            gap: 0.04rem;
            margin-top: 0.16rem;
            font-size: 0.16rem;
            font-weight: 600;
            color: #38bdf8;
            transition: color 0.2s ease;
        }
        .lh-support-card__link:hover { color: #7dd3fc; }
        /* ==========================================================================
           5. FAQ 内容区 (命名空间隔离)
           ========================================================================== */
        .lh-faq-content {
            display: flex;
            flex-direction: column;
            gap: 0.22rem;
            border: 0.01rem solid var(--color-border);
            box-shadow: var(--shadow-card);
            border-radius: var(--radius-sm);
            background: #fff;
        }
        .lh-faq-section { padding: 0.24rem; }
        .lh-faq-section__header {
            display: flex;
            align-items: center;
            gap: 0.12rem;
            margin-bottom: 0.24rem;
            padding-bottom: 0.16rem;
            border-bottom: 1px solid var(--color-border-light);
        }
        .lh-faq-section__tag {
            font-size: 0.12rem;
            font-weight: 700;
            background-color:var(--accent-blue);
            padding: 0.04rem 0.1rem;
            border-radius: 0.04rem;
        }
        .lh-faq-section__title {   font-weight: 700; color: var(--accent-blue); }
        .lh-faq-section__list { display: flex; flex-direction: column; gap: 0.16rem; }
        /* 手风琴单个卡片 */
        .lh-faq-item {
            border: 1px solid var(--border-color);
            border-radius: var(--radius-sm);
            overflow: hidden;
            background-color: rgba(248, 250, 252, 0.5);
            transition: all 0.2s ease;
        }
        .lh-faq-item:hover {
            background-color: #ffffff;
            border-color: var(--color-border);
        }
        .lh-faq-item__button {
            width: 100%;
            padding: 0.16rem 0.2rem;
            display: flex;
            align-items: center;
            justify-content: space-between;
            text-align: left;
            background: none;
            border: none;
            cursor: pointer;
            outline: none;
        }
        .lh-faq-item__title-wrap { display: flex; align-items: center; gap: 0.12rem; }
        .lh-faq-item__badge {
            width: 0.26rem;
            height: 0.26rem;
            border-radius: 50%;
            background-color: #e0f2fe;
            color: var(--color-primary);
            font-weight: 400;
            font-size: 0.14rem;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
        }
        .lh-faq-item__question { font-weight: 500; color: #1e293b; font-size: 0.18rem; }
        .lh-faq-tag {
            font-size: 0.14rem;
            font-weight: 400;
            padding: 0.02rem 0.08rem;
            border-radius: var(--radius-full);
            flex-shrink: 0;
        }
        .lh-faq-tag--hot { background-color: #fff1f2; color: #e11d48; border: 1px solid #ffe4e6; }
        .lh-faq-tag--recommend { background-color: #f0f9ff; color: var(--color-primary); border: 1px solid #e0effe; }
        .lh-faq-item__icon {
            color: var(--color-text-light);
            transition: transform 0.3s ease;
            margin-left: 0.08rem;
        }
        .lh-faq-item__content {
            height: 0;
            overflow: hidden;
            opacity: 0;
            padding-left: 0.2rem;
            padding-right: 0.2rem;
        }
        .lh-faq-item__text {
            padding-top: 0.16rem;
            padding-bottom: 0.16rem;
            font-size: 0.16rem;
            color: var(--bg-dark);
            border-top: 1px solid #f1f1f1;
            line-height: 1.7;
            text-align: left;
        }
        /* 无搜索结果占位符 */
        .lh-faq-empty {
            display: none;
            text-align: center;
            padding: 0.6rem 0.2rem;
            color: var(--color-text-muted);
            font-size: 0.22rem;
        }
        .lh-faq-empty__icon {
            width: 0.48rem;
            height: 0.48rem;
            margin-bottom: 0.12rem;
            color: var(--color-text-light);
        }
.lh-svg-icon {
            display: inline-block;
            stroke-width: 0;
            stroke: currentColor;
            fill: currentColor;
            vertical-align: middle;
            flex-shrink: 0;
        }
        .lh-svg-icon--stroke {
            fill: none;
            stroke: currentColor;
            stroke-width: 2;
            stroke-linecap: round;
            stroke-linejoin: round;
            z-index: 1;
        }
        ::selection {
            background-color: var(--color-primary);
            color: #ffffff;
        }
/*选型对照表*/
.filter-toolbar {
  background-color: var(--clr-bg-card);
  border: 0.01rem solid var(--clr-border); /* 1px */
  border-radius: var(--radius-md);
  padding: 0.24rem; /* 原 1.5rem (24px) */
  margin-bottom: 0.24rem; /* 原 1.5rem (24px) */
  display: flex;
  flex-direction: column;
  gap: 0.2rem; /* 原 1.25rem (20px) */
  box-shadow: var(--shadow);
}
.category-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.12rem; /* 原 0.75rem (12px) */
}
.category-tabs__btn {
  background: var(--clr-bg-input);
  border: 0.01rem solid transparent; /* 1px */
  color: #334155;
  padding: 0.096rem 0.192rem; /* 原 0.6rem (9.6px) 1.2rem (19.2px) */
  border-radius: var(--radius-sm);
  cursor: pointer;
  font-size: 0.1472rem; /* 原 0.92rem (14.72px) */
  font-weight: 600;
  transition: var(--transition-base);
  display: flex;
  align-items: center;
  gap: 0.08rem; /* 8px */
}
.category-tabs__btn:hover {
  border-color: var(--accent-blue);
  color: var(--accent-blue);
  background-color: #ffffff;
}
.category-tabs__btn--active {
  background: var(--accent-blue);
  color: #ffffff !important;
  border-color: transparent;
  box-shadow: 0 0.04rem 0.12rem var(--clr-primary-glow); /* 0 4px 12px */
}
.search-box {
  position: relative;
  width: 100%;
  font-size: 0.1rem;
}
.search-box__input {
  width: 100%;
  padding: 0.128rem 0.16rem 0.128rem 0.448rem; /* 原 0.8rem 1rem 0.8rem 2.8rem */
  background-color: var(--clr-bg-input);
  border: 0.01rem solid var(--clr-border); /* 1px */
  border-radius: var(--radius-sm);
  color: var(--clr-text-main);
  font-size: 0.152rem; /* 原 0.95rem (15.2px) */
  outline: none;
  transition: var(--transition-base);
}
.search-box__input:focus {
  background-color: #ffffff;
  border-color: var(--clr-primary);
  box-shadow: 0 0 0 0.03rem var(--clr-primary-glow); /* 3px */
}
.search-box__icon {
    position: absolute;
    left: 13px;
    top: 51%;
    transform: translateY(-50%);
    color: var(--clr-text-muted);
    width: 0.2rem;
    height: 0.2rem;
}
/* ==========================================================================
   4. 对照数据表格样式
   ========================================================================== */
.standards-container {
  background-color: var(--clr-bg-card);
  border: 0.01rem solid var(--clr-border); /* 1px */
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: var(--shadow);
}
.standards-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
}
.standards-table__head {
  background-color: #f1f5f9;
  border-bottom: 0.02rem solid var(--clr-border); /* 2px */
}
.standards-table__th {
  padding: 0.16rem 0.16rem; /* 原 1rem (16px) */
  font-size: 0.1408rem; /* 原 0.88rem (14.08px) */
  text-transform: uppercase;
  letter-spacing: 0.005rem; /* 0.5px */
  color: #334155;
  font-weight: 700;
}
.standards-table__row {
  border-bottom: 0.01rem solid var(--clr-border); /* 1px */
  transition: var(--transition-base);
}
.standards-table__row:nth-child(even) {
  background-color: var(--clr-table-stripe);
}
.standards-table__row:hover {
  background-color: #f0f9ff;
}
.standards-table__td {
  padding: 0.176rem 0.16rem; /* 原 1.1rem (17.6px) 1rem (16px) */
  font-size: 0.1488rem; /* 原 0.93rem (14.88px) */
  color: #334155;
}
.metal-badge {
  display: inline-block;
  padding: 0.04rem 0.104rem; /* 原 0.25rem (4px) 0.65rem (10.4px) */
  border-radius: 0.04rem; /* 4px */
  font-size: 0.12rem; /* 原 0.8rem (12.8px) */
  font-weight: 600;
}
.metal-badge--titanium { background: #e0f2fe; color: #0284c7; }
.metal-badge--nickel { background: #f3e8ff; color: #7e22ce; }
.metal-badge--copper { background: #ffedd5; color: #c2410c; }
.metal-badge--stainless { background: #dcfce7; color: #15803d; }
.metal-badge--zirconium { background: #fef9c3; color: #a16207; }
.tag-standard {
  color: var(--clr-highlight);
  font-family: monospace;
  font-weight: 700;
}
.empty-state {
  padding: 0.48rem; /* 原 3rem (48px) */
  text-align: center;
  color: var(--text-muted);
  display: none;
  font-size: 0.22rem;
}
.empty-state__icon {
  width: 0.4rem; /* 原 2.5rem (40px) */
  height: 0.4rem; /* 原 2.5rem (40px) */
  margin-bottom: 0.08rem; /* 原 0.5rem (8px) */
  color: var(--clr-text-muted);
}
.filter-box{
    background:#eef0f2;
}
.category-tabs__btn--active:hover{
  background: var(--accent-blue);
}
.svg-icon {
    width: 2em;
    height: 2em;
    fill:var(--accent-blue);
    display: inline-block;
    vertical-align: -0.125em;
    flex-shrink: 0;
}
.category-tabs__btn--active .svg-icon{
  fill: var(--bg-subtle);
}
        .equipment .stats-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 0.24rem;
        }
        .equipment .stat-number {
            font-size: 0.48rem;
            font-weight: 800;
            color: var(--text-main);
            line-height: 1.1;
            margin-bottom: 0.08rem;
            /* 关键点：固定等宽数字，防止滚动时抖动 */
            font-variant-numeric: tabular-nums;
            -webkit-font-smoothing: antialiased;
        }
       .equipment .stat-label {
            font-size: 0.12rem;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.01rem;
            color: var(--text-muted);
        }
        .equipment .top-header-tag{
              justify-content: flex-start;
              margin-bottom: 0.9rem;
        }
        /* ==================== FACILITIES SECTION (MATCHING IMAGE) ==================== */
        .facilities-section {
            background-color: var(--bg-secondary);
        }
        .filter-tabs {
            display: flex;
            justify-content: center;
            gap: 0.12rem;
            margin: 0.4rem 0 0.48rem;
            flex-wrap: wrap;
        }
        .filter-btn {
            padding: 0.1rem 0.24rem;
            font-size: 0.144rem;
            font-weight: 600;
            border-radius: 0.3rem;
            border: 0.01rem solid var(--border-color);
            background-color: var(--bg-primary);
            color: var(--text-muted);
            cursor: pointer;
            transition: all 0.3s ease;
        }
        .filter-btn.active, .filter-btn:hover {
            background-color: var(--text-main);
            color: #ffffff;
            border-color: var(--text-main);
        }
        .facilities-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 0.24rem;
        }
        .equipment-card {
            background-color: var(--bg-card);
            border: 0.01rem solid var(--border-color);
            border-radius: 0.12rem;
            overflow: hidden;
            box-shadow: var(--card-shadow);
            display: flex;
            flex-direction: column;
            transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
        }
        .equipment-card:hover {
            transform: translateY(-0.06rem);
            box-shadow: var(--card-shadow-hover);
            border-color: var(--border-hover);
        }
        .equipment-card .card-image {
            width: 100%;
            height: 2.2rem;
            overflow: hidden;
            background-color: var(--bg-tertiary);
            border-radius: 0;
        }
        .card-image img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.5s ease;
        }
        .equipment-card:hover .card-image img {
            transform: scale(1.05);
        }
        .card-content {
            padding: 0.24rem;
            display: flex;
            flex-direction: column;
            flex-grow: 1;
        }
        .card-content h3 {
            font-size: 0.184rem;
            font-weight: 700;
            color: var(--text-main);
            margin-bottom: 0.12rem;
            line-height: 1.3;
        }
        .card-content p {
            font-size: 0.136rem;
            color: var(--text-muted);
            line-height: 1.6;
            margin-bottom: 0.24rem;
            flex-grow: 1;
        }
        /* Specification Key-Value List */
        .specs-list {
            border-top: 0.01rem solid var(--border-color);
            padding-top: 0.16rem;
            display: flex;
            flex-direction: column;
            gap: 0.1rem;
        }
        .spec-row {
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-size: 0.1312rem;
        }
        .spec-row dt {
            color: var(--text-muted);
            font-weight: 500;
        }
        .spec-row dd {
            color: var(--text-main);
            font-weight: 700;
        }
        /* ==================== QUALITY CONTROL ==================== */
        .quality-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 0.64rem;
            align-items: center;
        }
        .quality-image img {
            width: 100%;
            height: auto;
            border-radius: 0.08rem;
            box-shadow: var(--card-shadow-hover);
            border: 0.01rem solid var(--border-color);
        }
        .quality-list {
            margin-top: 0.32rem;
            display: flex;
            flex-direction: column;
            gap: 0.24rem;
        }
        .quality-item {
            display: flex;
            gap: 0.2rem;
        }
        .quality-item-icon {
            width: 0.44rem;
            height: 0.44rem;
            border: 0.01rem solid var(--border-color);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: var(--text-main);
            flex-shrink: 0;
            font-size: 0.176rem;
        }
        .quality-item h4 {
            font-size: 0.176rem;
            font-weight: 700;
            color: var(--text-main);
            margin-bottom: 0.04rem;
        }
        .quality-item p {
            font-size: 0.144rem;
            color: var(--text-muted);
        }