/* =========================================================
   COVILLA TECHNOLOGIES - 芮徕（上海）实验仪器有限公司
   共享样式：Flexbox 布局 / 居中内容 / 响应式适配
   ========================================================= */

:root {
  --red: #c8102e;               /* 品牌红，参考 PSD 按钮/标签 */
  --red-dark: #a50d25;
  --dark: #1a1a1a;              /* footer 深色 */
  --text: #333;                 /* 正文 */
  --muted: #8a8a8a;             /* 次要文字 */
  --line: #e6e6e6;              /* 分割线 */
  --bg: #f6f6f6;                /* 浅灰背景 */
  --card: #fafafa;
  --white: #fff;
  --maxw: 100%;                 /* 不限制最大宽度，跟 wzhf.com 一致 */
  --pad: 1.5rem;                /* 左右内边距（rem 自适应） */
  --radius: 0.25rem;
  --font: "Microsoft YaHei", "PingFang SC", "Heiti SC", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

/* 参照 wzhf.com：根字号恒定 16px，rem 仅作统一单位，不随屏缩放。
   自适应完全靠 width:% / flex / grid 实现，大屏内容真正铺满。 */
html { -webkit-text-size-adjust: 100%; font-size: 16px; }

body {
  font-family: var(--font);
  color: var(--text);
  background: var(--bg);
  line-height: 1.6;
  font-size: 0.938rem;
}

/* ============ 主内容白色卡片 ============ */
main.main-card {
  max-width: none;
  width: calc(100% - 3rem);
  margin: 0.625rem auto 1.875rem;
  background: #fff;
  border: 1px solid #e8e8e8;
  border-radius: 0.25rem;
  box-shadow: 0 0 1.5rem rgba(0,0,0,.08);
  padding: 0 1.75rem;
}

a { text-decoration: none; color: inherit; }
ul { list-style: none; }
img { display: block; max-width: 100%; }

/* ============ 全局图片悬停缩放（参考 wzhf.com） ============
   内容区域图片在悬停时轻微放大，容器裁切溢出。
   不作用于 logo（.brand img）与二维码（.qr img）。 */
.prod-card .pic,
.news-card .pic,
.about-img,
.cat-row .pic,
.pic,
.banner-figure {
  overflow: hidden;
}
.prod-card .pic img,
.news-card .pic img,
.about-img img,
.cat-row .pic img,
.pic img,
.banner-figure img {
  transition: transform .5s ease;
}
.prod-card:hover .pic img,
.news-card:hover .pic img,
.about-img:hover img,
.cat-row:hover .pic img,
.pic:hover img,
.banner-figure:hover img {
  transform: scale(1.08);
}

/* 内部图片本身已有圆角，容器也加上圆角，保证放大溢出时被圆角裁切 */
.about-img,
.cat-row .pic { border-radius: var(--radius); }

/* 主导航下拉配图：容器裁切，悬停放大 */
.mega-col.is-pic a { overflow: hidden; border-radius: 0.188rem; }
.mega-col.is-pic img { transition: transform .5s ease; }
.mega-col.is-pic:hover img { transform: scale(1.08); }

/* 内容容器：居中，随窗口缩小不溢出 */
.container {
  width: 100%;
  max-width: var(--maxw);
  margin: 0 auto;
  padding-left: var(--pad);
  padding-right: var(--pad);
}

/* 通用按钮 */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  border: none;
  cursor: pointer;
  font-family: inherit;
  font-size: 0.813rem;
  padding: 0.563rem 1.375rem;
  border-radius: 0.125rem;
  color: #fff;
  background: var(--red);
  transition: background .2s ease, transform .2s ease;
  white-space: nowrap;
}
.btn:hover { background: var(--red-dark); }
.btn .arrow { font-size: 0.75rem; }

.btn-outline {
  background: transparent;
  color: var(--text);
  border: 1px solid var(--line);
}
.btn-outline:hover {
  color: var(--red);
  border-color: var(--red);
  background: transparent;
}

.btn-dark {
  background: #222;
  color: #fff;
  border: 1px solid #222;
}
.btn-dark:hover {
  background: #444;
  border-color: #444;
}

/* ============ Header ============ */
/* 首页/横幅页：默认悬浮在 Banner 上方，透明背景；滚动后切换为白底 */
.header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  background: transparent;
  transition: background .25s ease, box-shadow .25s ease;
}
.header.scrolled {
  background: #fff;
  box-shadow: 0 0.25rem 0.75rem rgba(0,0,0,.06);
}
/* 透明悬浮状态：导航文字、下拉箭头、汉堡图标均为白色；滚动后恢复深色 */
.header:not(.scrolled) .nav-item > a { color: #fff; }
.header:not(.scrolled) .nav-item > a:hover { color: var(--red); }
.header:not(.scrolled) .nav-item > a.active { color: #fff; font-weight: 600; }
.header:not(.scrolled) .nav-toggle span { background: #fff; }
/* 指定页面强制白底导航（如产品列表页），不使用透明悬浮 */
body.header-solid .header { background: #fff; box-shadow: 0 0.25rem 0.75rem rgba(0,0,0,.06); }
body.header-solid .header .nav-item > a,
body.header-solid .header .nav-item > a.active { color: var(--text); }
body.header-solid .header .nav-item > a:hover { color: var(--red); }
body.header-solid .header .nav-toggle span { background: var(--text); }
/* 锚点跳转时避开固定导航（76px）+ 间距 */
section[id], .cat-row[id], .detail-box[id], h2[id], h3[id] { scroll-margin-top: 5.75rem; }
.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 4.75rem;
  max-width: none;
}
.brand { display: flex; align-items: center; }
.brand img { height: 2.5rem; width: auto; }

/* ---- 主导航：二级菜单交互复刻自 opton.com.cn（悬停整行 + 全宽面板下滑）---- */
.nav { display: flex; align-items: center; height: 100%; margin-left: auto; }
.nav-list { display: flex; align-items: center; height: 100%; }
/* li 撑满 header 高度，保证从文字下移到面板之间不会断开 hover */
.nav-item { height: 100%; display: flex; align-items: center; position: static; }
.nav-item > a {
  display: flex;
  align-items: center;
  gap: 0.313rem;
  height: 100%;
  padding: 0 1.063rem;
  font-size: 0.938rem;
  color: var(--text);
  transition: color .2s ease;
  white-space: nowrap;
}
.nav-item > a:hover { color: var(--red); }
.nav-item > a.active { color: var(--red); font-weight: 600; }

/* 下拉箭头 */
.caret {
  width: 0; height: 0;
  border-left: 0.25rem solid transparent;
  border-right: 0.25rem solid transparent;
  border-top: 0.313rem solid currentColor;
  transition: transform .25s ease;
}
.nav-item.has-sub:hover .caret { transform: rotate(180deg); }

/* 跟随鼠标滑动的下划线（对应 opton 的 #menu-line） */
.menu-line {
  position: absolute;
  left: 0; bottom: 0;
  width: 0; height: 0.125rem;
  background: var(--red);
  opacity: 0;
  pointer-events: none;
  z-index: 101;
  transition: left .25s ease-out, width .25s ease-out,
              bottom .25s ease-out, opacity .2s ease;
}

.menu-line.show { opacity: 1; }

/* 移动端汉堡 */
.nav-toggle {
  display: none;
  width: 2.75rem; height: 2.75rem;
  border: none; background: transparent;
  cursor: pointer;
  position: relative;
}
.nav-toggle span {
  position: absolute;
  left: 0.625rem; right: 0.625rem;
  height: 0.125rem;
  background: var(--text);
  transition: .25s ease;
}
.nav-toggle span:nth-child(1) { top: 0.938rem; }
.nav-toggle span:nth-child(2) { top: 1.313rem; }
.nav-toggle span:nth-child(3) { top: 1.688rem; }

/* ---- 全宽二级面板（mega panel）---- */
/* 高度由 JS 量出内容高度写入 --mega-h，配合 height 过渡实现"下滑展开" */
.mega-panel {
  position: absolute;
  left: 0;
  top: 100%;
  width: 100%;
  height: 0;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 0.875rem 1.625rem rgba(0, 0, 0, .10);
  transition: height .45s cubic-bezier(.22, .61, .36, 1);
  z-index: 600;
}
.nav-item.has-sub:hover > .mega-panel { height: var(--mega-h, 0); }
.nav-item.has-sub:hover > a { color: var(--red); }

/* 面板内容容器 */
.mega-inner {
  display: block;
  padding: 1.875rem 0 0.25rem;
}

/* === Tab 行：分类横向链接（opton.com.cn 风格）=== */
.mega-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  padding-bottom: 1.125rem;
  margin-bottom: 1.375rem;
  border-bottom: 1px solid var(--line);
}
.mega-tabs .mega-tab {
  display: inline-block;
  padding: 0.5rem 1.125rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--text);
  transition: color .2s ease;
}
.mega-tabs .mega-tab:hover,
.mega-tabs .mega-tab.active { color: var(--red); }
.mega-tabs .mega-divider {
  display: inline-block;
  width: 1px;
  height: 0.875rem;
  background: var(--line);
  margin: 0 0.25rem;
}
.mega-tabs .mega-tab-all {
  margin-left: auto;
  font-size: 0.813rem;
  color: var(--muted);
}
.mega-tabs .mega-tab-all:hover { color: var(--red); }

/* === 产品网格：4 列 × N 行 === */
.mega-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: 1.75rem;
  row-gap: 1.375rem;
}
.mega-item { display: block; min-width: 0; }
.mega-item .pic {
  display: block;
  overflow: hidden;
  border-radius: 0.188rem;
  aspect-ratio: 4 / 3;
  background: #f5f5f5;
}
.mega-item .pic img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
}
.mega-item:hover .pic img { transform: scale(1.08); }
.mega-item .meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.625rem;
  padding-top: 0.625rem;
}
.mega-item .name {
  flex: 1;
  min-width: 0;
  font-size: 0.875rem;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color .2s ease;
}
.mega-item:hover .name { color: var(--red); }
.mega-item .more {
  flex-shrink: 0;
  font-size: 0.813rem;
  color: var(--red);
  white-space: nowrap;
}

/* === 4 列分类图文（产品中心 mega menu：opton.com.cn 风格：标题+下划线上排，分类图下排）=== */
.mega-cats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: 1.75rem;
  row-gap: 1.625rem;
}
.mega-cat { min-width: 0; }
.mega-cat .cat-title {
  display: block;
  font-size: 0.938rem;
  font-weight: 700;
  color: var(--red);
  padding-bottom: 0.5rem;
  margin-bottom: 0.75rem;
  border-bottom: 1px solid var(--red);
  transition: opacity .2s ease;
}
.mega-cat .cat-title:hover { opacity: .75; }
.mega-cat .cat-pic {
  display: block;
  overflow: hidden;
  border-radius: 0.25rem;
  aspect-ratio: 21 / 9;
  background: #f5f5f5;
}
.mega-cat .cat-pic img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
}
.mega-cat .cat-pic:hover img { transform: scale(1.06); }

/* === 4 列卡片（解决方案/技术服务/公司信息）：大图 + 标题叠加 === */
.mega-cards4 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: 1.25rem;
  row-gap: 1.5rem;
}
.mega-card { min-width: 0; position: relative; }
.mega-card .pic {
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: 0.25rem;
  aspect-ratio: 4 / 3;
  background: #f5f5f5;
}
.mega-card .pic::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 55%;
  background: linear-gradient(to top, rgba(0,0,0,.78), rgba(0,0,0,0));
  pointer-events: none;
  transition: background .3s ease;
}
.mega-card:hover .pic::after {
  background: linear-gradient(to top, rgba(0,0,0,.88), rgba(0,0,0,.15));
}
.mega-card .pic img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
}
.mega-card:hover .pic img { transform: scale(1.06); }
.mega-card .title {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  z-index: 2;
  padding: 0.875rem 1rem;
  margin: 0;
}
.mega-card .title a {
  display: block;
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: .0.313rem;
  text-shadow: 0 1px 0.125rem rgba(0,0,0,.3);
  transition: opacity .2s ease;
}
.mega-card:hover .title a { opacity: .92; }

/* 面板底部快捷入口 */
.mega-foot {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  border-top: 1px solid var(--line);
  padding: 0.688rem 0;
  margin-top: 1.375rem;
}
.mega-foot a { font-size: 0.813rem; color: var(--muted); }
.mega-foot a:hover { color: var(--red); }

/* 移动端用的简易二级列表：桌面端隐藏 */
.nav-sub { display: none; }

/* ============ Hero（首页）============ */
.hero {
  position: relative;
  width: 100%;
  height: 41.25rem;
  max-height: calc(100vh - 2.5rem);
  background: #222;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.hero-slide {
  position: absolute; inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
  transition: opacity 1s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.hero-slide.active { opacity: 1; }
.hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.28), rgba(0,0,0,.08) 40%, rgba(0,0,0,.35));
  pointer-events: none;
}
.hero-title {
  position: relative;
  z-index: 2;
  color: #fff;
  padding: 0 1.25rem;
  font-size: 2.75rem;
  font-weight: 600;
  letter-spacing: 0.25rem;
  text-shadow: 0 0.125rem 0.75rem rgba(0,0,0,.35);
  transform: translateY(1.25rem);
  transition: transform .8s ease;
}
.hero-slide.active .hero-title { transform: translateY(0); }
.hero-dots {
  position: absolute;
  bottom: 2.5rem;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  justify-content: center;
  gap: 0.625rem;
  z-index: 2;
}
.hero-dots span {
  width: 0.563rem; height: 0.563rem;
  border-radius: 50%;
  background: rgba(255,255,255,.5);
  cursor: pointer;
}
.hero-dots span.active { background: #fff; }

/* 内页小横幅 */
.page-hero {
  background: linear-gradient(135deg, #d6e0e7, #b9c9d6);
  padding: 5.75rem 0 2.875rem;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.page-hero::before {
  content: "";
  position: absolute; top: -3.75rem; right: -2.5rem;
  width: 26.25rem; height: 26.25rem;
  border-radius: 50%;
  background: rgba(255,255,255,.16);
}
.page-hero-tag { font-size: 0.875rem; opacity: .9; margin-bottom: 0.625rem; }
.page-hero-title { font-size: 2.375rem; font-weight: 600; letter-spacing: 0.125rem; }

/* 面包屑标签栏（产品/公司信息） */
.crumbs {
  background: #fff;
  border-bottom: 1px solid var(--line);
  box-shadow: 0 0.188rem 0.5rem rgba(0,0,0,.04);
}
.crumbs-inner {
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
}
.crumb {
  display: inline-flex;
  align-items: center;
  padding: 1rem 1.625rem;
  font-size: 0.938rem;
  color: var(--text);
  background: #fff;
  gap: 0.375rem;
}
.crumb.active {
  background: var(--red);
  color: #fff;
}
.crumb .sep { color: #bbb; font-size: 0.813rem; }

/* ============ 通用 section ============ */
.section { padding: 2.5rem 0; }

.section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 1.875rem;
  gap: 1.25rem;
  flex-wrap: wrap;
}
.section-head h2 {
  font-size: 1.625rem;
  font-weight: 600;
  color: #2a2a2a;
}
.section-head .sub {
  color: var(--muted);
  font-size: 0.875rem;
  margin-top: 0.375rem;
}
.section-head .more { margin-bottom: 0.25rem; }

/* ============ 按钮变体 ============ */
.btn-red {
  background: var(--red);
  color: #fff;
  border: none;
}
.btn-red:hover { background: var(--red-dark); }

.btn-outline-gray {
  background: transparent;
  color: #666;
  border: 1px solid #c8c8c8;
}
.btn-outline-gray:hover {
  color: var(--red);
  border-color: var(--red);
}

/* ============ 关于我们 ============ */
.about-wrap { max-width: 100%; }
.about-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0;
}
.about-top h2 {
  font-size: 1.75rem;
  font-weight: 600;
  color: #2a2a2a;
}
.about-body {
  display: flex;
  gap: 0;
  margin-top: 1.875rem;
  background: #f2f2f2;
  border-radius: 0.25rem;
  overflow: hidden;
}
.about-left { flex: 1 1 50%; width: 50%; min-height: 22.5rem; }
.about-text { padding: 2.25rem 2.25rem 2rem; display: flex; flex-direction: column; height: 100%; max-width: 85%; }
.about-text p {
  color: #555;
  font-size: 0.938rem;
  line-height: 1.9;
  margin-bottom: 1.25rem;
}
.about-text p b { color: var(--red); font-weight: 600; }
.about-tags { display: flex; flex-wrap: wrap; gap: 1.5rem; margin: 1.25rem 0 2rem; }
.about-tags .tag {
  display: inline-flex;
  align-items: center;
  font-size: 0.875rem;
  color: #333;
  transition: .2s ease;
}
.about-tags .tag::before {
  content: "";
  width: 0;
  height: 0;
  border-top: 0.25rem solid transparent;
  border-bottom: 0.25rem solid transparent;
  border-left: 0.375rem solid #333;
  margin-right: 0.5rem;
  transition: .2s ease;
}
.about-tags .tag.arrow-red::before {
  border-left-color: var(--red);
}
.about-tags .tag:hover { color: var(--red); }
.about-tags .tag:hover::before { border-left-color: var(--red); }
.about-logo { margin-top: auto; padding-bottom: 1.875rem; }
.about-logo img { height: 2.5rem; display: block; }
.about-logo-sub {
  font-size: 0.688rem;
  letter-spacing: 0.188rem;
  color: #888;
  margin-top: 0.25rem;
}
.about-img { flex: 1 1 50%; width: 50%; min-height: 22.5rem; }
.about-img img {
  width: 100%;
  object-fit: cover;
  height: 100%;
}

/* ============ 产品中心 走马灯 ============ */
.prod-wrap { max-width: 100%; }
.prod-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 1.875rem;
  gap: 1.25rem;
  flex-wrap: wrap;
}
.prod-top h2 {
  font-size: 1.75rem;
  font-weight: 600;
  color: #2a2a2a;
}
.prod-sub {
  font-size: 0.813rem;
  color: var(--muted);
  margin-top: 0.375rem;
}

.marquee-wrap {
  overflow: hidden;
  position: relative;
}
.marquee-track {
  display: flex;
  gap: 0.375rem;
  animation: marquee 30s linear infinite;
  width: max-content;
}
.marquee-wrap:hover .marquee-track {
  animation-play-state: paused;
}
@keyframes marquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ============ 产品卡片 ============ */
.prod-card {
  flex: 0 0 12.5rem;
  background: transparent;
  border: none;
  border-radius: 0;
  overflow: hidden;
  transition: transform .25s ease;
}
.prod-card:hover { transform: translateY(-0.25rem); }
.prod-card .pic {
  height: 14.375rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  padding: 0;
  border-radius: 0;
  overflow: hidden;
}
.prod-card .pic img { width: 100%; height: 100%; object-fit: contain; }
.prod-card .cap { display: none; }

/* ============ 新闻 ============ */
.news-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.625rem;
}
.news-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease;
}
.news-card:hover { transform: translateY(-0.375rem); box-shadow: 0 0.75rem 1.5rem rgba(0,0,0,.08); }
.news-card .pic { height: 11.25rem; overflow: hidden; }
.news-card .pic img { width: 100%; height: 100%; object-fit: cover; }
.news-card .body { padding: 0.875rem 1rem 1.125rem; }
.news-card .date { font-size: 0.75rem; color: var(--muted); }
.news-card .title { font-size: 0.875rem; margin: 0.5rem 0 0.625rem; color: #2a2a2a; min-height: 2.5rem; }
.news-card .link { font-size: 0.813rem; color: var(--red); }

/* ============ 解决方案 ============ */
.solution-wrap { max-width: 100%; }
.solution-wrap > h2 {
  font-size: 1.75rem;
  font-weight: 600;
  color: #2a2a2a;
  margin-bottom: 1.125rem;
}
.solution-hero {
  position: relative;
  border-radius: var(--radius);
  overflow: hidden;
}
.solution-hero img {
  width: 100%;
  height: 21.25rem;
  object-fit: cover;
  display: block;
}
.solution-content {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #fff;
  padding: 1.25rem;
}
.solution-content h3 {
  font-size: 1.625rem;
  font-weight: 600;
  margin-bottom: 0.75rem;
  text-shadow: 0 1px 0.375rem rgba(0,0,0,.4);
}
.solution-content p {
  max-width: 37.5rem;
  font-size: 0.875rem;
  line-height: 1.8;
  margin-bottom: 1.25rem;
  text-shadow: 0 1px 0.25rem rgba(0,0,0,.3);
}

/* ============ 首页搜索条（Banner 下方）============ */
.search-section {
  padding: 1.25rem 0;
  width: calc(100% - 3rem);
  max-width: none;
  margin: 0 auto;
  border: none;
  border-radius: 0.25rem;
  background: transparent;
}
.search-bar {
  display: flex;
  align-items: center;
  width: 100%;
  border: 1px solid #e8e8e8;
  border-radius: 0.188rem;
  overflow: hidden;
  background: #fff;
}
.search-bar .search-input {
  flex: 1;
  border: none;
  outline: none;
  padding: 0.875rem 1.125rem;
  font-size: 0.938rem;
  font-family: inherit;
  color: var(--text);
  min-width: 0;
}
.search-bar .search-input::placeholder { color: #aaa; }
.search-bar .search-btn {
  border: none;
  background: var(--red);
  color: #fff;
  padding: 0 2.125rem;
  height: 3.125rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.438rem;
  font-family: inherit;
  font-size: 0.938rem;
  transition: background .2s ease;
  white-space: nowrap;
}
.search-bar .search-btn:hover { background: var(--red-dark); }
.search-bar .search-btn svg { flex-shrink: 0; }

/* 产品页面搜索栏 - 居左布局，水平槽宽交给统一栅格（与分类条/白卡同槽），搜索框约占槽 40% */
body.page-products .search-section { padding: 1.25rem 0; margin: 3.125rem auto 0; }
body.page-products .search-inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
body.page-products .search-title {
  font-size: 1.25rem;
  color: #333;
  margin-bottom: 0.875rem;
  font-weight: normal;
}
body.page-products .search-bar { width: 40%; min-width: 20rem; max-width: 47rem; }

@media (max-width: 640px) {
  .search-section { padding: 1.375rem 0; }
  .search-bar { max-width: 100%; }
  .search-bar .search-input { padding: 0.75rem 0.875rem; font-size: 0.875rem; }
  .search-bar .search-btn { padding: 0 1.25rem; font-size: 0.875rem; }
}

/* ============ 产品分类（产品中心页）============ */
.cat-list { display: flex; flex-direction: column; gap: 1.875rem; }
.cat-row {
  display: flex;
  align-items: center;
  gap: 3.125rem;
  background: var(--bg);
  border-radius: var(--radius);
  padding: 2.5rem;
}
.cat-row.rev { flex-direction: row-reverse; }
.cat-row .txt { flex: 1 1 46%; }
.cat-row .txt h3 { font-size: 1.375rem; font-weight: 600; margin-bottom: 1rem; color: #2a2a2a; }
.cat-row .txt p { font-size: 0.875rem; color: #666; line-height: 1.9; margin-bottom: 1.625rem; }
.cat-row .pic { flex: 1 1 54%; }
.cat-row .pic img { width: 100%; border-radius: var(--radius); }
.cat-row h3 em { color: var(--red); font-style: normal; }

/* ============ Footer ============ */
.footer { background: var(--dark); color: #cfcfcf; }
/* footer 内容收窄居中，独立于全站 100% 容器（固定 px，不随首页 em 缩放） */
.footer .container {
  max-width: 1440px;
  margin: 0 auto;
}
/* 1920 等大屏：内容槽放宽到 1600，两侧留约 160px，避免过窄 */
@media (min-width: 1680px) {
  .footer .container { max-width: 1600px; }
}
.footer-main {
  display: flex;
  justify-content: space-between;
  gap: 2.5rem;
  padding: 3.75rem 0 2.5rem;
  position: relative;
  overflow: hidden;
}
.footer-cols {
  display: flex;
  flex-wrap: wrap;
  gap: 2.5rem;
  flex: 1 1 auto;
}
.fcol { min-width: 7.5rem; }
.fcol h4 {
  color: #fff;
  font-size: 0.938rem;
  font-weight: 600;
  padding-bottom: 0.625rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid rgba(255,255,255,.2);
}
.fcol ul li { margin-bottom: 0.625rem; font-size: 0.813rem; color: #a9a9a9; }
.fcol ul li a {
  display: inline-block;
  transition: transform .5s ease, color .5s ease;
}
.fcol ul li a:hover {
  color: #fff;
  transform: translateX(8px);
}

.footer-brand {
  flex: 0 0 auto;
  text-align: right;
  max-width: 18.75rem;
}
.footer-bg-logo {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 25.5rem;
  z-index: 1;
  pointer-events: none;
  filter: grayscale(100%);
  opacity: .4;
}
.qr-card {
  position: relative;
  z-index: 2;
  display: inline-block;
  padding: 0.75rem 0.75rem 0.625rem;
  border-radius: 0.25rem;
  backdrop-filter: blur(0.25rem);
  margin-left: auto;
}
.qr {
  width: 6.25rem; height: 6.25rem;
  background: #fff;
  padding: 0.375rem;
}
.qr img { width: 100%; height: 100%; object-fit: contain; }
.qr-cap { font-size: 0.75rem; color: #fff; margin-top: 0.375rem; text-align: center; }

.footer-bottom {
  background: #303030;
  border-top: none;
  padding: 0.875rem 0;
}
.footer-bottom-inner {
  width: calc(100% - 3rem);
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  gap: 1.25rem;
  flex-wrap: wrap;
  font-size: 0.75rem;
  color: #fff;
}

/* ============ 概述 / 产品列表页 ============ */
.detail-box {
  background: var(--bg);
  padding: 2.75rem;
  border-radius: var(--radius);
}
.detail-title { font-size: 1.625rem; font-weight: 600; color: #2a2a2a; margin-bottom: 1.375rem; }
.detail-desc {
  background: #ededed;
  padding: 1.5rem 1.75rem;
  border-radius: var(--radius);
  font-size: 0.875rem;
  color: #555;
  line-height: 1.9;
}
.pl-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.625rem;
}

/* 返回顶部 */
.gotop {
  position: fixed;
  right: 1.5rem; bottom: 1.5rem;
  width: 2.875rem; height: 2.875rem;
  border-radius: 50%;
  background: var(--red);
  color: #fff;
  display: none;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 1.25rem;
  box-shadow: 0 0.375rem 1rem rgba(0,0,0,.2);
  z-index: 90;
}
.gotop.show { display: flex; }

/* ============ 响应式 ============ */
@media (max-width: 1120px) {
  .pl-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 992px) {
  .news-grid { grid-template-columns: repeat(2, 1fr); }
  .about-body { flex-direction: column; gap: 1.5rem; }
  .about-img img { height: 12.5rem; }
  .pclist-item { flex-direction: column; }
  .pclist-left, .pclist-img { width: 100%; min-height: 0; }
  .pclist-text { max-width: 100%; height: auto; }
  .pclist-btn { margin-top: 0; }
  .pclist-img img { height: 12.5rem; }
  .footer-main { flex-direction: column; }
  .footer-brand { text-align: left; max-width: 100%; }
  /* 平板/手机：四列改为整齐 2×2，避免长分类名导致的 3+1 掉行 */
  .footer-cols {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.75rem 2.5rem;
  }
  .qr { margin-left: 0; }
  .page-hero-title { font-size: 1.875rem; }
  .hero-title { font-size: 2rem; }
}
@media (max-width: 860px) {
  /* 移动端 header 全站统一白底实底：深色 logo + 深色汉堡清晰可见（首页 / 内页一致） */
  body .header { background: #fff; box-shadow: 0 0.125rem 0.5rem rgba(0,0,0,.08); }
  body .header .nav-toggle span,
  body .header:not(.scrolled) .nav-toggle span { background: var(--text); }
  .nav-toggle { display: block; }
  .nav {
    position: fixed;
    top: 4.75rem; left: 0; right: 0;
    display: block;
    height: auto;
    background: #fff;
    padding: 0.625rem 0;
    border-bottom: 1px solid var(--line);
    box-shadow: 0 0.75rem 1.25rem rgba(0,0,0,.08);
    max-height: 0;
    overflow: hidden;
    transition: max-height .3s ease;
  }
  .nav.open { max-height: 70vh; overflow-y: auto; }
  .nav-list { display: block; height: auto; }
  .nav-item { display: block; height: auto; }
  .nav-item > a {
    height: auto;
    padding: 0.875rem 1.5rem;
    border-bottom: 1px solid #f2f2f2;
    justify-content: space-between;
  }
  /* 移动端导航面板为白底，强制使用深色文字（不受透明 header 白色文字规则影响） */
  .header:not(.scrolled) .nav-item > a,
  .header:not(.scrolled) .nav-item > a.active { color: var(--text); }
  .menu-line { display: none; }
  .mega-panel { display: none; }
  .nav-sub { background: #fafafa; }
  .nav-sub.open { display: block; }
  .nav-sub a {
    display: block;
    padding: 0.688rem 2.5rem;
    font-size: 0.875rem;
    color: var(--muted);
    border-bottom: 1px solid #f2f2f2;
  }
  .nav-sub a:hover { color: var(--red); }
  .caret { transition: transform .25s ease; }
  .nav-item.sub-open .caret { transform: rotate(180deg); }
  /* 无二级菜单的项（解决方案/技术服务）：移动端不显示箭头，点击直接跳转 */
  .nav-item.no-sub .caret { display: none; }
}
@media (max-width: 640px) {
  :root { --pad: 0.5rem; }
  main.main-card { width: calc(100% - 1rem); margin: 0.938rem auto; border-radius: 0.188rem; }
  .search-section { width: calc(100% - 1rem); padding: 1.125rem 0; }
  .search-bar { width: 100%; }
  .section { padding: 3rem 0; }
  .news-grid { grid-template-columns: 1fr; }
  .prod-card { flex: 1 1 calc(50% - 0.688rem); }
  .pl-grid { grid-template-columns: repeat(2, 1fr); }
  .pl-grid .prod-card .pic { height: 11.875rem; }
  .hero { height: 26.25rem; }
  .hero-title { font-size: 1.5rem; letter-spacing: 0.125rem; }
  .about-top, .prod-top { flex-direction: column; align-items: flex-start; gap: 0.75rem; }
  .about-tags { gap: 0.75rem; }
  .solution-hero img { height: 15rem; }
  .solution-content h3 { font-size: 1.25rem; }
  .crumbs-inner .crumb { font-size: 0.875rem; padding: 0.875rem 1rem; }
  .detail-box { padding: 1.5rem; }
  .footer-bottom { flex-direction: column; }
}

/* ============ Page Banner (子页面) ============ */
.page-banner {
  position: relative;
  height: 28.125rem;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.banner-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(0,0,0,.55), rgba(0,0,0,.3));
}
/* 内页顶部占位条（产品列表 / 详情）：PC 与固定 header 等高 76px，
   移动端加缓冲到 97px，避免微信/浏览器恢复滚动位置时被 header 压住 */
/* 用双类提高特异性，压过文末 @media(min-width:769px){.page-banner{height:6em}} */
.page-banner.page-banner-slim { height: 76px; }
.page-banner-slim .banner-overlay { display: none; } /* 纯占位条，不显示黑色遮罩 */
@media (max-width: 768px) {
  .page-banner.page-banner-slim { height: 97px; }
}
.banner-inner {
  position: relative; z-index: 2;
  height: 100%;
  display: flex; flex-direction: column;
  justify-content: center;
  padding-left: 4%;
}
.banner-title {
  color: #fff;
  font-size: 2.75rem;
  font-weight: 700;
  letter-spacing: 0.125rem;
  margin-bottom: 0.875rem;
  text-shadow: 0 0.125rem 0.5rem rgba(0,0,0,.3);
}
/* 内页标识（栏目名）：红色短横 + 白色栏目名 + 字距 */
.banner-crumb {
  display: inline-flex;
  align-items: center;
  gap: 0.625rem;
  color: #fff;
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: 0.1875rem;
  margin-bottom: 0.875rem;
  text-shadow: 0 0.125rem 0.5rem rgba(0,0,0,.35);
}
.banner-crumb::before {
  content: "";
  flex: none;
  width: 2.25rem;
  height: 0.1875rem;
  border-radius: 0.125rem;
  background: var(--red);
}
/* 副标题（主标题下方的一句描述） */
.banner-sub {
  max-width: 44rem;
  margin-top: 0.25rem;
  color: rgba(255,255,255,.86);
  font-size: 1.0625rem;
  line-height: 1.75;
  letter-spacing: 0.0625rem;
  text-shadow: 0 0.125rem 0.5rem rgba(0,0,0,.35);
}

/* ============ Category grid (products.html) ============ */
.cat-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
}
.cat-card {
  text-align: center;
}
.cat-pic {
  aspect-ratio: 1;
  background: #f5f5f5;
  border-radius: 0.25rem;
  overflow: hidden;
  margin-bottom: 0.875rem;
}
.cat-pic img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .3s;
}
.cat-card:hover .cat-pic img {
  transform: scale(1.05);
}
.cat-name {
  font-size: 0.938rem;
  font-weight: 600;
  color: #333;
  margin-bottom: 0.625rem;
}

/* ============ Products List Detail (products-list.html) ============ */
.plist-page-title {
  width: 100%;
  max-width: none;
  margin: 2.625rem 0 1.625rem;
  font-size: 1.75rem;
  font-weight: 700;
  color: #222;
}
.plist-wrap {
  width: calc(100% - 3rem);
  max-width: none;
  margin: 0 auto 3.75rem;
  padding: 2.625rem 2.875rem 3.375rem;
  background: #fff;
  border: 1px solid #e8e8e8;
  box-shadow: 0 0 1.5rem rgba(0,0,0,.08);
}
.plist-banner {
  width: 100%;
  height: 30rem;
  overflow: hidden;
}
.plist-banner img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.plist-h2 {
  font-size: 1.375rem;
  font-weight: 700;
  color: #222;
  margin: 2.5rem 0 1.375rem;
}
.plist-overview-box {
  background: #f2f2f2;
  padding: 1.875rem 3rem;
  font-size: 0.813rem;
  line-height: 2.2;
  color: #8a8a8a;
  text-align: justify;
}
.plist-overview-box p { margin: 0; }
.plist-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2rem 1.75rem;
}

/* ============ 产品详情 ============ */
.crumbs-inner .crumb + .crumb::before {
  content: '/';
  color: #bbb;
  font-size: 0.813rem;
  margin-right: 1rem;
}
.crumbs-inner .crumb + .crumb.active::before { margin-right: 1.625rem; color: rgba(255,255,255,.75); }
.pdt-wrap {
  width: calc(100% - 3rem);
  max-width: none;
  margin: 2.25rem auto 3.75rem;
  padding: 2.625rem 2.875rem 3.375rem;
  background: #fff;
  border: 1px solid #e8e8e8;
  box-shadow: 0 0 1.5rem rgba(0,0,0,.08);
}
.pdt-block + .pdt-block { margin-top: 2.75rem; }

/* 产品详情轮播图 */
.pdt-gallery-wrap {
  position: relative;
  overflow: hidden;
}
.pdt-slides {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.pdt-slide {
  display: none;
  width: 100%;
}
.pdt-slide.active { display: block; }
.pdt-slide img {
  width: 100%;
  max-height: 500px;
  object-fit: contain;
  background: #f2f2f2;
  display: block;
}
.pdt-dots {
  display: flex;
  justify-content: center;
  gap: 10px;
  padding: 12px 0;
}
.pdt-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #ccc;
  cursor: pointer;
  transition: background .25s ease;
}
.pdt-dot.active { background: #c8161d; }
.pdt-dot:hover { background: #999; }

.pdt-label {
  display: block;
  width: fit-content;
  margin: 0 0 1.375rem;
  padding: 0.375rem 1.125rem;
  border: 1px solid var(--red);
  color: var(--red);
  font-size: 1.063rem;
  font-weight: 600;
  line-height: 1.4;
}
.pdt-box {
  background: #f2f2f2;
  padding: 1.875rem 3rem;
}
.pdt-rich {
  font-size: 0.938rem;
  line-height: 2.2;
  color: #555;
  text-align: justify;
}
.pdt-rich p { margin: 0 0 1em; }
.pdt-rich p:last-child { margin-bottom: 0; }
.pdt-rich img { max-width: 100%; height: auto; }

/* ============ 搜索结果页 ============ */
.sr-wrap {
  width: calc(100% - 3em);
  max-width: none;
  margin: 1.5rem auto 3.75rem;
}
.sr-head { margin-bottom: 1.5rem; }
.sr-title {
  margin: 0 0 0.5rem;
  font-size: 1.5rem;
  font-weight: 700;
  color: #222;
}
.sr-count { margin: 0; font-size: 0.938rem; color: #888; }
.sr-count span,
.sr-count em { font-style: normal; color: var(--red); font-weight: 600; }
.sr-list {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.sr-item {
  display: flex;
  gap: 1.75rem;
  padding: 1.25rem;
  background: #fff;
  border: 1px solid #ececec;
  transition: box-shadow .25s ease, transform .25s ease;
}
.sr-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 0.5rem 1.5rem rgba(0,0,0,.08);
}
.sr-img {
  flex: 0 0 12.5rem;
  width: 12.5rem;
  height: 12.5rem;
  overflow: hidden;
  background: #f7f7f7;
}
.sr-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform .4s ease;
}
.sr-item:hover .sr-img img { transform: scale(1.05); }
.sr-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.sr-name {
  margin: 0 0 0.75rem;
  font-size: 1.125rem;
  font-weight: 600;
  color: #222;
  transition: color .2s ease;
}
.sr-item:hover .sr-name { color: var(--red); }
.sr-desc {
  margin: 0;
  font-size: 0.938rem;
  line-height: 1.9;
  color: #777;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.sr-more {
  margin-top: auto;
  padding-top: 1rem;
  font-size: 0.875rem;
  color: var(--red);
}
.sr-empty {
  padding: 4rem 1rem;
  text-align: center;
  color: #999;
}
.sr-empty p { margin: 0 0 0.5rem; font-size: 1rem; }
.sr-empty span { color: var(--red); }
.sr-empty-tip { font-size: 0.875rem !important; color: #bbb; }

/* Responsive */
@media (max-width: 991px) {
  .cat-grid { grid-template-columns: repeat(3, 1fr); }
  .plist-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.375rem 1.125rem; }
  .plist-banner { height: 20rem; }
  .plist-wrap { padding: 1.75rem 1.625rem 2.375rem; }
  .plist-overview-box { padding: 1.375rem 1.5rem; }
}
@media (max-width: 640px) {
  .page-banner { height: 15rem; }
  .banner-title { font-size: 1.625rem; }
  .cat-grid { grid-template-columns: repeat(2, 1fr); gap: 0.875rem; }
  .plist-grid { grid-template-columns: 1fr; }
  .plist-banner { height: 12.5rem; }
  .plist-page-title { font-size: 1.375rem; margin-top: 1.875rem; }
  .plist-h2 { font-size: 1.188rem; margin: 1.75rem 0 1rem; }
  .pdt-box { padding: 1.25rem 1rem; }
  .pdt-block + .pdt-block { margin-top: 2rem; }
  .pdt-label { margin-bottom: 1rem; }
}

/* ============ Cate Bar（对标 wzhf 产品分类条：红块 + 宽体下拉） ============ */
.cate-bar {
  position: sticky; /* 吸附在固定 header 下方：微信/浏览器恢复滚动位置时也不会被 header 盖住 */
  top: 4.75rem;     /* 与 .header-inner 等高 */
  z-index: 30;
  background: #fff;
  border-bottom: 1px solid #eee;
  height: 3.25rem;
}
.cate-inner {
  display: flex;
  align-items: stretch;
  height: 100%;
  width: 100%;
  margin: 0;
}
.cate-title {
  background: #c8161d;
  color: #fff;
  font-size: 1.125rem;
  font-weight: 600;
  padding: 0 2rem;
  height: 100%;
  display: flex;
  align-items: center;
  white-space: nowrap;
  flex: 0 0 auto;
}
/* 下拉区：紧凑固定宽度，不撑满整行（长类目名超出省略） */
.cate-select {
  flex: 0 0 auto;
  width: 22.5rem;
  position: relative;
  border-right: 1px solid #eee;
  height: 100%;
}
.cate-current {
  width: 100%;
  height: 100%;
  border: none;
  outline: none;
  background: #fff;
  display: flex;
  align-items: center;
  padding: 0 2.75rem 0 1.25rem;
  font-size: 1.125rem;
  font-weight: 500;
  color: #333;
  text-align: left;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.2s;
}
.cate-current:hover,
.cate-select.on .cate-current { background: #fafafa; }
.cate-current-text {
  flex: 1 1 auto;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cate-caret {
  position: absolute;
  right: 1.125rem;
  top: 50%;
  transform: translateY(-50%);
  width: 0; height: 0;
  border-left: 0.313rem solid transparent;
  border-right: 0.313rem solid transparent;
  border-top: 0.375rem solid #999;
  pointer-events: none;
  transition: transform 0.25s, border-top-color 0.25s;
}
.cate-select.on .cate-caret {
  transform: translateY(-50%) rotate(180deg);
  border-top-color: #c8161d;
}
/* 展开浮层 */
.cate-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  background: #fff;
  border: 1px solid #eee;
  border-top: none;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.10);
  padding: 0.375rem 0;
  max-height: 21rem;
  overflow-y: auto;
  z-index: 40;
}
.cate-select.on .cate-menu { display: block; }
.cate-option {
  display: block;
  padding: 0.625rem 1.25rem;
  font-size: 1rem;
  line-height: 1.45;
  color: #333;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: background 0.2s, color 0.2s;
}
.cate-option:hover,
.cate-option.active {
  color: #c8161d;
  background: #fcf3f3;
}
.cate-option.active { font-weight: 600; }

/* ============ Products List Search ============ */
.plist-search {
  background: #f5f5f5;
  padding: 1.875rem 0;
}
.search-inner {
  width: calc(100% - 3rem);
  max-width: none;
  margin: 0 auto;
}
.plist-search-title {
  font-size: 1.375rem;
  color: #807d7d;
  margin-bottom: 1.125rem;
}
.plist-search-form {
  display: flex;
  gap: 0;
  max-width: 35rem;
}
.plist-search-input {
  flex: 1;
  height: 3rem;
  border: 1px solid #ddd;
  border-right: none;
  border-radius: 0.125rem 0 0 0.125rem;
  padding: 0 1rem;
  font-size: 0.875rem;
  outline: none;
  background: #fff;
}
.plist-search-input:focus {
  border-color: #c8161d;
}
.plist-search-btn {
  width: 3.75rem;
  height: 3rem;
  background: #c8161d;
  border: none;
  border-radius: 0 0.125rem 0.125rem 0;
  color: #fff;
  font-size: 1rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.plist-search-btn:hover {
  background: #a81217;
}

/* ============ New Product Launch ============ */
.new-prod {
  padding: 2.5rem 0 1.875rem;
  width: calc(100% - 3rem);
  max-width: none;
  margin: 0 auto;
}
.new-prod .section-head {
  margin-bottom: 1.125rem;
}
.new-prod .section-head h2 {
  font-size: 1.5rem;
  font-weight: 700;
  color: #222;
}
.np-section {
  padding: 0;
  margin: 2.5rem 0;
}
.np-section-inner {
  width: calc(100% - 3rem);
  max-width: none;
  margin: 0 auto;
  background: #fff;
  border: 1px solid #e8e8e8;
  box-shadow: 0 0 1.5rem rgba(0,0,0,.08);
  border-radius: 0.25rem;
  padding: 1.875rem 1.875rem 0.625rem;
  box-sizing: border-box;
}
.np-head {
  margin-bottom: 1.25rem;
}
.np-title {
  font-size: 1.5rem;
  color: #222;
  font-weight: normal;
  margin: 0;
}
.np-wrap {
  position: relative;
  border-radius: 0.25rem;
  overflow: hidden;
  background: #fff;
}
.np-slide {
  display: none;
  width: 100%;
}
.np-slide.active {
  display: block;
}
.np-slide img {
  width: 100%;
  height: auto;
  display: block;
}
.np-slide-title {
  text-align: left;
  font-size: 1rem;
  font-weight: 600;
  color: #333;
  padding: 14px 2px 6px;
  background: none;
  position: static;
}
.np-slide { position: relative; }
.np-dots {
  display: flex;
  justify-content: center;
  gap: 0.625rem;
  padding: 1.125rem 0 0.5rem;
}
.np-dot {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: #ccc;
  cursor: pointer;
  transition: background .2s;
}
.np-dot.active {
  background: #c8161d;
}

/* ============ 产品分类 ============ */
.pclist-section {
  margin: 2.5rem 0;
}
.pclist-inner {
  width: 100%;
  max-width: none;
  margin: 0 auto;
  background: #fff;
  border: 1px solid #e8e8e8;
  box-shadow: 0 0 1.5rem rgba(0,0,0,.08);
  border-radius: 0.25rem;
  padding: 1.875rem;
  box-sizing: border-box;
}
.pclist-head {
  margin-bottom: 1.25rem;
}
.pclist-title {
  font-size: 1.5rem;
  color: #222;
  font-weight: normal;
  margin: 0;
}
.pclist-body {
  background: transparent;
  padding: 0;
}
.pclist-item {
  display: flex;
  align-items: stretch;
  margin-bottom: 1.875rem;
  background: #f2f2f2;
  border-radius: 0.25rem;
  overflow: hidden;
}
.pclist-item:last-child {
  margin-bottom: 0;
}
.pclist-left { flex: 1 1 50%; width: 50%; min-height: 22.5rem; }
.pclist-text {
  padding: 2.25rem 2.25rem 2rem;
  display: flex;
  flex-direction: column;
  height: 100%;
  max-width: 85%;
  box-sizing: border-box;
}
.pclist-cat {
  font-size: 1.25rem;
  color: #2a2a2a;
  font-weight: 600;
  margin: 0 0 1.25rem;
}
.pclist-desc {
  font-size: 0.938rem;
  color: #555;
  line-height: 1.9;
  margin: 0 0 1.25rem;
}
.pclist-btn {
  display: inline-block;
  align-self: flex-start;
  margin-top: auto;
  background: #c8161d;
  color: #fff;
  padding: 0.625rem 1.75rem;
  font-size: 0.875rem;
  text-decoration: none;
  border-radius: 0.125rem;
  transition: background .2s;
}
.pclist-btn:hover {
  background: #a81218;
}
.pclist-img {
  flex: 1 1 50%;
  width: 50%;
  min-height: 22.5rem;
  overflow: hidden;
}
.pclist-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ============ Inner Article Page（解决方案/技术服务，参考 institute 布局）============ */
.pg-tabs-bar {
  background: #fff;
  border-bottom: 1px solid #e8e8e8;
}
.pg-tabs {
  width: 95%;
  max-width: 1240px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 2.875rem;
  height: 3.625rem;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.pg-tabs::-webkit-scrollbar { display: none; }
.pg-tabs a {
  position: relative;
  font-size: 0.938rem;
  color: #555;
  white-space: nowrap;
  padding: 1.188rem 0.125rem 1.063rem;
  transition: color .2s;
}
.pg-tabs a::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 0.125rem;
  background: #c8161d;
  transform: scaleX(0);
  transition: transform .25s ease;
}
.pg-tabs a:hover { color: #c8161d; }
.pg-tabs a.active { color: #c8161d; font-weight: 700; }
.pg-tabs a.active::after { transform: scaleX(1); }
/* 关于我们 tab 条：左侧红色栏名块 */
.pg-tab-parent {
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 24px;
  background: #c8161d;
  color: #fff;
  font-size: 0.938rem;
  font-weight: 700;
  white-space: nowrap;
  text-align: center;
}

.pg-main {
  width: 95%;
  max-width: 1240px;
  margin: 2.5rem auto 4.375rem;
}
.pg-card {
  background: #fff;
  border: 1px solid #e8e8e8;
  box-shadow: 0 0 1.5rem rgba(0,0,0,.08);
  padding: 3rem 3.25rem;
  margin-bottom: 1.875rem;
  scroll-margin-top: 6rem;
}
.pg-card:last-child { margin-bottom: 0; }
.pg-card-title {
  font-size: 1.625rem;
  font-weight: 700;
  color: #111;
  margin: 0 0 2rem;
}
/* 板块卡片：图片独占一行（略窄、居中） */
.pg-fig {
  width: 100%;
  margin: 0 auto;
  aspect-ratio: 21 / 9;
  overflow: hidden;
  border-radius: 4px;
}
.pg-fig > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* 查看更多按钮 */
.pg-more { margin-top: 1.5rem; text-align: left; }
.pg-more-btn {
  display: inline-block;
  min-width: 9rem;
  padding: 0.6875rem 2.5rem;
  background: #c8161d;
  color: #fff;
  font-size: 0.938rem;
  letter-spacing: 0.125em;
  border-radius: 2px;
  transition: background .25s ease;
  margin-top: auto;
  align-self: flex-start;
}
.pg-more-btn:hover { background: #a91218; color: #fff; }

/* 解决方案 / 技术服务：简介左50% + 图片右50% */
.pg-intro-row {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 2rem;
  margin-top: 0.5rem;
}
.pg-intro-text {
  flex: 0 0 50%;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.pg-intro-text p {
  font-size: 0.938rem;
  line-height: 2;
  color: #555;
  text-align: justify;
  margin: 0;
}
.pg-intro-img {
  flex: 0 0 50%;
  max-width: 50%;
  height: 460px;
  overflow: hidden;
}
.pg-intro-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media (max-width: 768px) {
  .pg-intro-row { flex-direction: column; gap: 1rem; }
  .pg-intro-text, .pg-intro-img { flex: 1 1 auto; max-width: 100%; }
  .pg-intro-img { height: 260px; }
}

.pg-body { margin-top: 2rem; }
.pg-body > :first-child { margin-top: 0; }
.pg-body > :last-child { margin-bottom: 0; }
.pg-body p {
  font-size: 0.938rem;
  line-height: 2;
  color: #555;
  margin: 0 0 1rem;
  text-align: justify;
}
.pg-body h3 { font-size: 1.063rem; font-weight: 700; color: #222; margin: 1.5rem 0 .75rem; }
.pg-body h4 { font-size: .969rem; font-weight: 700; color: #333; margin: 1.25rem 0 .5rem; }
.pg-body img {
  max-width: 100%;
  height: auto;
  border-radius: 4px;
  margin: .625rem 0;
}
.pg-body a { color: #c8161d; }
.pg-body a:hover { text-decoration: underline; }
.pg-body ul,
.pg-body ol {
  margin: 0 0 1rem;
  padding-left: 1.4rem;
  color: #555;
  line-height: 2;
}
.pg-body ul li { list-style: disc; }
.pg-body ol li { list-style: decimal; }
/* 板块详情页 */
.pg-back {
  display: inline-block;
  font-size: 0.875rem;
  color: #888;
  margin-bottom: 1.25rem;
}
.pg-back:hover { color: #c8161d; }
.pg-detail-title {
  font-size: 1.625rem;
  font-weight: 700;
  color: #111;
  margin: 0 0 2rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid #eee;
}
.pg-detail-empty {
  color: #999;
  text-align: center;
  padding: 2.5rem 0;
  margin: 0;
}

/* 关于我们/公司文化：白卡内浅灰内容区 */
.pg-graybox {
  background: #f2f2f2;
  border-radius: 2px;
  padding: 2rem 2.25rem;
  min-height: 17.5rem;
}
.pg-graybox-body > :first-child { margin-top: 0; }
.pg-graybox-body > :last-child { margin-bottom: 0; }
.pg-graybox-body p {
  font-size: 0.938rem;
  line-height: 2;
  color: #555;
  margin: 0 0 1rem;
  text-align: justify;
}
.pg-graybox-body h3 { font-size: 1.063rem; font-weight: 700; color: #222; margin: 1.5rem 0 .75rem; }
.pg-graybox-body h4 { font-size: .969rem; font-weight: 700; color: #333; margin: 1.25rem 0 .5rem; }
.pg-graybox-body img {
  max-width: 100%;
  height: auto;
  border-radius: 4px;
  margin: .625rem 0;
}
.pg-graybox-body ul,
.pg-graybox-body ol {
  margin: 0 0 1rem;
  padding-left: 1.4rem;
  color: #555;
  line-height: 2;
}
.pg-graybox-body ul li { list-style: disc; }
.pg-graybox-body ol li { list-style: decimal; }
.pg-graybox-body a { color: #c8161d; }
.pg-graybox-body a:hover { text-decoration: underline; }

/* 富文本兜底：后台编辑器粘贴的内容常带 text-wrap:nowrap，
   会让整段文字不换行、冲出容器右侧被裁切，这里统一强制正常换行 */
.pg-body, .pg-body :not(pre),
.pg-graybox-body, .pg-graybox-body :not(pre),
.pdt-rich, .pdt-rich :not(pre) {
  white-space: normal !important;
  text-wrap: wrap !important;
}
.pg-body p, .pg-graybox-body p, .pdt-rich p,
.pg-body li, .pg-graybox-body li, .pdt-rich li {
  overflow-wrap: break-word;
}
.pg-graybox-fig { margin: 0 0 1.5rem; }
.pg-graybox-fig img {
  display: block;
  width: 100%;
  max-height: 22rem;
  object-fit: cover;
  border-radius: 4px;
}

@media (max-width: 991px) {
  .pg-card { padding: 2rem 1.75rem; }
  .pg-body { margin-top: 1.75rem; }
}
@media (max-width: 640px) {
  .pg-graybox { padding: 1.25rem 1rem; min-height: 12rem; }
  .pg-main { margin-top: 1.75rem; }
  .pg-card { padding: 1.625rem 1.25rem; }
  .pg-card-title { font-size: 1.313rem; margin-bottom: 1.375rem; }
  .pg-fig { aspect-ratio: 16 / 9; }
  .pg-more { margin-top: 1.25rem; }
  .pg-body { margin-top: 1.375rem; }
  .pg-body p { font-size: 0.875rem; line-height: 1.9; }
  .pg-detail-title { font-size: 1.313rem; margin-bottom: 1.375rem; }
  .pg-tabs { gap: 1.75rem; height: 3.25rem; }
}

/* ============ News 新闻中心（参考 wzhf news 布局）============ */
.banner-btn {
  display: inline-block;
  align-self: flex-start;
  margin-top: 1.625rem;
  border: 1px solid rgba(255,255,255,.75);
  color: #fff;
  font-size: 0.875rem;
  padding: 0.625rem 1.875rem;
  letter-spacing: 1px;
  transition: background .25s, color .25s;
}
.banner-btn:hover { background: #fff; color: #c8161d; }
.banner-btn span { font-size: 1.063rem; margin-left: 0.375rem; }

.pg-section-title {
  font-size: 1.625rem;
  line-height: 1.35;
  font-weight: 700;
  color: #111;
  margin: 0 0 1.5rem;
}
/* 响应式高度：字号 / 行高 / 下间距随屏幕分档缩放（与 .pg-card-title 断点保持一致） */
@media (max-width: 992px) {
  .pg-section-title { font-size: 1.375rem; margin-bottom: 1.25rem; }
}
@media (max-width: 768px) {
  .pg-section-title { font-size: 1.25rem; line-height: 1.45; margin-bottom: 1rem; }
}

/* 新闻栏目纯图片轮播（Banner 表-新闻标识） */
.nw-feature { padding-bottom: 1.875rem; }
.nw-slide {
  display: none;
  width: 100%;
  aspect-ratio: 21 / 9;
  overflow: hidden;
  border-radius: 4px;
}
.nw-slide.active {
  display: block;
  animation: nwFade .5s ease;
}
.nw-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@keyframes nwFade {
  from { opacity: 0; }
  to { opacity: 1; }
}
.nw-dots {
  display: flex;
  justify-content: center;
  gap: 0.625rem;
  margin-top: 1.625rem;
}
.nw-dot {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: #d0d0d0;
  cursor: pointer;
  transition: background .2s, width .2s;
}
.nw-dot.active {
  background: #c8161d;
  width: 1.375rem;
  border-radius: 0.25rem;
}

/* 年份筛选 */
.nw-filter {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1.625rem;
  padding-bottom: 1.375rem;
  margin-bottom: 1.875rem;
  border-bottom: 1px solid #ececec;
  font-size: 0.875rem;
}
.nw-flabel { color: #999; }
.nw-filter a {
  color: #666;
  position: relative;
  padding-bottom: 0.125rem;
}
.nw-filter a:hover, .nw-filter a.active { color: #c8161d; }
.nw-filter a.active { font-weight: 700; }
.nw-filter a.active::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1.438rem;
  height: 0.125rem;
  background: #c8161d;
}

/* 新闻网格 */
.nw-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 2.125rem 1.75rem;
}
.nw-item { display: block; min-width: 0; }
.nw-pic {
  overflow: hidden;
  aspect-ratio: 4 / 3;
  margin-bottom: 0.875rem;
}
.nw-pic img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .45s ease;
}
.nw-item:hover .nw-pic img { transform: scale(1.06); }
.nw-name {
  font-size: 0.906rem;
  font-weight: 400;
  color: #333;
  line-height: 1.6;
  margin: 0 0 0.5rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color .2s;
}
.nw-item:hover .nw-name { color: #c8161d; }
.nw-date { font-size: 0.781rem; color: #aaa; }

/* 分页（ThinkPHP render：ul.pagination > li > a/span） */
.nw-pager {
  margin-top: 2.75rem;
}
.nw-pager .pagination {
  display: flex !important;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.nw-pager .pagination li {
  margin: 0;
  display: inline-block;
}
.nw-pager .pagination li a,
.nw-pager .pagination li span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.125rem;
  height: 2.125rem;
  padding: 0 0.625rem;
  box-sizing: border-box;
  border: 1px solid #ddd;
  border-radius: 4px;
  font-size: 0.875rem;
  color: #666;
  background: #fff;
  white-space: nowrap;
  transition: all .2s;
}
.nw-pager .pagination li a:hover {
  border-color: #c8161d;
  color: #c8161d;
}
.nw-pager .pagination li.active span {
  background: #c8161d;
  border-color: #c8161d;
  color: #fff;
  cursor: default;
}
.nw-pager .pagination li.disabled span {
  background: #f7f7f7;
  color: #bbb;
  cursor: not-allowed;
}

/* ============ 新闻详情页 ============ */
.nd-detail { padding: 2.75rem 3.25rem; }
.nd-title {
  margin: 0;
  font-size: 1.875rem;
  font-weight: 700;
  line-height: 1.5;
  color: #111;
  text-align: center;
}
.nd-meta {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.5rem 2rem;
  margin: 1.25rem 0 0;
  padding-bottom: 1.75rem;
  border-bottom: 1px solid #eee;
  font-size: 0.813rem;
  color: #999;
}
.nd-cover {
  margin: 2rem 0 0;
  text-align: center;
}
.nd-cover img {
  display: block;
  max-width: 100%;
  margin: 0 auto;
  border-radius: 4px;
}
.nd-body {
  margin-top: 2rem;
  font-size: 1rem;
  line-height: 2;
  color: #333;
  word-break: break-word;
}
.nd-body > :first-child { margin-top: 0; }
.nd-body p { margin: 0 0 1.1em; text-align: justify; }
.nd-body img { max-width: 100%; height: auto; border-radius: 4px; }
.nd-body h2 { font-size: 1.375rem; font-weight: 700; color: #111; margin: 2rem 0 1rem; }
.nd-body h3 { font-size: 1.188rem; font-weight: 700; color: #222; margin: 1.75rem 0 .875rem; }
.nd-body ul,
.nd-body ol { margin: 0 0 1.1em; padding-left: 1.6em; }
.nd-body ul li { list-style: disc; }
.nd-body ol li { list-style: decimal; }
.nd-body a { color: #c8161d; }
.nd-body a:hover { text-decoration: underline; }
.nd-body blockquote {
  margin: 0 0 1.1em;
  padding: 0.75rem 1.25rem;
  border-left: 3px solid #c8161d;
  background: #f7f7f7;
  color: #666;
}
.nd-pager {
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid #eee;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  font-size: 0.875rem;
}
.nd-pager > div {
  display: flex;
  align-items: baseline;
  gap: 0.25rem;
  min-width: 0;
  flex: 1 1 0;
}
.nd-prev { justify-content: flex-start; text-align: left; }
.nd-next { justify-content: flex-end; text-align: right; }
.nd-pager-label { color: #999; white-space: nowrap; }
.nd-pager a {
  color: #555;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: color .2s;
}
.nd-pager a:hover { color: #c8161d; }
.nd-pager .nd-none { color: #bbb; }
.nd-back { margin-top: 1.75rem; text-align: center; }

@media (max-width: 991px) {
  .nw-slide { aspect-ratio: 16 / 9; }
  .nw-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.75rem 1.375rem; }
  .nd-detail { padding: 2rem 1.75rem; }
}
@media (max-width: 640px) {
  .nw-grid { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
  .nw-filter { gap: 1rem; }
  .nd-detail { padding: 1.625rem 1.25rem; }
  .nd-title { font-size: 1.313rem; }
  .nd-meta { gap: 0.375rem 1.25rem; }
  .nd-body { font-size: 0.938rem; }
  .nd-pager { flex-direction: column; align-items: stretch; }
  .nd-pager > div { flex-wrap: wrap; }
  .nd-prev, .nd-next { justify-content: flex-start; text-align: left; }
}

/* ============ 联系我们页（左信息卡 + 右留言表单） ============ */
.ct-section { padding: 2.75rem 0 4.375rem; }
.ct-heading {
  margin: 0 0 2rem;
  font-size: 1.875rem;
  font-weight: 700;
  color: #111;
  text-align: center;
  position: relative;
  padding-bottom: 1rem;
}
.ct-heading::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 3rem;
  height: 0.1875rem;
  background: #c8161d;
}
/* 两栏布局：左侧联系方式，右侧留言表单 */
.ct-layout {
  display: flex;
  align-items: stretch;
  gap: 1.5rem;
}
.ct-aside {
  flex: 0 0 40rem;
  width: 22rem;
}
.ct-form {
  flex: 1;
  min-width: 0;
}
.ct-card {
  height: 100%;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #e8e8e8;
  box-shadow: 0 0 1.5rem rgba(0,0,0,.08);
  padding: 2rem 1.875rem;
  display: flex;
  flex-direction: column;
}
.ct-card-title {
  font-size: 1.125rem;
  font-weight: 700;
  color: #222;
  line-height: 1.6;
  padding-bottom: 1.125rem;
  margin-bottom: 1.25rem;
  border-bottom: 1px solid #eee;
}
.ct-card-row {
  display: flex;
  align-items: flex-start;
  font-size: 0.938rem;
  line-height: 1.9;
  margin-bottom: 0.75rem;
}
.ct-k {
  flex: 0 0 auto;
  color: #999;
}
.ct-v {
  color: #333;
  word-break: break-all;
}
.ct-v a { color: #c8161d; }
.ct-navbtn {
  align-self: flex-start;
  margin-top: 1.25rem;
  padding: 0.5rem 1.375rem;
  border: 1px solid #c8161d;
  font-size: 0.875rem;
  color: #c8161d;
  transition: background .2s, color .2s;
}
.ct-navbtn:hover { background: #c8161d; color: #fff; }
.ct-tip {
  margin: 0 0 1.5rem;
  font-size: 0.938rem;
  color: #888;
}

/* 留言表单 */
.contact-form {
  max-width: 45rem;
  margin-top: 0.5rem;
}
.ct-form .contact-form { max-width: none; }
.cf-row {
  display: flex;
  gap: 1.5rem;
  margin-bottom: 1.25rem;
}
.cf-field {
  flex: 1;
}
.cf-label {
  display: block;
  font-size: 0.875rem;
  font-weight: 700;
  color: #333;
  margin-bottom: 0.5rem;
}
.cf-req { color: #c8161d; }
.cf-input, .cf-textarea {
  width: 100%;
  border: 1px solid #ddd;
  padding: 0.625rem 0.875rem;
  font-size: 0.875rem;
  font-family: inherit;
  color: #333;
  background: #fff;
  outline: none;
  transition: border-color .2s;
  box-sizing: border-box;
}
.cf-input:focus, .cf-textarea:focus { border-color: #c8161d; }
.cf-textarea { resize: vertical; line-height: 1.7; }
.cf-submit {
  display: inline-block;
  background: #c8161d;
  color: #fff;
  font-size: 0.875rem;
  padding: 0.688rem 2.5rem;
  border: none;
  cursor: pointer;
  transition: background .2s;
}
.cf-submit:hover { background: #a81218; }
.cf-msg {
  display: none;
  margin-top: 1rem;
  font-size: 0.875rem;
}
.cf-msg.show {
  display: block;
  color: #2a9d2a;
}

@media (max-width: 991px) {
  .ct-layout { flex-direction: column; }
  .ct-aside { flex: none; width: 100%; }
  .ct-card { padding: 1.625rem 1.5rem; }
}
@media (max-width: 640px) {
  .ct-section { padding-top: 2rem; }
  .ct-heading { font-size: 1.5rem; margin-bottom: 1.5rem; }
  .cf-row { flex-direction: column; gap: 1.25rem; }
}


/* ============================================================
   全站布局基准字号（严格对标 wzhf.com 机制，首页/内页统一）
   机制：body 分档“布局基准字号”，布局尺寸用 em 随屏放大，
   字体一律固定 rem/px 不放大；不改动全局 html 根字号。
   内页组件全部使用 rem，故 body 放大只驱动 em 骨架，文字不受影响；
   富文本裸标签由文末“文字容器兜底”统一锁定字号。
   手机端（≤768）重置为 16px，em 不再放大，见文末移动端段落。
   ============================================================ */
body { font-size: 26px; }
@media only screen and (min-width: 435px)  { body { font-size: 30px; } }
@media only screen and (min-width: 769px)  { body { font-size: 34px; } }
@media only screen and (min-width: 1024px) { body { font-size: 28px; } }
@media only screen and (min-width: 1200px) { body { font-size: 30px; } }
@media only screen and (min-width: 1440px) { body { font-size: 34px; } }
@media only screen and (min-width: 1680px) { body { font-size: 40px; } }

/* ---------- Hero（对标 banner 高 24rem）---------- */
body.page-index .hero { height: 24em; max-height: none; }
body.page-index .hero-title {
  font-size: 36px;
  font-weight: 700;
  letter-spacing: 4px;
  padding: 0 20px;
  white-space: normal;
}

/* ---------- 搜索行（整行 100%：输入框 + 按钮，等高）---------- */
.hp-search {
  width: calc(100% - 3em);
  margin: 0.875em auto 0;
  display: flex;
  align-items: center;
}
/* 输入框 + 按钮（整行 100%） */
.hp-search-form {
  flex: 1 1 100%;
  width: 100%;
  height: 1.5em;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75em;
}
.hp-search-txt {
  flex: 1 1 auto;
  min-width: 0;
  height: 100%;
  border: none;
  outline: none;
  background: #fff;
  font-family: inherit;
  font-size: 17px;
  color: #000;
  padding: 0 0.65em;
}
.hp-search-txt::placeholder { color: #b5b5b5; }
.hp-search-submit {
  flex: 0 0 auto;
  height: 100%;
  padding: 0 1.35em;
  border: none;
  background: var(--red);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4em;
  font-family: inherit;
  font-size: 17px;
  white-space: nowrap;
  cursor: pointer;
  transition: background .2s ease;
}
.hp-search-submit svg { width: 16px; height: 16px; flex: none; }
.hp-search-submit:hover { background: var(--red-dark); }

/* ---------- 主内容白卡 ---------- */
.hp-main {
  width: calc(100% - 3em);
  margin: 0.875em auto 1.5em;
  background: #fff;
}
.hp-section { padding: 1.5em; }

/* 区块标题行 */
.hp-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1em;
  margin-bottom: 1.25em;
}
.hp-head-left { min-width: 0; }
.hp-title {
  font-size: 36px;
  font-weight: 700;
  color: #1f1f1f;
  line-height: 1.4;
}
.hp-subtitle {
  margin-top: 8px;
  font-size: 16px;
  color: #9a9a9a;
}

/* 按钮（字体固定 px） */
.hp-btn {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  line-height: 1;
  cursor: pointer;
  transition: all .2s ease;
}
.hp-btn-red { background: var(--red); color: #fff; padding: 10px 22px; }
.hp-btn-red:hover { background: var(--red-dark); color: #fff; }
.hp-btn-line { border: 1px solid #b5b5b5; color: #555; padding: 10px 22px; background: #fff; }
.hp-btn-line:hover { border-color: var(--red); color: var(--red); }
.hp-btn-dark { background: rgba(20,20,20,.82); color: #fff; padding: 10px 26px; }
.hp-btn-dark:hover { background: #000; color: #fff; }
.hp-more-link {
  flex: 0 0 auto;
  font-size: 13px;
  color: #666;
  border: 1px solid #d5d5d5;
  padding: 8px 16px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.hp-more-link:hover { color: var(--red); border-color: var(--red); }

/* ---------- 关于我们 ---------- */
/* 高度由左侧富文本内容撑开（min-height 保底设计高度），字号调大也不会裁切/错位；
   flex 默认 align-items:stretch，右侧图片列自动与文字列等高 */
.hp-about-row {
  display: flex;
  background: #f2f2f2;
  min-height: 10.75em;
}
.hp-about-text {
  flex: 0 0 45%;
  width: 45%;
  padding: 1.5em;
  display: flex;
  flex-direction: column;
}
.hp-about-desc { color: #444; font-size: 14px; line-height: 2; }
.hp-about-desc p { margin-bottom: 8px; }
.hp-about-tags { display: flex; flex-wrap: wrap; gap: 1.5em; margin: 1.5em 0 0; }
.hp-about-tags a {
  position: relative;
  font-size: 13px;
  color: #333;
  padding-left: 12px;
  transition: color .2s ease;
}
.hp-about-tags a::before {
  content: "";
  position: absolute;
  left: 0; top: 50%;
  transform: translateY(-50%);
  width: 0; height: 0;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 6px solid #333;
}
.hp-about-tags a:first-child::before { border-left-color: var(--red); }
.hp-about-tags a:hover { color: var(--red); }
.hp-about-tags a:hover::before { border-left-color: var(--red); }
.hp-about-logo { margin-top: auto; padding-top: 1.5em; }
.hp-about-logo img { height: 38px; }
.hp-about-logo-sub { font-size: 11px; letter-spacing: 4px; color: #999; margin-top: 4px; }
.hp-about-img { flex: 1 1 55%; position: relative; min-height: 0; overflow: hidden; }
.hp-about-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }

/* ---------- 产品中心：对标 wzhf .hd-container 竖版大图卡横滑（12.5em×15em）---------- */
.hp-rail { overflow: hidden; }
.hp-rail-track {
  display: flex;
  width: max-content;
  animation: hp-marquee 48s linear infinite; /* 卡片放大后保持原滚动速度 */
}
/* 产品列表页：同一套 .hp-pcard 卡片，5 列栅格（1920 下一行正好 5 个，且铺满整行） */
.hp-rail-track-pro {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .75em .425em; /* 行距 / 列距，列距与首页卡片间距同值 */
}
/* 列表页不再沿用首页跑马灯的固定宽高（11/12.5em × 15em），改为随栅格列宽自适应；
   图区用 aspect-ratio 锁住与首页一致的竖版比例（首页图区 500×538 ≈ 1:1.08） */
.hp-rail-track-pro .hp-pcard {
  width: auto;
  height: auto;
  margin-right: 0;
}
.hp-rail-track-pro .hp-pcard-img {
  flex: 0 0 auto;
  aspect-ratio: 1 / 1.08;
}
/* 卡片变窄后 24px 标题过于拥挤，等比收到 20px */
.hp-rail-track-pro .hp-pcard-name {
  font-size: 16px;
  padding: 12px 16px;
}
.hp-rail-track-pro > div { grid-column: 1 / -1; } /* “暂无产品”提示独占一行 */
/* 中等屏：5 列会把卡片压得过窄，逐级降列（≥1680 → 5 / 1200-1679 → 4 / 769-1199 → 3） */
@media only screen and (min-width: 1200px) and (max-width: 1679px) {
  .hp-rail-track-pro { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media only screen and (min-width: 769px) and (max-width: 1199px) {
  .hp-rail-track-pro { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
/* 手机端：容器窄，改为单列撑满、图区保持首页同比例 */
@media (max-width: 768px) {
  .hp-rail-track-pro { grid-template-columns: 1fr; }
  .hp-rail-track-pro .hp-pcard { width: 100%; height: auto; }
  .hp-rail-track-pro .hp-pcard-img { flex: 0 0 auto; aspect-ratio: 5 / 6; }
  .hp-rail-track-pro .hp-pcard-name { font-size: 16px; padding: 12px 14px; }
}

.hp-rail:hover .hp-rail-track { animation-play-state: paused; }
@keyframes hp-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
.hp-pcard {
  flex: 0 0 auto;
  width: 11em;   /* 对标 wzhf .swiper-slide：≤1680 生效值 11rem */
  height: 15em;  /* 对标 wzhf .swiper-slide：15rem */
  margin-right: .425em;
  display: flex;
  flex-direction: column;
  background: #fff;
  overflow: hidden;
  text-decoration: none;
}
/* 对标 wzhf：≥1680 卡片放大到 12.5rem */
@media only screen and (min-width: 1680px) {
  .hp-pcard { width: 12.5em; }
}
.hp-pcard-img {
  width: 100%;
  flex: 1 1 auto;
  min-height: 0;
  position: relative;
  overflow: hidden;
}
.hp-pcard-img img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain; /* 完整显示产品图，不裁切不变形 */
  padding: 14px;
  transition: transform .5s ease;
}
.hp-pcard:hover .hp-pcard-img img { transform: scale(1.06); }
.hp-pcard-name {
  flex: 0 0 auto;
  padding: 14px 16px;
  font-size: 16px; /* 对标 wzhf .tit-24 */
  font-weight: 600;
  color: #444;
  line-height: 1.4;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  background: #fff;
}

/* ---------- 新闻中心：对标 wzhf .hf-container，三等分、4:3 大图 ---------- */
.hp-news-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5em;
}
.hp-ncard { display: block; }
.hp-ncard-img {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  margin-bottom: 0.75em;
}
.hp-ncard-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.hp-ncard:hover .hp-ncard-img img { transform: scale(1.1); }
.hp-ncard-date { font-size: 16px; line-height: 1; color: #666; }
.hp-ncard-title {
  margin: 0.5em 0 0.75em;
  font-size: 20px;
  font-weight: 400;
  color: #000;
  line-height: 1.5;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  transition: color .3s ease;
}
.hp-ncard:hover .hp-ncard-title { color: var(--red); }
.hp-ncard-more {
  display: inline-flex;
  align-items: center;
  font-size: 16px;
  color: #333;
  transition: color .3s ease;
}
.hp-ncard-more span { margin-left: 0.3em; transition: transform .3s ease; }
.hp-ncard:hover .hp-ncard-more { color: var(--red); }
.hp-ncard:hover .hp-ncard-more span { transform: translateX(3px); }

/* ---------- 解决方案（对标 wzhf .home-g：17.5em 大图 + hover 鼠标视差）---------- */
.hp-sol .hp-title { margin-bottom: 1em; }
.hp-sol-hero {
  position: relative;
  height: 17.5em;
  overflow: hidden;
}
/* 106% 放大视差容器，给位移留边，避免露出黑边 */
.hp-sol-scene {
  position: absolute;
  left: -3%;
  top: -3%;
  width: 106%;
  height: 106%;
}
.hp-sol-layer {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  will-change: transform;
}
.hp-sol-layer img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.hp-sol-overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #fff;
  padding: 20px;
}
.hp-sol-overlay h3 { font-size: 30px; font-weight: 700; text-shadow: 0 2px 10px rgba(0,0,0,.35); }
.hp-sol-overlay p {
  max-width: 640px;
  margin: 14px 0 26px;
  font-size: 15px;
  line-height: 1.9;
  text-shadow: 0 1px 8px rgba(0,0,0,.4);
}

/* ---------- 平板 / 移动端 ---------- */
@media (max-width: 992px) {
  .hp-section { padding: 1.25em; }
}

/* ============================================================
   首页移动端适配（严格对标 wzhf mob.css，断点 768/420）
   手机端把首页“布局基准字号”重置回 16px，em 不再放大；
   各关键区块改用固定 px / vh 精确控制，保证触摸尺寸与不出血。
   ============================================================ */
@media (max-width: 768px) {
  /* 手机端全站布局基准重置为 16px，em 不再放大 */
  body { font-size: 16px; }

  /* Hero：高度按视口，标题强制换行不溢出 */
  body.page-index .hero { height: 56vh; min-height: 360px; max-height: 540px; }
  body.page-index .hero-slide .hero-title,
  body.page-index .hero-title {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    font-size: 21px;
    line-height: 1.55;
    letter-spacing: 1px;
    padding: 0 20px;
    white-space: normal;
    word-break: break-word;
  }
  .hero-dots { bottom: 20px; gap: 8px; }

  /* 搜索：整行，输入框自适应 + 红色按钮，等高 44px */
  .hp-search { width: calc(100% - 24px); margin: 12px auto 0; }
  .hp-search-form { height: 44px; gap: 10px; }
  .hp-search-txt { font-size: 14px; padding: 0 14px; }
  .hp-search-submit { flex: 0 0 auto; padding: 0 18px; gap: 6px; font-size: 14px; }
  .hp-search-submit svg { width: 16px; height: 16px; }

  /* 白卡与区块 */
  .hp-main { width: calc(100% - 20px); margin: 10px auto 20px; }
  .hp-section { padding: 24px 16px; }
  .hp-head { margin-bottom: 18px; gap: 12px; }
  .hp-title { font-size: 20px; }
  .hp-subtitle { font-size: 12px; margin-top: 6px; }
  .hp-btn-red, .hp-btn-line { padding: 8px 16px; font-size: 12px; }
  .hp-more-link { padding: 7px 13px; font-size: 12px; }

  /* 关于我们：上下堆叠，文字在上、图在下 */
  .hp-about-row { flex-direction: column; height: auto; min-height: 0; }
  .hp-about-text { flex: none; width: 100%; padding: 22px 18px; overflow: visible; }
  .hp-about-desc { font-size: 13px; line-height: 1.95; }
  .hp-about-tags { gap: 14px 22px; margin: 20px 0 0; }
  .hp-about-logo { margin-top: 22px; padding-top: 0; }
  .hp-about-logo img { height: 30px; }
  .hp-about-img { flex: none; width: 100%; height: 200px; }
  .hp-about-img img { position: static; height: 200px; }

  /* 产品中心：横向滑动，卡片尺寸走 em（对标 wzhf），不再写死 px */
  .hp-rail { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .hp-rail-track { animation: none; }
  .hp-pcard-name { font-size: 16px; padding: 10px 14px; }

  /* 新闻中心：单列 */
  .hp-news-grid { grid-template-columns: 1fr; gap: 24px; }
  .hp-ncard-date { font-size: 13px; }
  .hp-ncard-title { font-size: 16px; line-height: 1.55; margin: 8px 0; }
  .hp-ncard-more { font-size: 13px; }

  /* 解决方案：降低高度、字号，视差已由 JS 在 <769 关闭 */
  .hp-sol-hero { height: 230px; }
  .hp-sol-overlay { padding: 16px; }
  .hp-sol-overlay h3 { font-size: 20px; }
  .hp-sol-overlay p { font-size: 13px; line-height: 1.75; margin: 10px 0 16px; }
  .hp-sol-overlay .hp-btn { padding: 9px 20px; font-size: 12px; }
}

/* 手机端 body 基准已被重置为 16px，这里给产品卡片单独恢复 wzhf 的根字号档位，
   使 .hp-pcard 的 11em×15em 与 wzhf 的 11rem×15rem 得到相同像素 */
@media (max-width: 768px) and (min-width: 360px) { .hp-pcard { font-size: 26px; } }
@media (max-width: 768px) and (min-width: 435px) { .hp-pcard { font-size: 30px; } }

@media (max-width: 420px) {
  body.page-index .hero-title,
  body.page-index .hero-slide .hero-title { font-size: 18px; }
  .hp-section { padding: 20px 14px; }
  .hp-about-img, .hp-about-img img { height: 180px; }
  .hp-sol-hero { height: 210px; }
}

/* ============================================================
   全站统一水平栅格（首页 / 内页同一套布局原理）
   标准：
   - PC/平板(>768)：屏幕边距 1.5em（随 body 分档字号弹性放大）
       · 主槽 / 白卡外缘 width = calc(100% - 3em)
       · 白卡内边距 1.5em（769-992 平板为 1.25em）→ 内容内缘 3em / 2.75em
       · footer 对齐白卡内缘
   - 手机(≤768)：body 基准 16px，em 不再放大
       · 白卡外缘 10px、通栏条/footer 16px、白卡内边距 24/16
   ============================================================ */

/* ---- 富文本 / 裸文字字号兜底：锁回固定 rem，防止 body 分档把后台内容放大 ---- */
.pclist-text, .plist-overview-box { font-size: 0.938rem; }


/* ---- PC / 平板(>768)：内页主槽统一为首页白卡同槽（屏幕边距 1.5em）---- */
@media (min-width: 769px) {
  .pg-tabs,
  .pg-main,
  .plist-wrap,
  .pdt-wrap,
  .plist-head,
  .search-section,
  main.main-card,
  .new-prod,
  .np-section-inner {
    width: calc(100% - 3em);
    max-width: none;
  }
  /* h1 标题字号固定 rem，em 槽宽挂在继承 body 字号的包裹层上 */
  .plist-head { margin-left: auto; margin-right: auto; }
  /* 搜索内层不再二次缩进（修旧版 section 24 + inner 24 双重边距） */
  .search-inner { width: 100%; max-width: none; }
  /* 通栏分类条内容槽与主槽对齐（.cate-inner 自带 margin:0，需恢复 auto 居中） */
  .cate-bar .container {
    width: calc(100% - 3em);
    margin-left: auto;
    margin-right: auto;
    padding-left: 0;
    padding-right: 0;
  }
  /* 联系页地图区槽与白卡主槽对齐 */
  .ct-section .container {
    width: calc(100% - 3em);
    max-width: none;
    padding-left: 0;
    padding-right: 0;
  }
  /* 产品中心白卡（同时是 .container，覆盖其全局 24px padding） */
  .pclist-inner {
    width: calc(100% - 3em);
    padding: 1.5em;
  }
  /* 白卡内边距随分档缩放（屏幕 1.5em + 卡内 1.5em = 内容内缘 3em） */
  .pg-card { padding: 1.5em; }
  .plist-wrap,
  .pdt-wrap { padding: 1.5em; }
  main.main-card { padding-left: 1.5em; padding-right: 1.5em; }
}

/* ---- 平板 769-992：卡内边距 1.25em（内缘 2.75em，与首页 .hp-section 一致）---- */
@media (min-width: 769px) and (max-width: 992px) {
  .pg-card,
  .plist-wrap,
  .pdt-wrap,
  .pclist-inner { padding: 1.25em; }
  main.main-card { padding-left: 1.25em; padding-right: 1.25em; }
}

/* ---- Footer：白卡型页面（首页/产品/方案/服务/新闻）对齐白卡内缘 ---- */
@media (min-width: 993px) {
  .footer .container {
    max-width: none;
    width: calc(100% - 6em);
    padding-left: 0;
    padding-right: 0;
  }
}
@media (min-width: 769px) and (max-width: 992px) {
  .footer .container {
    max-width: none;
    width: calc(100% - 5.5em);
    padding-left: 0;
    padding-right: 0;
  }
}
/* ============================================================
   手机端（≤768）全站统一栅格
   ============================================================ */
@media (max-width: 768px) {
  .page-banner { height: 15rem; }
  /* banner 文案：在白底固定导航(4.75rem)下方的区域内居中，左右对齐 16px 槽 */
  .banner-inner {
    justify-content: center;
    padding: 4.75rem 1rem 0;
  }
  .banner-title {
    font-size: 1.375rem;
    line-height: 1.35;
    letter-spacing: 0.0625rem;
    margin-bottom: 0.625rem;
  }
  .banner-crumb {
    font-size: 0.875rem;
    letter-spacing: 0.125rem;
    margin-bottom: 0.625rem;
  }
  .banner-crumb::before {
    width: 1.5rem;
    height: 0.125rem;
  }
  .banner-sub {
    max-width: none;
    font-size: 0.9375rem;
    line-height: 1.7;
    letter-spacing: 0.0313rem;
  }
  /* 分类条：红块收紧、下拉项弹性占满剩余空间，避免长类目名只露一个字 */
  .cate-title { padding-left: 1.25rem; padding-right: 1.25rem; line-height: 1; }
  .cate-select { flex: 1 1 auto; width: auto; min-width: 0; }
  .cate-current { padding-left: 1rem; padding-right: 2.5rem; font-size: 1rem; }
  .cate-caret { right: 1rem; }
  .cate-option { padding-left: 1rem; padding-right: 1rem; }

  /* 白卡型主容器：10px 外缘（对标首页 .hp-main） */
  .pg-main,
  .plist-wrap,
  .pdt-wrap,
  main.main-card {
    width: calc(100% - 20px);
    max-width: none;
  }
  /* 白卡内边距 24/16（对标首页 .hp-section） */
  .pg-card,
  .plist-wrap,
  .pdt-wrap { padding: 24px 16px; }
  main.main-card { padding-left: 16px; padding-right: 16px; }
  .pclist-inner {
    width: calc(100% - 20px);
    max-width: none;
    padding: 24px 16px;
  }

  /* 通栏 tab / 分类条 / 独立搜索 / 列表标题：16px 外缘 */
  .pg-tabs,
  .search-section,
  .plist-head,
  .sr-wrap,
  .ct-section .container {
    width: calc(100% - 32px);
    max-width: none;
    margin-left: auto;
    margin-right: auto;
    padding-left: 0;
    padding-right: 0;
  }
  .search-inner { width: 100%; max-width: none; }
  /* 搜索结果项：图片缩小、间距收紧 */
  .sr-item { gap: 1rem; padding: 0.875rem; }
  .sr-img { flex-basis: 6.5rem; width: 6.5rem; height: 6.5rem; }
  .sr-name { font-size: 1rem; margin-bottom: 0.5rem; }
  .sr-desc { font-size: 0.813rem; line-height: 1.7; -webkit-line-clamp: 2; }
  .sr-more { padding-top: 0.5rem; font-size: 0.813rem; }
  .cate-bar .container {
    width: calc(100% - 32px);
    margin-left: auto;
    margin-right: auto;
    padding-left: 0;
    padding-right: 0;
  }
  /* 产品页搜索条窄屏铺满，不溢出 */
  body.page-products .search-bar { width: 100%; min-width: 0; max-width: 100%; }

  /* footer 全站固定 16px 内缩 */
  .footer .container {
    max-width: none;
    width: calc(100% - 32px);
    padding-left: 0;
    padding-right: 0;
  }
}