/* ============================================================
紫光青藤 · demo03 —— 「光刻 Lithography」白色洁净室美学
参考骨架：puyasemi（区块节奏 / 透明导航 / 满屏首屏）
参考气质：Ambiq（高端留白）+ Cuberto（丝滑）+ lusion（干净底+局部光源）
设计母题：晶圆 / 光刻 —— 细网格、扫描线、六边形晶格、光斑
配色铁律：中性白灰系 + VI 紫仅作点缀与光效，禁止 VI 之外的彩色
VI：品牌紫 #900083 科技紫 #7C4DFF 深蓝紫 #1A1F5E
============================================================ */
@font-face{font-family:'Inter';src:url('../fonts/Inter-Light.woff2') format('woff2');font-weight:300;font-display:swap}
@font-face{font-family:'Inter';src:url('../fonts/Inter-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Inter';src:url('../fonts/Inter-Medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Inter';src:url('../fonts/Inter-SemiBold.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Inter';src:url('../fonts/Inter-Bold.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Noto Sans SC';src:url('../fonts/NotoSansSC-Light.woff2') format('woff2');font-weight:300;font-display:swap}
@font-face{font-family:'Noto Sans SC';src:url('../fonts/NotoSansSC-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Noto Sans SC';src:url('../fonts/NotoSansSC-Medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Noto Sans SC';src:url('../fonts/NotoSansSC-Bold.woff2') format('woff2');font-weight:700;font-display:swap}
:root{
/* 中性阶：洁净室白 */
--bg:#ffffff;
--bg-2:#f7f7fa;
--bg-3:#eff0f5;
--ink:#0e1020;
--ink-2:#565a70;
--ink-3:#9a9eb2;
--line:#ececf2;
--line-2:#dcdde6;
/* VI 紫：只做点缀与光效 */
--vi:#900083;
--vi-2:#7C4DFF;
--vi-3:#1A1F5E;
--vi-wash:rgba(144,0,131,.06);
--vi-wash2:rgba(124,77,255,.08);
/* 阴影 */
--sh-1:0 1px 2px rgba(14,16,32,.04),0 8px 24px rgba(14,16,32,.045);
--sh-2:0 24px 60px rgba(14,16,32,.09),0 2px 8px rgba(14,16,32,.04);
--sh-3:0 46px 110px rgba(14,16,32,.14);
/* 缓动 */
--e:cubic-bezier(.22,.61,.36,1);
--e-out:cubic-bezier(.16,1,.3,1);
--e-expo:cubic-bezier(.87,0,.13,1);
--e-soft:cubic-bezier(.4,0,.2,1);
/* 栅格 */
--maxw:90vw;
--pad:max(20px,5vw);
/* 统一图片/卡片圆角：全站一致 */
--rad:20px;
--font:'Inter','Noto Sans SC',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
/* 2026-09-29 OPPO 自带浏览器强暗色模式会把白色胶囊导航反成黑底（负责人三截图之一），
声明 light 告知内核本页已有暗色方案、禁自动反色 */
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color-scheme:light;-webkit-text-size-adjust:100%;text-size-adjust:100%}/* 2026-10-13 全站响应式加固：text-size-adjust 防微信/iOS 横屏自动放大字号打乱布局 */
body{font-family:var(--font);font-weight:300;background:var(--bg);color:var(--ink);line-height:1.6;overflow-x:hidden;
text-rendering:optimizeLegibility;font-feature-settings:"ss01","cv01","tnum"}
img{display:block;max-width:100%}
video,canvas,iframe{max-width:100%}/* 2026-10-13 全站响应式加固：所有媒体不超出视口宽 */
a,button,[role="button"]{-webkit-tap-highlight-color:transparent;touch-action:manipulation}/* 2026-10-13 全站响应式加固：移动端去点击灰闪与 300ms 双击缩放延迟 */
a{text-decoration:none;color:inherit}
/* 移动端/微信 iOS 内核：去掉点击链接按钮时的灰色高亮闪块（多端适配） */
a,button{-webkit-tap-highlight-color:transparent}
ul,ol{list-style:none}
/* 标题统一细体（Light 300）：杂志感大字·轻字重·收紧字距 */
h1,h2,h3,h4{font-weight:300;line-height:1.08;letter-spacing:-.028em;color:var(--ink)}
::selection{background:#cfe0f5;color:var(--ink)}
:focus-visible{outline:2px solid var(--vi-2);outline-offset:3px;border-radius:4px}
/* 统一箭头：发丝线 + 三角头 */
.arw{width:20px;height:1px;background:currentColor;display:inline-block;position:relative;flex:none;
transition:transform .55s var(--e-out),width .55s var(--e-out)}
.arw::after{content:'';position:absolute;right:0;top:-3px;width:7px;height:7px;border-top:1px solid currentColor;
border-right:1px solid currentColor;transform:rotate(45deg)}
.btn{display:inline-flex;align-items:center;gap:10px;font-size:15px;font-weight:300;padding:16px 30px;
border-radius:100px;position:relative;overflow:hidden;will-change:transform;cursor:pointer;border:1px solid transparent;
transition:transform .5s var(--e),background-color .45s,color .45s,box-shadow .45s,border-color .45s}
.btn svg{transition:transform .45s var(--e-out)}
.btn:hover svg{transform:translateX(5px)}
/* 首屏双按钮：玻璃白底 + 墨字（杂志式方角发丝边，不用纯紫底、无箭头） */
.btn--fill{background:rgba(255,255,255,.62);color:var(--ink);border-color:rgba(255,255,255,.78);
-webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6);
box-shadow:0 10px 30px rgba(14,16,32,.08)}
.btn--fill::before{display:none}
.btn--fill:hover{background:#fff;color:var(--ink);box-shadow:0 14px 36px rgba(14,16,32,.16)}
.btn--line{background:rgba(255,255,255,.44);color:var(--ink);border-color:rgba(255,255,255,.78);
-webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6);
box-shadow:0 10px 30px rgba(14,16,32,.06)}
.btn--line:hover{background:#fff;color:var(--ink);border-color:transparent}
.btn--white{background:#fff;color:var(--vi-3);box-shadow:0 16px 40px rgba(0,0,0,.22)}
.btn--white:hover{background:var(--vi-2);color:#fff}
.btn--wire{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.34);
-webkit-backdrop-filter:blur(16px) saturate(1.5);backdrop-filter:blur(16px) saturate(1.5);
box-shadow:0 12px 32px rgba(0,0,0,.16)}
.btn--wire:hover{background:rgba(255,255,255,.2);border-color:#fff}
/* ============ 顶部进度光带 + 章节序号 ============ */
/* 左侧进度条：灰色轨常驻，紫色实色填充随滚动进度向下延伸（用户 2026-09-22：纯紫无渐变） */
.beam{position:fixed;top:0;bottom:0;left:0;width:3px;z-index:1100;background:rgba(14,16,32,.12);pointer-events:none}
.beam i{display:block;width:100%;height:0;background:#900083}
/* ============ 胶囊导航 ============ */
.nav{position:fixed;top:0;left:0;right:0;z-index:1000;padding:16px var(--pad);pointer-events:none;
transition:padding .55s var(--e-out)}
/* viewport-fit=cover 全出血后固定胶囊导航须避开刘海/状态栏；@supports 兜底旧微信 X5 内核不认 env() 时保留原 16px padding。2026-10-15 终端适配点名 */
@supports (padding: calc(16px + env(safe-area-inset-top))){.nav{padding:calc(16px + env(safe-area-inset-top,0px)) calc(var(--pad) + env(safe-area-inset-right,0px)) 16px calc(var(--pad) + env(safe-area-inset-left,0px))}}
.nav__cap{max-width:var(--maxw);margin:0 auto;display:flex;align-items:center;gap:28px;padding:11px 14px 11px 22px;
border-radius:100px;pointer-events:auto;position:relative;
background:rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.7);
backdrop-filter:saturate(150%) blur(10px);-webkit-backdrop-filter:saturate(150%) blur(10px);
transition:background-color .55s var(--e),box-shadow .55s var(--e),border-color .55s var(--e),
backdrop-filter .55s,padding .55s var(--e-out)}
.nav.is-solid .nav__cap{background:rgba(255,255,255,.72);border-color:rgba(255,255,255,.9);
backdrop-filter:saturate(180%) blur(18px);-webkit-backdrop-filter:saturate(180%) blur(18px);
box-shadow:0 10px 34px rgba(14,16,32,.07),0 1px 0 rgba(255,255,255,.9) inset}
.nav.is-solid{padding-top:10px}
.nav__logo{display:flex;align-items:center;flex:none}
.nav__logo img{height:28.6px;width:auto;transition:transform .55s var(--e-out)}
.nav__logo:hover img{transform:scale(1.05)}
/* LOGO 右侧股票代码（2026-10-09 负责人点名）：细竖线分隔 +「股票代码」标签 + 品牌紫胶囊数字（2026-10-10 负责人点名：加标签字、码改 888888、更明显） */
.nav__code{flex:none;align-self:center;display:flex;align-items:center;gap:8px;margin-left:10px;padding-left:10px;
border-left:1px solid rgba(60,60,67,.18);line-height:1}
.nav__code-l{font-style:normal;font-size:12px;font-weight:400;letter-spacing:.04em;color:var(--ink-2)}
.nav__code-n{font-size:14px;font-weight:700;letter-spacing:.06em;padding:4px 0;border-radius:99px;
color:var(--ink);background:none;font-variant-numeric:tabular-nums}/* 2026-10-10 负责人点名：去胶囊背景框、数字改黑；点名缩小文字与数字间距：撤掉遗留胶囊左右内边距 */
@media (max-width:640px){.nav__code{display:none}}/* 窄屏隐藏，与语言键/汉堡键保间距 */
.nav__menu{display:flex;gap:2px;margin-left:auto}
.nav__a{position:relative;padding:9px 14px;font-size:14px;font-weight:400;color:var(--ink-2);white-space:nowrap;
transition:color .35s var(--e)}
.nav__a:hover{color:var(--ink)}
/* 选中态：文字变紫（不再使用下划线） */
.nav__a.is-active{color:var(--vi)}
/* 二级栏目：下拉面板材质与一级标题胶囊 .nav__cap 完全一致的磨砂玻璃（含 is-solid 滚动实动态同步），
顶部加居中上指三角指针（照用户截图2 样式），条目居中加粗；悬停/聚焦淡入、无位移防抖、带桥接带防闪断；移动抽屉内展开为缩进子行 */
.nav__it{position:relative;display:flex;align-items:center}
.nav__dd{position:absolute;top:calc(100% + 19px);left:50%;transform:translateX(-50%);min-width:158px;z-index:60;
padding:8px;display:flex;flex-direction:column;gap:2px;
background:rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.7);border-radius:14px;
-webkit-backdrop-filter:saturate(150%) blur(10px);backdrop-filter:saturate(150%) blur(10px);
box-shadow:0 18px 44px rgba(14,16,32,.12);
opacity:0;pointer-events:none;transition:opacity .16s linear}
.nav__dd::before{content:'';position:absolute;left:0;right:0;top:-19px;height:19px}
/* 上指三角：旋转 45° 方形，同款磨砂材质（bg/边框/backdrop-filter 与面板一致），仅露出上方两条描边；
clip-path 只保留上半三角形（顶点朝上），裁掉下方那个尖；
尺寸放大到 14px 且 top:-5.5px，使三角底边下压进盒子 ~1.5px、把盒顶那条 1px border-top（及 solid 态 inset 高光线）压进三角身体里，
由指针自身 backdrop-filter 虚化掉接缝横线；同时顶点仍落在原 -8.49px 处（贴着胶囊下边线） */
.nav__dd::after{content:'';position:absolute;top:-5.5px;left:50%;width:14px;height:14px;z-index:1;
transform:translateX(-50%) rotate(45deg);border-radius:2px;
-webkit-clip-path:polygon(0 0,100% 0,0 100%);clip-path:polygon(0 0,100% 0,0 100%);
background:rgba(255,255,255,.5);border-left:1px solid rgba(255,255,255,.7);border-top:1px solid rgba(255,255,255,.7);
-webkit-backdrop-filter:saturate(150%) blur(10px);backdrop-filter:saturate(150%) blur(10px)}
.nav.is-solid .nav__dd{background:rgba(255,255,255,.72);border-color:rgba(255,255,255,.9);
-webkit-backdrop-filter:saturate(180%) blur(18px);backdrop-filter:saturate(180%) blur(18px);
box-shadow:0 10px 34px rgba(14,16,32,.07),0 1px 0 rgba(255,255,255,.9) inset}
.nav.is-solid .nav__dd::after{background:rgba(255,255,255,.72);border-color:rgba(255,255,255,.9);
-webkit-backdrop-filter:saturate(180%) blur(18px);backdrop-filter:saturate(180%) blur(18px)}
.nav__it:hover .nav__dd,.nav__it:focus-within .nav__dd{opacity:1;pointer-events:auto}
.nav__dd a{display:block;padding:9px 16px;border-radius:9px;font-size:13.5px;font-weight:600;color:var(--ink-2);white-space:nowrap;
text-align:center;transition:background-color .3s,color .3s}
.nav__dd a:hover{background:rgba(14,16,32,.05);color:var(--ink)}
.nav__lang{flex:none;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line-2);background:rgba(255,255,255,.6);
color:var(--ink-2);font-family:var(--font);font-size:11.5px;font-weight:400;letter-spacing:.08em;
padding:5px 11px;border-radius:100px;cursor:pointer;min-width:44px;
transition:color .35s var(--e),border-color .35s var(--e),background-color .35s var(--e)}
/* 中文态显示 EN（点击切英文），英文态显示 CN（点击切回中文） */
.nav__lang .to-zh{display:none}
.nav__lang.is-en .to-en{display:none}
.nav__lang.is-en .to-zh{display:inline}
.nav__lang:hover{color:var(--vi);border-color:var(--vi);background:rgba(255,255,255,.85)}
@media (max-width:1240px){.nav__cap{gap:18px}.nav__a{padding:9px 10px;font-size:13.5px}}
.nav__burger{display:none;flex-direction:column;justify-content:center;gap:6px;background:none;border:0;cursor:pointer;
padding:9px;margin-left:auto;z-index:1020}
.nav__burger span{width:24px;height:1.6px;background:var(--ink);border-radius:2px;transition:.5s var(--e-expo)}
.nav__burger.is-open span:nth-child(1){transform:translateY(3.8px) rotate(45deg)}
.nav__burger.is-open span:nth-child(2){transform:translateY(-3.8px) rotate(-45deg)}
body.nav-open{overflow:hidden}
/* ============ 二级栏目标签条（头图下方 · 抄 autocnd /business 那一行：左对齐标签，
当前项品牌紫 + 底部下划线指示条，其余灰；整行底部一条发丝分隔线。
除首页外，凡当前页属于某导航版块二级页者，由 demo03.js 从现有导航下拉自动生成并插入（数据源单一、免逐页硬编）；
有头图页插于 .phero 之后，无头图页（关于子页等）置顶并避让固定胶囊导航） ============ */
.subtabs{position:relative;z-index:3;background:var(--bg);border-bottom:1px solid var(--line);padding:0 var(--pad)}
.subtabs__in{max-width:var(--maxw);margin:0 auto;padding-left:22px;display:flex;flex-wrap:nowrap;gap:clamp(22px,3.4vw,58px);
overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.subtabs__in::-webkit-scrollbar{display:none}
.subtabs__a{position:relative;flex:none;padding:19px 2px;font-family:var(--font);font-size:15px;font-weight:500;
letter-spacing:.02em;color:var(--ink-3);text-decoration:none;white-space:nowrap;transition:color .35s var(--e)}
.subtabs__a:first-child{padding-left:0}/* 使首个标签文字与上方 phero 标题左对齐（.subtabs__in padding-left:22px 同 .phero__in）*/
.subtabs__a:hover{color:var(--ink)}
.subtabs__a.is-on{color:var(--vi);font-weight:600}
.subtabs__a::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;border-radius:2px;background:var(--vi);
transform:scaleX(0);transform-origin:left center;transition:transform .42s var(--e-out)}
.subtabs__a.is-on::after{transform:scaleX(1)}
/* 无头图页：标签条置顶需避让固定导航，并压缩紧随区块的顶部留白 */
.subtabs--top{padding-top:clamp(84px,10vh,104px)}
.subtabs--top + section{padding-top:clamp(40px,6vh,76px)}
@media (max-width:640px){.subtabs__a{font-size:14px;padding:16px 2px}}
@media (prefers-reduced-motion:reduce){.subtabs__a::after{transition:none}}
/* ============ 通用区块头 ============ */
.head{max-width:var(--maxw);margin:0 auto clamp(40px,6vh,72px)}
.head__t{font-size:clamp(30px,4.6vw,58px);letter-spacing:-.045em;line-height:1.04}
/* 2026-10-10 负责人点名：除首页外所有二级页面的版块大标题统一为 44px（首页 body.home 保留原 58px 大字） */
body:not(.home) .head__t{font-size:clamp(30px,4vw,44px)}
.head__d{margin-top:20px;font-size:15.5px;color:var(--ink-2);max-width:62ch;line-height:1.7;
display:flex;flex-wrap:wrap;gap:6px 18px;align-items:baseline}
.head--c{text-align:center}
.head--c .head__d{margin-left:auto;margin-right:auto;justify-content:center}
.head--row{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;flex-wrap:wrap}
/* 栏目头部：小字单行不换行、左对齐（产品/技术两栏一致） */
.pillars .head__d,.latt .head__d{max-width:none;flex-wrap:nowrap}
/* 头部→图间距与产品中心同值等旧 .head 专属规则已随投资者版块改面板版式作废删除 */
/* 产品体系头部→图间距对齐解决方案（solve__hd 同款 clamp），acc 自身 mt 归零不再叠加 */
.pillars .head{margin-bottom:clamp(30px,4.6vh,50px)}
@media (max-width:760px){.pillars .head__d,.latt .head__d{flex-wrap:wrap}}
/* ============================================================
01 · HERO（sticky + 视频铺底 + 滚动收缩）
============================================================ */
.hero{position:sticky;top:0;height:100vh;height:100svh;z-index:1;overflow:hidden}/* svh 前先写 vh 兜底：旧 iOS(<15.4)/微信 X5(<108) 不认 svh，直接丢弃会塌高 */
.hero__stage{position:absolute;inset:0 0 10% 0;transform-origin:50% 48%;will-change:transform,border-radius,opacity;
overflow:hidden;background:#eef1f6}
.hero__vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;
transform-origin:64% 42%;animation:kalZoom 30s ease-in-out infinite alternate}
@keyframes kalZoom{from{transform:scale(1.04)}to{transform:scale(1.18) translate(-1.4%,1%)}}
/* 白色遮罩已移除：文字改用白光柔光，直接落在视频上保持可读 */
.hero__lattice{position:absolute;inset:0;z-index:2;width:100%;height:100%;pointer-events:none;opacity:.9}
.hero__etch{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:.5;
background-image:repeating-linear-gradient(0deg,rgba(14,16,32,.05) 0 1px,transparent 1px 88px),
repeating-linear-gradient(90deg,rgba(14,16,32,.05) 0 1px,transparent 1px 88px)}
.hero__scan{position:absolute;left:0;right:0;height:220px;z-index:4;pointer-events:none;
background:linear-gradient(180deg,transparent,rgba(255,255,255,.16) 46%,rgba(255,255,255,.62) 50%,rgba(255,255,255,.14) 54%,transparent);
animation:scanSweep 9s var(--e-soft) infinite;animation-delay:1.4s}
@keyframes scanSweep{0%{top:-24%;opacity:0}12%{opacity:.9}72%{opacity:.7}100%{top:112%;opacity:0}}
/* 首屏版式：内容居中正中间（垂直 + 水平居中、中间对齐） */
.hero__layer{position:relative;z-index:5;height:100%;max-width:var(--maxw);margin:0 auto;
padding:0 var(--pad) 10vh;padding-bottom:10svh;/* 10svh 前先留 10vh 兜底（同上） */
display:flex;flex-direction:column;justify-content:center;will-change:transform,opacity;
text-shadow:0 1px 22px rgba(255,255,255,.92),0 1px 6px rgba(255,255,255,.55)}
.hero__core{max-width:min(100%,1080px);margin:0 auto;text-align:center}
.hero__title{font-size:clamp(30px,4.6vw,63px);font-weight:300;letter-spacing:-.026em;line-height:1.06}
.hero__title .ln{display:block;overflow:hidden;padding-bottom:.06em}
.hero__title .ln>b{display:block;font-weight:inherit;white-space:nowrap;transform:translateY(112%);transition:transform 1.2s var(--e-expo)}
.hero__title .ln:nth-child(2)>b{transition-delay:.11s}
.hero.is-in .hero__title .ln>b{transform:none}
.hero__title em{font-style:normal}
/* 窄屏单行放不下时允许换行，避免溢出 */
@media (max-width:860px){.hero__title .ln>b{white-space:normal}}
.hero__lede{margin-top:24px;font-size:clamp(14px,1.15vw,16px);color:var(--ink-2);max-width:46ch;line-height:1.68;
text-shadow:0 1px 16px rgba(255,255,255,.85);
opacity:0;transform:translateY(16px);transition:opacity 1s var(--e) .68s,transform 1s var(--e) .68s}
.hero.is-in .hero__lede{opacity:1;transform:none}
/* 首屏副标（杂志式 kicker）：发丝线起首 + 宽字距墨色小字，居中 */
.hero__lede--tag{margin:clamp(20px,3vh,30px) auto 0;max-width:640px;padding-top:clamp(15px,2.2vh,22px);
border-top:1px solid rgba(14,16,32,.22);
font-size:clamp(15.5px,1.45vw,19px);font-weight:300;
letter-spacing:.22em;color:#3e4151}/* 再加深 15%：#494c5f ×0.85（用户 2026-09-22 二次；累计 = --ink-2 ×0.7225） */
/* 英文串更长（约 59 字符），字号降一档保证发丝线内单行不换行 */
/* 2026-09-29 负责人：英文态字小显不清，加深一档 #3e4151→#252838（≈×0.62，
对浅色视频底 WCAG 对比度≈ 8.8:1）；中文态 #3e4151 是 09-22 两轮加深后的定板，不动 */
/* 同日：英文态词与词之间加大间距 word-spacing:.35em（只宽空格间隙，
不动字母间距 letter-spacing:.06em；全句 8 个空格≈+40px，不溢出 640px 容器） */
html[lang=en] .hero__lede--tag{letter-spacing:.06em;font-size:clamp(12.5px,1.05vw,14.5px);color:#252838;word-spacing:.35em}
/* 英文标题字宽大于中文（实测 24.6em vs 16.56em），降一档字号保证单行不溢出 */
html[lang=en] .hero__title{font-size:clamp(20px,2.5vw,42px)}
/* 2026-09-29 修英文态 hero 标题尾部被裁（负责人反馈：宽屏下 Solutions 的 s 切出框）：
42px 封顶时实测文本 1093px，超出 .hero__core 的 1080px 封顶 13px，被 .ln{overflow:hidden} 裁尾。
中文几何 1080 是定板不动，只在英文态放宽容器到 1160（余量 67px，抗字体渲染差异）；
≥1680px 才会触到 1160 封顶（100%=80vw 在 1680 下为 1344px），窄屏无影响 */
html[lang=en] .hero__core{max-width:min(100%,1160px)}
.hero__act{margin-top:clamp(30px,4.6vh,46px);display:flex;gap:14px;flex-wrap:wrap;justify-content:center;
opacity:0;transform:translateY(16px);transition:opacity 1s var(--e) .88s,transform 1s var(--e) .88s}
/* 首屏按钮：胶囊圆角（同「国家高新技术企业」标签形制）+ 加长内距 · 中性墨色 */
.hero__act .btn{padding:15px 42px;font-size:14px;font-weight:300;letter-spacing:.08em;gap:9px;border-radius:100px}
.hero__act .btn svg{width:14px;height:14px}
.hero.is-in .hero__act{opacity:1;transform:none}
/* 首屏滚动提示：底部正中间线性鼠标（细线墨色·无外圈外壳）；滚动开始后隐藏（.hero.is-scrolled） */
.hero__scroll{position:absolute;left:50%;bottom:clamp(12px,2.4vh,24px);margin-left:-23px;z-index:6;
width:46px;height:46px;display:grid;place-items:center;color:var(--ink);
opacity:0;transform:translateY(7px);
transition:opacity .7s var(--e) 1.05s,transform .7s var(--e) 1.05s}
.hero__scroll svg{width:24px;height:24px;filter:drop-shadow(0 1px 6px rgba(255,255,255,.9));
animation:heroScroll 3.4s ease-in-out infinite}
.hero__scroll .hero__wheel{transform-box:fill-box;transform-origin:center;
animation:heroWheel 2.2s ease-in-out infinite}
@keyframes heroScroll{0%,100%{transform:translateY(-2.5px)}50%{transform:translateY(2.5px)}}
@keyframes heroWheel{0%{transform:translateY(-1.4px);opacity:0}30%{opacity:1}72%{transform:translateY(3.4px);opacity:0}100%{transform:translateY(3.4px);opacity:0}}
.hero.is-in .hero__scroll{opacity:.94;transform:none}
.hero.is-scrolled .hero__scroll{opacity:0;transform:translateY(12px);pointer-events:none;transition-delay:0s}
@media (max-width:900px){
.hero__facts{gap:22px}
.hero__facts li{flex:1 1 30%}
}
/* ============================================================
03 · PILLARS —— 三大产品体系：横向手风琴（悬停展宽 · 底图回正推近 · 小字浮现）
0 圆角 · 14px 列缝 · 三层同心圆图标（悬停脉冲）· 冷调非紫底图
============================================================ */
.pillars{position:relative;z-index:2;background:var(--bg-2);padding:clamp(84px,13vh,164px) var(--pad) clamp(80px,11vh,140px);overflow:hidden}
.pillars::before{content:'';position:absolute;left:50%;top:50%;width:120vw;height:120vh;transform:translate(-50%,-50%);
background:radial-gradient(ellipse at center,rgba(255,255,255,.9),transparent 58%);pointer-events:none}
.pillars__in{position:relative;z-index:1;max-width:var(--maxw);margin:0 auto}
/* 手风琴：三列弹性等分（14px 缝 · 圆角同全站 --rad）；悬停列展宽（flex-grow 3）、底图回正推近、小字浮现 */
.acc{position:relative;display:flex;gap:14px;margin-top:0;
height:clamp(420px,54vh,520px);border-radius:var(--rad);background:transparent}
.acc__p{position:relative;flex:1 1 0%;min-width:0;border-radius:var(--rad);overflow:hidden;cursor:pointer;background:#101324;
transition:flex-grow .55s cubic-bezier(.4,0,.2,1),box-shadow .4s ease}
.acc__p:hover{flex-grow:3;box-shadow:0 20px 60px rgba(14,16,32,.28)}
.acc:not(:hover) .acc__p,.acc:hover .acc__p:not(:hover){flex-grow:.55}
/* 列底图：整幅 cover，默认微推近、悬停回正（CSS 直引，相对本样式表解析；勿用内联 --bg 传 url()，会 404） */
.acc__img{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;
transform:scale(1.06);transition:transform .6s ease,filter .4s ease}
/* 智能连接卡图：2026-09-28 负责人换成客户提供的新图（蓝色等距城市场景）。px-usb-v2.jpg 未动——它还被首页核心技术 orb 背景（.orb__bg 内联引用）复用，覆盖会误伤那处 */
/* 2026-09-29 二次换图（负责人图2「最终智能联接」）：px-connect-v3.jpg → px-connect-v4.jpg。新图源 1512x648，缩到产品卡口径 1400x600 q90/228KB；v3 保留作回滚 */
/* 2026-11-02 点名（将首页产品体系版块的三张图更换为新发的图片1-3）：px-connect-v4.jpg → px-connect-v6.jpg。新源=客户风格重绘版「图片2」（1600x688，方形芯片 + NFC 支付/门禁玻璃卡场景），不裁不垫缩到宽 1400 → 1400x602 q90/183KB；v4 不覆盖——它仍被产品中心首页 .pse__m 移动端展开图引用（见该页 10-27 留档），覆盖会误伤那处，且留站作回滚。旧值逐字留档：url(../../images/px-connect-v4.jpg?v=20260929a) */
/* 2026-11-03 点名（产品体系三卡再换为新一版图片1-3）：px-connect-v6.jpg → px-connect-v7.jpg。新源「图片1」1920x825（深色 PCB + 方形芯片悬浮 + 手机 NFC 支付/车钥匙/门禁玻璃卡），不裁不垫缩到宽 1400 → 1400x602 q90/174KB，转码脚本 _tools/transcode-acc-cards-1103.ps1。
成套明显变暗（三卡同趋势，另两张的实测随各自规则留档）：本卡均值 103.7→41.1、底部文字带 98.6→37.6、暗部(<40)占比 14%→67%——白字标题与 .acc__ic 细线图标更吃得住，.acc__shade 沉墨纱幕原样常驻未动。
悬停态实测（1280 视口、悬停中间卡，对截图逐区取均值）：未悬停两卡图像区 64.4 / 59.9，反而比悬停卡自身（44.4）亮一档——因为 brightness(.78) 上面还叠了一层白磨砂 .acc__img::after（rgba(255,255,255,.15)+blur6），提亮量大于压暗量，不会闷成纯黑，.78 无需回调。v6 不覆盖，留站作回滚。旧值逐字留档：url(../../images/px-connect-v6.jpg?v=20261102a) */
.acc__p[data-i="0"] .acc__img{background-image:url(../../images/px-connect-v7.jpg?v=20261103a)}
/* 智能感知卡图：2026-09-28 负责人换成客户提供的新图（手机镜头模组拆解 + 识读终端）。px-sensor-v2.jpg 未动——它同样被首页核心技术 orb 背景（.orb__bg 内联引用）复用，覆盖会误伤那处 */
/* 2026-11-02 点名（同上，三卡成套更换）：px-sense-v3.jpg → px-sense-v6.jpg。新源=「图片3」（1600x688，手机镜头模组拆解 + 拍照/运动相机/无人机/识读终端），同口径 1400x602 q90/222KB；v3 不覆盖——仍被产品中心首页 .pse__m 引用，留站作回滚。旧值逐字留档：url(../../images/px-sense-v3.jpg?v=20260928a) */
/* 2026-11-03 点名（同上，三卡成套更换）：px-sense-v6.jpg → px-sense-v7.jpg。新源「图片2」1600x688（手机后摄镜组拆解 + 拍照/运动相机/桌面机器人/无人机/POS 识读终端），同口径 1400x602 q90/193KB。
均值 112.3→51.4、底部文字带 110.2→52.3、暗部占比 13%→56%。v6 不覆盖，留站作回滚。旧值逐字留档：url(../../images/px-sense-v6.jpg?v=20261102a) */
.acc__p[data-i="1"] .acc__img{background-image:url(../../images/px-sense-v7.jpg?v=20261103a)}
/* 端侧存储卡图：2026-09-29 负责人换成客户新图「端侧最终版」（紫光青藤芯片主视觉 + IoT 场景）。px-chip-cpu.jpg 解除引用但保留线上文件 */
/* 2026-09-30 负责人换图（图2 端侧存储新源）：px-store-v2.jpg → px-store-v3.jpg。新图源 1814x777 PNG，缩到产品卡口径 1400x600 q90/205KB，不裁不垫；v2 保留作回滚 */
/* 2026-09-30 二刷：负责人又传同名新源（1814x777，哈希不同、修图版）：px-store-v3.jpg → px-store-v4.jpg，同口径 1400x600 q90/200KB；v3 保留作回滚 */
/* 2026-11-02 点名（同上，三卡成套更换）：px-store-v4.jpg → px-store-v6.jpg。新源=「图片1」（1920x825，紫光青藤 SOP-8 芯片主视觉 + 仪表/路由器/行车记录仪/摄像头玻璃卡，与 v4 同构图的写实重绘版），同口径 1400x602 q90/200KB；v4 不覆盖——仍被产品中心首页 .pse__m 引用，留站作回滚。旧值逐字留档：url(../../images/px-store-v4.jpg?v=20260930a) */
/* 2026-11-03 点名（同上，三卡成套更换）：px-store-v6.jpg → px-store-v7.jpg。新源「图片3」1600x688（紫光青藤 TSINGTENG MICRO SOP-8 芯片主视觉 + 仪表/路由器/行车记录仪/摄像头玻璃卡，与 v6 同题材的更写实一版），同口径 1400x602 q90/179KB。
均值 135.4→61.7、底部文字带 131.6→68.8、暗部占比 11%→49%。三卡里本张仍算最亮，但底部文字带已比旧图暗掉近一半，「端侧存储」白字只会比旧图好读，无需另加压字。
v6 不覆盖，留站作回滚。旧值逐字留档：url(../../images/px-store-v6.jpg?v=20261102a) */
.acc__p[data-i="2"] .acc__img{background-image:url(../../images/px-store-v7.jpg?v=20261103a)}
/* 2026-09-29 负责人三修（覆盖同日“只加玻璃膜不 blur”口径）：磨砂要盖**整张卡片图**，
不是只盖底部文字带——膜层加 backdrop blur(14px)，图透出轮廓但磨透；
斜向白雾渐变同时提一档（约 12%~22%，均值≈17%）做出磨砂面的乳白质感；
2026-09-29 四修：底部文字带独立磨砂已删，全卡只剩这一层整图磨砂 */
/* 2026-09-29 负责人六修：磨砂继续减弱，以能看清下面的图为准——
blur 6px→2.5px（只柔化边缘），白雾均值 8%→约 4%，只留一层几乎透明的轻纱 */
/* 2026-09-29 负责人七修：磨砂继续减弱——blur 2.5px→1px（只留一丝柔边），
白雾再减半至约 1%~4%，图完全透出，膜层仅剩极淡光泽 */
/* 2026-09-29 负责人八修（“再清晰一点点”）blur 1px→0.5px 已按负责人要求回退，维持七修参数 */
/* 2026-09-30 负责人点名换玩法（照截图二口径）：废弃“三卡常驻极淡膜”，改交互态磨砂——
悬停某卡时其余两卡盖白磨砂（参数同解决方案列玻璃 rgba(255,255,255,.15)+blur(6px)），
悬停卡自揭罩清晰显示；无悬停时三卡全清晰。触屏（hover:none）无悬停态，恒清晰 */
.acc__img::after{content:'';position:absolute;inset:0;opacity:0;transition:opacity .45s var(--e);
background:rgba(255,255,255,.15);
-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
@media (hover:hover){.acc:hover .acc__p:not(:hover) .acc__img::after{opacity:1}}
/* 沉墨纱幕：保证图标细线在图上可读；2026-09-29 负责人点名改半透明磨砂遮罩后，
底部文字区可读性交给 .acc__bd 磨砂带，纱幕底部深色由 .74 压到 .20，避免叠死磨砂的通透感 */
.acc__shade{position:absolute;inset:0;z-index:1;pointer-events:none;
background:linear-gradient(180deg,rgba(7,9,20,.06) 34%,rgba(7,9,20,.14) 62%,rgba(7,9,20,.20) 100%)}
/* 三层同心圆图标：各自图片横竖居中（left:50% / top:50%，三列横向对齐），悬停外环无限扩散脉冲 */
.acc__ic{position:absolute;left:50%;top:50%;z-index:2;transform:translate(-50%,-50%);
display:grid;place-items:center;width:clamp(64px,6vw,86px);aspect-ratio:1;
border-radius:50%;border:1px solid rgba(255,255,255,.34);color:#fff;
transition:transform .6s var(--e-out),border-color .5s var(--e)}
.acc__ic::before{content:'';position:absolute;width:62%;aspect-ratio:1;border-radius:50%;
border:1px solid rgba(255,255,255,.24)}
.acc__ic::after{content:'';position:absolute;inset:-1px;border-radius:50%;opacity:0;
border:1px solid rgba(255,255,255,.55)}
.acc__ic svg{width:38%;height:38%;display:block;transition:transform .6s var(--e-out)}
/* 文字块：贴底；2026-09-29 负责人四修——删掉文字带自己的独立磨砂效果
（深渐变底 + blur(22px) + 顶缘高光线 + 无障碍实色兜底全部移除），
文字直接坐在整图磨砂（.acc__img::after）上，只保留定位与内边距 */
.acc__bd{position:absolute;left:0;right:0;bottom:0;z-index:2;color:#fff;
padding:clamp(24px,3vh,34px) clamp(18px,1.8vw,28px) 24px}
.acc__t{font-size:clamp(20px,1.9vw,26px);font-weight:300;letter-spacing:.01em;color:#fff;
white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
text-shadow:0 2px 14px rgba(7,9,20,.55);
transform-origin:left bottom;transition:transform .35s cubic-bezier(.4,0,.2,1)}
.acc__d{margin-top:12px;font-size:13px;font-weight:300;letter-spacing:.04em;color:rgba(255,255,255,.86);
white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 10px rgba(7,9,20,.5);
opacity:0;transform:translateY(10px);transition:opacity .3s ease .1s,transform .3s ease .1s}
/* 产品体系手风琴：整块面板（图+图标+文字）点击跳转二级栏目 */
.acc__hit{position:absolute;inset:0;z-index:3}/* 2026-09-22：全幅透明点击层，图/图标/文字任意处均可跳转（面板内最高层 z2 之上） */
@media (hover:hover){
.acc:hover .acc__p:not(:hover) .acc__img{filter:brightness(.78) saturate(.9)}
.acc__p:hover .acc__ic{border-color:rgba(255,255,255,.66);transform:translate(-50%,-50%) scale(1.07)}
.acc__p:hover .acc__ic svg{transform:scale(1.08)}
.acc__p:hover .acc__ic::after{animation:accPulse 1.3s linear infinite}
.acc__p:hover .acc__t{transform:scale(1.1)}
.acc__p:hover .acc__d{opacity:1;transform:none}
}
@keyframes accPulse{
0%{opacity:.85;transform:scale(1)}
100%{opacity:0;transform:scale(1.5)}}
@media (hover:none){.acc__d{opacity:1;transform:none}}
@media (max-width:820px){
/* 小屏：栏高回落自然流式，避免 90vh 撑出大空白 */
.pillars,.scenes,.latt,.news{min-height:auto}
.pillars__in,.scenes__in,.latt__in,.news__in{display:block}
.acc,.solve,.orb{flex:none}
/* 小屏：手风琴解排为纵向通栏堆叠（0 圆角保持，12px 缝分隔） */
.acc{flex-direction:column;gap:12px;height:auto}
.acc .acc__p,.acc:not(:hover) .acc__p,.acc:hover .acc__p:not(:hover){flex-grow:0;flex-basis:auto}
.acc__p{height:238px;flex:0 0 auto}
.acc__t{font-size:19px}
.acc__ic{width:60px;top:50%}
}
/* ============================================================
04 · SCENES —— 解决方案：错落网格（悬停聚焦 · 图片推近）
============================================================ */
.scenes{position:relative;z-index:2;background:var(--bg);padding:clamp(84px,13vh,164px) var(--pad) clamp(80px,11vh,140px)}
.scenes__in{position:relative;max-width:var(--maxw);margin:0 auto}
/* 栏目高度：每栏至少占屏高 90%；内容器垂直居中，主视觉拉伸填满剩余空间 */
.pillars,.scenes,.latt,.news{min-height:90vh;display:flex;flex-direction:column}
.pillars__in,.scenes__in,.latt__in,.news__in{flex:1 1 auto;width:100%;display:flex;flex-direction:column;justify-content:center}
.head,.solve,.orb{width:100%}
.acc{flex:1 1 auto;height:auto;min-height:clamp(420px,54vh,520px)}
.solve{flex:0 0 auto}
.orb{flex:1 1 auto;height:auto;min-height:clamp(540px,72vh,680px)}
.news__list{flex:1 1 auto;display:flex;flex-direction:column}
.ncard{flex:1 1 auto;display:flex}
.ncard>a{flex:1}
/* 视频底图四切幕：整幅底图循环播放，四列等分以 1px 细线分割，悬停列罩白色磨砂玻璃；
图标为“加深”的白色线性、标题加大居中（参考 gigadevice 可持续发展屏） */
.solve{position:relative;max-width:var(--maxw);margin:0 auto;height:clamp(500px,64vh,640px);
border-radius:var(--rad);overflow:hidden;background:#0a0c18;
box-shadow:0 34px 90px rgba(14,16,32,.2);display:flex;flex-direction:column}
.solve__vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
/* 沉墨纱幕：保证白字与细线在视频上可读 */
.solve__veil{position:absolute;inset:0;z-index:1;pointer-events:none;
background:linear-gradient(180deg,rgba(8,10,20,.7),rgba(8,10,20,.4) 44%,rgba(8,10,20,.72)),
radial-gradient(ellipse 120% 90% at 50% 40%,transparent 42%,rgba(8,10,20,.42))}
/* 标题移出视频：杂志式区块头（深色细体，与产品/技术栏一致） */
.solve__hd{position:relative;z-index:2;max-width:var(--maxw);margin:0 auto clamp(30px,4.6vh,50px);text-align:left}
.solve__t{font-size:clamp(30px,4.6vw,58px);font-weight:300;letter-spacing:-.028em;line-height:1.04;color:var(--ink)}
/* 副标题桌面端单行显示（不换行）；窄屏兜底允许换行防横向溢出 */
.solve__sub{margin-top:18px;font-size:15.5px;line-height:1.7;color:var(--ink-2);max-width:none;white-space:nowrap}
/* 2026-11-03 点名（「自动适配所有终端」体检）：兜底断点原为 760，正好漏掉 iPad 竖屏 768 这一档——nowrap 把 49 个中文字钉成一条 760px 的硬行，
而行盒左边距 38px + 760 = 798，整页横向溢出 45px（可左右拖动）。线上 iframe 逐档实测溢出窗口＝761…855：761→52px、768→45px、800→15px、860 档差 1px 中招，
直到内容盒≥760（即视口 880 档内容盒 777）才彻底不溢出。故把换行兜底从 760 抬到 880，覆盖 iPad 竖屏(768)/iPad mini 横屏(768)/小窗口笔记本等全部中间档；
>880 的桌面档仍保持单行不换行的原设计（1024/1280 实测内容盒 907/1137，富余充足）。同一 nowrap 空档也存在于 216 行 .pillars/.latt 的 flex-wrap 兜底，
但那两处是 flex 容器换行、子项会压缩而非撑宽，逐档实测 docOv=0，故本轮不动，避免无谓改变窄屏两栏头部排布 */
@media (max-width:880px){.solve__sub{white-space:normal}}
/* 悬停叠加：全屏原业务图（视频之上、列内容之下）+ 沉墨纱幕；列内白磨砂玻璃保留 */
.solve__pics{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.solve__pic{position:absolute;inset:0;background-size:cover;background-position:center;
opacity:0;transform:scale(1.05);transition:opacity .5s var(--e),transform 1.2s var(--e-out)}
.solve__pic.is-on{opacity:1;transform:none}
/* 2026-09-29 OPPO 兜底：窄屏每列业务底图的语义 ![]()
版本（ColorOS 强暗色只剥 CSS
background-image 不剥真图）；桌面不参与悬停切换逻辑，常驻隐藏 */
.solve__colbg{display:none}
.solve__pics::after{content:'';position:absolute;inset:0;opacity:0;transition:opacity .5s var(--e);
background:linear-gradient(180deg,rgba(8,10,20,.7),rgba(8,10,20,.42) 46%,rgba(8,10,20,.72))}
.solve__pics.is-on::after{opacity:1}
/* 四列：细线等分，悬停列白玻璃（15% 白 + blur 6px，与参考站同参数） */
.solve__grid{position:relative;z-index:3;flex:1 1 auto;display:grid;grid-template-columns:repeat(4,1fr);margin-top:0}
.solve__col{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;
text-align:center;padding:clamp(22px,3.2vh,36px) clamp(14px,1.5vw,26px) clamp(26px,4vh,44px)}
.solve__col + .solve__col{border-left:1px solid rgba(255,255,255,.45)}
.solve__col::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
background:rgba(255,255,255,.15);
-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
opacity:0;transition:opacity .36s}
@media (hover:hover){.solve__col:hover::before{opacity:1}}
/* 加深白色线性图标：绝对定位于各列图片横竖居中（四列横向对齐）、纯白、带投影压住亮部，悬停微升；文字块沉底 */
.solve__ic{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:1;display:block;color:#fff;
filter:drop-shadow(0 2px 10px rgba(6,8,18,.5));
transition:opacity .4s,transform .65s var(--e-out)}
.solve__ic svg{width:clamp(54px,5.2vw,82px);height:clamp(54px,5.2vw,82px);display:block}
.solve__col:hover .solve__ic{transform:translate(-50%,-50%) translateY(-4px)}
.solve__n{position:relative;z-index:1;margin-top:clamp(15px,2vh,22px);
font-size:clamp(19px,1.7vw,25px);font-weight:300;letter-spacing:-.01em;color:#fff;
text-shadow:0 1px 14px rgba(6,8,18,.5)}
.solve__d{position:relative;z-index:1;margin-top:15px;font-size:13px;line-height:1.7;
color:rgba(255,255,255,.76);max-width:27ch;min-height:3.4em}
.solve__tags{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:14px}
.solve__tags i{font-style:normal;font-size:10.5px;font-weight:300;color:rgba(255,255,255,.8);
border:1px solid rgba(255,255,255,.26);border-radius:100px;padding:4px 11px;background:rgba(255,255,255,.09);
-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
transition:border-color .45s,color .45s,background-color .45s}
.solve__col:hover .solve__tags i{border-color:rgba(255,255,255,.62);color:#fff;background:rgba(255,255,255,.22)}
@media (max-width:1100px){
.solve{height:auto}
.solve__grid{grid-template-columns:1fr 1fr}
.solve__col{padding:30px 22px 34px}
/* 窄屏：图标回文流块首，避免 auto 列高下与文字重叠 */
.solve__ic{position:relative;left:auto;top:auto;transform:none}
.solve__col:hover .solve__ic{transform:translateY(-4px)}
.solve__col + .solve__col{border-left:0}
.solve__col:nth-child(even){border-left:1px solid rgba(255,255,255,.32)}
.solve__col:nth-child(n+3){border-top:1px solid rgba(255,255,255,.32)}
/* 2026-09-29 负责人反馈手机端串位+微信视频不播：桌面版“整版块一条大视频/悬停大图”
在纵排网格里被 inset:0 拉成跨所有行的整张底，四标题浮在同一张图上＝串位，
微信挡自动播时又只剩静帧。窄屏不再铺整块视频：隐藏 vid/veil/pics，
每列自带各自业务图（复用悬停图素材）+ 深纱幕保白字可读 */
.solve__vid,.solve__veil,.solve__pics{display:none}
.solve__col{min-height:clamp(180px,26vh,240px);background-color:rgba(16,19,36,.92);background-size:cover;background-position:center}
/* OPPO 兜底图：铺满列、cover 裁切，压在纱幕与文案之下（三层：img z0 → ::before z1 → ic/n z2） */
.solve__colbg{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.solve__ic,.solve__n{z-index:2}
.solve__col:nth-child(1){background-image:url(../../images/sol-consumer-h6.jpg?v=20260930a)}/* 2026-09-30 随首页 solve__pics 同批换图 h5→h6（四次换图） */
.solve__col:nth-child(2){background-image:url(../../images/sol-iot-h.jpg?v=20260922c)}
.solve__col:nth-child(3){background-image:url(../../images/sol-industrial-h2.jpg?v=20261102a)}/* 2026-11-02 点名：首页工业终端列换客户新图（窄屏兜底随 HTML 两处同批换），旧 sol-industrial-h.jpg 留站回滚 */
.solve__col:nth-child(4){background-image:url(../../images/sol-embodied-h2.jpg?v=20261102b)}/* 2026-11-02 点名：首页具身智能列背景图左右镜向，随 HTML 两处同批换镜向图；旧 sol-embodied-h.jpg 留站回滚 */
/* 2026-10-21 点名（「手机端遮罩删除」）：去掉窄屏深纱幕，图片原色直出 */
.solve__col::before{display:none}
}
@media (max-width:680px){
.solve__grid{grid-template-columns:1fr}
.solve__col + .solve__col{border-left:0;border-top:1px solid rgba(255,255,255,.3)}
.solve__col:nth-child(even){border-left:0}
.solve__col:nth-child(n+3){border-top:1px solid rgba(255,255,255,.3)}
.solve__d{max-width:34ch}
}
/* ============================================================
05 · LATTICE —— 六大技术：晶圆墙（悬停磨砂点亮）
============================================================ */
.latt{position:relative;z-index:2;background:var(--bg-2);padding:clamp(84px,13vh,164px) var(--pad) clamp(76px,11vh,140px);overflow:hidden}
.latt::before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.7;
background-image:radial-gradient(rgba(14,16,32,.1) 1px,transparent 1px);background-size:34px 34px;
-webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 42%,#000 10%,transparent 74%);
mask-image:radial-gradient(ellipse 70% 60% at 50% 42%,#000 10%,transparent 74%)}
.latt__in{position:relative;z-index:1;max-width:var(--maxw);margin:0 auto}
/* 六列晶圆墙：全宽等分浅调图墙，悬停磨砂玻璃升起 + 图标浮现 */
.wall{position:relative;display:grid;grid-template-columns:repeat(6,1fr);
height:clamp(460px,64vh,620px);
margin:clamp(40px,6vh,64px) calc(var(--pad) * -1) 0;
border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2)}
.wall__col{position:relative;overflow:hidden;border-radius:var(--rad)}
.wall__col + .wall__col{box-shadow:inset 1px 0 0 rgba(255,255,255,.16)}
.wall__media{position:absolute;inset:0}
.wall__media img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.02);
filter:grayscale(0) contrast(1.02) brightness(.96) saturate(1.15);
transition:filter 1.1s var(--e),transform 1.8s var(--e-out)}
/* 底部沉墨蒙版：仅压暗下半保证白字可读，上半透出图片色彩 */
.wall__media::after{content:'';position:absolute;inset:0;opacity:1;
background:linear-gradient(180deg,rgba(7,9,20,.1),rgba(7,9,20,.3) 46%,rgba(7,9,20,.7));
transition:opacity .8s var(--e)}
/* 深色磨砂玻璃：悬停自下升起 */
.wall__col::before{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
background:rgba(10,12,26,.46);
-webkit-backdrop-filter:blur(20px) saturate(1.3);backdrop-filter:blur(20px) saturate(1.3);
opacity:0;transform:translateY(100%);
transition:transform .9s var(--e-out),opacity .5s var(--e)}
.wall__col:hover::before{opacity:1;transform:none}
.wall__col:hover .wall__media::after{opacity:.5}
.wall__col:hover .wall__media img{filter:grayscale(0) contrast(1.02) brightness(1.02) saturate(1.15);transform:scale(1.06)}
.wall__cap{position:absolute;left:0;right:0;bottom:0;z-index:2;display:flex;flex-direction:column;align-items:center;
text-align:center;padding:0 clamp(10px,1.3vw,20px) clamp(26px,3.6vh,40px);pointer-events:none;
transition:transform .85s var(--e-out)}
.wall__col:hover .wall__cap{transform:translateY(-8px)}
.wall__ic{display:inline-flex;width:44px;height:44px;align-items:center;justify-content:center;color:#fff;
background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.26);border-radius:14px;margin-bottom:14px;
box-shadow:0 10px 26px rgba(0,0,0,.3),0 1px 0 rgba(255,255,255,.16) inset;
-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
opacity:0;transform:translateY(16px) scale(.88);
transition:opacity .5s var(--e),transform .75s var(--e-out)}
.wall__col:hover .wall__ic{opacity:1;transform:none}
.wall__ic svg{width:22px;height:22px}
.wall__cap h3{font-size:clamp(13.6px,1.12vw,16.4px);font-weight:300;letter-spacing:-.01em;color:#fff;line-height:1.34}
.wall__cap em{display:block;margin-top:7px;font-style:normal;font-weight:300;
font-size:clamp(8.4px,.6vw,9.8px);letter-spacing:.15em;color:rgba(255,255,255,.5);text-transform:uppercase;
transition:color .5s}
.wall__col:hover .wall__cap em{color:#dcc0ff}
.wall__cap p{margin-top:12px;max-width:29ch;font-size:12.6px;line-height:1.66;color:rgba(255,255,255,.78);
opacity:0;transform:translateY(10px);
transition:opacity .5s var(--e) .05s,transform .7s var(--e-out) .05s}
.wall__col:hover .wall__cap p{opacity:1;transform:none}
/* 轨道式技术星环（参考图重制·无底色）：中心芯片悬浮 + 双发光环/小白点动效 + 六技术可点击 */
.orbit{--oc:#2fb9ec;--oc-soft:rgba(56,198,244,.6);--oc-glow:rgba(56,198,244,.4);
position:relative;max-width:1040px;margin:clamp(36px,6vh,60px) auto 0;aspect-ratio:16/9}
/* 环境光晕：模拟参考渲染图的柔光（非底色块） */
.orbit::before{content:'';position:absolute;left:50%;top:50%;width:72%;height:86%;transform:translate(-50%,-50%);
background:radial-gradient(ellipse at center,rgba(140,225,252,.14),rgba(56,198,244,.06) 46%,transparent 72%);
filter:blur(12px);pointer-events:none}
/* 两圈发光椭圆环：呼吸脉动 */
.orbit__ring{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;
border:1.5px solid rgba(150,225,252,.7);
box-shadow:0 0 14px var(--oc-glow),0 0 30px var(--oc-glow),inset 0 0 18px rgba(56,198,244,.22);
animation:ringPulse 5s ease-in-out infinite}
.orbit__ring--1{width:80%;height:70%}
.orbit__ring--2{width:56%;height:47%;animation-delay:1.4s}
@keyframes ringPulse{0%,100%{opacity:.5}50%{opacity:1}}
/* 小白点与流动光带：offset-path 沿椭圆轨道运动（与两环重合、无变形） */
.orbit__path{position:absolute;inset:0;pointer-events:none}
.orbit__dot,.orbit__comet{position:absolute;left:0;top:0;
offset-path:ellipse(40% 35% at 50% 50%);offset-rotate:0deg;
animation:orbRun 16s linear infinite}
.orbit__dot{width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-radius:50%;
background:#fff;box-shadow:0 0 12px 3px var(--oc-soft);
animation:orbRun 16s linear infinite,dotTw 2.6s ease-in-out infinite}
.orbit__comet{width:74px;height:3px;margin:-1.5px 0 0 -37px;border-radius:3px;offset-rotate:auto;
background:linear-gradient(90deg,transparent,rgba(160,230,255,.55) 45%,rgba(255,255,255,.95));
filter:drop-shadow(0 0 6px rgba(190,240,255,.95)) drop-shadow(0 0 14px rgba(56,198,244,.6))}
.orbit__path--2 .orbit__comet{offset-path:ellipse(28% 23.5% at 50% 50%);
animation-duration:11s;animation-direction:reverse}
.orbit__path--2 .orbit__dot{offset-path:ellipse(28% 23.5% at 50% 50%);
animation-duration:11s,2.6s;animation-direction:reverse,normal}
@keyframes orbRun{from{offset-distance:0%}to{offset-distance:100%}}
@keyframes dotTw{0%,100%{opacity:.35}50%{opacity:1}}
@supports not (offset-path:ellipse(1px 1px at 50% 50%)){
.orbit__dot,.orbit__comet{display:none}
}
/* 2026-09-29 负责人 OPPO 截图：核心技术环上六枚 Icon 整体消失——老内核不支持
offset-path:ellipse() 时六块全部堆在舞台左上角 0,0（.orb__sat 是 0×0 锚点）；
与 .orbit__dot 同口径隐藏脱轨节点兜底。只藏 .orb__node 不藏整块：
手机端文案由 JS 移入环下 .orb__list 常驻，须保住可读（demo03.js 轮播只切类，无碍） */
@supports not (offset-path:ellipse(1px 1px at 50% 50%)){
.orb__sat .orb__node{display:none}
}
/* 金属底座：芯片下方的银色圆形平台（静止，不随悬浮） */
.orbit__base{position:absolute;left:50%;top:50%;width:46%;height:24%;transform:translate(-50%,-38%);border-radius:50%;
background:linear-gradient(180deg,#ffffff,#eef5fa 30%,#c9d8e3 52%,#f4f9fc 78%,#dbe5ed);
box-shadow:inset 0 2px 5px rgba(255,255,255,.95),inset 0 -6px 12px rgba(130,150,170,.28),0 14px 34px rgba(56,130,180,.16);
pointer-events:none}
.orbit__base::before{content:'';position:absolute;inset:12% 8%;border-radius:50%;
border:1px solid rgba(140,160,180,.4);
background:radial-gradient(ellipse at center,rgba(140,225,252,.35),rgba(255,255,255,.1) 60%,transparent 75%)}
/* 中心悬浮芯片：等距玻璃叠层 + 上下浮动 + 地面光晕 */
.orbit__core{position:absolute;left:50%;top:50%;width:27%;aspect-ratio:1;perspective:900px;
transform:translate(-50%,-50%);animation:coreFloat 6s ease-in-out infinite}
.orbit__core::after{content:'';position:absolute;left:50%;bottom:-16%;width:130%;height:26%;
transform:translateX(-50%);filter:blur(6px);
background:radial-gradient(ellipse at center,var(--oc-glow),transparent 70%);
animation:coreShadow 6s ease-in-out infinite}
.chip{position:absolute;inset:6%;transform-style:preserve-3d;transform:rotateX(56deg) rotateZ(45deg)}
.chip__l,.chip__face{position:absolute;display:block;border-radius:16%}
.chip__l{inset:0;background:linear-gradient(135deg,rgba(56,198,244,.2),rgba(120,220,250,.1));
border:1px solid rgba(190,240,255,.85);box-shadow:0 0 30px var(--oc-glow)}
.chip__l--0{transform:translateZ(-12px);border-radius:18%;
background:linear-gradient(135deg,rgba(18,110,160,.45),rgba(40,160,210,.32));
border:1px solid rgba(90,190,230,.7);box-shadow:0 0 24px var(--oc-glow)}
.chip__l--1{transform:translateZ(0)}
/* 引脚梳：挂在底板两侧 */
.chip__l--0::before,.chip__l--0::after{content:'';position:absolute;top:8%;bottom:8%;width:10%;
background:repeating-linear-gradient(to bottom,rgba(190,235,252,.95) 0 3px,transparent 3px 8px)}
.chip__l--0::before{left:-12%}
.chip__l--0::after{right:-12%}
.chip__l--2{inset:9%;transform:translateZ(16px);
background:linear-gradient(115deg,transparent 42%,rgba(255,255,255,.5) 47%,transparent 55%),
linear-gradient(135deg,rgba(70,205,248,.34),rgba(150,230,252,.18))}
.chip__l--3{inset:20%;transform:translateZ(32px);
background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.6) 46%,transparent 56%),
linear-gradient(135deg,rgba(120,225,252,.5),rgba(210,245,255,.28));box-shadow:0 0 40px var(--oc-soft)}
.chip__face{inset:32%;transform:translateZ(46px);border-radius:12%;
background:linear-gradient(135deg,#bfeeff,#7fd8f5);
box-shadow:0 0 46px var(--oc-soft),inset 0 0 18px rgba(255,255,255,.7)}
@keyframes coreFloat{0%,100%{transform:translate(-50%,-50%) translateY(0)}50%{transform:translate(-50%,-50%) translateY(-14px)}}
@keyframes coreShadow{0%,100%{opacity:.85;transform:translateX(-50%) scale(1)}50%{opacity:.45;transform:translateX(-50%) scale(.86)}}
/* 六个可点击技术节点 */
.orbit__node{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);z-index:3;
display:flex;flex-direction:column;align-items:center;gap:8px;border:0;background:none;cursor:pointer;
font:inherit;color:var(--ink-2);padding:4px}
.orbit__nic{position:relative;display:grid;place-items:center;width:clamp(46px,5vw,64px);aspect-ratio:1;border-radius:50%;color:#fff;
background:radial-gradient(circle at 32% 26%,rgba(210,245,255,.98),rgba(120,215,250,.9) 34%,var(--oc) 68%,#0f9ad6 96%);
box-shadow:0 5px 0 -1px rgba(14,120,170,.5),0 12px 26px var(--oc-glow),
inset 0 2px 5px rgba(255,255,255,.8),inset 0 -7px 12px rgba(8,110,160,.4);
transition:transform .35s var(--e-out),box-shadow .35s}
/* 节点3D发光底座 */
.orbit__nic::after{content:'';position:absolute;left:50%;top:100%;width:150%;height:46%;z-index:-1;
transform:translate(-50%,-58%);border-radius:50%;
background:radial-gradient(ellipse at center,rgba(190,240,255,.7),rgba(56,198,244,.25) 52%,transparent 74%);
box-shadow:0 0 14px rgba(140,225,252,.55)}
.orbit__nic svg{width:52%;height:52%}
.orbit__nl{font-size:clamp(12px,1.15vw,15px);font-weight:300;letter-spacing:.02em;white-space:nowrap}
.orbit__node:hover .orbit__nic,.orbit__node.is-on .orbit__nic{transform:scale(1.12);
box-shadow:0 12px 30px var(--oc-soft),inset 0 1px 0 rgba(255,255,255,.7)}
.orbit__node.is-on .orbit__nl{color:var(--ink)}
.orbit__node:focus-visible{outline:2px solid var(--oc);outline-offset:3px;border-radius:14px}
/* 点击后的技术详情面板 */
.orbit__panel{max-width:720px;margin:clamp(26px,4vh,40px) auto 0;text-align:center;
background:rgba(255,255,255,.6);border:1px solid var(--line-2);border-radius:18px;
-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
padding:clamp(16px,2.4vh,24px) clamp(18px,3vw,32px);box-shadow:var(--sh-1)}
.orbit__pt{font-size:clamp(16px,1.5vw,20px);font-weight:300;color:var(--ink)}
.orbit__pe{display:block;margin-top:4px;font-style:normal;font-size:11.5px;letter-spacing:.16em;color:var(--oc);text-transform:uppercase}
.orbit__pd{margin-top:8px;font-size:13.5px;color:var(--ink-2);line-height:1.7}
@media (max-width:820px){
.orbit{aspect-ratio:1/1}
.orbit__nl{white-space:normal;text-align:center;font-size:11px;max-width:9ch}
}
@media (prefers-reduced-motion:reduce){
.orbit__core,.orbit__core::after,.orbit__dot,.orbit__comet,.orbit__ring{animation:none}
}
/* 核心技术轨道舞台：整幅底图随业务交叉淡入（默认近场通讯），不再斜置
高度下限 540→640（负责人 2026-09-28）：顶/底槽文案块（标题+3行 ≈ 95~105px）需靠椭圆顶点外的余量容纳，
节点 y = 0.2346h（顶）/0.7654h（底），h<620 时顶槽标题首行被 .orb 的 overflow:hidden 切掉（窗口变矮同样触发） */
.orb{position:relative;max-width:var(--maxw);margin:clamp(40px,6vh,64px) auto 0;height:clamp(640px,72vh,680px);
border-radius:var(--rad);overflow:hidden;box-shadow:0 24px 70px rgba(14,16,32,.12)}
.orb__bgs,.orb__bg{position:absolute;inset:0}
.orb__bg{background-size:cover;background-position:center;
opacity:0;transition:opacity 1.1s var(--e)}
.orb__bg.is-on{opacity:1}
/* 中性半透明灰遮罩：压暗底图让轨道文字更凸显（加深档）；hover 时遮罩隐去、文字转墨色（触屏常驻保证可读）。
暗色底图（.orb__bg[data-tone=dark]，由 demo03.js 同步到 .orb.is-darktxt）不隐遮罩，见下面 :not(.is-darktxt) 限制 */
.orb::after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
background:rgba(18,20,29,.66);transition:opacity .7s var(--e)}
@media (hover:hover){
.orb:not(.is-darktxt):hover::after{opacity:0}
/* 遮罩隐去后底图转亮：文字统一转墨色，核心玻璃盘转白玻璃 */
.orb:hover .orb__txt h3,.orb:hover .orb__txt.is-on h3{color:var(--ink);text-shadow:0 1px 12px rgba(255,255,255,.85)}
.orb:hover .orb__txt p,.orb:hover .orb__txt.is-on p{color:rgba(14,16,32,.82);text-shadow:0 1px 10px rgba(255,255,255,.8)}
.orb:hover .orb__core{background:rgba(255,255,255,.62);border-color:rgba(255,255,255,.78);
box-shadow:0 26px 64px rgba(14,16,32,.18),inset 0 1px 0 rgba(255,255,255,.85)}
.orb:hover .orb__core span{color:var(--ink)}
}
/* 暗色底图修正（负责人 2026-09-28 截图：转到微系统/算法/传感/高速有线这四张暗图时，hover 墨字压在深底上看不清）。
原 hover 反相的前提是“遮罩隐去后底图转亮”，只对亮底图成立；暗底图必须保持白字 + 常驻遮罩。
口径写在 HTML 的 .orb__bg[data-tone] 上（实测均值亮度见 demo03.html 注释），由 demo03.js 按下标同步到 .orb 类，
因此以后换图只改 HTML 属性值，不动本文件。特异度均高于上面 hover 块与首页内联覆盖，故能压回白字 */
@media (hover:hover){
.orb.is-darktxt:hover .orb__txt h3,.orb.is-darktxt:hover .orb__txt.is-on h3{color:#fff;text-shadow:0 2px 14px rgba(10,8,22,.8),0 0 2px rgba(10,8,22,.6)}
.orb.is-darktxt:hover .orb__txt p,.orb.is-darktxt:hover .orb__txt.is-on p{color:rgba(255,255,255,.97);text-shadow:0 1px 10px rgba(10,8,22,.7),0 0 2px rgba(10,8,22,.5)}
}
.orb__stage{position:relative;z-index:1;height:100%;margin:0 auto}
.latt{padding-top:clamp(48px,7vh,88px)}
.latt__in{flex:0 0 auto}
.latt .head{margin-bottom:clamp(12px,1.8vh,20px)}
.orb{margin-top:clamp(14px,2.4vh,26px)}
/* 卫星槽位：六 Icon 用 CSS 运动路径锁定在与轨道同一椭圆的弧上（offset-path 与 .orb__ring 同基准：rx=88%×35.2%=30.98%W，ry=92%×28.85%=26.54%H）；
轮播换位只补间 offset-distance（弧长参数）→ 动画全程沿轨道滑行，结构上不可能脱离轨道（用户 2026-09-22）；
六槽位参数角 30/90/150/210/270/330° 对应弧长百分比由椭圆积分算出（_tools/orbit-arc.py） */
.orb__sat{position:absolute;left:0;top:0;width:0;height:0;pointer-events:none;
offset-path:ellipse(30.98% 26.54% at 50% 50%);offset-rotate:0deg}
/* 2026-09-29 负责人澄清后重做：transition:offset-distance 已摘——CSS 对跨 100% 边界的补间
不回环、反向横穿全屏（“突然飞过”根源）；环转改由 demo03.js spinTo 逐帧取模驱动（逆时针最短弧、expo-out、1.15s） */
.s0{offset-distance:57.797%}
.s1{offset-distance:75%}
.s2{offset-distance:92.203%}
.s3{offset-distance:7.797%}
.s4{offset-distance:25%}
.s5{offset-distance:42.203%}
.orb__pin{position:absolute;left:0;top:0;width:0;height:0}/* sat 已是 0×0 锚点，pin 叠在同一轨道点上，node/txt 继续以此为包含块 */
/* 单椭圆轨道线（与六 Icon 卫星环同轴）+ 多枚不等速加速巡航光点（scaleY 压扁旋转圆 → 椭圆轨迹，仅动 transform） */
.orb__ring{position:absolute;left:6%;top:4%;width:88%;height:92%}/* 显式宽高：SVG 替换元素用 inset 时高度按固有比例收缩（viewBox 1000:520）致椭圆中心偏上，与核心不同心；强制拉伸后椭圆中心=舞台中心=核心中心 */
.orb__e{fill:none;stroke:rgba(255,255,255,.42);stroke-width:1.6}
.orb__orbit{position:absolute;left:50%;top:50%;width:63.4%;aspect-ratio:1;
transform:translate(-50%,-50%) scaleY(.426)}/* 光点轨迹与单轨同轴：rx 31.7%W ≈ 轨道 30.98%，ry ≈ 28.6%H ≈ 轨道 26.54% */
/* 多速度加速转圈：三个转速/方向不同的光点与光弧（ease-in 逐圈加速） */
.orb__spin{position:absolute;inset:0;display:block}
.orb__spin i{position:absolute;left:50%;top:0;width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;
background:#fff;box-shadow:0 0 14px 2px rgba(255,255,255,.5)}
.orb__spin--a{animation:orbSpin 24s cubic-bezier(.42,0,1,1) infinite}
.orb__spin--b{animation:orbSpinB 16s cubic-bezier(.5,0,1,1) infinite}
.orb__spin--b i{width:9px;height:9px;margin:-4.5px 0 0 -4.5px;background:rgba(255,255,255,.88);
box-shadow:0 0 10px 2px rgba(255,255,255,.38)}
@keyframes orbSpin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes orbSpinB{from{transform:rotate(360deg)}to{transform:rotate(0deg)}}
/* 中心「核心技术」椭圆核：磨砂蒙版玻璃（去紫底，透背景图模糊质感） */
.orb__core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
width:clamp(190px,27vw,310px);height:clamp(88px,12.5vw,140px);border-radius:50%;
display:flex;align-items:center;justify-content:center;
background:rgba(12,10,24,.45);border:1px solid rgba(255,255,255,.2);
-webkit-backdrop-filter:blur(18px) saturate(1.25);backdrop-filter:blur(18px) saturate(1.25);
box-shadow:0 26px 64px rgba(14,16,32,.35),inset 0 1px 0 rgba(255,255,255,.16);
transition:background-color .6s var(--e),border-color .6s var(--e),box-shadow .6s var(--e)}
.orb__core span{color:#fff;font-size:clamp(20px,2.5vw,30px);font-weight:300;letter-spacing:.2em;text-indent:.2em;transition:color .6s var(--e)}
/* 业务节点：默认透暗底+白图标，悬停/轮播到位变白底+墨色图标并放大（全中性，无紫） */
.orb__node{position:absolute;left:0;top:0;transform:translate(-50%,-50%);pointer-events:auto;
width:clamp(46px,4.6vw,58px);aspect-ratio:1;border:0;border-radius:50%;cursor:pointer;
display:flex;align-items:center;justify-content:center;color:#fff;
background:rgba(14,16,32,.4);
box-shadow:0 0 0 1.5px rgba(255,255,255,.8),0 8px 22px rgba(14,16,32,.28);
transition:transform .5s var(--e-out),box-shadow .5s var(--e),background .45s var(--e),color .45s}
.orb__node svg{width:56%;height:56%}
.orb__node:hover,.orb__node.is-on{color:#0e1020;transform:translate(-50%,-50%) scale(1.18);
background:#fff;
box-shadow:0 0 0 7px rgba(255,255,255,.16),0 10px 26px rgba(14,16,32,.32)}
.orb__node:focus-visible{outline:2px solid #fff;outline-offset:3px}
.orb__node.is-hit{animation:orbHit .9s var(--e-out)}
@keyframes orbHit{
0%{filter:brightness(1)}
40%{filter:brightness(1.35)}
100%{filter:brightness(1)}}
/* 业务文案块：随槽位朝向展开；轮播未到 0.61（非选中清晰可读但比选中暗两档，负责人 2026-09-23），到位全显 */
.orb__txt{position:absolute;left:0;top:0;pointer-events:auto;
width:clamp(140px,19vw,300px);opacity:.61;transition:opacity .6s var(--e);
display:flex;flex-direction:column}
.orb__txt.is-on{opacity:1}
/* 槽位朝向：左半槽文案向左、右半槽向右、顶槽在上、底槽在下；小字全部左对齐（负责人 2026-09-23），
左半槽标题用 align-items 靠右保持朝向；外偏距离随视口收缩（避免窄屏出画被裁）；舞台不再斜置，文字直接水平排布 */
.s0 .orb__txt,.s5 .orb__txt{text-align:right;align-items:flex-end;transform:translate(calc(-100% - max(18px,2.2vw)),-14%)}
.s2 .orb__txt,.s3 .orb__txt{text-align:left;transform:translate(max(18px,2.2vw),-14%)}
.s1 .orb__txt{text-align:center;transform:translate(-50%,calc(-100% - 40px))}/* 上留白同越过钮半径（最大~34px），28px 会压钮 */
.s4 .orb__txt{text-align:center;transform:translate(-50%,46px)}/* 下偏需越过圆钮半径（最大~34px 选中放大态）；58→46 为底槽 3 行文案腾出竖向余量（负责人 2026-09-28，46 仍不压钮） */
.orb__txt h3{font-size:clamp(18px,1.75vw,24px);font-weight:300;letter-spacing:-.01em;color:#fff;
text-shadow:0 1px 10px rgba(10,8,22,.7),0 0 2px rgba(10,8,22,.55)}
/* 2026-11-03 点名（首页 orb 六个技术名要做跳转）：标题文字包 跳 demo03-tech.html 对应那行 .tkx__row。
color:inherit 是关键——本文件对 .orb__txt h3 的配色是一整套状态机（基线白字 / .orb:hover 转 var(--ink) 墨字 / .is-darktxt 与 .is-on 回白字并各带不同 text-shadow），
链接不显式继承就会掉回浏览器默认链接色、把这六套状态全打穿。不加下划线、不改字号字重（负责人只要“能点”，未要求视觉标记）。
padding/margin 互抵：不改变排版位置，但把可点区域从字形本身向外撑开 6×2px，窄槽里也好点中。 */
.orb__txt h3 .orb__lnk{color:inherit;text-decoration:none;padding:2px 6px;margin:-2px -6px;border-radius:4px;
transition:background-color .2s ease}
.orb__lnk:focus-visible{outline:2px solid #fff;outline-offset:2px}/* 与 .orb__node:focus-visible 同口径，键盘可达 */
@media (hover:hover){.orb__txt h3 .orb__lnk:hover{background:rgba(255,255,255,.14)}}
.orb__txt h3 .orb__lnk:active{background:rgba(255,255,255,.2)}/* 触屏（hover:none）无悬停态，靠 active 给反馈 */
.orb__txt p{margin-top:10px;font-size:13px;line-height:1.55;color:rgba(255,255,255,.86);text-align:left;
text-shadow:0 1px 8px rgba(10,8,22,.6),0 0 2px rgba(10,8,22,.5);
display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}
/* 顶/底槽：竖向只容 3 行（超出会被 .orb overflow:hidden 切），但横向余量极大（盒宽 266 时两侧各空 489px），
所以钳 3 行 + 靠下方媒体查询放宽盒宽来保证 3 行装得下全文；侧槽（s0/s2/s3/s5）下方余量 ≥124px，放开到 6 行全文显示 */
.s1 .orb__txt p,.s4 .orb__txt p{-webkit-line-clamp:3}
/* 窄屏修正（负责人 2026-09-28：屏幕变小后红框文字被省略号截掉）：
19vw 盒宽在视口 <1475px 时低于 280px，六条中最长两条（多维算法 64 字、端侧存储 69 字）3 行装不下；
侧槽受轨道几何限制无法再宽（再宽就超出舞台左/右边被裁），而顶/底槽居中、横向不受限，
所以只给顶/底槽放宽到 ≥300px（实测 300px@13px 六条全文均 ≤3 行），大屏 ≥1475px 保持原样不动 */
@media (max-width:1474px){
.s1 .orb__txt,.s4 .orb__txt{width:clamp(300px,24vw,350px)}
}
/* 极窄带 821~950px（再窄就走 ≤820px 竖排回退）：椭圆rx 占舞台 30.98%，侧槽节点距舞台左边只剩 ~178px，
19vw 盒 + max(18px,2.2vw) 外偏会让文案块贴边/超出 0~2px 被 overflow:hidden 切掉字左沿；
此处同时收窄外偏（18~22px→10px，仍不压钮半径 23~29px）与盒宽（19vw→18vw） */
@media (max-width:950px){
.orb__txt{width:clamp(140px,18vw,300px)}
.s0 .orb__txt,.s5 .orb__txt{transform:translate(calc(-100% - 10px),-14%)}
.s2 .orb__txt,.s3 .orb__txt{transform:translate(10px,-14%)}
}
/* 英文态 orb 出框修复（负责人 2026-09-28 截图：顶/底槽文字显示到框外、中心白字串出紫核）。
中文几何是定板不动，只针对拉丁文案做三件事，全部锁在 html[lang=en] 里（同 .hero__title 英文降字号的先例）：
1) 顶/底槽横向余量最大（盒宽 266 时两侧各空 ~490px），所以放宽盒宽让长标题排得下 1 行；
2) 标题字号收一档 + 小字收紧行高，把竖向压回顶槽 120px / 底槽 114px 预算内；
3) 中心核椭圆 310×140 在字高 ±48px 处的内接可用宽只剩 ~226px，中文 30px/字距 6px 的“核心技术”单行能装下，
“Core Technology” 必须降字号降字距才能整行落在椭圆内接区。
⚠ 全部规则必须包在 min-width:821px 里：≤820px orb 放弃椭圆改两列静态网格（见 .orb__txt{position:static;width:auto} 那条），
而本块带 html[lang=en] 前缀的特异度 (0,3,1) 会压过回退里的 .s1 .orb__txt (0,2,0) —— 实测 800px 时六格被强塞 360px 盒宽，
右沿超出单元格 47px 被裁，且 -webkit-line-clamp:4 压过回退的 20 行导致英文少一行（2026-09-28 自查出的回归）。 */
@media (min-width:821px){
html[lang=en] .orb__txt h3{font-size:clamp(16px,1.35vw,21px);line-height:1.22}
html[lang=en] .orb__txt p{margin-top:8px;font-size:12.5px;line-height:1.5;-webkit-line-clamp:8}/* 侧槽（s0/s2/s3/s5）中文 6 行够，英文最长一条（多维算法 ~250 字符）在 1366 下要 7 行；侧槽下方实测空 308px，放宽到 8 行仍不出框；顶/底槽由下面更特异度的规则收回 4 行 */
html[lang=en] .s1 .orb__txt,html[lang=en] .s4 .orb__txt{width:clamp(360px,40vw,640px)}
/* 顶/底槽英文小字：中文 69 字 3 行能装下，英文对应 ~250 字符会被 3 行钳位截掉一行（实测 tr19）；
放宽盒宽后竖向预算（顶槽 120px）还能再容一行 → 英文给 4 行，实测 h3 单行 19.5 + 8 + 4×18.75 = 102.5 ≤ 120 */
html[lang=en] .s1 .orb__txt p,html[lang=en] .s4 .orb__txt p{-webkit-line-clamp:4}
html[lang=en] .orb__core span{font-size:clamp(15px,1.55vw,24px);letter-spacing:.06em;text-indent:.06em}
}
/* 821~1100px 笔电/小窗口带：椭圆几何不变但侧槽盒宽只剩 18~19vw（148~195px），250 字符的英文小字在上面 8 行钳位下
仍被截 2~3 行（实测 1024 tr38/tr19、900 tr38/tr56/tr56/tr19）。侧槽左右已贴到 orb 边缘（实测 L=-3~-19）无法再放宽，
只能改字号/行高这一侧：11.5px/1.45 下同样的内容行数从 10~11 降到 9~10，而 9~10×16.7 ≈ 8×18.75，
文案块总高几乎不变 → 补全断行的同时不会把下沿顶出 orb（顶/底槽预算 0.2346h-40 在 h=640 时只有 110px，故同时给到 5 行钳位保险）。 */
@media (min-width:821px) and (max-width:1100px){
html[lang=en] .orb__txt h3{font-size:15px;line-height:1.2}
html[lang=en] .orb__txt p{font-size:11.5px;line-height:1.45;-webkit-line-clamp:11}
/* 顶/底槽居中、横向余量大（900 时两侧各空 217px）→ 放宽到 520px/58vw 让最长句压到 3 行，回到 110px 竖向预算内 */
html[lang=en] .s1 .orb__txt,html[lang=en] .s4 .orb__txt{width:min(520px,58vw)}
html[lang=en] .s1 .orb__txt p,html[lang=en] .s4 .orb__txt p{-webkit-line-clamp:5}
}
/* 悬停/轮播到位：文字全效提亮（中性白，暗色衬影保可读，去紫）；.is-darktxt 下 hover 同样保持白字 */
.orb__txt.is-on h3,.orb.is-darktxt .orb__txt h3{color:#fff;text-shadow:0 2px 14px rgba(10,8,22,.8),0 0 2px rgba(10,8,22,.6)}
.orb__txt.is-on p,.orb.is-darktxt .orb__txt p{color:rgba(255,255,255,.97);text-shadow:0 1px 10px rgba(10,8,22,.7),0 0 2px rgba(10,8,22,.5)}
@media (max-width:820px){
/* 小屏放弃横排图墙，改一列图卡：图在上、文字在下（无悬停，信息常驻） */
.wall{grid-template-columns:1fr;height:auto;gap:12px;border:0;
margin:clamp(30px,5vh,44px) 0 0}
.wall__col{border-radius:var(--rad);background:var(--bg);box-shadow:0 10px 30px rgba(14,16,32,.07)}
.wall__col + .wall__col{box-shadow:0 10px 30px rgba(14,16,32,.07)}
.wall__media{position:relative;inset:auto;height:198px}
.wall__media img{transform:none;filter:grayscale(0) contrast(1.02) brightness(1) saturate(1.1)}
.wall__media::after{display:none}
.wall__col::before{display:none}
.wall__cap{position:relative;inset:auto;align-items:flex-start;text-align:left;
padding:18px 20px 22px;transform:none}
.wall__col:hover .wall__cap{transform:none}
.wall__ic{opacity:1;transform:none;width:40px;height:40px;margin-bottom:11px;color:var(--vi);
background:var(--vi-wash);border-color:transparent;box-shadow:none;border-radius:12px}
.wall__ic svg{width:20px;height:20px}
.wall__cap h3{font-size:15.5px;color:var(--ink)}
.wall__cap em{margin-top:5px;color:var(--ink-3)}
.wall__cap p{opacity:1;transform:none;max-width:none;margin-top:9px;font-size:12.8px;color:var(--ink-2)}
.wall__tags{opacity:1;transform:none;justify-content:flex-start;margin-top:10px}
.wall__tags i{color:var(--ink-2);border-color:var(--line-2);background:rgba(255,255,255,.7)}
/* 轨道舞台小屏回环（2026-09-29 负责人点名：手机端/微信端要把环形动效找回来，覆盖 09-28“去环平铺”回落）：
环、光点、核心、六枚环上 Icon 全部原样保留（offset-path 百分比基准，自动缩到小舞台）；
六条文案由 JS 移到环下 .orb__list 两列常驻（无 JS 时槽内文案隐藏，轮播本就依赖 JS），
is-on 随轮播高亮；全文可读口径沿用 09-28 穷举探针结论（line-clamp 解除） */
.orb{height:auto;padding:0 0 4px}
.orb__stage{height:min(96vw,430px)}
.orb__core{width:clamp(150px,42vw,190px);height:clamp(66px,17vw,88px)}
.orb__core span{font-size:clamp(15px,4.2vw,20px);letter-spacing:.14em;text-indent:.14em}
.orb__node{width:42px;height:42px}
.orb__sat .orb__txt{display:none}/* 双保险：防无 JS 时槽内文案相对 0×0 锚点乱位 */
.orb__list{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:10px 14px 26px}
.orb__list .orb__txt{position:static;width:auto;transform:none;text-align:left;opacity:.61;
display:flex;flex-direction:column;padding:13px 13px 15px;
border:1px solid rgba(255,255,255,.2);border-radius:14px;background:rgba(14,16,32,.38);
-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.orb__list .orb__txt.is-on{opacity:1;border-color:rgba(255,255,255,.6);background:rgba(255,255,255,.16)}
.orb__list .orb__txt h3{font-size:14px;font-weight:300}
.orb__list .orb__txt p{margin-top:6px;font-size:11.5px;line-height:1.55;-webkit-line-clamp:20}
}
/* ============================================================
06 · NEWS —— 新闻与活动（参照 CATL 官网新闻：头部标题 + 文字「查看更多」，
三列卡片：日期行 / 标题 / 了解更多胶囊按钮 / 底部配图，列间竖向细分割线）
============================================================ */
.news{position:relative;z-index:2;background:#fff;padding:clamp(80px,12vh,150px) var(--pad)}/* 2026-09-22：版块底色变白 */
.news__in{max-width:var(--maxw);margin:0 auto;position:relative}
/* 头部：左大标题 + 右侧纯文字「查看更多」+ 箭头，头部下方通栏细线 */
.news__hd{display:flex;align-items:flex-end;justify-content:space-between;gap:clamp(18px,3vw,48px);
flex-wrap:wrap;padding-bottom:clamp(16px,2.2vh,26px);border-bottom:1px solid var(--line-2)}
.news__t{font-size:clamp(30px,4.6vw,58px);line-height:1.04;letter-spacing:-.028em;font-weight:300}
.news__more{flex:0 0 auto;display:inline-flex;align-items:center;gap:12px;padding:12px 0;
white-space:nowrap;background:none;border-radius:0;color:var(--ink-2);
font-size:14px;font-weight:300;letter-spacing:.02em;transition:color .4s var(--e)}
.news__more .arw{opacity:.85;transition:transform .55s var(--e-out),opacity .4s}
@media (hover:hover){
.news__more:hover{color:var(--ink)}
.news__more:hover .arw{transform:translateX(6px);opacity:1}
}
/* 三列卡片：等分网格，列间 1px 竖向细线；每列 = 日期 → 标题 → 胶囊按钮 → 底部大图 */
.news__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);
border-bottom:1px solid var(--line-2)}
.ncard{position:relative;display:flex;min-width:0}
.ncard + .ncard{border-left:1px solid var(--line-2)}
.ncard>a{display:flex;flex-direction:column;flex:1;
padding:clamp(28px,3.2vw,46px) clamp(20px,2.2vw,36px) clamp(26px,3vw,40px);
transition:background-color .5s var(--e)}
/* 来源行（微信公众号）已按负责人 2026-09-28 指示从三张卡片删除；以下两条规则暂留，日后要恢复只需把 markup 加回 */
.ncard__meta{display:inline-flex;align-items:center;gap:9px;font-size:13.5px;font-weight:300;
color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:.02em}
.ncard__meta svg{width:15px;height:15px;flex:none;color:var(--ink-2)}
/* 标题：细体两行截断（2026-09-28 来源行删除后标题成首子元素，flex 子项 margin 不折叠，原先隔开来源行的 14~22px 上边距归零，顶距由链接 padding 提供） */
.ncard__t{margin-top:0;font-size:clamp(16.5px,1.5vw,20.5px);line-height:1.5;
font-weight:300;letter-spacing:-.012em;color:var(--ink);
display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* 了解更多：浅灰胶囊·墨色字（hover 灰阶加深）；悬停微升起 + 箭头右移 */
.ncard__cta{margin-top:clamp(20px,2.2vw,30px);align-self:flex-start;display:inline-flex;align-items:center;gap:9px;
padding:11px 24px;border-radius:100px;background:var(--bg-3);color:var(--ink);
font-size:13.5px;font-weight:300;letter-spacing:.03em;
transition:transform .5s var(--e-out),box-shadow .5s var(--e),background-color .5s var(--e)}
.ncard__cta .arw{width:16px;transition:transform .5s var(--e-out)}
/* 底部配图：贴列底（margin-top:auto），圆角同全站 --rad；悬停轻推近 */
/* 画框 4/3（负责人 2026-09-26 四次定板：框改回之前大小），裁切不居中盲裁而用 object-position 保主体。
2026-09-28 三图换为客户新图，按新原生比例重定裁切位：
①zjtx 1400x590（2.37:1，4/3 框仅露 56% 宽）芯片核心在 x 16~50%→定 10% 使芯片落在窗中；②uhf 1269x952 恰为 4:3 零裁切→无需定位，走基线默认；③top100 1400x933（1.5:1）奖杯与 ICDIA 标均在左→贴左裁，只切掉右侧水印尾巴 */
.ncard__imgbox{display:block;margin-top:auto;padding-top:clamp(24px,2.8vw,38px)}
.ncard__imgbox img{width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--bg-3);border-radius:var(--rad);
transition:transform .7s var(--e-out)}
.ncard:nth-child(1) .ncard__imgbox img{object-position:10% 50%}
.ncard:nth-child(3) .ncard__imgbox img{object-position:0% 50%}
@media (hover:hover){
.ncard:hover>a{background:rgba(14,16,32,.018)}
.ncard:hover .ncard__cta{transform:translateY(-3px);background:var(--line-2);box-shadow:0 8px 18px rgba(14,16,32,.05)}
.ncard:hover .ncard__cta .arw{transform:translateX(4px)}
.ncard:hover .ncard__imgbox img{transform:scale(1.04)}
}
@media (max-width:960px){
.news__list{grid-template-columns:1fr}
.ncard + .ncard{border-left:0;border-top:1px solid var(--line-2)}
.ncard__imgbox img{aspect-ratio:4/3}
}
@media (max-width:560px){
.ncard>a{padding:24px 2px 28px}
.ncard__t{font-size:16px}
.ncard__cta{padding:10px 20px}
.news__hd{align-items:flex-start}
}
/* ============================================================
07 · INVESTOR —— 投资者关系（圆角不通栏底图面板 + 图上通用 .head 标题/说明（同产品中心左上角）+ 面板内左正文右磨砂玻璃联系卡；强调色按全站锁紫）
============================================================ */
/* 版块头照抄全站通用 .head/.head__t/.head__d（产品中心同款：标题 clamp(30px,4.6vw,58px)/-.045em + 说明 15.5px，左对齐、max-width:var(--maxw) 落在圆角图面板上方左上角，深色文字压浅底 --bg-2）；底图面板不通栏、宽度同版心 max-width:var(--maxw)、四角 20px 圆角、overflow:hidden 裁切——故 bg/scrim 必须写进 .invest__in 内（早前挂 section 层致 inset:0 覆盖整节=通栏） */
.invest{position:relative;z-index:2;background:var(--bg-2);padding:clamp(84px,12vh,150px) var(--pad) clamp(70px,10vh,120px)}
/* 版块头说明（投资者关系 tagline）改为一行：解除通用 .head__d 的 62ch 宽度上限，桌面强制不换行；窄屏（≤820px）回落允许换行避免横向溢出 */
.invest__head .head__d{max-width:none;white-space:nowrap}
@media (max-width:820px){.invest__head .head__d{white-space:normal}}
/* 头部→图面板间距与上方「产品中心」.pillars .head 同值（clamp(30px,4.6vh,50px)），覆盖通用 .head 的 clamp(40px,6vh,72px) 使红框处间距与其它版块一致 */
.invest__head{margin-bottom:clamp(30px,4.6vh,50px)}
.invest__in{position:relative;max-width:var(--maxw);margin:0 auto;overflow:hidden;border-radius:20px;isolation:isolate;min-height:clamp(440px,56vh,580px);display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,400px);gap:clamp(32px,5vw,72px);align-items:center;padding:clamp(40px,5vw,72px)}
.invest__bg{position:absolute;inset:0;z-index:-3;background-size:cover;background-position:center}
/* hover 层（负责人 2026-09-28 改版，取代原 10 条竖 3D 百叶窗）：静止 opacity:0，鼠标滑过面板整块交叉淡入。
为什么不再用百叶窗：两张都是城市夜景但构图不同，竖条各自翻面会把一条天际线劈成错位碎片；淡入 + 轻微回正缩放更贴合这种“同题材不同调”的换图。
取景（v5 图，1600x686 = 2.33:1）：锁定 background-position:50% 10%（值自 v3 起未变，v3/v4/v5 构图同高）。逐行扇扫近白像素定最上细弧顶：v5 = 6.7%、v4 = 5.5%、v3 = 5.5%（均用阈值 195；v5 弧线本身更暗，阈值 230 会漏检到 20.1% 所以不能直接比）。
为什么不能回到居中或 v2 的 20%：面板越扁可见带越窄（带高 f = 图比例/面板比例），top = (1-f)·Y。负责人面板 1789x637 = 2.81:1（f=83.0%）下 10% → 1.7%~84.7%，v5 弧顶上方留 5.0% ≈ 37px；
笔记本极端 1713x504 = 3.4:1（f=68.6%）下 10% → 3.1%~71.7%（弧顶在框内 3.6% ≈ 26px），而 20% 会从 6.3% 起始 → 勉强贴边。
不再往 0% 走是为了不在宽屏上多丢掉底部水面倒影；≤1500 视口下面板 2.22:1 比图更“方”，cover 按高铺满只裁左右 → 竖向 0% 裁切，此值不生效。
触屏（无 hover）与旧版一致：不切换，只看到正面图。 */
.invest__bg--alt{z-index:-2;opacity:0;background-position:50% 10%;transform:scale(1.03);
transition:opacity .8s var(--e),transform 1.6s var(--e)}
/* 遮罩层 .invest__scrim 已按负责人要求删除（2026-09-28）：不再在两张底图上方叠 90° 左浓右淡压暗渐变，hover 图按原图亮度直接呈现。
白字可读性由 .invest__sub / .invest__p 上既有的 text-shadow:0 1px 10px rgba(7,9,20,.5) 承担（静止图本身就暗，不受影响）。 */
@media (hover:hover){
/* 淡入节奏：图 0.8s 完成、缩放 1.6s 尾收（比原百叶窗 2.6s 波浪快，hover 反馈不应让人等） */
.invest__in:hover .invest__bg--alt{opacity:1;transform:scale(1)}
}
/* 磨砂玻璃卡卷帘（负责人 2026-09-26 定第三版，双向滚动驱动）：滚到投资者关系版块停留 1s 后，用 3s 从上往下缓缓打开；滚出版块时 1.6s 反向收回；再滚入重播。
关闭态仅在 JS 给卡片加上 .shade-armed 后生效（无 JS / 触屏 / 减少动效下 JS 不接管，卡片恒为可见）；transform-origin:top 使 scaleY 以顶边为轴像卷帘落下。
开/收不同速的实现：CSS transition 取“新状态”上的时长——打开时命中 .is-open（3s），移除 .is-open 后回到基态（1.6s），无需额外脚本。
曲线用缓入缓出而非全站 --e-out（expo-out）：后者 54% 时间点已展开 98%，“缓缓”会变成“弹开后拖着不动”。 */
html.js .invest__glass.shade-armed{opacity:0;clip-path:inset(0 0 100% 0);transform:scaleY(.55);transform-origin:top center;transition:clip-path 1.6s cubic-bezier(.6,.02,.28,1),transform 1.6s cubic-bezier(.6,.02,.28,1),opacity 1.6s cubic-bezier(.6,.02,.28,1)}
html.js .invest__glass.shade-armed.is-open{opacity:1;clip-path:inset(0 0 0% 0);transform:scaleY(1);transition-duration:3s}
/* 尊重减少动效偏好：hover 层不做过渡与缩放（仍然切换，只是瞬时）；玻璃卡即使 JS 误接也强制回到可见终态 */
@media (prefers-reduced-motion:reduce){
.invest__bg--alt{transition:none;transform:none}
html.js .invest__glass.shade-armed{opacity:1;clip-path:none;transform:none;transition:none}
}
/* 面板内左列「公司介绍」小标题 + 正文 + 文字链（白字压暗图；标题/说明已移至图上 .head，故正文不再带 margin-top） */
.invest__sub{font-size:clamp(32px,2.8vw,42px);font-weight:700;letter-spacing:-.01em;line-height:1.2;color:#fff;margin-bottom:clamp(12px,1.6vh,18px);text-shadow:0 1px 10px rgba(7,9,20,.5)}
.invest__p{max-width:56ch;font-size:clamp(14.5px,1.15vw,17px);font-weight:300;line-height:1.85;color:rgba(255,255,255,.88);text-shadow:0 1px 10px rgba(7,9,20,.5)}
/* 文字链 CTA：白字 + 线性箭头（复用全站 .btn .arw 机制）；无下划线，悬停反馈由箭头右移承担 */
.invest__link{display:inline-flex;align-items:center;gap:12px;margin-top:clamp(24px,3.6vh,40px);font-size:clamp(15px,1.2vw,17.5px);font-weight:500;color:#fff;text-decoration:none}
/* 负责人 2026-09-26 定：删除悬停/点击/聚焦时文字下方的白下划线（悬停反馈改由箭头右移承担） */
.invest__link:hover,.invest__link:focus,.invest__link:active,.invest__link:visited{text-decoration:none;outline:none}
/* 磨砂玻璃联系卡（照抄参考图）：半透明白 + backdrop-filter + 高光内描边；减少动效/透明偏好下降级为实底 */
/* 磨砂玻璃卡（负责人 2026-09-26 定）：颜色随底图自适应——backdrop-filter 采样背后竖条底图（静止/翻面两态皆跟随），提高 saturate 让采到的色调更鲜明、降低平涂白雾让底图色主导（仅留顶部淡高光）；白字加 text-shadow 保证在任何底色下都清晰可读 */
.invest__glass{padding:clamp(26px,2.4vw,38px);border-radius:24px;border:1px solid rgba(255,255,255,.35);background:linear-gradient(160deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,.05) 55%,rgba(255,255,255,.02) 100%);backdrop-filter:blur(24px) saturate(200%) brightness(1.02);-webkit-backdrop-filter:blur(24px) saturate(200%) brightness(1.02);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 24px 64px rgba(7,9,20,.4)}
.invest__glass .invest__gt,.invest__glass .invest__rtxt b,.invest__glass .invest__rtxt i,.invest__glass .invest__cta{text-shadow:0 1px 12px rgba(7,9,20,.5)}
.invest__gt{color:#fff;font-size:clamp(19px,1.6vw,24px);font-weight:700;padding-bottom:clamp(14px,1.8vh,20px);border-bottom:1px solid rgba(255,255,255,.2)}
.invest__rows{list-style:none;margin:0;padding:0}
.invest__row{display:flex;align-items:center;gap:14px;padding:clamp(12px,1.8vh,18px) 0;border-bottom:1px solid rgba(255,255,255,.14)}
.invest__ri{flex:none;width:22px;height:22px;color:#fff}
.invest__rtxt{display:flex;flex-direction:column;gap:3px;min-width:0}
.invest__rtxt b{font-size:14.5px;font-weight:600;color:#fff}
.invest__rtxt i{font-style:normal;font-size:13.5px;font-weight:300;color:rgba(255,255,255,.8);overflow-wrap:anywhere}
/* 主按钮（负责人 2026-09-26 定）：默认幽灵描边（透明底+半透明白边白字，落在暗玻璃卡上可读），鼠标悬停填充全站锁紫 --vi；白色线性箭头 hover 右移微动 */
.invest__cta{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:clamp(16px,2.2vh,24px);padding:14px 22px;border-radius:14px;border:1.5px solid rgba(255,255,255,.55);background:transparent;color:#fff;font-size:15.5px;font-weight:600;transition:background .35s var(--e),border-color .35s var(--e),transform .35s var(--e)}
.invest__cta:hover{background:var(--vi);border-color:var(--vi);transform:translateY(-1px)}
.invest__cta:active{transform:translateY(0) scale(.99)}
.invest__arw{width:16px;height:16px;border-radius:50%;border:1px solid currentColor;position:relative;flex:none;transition:transform .35s var(--e)}
.invest__arw::after{content:'';position:absolute;left:50%;top:50%;width:5px;height:5px;border-right:1.4px solid currentColor;border-top:1.4px solid currentColor;transform:translate(-58%,-50%) rotate(45deg)}
.invest__link:hover .invest__arw,.invest__cta:hover .invest__arw{transform:translateX(3px)}
@media (max-width:960px){
.invest__in{grid-template-columns:1fr;min-height:0;gap:32px;padding:clamp(28px,6vw,40px)}
}
/* 磨砂降级兜底：尊重减少透明/动效偏好时玻璃卡改实底，可读性优先 */
@media (prefers-reduced-transparency:reduce){
.invest__glass{background:#151b38;backdrop-filter:none;-webkit-backdrop-filter:none}
}
/* ============================================================
08 · HAIL —— 收尾（深紫蓝，全站唯一深色区）
============================================================ */
.hail{position:relative;z-index:2;background:var(--vi-3);color:#fff;overflow:hidden;
padding:clamp(84px,15vh,170px) var(--pad) clamp(70px,10vh,120px)}
.hail__glow{position:absolute;left:50%;top:-26%;width:74vw;height:74vw;transform:translateX(-50%);pointer-events:none;
background:radial-gradient(circle,rgba(124,77,255,.36),rgba(144,0,131,.14) 42%,transparent 66%);filter:blur(34px);
animation:glowPulse 14s ease-in-out infinite alternate}
@keyframes glowPulse{from{opacity:.72;transform:translateX(-50%) scale(1)}to{opacity:1;transform:translateX(-50%) scale(1.1)}}
.hail::after{content:'';position:absolute;inset:0;pointer-events:none;opacity:.34;
background-image:repeating-linear-gradient(0deg,rgba(255,255,255,.1) 0 1px,transparent 1px 74px),
repeating-linear-gradient(90deg,rgba(255,255,255,.1) 0 1px,transparent 1px 74px)}
.hail__in{position:relative;z-index:1;max-width:var(--maxw);margin:0 auto}
.hail h2{font-size:clamp(30px,5.4vw,74px);line-height:1.08;letter-spacing:-.028em;color:#fff;font-weight:300}
.hail__d{margin-top:26px;font-size:16px;color:rgba(255,255,255,.72);max-width:46ch;line-height:1.7}
.hail__act{margin-top:clamp(32px,4.6vh,48px);display:flex;gap:14px;flex-wrap:wrap}
/* ============================================================
09 · STOCK —— 投资者关系：股价信息（紫光股份 000938）
============================================================ */
.stock{position:relative;z-index:2;background:var(--bg-2);overflow:hidden;
padding:clamp(80px,12vh,150px) var(--pad) clamp(70px,10vh,120px)}
.stock__in{position:relative;max-width:var(--maxw);margin:0 auto}
.stock__src{font-size:13.2px;color:var(--ink-3);line-height:1.7;max-width:32ch}
.stock__grid{margin-top:clamp(34px,5vh,54px);display:grid;grid-template-columns:1.62fr 1fr;gap:clamp(16px,1.8vw,24px)}
/* 左：图表面板 */
.stock__panel{background:var(--bg);border:1px solid var(--line-2);border-radius:22px;min-width:0;
padding:clamp(18px,2vw,26px) clamp(16px,1.8vw,26px) clamp(12px,1.4vh,18px);
box-shadow:0 24px 60px rgba(14,16,32,.05)}
.stock__hd{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.stock__t{font-size:clamp(15px,1.3vw,17.5px);font-weight:300;letter-spacing:-.01em}
.stock__tabs{display:flex;gap:4px;padding:4px;background:var(--bg-3);border-radius:100px}
.stock__tabs button{border:0;background:transparent;font:inherit;font-size:12.5px;font-weight:300;color:var(--ink-2);
padding:7px 16px;border-radius:100px;cursor:pointer;
transition:background-color .4s,color .4s,box-shadow .4s}
.stock__tabs button:hover{color:var(--ink)}
.stock__tabs button.is-on{background:var(--bg);color:var(--vi);box-shadow:0 3px 10px rgba(14,16,32,.08)}
.stock__cv{position:relative;margin-top:clamp(14px,1.8vh,20px);height:clamp(280px,34vh,380px)}
.stock__cv canvas{width:100%;height:100%;display:block;cursor:crosshair}
.stock__tip{position:absolute;top:0;left:0;pointer-events:none;opacity:0;transform:translate(-50%,-108%);
background:rgba(255,255,255,.68);border:1px solid rgba(255,255,255,.9);border-radius:12px;
-webkit-backdrop-filter:blur(20px) saturate(1.7);backdrop-filter:blur(20px) saturate(1.7);
box-shadow:0 16px 40px rgba(14,16,32,.13),0 1px 0 rgba(255,255,255,.8) inset;padding:9px 12px;font-size:11.8px;line-height:1.72;color:var(--ink-2);
white-space:nowrap;z-index:3;transition:opacity .18s}
.stock__tip.is-on{opacity:1}
.stock__tip b{color:var(--ink);font-weight:300}
.stock__tip i{font-style:normal;color:var(--ink-3)}
.stock__load{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:2;
font-size:13px;color:var(--ink-3);background:rgba(255,255,255,.5);
-webkit-backdrop-filter:blur(10px) saturate(1.4);backdrop-filter:blur(10px) saturate(1.4);
transition:opacity .5s}
.stock__load.is-off{opacity:0;pointer-events:none}
.stock__lg{margin-top:12px;padding-top:12px;border-top:1px solid var(--line);
display:flex;gap:8px;flex-wrap:wrap;font-size:11.6px;color:var(--ink-3)}
/* 可点击图例：点击切换曲线显隐 */
.stock__lg button{display:inline-flex;align-items:center;gap:7px;border:1px solid transparent;border-radius:100px;
background:transparent;font:inherit;font-size:11.6px;color:var(--ink-2);padding:5px 12px;cursor:pointer;
transition:background-color .35s,border-color .35s,color .35s,opacity .35s}
.stock__lg button i{display:inline-block;width:14px;height:2px;border-radius:2px;vertical-align:middle;transition:opacity .35s}
.stock__lg button:hover{background:var(--bg-3);color:var(--ink)}
.stock__lg button[aria-pressed="true"]{border-color:var(--line-2);background:var(--bg);color:var(--ink)}
.stock__lg button.is-off{opacity:.45}
.stock__lg button.is-off i{opacity:.3}
.stock__lg button.is-off span{text-decoration:line-through}
/* 日K 区间缩放条（dataZoom）：拖窗口平移、拖两端手柄缩放 */
.stock__zoom{margin-top:10px}
.stock__zoom[hidden]{display:none}
.stock__zoom-track{position:relative;height:26px;border-radius:8px;background:var(--bg-3);
border:1px solid var(--line-2);overflow:hidden;cursor:pointer;touch-action:none}
.stock__zoom-win{position:absolute;top:0;bottom:0;left:0;width:100%;
background:rgba(124,77,255,.12);border-left:2px solid var(--vi);border-right:2px solid var(--vi);
cursor:grab}
.stock__zoom-win:active{cursor:grabbing}
.stock__zoom-win i{position:absolute;top:50%;width:12px;height:18px;margin-top:-9px;border-radius:4px;
background:var(--vi);opacity:.92;cursor:ew-resize}
.stock__zoom-win i[data-h="l"]{left:-1px;border-radius:4px 2px 2px 4px}
.stock__zoom-win i[data-h="r"]{right:-1px;border-radius:2px 4px 4px 2px}
.stock__hint{margin-top:8px;font-size:11px;color:var(--ink-3)}
/* 右：股价卡 */
.stock__card{position:relative;overflow:hidden;background:var(--bg);border:1px solid var(--line-2);
border-radius:22px;padding:clamp(22px,2.4vw,34px) clamp(20px,2.2vw,32px) clamp(18px,2vh,26px);
box-shadow:0 24px 60px rgba(14,16,32,.05);display:flex;flex-direction:column;
--sc:#cf3030;--sc-wash:rgba(207,48,48,.07)}
.stock__card.is-down{--sc:#0f9a67;--sc-wash:rgba(15,154,103,.08)}
.stock__card::before{content:'';position:absolute;right:-24%;top:-32%;width:66%;aspect-ratio:1;pointer-events:none;
background:radial-gradient(circle,var(--vi-wash2),transparent 68%)}
.stock__co{position:relative}
.stock__co h3{font-size:clamp(19px,1.9vw,23px);letter-spacing:-.02em}
.stock__co p{margin-top:8px;font-size:13px;color:var(--ink-3)}
.stock__rmb{margin-top:clamp(22px,3.4vh,34px);display:flex;align-items:flex-end;gap:9px}
.stock__rmb b{font-size:clamp(40px,4.6vw,58px);font-weight:300;letter-spacing:-.04em;line-height:1;
color:var(--sc);font-variant-numeric:tabular-nums}
.stock__rmb span{font-size:12.5px;letter-spacing:.1em;color:var(--ink-3);padding-bottom:6px}
.stock__arw{width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;
border-bottom:11px solid var(--sc);margin-bottom:8px;transition:transform .5s var(--e-out)}
.stock__card.is-down .stock__arw{transform:rotate(180deg)}
.stock__chg{margin-top:12px;font-size:14.5px;font-weight:300;color:var(--sc);font-variant-numeric:tabular-nums}
.stock__kv{margin-top:clamp(20px,3vh,30px);padding-top:clamp(18px,2.4vh,26px);border-top:1px solid var(--line);
display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.2vh,24px) 18px}
.stock__kv dt{font-size:12.3px;color:var(--ink-3)}
.stock__kv dd{margin-top:7px;font-size:clamp(17px,1.6vw,20px);font-weight:300;letter-spacing:-.02em;
color:var(--ink);font-variant-numeric:tabular-nums}
.stock__time{margin-top:auto;padding-top:clamp(18px,2.4vh,26px);border-top:1px solid var(--line);
display:flex;justify-content:space-between;gap:12px;font-size:12.2px;color:var(--ink-3)}
.stock__foot{margin-top:clamp(28px,4vh,44px);font-size:12.4px;color:var(--ink-3);text-align:center}
@media (max-width:980px){
.stock__grid{grid-template-columns:1fr}
.stock__cv{height:clamp(240px,32vh,320px)}
}
@media (max-width:600px){
.stock__src{max-width:none}
.stock__rmb b{font-size:clamp(36px,13vw,48px)}
.stock__tip{font-size:11px}
}
/* ============================================================
10 · FOOTER
============================================================ */
/* 页脚第八版（2026-09-22 客户回退定板）：退回三列纯文字版（定位语/回到顶部均撤），
字号 13/12.5/12（回退后客户微调 +0.5），细体 300、三阶墨色、发丝线不变 */
.ft{position:relative;z-index:2;background:#f8f8f8;color:var(--ink-2);font-weight:300;
padding:56px var(--pad) 30px;text-align:left}
/* 页脚内容宽（负责人 2026-09-26 定）：不再用按截图量出的 min(1447px,100%) 上限（视口 >1608px 时 90vw > 1447px，页脚比其它版块窄一截、左右多内缩），
改用与 .pillars__in / .scenes__in / .news__in / .invest__in 完全同机制的 max-width:var(--maxw)（.ft 自身 padding 已为 var(--pad)=5vw，100% 恰为 90vw），全终版心严格对齐 */
.ft__top{width:100%;max-width:var(--maxw);margin:0 auto;padding-bottom:26px;display:flex;align-items:center;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;
border-bottom:1px solid rgba(14,16,32,.1)}/* 2026-10-16 点名（底栏「TMS 产品安全漏洞管理」改样式与位置）：原为纯块级容器（width/max-width/margin/padding-bottom/border-bottom，只有 logo 一个子元素），现补 flex 两端对齐让 logo 居左、安全漏洞入口胶囊居右同一排；flex-wrap 保证窄屏放不下时胶囊换行到 logo 下方左对齐，不压缩 logo。 */
.ft__logo{height:40px;width:auto}/* 紫色原版 LOGO 缩至 40px，与正文字号比例协调 */
/* 2026-10-16 点名：底栏「TMS 产品安全漏洞管理」从「关于青藤」列里的一行文字链接，改成与 logo 同排靠右的玻璃胶囊按钮（照截图2样式与位置）。
同日再点名（截图红框「不要胶囊，只是 icon 和文字，文字变成品牌紫，并且整体放大 115%」）：撤掉胶囊外壳，只留图标+文字。
改前原值（留档以便回退）：padding:11px 20px;border-radius:100px;background:var(--bg);border:1px solid var(--line);
box-shadow:0 1px 2px rgba(16,18,32,.04),0 8px 24px -12px rgba(16,18,32,.14)；color:var(--ink)（文字原为深墨）；
hover 原为 color:var(--vi) + border-color:rgba(144,0,131,.28) + 加深阴影。
本轮取值：文字走品牌紫 var(--vi)；图标原单独声明 color:var(--vi)，现删掉该行改为继承父级色，hover 时与文字同步；
整体放大 115% = 字号 14→16.1px、图标 18→20.7px、图标与文字间距 9→10.4px（三项同乘 1.15，不单独改字号）。
hover 用同色降透明度 rgba(144,0,131,.78)，不引入新色相。
同日第三轮点名（截图红框「icon 改成截图2样式，并且要比现在的大 120%，同时这组 icon 与文字要与左侧的 Logo 下对齐」）：
① 图标尺寸在上一轮 115% 的基础上再乘 1.2 → 20.7→24.84px（只放大图标，文字保持 16.1px，因为点名对象是 icon）；
② 新增 align-self:flex-end 让整组底边压到与左侧 logo 底边同一水平线（父容器 .ft__top 是 align-items:center，
行盒高度由 40px 的 logo 决定，flex-end 即贴该行底缘 = logo 底缘）；窄屏换行时该属性对自身所在行无副作用；
③ 图标形状换成「盾形 + 挂锁」（39 页页脚内联 SVG 同步替换，盾形外轮廓沿用站内既有的
M12 22s8-3.5 8-10V5l-8-3-8 3v7c0 6.5 8 10 8 10z，与「漏洞修复」步骤图标同族；被替换掉的旧内部件为
circle cx=12 cy=10.4 r=1.7 + path M12 12.1v2.6，即盾形里的感叹号）。
同日第四轮点名（截图红框「icon 再放大110%，并且与右边文字距离缩小一点」）：
① 图标在上轮 24.84px 基础上再乘 1.10 → 27.324px（点名对象仍是 icon，文字保持 16.1px）；
② 图标与文字间距 gap 由 10.4px 缩小为 7px（本轮原值 10.4px 留档）。
同日第五轮点名（截图2红框「图标按截图1的样式」）：只换 39 页页脚内联 SVG 的画法，CSS 数值本轮未动（故无需再递增 ?v=，
且页面 HTML 的响应头是 Cache-Control: no-store，不吃缓存）。改前内层四段（留档以便回退）：
path M12 22s8-3.5 8-10V5l-8-3-8 3v7c0 6.5 8 10 8 10z（盾形外轮廓）
+ path M10.4 11.6V9.9a1.6 1.6 0 0 1 3.2 0v1.7（挂锁锁环）+ rect x=9.1 y=11.6 w=5.8 h=4.9 rx=1.1（锁体）
+ path M12 13.3v1.5（锁孔竖线，原为纯线段、无圆点）；svg 根节点 stroke-width 原为 1.6。
改后按截图1实测比例（用像素扫描取参考图轮廓：盾形外框 45x54、锁体外沿 23x15、锁环外沿 16、锁孔 4x8）：
锁体加宽到 7.8 单位（外沿/盾形外沿 = 0.52，与参考图 0.51 对齐）、锁环加宽到外沿 6.6 单位（比值 0.38 vs 参考 0.36）、
锁孔改成「圆点 + 短杆」的圆头线段；盾形下缘改为更长的直边 + 更尖的底部尖角（直边段从 5 到 14.8，参考图为 41.7%→63% 同位）。
线宽 1.6→1.2：参考图线宽/盾宽 = 2/45 = 0.044，站内通用 1.6 是 0.067，若沿用 1.6 则锁体内腔只剩 3.0 单位、
放不下参考图那种「圆点+杆」锁孔（会被锁体描边吞掉），故这一枚图标单独降到 1.2（比值 0.05，与站内其它图标不完全统一，已报备）。 */
.ft__psirt{display:inline-flex;align-items:center;gap:7px;align-self:flex-end;
font-size:16.1px;font-weight:400;line-height:1.4;color:var(--vi);text-decoration:none;
transition:color .3s var(--e),transform .18s var(--e)}
.ft__psirt svg{flex:none;width:27.324px;height:27.324px}
.ft__psirt:hover{color:rgba(144,0,131,.78)}
.ft__psirt:active{transform:scale(.98)}/* 按下去给一点实体反馈 */
.ft__psirt:focus-visible{outline:2px solid var(--vi);outline-offset:3px}
/* 2026-10-14 加入我们改版曾删页脚“加入我们”整列并把这里改为 1.6fr+1fr；同日负责人点名恢复（原话“这个底栏什么时候改了啊，今天根本没有让你改这里啊，恢复过来吧”），
33 页页脚已插回四链接列，此处恢复为改前 1.6fr+1fr+1fr 三栏（规则原文取自改前最后快照 10-13）。 */
.ft__in{width:100%;max-width:var(--maxw);margin:0 auto;display:grid;
grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) minmax(0,1fr);column-gap:clamp(24px,4vw,64px);padding:38px 0 26px}
.ft__spare{display:none}/* 纯占位格，断点换栏时反成干扰，全局隐藏 */
/* 左列：二维码 92² + 联系三行（14px 细体） */
.ft__qrimg{width:92px;height:92px;border-radius:0;display:block;background:#fff;margin-bottom:18px}
.ft__lead p{font-size:14px;font-weight:300;line-height:1.6;color:var(--ink-2);padding:7px 0;display:flex;align-items:flex-start;gap:8px}
/* 2026-09-22 联系行细线图标（无圆底）：15px 与文字同色 --ink-2，线宽 1.6，margin-top 3.7px 与 22.4px 行高居中 */
.ft__ic{width:15px;height:15px;flex:none;margin-top:3.7px;stroke:var(--ink-2);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ft__addr{max-width:none;text-wrap:pretty}/* 地址行不锁宽，桌面单行显示，“501”不孤悬下行；窄屏自然换行 */
/* 导航双列：栏题 13.5px 600 拉开字距，链接 14px 细体 */
.ft__col h5{font-size:13.5px;font-weight:600;line-height:1.4;letter-spacing:.08em;color:var(--ink);margin:0 0 12px}
.ft__col a{display:block;font-size:14px;font-weight:300;line-height:1.6;color:var(--ink-2);padding:7px 0;transition:color .3s}
.ft__col a:hover,.ft__col a:active,.ft__col a:focus-visible{color:var(--vi)}
/* 底栏：友情链接左，版权右，13.5px 三阶最淡墨色 */
.ft__base{width:100%;max-width:var(--maxw);margin:0 auto;padding-top:20px;
border-top:1px solid rgba(14,16,32,.1);display:flex;justify-content:space-between;
align-items:baseline;flex-wrap:wrap;gap:10px 24px;font-size:13.5px;font-weight:300;line-height:1.6;color:var(--ink-3)}
.ft__links{display:flex;flex-wrap:wrap;gap:6px 22px;align-items:center;font-size:13.5px}
.ft__links span{color:var(--ink-3);letter-spacing:.06em;font-weight:400}
.ft__links a{color:var(--ink-2);font-weight:300;transition:color .3s}
.ft__links a:hover{color:var(--vi)}
.ft__copy{color:var(--ink-3);font-weight:300}
@media (max-width:900px){/* 手机端：联系行通栏，导航双列并排，收窄列隔 */
.ft__in{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(14px,5vw,24px)}
.ft__lead{grid-column:1/-1}}
@media (max-width:600px){.ft__base{flex-direction:column}}
/* ============================================================
11 · 进场揭示（纯 animation，结束 .done 释放 transform）
============================================================ */
html.js [data-reveal]{opacity:0}
html.js [data-reveal].in{animation:rise .95s var(--e-out) both}
html.js [data-reveal].in.done{animation:none;opacity:1}
@keyframes rise{from{opacity:0;translate:0 34px}to{opacity:1;translate:0 0}}
/* 六边形逐个点亮：从上方落下 + 微缩放 */
html.js .wall__col[data-reveal].in{animation:cellIn .9s var(--e-out) both}
html.js .wall__col[data-reveal].in.done{animation:none;opacity:1}
@keyframes cellIn{from{opacity:0;translate:0 42px;scale:.92}to{opacity:1;translate:0 0;scale:1}}
/* ============================================================
12 · 移动端抽屉
============================================================ */
@media (max-width:980px){
/* 关键：backdrop-filter 会给 fixed 后裔建包含块，抽屉会塌成胶囊高——移动端改用实底白替代磨砂 */
.nav__cap,.nav.is-solid .nav__cap{background:rgba(255,255,255,.9);border-color:rgba(255,255,255,.95);
backdrop-filter:none;-webkit-backdrop-filter:none}
.nav.is-solid .nav__cap{background:rgba(255,255,255,.95);box-shadow:0 10px 30px rgba(14,16,32,.08)}
.nav__menu{position:fixed;top:0;left:0;width:100%;height:100vh;height:100svh;flex-direction:column;justify-content:flex-start;gap:2px;margin:0;/* svh 前 vh 兜底：旧内核抽屉塔缩 */
background:rgba(255,255,255,.78);
-webkit-backdrop-filter:blur(28px) saturate(1.8);backdrop-filter:blur(28px) saturate(1.8);
padding:calc(88px + var(--pad)) var(--pad) calc(28px + env(safe-area-inset-bottom,0px));z-index:1010;
overflow-y:auto;-webkit-overflow-scrolling:touch;/* 2026-09-29 手机端实测：内容超屏 93~222px 时居中裁顶且不可滚，改顶对齐+可滚 */
transform:translateY(-101%);visibility:hidden;
transition:transform .75s var(--e-expo),visibility .75s var(--e-expo)}
.nav__menu.is-open{transform:none;visibility:visible}
.nav__menu .nav__a{font-size:clamp(24px,7vw,38px);font-weight:300;color:var(--ink);padding:12px 0}
.nav__menu .nav__a.is-active{color:var(--vi)}
/* 移动抽屉手风琴（2026-09-29 负责人点名优化手机端）：原“二级常显平铺”内容装不下屏，
改为默认只显示一级大字，点带二级的项就地展开（demo03.js 翻 .nav__it.is-open） */
.nav__it{flex-direction:column;align-items:stretch;position:relative}
.nav__it > .nav__a{display:flex;align-items:center;justify-content:space-between;min-height:48px}
/* 带二级的项右侧细线 chevron，展开旋转 180°（纯 CSS 边框三角，非自创图标） */
.nav__it:has(.nav__dd) > .nav__a::after{content:'';width:9px;height:9px;margin-right:6px;flex:none;
border-right:1.5px solid var(--ink-3);border-bottom:1.5px solid var(--ink-3);
transform:rotate(45deg);transition:transform .35s var(--e)}
.nav__it.is-open > .nav__a::after{transform:rotate(225deg)}
.nav__dd{display:none;position:static;transform:none;opacity:1;pointer-events:auto;min-width:0;
flex-direction:column;align-items:stretch;gap:0;padding:2px 0 14px 14px;
background:transparent;border:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.nav__it.is-open .nav__dd{display:flex}
.nav__dd::after{display:none}
.nav__dd a{font-size:16px;font-weight:400;padding:12px 0;border-radius:0;color:var(--ink-2);min-height:44px;display:flex;align-items:center}/* 热区≥44px 触屏标准 */
.nav__burger{display:flex}
}
/* ============================================================
13 · 降低动效：只弱化“自动播放/入场”动效，绝不关掉 hover 反馈
============================================================ */
@media (prefers-reduced-motion:reduce){
.hero__vid,.hero__scan,.hail__glow,.slab:hover::after{animation:none!important}
.hero__scan{display:none}
html.js [data-reveal],html.js [data-reveal].in,html.js .wall__col[data-reveal].in{opacity:1!important;animation:none!important}
.hero__lede,.hero__act,.hero__title .ln>b{opacity:1!important;transform:none!important}
.hero__scroll{transition:none!important}
.hero__scroll svg{animation:none!important}
.hero__scroll .hero__wheel{animation:none!important}
.orb__spin,.orb__node.is-hit{animation:none!important}
.orb__bg{transform:none!important}
.orb__sat{transition-duration:0s!important}
*{transition-duration:.2s!important}
}
/* 性能提示：sticky/3D 层独占合成层 */
.hero__stage{backface-visibility:hidden}
/* ============ 公司概览子页：栏目名图外上部居中 + 首页同宽底图文字带 ============ */
.ov{max-width:var(--maxw);margin:0 auto;padding:clamp(118px,16vh,180px) 0 clamp(70px,10vh,130px)}
.ov .head{margin-bottom:clamp(26px,4vh,44px)}
.ov__band{position:relative;border-radius:var(--rad);overflow:hidden;
background:url(../images/banner-hero.jpg) center 42%/cover no-repeat;
padding:clamp(38px,6vh,72px) clamp(26px,4vw,64px)}
.ov__band::before{content:'';position:absolute;inset:0;
background:linear-gradient(180deg,rgba(8,10,22,.58),rgba(8,10,22,.72))}
.ov__band p{position:relative;z-index:1;margin:0;color:rgba(255,255,255,.92);
font-size:clamp(14.5px,1.15vw,17.5px);line-height:2.1;letter-spacing:.015em;text-align:justify}
.ov__band p+p{margin-top:1.15em}
/* ============================================================
发展历程 · 阶梯时间轴 + 关键数据带（demo0X-about-history.html）
进场：容器 [data-reveal] 获 .in 后，卡片/圆点/年份按列阶梯延迟，
轴线 scaleX 绘制；reduced-motion 独立兜底。
============================================================ */
.hs{max-width:var(--maxw);margin:0 auto;padding:clamp(118px,16vh,180px) 0 clamp(70px,10vh,130px)}
.hs .head{margin-bottom:clamp(24px,4vh,40px)}
.hs__intro{display:grid;gap:10px;max-width:1100px;margin:0 auto}
.hs__intro p{margin:0;font-size:clamp(13.5px,1.05vw,16px);line-height:2;color:var(--ink-2);letter-spacing:.015em}
.hs__intro b{color:var(--vi);font-weight:500;margin-right:2px}
/* 时间轴：七列阶梯 */
.tl{position:relative;margin-top:clamp(44px,7vh,84px)}
.tl__row{display:grid;grid-template-columns:repeat(7,1fr);gap:12px;align-items:end}
.tl__it{position:relative;display:flex;flex-direction:column}
/* 阶梯抬升：卡片底边到圆点的竖茎长度，逐列递增（PPT 阶梯版式） */
.tl__it:nth-child(1){--gap:18px}
.tl__it:nth-child(2){--gap:44px}
.tl__it:nth-child(3){--gap:70px}
.tl__it:nth-child(4){--gap:96px}
.tl__it:nth-child(5){--gap:122px}
.tl__it:nth-child(6){--gap:148px}
.tl__it:nth-child(7){--gap:174px}
.tl__card{background:var(--bg);border:1px solid var(--line);border-radius:14px;box-shadow:var(--sh-1);padding:15px 13px 13px;margin-bottom:var(--gap);opacity:0;translate:0 26px;transition:opacity .7s var(--e-out),translate .7s var(--e-out)}
.tl__card h3{display:flex;align-items:baseline;gap:6px;margin:0 0 8px;font-size:14px;font-weight:600;color:var(--ink);letter-spacing:.02em}
.tl__card h3 b{color:var(--vi);font-weight:700;letter-spacing:.04em}
.tl__card h3 i{font-style:normal;color:var(--line-2);font-weight:300}
.tl__card ul{display:grid;gap:5px}
.tl__card li{font-size:12px;line-height:1.75;color:var(--ink-2);letter-spacing:.01em}
.tl__card li b{color:var(--vi);font-weight:500}
/* 2025 高亮卡：紫底反白 */
.tl__it--hi .tl__card{background:var(--vi);border-color:transparent;box-shadow:0 18px 44px rgba(144,0,131,.28)}
.tl__it--hi .tl__card h3{color:#fff}
.tl__it--hi .tl__card h3 b{color:#fff}
.tl__it--hi .tl__card h3 i{color:rgba(255,255,255,.45)}
.tl__it--hi .tl__card li{color:rgba(255,255,255,.86)}
.tl__it--hi .tl__card li b{color:#ffd9f6}
.tl__dot{position:relative;width:12px;height:12px;border-radius:50%;background:var(--vi);margin:0 auto 10px;box-shadow:0 0 0 4px var(--vi-wash);scale:0;transition:scale .5s var(--e-out)}
/* 竖茎：卡片底边到圆点的垂直连线，向下绘制 */
.tl__dot::before{content:'';position:absolute;bottom:100%;left:50%;width:2px;height:var(--gap);transform:translateX(-50%) scaleY(0);transform-origin:top center;background:linear-gradient(180deg,var(--vi),var(--vi-2));transition:transform .6s var(--e-out);transition-delay:inherit}
.tl__year{text-align:center;font-size:12.5px;font-weight:500;color:var(--ink-2);letter-spacing:.08em;padding-bottom:2px;opacity:0;transition:opacity .6s var(--e-out)}
.tl__track{position:absolute;left:6px;right:6px;bottom:37px;height:2px;border-radius:2px;background:var(--line-2)}
.tl__track i{position:absolute;inset:0;border-radius:2px;background:linear-gradient(90deg,var(--vi),var(--vi-2));transform:scaleX(0);transform-origin:left center;transition:transform 1.5s var(--e-expo) .1s}
/* 进场态 */
.tl.in .tl__track i{transform:scaleX(1)}
.tl.in .tl__card,.tl.in .tl__year{opacity:1;translate:0 0}
.tl.in .tl__dot{scale:1}
.tl.in .tl__dot::before{transform:translateX(-50%) scaleY(1)}
.tl__it:nth-child(1) :is(.tl__card,.tl__dot,.tl__year){transition-delay:.2s}
.tl__it:nth-child(2) :is(.tl__card,.tl__dot,.tl__year){transition-delay:.34s}
.tl__it:nth-child(3) :is(.tl__card,.tl__dot,.tl__year){transition-delay:.48s}
.tl__it:nth-child(4) :is(.tl__card,.tl__dot,.tl__year){transition-delay:.62s}
.tl__it:nth-child(5) :is(.tl__card,.tl__dot,.tl__year){transition-delay:.76s}
.tl__it:nth-child(6) :is(.tl__card,.tl__dot,.tl__year){transition-delay:.9s}
.tl__it:nth-child(7) :is(.tl__card,.tl__dot,.tl__year){transition-delay:1.04s}
/* 关键数据带：四紫块 */
.hs__stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:clamp(48px,8vh,92px) 0 0}
.hs__stats li{background:var(--vi);border-radius:14px;padding:20px 16px 18px;text-align:center;color:#fff;opacity:0;translate:0 24px;transition:opacity .7s var(--e-out),translate .7s var(--e-out)}
.hs__stats.in li{opacity:1;translate:0 0}
.hs__stats li:nth-child(2){transition-delay:.12s}
.hs__stats li:nth-child(3){transition-delay:.24s}
.hs__stats li:nth-child(4){transition-delay:.36s}
.hs__stats b{display:block;font-size:clamp(19px,1.7vw,26px);font-weight:700;letter-spacing:.03em;margin-bottom:8px}
.hs__stats b i{font-style:normal;font-size:.72em;font-weight:600;margin-left:2px}
.hs__stats span{display:block;font-size:12px;line-height:1.9;color:rgba(255,255,255,.84);letter-spacing:.02em}
/* 窄屏：时间轴改竖排 */
@media (max-width:980px){
.tl__row{grid-template-columns:1fr;gap:22px;align-items:stretch}
.tl__it{display:grid;grid-template-columns:16px 1fr;grid-template-areas:"dot card" "year card";gap:0 14px;padding-top:0!important}
.tl__dot{grid-area:dot;margin:4px auto 6px}
.tl__dot::before{display:none}
.tl__year{grid-area:year;padding:0}
.tl__card{grid-area:card;margin-bottom:0}
.tl__track{left:7px;right:auto;top:8px;bottom:8px;width:2px;height:auto}
.tl__track i{transform:scaleY(0);transform-origin:top center}
.tl.in .tl__track i{transform:scaleY(1)}
.hs__stats{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){.hs__stats{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){
.tl__card,.tl__year,.hs__stats li{opacity:1!important;translate:0 0!important;transition:none!important}
.tl__dot{scale:1!important;transition:none!important}
.tl__dot::before{transform:translateX(-50%) scaleY(1)!important;transition:none!important}
.tl__track i{transform:scaleX(1)!important;transition:none!important}
}
/* ============================================================
荣誉资质 · 会员胶囊 + 证书照片墙 + 麦穗数据带（demo0X-about-honors.html）
证书墙参照集团站 honor-wall 卡墙与悬停抬升；数据带参照麦穗徽章。
============================================================ */
.hn{max-width:var(--maxw);margin:0 auto;padding:clamp(118px,16vh,180px) 0 clamp(70px,10vh,130px)}
.hn .head{margin-bottom:clamp(30px,5vh,54px)}
.hn__defs{position:absolute;width:0;height:0;overflow:hidden}
/* 行业会员胶囊 */
.hn__pills{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 14px;max-width:920px;margin:0 auto}
.hn__pills li{padding:10px 24px;border-radius:100px;background:linear-gradient(100deg,var(--vi-2),var(--vi));color:#fff;font-size:13px;font-weight:500;letter-spacing:.06em;box-shadow:0 8px 20px rgba(144,0,131,.22);opacity:0;translate:0 18px;transition:opacity .6s var(--e-out),translate .6s var(--e-out)}
.hn__pills.in li{opacity:1;translate:0 0}
.hn__pills li:nth-child(2){transition-delay:.08s}
.hn__pills li:nth-child(3){transition-delay:.16s}
.hn__pills li:nth-child(4){transition-delay:.24s}
.hn__pills li:nth-child(5){transition-delay:.32s}
/* 证书照片墙 */
.hn__wall{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:1100px;margin:clamp(40px,6vh,72px) auto 0}
.hn__card{position:relative;background:var(--bg);border:1px solid var(--line);border-radius:14px;box-shadow:var(--sh-1);padding:46px 26px 30px;text-align:center;opacity:0;translate:0 24px;
transition:opacity .7s var(--e-out) var(--d,0s),translate .7s var(--e-out) var(--d,0s),box-shadow .3s ease,transform .3s ease}
.hn__card::before{content:'';position:absolute;inset:9px;border:1px solid rgba(144,0,131,.2);border-radius:9px;pointer-events:none}
.hn__card::after{content:'';position:absolute;top:20px;left:50%;margin-left:-13px;width:26px;height:26px;border-radius:50%;background:radial-gradient(circle at 34% 30%,#f3d78c,#d4a017 72%);box-shadow:0 2px 8px rgba(212,160,23,.45)}
.hn__card p{font-size:13.5px;line-height:1.9;color:var(--ink-2);letter-spacing:.02em}
.hn__wall.in .hn__card{opacity:1;translate:0 0}
.hn__wall.in .hn__card:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
.hn__wall .hn__card:nth-child(1){--d:.15s}
.hn__wall .hn__card:nth-child(2){--d:.23s}
.hn__wall .hn__card:nth-child(3){--d:.31s}
.hn__wall .hn__card:nth-child(4){--d:.39s}
.hn__wall .hn__card:nth-child(5){--d:.47s}
.hn__wall .hn__card:nth-child(6){--d:.55s}
.hn__wall .hn__card:nth-child(7){--d:.63s}
.hn__wall .hn__card:nth-child(8){--d:.71s}
.hn__wall .hn__card:nth-child(9){--d:.79s}
/* 知识产权数据带 · 麦穗徽章 */
.hn__stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px 14px;margin:clamp(46px,7vh,84px) 0 0}
.hn__stats li{padding:10px 4px;text-align:center;opacity:0;translate:0 22px;transition:opacity .7s var(--e-out),translate .7s var(--e-out)}
.hn__stats.in li{opacity:1;translate:0 0}
.hn__stats li:nth-child(2){transition-delay:.1s}
.hn__stats li:nth-child(3){transition-delay:.2s}
.hn__stats li:nth-child(4){transition-delay:.3s}
.hn__stats li:nth-child(5){transition-delay:.4s}
.hn__stats li:nth-child(6){transition-delay:.5s}
.hn__stats li:nth-child(7){transition-delay:.6s}
.hn__stats li:nth-child(8){transition-delay:.7s}
.hn__stat-l{display:block;font-size:13px;font-weight:600;color:var(--ink-2);letter-spacing:.05em;margin-bottom:8px}
.hn__stat-n{display:flex;align-items:center;justify-content:center;gap:10px}
.hn__w{width:15px;height:42px;fill:#d4a017;opacity:.8;flex:none}
.hn__w--r{transform:scaleX(-1)}
.hn__stat-n b{font-size:clamp(24px,2.2vw,34px);font-weight:700;color:var(--vi);letter-spacing:.02em;line-height:1}
.hn__stat-n b i{font-style:normal;font-size:.55em;font-weight:700;margin-left:2px}
@media (max-width:980px){
.hn__wall{grid-template-columns:repeat(2,1fr)}
.hn__stats{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){
.hn__wall{grid-template-columns:1fr}
.hn__stats{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
.hn__pills li,.hn__card,.hn__stats li{opacity:1!important;translate:0 0!important;transition:none!important}
}
/* ============ 企业文化（使命/愿景宣言双卡 + 价值观三卡） ============ */
.cu{max-width:var(--maxw);margin:0 auto;padding:clamp(118px,16vh,180px) 0 clamp(70px,10vh,130px)}
.cu__lead{max-width:720px;margin:18px auto 0;font-size:15px;line-height:2;color:var(--ink-2)}
.cu__mv{display:grid;grid-template-columns:1fr 1fr;gap:22px;max-width:1000px;margin:clamp(46px,7vh,84px) auto 0}
.cu__mv-c{position:relative;overflow:hidden;background:var(--bg);border:1px solid var(--line);border-radius:18px;box-shadow:var(--sh-1);padding:40px 42px 46px;
opacity:0;translate:0 26px;transition:opacity .7s var(--e-out) var(--d,0s),translate .7s var(--e-out) var(--d,0s),box-shadow .3s ease,transform .3s ease}
.cu__mv-c::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--vi-2),var(--vi))}
.cu__mv-c::after{content:attr(data-char);position:absolute;right:22px;bottom:0;font-size:108px;font-weight:700;line-height:1;color:var(--vi-wash);pointer-events:none}
.cu__mv .cu__mv-c:nth-child(2){--d:.14s}
.cu__mv.in .cu__mv-c{opacity:1;translate:0 0}
.cu__mv.in .cu__mv-c:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
.cu__mv-k{font-size:12px;font-weight:700;letter-spacing:.3em;color:var(--vi)}
.cu__mv-t{margin-top:12px;font-size:15px;font-weight:600;letter-spacing:.06em;color:var(--ink-2)}
.cu__mv-s{position:relative;margin-top:14px;font-size:clamp(22px,2.3vw,30px);font-weight:700;line-height:1.55;color:var(--ink)}
.cu__sub{margin:clamp(58px,9vh,112px) auto 0;text-align:center}
.cu__sub-k{font-size:12px;font-weight:700;letter-spacing:.3em;color:var(--vi)}
.cu__sub-t{margin-top:10px;font-size:clamp(24px,2.6vw,34px);font-weight:700;letter-spacing:-.02em}
.cu__vals{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:1100px;margin:clamp(30px,4vh,48px) auto 0}
.cu__val{background:var(--bg);border:1px solid var(--line);border-radius:14px;box-shadow:var(--sh-1);padding:34px 30px 30px;
opacity:0;translate:0 24px;transition:opacity .7s var(--e-out) var(--d,0s),translate .7s var(--e-out) var(--d,0s),box-shadow .3s ease,transform .3s ease}
.cu__vals .cu__val:nth-child(2){--d:.12s}
.cu__vals .cu__val:nth-child(3){--d:.24s}
.cu__vals.in .cu__val{opacity:1;translate:0 0}
.cu__vals.in .cu__val:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
.cu__val-i{display:grid;place-items:center;width:46px;height:46px;border-radius:12px;background:var(--vi-wash);color:var(--vi)}
.cu__val-i svg{width:22px;height:22px}
.cu__val h3{margin-top:18px;font-size:17px;font-weight:700;letter-spacing:.02em}
.cu__val p{margin-top:10px;font-size:13.5px;line-height:1.95;color:var(--ink-2)}
@media (max-width:860px){.cu__mv,.cu__vals{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){
.cu__mv-c,.cu__val{opacity:1!important;translate:0 0!important;transition:none!important}
}
/* ============ 联系我们（联系三卡 + 布局示意图 + 分公司卡 + 公众号码） ============ */
.ct{max-width:var(--maxw);margin:0 auto;padding:clamp(118px,16vh,180px) 0 clamp(70px,10vh,130px)}
.ct__lead{max-width:760px;margin:18px auto 0;font-size:15px;line-height:2;color:var(--ink-2)}
.ct__cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:1100px;margin:clamp(46px,7vh,84px) auto 0}
.ct__card{background:var(--bg);border:1px solid var(--line);border-radius:14px;box-shadow:var(--sh-1);padding:30px 28px;
opacity:0;translate:0 22px;transition:opacity .7s var(--e-out) var(--d,0s),translate .7s var(--e-out) var(--d,0s),box-shadow .3s ease,transform .3s ease}
.ct__cards .ct__card:nth-child(2){--d:.1s}
.ct__cards .ct__card:nth-child(3){--d:.2s}
.ct__cards.in .ct__card{opacity:1;translate:0 0}
.ct__cards.in .ct__card:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
.ct__ico{display:grid;place-items:center;width:46px;height:46px;border-radius:12px;background:var(--vi-wash);color:var(--vi)}
.ct__ico svg{width:22px;height:22px}
.ct__card h3{margin-top:16px;font-size:14px;font-weight:600;letter-spacing:.08em;color:var(--ink-2)}
.ct__card p{margin-top:8px;font-size:14.5px;font-weight:500;line-height:1.9;color:var(--ink);word-break:break-all}
.ct__card p a{color:inherit;transition:color .2s ease}
.ct__card p a:hover{color:var(--vi)}
.ct__sub{margin:clamp(58px,9vh,112px) auto 0;text-align:center}
.ct__sub-k{font-size:12px;font-weight:700;letter-spacing:.3em;color:var(--vi)}
.ct__sub-t{margin-top:10px;font-size:clamp(24px,2.6vw,34px);font-weight:700;letter-spacing:-.02em}
.ct__map{max-width:1000px;margin:clamp(28px,4vh,44px) auto 0;background:linear-gradient(180deg,var(--bg-2),var(--bg));border:1px solid var(--line);border-radius:18px;box-shadow:var(--sh-1);padding:clamp(16px,3vw,34px);overflow:hidden}
.ct__map svg{display:block;width:100%;height:auto}
.ct__ln{fill:none;stroke:url(#ct-g);stroke-width:1.5;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .9s var(--e-out) var(--ld,0s)}
.ct__map .ct__ln:nth-of-type(2){--ld:.1s}
.ct__map .ct__ln:nth-of-type(3){--ld:.2s}
.ct__map .ct__ln:nth-of-type(4){--ld:.3s}
.ct__map .ct__ln:nth-of-type(5){--ld:.4s}
.ct__map .ct__ln:nth-of-type(6){--ld:.5s}
.ct__map.in .ct__ln{stroke-dashoffset:0}
.ct__nd{opacity:0;transition:opacity .5s var(--e-out) var(--nd,0s)}
.ct__map g:nth-of-type(2){--nd:.55s}
.ct__map g:nth-of-type(3){--nd:.65s}
.ct__map g:nth-of-type(4){--nd:.75s}
.ct__map g:nth-of-type(5){--nd:.85s}
.ct__map g:nth-of-type(6){--nd:.95s}
.ct__map g:nth-of-type(7){--nd:1.05s}
.ct__map.in .ct__nd{opacity:1}
.ct__nd circle{fill:var(--vi-2)}
.ct__nd--hq circle{fill:var(--vi)}
.ct__nd--hq .ct__ring{fill:none;stroke:var(--vi);stroke-opacity:.25;stroke-width:2}
.ct__nd text{font-size:13px;font-weight:600;letter-spacing:.04em;fill:var(--ink-2)}
.ct__nd--hq text{fill:var(--vi);font-weight:700}
.ct__br{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:1100px;margin:clamp(24px,3.5vh,40px) auto 0}
.ct__br-c{background:var(--bg);border:1px solid var(--line);border-radius:14px;box-shadow:var(--sh-1);padding:22px;
opacity:0;translate:0 20px;transition:opacity .6s var(--e-out) var(--d,0s),translate .6s var(--e-out) var(--d,0s),box-shadow .3s ease,transform .3s ease}
.ct__br .ct__br-c:nth-child(2){--d:.06s}
.ct__br .ct__br-c:nth-child(3){--d:.12s}
.ct__br .ct__br-c:nth-child(4){--d:.18s}
.ct__br .ct__br-c:nth-child(5){--d:.24s}
.ct__br .ct__br-c:nth-child(6){--d:.3s}
.ct__br .ct__br-c:nth-child(7){--d:.36s}
.ct__br.in .ct__br-c{opacity:1;translate:0 0}
.ct__br.in .ct__br-c:hover{transform:translateY(-3px);box-shadow:var(--sh-2)}
.ct__br-c h3{font-size:15px;font-weight:700;letter-spacing:.02em}
.ct__br-c p{margin-top:8px;font-size:12.5px;line-height:1.9;color:var(--ink-2)}
.ct__wx{margin:clamp(26px,4vh,40px) auto 0;text-align:center;opacity:0;translate:0 20px;transition:opacity .7s var(--e-out),translate .7s var(--e-out)}
.ct__wx.in{opacity:1;translate:0 0}
.ct__wx-box{width:172px;margin:0 auto;background:var(--bg);border:1px solid var(--line);border-radius:16px;box-shadow:var(--sh-1);padding:16px 16px 12px}
.ct__wx-box img{width:100%;height:auto;border-radius:6px}
.ct__wx-box span{display:block;margin-top:10px;font-size:12.5px;font-weight:600;letter-spacing:.12em;color:var(--ink-2)}
@media (max-width:980px){.ct__cards{grid-template-columns:1fr}.ct__br{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.ct__br{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){
.ct__card,.ct__br-c,.ct__wx{opacity:1!important;translate:0 0!important;transition:none!important}
.ct__ln{stroke-dashoffset:0!important;transition:none!important}
.ct__nd{opacity:1!important;transition:none!important}
}
/* ============================================================
栏目子页 · demo03-solutions.html 解决方案
============================================================ */
.sol-pg{position:relative;z-index:2;background:var(--bg);padding:clamp(120px,15vh,180px) var(--pad) clamp(80px,11vh,140px)}
.sol__grid{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(24px,3vw,44px)}
.sol__card{background:var(--bg);border:1px solid var(--line);border-radius:var(--rad);overflow:hidden;box-shadow:var(--sh-1);
display:flex;flex-direction:column;transition:transform .55s var(--e-out),box-shadow .55s var(--e-out),border-color .5s;
opacity:0;translate:0 26px}
.sol-pg [data-reveal].in .sol__card,.sol__grid.in .sol__card{opacity:1;translate:0 0;transition:opacity .85s var(--e-out) var(--d,0s),translate .85s var(--e-out) var(--d,0s),transform .55s var(--e-out),box-shadow .55s var(--e-out),border-color .5s}
.sol__grid .sol__card:nth-child(2){--d:.08s}
.sol__grid .sol__card:nth-child(3){--d:.16s}
.sol__grid .sol__card:nth-child(4){--d:.24s}
.sol__card:hover{transform:translateY(-6px);box-shadow:var(--sh-2);border-color:var(--line-2)}
.sol__card-img{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--bg-3)}
.sol__card-img img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--e-out)}
.sol__card:hover .sol__card-img img{transform:scale(1.06)}
.sol__card-bd{padding:clamp(22px,2.4vw,34px) clamp(22px,2.4vw,36px) clamp(26px,2.6vw,38px);display:flex;flex-direction:column;gap:14px;flex:1}
.sol__card-ico{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--vi-wash);color:var(--vi);margin-bottom:2px}
.sol__card-ico svg{width:22px;height:22px}
.sol__card-bd h2{font-size:clamp(20px,1.9vw,26px);letter-spacing:-.015em;color:var(--ink)}
.sol__card-bd p{font-size:14.5px;line-height:1.95;color:var(--ink-2);flex:1}
.sol__card-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.sol__card-tags span{padding:5px 12px;font-size:12px;letter-spacing:.02em;border-radius:100px;background:var(--bg-3);color:var(--ink-2);transition:background-color .3s,color .3s}
.sol__card:hover .sol__card-tags span{background:var(--vi-wash);color:var(--vi)}
@media (max-width:980px){.sol__grid{grid-template-columns:1fr}}
/* ============================================================
栏目子页 · demo03-news.html 新闻与活动
============================================================ */
.nw{position:relative;z-index:2;background:var(--bg);padding:clamp(120px,15vh,180px) var(--pad) clamp(80px,11vh,140px)}
.nw__in{max-width:var(--maxw);margin:0 auto;padding-left:22px}/* 2026-10-10 点名：新闻内容（tab 行 + 卡片）左缘对齐上方 hero——.phero__in 有 padding-left:22px（对齐导航 logo），此处同步内缩 22px（border-box 下容器右缘不变，仅内容右移），使 tab/卡片与”新闻与活动”标题及引导语文字左缘齐平 */
/* 2026-10-15 点名(手机端·新闻与活动)：上面那 22px 左内缩在手机断点会让左右留白不对称（左 42 / 右 20），
四个标签与新闻卡片整体看起来右移、没居中。窄屏取消内缩，hero 标题与 tab/卡片左缘仍齐平，左右各留 var(--pad)。 */
@media (max-width:640px){
.nw__in{padding-left:0}
.phero--news .phero__in{padding-left:0}
}
.nw__filter{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:clamp(28px,4vh,50px) auto clamp(30px,5vh,54px)}
.nw__chip{padding:9px 22px;font-family:var(--font);font-size:13.5px;font-weight:400;color:var(--ink-2);background:var(--bg);
border:1px solid var(--line-2);border-radius:100px;cursor:pointer;
transition:color .35s var(--e),background-color .35s var(--e),border-color .35s var(--e)}
.nw__chip:hover{color:var(--ink);border-color:var(--ink-3)}
.nw__chip.is-active{color:#fff;background:var(--vi);border-color:var(--vi)}
/* 新闻分组区段（公众号/技术类/展会 · 切一次只显示一组，由顶部 .nws tab 行切换，见下方 demo03-news 内联脚本）；
scroll-margin 随 tab 行吸顶加大（76 顶位 + 行高≈55 + 余量） */
.nwgrp{scroll-margin-top:150px;display:none}
.nwgrp [id]{scroll-margin-top:150px}
.nwgrp.is-show{display:block;animation:nwgrpIn .5s var(--e-out)}
@keyframes nwgrpIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
/* 分组标题：与产品中心 .prg__t（NFC 标题）同款——居中、无圆点、同字号 */
.nwgrp__t{margin:0 auto clamp(48px,6.5vh,80px);padding:0 24px;text-align:center;
font-size:clamp(22px,2.1vw,30px);font-weight:400;letter-spacing:.08em;color:#1d1d1f}
/* ============================================================
分组切换栏 + 搜索栏（照抄 qckonggu /news「齐成新闻·视频中心」那行：
左 tab（大字号 600，非选中淡化 + 1px×24px 竖分隔线，靠颜色深浅表选中）
右 搜索 form（年份胶囊下拉 + 极简下划线搜索框：占位文字左、放大镜图标右、底部一根细线，聚焦转紫）
入场动效照抄 alanUp/alanRight（淡入 + 位移、逐项错峰）；配色跟随本站紫 VI（--vi / --vi-2）；宽度随 .nw__in 内容等宽
============================================================ */
.nws{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 26px;
margin:0 auto clamp(40px,6vh,66px)}
.nws__tabs{display:flex;align-items:center;gap:clamp(16px,2vw,26px)}
/* 未选中：50% 黑文字 + 50% 黑竖线；选中/点击：品牌紫（用户 2026-09-21 指定）；首项左内边距归零使标签与新闻左边缘齐平 */
.nws__tab{border:0;background:none;cursor:pointer;font-family:var(--font);padding:6px 2px;
font-size:clamp(18px,1.55vw,22px);font-weight:600;letter-spacing:.01em;line-height:1.35;color:rgba(0,0,0,.5);
transition:color .5s var(--e)}
.nws__tab:first-child{padding-left:0}
.nws__tab:hover{color:rgba(0,0,0,.85)}
.nws__tab.is-on{color:var(--vi)}
.nws__sep{width:1px;height:23px;background:rgba(0,0,0,.5);flex:none}
.nws__form{display:flex;align-items:center;gap:12px}
/* 年份下拉（胶囊触发 + 点击展开列表） */
.nws__yr{position:relative}
.nws__yr-hd{display:flex;align-items:center;gap:12px;height:46px;padding:0 20px;border-radius:100px;cursor:pointer;
background:var(--bg);border:1px solid var(--line-2);font-size:14px;color:var(--ink-2);user-select:none;
transition:border-color .3s var(--e),color .3s var(--e)}
.nws__yr-hd:hover{border-color:var(--vi);color:var(--ink)}
.nws__caret{width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
transform:rotate(45deg) translate(-1px,-1px);transition:transform .3s var(--e)}
.nws__yr.is-open .nws__caret{transform:rotate(-135deg) translate(-1px,-1px)}
.nws__yr-list{position:absolute;left:0;top:calc(100% + 8px);z-index:40;min-width:100%;margin:0;padding:0;list-style:none;
background:var(--bg);border:1px solid var(--line-2);border-radius:14px;box-shadow:0 18px 44px rgba(14,16,32,.14);
max-height:0;opacity:0;overflow:hidden;transform:translateY(-6px);pointer-events:none;
transition:max-height .3s var(--e),opacity .28s var(--e),transform .28s var(--e),padding .28s var(--e)}
.nws__yr.is-open .nws__yr-list{max-height:264px;overflow:auto;opacity:1;transform:translateY(0);padding:6px;pointer-events:auto}
.nws__yr-list li{padding:8px 16px;border-radius:9px;font-size:14px;text-align:center;color:var(--ink-2);cursor:pointer;
font-variant-numeric:tabular-nums;transition:background-color .25s var(--e),color .25s var(--e)}
.nws__yr-list li:hover{background:var(--bg-3);color:var(--vi)}
.nws__yr-list li.is-on{color:#fff;background:var(--vi)}
/* 搜索框改极简下划线式（图1）：占位文字在左、放大镜图标在右、整条底部一根细线；聚焦底线转紫；宽度自适应并与新闻右边缘齐平 */
.nws__search{position:relative;display:flex;align-items:center;flex:0 1 auto;width:clamp(220px,30vw,360px);
border-bottom:1px solid rgba(0,0,0,.28);transition:border-color .3s var(--e)}
.nws__search:focus-within{border-bottom-color:var(--vi)}
.nws__kw{flex:1;min-width:0;box-sizing:border-box;height:46px;padding:0 4px;border:0;background:none;
font-family:var(--font);font-size:15px;color:var(--ink)}
.nws__kw::placeholder{color:rgba(0,0,0,.4)}
.nws__kw:focus{outline:none}
/* 搜索按钮：无边框无底、仅紫色放大镜图标（图1） */
.nws__btn{flex:none;width:40px;height:46px;display:inline-flex;align-items:center;justify-content:center;
border:0;background:none;cursor:pointer;color:var(--vi);transition:color .3s var(--e)}
.nws__btn:hover{color:var(--vi-2)}
/* 入场：随滚动进入视口 .nws.is-in（demo03-news 内联 IntersectionObserver 触发），tab 上浮、搜索项自左滑入，逐项错峰 */
.nws__tabs,.nws__yr,.nws__search{opacity:0;transition:opacity .8s var(--e),transform .8s var(--e)}
.nws__tabs{transform:translateY(14px)}
.nws__yr{transform:translateX(-16px)}
.nws__search{transform:translateX(-16px)}
.nws.is-in .nws__tabs{opacity:1;transform:none;transition-delay:.05s}
.nws.is-in .nws__yr{opacity:1;transform:none;transition-delay:.16s}
.nws.is-in .nws__search{opacity:1;transform:none;transition-delay:.26s}
/* 分类 tab 行吸顶：2026-11-02 负责人点名删除（白底把新闻图裁切感去掉，回归随页滚动）；旧规则逐字留档可回滚：
@media (min-width:821px){
.nws{position:sticky;top:76px;z-index:900;background:var(--bg)}
.nws::after{content:'';position:absolute;left:0;right:0;top:100%;height:clamp(40px,6vh,66px);background:var(--bg);pointer-events:none}
}
（沿革：2026-10-10 点名新增，钉在胶囊导航下缘≈76px，::after 白延伸盖 margin 缝；仅桌面生效，窄屏从未吸顶） */
@media (max-width:820px){
.nws{flex-direction:column;align-items:stretch;gap:18px}
.nws__tabs{justify-content:flex-start}/* 2026-10-10 点名：窄屏 tab 行不再居中，左对齐到下方新闻卡左边缘 */
.nws__form{flex-wrap:wrap;justify-content:flex-end}/* 点名：搜索栏靠右对齐到新闻卡右边缘 */
.nws__search{flex:0 1 320px;min-width:160px;width:auto}
}
/* 2026-11-03 二次点名（真机手机版截图，覆盖同日早先「上面两个字、下面两个字」方案）：负责人看真机后要求「红框内容居中，左对齐有些别扭；二行字变一行，字号自动适配」。
故本档改为：整条居中 + 每个标签恒一行 4 字 + 字号随视口线性缩放。旧方案逐字留档可回滚：.nws__tab{width:2.6em;flex:none} 与 [lang="en"] .nws__tab{width:auto}。
一行放得下的预算（用本项目已实测锚点推）：390 视口下 .nws__tabs 可用宽约 335px（此前 18px 字号把 4 个 tab 压到 57.5px，反推 4×57.5 + 3×1px 竖线 + 6×16px gap = 329 ≈ 335）；
中文标签每字实占约 1.02em（57.5px 盒扣 4px 内边距放 3 字 → 17.83px ÷ 18px），4 字约 4.08F；于是不等式 16.32F + 3 + 6G ≤ 内容盒。
把 gap 由 16px 收到 6px、tab 左右内边距由 2px 归 0（间距改由 gap 统一提供）后解得 F ≤ (vw − 55 − 39) ÷ 16.32 即 calc(6.1vw − 5.8px)；再按各档留 ≥5% 余量收紧为 calc(5.7vw − 5.4px)，并用 clamp 封住 12px–16.5px 两端：
320→12.8px（占 248/265）、360→15.1px（285/305）、390→16.5px（308/335）、430与480→16.5px 封顶（308/375、308/425）。
字号上限 16.5px（原手机档为 clamp(18px,1.55vw,22px) 的 18px）是「一行 4 字」的必要代价，负责人既明确要求二行变一行，故接受。
居中只作用于 ≤480 手机档：2026-10-10 曾点名「窄屏 tab 行不居中、左对齐到新闻卡左边缘」，481–820 档那条一字未动。
英文态不能只靠 white-space:normal：译文 Company News / Industry Insights 是长短语，nowrap 会横向溢出，而 normal 在 flex:none + width:auto 下其实并不折行
（flex item 的宽由 max-content 决定、无约束就没有折行点），实测四标签恒占 449.6px → 320/360/390/430 档 docOv 分别 28/37/37/17。
这也是上一轮 2.6em 方案遗留的同一回归（当时英文态只还原了 width:auto，未测英文所以没发现）。
现改为容器 flex-wrap:wrap + 子项 flex:0 1 auto：折行发生在容器层（标签整条换到第二行），标签内不拆词，实测五档 rows=2、docOv 全 0。
实测手段：browser-use MCP 本轮不可用（连求值 1+1 都返回 transport error），改用本机 Edge headless + iframe 探针跑 file:// 本地页——
iframe 宽度不受窗口最小宽度钳制，而 --window-size 直接截图会失真（曾据截图误判为溢出）；探针测前须强制 TTMS_I18N.set('zh')，否则会被上一轮写入 localStorage 的 en 污染。
中文态 320/360/390/430/480 五档：rows=1、每标签 lines=1、docOv 全 0，每字实占 1.01em（16.5px 字号下单标签 66.7px）；
居中验的是对称而非仅规则命中：marginL/marginR = 9.3/9.2、10.8/10.8、14.7/14.7、33.2/33.2、55.7/55.7。
本类名仅 demo03-news.html 使用（全站 grep 已核），无连带。 */
@media (max-width:480px){
.nws__tabs{justify-content:center;gap:6px}
.nws__tab{width:auto;flex:none;white-space:nowrap;padding:6px 0;font-size:clamp(12px,calc(5.7vw - 5.4px),16.5px)}
[lang="en"] .nws__tabs{flex-wrap:wrap}
[lang="en"] .nws__tab{flex:0 1 auto;white-space:normal}
}
@media (prefers-reduced-motion:reduce){
.nwgrp.is-show{animation:none}
.nws__tabs,.nws__yr,.nws__search{opacity:1;transform:none;transition:none}
}
/* 左侧圆点锚点侧栏（产品中心 demo03-pc.css 同款收编共用，供栏目子页复用） */
.pas{position:fixed;left:30px;top:50%;z-index:900;display:flex;flex-direction:column;
transform:translate(calc(-100% - 28px),-50%);transition:transform .36s ease-out}
.pas.is-in{transform:translate(0,-50%)}
.pas::before{content:"";position:absolute;left:3px;top:16px;bottom:16px;width:1px;background:#dfe3e9}
.pas::after{content:"";position:absolute;left:3px;top:16px;width:1px;height:var(--pas-h,0);background:var(--vi);transition:height .3s}
.pas a{position:relative;display:flex;align-items:center;gap:11px;padding:10px 0;
font-size:12.5px;letter-spacing:.02em;color:#9aa1ab;text-decoration:none;transition:color .3s var(--e)}
.pas a::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;
background:#c3c9d4;transition:background-color .3s var(--e)}
.pas a:hover{color:#5b6472}
.pas a.is-on{color:var(--vi)}
.pas a.is-on::before{background:var(--vi);box-shadow:0 0 8px 0 rgba(144,0,131,.6)}
@media (min-width:900px) and (max-width:1799px){
.pas{left:14px}
.pas a{font-size:0;gap:0;padding:9px 0}
.pas a:hover,.pas a:focus-visible{font-size:12.5px;gap:11px;padding:8px 14px 8px 0;
background:#fff;border-radius:0 12px 12px 0;box-shadow:0 8px 22px rgba(14,16,32,.16);color:#5b6472}
}
@media (max-width:900px){.pas{display:none}}
@media (prefers-reduced-motion:reduce){.pas{transition:none}}
/* 头条卡（横向大图 + 内容） */
.nw__lead{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:0;max-width:1100px;margin:0 auto clamp(46px,7vh,74px);
background:var(--bg);border:1px solid var(--line);border-radius:var(--rad);overflow:hidden;box-shadow:var(--sh-1);
transition:transform .55s var(--e-out),box-shadow .55s var(--e-out)}
.nw__lead:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
.nw__lead-img{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--bg-3)}
.nw__lead-img img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--e-out)}
.nw__lead:hover .nw__lead-img img{transform:scale(1.05)}
.nw__lead-bd{padding:clamp(26px,2.8vw,44px) clamp(26px,2.8vw,46px);display:flex;flex-direction:column;justify-content:center;gap:12px}
.nw__lead-tag{align-self:flex-start;padding:4px 12px;font-size:11.5px;letter-spacing:.14em;color:#fff;background:var(--vi);border-radius:100px}
.nw__lead-bd time{font-size:12.5px;color:var(--ink-3);letter-spacing:.05em}
.nw__lead-bd h2{font-size:clamp(20px,2vw,28px);letter-spacing:-.015em;line-height:1.28}
.nw__lead-bd p{font-size:14.5px;line-height:1.95;color:var(--ink-2)}
.nw__lead-cta{display:inline-flex;align-items:center;gap:10px;margin-top:8px;font-size:13.5px;color:var(--vi)}
.nw__lead:hover .nw__lead-cta .arw{width:30px}
/* 网格新闻卡 */
.nw__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.2vw,32px)}
.ncard2{background:var(--bg);border:1px solid var(--line);border-radius:var(--rad);overflow:hidden;box-shadow:var(--sh-1);
opacity:0;translate:0 22px;transition:opacity .75s var(--e-out) var(--d,0s),translate .75s var(--e-out) var(--d,0s),transform .5s var(--e-out),box-shadow .5s var(--e-out),border-color .5s}
.nw__grid.in .ncard2{opacity:1;translate:0 0}
.nw__grid .ncard2:nth-child(3n+2){--d:.08s}
.nw__grid .ncard2:nth-child(3n+3){--d:.16s}
.ncard2:hover{transform:translateY(-5px);box-shadow:var(--sh-2);border-color:var(--line-2)}
.ncard2 > a{display:flex;flex-direction:column;height:100%}
.ncard2__img{display:block;position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--bg-3)}
.ncard2__img img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--e-out)}
.ncard2:hover .ncard2__img img{transform:scale(1.06)}
.ncard2__cat{align-self:flex-start;margin:18px 22px 0;padding:4px 10px;font-size:11px;letter-spacing:.12em;color:var(--vi);background:var(--vi-wash);border-radius:100px}
.ncard2__t{display:block;margin:10px 22px 0;font-size:12.5px;color:var(--ink-3);letter-spacing:.05em}
.ncard2__h{margin:6px 22px 0;font-size:16.5px;line-height:1.4;letter-spacing:-.01em;color:var(--ink)}
.ncard2__d{margin:8px 22px 0;font-size:13.5px;line-height:1.85;color:var(--ink-2);flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ncard2__cta{display:inline-flex;align-items:center;gap:8px;margin:14px 22px 22px;font-size:12.5px;color:var(--ink-2);
transition:color .35s var(--e)}
.ncard2:hover .ncard2__cta{color:var(--vi)}
.ncard2:hover .ncard2__cta .arw{width:26px}
@media (max-width:980px){.nw__grid{grid-template-columns:repeat(2,1fr)}.nw__lead{grid-template-columns:1fr}}
@media (max-width:640px){.nw__grid{grid-template-columns:1fr}}
/* 无原图新闻 · 品牌占位图（原站图床已失效，不张冠李戴） */
.ncard2__ph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;width:100%;height:100%;
background:linear-gradient(135deg,var(--vi-deep,#2a1a4f),var(--vi) 62%,#8a63d2)}
.ncard2__ph em{font-style:normal;font-size:11px;letter-spacing:.4em;color:rgba(255,255,255,.72)}
.ncard2__ph b{font-weight:500;font-size:17px;letter-spacing:.14em;color:#fff}
/* CATL 式新闻列表：标题 + 日期 + 数字分页 */
.nlist{max-width:1100px;margin:clamp(52px,8vh,88px) auto 0;padding-top:clamp(34px,5vh,56px);border-top:1px solid var(--line)}
.nlist__hd{display:flex;align-items:baseline;gap:16px;margin-bottom:10px}
.nlist__hd h2{font-size:clamp(19px,1.8vw,25px);letter-spacing:-.01em}
.nlist__hd span{font-size:11.5px;letter-spacing:.24em;color:var(--ink-3);text-transform:uppercase}
.nlist__row{display:flex;align-items:center;gap:clamp(14px,2vw,28px);padding:21px 8px;border-bottom:1px solid var(--line);
transition:background-color .35s var(--e)}
.nlist__row[hidden]{display:none}
.nlist__row:hover{background:var(--bg-2)}
.nlist__tt{flex:1;min-width:0;font-size:15.5px;line-height:1.6;color:var(--ink);
white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .35s var(--e),padding-left .35s var(--e)}
.nlist__row:hover .nlist__tt{color:var(--vi);padding-left:8px}
.nlist__cat{flex:none;padding:3px 11px;font-size:11px;letter-spacing:.1em;color:var(--vi);background:var(--vi-wash);border-radius:100px}
.nlist__dt{flex:none;font-size:13px;color:var(--ink-3);letter-spacing:.05em;font-variant-numeric:tabular-nums}
@media (max-width:640px){.nlist__cat{display:none}.nlist__row{padding:16px 4px}}
.nlist__pg{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:clamp(30px,5vh,48px)}
.nlist__pg button{min-width:38px;height:38px;padding:0 10px;font-family:var(--font);font-size:13.5px;color:var(--ink-2);
background:var(--bg);border:1px solid var(--line-2);border-radius:10px;cursor:pointer;
transition:color .3s var(--e),background-color .3s var(--e),border-color .3s var(--e)}
.nlist__pg button:hover:not(:disabled){color:var(--vi);border-color:var(--vi)}
.nlist__pg button.is-active{color:#fff;background:var(--vi);border-color:var(--vi)}
.nlist__pg button:disabled{opacity:.4;cursor:default}
/* ============================================================
栏目子页 · demo03-join.html 加入我们
============================================================ */
.jo{position:relative;z-index:2;background:var(--bg);padding:clamp(120px,15vh,180px) var(--pad) clamp(60px,8vh,90px)}
.jo__in{max-width:var(--maxw);margin:0 auto}
.jo__lead{max-width:920px;margin:clamp(30px,5vh,60px) auto 0;padding:clamp(28px,3vw,44px) clamp(24px,3vw,48px);
background:linear-gradient(180deg,var(--bg-2),var(--bg));border:1px solid var(--line);border-radius:var(--rad);box-shadow:var(--sh-1)}
.jo__lead-zh{font-size:15px;line-height:2.05;color:var(--ink-2);text-align:justify}
.jo__paths{position:relative;padding:clamp(50px,7vh,80px) var(--pad) clamp(50px,7vh,80px);background:var(--bg-2)}
.jo__paths .jo__in{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(20px,2.4vw,32px)}
.jo__path{background:var(--bg);border:1px solid var(--line);border-radius:var(--rad);box-shadow:var(--sh-1);
padding:clamp(28px,3vw,44px) clamp(24px,2.6vw,40px);display:flex;flex-direction:column;gap:14px;
opacity:0;translate:0 24px;transition:opacity .85s var(--e-out) var(--d,0s),translate .85s var(--e-out) var(--d,0s),transform .5s var(--e-out),box-shadow .5s var(--e-out)}
.jo__paths .jo__path:nth-child(2){--d:.1s}
[data-reveal].in .jo__path,.jo__paths.in .jo__path{opacity:1;translate:0 0}
.jo__path:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
.jo__path-ico{display:inline-grid;place-items:center;width:52px;height:52px;border-radius:14px;background:var(--vi-wash);color:var(--vi)}
.jo__path-ico svg{width:26px;height:26px}
.jo__path h2{font-size:clamp(19px,1.8vw,24px);letter-spacing:-.01em}
.jo__path p{font-size:14.5px;line-height:1.9;color:var(--ink-2);flex:1}
.jo__path-cta{display:inline-flex;align-items:center;gap:10px;margin-top:6px;padding:12px 22px;align-self:flex-start;
font-size:14px;color:#fff;background:var(--vi);border-radius:100px;
transition:background-color .4s var(--e),transform .4s var(--e),box-shadow .4s var(--e)}
.jo__path-cta:hover{background:var(--vi-2);transform:translateY(-2px);box-shadow:0 12px 28px rgba(144,0,131,.28)}
.jo__path-cta .arw{width:18px;background:#fff}
.jo__path-cta .arw::after{border-top-color:#fff;border-right-color:#fff}
.jo__path-hint{margin-top:2px;font-size:12px;color:var(--ink-3);letter-spacing:.02em}
.jo__dev{position:relative;padding:clamp(70px,10vh,120px) var(--pad) clamp(60px,8vh,100px);background:var(--bg)}
.jo__pillars{max-width:var(--maxw);margin:clamp(30px,5vh,60px) auto 0;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,1.8vw,24px)}
.jo__pil{position:relative;padding:clamp(24px,2.4vw,34px) clamp(20px,2vw,28px);background:var(--bg-2);border:1px solid var(--line);
border-radius:var(--rad);display:flex;flex-direction:column;gap:8px;overflow:hidden;
transition:transform .5s var(--e-out),box-shadow .5s var(--e-out),background-color .5s}
.jo__pil:hover{transform:translateY(-4px);box-shadow:var(--sh-1);background:var(--bg)}
.jo__pil-n{font-size:12px;font-weight:500;letter-spacing:.22em;color:var(--vi);opacity:.7}
.jo__pil h3{font-size:16px;letter-spacing:-.005em}
.jo__pil p{font-size:13.5px;line-height:1.85;color:var(--ink-2)}
@media (max-width:980px){.jo__paths .jo__in{grid-template-columns:1fr}.jo__pillars{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.jo__pillars{grid-template-columns:1fr}}
.jo__ct{padding:clamp(30px,5vh,60px) var(--pad) clamp(80px,11vh,120px);background:var(--bg)}
.jo__ctcard{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3vw,44px);
padding:clamp(30px,3.4vw,52px) clamp(24px,3vw,48px);background:var(--vi-3);color:#fff;border-radius:var(--rad);
box-shadow:var(--sh-3);position:relative;overflow:hidden;opacity:0;translate:0 26px;
transition:opacity .85s var(--e-out),translate .85s var(--e-out)}
.jo__ctcard[data-reveal].in,.jo__ct .jo__ctcard.in{opacity:1;translate:0 0}
.jo__ctcard::after{content:'';position:absolute;right:-10%;top:-30%;width:60%;height:160%;pointer-events:none;
background:radial-gradient(closest-side,rgba(124,77,255,.28),transparent 70%)}
.jo__ctcard-l{position:relative;z-index:1;display:flex;flex-direction:column;justify-content:center;gap:12px}
.jo__ctcard-l h2{color:#fff;font-size:clamp(22px,2.2vw,32px);letter-spacing:-.02em;line-height:1.28}
.jo__ctcard-l p{color:rgba(255,255,255,.7);font-size:14.5px;line-height:1.9}
.jo__ctcard-r{position:relative;z-index:1;display:flex;flex-direction:column;justify-content:center;gap:14px;
padding-left:clamp(20px,2.4vw,36px);border-left:1px solid rgba(255,255,255,.14)}
.jo__crow{display:flex;align-items:flex-start;gap:12px;font-size:14px;color:rgba(255,255,255,.86);line-height:1.9}
.jo__crow svg{width:18px;height:18px;flex:none;margin-top:3px;color:var(--vi-2)}
@media (max-width:820px){.jo__ctcard{grid-template-columns:1fr}.jo__ctcard-r{padding-left:0;border-left:0;border-top:1px solid rgba(255,255,255,.14);padding-top:22px}}
/* ============================================================
栏目子页 · demo03-about.html 关于青藤
============================================================ */
.ab{position:relative;z-index:2;background:var(--bg);padding:clamp(120px,15vh,180px) var(--pad) clamp(60px,8vh,90px)}
.ab__in{max-width:var(--maxw);margin:0 auto}
.ab__profile{max-width:1200px;margin:clamp(30px,5vh,60px) auto 0;display:grid;grid-template-columns:1.6fr 1fr;gap:clamp(30px,4vw,64px);align-items:start}
.ab__profile-txt{display:flex;flex-direction:column;gap:14px}
.ab__kicker{font-size:12px;font-weight:500;letter-spacing:.28em;color:var(--vi);text-transform:uppercase}
.ab__profile-txt h2{font-size:clamp(24px,2.4vw,34px);letter-spacing:-.02em;line-height:1.24}
.ab__para{font-size:14.5px;line-height:2;color:var(--ink-2);text-align:justify}
.ab__profile-side{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;padding:clamp(20px,2vw,28px);background:var(--bg-2);border:1px solid var(--line);border-radius:var(--rad)}
.ab__stat{padding:16px 12px;background:var(--bg);border:1px solid var(--line);border-radius:12px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;transition:border-color .35s var(--e),transform .35s var(--e-out)}
.ab__stat:hover{border-color:var(--vi);transform:translateY(-2px)}
.ab__stat-n{font-size:clamp(20px,2vw,26px);font-weight:500;color:var(--vi);letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.ab__stat-l{font-size:11.5px;color:var(--ink-2);letter-spacing:.02em;line-height:1.5}
@media (max-width:980px){.ab__profile{grid-template-columns:1fr}}
.ab__mvv{max-width:1200px;margin:clamp(60px,9vh,110px) auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,1.8vw,24px)}
.ab__mvv-c{padding:clamp(26px,2.6vw,36px) clamp(22px,2.2vw,32px);background:var(--bg-2);border:1px solid var(--line);border-radius:var(--rad);
display:flex;flex-direction:column;gap:10px;position:relative;overflow:hidden;
transition:transform .5s var(--e-out),box-shadow .5s var(--e-out),background-color .5s}
.ab__mvv-c:hover{transform:translateY(-4px);box-shadow:var(--sh-1);background:var(--bg)}
.ab__mvv-k{font-size:11.5px;font-weight:500;letter-spacing:.24em;color:var(--vi);text-transform:uppercase}
.ab__mvv-c h3{font-size:clamp(16px,1.6vw,20px);line-height:1.4;letter-spacing:-.01em}
@media (max-width:820px){.ab__mvv{grid-template-columns:1fr}}
.ab__tl{position:relative;background:var(--bg-2);padding:clamp(80px,11vh,130px) var(--pad) clamp(70px,10vh,110px)}
.ab__tl .ab__in{max-width:1200px}
.ab__tls{position:relative;margin:clamp(40px,6vh,72px) auto 0;padding-left:0;max-width:900px}
.ab__tls::before{content:'';position:absolute;left:80px;top:6px;bottom:6px;width:1px;background:linear-gradient(180deg,transparent,var(--line-2) 12%,var(--line-2) 88%,transparent)}
.ab__tl-i{position:relative;padding:0 0 clamp(30px,4vh,44px) 130px;display:flex;flex-direction:column;gap:6px;
opacity:0;translate:-14px 0;transition:opacity .75s var(--e-out) var(--d,0s),translate .75s var(--e-out) var(--d,0s)}
.ab__tls.in .ab__tl-i{opacity:1;translate:0 0}
.ab__tls .ab__tl-i:nth-child(2){--d:.06s}
.ab__tls .ab__tl-i:nth-child(3){--d:.12s}
.ab__tls .ab__tl-i:nth-child(4){--d:.18s}
.ab__tls .ab__tl-i:nth-child(5){--d:.24s}
.ab__tls .ab__tl-i:nth-child(6){--d:.3s}
.ab__tls .ab__tl-i:nth-child(7){--d:.36s}
.ab__tls .ab__tl-i:nth-child(8){--d:.42s}
.ab__tl-i::before{content:'';position:absolute;left:74px;top:8px;width:13px;height:13px;border-radius:50%;background:var(--bg-2);
border:2px solid var(--vi);box-shadow:0 0 0 4px var(--bg-2)}
.ab__tl-i--hi::before{background:var(--vi);border-color:var(--vi);box-shadow:0 0 0 4px var(--bg-2),0 0 0 6px rgba(144,0,131,.24)}
.ab__tl-y{position:absolute;left:0;top:4px;width:70px;font-size:13px;font-weight:500;color:var(--vi);letter-spacing:.04em;text-align:right;font-variant-numeric:tabular-nums}
.ab__tl-i h3{font-size:17px;letter-spacing:-.005em;color:var(--ink)}
.ab__tl-i p{font-size:13.5px;line-height:1.85;color:var(--ink-2)}
@media (max-width:640px){.ab__tls::before{left:14px}.ab__tl-i{padding-left:44px}.ab__tl-i::before{left:8px}.ab__tl-y{position:static;width:auto;text-align:left;margin-bottom:2px}}
.ab__subs{position:relative;background:var(--bg);padding:clamp(80px,11vh,130px) var(--pad) clamp(70px,10vh,110px)}
.ab__subgrid{max-width:var(--maxw);margin:clamp(30px,5vh,60px) auto 0;display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(14px,1.5vw,20px)}
.ab__sub{padding:clamp(22px,2.2vw,30px) clamp(18px,1.8vw,26px);background:var(--bg-2);border:1px solid var(--line);border-radius:var(--rad);
display:flex;flex-direction:column;gap:8px;position:relative;overflow:hidden;
transition:transform .5s var(--e-out),box-shadow .5s var(--e-out),background-color .5s,border-color .5s}
.ab__sub:hover{transform:translateY(-5px);box-shadow:var(--sh-1);background:var(--bg);border-color:var(--line-2)}
.ab__sub h3{font-size:16px;letter-spacing:-.005em;color:var(--ink)}
.ab__sub p{font-size:13px;line-height:1.75;color:var(--ink-2);flex:1}
.ab__sub-cta{display:inline-flex;align-items:center;gap:8px;margin-top:6px;font-size:12.5px;color:var(--vi)}
.ab__sub:hover .ab__sub-cta .arw{width:26px}
@media (max-width:1100px){.ab__subgrid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:720px){.ab__subgrid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.ab__subgrid{grid-template-columns:1fr}}
/* ============================================================
栏目子页重设计 v2 · 借鉴 17 站 + 三大奖研究（严守青藤铁律）
- 页面主视觉 .phero：近白 + 极浅 VI 紫氛围 + 独立晶格 canvas
- 「大·细·紧」超大细体负字距标题 + kicker 眉标 + 导语 + 滚动提示
- 解决方案：大图文交替编排；关于：大数字滚动计数
- 全站复用 demo03.js 的 data-reveal/scramble/count/magnet/beam
============================================================ */
/* 主视觉通用（长宽对齐产品中心首屏 .pcx：height:40vh;min-height:300px） */
.phero{position:relative;z-index:2;height:40vh;min-height:300px;display:flex;align-items:flex-end;overflow:hidden;
padding:clamp(84px,10vh,120px) var(--pad) clamp(28px,4vh,46px);
background:
radial-gradient(120% 92% at 80% 6%,var(--vi-wash2) 0%,transparent 44%),
radial-gradient(92% 84% at 8% 100%,var(--vi-wash) 0%,transparent 52%),
linear-gradient(180deg,var(--bg-2) 0%,var(--bg) 100%)}
.phero__lattice{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:.7}
.phero__grain{position:absolute;inset:0;z-index:0;pointer-events:none;
background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
background-size:64px 64px;-webkit-mask-image:radial-gradient(80% 70% at 70% 30%,#000 0%,transparent 72%);mask-image:radial-gradient(80% 70% at 70% 30%,#000 0%,transparent 72%);opacity:.5}
.phero__in{position:relative;z-index:1;max-width:var(--maxw);margin:0 auto;width:100%;padding-left:22px}/* 22px = 胶囊导航 nav__cap 左内边距，使标题/小字与紫光 logo 左对齐 */
.phero__k{display:inline-flex;align-items:center;gap:14px;font-size:12.5px;font-weight:500;letter-spacing:.28em;text-transform:uppercase;color:var(--vi);margin-bottom:clamp(10px,1.6vh,16px)}
.phero__k::before{content:'';width:36px;height:1px;background:var(--vi);opacity:.55}
.phero__t{font-size:clamp(30px,4.6vw,58px);font-weight:500;line-height:1.03;letter-spacing:-.03em;color:var(--ink);max-width:15ch}
.phero__d{margin-top:clamp(10px,1.8vh,18px);max-width:54ch;font-size:clamp(15px,1.15vw,17.5px);line-height:1.95;color:var(--ink-2)}
.phero__cue{position:absolute;left:calc(var(--pad) + 22px);bottom:clamp(12px,1.8vh,20px);z-index:1;display:inline-flex;align-items:center;gap:10px;
font-size:12px;letter-spacing:.14em;color:var(--ink-3)}
.phero__cue i{width:1px;height:30px;background:linear-gradient(180deg,var(--ink-3),transparent);position:relative;overflow:hidden}
.phero__cue i::after{content:'';position:absolute;left:0;top:-30px;width:1px;height:30px;background:var(--vi);animation:pheroCue 2.1s var(--e-soft) infinite}
@keyframes pheroCue{0%{transform:translateY(0)}70%,100%{transform:translateY(60px)}}
@media (prefers-reduced-motion:reduce){.phero__cue i::after{animation:none;transform:translateY(0)}}
/* 主视觉下方首个区块：收顶部留白（phero 已提供） */
.sol-pg,.nw,.jo,.ab{padding-top:clamp(56px,9vh,104px)}
/* 栏目页主视觉 · 实拍底图变体（新闻与活动 / 解决方案），大标题白色加粗，小字字号对齐首页 .head__d（15.5px）；
文字一律无投影（用户 2026-09-21 明确删除）；解决方案（含复用同类的产品中心）另压深背景 20% 保证白字可读 */
.phero--news{background:url(../../images/hero-news-bg.jpg) center/cover no-repeat}
.phero--sol{background:linear-gradient(rgba(6,10,25,.2),rgba(6,10,25,.2)),url(../../images/hero-sol-bg.jpg) center/cover no-repeat}
.phero--news .phero__t,.phero--sol .phero__t{font-size:clamp(30px,4.6vw,58px);letter-spacing:-.045em;line-height:1.04;max-width:none;color:#fff;font-weight:700}
.phero--news .phero__d,.phero--sol .phero__d{font-size:15.5px;color:#fff}
/* 2026-10-19 点名：新闻与活动头图说明文字已整条删除，但大标题位置不得因此上串。
.phero 是 align-items:flex-end 底对齐，删掉 .phero__d 后标题直接贴到 hero 下内边距，比其它一级页高不了、反而低了一整段。
这里用等高的 margin-bottom 把「说明段落原本占的那块空档」补回来：段距 clamp(10px,1.8vh,18px) + 两行说明文字 2×(1.95×15.5px)。
窄屏（≤430px）时其它一级页的说明段落实测换成三行（360/400 宽 dH=91，440 起 dH=60），故那一档补三行。 */
.phero--news .phero__t{margin-bottom:calc(clamp(10px,1.8vh,18px) + 1.95 * 15.5px * 2)}
@media (max-width:430px){.phero--news .phero__t{margin-bottom:calc(clamp(10px,1.8vh,18px) + 1.95 * 15.5px * 3)}}
/* 栏目子页 · demo03-tech.html 技术与创新（2026-10-10 新建）：
头图同 phero--sol 口径（压深 20% 保白字）；底图 2026-10-10 已换成负责人提供的新图（蓝紫玻璃芯片渲染图 1424×736 渐进式 JPG），url 加 ?v= 防缓存 */
.phero--tech{background:linear-gradient(rgba(6,10,25,.2),rgba(6,10,25,.2)),url(../../images/hero-tech-bg.jpg?v=20261010j) center/cover no-repeat}
.phero--tech .phero__t{font-size:clamp(30px,4.6vw,58px);letter-spacing:-.045em;line-height:1.04;max-width:none;color:#fff;font-weight:700}
.phero--tech .phero__d{font-size:15.5px;color:#fff}
/* 投资者关系子页 · demo03-investor.html：
2026-10-10 负责人点名通栏底图改为「图片2」蓝色金融增长曲线图（新文件 hero-investor-bg.jpg，不覆盖共享的 investor-bg-hover-v6.jpg——后者仍被首页投资者版块引用）；
该图左侧为浅紫白雾、白字直接压会糊，故底图自带左深右透横向压暗 + 轻底部渐影保白字可读，右侧增长箭头基本透出；取景 center。 */
.phero--investor{background:linear-gradient(90deg,rgba(6,10,25,.66) 0%,rgba(6,10,25,.52) 30%,rgba(6,10,25,.18) 52%,rgba(6,10,25,0) 70%),linear-gradient(180deg,rgba(6,10,25,.15) 0%,rgba(6,10,25,0) 40%,rgba(6,10,25,.32) 100%),url(../../images/hero-investor-bg.jpg?v=20261010a) 50% 50%/cover no-repeat}
.phero--investor .phero__t{font-size:clamp(30px,4.6vw,58px);letter-spacing:-.045em;line-height:1.04;max-width:none;color:#fff;font-weight:700;text-shadow:0 1px 14px rgba(6,10,25,.35)}
.phero--investor .phero__d{font-size:15.5px;color:#fff;text-shadow:0 1px 12px rgba(6,10,25,.4)}
/* 合规政策声明详情页 · demo03-about-compliance.html（2026-11-02 点名「截图1的图片做为点击后截图2的banner图，长宽与其它页面一致」）：
底图逐字复用关于青藤页合规带同一张 images/compliance-band-city.jpg（1400x600 / AR 2.333），不另存副本、不改原文件（.ovc 仍在用它）；
连查询串也沿用关于页已有的 ?v=20261013b 而不是另起一个新串——同一 URL 才能命中浏览器里已缓存的那份，访问过关于页的用户下载 0 字节。
长宽不新设任何数值，直接继承上方 .phero 的 height:40vh;min-height:300px（该处原注：“长宽对齐产品中心首屏 .pcx”）+ 全幅通栏，与 news/sol/tech/investor/about 六张头图同一规格。
本条无标题无导语（页面下方已有 h1，头图里再放一遍是重复），故不需要 .phero--investor 那套左深右透压暗与文字投影，写法最接近 .phero--news（纯图 + cover）。
取景取 50% 60% 而非家族默认的 center：1440 视口下盒子 1440x360，图按宽放大到 1440x617、上下共溢出 257px；center 会把窗口顶边压到图片高 20.8% 处，
而左上那枚悬浮芯片约占图片 15%~25% 高（看原图估读），会被上边缘切剩一条边——半切态最难看；下移到 60% 后窗口顶边落在 25.0%，芯片整枚干净让出画面，地平线（约 45%）落到窗口中部。
上下合计裁掉 41.7%，仍少于家族里其它几张（hero-about-bg AR 1.779 同盒裁 55.5%、hero-tech-bg AR 1.935 裁 51.6%），不属异常取景。 */
.phero--compliance{background:url(../../images/compliance-band-city.jpg?v=20261013b) 50% 60%/cover no-repeat}
/* 版块二 · 公司介绍：2026-10-10 负责人点名重排——删眉标/「了解公司详情」按钮/右侧「投资者联系」卡，仅留公司介绍标题+正文；重设计为居中圆角面板（复用全站卡片语言 bg-2+描边+柔阴影+rad，标题居中+紫短下划线与版块三 .irann__title 同款母题），与上 hero、下公告版块协调；#ircontact 锚点移至面板 */
.irsec{position:relative;z-index:2;background:var(--bg);padding:clamp(64px,10vh,120px) var(--pad)}
.irsec__in{max-width:var(--maxw);margin:0 auto}
.irsec__panel{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--rad);box-shadow:var(--sh-1);padding:clamp(44px,6vw,80px) clamp(24px,5vw,72px)}
.irsec__t{position:relative;text-align:center;font-size:clamp(26px,3.2vw,40px);font-weight:600;letter-spacing:-.02em;line-height:1.12;color:var(--ink);margin-bottom:clamp(22px,3vh,34px)}
.irsec__t::after{content:'';display:block;width:40px;height:3px;border-radius:2px;background:var(--vi);margin:14px auto 0}
.irsec__p{max-width:78ch;margin:0 auto;font-size:clamp(15.5px,1.2vw,17px);line-height:2.05;color:var(--ink-2);text-align:justify;text-justify:inter-ideograph}
@media (max-width:640px){.irsec__p{text-align:left}}
/* 版块三 · 公告下载：照抄紫光股份 investor「最新公告」页排版（2026-10-10 负责人点名）——左子导航栏 + 右居中标题(紫短下划线) + 带 1px 边框斑马纹表格（标题 / 公告日期 两列，紫色链接标题、日期列竖分隔线）；公告条目取自负责人提供的截图1真实数据，未自创 */
.irann{position:relative;z-index:2;background:var(--bg);padding:clamp(56px,9vh,104px) var(--pad)}/* 2026-10-11 点名：底色由灰 var(--bg-2)#f7f7fa 改纯白 var(--bg)，断开与页脚灰 #f8f8f8 的粘连（内容区统一白、页脚灰自然成底）；侧栏卡自带描边+投影、表格自带发丝横线，白底上依旧清晰 */
.irann__in{max-width:var(--maxw);margin:0 auto;padding-left:22px;display:grid;grid-template-columns:230px minmax(0,1fr);gap:clamp(30px,4vw,60px);align-items:start}/* 2026-10-11 点名：左侧导航卡与上方「投资者关系」大标题左对齐——补上与 .phero__in 同一套的 padding-left:22px（两者 max-width/margin 本就相同，补后内容左边缘逐像素对齐） */
/* 左：子导航（投资者关系 / 公司公告[展开·当前] / 最新公告[选中] / 定期报告 / 股票行情 / 社会责任） */
.irann__side{background:var(--bg);border:1px solid var(--line);border-radius:20px;padding:16px;box-shadow:0 1px 2px rgba(16,18,32,.04),0 8px 24px -12px rgba(16,18,32,.14)}/* 2026-10-11 点名：侧边栏改浮动面板——四边 16px 内衽、圆角 20、低透明度柔和冷调投影。2026-10-11 再点名：左侧导航卡顶部与右侧表格顶部对齐——补 margin-top = 标题行高(1.08×字号) + 标题下边距（与 .irann__title 同一套 clamp 表达式，逐像素对齐、随视口自适应）。2026-10-11 三点名：改 !important——investor-nav.js 的 alignSide() 会用内联 margin-top 覆盖本值。2026-10-16 点名（导航卡顶边与表格顶边对齐）：删掉本行的 margin-top:calc(clamp(23px,2.5vw,30px) * 1.08 + clamp(26px,4vh,42px)) !important（原值留此备查）——10-15 点名把 .irann__title 下边距改成 clamp(18px,2.6vh,30px) 后，这里写死的 clamp(26px,4vh,42px) 没跟着改，多出的 12.6px 又被 !important 压住、JS 无法校正（1440×900 实测卡片顶 1271.3 / 表格顶 1258.7）。改为：JS 实测逐像素校正为准，静态兜底值搬到本页