/* ============================================================
   Corp599 企业主题 · 样式
   1:1 按用户提供的四个参考页（首页/产品中心页/产品详情页/文章详情页）还原
   配色一律走 CSS 变量；后台改主色/强调色时由 include.php 输出 ：root 覆盖
   ============================================================ */
:root {
  --primary: #1e40af; --primary-dark: #1e3a8a; --primary-light: #eff6ff;
  --accent: #f97316; --accent-dark: #ea580c;
  --text: #0f172a; --text-light: #64748b; --border: #e2e8f0;
  --bg: #ffffff; --bg-soft: #f8fafc;
  /* ===== 语义色 token =====
     原先是散落在各选择器里的硬编码 hex，集中到这里；值与替换前完全一致，只为一处可调。
     改动这些值会同步影响对应组件，不会再出现"改了主色、页脚/正文不跟着变"。 */
  --text-2: #334155;        /* 正文次级文字：产品 tab 面板 / 文章正文 */
  --text-muted: #94a3b8;    /* 弱化文字：页脚正文 / 灯箱计数 */
  --text-on-dark: #cbd5e1;  /* 深色底上的次级文字：顶栏 / CTA 副文案 / 页脚小标题 */
  --text-disabled: #b8bfc9; /* 禁用态文字：翻页 / 上下篇占位 */
  --bg-disabled: #f5f6f8;   /* 禁用态底色 */
  --footer-bg: #0f172a;     /* 页脚底色 */
  --footer-border: #1e293b; /* 页脚分隔线 */
  --danger: #dc2626;        /* 错误 / 必填标记 */
  --success: #16a34a;       /* 成功提示 */
  --accent-400: #fb923c;    /* 热门榜第 2 名 */
  --accent-300: #fdba74;    /* 热门榜第 3 名 */
  /* 响应式断点（全站只有这三个；纯 CSS 无法用变量当断点，改版式时全局搜这三个数值即可）：
     ≤1000px 栅格降列 / 首屏单列 ｜ ≤900px 侧栏移下 / 导航折叠 ｜ ≤700px 手机端版式 */
  --radius: 10px;
  --shadow: 0 1px 3px rgba(15,23,42,0.06);
  --shadow-lg: 0 10px 30px rgba(15,23,42,0.08);
  --container: 1200px;

  /* ===== 版式 token（全站共用）=====
     内页的页头内距、卡片间距、图片比例一律走这里。
     各页面/各组件不再自己写数字 —— 要整站同时变，只改这一处。
     实测背景：改前「面包屑距页顶」在三类页面分别是 141 / 149 / 157，
     「产品图」在四个展示位有 4 套尺寸规则，页面之间互相割裂。 */
  --page-pad: 48px;                    /* 内页：页头带 与 正文区 的上下内距 */
  --gap: 24px;                         /* 卡片栅格间距（产品/新闻/相关） */
  --thumb-ratio: 4 / 3;                /* 产品图统一比例：首页卡/列表卡/相关卡/详情主图共用 */
  --content-pad: 40px;                 /* 正文卡左右内距：产品详情 tab 面板 与 文章详情正文卡 共用 */
  --thumb-bg: linear-gradient(135deg, #dbeafe, #bfdbfe);  /* 无图时的统一占位底色 */
  --head-bg: linear-gradient(135deg, #f0f6ff 0%, #e0eaff 100%);  /* 内页页头带底色 */
}
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif; background: var(--bg); color: var(--text); line-height: 1.7; font-size: 15px; overflow-wrap: anywhere; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
ul, ol { list-style: none; }
.container { max-width: var(--container); margin: 0 auto; padding: 0 20px; }

/* 顶栏 */
.topbar { background: var(--primary-dark); color: var(--text-on-dark); font-size: 13px; }
.topbar-inner { display: flex; justify-content: space-between; align-items: center; height: 36px; }
.topbar .info { display: flex; gap: 20px; }
.topbar .info span { display: flex; align-items: center; gap: 6px; }
.topbar .links { display: flex; gap: 16px; }
.topbar a:hover { color: #fff; }

/* 头部 */
.site-header { background: #fff; border-bottom: 1px solid var(--border); position: sticky; top: 0; z-index: 100; box-shadow: var(--shadow); }
.header-inner { display: flex; align-items: center; gap: 24px; height: 72px; }
.logo { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 22px; color: var(--primary); flex-shrink: 0; }
.logo-mark { width: 40px; height: 40px; background: linear-gradient(135deg, var(--primary), var(--primary-dark)); color: #fff; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 700; }
.logo-text { line-height: 1.2; }
.logo-text em { font-size: 11px; font-style: normal; color: var(--text-light); display: block; font-weight: 400; letter-spacing: 1px; }
.main-nav { display: flex; gap: 4px; flex: 1; }
.main-nav ul { display: flex; gap: 4px; flex-wrap: wrap; }
.main-nav a { padding: 8px 14px; border-radius: 6px; font-size: 15px; color: var(--text); font-weight: 500; white-space: nowrap; }
.main-nav a:hover, .main-nav a.active { background: var(--primary-light); color: var(--primary); }
/* 二级菜单 · PC 端：hover 弹出下拉面板；一级项文字仍可点击进入该栏目页
   （桌面端有 hover，不抢一级项的跳转；手机端无 hover，改由 siteheader.php 的脚本整行点击展开） */
.main-nav > ul > li.has-sub { position: relative; }
.main-nav > ul > li.has-sub > a { position: relative; padding-right: 30px; }
.main-nav > ul > li.has-sub > a::after { content: ''; position: absolute; right: 13px; top: 50%; width: 6px; height: 6px; margin-top: -4px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); transition: transform .2s; }
.main-nav > ul > li.has-sub:hover > a::after,
.main-nav > ul > li.has-sub:focus-within > a::after { transform: rotate(225deg); }
.main-nav > ul > li.has-sub > ul { position: absolute; top: 100%; left: 0; flex-direction: column; flex-wrap: nowrap; gap: 2px; min-width: 178px; padding: 8px; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-lg); z-index: 130; visibility: hidden; opacity: 0; transform: translateY(6px); transition: opacity .18s ease, transform .18s ease, visibility .18s; }
/* 透明桥：.main-nav a 是行内元素，其背景盒高于 li 的行盒；鼠标从文字下移到面板途中会短暂离开 li，
   补一段透明区域接住指针，避免下拉闪烁（0.5px 视觉不可见） */
.main-nav > ul > li.has-sub > ul::before { content: ''; position: absolute; top: -12px; left: 0; right: 0; height: 12px; }
.main-nav > ul > li.has-sub:hover > ul,
.main-nav > ul > li.has-sub:focus-within > ul { visibility: visible; opacity: 1; transform: none; }
.main-nav > ul > li.has-sub > ul > li { border-bottom: none; }
.main-nav > ul > li.has-sub > ul a { display: block; padding: 8px 12px; font-size: 14px; border-radius: 6px; }
.header-cta { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.header-phone { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.3; }
.header-phone .label { font-size: 12px; color: var(--text-light); }
.header-phone .num { font-size: 17px; font-weight: 700; color: var(--accent); }
.btn { display: inline-block; padding: 10px 22px; border-radius: 8px; font-size: 14px; font-weight: 600; cursor: pointer; border: none; transition: all .2s; }
.btn-primary { background: var(--accent); color: #fff; }
.btn-primary:hover { background: var(--accent-dark); }
.btn-outline { background: #fff; border: 1px solid var(--border); color: var(--text); }
.btn-outline:hover { border-color: var(--primary); color: var(--primary); }
.btn-lg { padding: 14px 32px; font-size: 16px; }

/* 汉堡 */
.nav-toggle { display: none; }
.nav-toggle-label {
  display: none; width: 42px; height: 42px;
  align-items: center; justify-content: center;
  cursor: pointer; border-radius: 8px;
  border: 1px solid var(--border); background: #fff;
  margin-left: auto; flex-shrink: 0;
}
.nav-toggle-label span { display: block; width: 20px; height: 2px; background: var(--text); position: relative; }
.nav-toggle-label span::before,
.nav-toggle-label span::after { content: ''; position: absolute; left: 0; width: 20px; height: 2px; background: var(--text); }
.nav-toggle-label span::before { top: -6px; }
.nav-toggle-label span::after { top: 6px; }

/* Hero */
.hero { background: var(--head-bg); padding: 72px 0 64px; }   /* 与内页 --head-bg 同色，此前各写各的 */
.hero-inner { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: center; }
.hero h1 { font-size: 38px; font-weight: 800; line-height: 1.3; margin-bottom: 16px; color: var(--text); }
.hero h1 .highlight { color: var(--primary); }
.hero p { font-size: 16px; color: var(--text-light); margin-bottom: 28px; max-width: 540px; }
.hero-actions { display: flex; gap: 14px; margin-bottom: 32px; flex-wrap: wrap; }
.hero-stats { display: flex; gap: 40px; flex-wrap: wrap; }
.hero-stats .stat .num { font-size: 28px; font-weight: 800; color: var(--primary); }
.hero-stats .stat .num small { font-size: 18px; }
.hero-stats .stat .label { font-size: 13px; color: var(--text-light); }
.hero-visual { background: #fff; border-radius: 16px; padding: 32px; box-shadow: var(--shadow-lg); }
.hero-visual .visual-title { font-size: 14px; color: var(--text-light); margin-bottom: 16px; }
.hero-visual .spec-list { display: flex; flex-direction: column; gap: 14px; }
.hero-visual .spec-item { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; background: var(--bg-soft); border-radius: 8px; font-size: 14px; }
.hero-visual .spec-item .k { color: var(--text-light); }
.hero-visual .spec-item .v { font-weight: 700; color: var(--primary); }

/* 区块 */
.section { padding: 72px 0; }
.section-soft { background: var(--bg-soft); }
.section-head { text-align: center; margin-bottom: 48px; }
.section-head .eyebrow { display: inline-block; font-size: 13px; font-weight: 600; color: var(--primary); background: var(--primary-light); padding: 4px 14px; border-radius: 20px; margin-bottom: 12px; letter-spacing: 1px; }
.section-head h2 { font-size: 32px; font-weight: 800; margin-bottom: 10px; }
.section-head p { color: var(--text-light); max-width: 640px; margin: 0 auto; }

/* grid-auto-rows:1fr = 所有行等高（不只是同一行内）。卡片内部走 flex 列，
   正文块 flex:1、按钮 margin-top:auto → 卡片被拉高时按钮贴底，不出现"内容浮在上半截"。
   改前实测：同一列表页第一行卡片 377.3、其余行 352.9，底部参差不齐。 */
.products-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--gap); grid-auto-rows: 1fr; }
/* 列表页 3 列：2 列时单卡 444 宽 → 4:3 图 333 高 → 整卡 527.9 高，
   而视口 900 下正文区可视高只有 616，**首屏连一张完整卡片都放不下**（实测 0/10）。
   改 3 列后单卡 289 宽、图 217 高、整卡约 417，首屏能完整看到一整行。 */
.products-grid--list { grid-template-columns: repeat(3, 1fr); }
.product-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; transition: all .25s; display: flex; flex-direction: column; }
.products-grid--list .product-card { box-shadow: var(--shadow); }
.product-card:hover { border-color: var(--primary); transform: translateY(-4px); box-shadow: var(--shadow-lg); }
/* 产品缩略图：全站统一 --thumb-ratio（4:3），高度由宽度算出来，不再各写固定 px。
   改前：首页卡固定 160px 高、列表卡固定 180px 高 → 同一张图在首页/列表/相关/详情
   是三种形状（1.71:1 / 2.23:1 / 1.33:1）；现在四个展示位形状一致。 */
.product-thumb { aspect-ratio: var(--thumb-ratio); background: var(--thumb-bg); display: flex; align-items: center; justify-content: center; color: var(--primary); font-size: 40px; font-weight: 800; overflow: hidden; }
.products-grid--list .product-thumb { font-size: 48px; }
.product-thumb img { width: 100%; height: 100%; object-fit: cover; }
.product-body { padding: 20px; flex: 1; display: flex; flex-direction: column; }
.products-grid--list .product-body { padding: 20px 22px; }
.product-body h3 { font-size: 16px; font-weight: 700; margin-bottom: 8px; line-height: 1.4; }
.products-grid--list .product-body h3 { font-size: 17px; }
.product-card:hover h3 { color: var(--primary); }
.product-body p { font-size: 13px; color: var(--text-light); margin-bottom: 12px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.product-body .summary { font-size: 14px; margin-bottom: 14px; }
.product-body .specs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.product-body .specs span { font-size: 12px; color: var(--primary); background: var(--primary-light); padding: 2px 10px; border-radius: 4px; }
.product-body .arrow { font-size: 13px; color: var(--primary); font-weight: 600; margin-top: auto; padding-top: 4px; }

.adv-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.adv-item { text-align: center; padding: 24px 16px; }
.adv-item .num { font-size: 40px; font-weight: 800; color: var(--primary); line-height: 1; margin-bottom: 8px; }
.adv-item .num small { font-size: 18px; }
.adv-item h3 { font-size: 16px; font-weight: 700; margin-bottom: 6px; }
.adv-item p { font-size: 14px; color: var(--text-light); }

.industry-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }
.industry-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 24px 12px; text-align: center; transition: all .2s; display: block; }
.industry-card:hover { border-color: var(--primary); transform: translateY(-3px); box-shadow: var(--shadow-lg); }
.industry-card .ico { font-size: 32px; margin-bottom: 10px; }
.industry-card h3 { font-size: 14px; font-weight: 600; }
.industry-card:hover h3 { color: var(--primary); }

.news-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--gap); grid-auto-rows: 1fr; }
/* 分类页（新闻/文章分类）的单列新闻列表版式 */
.news-list--page { grid-template-columns: 1fr; }
.news-list--page .news-card { padding: 22px 24px; }
.news-card .arrow { font-size: 13px; color: var(--primary); font-weight: 600; margin-top: auto; padding-top: 12px; }
.news-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 24px; transition: all .25s; display: flex; flex-direction: column; }
.news-card:hover { border-color: var(--primary); transform: translateY(-3px); box-shadow: var(--shadow-lg); }
.news-card .date { font-size: 13px; color: var(--text-light); margin-bottom: 10px; }
.news-card h3 { font-size: 16px; font-weight: 700; margin-bottom: 10px; line-height: 1.5; }
.news-card:hover h3 { color: var(--primary); }
.news-card p { font-size: 14px; color: var(--text-light); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

.cta-section { background: linear-gradient(135deg, var(--primary), var(--primary-dark)); color: #fff; padding: 64px 0; text-align: center; }
.cta-section h2 { font-size: 30px; font-weight: 800; margin-bottom: 12px; }
.cta-section p { color: var(--text-on-dark); margin-bottom: 28px; max-width: 600px; margin-left: auto; margin-right: auto; }
.cta-section .btn-primary { background: var(--accent); }
.cta-section .btn-primary:hover { background: var(--accent-dark); }
.cta-section .btn-outline { background: transparent; color: #fff; border-color: rgba(255,255,255,0.3); }
.cta-actions { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; }

.kw-footer { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 24px; box-shadow: var(--shadow); }
.kw-footer h3 { font-size: 15px; font-weight: 700; margin-bottom: 14px; }
.kw-footer .kw-links { display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: 13px; }
.kw-footer .kw-links a { color: var(--text-light); }
.kw-footer .kw-links a:hover { color: var(--primary); }

.site-footer { background: var(--footer-bg); color: var(--text-muted); padding: 56px 0 0; font-size: 14px; }
.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.2fr; gap: 40px; padding-bottom: 40px; border-bottom: 1px solid var(--footer-border); }
.footer-brand .logo { color: #fff; margin-bottom: 16px; }
.footer-brand .logo-mark { background: var(--primary); }
.footer-brand p { font-size: 14px; line-height: 1.8; margin-bottom: 16px; }
.footer-col h4 { color: #fff; font-size: 15px; font-weight: 700; margin-bottom: 18px; }
.footer-col ul li { margin-bottom: 10px; }
.footer-col a:hover { color: #fff; }
.footer-contact li { display: flex; gap: 8px; margin-bottom: 12px; }
.footer-contact .ico { color: var(--primary); flex-shrink: 0; }
.footer-contact a { color: var(--accent); font-weight: 600; }
.footer-bottom { padding: 20px 0; text-align: center; font-size: 13px; color: var(--text-light); }

/* 悬浮拨号 */
.mobile-call-bar { display: none; }

/* ============ 内页外壳（全站统一，两段式）============
   所有内页共用同一套外壳：<main class="page"> → <header class="page-head"> + <div class="page-body">
     列表页 / 产品详情 / 文章详情 / 静态页 / 相册页 都是这个结构，只是页头里放的东西不同。
   面包屑与 H1 的落位完全由 --page-pad 决定 —— 改前三类页面分别是 141/149/157，
   切页时首行会上下跳 8~16px；现在全站同一位置，页间不再跳位。 */
.page { background: var(--bg-soft); }
.page-head { background: var(--head-bg); padding: var(--page-pad) 0; border-bottom: 1px solid var(--border); }
.page-head h1 { font-size: 30px; font-weight: 800; line-height: 1.35; }
.page-body { padding: var(--page-pad) 0; }
/* 分类简介 / 搜索统计这类「本页内容」直接放进 .main-col 内部，不再单独用工具条 ——
   放外面会把 .layout 起点往下压，页面之间又出现高度差（实测搜索页曾比别人低 49.5px）。
   ⚠️ 同样绝不能放回 .page-head：页头带只允许「面包屑 + H1」两件恒定内容。 */
.page-lead { color: var(--text-light); max-width: 760px; margin: 0 0 16px; }
.breadcrumb { font-size: 14px; color: var(--text-light); margin-bottom: 14px; }
.breadcrumb a { color: var(--text-light); }
.breadcrumb a:hover { color: var(--primary); }
.breadcrumb span { margin: 0 6px; }
.layout { display: flex; gap: 32px; align-items: flex-start; }
.main-col { flex: 1; min-width: 0; }
/* ============ 左侧栏目导航（全站内页恒定：分类树）============
   为什么放在左侧而不是原来的右侧栏：
   ① 分类树在所有内页都出现、内容恒定 → 页面骨架锁死，不会"这页有那页没有"；
   ② 220px 比原右侧栏 300px 窄，让出的 80px 全归正文 → 产品卡/正文同时变宽。
   注：原「联系我们」小卡已按需求移除（手机端底部拨号条 + 页脚联系栏仍在）。 */
.side-nav { width: 220px; flex-shrink: 0; }
.side-tree {
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius);
  padding: 6px; margin-bottom: var(--gap); box-shadow: var(--shadow);
}
.side-tree > summary {
  display: flex; align-items: center; justify-content: space-between;
  font-size: 15px; font-weight: 700; padding: 12px 12px 10px;
  border-bottom: 1px solid var(--border); margin-bottom: 6px;
  list-style: none; cursor: pointer;
}
.side-tree > summary::-webkit-details-marker { display: none; }
.side-tree > summary::after {
  content: ""; width: 7px; height: 7px; margin-right: 4px;
  border-right: 1.5px solid var(--text-light); border-bottom: 1.5px solid var(--text-light);
  transform: rotate(45deg); transition: transform .2s;
}
.side-tree[open] > summary::after { transform: rotate(-135deg); }
.side-tree ul { list-style: none; margin: 0; padding: 0; }
.side-tree li a {
  display: block; padding: 9px 12px; border-radius: 6px;
  font-size: 14px; line-height: 1.4; color: var(--text);
}
.side-tree li a:hover { background: var(--primary-light); color: var(--primary); }
/* 层级缩进：子分类比父级缩进 14px 并降一档字号，一眼看出归属 */
.side-tree li.d1 a { padding-left: 26px; font-size: 13.5px; color: var(--text-light); }
.side-tree li.d2 a { padding-left: 40px; font-size: 13.5px; color: var(--text-light); }
.side-tree li.d3 a { padding-left: 54px; font-size: 13.5px; color: var(--text-light); }
/* 当前分类实心高亮；它在子孙链上的祖先用主色文字（看清自己站在哪条线上） */
.side-tree li a.is-current { background: var(--primary); color: #fff; font-weight: 500; }
.side-tree li a.is-current:hover { background: var(--primary); color: #fff; }
.side-tree li a.is-path { color: var(--primary); font-weight: 500; }

.pagination { display: flex; justify-content: center; gap: 6px; padding: 32px 0 24px; }
.pagination a, .pagination span, .pagination .page { padding: 8px 14px; border-radius: 6px; font-size: 14px; border: 1px solid var(--border); background: #fff; display: inline-block; }
.pagination a:hover { border-color: var(--primary); color: var(--primary); }
.pagination .now-page { background: var(--primary); color: #fff; border-color: var(--primary); }
.pager { flex-wrap: wrap; align-items: center; }
.pager a, .pager span { white-space: nowrap; }
.pager .pager-prev, .pager .pager-next { min-width: 86px; text-align: center; font-weight: 500; }
.pager a.pager-prev:hover, .pager a.pager-next:hover { background: var(--primary); color: #fff; }
.pager .is-disabled { color: var(--text-disabled); background: var(--bg-disabled); border-color: var(--border); cursor: not-allowed; }
.pager .pager-total { border: none; background: none; color: var(--text-light); font-size: 13px; padding: 8px 4px; }

/* 404 页 */
.notfound { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); padding: 64px 40px; text-align: center; margin: 0 auto; max-width: 720px; }
.notfound-code { font-size: 72px; font-weight: 800; color: var(--primary); line-height: 1; margin-bottom: 8px; }
.notfound-desc { color: var(--text-light); margin-bottom: 28px; }
.notfound-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-bottom: 32px; }
.notfound-nav ul { display: flex; flex-wrap: wrap; gap: 10px 18px; justify-content: center; list-style: none; padding: 20px 0 0; border-top: 1px solid var(--border); }
.notfound-nav a { color: var(--text-light); font-size: 14px; }
.notfound-nav a:hover { color: var(--primary); }
/* 404 页搜索框：让被 404 的用户能直接搜，而不只是返回首页 */
.notfound-search { display: flex; gap: 10px; justify-content: center; max-width: 460px; margin: 0 auto 32px; }
.notfound-search .nf-search-input { flex: 1; height: 44px; padding: 0 16px; border: 1px solid var(--border); border-radius: var(--radius); font-size: 15px; color: var(--text); background: #fff; box-sizing: border-box; }
.notfound-search .nf-search-input:focus { outline: none; border-color: var(--primary); }
.notfound-search .btn { display: inline-flex; align-items: center; }

@media (max-width: 700px) {
  /* 手机端一行三段式：上一页 | 第X页/共Y页 | 下一页，页码数字隐藏（页数多时必换行错位） */
  .pager { flex-wrap: nowrap; gap: 8px; }
  .pager .pager-num { display: none; }
  .pager .pager-prev, .pager .pager-next { flex: 1; min-width: 0; text-align: center; }
  .pager .pager-prev { order: 0; }
  .pager .pager-next { order: 2; }
   .pager .pager-total { order: 1; flex: 0 0 auto; width: auto; padding: 8px 0; font-size: 12px; }
   /* 手机端翻页条：不显示文章标题（任何长度都不可能撑破布局），只留方向短词 */
   .pn-bar { padding: 12px 16px; gap: 12px; }
   .pn-bar .pn-title { display: none !important; }
   .pn-bar .pn-item { align-items: center; text-align: center; }
   .pn-bar .pn-prev { align-items: flex-start; text-align: left; }
   .pn-bar .pn-next { align-items: flex-end; text-align: right; }
   .pn-bar .pn-label { font-size: 13px; }
}

.hot-list li { padding: 10px 0; border-bottom: 1px solid var(--border); font-size: 14px; display: flex; gap: 10px; }
.hot-list li:last-child { border-bottom: none; }
.hot-list .num { width: 20px; height: 20px; background: var(--bg-soft); color: var(--text-light); border-radius: 4px; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 600; flex-shrink: 0; margin-top: 2px; }
.hot-list li:nth-child(1) .num { background: var(--accent); color: #fff; }
.hot-list li:nth-child(2) .num { background: var(--accent-400); color: #fff; }
.hot-list li:nth-child(3) .num { background: var(--accent-300); color: #fff; }
.hot-list a { flex: 1; }
.hot-list a:hover { color: var(--primary); }
.tag-cloud { display: flex; flex-wrap: wrap; gap: 8px; }
.tag-cloud a { font-size: 13px; padding: 5px 12px; border-radius: 6px; background: var(--bg-soft); color: var(--text-light); }
.tag-cloud a:hover { background: var(--primary-light); color: var(--primary); }
.latest-list li { padding: 12px 0; border-bottom: 1px solid var(--border); }
.latest-list li:last-child { border-bottom: none; }
.latest-list a { font-size: 14px; line-height: 1.5; display: block; margin-bottom: 4px; }
.latest-list a:hover { color: var(--primary); }
.latest-list .date { font-size: 12px; color: var(--text-light); }

/* ============ 产品详情页 ============ */
.product-main {
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius);
  padding: 28px 32px; box-shadow: var(--shadow);
  display: grid; grid-template-columns: 1fr 1fr; gap: 36px; margin-bottom: 24px;
}
/* 文章页信息区：没配图时单列，不渲染空占位块 */
.product-main--text { grid-template-columns: 1fr; }
/* 产品详情页专属：整块高度对齐内容最全的那篇（9931 实测 501.38px），换产品时版块不再上下跳。
   用 min-height 而不是 height —— 标题行数 / 卖点条数 / 参数行数都是变量，锁死必然溢出裁剪。
   501 = 9931 内容区 443.38 + 上下 padding 28×2 + 边框 1×2，取整；短内容的产品撑到同一高度。
   ⚠️ 只挂在产品页容器上（模板 single.php 的产品分支）；文章页的 .product-main 不加，保持原状。
   右栏没填参数/卖点时，缺的那块自然留白，不再输出任何占位内容。 */
.product-main--prod { min-height: 501px; }
.product-image-wrap {
  width: 100%; aspect-ratio: var(--thumb-ratio);
  /* 图保持 4:3（全站统一，不跟着信息区变形），在 grid 行里垂直居中。
     2026-09-21 备注：曾试过"图 stretch 填满整行"（方案 A），用户判定"还没原版好看"→ 已回退。
     整块高度的统一改由 .product-main--prod 的 min-height 承担，图本身不再拉伸变形。 */
  align-self: center;
  background: var(--thumb-bg);
  border-radius: 10px; display: flex; align-items: center; justify-content: center;
  position: relative;
  color: var(--primary); font-size: 32px; font-weight: 800;
  border: 1px solid var(--border); overflow: hidden;
}
.product-image-wrap img { width: 100%; height: 100%; object-fit: cover; display: block; }
.product-image-wrap .placeholder-text { text-align: center; line-height: 1.4; padding: 20px; }
.product-image-wrap .placeholder-text small { display: block; font-size: 13px; font-weight: 400; color: var(--text-light); margin-top: 8px; }
.product-info { display: flex; flex-direction: column; }
.product-info h1 { font-size: 26px; font-weight: 800; line-height: 1.4; margin-bottom: 12px; }
.product-info .product-tagline { font-size: 14px; color: var(--text-light); padding-bottom: 16px; border-bottom: 1px dashed var(--border); margin-bottom: 18px; }
.product-highlights { margin-bottom: 20px; }
.product-highlights li { display: flex; gap: 10px; padding: 7px 0; font-size: 14px; color: var(--text); }
.product-highlights li::before {
  content: "✓"; display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px; background: var(--primary-light); color: var(--primary);
  border-radius: 50%; font-size: 12px; font-weight: 700; flex-shrink: 0; margin-top: 3px;
}
.product-key-specs { background: var(--bg-soft); border-radius: 8px; padding: 14px 18px; margin-bottom: 20px; }
.product-key-specs .row { display: flex; justify-content: space-between; padding: 6px 0; font-size: 14px; border-bottom: 1px dashed var(--border); }
.product-key-specs .row:last-child { border-bottom: none; }
.product-key-specs .row .k { color: var(--text-light); }
.product-key-specs .row .v { font-weight: 700; color: var(--primary); }
/* margin-top:auto = 按钮组贴到信息区底部（原版写法，随方案 A 回退一并恢复）。
   下方没有内容时，多出来的空间留在按钮上方，与左图垂直居中的留白呼应。 */
.product-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: auto; padding-top: 8px; }
.product-actions .btn { flex: 1; min-width: 140px; text-align: center; }

/* Tab 切换（纯 CSS） */
.tabs { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); margin-bottom: 24px; overflow: hidden; }
.tabs input { display: none; }
.tabs-label { display: flex; border-bottom: 1px solid var(--border); background: var(--bg-soft); }
.tabs-label label { flex: 1; padding: 16px 20px; text-align: center; font-size: 15px; font-weight: 600; color: var(--text-light); cursor: pointer; border-bottom: 2px solid transparent; transition: all .2s; }
.tabs-label label:hover { color: var(--primary); }
.tab-panel { display: none; padding: 28px var(--content-pad); }
#tab1:checked ~ .tabs-label label:nth-child(1),
#tab2:checked ~ .tabs-label label:nth-child(2),
#tab3:checked ~ .tabs-label label:nth-child(3) { color: var(--primary); border-bottom-color: var(--primary); background: #fff; }
#tab1:checked ~ .panel1,
#tab2:checked ~ .panel2,
#tab3:checked ~ .panel3 { display: block; }
.tab-panel h2 { font-size: 20px; font-weight: 700; color: var(--text); margin: 24px 0 14px; padding-left: 12px; border-left: 4px solid var(--primary); }
.tab-panel h2:first-child { margin-top: 0; }
.tab-panel h3 { font-size: 17px; font-weight: 700; color: var(--text); margin: 20px 0 10px; }
.tab-panel p { margin-bottom: 16px; font-size: 15px; line-height: 1.9; color: var(--text-2); }
.tab-panel ul, .tab-panel ol { margin: 0 0 16px 22px; }
.tab-panel ul { list-style: disc; }
.tab-panel ol { list-style: decimal; }
.tab-panel li { margin-bottom: 8px; font-size: 15px; color: var(--text-2); }
.tab-panel strong { color: var(--text); font-weight: 700; }
.tab-panel blockquote { background: var(--primary-light); border-left: 4px solid var(--primary); padding: 14px 18px; margin: 16px 0; border-radius: 6px; font-size: 14px; color: var(--text); }
.tab-panel blockquote a { color: var(--primary); font-weight: 700; }

.spec-table { width: 100%; border-collapse: collapse; margin: 12px 0 24px; border-radius: 8px; overflow: hidden; border: 1px solid var(--border); }
.spec-table th, .spec-table td { padding: 12px 18px; font-size: 14px; text-align: left; border-bottom: 1px solid var(--border); }
.spec-table th { background: var(--bg-soft); color: var(--text); font-weight: 600; width: 160px; }
.spec-table tr:last-child th, .spec-table tr:last-child td { border-bottom: none; }

/* ============ 相关（产品/文章通用） ============ */
.related-section { margin-top: 32px; }
.related-section h2 { font-size: 20px; font-weight: 700; margin-bottom: 20px; }
.related-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--gap); grid-auto-rows: 1fr; }
.related-grid--3 { grid-template-columns: repeat(3, 1fr); }
.related-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); transition: all .2s; display: flex; flex-direction: column; }
.related-card:hover { border-color: var(--primary); transform: translateY(-3px); box-shadow: var(--shadow-lg); }
.related-card .thumb { aspect-ratio: var(--thumb-ratio); background: var(--thumb-bg); display: flex; align-items: center; justify-content: center; color: var(--primary); font-size: 22px; font-weight: 800; overflow: hidden; }
.related-card .thumb img { width: 100%; height: 100%; object-fit: cover; }
.related-card .body { padding: 14px 16px; flex: 1; }
.related-card h3 { font-size: 15px; font-weight: 700; line-height: 1.5; margin-bottom: 6px; }
.related-card:hover h3 { color: var(--primary); }
.related-card p { font-size: 13px; color: var(--text-light); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.related-card .date { font-size: 13px; color: var(--text-light); margin-bottom: 8px; }
.related-card--pad { padding: 20px; }

/* ============ 文章详情页 ============ */
/* 正文卡左右内距走 --content-pad：原来这里是 48px，而产品详情页的 tab 面板是 32px，
   同一主栏里正文宽度一个 810 一个 842 —— 又是"各写各的"。统一到同一个 token。 */
.post-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 40px var(--content-pad); box-shadow: var(--shadow); }
.post-card h1 { font-size: 28px; font-weight: 800; line-height: 1.4; margin-bottom: 18px; }
/* 正文后的补充块：完整参数表 / 应用场景 */
.post-specs, .post-scene { margin-top: 32px; }
.post-meta { display: flex; flex-wrap: wrap; gap: 18px; font-size: 14px; color: var(--text-light); padding-bottom: 20px; border-bottom: 1px solid var(--border); margin-bottom: 28px; }
.post-meta .cat { color: var(--primary); background: var(--primary-light); padding: 2px 12px; border-radius: 20px; font-weight: 500; }
.post-content { font-size: 16px; line-height: 1.9; color: var(--text-2); overflow-wrap: break-word; word-break: break-word; }
/* 长串无空格内容（连续数字/字母/重复字符）强制可断行，防止撑破容器 */
.post-content p, .post-content li, .news-card h3, .news-card .intro, .product-card h3, .post-card h1 { overflow-wrap: anywhere; }
.post-content p { margin-bottom: 20px; }
.post-content h2 { font-size: 22px; font-weight: 700; color: var(--text); margin: 32px 0 16px; padding-left: 14px; border-left: 4px solid var(--primary); }
.post-content h3 { font-size: 18px; font-weight: 700; color: var(--text); margin: 24px 0 12px; }
.post-content ul, .post-content ol { margin: 0 0 20px 24px; }
.post-content ul { list-style: disc; }
.post-content ol { list-style: decimal; }
.post-content li { margin-bottom: 8px; }
.post-content blockquote { background: var(--primary-light); border-left: 4px solid var(--primary); padding: 16px 20px; margin: 20px 0; border-radius: 6px; color: var(--text); font-size: 15px; }
.post-content strong { color: var(--text); font-weight: 700; }
.author-box { margin-top: 32px; padding: 20px 24px; background: var(--bg-soft); border-radius: 8px; font-size: 14px; color: var(--text-light); }
.author-box p { margin-bottom: 8px; }
.author-box p:last-child { margin-bottom: 0; }
.author-box strong { color: var(--text); }
.author-box a { color: var(--accent); font-weight: 700; }
.post-tags { margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--border); display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.post-tags .label { font-size: 14px; color: var(--text-light); margin-right: 6px; }
.post-tags a { font-size: 13px; color: var(--primary); background: var(--primary-light); padding: 4px 14px; border-radius: 20px; }
.post-tags a:hover { background: var(--primary); color: #fff; }
.pn-bar { display: flex; align-items: stretch; margin-top: 24px; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 12px 18px; box-shadow: var(--shadow); }
.pn-item { flex: 1 1 0%; min-width: 0; overflow: hidden; display: flex; flex-direction: column; gap: 2px; }
.pn-prev { padding-right: 18px; border-right: 1px solid var(--border); }
.pn-next { padding-left: 18px; text-align: right; align-items: flex-end; }
.pn-label { font-size: 12px; color: var(--text-light); }
.pn-title { display: block; max-width: 100%; font-size: 14px; font-weight: 500; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pn-item:hover .pn-title { color: var(--primary); }
.pn-item.is-off .pn-label { color: var(--text-disabled); }
.pn-item.is-off .pn-title { color: var(--text-disabled); font-weight: 400; }

/* ============ 常见问题（可选配置，GEO FAQPage 配套展示） ============ */
.faq-block { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 28px 32px; box-shadow: var(--shadow); margin-bottom: 24px; }
.faq-block > h2 { font-size: 20px; font-weight: 700; margin-bottom: 16px; }
.faq-item { padding: 14px 0; border-bottom: 1px dashed var(--border); }
.faq-item:last-child { border-bottom: none; }
.faq-item h3 { font-size: 15px; font-weight: 700; margin-bottom: 6px; }
.faq-item .faq-a { font-size: 14px; color: var(--text-light); }

.empty-tip { text-align: center; color: var(--text-light); padding: 40px 0; font-size: 14px; }

/* ============ 响应式 ============ */
@media (max-width: 1000px) {
  .hero-inner { grid-template-columns: 1fr; gap: 32px; }
  .hero-visual { display: none; }
  .products-grid { grid-template-columns: repeat(2, 1fr); }
  .products-grid--list { grid-template-columns: repeat(2, 1fr); }
  .adv-grid { grid-template-columns: repeat(2, 1fr); }
  .industry-grid { grid-template-columns: repeat(3, 1fr); }
  /* 收成单列后「等高」失去意义（卡片不并排），反而把内容少的卡片拉出大片空白 → 恢复自然高度 */
  .news-list { grid-template-columns: 1fr; grid-auto-rows: auto; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .related-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
  /* 转成 column 后交叉轴是「横向」：必须 stretch，否则 .main-col 会退化成按内容宽度，
     列表内容一少就缩窄（产品筛选后只剩一两张卡时最明显，右侧凭空留白） */
  .layout { flex-direction: column; align-items: stretch; }
  /* 手机端：左栏整体挪到正文之后（内容优先，分类树与联系方式不占首屏） */
  .side-nav { width: 100%; order: 2; }
  .main-col { order: 1; }
  .related-grid--3 { grid-template-columns: 1fr; }
  .product-main { grid-template-columns: 1fr; gap: 20px; padding: 22px; }
  /* 手机端单列竖排：产品页那块 min-height 失去意义（图文上下排，撑高只会多出一段空白），归零 */
  .product-main--prod { min-height: 0; }
  .product-info h1 { font-size: 22px; }
  /* 手机/平板导航：汉堡点开 = 页头下缘弹出全宽白色面板（不挤占页头行） */
  .header-inner { height: 64px; gap: 12px; }
  .nav-toggle-label { display: flex; }
  .main-nav { display: none; position: absolute; top: 100%; left: 0; right: 0; background: #fff; border-top: 1px solid var(--border); box-shadow: 0 14px 24px rgba(15,23,42,.12); padding: 4px 20px 10px; z-index: 99; }
  .nav-toggle:checked ~ .main-nav { display: block; }
  .main-nav ul { flex-direction: column; gap: 0; flex-wrap: nowrap; }
  .main-nav li { border-bottom: 1px solid var(--border); }
  .main-nav li:last-child { border-bottom: none; }
  .main-nav a { display: block; padding: 13px 4px; font-size: 15px; border-radius: 0; }
  .main-nav a:hover, .main-nav a.active { background: none; color: var(--primary); }
  /* 二级菜单 · 手机端：手风琴。默认全部收起，点一级项整行展开/收起（脚本给 .open）
     用 max-height 过渡而不是 display:none —— 子项链接始终留在 DOM 里，爬虫照常抓取，不影响收录 */
  .main-nav > ul > li.has-sub > a { position: relative; padding-right: 34px; }
  .main-nav > ul > li.has-sub > a::after { content: ''; position: absolute; right: 12px; top: 50%; width: 7px; height: 7px; margin-top: -5px; border-right: 1.5px solid var(--text-light); border-bottom: 1.5px solid var(--text-light); transform: rotate(45deg); transition: transform .25s, border-color .25s; }
  .main-nav > ul > li.has-sub.open > a { color: var(--primary); }
  .main-nav > ul > li.has-sub.open > a::after { border-color: var(--primary); transform: rotate(225deg); }
  .main-nav > ul > li.has-sub > ul { position: static; display: block; visibility: visible; opacity: 1; transform: none; min-width: 0; gap: 0; max-height: 0; overflow: hidden; padding: 0 8px; margin: 0; background: var(--bg-soft); border: none; box-shadow: none; border-radius: 8px; transition: max-height .28s ease; }
  .main-nav > ul > li.has-sub > ul::before { display: none; }
  .main-nav > ul > li.has-sub > ul > li { border-bottom: none; }
  .main-nav > ul > li.has-sub > ul a { padding: 10px 12px; font-size: 14px; color: var(--text-light); }
  .header-cta { gap: 8px; margin-left: 0; }
  .header-phone .label { display: none; }
  .header-phone .num { font-size: 15px; }
  .header-cta .btn { padding: 8px 16px; font-size: 13px; }
}
@media (max-width: 700px) {
  /* 顶栏整条隐藏：联系方式与页头/底部拨号条重复，手机端不占首屏 */
  .topbar { display: none; }
  .header-inner { gap: 8px; }
  .logo { font-size: 18px; gap: 8px; }
  .logo-mark { width: 34px; height: 34px; font-size: 17px; }
  .logo-text em { font-size: 10px; letter-spacing: 0.5px; }
  .header-cta { display: none; }
  .hero { padding: 40px 0 36px; }
  .hero h1 { font-size: 24px; line-height: 1.35; }
  .hero p { font-size: 14px; margin-bottom: 20px; }
  /* 页内电话/微信按钮与底部拨号条重复，手机端全部去掉，联系入口只留底部一条 */
  .hero-actions { display: none; }
  .hero-stats { gap: 20px; }
  .hero-stats .stat .num { font-size: 22px; }
  .hero-stats .stat .label { font-size: 12px; }
  .section { padding: 44px 0; }
  .section-head { margin-bottom: 28px; }
  .section-head h2 { font-size: 22px; }
  .section-head p { font-size: 14px; }
  /* 单列竖排：同样取消等高（理由见上），卡片按自己内容高度收尾 */
  .products-grid { grid-template-columns: 1fr; grid-auto-rows: auto; }
  .products-grid--list { grid-template-columns: 1fr; }
  .product-thumb { font-size: 36px; }
  .products-grid--list .product-thumb { font-size: 38px; }
  .adv-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .adv-item { padding: 16px 8px; }
  .adv-item .num { font-size: 28px; }
  .adv-item h3 { font-size: 14px; }
  .adv-item p { font-size: 12px; }
  .industry-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .industry-card { padding: 18px 8px; }
  .industry-card .ico { font-size: 26px; margin-bottom: 6px; }
  .industry-card h3 { font-size: 13px; }
  .news-card { padding: 18px; }
  .news-card h3 { font-size: 15px; }
  .cta-section { padding: 44px 0; }
  .cta-section h2 { font-size: 22px; }
  .cta-section p { font-size: 14px; }
  /* CTA 区的电话/微信按钮与底部拨号条重复，手机端去掉按钮只留文案 */
  .cta-actions { display: none; }
  /* 手机端版式 token：与 PC 同一批变量，只改值 —— 页面/组件不需要各写各的断点数字 */
  :root { --page-pad: 26px; --gap: 14px; }
  .page-head h1 { font-size: 22px; }
  .breadcrumb { font-size: 13px; margin-bottom: 12px; }
  .product-main { padding: 18px; }
  .product-image-wrap { font-size: 22px; }
  .product-image-wrap .placeholder-text small { font-size: 12px; }
  .product-info h1 { font-size: 19px; }
  .product-info .product-tagline { font-size: 13px; padding-bottom: 12px; margin-bottom: 14px; }
  .product-highlights li { font-size: 13px; padding: 5px 0; }
  .product-key-specs { padding: 12px 14px; margin-bottom: 16px; }
  .product-key-specs .row { font-size: 13px; }
  /* 产品页咨询按钮（立即咨询/微信咨询）与底部拨号条重复，手机端去掉 */
  .product-actions { display: none; }
  .tabs-label label { padding: 13px 8px; font-size: 13px; }
  .tab-panel { padding: 18px; }
  .tab-panel h2 { font-size: 17px; margin: 20px 0 12px; }
  .tab-panel p, .tab-panel li { font-size: 14px; }
  .spec-table th, .spec-table td { padding: 10px 12px; font-size: 13px; }
  .spec-table th { width: 100px; }
  .spec-table { display: block; overflow-x: auto; }
  .related-grid { grid-template-columns: 1fr 1fr; }
  .related-card h3 { font-size: 13px; }
  .related-card p { font-size: 12px; }
  .post-card { padding: 22px 18px; }
  .post-card h1 { font-size: 20px; }
  .post-content { font-size: 15px; }
  .post-content h2 { font-size: 17px; }
  /* 正文里的表格/代码块在窄屏内滚动，不撑破页面 */
  .post-content table { display: block; overflow-x: auto; }
  .post-content pre { overflow-x: auto; }
  /* 手机端页脚极简：logo 一行 + 联系方式 + 版权行；公司简介与站内导航列隐藏（导航已在汉堡菜单） */
  .site-footer { padding: 28px 0 0; font-size: 13px; }
  .footer-grid { grid-template-columns: 1fr; gap: 0; padding-bottom: 16px; }
  .footer-brand { grid-column: 1 / -1; padding-bottom: 14px; border-bottom: 1px solid var(--footer-border); }
  .footer-brand .logo { margin-bottom: 0; }
  .footer-brand p { display: none; }
  .footer-grid > .footer-col:nth-child(2),
  .footer-grid > .footer-col:nth-child(3) { display: none; }
  .footer-col h4 { font-size: 13px; color: var(--text-on-dark); margin: 14px 0 10px; }
  .footer-contact { grid-column: 1 / -1; }
  .footer-contact li { margin-bottom: 9px; align-items: flex-start; }
  .footer-bottom { padding: 12px 0; font-size: 12px; line-height: 1.6; }
  .mobile-call-bar {
    display: flex; position: fixed; bottom: 0; left: 0; right: 0;
    z-index: 999; box-shadow: 0 -2px 12px rgba(0,0,0,0.15);
  }
  .mobile-call-bar a {
    flex: 1; display: flex; align-items: center; justify-content: center;
    gap: 8px; padding: 15px 0; font-size: 16px; font-weight: 700;
    background: var(--accent); color: #fff;
  }
  .mobile-call-bar a:active { background: var(--accent-dark); }
  body { padding-bottom: 56px; }
}

/* ===== 站内搜索框（corp599 追加 · 全部为新增选择器，不覆盖任何既有规则） =====
   图标规格**逐条抄自 .main-nav a**：display:inline / padding:8px 14px / radius 6px / 15px 字号 /
   无边框无底色 / hover 同款浅蓝底 —— 让浏览器用同一套盒模型算出同一个背景盒（实测两者 36px、top 完全一致）。
   展开层绝对定位，不占 flex 空间 → 永不挤压 logo / 导航 / 电话按钮。
   关闭：CSS 里靠 checkbox 再次点击；JS 补上「点页面空白处 / ESC / 提交后」三种关闭。
   本段为新增选择器（.site-search / .search-* 前缀），与既有规则无重叠，不依赖书写顺序。 */
/* margin-left:auto：nav 是 flex:1 撑满整行，图标借此被推到导航行的最右端（紧邻右侧电话区）。 */
.site-search { position: relative; display: block; flex-shrink: 0; order: 2; margin-left: auto; }
.site-search .search-toggle { display: none; }
/* ⚠ 图标必须是「行内元素」，且规格逐条照抄 .main-nav a —— 这是两者 hover 背景盒完全重合的唯一办法。
   原因：.main-nav a 是 display:inline，行内元素的背景盒 = 字体自身高度(ascent+descent≈20px) + 上下 padding(16px) = 36px，
        并且会向行框外溢出（上溢 5.25px、下溢 2.75px）。
   若图标用 flex / 固定 min-height（第一版的写法），走的是另一套盒模型（34px、且被居中在行框内）
   → 实测两者相差 2px 高、整体上下错位 6px，用户一眼看出「背景不一样高」。
   故此处用 display:inline + 与 .main-nav a 完全相同的 padding / font-size / border-radius，
   让浏览器用同一套规则算出同一个盒子；不要给固定宽高、不要改 line-height。
   另：两个图标 span 字号必须一致，否则展开态（×）的字体高度不同 → 盒子高度又变。 */
.site-search .search-icon {
  display: inline;
  padding: 8px 14px; border-radius: 6px;
  color: var(--text-light);
  font-size: 15px; cursor: pointer;
  transition: color .15s, background .15s;
}
.site-search .search-icon:hover { background: var(--primary-light); color: var(--primary); }
.site-search .ico-close { display: none; }
.site-search .search-toggle:checked ~ .search-icon .ico-search { display: none; }
.site-search .search-toggle:checked ~ .search-icon .ico-close { display: inline; }
.site-search .search-box {
  display: none; position: absolute; top: calc(100% + 14px); right: 0; z-index: 101;
  width: 320px; padding: 10px; align-items: center; gap: 8px;
  background: var(--bg); border: 1px solid var(--border);
  border-radius: var(--radius); box-shadow: var(--shadow-lg);
}
.site-search .search-toggle:checked ~ .search-box { display: flex; }
.site-search .search-input {
  flex: 1; min-width: 0; height: 36px; padding: 0 12px;
  border: 1px solid var(--border); border-radius: var(--radius);
  background: var(--bg-soft); color: var(--text); font-size: 14px; outline: none;
  transition: border-color .15s, background .15s;
}
.site-search .search-input:focus { border-color: var(--primary); background: var(--bg); }
.site-search .search-btn {
  flex-shrink: 0; height: 36px; padding: 0 16px; border: none; border-radius: var(--radius);
  background: var(--primary); color: #fff; font-size: 14px; cursor: pointer;
  transition: background .15s;
}
.site-search .search-btn:hover { background: var(--primary-dark); }

@media (max-width: 900px) {
  .site-search {
    position: static; order: 0; width: 100%; margin-left: 0;
    padding: 12px 0; border-bottom: 1px solid var(--border);
  }
  .site-search .search-icon { display: none; }
  .site-search .search-box {
    display: flex; position: static; width: auto;
    padding: 0; border: none; border-radius: 0; box-shadow: none; background: none;
  }
  .site-search .search-input { width: 100%; }
}

/* ============================================================
   图片画廊页（gallery 模板）：分组 Tab + 响应式网格 + 点击灯箱
   配色走 CSS 变量；网格缩略图由 thumb.php 生成，点开灯箱才加载原图
   ============================================================ */
.gallery-intro { color: var(--text-light); font-size: 15px; line-height: 1.9; margin: 0 0 22px; }
.gallery-tabs { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 22px; }
.gallery-tab {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 18px; border: 1px solid var(--border); border-radius: 999px;
  background: #fff; color: var(--text-light); font-size: 14px; font-family: inherit;
  cursor: pointer; transition: all .2s;
}
.gallery-tab em { font-style: normal; font-size: 12px; opacity: .85; }
.gallery-tab:hover { border-color: var(--primary); color: var(--primary); }
.gallery-tab.is-active { background: var(--primary); border-color: var(--primary); color: #fff; }
.gallery-tab.is-active em { color: rgba(255,255,255,.8); }

.gallery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; align-items: start; }
.gallery-item {
  margin: 0; background: #fff; border: 1px solid var(--border); border-radius: var(--radius);
  overflow: hidden; box-shadow: var(--shadow); transition: box-shadow .2s, transform .2s;
}
.gallery-item:hover { box-shadow: var(--shadow-lg); transform: translateY(-2px); }
.gallery-link { display: block; position: relative; background: var(--bg-soft); min-height: 140px; cursor: zoom-in; }
.gallery-link img { display: block; width: 100%; height: auto; }
.gallery-link::after { content: ""; position: absolute; inset: 0; background: rgba(15,23,42,0); transition: background .2s; }
.gallery-item:hover .gallery-link::after { background: rgba(15,23,42,.12); }
.gallery-item figcaption {
  padding: 10px 14px; font-size: 13px; color: var(--text-light);
  border-top: 1px solid var(--border); background: #fff;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.gallery-empty { color: var(--text-light); font-size: 15px; padding: 8px 0 4px; }

/* 灯箱：大图 + 左右切换 + ESC / 点遮罩关闭 */
.gallery-lightbox {
  position: fixed; inset: 0; z-index: 9990; display: flex;
  align-items: center; justify-content: center; padding: 60px 76px;
  background: rgba(15,23,42,.94);
}
.gallery-lightbox[hidden] { display: none; }
.glb-stage { margin: 0; max-width: 100%; max-height: 100%; text-align: center; }
.glb-stage img {
  width: auto; height: auto; max-width: 100%; max-height: 78vh;
  margin: 0 auto; border-radius: 8px; box-shadow: 0 24px 60px rgba(0,0,0,.5);
}
.glb-stage figcaption { margin-top: 14px; color: var(--text-on-dark); font-size: 14px; line-height: 1.7; }
.glb-btn {
  position: absolute; display: flex; align-items: center; justify-content: center;
  border: none; background: rgba(255,255,255,.14); color: #fff; line-height: 1;
  border-radius: 50%; cursor: pointer; transition: background .2s;
}
.glb-btn:hover { background: var(--primary); }
.glb-close { top: 18px; right: 20px; width: 42px; height: 42px; font-size: 26px; }
.glb-prev, .glb-next { top: 50%; width: 52px; height: 52px; margin-top: -26px; font-size: 22px; }
.glb-prev { left: 16px; }
.glb-next { right: 16px; }
.glb-count { position: absolute; left: 0; right: 0; bottom: 18px; text-align: center; color: var(--text-muted); font-size: 13px; }
body.corp-glb-open { overflow: hidden; }

/* 产品视频：配图右上角「视频演示」按钮 + 灯箱播放器
   （遮罩与关闭按钮复用 gallery 的 .gallery-lightbox / .glb-btn 样式） */
.pvd-open {
  position: absolute; top: 10px; right: 10px; z-index: 2;
  display: inline-flex; align-items: center; gap: 7px;
  padding: 7px 13px; border: none; border-radius: 999px; cursor: pointer;
  background: rgba(15,23,42,.78); color: #fff;
  font-size: 13px; line-height: 1; font-family: inherit;
  transition: background .2s;
}
.pvd-open:hover { background: var(--primary); }
.pvd-play {
  width: 0; height: 0; border-style: solid;
  border-width: 5px 0 5px 9px; border-color: transparent transparent transparent #fff;
}
.pvd-frame { width: 100%; max-width: 1000px; margin: 0 auto; }
.pvd-frame iframe {
  width: 100%; aspect-ratio: 16 / 9; height: auto; display: block;
  border: 0; border-radius: 8px; background: #000;
}
.pvd-frame video {
  width: 100%; max-height: 78vh; display: block;
  border-radius: 8px; background: #000;
}

@media (max-width: 900px) {
  .gallery-grid { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 10px; }
  .gallery-lightbox { padding: 54px 12px; }
  .glb-prev, .glb-next { width: 44px; height: 44px; margin-top: -22px; }
  .glb-prev { left: 6px; }
  .glb-next { right: 6px; }
  .glb-stage img { max-height: 70vh; }
  .pvd-open { top: 8px; right: 8px; padding: 9px 14px; }
  .pvd-box { padding: 54px 10px; }
}

/* ===== 手机号弹窗（PC 端右下角浮出 / 手机端底部滑入） =====
   仅在后台「基础信息 → 手机号弹窗」开启且手机号非空时才输出 DOM；
   默认 display:none，JS 加 .is-on 后才显示。全部为新增选择器，不覆盖任何既有规则。 */
.pnum-pop { display: none; position: fixed; z-index: 998; background: #fff; }
.pnum-pop.is-on { display: block; }

/* PC 端（>700px）：右下角浮出卡片 —— 不遮挡正文，也不像广告通栏 */
.pnum-pop {
  right: 24px; bottom: 24px; width: 264px;
  padding: 18px; border-radius: var(--radius);
  border: 1px solid var(--border); box-shadow: var(--shadow-lg);
}
.pnum-close {
  position: absolute; top: 6px; right: 8px; width: 28px; height: 28px;
  border: 0; background: transparent; color: var(--text-light);
  font-size: 22px; line-height: 1; cursor: pointer;
}
.pnum-close:hover { color: var(--text); }
.pnum-text { font-size: 14px; line-height: 1.6; color: var(--text-light); margin: 0 22px 10px 0; }
.pnum-tel { display: block; font-size: 24px; font-weight: 800; color: var(--primary); letter-spacing: 0.5px; margin-bottom: 12px; }
.pnum-tel:hover { color: var(--primary-dark); }
.pnum-btn {
  display: block; text-align: center; padding: 12px 0; border-radius: 8px;
  background: var(--accent); color: #fff; font-weight: 700; font-size: 16px;
}
.pnum-btn:hover { background: var(--accent-dark); color: #fff; }

/* 手机端（≤700px）：底部通栏滑入，压在常驻「拨打」条（56px）上方 */
@media (max-width: 700px) {
  .pnum-pop {
    left: 0; right: 0; bottom: 56px; width: auto;
    padding: 16px 18px 18px; border: 0; border-top: 1px solid var(--border);
    border-radius: var(--radius) var(--radius) 0 0;
    box-shadow: 0 -6px 24px rgba(15,23,42,0.16);
  }
  .pnum-tel { font-size: 22px; margin-bottom: 10px; }
}

/* ============================================================
   分类页子分类筛选条（corp599 追加 · 全部为新增选择器）
   仅「产品分类线」上的分类、且当前分类有直接子分类时才输出 DOM。
   PC（>700px）：flex-wrap:nowrap + 横向滚动，排满一行不留白；
   手机（≤700px）：等宽两列网格，分类全部一屏可见、不裁切、无需横滑（见本段末尾 @media）；
   两端同一套 DOM，筛选 JS 不依赖排版，切换样式无需改脚本。
   ============================================================ */
.cat-filter {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  /* 位置在正文区顶部（不在页头带内），需要自己撑出与下方卡片网格的间距 */
  margin: 0 0 18px;
  padding-bottom: 2px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.cat-filter::-webkit-scrollbar { display: none; }

.cat-filter-item {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: #fff;
  color: var(--text);
  font-size: 14px;
  line-height: 1.2;
  white-space: nowrap;
  transition: border-color .2s, background .2s, color .2s;
}
.cat-filter-item:hover { border-color: var(--primary); color: var(--primary); }
.cat-filter-item.is-active { background: var(--primary); border-color: var(--primary); color: #fff; }
.cat-filter-item.is-active:hover { color: #fff; }

/* 本页筛不到时的兜底提示（默认 hidden，由 JS 控制显隐） */
.cat-filter-empty {
  margin-top: 20px;
  padding: 28px 20px;
  border: 1px dashed var(--border);
  border-radius: var(--radius);
  background: #fff;
  text-align: center;
}
.cat-filter-empty p { margin: 0 0 14px; font-size: 14px; color: var(--text-light); }

/* 手机端（≤700px）：等宽两列网格 —— 分类再多也一屏看全，不再被右边缘裁掉。
   minmax(0,1fr) 防长名撑破列宽；超长名以省略号收尾（触控高度仍为 40px）。 */
@media (max-width: 700px) {
  .cat-filter {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding-bottom: 0;
    overflow-x: visible;
  }
  .cat-filter-item {
    width: 100%;
    min-width: 0;
    padding: 0 10px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

/* ============================================================
   产品详情页「获取报价」询价弹窗（corp599 追加 · 全部为新增选择器，
   不覆盖任何既有规则；DOM 只在产品详情页输出，默认 [hidden] 隐藏）
   字段顺序：称呼 + 手机号置顶且唯二必填 → 虚线分界 → 三个选填字段。
   手机端做底部抽屉式（与手机号弹窗一致的观感）。
   ============================================================ */
.inq-box { position: fixed; inset: 0; z-index: 9995; display: flex; align-items: center; justify-content: center; padding: 24px; }
.inq-box[hidden] { display: none; }
.inq-mask { position: absolute; inset: 0; background: rgba(15,23,42,.62); }
.inq-dlg {
  position: relative; width: 100%; max-width: 480px; max-height: calc(100vh - 48px); overflow-y: auto;
  background: #fff; border-radius: var(--radius); box-shadow: var(--shadow-lg);
  padding: 26px 26px 22px;
}
.inq-x {
  position: absolute; top: 10px; right: 12px; width: 32px; height: 32px;
  border: 0; background: transparent; color: var(--text-light);
  font-size: 24px; line-height: 1; cursor: pointer;
}
.inq-x:hover { color: var(--text); }
.inq-title { font-size: 20px; font-weight: 800; color: var(--text); margin: 0 34px 6px 0; }
.inq-tip { font-size: 13px; color: var(--text-light); line-height: 1.7; margin-bottom: 18px; }
/* 蜜罐：留在 DOM 里等脚本去填，但不占位、不可见、不进键盘 Tab 序列 */
.inq-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.inq-f { margin-bottom: 14px; }
.inq-f label { display: block; font-size: 14px; font-weight: 600; color: var(--text); margin-bottom: 6px; }
.inq-f label .req { color: var(--danger); font-style: normal; margin-left: 2px; }
.inq-f label .must { font-size: 12px; font-weight: 400; color: var(--danger); margin-left: 6px; }
.inq-f label .opt { font-size: 12px; font-weight: 400; color: var(--text-light); margin-left: 6px; }
.inq-f input, .inq-f textarea {
  width: 100%; box-sizing: border-box; padding: 11px 13px; font-size: 15px; font-family: inherit;
  color: var(--text); background: #fff; border: 1px solid var(--border); border-radius: 8px; line-height: 1.5;
}
.inq-f input:focus, .inq-f textarea:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light); }
.inq-f textarea { resize: vertical; min-height: 78px; }
/* 必填与选填的分界：先给一句「可以跳过」，再用「填了更好」引导，比单写「选填」更能留住人 */
.inq-sep {
  margin: 20px 0 16px; padding-top: 16px; border-top: 1px dashed var(--border);
  font-size: 13px; color: var(--text-light); text-align: center;
}
.inq-submit { display: block; width: 100%; margin-top: 4px; }
.inq-note { margin-top: 10px; font-size: 12px; color: var(--text-light); text-align: center; }
.inq-msg { margin-top: 10px; font-size: 13px; line-height: 1.6; text-align: center; }
.inq-msg:empty { display: none; }
.inq-msg.is-ok { color: var(--success); font-weight: 600; }
.inq-msg.is-err { color: var(--danger); }

@media (max-width: 700px) {
  .inq-box { padding: 0; align-items: flex-end; }
  .inq-dlg {
    max-width: 100%; max-height: 92vh;
    border-radius: var(--radius) var(--radius) 0 0;
    padding: 22px 18px calc(18px + env(safe-area-inset-bottom));
  }
  .inq-title { font-size: 18px; }
  /* iOS 上输入框字号 < 16px 会在聚焦时自动放大整页，这里顶到 16px 挡掉 */
  .inq-f input, .inq-f textarea { font-size: 16px; }
}
