/* ============================================================
   [SF-UI] 硅基流动 (SiliconFlow) 视觉覆盖层 — 白色高级科技风
   ------------------------------------------------------------
   设计语言：白色 / 浅灰白底 (#F7F8FA + #FFFFFF)
            + 极弱流动渐变光晕（白→浅蓝/浅紫/浅青/浅粉，透明度 ≤ .05）
            + 蓝(#3B5BFF)→紫(#3b82f6) 品牌渐变 + 微弱七彩点缀
            + 纯白卡片（圆角 / 轻阴影 / 细边框，无厚重玻璃、无深色磨砂）
   作用：仅覆盖「配色 / 背景 / 导航外观 / 卡片组件 / 轮播样式 / 光影」
   不改任何 HTML 结构、不改动 PbootCMS 标签、不写死图片与文字。
   本文件置于 main.css 之后加载，故以下规则优先于原样式。
   ============================================================ */

/* ---------- 1. 主题变量（白色高级科技风调色板） ---------- */
:root {
  /* 品牌主色：蓝 → 紫罗兰（签名渐变） */
  --sf-blue:   #3B5BFF;
  --sf-indigo: #5B6CFF;
  --sf-violet: #3b82f6;
  --sf-cyan:   #22D3EE;
  --sf-pink:   #60a5fa;
  /* 签名渐变：蓝 → 紫 */
  --sf-grad:        linear-gradient(120deg, #3B5BFF 0%, #3b82f6 100%);
  --sf-grad-glow:   linear-gradient(120deg, #3B5BFF 0%, #3b82f6 100%);
  --sf-grad-soft:   linear-gradient(135deg, rgba(59,91,255,.08), rgba(139,92,246,.08));
  /* 微弱七彩渐变（仅用于线 / 边 / 点缀，低饱和低透明） */
  --sf-grad-rainbow: linear-gradient(90deg, #3B5BFF 0%, #3b82f6 38%, #22D3EE 68%, #60a5fa 100%);
  /* 文本 / 背景 / 边框 */
  --sf-ink:    #0F172A;   /* 标题：近黑深蓝，清晰可读 */
  --sf-text:   #475569;   /* 正文：深石板灰 */
  --sf-muted:  rgba(100,116,139,.72);  /* 辅助文字 */
  --sf-border: #E7EAF2;   /* 浅冷调细描边 */
  --sf-bg:     #FFFFFF;   /* 卡片底：纯白 */
  --sf-bg-soft:#F2F4FA;   /* 浅灰白底 */
  --sf-page-bg:#F7F8FA;   /* 页面底色：浅灰白 */
  /* 圆角 / 阴影（轻、干净） */
  --sf-radius:    16px;
  --sf-radius-sm: 10px;
  --sf-shadow:    0 10px 30px rgba(15,23,42,.07);
  --sf-shadow-lg: 0 22px 56px rgba(15,23,42,.12);
  --sf-card-shadow: 0 8px 24px rgba(15,23,42,.06), 0 2px 6px rgba(15,23,42,.04);
  --sf-glow:        0 0 20px rgba(99,102,241,.18);   /* 克制蓝紫光晕 */
  --sf-glow-strong: 0 0 26px rgba(99,102,241,.26);

  /* 让 main.css 中引用这些变量的位置自动适配浅色 */
  --bp-primary:        #3B5BFF;
  --bp-primary-light:  #3b82f6;
  --bp-primary-dark:   #2742D6;
  --bp-text:           #475569;
  --bp-text-light:     rgba(100,116,139,.72);
  --bp-border:         #E7EAF2;
  --bp-bg:             #FFFFFF;
  --bp-bg-soft:        #F2F4FA;

  /* 兼容各内页内联 :root 自定义变量 */
  --primary-color:  #3B5BFF;
  --primary-light:  #3b82f6;
  --secondary-color:#3b82f6;
  --accent-color:   #A78BFA;
}

/* ---------- 0. 全局页面底色（浅白基底 + 柔和云雾流体七彩流光） ---------- */
body {
  color: var(--sf-text);                        /* 默认正文深灰 */
  background-color: #ffffff;                    /* 固定纯白底色，作为流光底层 */
  -webkit-font-smoothing: antialiased;         /* 全局抗锯齿（macOS 生效；Windows Chromium 忽略，但按要求全局声明） */
  -moz-osx-font-smoothing: grayscale;
}
/* 背景流体流光装饰层 — 纯白底之上、所有内容之下的极低透明度多色光斑。
   多层低饱和径向渐变（冷色：蓝/青/淡紫；暖色：粉/桃/淡金），大半径模糊 + 缓慢漂移/旋转/呼吸缩放无限动画。
   固定定位铺满视口（inset:-35% 超出视口，transform 移动不露边），z-index:-1 位于 body 基底之上、所有页面内容之下；
   pointer-events:none 禁止鼠标交互。整体透明度极低、色彩朦胧隐约，绝不盖过白底；
   白色卡片（纯白不透明）自然遮盖，保证文字与产品图片清晰可读。 */
body::before {
  content: '';
  position: fixed;
  inset: -35%;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(circle 38vw at 18% 22%, rgba(186, 214, 253, 0.16), transparent 62%),
    radial-gradient(circle 34vw at 82% 18%, rgba(199, 210, 254, 0.14), transparent 62%),
    radial-gradient(circle 46vw at 72% 80%, rgba(186, 244, 245, 0.12), transparent 62%),
    radial-gradient(circle 32vw at 24% 82%, rgba(224, 214, 248, 0.13), transparent 62%);
  background-repeat: no-repeat;
  filter: blur(46px);
  animation: sf-fluid-a 30s ease-in-out infinite;
}
body::after {
  content: '';
  position: fixed;
  inset: -35%;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(circle 40vw at 60% 28%, rgba(252, 214, 230, 0.13), transparent 62%),
    radial-gradient(circle 44vw at 12% 58%, rgba(253, 224, 211, 0.11), transparent 62%),
    radial-gradient(circle 36vw at 88% 72%, rgba(255, 232, 214, 0.10), transparent 62%),
    radial-gradient(circle 30vw at 40% 88%, rgba(214, 235, 255, 0.10), transparent 62%);
  background-repeat: no-repeat;
  filter: blur(52px);
  animation: sf-fluid-b 38s ease-in-out infinite;
}
@keyframes sf-fluid-a {
  0%   { transform: translate(0%, 0%) rotate(0deg) scale(1); }
  33%  { transform: translate(3%, -2%) rotate(3deg) scale(1.05); }
  66%  { transform: translate(-2%, 3%) rotate(-2deg) scale(1.02); }
  100% { transform: translate(0%, 0%) rotate(0deg) scale(1); }
}
@keyframes sf-fluid-b {
  0%   { transform: translate(0%, 0%) rotate(0deg) scale(1.02); }
  33%  { transform: translate(-3%, 2%) rotate(-3deg) scale(1); }
  66%  { transform: translate(2%, -3%) rotate(2deg) scale(1.06); }
  100% { transform: translate(0%, 0%) rotate(0deg) scale(1.02); }
}
@media (prefers-reduced-motion: reduce) {
  body::before, body::after,
  .footer::before, .footer::after,
  .page-header .ph-bg,
  .page-header::before { animation: none; }
}

/* ---------- 2. 主导航：浅色磨砂玻璃（白透，非深色） ---------- */
#header {
  background: rgba(255,255,255,.72);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  backdrop-filter: blur(14px) saturate(140%);
  border-bottom: 1px solid var(--sf-border);
  box-shadow: 0 6px 24px rgba(15,23,42,.05);
}
#header.is-stuck { background: rgba(255,255,255,.92); }

/* 文字抗锯齿：仅作用于 header 内部文字，消除锯齿、边缘锐利高清（不改布局/字号/配色/位置） */
#header,
#header * {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: geometricPrecision;  /* Windows Chromium 下比 optimizeLegibility 边缘更锐利 */
  font-smooth: always;                 /* 旧版 Windows/Firefox 灰度平滑，进一步去毛边 */
  -webkit-text-stroke: 0.01px transparent; /* 极细透明描边，强制亚像素抗锯齿、锐化边缘 */
}
/* 一级导航文字：近黑 → hover/激活 品牌蓝 */
.nav li.nLi h3 a { color: var(--sf-ink); }
.nav li.nLi:hover h3 a,
.nav li.nLi.on h3 a,
.nav li.nLi h3 a:hover { color: var(--sf-blue); }
.nav li.nLi h3 a::after,
.nav li.nLi.on h3 a::after,
.nav li.nLi h3 a:hover::after { background: var(--sf-grad); }
/* 下拉子菜单：白色面板 */
.nav li .sub {
  background: #fff;
  border: 1px solid var(--sf-border);
  box-shadow: var(--sf-shadow);
}
.nav li .sub li a { color: var(--sf-ink); }
.nav li .sub li a:hover { color: var(--sf-blue); background: rgba(59,91,255,.07); }
/* Logo 文字渐变点缀（浅底上用品牌渐变，保证可读） */
.logo-text .lt-name {
  background: var(--sf-grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;  /* 更可靠的裁切填充，渐变文字边缘更锐利、无发毛 */
  font-weight: 700;                      /* 对齐字体原生字重（仅 400/700），消除合成加粗发虚 */
}
.logo-text .lt-slogan { color: var(--sf-muted); }

/* ---------- 4. 轮播英雄区（极简圆角画布 + 柔和悬浮 + 扁平箭头） ---------- */
/* 设计原则：极简圆角画布，无边框/硬件造型/拟物外壳；仅一层柔和低浓度外阴影营造悬浮感；
   左右切换箭头扁平圆形、垂直居中、默认半透明、hover 提高透明度、品牌蓝；
   容器 max-width:1450px 居中，左右自然留白不通栏；克制装饰，突出海报内容。 */
.index-ban {
  position: relative;
  border-radius: 20px;                  /* 极简圆角画布 */
  overflow: hidden;
  max-width: 1450px;                    /* 左右页面留白，不通栏铺满 */
  margin: 24px auto 0;
  box-shadow: 0 8px 28px rgba(15,23,42,.08);  /* 仅一层柔和低浓度外阴影，轻量悬浮感 */
}
.index-ban .swiper-slide {
  background: linear-gradient(135deg, #EEF2FF 0%, #F5F3FF 50%, #ECFEFF 100%);  /* 浅蓝紫兜底底，图片缺失时 */
  aspect-ratio: 1920 / 740;   /* 统一轮播画布比例，中英文及任意尺寸图片高度一致 */
}
/* 让图片包裹层（a / picture）撑满 slide 画布，使 img 的 height:100% 能正确锚定到 slide，
   避免英文图因中间包裹层为 auto 高度而回退到自然高度、溢出被 .index-ban 裁切（看起来更大且显示不全） */
.index-ban .swiper-slide > a,
.index-ban .swiper-slide picture {
  display: block;
  width: 100%;
  height: 100%;
}
.index-ban img {
  width: 100%;
  height: 100%;
  object-fit: contain;        /* 不同比例图片完整显示、不被裁切（底色兜底）；中英文画布高度一致 */
  display: block;
}
/* 左右切换箭头：圆形扁平、容器左右垂直居中、默认半透明、hover 提高透明度、品牌蓝、去除厚重背景 */
.index-ban .swiper-button-prev,
.index-ban .swiper-button-next {
  position: absolute;
  top: 50%;                             /* 垂直居中（不再撑满全高） */
  transform: translateY(-50%);
  width: 52px;
  height: 52px;
  margin: 0;                            /* 覆盖 swiper 默认负 margin */
  border: none;
  border-radius: 50%;                   /* 扁平圆形 */
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 6;
  /* 默认半透明背景，扁平化，无玻璃内描边/内阴影/厚重背景 */
  background: rgba(255,255,255,.45);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  box-shadow: 0 2px 10px rgba(15,23,42,.06);
  transition: background .3s ease, box-shadow .3s ease, transform .3s ease;
}
.index-ban .swiper-button-prev { left: 24px;  right: auto; }
.index-ban .swiper-button-next { right: 24px; left: auto; }
/* 箭头图标：品牌蓝、线性、扁平 */
.index-ban .swiper-button-prev:after,
.index-ban .swiper-button-next:after {
  position: static;
  font-size: 22px; font-weight: 700; line-height: 1;
  color: var(--sf-blue);
  transition: transform .3s ease, color .3s ease;
}
/* hover：提高透明度 + 轻微品牌蓝光晕 + 图标微放大（克制，不过度发光） */
.index-ban .swiper-button-prev:hover,
.index-ban .swiper-button-next:hover {
  background: rgba(255,255,255,.85);
  box-shadow: 0 4px 16px rgba(59,91,255,.16);
}
.index-ban .swiper-button-prev:hover:after,
.index-ban .swiper-button-next:hover:after {
  /* 移除 hover 缩放，避免箭头字形发虚 */
}
/* 分页指示器：极简扁平，白色 + 轻阴影保证海报上可读 */
.index-ban .swiper-pagination { bottom: 16px; z-index: 3; }
.index-ban .swiper-pagination-bullet {
  width: 8px; height: 8px;
  background: rgba(255,255,255,.55); opacity: 1;
  box-shadow: 0 1px 4px rgba(15,23,42,.18);
  transition: all .3s;
}
.index-ban .swiper-pagination-bullet-active {
  width: 24px; border-radius: 4px;
  background: #fff; opacity: 1;
  box-shadow: 0 0 8px rgba(59,91,255,.42);
}

/* ---------- 5. 全局通用内页标题组件 page-header（白色高级科技风） ---------- */
.page-header {
  position: relative;
  z-index: 1;                          /* 低于导航 #header(101)/.topbar(102)，禁止盖在导航上方 */
  /* 顶部零间距：让 .page-header 从文档最顶部开始 (margin-top:0)，由固定导航遮盖其顶部 padding 区域。
     标题内容用 padding-top 推到导航下沿，page-header 的白底从 y=0 起就覆盖整段导航正下方的区域，
     杜绝 body 的 #F7F8FA 浅灰底色从导航与标题之间渗透出来形成可见灰带。 */
  margin-top: 0;
  padding-top: calc(var(--topbar-h) + var(--header-h));
  /* 标题区可见高度约束 180–220px。min/max-height 含 padding-top，故需把导航总高补回来。
     桌面 116+180~220 = 296~336；≤900px 100+180~220 = 280~320；≤640px 56+180~220 = 236~276；≤420px 56+180~220 = 236~276。 */
  min-height: calc(180px + var(--topbar-h) + var(--header-h));
  max-height: calc(220px + var(--topbar-h) + var(--header-h));
  display: flex;                       /* 内容垂直居中 */
  flex-direction: column;
  background: linear-gradient(135deg, #070912 0%, #0d0f24 35%, #15103a 65%, #0a0820 100%);  /* 深暗蓝紫底色（赛博朋克），从 y=0 起覆盖导航正下方区域，杜绝灰带 */
  overflow: hidden;                    /* 渐变/网格严格裁切在标题区块内部，禁止向上溢出到导航 */
  border-bottom: 1px solid rgba(56,189,248,.18);  /* 霓虹青微光底边，与深底过渡克制 */
}
/* 赛博朋克流光光带：霓虹青#38bdf8 / 电光粉#60a5fa / 淡紫#3b82f6 三色宽光带，横向持续流动。
   宽光带 + 多停羽化边缘实现柔和过渡，层次感拉满；高透明度对比增强视觉冲击但不刺眼。
   z-index:0 底层，渲染于扫描线/网格之下；文字层 z-index:3 浮于最上层保证清晰可读。
   background-size:200% + 首尾同色(transparent) + position 0→200% 无缝循环，10s 周期，杜绝频闪。 */
.page-header .ph-bg {
  position: absolute; inset: 0; z-index: 0;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(56,189,248,0) 6%,
    rgba(56,189,248,.42) 15%,            /* 霓虹青 光带峰 */
    rgba(56,189,248,0) 26%,
    transparent 32%,
    rgba(157,78,221,0) 38%,
    rgba(157,78,221,.38) 50%,            /* 淡紫 光带峰 */
    rgba(157,78,221,0) 62%,
    transparent 68%,
    rgba(255,46,166,0) 74%,
    rgba(255,46,166,.42) 85%,            /* 电光粉 光带峰 */
    rgba(255,46,166,0) 96%,
    transparent 100%                     /* 首尾同色无缝循环 */
  );
  background-size: 200% 100%;
  background-repeat: repeat;
  animation: ph-flow 10s linear infinite;
  pointer-events: none;
}
@keyframes ph-flow {
  0%   { background-position: 0% 0%; }
  100% { background-position: 200% 0%; }
}
/* 扫描线纹理层：极淡 CRT 横向扫描线 + 缓慢纵向漂移，z-index:1（流光之上、网格之下）。
   透明度极低(.04)，仅作氛围底纹，克制不抢前景；position:absolute 被 .page-header overflow:hidden 裁切。 */
.page-header::before {
  content: ''; position: absolute; inset: 0; z-index: 1;
  background: repeating-linear-gradient(0deg,
    rgba(56,189,248,.04) 0px, rgba(56,189,248,.04) 1px,
    transparent 1px, transparent 4px);
  pointer-events: none;
  animation: ph-scan 10s linear infinite;
}
@keyframes ph-scan {
  0%   { background-position: 0 0; }
  100% { background-position: 0 40px; }   /* 漂移 10 个周期(4px)，无缝循环 */
}
@media (prefers-reduced-motion: reduce) {
  .page-header .ph-bg,
  .page-header::before { animation: none; }
}
/* 极淡细网格（透明度 ~8%，仅作底纹，不抢内容；仅标题区域内展示）。
   网格从 page-header 的 y=0 开始（含 padding-top 区），导航遮盖其顶部网格线；
   可见区首条网格线落在导航下方内容区内，不再卡在导航边界形成"分隔蓝线"。
   background-position 下偏 21px（半个格），确保首条可见横线不紧贴导航底沿。 */
.page-header .ph-grid {
  position: absolute; inset: 0; z-index: 2;
  background-image:
    linear-gradient(rgba(56,189,248,.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(56,189,248,.10) 1px, transparent 1px);
  background-size: 42px 42px;
  background-position: 0 21px;
  pointer-events: none;
}
.page-header .ph-inner {
  position: relative; z-index: 3;        /* 浮于流光/扫描线/网格之上，保证文字清晰 */
  flex: 1 1 auto;                      /* 占满剩余高度，使标题组垂直居中 */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0 20px;
}
.page-header .ph-title {
  margin: 0;
  font-size: 30px; font-weight: 700;
  color: #F7FAFF;                       /* 浅色霓虹白，深底上清晰可读 */
  text-shadow: 0 2px 18px rgba(0,0,0,.55), 0 0 2px rgba(56,189,248,.25);  /* 深影+微青光，流光上文字不糊 */
  line-height: 1.3; letter-spacing: .5px;
}
.page-header .ph-sub {
  margin: 8px 0 0;
  font-size: 13px; letter-spacing: 2px;
  color: rgba(170,210,235,.82);         /* 浅青灰副标题，深底上柔和可读 */
  text-transform: uppercase;
}
.page-header .ph-line {
  display: block;
  width: 56px; height: 4px;
  margin: 16px auto 0;
  border-radius: 4px;
  background: linear-gradient(90deg, #38bdf8 0%, #3b82f6 55%, #60a5fa 100%);  /* 霓虹青→淡紫→电光粉 */
  box-shadow: 0 0 10px rgba(56,189,248,.45);  /* 微光晕，克制不浮夸 */
}
/* 面包屑：独立靠右布局，与主标题彻底分离。
   错位根因：原用 justify-content:space-between + flex-wrap:wrap（自适应分布），
   当 bread-l 子栏目数量不同（关于我们3个/产品中心1个/联系我们0个）时，bread-r 会换行
   或漂移到不同水平位置。改为 margin-left:auto 固定推到容器最右，位置与 bread-l 内容无关。
   - .ph-inner（标题组）水平居中于上方，独立盒子；
   - .ph-bread 贴底，bread-l 居左、bread-r 固定靠右，两套元素互不影响、互不挤压。 */
.page-header .ph-bread {
  position: relative; z-index: 3;        /* 浮于纹理层之上，面包屑清晰 */
  background: transparent;
  margin-top: auto;                    /* 面包屑贴标题区块底部 */
}
.page-header .ph-bread .w1450px {
  background: transparent;
  border: none; border-radius: 0;
  padding: 12px 20px 22px;
  box-shadow: none;
  min-height: 60px;                    /* 所有页面面包屑等高 */
  display: flex;
  align-items: center;
  flex-wrap: nowrap;                   /* 禁止换行，杜绝 bread-r 漂移到第二行左侧 */
}
/* 子栏目链接：居左，可收缩，绝不挤占 bread-r 的右侧固定位置 */
.page-header .ph-bread .bread-l {
  flex: 0 1 auto;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.page-header .ph-bread .bread-l a {
  float: none;
  height: auto;
  line-height: 1.6;
  margin: 0 10px;
  padding: 0;
  border-bottom: none;
  display: inline-block;
  vertical-align: middle;
}
.page-header .ph-bread .bread-l a:hover,
.page-header .ph-bread .bread-l a.on { border-bottom: none; }
/* 当前位置面包屑：margin-left:auto 固定推到容器最右沿，与 bread-l 内容多少无关，
   所有页面水平位置完全一致（距离右侧容器固定 20px 边距） */
.page-header .ph-bread .bread-r {
  margin-left: auto;                   /* 固定靠右，非自适应居中/分布 */
  flex: 0 0 auto;
  white-space: nowrap;
  text-align: right;
}
.bread-l a { color: var(--sf-muted); }
.bread-l a:hover, .bread-l a.on { color: var(--sf-blue); }
.bread-r { color: var(--sf-muted); }
/* 赛博朋克深底下面包屑浅色化（仅限 page-header 内，不影响站点其余面包屑） */
.page-header .ph-bread .bread-l a { color: rgba(180,205,235,.78); }
.page-header .ph-bread .bread-l a:hover,
.page-header .ph-bread .bread-l a.on { color: #38bdf8; }
.page-header .ph-bread .bread-r { color: rgba(180,205,235,.78); }
.site-title { color: var(--sf-ink); }

/* ---------- 5b. 内页/首页容器透出 body 浅底；默认文字深灰 ---------- */
.contnet, .ny-nrbox { background: transparent; color: var(--sf-text); }

/* ---------- 7. 区块标题（居中 + 渐变下划线，微弱七彩点缀） ---------- */
.title-t1 {
  height: auto !important;
  line-height: 1.3;
  font-size: 36px;
  color: var(--sf-ink);
  font-weight: 700;
  letter-spacing: .5px;
  padding: 44px 0 16px;
  text-align: center;
  text-transform: none;
}
.title-t1:after { display: none !important; }
.title-t1 span {
  background: transparent !important;
  position: relative;
  display: inline-block;
  padding: 0;
}
.title-t1 span:after {
  content: '';
  position: absolute;
  left: 50%; transform: translateX(-50%);
  bottom: -14px;
  width: 60px; height: 4px;
  border-radius: 4px;
  background: var(--sf-grad-rainbow);   /* 微弱七彩标题点缀 */
}
/* 内页「相关产品」小标题 */
.title2 {
  font-size: 24px;
  color: var(--sf-ink);
  font-weight: 700;
  margin-bottom: 22px;
  position: relative;
  padding-left: 16px;
}
.title2::before {
  content: '';
  position: absolute; left: 0; top: 4px; bottom: 4px;
  width: 5px; border-radius: 3px;
  background: var(--sf-grad);
}

/* ---------- 8. 首页产品矩阵（纯白卡片：圆角 / 轻阴影 / 细边框，无玻璃） ---------- */
.sec-products, .index-box3 {
  position: relative;
  background: transparent;            /* 透出 body 浅底，消除色块断层 */
  overflow: hidden;
  padding-bottom: 56px;
}
.sec-products::before, .index-box3::before { display: none; }
/* 移除原 main.css 的纯白空白隔断（index-box2），保证板块连续 */
.index-box2 { background: transparent !important; padding: 0 !important; height: 0 !important; }
/* 极弱渐变光晕，仅作为局部装饰，不铺满 */
.sec-products::after {
  content: '';
  position: absolute; top: -120px; right: -80px;
  width: 420px; height: 420px;
  background: radial-gradient(circle, rgba(139,92,246,.06), transparent 70%);
  pointer-events: none; z-index: 0;
}
.index-box3::after {
  content: '';
  position: absolute; bottom: -120px; left: -80px;
  width: 420px; height: 420px;
  background: radial-gradient(circle, rgba(59,91,255,.06), transparent 70%);
  pointer-events: none; z-index: 0;
}
.sec-products > *, .index-box3 > * { position: relative; z-index: 1; }

.index-cp {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  max-width: 1450px;
  margin: 0 auto;
  padding: 10px 20px 40px;
}
.index-cp li { list-style: none; width: auto; }
.index-cp li a.index-img1 {
  display: flex;
  flex-direction: column;
  background: var(--sf-bg);                       /* 纯白卡片 */
  border: 1px solid var(--sf-border);
  border-radius: var(--sf-radius);
  overflow: hidden;
  box-shadow: var(--sf-card-shadow);
  transition: transform .35s cubic-bezier(.25,.8,.25,1), box-shadow .35s, border-color .35s;
}
.index-cp li a.index-img1:hover {
  transform: translateY(-6px);
  border-color: rgba(99,102,241,.40);
  box-shadow: var(--sf-card-shadow), var(--sf-glow);
}
.index-cp li .img {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--sf-bg-soft);
}
.index-cp li .img img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .6s;
}
.index-cp li a.index-img1:hover .img img { transform: scale(1.08); }
.index-cp li .card-body {
  padding: 18px 18px 20px;
  display: flex; flex-direction: column; gap: 10px;
}
.index-cp li h2 {
  font-size: 16px; font-weight: 700;
  color: var(--sf-text); line-height: 1.5; margin: 0;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; transition: color .3s;
}
.index-cp li a.index-img1:hover h2 { color: var(--sf-blue); }
.index-cp li .card-link {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; color: var(--sf-blue); font-weight: 400;
  opacity: 0; transform: translateX(-8px);
  transition: opacity .3s, transform .3s;
}
.index-cp li a.index-img1:hover .card-link { opacity: 1; transform: translateX(0); }
.index-cp li .card-link .arrow { transition: transform .3s; }
.index-cp li a.index-img1:hover .card-link .arrow { transform: translateX(4px); }

/* ---------- 9. 首页新闻卡片（纯白卡片） ---------- */
.news-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  max-width: 1450px;
  margin: 0 auto;
  padding: 10px 20px 30px;
}
.news-card {
  background: var(--sf-bg);
  border: 1px solid var(--sf-border);
  border-radius: var(--sf-radius);
  overflow: hidden;
  box-shadow: var(--sf-card-shadow);
  transition: transform .35s, box-shadow .35s;
}
.news-card:hover {
  transform: translateY(-6px);
  border-color: rgba(99,102,241,.40);
  box-shadow: var(--sf-card-shadow), var(--sf-glow);
}
.news-card-image { position: relative; height: 220px; overflow: hidden; }
.news-card-image img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .6s;
}
.news-card:hover .news-card-image img { transform: scale(1.06); }
.news-card-content { padding: 22px 22px 24px; }
.news-card-title {
  font-size: 19px; font-weight: 700; margin-bottom: 12px; line-height: 1.5;
  color: var(--sf-text); transition: color .3s;
}
.news-card:hover .news-card-title { color: var(--sf-blue); }
.news-card-description {
  color: var(--sf-muted); margin-bottom: 16px; line-height: 1.7;
  max-height: 3.4rem; overflow: hidden; text-overflow: ellipsis;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}
.news-card-meta {
  display: flex; justify-content: space-between; align-items: center;
  padding-top: 16px; border-top: 1px solid var(--sf-border);
  color: var(--sf-muted); font-size: 14px;
}
.time-day {
  font-size: 2.6rem; font-weight: 700; margin-right: 10px; line-height: 1;
  background: var(--sf-grad-glow);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  transition: transform .3s;
}
.news-card:hover .time-day { /* 移除 hover 缩放，避免文字发虚 */ }
.time-month-year { font-size: 14px; color: var(--sf-muted); }

/* ---------- 10. 渐变胶囊按钮（品牌蓝→紫 + 柔和阴影，克制发光） ---------- */
.modern-button {
  display: inline-block;
  background: var(--sf-grad);
  color: #fff;
  padding: 13px 30px;
  border: none;
  border-radius: 999px;
  font-size: 16px; font-weight: 700;
  text-align: center; text-decoration: none; cursor: pointer;
  transition: transform .3s, box-shadow .3s;
  box-shadow: 0 10px 26px rgba(59,91,255,.22);
}
.modern-button:hover {
  transform: translateY(-2px); color: #fff;
  box-shadow: 0 14px 32px rgba(59,91,255,.30), 0 0 14px rgba(99,102,241,.18);
}
.button-container { text-align: center; margin-top: 24px; }

/* ---------- 11. 内页产品列表卡片（纯白卡片） ---------- */
.featured-ul li {
  border-radius: var(--sf-radius);
  padding: 0;
  overflow: hidden;
  box-shadow: var(--sf-card-shadow);
  border: 1px solid var(--sf-border);
  background: var(--sf-bg);
  transition: transform .35s cubic-bezier(.25,.8,.25,1), box-shadow .35s, border-color .35s;
}
.featured-ul li:hover {
  transform: translateY(-6px);
  border-color: rgba(99,102,241,.40);
  box-shadow: var(--sf-card-shadow), var(--sf-glow);
}
.featured-ul li .img {
  height: 190px; overflow: hidden;
  background: var(--sf-bg-soft);
}
.featured-ul li .img img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .6s;
}
.featured-ul li:hover .img img { transform: scale(1.08); }
.featured-ul li .hover-div {
  background: linear-gradient(180deg, transparent, rgba(59,91,255,.12));
}
.featured-ul li h3 {
  height: auto; line-height: 1.5;
  padding: 14px 16px 0;
  white-space: normal;
  color: var(--sf-text); font-size: 16px;
}
.featured-ul li:hover h3 { color: var(--sf-blue); }
.featured-ul li p {
  color: var(--sf-muted);
  padding: 6px 16px 0; height: auto;
}
.featured-ul li span {
  color: #fff; background: var(--sf-grad);
  border-radius: 999px;
  margin: 14px 16px 16px; padding: 0 18px;
}

/* ---------- 12. 左侧导航（纯白侧栏） ---------- */
.left-nav {
  background: var(--sf-bg);
  border: 1px solid var(--sf-border);
  border-radius: var(--sf-radius);
  padding: 8px;
  box-shadow: var(--sf-card-shadow);
  overflow: hidden;
}
.left-nav h3 {
  background: var(--sf-bg-soft);
  color: var(--sf-ink);
  border-radius: var(--sf-radius-sm);
  border-left: 3px solid transparent;
  transition: .3s;
}
.left-nav h3.on, .left-nav h3:hover {
  background: var(--sf-grad);
  color: #fff;
  border-left-color: #fff;
}
.left-nav .item { background: transparent; }
.left-nav .item li a {
  color: var(--sf-muted);
  border-radius: 8px; transition: .25s;
}
.left-nav .item li a:hover, .left-nav .item li.on a {
  color: var(--sf-blue); background: var(--sf-bg-soft);
}

/* ---------- 13. 分页 ---------- */
.pagination a:hover, .pagination a.page-num-current {
  background: var(--sf-grad);
  color: #fff; border-color: transparent;
  box-shadow: 0 4px 14px rgba(59,91,255,.24);
}
.pagination .page-info {
  border-color: var(--sf-border);
  background: var(--sf-bg-soft);
  color: var(--sf-muted);
}

/* ---------- 14. 产品详情（纯白卡片） ---------- */
.productsbox {
  background: var(--sf-bg);
  border: 1px solid var(--sf-border);
  border-radius: var(--sf-radius);
  padding: 28px;
  box-shadow: var(--sf-card-shadow);
  margin-bottom: 30px;
}
.products-leftimg .gallery-top {
  border-radius: var(--sf-radius-sm); overflow: hidden;
  border: 1px solid var(--sf-border);
}
.products-leftimg .gallery-thumbs {
  border-radius: var(--sf-radius-sm); overflow: hidden;
}
.productstopR h1 { color: var(--sf-ink); font-size: 28px; margin-bottom: 16px; }
.productstop-table { width: 100%; border-collapse: collapse; margin-top: 10px; }
.productstop-table th, .productstop-table td {
  border: 1px solid var(--sf-border); padding: 12px 14px;
  text-align: left; font-size: 15px;
}
.productstop-table th { background: var(--sf-bg-soft); color: var(--sf-text); width: 130px; }
.productstop-table td { color: var(--sf-muted); }

/* ---------- 15. 详情页选项卡（已重构至 Section 26 圆角卡片） ---------- */

/* ---------- 16. 页脚（赛博朋克：深暗蓝紫底 + 霓虹三色流光 + 扫描线 + 网格 + 浅色霓虹文字，与 page-header 统一） ---------- */
.footer {
  /* 底层：深暗蓝紫渐变（同 page-header），叠加极淡网格底纹。
     网格与深暗底一同放在 .footer 自身背景层（最底层），流光/扫描线在 pseudos 中覆盖其上。
     层级（底→顶）：footer 背景(深暗渐变+网格) → ::before 扫描线(z:1) → ::after 流光(z:2) → 内容(z:3)。 */
  background:
    linear-gradient(rgba(56,189,248,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(56,189,248,.08) 1px, transparent 1px),
    linear-gradient(135deg, #070912 0%, #0d0f24 35%, #15103a 65%, #0a0820 100%);
  background-size: 42px 42px, 42px 42px, 100% 100%;
  color: var(--sf-text);
  border-top: 1px solid rgba(56,189,248,.18);  /* 霓虹青微光顶边（与 page-header 底边对称），与下方纹理自然过渡 */
  position: relative;
  overflow: hidden;
  z-index: 0;                                  /* 创建堆叠上下文，约束纹理层在 footer 内部 */
}
/* 扫描线纹理层（与 page-header 完全一致：.04 透明度 + ph-scan 10s 纵向漂移），z:1 */
.footer::before {
  content: '';
  position: absolute; inset: 0; z-index: 1;
  background: repeating-linear-gradient(0deg,
    rgba(56,189,248,.04) 0px, rgba(56,189,248,.04) 1px,
    transparent 1px, transparent 4px);
  pointer-events: none;
  animation: ph-scan 10s linear infinite;
}
/* 霓虹三色流光光带（与 page-header .ph-bg 完全一致：霓虹青#38bdf8 / 淡紫#3b82f6 / 电光粉#60a5fa，
   background-size:200% + ph-flow 10s linear 无缝循环），z:2 */
.footer::after {
  content: '';
  position: absolute; inset: 0; z-index: 2;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(56,189,248,0) 6%,
    rgba(56,189,248,.42) 15%,
    rgba(56,189,248,0) 26%,
    transparent 32%,
    rgba(157,78,221,0) 38%,
    rgba(157,78,221,.38) 50%,
    rgba(157,78,221,0) 62%,
    transparent 68%,
    rgba(255,46,166,0) 74%,
    rgba(255,46,166,.42) 85%,
    rgba(255,46,166,0) 96%,
    transparent 100%
  );
  background-size: 200% 100%;
  background-repeat: repeat;
  animation: ph-flow 10s linear infinite;
  pointer-events: none;
}
/* footer 所有直接内容浮于所有纹理层之上（z:3），保证文字/链接/版权清晰可读 */
.footer > * { position: relative; z-index: 3; }

.foot-wave { display: none; }                  /* 隐藏原 SVG 波纹（已用赛博朋克 4 层纹理替代） */

/* ===== 文字配色：全部改为浅色霓虹，深底上保证清晰可读 ===== */
.foot-tit {
  color: #F7FAFF;                              /* 浅霓虹白，列标题（同 page-header ph-title） */
  text-shadow: 0 2px 12px rgba(0,0,0,.55), 0 0 2px rgba(56,189,248,.20);
}
.foot-tit::after {
  background: linear-gradient(90deg, #38bdf8 0%, #3b82f6 55%, #60a5fa 100%);  /* 霓虹三色，与 page-header ph-line 一致 */
  box-shadow: 0 0 8px rgba(56,189,248,.40);
}
.foot-logo {
  background: transparent;                     /* 透明，露出 logo 原色（蓝+绿渐变在深底上对比清晰） */
  box-shadow: none;
}
.foot-logo img {
  filter: drop-shadow(0 0 10px rgba(56,189,248,.22));  /* 微弱霓虹光晕，提升深底可视性 */
}
.foot-desc { color: rgba(170,210,235,.82); }   /* 浅青灰，公司描述（同 page-header ph-sub） */
.cert-chip {
  color: #38bdf8;                              /* 霓虹青文字 */
  background: rgba(56,189,248,.08);
  border: 1px solid rgba(56,189,248,.30);
}
.cert-chip:hover {
  color: #fff;
  background: linear-gradient(120deg, #38bdf8 0%, #3b82f6 50%, #60a5fa 100%);  /* hover 霓虹三色 */
  border-color: transparent;
  box-shadow: 0 0 14px rgba(56,189,248,.35);
}
.foot-navlist li a { color: rgba(180,205,235,.78); }
.foot-navlist li a:hover { color: #38bdf8; }
.foot-info li {
  border-bottom: 1px solid rgba(56,189,248,.12);  /* 霓虹青细分割线 */
}
.foot-info li:hover { background: rgba(56,189,248,.06); }
.foot-info li .ci-icon { color: #38bdf8; opacity: .9; }
.foot-info li:hover .ci-icon { color: #60a5fa; }
.ci-label { color: rgba(170,210,235,.58); }     /* 辅助标签，浅灰 */
.ci-value { color: rgba(220,230,245,.95); }    /* 关键信息，高亮浅色 */
.foot-wx p { color: rgba(170,210,235,.82); }
.foot-wx p::before { background: linear-gradient(90deg, #38bdf8, #3b82f6, #60a5fa); }
.wx-img {
  background: #fff;                            /* QR 二维码保持白底（扫码识别必需） */
  box-shadow: 0 0 18px rgba(56,189,248,.25), 0 8px 24px rgba(0,0,0,.45);  /* 微弱霓虹光晕 */
  border: 1px solid rgba(56,189,248,.20);
}

/* ===== 备案条（透出流光） ===== */
.copy {
  background: transparent;
  border-top: 1px solid rgba(56,189,248,.15);
  color: rgba(170,210,235,.72);
}
.copy-mark { background: linear-gradient(90deg, #38bdf8, #3b82f6, #60a5fa); }
.copy-l p { color: rgba(170,210,235,.72); }
.copy-nav a { color: rgba(170,210,235,.72); }
.copy-nav a + a::before { background: rgba(56,189,248,.22); }
.copy-nav a:hover { color: #38bdf8; }

/* ---------- 17. 联系页（统一到浅色配色） ---------- */
.contact-container, .contact-details, .contact-info,
.contact-content { color: var(--sf-text); }
.contact-item {
  background: var(--sf-bg);
  border: 1px solid var(--sf-border);
  border-left: 3px solid var(--sf-border);
  border-radius: var(--sf-radius-sm);
  box-shadow: var(--sf-card-shadow);
  transition: border-color .3s, box-shadow .3s, transform .3s;
}
.contact-item:hover {
  border-left-color: var(--sf-blue);
  box-shadow: var(--sf-card-shadow), var(--sf-glow);
  transform: translateY(-3px);
}
.contact-icon {
  background: rgba(59,91,255,.10);
  color: var(--sf-blue);
}
.contact-item:hover .contact-icon { background: var(--sf-grad); color: #fff; }
.contact-content h3 { color: var(--sf-text); }
.contact-item:hover .contact-content h3 { color: var(--sf-blue); }
.map-container {
  border-radius: var(--sf-radius);
  box-shadow: var(--sf-card-shadow);
  border: 1px solid var(--sf-border);
}
.map-container:hover { box-shadow: var(--sf-card-shadow), var(--sf-glow); }

/* ---------- 18. 文章页（news 详情，纯白卡片） ---------- */
.newsxq {
  background: var(--sf-bg);
  border: 1px solid var(--sf-border);
  border-radius: var(--sf-radius);
  box-shadow: var(--sf-card-shadow);
}
.news-title h1 { color: var(--sf-ink); }
.news-txts { color: var(--sf-muted); }
.news-txts p, .news-txts li { color: var(--sf-text); }
.page-ny li a { color: var(--sf-blue); }
.page-ny li a:hover { color: var(--sf-violet); }

/* ---------- 18b. 关于我们卡片（纯白卡片） ---------- */
.about-card {
  background: var(--sf-bg);
  border: 1px solid var(--sf-border);
  border-radius: var(--sf-radius);
  box-shadow: var(--sf-card-shadow);
  padding: 30px;
}
.about-title { color: var(--sf-ink); }
.about-eyebrow { color: var(--sf-blue); }
.about-card p, .about-text { color: var(--sf-text); }

/* ---------- 18c. 内页表单（白色输入框） ---------- */
.ny-nrbox input[type=text],
.ny-nrbox input[type=tel],
.ny-nrbox input[type=email],
.ny-nrbox input[type=number],
.ny-nrbox textarea,
.ny-nrbox select {
  background: #fff;
  border: 1px solid var(--sf-border);
  border-radius: 10px;
  color: var(--sf-ink);
  padding: 10px 14px;
}
.ny-nrbox input::placeholder,
.ny-nrbox textarea::placeholder { color: rgba(100,116,139,.5); }
.ny-nrbox label { color: var(--sf-text); }
.ny-nrbox button.btn,
.ny-nrbox input[type=submit] {
  background: var(--sf-grad);
  color: #fff; border: none; border-radius: 999px; cursor: pointer;
}

/* ---------- 19. 返回顶部 ---------- */
.right-abs .abs5 {
  background: url(../images/top2.png) no-repeat 50%, var(--sf-grad);
  border-radius: 14px;
  box-shadow: 0 8px 22px rgba(59,91,255,.28), 0 0 14px rgba(99,102,241,.16);
}
.right-abs .abs5:hover {
  background: url(../images/top2.png) no-repeat 50%, var(--sf-grad);
  transform: translateY(-3px);
}

/* ---------- 19b. 移动端导航 / 语言切换（浅色） ---------- */
.sjj_nav { background: rgba(255,255,255,.98); }
.sjj_nav a, .sjj_nav li { color: var(--sf-ink); }
.sjj_nav li a:hover { color: var(--sf-blue); }
.sjj_mask { background: rgba(15,23,42,.4); }
.sp_nav span { background: var(--sf-ink); }
.lang-toggle { color: var(--sf-ink); }
.lang-options {
  background: #fff;
  border: 1px solid var(--sf-border);
  box-shadow: var(--sf-shadow);
}
.lang-options a { color: var(--sf-ink); }
.lang-options a:hover { color: var(--sf-blue); background: rgba(59,91,255,.07); }

/* ---------- 20. 响应式 ---------- */
@media (max-width: 1024px) {
  .featured-ul li { width: 31.33%; }
  .page-header .ph-title { font-size: 26px; }
}
@media (max-width: 768px) {
  .index-ban { border-radius: 12px; margin: 14px auto 0; }
  .page-header .ph-title { font-size: 23px; }
  .page-header .ph-sub { letter-spacing: 1px; }
  .title-t1 { font-size: 26px; padding: 40px 0 14px; }
  .featured-ul li { width: 48%; }
  .news-grid { grid-template-columns: repeat(2, 1fr); }
  .index-cp { grid-template-columns: repeat(2, 1fr); gap: 14px; padding: 10px 12px 30px; }
  /* 轮播：移动端圆角缩小、扁平圆形按钮缩小、贴近边缘 */
  .index-ban .swiper-button-prev,
  .index-ban .swiper-button-next { width: 42px; height: 42px; }
  .index-ban .swiper-button-prev { left: 12px; }
  .index-ban .swiper-button-next { right: 12px; }
  .index-ban .swiper-button-prev:after,
  .index-ban .swiper-button-next:after { font-size: 18px; }
}
@media (max-width: 640px) {
  .news-grid { grid-template-columns: 1fr; gap: 18px; padding: 10px 12px 24px; }
  /* 窄屏标题可能换行，放宽高度上限避免裁切（min-height 仍含 padding-top，可见高度 ≥ 180px） */
  .page-header { max-height: none; min-height: calc(180px + var(--topbar-h) + var(--header-h)); }
  /* 窄屏面包屑：允许换行，bread-r 独占一行仍靠右，避免与子栏目链接挤占溢出 */
  .page-header .ph-bread .w1450px { flex-wrap: wrap; }
  .page-header .ph-bread .bread-r { width: 100%; margin-left: 0; text-align: right; }
}
@media (max-width: 480px) {
  .featured-ul li { width: 100%; }
  .page-header .ph-title { font-size: 20px; }
  .title-t1 { font-size: 22px; }
}


/* ============================================================
   20. 返回顶部按钮 - Uiverse 风格（主题色跟随 :root 变量）
   From Uiverse.io by vinodjangid07 - 改造为CSS变量驱动
   ============================================================ */
:root {
  --main-color: var(--sf-blue);
  --main-color-alpha: color-mix(in srgb, var(--sf-blue) 25%, transparent);
  --dark-bg: var(--sf-ink);
}

.btt-uiverse-wrap {
  position: fixed;
  right: 24px;
  bottom: 32px;
  z-index: 999;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(20px);
  transition: opacity .35s ease, visibility .35s ease, transform .35s ease;
}
.btt-uiverse-wrap.btt-show {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

.btt-uiverse-button {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: var(--dark-bg);
  border: none;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0px 0px 0px 4px var(--main-color-alpha);
  cursor: pointer;
  transition-duration: 0.3s;
  overflow: hidden;
  position: relative;
  outline: none;
  -webkit-tap-highlight-color: transparent;
}

.btt-uiverse-svgIcon {
  width: 12px;
  transition-duration: 0.3s;
}
.btt-uiverse-svgIcon path {
  fill: var(--sf-bg, white);
}

.btt-uiverse-button:hover {
  width: 140px;
  border-radius: 50px;
  transition-duration: 0.3s;
  background-color: var(--main-color);
  align-items: center;
}
.btt-uiverse-button:hover .btt-uiverse-svgIcon {
  transition-duration: 0.3s;
  transform: translateY(-200%);
}

.btt-uiverse-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) translateY(12px);
  color: var(--sf-bg, #fff);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease, transform 0.3s ease;
}
.btt-uiverse-button:hover .btt-uiverse-text {
  opacity: 1;
  transform: translate(-50%, -50%) translateY(0);
}

@media (max-width: 768px) {
  .btt-uiverse-wrap { right: 14px; bottom: 22px; }
  .btt-uiverse-button {
    width: 42px;
    height: 42px;
    box-shadow: 0px 0px 0px 3px var(--main-color-alpha);
  }
  .btt-uiverse-svgIcon { width: 11px; }
  .btt-uiverse-button:hover,
  .btt-uiverse-button:active {
    width: 42px;
    border-radius: 50%;
    background-color: var(--main-color);
  }
  .btt-uiverse-button:hover .btt-uiverse-svgIcon {
    transform: translateY(-2px);
  }
  .btt-uiverse-button:hover .btt-uiverse-text { opacity: 0; }
}
@media (max-width: 480px) {
  .btt-uiverse-wrap { right: 12px; bottom: 18px; }
}

/* ============================================================
   21. 白底科技风主题（干净白底 + 柔和层次 + 淡紫点缀）
   策略：:root 变量重映射 + 流光降饱和 + 卡片柔和阴影
   ============================================================ */
:root {
  /* === 白底科技风基础变量 === */
  --bg-main: #ffffff;             /* 页面底层白底 */
  --bg-block: #f7f8fa;            /* 内容区块底色 */
  --text-title: #111420;          /* 标题文字 - 深炭灰 */
  --text-body: #333644;           /* 正文文字 */
  --text-muted: #717488;          /* 辅助次要文字 */
  --main-color: #2563eb;          /* 主色 - 柔和科技蓝，高级克制 */
  --main-color-alpha: rgba(37, 99, 235, 0.15); /* 主色透明光晕 */
  --dark-bg: #2a2a35;             /* 返回顶部按钮深色基底 */

  /* === sf-* 变量重映射（让所有引用旧变量的组件自动跟随白底） === */
  --sf-page-bg: var(--bg-main);
  --sf-bg: #ffffff;               /* 卡片底：纯白 */
  --sf-bg-soft: var(--bg-block);  /* 次级容器：浅灰 */
  --sf-ink: var(--text-title);    /* 标题色 */
  --sf-text: var(--text-body);    /* 正文色 */
  --sf-muted: var(--text-muted);  /* 辅助色 */
  --sf-border: #e7eaf2;           /* 浅冷调细描边 */
  --sf-shadow: 0 10px 30px rgba(17, 20, 32, 0.06);
  --sf-shadow-lg: 0 22px 56px rgba(17, 20, 32, 0.08);
  --sf-card-shadow: 0 4px 16px rgba(17, 20, 32, 0.05), 0 1px 3px rgba(17, 20, 32, 0.03);
  --sf-glow: 0 0 20px rgba(37, 99, 235, 0.14);
  --sf-glow-strong: 0 0 26px rgba(37, 99, 235, 0.22);
  --bp-text: var(--text-body);
  --bp-text-light: var(--text-muted);
  --bp-border: var(--sf-border);
  --bp-bg: #ffffff;
  --bp-bg-soft: var(--bg-block);
  --bp-primary: var(--main-color);
  --bp-primary-light: #3b82f6;
  --bp-primary-dark: #1d4ed8;
}

/* === body 底色 + 文字 === */
body {
  background-color: var(--bg-main);
  color: var(--text-body);
}
h1, h2, h3, h4, h5, h6 { color: var(--text-title); }

/* === 主导航：浅色磨砂玻璃 === */
#header {
  background: rgba(255, 255, 255, 0.78);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  backdrop-filter: blur(14px) saturate(140%);
  border-bottom: 1px solid var(--sf-border);
  box-shadow: 0 4px 20px rgba(17, 20, 32, 0.04);
}
#header.is-stuck { background: rgba(255, 255, 255, 0.92); }
.nav li.nLi h3 a { color: var(--text-title); }
.nav li.nLi:hover h3 a,
.nav li.nLi.on h3 a,
.nav li.nLi h3 a:hover { color: var(--main-color); }
.nav li .sub {
  background: #ffffff;
  border: 1px solid var(--sf-border);
  box-shadow: var(--sf-shadow);
}
.nav li .sub li a { color: var(--text-body); }
.nav li .sub li a:hover { color: var(--main-color); background: rgba(37, 99, 235, 0.06); }
.logo-text .lt-name {
  background: linear-gradient(120deg, var(--main-color) 0%, #3b82f6 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.logo-text .lt-slogan { color: var(--text-muted); }

/* === 顶部信息条：深色（与白底形成对比，保持层次） === */
.topbar {
  background: linear-gradient(95deg, #111420 0%, #1a1d2a 50%, #232636 100%);
  color: #c7c9d9;
  border-bottom: 1px solid rgba(0,0,0,0.1);
}
.topbar .tb-item,
.topbar .tb-link { color: #c7c9d9; }
.topbar .tb-link:hover { color: var(--main-color); }

/* === 轮播英雄区：白底兜底 === */
.index-ban .swiper-slide {
  background: linear-gradient(135deg, #f7f8fa 0%, #ffffff 50%, #f0f2f8 100%);
}
.index-ban .swiper-pagination-bullet { background: rgba(17, 20, 32, 0.25); }
.index-ban .swiper-pagination-bullet-active { background: var(--main-color); }
.index-ban .swiper-button-next,
.index-ban .swiper-button-prev {
  background: rgba(255, 255, 255, 0.78);
  color: var(--text-title);
}

/* === page-header：白底流光融合 === */
.page-header .ph-title { color: var(--text-title); }
.page-header .ph-sub { color: var(--text-muted); }
.page-header .ph-bread .bread-l a { color: var(--text-muted); }
.page-header .ph-bread .bread-l a:hover,
.page-header .ph-bread .bread-l a.on { color: var(--main-color); }
.page-header .ph-bread .bread-r { color: var(--text-muted); }

/* === 产品列表卡片：纯白底 + 柔和阴影 === */
.featured-ul li {
  background: #ffffff !important;
  border: 1px solid var(--sf-border) !important;
  box-shadow: var(--sf-card-shadow) !important;
}
.featured-ul li:hover {
  border-color: rgba(37, 99, 235, 0.30) !important;
  box-shadow: 0 12px 32px rgba(37, 99, 235, 0.10) !important;
}
.featured-ul li .img { background: var(--bg-block) !important; }
.featured-ul li h3 { color: var(--text-title) !important; }
.featured-ul li:hover h3 { color: var(--main-color) !important; }
.featured-ul li p { color: var(--text-muted) !important; }

/* === 左侧导航：浅色侧栏 === */
.left-nav h3 { background-color: var(--bg-block); color: var(--text-title); }
.left-nav ul.item { background: #ffffff; border: 1px solid var(--sf-border); }
.left-nav ul.item li a { color: var(--text-body); }
.left-nav ul.item li a:hover,
.left-nav ul.item li a.on { color: var(--main-color); background: rgba(37, 99, 235, 0.06); }

/* === 分页 === */
.pagebar .pagination a {
  background: #ffffff;
  color: var(--text-body);
  border: 1px solid var(--sf-border);
}
.pagebar .pagination a:hover { color: var(--main-color); border-color: var(--main-color); }

/* === 产品详情 / 文章页 / 关于我们卡片 === */
.product-detail-box,
.news-detail-box,
.about-detail-box,
.contact-box { background: #ffffff !important; }
.productstop-table th { background: var(--bg-block) !important; color: var(--text-title) !important; }
.productstop-table td { color: var(--text-body); }

/* === 选项卡白底适配已并入 Section 26 === */

/* === 表单输入框：白底 === */
input[type="text"], input[type="email"], input[type="tel"],
input[type="password"], textarea, select {
  background: #ffffff !important;
  border: 1px solid var(--sf-border) !important;
  color: var(--text-body) !important;
}
input[type="text"]:focus, input[type="email"]:focus, input[type="tel"]:focus,
input[type="password"]:focus, textarea:focus, select:focus {
  border-color: var(--main-color) !important;
}
input::placeholder, textarea::placeholder { color: var(--text-muted); }

/* === 移动端导航 / 语言切换 === */
.sjj_nav { background: #ffffff; }
.sjj_nav ul li a { color: var(--text-body); }
.lang-options { background: #ffffff; border: 1px solid var(--sf-border); }
.lang-options .lang-link { color: var(--text-body); }
.lang-options .lang-link:hover { color: var(--main-color); background: rgba(37, 99, 235, 0.06); }

/* === 返回顶部按钮：跟随主色 === */
.btt-uiverse-button {
  background-color: var(--dark-bg);
  box-shadow: 0px 0px 0px 4px var(--main-color-alpha);
}
.btt-uiverse-button:hover { background-color: var(--main-color); }
.btt-uiverse-svgIcon path { fill: #ffffff; }

/* === 区块标题渐变下划线 === */
.title-t1::after,
.foot-tit::after { background: linear-gradient(90deg, var(--main-color), #3b82f6, var(--main-color)) !important; }

/* === 内容容器通用底色 === */
.container-block { background: var(--bg-block); }
.text-desc { color: var(--text-muted); }
/* ============================================================
   22. 导航激活状态样式修正（统一主色 + 细线圆角下划线）
   ============================================================ */

/* 默认导航文字 */
.nav li.nLi h3 a { color: var(--text-body) !important; }

/* hover / 激活 文字色 = 主色 */
.nav li.nLi:hover h3 a,
.nav li.nLi.on h3 a,
.nav li.nLi h3 a:hover { color: var(--main-color) !important; }

/* 细线圆角下划线：贴合文字长度，不超长 */
.nav li.nLi h3 a {
  position: relative;
}
.nav li.nLi h3 a::after,
.nav li.nLi.on h3 a::after,
.nav li.nLi h3 a:hover::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  bottom: 4px !important;
  width: 0 !important;
  height: 2px !important;
  border-radius: 2px !important;
  background: var(--main-color) !important;
  transform: translateX(-50%) !important;
  transition: width .28s ease !important;
}
.nav li.nLi:hover h3 a::after,
.nav li.nLi h3 a:hover::after {
  width: 70% !important;
}

/* 下拉菜单顶部蓝条改为主色细线 */
.nav li .sub {
  border-top: 2px solid var(--main-color) !important;
}
.nav li .sub li a { color: var(--text-body) !important; }
.nav li .sub li a:hover {
  color: var(--main-color) !important;
  background: rgba(37, 99, 235, 0.08) !important;
}

/* 语言切换按钮：与导航视觉重量平衡 */
.lang-toggle {
  color: var(--text-body) !important;
  border: 1px solid var(--sf-border) !important;
  background: var(--bg-block) !important;
  border-radius: 18px !important;
  padding: 6px 14px !important;
  font-size: 13px !important;
  transition: all .25s ease !important;
}
.lang-toggle:hover {
  color: var(--main-color) !important;
  border-color: var(--main-color) !important;
  background: rgba(37, 99, 235, 0.06) !important;
}
.lang-options {
  background: #ffffff !important;
  border: 1px solid var(--sf-border) !important;
  box-shadow: var(--sf-shadow) !important;
  border-radius: 10px !important;
  overflow: hidden;
}
.lang-options .lang-link {
  color: var(--text-body) !important;
  transition: all .2s ease !important;
}
.lang-options .lang-link:hover {
  color: var(--main-color) !important;
  background: rgba(37, 99, 235, 0.08) !important;
}

/* 移动端导航激活态同步主色 */
.sjj_nav li a { color: var(--text-body) !important; }
.sjj_nav li a:hover,
.sjj_nav li a.on { color: var(--main-color) !important; }

/* ============================================================
   23. Footer 商务稳重重构（车载科技企业官网风格）
   - 极淡弥散光底纹，呼应导航流光，低调不喧宾夺主
   - 大留白提升高级质感，细线柔和分隔
   - 全局 :root 变量，严格文字层级
   - 柔和 hover 过渡，无夸张动画
   ============================================================ */

/* === 底层容器 === */
.footer {
  background: var(--bg-main) !important;
  color: var(--text-muted) !important;
  border-top: 1px solid var(--sf-border) !important;
  position: relative;
  overflow: hidden;
}
/* 极淡弥散光：呼应导航流光，低调柔和 */
.footer::before {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  background:
    radial-gradient(ellipse 600px 300px at 15% 20%, var(--main-color-alpha), transparent 70%),
    radial-gradient(ellipse 500px 280px at 85% 80%, color-mix(in srgb, var(--main-color) 8%, transparent), transparent 70%) !important;
  opacity: 0.5 !important;
  animation: footDiffuse 18s ease-in-out infinite alternate !important;
  pointer-events: none !important;
}
@keyframes footDiffuse {
  0%   { transform: translate(0, 0) scale(1); }
  50%  { transform: translate(20px, -10px) scale(1.05); }
  100% { transform: translate(-15px, 15px) scale(1); }
}
/* 清除旧 ::after 扫描线 */
.footer::after { display: none !important; }
.footer > * { position: relative; z-index: 2 !important; }
.foot-wave { display: none !important; }

/* === 四列主内容区：大留白 === */
.foot-top {
  padding: 80px 0 56px !important;
  gap: 0 !important;
}
.foot-col {
  padding: 0 36px !important;
  box-sizing: border-box !important;
}

/* === 栏目标题：细线柔和 === */
.foot-tit {
  color: var(--text-title) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  margin: 0 0 28px !important;
  padding: 0 0 12px !important;
  text-shadow: none !important;
  position: relative;
}
.foot-tit::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 24px !important;
  height: 1px !important;
  background: var(--main-color) !important;
  opacity: 0.6;
  border-radius: 1px !important;
  box-shadow: none !important;
}

/* === 品牌列 === */
.foot-logo {
  background: transparent !important;
  box-shadow: none !important;
  margin-bottom: 22px !important;
  transition: opacity 0.3s ease !important;
}
.foot-logo:hover { opacity: 0.85; }
.foot-logo img { filter: none !important; }
.foot-desc {
  color: var(--text-muted) !important;
  font-size: 13px !important;
  line-height: 1.9 !important;
  letter-spacing: 0.2px !important;
  margin-bottom: 20px !important;
}
/* 资质标签：简洁圆角，hover 统一全站按钮风格 */
.foot-cert { gap: 10px !important; }
.cert-chip {
  color: var(--main-color) !important;
  background: var(--main-color-alpha) !important;
  border: 1px solid color-mix(in srgb, var(--main-color) 18%, transparent) !important;
  padding: 6px 14px !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  border-radius: 6px !important;
  letter-spacing: 0.3px !important;
  transition: all 0.3s ease !important;
}
.cert-chip:hover {
  color: #fff !important;
  background: var(--main-color) !important;
  border-color: var(--main-color) !important;
  box-shadow: 0 4px 12px var(--main-color-alpha) !important;
}

/* === 快速导航：柔和 hover === */
.foot-navlist li { margin-bottom: 14px !important; }
.foot-navlist li a {
  color: var(--text-body) !important;
  font-size: 14px !important;
  letter-spacing: 0.2px !important;
  transition: color 0.3s ease, padding-left 0.3s ease !important;
}
.foot-navlist li a::before {
  background: var(--main-color) !important;
  transition: width 0.3s ease, margin-right 0.3s ease !important;
}
.foot-navlist li a:hover {
  color: var(--main-color) !important;
  transform: none !important;
}

/* === 联系方式：分割线轻量化 === */
.foot-info li {
  border-bottom: 1px solid color-mix(in srgb, var(--sf-border) 60%, transparent) !important;
  padding: 13px 0 !important;
  gap: 12px !important;
  transition: background 0.3s ease !important;
}
.foot-info li:last-child { border-bottom: none !important; }
.foot-info li:hover { background: transparent !important; }
.foot-info li .ci-icon {
  color: var(--main-color) !important;
  opacity: 0.75 !important;
  transition: opacity 0.3s ease !important;
}
.foot-info li:hover .ci-icon {
  opacity: 1 !important;
  transform: none !important;
}
.ci-label {
  color: var(--text-muted) !important;
  font-size: 12px !important;
  letter-spacing: 0.2px !important;
}
.ci-value {
  color: var(--text-body) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
}

/* === 微信公众号：柔和阴影 === */
.foot-wx { gap: 16px !important; }
.wx-img {
  background: #fff !important;
  border: 1px solid var(--sf-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 16px rgba(17, 20, 32, 0.05) !important;
  transition: box-shadow 0.3s ease, transform 0.3s ease !important;
}
.wx-img:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(17, 20, 32, 0.08) !important;
}
.foot-wx p {
  color: var(--text-muted) !important;
  font-size: 13px !important;
  letter-spacing: 0.2px !important;
}
.foot-wx p::before { background: var(--main-color) !important; opacity: 0.6; }

/* === 版权栏：纤细分隔，有序排列 === */
.copy {
  background: transparent !important;
  border-top: 1px solid var(--sf-border) !important;
  color: var(--text-muted) !important;
  padding: 20px 0 !important;
}
.copy .w1450px {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px;
}
.copy-l {
  float: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
.copy-mark {
  width: 3px !important;
  height: 14px !important;
  border-radius: 2px !important;
  background: var(--main-color) !important;
  opacity: 0.7;
}
.copy-l p {
  color: var(--text-muted) !important;
  font-size: 13px !important;
  letter-spacing: 0.2px !important;
  margin: 0 !important;
}
.copy-nav {
  float: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}
.copy-nav a {
  color: var(--text-muted) !important;
  font-size: 13px !important;
  padding: 4px 12px !important;
  border-radius: 4px !important;
  transition: color 0.3s ease, background 0.3s ease !important;
}
.copy-nav a + a::before {
  display: none !important;
}
.copy-nav a:hover {
  color: var(--main-color) !important;
  background: var(--main-color-alpha) !important;
}

/* === 移动端自适应：单列布局 === */
@media (max-width: 992px) {
  .foot-top {
    flex-direction: column !important;
    padding: 56px 0 32px !important;
  }
  .foot-col {
    width: 100% !important;
    padding: 0 0 32px !important;
  }
  .foot-col:last-child { padding-bottom: 0 !important; }
  .foot-brand, .foot-nav-col, .foot-contact, .foot-social {
    width: 100% !important;
  }
  .foot-tit { margin: 0 0 20px !important; }
  .copy .w1450px {
    flex-direction: column !important;
    text-align: center !important;
    gap: 12px !important;
  }
  .copy-l, .copy-nav {
    justify-content: center !important;
  }
}
@media (max-width: 576px) {
  .foot-top { padding: 40px 16px 24px !important; }
  .foot-col { padding: 0 0 24px !important; }
  .foot-desc { font-size: 12px !important; line-height: 1.8 !important; }
  .foot-navlist li a { font-size: 13px !important; }
  .foot-info li { padding: 11px 0 !important; }
  .ci-value { font-size: 13px !important; }
  .copy { padding: 16px 0 !important; }
  .copy-nav a { padding: 4px 8px !important; font-size: 12px !important; }
}
/* ============================================================
   25. 富文本重置样式（rich-content）—— 适配 UEditor-Plus 输出
   - 专属容器，不污染其他模块
   - 强制继承全站阿里普惠字体，清除行内 style 干扰
   - 严格读取 :root 变量，匹配白底科技风
   - 兼容历史已录入产品数据，依靠 CSS 优先级覆盖
   ============================================================ */
.rich-content {
  font-family: "AlibabaPuHuiTi", "Alibaba PuHuiTi", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  font-size: 15px !important;
  line-height: 1.85 !important;
  color: var(--text-main) !important;
  word-break: break-word !important;
  overflow-wrap: break-word !important;
}
.rich-content [style*="font"],
.rich-content [style*="color"],
.rich-content [style*="line-height"],
.rich-content font {
  font-family: inherit !important;
  font-size: inherit !important;
  color: inherit !important;
  line-height: inherit !important;
}
.rich-content span[style],
.rich-content p[style],
.rich-content div[style] {
  font-family: inherit !important;
  color: inherit !important;
  line-height: inherit !important;
}
.rich-content p {
  margin: 0 0 16px !important;
  padding: 0 !important;
}
.rich-content p:last-child { margin-bottom: 0 !important; }
.rich-content strong, .rich-content b {
  font-weight: 700 !important;
  color: var(--text-title) !important;
}
.rich-content em, .rich-content i { font-style: italic !important; }
.rich-content u { text-decoration: underline !important; }
.rich-content del, .rich-content s { color: var(--text-aux) !important; }
.rich-content h1, .rich-content h2, .rich-content h3,
.rich-content h4, .rich-content h5, .rich-content h6 {
  color: var(--text-title) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  margin: 28px 0 14px !important;
  padding: 0 !important;
  text-shadow: none !important;
}
.rich-content h1 { font-size: 24px !important; }
.rich-content h2 { font-size: 21px !important; }
.rich-content h3 { font-size: 18px !important; }
.rich-content h4 { font-size: 16px !important; }
.rich-content h5, .rich-content h6 { font-size: 15px !important; }
.rich-content h1:first-child, .rich-content h2:first-child,
.rich-content h3:first-child, .rich-content h4:first-child { margin-top: 0 !important; }
.rich-content ul, .rich-content ol {
  margin: 0 0 16px !important;
  padding-left: 24px !important;
  color: var(--text-main) !important;
}
.rich-content li { margin-bottom: 8px !important; line-height: 1.8 !important; }
.rich-content li:last-child { margin-bottom: 0 !important; }
.rich-content ul li { list-style: disc !important; }
.rich-content ol li { list-style: decimal !important; }
.rich-content ul ul, .rich-content ol ol, .rich-content ul ol, .rich-content ol ul { margin: 8px 0 0 !important; }
.rich-content img {
  max-width: 100% !important;
  height: auto !important;
  border-radius: 6px !important;
  box-shadow: 0 2px 12px rgba(17, 20, 32, 0.06) !important;
  vertical-align: middle !important;
}
.rich-content p img { margin: 8px 0 !important; }
.rich-content > img {
  display: block !important;
  margin: 16px auto !important;
}
.rich-content img[style*="float"] { float: none !important; }
.rich-content table {
  width: 100% !important;
  max-width: 100% !important;
  border-collapse: collapse !important;
  margin: 20px 0 !important;
  font-size: 14px !important;
  display: block !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
  white-space: nowrap !important;
}
.rich-content thead { display: table-header-group !important; }
.rich-content th, .rich-content td {
  padding: 12px 16px !important;
  border: 1px solid var(--sf-border) !important;
  text-align: left !important;
  vertical-align: middle !important;
  white-space: normal !important;
  color: var(--text-main) !important;
}
.rich-content th {
  background: var(--bg-block) !important;
  color: var(--text-title) !important;
  font-weight: 700 !important;
}
.rich-content tr:nth-child(even) td { background: color-mix(in srgb, var(--bg-block) 50%, transparent) !important; }
.rich-content tr:hover td { background: var(--main-color-alpha) !important; }
.rich-content a {
  color: var(--main-color) !important;
  text-decoration: none !important;
  border-bottom: 1px solid color-mix(in srgb, var(--main-color) 30%, transparent) !important;
  transition: color 0.3s ease, border-color 0.3s ease !important;
}
.rich-content a:hover {
  color: var(--main-color) !important;
  border-bottom-color: var(--main-color) !important;
  opacity: 0.85;
}
.rich-content blockquote {
  margin: 20px 0 !important;
  padding: 14px 20px !important;
  border-left: 3px solid var(--main-color) !important;
  background: var(--bg-block) !important;
  color: var(--text-aux) !important;
  font-size: 14px !important;
  border-radius: 0 6px 6px 0 !important;
}
.rich-content blockquote p { margin: 0 !important; color: var(--text-aux) !important; }
.rich-content pre {
  margin: 16px 0 !important;
  padding: 16px !important;
  background: var(--bg-block) !important;
  border: 1px solid var(--sf-border) !important;
  border-radius: 6px !important;
  overflow-x: auto !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}
.rich-content code {
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace !important;
  font-size: 13px !important;
}
.rich-content pre code { color: var(--text-main) !important; background: transparent !important; padding: 0 !important; }
.rich-content p code, .rich-content li code {
  background: var(--bg-block) !important;
  padding: 2px 6px !important;
  border-radius: 3px !important;
  color: var(--main-color) !important;
}
.rich-content hr {
  border: none !important;
  height: 1px !important;
  background: var(--sf-border) !important;
  margin: 24px 0 !important;
}
@media (max-width: 768px) {
  .rich-content { font-size: 14px !important; line-height: 1.8 !important; }
  .rich-content h1 { font-size: 21px !important; }
  .rich-content h2 { font-size: 19px !important; }
  .rich-content h3 { font-size: 16px !important; }
  .rich-content h4 { font-size: 15px !important; }
  .rich-content p { margin-bottom: 14px !important; }
  .rich-content p img { margin: 6px 0 !important; }
  .rich-content table { font-size: 13px !important; }
  .rich-content th, .rich-content td { padding: 10px 12px !important; }
}

/* Section 26 见文件末尾 */
/* ============================================================
/* ============================================================
   26. 产品详情页 Tab 标签（简约精致科技风）
   - 紧凑比例，小圆角，无描边，背景深浅区分选中态
   - 全局 :root 变量，中英文自适应，移动端兼容
   ============================================================ */

/* === 容器 === */
.slideTxtBox .hd {
  position: relative;
  border-bottom: none;
  padding: 0 0 24px;
  margin-bottom: 0;
}
.slideTxtBox .hd ul {
  position: relative;
  display: flex;            /* 改为 flex，使两个 tab 占满整行 */
  width: 100%;             /* 占满父容器整行宽度 */
  flex-wrap: nowrap;
  gap: 4px;
  list-style: none;
  margin: 0;
  padding: 4px;
  background: var(--bg-block);
  border-radius: 8px;
  box-sizing: border-box;
}

/* === Tab 标签：紧凑精致 === */
.slideTxtBox .hd li {
  box-sizing: border-box !important;
  position: relative;
  z-index: 2;
  flex: 1 1 0 !important;   /* 关键：两个 tab 等分整行宽度 */
  padding: 10px 8px !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  color: var(--text-muted) !important;
  background: transparent !important;
  border: none !important;
  border-radius: 8px !important;
  cursor: pointer;
  white-space: nowrap;
  text-align: center !important;
  transition: color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease !important;
}

/* === 未激活 hover === */
.slideTxtBox .hd li:hover {
  color: var(--text-title) !important;
  background: color-mix(in srgb, var(--main-color) 6%, transparent) !important;
}

/* === 激活态：白底卡片，背景深浅区分 === */
.slideTxtBox .hd li.on {
  color: var(--main-color) !important;
  font-weight: 700 !important;
  background: #ffffff !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(17, 20, 32, 0.10) !important;
}

/* === 内容区 === */
.slideTxtBox .bd {
  padding: 32px 0 0 !important;
  color: var(--text-main) !important;
  background: transparent !important;
}

/* === 移除旧下划线 === */
.slideTxtBox .tab-underline { display: none !important; }

/* === 移动端适配 === */
@media (max-width: 768px) {
  .slideTxtBox .hd { padding-bottom: 16px; }
  .slideTxtBox .hd ul { gap: 3px; padding: 3px; }
  .slideTxtBox .hd li {
    padding: 6px 16px !important;
    font-size: 13px !important;
    border-radius: 4px !important;
  }
  .slideTxtBox .bd { padding: 24px 0 0 !important; }
}
@media (max-width: 480px) {
  .slideTxtBox .hd ul { display: flex; width: 100%; }
  .slideTxtBox .hd li {
    flex: 1 1 auto;
    padding: 6px 10px !important;
    font-size: 13px !important;
  }
}

/* ============================================================
   全局字体清晰度修正 — 覆盖 main.css 内超原生字重 / 文字缩放
   （不改动 main.css 70KB 原文件，仅在此覆盖层追加）
   HarmonyOS Sans / HarmonyOS Sans SC 仅 @font-face 声明 400/700，
   故 500/600/800 会触发浏览器合成加粗(faux bold)→发虚，全部对齐原生字重：
   500→400，600→700，800→700（就近原生字重）。
   ============================================================ */
.nav li.nLi h3 a,
#header-nav li h3 a { font-weight: 400; }            /* main.css:345  (500→400) */

.sjj_nav > ul > li > a { font-weight: 400; }         /* main.css:646  (500→400) */

.foot-tit { font-weight: 700; }                       /* main.css:1219 (600→700) */

.ci-label { font-weight: 400; }                       /* main.css:1349 (500→400) */

.pagination a.page-num-current { font-weight: 700; }  /* main.css:3562 (600→700) */

/* 移除页脚联系图标 hover 缩放，避免图标字形发虚（main.css:1335 .ci-icon） */
.foot-info li:hover .ci-icon { transform: none; }

/* ============================================================
   产品参数 Tab 组件 — 国际化简洁舒适 UI（中英文完全共用同一套）
   - 轻圆角弱阴影卡片容器；左右内边距收窄、上下留白充足；合理最大宽度避免大屏空洞松散
   - 内部参数表 width:100% 铺满；首列参数名 min-width:160px（防中英文切换列宽跳动），次列自适应剩余
   - 简约细分隔线 + 极淡奇偶行底色；行高适中；名称列轻微加粗区分层级
   - Tab 栏与表格之间保留合理间距；小屏自动转为键值上下堆叠
   - 切换语言仅替换文本，容器尺寸 / 边距 / 样式完全不变
   ============================================================ */

/* ---------- 卡片容器 ---------- */
.cp-tabbox {
  background: #ffffff;
  border: 1px solid var(--sf-border);
  border-radius: var(--sf-radius);
  box-shadow: var(--sf-card-shadow);
  padding: 38px 24px;            /* 充足上下留白，左右内边距进一步收窄 */
  margin: 0 auto 30px;
  max-width: 1180px;            /* 合理最大宽度，避免大屏页面空洞松散 */
}

/* ---------- Tab 栏与内容间距由上方 .slideTxtBox .bd（padding:24px 0 0）统一控制 ---------- */

/* ---------- Tab 内容文字（rich text）中英文一致 ---------- */
.item1-txt {
  line-height: 1.85;
  color: var(--sf-text);
  font-size: 15px;
}
.item1-txt p { margin: 0 0 14px; }
.item1-txt img {
  max-width: 100%;
  height: auto;
  border-radius: 10px;
  margin: 12px 0;
  box-shadow: 0 2px 8px rgba(15, 23, 42, .06);
}
.item1-txt h1, .item1-txt h2, .item1-txt h3, .item1-txt h4 {
  color: var(--sf-ink);
  margin: 22px 0 10px;
  font-weight: 700;
}
.item1-txt a { color: var(--main-color); text-decoration: none; }
.item1-txt a:hover { text-decoration: underline; }
.item1-txt ul, .item1-txt ol { padding-left: 1.4em; margin: 0 0 14px; }
.item1-txt li { margin: 6px 0; }

/* ---------- 内部参数表（核心） ---------- */
.cp-param-table {
  width: 100%;                  /* 铺满卡片容器 */
  border-collapse: collapse;
  font-size: 15px;
  margin: 0 0 8px;
}
.cp-param-table tr { border-bottom: 1px solid var(--sf-border); }   /* 简约细分隔线 */
.cp-param-table tr:last-child { border-bottom: none; }
.cp-param-table tbody tr:nth-child(even) { background: var(--sf-bg-soft); }  /* 极淡奇偶行底色 */
.cp-param-table th,
.cp-param-table td {
  padding: 15px 16px;           /* 适度加高行高 */
  text-align: left;
  vertical-align: top;
  line-height: 1.7;
}
.cp-param-table th {             /* 参数名称列 */
  min-width: 160px;             /* 防止中英文切换列宽跳动 */
  width: 160px;
  font-weight: 600;             /* 轻微加粗区分层级 */
  color: var(--sf-ink);
  white-space: normal;
}
.cp-param-table td {             /* 参数值列：自适应剩余空间 */
  color: var(--sf-text);
  word-break: break-word;
}

/* ---------- 右侧栏参数卡（与 Tab 内参数表共用 .cp-param-table） ---------- */
.cp-param-card {
  background: #ffffff;
  border: 1px solid var(--sf-border);
  border-radius: var(--sf-radius);
  box-shadow: var(--sf-card-shadow);
  padding: 6px 18px;            /* 内边距收窄，靠表格行高撑开 */
  margin: 0 0 22px;
}

/* ---------- 小屏：参数表转为键值上下堆叠 ---------- */
@media (max-width: 640px) {
  .cp-tabbox { padding: 26px 18px; }
  .slideTxtBox .bd { padding: 22px 0 0 !important; }
  .cp-param-table,
  .cp-param-table tbody,
  .cp-param-table tr,
  .cp-param-table th,
  .cp-param-table td { display: block; width: 100% !important; min-width: 0 !important; }
  .cp-param-table tr { border-bottom: 1px solid var(--sf-border); padding: 4px 0; }
  .cp-param-table tbody tr:nth-child(even) { background: transparent; }   /* 堆叠态关闭斑马纹 */
  .cp-param-table th {
    padding: 12px 16px 2px;
    font-weight: 600;
    color: var(--sf-muted);
    background: transparent !important;
  }
  .cp-param-table td { padding: 0 16px 12px; }
}