@charset "utf-8";
/* 及核官网 v16 · 设计系统
   ─────────────────────────────────────────────────────────────
   基线 = v15（「第一版」v8 的浅色留白语言）。v16 只改两件事：

   ① 删掉全部「旁白文案」
      —— 口径注脚 / 数据来源 / 「示例数据」标记 / 图表下方的解释句 /
         区块末尾的编辑说明 / 首屏整段铺垫。只留数据与结论。
      规则：页面上不出现任何"解释这个数据是什么意思"的句子。

   ② 图表升级到「数据看板」级（参考 lingxing.com 的产品截图观感）
      —— 指标卡（千分位金额 + 迷你走势 + 环比）/ 双线渐变面积图（含浮动数值标签）
         / 环形构成图（含高亮段与深色数值标签）/ 排行横条 / 堆叠占比条。
      全部为内联 SVG + CSS 关键帧，零第三方库。

   纪律（承接 v15，不可回退）
     · 卡片零浮起阴影 —— 唯一例外是浮层数值标签（浮层不是卡片）
     · 字号只用 12 阶：12/14/16/18/20/22/25/28/30/36/40/50
     · 全宽区块（CTA）必须通屏，禁止做成居中圆角卡
     · 图表 CSS 默认值必须是终值，靠 html.anim 网关退初始态
   ───────────────────────────────────────────────────────────── */

:root{
  /* 品牌 */
  --brand:#01D8B6;          /* logo 原色，用于图表主线/填充/标记 */
  --brand-d:#07776E;        /* 浅底可用阶（文字/按钮），对比度 5.4:1 */
  --brand-l:#E4F9F5;
  --brand-l2:#F1FBF9;

  /* 数据系列色（环形图 / 堆叠条） */
  --s1:#01D8B6;             /* 系列一 · 品牌 mint */
  --s2:#4C8DF6;             /* 系列二 · 蓝 */
  --s3:#F0B429;             /* 系列三 · 琥珀 */
  --s4:#A78BFA;             /* 系列四 · 紫 */
  --s-line:#A8B8C2;         /* 对比折线（次要线） */

  /* 文字 */
  --t1:#141A1C;
  --t2:#2C373B;
  --t3:#5C686D;
  --t4:#93A0A4;
  --t5:#AEB9BD;

  /* 底与线 */
  --bg:#ffffff;
  --bg2:#F7FAFA;
  --bg3:#F2F7F6;
  --bg4:#F6F9F9;
  --line:#E8EEED;
  --line2:#F1F5F4;

  /* 语义（仅用于数据增减） */
  --up:#C0392B;
  --down:#1E8E6E;

  /* 字号 12 阶 */
  --f12:12px; --f14:14px; --f16:16px; --f18:18px; --f20:20px; --f22:22px;
  --f25:25px; --f28:28px; --f30:30px; --f36:36px; --f40:40px; --f50:50px;

  --r:10px; --r-s:6px; --r-l:20px;
  --wrap:1400px;
}

*{margin:0;padding:0;box-sizing:border-box}
html{font-size:62.5%}
body{
  font-family:"Microsoft YaHei","PingFang SC","Helvetica Neue",Arial,sans-serif;
  font-size:var(--f16);line-height:1.9;color:var(--t3);background:var(--bg);
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
u{text-decoration:none;font-style:normal}
ol,ul{list-style:none}
h1,h2,h3,h4{font-weight:500;color:var(--t1);line-height:1.4}
/* 数字族：金额/指标等宽，保证列对齐 */
.num,.kpi__v,.chart,.donut,.rank__v,.cyc__v,.bal__v,.fx td,.dbar__n,.ccard__big{
  font-variant-numeric:tabular-nums;font-feature-settings:"tnum";
}

.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 40px}

/* 区块节奏 —— 第一版的留白感主要来自这里 */
.sec{padding:104px 0}
.sec--tight{padding:72px 0}
.sec--alt{background:var(--bg2)}

.sec__hd{text-align:center;margin-bottom:60px}
.sec__hd--left{text-align:left}
.sec__t{font-size:var(--f36);letter-spacing:.5px}
.sec__lead{font-size:var(--f16);color:var(--t3);max-width:760px;margin:20px auto 0}
.sec__hd--left .sec__lead{margin-left:0}

/* 通用按钮 */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  height:52px;padding:0 32px;border-radius:var(--r-s);
  font-size:var(--f16);font-weight:500;line-height:1;
  border:1px solid var(--brand-d);cursor:pointer;
  transition:background-color .2s,border-color .2s,color .2s;
}
.btn--primary{background:var(--brand-d);color:#fff}
.btn--primary:hover{background:#05625B;border-color:#05625B}
.btn--ghost{background:var(--bg);color:var(--brand-d)}
.btn--ghost:hover{background:var(--brand-l2)}
.btn--sm{height:42px;padding:0 22px;font-size:var(--f14)}

/* ===================== 头部（官网栏目结构） ===================== */
.hd{position:sticky;top:0;z-index:60;background:var(--bg);border-bottom:1px solid var(--line)}
.hd::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;pointer-events:none;background:linear-gradient(90deg,#01D8B6,#4C8DF6 34%,transparent 76%);opacity:.85}
.hd__in{display:flex;align-items:center;height:76px}
.hd__logo{height:36px;width:auto;margin-right:44px}
.nav{display:flex;align-items:center;gap:30px;flex:1}
.nav__i{position:relative}
.nav__a{display:inline-flex;align-items:center;gap:5px;font-size:var(--f16);color:var(--t2);transition:color .2s;padding:26px 0}
.nav__a:hover,.nav__a.is-on{color:var(--brand-d)}
.nav__a i{width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid var(--t5);transition:transform .2s}
.nav__i:hover .nav__a i{transform:rotate(180deg)}
.nav__p{
  position:absolute;left:-22px;top:100%;min-width:268px;background:var(--bg);
  border:1px solid var(--line);border-radius:var(--r);padding:10px;
  opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .2s,transform .2s,visibility .2s;
}
.nav__i:hover .nav__p{opacity:1;visibility:visible;transform:none}
.nav__p a{display:block;font-size:var(--f14);color:var(--t2);padding:8px 12px;border-radius:var(--r-s);transition:background-color .18s,color .18s}
.nav__p a:hover{background:var(--brand-l2);color:var(--brand-d)}
.nav__p a span{display:block;font-size:var(--f12);color:var(--t4);line-height:1.7}
.nav__tel{font-size:var(--f14);color:var(--t2);margin-right:20px;white-space:nowrap}
.nav__tel b{color:var(--t1);font-weight:500}

/* ===================== 1 · 首屏 banner ===================== */
.hero{background:var(--bg);padding:80px 0 0;position:relative;overflow:hidden}
.hero__in{display:grid;grid-template-columns:1.05fr 1.25fr;gap:48px;align-items:center}

.badge{
  display:inline-flex;align-items:center;gap:8px;
  font-size:var(--f14);color:var(--brand-d);
  background:var(--brand-l2);border:1px solid #D5F2EC;border-radius:var(--r-s);
  padding:6px 14px;margin-bottom:22px;
}
.badge b{font-weight:500}

/* slogan 是视觉主标题：字号最大、两行等长、禁止词中折行 */
.hero__t{font-size:var(--f50);letter-spacing:1px;line-height:1.22}
.hero__t span,.hero__t em{display:inline;white-space:nowrap}
.hero__t em{font-style:normal;color:var(--brand-d);margin-left:14px}
/* 战略方向：必须与 slogan 同处核心位 */
.hero__sub{font-size:var(--f20);color:var(--t1);margin-top:20px;line-height:1.6}
.hero__cta{display:flex;gap:16px;margin-top:34px}

/* 国内 / 跨境 双轨 */
.rail{margin-top:30px;border-top:1px solid var(--line)}
.rail__r{display:grid;grid-template-columns:60px 1fr;gap:10px;align-items:baseline;padding:12px 0;border-bottom:1px solid var(--line2)}
.rail__k{font-size:var(--f12);color:var(--t4);letter-spacing:.5px}
.rail__v{font-size:var(--f14);color:var(--t2)}
.rail__v span{white-space:nowrap}
.rail__v span+span::before{content:"·";color:var(--t5);margin:0 6px}

/* ===================== 数据看板（banner 右栏）=====================
   版式参考 lingxing.com 产品截图：指标卡 → 面积图 → 环形图 + 排行。
   看板上的每一块都只呈现数据，不写解释性文字。
   ============================================================= */
.dash{display:grid;gap:12px}
.dash__row{display:grid;gap:12px}
.dash__row--kpi{grid-template-columns:repeat(3,1fr)}
.dash__row--sum{grid-template-columns:1fr 1.15fr}

.panel{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:18px}
.panel__hd{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}
.panel__hd h3{font-size:var(--f14);color:var(--t2);font-weight:500}
.panel__x{font-size:var(--f12);color:var(--t4)}

/* 图例 */
.lg{display:flex;gap:14px;align-items:center}
.lg__i{display:inline-flex;align-items:center;gap:6px;font-size:var(--f12);color:var(--t4);white-space:nowrap}
.lg__s{width:14px;height:2px;border-radius:2px;display:block}
.lg__s--a{background:var(--s1)}
.lg__s--b{background:repeating-linear-gradient(90deg,var(--s-line) 0 4px,transparent 4px 7px)}

/* ① 指标卡 */
.kpi{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:16px 16px 12px}
.kpi__l{font-size:var(--f12);color:var(--t4);display:flex;align-items:center;justify-content:space-between;gap:8px}
.kpi__d{font-size:var(--f12);display:inline-flex;align-items:center;gap:2px;white-space:nowrap}
.kpi__d--up{color:var(--up)}
.kpi__d--down{color:var(--down)}
.kpi__v{font-size:var(--f20);color:var(--t1);line-height:1.35;margin-top:8px;letter-spacing:-.3px;white-space:nowrap}
.kpi__sp{height:28px;margin-top:4px}
.kpi__sp svg{width:100%;height:28px;overflow:visible}
/* pathLength="100" + dasharray:100 → 与路径真实长度无关的「描边绘制」 */
.spark{fill:none;stroke:var(--s1);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:100}
.spark--f{stroke:var(--s-line);fill:none;stroke-width:1.4;stroke-dasharray:100}

/* ② 面积图 */
.chart__w{position:relative}
.chart__svg{width:100%;height:auto;display:block}
.chart__gl{stroke:var(--line2);stroke-width:1;stroke-dasharray:3 5}
.chart__ax{font-size:10px;fill:var(--t4)}
.chart__area{fill:url(#gArea);transform-box:view-box;transform-origin:44px 176px}
.chart__line{fill:none;stroke:var(--s1);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:100}
.chart__dash{fill:none;stroke:var(--s-line);stroke-width:1.5;stroke-dasharray:5 6;stroke-linecap:round}
.chart__halo{fill:var(--s1);opacity:.18;transform-box:fill-box;transform-origin:center}
.chart__dot{fill:var(--bg);stroke:var(--s1);stroke-width:2.5;transform-box:fill-box;transform-origin:center}
.chart__tip rect{fill:var(--bg);stroke:var(--line);stroke-width:1}
.chart__tip text{font-size:12px;fill:var(--t1);font-weight:500;font-variant-numeric:tabular-nums}
.chart__tip polygon{fill:var(--bg);stroke:var(--line);stroke-width:1}

/* ③ 及核引擎条 + 全球对账 / 单据→凭证 面板 */
.dash__eng{display:flex;align-items:center;gap:12px;background:var(--brand-l2);border:1px solid var(--brand-l);border-radius:var(--r);padding:10px 14px}
.dash__engk{font-size:var(--f12);font-weight:500;color:var(--brand-d);white-space:nowrap}
.dash__flow{flex:1;display:flex;align-items:center;gap:8px;min-width:0}
.dash__flow span{font-size:var(--f12);color:var(--t3);white-space:nowrap}
.dash__flow span.on{color:var(--brand-d);font-weight:500}
.dash__flow i{flex:1;height:1px;background-image:repeating-linear-gradient(90deg,var(--brand) 0 4px,transparent 4px 8px);background-repeat:repeat-x;opacity:.55}
.kpi__u{font-style:normal;font-size:var(--f12);color:var(--t3);margin-left:3px;font-weight:400}
.panel.rec,.panel.vch{display:flex;flex-direction:column}
.rec__l{flex:1;display:grid;grid-template-rows:repeat(4,1fr);align-items:center}
.rec__i{display:grid;grid-template-columns:110px 1fr 76px;gap:9px;align-items:center;font-size:var(--f12)}
.rec__n{color:var(--t2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rec__n i{font-style:normal;font-size:10px;color:var(--t4);margin-left:5px}
.rec__b{height:6px;background:var(--bg3);border-radius:3px;overflow:hidden}
.rec__b i{display:block;height:6px;width:var(--w);border-radius:3px;background:linear-gradient(90deg,#8FE7D8,var(--s1))}
.rec__v{text-align:right;color:var(--t1);white-space:nowrap;font-variant-numeric:tabular-nums}
.rec__ft,.vch__ft{display:flex;justify-content:space-between;align-items:center;gap:10px;border-top:1px solid var(--line2);margin-top:10px;padding-top:10px;font-size:var(--f12);color:var(--t4)}
.rec__ft b,.vch__ft b{font-weight:500;color:var(--brand-d)}
.vch__l{flex:1;display:grid;grid-template-rows:repeat(3,1fr);align-items:center}
.vch__i{display:grid;grid-template-columns:86px 1fr auto;gap:9px;align-items:center;font-size:var(--f12);color:var(--t2)}
.vch__i i{height:1px;background-image:repeating-linear-gradient(90deg,var(--brand) 0 4px,transparent 4px 8px);background-repeat:repeat-x;opacity:.55}
.vch__i b{font-weight:500;color:var(--t1);white-space:nowrap;font-variant-numeric:tabular-nums}

/* 首屏数据带 */
.dbar{position:relative;z-index:1;border-top:1px solid var(--line);margin-top:56px}
.dbar__in{display:grid;grid-template-columns:repeat(5,1fr)}
.dbar__it{padding:28px 26px;border-right:1px solid var(--line2)}
.dbar__it:last-child{border-right:0}
.dbar__n{font-size:var(--f40);font-weight:500;color:var(--brand-d);line-height:1.2;letter-spacing:-1px}
.dbar__n i{font-size:var(--f20);font-style:normal;font-weight:400;margin-left:2px}
.dbar__n--txt{font-size:var(--f30);letter-spacing:1px;line-height:1.5}
.dbar__l{font-size:var(--f14);color:var(--t3);margin-top:6px}
.dbar__ic{width:22px;height:22px;color:var(--brand);margin-bottom:10px;display:block}

/* ===================== 2 · 价值主张 ===================== */
.vgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.vcard{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:30px 26px;display:flex;flex-direction:column}
.vcard__k{font-size:var(--f12);color:var(--t4);letter-spacing:2px}
.vcard h3{font-size:var(--f22);margin:14px 0 10px;line-height:1.45}
.vcard p{font-size:var(--f14);color:var(--t3);line-height:1.9}
.vcard__ch{margin-top:auto;padding-top:22px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding-bottom:20px}
.vcard__ft{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding-top:14px}
.vcard__ft b{font-size:var(--f16);color:var(--brand-d);font-weight:500;font-variant-numeric:tabular-nums}
.vcard__ft span{font-size:var(--f12);color:var(--t4)}

/* ① 单据 → 凭证 链（箭头持续流动 = 流水） */
.chain{display:flex;align-items:center}
.chain__n{flex:1;text-align:center;font-size:var(--f12);color:var(--t2);background:var(--bg3);border:1px solid var(--line);border-radius:var(--r-s);padding:8px 4px;white-space:nowrap}
.chain__a{flex:0 0 16px;height:1px;background:var(--brand);position:relative}
.chain__a::after{content:"";position:absolute;right:0;top:-2px;border-left:4px solid var(--brand);border-top:2.5px solid transparent;border-bottom:2.5px solid transparent}

/* ② 月结周期条（含刻度轴） */
.cyc{display:grid;gap:9px}
.cyc__r{display:grid;grid-template-columns:54px 1fr 38px;gap:10px;align-items:center;font-size:var(--f12);color:var(--t3)}
.cyc__k{color:var(--t4);white-space:nowrap}
.cyc__t{height:8px;background:var(--line);border-radius:4px;overflow:hidden}
.cyc__t i{display:block;height:8px;border-radius:4px;width:var(--w);background:linear-gradient(90deg,#8FE7D8,var(--s1))}
.cyc__v{text-align:right;color:var(--t1)}
.cyc__ax{display:grid;grid-template-columns:54px 1fr 38px;gap:10px;font-size:10px;color:var(--t4)}
.cyc__ax div{grid-column:2;display:flex;justify-content:space-between}

/* ③ 试算平衡（两侧等宽，不得只给一侧加底色） */
.bal{display:grid;grid-template-columns:1fr 26px 1fr;align-items:center;gap:8px}
.bal__c{background:var(--bg3);border:1px solid var(--line);border-radius:var(--r-s);padding:16px 6px;text-align:center}
.bal__k{font-size:var(--f12);color:var(--t4);display:block}
.bal__v{font-size:var(--f16);color:var(--t1)}
.bal__eq{text-align:center;font-size:var(--f14);color:var(--brand-d)}

/* ④ 多币种折算：明细 + 堆叠占比条 */
.fx{width:100%;border-collapse:collapse;font-size:var(--f12)}
.fx th{color:var(--t4);font-weight:400;text-align:right;padding:0 0 8px;border-bottom:1px solid var(--line)}
.fx th:first-child{text-align:left}
.fx td{padding:6px 0;border-bottom:1px solid var(--line2);text-align:right;color:var(--t1)}
.fx tr:last-child td{border-bottom:0}
.fx td:first-child{text-align:left;color:var(--t3);font-variant-numeric:normal}
.fx .base{color:var(--brand-d)}
.fxbar{display:flex;height:8px;border-radius:4px;overflow:hidden;margin-top:14px;background:var(--bg3)}
.fxbar i{display:block;width:var(--w);transition:transform .8s cubic-bezier(.22,.8,.3,1);transform-origin:left}
.fxbar i:nth-child(1){background:var(--s1)}
.fxbar i:nth-child(2){background:var(--s2)}
.fxbar i:nth-child(3){background:var(--s3)}

/* 单据 → 科目 映射 / 账务核对指标（纯数据行，无解释句） */
.map{margin-top:14px;border-top:1px solid var(--line2)}
.map__r{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:baseline;padding:7px 0;border-bottom:1px solid var(--line2);font-size:var(--f12);line-height:1.6}
.map__r:last-child{border-bottom:0}
.map__r span{color:var(--t3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.map__r em{font-style:normal;color:var(--brand-d);white-space:nowrap;font-variant-numeric:tabular-nums}

/* ===================== 3 · 主线产品 ===================== */
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.eng{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:32px 28px}
.eng--key{background:var(--brand-l2);border-color:#D5F2EC}
.eng__k{display:inline-block;font-size:var(--f12);color:var(--brand-d);border:1px solid #D5F2EC;border-radius:var(--r-s);padding:2px 10px;margin-bottom:16px}
.eng h3{font-size:var(--f25)}
.eng__role{font-size:var(--f12);color:var(--t4);margin-top:6px;letter-spacing:.5px}
.eng p{font-size:var(--f14);color:var(--t3);margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.eng__tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}
.eng__tags span{font-size:var(--f12);color:var(--t3);background:var(--bg);border:1px solid var(--line);border-radius:var(--r-s);padding:3px 9px}

/* 对接能力条 */
.linkstrip{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:var(--r);margin-top:20px;background:var(--bg)}
.linkstrip__i{padding:24px 26px;border-right:1px solid var(--line2)}
.linkstrip__i:last-child{border-right:0}
.linkstrip__n{font-size:var(--f28);font-weight:500;color:var(--brand-d);line-height:1.2}
.linkstrip__n i{font-size:var(--f16);font-style:normal;font-weight:400;margin-left:1px}
.linkstrip__l{font-size:var(--f14);color:var(--t3);margin-top:4px}

/* ===================== 4 · 客户案例 ===================== */

/* 分类品牌墙 */
.cg{margin-top:56px}
.cg__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.cg__c{display:block;background:var(--bg);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.cg__img{display:block;position:relative;aspect-ratio:2.8/1;overflow:hidden;background:var(--bg3)}
.cg__img--logo{display:flex;align-items:center;justify-content:center;background:#fff}
.cg__img--logo img{width:62%;height:auto;object-fit:contain}
.cg__img img{width:100%;height:100%;object-fit:cover;display:block}
.cg__tag{position:absolute;top:12px;left:12px;background:rgba(255,255,255,.94);color:var(--brand-d);font-size:var(--f12);line-height:1;font-style:normal;padding:6px 11px;border-radius:999px}
.cg__t{display:block;padding:13px 18px;font-size:var(--f14);color:var(--t2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cg__c:hover{border-color:var(--brand)}
.cg__c:hover .cg__t{color:var(--brand-d)}
.cg__c.is-hide{display:none}
.bwall{margin-top:56px;border-top:1px solid var(--line);padding-top:44px}
.bwall__h{display:flex;align-items:baseline;gap:12px;margin-bottom:16px}
.bwall__h b{font-size:var(--f18);color:var(--t1);font-weight:500}
.bwall__h span{font-size:var(--f12);color:var(--t4)}
.bwall__m{display:grid;gap:10px;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 72px,#000 calc(100% - 72px),transparent);mask-image:linear-gradient(90deg,transparent,#000 72px,#000 calc(100% - 72px),transparent)}
.bwall__row{overflow:hidden}
.bwall__track{display:flex;width:max-content;animation:bwall-scroll 46s linear infinite}
.bwall__row--rev .bwall__track{animation-direction:reverse}
.bwall__row:hover .bwall__track{animation-play-state:paused}
.bwall__m .bwall__row:nth-child(1) .bwall__track{animation-duration:52s}
.bwall__m .bwall__row:nth-child(3) .bwall__track{animation-duration:44s}
.bwall__i{position:relative;flex:0 0 auto;margin-right:10px;background:#FFFFFF;border:1px solid var(--line);border-radius:var(--r-s);width:206px;height:106px;display:flex;align-items:center;justify-content:center;padding:16px}
.bwall__i img{max-height:74px;max-width:100%;width:auto;object-fit:contain;transition:transform .2s;mix-blend-mode:multiply}
.bwall__i:hover img{transform:scale(1.08)}
.bwall__i::after{content:attr(data-name);position:absolute;left:50%;bottom:calc(100% + 6px);transform:translateX(-50%) translateY(4px);background:var(--t1);color:#fff;font-size:var(--f12);line-height:1;padding:7px 10px;border-radius:4px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .18s,transform .18s;z-index:30}
.bwall__i:hover::after{opacity:1;transform:translateX(-50%) translateY(0)}
@keyframes bwall-scroll{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.bwall__track{animation:none}}

/* ===================== 5 · 最新动态 ===================== */
.news{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.news__c{display:flex;flex-direction:column;background:var(--bg);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:border-color .2s}
.news__c:hover{border-color:var(--brand)}
.news__img{display:block;aspect-ratio:3/2;overflow:hidden;background:var(--bg3)}
.news__img img{width:100%;height:100%;object-fit:cover;display:block}
.news__bd{display:flex;flex-direction:column;gap:10px;padding:16px 18px 18px}
.news__meta{display:flex;align-items:center;justify-content:space-between;gap:10px}
.news__d{font-size:var(--f12);color:var(--t4);font-variant-numeric:tabular-nums}
.news__tag{font-size:var(--f12);color:var(--brand-d);border:1px solid #D5F2EC;border-radius:var(--r-s);padding:2px 8px;white-space:nowrap}
.news__t{font-size:var(--f16);color:var(--t1);line-height:1.55}
.news__more{margin-top:20px;font-size:var(--f14);color:var(--brand-d)}
.creds span{font-size:var(--f14);color:var(--t3);border:1px solid var(--line);border-radius:var(--r-s);padding:6px 14px;background:var(--bg)}

/* ===================== 6 · CTA（通屏，非圆角卡）===================== */
.cta{background:var(--bg3);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:92px 0}
.cta__in{max-width:1000px;margin:0 auto;text-align:center}
.cta__in h2{font-size:var(--f36)}
.cta__in p{font-size:var(--f16);color:var(--t3);margin-top:18px}
.cta__in .btn{margin-top:32px}

/* 页脚 */
.ft{background:var(--bg);padding:64px 0 32px}
.ft__in{display:grid;grid-template-columns:1.5fr 1.34fr 1.18fr 1.2fr 1fr;gap:36px}
.ft__slog{font-size:var(--f20);font-weight:500;color:var(--t1);letter-spacing:.5px;margin-bottom:12px}
.ft__co{color:var(--t4);font-size:var(--f12)}
.ft__logo{height:34px;width:auto;margin-bottom:18px}
/* v17.34.1 · 页脚 logo 回首页链接（间距移交给链接容器，避免行内元素 margin 失效） */
.ft__logolink{display:inline-block;line-height:0;margin-bottom:18px;text-decoration:none}
.ft__logolink .ft__logo{display:block;margin-bottom:0}
.ft p{font-size:var(--f14);color:var(--t3);line-height:1.9}
.ft h4{font-size:var(--f16);color:var(--t1);margin-bottom:16px}
.ft li{font-size:var(--f14);color:var(--t3);line-height:1.5;margin-bottom:13px}
.ft li a{display:block}
.ft li a span{display:block;font-size:var(--f12);color:var(--t4);margin-top:3px;line-height:1.5;font-weight:400}
.ft li a:hover{color:var(--t1)}
.ft__qr{text-align:left}
.ft__qr img{display:block;width:92px;height:92px;border:1px solid var(--line);margin-bottom:10px}
.ft__qr p{font-size:var(--f12);color:var(--t4);line-height:1.7}
.ft__qr .ft__tel{margin-top:2px}
.ft__qr .ft__tel a{color:var(--t2);font-weight:500}
.ft .ft__co,.ft li.ft__co{font-size:var(--f12);color:var(--t4);line-height:1.7}
/* ── 右侧悬浮客服（v17.29.8 信息面板：主 CTA + 图标芯片行 + 文字常显，层次分明）── */
.svc{position:fixed;right:20px;bottom:30px;z-index:80;display:flex;flex-direction:column;
  width:164px;padding:11px;background:#fff;border:1px solid var(--line);border-radius:14px;
  box-shadow:0 12px 34px rgba(20,26,28,.10)}
/* L2 联系方式列表：图标芯片 + 常显文字 */
.svc__ls{display:flex;flex-direction:column;gap:3px;margin-top:9px}
.svc__it{position:relative;display:flex;align-items:center;gap:11px;height:48px;padding:0 10px;
  background:transparent;border:none;border-radius:9px;color:var(--t1);cursor:pointer;font:inherit;appearance:none;
  transition:background .2s}
.svc__it:hover{background:#F3FAF8}
/* L1 主操作：全宽品牌绿按钮（置于 .svc__it 之后，避免 background 被通用规则覆盖） */
.svc__it--pri{display:flex;align-items:center;justify-content:center;gap:8px;height:46px;
  background:var(--brand-d);border-radius:10px;color:#fff;
  font-size:var(--f14);font-weight:500;letter-spacing:.5px;transition:background .2s}
.svc__it--pri:hover{background:#05625B;color:#fff}
.svc__it--pri svg{width:20px;height:20px}
.svc__ic{display:flex;align-items:center;justify-content:center;width:30px;height:30px;flex:none;color:#0C6B62}
.svc__ic svg{display:block;flex:none;width:24px;height:24px}
.svc__tx{font-size:var(--f14);color:var(--t1);line-height:1;white-space:nowrap}
/* hover 滑出弹层（锚定面板左缘外侧） */
.svc__fc{position:absolute;right:calc(100% + 12px);top:50%;transform:translate(6px,-50%);white-space:nowrap;
  font-size:var(--f14);line-height:1;padding:11px 13px;background:#fff;border:1px solid var(--line);
  border-radius:9px;color:var(--t1);font-variant-numeric:tabular-nums;
  box-shadow:0 6px 18px rgba(20,26,28,.07);opacity:0;visibility:hidden;
  transition:opacity .18s,transform .18s,visibility .18s}
.svc__it--tel:hover .svc__fc,.svc__it--wx:hover .svc__fc{opacity:1;visibility:visible;transform:translate(0,-50%)}
/* 企微二维码弹卡：图片等比缩放（源图 233×230，禁止强制正方形变形） */
.svc__fc--qr{display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 12px 10px}
.svc__fc--qr img{display:block;width:120px;height:auto;border:1px solid var(--line);border-radius:6px}
.svc__fc--qr b{font-size:var(--f14);font-weight:500;color:var(--t1)}
.svc__fc--qr span{font-size:var(--f12);color:var(--t4)}
/* L3 回到顶部：工具级弱化行，隐藏时不占位；分隔线横贯面板全宽 */
.svc__it--top{display:none;justify-content:center;gap:6px;height:36px;margin-top:9px;
  color:var(--t3);font-size:var(--f12)}
.svc__it--top svg{width:16px;height:16px}
.svc__it--top.is-show{display:flex}
.svc__it--top:hover{color:var(--brand-d);background:transparent}
.svc__it--top.is-show::before{content:'';position:absolute;left:-10px;right:-10px;top:-5px;height:1px;background:var(--line)}
.ft__bot{border-top:1px solid var(--line);margin-top:44px;padding-top:24px;display:flex;justify-content:space-between;gap:20px;font-size:var(--f12);color:var(--t4)}

/* ===================== 动效网关 =====================
   默认 = 终值；html.anim（JS 确认可动画才打）退到起始态；.play 回终值。
   禁止任何「运行期猜测环境能否动画」的自愈逻辑（v12/v13 两次事故）。
   html.noanim 只要静态终值，必须排在最后并用 !important 钉死。
   循环类关键帧（流水流动 / 标记点呼吸）在 reduce 下必须停。
   ==================================================== */
.dy{opacity:1;transform:none;transition:opacity .55s ease,transform .55s ease}
html.anim .dy{opacity:0;transform:translateY(12px)}
html.anim .play .dy{opacity:1;transform:none}

/* —— 看板：指标卡迷你走势（描边绘制） */
.spark{transition:stroke-dashoffset .95s cubic-bezier(.22,.8,.3,1)}
html.anim .spark{stroke-dashoffset:100}
html.anim .play .spark{stroke-dashoffset:0}

/* —— 看板：面积图（面积 scaleX 展开，折线描边绘制，虚线淡入并持续流动） */
.chart__area{transition:transform 1.1s cubic-bezier(.22,.8,.3,1)}
.chart__line{transition:stroke-dashoffset 1.15s cubic-bezier(.22,.8,.3,1) .12s}
.chart__dash{transition:opacity .6s ease .5s;animation:flow 6.5s linear infinite}
.chart__gl,.chart__ax{transition:opacity .5s ease}
.chart__halo,.chart__dot{transition:transform .5s cubic-bezier(.34,1.4,.5,1) .95s,opacity .4s ease .95s}
.chart__tip{transition:opacity .45s ease 1.05s,transform .45s ease 1.05s}
@keyframes flow{from{stroke-dashoffset:0}to{stroke-dashoffset:-22}}
@keyframes halo{0%,100%{transform:scale(1);opacity:.18}50%{transform:scale(1.5);opacity:.06}}
html.anim .chart__area{transform:scaleX(0)}
html.anim .play .chart__area{transform:scaleX(1)}
html.anim .chart__line{stroke-dashoffset:100}
html.anim .play .chart__line{stroke-dashoffset:0}
html.anim .chart__gl,html.anim .chart__ax,html.anim .chart__dash,html.anim .chart__tip{opacity:0}
html.anim .play .chart__gl,html.anim .play .chart__ax,html.anim .play .chart__dash,html.anim .play .chart__tip{opacity:1}
html.anim .chart__halo,html.anim .chart__dot{opacity:0;transform:scale(0)}
html.anim .play .chart__halo{opacity:.18;transform:scale(1);animation:halo 2.8s ease-in-out 1.6s infinite}
html.anim .play .chart__dot{opacity:1;transform:scale(1)}
html.anim .chart__tip{transform:translateY(5px)}
html.anim .play .chart__tip{transform:none}

/* —— 看板：环形图（逐段扫出 + 中心数字 + 图例 + 浮层标签） */


/* —— 看板：排行横条 */


/* —— 价值主张图表 */
.chain__n,.chain__a{transition:opacity .45s ease}
html.anim .chain__n,html.anim .chain__a{opacity:0}
html.anim .play .chain__n,html.anim .play .chain__a{opacity:1}
.chain__a{background-image:repeating-linear-gradient(90deg,var(--brand) 0 4px,transparent 4px 8px);background-size:8px 1px;background-repeat:repeat-x;background-color:transparent;animation:flowx 1.6s linear infinite}
@keyframes flowx{from{background-position:0 0}to{background-position:8px 0}}

.cyc__t i{transition:width .9s cubic-bezier(.22,.8,.3,1)}
html.anim .cyc__t i{width:0}
html.anim .play .cyc__t i{width:var(--w)}

.fxbar i{transition:transform .8s cubic-bezier(.22,.8,.3,1)}
html.anim .fxbar i{transform:scaleX(0)}
html.anim .play .fxbar i{transform:scaleX(1)}
.fxbar i:nth-child(2){transition-delay:.12s}
.fxbar i:nth-child(3){transition-delay:.24s}

.cmp__b i{transition:transform .85s cubic-bezier(.22,.8,.3,1)}
html.anim .cmp__b i{transform:scaleX(0)}
html.anim .play .cmp__b i{transform:scaleX(1)}
.cmp__r--now .cmp__b i{transition-delay:.22s}

/* reduce：只去掉位移/缩放与循环动画，保留淡入（媒体查询只压时长） */
html.reduce .dy{transform:none}
html.reduce .chain__a,html.reduce .chart__dash,html.reduce .chart__halo{animation:none}
html.reduce .chart__area,html.reduce .fxbar i,html.reduce .cmp__b i{transform:none}
@media (prefers-reduced-motion:reduce){
  .dy,.cyc__t i,.chain__n,.chain__a,.spark,.chart__area,.chart__line,.chart__gl,.chart__ax,
  .chart__dash,.chart__halo,.chart__dot,.chart__tip,.fxbar i{transition-duration:.22s}
}

/* 静态终值（截图验收 / JS 异常兜底）—— 必须最后写 */
html.noanim .dy{opacity:1!important;transform:none!important;transition:none!important}
html.noanim .spark{stroke-dashoffset:0!important;transition:none!important}
html.noanim .chart__area{transform:scaleX(1)!important;transition:none!important}
html.noanim .chart__line{stroke-dashoffset:0!important;transition:none!important}
html.noanim .chart__dash,html.noanim .chart__gl,html.noanim .chart__ax,html.noanim .chart__tip{
  opacity:1!important;transform:none!important;transition:none!important}
html.noanim .chart__dash{animation:none!important}
html.noanim .chart__halo{opacity:.18!important;transform:scale(1)!important;animation:none!important;transition:none!important}
html.noanim .chart__dot{opacity:1!important;transform:scale(1)!important;transition:none!important}
html.noanim .cyc__t i{width:var(--w)!important;transition:none!important}
html.noanim .chain__n,html.noanim .chain__a{opacity:1!important;transition:none!important}
html.noanim .chain__a{animation:none!important}
html.noanim .fxbar i,html.noanim .cmp__b i{transform:scaleX(1)!important;transition:none!important}

/* ===================== 响应式 ===================== */
@media (max-width:1440px){ .wrap{padding:0 32px} }
@media (max-width:1200px){
  .hero__in{grid-template-columns:1fr;gap:52px}
  .vgrid,.pgrid{grid-template-columns:repeat(2,1fr)}
  .linkstrip{grid-template-columns:repeat(2,1fr)}
  .linkstrip__i:nth-child(2){border-right:0}
  .linkstrip__i:nth-child(-n+2){border-bottom:1px solid var(--line2)}
  .nav,.nav__tel{display:none}
  .ft__in{grid-template-columns:1fr 1fr}
}
@media (max-width:1200px){
  .cg__grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:900px){
  .bwall__i{width:186px;height:98px}
}
@media (max-width:760px){
  .sec{padding:68px 0}
  .sec__hd{margin-bottom:40px}
  .vgrid,.pgrid,.linkstrip{grid-template-columns:1fr}
  .linkstrip__i{border-right:0;border-bottom:1px solid var(--line2)}
  .dbar__in{grid-template-columns:1fr 1fr}
  .dbar__it{border-right:0;border-bottom:1px solid var(--line2)}
  .hero__t{font-size:var(--f36)}
  .hero__sub{font-size:var(--f18)}
  .cg__grid{grid-template-columns:1fr}
  .bwall__i{width:156px;height:84px}.bwall__i img{max-height:54px}
  .news{grid-template-columns:1fr}
  .cta{padding:64px 0}
  .ft__in{grid-template-columns:1fr}
  .rail__r{grid-template-columns:1fr;gap:4px}
  .dash__row--kpi{grid-template-columns:1fr}
  .dash__row--sum{grid-template-columns:1fr}
  .rec__i{grid-template-columns:86px 1fr 70px}
  .vch__i{grid-template-columns:76px 1fr auto}
  .dash__eng{flex-wrap:wrap}
}


/* ═══════════ v17.6 · 预约演示弹窗 ═══════════ */
.dmo{position:fixed;inset:0;z-index:200;visibility:hidden;opacity:0;transition:opacity .22s,visibility .22s}
.dmo.is-on{visibility:visible;opacity:1}
.dmo__mask{position:absolute;inset:0;background:rgba(16,24,22,.46)}
.dmo__box{position:relative;max-width:580px;margin:5vh auto 0;background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:0 0 28px;transform:translateY(14px);transition:transform .22s;max-height:88vh;overflow:auto}
.dmo__band{display:block;height:6px;border-radius:var(--r) var(--r) 0 0;background:linear-gradient(90deg,#01D8B6,#4C8DF6 34%,#F0B429 52%,#A78BFA 66%,transparent 88%)}
.dmo.is-on .dmo__box{transform:translateY(0)}
.dmo__x{position:absolute;top:10px;right:12px;width:34px;height:34px;border:0;background:none;font-size:22px;color:var(--t4);cursor:pointer}
.dmo__x:hover{color:var(--t1)}
.dmo__head{padding:30px 42px 0}
.dmo__head img{height:30px;margin-bottom:16px}
.dmo__head h3{font-size:var(--f24,22px);color:var(--t1);font-weight:500;margin:0 0 10px}
.dmo__head p{font-size:var(--f14);color:var(--t3);line-height:1.8;margin:0 0 22px}
.dmo__form{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:0 42px}
.dmo__f{display:flex;flex-direction:column;gap:6px}
.dmo__f--full{grid-column:1/-1}
.dmo__f span{font-size:var(--f12);color:var(--t3)}
.dmo__f input,.dmo__f select,.dmo__f textarea{border:1px solid var(--line);border-radius:var(--r-s);background:var(--bg);padding:9px 12px;font-size:var(--f14);color:var(--t1);font-family:inherit;outline:none}
.dmo__f input:focus,.dmo__f select:focus,.dmo__f textarea:focus{border-color:var(--brand)}
.dmo__hp{position:absolute!important;left:-9999px!important;top:auto;width:1px;height:1px;opacity:0;pointer-events:none}
.dmo__err{grid-column:1/-1;margin:0;font-size:var(--f12);color:#C0392B}
.dmo__go{grid-column:1/-1;margin-top:4px}
.dmo__go[disabled]{opacity:.62;cursor:default}
.dmo__alt{grid-column:1/-1;text-align:center;font-size:var(--f12);color:var(--t4);margin:0}
.dmo__alt a{color:var(--t2)}
.dmo__ok{text-align:center;padding:24px 42px 8px}
.dmo__ok h3{font-size:var(--f20);color:var(--t1);font-weight:500;margin:14px 0 10px}
.dmo__ok p{font-size:var(--f14);color:var(--t3);line-height:1.9;margin:0 0 20px}
.dmo__ok .btn{min-width:120px}

/* ═══ v17.27.0 · 页脚底栏备案链接（去重复电话后仅备案号，按要求跳工信部） ═══ */
.ft__bot a{color:inherit;text-decoration:none;transition:color .2s}
.ft__bot a:hover{color:var(--brand-d)}
/* v17.34.0 · 备案号旁工商网监标识（与老站同图标同尺寸 17×19；全局 img 为 block，须回 inline） */
.ft__bot .ft__gs{display:inline-block;margin-left:8px;vertical-align:-4px;opacity:.85;border-radius:2px}

/* ═══════════ v17.28.0 移动端适配 ═══════════ */
/* 页面级横向溢出兜底：内容层逐项修复，此处只阻断横向滚动 */
html,body{overflow-x:hidden}
main svg{max-width:100%}
main svg[viewBox]{height:auto}
/* 抽屉导航（≤1200px 出现，与 .nav 隐藏断点一致） */
.mnav__btn{display:none}
.mnav{position:absolute;left:0;right:0;top:100%;background:var(--bg);border-bottom:1px solid var(--line);
  box-shadow:0 18px 44px rgba(16,24,22,.12);opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity .2s,transform .2s,visibility .2s;max-height:calc(100vh - 64px);overflow:auto}
.mnav.is-open{opacity:1;visibility:visible;transform:none}
.mnav__links{display:flex;flex-direction:column;padding:4px 22px}
.mnav__links a{padding:13px 2px;font-size:15px;color:var(--t1);border-bottom:1px solid var(--line2)}
.mnav__links a:last-child{border-bottom:0}
.mnav__links a.is-on{color:var(--brand-d);font-weight:600}
.mnav__ft{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 22px 20px;border-top:1px solid var(--line2)}
.mnav__ft span{font-size:13px;color:var(--t3)}
.mnav__ft b{color:var(--t1);font-weight:600}
@media (max-width:1200px){
  .mnav__btn{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
    width:42px;height:42px;border:1px solid var(--line);border-radius:10px;background:var(--bg);
    cursor:pointer;margin-left:12px;flex:none}
  .mnav__btn i{display:block;width:18px;height:2px;border-radius:1px;background:var(--t1);
    transition:transform .2s,opacity .2s}
  .mnav__btn.is-on i:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .mnav__btn.is-on i:nth-child(2){opacity:0}
  .mnav__btn.is-on i:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .hd__in{height:64px}
  .hd__logo{height:30px;margin-right:0}
  .hd__in .btn--sm{height:36px;padding:0 14px;font-size:13px;margin-left:12px;flex:none}
}
@media (max-width:420px){
  .hd__in .btn--sm{padding:0 11px;font-size:12px}
}
/* 首页 hero：slogan 双 span 换行堆叠、副标收窄 */
@media (max-width:760px){
  .hero__t{font-size:clamp(30px,8.8vw,40px)}
  .hero__t span,.hero__t em{display:block;white-space:nowrap}
  .hero__t em{margin-left:0;margin-top:4px}
  .hero__sub{font-size:16px}
  .hero__sub br{display:none}
  .hero__cta{flex-wrap:wrap}
  .chart__svg{max-width:100%;height:auto}
  .ft__bot{flex-wrap:wrap;gap:6px}
}
