/* ============================================================
 * GTG 广测集团 - 储能类产品认证长单页（solar.html）专属样式
 * 依赖 common.css 的变量与基类（--green / --lime / .container / .icon 等）
 * ============================================================ */

/* ---------- 本页头部恒为白底（复刻 common.css 的 is-solid 视觉效果） ---------- */
.site-header.always-solid {
  background: #fff;
  color: var(--text);
  box-shadow: 0 2px 16px rgba(0, 0, 0, .08);
}
.site-header.always-solid .logo .logo-color { display: block; }
.site-header.always-solid .logo .logo-white { display: none; }
.site-header.always-solid .icon-btn:hover { background: var(--bg-light); }
/* logo 右侧文字：白底 header 上直接固定深色，不依赖 hover / 滚动状态 */
.site-header.always-solid .logo-text { border-left-color: rgba(0, 0, 0, .15); }
.site-header.always-solid .logo-text b { color: var(--green); }
.site-header.always-solid .logo-text i { color: #666; }

/* ============================================================
 * 页面 Banner（3 张轮播，620px，淡遮罩，左对齐文案）
 * ============================================================ */
.page-banner {
  position: relative;
  height: 620px;
  color: #fff;
  overflow: hidden;
}
.banner-slides { position: absolute; inset: 0; }
.banner-slide {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity .9s ease, visibility 0s linear .9s;
}
.banner-slide.on {
  opacity: 1;
  visibility: visible;
  transition: opacity .9s ease;
  z-index: 1;
}
.banner-bg,
.banner-bg img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* 通栏图片保持静止；轮播仍保留淡入淡出。 */
.banner-slide .banner-bg img { animation: none; transform: none; }
/* 仅保留一层很淡的深色保证文字可读，不带绿色调 */
.banner-mask {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0, 0, 0, .45) 0%, rgba(0, 0, 0, .18) 55%, rgba(0, 0, 0, .05) 100%);
}
.banner-body {
  position: relative;
  z-index: 1;
  /* 固定头部（本页恒白底）：预留 strip + 主导航高度 */
  padding-top: calc(var(--header-total) + 24px);
}
/* 文案随切换上浮进入 */
.banner-slide .banner-body > * {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .7s ease .25s, transform .7s cubic-bezier(.22, .61, .36, 1) .25s;
}
.banner-slide.on .banner-body > * { opacity: 1; transform: none; }
.banner-slide.on .banner-body > *:nth-child(2) { transition-delay: .4s; }
.banner-slide.on .banner-body > *:nth-child(3) { transition-delay: .55s; }

.banner-title {
  font-size: 48px;
  font-weight: 800;
  letter-spacing: 1px;
  line-height: 1.25;
  text-wrap: balance;
}
.banner-desc {
  margin-top: 20px;
  max-width: 560px;
  font-size: 15px;
  line-height: 2;
  letter-spacing: 1px;
  color: rgba(255, 255, 255, .88);
}

/* CTA 按钮 */
.banner-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 30px;
  height: 46px;
  padding: 0 30px;
  background: var(--green);
  border-radius: 23px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 2px;
  color: #fff;
  transition: background .25s ease, transform .25s ease, box-shadow .25s ease;
}
.banner-cta .icon { width: 15px; font-size: 15px; height: 15px; transition: transform .25s ease; }
.banner-cta:hover {
  background: var(--green-dark);
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(0, 155, 76, .35);
}
.banner-cta:hover .icon { transform: translateX(4px); }
.banner-cta:active { transform: translateY(0) scale(.97); box-shadow: none; }

/* 指示点（左）+ 箭头（右）：同一行压底 */
.banner-ui {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 36px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.banner-dots { display: flex; gap: 10px; }
.banner-dots button {
  width: 26px;
  height: 4px;
  border-radius: 2px;
  background: rgba(255, 255, 255, .35);
  transition: all .3s ease;
}
.banner-dots button.on { width: 44px; background: #fff; }
.banner-arrows { display: flex; gap: 10px; }
.banner-arrows button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(255, 255, 255, .45);
  border-radius: 50%;
  color: #fff;
  transition: all .25s ease;
}
.banner-arrows button .icon { width: 18px; font-size: 18px; height: 18px; }
.banner-arrows button:hover { background: var(--green); border-color: var(--green); }
.banner-arrows button:active { transform: scale(.92); }

/* ============================================================
 * 页内锚点导航（sticky 吸附在头部下方）
 * ============================================================ */
.anchor-nav {
  position: sticky;
  top: var(--header-total);
  z-index: 90;
  background: #fff;
  border-bottom: 1px solid var(--line);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .05);
  transition: top .35s cubic-bezier(.22, .61, .36, 1),
              background .3s ease, box-shadow .3s ease;
}
/* 滚动吸附后：黑色半透明底 + 白字 */
.anchor-nav.scrolled {
  background: rgba(15, 20, 17, .6);
  /* 固定导航不采样滚动中的背景，避免持续模糊重绘。 */
  border-bottom-color: rgba(255, 255, 255, .08);
  box-shadow: 0 10px 28px rgba(0, 0, 0, .22);
}
.anchor-nav.scrolled .anchor-tabs a {
  height: 46px;
  font-size: 13.5px;
  color: rgba(255, 255, 255, .72);
}
.anchor-nav.scrolled .anchor-tabs a:hover { color: #fff; }
/* 当前项：绿底胶囊，去掉下划线 */
.anchor-nav.scrolled .anchor-tabs { align-items: center; }
.anchor-nav.scrolled .anchor-tabs a.on {
  height: 30px;
  padding: 0 15px;
  background: var(--green);
  border-radius: 15px;
  color: #fff;
}
.anchor-nav.scrolled .anchor-tabs a.on::after { display: none; }
.anchor-nav.scrolled .breadcrumb { color: rgba(255, 255, 255, .5); }
.anchor-nav.scrolled .breadcrumb a { color: rgba(255, 255, 255, .72); }
.anchor-nav.scrolled .breadcrumb a:hover { color: #fff; }
.anchor-nav.scrolled .breadcrumb span { color: #fff; }
.anchor-nav-in {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.anchor-tabs {
  display: flex;
  align-items: stretch;
  gap: 4px;
  min-width: 0;
}
.anchor-tabs a {
  position: relative;
  display: flex;
  align-items: center;
  padding: 0 16px;
  height: 58px;
  flex-shrink: 0;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 1px;
  white-space: nowrap;
  color: var(--text);
  transition: color .25s ease, height .3s ease, font-size .3s ease;
}
.anchor-tabs a::after {
  content: "";
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: -1px;
  height: 3px;
  border-radius: 2px;
  background: var(--green);
  transform: scaleX(0);
  transition: transform .3s cubic-bezier(.22, .61, .36, 1);
}
.anchor-tabs a:hover { color: var(--green); }
.anchor-tabs a.on { color: var(--green); }
.anchor-tabs a.on::after { transform: scaleX(1); }

/* 导航条右侧：面包屑 */
.anchor-nav .breadcrumb {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  letter-spacing: 1px;
  white-space: nowrap;
  color: var(--text-light);
}
.anchor-nav .breadcrumb a { transition: color .25s ease; }
.anchor-nav .breadcrumb a:hover { color: var(--green); }
.anchor-nav .breadcrumb i { font-style: normal; opacity: .45; }
.anchor-nav .breadcrumb span { color: var(--text); }

/* ============================================================
 * 区块通用
 * ============================================================ */
.sec { padding: 84px 0 96px; background: #fff; }
/* 专题锚点需要真实区块高度，避免延迟渲染的估算高度导致远距离跳转偏移。 */
.sec-solution { background: var(--bg-light); }

/* 服务承诺板块：品牌绿底白字 */
.sec-promise {
  background: linear-gradient(135deg, var(--green) 0%, var(--green-dark) 100%);
  color: #fff;
}
.sec-promise .sec-title { color: #fff; }
.sec-promise .sec-desc { color: rgba(255, 255, 255, .72); }

.biz-head {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  margin-bottom: 52px;
}
.biz-head-text { position: relative; z-index: 1; }
.sec-title {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 34px;
  font-weight: 800;
  letter-spacing: 0;
  text-wrap: balance;
}
.biz-mark {
  flex-shrink: 0;
  width: 13px;
  height: 13px;
  background: var(--lime);
  box-shadow: 7px 7px 0 var(--green);
}
.sec-desc {
  margin-top: 8px;
  max-width: 640px;
  font-size: 15px;
  letter-spacing: 0;
  color: var(--text-light);
}


/* 区块内小标题（biz-mark + 22px） */
.sub-title {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0;
}
.sub-desc {
  margin-top: 8px;
  font-size: 14px;
  letter-spacing: 1px;
  color: var(--text-light);
}

/* 滚动进场 / 退场（可重复触发） */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 1s cubic-bezier(.16, 1, .3, 1),
              transform 1s cubic-bezier(.16, 1, .3, 1);
}
.reveal.in {
  opacity: 1;
  transform: none;
}

/* ============================================================
 * #product 储能类产品认证（一排三个滑动切换，分页器 + 箭头翻页）
 * ============================================================ */

/* 视口：overflow 裁切滑轨；上下内边距 + 负 margin 给 hover 阴影留空间；
   左右不留内边距，滑出卡片在内容边缘整齐裁切，不露边角 */
.pd-viewport {
  overflow: hidden;
  padding: 30px 0 80px;
  margin: -30px 0 0;
  cursor: grab;
  user-select: none;
  -webkit-user-select: none;
  touch-action: pan-y; /* 横向拖动交给滑块，纵向保留页面滚动 */
}
.pd-viewport.dragging { cursor: grabbing; }
.pd-viewport.dragging .pd-track { transition: none; }
.pd-track {
  position: relative; /* 使卡片 offsetLeft 相对滑轨取值，位移精确到布局像素 */
  display: flex;
  gap: 24px;
  transition: transform .6s cubic-bezier(.22, .61, .36, 1);
  will-change: transform;
}
.pd-track .pd-card { flex: 0 0 calc((100% - 48px) / 3); }

/* 头部右侧：切换箭头 + 查看更多 */
.pd-side {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 16px;
}

/* 底部控制条：分页器居中 */
.pd-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin-top: -30px;
}
.pd-pager { display: flex; gap: 10px; }
.pd-pager button {
  width: 26px;
  height: 4px;
  border-radius: 2px;
  background: rgba(0, 0, 0, .12);
  transition: all .3s ease;
}
.pd-pager button:hover { background: rgba(0, 155, 76, .4); }
.pd-pager button.on { width: 44px; background: var(--green); }
.pd-arrows { display: flex; gap: 10px; }
.pd-arrows button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  background: #fff;
  border: 1px solid #d4d4d4;
  border-radius: 50%;
  color: var(--text);
  transition: all .25s ease;
}
.pd-arrows button .icon { width: 18px; font-size: 18px; height: 18px; }
.pd-arrows button:hover {
  background: var(--green);
  border-color: var(--green);
  color: #fff;
}
.pd-arrows button:active { transform: scale(.92); }

/* 罗列卡：顶部实拍图 / 图标 + 白底信息区 */
.pd-card {
  position: relative;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
  transition: transform .4s ease, box-shadow .4s ease;
}
.pd-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 24px 50px rgba(0, 60, 30, .14);
}

/* 顶部媒体区：有实拍图用图，无图用绿底大图标 */
.pd-media {
  display: block;
  position: relative;
  height: 210px;
  overflow: hidden;
}
.pd-media picture,
.pd-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.pd-media img { transition: transform 1.1s cubic-bezier(.22, .61, .36, 1); }
.pd-card:hover .pd-media img { transform: scale(1.06); }
.pd-media-art {
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(150deg, var(--green) 0%, var(--green-dark) 100%);
}
.pd-media-art .icon {
  width: 84px;
  height: 84px;
  font-size: 84px;
  color: rgba(255, 255, 255, .92);
}

/* 白底信息区：标题 / 描述 / 推荐认证 / 按钮 */
.pd-panel {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 20px 22px 18px;
}
.pd-panel h3 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 1px;
}
/* 标题右侧图标：浅绿底圆角方块，hover 反白 */
.pd-title-ico {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: rgba(0, 166, 80, .08);
  color: var(--green);
  transition: all .3s ease;
}
.pd-title-ico .icon { width: 19px; font-size: 19px; height: 19px; }
.pd-card:hover .pd-title-ico { background: var(--green); color: #fff; }
.pd-desc {
  margin-top: 14px;
  font-size: 13.5px;
  line-height: 1.9;
  color: var(--text-light);
}

/* 推荐认证：纯文字标签，单行展示（超出隐藏），无灰底无内距 */
.pd-certs {
  display: flex;
  flex-wrap: nowrap;
  gap: 6px;
  margin-top: 12px;
  overflow: hidden;
}
.pd-cert {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  padding: 4px 9px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 7px;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .5px;
  white-space: nowrap;
  color: #333;
  transition: all .25s ease;
}
/* 单行裁切容器内不做位移/阴影，避免 hover 被 overflow 切掉 */
.pd-cert:hover {
  border-color: var(--green);
  background: rgba(0, 155, 76, .06);
  color: var(--green);
}

/* 底部按钮组（自动对齐卡片底部） */
.pd-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}
.pd-detail {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: 1px;
  color: var(--text);
  transition: color .25s ease;
}
.pd-detail-ico {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  background: var(--green);
  border-radius: 50%;
  color: #fff;
  transition: all .3s ease;
}
.pd-detail-ico .icon { width: 14px; font-size: 14px; height: 14px; }
.pd-detail:hover { color: var(--green); }
.pd-detail:hover .pd-detail-ico {
  background: var(--green-dark);
  transform: translateX(4px);
}
.pd-apply {
  flex-shrink: 0;
  padding: 7px 16px;
  border: 1.5px solid var(--green);
  border-radius: 18px;
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 1px;
  color: var(--green);
  transition: all .25s ease;
}
.pd-apply:hover {
  background: var(--green);
  color: #fff;
}
.pd-apply:active { transform: scale(.96); }

/* 窄屏：一排两个 */
@media (max-width: 1100px) {
  .pd-track .pd-card { flex-basis: calc((100% - 24px) / 2); }
}

/* ============================================================
 * #cert 推荐认证项目（白底，紧贴产品区 + 认证 logo 无缝跑马灯）
 * ============================================================ */
.sec-product { padding-bottom: 48px; }
.sec-cert {
  padding-top: 0;
  background: #fff;
}
/* 标题比大板块略小一号 */
.sec-cert .biz-head { margin-bottom: 32px; }
.sec-cert .sec-title { font-size: 26px; }

/* 标题图标：与导航「产品检测服务」组头图标一致 */
.sec-ico {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: rgba(0, 166, 80, .08);
  color: var(--green);
}
.sec-ico .icon { width: 22px; font-size: 22px; height: 22px; }

/* 头部右侧「查看更多」按钮：参考首页 .head-btn 样式 */
.head-btn {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 11px 26px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1px;
  color: var(--text);
  border: 1px solid #d4d4d4;
  border-radius: 24px;
  transition: all .3s ease;
}
.head-btn .icon {
  width: 15px; font-size: 15px;
  height: 15px;
  transition: transform .3s ease;
}
.head-btn:hover {
  border-color: var(--green);
  color: var(--green);
}
.head-btn:hover .icon { transform: translateX(4px); }

.cert-marquee {
  position: relative;
  overflow: hidden;
  /* 两端渐隐 */
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 80px, #000 calc(100% - 80px), transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 80px, #000 calc(100% - 80px), transparent 100%);
}
.cert-track {
  display: flex;
  gap: 18px;
  width: max-content;
  padding: 8px 0 18px;
  will-change: transform;
}
.cert-logo {
  flex-shrink: 0;
  width: 168px;
  padding: 18px 16px 14px;
  text-align: center;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: 0 6px 16px rgba(26, 58, 42, .06);
  transition: all .3s ease;
}
.cert-logo:hover {
  border-color: rgba(0, 155, 76, .4);
  transform: translateY(-3px);
  box-shadow: 0 14px 30px rgba(0, 122, 60, .12);
}
.cert-logo picture {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 44px;
}
.cert-logo img {
  max-height: 44px;
  max-width: 110px;
  width: auto;
  object-fit: contain;
}
.cert-logo i {
  display: block;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #f0f0f0;
  font-style: normal;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .5px;
  color: #555;
}

/* ============================================================
 * #solution 解决方案（左 tab 列表 + 右详情面板）
 * ============================================================ */
.sol-wrap {
  display: grid;
  grid-template-columns: 340px 1fr;
  gap: 24px;
  align-items: stretch;
}

/* 左：能力 tab 列表 */
.sol-tabs {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.sol-tab {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 18px;
  text-align: left;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  transition: all .3s ease;
}
.sol-tab-ico {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: rgba(0, 155, 76, .08);
  color: var(--green);
  transition: all .3s ease;
}
.sol-tab-ico .icon { width: 22px; font-size: 22px; height: 22px; }
.sol-tab b {
  flex: 1;
  min-width: 0;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 1px;
  color: var(--text);
  transition: color .3s ease;
}
.sol-tab .tab-arrow {
  flex-shrink: 0;
  width: 15px; font-size: 15px;
  height: 15px;
  opacity: 0;
  color: rgba(255, 255, 255, .85);
  transition: all .3s ease;
}
.sol-tab:hover { border-color: rgba(0, 155, 76, .4); }
.sol-tab.on {
  background: var(--green);
  border-color: var(--green);
  box-shadow: 0 14px 30px rgba(0, 122, 60, .2);
}
.sol-tab.on b { color: #fff; }
.sol-tab.on .sol-tab-ico { background: rgba(255, 255, 255, .16); color: #fff; }
.sol-tab.on .tab-arrow { opacity: 1; }

/* 右：详情面板 */
.sol-body {
  position: relative;
  padding: 48px 60px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
}
.sol-pane { display: none; }
.sol-pane.on { display: block; animation: solPaneIn .45s ease both; }
@keyframes solPaneIn {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: none; }
}
.sol-pane-ico {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 66px;
  height: 66px;
  border-radius: 16px;
  background: rgba(0, 155, 76, .08);
  color: var(--green);
}
.sol-pane-ico .icon { width: 32px; font-size: 32px; height: 32px; }
.sol-pane h3 {
  margin-top: 22px;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: 1px;
}
.sol-pane > p {
  margin-top: 12px;
  max-width: 640px;
  font-size: 14.5px;
  line-height: 2;
  color: var(--text-light);
}

/* 适用标准标签（能力详情复用） */
.cap-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 18px;
}
.cap-tags span {
  padding: 6px 12px;
  background: rgba(0, 155, 76, .06);
  border: 1px solid rgba(0, 155, 76, .16);
  border-radius: 8px;
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .5px;
  color: var(--green);
}

/* 详情参数表 */
.sol-params {
  margin-top: 26px;
  border-top: 1px solid var(--line);
}
.sol-params li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
}
.sol-params span {
  flex-shrink: 0;
  font-size: 13px;
  letter-spacing: 1px;
  color: var(--text-light);
}
.sol-params b {
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: .5px;
  text-align: right;
  color: var(--text);
}

/* ---------- 详情面板：左文案 + 右动效演示区 ---------- */
.sol-pane.on {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 56px;
  align-items: center;
}
/* 演示盒：深色仪器面板风——顶部状态栏 / 中部动效 / 底部进度条 */
.sol-demo {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 300px;
  border-radius: 18px;
  overflow: hidden;
  background: linear-gradient(160deg, #143527 0%, #0b1f15 100%);
  border: 1px solid rgba(255, 255, 255, .07);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 18px 40px rgba(6, 30, 17, .28);
}
/* 背景网格纹理 */
.sol-demo::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: linear-gradient(rgba(255, 255, 255, .04) 1px, transparent 1px),
                    linear-gradient(90deg, rgba(255, 255, 255, .04) 1px, transparent 1px);
  background-size: 22px 22px;
  pointer-events: none;
}
/* 四角柔和晕光 */
.sol-demo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 70% 55% at 50% 46%, rgba(144, 196, 47, .09), transparent 70%);
  pointer-events: none;
}
@keyframes liveBlink {
  0%, 100% { opacity: 1; }
  50% { opacity: .25; }
}
.demo-stage {
  position: relative;
  z-index: 1;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.demo-progress {
  position: relative;
  z-index: 2;
  height: 3px;
  margin: 0 16px 14px;
  background: rgba(255, 255, 255, .08);
  border-radius: 2px;
  overflow: hidden;
}
.demo-progress i {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, var(--green), var(--lime));
  transform-origin: left;
  animation: demoProgress 3.8s cubic-bezier(.45, 0, .2, 1) infinite;
}
@keyframes demoProgress {
  0% { transform: scaleX(0); opacity: 1; }
  72% { transform: scaleX(1); opacity: 1; }
  100% { transform: scaleX(1); opacity: 0; }
}

/* 安全测试：雷达扫描 + 盾牌 */
.demo-safe .radar {
  position: relative;
  width: 158px;
  height: 158px;
  border: 1px solid rgba(144, 196, 47, .4);
  border-radius: 50%;
  box-shadow: 0 0 30px rgba(144, 196, 47, .1), inset 0 0 24px rgba(144, 196, 47, .06);
}
.demo-safe .radar::before,
.demo-safe .radar::after {
  content: "";
  position: absolute;
  border: 1px solid rgba(144, 196, 47, .22);
  border-radius: 50%;
}
.demo-safe .radar::before { inset: 28px; }
.demo-safe .radar::after { inset: 56px; }
.demo-safe .radar-sweep {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: conic-gradient(from 0deg, rgba(144, 196, 47, .5), transparent 75deg);
  animation: radarSweep 2.8s linear infinite;
}
@keyframes radarSweep { to { transform: rotate(360deg); } }
.demo-safe .icon {
  position: absolute;
  width: 54px; font-size: 54px; height: 54px;
  color: #d6ec9f;
  filter: drop-shadow(0 0 10px rgba(144, 196, 47, .45));
  animation: iconBreath 2.8s ease-in-out infinite;
}
@keyframes iconBreath {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.07); }
}

/* EMC：正弦波形流动 */
.demo-emc .emc-svg { width: 92%; height: auto; overflow: visible; }
.demo-emc .emc-ghost {
  stroke: rgba(255, 255, 255, .12);
  stroke-width: 2;
}
.demo-emc .emc-line {
  stroke: var(--lime);
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-dasharray: 70 370;
  filter: drop-shadow(0 0 6px rgba(144, 196, 47, .55));
  animation: emcFlow 3s linear infinite;
}
@keyframes emcFlow {
  from { stroke-dashoffset: 440; }
  to { stroke-dashoffset: 0; }
}

/* 电池性能：充能 + 流光扫过 */
.demo-battery .bat-shell {
  position: relative;
  width: 168px;
  height: 68px;
  border: 2px solid rgba(255, 255, 255, .8);
  border-radius: 12px;
  padding: 5px;
  box-shadow: 0 0 24px rgba(144, 196, 47, .12);
}
.demo-battery .bat-fill {
  position: relative;
  height: 100%;
  width: 10%;
  border-radius: 7px;
  background: linear-gradient(90deg, #6aa832, var(--lime));
  overflow: hidden;
  animation: batCharge 3.8s cubic-bezier(.65, 0, .35, 1) infinite;
}
.demo-battery .bat-shine {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 26px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .5), transparent);
  animation: batShine 1.9s linear infinite;
}
@keyframes batCharge {
  0% { width: 10%; }
  62% { width: 94%; }
  100% { width: 10%; }
}
@keyframes batShine {
  from { transform: translateX(-30px); }
  to { transform: translateX(172px); }
}
.demo-battery .bat-cap {
  width: 7px;
  height: 24px;
  margin-left: 5px;
  background: rgba(255, 255, 255, .8);
  border-radius: 0 4px 4px 0;
}

/* 环境可靠性：温度柱 + 刻度尺 */
.demo-env .env-track {
  position: relative;
  width: 28px;
  height: 190px;
  border: 2px solid rgba(255, 255, 255, .8);
  border-radius: 14px;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
}
.demo-env .env-level {
  width: 100%;
  height: 80%;
  background: linear-gradient(180deg, #ff9a62, #e3c94f 55%, var(--lime));
  animation: envSwing 4s cubic-bezier(.45, 0, .55, 1) infinite;
}
@keyframes envSwing {
  0%, 100% { height: 82%; }
  50% { height: 20%; }
}
.demo-env .env-ticks {
  position: absolute;
  left: 50%;
  margin-left: 26px;
  top: 50%;
  transform: translateY(-50%);
  width: 10px;
  height: 190px;
  background: repeating-linear-gradient(180deg, rgba(255, 255, 255, .4) 0 1px, transparent 1px 15px);
}
.demo-env .env-tag {
  position: absolute;
  right: 34px;
  font-size: 11px;
  letter-spacing: 1px;
  color: rgba(255, 255, 255, .5);
}
.demo-env .env-tag.hot { top: calc(50% - 95px); }
.demo-env .env-tag.cold { top: calc(50% + 78px); }

/* 能效：环形仪表 + 辉光 */
.demo-energy svg {
  position: absolute;
  width: 196px;
  height: 196px;
  transform: rotate(-90deg);
}
.demo-energy .eg-track {
  fill: none;
  stroke: rgba(255, 255, 255, .1);
  stroke-width: 6;
}
.demo-energy .eg-run {
  fill: none;
  stroke: var(--lime);
  stroke-width: 6;
  stroke-linecap: round;
  stroke-dasharray: 251.2;
  filter: drop-shadow(0 0 6px rgba(144, 196, 47, .6));
  animation: egRun 3.4s cubic-bezier(.65, 0, .35, 1) infinite;
}
@keyframes egRun {
  0% { stroke-dashoffset: 251.2; }
  58% { stroke-dashoffset: 42; }
  100% { stroke-dashoffset: 251.2; }
}
.demo-energy .icon {
  width: 46px; font-size: 46px; height: 46px;
  color: #d6ec9f;
  filter: drop-shadow(0 0 10px rgba(144, 196, 47, .5));
  animation: iconBreath 1.8s ease-in-out infinite;
}

/* 无线射频：弧度依次点亮 + 光点脉冲 */
.demo-rf .demo-stage { align-items: flex-end; padding-bottom: 66px; }
.demo-rf .rf-dot {
  position: relative;
  width: 11px;
  height: 11px;
  background: var(--lime);
  border-radius: 50%;
  box-shadow: 0 0 12px rgba(144, 196, 47, .9);
  animation: liveBlink 1.4s ease-in-out infinite;
}
.demo-rf .rf-arc {
  position: absolute;
  bottom: 66px;
  left: 50%;
  border: 3px solid var(--lime);
  border-color: var(--lime) transparent transparent transparent;
  border-radius: 50% 50% 0 0 / 100% 100% 0 0;
  transform: translateX(-50%);
  filter: drop-shadow(0 -2px 6px rgba(144, 196, 47, .35));
  animation: rfPulse 2.4s cubic-bezier(.45, 0, .55, 1) infinite;
}
.demo-rf .rf-arc.a1 { width: 56px; height: 28px; animation-delay: 0s; }
.demo-rf .rf-arc.a2 { width: 106px; height: 53px; animation-delay: .3s; }
.demo-rf .rf-arc.a3 { width: 156px; height: 78px; animation-delay: .6s; }
@keyframes rfPulse {
  0%, 100% { opacity: .18; }
  50% { opacity: 1; }
}

/* ============================================================
 * #flow 服务流程：横向卡片滚动（拖动 / 触摸滑动，scroll-snap 对齐）
 * ============================================================ */
.flow-viewport {
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  cursor: grab;
  user-select: none;
  -webkit-user-select: none;
  touch-action: pan-y;
  /* 上下内边距 + 负 margin：给 hover 上浮阴影留空间，不被 overflow 裁掉 */
  padding: 32px 4px 72px;
  margin: -32px -4px -42px;
}
.flow-viewport::-webkit-scrollbar { display: none; }
.flow-viewport.dragging { cursor: grabbing; scroll-snap-type: none; }
@media (max-width: 992px), (pointer: coarse) {
  .flow-viewport { touch-action: pan-x pan-y pinch-zoom; }
}
.flow-track {
  position: relative;
  display: flex;
  gap: 16px;
  padding-top: 30px;
}
.flow-card {
  position: relative;
  flex: 1 0 190px;
  min-width: 0;
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 0 16px 20px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  transition: all .3s ease;
}
/* 默认全白底；hover 变绿 */
.flow-card:hover {
  background: linear-gradient(155deg, var(--green) 0%, var(--green-dark) 100%);
  border-color: transparent;
  transform: translateY(-5px);
  box-shadow: 0 22px 46px rgba(0, 90, 45, .28);
}
/* 节点圆点：压在串联线上 */
.flow-node {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  margin-top: -28px;
  background: #fff;
  border: 2px solid rgba(0, 155, 76, .35);
  border-radius: 50%;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: 1px;
  color: var(--green);
  font-variant-numeric: tabular-nums;
  transition: all .3s ease;
}
.flow-card:hover .flow-node {
  box-shadow: 0 0 0 6px rgba(0, 155, 76, .12);
}
/* 标题行：标题 + 右侧小图标 */
.flow-card h4 {
  margin-top: 12px;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 1px;
}
.flow-card:hover h4 { color: #fff; }
.flow-ico {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  margin-top: 16px;
  border-radius: 10px;
  background: rgba(0, 155, 76, .08);
  color: var(--green);
  transition: all .3s ease;
}
.flow-ico .icon { width: 19px; font-size: 19px; height: 19px; }
.flow-card:hover .flow-ico { background: rgba(255, 255, 255, .16); color: #fff; }
.flow-card p {
  margin-top: 8px;
  font-size: 12.5px;
  line-height: 1.85;
  color: var(--text-light);
}
.flow-card:hover p { color: rgba(255, 255, 255, .78); }
/* 步骤 meta 标签 */
.flow-meta {
  align-self: center;
  margin-top: 14px;
  padding: 6px 14px;
  background: rgba(0, 155, 76, .08);
  border-radius: 15px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1px;
  color: var(--green);
}
.flow-card:hover .flow-meta { background: rgba(255, 255, 255, .16); color: #fff; }
/* ============================================================
 * #advantage 选择GTG广测的理由（bento 图片卡：1 大 + 4 小）
 * ============================================================ */
.rs-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 250px;
  gap: 20px;
}
.rs-card {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
}
.rs-card-big { grid-column: span 2; grid-row: span 2; }
.rs-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .8s cubic-bezier(.22, .61, .36, 1);
}
.rs-card:hover img { transform: scale(1.06); }
.rs-mask {
  position: absolute;
  inset: 0;
  background: linear-gradient(185deg, rgba(0, 0, 0, .05) 35%, rgba(0, 0, 0, .72) 100%);
  transition: background .3s ease;
}
.rs-info {
  position: absolute;
  left: 26px;
  right: 22px;
  bottom: 24px;
  z-index: 2;
  color: #fff;
}
.rs-info h4 {
  margin-top: 0;
  font-size: 19px;
  font-weight: 700;
  letter-spacing: 1px;
  white-space: nowrap;
}
.rs-card-big .rs-info h4 { font-size: 24px; }
.rs-info p {
  margin-top: 8px;
  font-size: 13px;
  line-height: 1.8;
  color: rgba(255, 255, 255, .85);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rs-card-big .rs-info p { font-size: 14.5px; -webkit-line-clamp: 3; }

/* ============================================================
 * #lab 实验基地（深色：左 tab / 中大图 / 右文字 三栏）
 * ============================================================ */
.sec-lab {
  --lab-bg-blur: 8px;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #1f2421;
  color: #fff;
}
/* 独立背景层：高斯模糊只作用于生成的环境图，保留前景照片和文字清晰。 */
.sec-lab::before {
  content: "";
  position: absolute;
  inset: -28px;
  z-index: -2;
  background: url("../images/labs/solar-lab-background-v1.jpg") center / cover no-repeat;
  background-image: image-set(url("../images/labs/solar-lab-background-v1.webp") type("image/webp"), url("../images/labs/solar-lab-background-v1.jpg") type("image/jpeg"));
  filter: blur(var(--lab-bg-blur));
  pointer-events: none;
}
.sec-lab::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, rgba(15, 25, 20, .88), rgba(19, 29, 24, .76) 48%, rgba(15, 25, 20, .9));
  pointer-events: none;
}
.sec-lab .sec-title { color: #fff; }
.sec-lab .sec-desc { color: rgba(255, 255, 255, .6); }

.lab-wrap {
  display: grid;
  grid-template-columns: 240px 3fr 2fr;
  gap: 26px;
  align-items: stretch;
}

/* 左：tab 列表 */
.lab-tabs {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.lab-tab {
  position: relative;
  display: block;
  width: 100%;
  padding: 19px 50px 19px 20px;
  text-align: left;
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 12px;
  color: #fff;
  transition: all .3s ease;
}
.lab-tab b {
  display: block;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 1px;
}
.lab-tab span {
  display: block;
  margin-top: 5px;
  font-size: 12.5px;
  letter-spacing: .5px;
  color: rgba(255, 255, 255, .55);
  transition: color .3s ease;
}
.lab-tab .icon {
  position: absolute;
  right: 18px;
  top: 50%;
  width: 15px; font-size: 15px;
  height: 15px;
  transform: translateY(-50%);
  opacity: 0;
  color: var(--lime);
  transition: all .3s ease;
}
.lab-tab:hover { border-color: rgba(144, 196, 47, .4); }
.lab-tab.on {
  background: var(--green);
  border-color: var(--green);
  box-shadow: 0 14px 32px rgba(0, 0, 0, .35);
}
.lab-tab.on span { color: rgba(255, 255, 255, .8); }
.lab-tab.on .icon { opacity: 1; }

/* 中：大图 */
.lab-view {
  position: relative;
  /* 高度跟随行拉伸，与左侧 tab 列表上下对齐 */
  border-radius: 14px;
  overflow: hidden;
}
.lab-pane {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity .6s ease, visibility 0s linear .6s;
}
.lab-pane.on {
  opacity: 1;
  visibility: visible;
  transition: opacity .6s ease;
  z-index: 1;
}
.lab-pane picture,
.lab-pane img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* 右：标题 + 描述 + 参数表 */
.lab-text { display: none; }
.lab-text.on { display: block; animation: labTextIn .5s ease both; }
@keyframes labTextIn {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: none; }
}
.lab-info { padding: 0 26px; }
.lab-text h3 {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 1px;
  color: #fff;
}
.lab-text > p {
  margin-top: 12px;
  font-size: 13.5px;
  line-height: 2;
  color: rgba(255, 255, 255, .72);
}
.lab-params {
  margin-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, .12);
}
.lab-params li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 13px 0;
  border-bottom: 1px solid rgba(255, 255, 255, .12);
}
.lab-params span {
  flex-shrink: 0;
  font-size: 12.5px;
  letter-spacing: 1px;
  color: rgba(255, 255, 255, .5);
}
.lab-params b {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .5px;
  text-align: right;
  color: #fff;
}

/* ============================================================
 * #promise 服务承诺（左编号列表 + 右客服大图）
 * ============================================================ */
.pm-wrap {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 44px;
  align-items: stretch;
}

/* 左：纵向承诺列表（绿底白字语境） */
.pm-list {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.pm-row {
  position: relative;
  display: flex;
  align-items: center;
  gap: 22px;
  padding: 26px 10px;
  border-radius: 14px;
  transition: all .3s ease;
}
.pm-row + .pm-row { border-top: 1px solid rgba(255, 255, 255, .16); }
.pm-row:hover {
  padding-left: 22px;
  background: rgba(255, 255, 255, .07);
}
.pm-num {
  flex-shrink: 0;
  font-size: 34px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 1px;
  color: transparent;
  -webkit-text-stroke: 1.3px rgba(255, 255, 255, .55);
  font-variant-numeric: tabular-nums;
  transition: all .3s ease;
}
.pm-row:hover .pm-num {
  color: #fff;
  -webkit-text-stroke-color: #fff;
}
.pm-ico {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .14);
  border: 1px solid rgba(255, 255, 255, .22);
  color: #fff;
  transition: all .3s ease;
}
.pm-ico .icon { width: 27px; font-size: 27px; height: 27px; }
.pm-row:hover .pm-ico {
  background: #fff;
  border-color: #fff;
  color: var(--green);
}
.pm-text h3 {
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 1px;
  color: #fff;
}
.pm-text p {
  margin-top: 6px;
  font-size: 13.5px;
  line-height: 1.9;
  color: rgba(255, 255, 255, .75);
}

/* 右：客服大图卡（白边浮卡） */
.pm-photo {
  position: relative;
  min-height: 420px;
  background: #fff;
  border: 8px solid #fff;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 30px 60px rgba(0, 0, 0, .28);
}
.pm-photo picture,
.pm-photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.pm-photo img { transition: transform .8s cubic-bezier(.22, .61, .36, 1); }
.pm-photo:hover img { transform: scale(1.04); }
.pm-photo-tag {
  position: absolute;
  left: 24px;
  bottom: 24px;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 22px;
  background: rgba(255, 255, 255, .94);
  border-radius: 12px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .14);
}
.pm-photo-tag b {
  font-size: 22px;
  font-weight: 800;
  letter-spacing: 1px;
  color: var(--green);
}
.pm-photo-tag span {
  font-size: 13px;
  letter-spacing: 1px;
  color: var(--text);
}

/* ============================================================
 * #client 合作客户（点阵地图背景 + 静态网格）
 * ============================================================ */
.sec-client { position: relative; }
.sec-client::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("../images/world-dots.svg") no-repeat center 42% / min(900px, 92%) auto;
  opacity: .12;
  pointer-events: none;
}
.sec-client .container { position: relative; z-index: 1; }

.client-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 16px;
}
.client-chip {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 96px;
  padding: 10px 16px;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 6px 16px rgba(26, 58, 42, .1);
  transition: all .3s ease;
}
.client-chip:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 30px rgba(0, 122, 60, .14);
}
.client-chip picture {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
.client-chip img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  /* 卡片外框保持原尺寸，仅将框内 logo 缩小约 30%。 */
  transform: scale(.7);
  transition: transform .35s ease;
}
.client-chip:hover img {
  transform: scale(.742);
}

/* 资讯列表头部：标题 + 更多链接 */
.fn-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 24px;
}
.fn-head .sub-title { margin-bottom: 0; }
.fn-more {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  letter-spacing: 1px;
  color: var(--text-light);
  transition: color .25s ease;
}
.fn-more .icon { width: 13px; font-size: 13px; height: 13px; transition: transform .3s ease; }
.fn-more:hover { color: var(--green); }
.fn-more:hover .icon { transform: translateX(4px); }

/* ============================================================
 * #team 技术团队（标题行 + 数据条 + 四列竖图卡）
 * ============================================================ */
.sec-team { background: var(--bg-light); }

/* 数据条：三个数据 + 一句质量方针 */
.team-band {
  display: flex;
  align-items: center;
  margin-bottom: 44px;
}
.team-stat {
  flex-shrink: 0;
  padding-right: 44px;
  margin-right: 44px;
  border-right: 1px solid rgba(0, 0, 0, .1);
}
.team-stat b {
  display: block;
  font-size: 52px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 1px;
  color: var(--green);
  font-variant-numeric: tabular-nums;
}
.team-stat b i {
  font-style: normal;
  font-size: 22px;
  font-weight: 700;
  margin-left: 3px;
  color: var(--lime);
}
.team-stat span {
  display: block;
  margin-top: 10px;
  font-size: 13px;
  letter-spacing: 2px;
  color: var(--text-light);
}
.team-note {
  flex: 1;
  min-width: 0;
  padding-left: 30px;
  border-left: 3px solid var(--green);
  font-size: 14.5px;
  line-height: 2.1;
  color: var(--text-light);
}

/* 横向手风琴图卡：悬停 / 点按展开，高度收窄 */
.team-grid {
  display: flex;
  gap: 14px;
  height: 460px;
}
.team-card {
  position: relative;
  flex: 1;
  min-width: 0;
  border-radius: 16px;
  overflow: hidden;
  cursor: pointer;
  contain: layout;
  transition: flex .6s cubic-bezier(.22, .61, .36, 1);
}
.team-card.on { flex: 2.6; }
.team-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .8s cubic-bezier(.22, .61, .36, 1);
}
.team-card:hover img { transform: scale(1.05); }
.team-card-mask {
  position: absolute;
  inset: 0;
  background: linear-gradient(185deg, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, .55) 100%);
}
.team-card-tag {
  position: absolute;
  left: 18px;
  bottom: 16px;
  z-index: 2;
  padding: 7px 14px;
  background: rgba(255, 255, 255, .92);
  border-radius: 9px;
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 1px;
  white-space: nowrap;
  color: var(--text);
}

/* ============================================================
 * #apply 认证资讯 + 在线申请（左资讯纵向滚动 / 右表单卡）
 * ============================================================ */
.sec-apply { background: #fff; }
.na-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: start;
}
.na-news { min-width: 0; }

/* 纵向无缝滚动视口：两端渐隐 */
.news-vroll {
  position: relative;
  height: 480px;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 48px, #000 calc(100% - 48px), transparent 100%);
  mask-image: linear-gradient(180deg, transparent 0, #000 48px, #000 calc(100% - 48px), transparent 100%);
}
.news-vtrack { will-change: transform; }
.nv-item {
  display: block;
  padding: 18px 4px;
  border-bottom: 1px solid var(--line);
}
.nv-date {
  font-size: 12px;
  letter-spacing: 1px;
  color: var(--text-light);
}
.nv-item h4 {
  margin-top: 6px;
  font-size: 15.5px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: .5px;
  transition: color .25s ease;
}
.nv-item:hover h4 { color: var(--green); }
.nv-item p {
  margin-top: 6px;
  font-size: 13px;
  line-height: 1.8;
  color: var(--text-light);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* 右：在线申请表单卡 */
.na-apply {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 34px 38px;
  box-shadow: 0 24px 60px rgba(0, 90, 45, .1);
}
.na-apply-desc {
  margin-top: 10px;
  margin-bottom: 20px;
  font-size: 13.5px;
  line-height: 1.9;
  color: var(--text-light);
}
.af-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.af-field { margin-bottom: 14px; }
.af-field label {
  display: block;
  margin-bottom: 7px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 1px;
}
.af-field label i {
  font-style: normal;
  margin-left: 3px;
  color: #e15554;
}
.af-field input,
.af-field textarea {
  flex: 1;
  min-width: 0;
  width: 100%;
  padding: 11px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  font-size: 14px;
  color: var(--text);
  transition: border-color .25s ease, box-shadow .25s ease;
}
.af-field textarea { resize: vertical; min-height: 80px; }
.af-field input:focus,
.af-field textarea:focus {
  border-color: var(--green);
  box-shadow: 0 0 0 3px rgba(0, 155, 76, .12);
}
.af-field.err input { border-color: #e15554; }
/* 验证码：图片浮于输入框右侧上方，点击刷新 */
.af-captcha-in {
  position: relative;
  flex: 1;
  min-width: 0;
  display: flex;
}
.captcha-img {
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  display: block;
  width: 108px;
  height: 38px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  cursor: pointer;
}
.af-captcha-in input { padding-right: 120px; }
.af-error {
  min-height: 18px;
  margin-bottom: 6px;
  font-size: 13px;
  color: #e15554;
}
.af-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  height: 48px;
  background: var(--green);
  border-radius: 24px;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 2px;
  color: #fff;
  transition: all .25s ease;
}
.af-submit .icon { width: 16px; font-size: 16px; height: 16px; transition: transform .25s ease; }
.af-submit:hover {
  background: var(--green-dark);
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(0, 155, 76, .3);
}
.af-submit:hover .icon { transform: translateX(4px); }
.af-submit:active { transform: scale(.98); box-shadow: none; }

/* 成功态 */
.apply-success {
  padding: 70px 20px;
  text-align: center;
}
.as-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 76px;
  height: 76px;
  border-radius: 50%;
  background: rgba(0, 155, 76, .1);
  color: var(--green);
}
.as-ico .icon { width: 38px; font-size: 38px; height: 38px; }
.apply-success h3 {
  margin-top: 22px;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: 2px;
}
.apply-success p {
  margin-top: 10px;
  font-size: 14px;
  color: var(--text-light);
}

/* ============================================================
 * 解决方案进场：左 tab 依次滑入 + 右详情面板延迟淡入
 * ============================================================ */
.sol-wrap .sol-tab {
  opacity: 0;
  transform: translateX(-18px);
  transition: opacity .5s ease, transform .45s cubic-bezier(.22, .61, .36, 1),
              background .3s ease, border-color .3s ease, box-shadow .3s ease;
}
.sol-wrap .sol-body {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .6s ease .3s, transform .6s cubic-bezier(.22, .61, .36, 1) .3s;
}
.sol-wrap.in .sol-tab,
.sol-wrap.in .sol-body { opacity: 1; transform: none; }
.sol-wrap .sol-tab:nth-child(2) { transition-delay: .06s; }
.sol-wrap .sol-tab:nth-child(3) { transition-delay: .12s; }
.sol-wrap .sol-tab:nth-child(4) { transition-delay: .18s; }
.sol-wrap .sol-tab:nth-child(5) { transition-delay: .24s; }
.sol-wrap .sol-tab:nth-child(6) { transition-delay: .3s; }
.sol-wrap .sol-tab:hover { transition-delay: 0s; }

/* ============================================================
 * 网格子项错峰进场（父级 .reveal 触发，hover 时延迟归零）
 * ============================================================ */
.pm-list .pm-row,
.client-grid .client-chip,
.flow .flow-card {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .55s ease, transform .28s ease,
              box-shadow .3s ease, border-color .3s ease, background .3s ease,
              padding .3s ease;
}
.pm-wrap.in .pm-row,
.client-grid.in .client-chip,
.flow.in .flow-card { opacity: 1; transform: none; }
.pm-list .pm-row:nth-child(2),
.client-grid .client-chip:nth-child(2),
.flow .flow-card:nth-child(2) { transition-delay: .07s; }
.pm-list .pm-row:nth-child(3),
.client-grid .client-chip:nth-child(3),
.flow .flow-card:nth-child(3) { transition-delay: .14s; }
.pm-list .pm-row:nth-child(4),
.client-grid .client-chip:nth-child(4),
.flow .flow-card:nth-child(4) { transition-delay: .21s; }
.client-grid .client-chip:nth-child(5),
.flow .flow-card:nth-child(5) { transition-delay: .28s; }
.client-grid .client-chip:nth-child(6) { transition-delay: .35s; }
.client-grid .client-chip:nth-child(n+7) { transition-delay: .42s; }
.pm-list .pm-row:hover,
.client-grid .client-chip:hover,
.flow .flow-card:hover { transition-delay: 0s; }

/* ============================================================
 * 响应式
 * ============================================================ */
@media (max-width: 1100px) {
  .sol-wrap { grid-template-columns: 300px 1fr; }
  .client-grid { grid-template-columns: repeat(5, 1fr); }
  .rs-grid { grid-auto-rows: 220px; gap: 16px; }
  .lab-wrap { grid-template-columns: 200px 3fr 2fr; gap: 18px; }
  /* 导航条放不下时隐藏面包屑，锚点 tab 占满整行 */
  .anchor-nav .breadcrumb { display: none; }
}

@media (max-width: 992px) {
  /* 开放条隐藏，头部只剩主导航高度 */
  .page-banner { height: 520px; }
  .banner-body { padding-top: calc(var(--header-h) + 20px); }
  .anchor-nav { top: var(--header-h); }

  /* 解决方案：tab 横排可滑 + 详情面板下移 */
  .sol-wrap { grid-template-columns: 1fr; }
  .sol-tabs {
    flex-direction: row;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 4px;
  }
  .sol-tabs::-webkit-scrollbar { display: none; }
  .sol-tab { flex-shrink: 0; width: 260px; }
  .sol-body { padding: 32px 28px; }
  .sol-pane.on { grid-template-columns: 1fr; gap: 24px; }
  .sol-demo { height: 220px; }

  /* 实验基地：tab 横排 → 图 → 文 */
  .lab-wrap { grid-template-columns: 1fr; }
  .lab-tabs {
    flex-direction: row;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 4px;
  }
  .lab-tabs::-webkit-scrollbar { display: none; }
  .lab-tab { flex-shrink: 0; width: 240px; padding: 16px 44px 16px 18px; }
  .lab-view { aspect-ratio: 3 / 2; align-self: start; }

  /* 服务承诺：上下堆叠 */
  .pm-wrap { grid-template-columns: 1fr; gap: 36px; }
  .pm-photo { min-height: 320px; }

  /* 技术团队：数据条纵向堆叠 */
  .team-band { flex-direction: column; align-items: flex-start; gap: 22px; }
  .team-stat b { font-size: 40px; }
  .team-stat { padding-right: 0; margin-right: 0; border-right: none; }
  /* 资讯申请：上下堆叠 */
  .na-wrap { grid-template-columns: 1fr; gap: 44px; }
}

@media (max-width: 768px) {
  .sec { padding: 60px 0 64px; }
  .biz-head { flex-direction: column; align-items: flex-start; gap: 20px; margin-bottom: 36px; }
  .biz-head .head-btn,
  .biz-head .pd-side { align-self: flex-start; }
  .sec-title { font-size: 26px; }
  .page-banner { height: 480px; }
  .banner-title { font-size: 30px; }
  .banner-desc { max-width: none; }
  .banner-desc br { display: none; }
  .banner-cta { height: 42px; padding: 0 24px; }
  .banner-ui { bottom: 22px; }
  .banner-arrows button { width: 38px; height: 38px; }

  /* 锚点导航：横向滑动 */
  .anchor-tabs {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .anchor-tabs::-webkit-scrollbar { display: none; }
  .anchor-tabs a { height: 50px; padding: 0 16px; font-size: 14px; }
  .anchor-tabs a::after { left: 16px; right: 16px; }

  /* 产品卡：移动端一排一个，紧凑化 */
  .pd-track .pd-card { flex-basis: 100%; }
  .pd-media { height: 180px; }
  .pd-media-art .icon { width: 64px; height: 64px; font-size: 64px; }
  .pd-panel { padding: 20px 20px 18px; }
  .pd-panel h3 { font-size: 18px; }
  .pd-arrows button { width: 38px; height: 38px; }

  /* 解决方案：移动端 tab 更窄 */
  .sol-tab { width: 220px; padding: 14px 16px; }
  .sol-body { padding: 28px 22px; }
  .sol-pane h3 { font-size: 20px; }
  .sol-demo { height: 180px; }

  /* 流程卡：移动端固定宽度横向滑动 */
  .flow-card { flex-basis: 230px; }
  .flow-node { width: 52px; height: 52px; margin-top: -26px; font-size: 16px; }

  /* 理由卡：大卡通栏，小卡两列 */
  .rs-grid { grid-template-columns: 1fr 1fr; grid-auto-rows: 210px; }
  .rs-card-big { grid-column: span 2; grid-row: span 1; }
  .rs-info b { font-size: 24px; }
  .rs-card-big .rs-info b { font-size: 30px; }
  .rs-info h4 { font-size: 16px; }
  .rs-card-big .rs-info h4 { font-size: 20px; }


  .pm-row { gap: 14px; padding: 20px 4px; }
  .pm-row:hover { padding-left: 10px; }
  .pm-num { font-size: 26px; }
  .pm-ico { width: 48px; height: 48px; }
  .pm-ico .icon { width: 22px; font-size: 22px; height: 22px; }
  .pm-photo { min-height: 240px; }

  .client-grid { grid-template-columns: repeat(3, 1fr); gap: 12px; }
  .client-chip { height: 76px; padding: 8px 12px; }



  .af-row { grid-template-columns: 1fr; gap: 0; }
  /* 团队手风琴：纵向堆叠，展开的加高 */
  .team-grid { flex-direction: column; height: auto; }
  .team-card { flex: none; height: 180px; }
  .team-card.on { flex: none; height: 300px; }
  .na-apply { padding: 30px 24px; }
  .news-vroll { height: 400px; }
}

/* ============================================================
 * 荣誉资质（横版 + 竖版证书卡）
 * ============================================================ */
.sec-honor { background: #fff; }

.honor-row-h { margin-bottom: 18px; }

.honor-row { display: grid; gap: 18px; }
.honor-row-h {
  grid-template-columns: repeat(4, 1fr);
  margin-bottom: 18px;
}
.honor-row-v { grid-template-columns: repeat(4, 1fr); }

.honor-card {
  margin: 0;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 14px 14px 13px;
  text-align: center;
  transition: transform .35s cubic-bezier(.22, .61, .36, 1), box-shadow .35s ease, border-color .35s ease;
}
.honor-card:hover {
  transform: translateY(-6px);
  border-color: rgba(0, 155, 76, .35);
  box-shadow: 0 20px 44px rgba(0, 90, 45, .12);
}

.honor-media {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  overflow: hidden;
}
.honor-h .honor-media { height: 168px; }
.honor-v .honor-media { height: 252px; }
.honor-media img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  transition: transform .9s cubic-bezier(.22, .61, .36, 1);
}
.honor-card:hover .honor-media img { transform: scale(1.05); }

.honor-card figcaption {
  margin-top: 11px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .5px;
  color: var(--text);
}

@media (max-width: 1100px) {
  .honor-row-h,
  .honor-row-v { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .honor-row { gap: 12px; }
  .honor-row-h { margin-bottom: 12px; }
  .honor-h .honor-media { height: 120px; }
  .honor-v .honor-media { height: 180px; }
  .honor-card { padding: 10px 10px 9px; }
  .honor-card figcaption { font-size: 12px; }
}

/* ============================================================
 * 荣誉资质：展厅式双轨无缝滚动（横版上排 / 竖版下排，反向滚动）
 * ============================================================ */
.hall-marquee {
  position: relative;
  overflow: hidden;
  /* 两端渐隐，展厅轨道感 */
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 64px, #000 calc(100% - 64px), transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 64px, #000 calc(100% - 64px), transparent 100%);
}
.hall-marquee + .hall-marquee { margin-top: 20px; }

.hall-track {
  display: flex;
  gap: 18px;
  width: max-content;
  will-change: transform;
  /* 上下留白：卡片悬停上浮 + 阴影不被 overflow 裁切 */
  padding: 22px 0;
}

.hall-card {
  flex-shrink: 0;
  margin: 0;
  background: #fff;
  border: none;
  border-radius: 12px;
  padding: 12px 12px 10px;
  text-align: center;
  box-shadow: 0 8px 22px rgba(0, 60, 30, .08);
  transition: transform .35s cubic-bezier(.22, .61, .36, 1), box-shadow .35s ease;
}
.hall-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 44px rgba(0, 90, 45, .16);
}

.hall-media {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 8px;
}
/* picture 包裹层撑满媒体框，max-height 才能生效，证书边框完整不裁剪 */
.hall-media picture {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
.hall-card.h .hall-media { width: 264px; height: 176px; }
.hall-card.h .hall-media img { max-width: 100%; max-height: 100%; object-fit: contain; }
.hall-card.v .hall-media { width: 180px; height: 240px; }
.hall-card.v .hall-media img { max-width: 100%; max-height: 100%; object-fit: contain; }

.hall-card figcaption {
  margin-top: 9px;
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .5px;
  color: var(--text);
  white-space: nowrap;
}

@media (max-width: 768px) {
  .hall-track { gap: 12px; }
  .hall-card.h .hall-media { width: 210px; height: 140px; }
  .hall-card.v .hall-media { width: 146px; height: 196px; }
  .hall-card figcaption { font-size: 11.5px; }
}

/* 产品认证主视觉加高，关于广测小幅加高。 */
.page-banner.banner-product { height: 720px; }
.page-banner.banner-about { height: 660px; }
@media (max-width: 992px) {
  .page-banner.banner-product { height: 620px; }
  .page-banner.banner-about { height: 560px; }
}
@media (max-width: 768px) {
  .page-banner.banner-product { height: 540px; }
  .page-banner.banner-about { height: 500px; }
}

/* Fixed flow height; only the painted bar contracts while becoming sticky. */
.anchor-nav {
  height: 60px;
  border: 0;
  background: transparent;
  box-shadow: none;
  isolation: isolate;
  transition: none;
  pointer-events: none;
}
.anchor-nav::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: #fff;
  box-shadow: 0 1px 0 var(--line), 0 8px 24px rgba(0, 0, 0, .05);
  transform-origin: top;
  transition: transform .25s ease, background-color .25s ease;
}
.anchor-nav-in {
  height: 60px;
  min-height: 60px;
  pointer-events: auto;
  transition: transform .25s ease;
}
.anchor-tabs { align-items: center; }
.anchor-nav .anchor-tabs a,
.anchor-nav.scrolled .anchor-tabs a,
.anchor-nav.scrolled .anchor-tabs a.on {
  height: 46px;
  padding: 0 16px;
  font-size: 14px;
  border-radius: 9999px;
  transition: color .25s ease, background-color .25s ease;
}
.anchor-nav.scrolled { background: transparent; box-shadow: none; }
.anchor-nav.scrolled::before {
  background: rgba(0, 0, 0, .72);
  box-shadow: none;
  transform: scaleY(.766666667);
}
.anchor-nav.scrolled .anchor-nav-in { transform: translateY(-7px); }
.anchor-nav.scrolled .anchor-tabs a,
.anchor-nav.scrolled .anchor-tabs a.on { height: 32px; }
@media (prefers-reduced-motion: reduce) {
  .anchor-nav::before, .anchor-nav-in { transition: none; }
}

/* Avoid compositing whole long sections and staggered child entrances on scroll. */
.reveal, .reveal.in,
.sol-wrap .sol-tab, .sol-wrap .sol-body,
.pm-list .pm-row, .client-grid .client-chip, .flow .flow-card {
  opacity: 1;
  transform: none;
  transition-delay: 0s;
}
.reveal, .reveal.in, .sol-wrap .sol-body { transition: none; }
.sec-lab::before { filter: none; }
.sol-demo:not(.motion-visible) *,
.sol-demo:not(.motion-visible)::before,
.sol-demo:not(.motion-visible)::after { animation-play-state: paused !important; }

/* Shrink sticky labels visually without changing tab widths or page layout. */
.anchor-nav .anchor-tabs a {
  transform-origin: center;
  transition: color .25s ease, background-color .25s ease, transform .25s ease;
}
.anchor-nav.scrolled .anchor-tabs a,
.anchor-nav.scrolled .anchor-tabs a.on {
  transform: scale(.93);
  transition: color .25s ease, background-color .25s ease, transform .25s ease;
}
.anchor-nav .breadcrumb {
  transform-origin: right center;
  transition: transform .25s ease;
}
.anchor-nav.scrolled .breadcrumb { transform: scale(.93); }
@media (prefers-reduced-motion: reduce) {
  .anchor-nav .anchor-tabs a,
  .anchor-nav.scrolled .anchor-tabs a,
  .anchor-nav.scrolled .anchor-tabs a.on,
  .anchor-nav .breadcrumb { transition: none; }
}

/* 实验室拼图：文案落在左侧绿色留白，保留右侧设备照片原色。 */
.banner-slide-lab .banner-mask { background: none; }
.banner-slide-lab .banner-title { font-size: clamp(30px, 2.5vw, 48px); }
.banner-slide-lab .banner-desc { font-size: 14px; letter-spacing: 0; }
.banner-slide-lab .banner-cta { border: none; }
@media (max-width: 1100px) {
  .banner-slide-lab .banner-bg img { object-position: 30% center; }
  .banner-slide-lab .banner-mask {
    background: linear-gradient(90deg, rgba(0, 60, 32, .55), rgba(0, 60, 32, .12) 70%, transparent);
  }
}
@media (max-width: 768px) {
  .banner-slide-lab .banner-bg img { object-position: 15% center; }
  .banner-slide-lab .banner-desc { max-width: 340px; }
}