/* ===================== 心电科技官网 · 科技蓝白商务风（专业深科技版） ===================== */
:root{
  /* ---------- 2026-10-28「去 AI 味 · 纸面语言」色板重排 ----------
     病因（可指认，不是感觉）：旧色板是「纯白屏 + 电光蓝 + 蓝味灰」的互联网 UI 配色，
     蓝在 56 处出现（眉题/编号/年份/链接/标签/hover 全是它），蓝色不再等于强调，只等于底噪；
     纯白 #fff 与 冷调灰阶 让整页像一张 PPT，没有纸张的物质感。
     改法三条：
       ① 底色 → 暖白纸面 #FBFAF7（几乎看不出，但拿掉了纯白的荧光感）；
       ② 文字与灰阶 → 中性墨（去掉原 #16202E / #6b7787 的蓝偏）；
       ③ 蓝拆成两档：--accent 降为深钢蓝（只做「引用/强调」），--spot 保留电光蓝
          （全站唯一亮点，只给「能点的主动作」）—— 蓝从此有功能，不再是装饰。 */
  --ink:#15181C;          /* 墨（中性，去蓝偏） */
  --ink-2:#1E2226;
  --ink-soft:#3E4348;
  --muted:#6D7278;        /* 次要文字（中性灰） */
  --muted-2:#979CA2;
  --line:#E5E3DE;         /* 暖灰发丝线（配纸白底） */
  --line-strong:#D3D0C9;
  --bg:#FBFAF7;           /* 纸白 */
  --bg-alt:#F4F2ED;       /* 暖灰交替底 */
  --bg-tint:#F6F3EC;
  /* ---------- 2026-10-28 晚「回血」修正 ----------
     上一版把 AI 味（装饰过多）和视觉能量（色彩 / 尺度 / 动势）当成一件事一起删了，
     结果页面从「模板感」滑到「白纸感」——干净，但没有焦点、没有节奏、没有电。
     本次只做加能量，不加装饰：
       ① 蓝重新有饱和度（#22436B 已经暗到读作黑灰，蓝的辨识度全丢）；
       ② 数字从宋体旧式改「仪表读数」语言（无衬线 + 等宽数字 + 紧字距）；
       ③ 大标题放大、正文字号不动 → 拉开层级落差，眼睛有落点；
       ④ 产品清单 hover 整条变深靛蓝反白 —— 静态素净、交互爆发，
          这是"活泼"最省视觉面积的做法（不占静态版面）。 */
  --accent:#1B4A8C;       /* 深靛蓝：有饱和度但仍稳重，链接/强调/编号 hover */
  --accent-deep:#12365F;
  --accent-soft:#EAF0F9;
  --navy:#0D2440;         /* 深色锚块：清单 hover 整条底色 / 深色版块的浅色侧 */
  --spot:#2F6BFF;         /* 电光蓝：只给「能点的主动作」与「数据高亮」 */
  --spot-deep:#1b4fd1;
  --steel-deep:#0A4D68;   /* 加深青（工程精密感的第二锚色：数据/编号/深色强调） */
  --radius:3px;           /* 圆角阶梯收到 3-2：大圆角是「卡片 App」语言，纸面语言要锐 */
  --radius-sm:2px;
  /* 标题衬线族：中文优先 Songti/宋体（Windows+macOS 零加载），西文回落 Georgia。
     只给超大标题用（h1 / section__title / 大数字），正文一律黑体 ——
     这是印刷品最经典的搭配：衬线立骨、无衬线承接信息。 */
  --serif:"Songti SC","Source Han Serif SC","Noto Serif SC",STSong,SimSun,Georgia,"Times New Roman",serif;
  --maxw:1200px;
  /* 极简阴影（全站视觉重构·工程精密感）：单层、低透明、小模糊 ——
     「纸面 + 发丝线」语言，阴影只做"抬离纸面 1px"的暗示，不做厚度堆叠。
     旧版双层大扩散阴影（.07/.13 透明度 + 34-52px 模糊）撤销。 */
  --shadow:0 1px 2px rgba(16,32,46,.05);
  --shadow-sm:0 1px 2px rgba(16,32,46,.04);
  --shadow-lift:0 2px 8px rgba(16,32,46,.08);
  --ease:cubic-bezier(.22,.61,.21,1);
  --mono:"SF Mono",ui-monospace,"JetBrains Mono","Roboto Mono",Menlo,Consolas,monospace;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:var(--bg);line-height:1.65;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
.container{max-width:var(--maxw);margin:0 auto;padding:0 28px;}

/* ---------- 页面切换：整页内容淡入上移 ----------
   多页站点每换一页都是整份文档重新加载，默认效果是「内容突然整块弹出」，很生硬。
   ⚠️ 这里用 **CSS animation 而不是 transition + JS 加类**：
      · 纯 CSS 即可播放，不依赖 JS 执行成功 —— 若用「JS 先设 opacity:0 再加类」，
        脚本一旦失败（接口挂了 / 语法错误）正文就永久透明，等于整站白屏；
      · animation 自带 fill 模式（both），起始帧在首帧绘制前就生效，不会先闪一下再淡。
   ⚠️ 只作用在 .pagehead / main 上，**不碰 .nav**：导航是 position:fixed，
      若它落到带 transform 的祖先里，fixed 会退化成相对该祖先定位（钉不住顶部）。 */
@keyframes pageIn{from{opacity:0;}to{opacity:1;}}
/* ⚠️ 纯透明度（批4 交互规范）：不掺位移 —— transform 会把后代 fixed 的定位基准
   劫持到带动画的祖先，jumpnav 吸顶（fixed）在页面入场动画期间会错位。
   本动画无 delay，首帧绘制前动画已在活动期 from 帧，无需 backwards 保障。 */
.pagehead,main{animation:pageIn .55s cubic-bezier(.2,.7,.3,1);}
/* 尊重系统「减少动态效果」：直接呈现最终状态，不做位移 */
@media (prefers-reduced-motion: reduce){
  .pagehead,main{animation:none;}
}

/* ---------- 导航 ---------- */
/* 顶部导航：固定钉在视口顶部，随页面上下滑动始终可见。
   注意：这里必须用 fixed 而不是 sticky —— 实测 sticky 在本站结构下会被
   html 的 scroll-behavior:smooth 与合成层影响而失效（对照实验：sticky top=-800、fixed top=0）。
   fixed 会脱离文档流，故需 #navMount 用等高占位把正文顶下去，避免内容被导航遮住。
   用户指令（2026-10-29，以本条为准）：**页面在最顶上时导航完全不要底色**——
   首屏照片直接铺到页面最顶，导航是「浮在照片上的一行字」，没有条、没有线、没有玻璃。
   等页面滚到首屏与深空版块的斜切交界线（用户标注的位置）时，才浮现磨砂半透明：
   blur(14px)+saturate(1.5) + 纸白 72%，发丝线同步出现。
   —— 切换时机由 main.js initNavScroll 用锚点元素实测判定，不写死 scrollY（原因见那边注释）。
   —— 为什么磨砂出现得比「纯照片段结束」更早：深空版块是深蓝底，
      若等它整条压到导航下面才切，深色导航字会先有一段压在深蓝上读不出来。
      锚点取交界线，深色刚探头玻璃就已经落下了。
   @supports 回落：不支持 backdrop-filter 的浏览器在滚动态回到实心白，文字对比度不打折。 */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;background:transparent;
  border-bottom:1px solid transparent;
  transition:background-color .28s ease, border-color .28s ease, backdrop-filter .28s ease, -webkit-backdrop-filter .28s ease;}
/* 占位：height 由 main.js 在注入导航后按实测高度写入 CSS 变量，避免写死 71px 在移动端第二行布局时错位 */
#navMount{height:var(--nav-h,71px);}
/* 滚动态：越过首屏交界线后才浮现的磨砂底 —— 半透纸白 + 毛玻璃 + 发丝线，不投阴影 */
.nav--scrolled{background:rgba(251,250,247,.72);
  -webkit-backdrop-filter:blur(14px) saturate(1.5);backdrop-filter:blur(14px) saturate(1.5);
  border-bottom-color:var(--line-strong);}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .nav--scrolled{background:var(--bg);}
}
/* 移动端抽屉展开：导航条自身必须落底，否则菜单浮在半透明条上、logo 与正文叠字 */
.nav--open{background:rgba(251,250,247,.96);border-bottom-color:var(--line);}
.nav__inner{display:flex;align-items:center;height:70px;}
.nav__logo{display:flex;align-items:center;gap:11px;font-weight:700;font-size:18px;letter-spacing:-.01em;color:var(--ink);white-space:nowrap;flex:0 0 auto;margin-right:auto;}
.nav__logo img{height:30px;width:auto;max-width:210px;}
/* margin-right 让栏目与语言切换器之间留出可视分隔；栏目在 ≤1280px 隐藏后该间距自动失效 */
.nav__links{display:flex;gap:2px;flex-wrap:nowrap;margin-right:10px;}
/* 轮92（用户指令 2026-10-29）：导航浮在浅色照片上，400 细体+灰字看不清 → 600 加粗 + 字色提到 --ink。
   激活项仍靠品牌蓝区分（.is-active 600 与基态同重，色差即层级）。 */
.nav__links a{color:var(--ink);font-size:14.5px;font-weight:600;padding:8px 8px;border-radius:var(--radius-sm);transition:color .2s, background .2s;white-space:nowrap;}
/* 链接 hover 只换字色，不要灰底块（全站视觉重构：去"块状反馈"，改文字反馈） */
.nav__links a:hover{color:var(--accent);}
/* CTA：纯色块 + 二字名圆角，去发光阴影与位移（全站视觉重构·交互规范：禁 hover 位移） */
.nav__cta{margin-left:10px;background:var(--spot);color:#fff;font-size:14px;font-weight:600;padding:9px 18px;border-radius:var(--radius-sm);transition:background .2s;}
.nav__cta:hover{background:var(--spot-deep);}

/* ---------- Hero（全站视觉重构 · 内容驱动的工程精密感） ----------
   纯白纸面 + 左文右图双栏：左栏「眉题 → 标题 → 短线锚点 → 副题」，
   右栏办公楼真实照片配白框（相纸语言）。删渐变底 / 网格 / 光晕 / 淡化背景楼宇。
   ⚠️ padding 的 243px 底部是产品与服务深空斜切块压进 hero 的重叠几何
   （#secSolutions margin-top:-92px + clip-path 72px 斜切）与两枚 SCROLL 胶囊
   骑线定位的绑定值 —— 不可动。纯白底后斜切深空块直接切进白纸，交界即设计。 */
/* 2026-10-28 夜（轮81）：照片必须钻到固定导航底下 —— 原先是 #navMount 占位 71px 撑在 hero 上方，
   导致「上半纯白导航、下半有照片」在导航底边切出一条硬线，用户原话「这样的分界太丑了」。
   做法：hero 用负 margin-top 顶掉这块占位，再把等量的 --nav-h 加回 padding-top ——
   文字位置一动不动，但 .hero 的盒子（以及内部 inset:0 的 .hero__bg）整体上移到 y=0，
   照片铺到页面最顶，导航那层 rgba(...,.62)+blur14 就成了真正的磨砂玻璃，透出模糊的楼影，分界消失。
   ⚠️ 不能改成给 .hero__bg 加负 top：.hero 带 overflow:hidden，负向溢出会被直接裁掉。
   ⚠️ --nav-h 由 main.js 按导航实测高度写入（移动端两行导航更高），所以这里必须用变量、不能写死。 */
.hero{position:relative;overflow:hidden;margin-top:calc(-1 * var(--nav-h,71px));padding:calc(120px + var(--nav-h,71px)) 0 243px;background:var(--bg);}
/* 2026-10-28 晚：文字列由 1.12fr 放宽到 1.3fr —— 标题放大到 48px 后必须让它一行站住
   （"您的专属电磁材料研发助手" 12 字 × 48px = 576px，旧列宽 640px 减内距会折出孤零零的"助手"）。
   放宽后右列收窄，正好交给电磁波场那层图形。 */
.hero__inner{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:clamp(36px,4.4vw,64px);align-items:center;}
.hero__text{min-width:0;}
/* 品牌标语（2026-11-01 用户指令：删掉原眉题「CYNEMAG · 电磁功能材料与设计方案提供者」，
   换成「与电磁共舞，与客户共享」放在标题下方）：
   中文衬线 + 品牌蓝，作为大标题的「题记」——与标题同字族，读起来是同一句话的下一层，
   而不是另起一个标签。字号压在 18-22px：48px 标题之后紧跟这一档是印刷品的题记层级，
   再放大就变成第二个标题，首屏打架。不加引号、不加装饰符，这句话本身有对仗节奏，靠字面站住。
   衬线在 Windows 只有 Regular 一档会显单薄，沿用标题那招 0.3px 同色外描；描边比标题细，避免拉平层级。
   2026-11-01 二次调整（用户：「这一句话的设计感不是很强」）：曾断成两行贴成字块。
   2026-11-01 17:47 用户否决断行：「能放一行就不要两行，主要是视觉设计，内容就保持这样」。
   → 恢复整句单行；分量不再靠「拆」而靠三件事，都是版式手段、不添任何装饰：
     ① 字号抬到 19-29px（原 18-22px）。关键不是"大一点"，而是让标语宽度达到标题的一半以上
        —— 22px 时整行只有 ~300px，挂在 890px 宽的大标题下面，比例上就是一条批注；
        29px 时 ~400px，读作标题的下一层。
     ② 字距收到 .02em。字号变大后原来 .05em 的间距会让逗号两侧发虚、字与字之间空心化。
     ③ 间距重新分组：短线→标语收到 16px、标语→说明放到 26px。原来上下都是 20-22px，
        标语悬在两组中间、谁也不归属，这才是"没感觉"的根。
   英文那句长一倍，折行是自然换行（不是设计断行），不设 nowrap。
   ⚠️ 英文必须配 text-wrap:balance：不加时 29px 会把 "our customers." 甩成孤零零的第二行，
   加了才是「两行等长」题记 —— 用户要的"不要两行"在中文侧已满足，英文断得平衡即可。 */
.hero__slogan{font-family:var(--serif);font-size:clamp(19px,2.06vw,29px);line-height:1.3;font-weight:400;
  color:var(--accent);letter-spacing:.02em;margin:0 0 26px;text-shadow:0 0 .3px currentColor;text-wrap:balance;}
/* 西文没有汉字那种正方字面，.18em 会让引题拉长一倍、折出孤立单词 —— 英文单独收到 .1em */
html[lang^="en"] .section__eyebrow{letter-spacing:.1em;}
/* 主标题：收窄到 30-46px 量级（旧版 72px 概念化大标题撤销），行距 1.24 留呼吸；
   关键词由渲染层按 hero.titleEm 包 <em class="hero__em"> 品牌蓝高亮（各语言记忆库自行配置）。 */
/* 2026-10-28 去 AI 味：标题改中文衬线（宋体族）。
   理由：800 重的系统黑体大标题是「科技感模板」的标配，字面方、无笔锋、和任何一家公司都长得一样；
   衬线在大字号下有横细竖粗的笔锋差异，是印刷品的物质感来源，也是 AI 生成页面几乎不会做的选择。
   字距同时归零 —— 中文衬线压缩字距会粘连，衬线本身已有节奏，不需要再"挤"。 */
.hero__title{font-family:var(--serif);font-size:clamp(32px,3.5vw,48px);line-height:1.14;margin:0 0 26px;font-weight:700;letter-spacing:0;color:var(--ink);
  /* 中文衬线在 Windows 只有 Regular 一档（SimSun 无 Bold），大字号下会显单薄。
     0.55px 同色外描边 ≈ 把笔画加厚一档，比 font-weight 更细粒度，且不会糊边。
     字号放大到 60px 后笔画相应变细，描边同步加到 .7px 维持"立骨"的重量。 */
  text-shadow:0 0 .7px currentColor;}
/* 关键词高亮：不只换色 —— 深靛蓝 + 底下 2px 电光蓝短划（一个字符宽的强调笔触）。
   这是"印刷品里给重点词划一道"的语言，比整句换色克制，比纯色块高级。 */
.hero__em{font-style:normal;color:var(--accent);font-weight:700;}
/* 英文标题同样 48px 会折成三行、末行只剩 "R&D Team" 两个词（中文 12 字对英文 50 字符，
   同一字号下英文行数必然更多）→ 英文单独收到 40px，折行更均衡。 */
html[lang^="en"] .hero__title{font-size:clamp(30px,3vw,40px);line-height:1.14;}
/* 标题下方 48px×2px 短线锚点：与标题左缘对齐，替代旧版眉题短线成为新的视觉锚 */
/* 2026-10-28：蓝色 2px 短横是模板站的装饰指纹 → 改为 1px 纸灰细线，只做「起笔」不做「强调」 */
/* 2026-10-28 晚：纸灰 1px 在纸白底上几乎不可见，起笔等于没了 → 拉长到 56px 并改深靛蓝，
   仍然是 1px（不是模板那种 2px 亮蓝短横），但看得见，作为标题的"落笔点"。 */
.hero__rule{display:block;width:56px;height:1px;background:var(--accent);margin:0 0 16px;}
/* 说明文字（2026-11-02 用户要求句首加「深耕吸波材料领域 27 年」，整句变长后暴露两处断行毛刺）：
   `text-wrap:pretty` → `text-wrap:balance`。pretty 只管末行孤字，两行时第一行会撑到 590px、
   把「涂料」拆成「涂 / 料」；balance 会把两行拉平（实测 573 / 561），断点前移到「产品和」之后，
   「涂料」整个落在第二行。英文同样受益：4 行从 592/603/611/360 变成 520~574 的齐行，
   末行不再只剩 "…test systems." 一截，且 "EM-parameter" 不再被断成 "EM- / parameter"。
   只在宽屏有多行时起作用（单行段落 balance 无副作用，≥7 行 Chrome 自动退回普通换行）。 */
.hero__sub{font-size:17px;line-height:1.8;color:var(--ink-soft);max-width:620px;margin:0;text-wrap:balance;}
/* 数值 + 单位整体不断行（渲染层 keepUnits() 包出来的 span）：
   「0.3-40 GHz」被断成「…0.3-」/「40 GHz」时，一个频率区间会读成两个数。 */
.hero__sub .nb{white-space:nowrap;}
/* ---------- 首屏形象图：淡化后作为 hero 最底层背景，文字浮于其上 ----------
   用户指令（2026-10-19）：撤销批1 的右栏白框相纸，恢复「图片作底层」旧设计。
   楼宇照片铺满整个 hero（inset:0），白纱渐变顶部保住标题清晰、中下部让影像透出、
   最后一段渐隐到白——背景图在触到版块边界前先淡出，避免与下一版块交接处生硬截断。 */
.hero__bg{position:absolute;inset:0;z-index:0;pointer-events:none;
  background-repeat:no-repeat;background-size:cover;background-position:center top;
  opacity:0;transition:opacity .9s ease;}
/* 2026-10-28 夜（用户第三次调整，以本条为准）：
   用户看线上截图后说「公司背景图颜色太浅了，都看不到了，透明度要低一些」。
   ⚠️ 我一度按自己「樱花枝是脏污」的判断做了分区遮盖（只在两个上角压白），
      被用户当场否定：「我没有认为樱花枝变成最显眼的脏污了呀」。
      —— 记牢：照片里哪些细节算缺点，**由用户判断，不由我判断**。
      不要再为了"遮缺点"牺牲照片可见度。（早前那张 A 版样张被否，原因是放大裁切
      把排水管怼到脸上，不是照片本身有樱花。）
   本次整体放开三处，缺一不可：
     ① opacity .13 → .55：原来照片只有 13% 参与合成，白纱怎么调都不可能看清；
     ② saturate .22 → .58：原来几乎全灰，灰上加白只会更脏；恢复色彩后照片才立得住；
     ③ brightness 1.1 → .98：原来提亮把暗部推向纸白，等于自己把自己抹掉。 */
.hero__bg.is-on{opacity:.55;filter:saturate(.58) contrast(1.02) brightness(.98);}
/* 白纱两层各有职责，不要随手加第三层：
     ① 横向（90deg）左半幅压到近白（.95/.78）保住标题与副题可读性；
        74% 之后是最透的一段（.34），照片主体（楼、玻璃幕墙、楼顶招牌）都落在这里；
     ② 纵向（180deg）只在最底部渐隐到白 —— 它的作用是**与下一版块的深空斜切衔接**，
        不是遮什么杂物；动了它首屏底部就会出现生硬截断。 */
.hero__bg::after{content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg, rgba(251,250,247,.95) 0%, rgba(251,250,247,.78) 44%, rgba(251,250,247,.34) 74%, rgba(251,250,247,.50) 100%),
    linear-gradient(180deg, rgba(251,250,247,0) 0%, rgba(251,250,247,0) 56%, rgba(251,250,247,.56) 84%, rgba(251,250,247,.99) 100%);}
/* 用户指令（2026-10-29）：首屏右半幅那组同心弧「电磁波场」整层撤掉，回到没有条纹的状态。
   被撤的是 .hero::after：一组重复径向渐变的弧线 + 一层偏冷的白压色在照片之上，
   后者正是底图看着"泛蓝"的原因；撤掉后照片回到原本的暖纸白。.hero 自身仍是纯白纸面
   （background:var(--bg)），**不加任何替补图形/渐变** —— 空下来的右半幅就交给照片本身。 */
/* 用户指令（2026-10-19）：hero 右下角的探索提示小字整体移除，不留样式残留 */
/* 批4 交互规范：按钮 hover 仅背景加深 —— 无位移、无阴影变化、箭头不滑 */
.btn{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:600;padding:13px 26px;border-radius:var(--radius-sm);transition:background .2s, color .2s, border-color .2s;}
.btn--primary{background:var(--spot);color:#fff;}
.btn--primary:hover{background:var(--spot-deep);}
/* 批4：CTA 带上的「联系我们」—— 深蓝底上的白底反白按钮，hover 转淡钢蓝
   2026-10-28 晚：按钮文字随 CTA 底色统一到 --navy（原来用 steel-deep 加深青，在深靛蓝上发绿） */
.btn--light{background:#fff;color:var(--navy);}
.btn--light:hover{background:#D9E4F4;color:var(--navy);}

/* ---------- 通用 Section ---------- */
/* overflow-x:clip 兜住通栏色带（100vw 居中）在部分缩放比下产生的亚像素溢出；
   用 clip 而不是 hidden —— hidden 会创建滚动容器，破坏内部 sticky/视差定位 */
.section{padding:104px 0;overflow-x:clip;}
/* 内页第一个版块紧跟页头（页头已有大标题），去掉重复标题后收窄上间距 */
main>.section:first-child{padding-top:72px;}
/* 页内第二段紧跟上一段时收窄上间距（2026-10-31）：两段各 104px 会叠成 208px 的空洞，
   「一排卡片接一排卡片」的结构读起来像两页。 */
.section--tight-top{padding-top:64px;}
.section--alt{background:var(--bg-alt);}
.section__head{max-width:820px;margin:0 auto 56px;text-align:center;}
/* 批4：眉题去装饰 —— 删左侧短横线与大写字距，13px 常规字重品牌蓝小字（信息，不是徽章） */
/* 2026-10-28：眉题原为品牌蓝小字（5 个版块 × 每屏一次 = 蓝色退化成底噪）。
   改为纸灰 + 拉开字距 —— 小字加字距是印刷品的「引题」处理，比换颜色更安静、更像人排的。 */
.section__eyebrow{display:block;color:var(--muted-2);letter-spacing:.18em;font-size:12px;font-weight:500;margin:0 0 14px;}
.section__title{font-family:var(--serif);font-size:clamp(30px,3.9vw,48px);margin:0 0 14px;font-weight:700;letter-spacing:0;line-height:1.18;color:var(--ink);text-shadow:0 0 .7px currentColor;}
.section__lead{color:var(--muted);font-size:17px;margin:0;line-height:1.7;}
/* 左对齐版块标题（2026-10-31）：用于「页内第二段」这类紧跟 pagehead 的版块 ——
   整页文案都齐左时，居中标题会读成别处搬来的零件。
   ⚠️ 宽度必须跟 .container 一样（max-width:var(--maxw) + 自动外边距）。
   原来写的是 max-width:none + 左右 margin 0，等于把它拉成全宽贴在视口左缘：
   页头标题在一个居中的 1200 容器里，这个却贴着窗口 —— 窗口一缩放两者就各跑各的
   （用户 2026-10-31 报障「会跟着跑、没有固定位置」）。 */
.section__head--left{max-width:var(--maxw);text-align:left;}
.section__head--left .section__lead{max-width:56ch;}

/* ---------- 版块标题 · 分栏变体（2026-10-28 视觉重构第一批） ----------
   病因：产品/应用/新闻/荣誉/关于 5 个版块共用同一套「眉题 + 中文大标题 + 副文案」居中三行堆叠，
   每屏开场长得一模一样，视线找不到轻重，整页读起来像一套模板往下贴。
   分栏版：标题贴容器左缘（7 列），副文案落到右侧同一基线上（4 列），
   眉题宽度撑满两列压在标题之上。同一份 DOM，只换栅格，不改文案。 */
.section__head--split{max-width:var(--maxw);margin:0 auto 52px;text-align:left;
  display:grid;grid-template-columns:minmax(0,6.5fr) minmax(0,4.5fr);column-gap:48px;align-items:end;}
/* 字号分档：产品/应用 = 主叙事（54px）；新闻/荣誉/关于 = 佐证（36px），视觉上退一步 */
.section__head--split.is-sm .section__title{font-size:clamp(26px,3vw,36px);letter-spacing:0;}
.section__head--split .section__eyebrow{grid-column:1/-1;margin:0 0 16px;}
.section__head--split .section__title{margin:0;font-size:clamp(36px,4.6vw,62px);line-height:1.08;letter-spacing:0;text-shadow:0 0 .8px currentColor;}
.section__head--split .section__lead{grid-column:2;margin:0 0 8px;font-size:15px;line-height:1.75;text-align:right;text-wrap:balance;}
@media(max-width:860px){
  .section__head--split{grid-template-columns:1fr;column-gap:0;row-gap:14px;margin-bottom:34px;}
  .section__head--split .section__lead{grid-column:1;text-align:left;}
}

/* ---------- 首页 · 产品与服务（第二十二轮「深空斜切」重构，2026-09-28） ----------
   用户指令：高对比高饱和配色 / 拉开字号层级、厚重标题 / 大胆留白 / 明显动效节奏 /
   打破网格与边框（允许溢出、倾斜、重叠）。方案：
   · 整版块深空墨蓝底 + 上下斜切边（clip-path 平行四边形），上缘以 -92px 压进 hero 形成重叠；
   · 巨型描边编号溢出容器、倾斜 -6°，滚动视差轻漂移（--py 由 initSolParallax 写入）；
     偶数行编号翻到右侧镜像倾斜，打破行行同构；
   · 产品/服务 = 电光蓝渐变斜切卡片（skewX(-8deg)，内容反向回正），多条向右下瀑布错位轻微重叠；
   · 价值数字高亮放大 2 倍电光绿，行内参差基线制造张力；
   · 入场编排：行沿用 .reveal 淡入上移；行内元素用 animation + fill:backwards 错峰 ——
     动画结束后不残留填充值（吸取第十一轮 fill 教训），悬停 transform 不会被动画填充值压住。 */
#secSolutions{
  --sol-blue:#2F6BFF; --sol-blue-hi:#5B8CFF; --sol-green:#00E09E;
  --sol-ink:#E9F0FF;
  position:relative; margin-top:-92px; padding:200px 0 176px;
  background:
    radial-gradient(1100px 540px at 80% 6%, rgba(47,107,255,.30), transparent 62%),
    radial-gradient(880px 520px at 6% 88%, rgba(0,224,158,.10), transparent 60%),
    linear-gradient(180deg, #0B1322 0%, #060B15 100%);
  clip-path:polygon(0 72px, 100% 0, 100% calc(100% - 72px), 0 100%);
}
/* 深底网格：与 hero 网格同一语言的暗色版，中段隐去只留上下两端 */
#secSolutions::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(to right, rgba(91,140,255,.075) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(91,140,255,.075) 1px, transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,transparent 30%,transparent 70%,#000 100%);
  mask-image:linear-gradient(180deg,#000 0%,transparent 30%,transparent 70%,#000 100%);}
/* 吸波脉冲环：缓慢外扩消散的同心圆 —— 「吸波」意象，纯装饰 */
#secSolutions::after{content:"";position:absolute;top:14%;right:11%;width:520px;height:520px;z-index:0;
  border-radius:50%;border:1.5px solid rgba(91,140,255,.36);opacity:0;pointer-events:none;
  animation:solPulse 5.6s linear infinite;}
@keyframes solPulse{0%{transform:scale(.42);opacity:0;}16%{opacity:.8;}100%{transform:scale(1.55);opacity:0;}}
@media (prefers-reduced-motion: reduce){#secSolutions::after{animation:none;opacity:0;}}
.sol__list{display:flex;flex-direction:column;gap:clamp(88px,9vw,132px);position:relative;z-index:1;}
/* 行：左「痛点叙事」+ 右「方案与价值」，两栏不等宽、行高随内容参差 */
.sol__row{position:relative;display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5.2fr);gap:24px 76px;}
/* 行级分组底块（轮25）：每组「痛点→方案→效果」一套斜切底色，成为独立单元。
   不动 grid 布局——底块向外出血包住内容，内容与几何零位移；
   奇行电光蓝雾（品牌主调）、偶行青绿雾（呼应「收获」绿），斜切方向镜像交替，横向扫视不再错行。 */
.sol__row::before{content:"";position:absolute;inset:-30px -40px;z-index:0;pointer-events:none;
  clip-path:polygon(0 26px, 100% 0, 100% calc(100% - 26px), 0 100%);
  background:linear-gradient(120deg, rgba(47,107,255,.14) 0%, rgba(47,107,255,.05) 46%, rgba(10,18,34,0) 100%);}
.sol__row:nth-child(even)::before{
  clip-path:polygon(0 0, 100% 26px, 100% 100%, 0 calc(100% - 26px));
  background:linear-gradient(240deg, rgba(0,224,158,.09) 0%, rgba(47,107,255,.05) 48%, rgba(10,18,34,0) 100%);}
/* 巨型描边编号（轮26 按用户指定位置调整）：不再骑标题/被方案卡遮挡——
   奇数组驻左栏痛点清单下方空白、偶数组驻右栏右下空白，微出血伸出行卡下缘保留打破网格语言 */
/* 巨型描边编号（轮28：突破外框）——奇数组驻左下并向框外下探、偶数组驻右下横纵双向出血；
   顶部/文字侧仍避开内容（编号 z0 装饰层在文字层 pain/side z1 之下） */
/* 巨型描边编号（轮30：放大溢出 / 轮32：比例锚定）——字号提至 clamp(128-192)；
   出血全部改 em 随字号自动缩放：bottom:-.4em 恒等于「3/5 框内、2/5 框外」（line-height:1 盒高=字号），
   用户指定比例焊死不随字号漂移；left/right 维持轮30 出血比例（-24/156≈-.15em、-56/156≈-.36em）。
   溢出不被裁切：.sol__row/.sol__list 均无 overflow 裁剪，版块 clip-path 远在编号外圈；
   层级保持装饰层（z0）在文字层（pain/side z1）之下——编号驻空白区，文字可读性优先 */
/* 2026-10-28 四轮迭代的最终态 —— 这段是用户唯一反复点名的地方，动之前先读懂他在否定什么：
   ① 初版（模板站手法）：2px 电光蓝霓虹描边空心字 + ±6° 倾斜 + hover 蓝色外发光
      → 用户「这三个序号的 AI 感太重」。**注意：他的否点是三件套叠加，不是"描边"本身**；
   ② 二版（我做过头）：宋体 400 + 淡灰实心 + 正立 → 用户「AI 味降了，但设计感更差、没活泼感和科技感」；
      **教训：把装饰全删干净 = 能量也没了。去 AI 味是换语言，不是删元素**；
   ③ 中间试过"纸白 1px 线稿"（太轻，没有冲击力）与"半透明渐变 / mix-blend-mode:screen"（跨底块斜边时
      出现横向色阶断层，读作渲染 bug）——两条都已作废，别回头；
   ④ 三版：**不透明深蓝填充给体积 + 1px 亮边勾棱 + 细斜纹拉丝 + 系统无衬线正立**。
      读作"金属件上压印并倒角的编号"：有重量、有受光面、有精密感，但没有霓虹、没有发光、没有倾斜；
   ⑤ 本版（用户：「可以突破那个蓝色的框，不一定要放到框内，可以有更张扬一点的感觉」）：
      **尺度与出血全面放开** —— 字号 clamp(128-192) → clamp(168-278)，横向出血 -.15/-.36em → -.44/-.51em，
      纵向 -.4em → -.49em。三枚序号现在约 3/4 压在蓝色斜切底块之外，成为"从框里冲出来"的版式骨格，
      而不是躲在框角的水印。填充也整体提亮一档（#5589C6→#244767），否则出框那半落在近黑底上会消失。
      ⚠️ 出血一放开就会溢出视口/压右栏尾行，所以 981–1365px 分两档收（见下方两条 media query），
         每次调这里的数值都要跑 `_tools/_probe-idx-sweep.cjs` 扫 9 个屏宽。 */
.sol__index{position:absolute;left:-.44em;bottom:-.49em;z-index:0;
  /* 字体用系统无衬线而不是等宽：等宽字体的「1」带一条很宽的底部横杠，
     放到 278px 会变成"1 底下垫了块砖"，非常笨。无衬线的 1 只有一竖带左上小旗，干净。 */
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-weight:700;font-size:clamp(168px,18vw,278px);line-height:1;letter-spacing:-.05em;
  font-variant-numeric:tabular-nums;
  /* 三层可以分开调的质感：不透明深蓝填充（体积）+ 1px 亮边（金属棱的高光）+ 细斜纹（拉丝）。
     2026-10-28 结论：AI 味来自「2px 电光蓝描边 + 蓝色外发光 + ±6° 倾斜」三件套叠加，不是描边本身；
     但纯 1px 线稿又太轻、没有冲击力。所以走中间那条：实心打体积、只用 1px 亮边勾出棱线。
     ⚠️ 填充与描边一律**不透明**：行底块有 clip-path 斜边正好穿过编号中部，
        任何半透明都会让同一笔画上下混出两种色阶，读成渲染 bug。 */
  -webkit-text-fill-color:transparent;color:transparent;
  background-image:
    repeating-linear-gradient(135deg, rgba(255,255,255,.05) 0 1.5px, rgba(255,255,255,0) 1.5px 8px),
    linear-gradient(174deg, #5589C6 0%, #35608F 50%, #244767 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-stroke:1px rgba(190,220,255,.70);
  transform:translateY(var(--py,0px));
  transition:-webkit-text-stroke-color .45s ease;
  user-select:none;-webkit-user-select:none;pointer-events:none;}
.sol__row:hover .sol__index{-webkit-text-stroke-color:rgba(224,240,255,.95);}
@supports not ((-webkit-text-stroke:1px #fff)) {
  .sol__index{-webkit-text-fill-color:rgba(31,57,88,.9);}
}
/* 偶数行：编号驻右栏右下、横纵双向大幅出血（倾斜自 v2 起已取消）。
   比奇数行再多沉 .04em —— 右栏底部那行「…长尾服务」比左栏最后一支点更靠右，
   编号盒顶（含字形上方留白）会擦到它；多沉一点点就把这段留白让出来。 */
.sol__row:nth-child(even) .sol__index{left:auto;right:-.51em;bottom:-.53em;}
/* 981–1365px：容器（max-width 约 1145）左右留白只剩 67px 上下，18vw 的巨字再按 -.28em 出血会顶出视口；
   同时右栏「长尾服务」那行文字会被编号左上角压住。这一段按留白多少分两档降字号 + 收出血：
   1200 以下容器已满宽、左右仅 28px，出血必须很小；1200 起容器开始居中，才有多余空间。
   （≤980 已在下方转为 static 章节号） */
@media (min-width:981px) and (max-width:1199px){
  .sol__index{font-size:clamp(96px,10.4vw,124px);left:-.1em;bottom:-.5em;}
  .sol__row:nth-child(even) .sol__index{right:-.16em;bottom:-.6em;}
}
@media (min-width:1200px) and (max-width:1365px){
  .sol__index{font-size:clamp(140px,15vw,205px);left:-.24em;}
  .sol__row:nth-child(even) .sol__index{right:-.32em;}
}
/* 下滑指示（轮36 初版 / 轮37 骑线放大）：骑在 hero→深空斜切交界线上——x=50% 处交界线距 hero 底 56px
   （深空块 margin-top:-92 + clip 72 的一半），轨道中心对线：bottom:2px（按钮高 87、轨道中心距按钮底 55）。
   挂 hero 末尾（secSolutions 的 clip-path 会裁掉跨界部分，不能挂深空块内）；z1 盖过深空重叠区（z auto）且低于导航 z50（轮42）。
   深色半透明胶囊底衬 + backdrop 模糊：白区/蓝区两段背景都有对比；轨道亮边框 + 点缀蓝滑块 + mono SCROLL */
.sol__scroll{position:absolute;left:50%;bottom:2px;transform:translateX(-50%);z-index:1;
  display:flex;flex-direction:column;align-items:center;gap:8px;padding:10px 14px;
  background:rgba(11,19,34,.38);border:none;border-radius:18px;cursor:pointer;
  -webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);}
.sol__scroll-track{position:relative;display:block;width:26px;height:44px;border:1.5px solid rgba(255,255,255,.62);border-radius:14px;}
.sol__scroll-dot{position:absolute;left:50%;top:8px;width:6px;height:12px;margin-left:-3px;border-radius:3px;
  background:linear-gradient(180deg,#EAF2FF 0%,#5B8CFF 100%);animation:solScrollDot 2.2s cubic-bezier(.45,.05,.55,.95) infinite;}
.sol__scroll-txt{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.34em;text-indent:.34em;color:rgba(255,255,255,.85);}
@keyframes solScrollDot{0%{transform:translateY(0);opacity:0;}28%{opacity:1;}72%{opacity:1;}100%{transform:translateY(18px);opacity:0;}}
/* 系统开启「减少动态效果」（Windows 关动画特效很常见）时的降级（轮40 二次修复）：
   轮38 的纯透明度呼吸（.12↔1）对 5×10 小点视觉强度不足——用户仍反馈"没有动态效果"。
   改为温和往返滑动：小幅位移 9px + 可见度底线 .4（始终看得到点），比常规下落（18px、opacity 0↔1）温和，
   但明确可察；周期放缓 2.8s 更从容 */
@media (prefers-reduced-motion: reduce){
  .sol__scroll-dot{animation:solScrollDotSoft 2.8s ease-in-out infinite;}
}
@keyframes solScrollDotSoft{0%,100%{transform:translateY(0);opacity:.4;}50%{transform:translateY(9px);opacity:1;}}
/* 深空→关于我们交界处的第二个下滑指示（轮41）：挂渲染层 secAbout（setSec 会清空静态子元素，不能写死 HTML）。
   深空块底部斜切 72px，x=50% 处交界线距深空底边 36px = secAbout 顶边上方 36px；轨道中心距按钮顶 32
  （padding 10 + 轨道半 22）→ top:-68px 骑线。深空块 clip-path 只裁自身后代，本按钮挂相邻版块跨容器绘制不受裁；
   深空块 stacking context z auto、DOM 在前 → secAbout 定位后代天然盖其上；两枚 z1 均低于导航 z50
  （轮42：曾 z60 盖住 fixed 导航，滚动后按钮浮在导航上错误；z1 仍高于深空块 z auto，骑线盖底不受影响） */
#secAbout{position:relative;}
.sol__scroll--end{top:-68px;bottom:auto;}
@media (max-width:980px){
  /* 移动端斜切 36px → 线距 secAbout 顶边 18px；缩按钮（padding 8+轨道半 18=26）→ top:-44px 骑线 */
  .sol__scroll--end{top:-44px;}
}
/* 痛点：厚重白字大标题，清单用等宽斜杠做工业感引导 */
/* 引导小标（轮35 重设计）：「//」代码注释符引导（mono 工业语言，清单单斜杠的家族升级）+
   白色粗体短语（层级：大标题之下、清单之上）+ 渐变拉线延伸到栏宽（填实留白、呼应锚条）。
   色彩叙事左蓝右绿：问题=电光蓝、解法=电光绿，与奇偶分组底块交替同语言 */
.sol__tag{display:flex;align-items:center;gap:12px;margin:0 0 18px;
  font-size:clamp(17px,1.6vw,20px);font-weight:800;letter-spacing:.05em;color:#fff;}
.sol__tag::before{content:"//";font-family:var(--mono);font-weight:700;font-size:1.15em;
  letter-spacing:-.08em;line-height:1;color:var(--sol-blue-hi);}
.sol__tag::after{content:"";flex:1;height:2px;
  background:linear-gradient(90deg,rgba(91,140,255,.5),rgba(91,140,255,0));}
.sol__side .sol__tag::before{color:var(--sol-green);}
.sol__side .sol__tag::after{background:linear-gradient(90deg,rgba(0,224,158,.45),rgba(0,224,158,0));}
.sol__pain{position:relative;z-index:1;}
.sol__pain-title{font-size:clamp(30px,3.6vw,46px);font-weight:900;letter-spacing:-.02em;line-height:1.16;color:#fff;margin:0;
  -webkit-text-stroke:.9px currentColor;}
/* 标题下电光蓝锚条（轮25）：左栏的视觉锚点，与右栏方案卡在同一行卡内横向对应 */
.sol__pain-title::after{content:"";display:block;width:58px;height:4px;margin-top:16px;
  background:linear-gradient(90deg,var(--sol-blue),rgba(47,107,255,0));
  -webkit-text-stroke:0;}
/* 痛点条目（轮29）：小字放大 + 铭牌化长条——占满左栏列宽填补留白，
   电光蓝渐变底从左渐隐、左侧亮边锚定；hover 辉光增强 + 右移（与方案卡动效同语言） */
.sol__pain-points{list-style:none;margin:26px 0 0;padding:0;display:flex;flex-direction:column;gap:12px;}
.sol__pain-points li{position:relative;display:flex;align-items:center;gap:14px;
  padding:13px 18px 13px 16px;
  font-size:clamp(16px,1.35vw,18px);line-height:1.6;font-weight:600;color:rgba(226,238,255,.88);
  background:linear-gradient(90deg, rgba(47,107,255,.12), rgba(47,107,255,.03) 62%, transparent 100%);
  border-left:3px solid rgba(91,140,255,.55);
  transition:background .25s var(--ease), border-color .25s var(--ease), transform .25s var(--ease);}
.sol__pain-points li::before{content:"/";flex:0 0 auto;font-family:var(--mono);font-weight:800;font-size:1.25em;line-height:1;color:var(--sol-blue-hi);}
.sol__pain-points li:hover{background:linear-gradient(90deg, rgba(47,107,255,.24), rgba(47,107,255,.06) 62%, transparent 100%);
  border-left-color:var(--sol-blue-hi);transform:translateX(6px);}
/* 右列：斜切方案卡 + 价值陈述；方案卡瀑布错位、轻微重叠 */
.sol__side{position:relative;z-index:1;display:flex;flex-direction:column;min-width:0;}
.sol__offers{display:flex;flex-direction:column;align-items:flex-start;gap:18px;}
.sol__offer{position:relative;display:block;max-width:470px;padding:24px 30px;text-decoration:none;
  --skew:-8deg;
  background:linear-gradient(132deg,#3D7BFF 0%,#2F6BFF 40%,#1B4FD1 100%);
  transform:skewX(var(--skew));transform-origin:bottom left;border-radius:8px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25), 0 18px 44px rgba(27,79,209,.34);
  transition:transform .28s var(--ease), box-shadow .28s var(--ease);}
.sol__offer + .sol__offer{margin:-8px 0 0 46px;}
.sol__offer:hover{transform:skewX(var(--skew)) translateY(-6px) scale(1.02);z-index:2;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.34), 0 30px 66px rgba(47,107,255,.52);}
.sol__offer:focus-visible{outline:2px solid var(--sol-blue-hi);outline-offset:3px;}
.sol__offer-in{display:flex;flex-direction:column;gap:7px;transform:skewX(calc(-1 * var(--skew)));}
.sol__offer-name{font-size:clamp(19px,1.8vw,23px);font-weight:900;line-height:1.4;color:#fff;letter-spacing:-.01em;
  -webkit-text-stroke:.7px currentColor;}
.sol__offer:hover .sol__offer-name{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:2px;}
.sol__offer-go{font-size:13px;font-weight:600;color:rgba(255,255,255,.82);}
/* 价值：电光绿大数字行内参差基线，是每行最后的「收获重音」；
   绿色左线（轮25）把「效果」段与上方方案卡划成组内第三段边界 */
.sol__vals{list-style:none;margin:auto 0 0;padding:34px 0 0 20px;display:flex;flex-direction:column;gap:14px;
  border-left:2px solid rgba(0,224,158,.38);}
.sol__vals li{font-size:16px;line-height:1.7;color:rgba(230,240,255,.86);font-weight:500;}
.sol__hl{font-style:normal;font-weight:900;font-size:2em;line-height:1;letter-spacing:-.02em;color:var(--sol-green);
  text-shadow:0 0 26px rgba(0,224,158,.35);padding:0 3px;}
/* 入场编排：行 reveal 淡入（加大位移、缓出更狠），行内元素 animation 错峰。
   ⚠️ 行级只覆盖 duration/timing（longhand），不能动 shorthand —— 否则清掉 --ri 错峰延迟。 */
#secSolutions .sol__row.reveal{transform:translateY(56px);transition-duration:.85s;transition-timing-function:cubic-bezier(.16,.84,.28,1);}
#secSolutions .sol__row.reveal.is-visible{transform:none;}
@media (prefers-reduced-motion: no-preference){
  #secSolutions .sol__row.is-visible .sol__tag{animation:solRise .7s var(--ease) .04s backwards;}
  #secSolutions .sol__row.is-visible .sol__pain-title{animation:solRise .7s var(--ease) .10s backwards;}
  #secSolutions .sol__row.is-visible .sol__pain-points{animation:solRise .7s var(--ease) .22s backwards;}
  #secSolutions .sol__row.is-visible .sol__offer{animation:solCard .8s cubic-bezier(.16,.84,.28,1) backwards;}
  #secSolutions .sol__row.is-visible .sol__offer:nth-child(2){animation-delay:.16s;}
  #secSolutions .sol__row.is-visible .sol__vals{animation:solRise .8s var(--ease) .36s backwards;}
}
@keyframes solRise{from{opacity:0;transform:translateY(28px);}to{opacity:1;transform:none;}}
/* 斜切角度走 --skew 变量：移动端减弱到 -4° 时入场动画与基态自动同步，不跳变 */
@keyframes solCard{from{opacity:0;transform:translateY(46px) skewX(var(--skew,-8deg)) scale(.94);}to{opacity:1;transform:skewX(var(--skew,-8deg));}}
@media (prefers-reduced-motion: reduce){
  #secSolutions .sol__pain-title,#secSolutions .sol__pain-points,
  #secSolutions .sol__offer,#secSolutions .sol__vals{animation:none !important;}
}
/* 底部横条（无痛点条目）：深色主题版 */
.sol__banner{display:flex;align-items:center;gap:18px;margin-top:56px;padding:22px 28px;position:relative;z-index:1;
  background:rgba(255,255,255,.04);border:1px solid rgba(91,140,255,.26);border-left:4px solid var(--sol-blue);
  border-radius:8px;text-decoration:none;transition:transform .25s, background .25s;}
.sol__banner:hover{transform:translateY(-3px);background:rgba(255,255,255,.07);}
.sol__banner-name{font-size:17px;font-weight:800;color:#fff;letter-spacing:-.01em;}
.sol__banner-link{margin-left:auto;display:inline-flex;align-items:center;padding:9px 15px;background:var(--sol-blue);color:#fff;font-size:14px;font-weight:700;white-space:nowrap;border-radius:6px;transition:background .2s var(--ease);}
.sol__banner:hover .sol__banner-link{background:var(--spot-deep);}
@media (max-width:980px){
  #secSolutions{margin-top:-64px;padding:124px 0 128px;clip-path:polygon(0 36px,100% 0,100% calc(100% - 36px),0 100%);}
  /* 移动端：交界线距 hero 底 = 64-18 = 46px；缩尺寸让轨道中心仍骑线（49≈46） */
  .sol__scroll{bottom:0;padding:8px;}
  /* 轮50.5 修复：上面 bottom:0 与 --end 基础规则 bottom:auto 同权重、此块更晚 → 覆盖后 top:-44 与 bottom:0 并存，
     第二枚按钮被垂直拉伸成贯穿 secAbout 的灰色长条（手机端截图反馈）。显式补回 bottom:auto。 */
  .sol__scroll--end{bottom:auto;}
  .sol__scroll-track{width:22px;height:36px;border-radius:12px;}
  .sol__scroll-dot{top:6px;width:5px;height:10px;margin-left:-2.5px;}
  .sol__list{gap:84px;}
  .sol__row{grid-template-columns:1fr;gap:26px;}
  /* 移动端底块出血收窄（container padding 28px 内），斜切角减弱，防横向溢出 */
  .sol__row::before{inset:-22px -16px;clip-path:polygon(0 14px, 100% 0, 100% calc(100% - 14px), 0 100%);}
  .sol__row:nth-child(even)::before{clip-path:polygon(0 0, 100% 14px, 100% 100%, 0 calc(100% - 14px));}
  /* 手机：编号转为章节号（static，压在每组标题上方）。倾斜自 v2 起已取消 */
  .sol__index{position:static;display:block;font-size:88px;transform:none;margin:0 0 -12px;}
  .sol__offer{max-width:none;--skew:-4deg;}
  .sol__offer + .sol__offer{margin:2px 0 0 24px;}
  .sol__pain-points{gap:10px;}
  .sol__pain-points li{padding:11px 14px;font-size:15.5px;}
  .sol__vals{padding:28px 0 0 14px;}
  .sol__hl{font-size:1.7em;}
  .sol__banner{flex-wrap:wrap;gap:8px;}
  .sol__banner-link{margin-left:0;}
}

/* ---------- 关于我们（全站视觉重构·批2） ----------
   版式：主行 = 左 60% 正文（首段首字下沉）+ 右 40% 三大数字（about.stats）；
   下方四卡 2×2 全宽，淡蓝底托白卡。整体竖排两块，卡片带与首页 bg-tint 呼应。 */
.about{display:flex;flex-direction:column;gap:44px;}
.about__main{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(40px,5vw,72px);align-items:start;}
/* 窄屏堆叠：原版无断点，1.5fr/1fr 在 490px 下把正文压到 ~250px（一行 11 字），必须先解决问题再谈好看 */
@media(max-width:820px){
  .about__main{grid-template-columns:1fr;gap:36px;}
  .about__stats{padding-top:4px;border-top:1px solid var(--line);}
  .about__stat:first-child{padding-top:18px;}
  /* 数字从 56px 收到 44px：单列堆叠后三个 56px 数字会把这一屏撑得过长 */
  .about__stat-num{font-size:44px;}
}
.about__text{min-width:0;}
.about__text p{color:var(--ink-soft);margin:0 0 16px;font-size:16px;line-height:1.8;}
/* 用户指令（2026-10-19）：首段首字下沉撤销 —— 大字号首字与正文行距打架、首段回行参差，
   整体排版显乱；撤销后正文通栏匀排，段落节奏统一。 */
.about__points{color:var(--ink-soft);list-style:none;padding-left:0;margin:18px 0 0;}
/* 2026-10-28 晚：默认圆点在有色的 ::marker 下渲染成小方块，看着像"未勾选的复选框"。
   改成 1px 深靛蓝短横线 —— 与全站发丝线同一语言，也比圆点更安静。 */
.about__points li{margin-bottom:10px;font-size:15px;position:relative;padding-left:18px;}
.about__points li::before{content:"";position:absolute;left:0;top:.78em;width:9px;height:1px;background:var(--accent);}
/* 三大数字：40px 深钢蓝 800 + 14px 灰说明，条目间 1px 分隔 */
.about__stats{display:flex;flex-direction:column;}
.about__stat{padding:20px 0;}
.about__stat:first-child{padding-top:0;}
.about__stat:last-child{padding-bottom:0;}
.about__stat + .about__stat{border-top:1px solid var(--line);}
/* 2026-10-28：数字原为 40px/800 深青无衬线 —— 「大号粗体彩色数字」是模板最爱的数据展示。
   改为衬线 + 墨色：笔锋带来的老式账簿感，比彩色粗体更可信。整套数字语言（产品编号/荣誉年份/数据）就此统一。 */
/* 2026-10-28 晚：数据数字从宋体细体改「仪表读数」—— 无衬线、56px、600 重、等宽数字。
   宋体细体的 10+ / 3 / 1500m² 读作"书里的小字注释"，是全页最该有重量却最弱的位置；
   数据是这家公司唯一能自证的东西，它必须是这一屏最重的东西。 */
.about__stat-num{font-size:56px;font-weight:600;color:var(--ink);line-height:1;letter-spacing:-.03em;
  font-variant-numeric:tabular-nums;}
.about__stat-num sup{font-size:.5em;font-weight:600;vertical-align:super;letter-spacing:0;margin-left:1px;}
.about__stat-label{font-size:13px;color:var(--muted);margin-top:8px;line-height:1.5;letter-spacing:.02em;}
/* ---------- 关于页「公司简介」团队合影底图（2026-11-02） ----------
   参照首页 hero 的合成方式：照片整幅铺底 → 轻透（opacity .55 量级）→
   其上压一层暖白纱（--bg = #FBFAF7），左侧压得重、右侧放松，
   保证左侧正文与右侧大数字都能读，同时照片仍然看得见。
   ⚠️ 与 hero 同理：**不要靠调低 opacity 来"净化"照片**（用户 2026-10-28 明确否定过
      "把照片调淡"这种做法）；要压就压白纱，照片本身保持可见度。 */
.about__main--photo{position:relative;overflow:hidden;isolation:isolate;
  border-radius:var(--radius-sm);
  padding:clamp(26px,3.2vw,50px) clamp(26px,3.4vw,54px);}
.about__bg{position:absolute;inset:0;z-index:0;pointer-events:none;
  background:url("../assets/team-meeting.jpg") center 42%/cover no-repeat;
  opacity:.55;filter:saturate(.62) contrast(1.02) brightness(.99);}
.about__bg::after{content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(251,250,247,.95) 0%,rgba(251,250,247,.88) 38%,rgba(251,250,247,.62) 70%,rgba(251,250,247,.50) 100%),
    linear-gradient(180deg,rgba(251,250,247,.62) 0%,rgba(251,250,247,.10) 26%,rgba(251,250,247,0) 48%,rgba(251,250,247,.74) 100%);}
.about__main--photo > .about__text,
.about__main--photo > .about__stats{position:relative;z-index:1;}
/* 窄屏专用：正文满宽压在照片上必然糊，所以整块底图关掉，改为**只让数字区压照片**
   （.about__stats 自身铺图 + 白纱），正文保持纸白。数字是粗体大字，压图仍清晰。 */
@media(max-width:980px){
  .about__main--photo{padding:24px 20px;}
  .about__main--photo .about__bg{display:none;}
  .about__main--photo > .about__stats{position:relative;z-index:1;overflow:hidden;
    padding:20px 18px;border-top:0;border-radius:var(--radius-sm);}
  .about__main--photo > .about__stats::before{content:"";position:absolute;inset:0;z-index:-1;
    background:url("../assets/team-meeting.jpg") center 38%/cover no-repeat;opacity:.64;}
  .about__main--photo > .about__stats::after{content:"";position:absolute;inset:0;z-index:-1;
    background:linear-gradient(180deg,rgba(251,250,247,.88) 0%,rgba(251,250,247,.60) 100%);}
}
/* 2026-10-28 视觉重构：淡蓝底托白卡（2×2）改为「四栏 + 一根顶线」的规格说明栏。
   原版是页面上第 4 组卡片矩阵，白卡浮在淡蓝底上又多一层嵌套底，视觉上堆叠；去底去框后
   四栏齐顶对齐，读起来像一份并排的说明，而不是四个方格子。 */
.about__cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;
  background:none;border-radius:0;padding:0;border-top:1px solid var(--line);}
.about__card{background:none;border-radius:0;padding:26px 32px 0 0;}
.about__card h3{margin:0 0 8px;font-size:16px;font-weight:700;color:var(--ink);}
.about__card p{margin:0;color:var(--muted);font-size:13.5px;line-height:1.75;}
@media(max-width:980px){
  .about__cards{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:26px;}
  .about__card{padding:22px 24px 0 0;}
}
@media(max-width:640px){
  .about__cards{grid-template-columns:1fr;row-gap:22px;}
  .about__card{padding:18px 0 0;}
}

/* ---------- 发展历程：三列等宽横向时间轴（全站视觉重构·批2） ----------
   ★ 版式逻辑 ★
     ① 三条脉络**三列等宽横排**，读序从左到右（领域开荒 → 产业化）；
     ② 列头 = 年份区间 14px 灰 + 阶段名 20px/700；列与列之间 1px 竖线分隔；
     ③ 每列一条贯穿竖线 + 静态 6px 蓝点；节点 = 16:9 真图 + 年份 + 描述；
        卡去顶线去边框、白底融进页面，内容自己说话；
     ④ ≤980px 单列堆叠，列间竖线改横线。 */
.tlx{position:relative;margin-top:44px;}
.tlx__cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;}
.tlx__col{position:relative;min-width:0;padding:0 36px;}
.tlx__col:first-child{padding-left:0;}
.tlx__col:last-child{padding-right:0;}
.tlx__col + .tlx__col{border-left:1px solid var(--line);}
.tlx__col-head{margin:0 0 26px;}
.tlx__col-range{display:block;font-size:14px;font-weight:600;letter-spacing:.04em;color:var(--muted);margin:0 0 6px;}
.tlx__col-name{font-size:20px;font-weight:700;color:var(--ink);margin:0;letter-spacing:-.01em;line-height:1.3;}
/* 列内竖线：从列头下方贯穿到列尾，串起全部节点（起点一小段蓝色，余下淡线） */
.tlx__nodes{position:relative;display:flex;flex-direction:column;gap:34px;margin:0;padding:0;list-style:none;}
.tlx__nodes::before{content:"";position:absolute;left:0;top:8px;bottom:6px;width:1px;
  background:linear-gradient(180deg,var(--accent) 0%,var(--line) 60px,var(--line) 100%);}
.tlx__node{position:relative;min-width:0;padding-left:22px;}
/* 静态 6px 蓝点：不随 hover 变色变大 —— 本版视觉语言是"资料页"不是"游戏 UI"。
   外圈用本节底色而非纯白：点压在竖线上，外圈只为遮断线头，颜色必须与纸灰底同色。 */
.tlx__dot{position:absolute;left:-2.5px;top:6px;width:6px;height:6px;border-radius:50%;
  background:var(--accent);box-shadow:0 0 0 3px var(--bg-alt);}
/* 节点卡**不带底色、不带内边距**：本节底是暖灰纸面（--bg-alt），
   若再叠一块纯白 #fff，就成了纸面上贴白纸块 —— 亮一档、脏一层，
   且 padding:0 时图片与文字正好压在白块边缘，看着"贴边"。
   去掉底色让图文直接落在纸灰上，留白由「竖线 → 内容」的 22px 与图文间距提供。 */
.tlx__card{position:relative;}
.tlx__year{font-size:16px;font-weight:700;color:var(--accent-deep);font-family:inherit;
  letter-spacing:-.01em;margin:0 0 8px;line-height:1.2;}
.tlx__desc{font-size:13.5px;color:var(--ink-soft);line-height:1.72;margin:0;}
.tlx__desc em{font-style:normal;color:var(--ink);font-weight:700;
  background:linear-gradient(transparent 62%,rgba(47,107,255,.16) 62%);}
.tlx__num{font-weight:800;color:var(--accent-deep);font-family:inherit;letter-spacing:-.01em;}
/* 节点图：16:9 固定比例，cover 裁切，懒加载。图与年份之间留 16px —— 去掉白卡后
   图与字直接相邻，靠这一档 + 年份 8px 下距，把「图 / 年份 / 描述」三层分开。 */
.tlx__node-img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;border-radius:var(--radius-sm);margin:0 0 16px;background:var(--bg-alt);}

/* ---------- 窄屏：三列收成单列，列间竖线改横线 ---------- */
@media (max-width:980px){
  .tlx__cols{grid-template-columns:1fr;}
  .tlx__col{padding:0;}
  .tlx__col + .tlx__col{border-left:0;border-top:1px solid var(--line);margin-top:40px;padding-top:36px;}
  .tlx__col-head{margin-bottom:22px;}
}

/* ---------- 产品中心 ----------
   全站视觉重构·批3：分类头 —— 序号改 24px 品牌蓝 700，与产品族标题同行排列
   （删深底圆角方块、删 mono 字体、删 10px 圆角）；标题下方 2px×60px 品牌蓝短线
   取代通栏 1px 分割线 —— 细、短、准，是工程图纸的标注语言而非装饰条。 */
.fam{margin-bottom:48px;}
/* 轮31b：资质产权页头导航的目标锚点（两块版块）同样留出固定页头高度 */
.fam,#secAboutFull,#secTimeline,#secFacilities,#secHonorsFull,#secIp{scroll-margin-top:92px;}
/* 轮60b：应用场景页头「本页场景板块导航」的跳转目标（各场景卡锚点）同样留出页头高度 */
.app3d[id],.app--hero[id],.app[id]{scroll-margin-top:92px;}
.fam__head{display:flex;align-items:baseline;gap:14px;margin:0 0 22px;}
.fam__head > div{min-width:0;}
/* 2px×60px 品牌蓝短线：挂在标题/简介所在的文本列底部（不再通栏） */
.fam__head > div::after{content:"";display:block;width:56px;height:1px;background:var(--line-strong);margin-top:16px;}
/* 2026-10-28：内页品类编号与首页产品清单编号统一
   2026-10-31 去 AI 味：颜色从品牌蓝改纸灰；字体从等宽改回正文黑体
   （等宽数字在中文里读作仪表盘读数，是模板站序号角标的典型特征） */
.fam__no{font-family:inherit;font-size:20px;font-weight:500;line-height:1;color:#B7B1A6;letter-spacing:0;font-variant-numeric:tabular-nums;}
/* 品类标题与全站大标题同族（衬线）；23px 宋体配 0.4px 伪加粗，避免小字号笔画发虚 */
.fam__title{font-family:var(--serif);font-size:23px;font-weight:700;margin:0;letter-spacing:0;color:var(--ink);text-shadow:0 0 .4px currentColor;}
/* 同一处规格语言（2026-10-29 轮86）：产品页品类标题后的频段标签原来是带描边的小方块，
   与首页索引行同属「参数装进框里」的模板写法，一并改成「细竖线 + 无衬线规格」，
   两页同一份数据只有一种读法。 */
.fam__tag{display:inline-block;margin-left:14px;padding-left:14px;background:none;border:0;
  border-left:1px solid var(--line-strong);border-radius:0;color:var(--muted);
  font-family:inherit;font-size:13px;font-weight:500;line-height:1.2;letter-spacing:.01em;
  font-variant-numeric:tabular-nums;vertical-align:2px;}
.fam__desc{color:var(--muted);font-size:14px;margin:4px 0 0;}
.prod__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;}
.prod{position:relative;display:block;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px 26px;transition:border-color .25s;cursor:pointer;}
/* 批3：hover 只做「边框 + 产品名」两件事（标题变色见下方通用规则），不抬升、不投影 */
.prod:hover{border-color:var(--line-strong);}
.prod:focus-visible{outline:2px solid var(--accent);outline-offset:3px;}
/* 产品中心列表页不渲染图片（用户指令）：图只进详情页，列表页留文字与规格 */
.prod__name{font-size:18px;font-weight:700;margin:0 0 8px;color:var(--ink);}
/* 与详情页同一套括注处理：主名不变，括注是「优势产品」卖点（10-31 三版定稿）。
   灰小字太弱、浅底小标签又会被误认成规格筛选 chip → 改实底靛蓝反白，宽度贴合内容不拉通栏。 */
.prod__name-note{display:block;width:fit-content;max-width:100%;margin-top:9px;padding:3px 10px;
  font-size:12.5px;font-weight:600;line-height:1.55;letter-spacing:.02em;
  color:#fff;background:var(--accent);border-radius:2px;}
.prod__desc{color:var(--ink-soft);font-size:14px;margin:0 0 16px;line-height:1.7;}
.prod__more{display:inline-flex;align-items:center;gap:6px;margin-top:16px;font-size:13px;font-weight:600;color:var(--accent);}
/* 规格列表（2026-10-31 去 AI 味）：去掉「要点 N」编号，改纯列表项；
   每项左侧一道 2px 品牌蓝短线作锚（只在 hover 时显色，静息淡灰），句子本身承担读法。
   含阈值「≥」的关键参数走品牌蓝。 */
.spec{display:block;list-style:none;margin:0;padding:14px 0 0;border-top:1px solid var(--line);}
/* 产品卡描述已全部移除（2026-11-01）：标题直接接分列时，8px 太近会让细线读成标题下划线，
   单独给这个相邻关系补间距（相邻兄弟 margin 会折叠，故直接写目标值 18px）。
   有描述的老卡（Synapse）不受影响。 */
.prod__name + .spec{margin-top:18px;}
.spec li{position:relative;padding-left:14px;font-size:14px;font-weight:400;color:var(--ink-soft);line-height:1.7;}
.spec li + li{margin-top:9px;}
.spec li::before{content:"";position:absolute;left:0;top:.62em;width:2px;height:14px;background:var(--line-strong);transition:background .25s;}
.prod:hover .spec li::before{background:var(--accent);}
.spec li.is-key{font-weight:600;color:var(--steel-deep);}
/* 软件类图文卡（2026-10-31 二版）：左图右文。
   一版的图位只有 180×120，在跨两列的整卡里像张缩略图，跟右侧四五行文字不匹配 →
   图位放大到 320 宽、16:9（面积约 2.6 倍），整卡读起来才是「左图右文」而不是「小图+大段文字」。
   Synapse 那张是完整界面截图（左参数面板 + 右等高线图），16:9 对 1200×638 只裁掉约 5% 边缘，面板不会被切。 */
.prod--soft{grid-column:1/-1;display:flex;gap:26px;align-items:center;}
.prod--soft .prod__thumb{flex:0 0 360px;aspect-ratio:16/9;border-radius:2px;overflow:hidden;
  background:var(--bg-alt);border:1px solid var(--line);}
.prod--soft .prod__thumb img{display:block;width:100%;height:100%;object-fit:cover;}
.prod__body{display:block;min-width:0;}

/* ---------- 应用场景 ---------- */
.apps{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
/* 批3：删左侧 4px 蓝线与 hover 抬起/投影，改 1px 全边框，hover 仅边框变品牌蓝 */
.app{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px 26px;transition:border-color .25s;}
.app:hover{border-color:var(--accent);}
/* 批3：场景缩略图（问题3 口径 —— 有照片才渲染，无照片整区不出现）图上文下 */
.app__img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--radius-sm);margin:0 0 16px;background:var(--bg-alt);}
/* 批3：去大写间距，12px 品牌蓝 600 正常字体 */
.app__area{font-size:12px;font-weight:600;color:var(--accent);}
.app__title{font-size:19px;font-weight:700;margin:6px 0 10px;color:var(--ink);}
.app__desc{color:var(--ink-soft);font-size:14px;margin:0 0 14px;line-height:1.7;}
.app__tags{display:flex;flex-wrap:wrap;gap:8px;}
.app__tags span{background:transparent;border:1px solid var(--line-strong);font-size:12px;color:var(--muted);padding:3px 10px;border-radius:3px;}

/* ---------- 应用场景 · 大图交互（轮51）----------
   图区 6.5 / 文字 3.5 两栏；图区为深墨蓝"蓝图"底 + 细网格，承载矢量线稿与标注热点。
   标注点 = 静态实心圆点（批3 起脉冲外环整体删除），坐标由 JS 内联 left/top 百分比
   （与 SVG viewBox 同基准对齐）。桌面 hover / 键盘 focus-visible 弹说明卡；
   移动端 tap（.is-open）弹底部说明条。
   ⚠️ 说明卡是标注点的绝对定位后代，而标注点带 transform（包含块劫持），详见 ≤980 段注释。 */
.app--hero{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,6.5fr) minmax(0,3.5fr);gap:20px;padding:18px;align-items:stretch;}
/* 批3：删蓝图网格与径向渐变，舞台改纯色深灰蓝 #0c1526（线稿与标注点自带对比度，底噪反而脏） */
.app__stage{position:relative;border:1px solid rgba(127,166,255,.16);border-radius:8px;overflow:hidden;background:#0c1526;}
.app__stage>svg{display:block;width:100%;height:auto;}
.app__hint{position:absolute;top:12px;left:14px;z-index:4;font-size:12px;letter-spacing:.02em;color:#a9c3ff;background:rgba(8,15,29,.62);border:1px solid rgba(127,166,255,.26);padding:4px 11px;border-radius:3px;pointer-events:none;transition:opacity .2s;}
.app__spot{position:absolute;z-index:3;width:28px;height:28px;transform:translate(-50%,-50%);cursor:pointer;border-radius:50%;-webkit-tap-highlight-color:transparent;}
.app__spot:focus{outline:none;}
.app__spot:focus-visible{outline:2px solid #fff;outline-offset:2px;}
/* 批3：脉冲环整体删除（标记点改静态），核心点 = 静态 8px 实心品牌蓝 + 2px 白描边，
   去外发光光晕；hover / focus / 移动端 tap 打开时放大到 10px（8 × 1.25）。 */
.app__spot-core{position:absolute;left:50%;top:50%;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;background:var(--accent);border:2px solid #fff;transition:transform .2s;}
.app__spot:hover .app__spot-core,.app__spot:focus-visible .app__spot-core,.app__spot.is-open .app__spot-core{transform:scale(1.25);}
/* 批3：说明卡从深色卡改白底深字（1px 发丝边 + 4px 圆角 + 无阴影），与全站「纸面」语言一致 */
.app__tip{position:absolute;left:50%;bottom:calc(100% + 13px);transform:translateX(-50%) translateY(4px);width:max-content;max-width:min(250px,44vw);background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:4px;padding:10px 13px;font-size:13px;line-height:1.62;opacity:0;visibility:hidden;z-index:6;pointer-events:none;text-align:left;transition:opacity .18s var(--ease),transform .18s var(--ease),visibility 0s linear .18s;}
.app__tip b{display:block;font-size:13.5px;color:var(--ink);margin-bottom:3px;letter-spacing:.01em;}
.app__tip::after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);border:6px solid transparent;border-top-color:#fff;}
.app__spot:hover .app__tip,.app__spot:focus-visible .app__tip,.app__spot.is-open .app__tip{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);transition:opacity .18s var(--ease),transform .18s var(--ease),visibility 0s;}
.app__spot:hover,.app__spot:focus-visible,.app__spot.is-open{z-index:7;}
.app__info{padding:12px 10px 12px 4px;display:flex;flex-direction:column;justify-content:center;min-width:0;}
.app--hero .app__title{font-size:24px;line-height:1.32;margin:8px 0 12px;}
.app--hero .app__desc{font-size:15px;line-height:1.8;margin:0 0 16px;}
.app--hero .app__tags span{font-size:12.5px;padding:4px 12px;}
/* ===== 首页应用场景 · 主视觉台（2026-10-28 视觉升级）=====
   左侧深色舞台放工程线稿（appArt 复用），右侧四条场景可点/hover 切换。
   网格底纹刻意压到 .055 alpha：是"图纸底"的语境，不参与视觉竞争；
   舞台与下方深空版块同色系，让整页出现第一处技术画面。
   ⚠️ 本段只管首页 #secApplications；应用场景页的 .app3d 剥开卡不受影响。 */
.apshow{display:grid;grid-template-columns:minmax(0,1.38fr) minmax(0,1fr);
  background:#0b1322;border:1px solid rgba(127,166,255,.16);border-radius:var(--radius);overflow:hidden;}
/* 2026-10-28 去 AI 味：撤销「蓝图网格 + 中心蓝色光晕」——
   网格纹理是"科技感"模板的万能底纹，加在任何深色面上都成立，恰恰说明它没有信息。
   改为极淡的顶部提亮（模拟图纸受光），舞台只剩线稿本身。 */
.apshow__view{position:relative;aspect-ratio:16/10.15;border-right:1px solid rgba(127,166,255,.10);
  background:linear-gradient(180deg,#101b2d 0%,#0b1322 100%);}
.apshow__art{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  padding:8px 14px;opacity:0;visibility:hidden;
  transition:opacity .5s var(--ease),visibility 0s linear .5s;}
.apshow__art.is-on{opacity:1;visibility:visible;transition:opacity .5s var(--ease),visibility 0s;}
.apshow__art svg{display:block;width:100%;height:auto;max-height:100%;}
.apshow__panel{display:flex;flex-direction:column;justify-content:center;gap:0;padding:12px 14px;min-width:0;}
.apshow__item{display:grid;grid-template-columns:auto minmax(0,1fr);gap:11px;align-items:baseline;
  width:100%;text-align:left;font:inherit;color:inherit;cursor:pointer;
  background:transparent;border:0;border-radius:6px;padding:11px 14px;
  transition:background .25s var(--ease),box-shadow .25s var(--ease);}
.apshow__item:hover{background:rgba(127,166,255,.06);}
.apshow__item:focus-visible{outline:2px solid #7FA6FF;outline-offset:-2px;}
/* 选中态原来靠"蓝底块 + 2px 亮蓝左条"（很 UI 组件）。改为极淡白提亮 + 1px 冷蓝细线：
   选中是"被照亮"，不是"被涂色"。 */
.apshow__item.is-on{background:rgba(255,255,255,.055);box-shadow:inset 1px 0 0 rgba(140,175,255,.72);}
.apshow__no{font-size:11.5px;font-weight:800;letter-spacing:.06em;line-height:1.85;color:rgba(169,198,255,.42);transition:color .25s;}
.apshow__item.is-on .apshow__no{color:#7FA6FF;}
.apshow__body{display:block;min-width:0;}
.apshow__area{display:block;font-size:11.5px;font-weight:600;letter-spacing:.04em;color:#8FB2F2;opacity:.76;transition:opacity .25s;}
.apshow__item.is-on .apshow__area{opacity:1;}
.apshow__title{display:block;font-size:16px;font-weight:700;letter-spacing:-.01em;color:#C9D6EF;margin:3px 0 0;transition:color .25s;}
.apshow__item.is-on .apshow__title{color:#fff;}
/* 描述只在选中项展开：其余收起为 0 高；展开高度锁死为 2 行（38px），
   保证切换任何一项时面板总高恒定、列表不会上下跳。超出 2 行按省略号截断。 */
.apshow__desc{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;
  height:0;overflow:hidden;opacity:0;margin:0;
  font-size:12px;line-height:1.58;color:#8799BC;
  transition:height .32s var(--ease),opacity .28s var(--ease),margin .32s var(--ease);}
.apshow__item.is-on .apshow__desc{height:38px;opacity:1;margin:4px 0 0;}
/* 窄屏：舞台在上、条目在下，去掉竖分隔线，舞台略矮以免首屏被挤走 */
@media (max-width:860px){
  .apshow{grid-template-columns:1fr;}
  .apshow__view{aspect-ratio:16/10;border-right:0;border-bottom:1px solid rgba(127,166,255,.13);}
  .apshow__art{padding:18px 20px;}
  .apshow__panel{padding:10px;justify-content:flex-start;}
  .apshow__item{padding:12px 14px;}
  .apshow__title{font-size:15.5px;}
}
/* ≤980：单列堆叠；触点放大；说明卡改为视口底部居中的抽屉说明条 ——
   ⚠️ 说明卡是标注点的绝对定位后代，而标注点带 transform（包含块劫持），在 34px 的点内
   定位 left/right 会把文本挤成竖条；故移动端标注点去 transform（负 margin 居中），
   说明条升为 fixed 以视口为基准，天然免疫图区矮与横向溢出（reveal 静止态 transform:none 不劫持）。
   打开时其余标注点变淡（:has 渐进增强，旧浏览器仅少一层视觉反馈） */
@media (max-width:980px){
  .app--hero{grid-template-columns:1fr;gap:14px;padding:14px;}
  .app__info{padding:6px 4px 2px;}
  .app--hero .app__title{font-size:20px;}
  .app__spot{width:34px;height:34px;transform:none;margin:-17px 0 0 -17px;}
  .app__spot-core{width:13px;height:13px;margin:-6.5px 0 0 -6.5px;}
  .app__tip{position:fixed;left:0;right:0;bottom:12px;width:min(92vw,560px);max-width:none;margin:0 auto;transform:translateY(10px);padding:11px 15px;}
  .app__tip::after{display:none;}
  .app__spot:hover .app__tip,.app__spot:focus-visible .app__tip,.app__spot.is-open .app__tip{transform:translateY(0);}
  .app__stage:has(.app__spot.is-open) .app__spot:not(.is-open){opacity:.35;}
  .app__stage:has(.app__spot.is-open) .app__hint{opacity:0;}
}

/* ---------- 应用场景 · 3D 等距剥开（轮52）----------
   深色通栏卡（对比冲击）+ 大编号描边字 + 左右交替构图节奏；
   舞台内 SVG 层组剥开 = translateY(calc(var(--xp)*var(--off)*-20px))（纯 2D 驱动的等距 3D；
   轮62d 22→20 且聚焦抬升 14→6：两者叠加（聚焦最上层+满格）曾把标签顶推出窗口被裁
   （用户截图"整机后盖只剩半截"），组合上限按窗口顶 -12 重算）；
   层聚焦 = 抬升 + 提亮 + 其余压暗；滑杆 / hover / 右侧图层名三路联动。 */
.app3d{grid-column:1/-1;position:relative;background:#0c1526;border:1px solid rgba(127,166,255,.22);border-radius:var(--radius);padding:20px 38px;overflow:hidden;}
/* 去 AI 化：移除外发光径向光晕 */
.app3d__no{position:absolute;left:30px;top:18px;font-family:inherit;font-size:20px;font-weight:800;line-height:1;color:var(--accent);letter-spacing:-.01em;user-select:none;pointer-events:none;}
.app3d--flip .app3d__no{left:30px;right:auto;}
.app3d__head{position:relative;margin:0 0 14px;padding-left:54px;padding-right:0;}
.app3d--flip .app3d__head{padding-left:54px;padding-right:0;}
.app3d__headtext .app__area{color:#8FB2F2;}
.app3d__title{font-size:22px;font-weight:800;letter-spacing:-.015em;color:#fff;margin:4px 0 6px;}
.app3d__desc{color:#B7C7E8;font-size:13.5px;line-height:1.5;margin:0;max-width:720px;}
/* 轮55：右侧材料卡默认折叠（0 宽隐藏），选定某层后场景收窄、材料区展开（grid 列过渡）
   轮57：用户指令"过渡动画可以稍长一些、要连贯"——easeInOut(cubic-bezier .65,0,.35,1) 起止皆柔
   轮58：.6s→.9s 进一步放慢；大图缩放改纯 transform（见下方 min-width+scale 钉宽组合），
   列宽过渡只负责面板开合，画面不再压扁、卡高不再跳动
   轮59：列宽弃用 fr 改 calc 定宽——CDP 逐帧实测：裸 0fr→minmax(0,3.4fr) 类型不兼容触发
   "离散翻转"（半程单帧跳变 ~460px，且 fr 按比例分配把邻轨已用尺寸一并拖跳，
   图缩放与面板开合脱节、方向相逆 = 用户报告的"图往左缩、面板往右收、有卡顿"）；
   calc 定宽逐帧解析为确定长度、线性插值，与 SVG scale 同曲线同速，图缘双边全程贴合 */
.app3d__wrap{position:relative;display:grid;grid-template-columns:calc((100% - 0px)*1) calc((100% - 0px)*0);gap:0;align-items:stretch;transition:grid-template-columns .9s cubic-bezier(.65,0,.35,1),gap .9s cubic-bezier(.65,0,.35,1);}
.app3d.has-sel .app3d__wrap{grid-template-columns:calc((100% - 24px)*.66) calc((100% - 24px)*.34);gap:24px;}
.app3d--flip .app3d__wrap{grid-template-columns:calc((100% - 0px)*0) calc((100% - 0px)*1);}
.app3d--flip.app3d.has-sel .app3d__wrap{grid-template-columns:calc((100% - 24px)*.34) calc((100% - 24px)*.66);}
.app3d--flip .app3d__stage{order:2;}
.app3d--flip .app3d__side{order:1;}
/* 舞台：延续轮51 蓝图网格语言（更深一档，衬托 3D 层） */
/* 批3：删蓝图网格与径向渐变光晕，舞台改纯色深底 #0c1526（与卡底同色，画面本身做主角） */
.app3d__stage{position:relative;border:1px solid rgba(127,166,255,.16);border-radius:10px;overflow:hidden;background:#0c1526;}
.app3d__stage>svg{display:block;width:100%;height:auto;}
.app3d__layer{transform:translateY(calc(var(--xp,0) * var(--off,0) * -20px + var(--lift,0px)));transition:transform .3s var(--ease),opacity .3s ease,filter .3s ease;cursor:pointer;}
.app3d__layer.is-focus{--lift:-6px;filter:brightness(1.22) drop-shadow(0 0 10px rgba(88,150,255,.4));}
.app3d__layer.is-blur{opacity:.35;}
.app3d__tag rect{fill:rgba(8,15,29,.82);stroke:rgba(127,166,255,.45);stroke-width:1;transition:stroke .2s;}
.app3d__tag text{fill:#DCE7FF;font-size:12px;font-weight:600;}
.app3d__layer.is-focus .app3d__tag rect{stroke:#fff;}
.app3d__layer.is-focus .app3d__tag text{fill:#fff;}
/* 轮68i（用户指令）：合拢/剥开滑杆整体移除（对应样式已清零，删除类注释不带选择器原文），
   卡片恒定 --xp:1 全剥开；foot 仅承载底部标签行 */
.app3d__foot{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin:12px 0 0;}
/* 右栏（轮53/55）：材料展示区——默认折叠隐藏，选定层后随 .has-sel 展开 */
.app3d__side{display:flex;flex-direction:column;gap:12px;min-width:0;overflow:hidden;opacity:0;transition:opacity .9s cubic-bezier(.65,0,.35,1);}
.app3d.has-sel .app3d__side{opacity:1;}
.app3d__mat{flex:1;min-height:236px;}
/* 轮58：展开编排——①场景 SVG 布局盒钉住折叠态尺寸（JS 写 --a3d-fullw），展开时整图
   transform:scale(--a3d-squeeze)（JS 算出与终态列宽精确吻合的比例，origin 左中）：
   逐帧渲染宽与收窄中的面板严丝合缝，画面纯缩放零压扁，卡高恒定无跳动（GPU 合成）；
   ②材料卡内容钉终宽（--a3d-sidew）拉帘显出；≤980 单列布局不适用。
   轮62c：用户指令"整卡压到标准 16:9"——投影 Y×0.44 再压 + 固定区（内边距/卡头/关键词行）
   压缩后，SVG 盒高预算 ≈461px → viewBox 收到 "115 -12 525 228"（窗口顶 -12：位移 22 下
   满格剥开最高层顶 ≈-9.1 不裁、折叠底 213.8 留 2.2 余），盒高按 fullw×228/525=0.4343
   钉——meet 双向贴合零空隙；高度随钉宽而非列宽（两态恒定，轮58 卡高恒定编排不变）；
   ≤980 保持同窗口（SVG 矢量缩放，窄屏等比缩小仍清晰） */
@media (min-width:981px){
  .app3d__stage>svg{min-width:var(--a3d-fullw,100%);height:calc(var(--a3d-fullw,100%)*0.4343);transform-origin:left center;transition:transform .9s cubic-bezier(.65,0,.35,1);}
  .app3d.has-sel .app3d__stage>svg{transform:scale(var(--a3d-squeeze,1));}
  .app3d__mat{min-width:var(--a3d-sidew,0);}
}
.app3d__mathint{display:flex;align-items:flex-start;gap:12px;height:100%;min-height:inherit;background:rgba(8,15,29,.55);border:1px dashed rgba(127,166,255,.3);border-radius:6px;padding:18px 16px;font-size:13.5px;line-height:1.7;color:#9DB9FF;}
.app3d__mathint i{flex:0 0 26px;opacity:.85;}
/* 批3：材料卡删 matIn 入场动画（.6s 淡入上浮），边框改 1px rgba(255,255,255,.15) ——
   中性白描边替代蓝色描边，卡片随面板展开即可，不再抢戏。 */
.app3d__matcard{height:100%;background:rgba(8,15,29,.55);border:1px solid rgba(255,255,255,.15);border-radius:6px;padding:16px 18px 14px;}
.app3d__matform{display:inline-flex;align-items:center;gap:8px;background:rgba(47,107,255,.16);border:1px solid var(--accent);border-radius:3px;padding:5px 12px 5px 8px;margin:0 0 10px;}
.app3d__matform span{font-size:15px;font-weight:800;color:#fff;letter-spacing:.04em;}
.app3d__matcard h4{font-size:16.5px;font-weight:700;color:#fff;margin:0 0 5px;}
.app3d__matcard>p{font-size:13px;line-height:1.75;color:#C9D8FF;margin:0 0 10px;}
.app3d__matprods{display:flex;flex-direction:column;gap:6px;}
.app3d__matlabel{font-size:11px;letter-spacing:.04em;color:#8FA9E8;}
.app3d__matprod{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#DCE7FF;font-size:13.5px;font-weight:600;text-decoration:none;background:rgba(127,166,255,.08);border:1px solid rgba(127,166,255,.24);border-radius:3px;padding:7px 11px;transition:border-color .2s,background .2s,color .2s;}
.app3d__matprod i{font-style:normal;color:var(--accent);}
.app3d__matprod:hover{border-color:var(--accent);background:rgba(47,107,255,.16);color:#fff;}
.app3d__foot .app3d__tags{margin:0;flex:none;gap:14px;}
/* 批3：底部标签极简 —— 12px #9DB9FF 无边框无底色（与滑杆同一语言） */
.app3d__tags span{background:transparent;border:none;color:#9DB9FF;font-size:12px;padding:0;}
@media (max-width:980px){
  .app3d{padding:22px 18px 20px;}
  .app3d__no{font-size:20px;top:14px;left:18px;right:auto;}
  .app3d--flip .app3d__no{left:18px;right:auto;}
  .app3d__head{margin-bottom:14px;padding-left:44px;padding-right:0;}
  .app3d--flip .app3d__head{padding-left:44px;padding-right:0;}
  .app3d__title{font-size:21px;}
  .app3d__desc{font-size:14px;}
  .app3d__wrap,.app3d.has-sel .app3d__wrap,.app3d--flip .app3d__wrap,.app3d--flip.app3d.has-sel .app3d__wrap{grid-template-columns:1fr;gap:14px;transition:none;}
  .app3d__side{display:none;}
  .app3d.has-sel .app3d__side{display:flex;opacity:1;}
  .app3d--flip .app3d__stage{order:0;}
  .app3d--flip .app3d__side{order:1;}
  .app3d__mat{min-height:0;}
  .app3d__mathint{padding:14px;}
  .app3d__matcard{padding:14px;}
}
/* 轮61：动效降级（前庭安全）——reduced-motion 下深空卡的列宽/缩放/剥开过渡即时呈现，
   材料卡入场动画与标注脉冲已随批3 删除（静态呈现，无需再降级）。 */
@media (prefers-reduced-motion: reduce){
  .app3d__wrap,.app3d__side,.app3d__stage>svg,.app3d__layer,.app3d__tag rect,.app3d__matprod,.app3d__matprod i{transition:none;}
  .app:hover{transform:none;}
}

/* ---------- 新闻动态 ----------
   批4：hover 仅「边框变 #d5e0f5 + 标题变品牌蓝」（无投影无位移）；
   类型标签从描边边框改纯色淡底；缩略图按数据渲染（问题3 口径）。 */
.news{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.news-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px 24px;
  display:flex;flex-direction:column;cursor:pointer;
  transition:background-color .3s var(--ease),border-color .3s var(--ease);}
/* 2026-10-28 晚：与产品清单共用同一套「反白」交互语言 —— 静态是纸上的白卡，hover 整卡翻深靛蓝。
   全站只要有两处以上用同一个交互语法，它就从"某个效果"变成"这套设计的性格"。
   这是"活泼"最便宜的做法：不占静态版面，只在指针经过时爆发。 */
.news-card:hover{background:var(--navy);border-color:var(--navy);}
.news-card:focus-visible{outline:2px solid var(--accent);outline-offset:3px;}
.news-card__img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--radius-sm);margin:0 0 16px;background:var(--bg-alt);}
.news-card__top{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;}
/* 2026-10-29 轮90（用户指令：「年份的字体还有 AI 味」）：
   原来是 var(--mono) 12px —— 等宽字体读作"代码 / 终端输出"，是模板站做卡片 meta 标签的标配，
   一眼就知道不是编辑做的。改为正文黑体的**比例数字**（PingFang / SF 的数字本身端正、有排印感），
   字号 13px、字重 600、字距归零；tabular-nums 留着 —— 三张卡的年份必须同宽对齐。
   气质从「终端灰字」换成「档案编号」。 */
.news-card__date{font-size:13px;font-weight:600;color:var(--muted);font-variant-numeric:tabular-nums;letter-spacing:0;
  transition:color .3s var(--ease);}
/* 2026-10-28：「获奖/活动/媒体」原为淡蓝/淡绿/淡棕底色块 —— 一张新闻卡上最抢眼的竟是分类标签。
   分类是元信息，不该有颜色。改为无底、纸灰细描边、拉开字距，退到标题之后。 */
.news-card__type{font-size:11px;font-weight:500;padding:2px 7px;border-radius:0;border:1px solid var(--line-strong);background:none;color:var(--muted);letter-spacing:.1em;
  transition:color .3s var(--ease),border-color .3s var(--ease);}
/* 类型区分撤销（2026-10-28）：三类不再用颜色区分 —— 文字本身已说明，颜色留给真正需要区分的东西。 */
.news-card h3{font-size:18px;font-weight:700;margin:0 0 10px;line-height:1.42;color:var(--ink);
  transition:color .3s var(--ease);}
.news-card__source{font-size:13px;color:var(--muted);margin:auto 0 0;transition:color .3s var(--ease);}
.news-card__more{display:inline-flex;align-items:center;gap:6px;margin-top:14px;font-size:13px;font-weight:600;color:var(--ink-soft);transition:color .3s var(--ease);}
/* 反白态：深底上重排所有文字层级 */
.news-card:hover .news-card__date{color:rgba(255,255,255,.58);}
.news-card:hover .news-card__type{color:rgba(255,255,255,.74);border-color:rgba(255,255,255,.34);}
.news-card:hover h3{color:#fff;}
.news-card:hover .news-card__source{color:rgba(255,255,255,.62);}
.news-card:hover .news-card__more{color:#8FB4FF;}

/* ---------- 新闻详情（文章页） ---------- */
.article{padding:56px 0 8px;}
/* 批4：正文版心收窄 820 → 720（阅读行长 ~38 字），段落间距 24px */
.article__wrap{max-width:720px;}
.article__crumb{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:13px;color:var(--muted);margin:0 0 26px;}
.article__crumb a{color:var(--muted);transition:color .2s;}
.article__crumb a:hover{color:var(--accent);}
.article__crumb>span{color:var(--line-strong);}
.article__meta{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:0 0 18px;}
.article__date{font-size:13px;color:var(--muted);font-family:inherit;}
.article__source{font-size:13px;color:var(--muted);}
.article__title{font-size:clamp(26px,3.4vw,40px);line-height:1.3;font-weight:800;letter-spacing:-.02em;margin:0 0 30px;color:var(--ink);}
/* 产品名结尾的「（…）」括注（2026-10-31）：大标题里直接排 22 个字会压垮版面，
   所以下沉成副行；但这是「我司优势产品」的卖点，不能用灰小字压下去 ——
   做成实底靛蓝反白的标注块（宽度贴合内容），在这条标题下就是一块醒目的卖点牌。 */
.article__title-note{display:block;width:fit-content;max-width:100%;margin-top:18px;padding:7px 17px;
  font-size:16px;font-weight:600;line-height:1.5;letter-spacing:.02em;
  color:#fff;background:var(--accent);border-radius:2px;}
.article__body{border-top:1px solid var(--line);padding-top:30px;font-size:16.5px;line-height:1.9;color:var(--ink-soft);}
.article__body p{margin:0 0 24px;}
.article__body p:last-child{margin-bottom:0;}
/* 批4：小标题删左侧 3px 蓝线，改标题下方 40px×2px 品牌蓝短线 */
.article__h2{font-size:19px;font-weight:700;color:var(--ink);margin:34px 0 18px;line-height:1.5;}
.article__h2::after{content:"";display:block;width:36px;height:1px;background:var(--line-strong);margin-top:8px;}
.article__h2:first-child{margin-top:0;}
.article__h3{font-size:16px;font-weight:700;color:var(--ink);margin:24px 0 12px;line-height:1.5;}
.article__list{margin:0 0 20px;padding:0;list-style:none;}
.article__list li{position:relative;padding-left:20px;margin:0 0 10px;line-height:1.8;}
.article__list li::before{content:"";position:absolute;left:2px;top:11px;width:5px;height:5px;border-radius:50%;background:var(--line-strong);}
.article__list li:last-child{margin-bottom:0;}
.article__figure{margin:6px 0 30px;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--bg-alt);max-width:640px;}
/* 配图不放大：原图小就按原始尺寸呈现（不拉伸到 640px 致糊），原图大才受 640px 封顶；居中不靠边。
   竖长图（如材料基因选择界面 709×1469）再限高 420px：避免一张图撑满整屏、压过正文；
   若这张竖长图紧跟在一段正文之后，会被 JS 包进 .article__split 与文字并排（见下） */
.article__figure img{display:block;max-width:100%;max-height:420px;width:auto;height:auto;margin:0 auto;}
/* 单图（正文直接子级）边框紧贴图片：图片小于 640 时不再留出两侧空白灰底；宽图仍受 640 封顶 */
.article__body > .article__figure{width:fit-content;max-width:640px;}
.article__figure figcaption{padding:10px 16px;font-size:13px;color:var(--muted);border-top:1px solid var(--line);}
/* 竖长图与上文段落并排（2026-11-01，用户：图片太长的话可以把文字和图片左右排布）。
   起因：709×1469 的界面长截图被 max-height 压成 200px 宽的小条，独占一行、右侧整片空。
   规则：主文在左、图在右，图按右栏宽度等比放大（高度封顶 540px，不让一张图撑过一屏）。
   只由 JS 对「单张图 + 紧跟上文是正文段落 + 高宽比 ≥1.25」套用；横图与图组不受影响。 */
.article__split{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:36px;align-items:start;margin:6px 0 30px;}
.article__split-text > p{margin:0 0 15px;}
.article__split-text > p:last-child{margin-bottom:0;}
.article__split > .article__figure{margin:0;max-width:360px;}
.article__split > .article__figure img{width:auto;max-width:100%;max-height:480px;}
/* 图组：连续多张配图并排（手册式「几张图配合说明一件事」），各自窄列 + 保留图注。
   ① 列宽一律等分（flex:1 1 0）。原来用 flex-basis:auto，列宽会被图注字数撑得不一致
      （字多的列宽、字少的列窄），同一尺寸的几张图就被缩放成不同大小 —— 2026-10-31 系统构成
      四图实测：「一短 · 两长 · 一中」。等分后四列同宽，同比例的原图自然同高同宽。
   ② 图本身不放大（width:auto + align-self:center）：原图小于列宽就居中留白，不拉伸致糊。
   ③ 卡片不强求等高（align-items:flex-start）：等高要靠拉高图注盒子，遇到 258×50 这种
      扁图（synapse 换粉复配示意图）会在卡片里空出一大块白，比底边略参差更难看。 */
.article__figrow{display:flex;gap:18px;align-items:flex-start;margin:6px 0 30px;}
.article__figrow .article__figure{flex:1 1 0;min-width:0;margin:0;}
.article__figrow .article__figure img{max-width:100%;height:auto;margin:0 auto;}
.article__figrow .article__figure figcaption{padding:8px 12px;font-size:12px;line-height:1.5;}
/* 宽幅界面截图独占一行（2026-11-02，用户：「这张图片要放大一些，你放得太小了，里面的字都
   看不清楚」）。由 main.js liftWideFigures() 从图组里拆出：原生 ≥900 宽且宽高比 ≥1.5。
   起因：synapse「算法给出方案」1200×638 的软件全景被并排压到 281px（缩放 0.23），
   界面里的字全糊成灰块 —— 而并排只能等分列宽，图组越大缩得越狠。
   桌面出血到 1080px：正文栏只有 884，884 里仍偏糊（0.74）；1080 是 0.9、约等于原图。
   出血用 margin-left:50% + translateX(-50%) 居中；窄屏（<1100）回落 100%，不溢出视口。 */
.article__body > .article__figure--wide{max-width:100%;width:100%;}
.article__figure--wide img{width:100%;max-width:none;max-height:none;}
/* 宽图被拆走后剩下的「原生尺寸小图」：等分列宽会让两张小图各自居中、中间空一大块，
   看着像两张互不相干的小图。改成按原尺寸靠左紧排，读作「两个细节并列」。 */
.article__figrow--tight{justify-content:flex-start;}
.article__figrow--tight .article__figure{flex:0 0 auto;}
@media (min-width:1100px){
  .article__body > .article__figure--wide{
    width:min(1080px, calc(100vw - 120px));
    max-width:none;   /* 基础规则的 max-width:100% 会把它钉回文栏宽（884），出血就失效了 */
    margin-left:50%;transform:translateX(-50%);
  }
}
.article__note{margin:0 0 16px;font-size:13px;line-height:1.7;color:var(--muted);}
/* 正文表格（Markdown 表格语法）：用于横向对照表（如 APX 四个子系列参数对比） */
.article__table{margin:0 0 30px;overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:#fff;}
.article__tbl{width:100%;border-collapse:collapse;font-size:14px;line-height:1.7;}
.article__tbl thead th{background:var(--ink);color:#fff;font-weight:600;text-align:left;padding:11px 16px;font-size:13px;letter-spacing:.03em;white-space:nowrap;}
.article__tbl tbody td{padding:11px 16px;text-align:left;vertical-align:top;color:var(--ink-soft);}
.article__tbl tbody tr:nth-child(even){background:var(--bg-alt);}
.article__tbl tbody tr+tr td{border-top:1px solid var(--line);}
.article__tbl tbody td:first-child{font-weight:600;color:var(--ink);white-space:nowrap;}
.article__empty{color:var(--muted);}
/* 研发条件详情 · 图文段落（2026-09-27）：一段正文 + 一张可选配图为一个单元，
   段与段之间留白分隔；配图风格与 article__figure 一致（细边框 + 圆角）；
   图上文下 / 文上图下由渲染顺序决定（main.js facilitySectionsHtml），无需翻转样式 */
/* 图文段落（研发条件/新闻/资质详情共用）：桌面端左右并排，窄屏回落上下堆叠 */
.fsec{margin:30px 0;}
.fsec:first-child{margin-top:0;}
.fsec:last-child{margin-bottom:0;}
.fsec--imgleft{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:22px;align-items:stretch;}
.fsec--imgright{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:22px;align-items:stretch;}
.fsec--solo{display:block;}
.fsec__fig{margin:0;min-height:230px;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--bg-alt);}
.fsec__fig img{display:block;width:100%;height:100%;object-fit:cover;}
/* 单栏配图（纯图段落）等高（2026-10-31）：
   原来只有 width:100%，横图渲染 496 高、竖图 883、方图 662 —— 同一页几张实景照大小参差。
   改为「统一限高 400 + 宽度按比例自适应 + 边框贴合图」：桌面端同页各图高度一律 400
   （400 是「最宽的那张图在正文栏宽下能达到的最大高度」，因此横/方/竖图都能齐平），
   宽度各不相同但视觉面积一致；不裁切、不放大（原图小就按原尺寸）。 */
.fsec--solo .fsec__fig{display:table;max-width:100%;margin:0 auto;min-height:0;}
.fsec--solo .fsec__fig img{display:block;width:auto;max-width:100%;max-height:400px;height:auto;object-fit:contain;}
.fsec__txt > :first-child{margin-top:0;}
.fsec__txt > :last-child{margin-bottom:0;}
@media (max-width:760px){
  .fsec--imgleft,.fsec--imgright{display:block;}
  .fsec--imgleft .fsec__txt,.fsec--imgright .fsec__txt{margin-top:14px;}
  .fsec__fig{min-height:0;}
  .fsec__fig img{height:auto;object-fit:contain;}
  /* 窄屏单栏配图同样限高：手机一列排下来，竖图不限高会比横图高出一大截（2026-10-31） */
  .fsec--solo .fsec__fig img{max-height:300px;}
}
.article__foot{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center;margin-top:38px;padding-top:24px;border-top:1px solid var(--line);}
.article__back{font-size:14px;color:var(--muted);transition:color .2s;}
.article__back:hover{color:var(--accent);}
.article__ext{display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:600;color:var(--accent);}
.article__wrap--empty{padding:72px 0 8px;}

/* ---------- 产品详情 ---------- */
.article__wrap--wide{max-width:940px;}
.pdetail__lead{font-size:16.5px;line-height:1.85;color:var(--ink-soft);margin:-8px 0 34px;max-width:760px;}
.pdetail__sec{margin:0 0 36px;}
.pdetail__secTitle{font-size:16px;font-weight:800;letter-spacing:.02em;color:var(--ink);margin:0 0 16px;padding-left:12px;border-left:3px solid var(--accent);line-height:1.4;}
.pdetail__note{font-size:12.5px;color:var(--muted-2);margin:12px 0 0;line-height:1.7;}
.chips{display:flex;flex-wrap:wrap;gap:9px;}
.chip{display:inline-block;background:transparent;border:1px solid var(--line-strong);color:var(--ink-soft);font-size:13px;font-weight:600;padding:6px 14px;border-radius:3px;line-height:1.4;}
.pspec{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
.pspec__row{display:grid;grid-template-columns:158px 1fr;}
.pspec__row+.pspec__row{border-top:1px solid var(--line);}
.pspec__k{margin:0;padding:13px 16px;font-size:13.5px;font-weight:600;color:var(--ink);background:var(--bg-alt);line-height:1.6;}
.pspec__v{margin:0;padding:13px 16px;font-size:14px;color:var(--ink-soft);line-height:1.7;}

/* 产品详情主图：复用 article__figure 的容器，只加详情页自己的节奏与封顶高度 */
.pdetail__hero{margin:0 0 30px;}
.pdetail__hero img{width:100%;max-height:520px;object-fit:cover;border-radius:var(--radius-sm);background:var(--bg-alt);}

/* 参数表（表头「参数/指标」+ 分栏 + 斑马纹）：工业品手册观感，替代原 dl 键值列表。
   表格用真 <table> 语义；行间发丝线 + 表头深色锚，让「参数」读作规格表而非后台数据转储 */
.ptable{margin:0;overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:#fff;}
.ptable__t{width:100%;border-collapse:collapse;font-size:14px;}
.ptable__t thead th{background:var(--ink);color:#fff;font-weight:600;text-align:left;padding:12px 16px;font-size:13px;letter-spacing:.03em;white-space:nowrap;}
.ptable__kh{width:190px;}
.ptable__t tbody tr:nth-child(even){background:var(--bg-alt);}
.ptable__t tbody tr+tr td,.ptable__t tbody tr+tr th{border-top:1px solid var(--line);}
.ptable__t tbody th,.ptable__t tbody td{padding:12px 16px;text-align:left;vertical-align:top;line-height:1.7;}
.ptable__k{font-weight:600;color:var(--ink);white-space:nowrap;}
.ptable__v{color:var(--ink-soft);}
@media (max-width:760px){
  .ptable__t thead{display:none;}
  .ptable__t tbody tr{display:block;padding:0;border-top:1px solid var(--line);}
  .ptable__t tbody tr:first-child{border-top:none;}
  .ptable__t tbody th,.ptable__t tbody td{display:block;width:100%;padding:10px 14px;}
  .ptable__t tbody th{padding-bottom:2px;color:var(--accent);}
  .ptable__t tbody td{padding-top:0;padding-bottom:14px;}
}
.related{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;}
.related__item{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);padding:14px 18px;font-size:14.5px;font-weight:600;color:var(--ink);transition:border-color .2s, background .2s;}
.related__item:hover{border-color:var(--accent);background:var(--accent-soft);}
.related__arrow{color:var(--accent);}

/* 同类别其他产品：独立成块，与上方正文明确区隔。
   原样沿用正文的「蓝色竖线标题 + 白底」，会被误读成当前产品的内容的一部分。
   处理：浅灰底 + 细边框 + 方角 + 通栏上边线；标题弃用蓝色竖线，改灰色小字。 */
.pdetail__sec--related{margin-top:54px;padding:26px 26px 28px;background:var(--bg-alt);border:1px solid var(--line);border-top:1px solid var(--line-strong);border-radius:var(--radius);}
.pdetail__sec--related .pdetail__secTitle{border-left:none;padding-left:0;margin:0 0 18px;font-size:13.5px;font-weight:700;letter-spacing:.05em;color:var(--muted);}
.pdetail__sec--related .related__item{background:#fff;}

/* ---------- 资质荣誉 ---------- */
.honors{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:start;}
.honor{display:block;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:border-color .25s;cursor:pointer;}
/* 批4：hover 仅边框变 #d5e0f5（无投影无位移）；证书图 hover 微缩放已删 */
.honor:hover{border-color:var(--line-strong);}
.honor:focus-visible{outline:2px solid var(--accent);outline-offset:3px;}
/* 批4：证书完整展示（contain 不裁切）、纯白底、200px 高，图下一根 1px 发丝线与正文分隔 */
.honor__img{width:100%;height:200px;object-fit:contain;background:#fff;border-bottom:1px solid var(--line);}
.honor__body{padding:20px 22px;}
.honor__year{font-size:13px;color:var(--accent);font-weight:600;font-family:inherit;}
.honor__body h3{font-size:16px;font-weight:700;margin:6px 0 8px;line-height:1.45;color:var(--ink);}
.honor__body p{font-size:13px;color:var(--muted);margin:0;line-height:1.6;}
.honor__more{display:inline-flex;align-items:center;gap:6px;margin-top:12px;font-size:13px;font-weight:600;color:var(--ink-soft);transition:color .2s;}
.talents__empty{color:var(--muted);font-size:14px;padding:20px 0;}

/* ---------- 资质荣誉 · 年份墙（首页专用，2026-10-28 视觉重构） ----------
   病因：荣誉卡与上方新闻卡结构完全同构（年份 + 标题 + 机构 + 蓝链接），连字号都一样，
        读者从新闻滑到荣誉会有「怎么又放了一遍」的错觉 —— 两个版块视觉上分不开。
   改法：荣誉不再用白卡，改为无框三列 + 一根顶线 + 超大字年份。
        年份取产品区大编号的同一套处理（38px / 低对比灰蓝），整站「大数字打头」的语言就此统一；
        新闻保留白卡（它将来的配图位在卡顶），两者形态彻底分开。 */
/* 顶线挂在每一项上而不是容器上：首页 3 项并排时连成一条通栏线；
   荣誉列表页 6 项两行时，第二行自动也有自己的顶线（否则两行会糊在一起）。 */
.honors--year{gap:0;align-items:start;}
.honors--year .honor{background:none;border:0;border-radius:0;border-top:1px solid var(--line);
  padding:26px 30px 34px 0;overflow:visible;}
.honors--year .honor:focus-visible{outline:2px solid var(--accent);outline-offset:0;}
/* 2026-10-31 用户：「首页这几张证书太小了，小里小气」。
   原来 150px 高 —— 横版证书被压成 226px 宽，而卡片有 380 宽，两边空出一大截。
   改成 252px 高后横版证书受宽度限制、正好撑满卡片宽（约 350px），
   视觉尺寸约 +55%；竖版证书仍按高度贴边，不会顶破卡片。 */
.honors--year .honor__img{height:252px;object-fit:contain;background:none;border-bottom:0;margin:0 0 18px;}
.honors--year .honor__body{padding:0;}
/* 同上：年份走「仪表读数」语言，与产品编号同一套（无衬线 + 等宽数字 + 紧字距） */
.honors--year .honor__year{font-size:44px;font-weight:500;line-height:1;letter-spacing:-.02em;
  color:#C9C4B6;transition:color .3s var(--ease);margin:0 0 14px;font-variant-numeric:tabular-nums;}
.honors--year .honor:hover .honor__year{color:var(--accent);}
.honors--year .honor__body h3{font-size:16px;margin:0 0 8px;line-height:1.5;}
.honors--year .honor__body p{font-size:13px;line-height:1.6;}
.honors--year .honor__more{margin-top:10px;}
.honor:hover .honor__more{color:var(--accent);}
@media(max-width:860px){
  .honors--year{grid-template-columns:1fr;}
  .honors--year .honor{padding:20px 0 0;}
  .honors--year .honor__year{font-size:28px;margin-bottom:10px;}
}

/* ---------- 资质荣誉 · 横向自动滚动墙（2026-10-31） ----------
   证书图配上以后，平铺成 4 行会把页面拉得很长、也很吵，改成一条自动向左走的带子。
   轨道里放两组一模一样的卡片，位移 -50% 正好等于一组宽（含组尾 padding），接缝无缝。
   悬停 / 聚焦暂停：不停的话用户想点某张卡，它一直在跑。
   两侧用 mask 渐隐，避免卡片被硬生生切断。 */
.honors-strip{position:relative;overflow:hidden;padding:2px 0 4px;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 56px,#000 calc(100% - 56px),transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 56px,#000 calc(100% - 56px),transparent 100%);}
.honors-strip__track{display:flex;width:max-content;will-change:transform;
  animation:honorsScroll 68s linear infinite;}
.honors-strip:hover .honors-strip__track,
.honors-strip:focus-within .honors-strip__track{animation-play-state:paused;}
.honors-strip__group{display:flex;gap:20px;padding-right:20px;}
@keyframes honorsScroll{from{transform:translate3d(0,0,0);}to{transform:translate3d(-50%,0,0);}}
/* 卡片：定宽 + 等高（组内 stretch），图片位统一 196px，图片 contain 不裁切证书 */
.honors-strip .honor{width:300px;flex:0 0 300px;display:flex;flex-direction:column;background:#fff;}
.honors-strip .honor__img{height:196px;border-bottom:1px solid var(--line);}
/* 证书四周留一圈白边（卡纸感）：扫描件自带的红/金边框直接顶到卡片边上会显得很挤，
   且不同证书留白不一，统一内缩后视觉重量才一致。字砖不要这圈边，保持整块。 */
.honors-strip img.honor__img{padding:14px 14px 6px;}
/* 无证书的条目（成立 / 商标 / 专利）：字砖代替图片位，沿用年份墙的低对比大数字语言 */
.honors-strip .honor__img--none{display:flex;align-items:center;justify-content:center;background:var(--bg-alt);
  border-bottom:1px solid var(--line);font-size:40px;font-weight:500;letter-spacing:.04em;color:#C9C4B6;}
.honors-strip .honor__body{padding:16px 18px 18px;display:flex;flex-direction:column;flex:1;}
.honors-strip .honor__body h3{font-size:15px;line-height:1.5;margin:0 0 8px;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.honors-strip .honor__body p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.honors-strip .honor__more{margin-top:auto;padding-top:12px;}
@media(max-width:860px){
  .honors-strip{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 24px,#000 calc(100% - 24px),transparent 100%);
    mask-image:linear-gradient(90deg,transparent 0,#000 24px,#000 calc(100% - 24px),transparent 100%);}
  .honors-strip .honor{width:236px;flex-basis:236px;}
  .honors-strip .honor__img{height:156px;}
  .honors-strip img.honor__img{padding:10px 10px 4px;}
  .honors-strip .honor__img--none{font-size:30px;}
  .honors-strip .honor__body{padding:14px 16px 16px;}
  .honors-strip .honor__body h3{font-size:14px;}
}
/* 减少动态效果：不滚，退化为可手动横滑（副本隐藏，避免重复卡片） */
@media(prefers-reduced-motion:reduce){
  .honors-strip{overflow-x:auto;}
  .honors-strip__track{animation:none;}
  .honors-strip__group[aria-hidden="true"]{display:none;}
}

/* 资质产权页的两个版块标题（资质荣誉 / 知识产权）都按**页头规格**渲染
   （用户 2026-10-31：「和上面资质荣誉保持一致」；后来又定层级：栏目叫资质产权、里面装着这两块，
   所以两块标题必须是同级同规格，否则一块像页头、一块像普通版块）。
   页头 .pagehead__title 是 clamp(32,3vw,38) + 标题下一条 32px 短线 + 17px 引导语，
   而通用版块标题是 clamp(30,3.9vw,48) 且没有短线 —— 同一页上下三个标题就不成套。
   只限定 #secHonorsFull / #secIp 两块，不动其他页面的版块标题。 */
#secHonorsFull .section__head--left .section__title,
#secIp .section__head--left .section__title{
  font-size:clamp(32px,3vw,38px);line-height:1.22;margin:0 0 12px;
  text-shadow:0 0 .55px currentColor;
}
#secHonorsFull .section__head--left .section__title::after,
#secIp .section__head--left .section__title::after{
  content:"";display:block;width:32px;height:1px;background:var(--line-strong);margin-top:14px;
}
#secHonorsFull .section__head--left .section__lead,
#secIp .section__head--left .section__lead{max-width:780px;line-height:1.75;}

/* ---------- 知识产权 · 专利与商标证书轮播（2026-10-31 二次改版） ----------
   用户给的参考样式：**中间一张完整展示，两侧依次缩小、变淡、压在后面，左右各一个箭头，
   从右往左自动切换**。上一版"等宽卡片整条横滚"不是这个效果，整段换掉。
   取舍说明：
     · 只用 transform + opacity，不加 perspective —— 证书是平面文档，
       一加透视边缘就成梯形，反而显得不像原件了；
     · 位移量用 --w 的比例算（0.82 / 1.37 / 1.76 / 2.06 倍卡宽），
       换卡片尺寸时只改 --w --h 两个数，各档间距自动跟随；
     · 卡片不响应点击（没有详情页），pointer-events 关掉，避免"看着能点却点不动"。 */
/* 尺寸按参考图比例定：中心卡高约占版块 88%，两侧压叠 1/4 张卡宽 ——
   卡再小就显得像缩略图，压叠再少就变成"一排小图并排"，不是轮播。 */
.ip-cf{--w:288px;--h:392px;position:relative;height:448px;}
.ip-cf__stage{position:absolute;inset:0;}
.ip-cf__item{
  position:absolute;left:50%;top:50%;
  width:var(--w);height:var(--h);
  margin:calc(var(--h) / -2) 0 0 calc(var(--w) / -2);
  background:#fff;border:1px solid #e3e7ec;border-radius:2px;padding:4px;
  box-shadow:0 2px 8px rgba(13,36,64,.07);
  transform:translate3d(var(--x,0px),0,0) scale(var(--s,1));
  opacity:var(--o,0);z-index:var(--z,0);
  transition:transform .72s cubic-bezier(.33,.02,.2,1),
             opacity .5s ease,box-shadow .72s ease;
  will-change:transform,opacity;
  pointer-events:none;
}
/* JS 万一没跑，至少让第一张可见，不要整块空白 */
.ip-cf__item:first-child{--o:1;--z:50;}
.ip-cf__item img{display:block;width:100%;height:100%;object-fit:contain;}
/* 偏移档：0 正中 / ±1 左右邻位 / ±2 更远 / ±3 将散 / ±4 已散尽（透明且移到更外侧） */
.ip-cf__item[data-d="0"]{--x:0px;--s:1;--o:1;--z:50;box-shadow:0 26px 58px rgba(13,36,64,.22);}
.ip-cf__item[data-d="1"]{--x:calc(var(--w) * .76);--s:.795;--o:.94;--z:40;box-shadow:0 14px 32px rgba(13,36,64,.12);}
.ip-cf__item[data-d="-1"]{--x:calc(var(--w) * -.76);--s:.795;--o:.94;--z:40;box-shadow:0 14px 32px rgba(13,36,64,.12);}
.ip-cf__item[data-d="2"]{--x:calc(var(--w) * 1.30);--s:.635;--o:.66;--z:30;box-shadow:0 8px 18px rgba(13,36,64,.09);}
.ip-cf__item[data-d="-2"]{--x:calc(var(--w) * -1.30);--s:.635;--o:.66;--z:30;box-shadow:0 8px 18px rgba(13,36,64,.09);}
.ip-cf__item[data-d="3"]{--x:calc(var(--w) * 1.62);--s:.52;--o:0;--z:20;}
.ip-cf__item[data-d="-3"]{--x:calc(var(--w) * -1.62);--s:.52;--o:0;--z:20;}
.ip-cf__item[data-d="4"]{--x:calc(var(--w) * 2.02);--s:.5;--o:0;--z:10;}
.ip-cf__item[data-d="-4"]{--x:calc(var(--w) * -2.02);--s:.5;--o:0;--z:10;}

/* 左右箭头：无底、细线条，hover 才变深 —— 这一块的主角是证书，不是按钮 */
.ip-cf__nav{
  position:absolute;top:50%;transform:translateY(-50%);
  width:46px;height:46px;padding:0;border:0;background:none;
  display:inline-flex;align-items:center;justify-content:center;
  color:#6d7885;cursor:pointer;z-index:60;
  transition:color .2s ease,transform .2s ease;
}
.ip-cf__nav:hover{color:var(--navy);}
.ip-cf__nav:active{transform:translateY(-50%) scale(.92);}
.ip-cf__nav:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:50%;}
/* 箭头贴容器左右边：可见卡片群（d=±2）从约 ±273px 开始，留 30px 空隙正好，
   再往里就压在证书上了。 */
.ip-cf__nav--prev{left:0;}
.ip-cf__nav--next{right:0;}

/* 窄屏：卡片与位移一起缩，位移是按 --w 算的，所以只改这两个数就整排缩小 */
@media(max-width:1000px){
  .ip-cf{--w:232px;--h:316px;height:366px;}
  .ip-cf__nav{width:38px;}
  .ip-cf__nav--prev{left:0;}
  .ip-cf__nav--next{right:0;}
}
/* 手机：屏宽只剩 390，两侧卡本来就露出很窄一条，箭头再压上去就没法看了 ——
   改为**放到卡片下方居中成一对**，卡片区收进 44px 给按钮让位。 */
@media(max-width:700px){
  .ip-cf{--w:172px;--h:234px;height:322px;}
  .ip-cf__stage{inset:0 0 46px 0;}
  .ip-cf__item{padding:3px;}
  .ip-cf__nav{top:auto;bottom:0;transform:none;width:46px;height:46px;color:#5f6a76;}
  .ip-cf__nav:active{transform:scale(.92);}
  .ip-cf__nav--prev{left:calc(50% - 62px);}
  .ip-cf__nav--next{right:calc(50% - 62px);}
  .ip-cf__nav svg{width:24px;height:24px;}
}
/* 减少动态效果：不再自动播放（JS 里也停了定时器），只静静摆在那儿 */
@media(prefers-reduced-motion:reduce){
  .ip-cf__item{transition:none;}
}

/* ---------- 商务合作 ---------- */
.contact{max-width:780px;margin:0 auto;}
/* 批4：卡片去阴影，只留 1px 发丝边框 */
.contact__card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:40px 42px;}
.contact__card h3{margin:0 0 8px;font-size:24px;font-weight:800;color:var(--ink);}
.contact__card p{color:var(--muted);margin:0 0 22px;font-size:15px;line-height:1.7;}
/* 批4：联系信息 = 线性图标（16px 品牌蓝）+ 文字，删底部分隔线，20px 间距分组 */
.contact__items{list-style:none;padding:0;margin:0 0 22px;display:flex;flex-direction:column;gap:20px;}
.contact__items li{display:flex;align-items:center;gap:10px;font-size:15px;color:var(--ink-soft);}
.contact__items li strong{display:inline-block;min-width:72px;color:var(--ink);font-weight:600;}
.contact__ico{display:inline-flex;flex:0 0 16px;color:var(--accent);}
.contact__ico svg{display:block;}
.contact__items a{color:var(--accent);font-weight:600;border-bottom:1px solid transparent;transition:color .2s, border-color .2s;}
.contact__items a:hover{color:var(--accent-deep);border-bottom-color:currentColor;}
.contact-link{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;text-decoration-color:rgba(154,160,176,.45);}
.contact-link:hover{text-decoration-color:#fff;}
.contact__tags{display:flex;flex-wrap:wrap;gap:8px;}
.contact__tag{background:transparent;border:1px solid var(--line-strong);font-size:13px;color:var(--muted);padding:5px 12px;border-radius:3px;}

/* ---------- 页脚 ---------- */
/* 批4：页脚底色再深一档 #0f1825，与 CTA 带（#16202E）形成层次 */
/* 2026-10-28：页脚底色原为冷蓝黑 #0f1825（Web UI 标配），改中性墨 #131518 ——
   黑比蓝更"物质"，也和 CTA 深条的 --ink 接得上，收尾不再发青。 */
.footer{background:#131518;color:#B9B7B2;padding:64px 0 0;}
/* 2026-10-29 用户指令：页脚两列太单调 → 品牌列 + 四列（产品 / 应用场景 / 关于我们 / 联系我们）。
   按 1145px 容器算：4×32px 间隙后，品牌列约 258px（够放两枚 96px 二维码），
   三个链接列各约 184px，联系列 206px（地址要折行，多给一点）。
   2026-10-29 晚（用户指令「新闻与荣誉单拎出来一个分组」）：增至六列（品牌 + 五列链接）。
   1145px 减 5×28px 间隙 = 1005px 可分配；品牌列必须 ≥208px（两枚 96px 二维码 + 16px 间距），
   更重要的是公司名「武汉心电科技有限公司」10 字 × 18px ≈ 180px，加 logo 与间隙约 220px ——
   给 1.6fr 得约 239px 才能让公司名一行排完（首版给 1.45fr 只有 224px，公司名被断成
   「…有限公 / 司」，把「公司」这个词劈开了）。联系列 1.12fr ≈ 167px，让邮箱一行放得下。
   四个链接列各约 150px —— 中文最长标签「基础材料 · 吸收剂」实测约 119px，放得下；
   英文会折两行（五列时就已经如此）。间隙从 32px 收到 28px，把省下的 20px 分给这多出来的一列。 */
.footer__grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1fr 1.12fr;gap:28px;padding-bottom:48px;}
/* 2026-10-29 晚：页脚扩到六列后品牌列只剩 233px，公司名「武汉心电科技有限公司」按 18px
   （约 200px）加 logo 与间隙放不进一行，被断成「…有限公 / 司」，正好把「公司」劈开。
   此处不改列宽 —— 六个列宽已经吃满 1145px 容器，再宽会把联系列的邮箱挤到折行；
   改而是让页脚 logo 比导航小一号（18→16px）：页脚是收尾区，字号低一级是常规做法，
   字重 700 + 图形标记仍能立住视觉锚点。可容纳宽度 233-40-10≈183px > 160px，一行排完。 */
.footer__logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:16px;color:#fff;}
/* 批4：Logo 白底垫删除，透明底直接展示 */
.footer__logo img{height:28px;width:auto;max-width:130px;background:transparent;padding:0;border-radius:0;}
/* 2026-10-29 晚：品牌列收窄到 233px 后，18 字的口号（约 252px）必然折行，
   而浏览器默认折法会把「提供商」的「商」单甩到第二行（孤字，很难看）。
   text-wrap:balance 让两行长度自动均分（9+9），不再出现孤字；老浏览器忽略此属性，
   退化为原来的自然折法，不会出错。 */
.footer__slogan{color:#8A8884;font-size:14px;margin:16px 0 0;max-width:320px;line-height:1.7;letter-spacing:.01em;text-wrap:balance;}
/* 用户指令（2026-10-19）：品牌列下方加二维码 + 图标化联系方式（原「联系我们」列已并入此处）。
   二维码按数据渲染（后台传图才显示）；白底衬纸保证扫码对比度。 */
.footer__qrs{display:flex;gap:16px;margin:20px 0 0;}
.footer__qr{margin:0;text-align:center;}
.footer__qr img{display:block;width:96px;height:96px;object-fit:contain;background:#fff;border:1px solid rgba(255,255,255,.12);border-radius:4px;padding:4px;}
.footer__qr figcaption{font-size:12px;color:#8A8884;margin-top:6px;letter-spacing:.08em;}
.footer__contact{list-style:none;padding:0;margin:20px 0 0;}
.footer__contact li{display:flex;align-items:center;gap:9px;color:#8A8884;font-size:14px;margin-bottom:10px;}
.footer__contact li .contact__ico{color:#6E6C68;}
.footer__contact li a,.footer__contact li span{color:#B9B7B2;transition:color .2s;}
.footer__contact li a:hover{color:#fff;}
/* 2026-10-29 用户指令（页脚栏目标题「字体不合适、字号有点小」）：
   旧版 12px + .16em 字距，是「eyebrow 小标签」语言 —— 汉字被拆成一粒粒，既读不出层级，
   又因为是字重 600 的中性灰白显得发虚。栏目标题本质是目录头，要立得住：
   16px / 700 / 正常字距，比链接（14px）大两号，靠字重 + 字号双重拉开层级，不加装饰线。 */
.footer__col h4{color:#fff;font-size:16px;font-weight:700;margin:0 0 18px;letter-spacing:.01em;line-height:1.4;}
/* 西文标题同样不拉长（旧 .1em 是配 12px 小标签的，16px 下会散架） */
html[lang^="en"] .footer__col h4{letter-spacing:.01em;}
.footer__col ul{list-style:none;padding:0;margin:0;}
.footer__col li{margin-bottom:11px;}
.footer__col a,.footer__col li{color:#8A8884;font-size:14px;transition:color .2s;}
/* 联系列独立成列（2026-10-29）：h4 已给 18px 下间距，列表不再自带 20px 上边距；
   地址会折行，图标改顶对齐 —— 否则图标会跟最后一行文字垂直居中、看着错位。 */
.footer__col--contact .footer__contact{margin:0;}
.footer__col--contact .footer__contact li{align-items:flex-start;}
.footer__col--contact .footer__contact li .contact__ico{margin-top:3px;flex:0 0 auto;}
/* 合作入口：与其它页脚链接同一套悬停下划线；箭头不做位移 ——
   批4 已把全站「箭头滑移」清理干净（_verify 有禁令断言），这里不再重新引入。
   用 inline 而不是 inline-flex：英文名较长会折行，flex 会把箭头甩到行尾右侧，
   变成「文字在左、箭头孤零零在右」；inline 让箭头跟着最后一个字走。 */
.footer__col .footer__coop{display:inline-block;margin-top:16px;color:#B9B7B2;font-size:14px;line-height:1.7;}
/* 不画下划线：它是行动入口，不是列表项；且 ::after 的 100% 会按盒子宽度横到整列 */
.footer__col .footer__coop::after{display:none;}
.footer__col .footer__coop>span{margin-left:5px;}
.footer__col .footer__coop:hover{color:#fff;}
.footer__col a:hover{color:#fff;}
.footer__bar{display:flex;justify-content:space-between;align-items:center;border-top:1px solid rgba(255,255,255,.08);padding:22px 0;color:#6E6C68;font-size:12.5px;letter-spacing:.02em;}
/* 「返回顶部」是 fixed 在右下 26px、42px 见方的按钮。容器最大宽 1200 + 内距 28，
   于是视口窄于约 1290px 时，容器右缘就落进按钮的站位里，底栏右侧那句口号被压掉 40px 左右。
   解法是**只让口号让位**（给它留出按钮宽度），不能改底栏的 padding-right ——
   那样会把左侧「版权/ICP/公安号」那一行的可用宽度一起压掉，861–980px 会被挤成两行且竖线孤挂行首。
   窄屏已切竖排、口号居中，实测不被压，故只取横排这一档。 */
/* 横排这一档：右侧口号可被压缩换行（它是一句话，折行无妨），给「返回顶部」按钮也留出站位。 */
@media (min-width:761px) and (max-width:1300px){
  .footer__bar>span:last-child{flex:1 1 auto;min-width:0;text-align:right;margin-right:78px;}
}
/* 版权 + 两个备案号同组：竖直居中对齐。
   flex:0 0 auto + nowrap = **这一块永不被压缩、永不折行**：一旦折行，挂在后一项 ::before 上的竖线
   就会孤零零吊在新行行首（实测 390/761/1101 都出现过）。空间不够时让右侧那句口号让位换行，
   口号的空格子本来就无所谓，备案号折行才是真难看。 */
.footer__legal{display:flex;align-items:center;flex:0 0 auto;flex-wrap:nowrap;}
.footer__legal>*{white-space:nowrap;}
/* 分隔符做成伪元素而不是写在文案里：换行时它跟着后一项走，不会孤零零挂在行尾 */
.footer__legal>*+*::before{content:'｜';margin:0 9px;color:rgba(255,255,255,.14);}
/* ICP 备案号（合规悬挂）：链接工信部备案网，hover 提亮 */
.footer__icp{color:#6E6C68;transition:color .2s;}
.footer__icp:hover{color:#B9B7B2;}
/* 公安联网备案（合规悬挂）：官方要求图标在前、编号在右。
   盾牌源图只有 20×20，按 14px 显示（与 12.5px 文字等高对齐），不做插值放大发虚。 */
.footer__gongan{display:inline-flex;align-items:center;color:#6E6C68;transition:color .2s;}
.footer__gongan img{display:block;flex:0 0 auto;width:14px;height:14px;margin-right:5px;}
.footer__gongan:hover{color:#B9B7B2;}

/* ---------- 提交合作资料 ---------- */
.inquiry{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:36px 38px;box-shadow:var(--shadow);margin-top:22px;}
.inquiry__title{margin:0 0 6px;font-size:22px;font-weight:800;color:var(--ink);}
.inquiry__hint{color:var(--muted);font-size:14px;margin:0 0 20px;line-height:1.6;}
.inquiry__row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px;}
.inquiry input,.inquiry textarea{width:100%;padding:12px 14px;border:1px solid var(--line-strong);border-radius:var(--radius-sm);font:inherit;color:var(--ink);background:#fff;transition:border-color .2s;}
/* 整行铺满的单行字段（不在 .inquiry__row 里的）也要有段间距：
   后台可以随意增删字段，新增的整行文本若不带下边距会上下贴在一起。
   只命中 .inquiry 的直接子 input，行内并排的两列不受影响。 */
.inquiry > input{margin-bottom:14px;}
.inquiry input:focus,.inquiry textarea:focus{outline:none;border-color:var(--accent);}
.inquiry textarea{margin-bottom:14px;resize:vertical;}
.inquiry__file{margin-bottom:18px;}
.inquiry__file input[type=file]{font-size:13px;color:var(--muted);}
.inquiry__fileinfo{display:inline-block;margin-left:10px;font-size:12px;color:var(--muted);}
.inquiry__actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap;}
.inquiry__status{font-size:14px;color:var(--muted);}
.inquiry__status:empty{display:none;}

/* ---------- 滚动入场动画 ---------- */
.reveal{opacity:0;transition:opacity .3s ease;}
.reveal.is-visible{opacity:1;}
/* 时间轴：统一最简淡入，不再错峰 */

/* ---------- 响应式 ---------- */
@media (max-width:980px){
  .news,.honors{grid-template-columns:repeat(2,1fr);}
}
/* 2026-10-29：页脚由两列扩到五列后，901–1180 这段宽度五列会被挤成一条窄缝
   （每列不到 150px，长栏目名会折字）。改为「品牌列独占一行 + 下方四列并排」——
   四列等分能吃到 200px 以上，比三列布局好：三列会把「联系我们」单独甩到第三行、右侧全空。
   2026-10-29 晚：增至六列后这里同步改五列 —— 901px 时每列约 146px，中文标签仍放得下；
   若退到三列，五列会排成 3+2，第二行右侧空一格，比一行五列更难看。 */
@media (max-width:1180px){
  .footer__grid{grid-template-columns:repeat(5,1fr);gap:36px 24px;}
  .footer__brand{grid-column:1/-1;}
}
@media (max-width:900px){
  .nav__logo img{height:26px;}
  .about{grid-template-columns:1fr;gap:36px;}
  .prod__grid,.apps{grid-template-columns:1fr;}
  /* 软件图文卡窄屏竖排：图在上、文在下，图宽收满（16:9 由 aspect-ratio 定高） */
  .prod--soft{flex-direction:column;align-items:stretch;gap:18px;}
  .prod--soft .prod__thumb{flex:none;width:100%;aspect-ratio:16/9;}
  .prod--soft .prod__thumb img{height:100%;}
  .related{grid-template-columns:1fr;}
  .pspec__row{grid-template-columns:1fr;}
  .pspec__k{padding:13px 16px 2px;}
  .footer__grid{grid-template-columns:1fr 1fr;gap:32px;}
  /* 六列（品牌 + 五列链接）在窄屏两列排布时会变成 2+2+1，最后一行只剩联系列、右侧空一格。
     让联系列横跨整行收尾：既填满那格，地址也能一行排开、不再折成三行。 */
  .footer__col--contact{grid-column:1/-1;}
  /* hero 双栏折叠为单栏；底层形象图靠下取景
     2026-10-28：窄屏原来给 .40（当年桌面是 .58，所以"低于桌面"成立）；桌面已降到 .34 后
     窄屏反而更高，树叶/楼顶硬边在手机上比桌面更清楚。改为 .24 并换纵向主导的白纱——
     窄屏没有"右幅"可放照片，索性让影像只做纸面底纹，不承担任何细节。 */
  .hero__inner{grid-template-columns:1fr;gap:36px;}
  .hero__bg{background-position:center bottom;}
  /* 2026-10-28 夜：跟桌面同步放开（.10 → .40）。手机是全宽铺图，照片要能看出是公司的楼；
     窄屏比桌面略收（.55 → .40），因为手机上照片铺满整屏，同样透明度下面积压迫感更强。 */
  .hero__bg.is-on{opacity:.40;}
  .hero__bg::after{background:
    linear-gradient(180deg, rgba(251,250,247,.46) 0%, rgba(251,250,247,.60) 46%, rgba(251,250,247,.86) 76%, rgba(251,250,247,1) 100%),
    linear-gradient(90deg, rgba(251,250,247,.84) 0%, rgba(251,250,247,.50) 68%, rgba(251,250,247,.62) 100%);}
  /* 2026-10-29：窄屏那条 .hero::after（同心弧 + 冷白压色）随桌面一起撤掉，手机不再有条纹。 */
}
/* 1100px 以下底栏仍是横排，但左侧「版权 + ICP + 公安号」一行已排不下（实测折成两行，
   且折行后竖线会孤挂新行行首）→ 这一档起就竖排并收掉竖线；
   1101px 以上单行绰绰有余（内容 569+217=786，可用 1045），留 250px 余量不卡在临界点上。 */
@media (max-width:1100px){
  .footer__legal{flex-direction:column;align-items:flex-start;row-gap:4px;}
  .footer__legal>*+*::before{display:none;}
}
@media (max-width:760px){
  /* 轮81：padding-top 同样要补上 --nav-h（负 margin-top 由桌面规则继承，这里只改内距）。
     96px→88px 的原值保留，只是叠加上导航高度。 */
  .hero{padding:calc(88px + var(--nav-h,71px)) 0 144px;}
  .article{padding:36px 0 4px;}
  .article__body{font-size:16px;line-height:1.85;}
  .article__figrow{flex-direction:column;}
  /* 竖排时 flex-basis:0 会把卡片高度压成 0（列方向 basis 即高度），必须改回按内容 */
  .article__figrow .article__figure{flex:0 0 auto;width:100%;}
  .article__figure{max-width:100%;}
  /* 竖长图并排只在桌面生效：手机上两栏会把正文挤成窄条，回退成上下排 */
  .article__split{display:block;}
  .article__split > .article__figure{margin:16px auto 0;max-width:100%;}
  .article__split > .article__figure img{width:auto;max-width:100%;max-height:420px;}
  .section{padding:68px 0;}
  .news,.honors,.about__cards{grid-template-columns:1fr;}
  /* 2026-10-29：页脚扩到六列后，窄屏若继续单列堆叠会拉到 1300px 以上（比改版前长近一倍）。
     链接列改两列并排、品牌列仍独占整行 —— 高度砍半，且「产品与方案 / 应用场景」
     「关于我们 / 联系我们」两两成组，扫读顺序不乱。 */
  .footer__grid{grid-template-columns:1fr 1fr;gap:28px 24px;}
  .footer__brand{grid-column:1/-1;}
  .footer__bar{flex-direction:column;gap:10px;text-align:center;}
  /* 窄屏底栏竖排：版权与两个备案号各自成行居中，并**去掉竖线分隔**。
     原因：竖线是挂在后一项的 ::before 上的，一旦折行就会孤零零吊在新行行首（390px 实测如此）；
     几行居中堆叠反而更像正式的合规块，且 360px 也不会溢出。 */
  .footer__legal{flex-direction:column;align-items:center;row-gap:5px;}
  .footer__legal>*+*::before{display:none;}
  .inquiry__row{grid-template-columns:1fr;}
}

/* ===================== 多页面导航 / 内页组件 ===================== */

/* ---------- 导航右侧 + 移动端菜单 ---------- */
.nav__right{display:flex;align-items:center;gap:10px;flex:0 0 auto;}
.nav__links a.is-active{color:var(--accent);font-weight:600;}
.nav__burger{display:none;width:42px;height:42px;border:1px solid var(--line);border-radius:var(--radius-sm);background:#fff;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px;padding:0;}
.nav__burger span{display:block;width:18px;height:2px;background:var(--ink);border-radius:2px;transition:transform .2s,opacity .2s;}
.nav--open .nav__burger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav--open .nav__burger span:nth-child(2){opacity:0;}
.nav--open .nav__burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* ---------- 语言切换：四种语言一字排开、并列直接展示（不用下拉、不折进抽屉） ----------
   宽度账（实测）：Logo 158 + 8 个栏目 ~530 + 商务合作 96 + 四种语言并列 ~180 ≈ 1111px，
   导航容器可用宽上限 1144px（.container max-width 1200 − 28×2 内边距）→ 刚好放得下，
   故把导航栏目内边距收到 10px、语言按钮压到 11.5px 字号（对比下拉方案省下整体高度与一次点击）。
   视口不足 1280px 时只把「栏目」收进汉堡，**语言切换始终留在顶栏、始终并列可见**；
   极窄屏（≤520px）语言行独占第二行并四等分铺满，绝不隐藏、绝不折叠。 */
/* 2026-10-29：导航在页面顶部改为零底色后，切换器原本的 #fff 实底会变成「浮在照片上的两块白砖」，
   与「照片直接顶到页边」的意图打架 —— 改成半透纸白，落在照片上只是淡淡一层，滚动态叠在玻璃上也自然。 */
.lang{display:flex;align-items:center;flex:0 0 auto;border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden;background:rgba(251,250,247,.6);}
.lang__item{appearance:none;font:inherit;font-size:11px;line-height:1;color:var(--muted);background:transparent;border:0;border-left:1px solid var(--line);padding:6px 6px;cursor:pointer;white-space:nowrap;transition:color .2s,background .2s;}
.lang__item:first-child{border-left:0;}
.lang__item:hover{color:var(--accent);background:var(--bg-alt);}
.lang__item:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;}
.lang__item.is-active{color:var(--accent-deep);background:var(--accent-soft);font-weight:700;}

/* 移动端菜单断点：对齐「桌面版网站」模式（约 980px 布局宽）。
   实测（无头 iframe 探针）：8 个栏目 + Logo + 商务合作按钮 + 四种语言并列，
   一行排开最宽的语言（英文）需要约 1111px 可用宽度，而导航容器可用宽上限为 1144px；
   可用宽 = 视口 − 56px 内边距，即视口需 ≥ 1167px；断点取 1280px 留出稳定余量
   （英文语言包文案最长，且为客户常用演示分辨率）。 */
@media (max-width:1280px){
  .nav__links{display:none;}
  .nav__burger{display:flex;}
  /* top:100% 让抽屉始终紧贴顶栏下沿 —— 顶栏在窄屏会变高，写死 70px 会错位 */
  .nav--open .nav__links{display:flex;flex-direction:column;position:absolute;left:0;right:0;top:100%;z-index:60;background:#fff;border-bottom:1px solid var(--line);padding:10px 20px 16px;gap:2px;box-shadow:0 12px 24px rgba(16,32,46,.08);}
  .nav--open .nav__links a{padding:13px 12px;font-size:16px;}
}

/* 极窄屏（手机）：语言切换独占第二行、四等分铺满整行。
   一行放不下的阈值为视口 ≈456px（Logo 158 + 语言 180 + 汉堡 42 + 间距），
   这里取 520px 提前换行留余量；换行后顶栏变高，抽屉靠 top:100% 自动贴合。 */
@media (max-width:520px){
  .nav__inner{height:auto;flex-wrap:wrap;row-gap:9px;padding-top:9px;padding-bottom:9px;}
  .nav__logo{order:1;}
  .nav__right{order:2;}
  .lang{order:3;flex:1 0 100%;}
  .lang__item{flex:1 1 0;text-align:center;padding:9px 4px;font-size:12px;}
  /* hero 主标题锁单行：12 字 × 24px ≈ 288px，360 屏可用 304px 放得下；
     320 屏 6.4vw 再收敛（≈20.5px×12≈246px < 264px） */
  .hero__title{font-size:min(24px,6.4vw);white-space:nowrap;}
  /* 英文标题不能跟着锁单行（2026-11-01 发现并修）：46 个字符 × 24px 要 800px+，
     390 屏实际可用只有 334px，溢出 480px 后被容器裁掉 —— 手机英文版首屏只能看到
     "Your Dedicated Electron"，后面全看不见（document.scrollWidth 仍是 390，
     所以页面不横向滚动、也不会触发任何滚动条告警，纯靠肉眼才发现）。
     中文靠"字少"能单行，英文必须允许换行。 */
  html[lang^="en"] .hero__title{font-size:min(24px,6.4vw);white-space:normal;line-height:1.2;}
  /* 标语随标题一起收：标题 24px 时 22px 的题记几乎等大，层级会塌 → 收到 18px。
     18px×13 字 ≈ 240px，390 屏（文栏 334px）单行放得下，不折行。 */
  .hero__slogan{font-size:18px;margin-bottom:20px;}
  /* 窄屏改 pretty：balance 在 334px 里只顾「行宽拉平」，会把中文词拆开
     （「吸收剂产/品和涂料」）、英文末行甩成孤词（「systems.」）。
     pretty 专门消末行孤字，实测中文「涂料」整词落行首、英文末行回到「test systems.」。 */
  .hero__sub{text-wrap:pretty;}
}

/* ---------- 内页页头（面包屑 + 标题） ---------- */
/* ⚠️ 不加 overflow:hidden：会裁掉分类导航的下拉面板（面板要从页头底部伸出）；
   批4 起页头网格纹理已整体删除，纯白底不需要任何纹理兜底 */
/* 批4：页头纯白纸面（网格纹理与径向渐变已删），标题收窄 32-36px 并加 36px×2px 品牌蓝短线 */
.pagehead{position:relative;padding:66px 0 54px;border-bottom:1px solid var(--line);background:var(--bg);}
.pagehead__crumb{position:relative;display:flex;align-items:center;gap:9px;font-size:13px;color:var(--muted);margin-bottom:14px;}
.pagehead__crumb a{color:var(--muted);}
.pagehead__crumb a:hover{color:var(--accent);}
.pagehead__crumb span{color:var(--line-strong);}
.pagehead__title{font-family:var(--serif);position:relative;font-size:clamp(32px,3vw,38px);font-weight:700;letter-spacing:0;line-height:1.22;margin:0 0 12px;color:var(--ink);text-shadow:0 0 .55px currentColor;}
/* 标题下 36px 长 2px 品牌蓝短线（与 hero__rule 同一标注语言） */
.pagehead__title::after{content:"";display:block;width:32px;height:1px;background:var(--line-strong);margin-top:14px;}
.pagehead__lead{position:relative;color:var(--muted);font-size:17px;max-width:780px;margin:0;line-height:1.75;}

/* ---------- 页头分类导航（点击平滑滑到对应版块） ----------
   批4：删顶部 3px 蓝线与阴影，改 1px 发丝边框；编号块从 27px 蓝底圆角块改为
   16px 品牌蓝文字（与产品族序号同一语言）。吸顶 is-stuck 保留阴影 —— 浮层需要与内容分层。
   用户指令（2026-10-19）：纯白底与页面糊在一起看混 → 改淡蓝底 --bg-tint 独立成条，
   数量徽章改白底小片（淡蓝底上更清晰），常态/吸顶观感一致。 */
.jumpnav{position:relative;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;margin-top:14px;background:var(--bg-alt);border:1px solid var(--line);border-radius:var(--radius);}
/* 列数不写死：随子项数自动生成、每列均分（产品页 4 项 / 关于页 3 项都铺满，后续加区块自动适应） */
/* ⚠️ overflow 不能是 hidden：下拉面板要从分类项底部伸出容器外，圆角改由首尾分类项自己承担 */
.jumpnav__item{position:relative;display:block;border-right:1px solid var(--line);transition:background .2s;}
.jumpnav__item:last-child{border-right:none;}
/* 条目内部收窄 + 分类名锁单行（轮31）：四条均分下「基础材料 · 吸收剂」类长名不再折行变高，
   吸顶态与常态观感一致 */
.jumpnav__main{display:flex;align-items:center;gap:9px;padding:16px 14px;text-decoration:none;}
/* 编号（2026-10-31 二改去 AI 味）：上一版改成等宽字体（--mono）以为更「精密」，
   实际等宽数字 + 字距在中文正文里最出戏 —— 像仪表盘 / 代码注释读出来的序号，
   正是模板站的 AI 味来源。现在回归正文字体（黑体），只靠字号字重与纸灰压住存在感：
   13px / 500 / 无字距，tabular-nums 仅为防止前后两态数字宽度跳动（肉眼不可见）。 */
.jumpnav__no{display:inline-block;font-family:inherit;font-size:13px;font-weight:500;line-height:1;color:#B7B1A6;letter-spacing:0;font-variant-numeric:tabular-nums;transition:color .2s;}
/* 分类名（2026-10-31）：与编号同降一档字重（700→600），让「编号 + 名」不再双双抢粗 */
.jumpnav__label{font-size:15px;font-weight:600;color:var(--ink);transition:color .2s;white-space:nowrap;}
/* 计数（2026-10-31 去 AI 味）：原来「白底胶囊 + 品牌深蓝 700」是最模板的计数徽章写法；
   改淡灰无边框小字，数量退成一句安静的补充信息，不装箱、不加粗。
   同上：数字走正文字体，不用等宽，字距归零。 */
.jumpnav__count{margin-left:auto;font-size:12px;font-weight:400;color:var(--muted-2);background:none;padding:0;border-radius:0;font-family:inherit;letter-spacing:0;white-space:nowrap;}
/* 窄视口：四条均分装不下「编号+名+徽章」→ 收起数量徽章、分类名微缩，保单行（轮31）。
   断点并入全站 1280（导航收栏目同款）：本块必须放在 jumpnav 基础规则之后，
   同特异性下靠源顺序覆盖基础 font-size。 */
@media (max-width:1280px){
  .jumpnav__count{display:none;}
  .jumpnav__label{font-size:15px;}
}
/* 悬停/键盘聚焦分类项 → 下方浮出该分类的产品清单；点击直达产品详情页 */
.jumpnav__drop{position:absolute;top:100%;left:0;min-width:100%;padding:8px 0;background:#fff;border:1px solid var(--line-strong);border-top:2px solid var(--accent);box-shadow:var(--shadow-lift);z-index:50;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .16s var(--ease),transform .16s var(--ease),visibility 0s linear .16s;}
.jumpnav__item:hover .jumpnav__drop,.jumpnav__item:focus-within .jumpnav__drop{opacity:1;visibility:visible;transform:translateY(0);transition:opacity .16s var(--ease),transform .16s var(--ease);}
.jumpnav__drop a{display:block;padding:9px 18px;font-size:14px;line-height:1.5;color:var(--ink);text-decoration:none;white-space:nowrap;transition:background .15s,color .15s;}
.jumpnav__drop a:hover{background:var(--accent-soft);color:var(--accent-deep);}
.jumpnav__item:hover,.jumpnav__item:focus-within{background:#ffffff;}
.jumpnav__item:hover .jumpnav__label,.jumpnav__item:focus-within .jumpnav__label{color:var(--accent-deep);}
/* 轮61：编号块悬停加深，与 is-active 态行为统一（背景已有 .2s 过渡） */
.jumpnav__item:hover .jumpnav__no,.jumpnav__item:focus-within .jumpnav__no{color:var(--accent-deep);}
/* 当前分类高亮（产品详情页第二十四轮）：「您在这里」的常驻浅蓝底，与 hover 同色系但更持久 */
.jumpnav__item.is-active{background:#ffffff;}
.jumpnav__item.is-active .jumpnav__label{color:var(--accent-deep);}
.jumpnav__item.is-active .jumpnav__no{color:var(--accent-deep);}
/* 详情页语境：夹在面包屑与产品标题之间，上下留出呼吸感 */
.jumpnav--detail{margin-top:20px;}
/* 详情页分类导航（含吸顶态）与正文首行（型号徽章/所属类别）拉开间距（轮46）：
   间距挂在通栏容器上而非 jumpnav——吸顶 spacer 机制只等高克隆 jumpnav 本体，margin 放容器上不参与，
   吸顶/未吸顶两种状态下间距恒定不跳动 */
.pdetail__headrow{margin-bottom:34px;}
.jumpnav__main:focus-visible{outline:2px solid var(--accent);outline-offset:-3px;}
/* 大屏下面板会伸出容器：容器圆角改由首尾分类项自己承担（overflow 已放开） */
@media (min-width:981px){
  .jumpnav__item:first-child{border-radius:calc(var(--radius) - 1px) 0 0 calc(var(--radius) - 1px);}
  .jumpnav__item:last-child{border-radius:0 calc(var(--radius) - 1px) calc(var(--radius) - 1px) 0;}
}
@media (prefers-reduced-motion: reduce){
  .jumpnav__drop{transition:none;transform:none;}
}
/* 吸顶态：页头滚出视口后钉在顶栏下方；宽度与常态精确一致——
   常态 jumpnav 在 container 内宽 = min(视口,1200) - 56，吸顶用同口径（轮31：原 min(视口-56,1200) 比常态宽 56px）；
   由 main.js 的 initJumpnavStick 挂/摘 is-stuck（原位有等高占位防塌陷）。 */
.jumpnav.is-stuck{position:fixed;top:calc(var(--nav-h, 71px) + 6px);left:50%;transform:translateX(-50%);width:min(100% - 56px, calc(var(--maxw) - 56px));margin-top:0;z-index:40;box-shadow:var(--shadow-lift);}
/* 窄屏导航条会变两列/单列（高度过大），吸顶反而挡内容 → 关闭 */
@media (max-width:980px){
  .jumpnav.is-stuck{position:static;transform:none;width:auto;}
}

/* ---------- 版块底部「了解更多」 ----------
   批4 交互规范：文字链接 hover 统一 = 下划线从左到右展开（0.2s），替代箭头滑移 */
.sec-actions{margin-top:32px;text-align:center;}
.more{display:inline-flex;align-items:center;gap:7px;color:var(--accent);font-weight:600;font-size:15px;position:relative;padding-bottom:3px;transition:color .2s;}
.more::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:0;background:currentColor;transition:width .2s;}
.more:hover::after{width:100%;}
/* 批4 交互规范：站内文字链接 hover 统一 = 下划线从左到右展开（0.2s，currentColor），
   替代箭头滑移/变色以外的花式动效 */
.footer__col a,.article__crumb a,.contact__items a{position:relative;transition:color .2s;}
.footer__col a::after,.article__crumb a::after,.contact__items a::after{content:"";position:absolute;left:0;bottom:-2px;height:1px;width:0;background:currentColor;transition:width .2s;}
.footer__col a:hover::after,.article__crumb a:hover::after,.contact__items a:hover::after{width:100%;}

/* ---------- 产品族概览卡（首页） ---------- */
.famgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;}
.famcard{position:relative;display:block;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px 26px;transition:border-color .25s;cursor:pointer;}
/* 批4：hover 仅边框（标题变色见下方通用规则） */
.famcard:hover{border-color:var(--line-strong);}
.famcard:focus-visible{outline:2px solid var(--accent);outline-offset:3px;}
.famcard__top{display:flex;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap;}
.famcard__no{flex:0 0 auto;color:#B5B0A2;font-weight:600;font-size:14px;letter-spacing:-.01em;
  font-variant-numeric:tabular-nums;transition:color .3s var(--ease);}
.famcard:hover .famcard__no{color:var(--accent);}
.famcard__name{font-family:var(--serif);font-size:18px;font-weight:700;margin:0;letter-spacing:0;color:var(--ink);text-shadow:0 0 .35px currentColor;}
.famcard__intro{color:var(--muted);font-size:14px;line-height:1.7;margin:0 0 14px;}
.famcard__count{font-size:12px;color:var(--muted-2);font-family:inherit;}
.famcard__more{display:inline-flex;align-items:center;gap:6px;margin-top:12px;font-size:13px;font-weight:600;color:var(--accent);}

/* ---------- 产品族 · 行式清单（2026-10-28 视觉重构第一批） ----------
   病因：① 2×2 等宽等高卡片把 2 行文字和 4 行文字强行拉成同高，短卡底部空出 60px；
        ② 全站已经有产品/新闻/荣誉/关于 4 组卡片矩阵共 14 个方框，节奏单一；
        ③ 深色版块用的是「大编号 + 横向长行」语言，浅色区用「小方框」，同一页两套语法。
   改法：沿用深色区的语言 —— 编号打头、横向成行、只留一条水平细线做分隔、不用外框。
        行高由内容决定，天然消掉空洞；四行连成一份「产品索引」，读起来是目录而不是宫格。 */
.famlist{border-top:1px solid var(--line);}
.famrow{display:grid;grid-template-columns:104px minmax(0,1fr) 150px;
  align-items:start;column-gap:24px;padding:30px 24px 30px 0;border-bottom:1px solid var(--line);
  color:inherit;text-decoration:none;transition:background-color .3s var(--ease),border-color .3s var(--ease);}
/* 2026-10-28 晚：整行 hover 变深靛蓝反白。
   这是本版"活泼感"的主来源 —— 静态时它只是一条纸灰分隔的行式目录（干净、素），
   鼠标扫过时整条翻成深蓝白字（像印刷品里的反白标题条），能量在交互里释放，不占静态版面。
   比加装饰、加色块、加图标都更省视觉面积，也更像"人做的"而不是"模板配的"。 */
.famrow:hover{background:var(--navy);border-bottom-color:var(--navy);}
.famrow:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;}
/* 编号：2026-10-28 晚改「仪表读数」语言 —— 无衬线等宽数字（tabular-nums）+ 紧字距 + 51px。
   上一版是宋体淡灰页码，文气但软，读作"书页装饰"；产品索引的编号应该是"仪器上的序号"：
   等宽保证 01/02/03/04 每位数字占同样宽度，纵向排下来数字是对齐的，这才是精密感来源。 */
.famrow__no{font-size:51px;font-weight:500;line-height:.92;letter-spacing:-.02em;
  font-variant-numeric:tabular-nums;color:#C4BFB2;
  transition:color .3s var(--ease);}
.famrow__body{display:block;min-width:0;}
.famrow__name{margin:0 0 10px;font-size:24px;font-weight:700;line-height:1.28;color:var(--ink);
  transition:color .3s var(--ease);letter-spacing:-.015em;}
/* 规格标签（2026-10-29 轮86 改造）：原来「品名 + 10px 等宽小字 + 1px 描边 + 3px 圆角」，
   是全页最像模板的一处 —— 三五个字的参数被装进方框，读作贴纸；10px 中文也已低于可读下限。
   改法：边框整条去掉，换成一道细竖线分隔 + 正文无衬线 13px + 等宽数字（tabular-nums）。
   竖线是目录里「品名 | 规格」的分隔符，承担读法，不算装饰。 */
.famrow__tag{display:inline-block;margin-left:16px;padding-left:16px;line-height:1.25;
  border:0;border-left:1px solid var(--line-strong);border-radius:0;background:none;
  font-family:inherit;font-size:13px;font-weight:500;letter-spacing:.01em;
  font-variant-numeric:tabular-nums;color:var(--muted);
  transition:color .3s var(--ease),border-left-color .3s var(--ease);}
.famrow__intro{margin:0;max-width:66ch;font-size:14px;line-height:1.8;color:var(--muted);
  transition:color .3s var(--ease);}
/* 右侧规格栏（2026-10-29 轮86 改造）：原来「6 项产品」用等宽字体 12px 淡灰悬在右上角，
   中文落进 mono 是回退字体、字宽不齐，读作贴上去的系统提示；下面再压一行 13px 加粗 + 箭头，
   两行小字堆在角落，正是「卡片右下角一坨」的模板写法。
   改法：数量改「读数」—— 数字 19px 等宽紧字距（墨色）+ 单位 11.5px 淡灰紧随基线；
   动作弱化为 12.5px 常规字重，静息不带下划线，hover 时下划线从左走满
   （沿用全站文字链接的统一交互规范，不新增动效语言；箭头不滑移，见下方 .famrow__arw 注释）。 */
.famrow__meta{display:block;text-align:right;white-space:nowrap;padding-top:2px;}
.famrow__count{display:block;line-height:1;}
.famrow__num{font-size:19px;font-weight:600;letter-spacing:-.01em;
  font-variant-numeric:tabular-nums;color:var(--ink);transition:color .3s var(--ease);}
.famrow__unit{margin-left:6px;font-size:11.5px;font-weight:500;letter-spacing:.02em;
  color:var(--muted-2);transition:color .3s var(--ease);}
.famrow__more{position:relative;display:inline-block;margin-top:14px;font-size:12.5px;font-weight:500;
  letter-spacing:.02em;color:var(--ink-soft);transition:color .3s var(--ease);}
.famrow__more::after{content:"";position:absolute;left:0;bottom:-3px;height:1px;width:0;
  background:currentColor;transition:width .2s;}
/* 箭头只做固定间距，不做滑移 —— 批4 交互规范写明「文字链接 hover 统一用下划线展开，
   替代箭头滑移」，这里没有理由开例外。 */
.famrow__arw{display:inline-block;margin-left:5px;}
.famrow:hover .famrow__more::after{width:100%;}
/* 反白态全套：深底上所有层级重排（正文不能再用墨色，编号不能再用纸灰） */
.famrow:hover .famrow__no{color:rgba(255,255,255,.38);}
.famrow:hover .famrow__name{color:#fff;}
.famrow:hover .famrow__tag{color:rgba(255,255,255,.72);border-left-color:rgba(255,255,255,.3);}
.famrow:hover .famrow__intro{color:rgba(255,255,255,.72);}
.famrow:hover .famrow__num{color:#fff;}
.famrow:hover .famrow__unit{color:rgba(255,255,255,.52);}
.famrow:hover .famrow__more{color:#8FB4FF;}
@media(max-width:1100px){
  .famrow{grid-template-columns:72px minmax(0,1fr) 140px;column-gap:20px;padding:26px 12px 26px 0;}
  .famrow__no{font-size:38px;}
}
@media(max-width:860px){
  .famrow{grid-template-columns:46px minmax(0,1fr);column-gap:14px;padding:22px 8px 22px 0;}
  .famrow__no{font-size:28px;}
  .famrow__name{font-size:18px;margin-bottom:8px;}
  /* 窄屏把「读数 + 动作」并成一行，避免两行小字把行高撑开 */
  .famrow__meta{grid-column:2/3;display:flex;align-items:baseline;gap:18px;text-align:left;padding-top:12px;}
  .famrow__more{margin-top:0;}
}

/* ---------- 能力 / 条件卡（软件能力、研发条件） ---------- */
.caps{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;}
.caps--4{grid-template-columns:repeat(4,1fr);}
.cap{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px 24px;transition:border-color .25s;}
.cap:hover{border-color:var(--line-strong);}
/* 研发条件卡片 = <a>（点进图文详情）：重置链接默认样式，hover 除上浮外边框点亮点缀色 */
a.cap{display:block;text-decoration:none;color:inherit;}
a.cap:hover{border-color:var(--accent);}
.cap__no{font-size:26px;font-weight:800;color:var(--accent-soft);font-family:var(--mono);line-height:1;margin-bottom:12px;}
.cap__title{font-size:17px;font-weight:700;margin:0 0 8px;color:var(--ink);}
.cap__desc{color:var(--muted);font-size:14px;line-height:1.7;margin:0;}

/* ---------- 软件能力区块 ---------- */
.software{background:#fff;border:1px solid var(--line-strong);border-radius:var(--radius);padding:38px 40px;box-shadow:var(--shadow-sm);}
/* ---------- 联系 CTA 带 ---------- */
/* 2026-10-28 晚：CTA 从「近黑通知条」改成「深靛蓝 + 电磁波场」。
   原来是一条 #15181C 的纯色横带，里面两行小字 + 一个白色小按钮 —— 全站最没有设计感的一屏，
   而且它的近黑与深色版块的蓝黑不是同一个颜色，等于第三套深色。
   改法：① 底色统一到 --navy（与清单反白、应用场景面板同族）；
        ② 复用首屏的同心弧线，圆心压到右下角外侧 —— 同一套图形语言出现两次，
           它就不再是"某个效果"，而是这套设计的识别特征；
        ③ 标题放大到 32px，让它撑得起这一条横带。 */
.cta{background:var(--navy);color:#fff;border-radius:var(--radius);padding:48px 52px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;}
/* 电磁波场（深色版）：圆心落在右下角外侧，只用水白的 5.5% 细弧，压在文字之下 */
.cta::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-radial-gradient(circle at 92% 130%, transparent 0 34px, rgba(255,255,255,.042) 34px 35px);}
/* 2026-10-28：字体统一 —— CTA 标题与全站大标题同走衬线 */
.cta__title{font-family:var(--serif);font-size:32px;font-weight:700;margin:0 0 10px;color:#fff;letter-spacing:0;line-height:1.2;text-shadow:0 0 .7px currentColor;}
.cta__desc{color:rgba(255,255,255,.66);font-size:15px;margin:0;letter-spacing:.01em;}

/* ---------- 多页面响应式 ---------- */
@media (max-width:980px){
  .famgrid,.caps{grid-template-columns:repeat(2,1fr);}
  .caps--4{grid-template-columns:repeat(2,1fr);}
  .jumpnav{grid-auto-flow:row;grid-template-columns:repeat(2,1fr);overflow:hidden;}
  /* 触屏无悬停、且两列换行下面板定位没有意义 → 直接不渲染下拉 */
  .jumpnav__drop{display:none;}
  .jumpnav__item:nth-child(2n){border-right:none;}
  .jumpnav__item:nth-child(-n+2){border-bottom:1px solid var(--line);}
}
@media (max-width:760px){
  .nav__cta{display:none;}
  .pagehead{padding:52px 0 42px;}
  .pdetail__sec--related{margin-top:40px;padding:20px 16px 22px;}
  .jumpnav{grid-auto-flow:row;grid-template-columns:1fr;}
  .jumpnav__item{border-right:none;border-bottom:1px solid var(--line);padding:13px 16px;}
  .jumpnav__item:nth-child(2n){border-right:none;}
  .jumpnav__item:last-child{border-bottom:none;}
  .famgrid,.caps,.caps--4{grid-template-columns:1fr;}
  .software{padding:26px 22px;}
  .cta{padding:30px 26px;}
}

/* ===================== 高级感精修层（2026-09-27） =====================
   原则：不新增版块、不改信息架构、不引入彩色填充/胶囊（去 AI 化铁律），
   只在既有蓝白语言内做「细节质感 + 微交互」：双层阴影、首屏编排、
   网格卡片错峰入场、图片微缩放、按钮按压投影、选中/滚动条/焦点三个全局细节。 */

/* ---------- 全局细节：选中文字 / 滚动条 / 键盘焦点 ---------- */
::selection{background:rgba(47,107,255,.92);color:#fff;}
/* Firefox：细滚动条 + 悬停加深（轨道全透明，不占视觉宽度） */
html{scrollbar-width:thin;scrollbar-color:#c3ccda transparent;}
::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-thumb{background:#c3ccda;border-radius:8px;border:2px solid #fff;background-clip:padding-box;}
::-webkit-scrollbar-thumb:hover{background:#9fabbe;background-clip:padding-box;}
::-webkit-scrollbar-track{background:transparent;}
/* 键盘导航（Tab）时的统一焦点环；鼠标点击不触发 :focus-visible，不影响鼠标用户 */
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
/* 批4：表单聚焦只变边框（3px 光晕已删）—— 反馈靠边框色，不靠发光 */

/* ---------- 首屏入场：最简透明度淡入（全站视觉重构·交互规范：禁位移/错峰） ----------
   旧版 heroUp 三件套 translateY(22px) 错峰上浮撤销 —— 概念化"编排感"与工程精密
   语言不符；保留 0.4s 纯淡入，首屏内容不"砸"进视野即可。
   无 transform（opacity 动画不劫持后代 fixed 定位基准，无 fill 模式历史坑）。 */
@keyframes heroFade{from{opacity:0;}to{opacity:1;}}
@media (prefers-reduced-motion: no-preference){
  .hero__title,.hero__rule,.hero__slogan,.hero__sub{animation:heroFade .4s ease both;}
}

/* ---------- 滚动进场：最简透明度淡入（批4 交互规范：0.3s 纯 opacity、无位移、无错峰） ---------- */

/* ---------- 卡片标题随 hover 染色：整卡反馈，不只边框阴影 ----------
   ⚠️ news-card 已改「整卡反白」（标题变白），所以从这条通用染色规则里摘出去，
   否则它会以同优先级、更靠后的位置覆盖反白态的 #fff。 */
.prod__name,.news-card h3,.honor__body h3,.famcard__name,.cap__title{transition:color .25s;}
.prod:hover .prod__name,.honor:hover .honor__body h3,
.famcard:hover .famcard__name,.cap:hover .cap__title{color:var(--accent-deep);}

/* ---------- 联系 CTA 带暗纹：与 hero 网格同语言的深色版，右上一角渐隐 ---------- */
.cta{position:relative;overflow:hidden;}
/* 去 AI 化：移除 CTA 暗纹网格，保留纯深底 */
.cta>*{position:relative;}

/* ---------- 返回顶部：滚动过一屏后浮现，静态白底 1px 边框 ----------
   批4：去阴影与 hover 底色/边框变化，hover 仅图标变品牌蓝。
   按钮本体由 main.js 的 initToTop 动态注入（不改任何 HTML）。 */
.toTop{position:fixed;right:26px;bottom:26px;z-index:60;width:42px;height:42px;
  display:flex;align-items:center;justify-content:center;padding:0;
  background:#fff;border:1px solid var(--line-strong);color:var(--ink-soft);cursor:pointer;
  border-radius:4px;
  opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity .3s var(--ease),transform .3s var(--ease),visibility .3s,color .2s;}
.toTop.is-on{opacity:1;visibility:visible;transform:none;}
.toTop:hover{color:var(--accent);}
.toTop svg{display:block;}
@media (max-width:760px){
  .toTop{right:16px;bottom:16px;width:38px;height:38px;}
}
/* 括注标注块：窄屏收一点字号与内边距，避免 18 个字把行宽撑满 */
@media (max-width:700px){
  .article__title-note{font-size:13.5px;padding:5px 11px;margin-top:14px;}
  .prod__name-note{font-size:12px;padding:3px 9px;margin-top:8px;}
}