@charset "utf-8";
/* =========================================================
   上海暇步康生物科技有限公司 · 官网模板样式（EyouCMS template/pc）
   文件位置：template/pc/skin/css/main.css
   说明：本文件由「公共样式 css/style.css」+「首页/产品列表设计稿样式」合并而成
   ========================================================= */


@charset "utf-8";
/* =========================================================
   上海暇步康生物科技有限公司 · 官网公共样式
   适用于 index.html / products.html 及全部内页
   ========================================================= */

/* ============ 变量与基础 ============ */
* { margin:0; padding:0; box-sizing:border-box; }
:root{
  --teal:#15bfcc;            /* 科技、生机与活力：按钮、数据、标题 */
  --teal-dark:#0e97a3;
  --teal-deep:#0c6773;
  --orange:#f39800;          /* 稳重与生物科技感：页脚、部分背景 */
  --orange-dark:#dd8500;
  --orange-deep:#9c5f00;
  --text-dark:#20323c;
  --text-gray:#5f7079;
  --bg-teal:#f2fafc;
  --bg-orange:#fff8ec;
  --white:#ffffff;
}
html { scroll-behavior:smooth; }
body { font-family:"Microsoft YaHei","PingFang SC","Helvetica Neue",Arial,sans-serif; color:var(--text-dark); background:#fff; -webkit-text-size-adjust:100%; }
a { text-decoration:none; color:inherit; }
ul { list-style:none; }
img { max-width:100%; }
button, input, textarea, select { font-family:inherit; }

/* ============ 顶部信息条 ============ */
.topbar{ background:linear-gradient(90deg,var(--teal-deep),var(--teal)); color:#e4fbfe; font-size:13px; }
.topbar-inner{ max-width:1280px; margin:0 auto; display:flex; justify-content:space-between; padding:7px 24px; }
.topbar a{ color:#e4fbfe; margin-left:20px; transition:color .2s; }
.topbar a:hover{ color:#fff; }

/* ============ 主导航 ============ */
.navbar{ background:#fff; box-shadow:0 2px 16px rgba(32,80,90,.1); position:sticky; top:0; z-index:1000; }
.navbar-inner{ max-width:1280px; margin:0 auto; display:flex; align-items:center; height:78px; padding:0 24px; }

/* Logo */
.logo{ display:flex; align-items:center; gap:12px; margin-right:36px; flex-shrink:0; }
.logo-mark{ width:46px; height:46px; }
.logo-text{ display:flex; flex-direction:column; }
.logo-text .cn{ font-size:21px; font-weight:700; color:var(--teal-deep); letter-spacing:2px; line-height:1.1; }
.logo-text .en{ font-size:11px; color:var(--text-gray); letter-spacing:1.5px; }

/* 主菜单 */
.nav-menu{ display:flex; flex:1; justify-content:center; height:100%; }
.nav-item{ position:relative; height:100%; }
.nav-item > a{ display:flex; align-items:center; height:100%; padding:0 19px; white-space:nowrap; font-size:16px; font-weight:500; color:var(--text-dark); position:relative; transition:color .2s; }
.nav-item > a::after{ content:""; position:absolute; left:19px; right:19px; bottom:0; height:3px; background:linear-gradient(90deg,var(--teal),var(--orange)); border-radius:2px 2px 0 0; transform:scaleX(0); transition:transform .25s; }
.nav-item:hover > a{ color:var(--teal-dark); }
.nav-item:hover > a::after{ transform:scaleX(1); }
.nav-item > a .caret{ margin-left:5px; font-size:10px; transition:transform .25s; }
.nav-item:hover > a .caret{ transform:rotate(180deg); }
/* 当前栏目高亮 */
.nav-item > a.current{ color:var(--teal-dark); }
.nav-item > a.current::after{ transform:scaleX(1); }

/* 二级下拉 */
.dropdown{ position:absolute; top:100%; left:50%; transform:translateX(-50%) translateY(12px); min-width:240px; background:#fff; border-radius:0 0 10px 10px; box-shadow:0 18px 40px rgba(12,103,115,.18); opacity:0; visibility:hidden; transition:all .25s ease; border-top:3px solid var(--teal); padding:10px 0; z-index:100; }
.nav-item:hover .dropdown{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
.dropdown li{ position:relative; }
.dropdown > li > a{ display:flex; justify-content:space-between; align-items:center; padding:12px 24px; font-size:14.5px; color:var(--text-dark); transition:all .2s; }
.dropdown > li > a:hover{ background:var(--bg-teal); color:var(--teal-dark); padding-left:30px; }
.dropdown .arrow{ font-size:11px; color:#9fb3b8; }

/* 三级下拉 */
.sub-dropdown{ position:absolute; left:100%; top:0; min-width:230px; background:#fff; border-radius:0 10px 10px 10px; box-shadow:0 18px 40px rgba(12,103,115,.18); opacity:0; visibility:hidden; transform:translateX(10px); transition:all .25s ease; padding:10px 0; }
.dropdown li:hover .sub-dropdown{ opacity:1; visibility:visible; transform:translateX(0); }
.sub-dropdown li a{ display:block; padding:11px 24px; font-size:14px; color:var(--text-gray); transition:all .2s; }
.sub-dropdown li a:hover{ background:var(--bg-teal); color:var(--teal-dark); padding-left:30px; }

/* 导航右侧：搜索框 */
.nav-tools{ display:flex; align-items:center; margin-left:24px; flex-shrink:0; }
.search-box{ display:flex; align-items:center; border:1.5px solid #d8eaed; border-radius:28px; overflow:hidden; background:var(--bg-teal); width:290px; transition:all .25s; }
.search-box:focus-within{ border-color:var(--teal); background:#fff; box-shadow:0 6px 18px rgba(21,191,204,.22); }
.search-box input{ border:none; outline:none; background:transparent; padding:12px 4px 12px 20px; width:100%; font-size:14.5px; color:var(--text-dark); flex:1; min-width:0; }
.search-box input::placeholder{ color:#8ba7ad; }
.search-box button{ border:none; cursor:pointer; background:linear-gradient(135deg,var(--teal),var(--teal-dark)); color:#fff; padding:12px 20px; display:flex; align-items:center; flex-shrink:0; transition:filter .25s; }
.search-box button:hover{ filter:brightness(1.08); }

/* ============ 按钮 ============ */
.btn{ display:inline-block; padding:13px 36px; border-radius:30px; font-size:15px; letter-spacing:1px; cursor:pointer; transition:all .25s; border:none; }
.btn-primary{ background:linear-gradient(90deg,var(--teal),#35d3de); color:#fff; box-shadow:0 8px 22px rgba(21,191,204,.45); }
.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 12px 28px rgba(21,191,204,.6); filter:brightness(1.05); }
.btn-outline{ background:transparent; color:#fff; border:1.5px solid rgba(255,255,255,.6); }
.btn-outline:hover{ background:rgba(255,255,255,.14); border-color:#fff; }
.btn-warm{ background:linear-gradient(90deg,#ffb43a,var(--orange)); color:#fff; box-shadow:0 8px 22px rgba(243,152,0,.4); }
.btn-warm:hover{ transform:translateY(-2px); filter:brightness(1.06); }
.btn-ghost{ background:#fff; color:var(--teal-dark); border:1.5px solid #bfe9ee; }
.btn-ghost:hover{ border-color:var(--teal); background:var(--bg-teal); transform:translateY(-2px); }
.btn-sm{ padding:10px 26px; font-size:14px; }

/* ============ 通用 Section ============ */
.section{ padding:92px 24px; scroll-margin-top:90px; }
.section-inner{ max-width:1280px; margin:0 auto; }
.section-head{ text-align:center; margin-bottom:58px; }
.section-head .en-title{ font-size:14px; letter-spacing:5px; color:var(--orange); font-weight:600; text-transform:uppercase; }
.section-head h2{ font-size:34px; font-weight:700; margin:12px 0 16px; color:var(--teal-deep); letter-spacing:2px; }
.section-head .divider{ width:64px; height:4px; margin:0 auto; background:linear-gradient(90deg,var(--teal),var(--orange)); border-radius:2px; }
.section-head p{ margin-top:16px; color:var(--text-gray); font-size:15.5px; line-height:1.9; }
.section-head.left{ text-align:left; }
.section-head.left .divider{ margin:0; }
.section.bg-teal{ background:linear-gradient(180deg,#fff 0%,var(--bg-teal) 100%); }
.section.bg-gray{ background:var(--bg-teal); }
.section.bg-dark{ background:linear-gradient(150deg,var(--teal-deep) 0%,#0a5d68 60%,#084c55 100%); position:relative; overflow:hidden; }
.section.bg-dark .section-head h2{ color:#fff; }
.section.bg-dark .section-head p{ color:rgba(255,255,255,.7); }

/* ============ 内页 Banner ============ */
.page-banner{ position:relative; height:340px; overflow:hidden; display:flex; align-items:center; justify-content:center; text-align:center; }
.pb-bg{ position:absolute; inset:0; z-index:0; }
.pb-bg img{ width:100%; height:100%; object-fit:cover; }
.pb-bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(100deg,rgba(10,84,94,.94) 12%,rgba(21,191,204,.6) 56%,rgba(21,191,204,.34)); }
.page-banner.warm .pb-bg::after{ background:linear-gradient(100deg,rgba(120,72,0,.94) 12%,rgba(243,152,0,.62) 56%,rgba(243,152,0,.36)); }
.pb-inner{ position:relative; z-index:2; color:#fff; max-width:880px; padding:0 24px; }
.pb-en{ display:inline-block; font-size:13px; letter-spacing:5px; color:#ffd58a; font-weight:600; text-transform:uppercase; margin-bottom:16px; }
.pb-inner h1{ font-size:40px; font-weight:700; letter-spacing:4px; line-height:1.3; margin-bottom:16px; text-shadow:0 2px 14px rgba(0,0,0,.25); }
.pb-inner p{ font-size:15.5px; line-height:1.9; color:rgba(255,255,255,.9); max-width:700px; margin:0 auto; }

/* 面包屑 */
.crumb-bar{ background:var(--bg-teal); border-bottom:1px solid #ddf0f3; }
.crumb-in{ max-width:1280px; margin:0 auto; padding:14px 24px; display:flex; align-items:center; flex-wrap:wrap; gap:10px; font-size:13px; color:var(--text-gray); }
.crumb-in a{ transition:color .2s; }
.crumb-in a:hover{ color:var(--teal-dark); }
.crumb-in .sep{ color:#b9ccd0; }
.crumb-in em{ font-style:normal; color:var(--teal-dark); font-weight:600; }

/* ============ 内页主体布局 ============ */
.list-wrap{ background:linear-gradient(180deg,var(--bg-teal) 0,#fff 300px); padding:46px 24px 92px; }
.list-inner{ max-width:1280px; margin:0 auto; display:grid; grid-template-columns:264px 1fr; gap:32px; align-items:start; }
.detail-inner{ max-width:1280px; margin:0 auto; display:grid; grid-template-columns:1fr 316px; gap:32px; align-items:start; }
.plain-wrap{ background:linear-gradient(180deg,var(--bg-teal) 0,#fff 320px); padding:46px 24px 92px; }
.plain-inner{ max-width:1280px; margin:0 auto; }
/* 栅格内容列：允许收缩，避免长内容撑破布局 */
.content{ min-width:0; }

/* ============ 侧栏 ============ */
.side{ display:flex; flex-direction:column; gap:20px; position:sticky; top:100px; }
.side-card{ background:#fff; border:1px solid #e9f4f6; border-radius:14px; box-shadow:0 4px 18px rgba(32,80,90,.06); overflow:hidden; }
.side-head{ padding:20px 22px 16px; border-bottom:1px solid #eef4f5; }
.side-head h3{ font-size:17px; font-weight:700; color:var(--teal-deep); letter-spacing:1px; }
.side-head .en{ display:block; font-size:11px; letter-spacing:3px; color:var(--orange); margin-top:6px; text-transform:uppercase; font-weight:600; }
.cat-list{ padding:10px; }
.cat-list li + li{ margin-top:4px; }
.cat-list a{ display:flex; justify-content:space-between; align-items:center; gap:8px; padding:12px 15px; border-radius:9px; font-size:14.5px; color:var(--text-dark); transition:all .25s; }
.cat-list a:hover{ background:var(--bg-teal); color:var(--teal-dark); padding-left:21px; }
.cat-list em{ font-style:normal; font-size:12px; color:#a4b6bb; background:#f2f8f9; border-radius:10px; padding:2px 9px; transition:all .25s; }
.cat-list li.active a{ background:linear-gradient(135deg,var(--teal),var(--teal-dark)); color:#fff; box-shadow:0 6px 16px rgba(21,191,204,.32); }
.cat-list li.active em{ background:rgba(255,255,255,.24); color:#fff; }

/* 侧栏：咨询卡 */
.side-consult{ padding:26px 22px; border:none; background:linear-gradient(150deg,var(--teal-deep),#0a5d68); color:rgba(255,255,255,.82); position:relative; overflow:hidden; }
.side-consult::after{ content:""; position:absolute; width:200px; height:200px; border-radius:50%; background:radial-gradient(circle,rgba(255,180,58,.18),transparent 70%); top:-70px; right:-70px; }
.side-consult h3{ color:#fff; font-size:17px; font-weight:700; margin-bottom:10px; letter-spacing:1px; position:relative; z-index:1; }
.side-consult p{ font-size:13.5px; line-height:1.85; margin-bottom:20px; position:relative; z-index:1; }
.side-consult .side-btn{ display:block; text-align:center; padding:11px 0; border-radius:24px; background:linear-gradient(90deg,#ffb43a,var(--orange)); color:#fff; font-size:14.5px; letter-spacing:1px; box-shadow:0 8px 20px rgba(243,152,0,.35); transition:all .25s; position:relative; z-index:1; }
.side-consult .side-btn:hover{ filter:brightness(1.06); transform:translateY(-2px); }
.side-consult .side-tel{ margin-top:16px; text-align:center; font-size:13px; letter-spacing:1px; color:#8ff3fb; position:relative; z-index:1; }

/* 侧栏：联系方式 */
.side-contact-list{ padding:6px 22px 22px; }
.side-contact-list li{ display:flex; gap:12px; padding:14px 0; border-bottom:1px dashed #eaf3f4; font-size:13.5px; color:var(--text-gray); line-height:1.75; }
.side-contact-list li:last-child{ border-bottom:none; }
.side-contact-list .ic{ flex-shrink:0; width:32px; height:32px; border-radius:9px; background:var(--bg-teal); color:var(--teal-dark); display:flex; align-items:center; justify-content:center; font-size:15px; }
.side-contact-list b{ display:block; color:var(--text-dark); font-size:14px; margin-bottom:3px; }

/* 侧栏：最新新闻 */
.side-news{ padding:8px 20px 18px; }
.side-news li{ border-bottom:1px dashed #eaf3f4; }
.side-news li:last-child{ border-bottom:none; }
.side-news a{ display:block; padding:14px 0; font-size:13.8px; color:var(--text-dark); line-height:1.7; transition:all .25s; }
.side-news a:hover{ color:var(--teal-dark); }
.side-news .d{ display:block; font-size:12px; color:#a4b6bb; margin-top:6px; letter-spacing:.5px; }

/* ============ 排序工具条 ============ */
.toolbar{ display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; background:#fff; border:1px solid #e9f4f6; border-radius:12px; padding:14px 20px; box-shadow:0 4px 14px rgba(32,80,90,.05); margin-bottom:26px; }
.tb-count{ font-size:14px; color:var(--text-gray); }
.tb-count b{ color:var(--teal-dark); font-size:17px; font-family:Georgia,"Times New Roman",serif; margin:0 4px; }
.tb-sorts{ display:flex; gap:8px; flex-wrap:wrap; }
.tb-sorts button{ border:1px solid #dff0f2; background:#f7fcfd; color:var(--text-gray); font-size:13.5px; padding:8px 18px; border-radius:20px; cursor:pointer; font-family:inherit; transition:all .25s; }
.tb-sorts button:hover{ color:var(--teal-dark); border-color:#bfe9ee; }
.tb-sorts button.active{ background:linear-gradient(90deg,var(--teal),var(--teal-dark)); color:#fff; border-color:transparent; box-shadow:0 5px 14px rgba(21,191,204,.3); }

/* ============ 实验服务卡片 ============ */
.svc-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:26px; }
.svc-card{ display:flex; gap:22px; background:#fff; border:1px solid #e9f4f6; border-radius:14px; padding:28px 26px; box-shadow:0 4px 18px rgba(32,80,90,.06); transition:all .35s ease; position:relative; overflow:hidden; }
.svc-card::before{ content:""; position:absolute; top:0; left:0; right:0; height:4px; background:linear-gradient(90deg,var(--teal),var(--orange)); transform:scaleX(0); transform-origin:left; transition:transform .35s; }
.svc-card:hover{ transform:translateY(-6px); box-shadow:0 18px 42px rgba(32,80,90,.15); border-color:#cbeef2; }
.svc-card:hover::before{ transform:scaleX(1); }
.svc-ic{ flex-shrink:0; width:80px; height:80px; border-radius:50%; display:flex; align-items:center; justify-content:center; transition:transform .35s; }
.svc-card:nth-child(odd) .svc-ic{ background:linear-gradient(135deg,#e6f8fa,#d2f1f5); }
.svc-card:nth-child(even) .svc-ic{ background:linear-gradient(135deg,#fff1d6,#ffe4b3); }
.svc-card:hover .svc-ic{ transform:scale(1.06) rotate(-4deg); }
.svc-body{ flex:1; min-width:0; }
.svc-body h3{ font-size:19px; font-weight:700; letter-spacing:.5px; margin-bottom:5px; color:var(--text-dark); transition:color .25s; }
.svc-card:hover .svc-body h3{ color:var(--teal-dark); }
.svc-body .en{ font-size:11.5px; color:#a4b6bb; letter-spacing:2px; text-transform:uppercase; margin-bottom:12px; }
.svc-body p{ font-size:13.8px; color:var(--text-gray); line-height:1.85; margin-bottom:14px; }
.svc-tags{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; }
.svc-tags span{ font-size:12px; color:var(--teal-dark); background:var(--bg-teal); border:1px solid #ddf0f3; border-radius:14px; padding:4px 12px; }
.svc-link{ font-size:14px; color:var(--teal-dark); font-weight:600; letter-spacing:1px; display:inline-flex; align-items:center; gap:6px; transition:gap .25s; }
.svc-card:hover .svc-link{ gap:12px; }

/* ============ 服务流程 / 步骤 ============ */
.flow{ display:grid; grid-template-columns:repeat(5,1fr); gap:20px; position:relative; }
.flow-step{ text-align:center; background:#fff; border:1px solid #e9f4f6; border-radius:14px; padding:32px 18px 26px; box-shadow:0 4px 18px rgba(32,80,90,.06); transition:all .35s; position:relative; }
.flow-step:hover{ transform:translateY(-6px); box-shadow:0 16px 38px rgba(32,80,90,.14); }
.flow-num{ width:52px; height:52px; margin:0 auto 16px; border-radius:50%; background:linear-gradient(135deg,var(--teal),var(--teal-dark)); color:#fff; font-size:20px; font-weight:700; font-family:Georgia,"Times New Roman",serif; display:flex; align-items:center; justify-content:center; box-shadow:0 8px 18px rgba(21,191,204,.35); }
.flow-step:nth-child(even) .flow-num{ background:linear-gradient(135deg,#ffb43a,var(--orange)); box-shadow:0 8px 18px rgba(243,152,0,.32); }
.flow-step h4{ font-size:15.5px; font-weight:700; margin-bottom:8px; color:var(--text-dark); }
.flow-step p{ font-size:13px; color:var(--text-gray); line-height:1.8; }

/* ============ 文章正文（详情页） ============ */
.article{ background:#fff; border:1px solid #e9f4f6; border-radius:14px; box-shadow:0 4px 18px rgba(32,80,90,.06); padding:44px 46px 50px; }
.art-head{ border-bottom:1px solid #eef4f5; padding-bottom:26px; margin-bottom:32px; }
.art-badge{ display:inline-block; background:var(--orange); color:#fff; font-size:12px; padding:5px 14px; border-radius:4px; letter-spacing:2px; margin-bottom:16px; }
.art-head h1{ font-size:29px; font-weight:700; line-height:1.55; color:var(--text-dark); letter-spacing:.5px; margin-bottom:18px; }
.art-meta{ display:flex; flex-wrap:wrap; gap:10px 26px; font-size:13px; color:#a4b6bb; }
.art-meta span{ display:inline-flex; align-items:center; gap:6px; }
.art-meta b{ color:var(--text-gray); font-weight:500; }
.art-body{ font-size:15.5px; color:var(--text-gray); line-height:2.05; }
.art-body > p{ margin-bottom:22px; text-align:justify; }
.art-body h2{ font-size:20px; font-weight:700; color:var(--teal-deep); margin:40px 0 20px; padding-left:16px; position:relative; line-height:1.5; }
.art-body h2::before{ content:""; position:absolute; left:0; top:5px; bottom:5px; width:5px; border-radius:3px; background:linear-gradient(180deg,var(--teal),var(--orange)); }
.art-body h3{ font-size:17px; font-weight:700; color:var(--text-dark); margin:30px 0 14px; line-height:1.6; }
.art-body ul.dot{ margin:0 0 22px; }
.art-body ul.dot li{ position:relative; padding-left:24px; margin-bottom:11px; }
.art-body ul.dot li::before{ content:""; position:absolute; left:4px; top:12px; width:7px; height:7px; border-radius:50%; background:var(--teal); }
.art-body ol.num{ margin:0 0 22px; counter-reset:n; }
.art-body ol.num li{ position:relative; padding-left:34px; margin-bottom:11px; counter-increment:n; }
.art-body ol.num li::before{ content:counter(n); position:absolute; left:0; top:5px; width:22px; height:22px; border-radius:50%; background:var(--bg-teal); color:var(--teal-dark); font-size:12px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.art-body blockquote{ margin:26px 0; padding:22px 26px; background:linear-gradient(135deg,#f6fdfd,#eef9fb); border-left:4px solid var(--teal); border-radius:0 10px 10px 0; font-size:15px; color:var(--teal-deep); line-height:1.95; }
.art-body strong{ color:var(--text-dark); font-weight:700; }
.art-body img{ border-radius:12px; display:block; margin:8px auto 10px; box-shadow:0 12px 32px rgba(32,80,90,.14); }
.art-fig{ font-size:13px; color:#a4b6bb; text-align:center; margin-bottom:26px; }
.art-body table{ width:100%; border-collapse:collapse; margin:0 0 26px; font-size:14.5px; }
.art-body table th{ background:linear-gradient(135deg,#f0fafc,#e6f6f9); color:var(--teal-deep); font-weight:700; text-align:left; padding:14px 18px; border:1px solid #ddf0f3; white-space:nowrap; }
.art-body table td{ padding:13px 18px; border:1px solid #eaf3f4; color:var(--text-gray); line-height:1.8; }
.art-body table tr:hover td{ background:#fafdfe; }
.art-note{ margin:28px 0; padding:22px 26px; border:1px dashed #bfe9ee; border-radius:12px; background:#fbfeff; }
.art-note h4{ font-size:15.5px; color:var(--teal-deep); margin-bottom:12px; }
.art-note p, .art-note li{ font-size:14.5px; line-height:1.9; }
.art-note ul.dot li::before{ top:11px; }

/* 数据指标条 */
.stat-row{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; background:linear-gradient(135deg,#f6fdfd,#f0fafc); border:1px solid #ddf0f3; border-radius:14px; padding:30px 18px; }
.stat-item{ text-align:center; position:relative; }
.stat-item:not(:last-child)::after{ content:""; position:absolute; right:0; top:18%; height:64%; width:1px; background:#d5ebee; }
.stat-item .num{ font-size:34px; font-weight:800; color:var(--teal); letter-spacing:1px; font-family:Georgia,"Times New Roman",serif; }
.stat-item .num small{ font-size:17px; color:var(--orange); margin-left:2px; }
.stat-item .txt{ font-size:13px; color:var(--text-gray); margin-top:7px; letter-spacing:1px; }

/* 上下篇 */
.art-nav{ display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:32px; }
.art-nav a{ display:block; background:#fff; border:1px solid #e9f4f6; border-radius:12px; padding:20px 24px; transition:all .3s; min-width:0; }
.art-nav a:hover{ border-color:#bfe9ee; box-shadow:0 12px 30px rgba(32,80,90,.12); transform:translateY(-3px); }
.art-nav .lb{ display:block; font-size:12.5px; color:#a4b6bb; margin-bottom:8px; letter-spacing:1px; }
.art-nav .ti{ font-size:14.5px; color:var(--text-dark); line-height:1.75; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.art-nav a:hover .ti{ color:var(--teal-dark); }
.art-nav .next{ text-align:right; }

/* ============ 富文本卡片 / 通用内容卡 ============ */
.card{ background:#fff; border:1px solid #e9f4f6; border-radius:14px; box-shadow:0 4px 18px rgba(32,80,90,.06); padding:32px 34px; }
.card + .card{ margin-top:26px; }
.card-title{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap; border-bottom:1px solid #eef4f5; padding-bottom:18px; margin-bottom:26px; }
.card-title h2{ font-size:21px; font-weight:700; color:var(--teal-deep); letter-spacing:1px; position:relative; padding-left:16px; }
.card-title h2::before{ content:""; position:absolute; left:0; top:3px; bottom:3px; width:5px; border-radius:3px; background:linear-gradient(180deg,var(--teal),var(--orange)); }
.card-title .en{ font-size:12px; letter-spacing:3px; color:var(--orange); text-transform:uppercase; font-weight:600; }

/* ============ 常见问题 ============ */
.faq{ border-top:1px solid #eef4f5; }
.faq-item{ border-bottom:1px solid #eef4f5; }
.faq-q{ display:flex; justify-content:space-between; align-items:center; gap:18px; padding:20px 4px; cursor:pointer; font-size:15.5px; font-weight:600; color:var(--text-dark); transition:color .25s; }
.faq-q:hover{ color:var(--teal-dark); }
.faq-q .ico{ flex-shrink:0; width:26px; height:26px; border-radius:50%; background:var(--bg-teal); color:var(--teal-dark); font-size:16px; font-weight:700; display:flex; align-items:center; justify-content:center; transition:all .3s; line-height:1; }
.faq-item.open .faq-q{ color:var(--teal-dark); }
.faq-item.open .faq-q .ico{ background:linear-gradient(135deg,var(--teal),var(--teal-dark)); color:#fff; transform:rotate(45deg); }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .35s ease; }
.faq-a p{ padding:0 46px 22px 4px; font-size:14.5px; color:var(--text-gray); line-height:1.95; }
.faq-item.open .faq-a{ max-height:400px; }

/* ============ 新闻列表页 ============ */
.news-tabs{ display:flex; justify-content:center; gap:0; margin-bottom:40px; border:1.5px solid #d8eaed; border-radius:30px; overflow:hidden; width:max-content; margin-left:auto; margin-right:auto; background:#fff; }
.news-tab{ padding:10px 34px; font-size:15px; font-weight:600; color:var(--text-gray); cursor:pointer; transition:all .25s; border:none; background:#fff; letter-spacing:2px; }
.news-tab.active{ background:linear-gradient(90deg,var(--teal),var(--teal-dark)); color:#fff; box-shadow:0 4px 12px rgba(21,191,204,.35); }
.news-tab:not(.active):hover{ color:var(--teal-dark); }
.news-panel{ display:none; }
.news-panel.active{ display:block; }

/* 新闻列表：头条 + 列表 */
.news-featured{ display:grid; grid-template-columns:1.02fr 1fr; gap:0; background:#fff; border:1px solid #e9f4f6; border-radius:14px; overflow:hidden; box-shadow:0 10px 30px rgba(32,80,90,.1); margin-bottom:30px; transition:all .35s; }
.news-featured:hover{ box-shadow:0 18px 44px rgba(32,80,90,.17); }
.nf-img{ position:relative; min-height:320px; overflow:hidden; }
.nf-img img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
.news-featured:hover .nf-img img{ transform:scale(1.06); }
.nf-body{ padding:34px 36px; display:flex; flex-direction:column; justify-content:center; }
.nf-body h3{ font-size:23px; font-weight:700; line-height:1.6; margin-bottom:16px; color:var(--text-dark); transition:color .25s; }
.news-featured:hover .nf-body h3{ color:var(--teal-dark); }
.nf-body p{ font-size:14.5px; color:var(--text-gray); line-height:1.95; margin-bottom:18px; }
.nf-more{ font-size:14px; color:var(--teal-dark); font-weight:600; letter-spacing:1px; }

/* 新闻列表项（带图） */
.news-rows{ display:flex; flex-direction:column; gap:20px; }
.news-row{ display:grid; grid-template-columns:230px 1fr; gap:26px; background:#fff; border:1px solid #eef4f5; border-radius:12px; padding:22px; transition:all .3s; align-items:stretch; }
.news-row:hover{ box-shadow:0 12px 30px rgba(32,80,90,.13); transform:translateY(-4px); border-color:#cbeef2; }
.nr-img{ height:158px; border-radius:10px; overflow:hidden; background:#f6fbfc; }
.nr-img img{ width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
.news-row:hover .nr-img img{ transform:scale(1.08); }
.nr-body{ display:flex; flex-direction:column; min-width:0; }
.nr-body h3{ font-size:17.5px; font-weight:700; line-height:1.7; margin-bottom:10px; color:var(--text-dark); transition:color .25s; }
.news-row:hover .nr-body h3{ color:var(--teal-dark); }
.nr-body p{ font-size:13.8px; color:var(--text-gray); line-height:1.9; margin-bottom:14px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; flex:1; }
.nr-meta{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; font-size:12.5px; color:#a4b6bb; }
.nr-meta .tag{ background:var(--bg-teal); color:var(--teal-dark); border-radius:12px; padding:3px 12px; font-size:12px; }

/* ============ 文献列表 ============ */
.lit-filter{ background:#fff; border:1px solid #e9f4f6; border-radius:12px; padding:8px 20px; box-shadow:0 4px 14px rgba(32,80,90,.05); margin-bottom:26px; }
.lit-filter .frow{ display:flex; align-items:flex-start; gap:16px; padding:14px 0; border-bottom:1px dashed #eaf3f4; }
.lit-filter .frow:last-child{ border-bottom:none; }
.lit-filter .flb{ flex-shrink:0; font-size:13.5px; color:#a4b6bb; width:64px; padding-top:5px; letter-spacing:1px; }
.lit-filter .fopts{ display:flex; flex-wrap:wrap; gap:8px; }
.lit-filter .fopts a{ font-size:13px; color:var(--text-gray); padding:5px 15px; border-radius:16px; transition:all .25s; }
.lit-filter .fopts a:hover{ background:var(--bg-teal); color:var(--teal-dark); }
.lit-filter .fopts a.active{ background:linear-gradient(90deg,var(--teal),var(--teal-dark)); color:#fff; box-shadow:0 5px 14px rgba(21,191,204,.28); }

.lit-list{ display:flex; flex-direction:column; gap:20px; }
.lit-card{ display:grid; grid-template-columns:82px 1fr; gap:24px; background:#fff; border:1px solid #e9f4f6; border-radius:14px; padding:26px 28px; box-shadow:0 4px 18px rgba(32,80,90,.05); transition:all .35s; }
.lit-card:hover{ transform:translateY(-4px); box-shadow:0 16px 38px rgba(32,80,90,.13); border-color:#cbeef2; }
.lit-jnl{ text-align:center; border-right:1px solid #eef4f5; padding-right:22px; }
.lit-jnl .j{ font-size:16px; font-weight:700; color:var(--teal-deep); font-style:italic; line-height:1.4; word-break:break-word; }
.lit-jnl .if{ display:inline-block; margin-top:10px; font-size:11.5px; color:var(--orange); border:1px solid #ffe0b0; background:var(--bg-orange); padding:3px 10px; border-radius:12px; white-space:nowrap; }
.lit-body{ min-width:0; }
.lit-body h3{ font-size:16.5px; font-weight:700; color:var(--text-dark); line-height:1.65; margin-bottom:12px; transition:color .25s; }
.lit-card:hover .lit-body h3{ color:var(--teal-dark); }
.lit-tags{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px; }
.lit-tags span{ font-size:12px; color:var(--teal-dark); background:var(--bg-teal); border:1px solid #ddf0f3; border-radius:14px; padding:4px 12px; }
.lit-meta{ font-size:13px; color:var(--text-gray); line-height:1.95; border-top:1px dashed #eaf3f4; padding-top:14px; display:flex; flex-wrap:wrap; gap:6px 28px; }
.lit-meta b{ color:var(--orange); font-weight:600; }

/* ============ 时间轴（发展历程） ============ */
.timeline{ position:relative; padding:10px 0; }
.timeline::before{ content:""; position:absolute; left:50%; top:0; bottom:0; width:3px; margin-left:-1.5px; background:linear-gradient(180deg,rgba(21,191,204,0),var(--teal) 8%,var(--orange) 92%,rgba(243,152,0,0)); border-radius:2px; }
.tl-item{ position:relative; width:50%; padding:0 52px 46px 0; }
.tl-item:nth-child(even){ margin-left:50%; padding:0 0 46px 52px; }
.tl-dot{ position:absolute; right:-11px; top:8px; width:22px; height:22px; border-radius:50%; background:#fff; border:3px solid var(--teal); box-shadow:0 0 0 5px rgba(21,191,204,.14); z-index:2; }
.tl-item:nth-child(even) .tl-dot{ right:auto; left:-11px; border-color:var(--orange); box-shadow:0 0 0 5px rgba(243,152,0,.14); }
.tl-card{ background:#fff; border:1px solid #e9f4f6; border-radius:14px; padding:26px 28px; box-shadow:0 4px 18px rgba(32,80,90,.06); transition:all .35s; }
.tl-card:hover{ transform:translateY(-5px); box-shadow:0 16px 38px rgba(32,80,90,.14); border-color:#cbeef2; }
.tl-year{ display:inline-block; font-size:20px; font-weight:800; color:var(--teal); font-family:Georgia,"Times New Roman",serif; letter-spacing:1px; margin-bottom:10px; }
.tl-item:nth-child(even) .tl-year{ color:var(--orange); }
.tl-card h4{ font-size:16.5px; font-weight:700; color:var(--text-dark); margin-bottom:10px; line-height:1.6; }
.tl-card p{ font-size:13.8px; color:var(--text-gray); line-height:1.9; }

/* ============ 荣誉资质 ============ */
.honor-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.honor-card{ background:#fff; border:1px solid #e9f4f6; border-radius:14px; overflow:hidden; box-shadow:0 4px 18px rgba(32,80,90,.06); transition:all .35s; }
.honor-card:hover{ transform:translateY(-8px); box-shadow:0 18px 42px rgba(32,80,90,.16); border-color:#cbeef2; }
.honor-img{ height:200px; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#f6fdfd,#eaf7f9); position:relative; overflow:hidden; }
.honor-img::after{ content:""; position:absolute; inset:0; background:radial-gradient(circle at 70% 20%,rgba(243,152,0,.12),transparent 60%); }
.honor-img svg{ position:relative; z-index:1; }
.honor-body{ padding:18px 20px 22px; text-align:center; }
.honor-body h4{ font-size:15px; font-weight:700; color:var(--text-dark); line-height:1.6; margin-bottom:8px; }
.honor-body p{ font-size:12.5px; color:#a4b6bb; letter-spacing:.5px; }

/* 资质证书（横向卡） */
.cert-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.cert-card{ background:#fff; border:1px solid #e9f4f6; border-radius:14px; padding:28px 26px; box-shadow:0 4px 18px rgba(32,80,90,.06); transition:all .35s; display:flex; gap:20px; }
.cert-card:hover{ transform:translateY(-6px); box-shadow:0 16px 38px rgba(32,80,90,.14); }
.cert-ic{ flex-shrink:0; width:56px; height:56px; border-radius:14px; background:linear-gradient(135deg,#e6f8fa,#d2f1f5); display:flex; align-items:center; justify-content:center; }
.cert-card:nth-child(even) .cert-ic{ background:linear-gradient(135deg,#fff1d6,#ffe4b3); }
.cert-card h4{ font-size:16px; font-weight:700; color:var(--text-dark); margin-bottom:8px; line-height:1.55; }
.cert-card p{ font-size:13.2px; color:var(--text-gray); line-height:1.8; }

/* 专利 / 列表表格 */
.tbl-wrap{ overflow-x:auto; }
.tbl{ width:100%; border-collapse:collapse; font-size:14.5px; min-width:620px; }
.tbl th{ background:linear-gradient(135deg,#f0fafc,#e6f6f9); color:var(--teal-deep); font-weight:700; text-align:left; padding:15px 18px; border:1px solid #ddf0f3; white-space:nowrap; }
.tbl td{ padding:14px 18px; border:1px solid #eaf3f4; color:var(--text-gray); line-height:1.8; }
.tbl tbody tr:hover td{ background:#fafdfe; }
.tbl .tnum{ font-family:Georgia,"Times New Roman",serif; color:var(--teal-dark); font-weight:600; white-space:nowrap; }

/* ============ 关于我们：图文 / 价值主张 ============ */
.about-grid{ display:grid; grid-template-columns:1fr 1.05fr; gap:56px; align-items:center; }
.about-img{ position:relative; border-radius:16px; overflow:hidden; box-shadow:0 24px 56px rgba(32,80,90,.2); }
.about-img img{ width:100%; display:block; }
.about-badge{ position:absolute; right:-1px; bottom:-1px; background:linear-gradient(135deg,#ffb43a,var(--orange)); color:#fff; padding:22px 30px; border-radius:16px 0 0 0; text-align:center; box-shadow:-4px -4px 18px rgba(243,152,0,.35); }
.about-badge .num{ font-size:30px; font-weight:700; line-height:1; }
.about-badge .txt{ font-size:12.5px; margin-top:6px; opacity:.9; letter-spacing:1px; }
.about-content .en-title{ font-size:14px; letter-spacing:5px; color:var(--orange); font-weight:600; text-transform:uppercase; }
.about-content h2{ font-size:32px; font-weight:700; margin:12px 0 20px; color:var(--teal-deep); letter-spacing:2px; line-height:1.35; }
.about-content > p{ font-size:15px; color:var(--text-gray); line-height:2; margin-bottom:22px; text-align:justify; }
.about-features{ display:grid; grid-template-columns:1fr 1fr; gap:16px 24px; margin-bottom:30px; }
.about-features li{ display:flex; align-items:center; gap:12px; font-size:14.5px; font-weight:500; }
.about-features .chk{ flex-shrink:0; width:26px; height:26px; border-radius:50%; background:linear-gradient(135deg,var(--teal),var(--teal-dark)); color:#fff; display:flex; align-items:center; justify-content:center; font-size:13px; }

/* 价值主张 / 文化 */
.value-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.value-card{ background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); border-radius:14px; padding:34px 26px; text-align:center; backdrop-filter:blur(6px); transition:all .35s; position:relative; z-index:2; }
.value-card:hover{ background:rgba(255,255,255,.12); transform:translateY(-6px); border-color:rgba(143,243,251,.45); }
.value-card .vi{ width:64px; height:64px; margin:0 auto 18px; border-radius:50%; background:rgba(143,243,251,.14); border:1px solid rgba(143,243,251,.3); display:flex; align-items:center; justify-content:center; }
.value-card h4{ font-size:17px; font-weight:700; color:#fff; margin-bottom:10px; letter-spacing:1px; }
.value-card p{ font-size:13.5px; color:rgba(255,255,255,.7); line-height:1.9; }

/* 三/四列优势卡 */
.adv-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.adv-card{ background:#fff; border:1px solid #e9f4f6; border-radius:14px; padding:36px 30px 32px; text-align:center; box-shadow:0 4px 18px rgba(32,80,90,.06); transition:all .35s; position:relative; overflow:hidden; }
.adv-card::before{ content:""; position:absolute; top:0; left:0; right:0; height:4px; background:linear-gradient(90deg,var(--teal),var(--orange)); transform:scaleX(0); transform-origin:left; transition:transform .35s; }
.adv-card:hover{ transform:translateY(-8px); box-shadow:0 18px 42px rgba(32,80,90,.15); }
.adv-card:hover::before{ transform:scaleX(1); }
.adv-ic{ width:84px; height:84px; margin:0 auto 22px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#e6f8fa,#d2f1f5); transition:all .35s; }
.adv-card:nth-child(even) .adv-ic{ background:linear-gradient(135deg,#fff1d6,#ffe4b3); }
.adv-card:hover .adv-ic{ transform:scale(1.08) rotate(-4deg); }
.adv-card h3{ font-size:18px; font-weight:700; margin-bottom:12px; color:var(--text-dark); }
.adv-card p{ font-size:14px; color:var(--text-gray); line-height:1.9; }

/* ============ 联系我们 ============ */
.contact-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.contact-card{ background:#fff; border:1px solid #e9f4f6; border-radius:14px; padding:32px 26px; text-align:center; box-shadow:0 4px 18px rgba(32,80,90,.06); transition:all .35s; }
.contact-card:hover{ transform:translateY(-6px); box-shadow:0 16px 38px rgba(32,80,90,.14); }
.contact-card .ci{ width:64px; height:64px; margin:0 auto 18px; border-radius:50%; background:linear-gradient(135deg,#e6f8fa,#d2f1f5); display:flex; align-items:center; justify-content:center; }
.contact-card:nth-child(even) .ci{ background:linear-gradient(135deg,#fff1d6,#ffe4b3); }
.contact-card h4{ font-size:16px; font-weight:700; color:var(--teal-deep); margin-bottom:10px; letter-spacing:1px; }
.contact-card p{ font-size:13.8px; color:var(--text-gray); line-height:1.9; }
.contact-card p b{ color:var(--text-dark); font-weight:600; }

.contact-main{ display:grid; grid-template-columns:1.05fr 1fr; gap:32px; align-items:start; }
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.form-item{ display:flex; flex-direction:column; gap:8px; }
.form-item.full{ grid-column:1 / -1; }
.form-item label{ font-size:13.5px; color:var(--text-gray); font-weight:600; }
.form-item label i{ color:var(--orange); font-style:normal; }
.form-item input, .form-item select, .form-item textarea{ border:1.5px solid #e2eff1; border-radius:10px; padding:13px 16px; font-size:14.5px; color:var(--text-dark); background:#fbfeff; outline:none; transition:all .25s; width:100%; }
.form-item input:focus, .form-item select:focus, .form-item textarea:focus{ border-color:var(--teal); background:#fff; box-shadow:0 0 0 4px rgba(21,191,204,.12); }
.form-item textarea{ resize:vertical; min-height:130px; line-height:1.8; }
.form-item input::placeholder, .form-item textarea::placeholder{ color:#adc2c7; }
.form-foot{ display:flex; align-items:center; gap:20px; flex-wrap:wrap; margin-top:24px; }
.form-tip{ font-size:12.5px; color:#a4b6bb; line-height:1.7; }
.form-ok{ display:none; margin-top:18px; padding:14px 20px; border-radius:10px; background:#f0fbf4; border:1px solid #c9ecd7; color:#1e8f5a; font-size:14px; }
.form-ok.show{ display:block; }

.map-box{ border-radius:14px; overflow:hidden; border:1px solid #e9f4f6; box-shadow:0 4px 18px rgba(32,80,90,.06); background:linear-gradient(135deg,#eef9fb,#e2f4f7); height:340px; position:relative; display:flex; align-items:center; justify-content:center; }
.map-box .map-pin{ text-align:center; color:var(--teal-deep); }
.map-box .map-pin .dot{ width:18px; height:18px; border-radius:50%; background:var(--orange); margin:0 auto 14px; box-shadow:0 0 0 8px rgba(243,152,0,.18),0 0 0 18px rgba(243,152,0,.09); }
.map-box .map-pin h4{ font-size:17px; font-weight:700; margin-bottom:8px; }
.map-box .map-pin p{ font-size:13.5px; color:var(--text-gray); }
.map-box svg.grid-bg{ position:absolute; inset:0; width:100%; height:100%; opacity:.5; }
.route-list{ padding:0; }
.route-list li{ display:flex; gap:14px; padding:16px 0; border-bottom:1px dashed #eaf3f4; font-size:14px; color:var(--text-gray); line-height:1.85; }
.route-list li:last-child{ border-bottom:none; }
.route-list .ri{ flex-shrink:0; width:34px; height:34px; border-radius:10px; background:var(--bg-teal); color:var(--teal-dark); display:flex; align-items:center; justify-content:center; font-size:15px; }
.route-list b{ display:block; color:var(--text-dark); margin-bottom:2px; }
/* 地图(左) + 到访指引(右) 两栏布局 */
.map-route{ grid-column:1 / -1; display:grid; grid-template-columns:1.05fr 1fr; gap:28px; align-items:stretch; }
.map-route .map-box{ height:auto; min-height:380px; }
.map-route .map-route-card{ margin-top:0; }
@media (max-width:1024px){
  .map-route{ grid-template-columns:1fr; }
  .map-route .map-box{ min-height:280px; }
}

/* ============ CTA 行动区 ============ */
.cta-band{ background:linear-gradient(150deg,var(--teal-deep) 0%,#0a5d68 60%,#084c55 100%); position:relative; overflow:hidden; padding:64px 24px; }
.cta-band::before{ content:""; position:absolute; width:460px; height:460px; border-radius:50%; background:radial-gradient(circle,rgba(255,180,58,.16),transparent 70%); top:-160px; right:-100px; }
.cta-band::after{ content:""; position:absolute; width:360px; height:360px; border-radius:50%; background:radial-gradient(circle,rgba(53,211,222,.16),transparent 70%); bottom:-140px; left:-90px; }
.cta-in{ max-width:1280px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:34px; flex-wrap:wrap; color:#fff; position:relative; z-index:1; }
.cta-in .cta-en{ font-size:12.5px; letter-spacing:4px; color:#ffd58a; font-weight:600; text-transform:uppercase; }
.cta-in h3{ font-size:27px; font-weight:700; letter-spacing:1.5px; margin:12px 0 12px; line-height:1.45; }
.cta-in p{ font-size:14.5px; color:rgba(255,255,255,.78); line-height:1.95; max-width:640px; }
.cta-btns{ display:flex; gap:14px; flex-wrap:wrap; flex-shrink:0; }

/* ============ 资料下载卡 ============ */
.side-docs{ padding:8px 20px 18px; }
.side-docs li{ border-bottom:1px dashed #eaf3f4; }
.side-docs li:last-child{ border-bottom:none; }
.side-docs a{ display:flex; align-items:center; gap:10px; padding:13px 0; font-size:13.8px; color:var(--text-dark); transition:all .25s; }
.side-docs a:hover{ color:var(--teal-dark); }
.side-docs .dico{ flex-shrink:0; width:26px; height:26px; border-radius:7px; background:var(--bg-teal); color:var(--teal-dark); display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; }

/* ============ 相关服务/相关阅读 ============ */
.rel-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.rel-grid a{ display:flex; align-items:center; gap:12px; background:#fbfeff; border:1px solid #eaf3f4; border-radius:10px; padding:14px 18px; font-size:14.2px; color:var(--text-dark); transition:all .25s; }
.rel-grid a:hover{ border-color:#bfe9ee; background:var(--bg-teal); color:var(--teal-dark); transform:translateX(4px); }
.rel-grid .rnum{ flex-shrink:0; width:24px; height:24px; border-radius:50%; background:linear-gradient(135deg,var(--teal),var(--teal-dark)); color:#fff; font-size:12px; display:flex; align-items:center; justify-content:center; }

/* ============ 翻页 ============ */
.pager{ display:flex; justify-content:center; align-items:center; gap:10px; flex-wrap:wrap; margin-top:46px; }
.pg{ min-width:42px; height:42px; padding:0 15px; border-radius:10px; border:1px solid #e2eff1; background:#fff; color:var(--text-gray); font-size:14px; display:flex; align-items:center; justify-content:center; transition:all .25s; }
.pg:hover{ border-color:var(--teal); color:var(--teal-dark); }
.pg.active{ background:linear-gradient(135deg,var(--teal),var(--teal-dark)); border-color:transparent; color:#fff; font-weight:600; box-shadow:0 8px 20px rgba(21,191,204,.32); }
.pg.disabled{ opacity:.42; pointer-events:none; }
.pg-dots{ color:#b9ccd0; padding:0 2px; }
.pg-info{ margin-left:10px; font-size:13px; color:var(--text-gray); }
.pg-info b{ color:var(--teal-dark); font-weight:600; }

/* ============ 页脚（黑色背景 + 8% 透明度细胞图） ============ */
.footer{ background:#0e0e0e; position:relative; color:rgba(255,255,255,.72); }
.footer::before{ content:""; position:absolute; inset:0; background:url('../images/cell.png') center/cover no-repeat; opacity:.08; pointer-events:none; }
.footer-inner{ max-width:1280px; margin:0 auto; padding:70px 24px 0; position:relative; z-index:1; }
.footer-grid{ display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr 1.2fr; gap:40px; padding-bottom:50px; }
.footer-brand .logo-text .cn{ color:#fff; }
.footer-brand .logo-text .en{ color:rgba(255,255,255,.5); }
.footer-brand p{ font-size:13.5px; line-height:1.95; margin-top:18px; }
.footer-col h4{ color:#fff; font-size:16px; margin-bottom:20px; letter-spacing:1px; position:relative; padding-bottom:10px; }
.footer-col h4::after{ content:""; position:absolute; left:0; bottom:0; width:28px; height:2.5px; background:var(--teal); }
.footer-col ul li{ margin-bottom:13px; }
.footer-col ul li a{ font-size:13.5px; transition:all .2s; }
.footer-col ul li a:hover{ color:var(--teal); padding-left:6px; }
.footer-contact li{ font-size:13.5px; margin-bottom:14px; display:flex; gap:10px; line-height:1.6; }
.footer-contact .ic{ color:var(--orange); flex-shrink:0; }
.footer-bottom{ position:relative; z-index:1; border-top:1px solid rgba(255,255,255,.12); padding:22px 0; text-align:center; font-size:12.5px; color:rgba(255,255,255,.45); background:rgba(0,0,0,.3); }
.footer-bottom a{ color:rgba(255,255,255,.45); margin:0 10px; }
.footer-bottom a:hover{ color:var(--teal); }

/* ============ 移动端菜单 ============ */
.hamburger{ display:none; margin-left:auto; width:46px; height:46px; background:none; border:none; cursor:pointer; flex-direction:column; align-items:center; justify-content:center; gap:6px; flex-shrink:0; }
.hamburger span{ width:26px; height:2.5px; background:var(--teal-deep); border-radius:2px; transition:all .3s; }
.hamburger.active span:nth-child(1){ transform:translateY(8.5px) rotate(45deg); }
.hamburger.active span:nth-child(2){ opacity:0; }
.hamburger.active span:nth-child(3){ transform:translateY(-8.5px) rotate(-45deg); }
.mobile-menu{ position:fixed; top:78px; left:0; right:0; bottom:0; background:#fff; z-index:999; overflow-y:auto; padding:22px 24px 48px; transform:translateX(100%); transition:transform .35s ease; -webkit-overflow-scrolling:touch; }
.mobile-menu.open{ transform:translateX(0); }
.mobile-menu .nav-search{ display:flex; margin:0 0 14px; }
.mobile-menu .search-box{ width:100%; }
.mobile-menu .nav-menu{ display:block; height:auto; }
.mobile-menu .nav-item{ height:auto; border-bottom:1px solid #eef4f5; }
.mobile-menu .nav-item > a{ height:auto; padding:15px 4px; justify-content:space-between; }
.mobile-menu .nav-item > a::after{ display:none; }
.mobile-menu .nav-item.open > a{ color:var(--teal-dark); }
.mobile-menu .nav-item.open > a .caret{ transform:rotate(180deg); }
.mobile-menu .nav-item > a.current{ color:var(--teal-dark); }
.mobile-menu .dropdown,.mobile-menu .sub-dropdown{ position:static; opacity:1; visibility:visible; transform:none; box-shadow:none; border-top:none; padding:4px 0; display:none; background:var(--bg-teal); border-radius:8px; min-width:0; margin:0 0 10px; }
.mobile-menu .nav-item.open > .dropdown{ display:block; }
.mobile-menu .dropdown li.open > .sub-dropdown{ display:block; background:#dff3f6; margin:4px 10px; }
.mobile-menu .dropdown > li > a{ padding:11px 20px; }

/* ============ 响应式适配 ============ */
@media (max-width:1300px){
  .search-box{ width:230px; }
  .nav-item > a{ padding:0 14px; font-size:15px; }
  .nav-item > a::after{ left:14px; right:14px; }
}
@media (max-width:1200px){
  .navbar-inner > .nav-menu,.navbar-inner > .nav-tools{ display:none; }
  .hamburger{ display:flex; }
}
@media (max-width:1024px){
  .page-banner{ height:296px; }
  .pb-inner h1{ font-size:32px; }
  .list-inner,.detail-inner{ grid-template-columns:1fr; gap:26px; }
  .side{ position:static; }
  .cat-list{ display:grid; grid-template-columns:repeat(3,1fr); gap:6px; }
  .cat-list li + li{ margin-top:0; }
  .svc-grid{ grid-template-columns:1fr; }
  .flow{ grid-template-columns:repeat(3,1fr); }
  .news-featured{ grid-template-columns:1fr; }
  .nf-img{ min-height:250px; }
  .honor-grid{ grid-template-columns:repeat(3,1fr); }
  .cert-grid{ grid-template-columns:1fr 1fr; }
  .value-grid{ grid-template-columns:1fr 1fr; }
  .adv-grid{ grid-template-columns:1fr 1fr; }
  .contact-grid{ grid-template-columns:1fr 1fr; }
  .contact-main{ grid-template-columns:1fr; }
  .stat-row{ grid-template-columns:repeat(2,1fr); row-gap:24px; }
  .stat-item:nth-child(2)::after{ display:none; }
  .about-grid{ grid-template-columns:1fr; gap:40px; }
  .article{ padding:34px 30px 40px; }
  .footer-grid{ grid-template-columns:1fr 1fr; gap:34px; }
}
@media (max-width:768px){
  .section{ padding:56px 18px; }
  .section-head{ margin-bottom:38px; }
  .section-head h2{ font-size:26px; }
  .topbar-inner{ justify-content:center; font-size:12px; }
  .topbar-inner > div:last-child{ display:none; }
  .tb-full{ display:none; }
  .navbar-inner{ height:64px; padding:0 16px; }
  .logo{ margin-right:0; gap:8px; }
  .logo img{ width:104px; }
  .logo-text .cn{ font-size:18px; }
  .logo-text .en{ font-size:10px; letter-spacing:1px; }
  .mobile-menu{ top:64px; }
  .btn{ padding:11px 26px; font-size:14px; }
  .btn-sm{ padding:9px 20px; font-size:13.5px; }

  /* 内页 */
  .page-banner{ height:236px; }
  .pb-en{ letter-spacing:3px; margin-bottom:10px; }
  .pb-inner h1{ font-size:25px; letter-spacing:2px; margin-bottom:10px; }
  .pb-inner p{ font-size:13.5px; line-height:1.8; }
  .crumb-in{ padding:12px 18px; }
  .list-wrap,.plain-wrap{ padding:26px 18px 62px; }
  .cat-list{ grid-template-columns:1fr; }
  .side-consult{ padding:22px 20px; }

  /* 卡片与列表 */
  .card{ padding:24px 20px; }
  .card-title h2{ font-size:18px; }
  .svc-card{ flex-direction:column; gap:16px; padding:24px 20px; }
  .svc-ic{ width:64px; height:64px; }
  .svc-ic svg{ width:36px; height:36px; }
  .flow{ grid-template-columns:1fr 1fr; gap:14px; }
  .flow-step{ padding:24px 14px 20px; }
  .flow-num{ width:44px; height:44px; font-size:17px; }
  .toolbar{ padding:12px 14px; }
  .tb-sorts button{ padding:7px 13px; font-size:13px; }
  .news-tabs{ width:100%; }
  .news-tab{ flex:1; padding:10px 6px; font-size:13.5px; letter-spacing:0; }
  .nf-body{ padding:24px 22px; }
  .nf-body h3{ font-size:18.5px; }
  .nf-img{ min-height:200px; }
  .news-row{ grid-template-columns:1fr; gap:16px; padding:16px; }
  .nr-img{ height:180px; }
  .lit-filter{ padding:6px 16px; }
  .lit-filter .frow{ flex-direction:column; gap:8px; }
  .lit-filter .flb{ padding-top:0; }
  .lit-card{ grid-template-columns:1fr; gap:16px; padding:22px 20px; }
  .lit-jnl{ border-right:none; border-bottom:1px solid #eef4f5; padding:0 0 14px; display:flex; align-items:center; gap:12px; justify-content:flex-start; }
  .lit-jnl .if{ margin-top:0; }
  .honor-grid{ grid-template-columns:1fr 1fr; gap:16px; }
  .honor-img{ height:150px; }
  .honor-body{ padding:14px 14px 18px; }
  .honor-body h4{ font-size:14px; }
  .cert-grid,.adv-grid,.value-grid{ grid-template-columns:1fr; }
  .contact-grid{ grid-template-columns:1fr; }
  .form-grid{ grid-template-columns:1fr; }
  .form-foot .btn{ width:100%; text-align:center; }
  .map-box{ height:240px; }
  .cta-band{ padding:44px 18px; }
  .cta-in h3{ font-size:21px; }
  .cta-in p{ font-size:13.8px; }
  .cta-btns{ width:100%; }
  .cta-btns .btn{ flex:1; text-align:center; }
  .rel-grid{ grid-template-columns:1fr; }
  .side-docs a{ font-size:13.4px; }
  .stat-row{ grid-template-columns:1fr 1fr; padding:24px 12px; }
  .stat-item .num{ font-size:26px; }
  .about-content h2{ font-size:25px; }
  .about-features{ grid-template-columns:1fr; }
  .about-badge{ padding:16px 22px; }
  .about-badge .num{ font-size:24px; }

  /* 文章 */
  .article{ padding:24px 18px 32px; }
  .art-head h1{ font-size:21px; }
  .art-body{ font-size:15px; line-height:1.95; }
  .art-body h2{ font-size:17.5px; margin:30px 0 16px; }
  .art-body h3{ font-size:16px; }
  .art-body blockquote{ padding:18px 18px; font-size:14.5px; }
  .art-body table{ font-size:13.5px; }
  .art-body table th,.art-body table td{ padding:11px 12px; }
  .art-nav{ grid-template-columns:1fr; }
  .art-nav .next{ text-align:left; }
  .faq-q{ font-size:14.5px; padding:16px 2px; }
  .faq-a p{ padding:0 8px 18px 2px; }

  /* 时间轴（移动端改为左侧单列） */
  .timeline::before{ left:11px; }
  .tl-item, .tl-item:nth-child(even){ width:100%; margin-left:0; padding:0 0 30px 42px; }
  .tl-dot, .tl-item:nth-child(even) .tl-dot{ right:auto; left:0; }
  .tl-card{ padding:20px 20px; }
  .tl-year{ font-size:18px; }

  .pager{ gap:8px; margin-top:34px; }
  .pg{ min-width:38px; height:38px; padding:0 12px; font-size:13.5px; }
  .pg-info{ width:100%; text-align:center; margin:6px 0 0; }
  .footer-grid{ grid-template-columns:1fr; gap:30px; }
  .tbl{ font-size:13.5px; min-width:520px; }
  .tbl th,.tbl td{ padding:11px 12px; }
}
@media (max-width:420px){
  .flow{ grid-template-columns:1fr; }
  .honor-grid{ grid-template-columns:1fr; }
  .stat-row{ grid-template-columns:1fr; row-gap:20px; }
  .stat-item::after{ display:none !important; }
}


/* =========================================================
   以下为首页 / 产品列表页专用样式（banner 轮播、产品卡片、文献卡片等）
   ========================================================= */

  .banner{ position:relative; height:560px; overflow:hidden; }
  .slides{ display:flex; height:100%; transition:transform .8s cubic-bezier(.65,.05,.36,1); }
  .slide{ min-width:100%; height:100%; position:relative; display:flex; align-items:center; justify-content:center; text-align:center; }
  .slide-1{ background:var(--teal-deep); }
  .slide-2{ background:#0a5d68; }
  .slide-3{ background:#7a4c00; }
  .slide-bg{ position:absolute; inset:0; z-index:0; }
  .slide-bg img{ width:100%; height:100%; object-fit:cover; }
  .slide-bg::after{ content:""; position:absolute; inset:0; }
  .slide-1 .slide-bg::after{ background:linear-gradient(100deg,rgba(10,84,94,.93) 15%,rgba(21,191,204,.55) 58%,rgba(21,191,204,.3)); }
  .slide-2 .slide-bg::after{ background:linear-gradient(100deg,rgba(7,70,80,.93) 15%,rgba(14,151,163,.55) 58%,rgba(14,151,163,.28)); }
  .slide-3 .slide-bg::after{ background:linear-gradient(100deg,rgba(110,60,0,.93) 15%,rgba(243,152,0,.5) 58%,rgba(243,152,0,.28)); }
  .molecule-overlay{ position:absolute; inset:0; z-index:3; pointer-events:none; opacity:.5; }
  .molecule-overlay svg{ width:100%; height:100%; }
  .slide-content{ color:#fff; position:relative; z-index:2; width:100%; max-width:860px; padding:0 24px; }
  .slide-tag{ display:inline-block; padding:7px 20px; border:1px solid rgba(255,255,255,.5); border-radius:20px; font-size:13px; letter-spacing:4px; margin-bottom:24px; backdrop-filter:blur(4px); }
  .slide h1{ font-size:46px; font-weight:700; letter-spacing:3px; line-height:1.3; margin-bottom:20px; text-shadow:0 2px 14px rgba(0,0,0,.25); }
  .slide h1 span{ background:linear-gradient(90deg,#8ff3fb,#ffd58a); -webkit-background-clip:text; background-clip:text; color:transparent; }
  .slide p{ font-size:17px; line-height:1.9; max-width:640px; margin:0 auto 36px; color:rgba(255,255,255,.9); }
  .slide-btns{ display:flex; gap:16px; justify-content:center; }
  .banner-dots{ position:absolute; bottom:28px; left:50%; transform:translateX(-50%); display:flex; gap:10px; z-index:5; }
  .banner-arrow{ position:absolute; top:50%; transform:translateY(-50%); width:52px; height:52px; border-radius:50%; border:1.5px solid rgba(255,255,255,.4); background:rgba(255,255,255,.1); color:#fff; font-size:20px; cursor:pointer; z-index:5; display:flex; align-items:center; justify-content:center; transition:all .25s; backdrop-filter:blur(4px); }
  .banner-arrow:hover{ background:rgba(255,255,255,.25); }
  .arrow-prev{ left:36px; }
  .arrow-next{ right:36px; }
  .about{ padding-top:100px; background:#fff; }
  .big-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; background:linear-gradient(135deg,#f6fdfd,#f0fafc); border:1px solid #ddf0f3; border-radius:14px; padding:30px 18px; }
  .big-stat{ text-align:center; position:relative; }
  .big-stat:not(:last-child)::after{ content:""; position:absolute; right:0; top:18%; height:64%; width:1px; background:#d5ebee; }
  .big-stat .num{ font-size:34px; font-weight:800; color:var(--teal); letter-spacing:1px; font-family:Georgia,"Times New Roman",serif; }
  .big-stat .num small{ font-size:17px; color:var(--orange); margin-left:2px; }
  .big-stat .txt{ font-size:13px; color:var(--text-gray); margin-top:7px; letter-spacing:1px; }
  .products{ background:linear-gradient(180deg,#fff 0%,var(--bg-teal) 100%); }
  .product-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
  .product-card{ background:#fff; border-radius:14px; padding:40px 32px 34px; text-align:center; position:relative; overflow:hidden; transition:all .35s ease; box-shadow:0 4px 18px rgba(32,80,90,.06); border:1px solid #e9f4f6; }
  .product-card::before{ content:""; position:absolute; top:0; left:0; right:0; height:4px; background:linear-gradient(90deg,var(--teal),var(--orange)); transform:scaleX(0); transform-origin:left; transition:transform .35s; }
  .product-card:hover{ transform:translateY(-8px); box-shadow:0 18px 42px rgba(32,80,90,.15); }
  .product-card:hover::before{ transform:scaleX(1); }
  .product-icon{ width:88px; height:88px; margin:0 auto 22px; border-radius:50%; display:flex; align-items:center; justify-content:center; transition:all .35s; }
  .product-card:nth-child(odd) .product-icon{ background:linear-gradient(135deg,#e6f8fa,#d2f1f5); }
  .product-card:nth-child(even) .product-icon{ background:linear-gradient(135deg,#fff1d6,#ffe4b3); }
  .product-card:hover .product-icon{ transform:scale(1.08) rotate(-4deg); }
  .product-card h3{ font-size:20px; font-weight:700; margin-bottom:6px; letter-spacing:1px; color:var(--text-dark); }
  .product-card .p-en{ font-size:12px; color:#a4b6bb; letter-spacing:2px; text-transform:uppercase; margin-bottom:14px; }
  .product-card p{ font-size:14px; color:var(--text-gray); line-height:1.75; margin-bottom:20px; }
  .product-link{ font-size:14px; color:var(--teal-dark); font-weight:600; letter-spacing:1px; display:inline-flex; align-items:center; gap:6px; transition:gap .25s; }
  .product-link:hover{ gap:12px; }
  .recommend{ background:linear-gradient(180deg,var(--bg-teal) 0%,#fff 42%); }
  .rec-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:26px; }
  .rec-card{ background:#fff; border-radius:14px; overflow:hidden; border:1px solid #e9f4f6; box-shadow:0 4px 18px rgba(32,80,90,.06); transition:all .35s ease; cursor:pointer; }
  .rec-card:hover{ transform:translateY(-8px); box-shadow:0 18px 42px rgba(32,80,90,.16); }
  .rec-img{ height:210px; overflow:hidden; position:relative; }
  .rec-img img{ width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
  .rec-card:hover .rec-img img{ transform:scale(1.1); }
  .rec-tag{ position:absolute; top:14px; left:14px; background:linear-gradient(90deg,#ffb43a,var(--orange)); color:#fff; font-size:12px; padding:4px 12px; border-radius:14px; letter-spacing:1px; z-index:2; box-shadow:0 3px 10px rgba(243,152,0,.4); }
  .rec-body{ padding:20px 22px 24px; }
  .rec-body h3{ font-size:17px; font-weight:700; line-height:1.45; margin-bottom:8px; transition:color .25s; color:var(--text-dark); }
  .rec-card:hover .rec-body h3{ color:var(--teal-dark); }
  .rec-body p{ font-size:13.5px; color:var(--text-gray); line-height:1.7; margin-bottom:12px; }
  .rec-code{ font-size:12.5px; color:var(--orange); font-weight:600; letter-spacing:1px; }
  .citations{ background:linear-gradient(150deg,var(--teal-deep) 0%,#0a5d68 60%,#084c55 100%); position:relative; overflow:hidden; }
  .citations::before{ content:""; position:absolute; width:520px; height:520px; border-radius:50%; background:radial-gradient(circle,rgba(255,180,58,.14),transparent 70%); top:-160px; right:-120px; }
  .citations::after{ content:""; position:absolute; width:420px; height:420px; border-radius:50%; background:radial-gradient(circle,rgba(53,211,222,.16),transparent 70%); bottom:-140px; left:-100px; }
  .citations .section-head h2{ color:#fff; }
  .citations .section-head p{ color:rgba(255,255,255,.68); }
  .cite-slider{ display:flex; align-items:center; gap:20px; position:relative; z-index:2; }
  .cite-viewport{ overflow:hidden; flex:1; }
  .cite-track{ display:flex; gap:26px; transition:transform .6s cubic-bezier(.65,.05,.36,1); }
  .cite-arrow{ flex-shrink:0; width:48px; height:48px; border-radius:50%; border:1.5px solid rgba(255,255,255,.4); background:rgba(255,255,255,.08); color:#fff; font-size:18px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .25s; backdrop-filter:blur(4px); }
  .cite-arrow:hover{ background:rgba(255,255,255,.24); transform:scale(1.06); }
  .cite-arrow.disabled{ opacity:.3; cursor:default; transform:none; background:rgba(255,255,255,.08); }
  .cite-card{ flex:0 0 calc((100% - 52px)/3); background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); border-radius:12px; padding:30px 28px; backdrop-filter:blur(6px); transition:all .35s; }
  .cite-card:hover{ background:rgba(255,255,255,.11); transform:translateY(-6px); border-color:rgba(143,243,251,.45); }
  .cite-top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:18px; }
  .cite-journal{ font-size:15px; font-weight:700; color:#ffd58a; font-style:italic; }
  .cite-if{ font-size:12px; color:#8ff3fb; border:1px solid rgba(143,243,251,.45); padding:3px 10px; border-radius:12px; }
  .cite-title{ font-size:15.5px; color:#fff; line-height:1.65; min-height:78px; margin-bottom:16px; font-weight:500; }
  .cite-meta{ font-size:13px; color:rgba(255,255,255,.62); line-height:1.9; border-top:1px dashed rgba(255,255,255,.18); padding-top:14px; }
  .cite-meta b{ color:#a9eef5; font-weight:600; }
  .more-wrap{ text-align:center; margin-top:44px; position:relative; z-index:2; }
  .btn-more{ display:inline-block; padding:13px 42px; border:1.5px solid rgba(255,255,255,.5); color:#fff; border-radius:30px; font-size:15px; letter-spacing:2px; transition:all .3s; }
  .btn-more:hover{ background:#fff; color:var(--teal-deep); }
  .news{ background:#fff; }
  .news-grid{ display:grid; grid-template-columns:1.15fr 1fr; gap:30px; }
  .news-main{ border-radius:14px; overflow:hidden; background:#fff; border:1px solid #eef4f5; box-shadow:0 10px 30px rgba(32,80,90,.12); display:flex; flex-direction:column; cursor:pointer; transition:all .35s; }
  .news-main:hover{ box-shadow:0 18px 44px rgba(32,80,90,.18); transform:translateY(-4px); }
  .news-main-img{ height:250px; overflow:hidden; flex-shrink:0; }
  .news-main-img img{ width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
  .news-main:hover .news-main-img img{ transform:scale(1.07); }
  .news-main-body{ padding:26px 28px 30px; flex:1; display:flex; flex-direction:column; justify-content:center; }
  .news-badge{ display:inline-block; background:var(--orange); color:#fff; font-size:12px; padding:5px 14px; border-radius:4px; letter-spacing:2px; margin-bottom:14px; width:max-content; }
  .news-main-body h3{ font-size:21px; line-height:1.7; font-weight:700; margin-bottom:12px; color:var(--text-dark); transition:color .25s; }
  .news-main:hover .news-main-body h3{ color:var(--teal-dark); }
  .news-summary{ font-size:14px; color:var(--text-gray); line-height:1.9; margin-bottom:14px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
  .news-main-body .date{ font-size:13px; color:#a4b6bb; letter-spacing:1px; }
  .news-list{ display:flex; flex-direction:column; gap:20px; }
  .news-item{ display:flex; gap:22px; background:#fff; border:1px solid #eef4f5; border-radius:12px; padding:26px 28px; align-items:center; transition:all .3s; cursor:pointer; }
  .news-item:hover{ box-shadow:0 12px 30px rgba(32,80,90,.13); transform:translateX(6px); border-color:#cbeef2; }
  .news-date{ flex-shrink:0; width:76px; text-align:center; border-right:1px solid #eef4f5; padding-right:22px; }
  .news-date .day{ font-size:28px; font-weight:700; color:var(--teal); line-height:1.1; }
  .news-date .ym{ font-size:12px; color:#a4b6bb; margin-top:4px; }
  .news-item-body h4{ font-size:16.5px; font-weight:600; line-height:1.75; margin-bottom:10px; transition:color .2s; }
  .news-item:hover .news-item-body h4{ color:var(--teal-dark); }
  .news-item-body p{ font-size:13.5px; color:var(--text-gray); line-height:1.95; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
@media (max-width:1024px){
  .product-grid{ grid-template-columns:repeat(2,1fr); }
  .rec-grid{ grid-template-columns:repeat(2,1fr); }
  .cite-card{ flex-basis:calc((100% - 26px)/2); }
  .news-grid{ grid-template-columns:1fr; }
  .big-stats{ grid-template-columns:repeat(2,1fr); row-gap:24px; }
  .big-stat:nth-child(2)::after{ display:none; }
  .slide h1{ font-size:36px; }
}

@media (max-width:768px){
  .banner{ height:460px; }
  .slide-content{ padding:0 22px; }
  .slide h1{ font-size:27px; letter-spacing:1px; }
  .slide p{ font-size:14px; margin-bottom:26px; }
  .slide-tag{ letter-spacing:2px; margin-bottom:18px; }
  .banner-arrow{ display:none; }
  .product-grid{ grid-template-columns:1fr; }
  .rec-grid{ grid-template-columns:1fr; }
  .cite-card{ flex-basis:100%; }
  .cite-arrow{ display:none; }
  .rec-img{ height:200px; }
  .cite-title{ min-height:0; }
  .news-item{ flex-direction:column; align-items:flex-start; gap:12px; }
  .news-date{ border-right:none; border-bottom:1px solid #eef4f5; padding:0 0 10px; width:100%; display:flex; align-items:baseline; gap:10px; }
  .big-stat .num{ font-size:28px; }
}

  .prod-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
  .pc{ display:flex; flex-direction:column; background:#fff; border:1px solid #e9f4f6; border-radius:14px; overflow:hidden; box-shadow:0 4px 18px rgba(32,80,90,.06); transition:all .35s ease; }
  .pc:hover{ transform:translateY(-8px); box-shadow:0 18px 42px rgba(32,80,90,.16); border-color:#cbeef2; }
  .pc-img{ position:relative; height:188px; overflow:hidden; background:#f6fbfc; }
  .pc-img img{ width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
  .pc:hover .pc-img img{ transform:scale(1.08); }
  .pc-tag{ position:absolute; top:12px; left:12px; z-index:2; background:linear-gradient(90deg,#ffb43a,var(--orange)); color:#fff; font-size:12px; padding:4px 12px; border-radius:14px; letter-spacing:1px; box-shadow:0 3px 10px rgba(243,152,0,.4); }
  .pc-tag.teal{ background:linear-gradient(90deg,var(--teal),var(--teal-dark)); box-shadow:0 3px 10px rgba(21,191,204,.4); }
  .pc-body{ padding:18px 20px 20px; display:flex; flex-direction:column; flex:1; }
  .pc-body h3{ font-size:16.5px; font-weight:700; line-height:1.5; margin-bottom:9px; color:var(--text-dark); transition:color .25s; }
  .pc:hover .pc-body h3{ color:var(--teal-dark); }
  .pc-desc{ font-size:13px; color:var(--text-gray); line-height:1.8; margin-bottom:14px; flex:1; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
  .pc-meta{ display:flex; justify-content:space-between; align-items:center; gap:10px; border-top:1px dashed #eaf3f4; padding-top:12px; font-size:12.5px; }
  .pc-code{ color:var(--orange); font-weight:600; letter-spacing:.5px; }
  .pc-spec{ color:#a4b6bb; }
@media (max-width:1024px){
  .prod-grid{ grid-template-columns:repeat(2,1fr); }
}

@media (max-width:768px){
  .prod-grid{ grid-template-columns:1fr; }
  .pc-img{ height:200px; }
}

  .mile-row{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
  .mile{ background:#fff; border:1px solid #e9f4f6; border-radius:14px; padding:28px 24px; box-shadow:0 4px 18px rgba(32,80,90,.06); transition:all .35s; position:relative; overflow:hidden; }
  .mile::before{ content:""; position:absolute; top:0; left:0; right:0; height:4px; background:linear-gradient(90deg,var(--teal),var(--orange)); transform:scaleX(0); transform-origin:left; transition:transform .35s; }
  .mile:hover{ transform:translateY(-6px); box-shadow:0 16px 38px rgba(32,80,90,.14); }
  .mile:hover::before{ transform:scaleX(1); }
  .mile .y{ font-size:26px; font-weight:800; color:var(--teal); font-family:Georgia,"Times New Roman",serif; letter-spacing:1px; }
  .mile h4{ font-size:16px; font-weight:700; color:var(--text-dark); margin:10px 0 10px; }
  .mile p{ font-size:13.4px; color:var(--text-gray); line-height:1.9; }
@media (max-width:1024px){
  .mile-row{ grid-template-columns:1fr 1fr; }
}

@media (max-width:768px){
  .mile-row{ grid-template-columns:1fr; }
}

  .pd-top{ display:grid; grid-template-columns:1.05fr 1fr; gap:36px; align-items:start; margin-bottom:34px; }
  .pd-gallery{ background:#fff; border:1px solid #e9f4f6; border-radius:14px; box-shadow:0 4px 18px rgba(32,80,90,.06); padding:18px; }
  .pd-main{ position:relative; border-radius:10px; overflow:hidden; background:#f6fbfc; aspect-ratio:4/3; }
  .pd-main img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease, opacity .3s; }
  .pd-main:hover img{ transform:scale(1.05); }
  .pd-main .pd-tag{ position:absolute; top:14px; left:14px; z-index:2; background:linear-gradient(90deg,#ffb43a,var(--orange)); color:#fff; font-size:12px; padding:4px 12px; border-radius:14px; letter-spacing:1px; box-shadow:0 3px 10px rgba(243,152,0,.4); }
  .pd-arrow{ position:absolute; top:50%; transform:translateY(-50%); width:42px; height:42px; border-radius:50%; border:1.5px solid rgba(255,255,255,.55); background:rgba(12,103,115,.35); color:#fff; font-size:17px; cursor:pointer; z-index:2; display:flex; align-items:center; justify-content:center; transition:all .25s; backdrop-filter:blur(3px); }
  .pd-arrow:hover{ background:rgba(12,103,115,.65); }
  .pd-arrow.prev{ left:12px; }
  .pd-arrow.next{ right:12px; }
  .pd-count{ position:absolute; right:14px; bottom:12px; z-index:2; background:rgba(12,103,115,.55); color:#fff; font-size:12px; padding:4px 12px; border-radius:14px; backdrop-filter:blur(3px); letter-spacing:1px; }
  .pd-thumbs{ display:grid; grid-template-columns:repeat(5,1fr); gap:10px; margin-top:14px; }
  .pd-thumb{ border:2px solid transparent; border-radius:8px; overflow:hidden; cursor:pointer; aspect-ratio:1/1; background:#f6fbfc; padding:0; transition:all .25s; }
  .pd-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
  .pd-thumb:hover{ border-color:#bfe9ee; }
  .pd-thumb.active{ border-color:var(--teal); box-shadow:0 6px 16px rgba(21,191,204,.28); }
  .pd-info{ background:#fff; border:1px solid #e9f4f6; border-radius:14px; box-shadow:0 4px 18px rgba(32,80,90,.06); padding:34px 36px; }
  .pd-badge.teal{ background:var(--bg-teal); color:var(--teal-dark); border:1px solid #ddf0f3; }
  .pd-info h1{ font-size:26px; font-weight:700; line-height:1.55; color:var(--text-dark); letter-spacing:.5px; margin-bottom:8px; }
  .pd-info .en-name{ font-size:13px; color:#a4b6bb; letter-spacing:1px; margin-bottom:20px; }
  .pd-desc{ font-size:14.5px; color:var(--text-gray); line-height:2; border-bottom:1px dashed #eaf3f4; padding-bottom:20px; margin-bottom:20px; text-align:justify; }
  .pd-params{ display:grid; grid-template-columns:1fr 1fr; gap:0 24px; margin-bottom:24px; }
  .pd-params li{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:11px 2px; border-bottom:1px dashed #eaf3f4; font-size:13.5px; }
  .pd-params .k{ color:#a4b6bb; flex-shrink:0; }
  .pd-params .v{ color:var(--text-dark); text-align:right; }
  .pd-params .v b{ color:var(--orange); font-weight:600; letter-spacing:.5px; }
  .pd-btns{ display:flex; gap:12px; flex-wrap:wrap; }
  .pd-btns .btn{ display:inline-flex; align-items:center; gap:8px; }
  .pd-tabs{ display:flex; gap:0; margin-bottom:0; border:1.5px solid #d8eaed; border-radius:14px 14px 0 0; overflow:hidden; width:max-content; background:#fff; border-bottom:none; }
  .pd-tab{ padding:12px 30px; font-size:15px; font-weight:600; color:var(--text-gray); cursor:pointer; transition:all .25s; border:none; background:#fff; letter-spacing:2px; }
  .pd-tab.active{ background:linear-gradient(90deg,var(--teal),var(--teal-dark)); color:#fff; }
  .pd-tab:not(.active):hover{ color:var(--teal-dark); }
  .pd-panel{ display:none; background:#fff; border:1px solid #e9f4f6; border-radius:0 14px 14px 14px; box-shadow:0 4px 18px rgba(32,80,90,.06); padding:38px 40px 44px; }
  .pd-panel.active{ display:block; }
  .pd-figs{ display:grid; grid-template-columns:1fr 1fr; gap:20px; margin:6px 0 24px; }
  .pd-fig{ border:1px solid #eef4f5; border-radius:12px; overflow:hidden; background:#f6fbfc; }
  .pd-fig img{ width:100%; aspect-ratio:4/3; object-fit:cover; display:block; transition:transform .5s; }
  .pd-fig:hover img{ transform:scale(1.05); }
  .pd-fig figcaption{ font-size:13px; color:#a4b6bb; text-align:center; padding:10px 12px; background:#fff; }
  .relprod-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
  .rp{ display:flex; flex-direction:column; background:#fff; border:1px solid #e9f4f6; border-radius:14px; overflow:hidden; box-shadow:0 4px 18px rgba(32,80,90,.06); transition:all .35s ease; }
  .rp:hover{ transform:translateY(-8px); box-shadow:0 18px 42px rgba(32,80,90,.16); border-color:#cbeef2; }
  .rp-img{ height:168px; overflow:hidden; background:#f6fbfc; }
  .rp-img img{ width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
  .rp:hover .rp-img img{ transform:scale(1.08); }
  .rp-body{ padding:16px 18px 18px; display:flex; flex-direction:column; flex:1; }
  .rp-body h4{ font-size:15px; font-weight:700; line-height:1.55; margin-bottom:8px; color:var(--text-dark); transition:color .25s; }
  .rp:hover .rp-body h4{ color:var(--teal-dark); }
  .rp-meta{ margin-top:auto; display:flex; justify-content:space-between; align-items:center; gap:8px; border-top:1px dashed #eaf3f4; padding-top:10px; font-size:12.5px; }
  .rp-code{ color:var(--orange); font-weight:600; }
  .rp-spec{ color:#a4b6bb; }
@media (max-width:1024px){
  .pd-top{ grid-template-columns:1fr; gap:24px; }
  .relprod-grid{ grid-template-columns:1fr 1fr; }
  .pd-panel{ padding:28px 24px 34px; }
}

@media (max-width:768px){
  .pd-info{ padding:24px 20px; }
  .pd-info h1{ font-size:20px; }
  .pd-params{ grid-template-columns:1fr; }
  .pd-tabs{ width:100%; border-radius:12px 12px 0 0; }
  .pd-tab{ flex:1; padding:11px 6px; font-size:13.5px; letter-spacing:0; }
  .pd-panel{ border-radius:0 0 12px 12px; padding:22px 18px 28px; }
  .pd-figs{ grid-template-columns:1fr; }
  .pd-thumbs{ grid-template-columns:repeat(4,1fr); gap:8px; }
  .relprod-grid{ grid-template-columns:1fr; }
  .pd-btns .btn{ flex:1; text-align:center; justify-content:center; }
}


/* =========================================================
   以下是适配 EyouCMS 标签输出结构的补充样式
   ========================================================= */

/* ---------- 内页 Banner：支持后台栏目图片作为背景 ---------- */
.pb-bg{ background-color:#0c6773; background-position:center; background-size:cover; background-repeat:no-repeat; }

/* ---------- 首页新闻面板：与网格布局配合需要 display:grid ---------- */
.news-grid.news-panel.active{ display:grid; }

/* ---------- 文章正文内的通用元素兜底（后台富文本输出） ---------- */
.art-body{ overflow-wrap:break-word; word-break:break-word; }
.art-body p{ margin-bottom:22px; }
.art-body ul, .art-body ol{ margin:0 0 22px; }
.art-body ul li, .art-body ol li{ margin-bottom:11px; line-height:1.95; }
.art-body ul{ list-style:none; }
.art-body ul li{ position:relative; padding-left:24px; }
.art-body ul li::before{ content:""; position:absolute; left:4px; top:12px; width:7px; height:7px; border-radius:50%; background:var(--teal); }
.art-body a{ color:var(--teal-dark); border-bottom:1px dashed #bfe9ee; }
.art-body a:hover{ border-bottom-style:solid; }
.art-body hr{ border:none; border-top:1px dashed #e2eff1; margin:30px 0; }
.art-body > div{ margin-bottom:16px; }
.art-body iframe, .art-body video{ max-width:100%; border-radius:12px; }
.art-body > :first-child{ margin-top:0; }
.art-body > :last-child{ margin-bottom:0; }

/* ---------- EyouCMS 原生分页（{eyou:pagelist} 输出 ul.pagination > li > a） ---------- */
.pagination{ display:flex; justify-content:center; align-items:center; gap:10px; flex-wrap:wrap; margin-top:46px; list-style:none; }
.pagination li{ display:inline-flex; }
.pagination li a{ min-width:42px; height:42px; padding:0 15px; border-radius:10px; border:1px solid #e2eff1; background:#fff; color:var(--text-gray); font-size:14px; display:inline-flex; align-items:center; justify-content:center; transition:all .25s; }
.pagination li a:hover{ border-color:var(--teal); color:var(--teal-dark); }
.pagination li.active a{ background:linear-gradient(135deg,var(--teal),var(--teal-dark)); border-color:transparent; color:#fff; font-weight:600; box-shadow:0 8px 20px rgba(21,191,204,.32); }

/* ---------- 产品参数 / 规格表（详情页） ---------- */
.spec-list{ display:grid; grid-template-columns:repeat(2,1fr); gap:0 30px; margin-bottom:26px; }
.spec-list li{ display:flex; gap:12px; padding:13px 0; border-bottom:1px dashed #eaf3f4; font-size:14px; color:var(--text-gray); line-height:1.8; }
.spec-list li .lb{ flex-shrink:0; color:#a4b6bb; min-width:88px; }
.spec-list li .vl{ color:var(--text-dark); font-weight:600; }

/* ---------- 详情页图集缩略图 ---------- */
.thumb-list{ display:flex; flex-wrap:wrap; gap:12px; margin-top:18px; }
.thumb-list a{ width:88px; height:88px; border-radius:10px; overflow:hidden; border:1.5px solid #e2eff1; transition:all .25s; }
.thumb-list a:hover, .thumb-list a.active{ border-color:var(--teal); box-shadow:0 8px 20px rgba(21,191,204,.22); }
.thumb-list img{ width:100%; height:100%; object-fit:cover; display:block; }

/* ---------- 价格 / 点击量 ---------- */
.price-row{ display:flex; align-items:baseline; gap:16px; flex-wrap:wrap; margin-bottom:18px; }
.price-row .p-now{ font-size:28px; font-weight:800; color:var(--orange); font-family:Georgia,"Times New Roman",serif; letter-spacing:1px; }
.price-row .p-old{ font-size:15px; color:#a4b6bb; text-decoration:line-through; }
.price-row .p-hit{ font-size:13px; color:#a4b6bb; }

/* ---------- 空白提示 ---------- */
.empty-tip{ padding:80px 20px; text-align:center; color:#a4b6bb; font-size:15px; }
.empty-tip b{ display:block; font-size:44px; color:#dff0f3; margin-bottom:14px; font-weight:800; font-family:Georgia,"Times New Roman",serif; }

/* ---------- 表单提交按钮 & 提示（EyouCMS 自定义表单） ---------- */
.ey-form-item{ display:flex; flex-direction:column; gap:8px; }
.ey-form-item label{ font-size:13.5px; color:var(--text-gray); font-weight:600; }
.ey-form-item input,.ey-form-item select,.ey-form-item textarea{ border:1.5px solid #e2eff1; border-radius:10px; padding:13px 16px; font-size:14.5px; color:var(--text-dark); background:#fbfeff; outline:none; transition:all .25s; width:100%; font-family:inherit; }
.ey-form-item input:focus,.ey-form-item select:focus,.ey-form-item textarea:focus{ border-color:var(--teal); background:#fff; box-shadow:0 0 0 4px rgba(21,191,204,.12); }
.ey-form-item textarea{ resize:vertical; min-height:130px; line-height:1.8; }

/* ---------- 富文本卡片（栏目简介等） ---------- */
.intro-text{ font-size:15px; color:var(--text-gray); line-height:2; text-align:justify; }
.intro-text p{ margin-bottom:16px; }

/* ---------- 选项卡 / 排序条：由 button 改为 a 标签后的兼容 ---------- */
.news-tabs a.news-tab{ display:flex; align-items:center; justify-content:center; white-space:nowrap; }
.tb-sorts a{ border:1px solid #dff0f2; background:#f7fcfd; color:var(--text-gray); font-size:13.5px; padding:8px 18px; border-radius:20px; transition:all .25s; cursor:pointer; }
.tb-sorts a:hover{ color:var(--teal-dark); border-color:#bfe9ee; }
.tb-sorts a.active{ background:linear-gradient(90deg,var(--teal),var(--teal-dark)); color:#fff; border-color:transparent; box-shadow:0 5px 14px rgba(21,191,204,.3); }

/* ---------- 侧栏：栏目导航（{eyou:models} 输出）补位 ---------- */
.cat-list a.current{ background:linear-gradient(135deg,var(--teal),var(--teal-dark)); color:#fff; box-shadow:0 6px 16px rgba(21,191,204,.32); }

/* ---------- 首页：产品分类卡片的图标位（后台无图标字段时用色块兜底） ---------- */
.product-icon img{ width:46px; height:46px; object-fit:contain; }

/* ---------- 首页新闻面板里的“主推 + 列表”结构 ---------- */
.home-news-wrap{ display:grid; grid-template-columns:1.15fr 1fr; gap:30px; }
@media (max-width:1024px){ .home-news-wrap{ grid-template-columns:1fr; } }

/* ---------- 文献筛选 / 服务筛选 ---------- */
.lit-filter .fopts a.current{ background:linear-gradient(90deg,var(--teal),var(--teal-dark)); color:#fff; box-shadow:0 5px 14px rgba(21,191,204,.28); }

/* ---------- 表格内的详情页正文（后台富文本表格） ---------- */
.tbl-wrap{ overflow-x:auto; }

/* ---------- EyouCMS 面包屑（{eyou:position/} 输出 a + 文本 + 分隔符） ---------- */
.crumb-bar .crumb-in{ display:block; line-height:1.9; }
.crumb-bar .crumb-in a{ transition:color .2s; }
.crumb-bar .crumb-in a:hover{ color:var(--teal-dark); }
/* 最后一级为当前页，弱化为纯文字 */
.crumb-bar .crumb-in a:last-child{ color:var(--teal-dark); font-weight:600; pointer-events:none; }
/* 面包屑在窄屏可换行 */
@media (max-width:760px){ .crumb-bar .crumb-in{ font-size:12.5px; } }

/* ---------- 排序条的选中态（{eyou:Diyurl} 默认输出 class="ey_active"） ---------- */
.tb-sorts a.ey_active{ background:linear-gradient(90deg,var(--teal),var(--teal-dark)); color:#fff; border-color:transparent; box-shadow:0 5px 14px rgba(21,191,204,.3); }

/* ---------- 页脚：二维码 / 友情链接 ---------- */
.footer-brand .logo img{ max-height:46px; width:auto; }
.footer-qr{ display:flex; gap:14px; align-items:flex-start; }
.footer-qr img{ width:112px; height:112px; border-radius:10px; background:#fff; padding:5px; object-fit:contain; }
.footer-qr p{ font-size:12.5px; line-height:1.7; }
.footer-links{ position:relative; z-index:1; max-width:1280px; margin:0 auto; padding:0 24px 26px; font-size:12.5px; color:rgba(255,255,255,.45); line-height:2; }
.footer-links b{ color:rgba(255,255,255,.62); font-weight:600; margin-right:6px; }

/* ---------- 模板中把「图片容器」写成 a 标签时的显示修正 ---------- */
.rec-img, .news-main-img{ display:block; }
.rec-body h3 a, .news-main-body h3 a, .product-card h3 a, .news-item, .news-item-body h4{ color:inherit; }
.product-card .product-icon img{ width:46px; height:46px; object-fit:contain; }
/* 栏目图标未上传时模板内置 SVG 图标的间距 */
.product-card .product-icon svg{ display:block; }

/* ---------- EyouCMS 分页 {eyou:pagelist/} 输出 li 结构，套用 .pg 视觉 ---------- */
.pager li{ list-style:none; }
.pager li > a{
  min-width:42px; height:42px; padding:0 15px; border-radius:10px; border:1px solid #e2eff1; background:#fff;
  color:var(--text-gray); font-size:14px; display:flex; align-items:center; justify-content:center; transition:all .25s;
}
.pager li > a:hover{ border-color:var(--teal); color:var(--teal-dark); }
.pager li.active > a{ background:linear-gradient(135deg,var(--teal),var(--teal-dark)); border-color:transparent; color:#fff; font-weight:600; box-shadow:0 8px 20px rgba(21,191,204,.32); }
.pager li.disabled > a{ opacity:.42; pointer-events:none; }
.pager li > a[data-ey_fc35fdc]{ cursor:pointer; }
.pg-info-wrap{ text-align:center; margin-top:16px; font-size:13px; color:var(--text-gray); }
.pg-info-wrap b{ color:var(--teal-dark); font-weight:600; }

/* ---------- 空数据 / 选项卡无子栏目时自动隐藏 ---------- */
.news-tabs:not(:has(a)){ display:none; }
.empty-tip{ text-align:center; padding:60px 20px; color:var(--text-gray); font-size:14.5px; letter-spacing:1px; background:#fff; border:1px dashed #d8eaed; border-radius:12px; }

/* ---------- 产品详情：顶部「图集 + 信息」双栏 ---------- */
.prod-top{ display:grid; grid-template-columns:1fr 1fr; gap:38px; margin-bottom:38px; align-items:start; }
.prod-main{ display:block; border:1px solid #e9f4f6; border-radius:14px; overflow:hidden; background:#fff; box-shadow:0 8px 26px rgba(32,80,90,.07); }
.prod-main img{ width:100%; display:block; }
.prod-info h1{ font-size:26px; font-weight:700; line-height:1.55; margin:14px 0 14px; color:var(--text-dark); }
.prod-info .art-badge{ display:inline-block; background:var(--orange); color:#fff; font-size:12px; padding:5px 14px; border-radius:4px; letter-spacing:2px; }
.prod-sum{ font-size:14.5px; color:var(--text-gray); line-height:2; margin-bottom:20px; }
.prod-title-l{ font-size:20px; font-weight:700; color:var(--text-dark); letter-spacing:1px; padding-left:14px; border-left:4px solid var(--teal); margin:36px 0 22px; }
.thumb-list a{ display:block; }

/* ---------- EyouCMS 购物车 / 规格组件（{eyou:sppurchase}） ---------- */
.ey-spec{ margin-bottom:18px; }
.ey-spec .row{ display:flex; align-items:flex-start; gap:14px; flex-wrap:wrap; margin-top:14px; }
.ey-spec label{ font-size:13.5px; color:var(--text-gray); min-width:70px; line-height:2.6; }
.ey-spec a{ display:inline-block; padding:8px 18px; border:1.5px solid #e2eff1; border-radius:8px; font-size:13.5px; color:var(--text-gray); margin:0 8px 8px 0; transition:all .25s; }
.ey-spec a:hover{ border-color:var(--teal); color:var(--teal-dark); }
.ey-spec a.btn-selected, .ey-spec a.active{ border-color:var(--teal); background:var(--bg-teal); color:var(--teal-dark); font-weight:600; }
.ey-number{ display:flex; align-items:center; gap:14px; margin:18px 0; font-size:13.5px; color:var(--text-gray); }
.ey-number .btn-input{ display:flex; align-items:center; border:1.5px solid #e2eff1; border-radius:10px; overflow:hidden; }
.ey-number .btn-input button{ width:40px; height:40px; border:none; background:#f7fcfd; color:var(--text-dark); font-size:18px; cursor:pointer; transition:all .2s; }
.ey-number .btn-input button:hover{ background:var(--bg-teal); color:var(--teal-dark); }
.ey-number .btn-input input{ width:74px; height:40px; border:none; text-align:center; font-size:14.5px; color:var(--text-dark); outline:none; }
.ey-buyaction{ display:flex; gap:14px; flex-wrap:wrap; margin:22px 0 10px; }
.ey-buyaction a{ display:inline-flex; align-items:center; justify-content:center; padding:13px 38px; border-radius:30px; font-size:15px; letter-spacing:1px; transition:all .3s; }
.ey-buyaction .ey-joinin{ background:linear-gradient(90deg,var(--teal),var(--teal-dark)); color:#fff; box-shadow:0 8px 20px rgba(21,191,204,.3); }
.ey-buyaction .ey-joinbuy{ background:linear-gradient(90deg,#ffb43a,var(--orange)); color:#fff; box-shadow:0 8px 20px rgba(243,152,0,.3); }
.ey-buyaction a:hover{ transform:translateY(-2px); }

/* ---------- 服务卡片内的图标与链接（{eyou:list} 循环） ---------- */
.svc-ic{ flex-shrink:0; }
.svc-card{ align-items:flex-start; }
.svc-link{ display:inline-block; margin-top:14px; font-size:14px; color:var(--teal-dark); font-weight:600; letter-spacing:1px; }

/* ---------- 文献列表卡片 ---------- */
.lit-card{ display:flex; gap:26px; background:#fff; border:1px solid #e9f4f6; border-radius:12px; padding:26px 28px; margin-bottom:20px; transition:all .3s; }
.lit-card:hover{ box-shadow:0 12px 32px rgba(32,80,90,.12); transform:translateY(-3px); border-color:#cbeef2; }
.lit-jnl{ flex-shrink:0; width:110px; text-align:center; }
.lit-jnl .j{ font-size:16px; font-weight:700; color:var(--teal-deep); }
.lit-jnl .if{ display:inline-block; margin-top:8px; font-size:12px; color:var(--orange); background:var(--bg-orange); border-radius:12px; padding:3px 10px; }
.lit-body{ flex:1; min-width:0; }
.lit-body h3{ font-size:16.5px; font-weight:700; line-height:1.7; color:var(--text-dark); margin-bottom:12px; }
.lit-body h3 a{ color:inherit; }
.lit-card:hover .lit-body h3{ color:var(--teal-dark); }
.lit-tags{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.lit-tags span{ font-size:12px; color:var(--teal-dark); background:var(--bg-teal); border-radius:12px; padding:3px 12px; }
.lit-meta{ display:flex; gap:22px; flex-wrap:wrap; font-size:12.5px; color:#a4b6bb; }
.lit-meta b{ color:var(--text-dark); }
@media (max-width:760px){
  .lit-card{ flex-direction:column; gap:14px; }
  .lit-jnl{ width:auto; text-align:left; }
}

/* ---------- EyouCMS 自定义表单（{$field.attrlist} 自动生成的字段） ---------- */
.eyou_form_attr{ display:flex; flex-direction:column; gap:8px; margin-bottom:0; }
.eyou_form_attr label{ font-size:13.5px; color:var(--text-gray); font-weight:600; display:inline-flex; align-items:center; gap:6px; }
.eyou_form_text, .eyou_form_select, .eyou_form_textarea, .eyou_form_file{
  border:1.5px solid #e2eff1; border-radius:10px; padding:13px 16px; font-size:14.5px; color:var(--text-dark);
  background:#fbfeff; outline:none; transition:all .25s; width:100%; font-family:inherit;
}
.eyou_form_text:focus, .eyou_form_select:focus, .eyou_form_textarea:focus{ border-color:var(--teal); background:#fff; box-shadow:0 0 0 4px rgba(21,191,204,.12); }
.eyou_form_textarea{ resize:vertical; min-height:130px; line-height:1.8; }
.eyou_form_radio, .eyou_form_checkbox{ accent-color:var(--teal); }
.eyou_form_verify_img{ vertical-align:middle; border-radius:6px; margin-top:6px; }
.eyou_form_phone_btn{ display:inline-block; margin-top:8px; padding:9px 18px; border:none; border-radius:8px; background:var(--bg-teal); color:var(--teal-dark); font-size:13.5px; cursor:pointer; }
#eyou_form_verify{ display:flex; flex-direction:column; gap:8px; }
@media (max-width:760px){ .form-grid{ grid-template-columns:1fr; } }

/* ---------- 荣誉卡片 / 服务卡片内使用上传图片时的显示修正 ---------- */
.honor-img img{ width:100%; height:100%; object-fit:cover; position:relative; z-index:1; display:block; }
.svc-ic img{ width:100%; height:100%; object-fit:contain; border-radius:50%; }

/* ---------- 通用图片卡片网格（图集 / 视频 / 专题列表） ---------- */
.pic-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.pic-card{ display:block; background:#fff; border:1px solid #e9f4f6; border-radius:14px; overflow:hidden; box-shadow:0 4px 18px rgba(32,80,90,.06); transition:all .35s; }
.pic-card:hover{ transform:translateY(-8px); box-shadow:0 18px 42px rgba(32,80,90,.16); border-color:#cbeef2; }
.pic-img{ position:relative; height:220px; overflow:hidden; background:#f6fbfc; }
.pic-img img{ width:100%; height:100%; object-fit:cover; transition:transform .6s ease; display:block; }
.pic-card:hover .pic-img img{ transform:scale(1.08); }
.pic-play{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:rgba(10,84,94,.28); color:#fff; font-size:30px; }
.pic-body{ padding:16px 20px 20px; }
.pic-body h3{ font-size:15.5px; font-weight:700; color:var(--text-dark); line-height:1.6; transition:color .25s; }
.pic-card:hover .pic-body h3{ color:var(--teal-dark); }
.pic-body p{ font-size:12.5px; color:#a4b6bb; margin-top:8px; letter-spacing:.5px; }
@media (max-width:1024px){ .pic-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .pic-grid{ grid-template-columns:1fr; } }

/* ---------- 招聘岗位卡片 ---------- */
.job-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:22px; }
.job-card{ display:block; background:#fff; border:1px solid #e9f4f6; border-radius:14px; padding:26px 28px; box-shadow:0 4px 18px rgba(32,80,90,.06); transition:all .3s; }
.job-card:hover{ transform:translateY(-4px); box-shadow:0 16px 38px rgba(32,80,90,.14); border-color:#cbeef2; }
.job-card h3{ font-size:18px; font-weight:700; color:var(--text-dark); margin-bottom:14px; transition:color .25s; }
.job-card:hover h3{ color:var(--teal-dark); }
.job-card .job-meta{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:14px; }
.job-card .job-meta span{ font-size:12.5px; color:var(--teal-dark); background:var(--bg-teal); border-radius:12px; padding:4px 12px; }
.job-card .job-date{ font-size:12.5px; color:#a4b6bb; }
@media (max-width:760px){ .job-grid{ grid-template-columns:1fr; } }

/* ---------- 标签云（{eyou:tags} 输出） ---------- */
.tag-cloud{ display:flex; flex-wrap:wrap; gap:12px; }
.tag-cloud a{ display:inline-block; padding:8px 18px; border-radius:20px; border:1px solid #dff0f2; background:#f7fcfd; color:var(--text-gray); font-size:13.5px; transition:all .25s; }
.tag-cloud a:hover{ background:linear-gradient(90deg,var(--teal),var(--teal-dark)); color:#fff; border-color:transparent; box-shadow:0 6px 16px rgba(21,191,204,.28); }
.tag-cloud a .n{ font-size:11.5px; opacity:.7; margin-left:5px; }
.footer-links a{ margin-right:14px; transition:color .2s; }
.footer-links a:hover{ color:var(--teal); }

/* ---------- EyouCMS 表单（{eyou:form}）在栅格中的排版 ---------- */
.contact-main .form-grid{ grid-template-columns:1fr 1fr; }
@media (max-width:768px){ .contact-main .form-grid{ grid-template-columns:1fr; } }

/* ---------- 响应式补充 ---------- */
@media (max-width:1024px){
  .spec-list{ grid-template-columns:1fr; }
}
@media (max-width:768px){
  .pagination{ gap:8px; margin-top:34px; }
  .pagination li a{ min-width:38px; height:38px; padding:0 12px; font-size:13.5px; }
  .scan-widget button{ width:100%; }
}

/* ================================================================
   以下为后台模型模板新增组件（图集 / 下载 / 招聘 / 视频 详情页）
   ================================================================ */

/* ---------- 详情页 Tag 标签行 ---------- */
.art-tags{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:30px; padding-top:24px; border-top:1px dashed #eef4f5; }
.art-tags .lb{ font-size:13px; color:#a4b6bb; letter-spacing:1px; }
.art-tags a{ display:inline-block; padding:6px 16px; border-radius:18px; border:1px solid #dff0f2; background:#f7fcfd; color:var(--text-gray); font-size:13px; transition:all .25s; }
.art-tags a:hover{ background:linear-gradient(90deg,var(--teal),var(--teal-dark)); color:#fff; border-color:transparent; }

/* ---------- 图集详情：主图 + 缩略图切换 ---------- */
.gal-main{ border:1px solid #e9f4f6; border-radius:14px; overflow:hidden; background:#f6fbfc; box-shadow:0 10px 30px rgba(32,80,90,.09); }
.gal-main img{ width:100%; display:block; }
.gal-thumb-title{ font-size:13px; color:#a4b6bb; letter-spacing:1px; margin:22px 0 14px; }

/* ---------- 下载详情：附件按钮组 ---------- */
.dl-box{ background:linear-gradient(150deg,#f6fdfd,#eef9fb); border:1px dashed #cbeef2; border-radius:14px; padding:26px 28px; margin-bottom:34px; }
.dl-box > h2{ font-size:17px; font-weight:700; color:var(--teal-deep); letter-spacing:1px; margin-bottom:18px; display:flex; align-items:baseline; gap:10px; }
.dl-box > h2 .en{ font-size:11px; letter-spacing:3px; color:var(--orange); text-transform:uppercase; font-weight:600; }
.dl-item{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; background:#fff; border:1px solid #e9f4f6; border-radius:12px; padding:18px 22px; margin-bottom:14px; transition:all .3s; }
.dl-item:last-child{ margin-bottom:0; }
.dl-item:hover{ border-color:#bfe9ee; box-shadow:0 12px 30px rgba(32,80,90,.11); transform:translateY(-2px); }
.dl-file{ flex:1; min-width:190px; }
.dl-file .nm{ font-size:15px; font-weight:700; color:var(--text-dark); line-height:1.7; word-break:break-all; }
.dl-file .mt{ display:flex; gap:18px; flex-wrap:wrap; font-size:12.5px; color:#a4b6bb; margin-top:7px; }
.dl-file .mt b{ color:var(--teal-dark); font-weight:600; }
.dl-code{ flex-shrink:0; font-size:13px; color:var(--orange); background:var(--bg-orange); border-radius:14px; padding:6px 16px; letter-spacing:1px; }
.dl-btn{ flex-shrink:0; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:12px 32px; border-radius:26px; background:linear-gradient(90deg,var(--teal),var(--teal-dark)); color:#fff; font-size:14.5px; letter-spacing:1px; box-shadow:0 8px 20px rgba(21,191,204,.3); transition:all .25s; }
.dl-btn:hover{ transform:translateY(-2px); filter:brightness(1.06); }
.dl-stat{ display:flex; gap:34px; flex-wrap:wrap; margin-top:22px; padding-top:18px; border-top:1px dashed #cbeef2; font-size:13px; color:var(--text-gray); }
.dl-stat b{ color:var(--teal-dark); font-family:Georgia,"Times New Roman",serif; font-size:17px; margin:0 4px; }

/* ---------- 招聘详情：岗位信息 + 投递表单 ---------- */
.job-info{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px 24px; list-style:none; background:linear-gradient(150deg,#f6fdfd,#eef9fb); border:1px solid #e9f4f6; border-radius:14px; padding:24px 26px; margin-bottom:36px; }
.job-info li{ display:flex; gap:10px; font-size:14px; line-height:1.9; }
.job-info .lb{ color:#a4b6bb; flex-shrink:0; }
.job-info .vl{ color:var(--text-dark); font-weight:600; }
.job-apply{ text-align:center; margin:38px 0 6px; }
.job-apply a{ display:inline-flex; align-items:center; justify-content:center; padding:15px 56px; border-radius:34px; background:linear-gradient(90deg,#ffb43a,var(--orange)); color:#fff; font-size:16px; letter-spacing:3px; box-shadow:0 12px 30px rgba(243,152,0,.34); transition:all .3s; }
.job-apply a:hover{ transform:translateY(-3px); filter:brightness(1.05); }
.apply-card{ margin-top:46px; padding:34px 34px 36px; border-radius:16px; background:linear-gradient(160deg,#f6fdfd,#ffffff 55%); border:1px solid #dff0f2; scroll-margin-top:110px; }
.apply-card > h2{ font-size:20px; font-weight:700; color:var(--teal-deep); letter-spacing:1px; display:flex; align-items:baseline; gap:10px; }
.apply-card > h2 .en{ font-size:11px; letter-spacing:3px; color:var(--orange); text-transform:uppercase; font-weight:600; }
.apply-card > .sub{ font-size:13.5px; color:var(--text-gray); line-height:1.9; margin:12px 0 26px; }

/* ---------- 视频详情：播放器 + 选集 ---------- */
.vid-player{ background:#062e34; border-radius:14px; overflow:hidden; box-shadow:0 16px 40px rgba(6,46,52,.24); }
.vid-player video{ width:100%; display:block; background:#000; }
.vid-side{ background:#fff; border:1px solid #e9f4f6; border-radius:14px; overflow:hidden; box-shadow:0 4px 18px rgba(32,80,90,.06); }
.vid-side-head{ padding:18px 22px 15px; border-bottom:1px solid #eef4f5; }
.vid-side-head h3{ font-size:16px; font-weight:700; color:var(--teal-deep); letter-spacing:1px; }
.vid-side-head p{ font-size:12.5px; color:#a4b6bb; margin-top:6px; letter-spacing:.5px; }
.vid-ep{ max-height:560px; overflow-y:auto; padding:4px 0; margin:0; list-style:none; }
.vid-ep li{ border-bottom:1px dashed #eaf3f4; }
.vid-ep li:last-child{ border-bottom:none; }
.vid-ep a{ display:block; padding:14px 22px; font-size:13.5px; color:var(--text-dark); line-height:1.7; transition:all .25s; }
.vid-ep a:hover, .vid-ep li.active a{ background:#f6fdfd; color:var(--teal-dark); }
.vid-ep .t{ display:block; }
.vid-ep .m{ display:flex; gap:14px; flex-wrap:wrap; font-size:12px; color:#a4b6bb; margin-top:6px; }
.vid-ep .free{ color:var(--orange); font-weight:600; }

/* ---------- 通用工具类与补漏 ---------- */
.clearfix::after{ content:""; display:block; clear:both; }
/* 详情页标题下方的副标题 */
.art-sub{ font-size:14px; color:#a4b6bb; letter-spacing:.5px; margin:-6px 0 18px; line-height:1.85; }

/* ---------- 自定义表单：字段行（标签 + 后台自动生成控件） ---------- */
.form-row{ display:flex; flex-direction:column; gap:8px; }
.form-row > .lbl{ font-size:13.5px; color:var(--text-gray); font-weight:600; }
.form-row .eyou_form_attr{ width:100%; }

/* ---------- 产品详情页（product-detail.html）补充 ---------- */
/* 设计稿样式表中已定义、但页面 body 未使用的类，模板里用到了就在这里补上 */
.pd-tel{ margin-top:18px; font-size:13.5px; color:var(--text-gray); display:flex; align-items:center; gap:8px; }
.pd-tel b{ color:var(--teal-dark); font-size:16px; letter-spacing:1px; font-weight:700; }
.pd-badges{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:16px; }
.pd-badge{ font-size:12px; padding:5px 14px; border-radius:4px; letter-spacing:2px; }
.pd-badge.warm{ background:var(--orange); color:#fff; }
.pd-badge.teal{ background:var(--bg-teal); color:var(--teal-dark); border:1px solid #ddf0f3; }
/* 产品规格选择器：每个规格值一排，避免窄栏挤压 */
.ey-spec .row > div{ display:flex; flex-wrap:wrap; gap:8px; }
/* 产品详情选项卡面板内的表格与标题间距 */
.pd-panel .tbl-wrap{ margin-bottom:26px; }
.pd-panel .tbl-wrap:last-child{ margin-bottom:0; }
.pd-panel .art-body h2{ font-size:19px; color:var(--teal-deep); letter-spacing:1px; }

@media (max-width:1024px){
  .job-info{ grid-template-columns:repeat(2,1fr); }
  .vid-ep{ max-height:none; }
}
@media (max-width:640px){
  .job-info{ grid-template-columns:1fr; }
  .dl-item{ flex-direction:column; align-items:stretch; }
  .dl-btn{ width:100%; }
  .apply-card{ padding:24px 20px 28px; }
}