/* ==========================================================================
   普河标牌 · 样式表
   按需求方指示「一条一条写入」。当前进度：① 基础设施  ② 页眉  ③ 头部（两行）
   品牌色 #145FF5 ｜ 配套深灰 #3F423B
   ========================================================================== */

/* ==========================================================================
   ① 基础设施
   —— 头部排版所必需的最小基础：字体、设计变量、重置、通用按钮、无障碍辅助类。
      后续每写完一个区块，都在文件末尾追加，不改动已有部分。
   ========================================================================== */

/* 华为鸿蒙字体（官方原文件，未做任何修改；可变字体，字重轴 40–900 一个文件全覆盖）
   授权要求：软件中须声明使用了 HarmonyOS Sans，并保留版权声明与协议副本 */
@font-face {
  font-family: "HarmonyOS Sans SC";
  src: url("../vendor/HarmonyOS Sans/HarmonyOS_Sans_SC.ttf");
  font-weight: 40 900;
  font-style: normal;
  font-display: swap;
}

:root {
  /* 品牌色 */
  --brand: #145FF5;
  --brand-600: #0F4EDB;
  --brand-700: #0B3EB0;
  --brand-050: #EEF3FE;

  /* 中性色（深灰取自 logo） */
  --ink: #3F423B;
  --text: #33372F;
  --muted: #6C7268;
  --muted-2: #8A9086;

  /* 背景与分隔线 */
  --bg: #FFFFFF;
  --bg-soft: #F5F7FA;
  --line: #E5E9EE;
  --line-soft: #EEF1F5;

  /* 圆角与阴影 */
  --radius-sm: 8px;
  --radius: 14px;
  --shadow-sm: 0 1px 2px rgba(17, 24, 39, .05), 0 3px 10px rgba(17, 24, 39, .04);
  --shadow: 0 8px 26px rgba(17, 24, 39, .09);

  /* 尺寸 */
  --wrap-max: 1200px;
  --header-h: 60px;
  --topbar-h: 38px;

  /* 字体族 */
  --font: "HarmonyOS Sans SC", -apple-system, BlinkMacSystemFont, "Segoe UI",
          "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Source Han Sans SC",
          "Noto Sans CJK SC", sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }

body {
  margin: 0;
  font-family: var(--font);
  color: var(--text);
  background: var(--bg);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, h4 { margin: 0; line-height: 1.3; color: var(--ink); }

/* 键盘可达性：仅键盘聚焦时显示焦点环 */
:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }

/* 屏幕阅读器专用（同时保持可聚焦，用于纯 CSS 菜单开关） */
.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* 跳到主要内容：平时移出视口，仅键盘聚焦时出现 */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 200;
  padding: 10px 18px;
  background: var(--brand);
  color: #fff;
  font-size: 14px;
}
.skip-link:focus { left: 0; }

/* 通用容器 */
.wrap { max-width: var(--wrap-max); margin: 0 auto; padding: 0 16px; }

/* 通用按钮（头部用到，先建立） */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 10px 18px;  font-size: 14px; font-weight: 600; line-height: 1.2;
  border: 1px solid transparent; cursor: pointer; white-space: nowrap;
  transition: background-color .2s, color .2s, border-color .2s, transform .2s;
}
.btn-primary { background: var(--brand); color: #fff; }
.btn-primary:hover { background: var(--brand-600); }

/* 深色底上的按钮变体（底部 CTA 等区块使用） */
.btn-light { background: #fff; color: var(--brand); }
.btn-light:hover { background: var(--brand-050); color: var(--brand-600); }
.btn-outline-light { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .55); }
.btn-outline-light:hover { background: rgba(255, 255, 255, .16); border-color: #fff; }


/* ==========================================================================
   ② 页眉（顶部工具条）—— 左：欢迎语 ｜ 右：快捷链接
   ========================================================================== */

.topbar {
  background: var(--bg-soft);
  border-bottom: 1px solid var(--line-soft);
  font-size: 13px;
  color: var(--muted);
}

.topbar .wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px 16px;
  min-height: var(--topbar-h);
  flex-wrap: wrap;
}

.tb-left { color: var(--muted); }

.tb-right {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 8px;
}
.tb-right a { color: var(--muted); transition: color .2s; }
.tb-right a:hover { color: var(--brand); }
.tb-sep { color: #D5DAE1; user-select: none; }


/* ==========================================================================
   ③ 头部（两行）
   第一行：logo ｜ 中间两行标语 ｜ 右侧电话图标+联系电话 ｜（移动端）菜单开关
   第二行：导航
   ========================================================================== */

.header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(255, 255, 255, .96);
}

.header .wrap {
  position: relative;                 /* 移动端菜单面板的定位基准 */
  display: flex;
  flex-direction: column;             /* 两行堆叠 */
}

/* ---- 第一行 ---- */
.head-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: var(--header-h);
  width: 100%;
}

/* 左侧一组：logo ｜ 竖分隔线 ｜ 上下两行标语 */
.head-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

/* 品牌 logo */
.logo { display: flex; align-items: center; flex: none; }
.logo img { height: 36px; width: auto; }

/* logo 与标语之间的竖分隔线（≥768 显示） */
.head-divider {
  display: none;
  width: 1px;
  height: 34px;
  background: var(--line);
  flex: none;
}

/* 标语（上下两行） */
.head-slogan {
  display: none;                      /* 移动端隐藏，≥768 显示 */
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.hs-1 { font-size: 18px; font-weight: 700; color: var(--brand); line-height: 1.3; white-space: nowrap; }
.hs-2 { font-size: 12.5px; color: var(--muted); line-height: 1.35; white-space: nowrap; }

/* 右侧：电话图标 + 联系电话 */
.head-tel {
  display: none;                      /* 移动端隐藏，≥1024 显示 */
  align-items: center;
  gap: 9px;
  flex: none;
}
.head-tel > i { font-size: 30px; color: var(--brand); line-height: 1; }
.ht-txt { display: flex; flex-direction: column; line-height: 1.3; }
.ht-txt span { font-size: 12px; color: var(--muted-2); }
.ht-txt b { font-size: 18px; font-weight: 700; color: var(--brand); letter-spacing: .2px; }

/* ---- 导航：移动端为「右侧滑出抽屉」，≥1024 为第二行横排 ---- */
.nav {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: auto;
  width: min(84vw, 340px);
  display: flex;
  flex-direction: column;
  gap: 0;
  background: #3f423b;                 /* 导航背景：按需求方指定色值 */
  box-shadow: -12px 0 32px rgba(0, 0, 0, .28);
  padding: 12px 16px 24px;
  overflow-y: auto;
  transform: translateX(100%);          /* 收起：整个抽屉移出屏幕右侧 */
  visibility: hidden;                  /* 收起时不参与键盘 Tab */
  transition: transform .3s ease, visibility 0s linear .3s;
  z-index: 210;
}
.header.nav-open .nav {
  transform: translateX(0);
  visibility: visible;
  transition: transform .3s ease, visibility 0s linear 0s;
}

/* 抽屉背后的遮罩：点一下即关闭（label 触发 checkbox，纯 CSS） */
.nav-mask {
  cursor: pointer;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .5);
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s ease, visibility 0s linear .3s;
  z-index: 205;
}
.header.nav-open .nav-mask {
  opacity: 1;
  visibility: visible;
  transition: opacity .3s ease, visibility 0s linear 0s;
}

/* 抽屉内的关闭按钮 */
.nav-close {
  border: 0;
  padding: 0;
  background: transparent;
  -webkit-appearance: none;
  appearance: none;
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: flex-end;
  width: 42px;
  height: 42px;
  margin-bottom: 6px;
  color: #fff;
  font-size: 22px;
  cursor: pointer;
}

.nav a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 13px 12px;
  font-size: 15px;
  color: rgba(255, 255, 255, .9);
  transition: background-color .2s, color .2s;
}
.nav a:hover { background: var(--brand); color: #fff; }
.nav a.is-active { color: #fff; font-weight: 700; }

.nav-group { display: contents; }

.nav-phone {
  margin-top: 6px;
  border-top: 1px solid rgba(255, 255, 255, .14);
  color: #fff;
  font-weight: 700;
}

/* ---- 带二级导航的项（移动端：面板内直接展开并缩进） ---- */
.nav-item { display: flex; flex-direction: column; }
.nav-parent { justify-content: space-between; }
.sub-caret { font-size: 16px; line-height: 1; transition: transform .2s; }

.subnav { display: flex; flex-direction: column; padding-left: 12px; }
.subnav a { font-size: 14px; padding: 10px 12px; color: rgba(255, 255, 255, .7); }

/* 菜单开关（按需求方指定的样式） */
html.nav-locked { overflow: hidden; }

.nav-toggle {
  border: 0;
  padding: 0;
  -webkit-appearance: none;
  appearance: none;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 42px;
  background: #fff;
  cursor: pointer;
}
.nav-toggle span {
  position: relative;
  display: block;
  width: 18px;
  height: 2px;
  background: var(--ink);
  transition: background-color .2s;
}
.nav-toggle span::before,
.nav-toggle span::after {
  content: "";
  position: absolute;
  left: 0;
  width: 18px;
  height: 2px;
  background: var(--ink);
  transition: transform .2s;
}
.nav-toggle span::before { top: -6px; }
.nav-toggle span::after { top: 6px; }

/* 展开时汉堡变叉（checkbox 现与 .wrap 同级，故经 .wrap 再选到按钮） */
.header.nav-open .nav-toggle span { background: transparent; }
.header.nav-open .nav-toggle span::before { transform: translateY(6px) rotate(45deg); }
.header.nav-open .nav-toggle span::after { transform: translateY(-6px) rotate(-45deg); }


/* ==========================================================================
   响应式
   检查尺寸：360 / 390 / 414 / 768 / 1024 / 1280 / 1440 / 1920
   （360–414 由基础样式覆盖；以下按 768 / 1024 / 1280 递进）
   ========================================================================== */

/* 平板及以上：页眉显示，标语出现，头部加高 */
@media (min-width: 768px) {
  .wrap { padding: 0 22px; }
  :root { --header-h: 68px; }

  .logo img { height: 42px; }
  .head-slogan { display: flex; }
  .head-divider { display: block; }
  .nav { padding: 8px 22px 18px; }
}

/* 桌面：电话出现、汉堡隐藏、导航变为第二行横排 */
@media (min-width: 1024px) {
  :root { --header-h: 78px; }

  .logo img { height: 48px; }
  .head-slogan { gap: 3px; }
  .head-divider { height: 40px; }
  .hs-1 { font-size: 20px; }
  .hs-2 { font-size: 13.5px; }
  .head-tel { display: flex; }

  /* ---- 导航条：暗底 + 细下划线标当前页（无分隔线、无色块） ----
     设计思路：去掉「等分单元格 + 竖线 + 整块蓝底」的表格感；
     各项按内容宽度居中排开，当前页用白色加粗文字 + 2px 品牌蓝下划线，
     悬停下划线以半透明蓝渐入，二级菜单改为居中对齐的浮层。 */
  .nav {
    position: static;
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    align-items: stretch;
    background: #fff;                  /* 白底：与页眉连成一片，去掉深色横条 */
    border: 0;
    border-top: 1px solid var(--line-soft);        /* 与 logo 行轻微分界 */
    border-bottom: 1px solid var(--line);          /* 与下方内容分界 */
    box-shadow: none;
    padding: 0 calc(max(0px, (100% - var(--wrap-max)) / 2) + 22px);
    width: 100%;
    /* 复位移动端抽屉的过渡属性，桌面端为普通横排 */
    transform: none;
    visibility: visible;
    overflow: visible;
  }
  .nav-mask,
  .nav-close,
  .sub-toggle { display: none; }

  /* 主体宽度内 8 等分：组容器透明，8 项直接作为网格项 */
  .nav-group { display: contents; }

  .nav a {
    position: relative;
    padding: 19px 8px 18px;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: .01em;
    color: var(--ink);
    background: transparent;
    justify-content: center;
    transition: color .2s ease;
  }
  .nav a:focus-visible { outline: 2px solid #8FB4FF; outline-offset: -4px; }
  /* 不画下划线：当前页整格品牌蓝底白字，悬停淡蓝底 */
  .nav a:hover { color: var(--brand); background: var(--brand-050); }
  .nav a.is-active {
    color: #fff;
    font-weight: 700;
    background: var(--brand);
  }
  .nav a.is-active:hover { color: #fff; background: var(--brand-600); }
  .nav a.is-active i { font-size: 17px; line-height: 1; }

  /* 桌面端电话在右侧，面板内不重复 */
  .nav a.nav-phone { display: none; }

  /* ---- 二级导航：居中浮层，顶部 2px 品牌蓝 ----
     注意：必须写成 .nav .subnav a 才压得住各断点的 .nav a */
  .nav-item { position: relative; flex-direction: row; }
  /* 带下拉的父项：链接铺满整格，当前页 / 悬停底色才与其它格一致 */
  .nav-item > .nav-parent { width: 100%; }
  .nav-parent .sub-caret { font-size: 15px; margin-left: 2px; }
  .subnav {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;                            /* 宽度与一级导航项完全一致 */
    transform: none;
    min-width: 0;
    display: none;
    flex-direction: column;
    padding: 8px 0;
    background: #fff;
    border: 1px solid var(--line);
    border-top: 2px solid var(--brand);
    box-shadow: 0 18px 36px rgba(17, 24, 39, .12);
    z-index: 20;
  }
  .nav-item:hover > .subnav,
  .nav-item:focus-within > .subnav { display: flex; }
  .nav-item:hover .sub-caret { transform: rotate(180deg); }
  .nav .subnav a {
    font-size: 13.5px;
    padding: 10px 18px;
    color: var(--ink);
    white-space: nowrap;
    justify-content: flex-start;
  }
  .nav .subnav a::after { display: none; }        /* 二级项不带下划线 */
  .nav .subnav a.is-active { color: var(--brand); }
  .nav .subnav a:hover { background: var(--bg-soft); color: var(--brand); }
  .nav-toggle { display: none; }
}

/* 大屏：容器上限放大，间距加大 */
@media (min-width: 1280px) {
  :root { --wrap-max: 1240px; }
  .nav a { padding: 19px 8px 18px; }
}

@media (min-width: 1440px) {
  :root { --wrap-max: 1300px; }
}

@media (min-width: 1920px) {
  :root { --wrap-max: 1360px; }
  .topbar { font-size: 13.5px; }
  .nav a { font-size: 16.5px; padding: 17px 30px; }
  .hs-1 { font-size: 20px; }
  .hs-2 { font-size: 14px; }
  .head-tel > i { font-size: 32px; }
}

/* 页眉在窄屏（<768）隐藏，避免与头部挤在一起 */
@media (max-width: 767px) {
  .topbar { display: none; }
}

/* 移动端导航面板：当前页用品牌蓝背景块标识（与桌面端一致，去掉左侧竖线） */
@media (max-width: 1023px) {
  .nav a.is-active { background: var(--brand); box-shadow: none; }
}

/* ==========================================================================
   移动端导航样式优化（<1024）
   —— 二级菜单改为「点击展开/收起」手风琴；加大触摸热区
   ========================================================================== */
@media (max-width: 1023px) {
  /* 一级项：热区加高，字号略大 */
  .nav a { padding: 14px 12px; font-size: 15.5px; }

  /* 父项那一行：链接占满剩余宽度，右侧留出独立的展开按钮 */
  .nav-item { flex-direction: row; flex-wrap: wrap; align-items: center; }
  .nav-parent { flex: 1 1 auto; }

  /* 展开按钮：48×48 触摸区，箭头随展开旋转 180° */
  .sub-toggle {
    border: 0;
    padding: 0;
    background: transparent;
    -webkit-appearance: none;
    appearance: none;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 48px;
    height: 48px;
    color: rgba(255, 255, 255, .9);
    cursor: pointer;
  }
  .sub-toggle i { font-size: 18px; line-height: 1; transition: transform .2s; }
  .nav-item.is-open .sub-toggle i { transform: rotate(180deg); }

  /* 父项内部的箭头由右侧按钮替代 */
  .sub-caret { display: none; }

  /* 二级菜单：默认收起 → 点击展开，占满整行 */
  .subnav { display: none; flex: 0 0 100%; padding-left: 12px; }
  .nav-item.is-open .subnav { display: flex; }
}

/* ==========================================================================
   ④ 首屏轮播 Banner（纯图片：标题/文案/设计全部做在图片里）
   —— PC 与移动各一套图，用 <picture> 按断点切换；纯 HTML+CSS，无需 JS
   ========================================================================== */

.banner { background: var(--ink); }

.banner-slide { position: relative; }

.banner-img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 750 / 560;        /* 移动图比例：图片未加载时先占位，避免页面跳动 */
}

@media (min-width: 1024px) {
  .banner-img { aspect-ratio: 1920 / 600; }   /* PC 图比例 */
}

/* ---- 分页：叠在图片底部居中 ---- */
.banner-pagination {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 25px !important;
  z-index: 3;
  display: flex;
  justify-content: center;
  gap: 0px;
}
.banner-pagination .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  margin: 0;
  border-radius: 50%;                 /* 圆点：按需求方要求此处使用圆形 */
  background: rgba(255, 255, 255, .55);
  opacity: 1;
  transition: background-color .2s;
}
.banner-pagination .swiper-pagination-bullet-active {
  background: #155ef5;
}

/* ---- 左右箭头：移动端隐藏 ---- */
.banner-prev,
.banner-next {
  position: absolute;
  top: 50%;
  margin: 0;
  transform: translateY(-50%);
  z-index: 3;
  width: 46px;
  height: 46px;
  border-radius: 0;
  background: rgba(0, 0, 0, .3);
  color: #fff;
  display: none;
  align-items: center;
  justify-content: center;
  transition: background-color .2s;
}
.banner-prev:hover,
.banner-next:hover { background: var(--brand); }
.banner-prev::after,
.banner-next::after { font-size: 18px; font-weight: 700; }
.banner-prev { left: 0; }
.banner-next { right: 0; }

@media (min-width: 1024px) {
  .banner-prev,
  .banner-next { display: flex; }
}

/* 减少动态效果 */
@media (prefers-reduced-motion: reduce) {
  .banner-pagination .swiper-pagination-bullet { transition: none; }
}

/* ==========================================================================
   ⑤ 产品分类 + 产品列表（纯 CSS Tab 切换：radio + label，零 JS）
   ========================================================================== */

.prod-tabs { padding: 52px 0 60px; background: #fff; }

/* ---- 区块标题 ---- */
.pt-head { margin-bottom: 24px; }
.pt-eyebrow {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .12em;
  color: var(--brand);
}
.pt-title {
  margin: 0 0 10px;
  font-size: 24px;
  font-weight: 800;
  line-height: 1.3;
  color: var(--ink);
}
.pt-lead {
  margin: 0;
  max-width: 680px;
  font-size: 14px;
  line-height: 1.7;
  color: var(--muted);
}

/* ---- Tab 栏（移动端可横向滑动） ---- */
.pt-row {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  gap: 2px;
  border-bottom: 1px solid var(--line);
  scrollbar-width: none;
}
.pt-row::-webkit-scrollbar { display: none; }

.ptab {
  flex: none;
  padding: 13px 0;                 /* 左右内边距为 0：蓝色下划线才与文字等长 */
  margin-right: 26px;              /* 用间距代替内边距 */
  margin-bottom: -1px;
  font-size: 14.5px;
  color: var(--muted);
  white-space: nowrap;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  transition: color .2s, border-color .2s;
}
.ptab:hover { color: var(--brand); }


/* 当前 Tab（radio 选中 → 对应 label 高亮） */
#ptab1:checked ~ .pt-row .ptab[for="ptab1"],
#ptab2:checked ~ .pt-row .ptab[for="ptab2"],
#ptab3:checked ~ .pt-row .ptab[for="ptab3"],
#ptab4:checked ~ .pt-row .ptab[for="ptab4"],
#ptab5:checked ~ .pt-row .ptab[for="ptab5"] {
  color: var(--brand);
  font-weight: 700;
  border-bottom-color: var(--brand);
}

/* 键盘聚焦时的可见指示 */
#ptab1:focus-visible ~ .pt-row .ptab[for="ptab1"],
#ptab2:focus-visible ~ .pt-row .ptab[for="ptab2"],
#ptab3:focus-visible ~ .pt-row .ptab[for="ptab3"],
#ptab4:focus-visible ~ .pt-row .ptab[for="ptab4"],
#ptab5:focus-visible ~ .pt-row .ptab[for="ptab5"] {
  outline: 2px solid var(--brand);
  outline-offset: -3px;
}

/* ---- 面板：默认全隐藏，选中哪个显示哪个 ---- */
.pt-panel { display: none; padding-top: 24px; }

#ptab1:checked ~ .pt-panels > .pt-p1,
#ptab2:checked ~ .pt-panels > .pt-p2,
#ptab3:checked ~ .pt-panels > .pt-p3,
#ptab4:checked ~ .pt-panels > .pt-p4,
#ptab5:checked ~ .pt-panels > .pt-p5 { display: block; }

/* ---- 产品网格 ---- */
.pt-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.pt-card {
  position: relative;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--line);
  transition: border-color .2s, box-shadow .2s, transform .2s;
}
.pt-card:hover {
  border-color: var(--brand);
  box-shadow: var(--shadow-sm);
  transform: translateY(-2px);
}

/* 图片：正方形（与 800×800 产品图一致），悬停轻微放大 */
.pt-media {
  position: relative;
  display: block;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: var(--bg-soft);
}
.pt-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s ease;
}
.pt-card:hover .pt-media img { transform: scale(1.04); }

.pt-body { padding: 12px 14px 14px; }

.pt-name {
  margin: 0;
  font-size: 15.5px;
  font-weight: 700;
  text-align: center;              /* 标题居中 */
  color: var(--ink);
}
.pt-name a { color: inherit; }
.pt-name a:hover { color: var(--brand); }
/* 鼠标移到卡片上（或键盘聚焦到卡片内）时，标题变品牌蓝 */
.pt-card:hover .pt-name,
.pt-card:focus-within .pt-name { color: var(--brand); }

/* 悬停浮层：桌面端绝对定位，正好盖住 1:1 的图片区域 */
.pt-actions {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  aspect-ratio: 1 / 1;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  overflow: hidden;                 /* 兜底：按钮再怎么变宽也不会把整页撑出横向滚动条 */
  background: rgba(12, 18, 32, .52);
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s ease;
}
.pt-card:hover .pt-actions,
.pt-card:focus-within .pt-actions { opacity: 1; pointer-events: auto; }

.pt-act {
  height: 34px;
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 13.5px;
  white-space: nowrap;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .85);
  transition: background-color .2s, border-color .2s;
}
.pt-act i { font-size: 15px; line-height: 1; }
.pt-act:hover { background: rgba(255, 255, 255, .18); }

.pt-act-main {
  background: var(--brand);
  border-color: var(--brand);
  font-weight: 700;
}
.pt-act-main:hover { background: var(--brand-600); border-color: var(--brand-600); }

/* 触屏设备没有 hover：操作层回到标题下方，一行两等分（不会挤坏） */
@media (hover: none) {
  .pt-actions {
    position: static;
    aspect-ratio: auto;
    margin-top: 10px;
    gap: 6px;
    background: none;
    opacity: 1;
    pointer-events: auto;
  }
  .pt-name { margin-bottom: 10px; }   /* 触屏下操作层在标题下方，需留间距 */
  .pt-actions { flex-direction: column; align-items: stretch; }
  .pt-act {
    flex: none;
    width: 100%;
    height: 32px;
    padding: 0 6px;
    justify-content: center;
    font-size: 13px;
    color: var(--text);
    border-color: var(--line);
    background: #fff;
  }
  .pt-act i { font-size: 14px; }
  .pt-act-main { color: #fff; background: var(--brand); border-color: var(--brand); }
  .pt-card:hover .pt-media img { transform: none; }
}

/* 窄窗口（仍是鼠标指针环境，如桌面把窗口拖到 ≤481px）：
   两张按钮并排需 104+8+104=216px，而卡片内部 = (视口 - 46) / 2 - 2，
   视口小于 482px 时必然溢出卡片并把整页撑出横向滚动条 —— 改为上下两行。
   阈值按按钮实测宽度反推（不是拍脑袋的断点），未改动任何既有断点。 */
@media (hover: hover) and (max-width: 481px) {
  .pt-actions {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    padding: 0 14px;
  }
  .pt-act {
    width: 100%;
    height: auto;
    min-height: 34px;
    padding: 6px 8px;
    justify-content: center;
    white-space: normal;            /* 字号被放大时允许换行，不裁字 */
  }
}

/* 移动端（<768）：隐藏卡片上的「查看详情 / 在线咨询」，只保留图片 + 可点的标题 */
@media (max-width: 767px) {
  .pt-actions { display: none; }
  .pt-name { margin-bottom: 0; }
}

/* ---- 底部「查看全部产品」按钮：白底 + 蓝色描边 + 双图标 ---- */
.pt-more { display: flex; justify-content: center; margin-top: 32px; }

.pt-more-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 50px;
  padding: 0 32px;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--brand);
  background: #fff;
  border: 2px solid var(--brand);
  transition: background-color .25s ease, color .25s ease;
}
.pt-more-btn i { font-size: 18px; line-height: 1; transition: transform .25s ease; }

/* 悬停：反色填充 + 箭头右移 */
.pt-more-btn:hover { background: var(--brand); color: #fff; }
.pt-more-btn:hover i:last-child { transform: translateX(5px); }

/* 键盘聚焦可见 */
.pt-more-btn:focus-visible { outline: 2px solid var(--brand-700); outline-offset: 3px; }

@media (min-width: 768px) {
  .pt-more { margin-top: 38px; }
  .pt-more-btn { height: 54px; padding: 0 46px; gap: 12px; font-size: 16px; }
  .pt-more-btn i { font-size: 19px; }
}

/* ---- 响应式 ---- */
@media (min-width: 768px) {
  .prod-tabs { padding: 64px 0 76px; }
  .pt-head { margin-bottom: 28px; }
  .pt-title { font-size: 28px; }
  .pt-row { justify-content: flex-start; flex-wrap: wrap; overflow: visible; gap: 0; }   /* 左对齐 */
  .ptab { padding: 15px 0; margin-right: 32px; font-size: 15.5px; }
  .pt-grid { grid-template-columns: repeat(3, 1fr); gap: 20px; }
}

@media (min-width: 1024px) {
  .prod-tabs { padding: 76px 0 88px; }
  .pt-title { font-size: 32px; }
  .ptab { padding: 16px 0; margin-right: 40px; font-size: 16px; }
  .pt-name { font-size: 16.5px; }
  .pt-grid { grid-template-columns: repeat(4, 1fr); }   /* 一行四个 */
}

@media (min-width: 1280px) {
  .pt-grid { gap: 24px; }
}

/* ==========================================================================
   ⑥ 一站式服务流程（深色区块 · 工艺面板）
   —— <768：2 列卡片 / 768–1023：3 列卡片 / ≥1024：一行 6 格 + 1px 竖线分隔
   设计要点：用大号工序号 01–06 承担“先后顺序”，不再用贴纸式小方块和穿过图标的虚线
   ========================================================================== */

.flow {
  padding: 64px 0 72px;
  background: #33362F;                 /* 深墨色，呼应导航 #3f423b */
}

/* ---- 标题区：左侧标题 + 右侧询价入口 ---- */
.flow-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 30px;
}
.flow-eyebrow {
  margin: 0 0 12px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .14em;
  color: #8FB4FF;
}
.flow-title {
  margin: 0 0 12px;
  font-size: 25px;
  font-weight: 800;
  line-height: 1.3;
  color: #fff;
}
.flow-desc { margin: 0; max-width: 620px; font-size: 14px; line-height: 1.75; color: rgba(255, 255, 255, .58); }

.flow-cta {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 46px;
  padding: 0 24px;
  font-size: 14.5px;
  font-weight: 700;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .28);
  transition: background-color .25s ease, border-color .25s ease;
}
.flow-cta i { font-size: 17px; line-height: 1; transition: transform .25s ease; }
.flow-cta:hover { background: var(--brand); border-color: var(--brand); }
.flow-cta:hover i { transform: translateX(4px); }
.flow-cta:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

/* ---- 工序：移动端 2 列卡片，桌面并为一块面板 ---- */
.flow-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.flow-step {
  position: relative;
  padding: 18px 16px 18px;
  background: #3A3D34;
  border: 1px solid rgba(255, 255, 255, .10);
  transition: background-color .25s ease, border-color .25s ease;
}
.flow-step:hover { background: #41443B; border-color: rgba(255, 255, 255, .18); }

/* 顶行：左边图标，右上角放工序号（右对齐成一条竖直索引） */
.flow-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 16px;
}
.flow-ico {
  display: block;
  font-size: 26px;
  line-height: 1;
  color: #fff;
  transition: color .25s ease;
}
.flow-no {
  display: block;
  font-size: 20px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: .02em;
  font-variant-numeric: tabular-nums;   /* 等宽数字，六格右边缘更齐 */
  color: rgba(143, 180, 255, .9);      /* 浅品牌蓝，压住深底 */
  transition: color .25s ease;
}
.flow-name { margin: 0 0 7px; font-size: 15.5px; font-weight: 700; color: #fff; }
.flow-note { margin: 0; font-size: 12.5px; line-height: 1.6; color: rgba(255, 255, 255, .5); }

.flow-step:hover .flow-no { color: #fff; }
.flow-step:hover .flow-ico { color: #8FB4FF; }

/* ---- 平板：3 列 ---- */
@media (min-width: 768px) {
  .flow { padding: 76px 0 84px; }
  .flow-head { margin-bottom: 34px; }
  .flow-title { font-size: 30px; }
  .flow-desc { font-size: 15px; }
  .flow-list { grid-template-columns: repeat(3, 1fr); gap: 14px; }
  .flow-step { padding: 22px 20px 20px; }
  .flow-top { margin-bottom: 18px; }
  .flow-no { font-size: 22px; }
  .flow-ico { font-size: 28px; }
  .flow-name { font-size: 16.5px; }
  .flow-note { font-size: 13px; }
}

/* ---- 桌面：一行 6 格，合并成一块带竖线分隔的工艺面板 ---- */
@media (min-width: 1024px) {
  .flow-title { font-size: 34px; }
  .flow-head { margin-bottom: 40px; }
  .flow-list {
    grid-template-columns: repeat(6, 1fr);
    gap: 0;
    border: 1px solid rgba(255, 255, 255, .10);
    background: rgba(255, 255, 255, .02);
  }
  .flow-step {
    padding: 26px 20px 24px;
    background: none;
    border: 0;
  }
  .flow-top { margin-bottom: 20px; }
  .flow-no { font-size: 24px; }
  .flow-ico { font-size: 28px; }
  .flow-step + .flow-step { border-left: 1px solid rgba(255, 255, 255, .10); }
  .flow-step:hover { background: rgba(255, 255, 255, .045); }
}

/* ---- 手机：标题与按钮上下排 ---- */
@media (max-width: 767px) {
  .flow-head { display: block; }
  .flow-cta { margin-top: 18px; }
}

/* ==========================================================================
   ⑦ 关于我们
   ========================================================================== */

.about { padding: 56px 0 64px; background: #fff; }

.about-grid { display: grid; grid-template-columns: 1fr; gap: 26px; }

/* ---- 图片（左下角年份标牌） ---- */
.about-media { position: relative; }
.about-media img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  background: var(--bg-soft);
}
.about-badge {
  position: absolute;
  left: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 12px 22px;
  background: var(--brand);
  color: #fff;
}
.ab-num { font-size: 22px; font-weight: 800; line-height: 1; letter-spacing: .02em; }
.ab-txt { margin-top: 5px; font-size: 12px; letter-spacing: .1em; color: rgba(255, 255, 255, .85); }

/* ---- 文字 ---- */
.about-eyebrow {
  margin: 0 0 12px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .1em;
  color: var(--brand);
}
.about-title {
  margin: 0 0 16px;
  font-size: 24px;
  font-weight: 800;
  line-height: 1.3;
  color: var(--ink);
}
.about-lead {
  margin: 0 0 14px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.8;
  color: var(--text);
}
.about-p {
  margin: 0 0 22px;
  font-size: 14px;
  line-height: 1.9;
  color: var(--muted);
}

/* ---- 经营范围要点 ---- */
.about-points {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin: 0 0 28px;
  padding: 0;
  list-style: none;
}
.about-points li {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  line-height: 1.6;
  color: var(--text);
}
.about-points i { flex: none; font-size: 17px; color: var(--brand); }

/* ---- 按钮（与「查看全部产品」同一套描边样式） ---- */
.about-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 46px;
  padding: 0 28px;
  font-size: 14.5px;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--brand);
  background: #fff;
  border: 2px solid var(--brand);
  transition: background-color .25s ease, color .25s ease;
}
.about-btn i { font-size: 17px; line-height: 1; transition: transform .25s ease; }
.about-btn:hover { background: var(--brand); color: #fff; }
.about-btn:hover i { transform: translateX(4px); }
.about-btn:focus-visible { outline: 2px solid var(--brand-700); outline-offset: 3px; }

@media (min-width: 768px) {
  .about { padding: 64px 0 76px; }
  .about-grid { gap: 32px; }
  .about-title { font-size: 28px; }
  .about-lead { font-size: 16px; }
  .about-points { grid-template-columns: repeat(2, 1fr); gap: 12px 20px; }
}

@media (min-width: 1024px) {
  .about { padding: 76px 0 88px; }
  .about-grid {
    grid-template-columns: 1.02fr 1fr;
    gap: 52px;
    align-items: center;
  }
  .about-title { font-size: 32px; }
  .about-btn { height: 50px; padding: 0 32px; font-size: 15px; }
}

/* ==========================================================================
   ⑧ 行业方案
   ========================================================================== */

.industry { padding: 56px 0 64px; background: #F6F8FC; }

.ind-head { margin-bottom: 30px; }                      /* 左对齐，与产品板块一致 */
.ind-eyebrow {
  margin: 0 0 12px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .14em;
  color: var(--brand);
}
.ind-title {
  margin: 0 0 12px;
  font-size: 24px;
  font-weight: 800;
  line-height: 1.3;
  color: var(--ink);
}
.ind-lead { margin: 0; max-width: 680px; font-size: 14px; line-height: 1.75; color: var(--muted); }

.ind-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.ind-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--line);
  transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.ind-card:hover {
  border-color: var(--brand);
  box-shadow: var(--shadow-sm);
  transform: translateY(-3px);
}

/* 配图区：图片铺满，悬停轻微放大 */
.ind-media {
  overflow: hidden;
  background: var(--bg-soft);
  /* 高度不锁定：由图片自身宽高比决定（客户按统一尺寸出图，例如 800×450） */
}
.ind-media img {
  display: block;
  width: 100%;
  height: auto;
  transition: transform .35s ease;
}
.ind-card:hover .ind-media img { transform: scale(1.05); }

.ind-body { padding: 14px 13px 16px; }
.ind-name { margin: 0 0 6px; font-size: 16.5px; font-weight: 700; color: var(--ink); }
.ind-desc { margin: 0 0 12px; font-size: 13px; line-height: 1.7; color: var(--muted); }

.ind-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 13px;
  font-weight: 700;
  color: var(--brand);
}
.ind-link i { font-size: 14px; line-height: 1; transition: transform .25s ease; }
.ind-link:hover { color: var(--brand-600); }
.ind-card:hover .ind-link i { transform: translateX(4px); }

@media (min-width: 768px) {
  .industry { padding: 64px 0 76px; }
  .ind-title { font-size: 28px; }
  .ind-lead { font-size: 15px; }
  .ind-grid { grid-template-columns: repeat(2, 1fr); gap: 18px; }
  .ind-body { padding: 16px 16px 18px; }
  .ind-name { font-size: 17.5px; }
}

@media (min-width: 1024px) {
  .industry { padding: 76px 0 88px; }
  .ind-title { font-size: 32px; }
  .ind-head { margin-bottom: 40px; }
  .ind-grid { grid-template-columns: repeat(3, 1fr); gap: 22px; }
  .ind-body { padding: 20px 20px 22px; }
  .ind-name { font-size: 18.5px; }
  .ind-desc { font-size: 13.5px; }
}

/* ==========================================================================
   ⑨ 工程案例（分类 Tab + 轮播）
   —— Tab：radio + label，纯 CSS 切换，零 JS；
      轮播：Swiper 只负责滚动交互，48 个案例全部写在 HTML 里，JS 不生成内容；
      一屏 4 条（≥1024），其余用箭头 / 拖动 / 圆点滚动查看。
   ========================================================================== */

.cases { padding: 56px 0 64px; background: #fff; }

.case-head { margin-bottom: 20px; }                       /* 左对齐，与产品板块一致 */
.case-eyebrow {
  margin: 0 0 12px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .14em;
  color: var(--brand);
}
.case-title {
  margin: 0 0 12px;
  font-size: 24px;
  font-weight: 800;
  line-height: 1.3;
  color: var(--ink);
}
.case-lead { margin: 0; max-width: 680px; font-size: 14px; line-height: 1.75; color: var(--muted); }

/* ---- 分类 Tab：可横向滑动，始终左对齐（与产品板块 Tab 一致） ---- */
.case-tabbar { border-bottom: 1px solid var(--line); }          /* 底线整行贯通（含右侧按钮区域） */
.case-tabbar .case-tabrow { border-bottom: 0; }

.case-tabrow {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  overflow-x: auto;
  scrollbar-width: none;
}
.case-tabrow::-webkit-scrollbar { display: none; }

/* PC 右上角「查看更多案例」：默认隐藏，按当前分类点亮对应链接 */
.case-more-top { display: none; }
.case-more-top-link {
  display: none;
  align-items: center;
  gap: 8px;
  font-size: 14.5px;
  font-weight: 700;
  color: var(--brand);
  white-space: nowrap;
  transition: color .2s ease;
}
.case-more-top-link i { font-size: 17px; line-height: 1; transition: transform .25s ease; }
.case-more-top-link:hover { color: var(--brand-600); }
.case-more-top-link:hover i { transform: translateX(4px); }
.case-more-top-link:focus-visible { outline: 2px solid var(--brand-700); outline-offset: 3px; }

/* 底部按钮同样按分类显示（手机用） */
.case-more .case-more-btn { display: none; }

/* 当前选中分类 → 显示该分类的「查看更多案例」 */
#ctab1:checked ~ .case-tabbar .case-more-p1,
#ctab2:checked ~ .case-tabbar .case-more-p2,
#ctab3:checked ~ .case-tabbar .case-more-p3,
#ctab4:checked ~ .case-tabbar .case-more-p4,
#ctab5:checked ~ .case-tabbar .case-more-p5,
#ctab6:checked ~ .case-tabbar .case-more-p6,
#ctab1:checked ~ .case-more .case-more-p1,
#ctab2:checked ~ .case-more .case-more-p2,
#ctab3:checked ~ .case-more .case-more-p3,
#ctab4:checked ~ .case-more .case-more-p4,
#ctab5:checked ~ .case-more .case-more-p5,
#ctab6:checked ~ .case-more .case-more-p6 { display: inline-flex; }

.case-tab {
  flex: none;
  padding: 13px 0;
  margin-right: 26px;
  margin-bottom: -1px;
  font-size: 14.5px;
  color: var(--muted);
  white-space: nowrap;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  transition: color .2s ease, border-color .2s ease;
}
.case-tab:last-child { margin-right: 0; }
.case-tab:hover { color: var(--brand); }

/* 当前分类（radio 选中 → 对应 label 高亮） */
#ctab1:checked ~ .case-tabbar .case-tab[for="ctab1"],
#ctab2:checked ~ .case-tabbar .case-tab[for="ctab2"],
#ctab3:checked ~ .case-tabbar .case-tab[for="ctab3"],
#ctab4:checked ~ .case-tabbar .case-tab[for="ctab4"],
#ctab5:checked ~ .case-tabbar .case-tab[for="ctab5"],
#ctab6:checked ~ .case-tabbar .case-tab[for="ctab6"] {
  color: var(--brand);
  font-weight: 700;
  border-bottom-color: var(--brand);
}

/* 键盘聚焦可见 */
#ctab1:focus-visible ~ .case-tabbar .case-tab[for="ctab1"],
#ctab2:focus-visible ~ .case-tabbar .case-tab[for="ctab2"],
#ctab3:focus-visible ~ .case-tabbar .case-tab[for="ctab3"],
#ctab4:focus-visible ~ .case-tabbar .case-tab[for="ctab4"],
#ctab5:focus-visible ~ .case-tabbar .case-tab[for="ctab5"],
#ctab6:focus-visible ~ .case-tabbar .case-tab[for="ctab6"] {
  outline: 2px solid var(--brand);
  outline-offset: -3px;
}

/* ---- 面板：默认全隐藏，选中哪个显示哪个 ---- */
.case-panel { display: none; padding-top: 22px; }

#ctab1:checked ~ .case-panels > .case-p1,
#ctab2:checked ~ .case-panels > .case-p2,
#ctab3:checked ~ .case-panels > .case-p3,
#ctab4:checked ~ .case-panels > .case-p4,
#ctab5:checked ~ .case-panels > .case-p5,
#ctab6:checked ~ .case-panels > .case-p6 { display: block; }

/* ---- 轮播容器 ----
   默认（脚本没跑起来 / 被禁用）允许原生横向滚动，8 个案例照样能看；
   Swiper 初始化成功后会加 .swiper-initialized，再交回它接管（隐藏滚动条）。 */
.case-swiper { overflow-x: auto; overflow-y: hidden; }
.case-swiper.swiper-initialized { overflow: hidden; }

/* 未初始化时按合理卡片宽度排成一行，而不是一张图铺满整屏 */
.case-swiper:not(.swiper-initialized) .swiper-wrapper { gap: 22px; }
.case-swiper:not(.swiper-initialized) .swiper-slide { width: 270px; }

.case-swiper .swiper-slide { display: flex; }

/* ---- 左右两侧的翻页箭头（叠在图片上，竖直居中于图片区域） ----
   .case-nav 用 padding-top 撑出「一张图片的高度」，箭头再在其中 50% 处居中；
   百分比按各断点的卡片实际宽度换算（1.15 张 / 2 张 / 4 张）。 */
.case-carousel { position: relative; }

.case-nav {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  z-index: 2;                        /* 必须显式抬层：轮播的 transform 层会盖住后面的定位元素 */
  padding-top: 65%;                  /* <640：1.15 张 → 图片高 ≈ 容器宽 65% */
  pointer-events: none;              /* 只有按钮本身可点，不挡卡片链接 */
}

.case-prev,
.case-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--brand);
  background: rgba(255, 255, 255, .95);
  border: 0;
  box-shadow: 0 1px 2px rgba(17, 24, 39, .14), 0 4px 14px rgba(17, 24, 39, .10);
  cursor: pointer;
  pointer-events: auto;
  transition: background-color .2s ease, color .2s ease;
}
.case-prev { left: 8px; }                       /* 窄屏：贴在图片左右内侧 */
.case-next { right: 8px; }
.case-prev i,
.case-next i { font-size: 20px; line-height: 1; }
.case-prev:hover,
.case-next:hover { background: var(--brand); color: #fff; }
.case-prev:focus-visible,
.case-next:focus-visible { outline: 2px solid var(--brand-700); outline-offset: 2px; }

/* 脚本站没接管时，箭头点了也没反应 —— 直接不显示，靠原生横向滚动 */
.case-panel:has(.case-swiper:not(.swiper-initialized)) .case-nav { display: none; }
.case-card { flex: 1 1 auto; display: flex; flex-direction: column; }
.case-link { display: flex; flex-direction: column; flex: 1 1 auto; }
.case-link:focus-visible { outline: 2px solid var(--brand-700); outline-offset: 4px; }

/* 图片区：4:3，裁切铺满，悬停轻微放大 */
.case-media {
  position: relative;
  overflow: hidden;
  aspect-ratio: 4 / 3;
  background: var(--bg-soft);
}
.case-media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
}

/* 序号角标（01–08） */
.case-no {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 1;
  padding: 3px 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--brand);
  background: #fff;
  transition: background-color .25s ease, color .25s ease;
}

.case-body { flex: 1 1 auto; padding: 14px 0 0; }
.case-row { display: flex; align-items: center; gap: 8px; }
.case-name {
  margin: 0;
  font-size: 16.5px;
  font-weight: 700;
  color: var(--ink);
  transition: color .25s ease;
}
.case-arrow {
  font-size: 16px;
  line-height: 1;
  color: var(--brand);
  transition: transform .25s ease;
}
.case-desc { margin: 6px 0 0; font-size: 13px; line-height: 1.65; color: var(--muted); }

/* 悬停 / 键盘聚焦 */
.case-card:hover .case-media img,
.case-link:focus-visible .case-media img { transform: scale(1.06); }
.case-card:hover .case-name,
.case-link:focus-visible .case-name { color: var(--brand); }
.case-card:hover .case-arrow,
.case-link:focus-visible .case-arrow { transform: translateX(5px); }
.case-card:hover .case-no,
.case-link:focus-visible .case-no { background: var(--brand); color: #fff; }

/* ---- 底部「查看更多案例」：白底 + 蓝色描边 ---- */
.case-more { margin-top: 30px; text-align: center; }
.case-more-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 50px;
  padding: 0 32px;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--brand);
  background: #fff;
  border: 2px solid var(--brand);
  transition: background-color .25s ease, color .25s ease;
}
.case-more-btn i { font-size: 18px; line-height: 1; transition: transform .25s ease; }
.case-more-btn:hover { background: var(--brand); color: #fff; }
.case-more-btn:hover i:last-child { transform: translateX(5px); }
.case-more-btn:focus-visible { outline: 2px solid var(--brand-700); outline-offset: 3px; }

/* ---- 响应式 ---- */
@media (min-width: 768px) {
  .cases { padding: 64px 0 76px; }
  .case-head { margin-bottom: 24px; }
  .case-title { font-size: 28px; }
  .case-lead { font-size: 15px; }
  .case-panel { padding-top: 26px; }
  .case-nav { padding-top: 36.5%; }   /* 768–1023：2 张 → 图片高 ≈ 36.5% */
  .case-prev { left: 10px; }
  .case-next { right: 10px; }
  .case-no { top: 12px; left: 12px; }
  .case-body { padding-top: 16px; }
  .case-name { font-size: 17.5px; }
  .case-desc { font-size: 13.5px; }
  .case-more { margin-top: 38px; }
  .case-more-btn { height: 54px; padding: 0 46px; gap: 12px; font-size: 16px; }
  .case-more-btn i { font-size: 19px; }
}

@media (min-width: 1024px) {
  .cases { padding: 76px 0 88px; }
  .case-title { font-size: 32px; }
  .case-head { margin-bottom: 30px; }
  .case-panel { padding-top: 30px; }
  .case-nav { padding-top: 17.6%; }   /* ≥1024：4 张 → 图片高 ≈ 17.6% */
  .case-prev { left: 12px; }
  .case-next { right: 12px; }
  .case-no { top: 14px; left: 14px; }
  .case-body { padding-top: 18px; }
  .case-name { font-size: 18px; }
}

/* 桌面（≥1024）：Tab 行 + 右上角「查看更多案例」同一行；底部按钮只在手机显示 */
@media (min-width: 1024px) {
  .case-tabbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
  }
  .case-tabbar .case-tabrow { flex: 1 1 auto; min-width: 0; }
  .case-more-top { display: block; flex: none; }
  .case-more { display: none; }
}

/* 宽屏（≥1440）：容器两侧还剩 90px 以上页边距，把左右箭头挪到卡片外面（与卡片留 24px） */
@media (min-width: 1440px) {
  .case-prev { left: -68px; }
  .case-next { right: -68px; }
}

/* 移动端（<768）：去掉左右箭头，改由自动轮播推进（仍可手动滑动） */
@media (max-width: 767px) {
  .case-panel .case-nav { display: none; }
}

/* ==========================================================================
   ⑩ 资讯 + 问答（左：新闻资讯 右：标识问答，两栏都是竖向轮播）
   ========================================================================== */

.info { padding: 56px 0 64px; background: #F6F8FC; }

.info-grid { display: grid; grid-template-columns: 1fr; gap: 40px; }

.info-head { margin-bottom: 18px; }                      /* 左对齐，与产品板块一致 */
.info-eyebrow {
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .14em;
  color: var(--brand);
}
.info-title {
  margin: 0;
  font-size: 22px;
  font-weight: 800;
  line-height: 1.3;
  color: var(--ink);
}

/* ---- 新闻分类 Tab（纯 CSS：radio + label） ---- */
.news-tabrow {
  display: flex;
  gap: 24px;
  overflow-x: auto;
  border-bottom: 1px solid var(--line);
  scrollbar-width: none;
}
.news-tabrow::-webkit-scrollbar { display: none; }

.news-tab {
  flex: none;
  padding: 10px 0;
  margin-bottom: -1px;
  font-size: 14px;
  color: var(--muted);
  white-space: nowrap;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  transition: color .2s ease, border-color .2s ease;
}
.news-tab:hover { color: var(--brand); }

#ntab1:checked ~ .news-tabrow .news-tab[for="ntab1"],
#ntab2:checked ~ .news-tabrow .news-tab[for="ntab2"],
#ntab3:checked ~ .news-tabrow .news-tab[for="ntab3"] {
  color: var(--brand);
  border-bottom-color: var(--brand);
}
#ntab1:focus-visible ~ .news-tabrow .news-tab[for="ntab1"],
#ntab2:focus-visible ~ .news-tabrow .news-tab[for="ntab2"],
#ntab3:focus-visible ~ .news-tabrow .news-tab[for="ntab3"] {
  outline: 2px solid var(--brand);
  outline-offset: 2px;
}

.news-panel { display: none; }
#ntab1:checked ~ .news-panels > .news-p1,
#ntab2:checked ~ .news-panels > .news-p2,
#ntab3:checked ~ .news-panels > .news-p3 { display: block; }

/* ---- 竖向轮播视口（仅问答：手机 2 条/屏，≥1024 4 条/屏） ---- */
.faq-swiper { width: 100%; height: 280px; overflow: hidden; }   /* 竖向 swiper 默认 margin:auto，需显式占满整栏 */
.faq-swiper .swiper-slide { border-bottom: 1px solid var(--line); }

/* ---- 新闻：首条图文置顶 ---- */
.news-panels { display: block; }
.news-feature {
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 14px;
  align-items: start;
  padding: 12px 0 22px;                  /* 上：与 Tab 行拉开；下：与列表拉开 */
  border-bottom: 1px solid var(--line);
}
.news-thumb { display: block; overflow: hidden; background: #E8EEFA; }
.news-thumb img { display: block; width: 100%; height: auto; transition: transform .35s ease; }
.news-feature:hover .news-thumb img { transform: scale(1.04); }
.news-feature-body { display: flex; flex-direction: column; align-items: flex-start; }
.news-feature-date {
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: .02em;
  color: var(--brand);
  font-variant-numeric: tabular-nums;
}
.news-feature-title {
  margin: 8px 0 8px;
  font-size: 15.5px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--ink);
  text-wrap: balance;                    /* 折行时两行长度均衡，避免末行只剩一个字 */
  transition: color .2s ease;
}
.news-feature-desc {
  font-size: 13px;
  line-height: 1.7;
  color: var(--muted);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.news-feature:hover .news-feature-title { color: var(--brand); }
.news-feature:focus-visible,
.news-row:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }

/* ---- 新闻：一行一条（圆点 + 标题 + 右侧日期） ---- */
.news-list { list-style: none; margin: 0; padding: 0; }
.news-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}
.news-dot {
  flex: none;
  width: 5px;
  height: 5px;
  background: var(--brand);
  transition: transform .2s ease;
}
.news-row-title {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color .2s ease;
}
.news-row-date {
  flex: none;
  font-size: 12.5px;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.news-row:hover .news-row-title { color: var(--brand); }
.news-row:hover .news-dot { transform: scale(1.4); }

/* ---- 问答条目 ---- */
.faq-item {
  display: grid;
  grid-template-columns: auto 1fr;        /* 左：题号；右：问题 + 答案 */
  column-gap: 12px;
  align-content: center;
  height: 100%;
  padding: 10px 0;
}
.faq-no {                              /* 题号：和流程区的大号序号呼应 */
  grid-column: 1;
  grid-row: 1 / span 2;
  padding-top: 2px;
  font-size: 12.5px;
  font-weight: 800;
  line-height: 1.45;
  letter-spacing: .04em;
  font-variant-numeric: tabular-nums;
  color: rgba(20, 95, 245, .5);
  transition: color .2s ease;
}
.faq-q {
  grid-column: 2;
  margin: 0 0 6px;
  font-size: 15.5px;
  font-weight: 700;
  line-height: 1.45;
  color: var(--ink);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.faq-a { grid-column: 2; }
.faq-item:hover .faq-no,
.faq-item:hover .faq-q { color: var(--brand); }

/* 问答栏底部「没找到想要的答案？」小卡片 */
.faq-help {
  margin: 14px 0 0;
  padding: 15px 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: 13.5px;
  color: var(--muted);
  background: #fff;
  border: 1px solid var(--line);
  transition: border-color .25s ease;
}
.faq-help:hover { border-color: var(--brand); }
.faq-help a { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; color: var(--brand); }
.faq-help a i { transition: transform .25s ease; }
.faq-help a:hover i { transform: translateX(4px); }
.faq-help a:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.faq-a {
  margin: 0;
  font-size: 13px;
  line-height: 1.7;
  color: var(--muted);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ---- 两栏底部链接 ---- */
/* 两栏内容纵向撑满，底部链接对齐 */
.info-news,
.info-faq { display: flex; flex-direction: column; }
/* 两栏标题行：右侧放「查看更多」链接（资讯 / 问答各一个） */
.info-news .info-head,
.info-faq .info-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
}
.info-head-more {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding-bottom: 3px;
  font-size: 13.5px;
  font-weight: 700;
  color: var(--brand);
}
.info-head-more i { font-size: 15px; line-height: 1; transition: transform .25s ease; }
.info-head-more:hover i { transform: translateX(4px); }
.info-head-more:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
/* 手机：置顶条改为「图在上、文字在下」 */
@media (max-width: 767px) {
  .news-feature { display: block; }
  .news-thumb { width: 100%; }
  .news-feature-body { margin-top: 12px; }
}

/* 手机：标题与右侧链接保持一行（缩小标题与链接字号，避免标题被挤断行） */
@media (max-width: 767px) {
  .info-news .info-head,
  .info-faq .info-head { gap: 10px; }
  .info-title { font-size: 20px; }
  .info-head-more { font-size: 12px; gap: 4px; }
  .info-head-more i { font-size: 13px; }
}

/* ---- 桌面：左右两栏，1px 竖线分隔 ---- */
@media (min-width: 1024px) {
  .info { padding: 76px 0 88px; }
  .info-grid { grid-template-columns: 1.55fr 1fr; gap: 0; }
  .info-news { padding-right: 40px; border-right: 1px solid var(--line); }
  .info-faq { padding-left: 40px; }
  .info-title { font-size: 26px; }
  .faq-swiper { height: 420px; }
  .news-feature { grid-template-columns: 220px 1fr; gap: 20px; padding: 16px 0 26px; }
  .news-panels { min-height: 420px; }   /* 与右栏问答区高度对齐 */
  .faq-help { margin-top: auto; }           /* 贴底，与左栏底部链接同一水平线 */
}
/* ==========================================================================
   ⑪ 页脚（黑色底）
   —— PC：品牌 + 大号电话 → 四栏（产品 / 关于 / 联系 / 二维码，1px 竖线分隔）→ 深色信息条
   —— 移动端：品牌 + 电话 → 折叠导航 → 常开联系 → 3 个二维码 → 竖向信息条
   ========================================================================== */

.footer {
  background: #0B0C0A;
  color: #E8EAE4;
}

/* ---- 上半区：品牌 + 电话 ---- */
.footer-top {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
  flex-wrap: wrap;
  padding: 52px 0 40px;
}
.footer-logo { display: block; height: 42px; width: auto; }
.footer-slogan {
  margin: 18px 0 6px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.45;
  color: #fff;
  letter-spacing: .01em;
}
.footer-company { margin: 14px 0 0; font-size: 12.5px; color: #8A9188; }

/* 服务场景小标签（细线，不做圆角） */
.footer-scenes {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}
.footer-scenes li {
  padding: 3px 9px;
  font-size: 11.5px;
  line-height: 1.6;
  color: #9AA097;
  border: 1px solid rgba(255, 255, 255, .18);
  transition: color .2s ease, border-color .2s ease;
}
.footer-scenes li:hover { color: #fff; border-color: #8FB4FF; }

.footer-tel {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 3px;
  text-align: right;
}
.footer-label {
  display: block;
  margin: 0 0 16px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .14em;
  color: #8FB4FF;
}
.footer-tel .footer-label { margin-bottom: 2px; }
.footer-tel-num {
  display: block;
  font-size: 30px;
  font-weight: 800;
  line-height: 1.15;
  color: #fff;
  letter-spacing: .01em;
  font-variant-numeric: tabular-nums;
  transition: color .2s ease;
}
.footer-tel-num:hover { color: #8FB4FF; }
.footer-tel-num:focus-visible { outline: 2px solid #8FB4FF; outline-offset: 3px; }
.footer-tel-time { margin-top: 4px; font-size: 12.5px; color: #8A9188; }

/* ---- 四栏：各栏按内容宽度，整行两端对齐，栏间 1px 竖线居中 ---- */
.footer-body {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  padding: 26px 0 32px;
  border-top: 1px solid rgba(255, 255, 255, .12);
}
.footer-col {
  flex: 0 0 auto;
  min-width: 0;
  padding: 0;
}

/* 竖分隔线：吃掉剩余空间，1px 线居中 */
.footer-sep {
  flex: 1 1 0;
  min-width: 24px;
  position: relative;
  display: none;
}
.footer-sep::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 1px;
  background: rgba(255, 255, 255, .12);
}
@media (min-width: 1024px) {
  .footer-sep { display: block; }
}

.footer-col ul {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.footer-col .footer-links {                /* 产品中心 / 关于我们：一行两条 */
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 16px;
}
.footer-col a { font-size: 13.5px; color: #C6CCC4; transition: color .2s ease; }
.footer-col a:hover { color: #8FB4FF; }
.footer-col a:focus-visible { outline: 2px solid #8FB4FF; outline-offset: 2px; }

/* 联系列 */
.footer-contact-list li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 12.5px;
  line-height: 1.7;
  color: #9AA097;
}
.footer-contact-list i {
  flex: none;
  margin-top: 2px;
  font-size: 14px;
  line-height: 1;
  color: #8FB4FF;
}
.footer-contact-list a { font-size: 12.5px; color: #C6CCC4; }
.footer-contact-list a:hover { color: #8FB4FF; }

/* 二维码列 */
.footer-qr-list {
  grid-template-columns: repeat(3, auto);
  gap: 14px 12px;
  justify-content: flex-end;
}
.footer-col-qr { flex: none; text-align: right; }
.footer-col-qr .footer-label { text-align: right; }
.footer-qr { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.footer-qr img {
  display: block;
  width: 96px;
  height: 96px;
  padding: 4px;
  background: #fff;
  border: 1px solid rgba(255, 255, 255, .16);
  transition: border-color .2s ease, transform .2s ease;
}
.footer-qr:hover img { border-color: #8FB4FF; transform: translateY(-2px); }
.footer-qr-name { font-size: 11.5px; color: #9AA097; white-space: nowrap; }

.footer-caret { display: none; }

/* ---- 底部信息条 ---- */
.footer-bottom {
  background: #101110;
  border-top: 1px solid rgba(255, 255, 255, .12);
}
.footer-bottom .wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px 24px;
  flex-wrap: wrap;
  padding-top: 18px;
  padding-bottom: 18px;
  font-size: 12.5px;
  color: #7E857C;
}
.footer-copy { margin: 0; }
.footer-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0; }
.footer-meta a { color: #7E857C; transition: color .2s ease; }
.footer-meta a:hover { color: #8FB4FF; }
.footer-dot { color: #4A4F49; }

/* 二维码：桌面逐级放大 */
@media (min-width: 1024px) {
  .footer-col-qr .footer-qr img { width: 96px; height: 96px; }
}
@media (min-width: 1280px) {
  .footer-col-qr .footer-qr img { width: 120px; height: 120px; }
}

/* PC / 平板：折叠开关不参与键盘焦点（列表始终展开） */
@media (min-width: 768px) {
  .footer-cb { display: none; }
}

/* ---- 平板（768–1023）：两行两列 ---- */
@media (min-width: 768px) and (max-width: 1023px) {
  .footer-top { padding: 44px 0 32px; }
  .footer-body {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
  }
  .footer-col { padding: 24px 24px 26px; }
  .footer-col:nth-of-type(odd) { padding-left: 0; }
  .footer-col:nth-of-type(even) { padding-right: 0; border-left: 1px solid rgba(255, 255, 255, .12); }
  .footer-col:nth-of-type(n+3) { border-top: 1px solid rgba(255, 255, 255, .12); }
  .footer-col-qr { text-align: left; }
  .footer-col-qr .footer-label { text-align: left; }
  .footer-qr-list { justify-content: flex-start; }
}

/* ---- 移动端（<768） ---- */
@media (max-width: 767px) {
  .footer-top { display: block; padding: 30px 0 22px; }
  .footer-logo { height: 34px; }
  .footer-slogan { margin: 14px 0 4px; font-size: 16px; }
  .footer-tel { margin-top: 18px; align-items: flex-start; text-align: left; }
  .footer-tel-num { font-size: 26px; }

  .footer-body { display: block; }
  .footer-col {
    padding: 0;
    border-left: 0;
    border-bottom: 1px solid rgba(255, 255, 255, .12);
  }
  .footer-col:last-of-type { border-bottom: 0; }

  /* 折叠：产品 / 关于 */
  .footer-col-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px 0;
    cursor: pointer;
  }
  .footer-col-title .footer-label { margin: 0; font-size: 13px; }
  .footer-caret { display: block; font-size: 18px; color: #7E857C; transition: transform .22s ease; }
  .footer-cb:checked ~ .footer-col-title .footer-caret { transform: rotate(180deg); }
  .footer-cb:focus-visible ~ .footer-col-title { outline: 2px solid #8FB4FF; outline-offset: -2px; }
  .footer-col .footer-links { display: none; padding: 0 0 16px; gap: 12px; grid-template-columns: 1fr; }
  .footer-cb:checked ~ .footer-links { display: grid; }

  /* 常开的联系 / 二维码 */
  .footer-label-static { padding: 15px 0 12px; margin: 0; }
  .footer-col-contact .footer-contact-list { padding-bottom: 18px; gap: 10px; }
  .footer-contact-list a { font-size: 13px; }
  .footer-col-qr { padding-bottom: 18px; text-align: left; }
  .footer-col-qr .footer-label { text-align: left; }
  .footer-qr-list { justify-content: flex-start; }
  .footer-qr-list { display: flex; justify-content: space-between; gap: 12px; }
  .footer-qr { align-items: center; }
  .footer-qr img { width: 96px; height: 96px; }

  .footer-bottom .wrap {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    padding-top: 16px;
    padding-bottom: 22px;
    line-height: 1.7;
  }
}

/* ==========================================================================
   ⑫ 关于我们页（about.html）
   —— 复用页眉 / 页脚；本页新增：页头、公司简介、能力、原则、历程、CTA
   —— 尺寸检查：360 / 390 / 414 / 768 / 1024 / 1280 / 1440 / 1920
   ========================================================================== */

/* ---- 页头 ---- */
.pg-hero {
  background: var(--bg-soft);
  border-bottom: 1px solid var(--line);
  padding: 30px 0 34px;
}
.pg-crumb {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12.5px;
  color: var(--muted-2);
}
.pg-crumb a { color: var(--muted); transition: color .2s; }
.pg-crumb a:hover { color: var(--brand); }
.pg-crumb i { font-size: 14px; line-height: 1; color: var(--muted-2); }
.pg-title {
  margin: 12px 0 10px;
  font-size: 28px;
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: .01em;
  color: var(--ink);
}
.pg-lead {
  margin: 0;
  max-width: 660px;
  font-size: 14px;
  line-height: 1.8;
  color: var(--muted);
}

/* ---- 区块 ---- */
.pg-sec { padding: 46px 0; }
.pg-sec-alt {
  background: #FAFBFC;
  border-top: 1px solid var(--line-soft);
  border-bottom: 1px solid var(--line-soft);
}
.pg-head { margin-bottom: 24px; }
.pg-eyebrow {
  margin: 0 0 10px;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .14em;
  color: var(--brand);
}
.pg-h2 {
  margin: 0 0 12px;
  font-size: 22px;
  font-weight: 800;
  line-height: 1.35;
  color: var(--ink);
}
.pg-p {
  margin: 0 0 14px;
  font-size: 14px;
  line-height: 1.9;
  color: var(--muted);
}

/* ---- 公司简介：文 + 图 ---- */
.abt-intro { display: grid; gap: 26px; }
.abt-intro-media img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid var(--line);
}
.abt-facts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin: 24px 0 0;
  border-top: 1px solid var(--line);
}
.abt-fact {
  padding: 14px 0 12px;
  border-bottom: 1px solid var(--line-soft);
}
.abt-fact:nth-child(odd) { padding-right: 14px; }
.abt-fact dt {
  font-size: 12px;
  letter-spacing: .05em;
  color: var(--muted-2);
}
.abt-fact dd {
  margin: 6px 0 0;
  font-size: 15px;
  font-weight: 700;
  color: var(--ink);
}

/* ---- 能力：卡片 ---- */
.abt-caps,
.abt-values,
.abt-time { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.abt-cap {
  padding: 20px 18px 22px;
  background: #fff;
  border: 1px solid var(--line);
}
.abt-cap-no {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .14em;
  color: var(--brand);
}
.abt-cap h3 {
  margin: 8px 0 8px;
  font-size: 16px;
  font-weight: 700;
  color: var(--ink);
}
.abt-cap p {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.8;
  color: var(--muted);
}

/* ---- 原则 ---- */
.abt-value {
  padding: 18px;
  background: #fff;
  border: 1px solid var(--line);
}
.abt-value span {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .12em;
  color: var(--brand);
}
.abt-value h3 {
  margin: 8px 0 6px;
  font-size: 15.5px;
  font-weight: 700;
  color: var(--ink);
}
.abt-value p {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.75;
  color: var(--muted);
}

/* ---- 发展历程：移动端竖线 ---- */
.abt-time li {
  position: relative;
  padding: 0 0 20px 18px;
  border-left: 1px solid var(--line);
}
.abt-time li:last-child { padding-bottom: 0; }
.abt-time li::before {
  content: "";
  position: absolute;
  left: -4px;
  top: 4px;
  width: 7px;
  height: 7px;
  background: var(--brand);
}
.abt-time-year {
  margin: 0 0 4px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .06em;
  color: var(--brand);
}
.abt-time h3 {
  margin: 0 0 6px;
  font-size: 15.5px;
  font-weight: 700;
  color: var(--ink);
}
.abt-time p:last-child {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.8;
  color: var(--muted);
}

/* ---- CTA ---- */
.cta-band { background: var(--brand); color: #fff; }
.cta-inner {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-top: 34px;
  padding-bottom: 34px;
}
.cta-eyebrow {
  margin: 0 0 8px;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .14em;
  color: rgba(255, 255, 255, .74);
}
.cta-title {
  margin: 0 0 8px;
  font-size: 20px;
  font-weight: 800;
  line-height: 1.35;
  color: #fff;
}
.cta-sub {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.75;
  color: rgba(255, 255, 255, .84);
}
.cta-act {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 18px;
}
.cta-tel {
  font-size: 24px;
  font-weight: 800;
  line-height: 1.2;
  color: #fff;
  font-variant-numeric: tabular-nums;
}
.cta-tel:hover { color: var(--brand-050); }
.cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 11px 18px;
  font-size: 14px;
  font-weight: 700;
  color: var(--brand);
  background: #fff;
  transition: background-color .2s;
}
.cta-btn:hover { background: var(--brand-050); }

/* ---- 平板 ---- */
@media (min-width: 768px) {
  .pg-hero { padding: 40px 0 44px; }
  .pg-title { font-size: 34px; }
  .pg-lead { font-size: 15px; }
  .pg-sec { padding: 64px 0; }
  .pg-h2 { font-size: 25px; }
  .pg-head { margin-bottom: 30px; }

  .abt-intro { grid-template-columns: 1.05fr .95fr; gap: 44px; align-items: start; }
  .abt-caps { grid-template-columns: 1fr 1fr; gap: 14px; }
  .abt-values { grid-template-columns: 1fr 1fr; gap: 14px; }

  /* 历程：三条横排，顶部一条细线 + 圆点 */
  .abt-time {
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    border-top: 1px solid var(--line);
  }
  .abt-time li {
    padding: 22px 26px 0 0;
    border-left: 0;
  }
  .abt-time li::before { left: 0; top: -4px; }
  .abt-time li + li { padding-left: 26px; }

  .cta-inner {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .cta-act { flex: 0 0 auto; }
}

/* ---- 桌面 ---- */
@media (min-width: 1024px) {
  .pg-hero { padding: 46px 0 52px; }
  .pg-title { font-size: 38px; }
  .pg-sec { padding: 76px 0; }
  .pg-h2 { font-size: 27px; }
  .abt-intro { gap: 56px; }
  .abt-caps { grid-template-columns: repeat(4, 1fr); }
  .abt-values { grid-template-columns: repeat(4, 1fr); }
  .abt-cap { padding: 24px 20px 26px; }
  .abt-value { padding: 20px; }
  .cta-title { font-size: 22px; }
  .cta-tel { font-size: 28px; }
}

/* ---- 大屏 ---- */
@media (min-width: 1440px) {
  .pg-sec { padding: 88px 0; }
  .abt-intro { gap: 64px; }
}

/* ==========================================================================
   ⑬ 新闻资讯列表页（news.html）
   —— 复用页眉 / 页脚 / 页头（.pg-hero）；本页：混合列表 + 侧栏 + 分页
   —— 列表两种样式（后台按是否有配图判断）：
      .nw-item--media  图文条目（缩略图 + 标题 + 摘要）
      .nw-item--text   纯文本条目（标题 + 摘要）
   ========================================================================== */
.nw-sec { padding-top: 22px; }
.nw-layout { display: grid; gap: 34px; }
.nw-main { min-width: 0; }

/* ---- 列表容器 ---- */
.nw-items {
  margin: 0;
  padding: 0;
  list-style: none;
}
.nw-items > li { border-bottom: 1px solid var(--line-soft); }

.nw-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  padding-right: 12px;
  padding-left: 12px;
  transition: background-color .2s;
}
.nw-item:hover { background: rgba(20, 95, 245, .035); }   /* 更淡的品牌蓝悬停底色 */
.nw-item-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
}

.nw-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 18px;
  margin-top: auto;
  padding-top: 2px;
  font-size: 12.5px;
  color: var(--muted-2);
}
.nw-meta-item {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  line-height: 1.6;
}
.nw-meta-item i {
  font-size: 13.5px;
  line-height: 1;
  color: var(--brand);
}
.nw-meta-cat { color: var(--brand); }
.nw-item-title {
  display: block;
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--ink);
  transition: color .2s;
  /* 标题固定 1 行，超出省略 */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.nw-item-desc {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  font-size: 13.5px;
  line-height: 1.8;
  color: var(--muted);
}
.nw-item:hover .nw-item-title { color: var(--brand); }

/* ---- 图文条目：移动端上图下文 ---- */
.nw-item--media { gap: 14px; padding-top: 20px; padding-bottom: 22px; }
.nw-item-thumb {
  display: block;
  border: 1px solid var(--line);
  background: var(--bg-soft);
}
.nw-item-thumb img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: cover;
}
.nw-item--media .nw-item-title { font-size: 17px; }

/* ---- 纯文本条目 ---- */
.nw-item--text { padding-top: 16px; padding-bottom: 17px; }
.nw-item--text .nw-item-title { font-weight: 600; }
.nw-item--text .nw-item-desc { -webkit-line-clamp: 3; }
.nw-item--text:hover .nw-item-title { color: var(--brand); }

/* ---- 分页 ---- */
.nw-pager {
  display: flex;
  align-items: center;
  justify-content: flex-end;   /* 页码整体靠右 */
  gap: 6px;
  margin-top: 28px;
}
.nw-pg {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0 12px;
  font-size: 13px;
  color: var(--text);
  background: #fff;
  border: 1px solid var(--line);
  transition: color .2s, border-color .2s, background-color .2s;
}
a.nw-pg:hover { color: var(--brand); border-color: var(--brand); }
.nw-pg.is-current {
  color: #fff;
  font-weight: 700;
  background: var(--brand);
  border-color: var(--brand);
}
.nw-pg.is-disabled {
  color: var(--muted-2);
  border-color: var(--line-soft);
  pointer-events: none;
}

/* 移动端：页码居中 */
@media (max-width: 767px) {
  .nw-pager { justify-content: center; }
}

/* ---- 侧栏 ---- */
.nw-side { display: grid; gap: 30px; align-content: start; }
.nw-block-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 14px;
  padding-bottom: 11px;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .01em;
  color: var(--ink);
  border-bottom: 1px solid var(--line);
}
.nw-block-title i {
  font-size: 18px;
  line-height: 1;
  color: var(--brand);
}
.nw-hot { margin: 0; padding: 0; list-style: none; }
.nw-hot li + li { border-top: 1px solid var(--line-soft); }
.nw-hot a {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 11px 0;
}
.nw-hot-rank {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  font-size: 11.5px;
  font-weight: 800;
  line-height: 1;
  color: #fff;
  background: var(--brand);
  font-variant-numeric: tabular-nums;
}
.nw-hot li:nth-child(n+4) .nw-hot-rank {
  color: var(--muted);
  background: var(--bg-soft);
  border: 1px solid var(--line);
}
.nw-hot-title {
  font-size: 13.5px;
  line-height: 1.65;
  color: var(--text);
  transition: color .2s;
}
.nw-hot a:hover .nw-hot-title { color: var(--brand); }

/* 热门产品：发布产品卡片（图 + 产品名 + 所属分类） */
/* 带「全部产品」链接的标题行：下划线画在整行上，不再被链接截断 */
.nw-block-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  margin: 0 0 14px;
  padding-bottom: 11px;
  border-bottom: 1px solid var(--line);
}
.nw-block-head .nw-block-title {
  flex: 1 1 auto;
  margin: 0;
  padding-bottom: 0;
  border-bottom: 0;
}
.nw-block-more {
  display: inline-flex;
  align-items: center;
  gap: 1px;
  font-size: 12px;
  color: var(--muted);
  white-space: nowrap;
  transition: color .2s;
}
.nw-block-more:hover { color: var(--brand); }

.nw-products {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.nw-product {
  display: block;
  background: #fff;
  border: 1px solid var(--line);
  transition: border-color .2s;
}
.nw-product-thumb {
  display: block;
  background: var(--bg-soft);
  border-bottom: 1px solid var(--line-soft);
}
.nw-product-thumb img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}
.nw-product-body {
  display: block;
  padding: 8px 9px 10px;
}
.nw-product-name {
  display: block;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.5;
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color .2s;
}
.nw-product-cat {
  display: block;
  margin-top: 3px;
  font-size: 11px;
  line-height: 1.4;
  color: var(--muted-2);
}
.nw-product:hover { border-color: var(--brand); }
.nw-product:hover .nw-product-name { color: var(--brand); }

.nw-cats { margin: 0; padding: 0; list-style: none; }
.nw-cats li + li { border-top: 1px solid var(--line-soft); }
.nw-cats a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 11px 0;
  font-size: 13.5px;
  color: var(--text);
  transition: color .2s;
}
.nw-cats a:hover { color: var(--brand); }
.nw-count { font-size: 12px; color: var(--muted-2); }

.nw-contact {
  padding: 20px;
  background: var(--bg-soft);
  border: 1px solid var(--line);
}
.nw-contact-eyebrow {
  margin: 0 0 10px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .14em;
  color: var(--brand);
}
.nw-contact-tel {
  display: block;
  font-size: 22px;
  font-weight: 800;
  line-height: 1.2;
  color: var(--brand);
  font-variant-numeric: tabular-nums;
}
.nw-contact-time { margin: 6px 0 16px; font-size: 12.5px; color: var(--muted); }
.nw-contact-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px 14px;
  font-size: 13.5px;
  font-weight: 700;
  color: var(--brand);
  background: #fff;
  border: 1px solid var(--brand);
  transition: background-color .2s, color .2s;
}
.nw-contact-btn:hover { background: var(--brand); color: #fff; }

/* ---- 平板：图文条目左图右文；两类条目都加右箭头 ---- */
@media (min-width: 768px) {
  .nw-sec { padding-top: 26px; }
  .nw-item {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
  }
  .nw-item--text { padding-top: 18px; padding-bottom: 19px; }
  .nw-item--media {
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 24px;
    padding-top: 24px;
    padding-bottom: 24px;
    align-items: start;
  }
  .nw-item--media .nw-item-title { font-size: 18px; }
}

/* ---- 桌面 ---- */
@media (min-width: 1024px) {
  .nw-layout {
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 52px;
    align-items: start;
  }
  .nw-sec { padding-top: 30px; }
  .nw-item--media { grid-template-columns: 240px minmax(0, 1fr); }
  .nw-pager { margin-top: 32px; }
}

/* ==========================================================================
   ⑭ 新闻详情页（news-detail.html）
   —— 复用页眉 / 页脚 / 侧栏组件（.nw-*）；本页新增：面包屑条、正文排版、标签、上下篇
   ========================================================================== */

/* 面包屑条 */
.nd-top {
  padding: 14px 0;
  background: var(--bg-soft);
  border-bottom: 1px solid var(--line);
}
.nd-crumb-current {
  max-width: 210px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/* 布局 */
.nd-sec { padding-top: 26px; }
.nd-layout { display: grid; gap: 36px; }
.nd-article { min-width: 0; }

/* 标题区 */
.nd-cat {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12.5px;
  color: var(--brand);
}
.nd-cat i { font-size: 14px; line-height: 1; }
.nd-title {
  margin: 12px 0 14px;
  font-size: 22px;
  font-weight: 800;
  line-height: 1.45;
  color: var(--ink);
}
.nd-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 18px;
  margin: 0;
  padding-bottom: 18px;
  font-size: 12.5px;
  color: var(--muted-2);
  border-bottom: 1px solid var(--line);
}
.nd-meta span { display: inline-flex; align-items: center; gap: 5px; }
.nd-meta i { font-size: 13.5px; line-height: 1; color: var(--brand); }

/* 导语 */
.nd-lead {
  margin: 22px 0 24px;
  padding: 15px 16px;
  font-size: 14px;
  line-height: 1.9;
  color: var(--text);
  background: var(--bg-soft);
  border-left: 3px solid var(--brand);
}

/* 正文 */
.nd-body { font-size: 14.5px; line-height: 1.95; color: var(--text); }
.nd-body p { margin: 0 0 16px; }
.nd-body h2 {
  position: relative;
  margin: 28px 0 12px;
  padding-left: 12px;
  font-size: 17px;
  font-weight: 800;
  line-height: 1.5;
  color: var(--ink);
}
.nd-body h2::before {
  content: "";
  position: absolute;
  left: 0;
  top: 5px;
  bottom: 5px;
  width: 3px;
  background: var(--brand);
}
.nd-body ul { margin: 0 0 16px; padding-left: 20px; list-style: disc; }
.nd-body li { margin: 0 0 8px; }
.nd-body li::marker { color: var(--brand); }

/* 配图 */
.nd-figure { margin: 22px 0; }
.nd-figure img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid var(--line);
}
.nd-figure figcaption {
  margin-top: 8px;
  font-size: 12.5px;
  line-height: 1.6;
  color: var(--muted-2);
  text-align: center;
}

/* 标签 */
.nd-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 30px;
  padding-top: 20px;
  border-top: 1px solid var(--line);
}
.nd-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.6;
  color: var(--muted);
  background: #fff;
  border: 1px solid var(--line);
  transition: color .2s, border-color .2s;
}
.nd-tag i { font-size: 13px; line-height: 1; color: var(--brand); }
.nd-tag:hover { color: var(--brand); border-color: var(--brand); }

/* 上一篇 / 下一篇 */
.nd-nav { display: grid; gap: 10px; margin-top: 24px; }
.nd-nav a {
  display: block;
  padding: 13px 15px;
  font-size: 13.5px;
  line-height: 1.6;
  color: var(--text);
  border: 1px solid var(--line);
  transition: border-color .2s, color .2s;
}
.nd-nav a span {
  display: block;
  margin-bottom: 4px;
  font-size: 11.5px;
  color: var(--muted-2);
}
.nd-nav a span i { font-size: 13px; line-height: 1; vertical-align: -1px; }
.nd-nav a:hover { color: var(--brand); border-color: var(--brand); }

/* 平板 */
@media (min-width: 768px) {
  .nd-top { padding: 16px 0; }
  .nd-crumb-current { max-width: 420px; }
  .nd-title { font-size: 26px; }
  .nd-body { font-size: 15px; }
  .nd-body h2 { font-size: 18px; }
  .nd-nav { grid-template-columns: 1fr 1fr; gap: 12px; }
  .nd-lead { padding: 16px 18px; }
}

/* 桌面 */
@media (min-width: 1024px) {
  .nd-sec { padding-top: 32px; }
  .nd-layout {
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 52px;
    align-items: start;
  }
  .nd-title { font-size: 30px; }
  .nd-figure { margin: 26px 0; }
}

/* ---- 详情页：相关阅读 / 相关产品 ---- */
.nd-subbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 34px 0 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
.nd-subbar-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 16px;
  font-weight: 800;
  line-height: 1.4;
  color: var(--ink);
}
.nd-subbar-title i { font-size: 18px; line-height: 1; color: var(--brand); }
.nd-subbar-more {
  display: inline-flex;
  align-items: center;
  gap: 1px;
  font-size: 12px;
  color: var(--muted);
  white-space: nowrap;
  transition: color .2s;
}
.nd-subbar-more:hover { color: var(--brand); }

.nd-rel-list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.nd-rel-list a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 12px;
  background: #fff;
  border: 1px solid var(--line);
  transition: border-color .2s;
}
.nd-rel-title {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  font-size: 13.5px;
  line-height: 1.6;
  color: var(--text);
  white-space: nowrap;
  text-overflow: ellipsis;
  transition: color .2s;
}
.nd-rel-meta {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--muted-2);
  font-variant-numeric: tabular-nums;
}
.nd-rel-meta i { font-size: 13px; line-height: 1; color: var(--brand); }
.nd-rel-list a:hover { border-color: var(--brand); }
.nd-rel-list a:hover .nd-rel-title { color: var(--brand); }

.nd-prod-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

@media (min-width: 768px) {
  .nd-rel-list { grid-template-columns: 1fr 1fr; }
  .nd-prod-grid { grid-template-columns: repeat(4, 1fr); }
  .nd-subbar { margin-top: 38px; }
}

/* ==========================================================================
   ⑮ 产品列表页（products.html）
   —— 复用页眉 / 页脚 / 页头（.pg-hero）/ CTA（.cta-band）
   —— 结构：分类快捷导航（锚点）+ 5 个分类段落，每段 4 款产品卡
   ========================================================================== */
.pr-sec-wrap { padding-top: 26px; }

/* 分类快捷导航：移动端横向滑动，≥768 换行 */
.pr-nav {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  margin: 0 0 26px;
  padding-bottom: 2px;
  overflow-x: auto;
  scrollbar-width: none;
}
.pr-nav::-webkit-scrollbar { display: none; }
.pr-chip {
  flex: none;
  padding: 8px 14px;
  font-size: 13px;
  line-height: 1.4;
  color: var(--muted);
  white-space: nowrap;
  background: #fff;
  border: 1px solid var(--line);
  transition: color .2s, border-color .2s, background-color .2s;
}
.pr-chip:hover { color: var(--brand); border-color: var(--brand); }
.pr-chip.is-active {
  font-weight: 600;
  color: #fff;
  background: var(--brand);
  border-color: var(--brand);
}

/* 分类段落 */
.pr-sec { scroll-margin-top: 150px; }
.pr-sec + .pr-sec { margin-top: 38px; }
.pr-cat-head {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
.pr-cat-no {
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: .06em;
  color: var(--brand);
}
.pr-cat-title {
  margin: 0;
  font-size: 19px;
  font-weight: 800;
  line-height: 1.35;
  color: var(--ink);
}
.pr-cat-count {
  margin-left: auto;
  font-size: 12px;
  color: var(--muted-2);
}
.pr-cat-lead {
  margin: 10px 0 16px;
  font-size: 13px;
  line-height: 1.7;
  color: var(--muted);
}

/* 产品卡 */
.pr-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
.pr-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--line);
  transition: border-color .2s;
}
.pr-card:hover { border-color: var(--brand); }
.pr-thumb {
  display: block;
  background: var(--bg-soft);
  border-bottom: 1px solid var(--line-soft);
}
.pr-thumb img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}
.pr-body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 4px;
  padding: 10px 11px 12px;
}
.pr-name {
  margin: 0;
  font-size: 13.5px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color .2s;
}
.pr-card:hover .pr-name { color: var(--brand); }
.pr-spec {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  margin: 0;
  font-size: 11.5px;
  line-height: 1.6;
  color: var(--muted-2);
}
.pr-link {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  margin-top: auto;
  padding-top: 9px;
  font-size: 12px;
  font-weight: 600;
  color: var(--brand);
}
.pr-link i { font-size: 13px; line-height: 1; }

/* 平板 */
@media (min-width: 768px) {
  .pr-nav { flex-wrap: wrap; overflow: visible; margin-bottom: 30px; }
  .pr-grid { grid-template-columns: repeat(3, 1fr); gap: 16px; }
  .pr-cat-title { font-size: 21px; }
  .pr-body { padding: 12px 14px 14px; }
  .pr-name { font-size: 14.5px; }
  .pr-spec { font-size: 12px; }
}

/* 桌面 */
@media (min-width: 1024px) {
  .pr-sec-wrap { padding-top: 32px; }
  .pr-grid { grid-template-columns: repeat(4, 1fr); }
  .pr-sec + .pr-sec { margin-top: 46px; }
}

/* ==========================================================================
   ⑯ 产品列表页（product-list.html）—— 分类侧栏 + 产品网格 + 分页
   —— 复用 .pg-hero / .pr-grid / .pr-card / .nw-pager
   ========================================================================== */
.pl-sec { padding-top: 26px; }
.pl-layout { display: grid; gap: 28px; }

/* 左侧分类 */
.pl-side { display: grid; gap: 22px; align-content: start; }
.pl-side-block { border: 1px solid var(--line); background: #fff; }
.pl-side-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 13px 14px;
  font-size: 14.5px;
  font-weight: 700;
  color: var(--ink);
  border-bottom: 1px solid var(--line);
}
.pl-side-title i { font-size: 17px; line-height: 1; color: var(--brand); }
.pl-cats { margin: 0; padding: 0; list-style: none; }
.pl-cats li + li { border-top: 1px solid var(--line-soft); }
.pl-cat {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 11px 14px;
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--text);
  border-left: 3px solid transparent;
  transition: color .2s, background-color .2s, border-color .2s;
}
.pl-cat:hover { color: var(--brand); background: var(--bg-soft); }
.pl-cat.is-current {
  font-weight: 700;
  color: var(--brand);
  background: var(--brand-050);
  border-left-color: var(--brand);
}
.pl-cat-num { font-size: 12px; color: var(--muted-2); font-variant-numeric: tabular-nums; }
.pl-cat.is-current .pl-cat-num { color: var(--brand); }

/* 侧栏联系卡 */
.pl-contact {
  padding: 16px;
  background: var(--bg-soft);
  border: 1px solid var(--line);
}
.pl-contact-eyebrow {
  margin: 0 0 8px;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .12em;
  color: var(--brand);
}
.pl-contact-tel {
  display: block;
  font-size: 20px;
  font-weight: 800;
  line-height: 1.2;
  color: var(--brand);
  font-variant-numeric: tabular-nums;
}
.pl-contact-time { margin: 6px 0 14px; font-size: 12px; color: var(--muted); }
.pl-contact-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 9px 12px;
  font-size: 13px;
  font-weight: 700;
  color: var(--brand);
  background: #fff;
  border: 1px solid var(--brand);
  transition: background-color .2s, color .2s;
}
.pl-contact-btn:hover { color: #fff; background: var(--brand); }

/* 右侧工具栏 */
.pl-main { min-width: 0; }
.pl-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
  padding-bottom: 12px;
  font-size: 13px;
  color: var(--muted);
  border-bottom: 1px solid var(--line);
}
.pl-count { margin: 0; }
.pl-count strong { font-size: 15px; font-weight: 800; color: var(--brand); }

/* 平板 */
@media (min-width: 768px) {
  .pl-sec { padding-top: 30px; }
  .pl-layout { grid-template-columns: 220px minmax(0, 1fr); gap: 26px; align-items: start; }
}

/* 桌面 */
@media (min-width: 1024px) {
  .pl-sec { padding-top: 34px; }
  .pl-layout { grid-template-columns: 240px minmax(0, 1fr); gap: 40px; }
  .pl-side-title { font-size: 15px; }
}

/* ==========================================================================
   ⑰ 产品详情页（product-detail.html）
   —— 复用页眉 / 页脚 / 面包屑条（.nd-top）/ 区块标题（.nd-subbar）/ 产品卡（.pr-*）/ CTA
   ========================================================================== */
.pd-sec { padding-top: 26px; }

/* 主信息：左图右参数 */
.pd-top { display: grid; gap: 26px; }
.pd-media { min-width: 0; }
.pd-thumb {
  display: block;
  background: var(--bg-soft);
  border: 1px solid var(--line);
}
.pd-thumb img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}
.pd-info { min-width: 0; }
.pd-cat {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12.5px;
  color: var(--brand);
}
.pd-cat i { font-size: 14px; line-height: 1; }
.pd-title {
  margin: 10px 0 12px;
  font-size: 24px;
  font-weight: 800;
  line-height: 1.35;
  color: var(--ink);
}
.pd-desc {
  margin: 0;
  font-size: 14px;
  line-height: 1.85;
  color: var(--muted);
}

/* 参数列表 */
.pd-specs {
  margin: 18px 0 0;
  border-top: 1px solid var(--line);
}
.pd-spec {
  display: flex;
  gap: 16px;
  padding: 9px 0;
  border-bottom: 1px solid var(--line-soft);
}
.pd-spec dt {
  flex: 0 0 72px;
  font-size: 12.5px;
  line-height: 1.7;
  color: var(--muted-2);
}
.pd-spec dd {
  flex: 1 1 auto;
  margin: 0;
  font-size: 13.5px;
  line-height: 1.7;
  color: var(--text);
}

/* 行动按钮 */
.pd-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}
.pd-btn {
  display: inline-flex;
  flex: 1 1 auto;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 12px 20px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
  white-space: nowrap;
  transition: background-color .2s, color .2s, border-color .2s;
}
.pd-btn i { font-size: 15px; line-height: 1; }
.pd-btn-main { color: #fff; background: var(--brand); border: 1px solid var(--brand); }
.pd-btn-main:hover { background: var(--brand-600); border-color: var(--brand-600); }
.pd-btn-tel { color: var(--brand); background: #fff; border: 1px solid var(--brand); }
.pd-btn-tel:hover { color: #fff; background: var(--brand); }

/* 卖点 */
.pd-points {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
}
.pd-points li {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  color: var(--muted);
}
.pd-points i { font-size: 15px; line-height: 1; color: var(--brand); }

/* 详情正文 */
.pd-detail { margin-top: 46px; }
.pd-rich p {
  margin: 0 0 14px;
  font-size: 15px;
  line-height: 1.95;
  color: var(--text);
}
.pd-rich p:last-child { margin-bottom: 0; }

/* 产品说明内的小标题（产品参数） */
.pd-h3 {
  position: relative;
  margin: 24px 0 12px;
  padding-left: 11px;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--ink);
}
.pd-h3::before {
  content: "";
  position: absolute;
  left: 0;
  top: 4px;
  bottom: 4px;
  width: 3px;
  background: var(--brand);
}

/* 参数表 */
.pd-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13.5px;
}
.pd-table th,
.pd-table td {
  padding: 11px 14px;
  text-align: left;
  vertical-align: top;
  border: 1px solid var(--line-soft);
  line-height: 1.7;
}
.pd-table th {
  width: 104px;
  font-weight: 600;
  color: var(--muted-2);
  background: var(--bg-soft);
  white-space: nowrap;
}
.pd-table td { color: var(--text); }

/* 应用场景：图文卡（整卡为链接） */
.pd-scenes {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.pd-scene {
  display: block;
  background: #fff;
  border: 1px solid var(--line);
  transition: border-color .2s;
}
.pd-scene-thumb {
  display: block;
  background: var(--bg-soft);
  border-bottom: 1px solid var(--line-soft);
}
/* 场景配图完整显示：按图片原始比例，不裁切 */
.pd-scene-thumb img {
  display: block;
  width: 100%;
  height: auto;
}
.pd-scene-body { display: block; padding: 10px 12px 12px; }
.pd-scene-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.pd-scene-title {
  font-size: 13.5px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--ink);
  transition: color .2s;
}
.pd-scene-head i {
  flex: 0 0 auto;
  font-size: 15px;
  line-height: 1;
  color: var(--brand);
  transition: transform .2s;
}
.pd-scene-desc {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  margin-top: 4px;
  font-size: 11.5px;
  line-height: 1.6;
  color: var(--muted-2);
}
.pd-scene:hover { border-color: var(--brand); }
.pd-scene:hover .pd-scene-title { color: var(--brand); }
.pd-scene:hover .pd-scene-head i { transform: translateX(2px); }

/* 提示列表 */
.pd-list {
  margin: 0;
  padding-left: 20px;
  list-style: disc;   /* 前面带圆点 */
}
.pd-list li {
  margin: 0 0 8px;
  font-size: 14px;
  line-height: 1.9;
  color: var(--text);
}
.pd-list li::marker { color: var(--brand); }

/* 平板 */
@media (min-width: 768px) {
  .pd-sec { padding-top: 30px; }
  .pd-top { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 36px; align-items: start; }
  .pd-title { font-size: 28px; }
  .pd-scenes { grid-template-columns: repeat(4, 1fr); }
  .pd-spec dt { flex-basis: 80px; }
  .pd-table th { width: 130px; }
}

/* 桌面 */
@media (min-width: 1024px) {
  .pd-sec { padding-top: 34px; }
  .pd-top { grid-template-columns: 480px minmax(0, 1fr); gap: 56px; }
  .pd-title { font-size: 32px; }
  .pd-detail { margin-top: 56px; }
  .pd-rich p { font-size: 15px; }
}

/* ---- 产品详情：相关案例（图文卡，整卡为链接） ---- */
.pd-cases {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.pd-case {
  display: block;
  background: #fff;
  border: 1px solid var(--line);
  transition: border-color .2s;
}
.pd-case-thumb {
  display: block;
  background: var(--bg-soft);
  border-bottom: 1px solid var(--line-soft);
}
.pd-case-thumb img {
  display: block;
  width: 100%;
  height: auto;
}
.pd-case-body { display: block; padding: 10px 12px 12px; }
.pd-case-title {
  display: block;
  overflow: hidden;
  font-size: 13.5px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--ink);
  white-space: nowrap;
  text-overflow: ellipsis;
  transition: color .2s;
}
.pd-case-meta {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 4px;
  font-size: 11.5px;
  line-height: 1.6;
  color: var(--muted-2);
}
.pd-case-meta i { font-size: 12.5px; line-height: 1; color: var(--brand); }
.pd-case:hover { border-color: var(--brand); }
.pd-case:hover .pd-case-title { color: var(--brand); }

@media (min-width: 768px) {
  .pd-cases { grid-template-columns: repeat(4, 1fr); gap: 12px; }
}

/* ==========================================================================
   ⑱ 案例列表页（cases.html）—— 左分类 + 右三列案例卡（图 + 左上角分类 + 标题）
   —— 复用 .pg-hero / .pl-layout / .pl-side / .pl-toolbar / .nw-pager / .cta-band
   ========================================================================== */
.cs-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.cs-card { display: block; }
.cs-media {
  position: relative;
  display: block;
  background: var(--bg-soft);
  border: 1px solid var(--line);
  transition: border-color .2s;
}
.cs-media img {
  display: block;
  width: 100%;
  height: auto;
}
.cs-badge {
  position: absolute;
  top: 0;
  left: 0;
  padding: 4px 9px;
  font-size: 11.5px;
  line-height: 1.5;
  color: #fff;
  background: var(--brand);
}
.cs-title {
  display: block;
  margin-top: 9px;
  overflow: hidden;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--ink);
  white-space: nowrap;
  text-overflow: ellipsis;
  transition: color .2s;
}
.cs-card:hover .cs-media { border-color: var(--brand); }
.cs-card:hover .cs-title { color: var(--brand); }

/* 平板及以上：一行三个 */
@media (min-width: 768px) {
  .cs-grid { grid-template-columns: repeat(3, 1fr); gap: 16px; }
  .cs-title { margin-top: 10px; font-size: 14.5px; }
}

@media (min-width: 1024px) {
  .cs-grid { gap: 20px; }
}

/* ==========================================================================
   ⑲ 案例详情页（case-detail.html）—— 左分类 + 右正文
   —— 复用 .pl-layout / .pl-side / .nd-body（正文排版）/ .pd-table / .cs-grid / .cta-band
   ========================================================================== */
.cd-article { min-width: 0; }
.cd-cat {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12.5px;
  color: var(--brand);
}
.cd-cat i { font-size: 14px; line-height: 1; }
.cd-title {
  margin: 10px 0 12px;
  font-size: 22px;
  font-weight: 800;
  line-height: 1.4;
  color: var(--ink);
}
.cd-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  margin: 0;
  padding-bottom: 18px;
  font-size: 12.5px;
  color: var(--muted-2);
  border-bottom: 1px solid var(--line);
}
.cd-meta span { display: inline-flex; align-items: center; gap: 5px; }
.cd-meta i { font-size: 13.5px; line-height: 1; color: var(--brand); }
.cd-lead {
  margin: 20px 0 24px;
  padding: 15px 16px;
  font-size: 14px;
  line-height: 1.9;
  color: var(--text);
  background: var(--bg-soft);
  border-left: 3px solid var(--brand);
}
.cd-body { margin-bottom: 6px; }

/* 现场实景：两列图，完整显示不裁切 */
.cd-gallery {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
.cd-fig { margin: 0; }
.cd-fig img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid var(--line);
}
.cd-fig figcaption {
  margin-top: 7px;
  font-size: 12px;
  line-height: 1.6;
  color: var(--muted-2);
  text-align: center;
}

@media (min-width: 768px) {
  .cd-title { font-size: 26px; }
  .cd-gallery { grid-template-columns: 1fr 1fr; gap: 14px; }
  .cd-lead { padding: 16px 18px; }
}

@media (min-width: 1024px) {
  .cd-title { font-size: 30px; }
  .cd-gallery { gap: 16px; }
}

/* ---- 产品详情：相关问题（问 + 答列表） ---- */
.pd-faq {
  /* 标题已带下划线，这里不再画第二条线；并把标题下方 16px 空隙收掉 */
  margin: -16px 0 0;
  padding: 0;
  list-style: none;
}
.pd-faq > li {
  padding: 15px 0 16px;
  border-bottom: 1px solid var(--line-soft);
}
.pd-faq-q {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  margin: 0 0 7px;
  font-size: 14.5px;
  font-weight: 700;
  line-height: 1.6;
  color: var(--ink);
}
.pd-faq-q i {
  flex: 0 0 auto;
  font-size: 15px;
  line-height: 1.6;
  color: var(--brand);
}
.pd-faq-a {
  margin: 0 0 0 22px;
  font-size: 13.5px;
  line-height: 1.9;
  color: var(--muted);
}

/* ==========================================================================
   ⑳ FAQ 列表页（faq.html）—— 左分类 + 右问答折叠列表
   —— 复用 .pg-hero / .pl-layout / .pl-side / .nd-subbar / .cta-band
   ========================================================================== */
.faq-group { scroll-margin-top: 150px; }
.faq-group + .faq-group { margin-top: 34px; }
.faq-count {
  font-size: 12px;
  color: var(--muted-2);
  white-space: nowrap;
}
.faq-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.faq-list > li { border-bottom: 1px solid var(--line-soft); }
.faq-row summary {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 14px 34px 14px 0;
  font-size: 14.5px;
  font-weight: 700;
  line-height: 1.7;
  color: var(--ink);
  cursor: pointer;
  list-style: none;
  transition: color .2s;
}
.faq-row summary::-webkit-details-marker { display: none; }
.faq-row summary i {
  flex: 0 0 auto;
  font-size: 15px;
  line-height: 1.7;
  color: var(--brand);
}
.faq-row summary::after {
  content: "+";
  position: absolute;
  top: 13px;
  right: 4px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1;
  color: var(--brand);
  transition: transform .2s;
}
.faq-row[open] summary::after { content: "\2212"; }
.faq-row summary:hover { color: var(--brand); }
.faq-row .faq-a {
  margin: 0 0 16px;
  padding-left: 23px;
  font-size: 13.5px;
  line-height: 1.95;
  color: var(--muted);
}

@media (min-width: 768px) {
  .faq-row summary { font-size: 15px; }
  .faq-group + .faq-group { margin-top: 40px; }
}

/* 问答标题：文字本身是链接，点击跳问答详情；点同一行的其它区域仍是展开/收起 */
.faq-row summary a.faq-q-link {
  color: inherit;
  text-decoration: none;
  transition: color .2s;
}
.faq-row summary a.faq-q-link:hover { color: var(--brand); text-decoration: underline; }

/* ==========================================================================
   ㉑ 问答详情页（faq-detail.html）—— 左分类 + 右问答正文
   —— 复用 .pl-layout / .pl-side / .cd-cat / .cd-title / .cd-meta / .cd-lead / .nd-body / .nd-subbar / .nd-nav
   ========================================================================== */
.fd-rel {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--line);
}
.fd-rel li + li { border-top: 1px solid var(--line-soft); }
.fd-rel a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 4px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.6;
  color: var(--ink);
  transition: color .2s;
}
.fd-rel a i {
  flex: 0 0 auto;
  font-size: 16px;
  line-height: 1;
  color: var(--muted-2);
  transition: color .2s, transform .2s;
}
.fd-rel a:hover { color: var(--brand); }
.fd-rel a:hover i { color: var(--brand); transform: translateX(2px); }

@media (min-width: 768px) {
  .fd-rel a { font-size: 14.5px; padding: 14px 4px; }
}

/* ==========================================================================
   ㉒ 行业方案页（solutions.html）—— 左行业分类 + 右图文方案
   —— 复用 .pg-hero / .pl-layout / .pl-side / .pl-toolbar / .cta-band
   ========================================================================== */
.sl-item {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  padding: 22px 0;
  border-bottom: 1px solid var(--line-soft);
  scroll-margin-top: 150px;
}
.sl-item:first-of-type { padding-top: 6px; }
.sl-media {
  display: block;
  background: var(--bg-soft);
  border: 1px solid var(--line);
}
.sl-media img {
  display: block;
  width: 100%;
  height: auto;
}
.sl-body { min-width: 0; }
.sl-no {
  margin: 0 0 6px;
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: .06em;
  color: var(--brand);
}
.sl-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
  font-size: 19px;
  font-weight: 800;
  line-height: 1.4;
  color: var(--ink);
}
.sl-title i { font-size: 19px; line-height: 1; color: var(--brand); }
.sl-desc {
  margin: 0 0 12px;
  font-size: 13.5px;
  line-height: 1.9;
  color: var(--muted);
}
.sl-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0;
}
.sl-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 8px 14px;
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1.4;
  color: #fff;
  background: var(--brand);
  border: 1px solid var(--brand);
  transition: background-color .2s, border-color .2s, color .2s;
}
.sl-link i { font-size: 13px; line-height: 1; }
.sl-link:hover { background: var(--brand-600); border-color: var(--brand-600); }
.sl-link-ghost { color: var(--brand); background: #fff; }
.sl-link-ghost:hover { color: #fff; background: var(--brand); border-color: var(--brand); }

@media (min-width: 768px) {
  .sl-item {
    grid-template-columns: 300px minmax(0, 1fr);
    gap: 24px;
    padding: 26px 0;
    align-items: start;
  }
  .sl-title { font-size: 20px; }
  .sl-desc { font-size: 14px; }
}

@media (min-width: 1024px) {
  .sl-item {
    grid-template-columns: 340px minmax(0, 1fr);
    gap: 30px;
    padding: 30px 0;
  }
  .sl-title { font-size: 21px; }
}

/* ---- 行业方案详情：正文末尾两个按钮 ---- */
.sd-actions { margin-top: 32px; }

/* ==========================================================================
   ㉓ 联系我们页（contact.html）—— 品牌联系面板 + 二维码 + 咨询流程 + 到厂地图
   ========================================================================== */
.ct-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
  max-width: 460px;
}

/* 上：品牌蓝联系面板 + 二维码面板 */
.ct-sec { padding-top: 30px; padding-bottom: 0; }
.ct-top {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
.ct-panel {
  padding: 24px 22px;
  background: #fff;
  border: 1px solid var(--line);
}
.ct-panel-brand {
  background: var(--brand);
  border-color: var(--brand);
  color: #fff;
}
.ct-eyebrow {
  margin: 0 0 8px;
  font-size: 12.5px;
  color: rgba(255, 255, 255, .78);
}
.ct-phone {
  display: inline-block;
  font-size: 30px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: .01em;
  color: #fff;
}
.ct-phone:hover { color: #fff; text-decoration: underline; }
.ct-hours {
  margin: 6px 0 0;
  font-size: 12.5px;
  color: rgba(255, 255, 255, .78);
}
.ct-rows { margin-top: 18px; }
.ct-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0;
  padding: 11px 0;
  font-size: 13.5px;
  line-height: 1.7;
  color: rgba(255, 255, 255, .94);
  border-top: 1px solid rgba(255, 255, 255, .22);
}
.ct-row i {
  flex: 0 0 auto;
  margin-top: 3px;
  font-size: 15px;
  line-height: 1;
  color: #fff;
}
.ct-panel-title {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0 0 14px;
  font-size: 14px;
  font-weight: 700;
  color: var(--ink);
}
.ct-panel-title i { font-size: 16px; line-height: 1; color: var(--brand); }
.ct-qrs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.ct-qrs li { text-align: center; }
.ct-qrs img { display: block; width: 100%; height: auto; border: 1px solid var(--line-soft); }
.ct-qrs span { display: block; margin-top: 6px; font-size: 11.5px; color: var(--muted-2); }
.ct-tip {
  margin: 12px 0 0;
  font-size: 11.5px;
  line-height: 1.6;
  color: var(--muted-2);
}

/* 中：咨询流程 */
.ct-sec-steps { padding-top: 50px; padding-bottom: 0; }
.ct-sub { font-size: 12px; color: var(--muted-2); }
.ct-steps {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.ct-step {
  padding: 16px 14px 18px;
  background: #fff;
  border: 1px solid var(--line);
}
.ct-step-no {
  margin: 0 0 8px;
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: .06em;
  color: var(--brand);
}
.ct-step-title {
  margin: 0 0 6px;
  font-size: 14.5px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--ink);
}
.ct-step-desc {
  margin: 0;
  font-size: 12.5px;
  line-height: 1.8;
  color: var(--muted);
}

/* 下：到厂说明 + 地图占位 */
.ct-sec-visit { padding-top: 50px; padding-bottom: 56px; }
.ct-visit {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}
.ct-body { min-width: 0; }
.ct-body h3 {
  margin: 22px 0 10px;
  padding-left: 11px;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--ink);
  border-left: 3px solid var(--brand);
}
.ct-body h3:first-child { margin-top: 0; }
.ct-body p { margin: 0 0 12px; }
.ct-body ul { margin: 0 0 12px; }
.ct-map {
  margin: 0;
  border: 1px solid var(--line);
  background: #fff;
}
.ct-map img {
  display: block;
  width: 100%;
  height: auto;
}
@media (min-width: 768px) {
  .ct-sec { padding-top: 34px; padding-bottom: 0; }
  .ct-top { grid-template-columns: minmax(0, 1fr) 320px; gap: 16px; align-items: stretch; }
  .ct-panel { padding: 26px 24px; }
  .ct-phone { font-size: 34px; }
  .ct-sec-steps { padding-top: 56px; padding-bottom: 0; }
  .ct-steps { grid-template-columns: repeat(4, 1fr); gap: 12px; }
  .ct-visit { grid-template-columns: minmax(0, 1fr) 380px; gap: 32px; align-items: start; }
}

@media (min-width: 1024px) {
  .ct-top { grid-template-columns: minmax(0, 1fr) 380px; }
  .ct-phone { font-size: 38px; }
  .ct-step { padding: 20px 18px 22px; }
  .ct-sec-visit { padding-bottom: 64px; }
  .ct-visit { grid-template-columns: minmax(0, 1fr) 440px; gap: 44px; }
}

/* 二维码面板底部：补一条快捷联系，填满与左侧面板的高度差 */
.ct-panel-foot {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--line-soft);
}
.ct-foot-text {
  margin: 0 0 10px;
  font-size: 12.5px;
  line-height: 1.7;
  color: var(--muted);
}
.ct-panel-foot .ct-foot-btn {
  display: flex;
  width: 100%;
  padding: 10px 14px;
  font-size: 13px;
}

/* ==========================================================================
   ㉔ 关于我们：公司档案（工商登记信息表）
   ========================================================================== */
.abt-record {
  margin: 0;
  border-top: 1px solid var(--line);
}
.abt-record-row {
  display: grid;
  grid-template-columns: 108px minmax(0, 1fr);
  gap: 10px 14px;
  padding: 13px 0;
  border-bottom: 1px solid var(--line-soft);
}
.abt-record dt {
  margin: 0;
  font-size: 12.5px;
  line-height: 1.8;
  color: var(--muted-2);
}
.abt-record dd {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.85;
  color: var(--ink);
  word-break: break-word;
}

@media (min-width: 768px) {
  .abt-record-row {
    grid-template-columns: 180px minmax(0, 1fr);
    gap: 14px 28px;
    padding: 15px 0;
  }
  .abt-record dt { font-size: 13px; }
  .abt-record dd { font-size: 14px; }
}

@media (min-width: 1024px) {
  .abt-record-row {
    grid-template-columns: 210px minmax(0, 1fr);
    gap: 16px 40px;
  }
}

/* 公司档案：登记表 + 营业执照图片（桌面左右，移动上下） */
.abt-record-wrap {
  display: grid;
  grid-template-columns: 1fr;
  gap: 22px;
}
.abt-license { margin: 0; min-width: 0; }
.abt-license-link {
  display: block;
  border: 1px solid var(--line);
  background: #fff;
  transition: border-color .2s;
}
.abt-license-link:hover { border-color: var(--brand); }
.abt-license img { display: block; width: 100%; height: auto; }
.abt-license figcaption {
  margin-top: 8px;
  font-size: 12px;
  line-height: 1.6;
  color: var(--muted-2);
  text-align: center;
}

@media (min-width: 1024px) {
  .abt-record-wrap {
    grid-template-columns: minmax(0, 1fr) 400px;
    gap: 44px;
    align-items: start;
  }
}

/* ==========================================================================
   ㉕ 关于我们：排版重构（数据条 + 左标题 / 右内容的编辑式两栏）
   ========================================================================== */

/* 页头下方数据条：压在页头下沿 */
.abt-stats-sec {
  position: relative;
  z-index: 2;
  margin-top: -28px;
}
.abt-stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1px;
  margin: 0;
  background: var(--line);
  border: 1px solid var(--line);
}
.abt-stats > div {
  padding: 16px 18px;
  background: #fff;
}
.abt-stats dt {
  margin: 0 0 5px;
  font-size: 12px;
  color: var(--muted-2);
}
.abt-stats dd {
  margin: 0;
  font-size: 17px;
  font-weight: 800;
  line-height: 1.4;
  color: var(--ink);
}

/* 简介：去掉 facts 后调整间距 */
.abt-intro-sec { padding-top: 46px; }
.abt-intro-body .pg-h2 { margin-top: 8px; }
.abt-intro-body .pg-p { font-size: 14px; line-height: 1.95; }

/* 左标题 / 右内容 */
.abt-split {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}
.abt-split-side .pg-h2 { font-size: 22px; margin-top: 8px; }
.abt-split-side .pg-lead { margin-top: 10px; }
.abt-split-main { min-width: 0; }

/* 能力：编号 + 文字的横排条目 */
.abt-caps-rows { display: grid; grid-template-columns: 1fr; gap: 0; }
.abt-caps-rows .abt-cap {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  column-gap: 16px;
  padding: 18px 0;
  background: transparent;
  border: 0;
  border-top: 1px solid var(--line);
}
.abt-caps-rows .abt-cap:last-child { border-bottom: 1px solid var(--line); }
.abt-caps-rows .abt-cap-no {
  grid-row: 1 / span 2;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .06em;
  color: var(--brand);
  padding-top: 3px;
}
.abt-caps-rows .abt-cap h3 {
  grid-column: 2;
  margin: 0 0 6px;
  font-size: 16px;
}
.abt-caps-rows .abt-cap p { grid-column: 2; }

/* 坚持的事：两列 */
.abt-values-2col { grid-template-columns: 1fr; }
.abt-values-2col .abt-value { padding: 20px 18px; }

/* 历程：年份 + 内容 的时间线 */
.abt-time-rows { display: grid; grid-template-columns: 1fr; gap: 0; }
.abt-time-rows li {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  column-gap: 18px;
  padding: 18px 0;
  border-left: 0;
  border-top: 1px solid var(--line);
}
.abt-time-rows li:last-child { border-bottom: 1px solid var(--line); }
.abt-time-rows li::before { display: none; }
.abt-time-rows .abt-time-year {
  grid-row: 1 / span 2;
  margin: 0;
  padding-top: 1px;
  font-size: 15px;
  font-weight: 800;
  color: var(--brand);
}
.abt-time-rows h3 { grid-column: 2; margin: 0 0 6px; font-size: 15.5px; }
.abt-time-rows p:last-child { grid-column: 2; margin: 0; }

/* 公司档案：右栏内 表格 + 执照 */
.abt-split .abt-record-wrap { grid-template-columns: 1fr; gap: 22px; }
.abt-split .abt-record dt { font-size: 12.5px; }

@media (min-width: 768px) {
  .abt-stats { grid-template-columns: repeat(4, 1fr); }
  .abt-stats > div { padding: 18px 22px; }
  .abt-stats dd { font-size: 19px; }
  .abt-split { gap: 26px; }
  .abt-split-side .pg-h2 { font-size: 24px; }
  .abt-values-2col { grid-template-columns: 1fr 1fr; gap: 14px; }
  .abt-split .abt-record-row { grid-template-columns: 150px minmax(0, 1fr); gap: 12px 22px; }
}

@media (min-width: 1024px) {
  .abt-stats-sec { margin-top: -34px; }
  .abt-split {
    grid-template-columns: 290px minmax(0, 1fr);
    gap: 56px;
    align-items: start;
  }
  .abt-split-side {
    position: sticky;
    top: 190px;   /* 吸附在吸顶头部（顶栏 39 + 头部 144）之下 */
    align-self: start;
  }
  .abt-split-side .pg-h2 { font-size: 25px; }
  .abt-intro-sec { padding-top: 54px; }
}

@media (min-width: 1280px) {
  .abt-split { grid-template-columns: 320px minmax(0, 1fr); gap: 72px; }
  .abt-split .abt-record-wrap {
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 34px;
    align-items: start;
  }
}

/* ==========================================================================
   ㉖ 图片弹窗（营业执照大图）—— :target 控制显隐，纯 CSS 可开关
   ========================================================================== */
.lightbox {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.lightbox:target { display: flex; }
.lightbox-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(10, 14, 22, .84);
}
.lightbox-body {
  position: relative;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  max-width: min(1200px, 94vw);
  max-height: 92vh;
}
.lightbox-body img {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 82vh;
  background: #fff;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .35);
}
.lightbox-caption {
  font-size: 12px;
  line-height: 1.6;
  color: rgba(255, 255, 255, .72);
  text-align: center;
}
.lightbox-close {
  position: absolute;
  top: -16px;
  right: -16px;
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: var(--brand);
  transition: background-color .2s;
}
.lightbox-close i { font-size: 20px; line-height: 1; }
.lightbox-close:hover { background: var(--brand-600); }

/* 弹窗打开时锁住页面滚动（现代浏览器支持 :has） */
body:has(.lightbox:target) { overflow: hidden; }

@media (min-width: 768px) {
  .lightbox { padding: 32px; }
  .lightbox-body { gap: 14px; }
}

/* ==========================================================================
   ㉗ 关于我们：公司简介配图改为「小图 + 图注」，文字侧加宽、垂直居中
   ========================================================================== */
.abt-intro {
  display: grid;
  grid-template-columns: 1fr;
  gap: 22px;
  align-items: start;
}
.abt-intro-media {
  margin: 0;
  min-width: 0;
}
.abt-intro-media img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid var(--line);
  background: var(--bg-soft);
}
.abt-intro-media figcaption {
  margin-top: 8px;
  font-size: 12px;
  line-height: 1.6;
  color: var(--muted-2);
}

@media (min-width: 768px) {
  .abt-intro {
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 34px;
    align-items: start;
  }
}

@media (min-width: 1024px) {
  .abt-intro {
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 48px;
  }
  .abt-intro-body { max-width: 640px; }
}

@media (min-width: 1440px) {
  .abt-intro {
    grid-template-columns: minmax(0, 1fr) 380px;
    gap: 64px;
  }
}

/* 左栏标题：中文断行均衡，避免最后一行只剩一两个字 */
.abt-split-side .pg-h2 { text-wrap: balance; }

/* ==========================================================================
   ㉘ 关于我们：我们坚持的事 —— 去掉四张卡片，改细线分格（更克制的版式）
   ========================================================================== */
.abt-values-2col {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  margin: 0;
  padding: 0;
  background: var(--line);
}
.abt-values-2col .abt-value {
  position: relative;
  padding: 22px 20px 24px;
  background: #fff;
  border: 0;
  transition: background-color .25s;
}
.abt-values-2col .abt-value::before {
  content: "";
  position: absolute;
  left: 0;
  top: 22px;
  bottom: 24px;
  width: 3px;
  background: var(--brand);
  transform: scaleY(0);
  transform-origin: top;
  transition: transform .25s;
}
.abt-values-2col .abt-value:hover { background: #FAFBFD; }
.abt-values-2col .abt-value:hover::before { transform: scaleY(1); }
.abt-values-2col .abt-value span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .16em;
  color: var(--brand);
}
.abt-values-2col .abt-value span::before {
  content: "";
  width: 7px;
  height: 7px;
  background: var(--brand);
}
.abt-values-2col .abt-value h3 {
  margin: 10px 0 8px;
  font-size: 16.5px;
  font-weight: 800;
  line-height: 1.5;
  color: var(--ink);
}
.abt-values-2col .abt-value p {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.85;
  color: var(--muted);
}

@media (min-width: 768px) {
  .abt-values-2col { grid-template-columns: 1fr 1fr; }
  .abt-values-2col .abt-value { padding: 26px 24px 28px; }
  .abt-values-2col .abt-value::before { top: 26px; bottom: 28px; }
}

@media (min-width: 1024px) {
  .abt-values-2col .abt-value { padding: 30px 28px 32px; }
  .abt-values-2col .abt-value::before { top: 30px; bottom: 32px; }
  .abt-values-2col .abt-value h3 { font-size: 17px; }
}

/* ==========================================================================
   ㉙ 关于我们：发展历程 —— 三段时间轴（年份大号 + 顶部细线，桌面三列）
   ========================================================================== */
.abt-time-rows {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
.abt-time-rows li {
  display: block;
  padding: 16px 0 20px;
  border-top: 1px solid var(--line);
  border-left: 0;
}
.abt-time-rows li::before { display: none; }
.abt-time-rows .abt-time-year {
  margin: 0;
  padding: 0;
  font-size: 24px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: .01em;
  color: var(--brand);
}
.abt-time-rows h3 {
  margin: 10px 0 8px;
  font-size: 15.5px;
  font-weight: 800;
  line-height: 1.5;
  color: var(--ink);
}
.abt-time-rows p:last-child {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.85;
  color: var(--muted);
}

@media (min-width: 768px) {
  .abt-time-rows {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 28px;
  }
  .abt-time-rows li { padding: 18px 0 4px; }
  .abt-time-rows .abt-time-year { font-size: 26px; }
}

@media (min-width: 1024px) {
  .abt-time-rows { column-gap: 36px; }
  .abt-time-rows li { padding: 20px 0 4px; }
  .abt-time-rows .abt-time-year { font-size: 28px; }
  .abt-time-rows h3 { font-size: 16px; }
}

/* ==========================================================================
   ㉚ 公司档案：右侧营业执照跟随滚动（左侧标题 + 中间表格 + 右侧执照各自就位）
   ========================================================================== */
.abt-split .abt-record-wrap { align-items: start; }

@media (min-width: 1280px) {
  .abt-split .abt-license {
    position: sticky;
    top: 190px;
    align-self: start;
  }
}

/* 归档标题锚点：避免被吸顶头部遮住 */
#abtRecord { scroll-margin-top: 190px; }

/* ==========================================================================
   ㉛ 公司简介：恢复最初版式（左文 + 2×2 数据 + 右图，图文各半）
   ========================================================================== */
.abt-intro-sec { padding-top: 46px; }

/* 覆盖后续加过的收窄规则，回到最初的图文比例 */
.abt-intro {
  display: grid;
  grid-template-columns: 1fr;
  gap: 26px;
  align-items: start;
}
.abt-intro-body { max-width: none; }
.abt-intro-body .pg-h2 { margin-top: 8px; }
.abt-intro-body .pg-p { font-size: 13.5px; line-height: 1.9; max-width: none; }
.abt-intro-media { margin: 0; min-width: 0; }
.abt-intro-media img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid var(--line);
}
.abt-intro-media figcaption { display: none; }

@media (min-width: 768px) {
  .abt-intro {
    grid-template-columns: 1.05fr .95fr;
    gap: 44px;
    align-items: start;
  }
}

@media (min-width: 1024px) {
  .abt-intro {
    grid-template-columns: 1.05fr .95fr;
    gap: 56px;
  }
}

@media (min-width: 1440px) {
  .abt-intro {
    grid-template-columns: 1.05fr .95fr;
    gap: 64px;
  }
}

/* 发展历程：去掉最后一列的底部下划线（三列并排时只保留顶部细线） */
.abt-time-rows li:last-child { border-bottom: 0; }

/* 发展历程：桌面只保留一条贯通细线，避免与每列的上边线叠在一起 */
.abt-time-rows { border-top: 0; }

@media (min-width: 768px) {
  .abt-time-rows { border-top: 1px solid var(--line); }
  .abt-time-rows li { border-top: 0; }
}