/* ［公司名称］官网样式 v11 · 参照企业微信官网的视觉语言（基础版式 + v11 主题 + 横幅插画） */
:root {
  color-scheme: light;
  --primary: #1a62d6;
  --primary-dark: #1450b3;
  --primary-soft: #eef4fe;
  --navy: #151f2e;
  --text: #1f2937;
  --text-2: #5b6474;
  --text-3: #8a93a3;
  --line: #e5e8ef;
  --bg: #ffffff;
  --bg-2: #f6f8fb;
  --radius: 6px;
  --shadow-sm: 0 4px 14px -6px rgba(20,60,140,.14);
  --shadow: 0 18px 40px -20px rgba(20,60,140,.28);
  --ease: cubic-bezier(.2,.7,.2,1);
  --font: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", "Helvetica Neue", Arial, sans-serif;
  --hd: 64px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); font: 14px/1.75 var(--font); -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, h4, p { margin: 0; }
h1, h2, h3 { font-weight: 600; text-wrap: balance; }
img { max-width: 100%; display: block; }
button { font-family: var(--font); }
:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.wrap { max-width: 1240px; margin-inline: auto; padding-inline: 24px; }
.ph { color: var(--primary); }
.ico { display: inline-block; width: 20px; height: 20px; flex: none; }
.ico svg { width: 100%; height: 100%; display: block; stroke-width: 1.7; }

/* 图片位 */
.img { position: relative; margin: 0; background: #e9eef5; overflow: hidden; display: flex; align-items: center; justify-content: center; text-align: center; color: var(--text-3); font-size: 13px; padding: 16px; max-width: 100%; border-radius: var(--radius); }
.img::after { content: ""; position: absolute; inset: 0; background: var(--src) center / cover no-repeat; transition: transform .8s var(--ease); }
.r-43 { aspect-ratio: 4 / 3; } .r-169 { aspect-ratio: 16 / 9; } .r-1610 { aspect-ratio: 16 / 10; } .r-45 { aspect-ratio: 4 / 5; }

/* 按钮 */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 40px; padding: 0 22px; border-radius: 4px; border: 1px solid var(--primary); background: var(--primary); color: #fff; font-size: 14px; cursor: pointer; white-space: nowrap; transition: all .3s var(--ease); }
.btn:hover { background: var(--primary-dark); border-color: var(--primary-dark); box-shadow: 0 8px 18px -8px rgba(22,100,255,.7); }
.btn .ico { width: 16px; height: 16px; transition: transform .3s var(--ease); }
.btn:hover .ico { transform: translateX(3px); }
.btn.lg { height: 46px; padding: 0 30px; font-size: 15px; }
.btn.sm { height: 34px; padding: 0 16px; font-size: 13px; }
.btn.ghost { background: #fff; color: var(--text); border-color: #d3d9e3; }
.btn.ghost:hover { color: var(--primary); border-color: var(--primary); box-shadow: none; }
.btn.line { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.5); color: #fff; }
.btn.line:hover { background: #fff; color: var(--navy); border-color: #fff; box-shadow: none; }
.link { display: inline-flex; align-items: center; gap: 4px; color: var(--primary); font-size: 14px; }
.link .ico { width: 15px; height: 15px; transition: transform .3s var(--ease); }
.link:hover .ico { transform: translateX(4px); }

/* ============ 页头与大菜单 ============ */
.header { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 50; background: rgba(255,255,255,.96); backdrop-filter: saturate(1.4) blur(10px); border-bottom: 1px solid var(--line); transition: box-shadow .3s; }
.header.scrolled { box-shadow: 0 6px 20px -12px rgba(20,60,140,.25); }
.header > .wrap { height: var(--hd); display: flex; align-items: center; gap: 40px; }
.logo { display: flex; align-items: center; gap: 10px; flex: none; }
.logo-img { width: 34px; height: 34px; border-radius: 6px; background: linear-gradient(135deg, #2b7bff, #1450b3); color: #fff; font-size: 10px; display: grid; place-items: center; letter-spacing: .02em; }
.logo-text b { display: block; font-size: 17px; color: var(--navy); line-height: 1.25; }
.logo-text small { display: block; font-size: 10.5px; color: var(--text-3); letter-spacing: .04em; }
.nav { display: flex; align-items: stretch; height: 100%; flex: 1; }
.nav > a, .nav > .dd > a { position: relative; display: flex; align-items: center; gap: 4px; height: 100%; padding: 0 16px; font-size: 14.5px; color: var(--text); transition: color .2s; }
.nav > a::after, .nav > .dd > a::after { content: ""; position: absolute; left: 16px; right: 16px; bottom: -1px; height: 2px; background: var(--primary); transform: scaleX(0); transition: transform .3s var(--ease); }
.nav > a:hover, .nav > .dd:hover > a, .nav a.on { color: var(--primary); }
.nav > a:hover::after, .nav > .dd:hover > a::after, .nav a.on::after { transform: scaleX(1); }
.nav .dd > a .ico { width: 14px; height: 14px; transition: transform .3s var(--ease); }
.nav .dd:hover > a .ico { transform: rotate(180deg); }
.dd { position: relative; }
.dd.mega { position: static; }
.drop { position: absolute; top: 100%; left: 0; min-width: 180px; background: #fff; border: 1px solid var(--line); border-radius: 0 0 var(--radius) var(--radius); box-shadow: var(--shadow); padding: 8px 0; opacity: 0; visibility: hidden; transform: translateY(8px); transition: all .25s var(--ease); }
.drop a { display: block; padding: 9px 20px; color: var(--text-2); font-size: 14px; }
.drop a:hover { color: var(--primary); background: var(--bg-2); }
.dd:hover .drop, .dd:focus-within .drop { opacity: 1; visibility: visible; transform: none; }
.mega-panel { position: absolute; left: 0; right: 0; top: 100%; background: #fff; border-top: 1px solid var(--line); box-shadow: 0 30px 50px -30px rgba(20,60,140,.35); opacity: 0; visibility: hidden; transform: translateY(8px); transition: all .28s var(--ease); }
.dd.mega:hover .mega-panel, .dd.mega:focus-within .mega-panel { opacity: 1; visibility: visible; transform: none; }
.mega-in { display: grid; grid-template-columns: 1fr 300px; gap: 40px; padding-block: 28px 32px; }
.mega-title { font-size: 13px; color: var(--text-3); margin-bottom: 12px; }
.mega-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px 16px; }
.mega-grid a { display: flex; gap: 12px; padding: 12px 14px; border-radius: var(--radius); transition: background .2s; }
.mega-grid a:hover { background: var(--bg-2); }
.mega-grid .ico { width: 36px; height: 36px; padding: 8px; border-radius: 8px; background: var(--primary-soft); color: var(--primary); }
.mega-grid b { display: flex; align-items: center; gap: 4px; font-size: 14.5px; font-weight: 500; color: var(--text); }
.mega-grid span { display: block; font-size: 12.5px; color: var(--text-3); line-height: 1.6; margin-top: 2px; }
.mega-grid a:hover b { color: var(--primary); }
.mega-side { background: linear-gradient(160deg, #f1f6ff, #e6efff); border-radius: 8px; padding: 22px; display: grid; gap: 10px; align-content: start; }
.mega-side b { font-size: 16px; color: var(--navy); }
.mega-side p { font-size: 13px; color: var(--text-2); }
.mega-side .btn { justify-self: start; margin-top: 6px; }
.hd-right { display: flex; align-items: center; gap: 20px; flex: none; }
.hd-tel { display: flex; align-items: center; gap: 6px; font-size: 14px; color: var(--text-2); }
.hd-tel .ico { width: 16px; height: 16px; color: var(--primary); }
.menu-btn { display: none; width: 40px; height: 40px; border: 0; background: none; padding: 0; flex-direction: column; justify-content: center; align-items: center; gap: 5px; cursor: pointer; margin-left: auto; }
.menu-btn i { display: block; width: 20px; height: 2px; background: var(--navy); border-radius: 2px; transition: transform .3s var(--ease), opacity .2s; }
.menu-btn.x i:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.menu-btn.x i:nth-child(2) { opacity: 0; }
.menu-btn.x i:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ============ 首页首屏 ============ */
.hero { position: relative; }
.slider { position: relative; height: 560px; background: var(--navy); overflow: hidden; color: #fff; }
.slide { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity 1s var(--ease), visibility 0s 1s; }
.slide.on { opacity: 1; visibility: visible; transition: opacity 1s var(--ease); z-index: 1; }
.slide::before { content: ""; position: absolute; inset: 0; background: var(--src) center / cover no-repeat; transform: scale(1.08); transition: transform 7.5s linear, translate .8s var(--ease); }
.slide.on::before { transform: scale(1); }
.slide::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(9,18,32,.88) 0%, rgba(9,18,32,.55) 45%, rgba(9,18,32,.05) 100%); }
.slide .wrap { position: relative; z-index: 2; height: 100%; display: flex; flex-direction: column; justify-content: center; padding-bottom: 90px; }
.slide .tag { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; border-radius: 20px; background: rgba(66,140,255,.18); border: 1px solid rgba(120,175,255,.35); color: #b9d4ff; font-size: 13px; }
.slide .tag .ico { width: 14px; height: 14px; }
.slide h1, .slide h2 { font-size: 46px; line-height: 1.3; margin-top: 20px; letter-spacing: .01em; max-width: 16em; }
.slide .sub { margin-top: 16px; font-size: 17px; line-height: 1.85; color: #c9d4e2; max-width: 33em; }
.slide .ph { color: #9cc4ff; }
.slide .btns { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; }
.slide.on .tag, .slide.on h1, .slide.on h2, .slide.on .sub, .slide.on .btns { animation: rise .9s var(--ease) both; }
.slide.on h1, .slide.on h2 { animation-delay: .1s; }
.slide.on .sub { animation-delay: .2s; }
.slide.on .btns { animation-delay: .3s; }
@keyframes rise { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
.slider-ctrl { position: absolute; left: 0; right: 0; bottom: 104px; z-index: 3; display: flex; align-items: center; justify-content: space-between; }
.dots { display: flex; gap: 10px; }
.dots button { width: 44px; height: 18px; padding: 0; border: 0; background: none; cursor: pointer; display: flex; align-items: center; }
.dots i { display: block; width: 100%; height: 2px; background: rgba(255,255,255,.28); position: relative; overflow: hidden; }
.dots i::after { content: ""; position: absolute; inset: 0; background: #fff; transform: scaleX(0); transform-origin: left; }
.dots button.on i::after { animation: bar var(--dur, 6500ms) linear forwards; }
.slider.paused .dots button.on i::after { animation-play-state: paused; }
@keyframes bar { to { transform: scaleX(1); } }
.arrows { display: flex; gap: 10px; }
.arrows button { width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(255,255,255,.3); background: rgba(255,255,255,.05); color: #fff; cursor: pointer; display: grid; place-items: center; transition: all .3s var(--ease); }
.arrows button:hover { background: #fff; color: var(--navy); }
.arrows .ico { width: 18px; height: 18px; }

/* 首屏快捷入口 */
.quick { position: relative; z-index: 5; margin-top: -72px; }
.quick-in { display: grid; grid-template-columns: repeat(4, 1fr); background: #fff; border-radius: 8px; box-shadow: 0 24px 50px -24px rgba(20,60,140,.35), 0 0 0 1px rgba(20,60,140,.05); overflow: hidden; }
.quick a { position: relative; display: grid; grid-template-columns: auto 1fr; gap: 4px 14px; padding: 24px 24px 22px; background: linear-gradient(180deg, #fff, #fff); transition: background .35s var(--ease); }
.quick a + a { border-left: 1px solid var(--line); }
.quick a .ico { grid-row: span 2; width: 40px; height: 40px; padding: 9px; border-radius: 8px; background: var(--primary-soft); color: var(--primary); transition: all .35s var(--ease); }
.quick b { font-size: 16px; color: var(--navy); display: flex; align-items: center; gap: 4px; }
.quick b .ico { width: 15px; height: 15px; padding: 0; background: none; grid-row: auto; opacity: 0; transform: translateX(-6px); transition: all .3s var(--ease); }
.quick span { font-size: 13px; color: var(--text-3); line-height: 1.6; }
.quick a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--primary); transform: scaleX(0); transition: transform .4s var(--ease); }
.quick a:hover { background: linear-gradient(180deg, #f4f8ff, #fff); }
.quick a:hover::after { transform: scaleX(1); }
.quick a:hover > .ico { background: var(--primary); color: #fff; }
.quick a:hover b { color: var(--primary); }
.quick a:hover b .ico { opacity: 1; transform: none; }

/* ============ 通用区块 ============ */
.sec { padding-block: 88px; }
.sec.gray { background: var(--bg-2); }
.sec.tint { background: linear-gradient(180deg, #f4f7fc 0%, #fff 100%); }
.hd-row { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px 40px; flex-wrap: wrap; margin-bottom: 40px; }
.hd-row h2 { font-size: 32px; color: var(--navy); letter-spacing: .01em; }
.hd-row p { margin-top: 8px; font-size: 15px; color: var(--text-2); max-width: 46em; }
.sec-title { text-align: center; margin-bottom: 44px; }
.sec-title h2 { font-size: 32px; color: var(--navy); }
.sec-title p { margin-top: 8px; font-size: 15px; color: var(--text-2); }
.sec-title .wm { display: none; }

/* 业务切换面板 */
.xp { display: grid; grid-template-columns: 260px 1fr; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; background: #fff; box-shadow: var(--shadow-sm); }
.xp-nav { background: var(--bg-2); border-right: 1px solid var(--line); padding: 10px 0; }
.xp-nav button { position: relative; width: 100%; display: flex; align-items: center; gap: 12px; padding: 16px 24px; border: 0; background: none; text-align: left; font-size: 15px; color: var(--text); cursor: pointer; transition: all .25s var(--ease); }
.xp-nav button .ico { width: 20px; height: 20px; color: var(--text-3); transition: color .25s; }
.xp-nav button::before { content: ""; position: absolute; left: 0; top: 12px; bottom: 12px; width: 3px; border-radius: 0 3px 3px 0; background: var(--primary); transform: scaleY(0); transition: transform .3s var(--ease); }
.xp-nav button:hover { color: var(--primary); }
.xp-nav button.on { background: #fff; color: var(--primary); font-weight: 500; }
.xp-nav button.on .ico, .xp-nav button:hover .ico { color: var(--primary); }
.xp-nav button.on::before { transform: scaleY(1); }
.xp-panels { position: relative; min-height: 460px; }
.xp-panel { display: none; grid-template-columns: 1fr 1fr; gap: 40px; padding: 40px 44px; align-items: center; }
.xp-panel.on { display: grid; animation: fadeIn .5s var(--ease) both; }
@keyframes fadeIn { from { opacity: 0; transform: translateX(16px); } to { opacity: 1; transform: none; } }
.xp-panel h3 { font-size: 24px; color: var(--navy); }
.xp-panel .desc { margin-top: 12px; font-size: 14.5px; color: var(--text-2); }
.feat { list-style: none; margin: 22px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 18px; }
.feat li { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--text); }
.feat .ico { width: 16px; height: 16px; color: var(--primary); }
.xp-panel .fit { margin-top: 18px; padding: 10px 14px; border-radius: 4px; background: var(--bg-2); font-size: 13px; color: var(--text-2); }
.xp-panel .btns { display: flex; gap: 12px; margin-top: 26px; flex-wrap: wrap; }
.xp-panel .img { box-shadow: var(--shadow); }

/* 行业方案 */
.sol-tabs { display: flex; gap: 8px; border-bottom: 1px solid var(--line); margin-bottom: 28px; overflow-x: auto; scrollbar-width: none; }
.sol-tabs::-webkit-scrollbar { display: none; }
.sol-tabs button { position: relative; flex: none; display: flex; align-items: center; gap: 8px; padding: 14px 20px; border: 0; background: none; font-size: 15px; color: var(--text-2); cursor: pointer; transition: color .2s; }
.sol-tabs button .ico { width: 18px; height: 18px; }
.sol-tabs button::after { content: ""; position: absolute; left: 20px; right: 20px; bottom: -1px; height: 2px; background: var(--primary); transform: scaleX(0); transition: transform .3s var(--ease); }
.sol-tabs button:hover, .sol-tabs button.on { color: var(--primary); }
.sol-tabs button.on::after { transform: scaleX(1); }
.sol { display: none; grid-template-columns: 1.1fr 1fr; border-radius: 8px; overflow: hidden; border: 1px solid var(--line); background: #fff; box-shadow: var(--shadow-sm); }
.sol.on { display: grid; animation: fadeUp .5s var(--ease) both; }
@keyframes fadeUp { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.sol-l { padding: 40px 44px; }
.sol-l h3 { font-size: 22px; color: var(--navy); }
.sol-l h4 { margin: 24px 0 10px; font-size: 14px; color: var(--text-3); font-weight: 500; }
.pain { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.pain li { display: flex; gap: 10px; font-size: 14.5px; color: var(--text); }
.pain li::before { content: ""; flex: none; width: 6px; height: 6px; margin-top: 9px; border-radius: 50%; background: #f08a3c; }
.sol-l .how { font-size: 14.5px; color: var(--text-2); }
.sol-l .btns { margin-top: 28px; display: flex; gap: 12px; flex-wrap: wrap; }
.sol-r { position: relative; padding: 40px 44px; background: linear-gradient(150deg, #10244a 0%, #173a78 60%, #1f56b0 100%); color: #fff; overflow: hidden; }
.sol-r::before { content: ""; position: absolute; right: -80px; top: -80px; width: 320px; height: 320px; border-radius: 50%; background: radial-gradient(circle, rgba(120,180,255,.35), rgba(120,180,255,0) 70%); }
.sol-r h4 { position: relative; font-size: 14px; color: #a9c6f3; font-weight: 500; margin-bottom: 18px; }
.mods { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.mods span { display: flex; align-items: center; justify-content: center; text-align: center; min-height: 64px; padding: 10px; border-radius: 6px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14); font-size: 14px; backdrop-filter: blur(4px); transition: all .3s var(--ease); }
.sol.on .mods span { animation: fadeUp .5s var(--ease) both; }
.sol.on .mods span:nth-child(2) { animation-delay: .05s; } .sol.on .mods span:nth-child(3) { animation-delay: .1s; } .sol.on .mods span:nth-child(4) { animation-delay: .15s; } .sol.on .mods span:nth-child(5) { animation-delay: .2s; } .sol.on .mods span:nth-child(6) { animation-delay: .25s; }
.mods span:hover { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.3); transform: translateY(-2px); }
.sol-r .core { position: relative; margin-top: 16px; padding: 14px; border-radius: 6px; text-align: center; background: rgba(22,100,255,.5); border: 1px solid rgba(140,190,255,.45); font-size: 14px; }
.sol-r .core small { display: block; color: #b9d0f2; font-size: 12px; }
.sol-note { margin-top: 14px; font-size: 13px; color: var(--text-3); }

/* 优势 */
.vals { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.val { position: relative; padding: 30px 28px; border-radius: 8px; background: linear-gradient(180deg, #f3f7fd 0%, #fff 60%); border: 1px solid var(--line); overflow: hidden; transition: all .35s var(--ease); }
.val .ico { width: 44px; height: 44px; padding: 10px; border-radius: 10px; background: #fff; color: var(--primary); box-shadow: var(--shadow-sm); transition: all .35s var(--ease); }
.val b { display: block; margin-top: 18px; font-size: 17px; color: var(--navy); }
.val p { margin-top: 6px; font-size: 14px; color: var(--text-2); }
.val::after { content: ""; position: absolute; right: -40px; bottom: -40px; width: 120px; height: 120px; border-radius: 50%; background: radial-gradient(circle, rgba(22,100,255,.1), rgba(22,100,255,0) 70%); transition: transform .5s var(--ease); }
.val:hover { transform: translateY(-6px); box-shadow: var(--shadow); border-color: transparent; }
.val:hover .ico { background: var(--primary); color: #fff; }
.val:hover::after { transform: scale(1.8); }

/* 数据带 */
.stats { position: relative; color: #fff; background: linear-gradient(rgba(10,22,40,.86), rgba(10,22,40,.86)), var(--src) center 30% / cover, var(--navy); }
.stats .wrap { display: grid; grid-template-columns: repeat(4, 1fr); padding-block: 60px; }
.stats .wrap > div { text-align: center; padding: 0 16px; }
.stats .wrap > div + div { border-left: 1px solid rgba(255,255,255,.14); }
.stats b { display: block; font-size: 42px; font-weight: 600; line-height: 1.2; font-variant-numeric: tabular-nums; }
.stats b sup { font-size: 18px; margin-left: 2px; color: #9cc4ff; }
.stats span { display: block; margin-top: 6px; font-size: 14px; color: #aebbd0; }

/* 案例 */
.cases { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
@media (min-width: 601px) and (max-width: 960px) { .cases-home > .case:nth-child(3) { display: none; } }
.case { display: block; background: #fff; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; transition: all .35s var(--ease); }
.case[hidden] { display: none; }
.case .thumb { position: relative; overflow: hidden; }
.case .thumb .img { border-radius: 0; }
.case .thumb::after { content: ""; position: absolute; inset: 0; background: rgba(12,32,66,.5); opacity: 0; transition: opacity .4s var(--ease); }
.case .view { position: absolute; left: 50%; top: 50%; z-index: 2; display: inline-flex; align-items: center; gap: 6px; padding: 8px 18px; border: 1px solid rgba(255,255,255,.75); border-radius: 20px; color: #fff; font-size: 14px; opacity: 0; transform: translate(-50%, -30%); transition: all .4s var(--ease); }
.case .view .ico { width: 15px; height: 15px; }
.case .info { padding: 20px 22px 24px; }
.case h3 { font-size: 17px; color: var(--navy); transition: color .2s; }
.case .tag { margin-top: 4px; font-size: 13px; color: var(--text-3); }
.case p { margin-top: 10px; font-size: 14px; color: var(--text-2); }
a.case:hover { transform: translateY(-6px); box-shadow: var(--shadow); border-color: transparent; }
a.case:hover .thumb .img::after { transform: scale(1.06); }
a.case:hover .thumb::after { opacity: 1; }
a.case:hover .view { opacity: 1; transform: translate(-50%, -50%); }
a.case:hover h3 { color: var(--primary); }
.case.pop { animation: fadeUp .5s var(--ease) both; }
.more { text-align: center; margin-top: 28px; font-size: 13px; color: var(--text-3); }

/* 服务流程（首页） */
.flow { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, 1fr); counter-reset: s; }
.flow li { position: relative; counter-increment: s; text-align: center; padding: 0 8px; }
.flow li::before { content: "0" counter(s); position: relative; z-index: 1; display: grid; place-items: center; width: 52px; height: 52px; margin: 0 auto 16px; border-radius: 50%; background: #fff; border: 1px solid #cfdbef; color: var(--primary); font-size: 16px; font-weight: 600; transition: all .35s var(--ease); }
.flow li + li::after { content: ""; position: absolute; top: 26px; right: 50%; width: 100%; height: 1px; background: linear-gradient(90deg, #cfdbef, #cfdbef 50%, transparent 50%) 0 0 / 8px 1px repeat-x; }
.flow li:hover::before { background: var(--primary); color: #fff; border-color: var(--primary); box-shadow: 0 10px 20px -8px rgba(22,100,255,.7); transform: translateY(-3px); }
.flow b { display: block; font-size: 16px; color: var(--navy); }
.flow span { display: block; margin-top: 4px; font-size: 13px; color: var(--text-2); }

/* 客户滚动条 */
.marquee { position: relative; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.marquee + .marquee { margin-top: 16px; }
.mq-track { display: flex; gap: 16px; width: max-content; animation: mq 40s linear infinite; }
.marquee.rev .mq-track { animation-direction: reverse; }
.marquee:hover .mq-track { animation-play-state: paused; }
.mq-track div { width: 180px; height: 72px; flex: none; display: grid; place-items: center; border-radius: 6px; background: #fff; border: 1px solid var(--line); color: var(--text-3); font-size: 13px; }
@keyframes mq { to { transform: translateX(calc(-50% - 8px)); } }

/* 底部咨询条 */
.cta { position: relative; overflow: hidden; background: linear-gradient(100deg, #eaf2ff 0%, #f5f9ff 55%, #e6f0ff 100%); }
.cta::before, .cta::after { content: ""; position: absolute; border-radius: 50%; border: 1px solid rgba(22,100,255,.12); }
.cta::before { width: 420px; height: 420px; right: -80px; top: -200px; }
.cta::after { width: 260px; height: 260px; right: 60px; bottom: -180px; }
.cta .wrap { position: relative; display: flex; justify-content: space-between; align-items: center; gap: 20px 40px; flex-wrap: wrap; padding-block: 52px; }
.cta h2 { font-size: 26px; color: var(--navy); }
.cta p { margin-top: 6px; color: var(--text-2); font-size: 15px; }
.cta .btns { display: flex; gap: 12px; flex-wrap: wrap; }

/* ============ 栏目页 ============ */
.page-banner { position: relative; overflow: hidden; background: var(--navy); color: #fff; }
.page-banner::before { content: ""; position: absolute; inset: 0; background: var(--src) center / cover no-repeat; animation: kb 12s var(--ease) both; transition: translate .8s var(--ease); }
/* 实时动画横幅：canvas 就绪后淡入，替换静态图 */
/* 横幅主视觉的轻量动效：鼠标视差、周期扫光、缓慢漂浮的光斑（main.js 注入 .fx） */
.slide::before, .page-banner::before { translate: calc(var(--px, 0) * -16px) calc(var(--py, 0) * -8px); }
.fx { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.fx canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.fx .sweep { position: absolute; top: -20%; bottom: -20%; left: 0; width: 38%; background: linear-gradient(100deg, transparent 0%, rgba(255,255,255,0) 30%, rgba(255,255,255,.45) 50%, rgba(255,255,255,0) 70%, transparent 100%); transform: translateX(-120%) skewX(-12deg); animation: sweep 7s var(--ease) infinite 1.5s; }
@keyframes sweep { 0% { transform: translateX(-120%) skewX(-12deg); } 45%, 100% { transform: translateX(300%) skewX(-12deg); } }
@media (prefers-reduced-motion: reduce) { .fx { display: none; } }
.page-banner::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(9,18,32,.85), rgba(9,18,32,.35) 60%, rgba(9,18,32,.05)); }
@keyframes kb { from { transform: scale(1.1); } to { transform: scale(1); } }
.page-banner .wrap { position: relative; z-index: 1; padding-block: 88px 92px; }
.page-banner .en { font-size: 13px; letter-spacing: .2em; color: #9cc4ff; text-transform: uppercase; }
.page-banner h1 { margin-top: 10px; font-size: 40px; letter-spacing: .04em; }
.page-banner .en, .page-banner h1 { animation: rise .9s var(--ease) both; }
.page-banner h1 { animation-delay: .1s; }
.crumb { position: sticky; top: calc(env(safe-area-inset-top, 0px) + var(--hd)); z-index: 20; background: rgba(255,255,255,.96); backdrop-filter: blur(8px); border-bottom: 1px solid var(--line); }
.crumb .wrap { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px 24px; min-height: 52px; font-size: 13px; color: var(--text-3); }
.crumb .path a:hover { color: var(--primary); }
.subnav { display: flex; flex-wrap: wrap; }
.subnav a { position: relative; padding: 15px 18px; font-size: 14px; color: var(--text-2); transition: color .2s; }
.subnav a::after { content: ""; position: absolute; left: 18px; right: 18px; bottom: -1px; height: 2px; background: var(--primary); transform: scaleX(0); transition: transform .3s var(--ease); }
.subnav a:hover { color: var(--primary); }
.subnav a:hover::after { transform: scaleX(1); }
[id] { scroll-margin-top: calc(var(--hd) + 64px); }

/* 公司简介 */
.about { display: grid; grid-template-columns: 1.1fr 1fr; gap: 56px; align-items: center; }
.about .text { display: grid; gap: 14px; color: var(--text-2); font-size: 15px; line-height: 1.9; }
.about .text p { text-indent: 2em; }
.about .img { box-shadow: 18px 18px 0 -2px #e6eefb; }
.facts { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 48px; border-radius: 8px; border: 1px solid var(--line); background: linear-gradient(180deg, #f5f8fd, #fff); }
.facts div { padding: 24px 12px; text-align: center; }
.facts div + div { border-left: 1px solid var(--line); }
.facts b { display: block; font-size: 30px; color: var(--primary); font-weight: 600; line-height: 1.3; }
.facts span { font-size: 13px; color: var(--text-2); }
.founder { display: grid; grid-template-columns: 300px 1fr; gap: 56px; align-items: start; }
.founder .img { box-shadow: 18px 18px 0 -2px #e1e9f6; }
.founder h3 { font-size: 24px; color: var(--navy); }
.founder .role { color: var(--text-3); margin-top: 2px; }
.founder .text { display: grid; gap: 12px; margin-top: 18px; color: var(--text-2); font-size: 15px; }
.founder ul { margin: 6px 0 0; padding-left: 1.2em; color: var(--text-2); }
.history { list-style: none; margin: 0 auto; padding: 0; max-width: 860px; position: relative; }
.history::before { content: ""; position: absolute; left: 120px; top: 10px; bottom: 10px; width: 1px; background: linear-gradient(#cfdbef, #cfdbef 50%, transparent 50%) 0 0 / 1px 8px repeat-y; }
.history li { display: grid; grid-template-columns: 120px 1fr; gap: 36px; padding: 16px 0; position: relative; transition: transform .3s var(--ease); }
.history li::before { content: ""; position: absolute; left: 114px; top: 26px; width: 13px; height: 13px; border-radius: 50%; background: #fff; border: 3px solid var(--primary); box-shadow: 0 0 0 4px var(--primary-soft); }
.history li:hover { transform: translateX(6px); }
.history .y { font-size: 20px; font-weight: 600; color: var(--primary); text-align: right; padding-right: 12px; }
.history .d { padding: 10px 18px; border-radius: 6px; background: #fff; border: 1px solid var(--line); color: var(--text-2); }
.history .d b { display: block; color: var(--navy); font-size: 15.5px; }
.promise { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.promise > div { padding: 30px 24px; border-radius: 8px; background: linear-gradient(180deg, #f3f7fd, #fff 60%); border: 1px solid var(--line); transition: all .35s var(--ease); }
.promise .ico { display: block; width: 44px; height: 44px; padding: 10px; border-radius: 10px; background: #fff; color: var(--primary); box-shadow: var(--shadow-sm); transition: all .35s var(--ease); }
.promise b { display: block; margin-top: 16px; font-size: 17px; color: var(--navy); }
.promise p { margin-top: 6px; font-size: 14px; color: var(--text-2); }
.promise > div:hover { transform: translateY(-6px); box-shadow: var(--shadow); border-color: transparent; }
.promise > div:hover .ico { background: var(--primary); color: #fff; }

/* 业务详情 */
.svc { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; padding-block: 56px; border-bottom: 1px solid var(--line); }
.svc:first-child { padding-top: 0; }
.svc:last-child { border-bottom: 0; padding-bottom: 0; }
.svc:nth-child(even) .img { order: 2; }
.svc .img { box-shadow: var(--shadow); transition: transform .4s var(--ease); }
.svc:hover .img { transform: translateY(-4px); }
.svc .t { display: flex; align-items: center; gap: 12px; }
.svc .t .ico { width: 44px; height: 44px; padding: 10px; border-radius: 10px; background: var(--primary-soft); color: var(--primary); }
.svc h3 { font-size: 24px; color: var(--navy); }
.svc .desc { margin-top: 14px; color: var(--text-2); font-size: 15px; }
.svc h4 { margin: 20px 0 10px; font-size: 14px; color: var(--text-3); font-weight: 500; }
.svc ul { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 8px 20px; font-size: 14px; }
.svc ul li { display: flex; align-items: center; gap: 8px; }
.svc ul li::before { content: ""; width: 16px; height: 16px; flex: none; border-radius: 50%; background: var(--primary-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a62d6' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 10px no-repeat; }
.svc .fit { margin-top: 18px; padding: 10px 14px; border-radius: 4px; background: var(--bg-2); font-size: 13px; color: var(--text-2); }
.tech-intro { max-width: 800px; margin: -24px auto 28px; text-align: center; color: var(--text-2); }
.table-box { overflow-x: auto; border-radius: 8px; border: 1px solid var(--line); background: #fff; }
table.tech { width: 100%; border-collapse: collapse; font-size: 14px; min-width: 560px; }
table.tech th, table.tech td { padding: 15px 22px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
table.tech tr:last-child td { border-bottom: 0; }
table.tech th { background: var(--bg-2); color: var(--text-2); font-weight: 500; font-size: 13px; }
table.tech td:first-child { width: 160px; color: var(--navy); font-weight: 600; }
table.tech td:last-child { width: 130px; color: var(--text-2); }
table.tech tbody tr { transition: background .2s; }
table.tech tbody tr:hover { background: #f5f8fd; }
.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; list-style: none; margin: 0; padding: 0; counter-reset: st; }
.steps li { position: relative; counter-increment: st; padding: 28px 26px; border-radius: 8px; background: #fff; border: 1px solid var(--line); overflow: hidden; transition: all .35s var(--ease); }
.steps li::before { content: "0" counter(st); display: block; font-size: 30px; font-weight: 700; line-height: 1.1; color: transparent; -webkit-text-stroke: 1px #b8c8e2; transition: all .3s; }
.steps li::after { content: ""; position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; background: var(--primary); transform: scaleX(0); transform-origin: left; transition: transform .45s var(--ease); }
.steps b { display: block; margin-top: 10px; font-size: 17px; color: var(--navy); }
.steps p { margin-top: 6px; font-size: 14px; color: var(--text-2); }
.steps li:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: transparent; }
.steps li:hover::after { transform: scaleX(1); }
.steps li:hover::before { color: var(--primary); -webkit-text-stroke-color: var(--primary); }

/* 案例筛选与详情 */
.filter { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-bottom: 36px; }
.filter button { height: 36px; padding: 0 20px; border-radius: 18px; border: 1px solid var(--line); background: #fff; color: var(--text-2); font-size: 14px; cursor: pointer; transition: all .25s var(--ease); }
.filter button:hover { color: var(--primary); border-color: var(--primary); }
.filter button.on { background: var(--primary); border-color: var(--primary); color: #fff; box-shadow: 0 8px 16px -8px rgba(22,100,255,.7); }
.detail { display: grid; grid-template-columns: 1fr 300px; gap: 48px; align-items: start; }
.detail h2 { font-size: 28px; color: var(--navy); }
.detail .date { margin: 6px 0 20px; font-size: 13px; color: var(--text-3); }
.detail h3 { margin: 34px 0 10px; font-size: 18px; color: var(--navy); padding-left: 12px; border-left: 3px solid var(--primary); line-height: 1.3; }
.detail p { color: var(--text-2); font-size: 15px; }
.detail .shots { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 12px; }
.side { background: linear-gradient(180deg, #f3f7fd, #fff); border: 1px solid var(--line); border-radius: 8px; padding: 24px; position: sticky; top: calc(var(--hd) + 72px); }
.side h4 { margin: 0 0 12px; font-size: 16px; color: var(--navy); }
.side dl { margin: 0; font-size: 14px; }
.side dl div { display: flex; gap: 12px; padding: 9px 0; border-bottom: 1px dashed #d8dfea; }
.side dt { width: 70px; flex: none; color: var(--text-3); }
.side dd { margin: 0; }
.side .btn { width: 100%; margin-top: 20px; }
.pager { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--line); font-size: 14px; color: var(--text-2); }
.pager a:hover { color: var(--primary); }

/* 联系 */
.ways { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 56px; }
.ways > div { padding: 28px 20px; text-align: center; border-radius: 8px; background: linear-gradient(180deg, #f3f7fd, #fff 60%); border: 1px solid var(--line); transition: all .35s var(--ease); }
.ways .ico { display: block; width: 48px; height: 48px; padding: 12px; margin: 0 auto 12px; border-radius: 50%; background: #fff; color: var(--primary); box-shadow: var(--shadow-sm); transition: all .35s var(--ease); }
.ways b { display: block; font-size: 15px; color: var(--navy); }
.ways span { display: block; margin-top: 4px; font-size: 14px; color: var(--text-2); user-select: all; word-break: break-all; }
.ways > div:hover { transform: translateY(-6px); box-shadow: var(--shadow); border-color: transparent; }
.ways > div:hover .ico { background: var(--primary); color: #fff; }
.contact { display: grid; grid-template-columns: 1fr 1.3fr; gap: 56px; }
.contact h3 { font-size: 20px; color: var(--navy); margin-bottom: 16px; }
.contact ul { list-style: none; margin: 0; padding: 0; }
.contact li { display: flex; gap: 12px; padding: 13px 0; border-bottom: 1px dashed var(--line); font-size: 14px; }
.contact li span:first-child { width: 72px; flex: none; color: var(--text-3); }
.contact .img { margin-top: 24px; }
.form { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 18px; padding: 28px; border-radius: 8px; border: 1px solid var(--line); background: #fff; box-shadow: var(--shadow-sm); }
.form .full { grid-column: 1 / -1; }
.form label { display: block; font-size: 13.5px; margin-bottom: 6px; color: var(--text); }
.form label i { color: #e5484d; font-style: normal; margin-left: 2px; }
.form input, .form select, .form textarea { width: 100%; height: 40px; font: 14px var(--font); color: var(--text); border: 1px solid #d5dbe5; border-radius: 4px; padding: 0 12px; background: #fff; transition: border-color .2s, box-shadow .2s; }
.form textarea { height: 120px; padding: 10px 12px; resize: vertical; }
.form input:hover, .form select:hover, .form textarea:hover { border-color: #aebbd0; }
.form input:focus, .form select:focus, .form textarea:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(22,100,255,.14); }
.form .status { grid-column: 1 / -1; font-size: 14px; }
.form .status.err { color: #e5484d; }
.form .status.ok { color: #1f9d55; }

/* ============ 页脚 ============ */
.footer { background: #0f1724; color: #8f9bb0; font-size: 13px; }
.f-promise { border-bottom: 1px solid #262930; }
.f-promise .wrap { display: grid; grid-template-columns: repeat(4, 1fr); padding-block: 28px; }
.f-promise div { display: flex; align-items: center; justify-content: center; gap: 12px; color: #d5ddea; font-size: 15px; }
.f-promise div + div { border-left: 1px solid #262930; }
.f-promise .ico { width: 30px; height: 30px; color: #4fb0ff; }
.footer .cols { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr auto; gap: 32px; padding-block: 44px 36px; }
.footer h4 { margin: 0 0 14px; color: #fff; font-size: 14px; font-weight: 500; }
.footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.footer a { transition: color .2s; }
.footer a:hover { color: #fff; }
.footer .ph { color: #7fb0ff; }
.footer .brand p { line-height: 1.8; max-width: 22em; }
.qr { display: grid; gap: 8px; justify-items: center; }
.qr-box { width: 104px; height: 104px; border: 1px dashed #3a4a60; border-radius: 6px; display: grid; place-items: center; align-content: center; gap: 4px; color: #6f7e95; font-size: 11px; }
.qr-box .ico { width: 34px; height: 34px; }
.footer .copy { border-top: 1px solid #262930; }
.footer .copy .wrap { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 6px 24px; padding-block: 18px; }

/* 悬浮咨询栏 */
.float-bar { position: fixed; right: 18px; bottom: 40px; z-index: 40; display: grid; background: #fff; border-radius: 8px; box-shadow: 0 16px 40px -16px rgba(20,60,140,.4), 0 0 0 1px rgba(20,60,140,.06); }
.float-bar > * { position: relative; width: 64px; padding: 12px 0 10px; display: grid; justify-items: center; gap: 4px; font-size: 12px; color: var(--text-2); background: none; border: 0; cursor: pointer; transition: color .2s, background .2s; }
.float-bar > * + * { border-top: 1px solid var(--line); }
.float-bar > *:first-child { border-radius: 8px 8px 0 0; background: var(--primary); color: #fff; }
.float-bar > *:first-child:hover { background: var(--primary-dark); color: #fff; }
.float-bar > *:last-child { border-radius: 0 0 8px 8px; }
.float-bar .ico { width: 22px; height: 22px; }
.float-bar > *:hover, .float-bar > *:focus-visible { color: var(--primary); background: #f3f7fd; }
.fb-pop { position: absolute; right: calc(100% + 12px); top: 50%; transform: translate(10px, -50%); opacity: 0; visibility: hidden; background: #fff; border-radius: 8px; box-shadow: 0 16px 40px -16px rgba(20,60,140,.4), 0 0 0 1px rgba(20,60,140,.06); padding: 14px 18px; white-space: nowrap; font-size: 13px; color: var(--text-2); text-align: center; transition: all .3s var(--ease); }
.fb-pop b { display: block; margin-top: 4px; font-size: 17px; }
.fb-pop .qr-box.sm { width: 110px; height: 110px; border-color: var(--line); color: var(--text-3); margin: 0 auto 6px; }
.fb-item:hover .fb-pop, .fb-item:focus-within .fb-pop { opacity: 1; visibility: visible; transform: translate(0, -50%); }
.to-top { display: none !important; }
.to-top.show { display: grid !important; animation: rise .4s var(--ease) both; }

/* 滚动进场 */
.rv { opacity: 0; transform: translateY(28px); }
.rv.in { opacity: 1; transform: none; transition: opacity .8s var(--ease) var(--d, 0ms), transform .8s var(--ease) var(--d, 0ms); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .rv { opacity: 1; transform: none; }
}

/* ============ 响应式 ============ */
@media (max-width: 1180px) {
  .hd-tel { display: none; }
  .nav > a, .nav > .dd > a { padding: 0 12px; }
  .nav > a::after, .nav > .dd > a::after { left: 12px; right: 12px; }
  .footer .cols { grid-template-columns: 1.5fr 1fr 1fr 1fr; }
  .qr { display: none; }
}
@media (max-width: 960px) {
  .menu-btn { display: flex; }
  .hd-right { display: none; }
  .header > .wrap { gap: 16px; }
  .nav { position: absolute; top: 100%; left: 0; right: 0; height: auto; flex-direction: column; background: #fff; max-height: 0; overflow: hidden; box-shadow: 0 20px 30px -20px rgba(20,60,140,.4); transition: max-height .4s var(--ease); }
  .nav.open { max-height: calc(100vh - var(--hd)); overflow-y: auto; }
  .nav > a, .nav > .dd > a { height: auto; padding: 14px 24px; border-bottom: 1px solid var(--line); }
  .nav > a::after, .nav > .dd > a::after { display: none; }
  .nav .dd > a .ico { display: none; }
  .drop, .mega-panel { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: 0; border-radius: 0; padding: 0; background: var(--bg-2); }
  .drop a { padding: 10px 40px; }
  .mega-in { grid-template-columns: 1fr; padding: 4px 16px 8px; gap: 0; }
  .mega-title, .mega-side, .mega-grid span { display: none; }
  .mega-grid { grid-template-columns: 1fr 1fr; gap: 0; }
  .mega-grid a { padding: 10px; align-items: center; }
  .mega-grid .ico { width: 28px; height: 28px; padding: 6px; }
  .slider { height: 540px; }
  .slide h1, .slide h2 { font-size: 34px; }
  .quick-in { grid-template-columns: 1fr 1fr; }
  .quick a:nth-child(3) { border-left: 0; }
  .quick a:nth-child(n+3) { border-top: 1px solid var(--line); }
  .xp { grid-template-columns: 1fr; }
  .xp-nav { display: flex; overflow-x: auto; padding: 0; border-right: 0; border-bottom: 1px solid var(--line); scrollbar-width: none; }
  .xp-nav button { flex: none; width: auto; padding: 14px 18px; }
  .xp-nav button::before { left: 16px; right: 16px; top: auto; bottom: 0; width: auto; height: 2px; transform: scaleX(0); }
  .xp-nav button.on::before { transform: scaleX(1); }
  .xp-panel { grid-template-columns: 1fr; padding: 28px; }
  .xp-panels { min-height: 0; }
  .sol, .sol.on { grid-template-columns: 1fr; }
  .vals, .cases { grid-template-columns: 1fr 1fr; }
  .flow { grid-template-columns: repeat(3, 1fr); row-gap: 32px; }
  .flow li:nth-child(4)::after { display: none; }
  .stats .wrap { grid-template-columns: 1fr 1fr; row-gap: 32px; }
  .stats .wrap > div:nth-child(3) { border-left: 0; }
  .about, .founder, .svc, .detail, .contact { grid-template-columns: 1fr; }
  .svc:nth-child(even) .img { order: 0; }
  .founder .img { max-width: 300px; }
  .promise, .ways { grid-template-columns: 1fr 1fr; }
  .steps { grid-template-columns: 1fr 1fr; }
  .side { position: static; }
  .subnav { display: none; }
  .f-promise .wrap { grid-template-columns: 1fr 1fr; row-gap: 16px; }
  .f-promise div:nth-child(3) { border-left: 0; }
  .footer .cols { grid-template-columns: 1fr 1fr; }
  .float-bar { display: none; }
}
@media (max-width: 600px) {
  .wrap { padding-inline: 16px; }
  .sec { padding-block: 60px; }
  .hd-row h2, .sec-title h2 { font-size: 25px; }
  .slider { height: 520px; }
  .slide .wrap { padding-bottom: 80px; }
  .slide h1, .slide h2 { font-size: 27px; }
  .slide .sub { font-size: 14.5px; }
  .slider-ctrl { bottom: 90px; }
  .arrows { display: none; }
  .quick { margin-top: -56px; }
  .quick-in { grid-template-columns: 1fr; }
  .quick a + a { border-left: 0; border-top: 1px solid var(--line); }
  .quick a { padding: 16px 18px; }
  .xp-panel, .sol-l, .sol-r { padding: 22px; }
  .feat, .svc ul, .form, .detail .shots { grid-template-columns: 1fr; }
  .mods { grid-template-columns: 1fr 1fr; }
  .vals, .cases, .promise, .ways, .steps { grid-template-columns: 1fr; }
  .flow { grid-template-columns: 1fr 1fr; }
  .flow li:nth-child(odd)::after { display: none; }
  .flow li:nth-child(4)::after { display: block; }
  .stats b { font-size: 30px; }
  .facts { grid-template-columns: 1fr 1fr; }
  .facts div:nth-child(3) { border-left: 0; }
  .facts div:nth-child(n+3) { border-top: 1px solid var(--line); }
  .history::before { left: 80px; }
  .history li { grid-template-columns: 80px 1fr; gap: 20px; }
  .history li::before { left: 74px; }
  .history .y { font-size: 15px; white-space: nowrap; padding-right: 10px; }
  .page-banner .wrap { padding-block: 60px; }
  .page-banner h1 { font-size: 28px; }
  .cta h2 { font-size: 21px; }
  .f-promise div { font-size: 13px; }
  .footer .cols { grid-template-columns: 1fr; }
  .about .img, .founder .img { box-shadow: 10px 10px 0 -2px #e6eefb; }
}


/* 示范作品：案例卡片与详情 */
.case .badge { position: absolute; left: 14px; top: 14px; z-index: 2; padding: 3px 10px; border-radius: 999px; font-size: 12px; color: #fff; background: var(--grad); box-shadow: 0 6px 14px -6px rgba(22,100,255,.6); }
.case .thumb .img { background: #f3eee9; }
.case p { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.demo-badge { display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; border-radius: 999px; background: var(--primary-soft); color: var(--primary); font-size: 13px; margin-bottom: 12px; }
.demo-badge .ico { width: 15px; height: 15px; }
.detail .lead { margin: 12px 0 24px; font-size: 16px; color: var(--text-2); }
.demo-cover { position: relative; display: block; border-radius: 14px; overflow: hidden; box-shadow: 0 30px 60px -30px rgba(20,60,140,.45), 0 0 0 1px rgba(0,0,0,.05); }
.demo-cover .img { border-radius: 0; }
.demo-cover .play { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) scale(.9); display: inline-flex; align-items: center; gap: 8px; padding: 12px 26px; border-radius: 999px; background: rgba(17,19,24,.82); color: #fff; font-size: 15px; opacity: 0; transition: all .4s var(--ease); backdrop-filter: blur(6px); }
.demo-cover:hover .play { opacity: 1; transform: translate(-50%, -50%); }
.demo-cover:hover .img::after { transform: scale(1.03); }
.chips { display: flex; flex-wrap: wrap; gap: 10px; }
.chips span { padding: 6px 14px; border-radius: 999px; background: #fff; border: 1px solid var(--line); font-size: 14px; color: var(--text); transition: all .3s var(--ease); }
.chips span:hover { border-color: var(--primary); color: var(--primary); transform: translateY(-2px); }
.hls { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.hls li { display: flex; gap: 12px; padding: 18px; border-radius: 12px; background: var(--bg-2); }
.hls .ico { width: 22px; height: 22px; padding: 3px; border-radius: 50%; background: var(--grad); color: #fff; }
.hls b { font-size: 15px; }
.hls p { margin-top: 4px; font-size: 14px; }
.detail .shots figure { margin: 0; }
.detail .shots figcaption { position: absolute; left: 10px; bottom: 10px; z-index: 2; padding: 2px 10px; border-radius: 999px; background: rgba(255,255,255,.85); font-size: 12px; color: var(--text); }
.detail .shots .img { cursor: zoom-in; }
.side .note { margin: 16px 0; font-size: 13px; color: var(--text-3); line-height: 1.7; }
.side .btn { width: 100%; margin-top: 10px; }
@media (max-width: 600px) { .hls { grid-template-columns: 1fr; } }
.lightbox { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 4vw; background: rgba(17,19,24,.82); backdrop-filter: blur(6px); cursor: zoom-out; animation: fadeIn .3s var(--ease); }
.lightbox img { max-width: 100%; max-height: 100%; border-radius: 10px; box-shadow: 0 40px 80px -30px rgba(0,0,0,.6); }
@keyframes fadeIn { from { opacity: 0; } }

/* 技术能力表：手机上改为每行一张卡片，避免第二、三列被横向截断 */
@media (max-width: 600px) {
  table.tech { min-width: 0; }
  table.tech thead { display: none; }
  table.tech tbody tr { display: grid; grid-template-columns: 1fr auto; column-gap: 12px; padding: 14px 16px; border-bottom: 1px solid var(--line); }
  table.tech tbody tr:last-child { border-bottom: 0; }
  table.tech td { padding: 0; border: 0; width: auto !important; }
  table.tech td:first-child { grid-column: 1; }
  table.tech td:last-child { grid-column: 2; grid-row: 1; text-align: right; font-size: 13px; }
  table.tech td:nth-child(2) { grid-column: 1 / -1; margin-top: 6px; color: var(--text-2); line-height: 1.7; }
}

/* 案例详情 · 手机视图：桌面三列，手机上改为横向滑动条 */
.detail > article { min-width: 0; }
.detail .phones-note { margin-top: -2px; font-size: 14px; color: var(--text-3); }
.detail .phones-note .swipe { display: none; }
.detail .phones { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 14px; align-items: start; }
.detail .phones.mix { grid-template-columns: minmax(0, 1fr) minmax(0, 2.2fr); align-items: center; }
.detail .phones.mix .phone:not(.land) { grid-row: span 2; }
.detail .phone { margin: 0; min-width: 0; }
.detail .phone img { width: 100%; height: auto; border-radius: 18px; border: 1px solid var(--line); background: var(--bg-2); box-shadow: var(--shadow-sm); cursor: zoom-in; }
.detail .phone.land img { border-radius: 14px; }
.detail .phone figcaption { margin-top: 10px; font-size: 13px; color: var(--text-2); text-align: center; line-height: 1.5; }
@media (max-width: 600px) {
  .detail .phones-note .swipe { display: inline; }
  .detail .phones, .detail .phones.mix { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; padding: 2px 2px 14px; margin-top: 12px; align-items: flex-start; scrollbar-width: thin; }
  .detail .phone { flex: 0 0 64%; scroll-snap-align: start; }
  .detail .phone.land { flex-basis: 92%; }
}
.lightbox img.tall { max-height: 92vh; width: auto; }


/* ================= 上线准备（表单、微信复制、备案） ================= */
.form .hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form { position: relative; }
.form .agree label { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 13px; color: var(--text-2); cursor: pointer; }
.form .agree input { width: 16px; height: 16px; margin: 0; flex: none; accent-color: var(--primary); }
.form .agree a { color: var(--primary); }
.form .status.ok { color: #12a150; }
.form button[disabled] { opacity: .65; cursor: progress; }
.wx-copy { display: block; margin-top: 8px; padding: 4px 10px; border: 1px solid rgba(22,100,255,.3); border-radius: 999px; background: rgba(22,100,255,.06); color: var(--primary); font: 12px var(--font); cursor: pointer; white-space: nowrap; }
.wx-copy:hover { background: var(--primary); color: #fff; }
.footer .wx-copy { color: #8fc0ff; border-color: rgba(143,192,255,.35); background: transparent; }
.qr-box.has-img { padding: 0; background: #fff; overflow: hidden; }
.qr-box.has-img img { display: block; width: 100%; height: 100%; object-fit: contain; }
.copy .beian a { color: inherit; }
.copy .beian a:hover { color: #fff; }
.hd-tel a, .fb-pop a, .ways a, .footer li a[href^="tel:"] { color: inherit; }
.detail .like { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 36px 0 8px; padding: 22px 26px; border-radius: 10px; background: linear-gradient(100deg, #eaf2ff, #e6f8f4); border: 1px solid rgba(22,100,255,.15); }
.detail .like b { font-size: 18px; color: var(--text); }
.detail .like p { margin-top: 6px; font-size: 14px; color: var(--text-2); }
.detail .like .btn { flex: none; }
@media (max-width: 600px) { .detail .like { flex-direction: column; align-items: flex-start; } }

/* 移动端底部联系栏 */
.m-bar { display: none; }
@media (max-width: 960px) {
  .m-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 45; display: grid; grid-template-columns: 1fr 1fr 1.4fr; background: rgba(255,255,255,.96); backdrop-filter: blur(10px); border-top: 1px solid var(--line); padding-bottom: env(safe-area-inset-bottom); }
  .m-bar > * { display: flex; align-items: center; justify-content: center; gap: 6px; height: 54px; font: 500 14px var(--font); color: var(--text); background: none; border: 0; }
  .m-bar .ico { width: 18px; height: 18px; color: var(--primary); }
  .m-bar .main { background: var(--grad); color: #fff; }
  .m-bar .main .ico { color: #fff; }
  body { padding-bottom: calc(54px + env(safe-area-inset-bottom)); }
}
.wx-dlg { border: 0; border-radius: 14px; padding: 28px 28px 22px; width: min(320px, calc(100vw - 32px)); text-align: center; box-shadow: 0 30px 80px -20px rgba(10,30,70,.45); }
.wx-dlg::backdrop { background: rgba(10,20,40,.45); }
.wx-dlg b { display: block; font-size: 17px; margin-bottom: 14px; }
.wx-dlg .qr-box.lg { width: 200px; height: 200px; margin: 0 auto; border-color: var(--line); color: var(--text-3); }
.wx-dlg p { margin-top: 10px; font-size: 13px; color: var(--text-3); }
.wx-dlg .wx-copy { margin: 12px auto 0; font-size: 13px; padding: 6px 14px; }
.wx-dlg .x { position: absolute; right: 10px; top: 6px; width: 32px; height: 32px; border: 0; background: none; font-size: 24px; color: var(--text-3); cursor: pointer; }

/* 图片懒加载：进入视口附近再加载背景图 */
.img.lazy::after, .slide.lazy::before { background-image: none; }

/* 隐私政策、404 */
.wrap.narrow { max-width: 820px; }
.legal h1 { font-size: 32px; margin-bottom: 8px; }
.legal h2 { font-size: 19px; margin: 32px 0 10px; }
.legal p { line-height: 1.9; color: var(--text-2); margin-top: 10px; }
.legal .muted, .notfound .muted { color: var(--text-3); }
.page-privacy main, .page-404 main { padding-top: 40px; }
.notfound { text-align: center; padding: 100px 0 120px; }
.notfound .code { font-size: 96px; font-weight: 700; line-height: 1; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.notfound h1 { font-size: 26px; margin-top: 18px; }
.notfound .muted { margin-top: 10px; }
.notfound .btns { justify-content: center; margin-top: 28px; display: flex; gap: 12px; flex-wrap: wrap; }

/* 语言切换、英文排版 */
.lang-sw { display: inline-flex; align-items: center; gap: 4px; margin-left: 14px; padding: 4px 10px; border: 1px solid var(--line); border-radius: 999px; font-size: 13px; color: var(--text-2); white-space: nowrap; transition: color .2s, border-color .2s; }
.lang-sw .ico { width: 15px; height: 15px; }
.lang-sw:hover { color: var(--primary); border-color: var(--primary); }
html[lang="en"] { --font: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, "PingFang SC", "Microsoft YaHei", sans-serif; }
html[lang="en"] body { hyphens: auto; -webkit-hyphens: auto; }
html[lang="en"] h1, html[lang="en"] h2, html[lang="en"] h3 { letter-spacing: -.01em; hyphens: manual; }
@media (max-width: 960px) { .lang-sw { margin-left: auto; margin-right: 10px; } }
html[lang="en"] .slide h1, html[lang="en"] .slide h2 { font-size: 42px; max-width: 15em; }
html[lang="en"] .float-bar > * { width: 76px; padding-left: 4px; padding-right: 4px; font-size: 11.5px; line-height: 1.25; text-align: center; }
@media (max-width: 960px) { html[lang="en"] .slide h1, html[lang="en"] .slide h2 { font-size: 32px; } }
html[lang="en"] .m-bar > * { font-size: 13px; white-space: nowrap; }
.vals.vals4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1100px) { .vals.vals4 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .vals.vals4 { grid-template-columns: 1fr; } }

/* ================= v11 主题（参照企业微信官网：白底、克制的字号层级、毛玻璃插画、蓝 + 薄荷绿） ================= */
:root {
  --primary: #1f66ff;
  --primary-dark: #1552d6;
  --primary-soft: #eef4ff;
  --mint: #2fc77d;
  --navy: #0b111a;
  --text: #0b111a;
  --text-2: #5d6470;
  --text-3: #8d939e;
  --line: #e9ecf1;
  --bg-2: #f6f8fb;
  --radius: 8px;
  --grad: linear-gradient(90deg, #1f66ff 0%, #3d8bff 48%, #22c39a 100%);
  --solid: linear-gradient(155deg, #8ab9ff 0%, #4d8dff 42%, #2a6bf6 100%);
  --solid-m: linear-gradient(155deg, #a6f5cc 0%, #5ee0a0 50%, #2fc77d 100%);
  --shadow-sm: 0 6px 20px -10px rgba(16,40,90,.16);
  --shadow: 0 22px 48px -24px rgba(16,40,90,.26);
  --atmo:
    radial-gradient(46% 72% at 90% -4%, rgba(64,137,255,.55), rgba(64,137,255,0) 70%),
    radial-gradient(38% 60% at 100% 72%, rgba(120,190,255,.36), rgba(120,190,255,0) 70%),
    radial-gradient(42% 56% at 62% 108%, rgba(94,224,160,.26), rgba(94,224,160,0) 70%),
    radial-gradient(34% 50% at 6% -6%, rgba(170,200,255,.5), rgba(170,200,255,0) 70%),
    linear-gradient(180deg, #edf3ff 0%, #f6f9ff 100%);
}
::selection { background: #cfe0ff; }
body { color: var(--text); }
h1, h2, h3 { font-weight: 600; }
.grad-text { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* 按钮 */
.btn { border-radius: 6px; background: var(--primary); border-color: var(--primary); font-weight: 500; }
.btn:hover { background: var(--primary-dark); border-color: var(--primary-dark); box-shadow: 0 10px 22px -10px rgba(31,102,255,.75); }
.btn.lg { height: 48px; padding: 0 32px; font-size: 16px; }
.btn.ghost, .btn.line { background: rgba(255,255,255,.75); color: var(--text); border-color: #d6dbe4; backdrop-filter: blur(6px); }
.btn.ghost:hover, .btn.line:hover { color: var(--primary); border-color: var(--primary); background: #fff; box-shadow: none; }
.link { font-weight: 500; }

/* 页头：首屏上方透明，滚动后为白底 */
.header { background: rgba(255,255,255,.92); border-bottom-color: rgba(11,17,26,.06); }
.header.scrolled { box-shadow: 0 4px 20px -12px rgba(16,40,90,.22); }
.ov main { margin-top: calc(-1 * var(--hd)); }
.ov .header:not(.scrolled):not(:hover):not(:focus-within) { background: transparent; border-bottom-color: rgba(255,255,255,.5); backdrop-filter: none; }
.logo-img { background: var(--solid); border-radius: 9px; box-shadow: 0 6px 12px -6px rgba(31,102,255,.7); }
.nav > a, .nav > .dd > a { font-size: 15px; color: rgba(11,17,26,.86); }
.nav > a::after, .nav > .dd > a::after { height: 2px; border-radius: 2px; bottom: 0; }
.mega-grid .ico, .quick a .ico { background: var(--primary-soft); color: var(--primary); border-radius: 10px; }
.mega-side { background: var(--atmo); }
.lang-sw { background: rgba(255,255,255,.6); }

/* 首屏轮播 */
.hero { position: relative; }
.slider { height: calc(620px + var(--hd)); color: var(--text); background: var(--atmo); }
.slider::before, .page-banner::before { content: ""; position: absolute; left: 34%; top: -40%; width: 22%; height: 180%; background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.8), rgba(255,255,255,0)); transform: rotate(32deg); filter: blur(20px); animation: beam 10s ease-in-out infinite alternate; pointer-events: none; }
@keyframes beam { from { translate: -140px 0; opacity: .55; } to { translate: 180px 0; opacity: 1; } }
.slide { top: var(--hd); transition: opacity .7s var(--ease), visibility 0s .7s; }
.slide.on { transition: opacity .7s var(--ease); }
.slide::before, .slide::after { display: none; }
.slide .wrap { justify-content: center; padding-bottom: 110px; }
.slide .tag { background: rgba(255,255,255,.72); border: 1px solid rgba(31,102,255,.16); color: var(--primary); backdrop-filter: blur(6px); }
.slide h1, .slide h2 { font-size: 50px; font-weight: 600; line-height: 1.26; letter-spacing: .015em; color: var(--text); max-width: 11.5em; }
.slide h1 em, .slide h2 em { font-style: normal; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.slide .sub { color: var(--text-2); font-size: 17px; max-width: 30em; }
.slide .ph { color: var(--primary); }
.slide .art { margin-top: -250px; }
.slide .art .stage > * { animation-play-state: paused; }
.slide.on .art .stage > * { animation-play-state: running; }
.slide.on .art .stage { animation: art-in 1s var(--ease) both; }
@keyframes art-in { from { opacity: 0; translate: 40px 0; } to { opacity: 1; translate: 0 0; } }
.slide.on .tag, .slide.on h1, .slide.on h2, .slide.on .sub, .slide.on .btns { animation: rise .8s var(--ease) both; }
.slide.on h1, .slide.on h2 { animation-delay: .08s; } .slide.on .sub { animation-delay: .16s; } .slide.on .btns { animation-delay: .24s; }
.slider-ctrl { bottom: 112px; }
.dots button { width: 40px; }
.dots i { height: 3px; border-radius: 3px; background: rgba(11,17,26,.12); }
.dots i::after { background: var(--primary); }
.arrows button { border-color: rgba(11,17,26,.12); background: rgba(255,255,255,.7); color: var(--text); backdrop-filter: blur(6px); }
.arrows button:hover { background: var(--primary); color: #fff; border-color: var(--primary); }

/* 首屏快捷入口 */
.quick { margin-top: -66px; }
.quick-in { border-radius: 12px; box-shadow: 0 24px 50px -28px rgba(16,40,90,.3), 0 0 0 1px rgba(11,17,26,.04); background: rgba(255,255,255,.92); backdrop-filter: blur(16px); }
.quick a::after { height: 2px; }
.quick a:hover { background: linear-gradient(180deg, #f3f7ff, rgba(255,255,255,0)); }
.quick a:hover > .ico { background: var(--solid); color: #fff; }

/* 区块标题：居中、克制 */
.sec { padding-block: 96px; }
.sec.gray { background: var(--bg-2); }
.sec.tint { background: linear-gradient(180deg, #f2f6ff 0%, #fff 100%); }
.hd-row { flex-direction: column; align-items: center; text-align: center; gap: 0; margin-bottom: 48px; }
.hd-row h2, .sec-title h2 { font-size: 34px; font-weight: 600; color: var(--text); letter-spacing: .02em; }
.hd-row p, .sec-title p { margin-top: 12px; font-size: 16px; color: var(--text-2); }
.hd-row .link { order: 3; margin-top: 14px; font-size: 14px; }
.sec-title { margin-bottom: 48px; }

/* 业务范围：横向标签页 + 左文右图 */
.xp { display: block; border: 0; border-radius: 0; overflow: visible; background: none; box-shadow: none; }
.xp-nav { display: flex; justify-content: center; flex-wrap: wrap; gap: 4px 8px; background: none; border: 0; border-bottom: 1px solid var(--line); padding: 0; margin-bottom: 48px; }
.xp-nav button { width: auto; padding: 14px 18px; font-size: 16px; color: var(--text-2); gap: 8px; }
.xp-nav button .ico { width: 18px; height: 18px; }
.xp-nav button::before { left: 18px; right: 18px; top: auto; bottom: -1px; width: auto; height: 2px; border-radius: 2px; transform: scaleX(0); }
.xp-nav button.on { background: none; font-weight: 500; }
.xp-nav button.on::before { transform: scaleX(1); }
.xp-panels { min-height: 440px; }
.xp-panel { grid-template-columns: .9fr 1.1fr; gap: 72px; padding: 0 0 0 24px; }
.xp-panel h3 { font-size: 34px; font-weight: 600; }
.xp-panel .desc { margin-top: 16px; font-size: 15px; line-height: 1.85; }
.xp-panel .fit { background: var(--primary-soft); color: #3b4a66; border-radius: 6px; }
.xp-panel .img, .svc .img { position: relative; overflow: visible; background: none; border-radius: 14px; box-shadow: none; z-index: 0; }
.xp-panel .img::after, .svc .img::after { border-radius: 14px; box-shadow: 0 30px 60px -30px rgba(16,40,90,.4), 0 0 0 1px rgba(11,17,26,.05); }
.xp-panel .img::before, .svc .img::before { content: ""; position: absolute; z-index: -1; inset: -8% -10% -10% 12%; border-radius: 48% 52% 40% 60% / 55% 45% 55% 45%; background: linear-gradient(150deg, rgba(120,175,255,.32), rgba(94,224,160,.22)); filter: blur(2px); }
.svc:nth-child(even) .img::before { inset: -8% 12% -10% -10%; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* 行业方案 */
.sol-tabs { justify-content: center; }
.sol { border: 0; border-radius: 16px; box-shadow: 0 24px 60px -32px rgba(16,40,90,.3), 0 0 0 1px rgba(11,17,26,.05); }
.sol-r { background: var(--solid); }
.sol-r::before { background: radial-gradient(circle, rgba(255,255,255,.35), rgba(255,255,255,0) 70%); }
.sol-r h4 { color: rgba(255,255,255,.85); }
.mods span { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.3); border-radius: 10px; backdrop-filter: blur(8px); }
.sol-r .core { background: rgba(255,255,255,.2); border-color: rgba(255,255,255,.5); border-radius: 10px; backdrop-filter: blur(8px); }
.sol-r .core small { color: rgba(255,255,255,.85); }
.pain li::before { background: var(--primary); }

/* 卡片：白底细边，图标为实色圆角块 */
.val, .promise > div, .ways > div, .steps li { background: #fff; border: 1px solid var(--line); border-radius: 12px; }
.val::after { display: none; }
.val .ico, .promise .ico { background: var(--solid); color: #fff; border-radius: 12px; box-shadow: 0 10px 18px -10px rgba(31,102,255,.8); }
.val:nth-child(3n+2) .ico, .promise > div:nth-child(2) .ico { background: var(--solid-m); box-shadow: 0 10px 18px -10px rgba(47,199,125,.8); }
.val:hover .ico, .promise > div:hover .ico { background: var(--solid); color: #fff; }
.val:hover, .promise > div:hover, .ways > div:hover, .steps li:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: transparent; }
.ways .ico { background: var(--primary-soft); box-shadow: none; }
.ways > div:hover .ico { background: var(--solid); }

/* 数据带：浅色底 + 渐变数字 */
.stats { color: var(--text); background: var(--atmo); }
.stats .wrap { padding-block: 72px; }
.stats .wrap > div + div { border-left-color: rgba(11,17,26,.08); }
.stats b { font-size: 46px; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.stats b .ph { color: inherit; }
.stats b sup { color: var(--mint); -webkit-text-fill-color: var(--mint); }
.stats span { color: var(--text-2); }

/* 案例 */
.case { border-radius: 12px; }
.case .badge { background: var(--solid); box-shadow: 0 6px 14px -6px rgba(31,102,255,.7); }
.case .thumb .img { background: #eef3fa; }
.case .thumb::after { background: rgba(11,40,100,.38); }

/* 服务流程 */
.flow li::before { border-color: #d4e0f5; box-shadow: 0 6px 16px -10px rgba(31,102,255,.5); }
.flow li:hover::before { background: var(--solid); }

/* 底部咨询条：页面内的浅蓝圆角卡片 */
.cta { background: #fff; padding: 0 0 96px; }
.cta::before, .cta::after { display: none; }
.cta .wrap { position: relative; overflow: hidden; border-radius: 16px; background: var(--atmo); padding: 48px 56px; max-width: 1192px; }
.cta .wrap::after { content: ""; position: absolute; right: -60px; top: -80px; width: 280px; height: 280px; border-radius: 50%; background: var(--solid); opacity: .1; }
.cta h2 { font-size: 28px; font-weight: 600; color: var(--text); }
.sec.gray + .cta, .sec.tint + .cta { padding-top: 96px; }

/* 栏目页横幅 */
.page-banner { color: var(--text); background: var(--atmo); padding-top: var(--hd); min-height: calc(430px + var(--hd)); display: flex; align-items: center; }
.page-banner::after { display: none; }
.page-banner > .wrap { position: relative; z-index: 2; width: 100%; padding-block: 64px 72px; }
.page-banner .en { color: var(--primary); font-weight: 600; font-size: 13px; letter-spacing: .18em; }
.page-banner h1 { font-size: 44px; font-weight: 600; margin-top: 10px; color: var(--text); }
.page-banner h1::after { display: none; }
.page-banner .lead { margin-top: 14px; max-width: 30em; font-size: 16px; line-height: 1.8; color: var(--text-2); animation: rise .9s var(--ease) .2s both; }
.page-banner .art { --k: .88; margin-top: calc(-220px + var(--hd) / 2); }
.page-banner .art .stage { animation: art-in 1s var(--ease) both; }
.crumb { background: rgba(255,255,255,.94); }

/* 页脚：浅灰 */
.footer { background: #f5f6f8; color: var(--text-2); border-top: 1px solid var(--line); }
.footer h4 { color: var(--text); font-weight: 600; }
.footer a:hover { color: var(--primary); }
.footer .ph { color: var(--primary); }
.f-promise { border-bottom-color: var(--line); }
.f-promise div { color: var(--text); }
.f-promise div + div { border-left-color: var(--line); }
.f-promise .ico { color: var(--primary); }
.qr-box { border-color: #cfd6e0; color: var(--text-3); background: #fff; }
.footer .copy { border-top-color: var(--line); color: var(--text-3); }
.copy .beian a:hover { color: var(--primary); }
.footer .wx-copy { color: var(--primary); border-color: rgba(31,102,255,.3); }

/* 其他 */
.float-bar > *:first-child { background: var(--primary); }
.float-bar > *:first-child:hover { background: var(--primary-dark); }
.m-bar .main { background: var(--primary); }
.hls .ico { background: var(--solid); }
.notfound .code { background: var(--grad); -webkit-background-clip: text; background-clip: text; }
.rv { opacity: 0; transform: translateY(24px); }
.rv.in { opacity: 1; transform: none; transition: opacity .8s var(--ease) var(--d, 0ms), transform .8s var(--ease) var(--d, 0ms); }

/* 响应式 */
@media (max-width: 1280px) { .art { --k: .86; } .page-banner .art { --k: .72; } .slide h1, .slide h2 { font-size: 44px; } }
@media (max-width: 1100px) { .art { --k: .72; } .page-banner .art { --k: .62; } }
@media (max-width: 960px) {
  .slider { height: calc(820px + var(--hd)); }
  .slide .wrap { justify-content: flex-start; padding-top: 48px; padding-bottom: 0; }
  .slide h1, .slide h2 { font-size: 36px; }
  .slide .art { --k: .78; top: auto; bottom: 96px; margin-top: 0; right: 50%; margin-right: -234px; height: 344px; }
  .slide .art .stage { transform-origin: right bottom; top: auto; bottom: 0; }
  .slider-ctrl { bottom: 96px; }
  .xp-nav { justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; }
  .xp-panel { grid-template-columns: 1fr; gap: 36px; padding: 0; }
  .page-banner { display: block; min-height: 0; }
  .page-banner > .wrap { padding-block: 48px 300px; }
  .page-banner .art { --k: .62; top: auto; bottom: 16px; margin-top: 0; right: 50%; margin-right: -186px; height: 274px; }
  .page-banner .art .stage { transform-origin: right bottom; top: auto; bottom: 0; }
  .cta .wrap { padding: 36px 28px; }
}
@media (max-width: 600px) {
  .slider { height: calc(720px + var(--hd)); }
  .slide .wrap { padding-top: 36px; }
  .slide h1, .slide h2 { font-size: 30px; }
  .slide .sub { font-size: 15px; }
  .slide .btns { margin-top: 24px; }
  .slide .art { --k: .56; margin-right: -168px; bottom: 100px; height: 246px; }
  .slider-ctrl { bottom: 92px; }
  .hd-row h2, .sec-title h2 { font-size: 26px; }
  .hd-row p, .sec-title p { font-size: 15px; }
  .sec { padding-block: 64px; }
  .xp-panel h3 { font-size: 26px; }
  .page-banner h1 { font-size: 32px; }
  .page-banner .lead { font-size: 15px; }
  .page-banner > .wrap { padding-block: 36px 236px; }
  .page-banner .art { --k: .5; margin-right: -150px; height: 220px; }
  .cta { padding-bottom: 64px; }
  .cta .wrap { margin-inline: 16px; padding: 28px 20px; }
  .cta h2 { font-size: 22px; }
  .stats b { font-size: 32px; }
}
html[lang="en"] .slide h1, html[lang="en"] .slide h2 { font-size: 44px; max-width: 13em; }
@media (max-width: 960px) { html[lang="en"] .slide h1, html[lang="en"] .slide h2 { font-size: 32px; } }
@media (max-width: 600px) { html[lang="en"] .slide h1, html[lang="en"] .slide h2 { font-size: 27px; } }
@media (prefers-reduced-motion: reduce) { .art .stage > *, .slider::before, .page-banner::before { animation: none !important; } }

/* ================= v11 横幅插画（毛玻璃 + 蓝色实体 + 薄荷绿点缀） ================= */
.art { position: absolute; right: max(24px, calc((100vw - 1200px) / 2 - 20px)); top: 50%; width: 600px; height: 440px; margin-top: -220px; pointer-events: none; --k: 1; }
.art .stage { position: absolute; left: 0; top: 0; width: 600px; height: 440px; transform: scale(var(--k)); transform-origin: right center; }
.art .stage > * { position: absolute; animation: float 6s ease-in-out var(--fd, 0s) infinite alternate both; }
@keyframes float { from { translate: 0 -7px; } to { translate: 0 7px; } }
.art .floor { left: 40px; right: 20px; bottom: -14px; height: 70px; border-radius: 50%; background: radial-gradient(closest-side, rgba(38,104,240,.22), rgba(38,104,240,0)); filter: blur(8px); animation: none; }

/* 材质 */
.art .g { border-radius: 18px; background: linear-gradient(150deg, rgba(255,255,255,.86) 0%, rgba(255,255,255,.5) 100%); border: 1px solid rgba(255,255,255,.95); box-shadow: 0 30px 60px -28px rgba(30,86,200,.42), 0 2px 6px -2px rgba(30,86,200,.08), inset 0 1px 0 #fff; backdrop-filter: blur(18px) saturate(1.4); -webkit-backdrop-filter: blur(18px) saturate(1.4); }
.art .b { border-radius: 20px; background: linear-gradient(155deg, #8ab9ff 0%, #4d8dff 42%, #2a6bf6 100%); box-shadow: 0 36px 60px -26px rgba(34,98,240,.6), inset 0 1px 0 rgba(255,255,255,.45), inset 0 -10px 30px -10px rgba(20,70,200,.35); }
.art .m { border-radius: 18px; background: linear-gradient(155deg, #a6f5cc 0%, #5ee0a0 50%, #2fc77d 100%); box-shadow: 0 26px 46px -22px rgba(30,170,100,.6), inset 0 1px 0 rgba(255,255,255,.5); color: #fff; }
.art .ln { display: block; height: 8px; border-radius: 8px; background: rgba(40,92,190,.13); margin-top: 9px; }
.art .ln:first-child { margin-top: 0; background: rgba(40,92,190,.22); }
.art .ico { color: currentColor; }
.art .star { animation: twinkle 3.2s ease-in-out var(--fd) infinite; }
.art .star svg { width: 100%; height: 100%; fill: #fff; filter: drop-shadow(0 0 6px rgba(120,170,255,.9)); }
@keyframes twinkle { 0%, 100% { opacity: .25; scale: .7; } 50% { opacity: 1; scale: 1; } }
.art .pill { display: inline-block; height: 18px; padding: 0 9px; border-radius: 10px; background: rgba(38,104,240,.1); color: #2a6bf6; font: 500 11px/18px var(--font); }
.art .pill.g, .art .pill.w { width: 46px; } .art .pill.g { background: rgba(47,199,125,.16); }
.art .hd { display: flex; align-items: center; gap: 10px; }
.art .hd b { display: block; flex: 1; height: 10px; max-width: 90px; border-radius: 6px; background: rgba(20,40,80,.55); }
.art .dot { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 12px; background: linear-gradient(155deg, #8ab9ff, #2a6bf6); color: #fff; box-shadow: 0 10px 18px -8px rgba(34,98,240,.7); }
.art .dot.m { background: linear-gradient(155deg, #9af2c4, #2fc77d); box-shadow: 0 10px 18px -8px rgba(47,199,125,.8); }
.art .dot .ico { width: 22px; height: 22px; }
.art .dot .ico svg { stroke-width: 2.6; }
.art .spk { display: block; overflow: visible; }
.art .spk polygon { fill: url(#none); fill: rgba(42,107,246,.12); }
.art .spk polyline { fill: none; stroke: #2a6bf6; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; stroke-dasharray: 600; stroke-dashoffset: 600; animation: draw 1.8s var(--ease) .5s forwards; }
@keyframes draw { to { stroke-dashoffset: 0; } }

/* 管理系统 */
.art-sys .win { overflow: hidden; }
.art-sys .win .tb { display: flex; gap: 6px; padding: 14px 16px; }
.art-sys .win .tb i, .art .scr .tb i { width: 9px; height: 9px; border-radius: 50%; background: rgba(255,255,255,.55); }
.art-sys .win .sbar { position: absolute; left: 16px; top: 44px; bottom: 16px; width: 44px; border-radius: 12px; background: rgba(255,255,255,.14); display: grid; align-content: start; gap: 12px; padding: 12px 0; justify-items: center; }
.art-sys .win .sbar i { width: 20px; height: 20px; border-radius: 6px; background: rgba(255,255,255,.35); }
.art-sys .win .sbar i.on { background: #fff; }
.art-sys .win .wmain { position: absolute; left: 76px; right: 16px; top: 44px; }
.art-sys .kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 16px; }
.art-sys .kpis i { height: 52px; border-radius: 12px; background: rgba(255,255,255,.2); border: 1px solid rgba(255,255,255,.25); }
.art .wl { display: block; height: 8px; border-radius: 8px; background: rgba(255,255,255,.32); margin-top: 10px; }
.art-sys .chart { padding: 18px 20px; }
.art .bars { display: flex; align-items: flex-end; gap: 12px; height: 120px; margin-top: 18px; }
.art .bars i { flex: 1; height: var(--h); border-radius: 7px 7px 3px 3px; background: linear-gradient(180deg, #5c98ff, #a9cbff); transform-origin: bottom; animation: grow-y 1s var(--ease) calc(.3s + var(--i) * .08s) both; }
.art .bars i:nth-child(6) { background: linear-gradient(180deg, #2a6bf6, #6ea2ff); }
@keyframes grow-y { from { transform: scaleY(0); } }
.art-sys .axis { display: flex; gap: 12px; margin-top: 10px; }
.art-sys .axis i { flex: 1; height: 6px; border-radius: 4px; background: rgba(40,92,190,.1); }
.art-sys .chart .bars { height: 128px; }
.art-sys .ok { display: flex; align-items: center; gap: 14px; padding: 0 18px; }
.art-sys .ok > div { flex: 1; }
.art-sys .kpi { padding: 14px 16px; }
.art .num { font: 600 24px/1.1 var(--font); color: #16233b; letter-spacing: -.01em; }
.art .num small { font-size: 14px; margin-left: 1px; color: #2fc77d; }
.art-sys .kpi .spk { margin-top: 8px; width: 100%; height: 28px; }
.art-sys .kpi .spk polyline { stroke: #2fc77d; }
.art-sys .kpi .spk polygon { fill: rgba(47,199,125,.14); }

/* 小程序与 APP */
.art-app .aphone { border-radius: 36px; padding: 10px; }
.art-app .scr { position: absolute; inset: 10px; border-radius: 28px; background: linear-gradient(180deg, #f7faff, #eaf2ff); overflow: hidden; padding: 14px 12px; }
.art-app .ban { height: 90px; border-radius: 14px; background: linear-gradient(130deg, #5c98ff, #2a6bf6 60%, #34c98a); position: relative; overflow: hidden; }
.art-app .ban::after { content: ""; position: absolute; right: -20px; top: -30px; width: 110px; height: 110px; border-radius: 50%; background: rgba(255,255,255,.18); }
.art-app .grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px 8px; margin: 16px 4px 14px; }
.art-app .grid i { aspect-ratio: 1; border-radius: 11px; background: #dce8ff; }
.art-app .grid .c0 { background: linear-gradient(150deg, #8ab9ff, #2a6bf6); } .art-app .grid .c3 { background: linear-gradient(150deg, #a6f5cc, #2fc77d); }
.art-app .grid .c5 { background: linear-gradient(150deg, #ffd38a, #ffae3b); } .art-app .grid .c6 { background: linear-gradient(150deg, #b9d3ff, #7aa8ff); }
.art-app .row { display: flex; gap: 10px; align-items: center; padding: 10px; margin-top: 8px; border-radius: 12px; background: #fff; }
.art-app .row > i { width: 34px; height: 34px; border-radius: 9px; background: #e3edff; flex: none; }
.art-app .row > div { flex: 1; }
.art-app .tab { position: absolute; left: 0; right: 0; bottom: 0; height: 46px; background: #fff; display: flex; justify-content: space-around; align-items: center; }
.art-app .tab i { width: 18px; height: 18px; border-radius: 6px; background: #d5e2f7; }
.art-app .tab i.on { background: #2a6bf6; }
.art-app .mp { padding: 12px; }
.art-app .mp .pic { height: 92px; border-radius: 12px; background: linear-gradient(135deg, #e6f0ff, #cfe0ff); position: relative; overflow: hidden; }
.art-app .mp .pic i { position: absolute; left: 22px; bottom: -26px; width: 120px; height: 70px; border-radius: 50%; background: linear-gradient(150deg, #a6f5cc, #5ee0a0); }
.art-app .mp .pic::after { content: ""; position: absolute; right: 26px; top: 18px; width: 30px; height: 30px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 8px rgba(255,255,255,.35); }
.art-app .mp .meta { display: flex; gap: 10px; align-items: center; margin-top: 12px; }
.art-app .mp .mlogo { width: 28px; height: 28px; border-radius: 50%; flex: none; background: conic-gradient(from 200deg, #2fc77d, #2a6bf6, #2fc77d); }
.art-app .mp .meta > div { flex: 1; }
.art-app .bub { display: flex; align-items: center; gap: 12px; padding: 0 18px; border-radius: 20px; }
.art .tail { position: absolute; left: 24px; bottom: -13px; width: 24px; height: 16px; clip-path: polygon(0 0, 100% 0, 8% 100%); }
.art-app .bub .tail { background: #3fcf88; }
.art-app .bub .wave { width: 30px; height: 30px; fill: none; stroke: #fff; stroke-width: 2.4; stroke-linecap: round; }
.art-app .bub .wave circle { fill: #fff; stroke: none; }
.art-app .bub .tx { flex: 1; height: 9px; border-radius: 6px; background: rgba(255,255,255,.7); }
.art-app .qrt { padding: 16px; }
.art-app .qrs { display: block; width: 100%; height: 100%; fill: #3b7bff; }
.art-app .qrs .f { fill: #1f5fe8; } .art-app .qrs .w { fill: #fff; }

/* 跨境独立站 */
.art-cb .globe { width: 300px; height: 300px; }
.art-cb .globe svg { width: 100%; height: 100%; overflow: visible; filter: drop-shadow(0 36px 40px rgba(34,98,240,.42)); }
.art-cb .gl { fill: none; stroke: rgba(255,255,255,.22); stroke-width: 1.2; }
.art-cb .gdots { fill: rgba(255,255,255,.88); }
.art-cb .rim { fill: none; stroke: rgba(255,255,255,.55); stroke-width: 1.5; }
.art-cb .orbit { position: absolute; left: -46px; right: -46px; top: 104px; height: 92px; border-radius: 50%; border: 1.5px dashed rgba(42,107,246,.45); transform: rotate(-14deg); }
.art-cb .plane { position: absolute; width: 16px; height: 16px; border-radius: 50%; background: #2fc77d; box-shadow: 0 0 0 6px rgba(47,199,125,.22), 0 0 16px #2fc77d; offset-path: ellipse(50% 50% at 50% 50%); offset-distance: 0%; animation: orbit 7s linear infinite; left: 0; top: 0; }
@keyframes orbit { to { offset-distance: 100%; } }
.art-cb .shop { padding: 0; overflow: hidden; }
.art-cb .url { display: flex; align-items: center; gap: 6px; height: 34px; padding: 0 14px; border-bottom: 1px solid rgba(40,92,190,.08); }
.art-cb .url i { width: 8px; height: 8px; border-radius: 50%; background: rgba(40,92,190,.2); }
.art-cb .url span { margin-left: 10px; flex: 1; height: 14px; border-radius: 7px; background: rgba(40,92,190,.08); }
.art-cb .prod { display: grid; grid-template-columns: 124px 1fr; gap: 14px; padding: 16px; }
.art-cb .pimg { height: 150px; border-radius: 12px; background: linear-gradient(160deg, #eaf2ff, #d4e4ff); position: relative; overflow: hidden; }
.art-cb .obj { position: absolute; left: 50%; top: 50%; width: 70px; height: 86px; margin: -43px 0 0 -35px; border-radius: 18px 18px 30px 30px; background: linear-gradient(160deg, #a6f5cc, #2fc77d); box-shadow: 0 16px 20px -10px rgba(30,150,90,.6); }
.art-cb .obj::after { content: ""; position: absolute; left: 50%; top: -14px; width: 26px; height: 26px; margin-left: -13px; border-radius: 50%; border: 5px solid #5ee0a0; border-bottom-color: transparent; }
.art-cb .pi { padding-top: 6px; }
.art-cb .price { display: block; margin-top: 18px; font: 600 24px/1 var(--font); color: #16233b; }
.art-cb .buy { display: block; margin-top: 18px; height: 32px; border-radius: 8px; background: linear-gradient(90deg, #4d8dff, #2a6bf6); box-shadow: 0 10px 16px -8px rgba(42,107,246,.8); }
.art-cb .chip { display: flex; align-items: center; gap: 8px; padding: 0 12px; border-radius: 20px; font: 600 13px/1 var(--font); color: #2b3a55; letter-spacing: .02em; }
.art-cb .chip b { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: linear-gradient(155deg, #8ab9ff, #2a6bf6); color: #fff; font-size: 13px; }
.art-cb .chip.c2 b { background: linear-gradient(155deg, #9af2c4, #2fc77d); }

/* 系统接手与运维 */
.art-ops .iso { width: 320px; height: 300px; overflow: visible; filter: drop-shadow(0 34px 34px rgba(34,98,240,.35)); }
.art-ops .pl { animation: lift 4s ease-in-out calc(var(--i) * -.6s) infinite alternate; }
@keyframes lift { from { translate: 0 0; } to { translate: 0 -6px; } }
.art-ops .led { fill: #6dffb0; filter: drop-shadow(0 0 4px #2fc77d); animation: blink 1.6s steps(2) infinite; }
.art-ops .led.b { fill: #bfe0ff; animation-delay: .4s; }
@keyframes blink { 50% { opacity: .35; } }
.art-ops .icore path { fill: url(#none); fill: #2a6bf6; opacity: .9; }
.art-ops .shield svg { width: 100%; height: 100%; overflow: visible; filter: drop-shadow(0 26px 28px rgba(30,170,100,.45)); }
.art-ops .mon { padding: 16px 18px; }
.art-ops .mon .st { width: 12px; height: 12px; border-radius: 50%; background: #2fc77d; box-shadow: 0 0 0 4px rgba(47,199,125,.2); animation: pulse 2s ease-out infinite; }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(47,199,125,.45); } 100% { box-shadow: 0 0 0 10px rgba(47,199,125,0); } }
.art-ops .mon .big { margin-top: 18px; width: 100%; height: 70px; }

/* 关于我们 */
.art-about .col { border-radius: 14px 14px 10px 10px; transform-origin: bottom; animation: grow-y 1.1s var(--ease) both, float 6s ease-in-out var(--fd) infinite alternate; }
.art-about .col .cap { position: absolute; left: 10px; right: 10px; top: 10px; height: 7px; border-radius: 6px; background: rgba(255,255,255,.5); }
.art-about .col.c2 { background: linear-gradient(155deg, #a6f5cc 0%, #5ee0a0 50%, #2fc77d 100%); box-shadow: 0 30px 50px -22px rgba(30,170,100,.6), inset 0 1px 0 rgba(255,255,255,.5); }
.art-about .team { padding: 24px; }
.art-about .avs { display: flex; margin-bottom: 22px; }
.art-about .avs i { width: 52px; height: 52px; border-radius: 50%; border: 3px solid #fff; margin-right: -12px; background: linear-gradient(160deg, #cfe0ff, #7aa8ff); box-shadow: 0 6px 12px -6px rgba(30,86,200,.5); position: relative; overflow: hidden; }
.art-about .avs i::before { content: ""; position: absolute; left: 50%; top: 10px; width: 17px; height: 17px; margin-left: -8.5px; border-radius: 50%; background: rgba(255,255,255,.92); }
.art-about .avs i::after { content: ""; position: absolute; left: 50%; bottom: -12px; width: 34px; height: 24px; margin-left: -17px; border-radius: 50%; background: rgba(255,255,255,.92); }
.art-about .avs .a1 { background: linear-gradient(160deg, #a6f5cc, #2fc77d); } .art-about .avs .a2 { background: linear-gradient(160deg, #8ab9ff, #2a6bf6); } .art-about .avs .a3 { background: linear-gradient(160deg, #ffd38a, #ffae3b); }
.art-about .medal { position: absolute; right: -22px; top: -22px; display: grid; place-items: center; width: 74px; height: 74px; border-radius: 50%; background: linear-gradient(155deg, #a6f5cc, #2fc77d); color: #fff; box-shadow: 0 18px 30px -12px rgba(30,170,100,.7), inset 0 1px 0 rgba(255,255,255,.6); }
.art-about .medal .ico { width: 38px; height: 38px; }
.art-about .medal .ico svg { stroke-width: 2.1; }
.art-about .tl { padding: 26px 28px; }
.art-about .track { position: relative; display: flex; justify-content: space-between; }
.art-about .track::before { content: ""; position: absolute; left: 6px; right: 6px; top: 50%; height: 3px; margin-top: -1.5px; border-radius: 2px; background: linear-gradient(90deg, #a9cbff, #2a6bf6); }
.art-about .track i { position: relative; width: 16px; height: 16px; border-radius: 50%; background: #fff; border: 3px solid #6ea2ff; }
.art-about .track i.on { background: #2fc77d; border-color: #fff; box-shadow: 0 0 0 5px rgba(47,199,125,.25); }
.art-about .yrs { display: flex; justify-content: space-between; margin-top: 16px; }
.art-about .yrs i { width: 44px; height: 8px; border-radius: 6px; background: rgba(40,92,190,.16); }
.art-about .yrs i:first-child { margin-left: -14px; } .art-about .yrs i:last-child { margin-right: -14px; background: rgba(47,199,125,.35); }

/* 业务范围 */
.art-services .links { position: absolute; left: 0; top: 0; width: 600px; height: 440px; fill: none; stroke: rgba(42,107,246,.35); stroke-width: 1.6; stroke-dasharray: 5 7; animation: dash 1.6s linear infinite; }
@keyframes dash { to { stroke-dashoffset: -24; } }
.art-services .tile { display: grid; place-items: center; color: #2a6bf6; border-radius: 26px; }
.art-services .tile .ico { width: 42px; height: 42px; }
.art-services .tile.mt { background: linear-gradient(155deg, #a6f5cc 0%, #5ee0a0 50%, #2fc77d 100%); border-color: transparent; color: #fff; box-shadow: 0 26px 46px -22px rgba(30,170,100,.6), inset 0 1px 0 rgba(255,255,255,.5); }
.art-services .links { stroke: rgba(42,107,246,.5); stroke-width: 2; }
.art-services .tile .ico svg { stroke-width: 1.8; }
.art-services .hub { display: grid; place-items: center; color: #fff; border-radius: 34px; }
.art-services .hub .ico { width: 76px; height: 76px; }
.art-services .hub .ico svg { stroke-width: 2.2; }
.art-services .hub::after { content: ""; position: absolute; inset: -14px; border-radius: 44px; border: 1.5px solid rgba(42,107,246,.25); animation: ring 2.8s ease-out infinite; }
@keyframes ring { from { opacity: 1; transform: scale(.92); } to { opacity: 0; transform: scale(1.18); } }

/* 项目案例 */
.art-cases .scr { padding: 0; overflow: hidden; border-radius: 14px; }
.art-cases .scr .tb { display: flex; gap: 6px; padding: 10px 12px; height: 28px; }
.art-cases .scr .tb i { background: rgba(40,92,190,.2); }
.art-cases .sh { position: absolute; left: 6px; right: 6px; top: 28px; bottom: 6px; border-radius: 8px; background: #eef3fa center top / cover no-repeat; }
.art-cases .mph { border-radius: 26px; padding: 0; }
.art-cases .mph .sh { left: 7px; right: 7px; top: 7px; bottom: 7px; border-radius: 20px; }

/* 联系我们 */
.art-contact .talk { border-radius: 34px; display: grid; place-items: center; }
.art-contact .talk .tail { left: 44px; bottom: -20px; width: 38px; height: 24px; background: #2c6cf6; }
.art-contact .typing { display: flex; gap: 14px; }
.art-contact .typing i { width: 20px; height: 20px; border-radius: 50%; background: #fff; animation: typing 1.4s ease-in-out infinite; }
.art-contact .typing i:nth-child(2) { animation-delay: .18s; } .art-contact .typing i:nth-child(3) { animation-delay: .36s; }
@keyframes typing { 0%, 60%, 100% { transform: translateY(0); opacity: .55; } 30% { transform: translateY(-10px); opacity: 1; } }
.art-contact .call { display: flex; align-items: center; gap: 16px; padding: 0 22px; }
.art-contact .call > div { flex: 1; }
.art-contact .call .dot { width: 52px; height: 52px; border-radius: 16px; }
.art-contact .call .dot .ico { width: 26px; height: 26px; }
.art-contact .mail { display: grid; place-items: center; }
.art-contact .mail .ico { width: 56px; height: 56px; }
.art-contact .mail .ico svg { stroke-width: 1.8; }
.art-contact .pin { width: 80px; height: 100px; }
.art-contact .pin svg { position: relative; width: 100%; height: 100%; filter: drop-shadow(0 18px 18px rgba(34,98,240,.45)); }
.art-contact .rip { position: absolute; left: 50%; bottom: -14px; width: 120px; height: 40px; margin-left: -60px; border-radius: 50%; border: 2px solid rgba(42,107,246,.35); animation: rip 2.6s ease-out infinite; }
.art-contact .rip.r2 { animation-delay: 1.3s; }
@keyframes rip { from { opacity: 1; transform: scale(.3); } to { opacity: 0; transform: scale(1.3); } }
.art { translate: calc(var(--px, 0) * -12px) calc(var(--py, 0) * -8px); transition: translate .6s var(--ease); }
.slider .arrows { display: none; }

/* ================= v11 业务配图（插画放在 4:3 图片位里） ================= */
.img.art-fig { overflow: visible; padding: 0; background: var(--atmo); border-radius: 14px; container-type: inline-size; }
.img.art-fig::after { content: none; }
.xp-panel .img.art-fig, .svc .img.art-fig { box-shadow: 0 30px 60px -30px rgba(16,40,90,.32), 0 0 0 1px rgba(11,17,26,.04); }
.art-fig .art { position: absolute; inset: 0; width: auto; height: auto; margin: 0; right: 0; top: 0; translate: none; overflow: hidden; border-radius: inherit; --fk: .92; }
.art-fig .art .stage { left: 50%; top: 50%; translate: -50% -50%; transform: scale(var(--fk)); transform-origin: center; }
@container (max-width: 560px) { .art-fig .art { --fk: .84; } }
@container (max-width: 500px) { .art-fig .art { --fk: .74; } }
@container (max-width: 440px) { .art-fig .art { --fk: .64; } }
@container (max-width: 380px) { .art-fig .art { --fk: .56; } }
@container (max-width: 330px) { .art-fig .art { --fk: .5; } }
.art .aisp { width: 100%; height: 100%; fill: currentColor; }

/* GEO 检测 */
.art-geo .chat { padding: 18px 20px; }
.art-geo .chat .hd { margin-bottom: 18px; }
.art-geo .ai { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; padding: 6px; color: #fff; background: conic-gradient(from 210deg, #2fc77d, #2a6bf6, #7aa8ff, #2fc77d); }
.art-geo .q { margin-left: auto; width: 62%; padding: 10px 12px; border-radius: 14px 14px 4px 14px; background: linear-gradient(155deg, #6ea2ff, #2a6bf6); box-shadow: 0 10px 18px -10px rgba(42,107,246,.8); }
.art-geo .q i { display: block; height: 7px; border-radius: 6px; background: rgba(255,255,255,.75); }
.art-geo .q i + i { margin-top: 7px; width: 60%; }
.art-geo .a { margin-top: 18px; }
.art-geo .hit { display: flex; align-items: center; gap: 8px; margin-top: 9px; }
.art-geo .hit .ln { margin: 0; flex: none; background: rgba(40,92,190,.13); }
.art-geo .brand { flex: none; width: 74px; height: 18px; border-radius: 6px; background: linear-gradient(90deg, #a6f5cc, #5ee0a0); box-shadow: 0 0 0 3px rgba(47,199,125,.18); animation: hilite 2.4s ease-in-out infinite; }
@keyframes hilite { 50% { box-shadow: 0 0 0 6px rgba(47,199,125,.08); } }
.art-geo .refs { display: flex; gap: 6px; margin-top: 16px; }
.art-geo .refs span { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; background: rgba(42,107,246,.1); color: #2a6bf6; font: 600 11px/1 var(--font); }
.art-geo .ring { display: grid; place-items: center; }
.art-geo .ring svg { position: absolute; inset: 18px; width: calc(100% - 36px); height: calc(100% - 36px); transform: rotate(-90deg); }
.art-geo .ring circle { fill: none; stroke-width: 11; }
.art-geo .ring .trk { stroke: rgba(40,92,190,.1); }
.art-geo .ring .arc { stroke: url(#rg); stroke-linecap: round; stroke-dasharray: 289; stroke-dashoffset: 92; animation: ring-in 1.6s var(--ease) .3s both; }
@keyframes ring-in { from { stroke-dashoffset: 289; } }
.art-geo .ring .num { position: relative; font-size: 30px; }
.art-geo .plats { padding: 14px 16px; display: grid; gap: 12px; align-content: center; }
.art-geo .pr { display: flex; align-items: center; gap: 10px; }
.art-geo .pr .ln { margin: 0; flex: 1; background: rgba(40,92,190,.13); }
.art-geo .pd { width: 16px; height: 16px; border-radius: 5px; flex: none; }
.art-geo .p0 { background: #4d8dff; } .art-geo .p1 { background: #2fc77d; } .art-geo .p2 { background: #7aa8ff; } .art-geo .p3 { background: #ffae3b; }
.art-geo .pr span { width: 16px; height: 16px; border-radius: 50%; flex: none; }
.art-geo .pr .y { background: #2fc77d url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L19 7'/%3E%3C/svg%3E") center / 11px no-repeat; }
.art-geo .pr .n { background: rgba(40,92,190,.14); }
.art-geo .mag { display: grid; place-items: center; color: #fff; border-radius: 26px; }
.art-geo .mag .ico { width: 40px; height: 40px; }
.art-geo .mag .ico svg { stroke-width: 2.4; }

/* GEO 内容建设 */
.art-geoc .doc { border-radius: 16px; }
.art-geoc .d1 { padding: 22px 20px; }
.art-geoc .d1 .cap { display: block; width: 50%; height: 12px; border-radius: 6px; background: rgba(255,255,255,.65); margin-bottom: 18px; }
.art-geoc .d2 { padding: 20px; }
.art-geoc .d2 .hd { margin-bottom: 18px; }
.art-geoc .qa { display: flex; gap: 12px; align-items: center; padding: 12px; margin-top: 10px; border-radius: 12px; background: rgba(255,255,255,.75); border: 1px solid rgba(40,92,190,.08); }
.art-geoc .qa > div { flex: 1; }
.art-geoc .qd { display: grid; place-items: center; width: 28px; height: 28px; flex: none; border-radius: 8px; background: linear-gradient(155deg, #8ab9ff, #2a6bf6); color: #fff; font: 700 13px/1 var(--font); }
.art-geoc .qa:nth-child(3) .qd { background: linear-gradient(155deg, #9af2c4, #2fc77d); }
.art-geoc .code { display: grid; place-items: center; }
.art-geoc .code b { font: 700 28px/1 ui-monospace, Menlo, Consolas, monospace; letter-spacing: .08em; color: #fff; }
.art-geoc .gflow { position: absolute; left: 0; top: 0; width: 600px; height: 440px; fill: none; stroke: rgba(42,107,246,.5); stroke-width: 2; stroke-dasharray: 5 7; animation: dash 1.6s linear infinite; }
.art-geoc .aib { display: grid; place-items: center; border-radius: 50%; color: #fff; padding: 34px; }
.art-geoc .aib::after { content: ""; position: absolute; inset: -14px; border-radius: 50%; border: 1.5px solid rgba(42,107,246,.28); animation: ring 2.8s ease-out infinite; }

/* 业务标签多了以后收紧间距 */
.xp-nav button { padding: 14px 14px; font-size: 15px; }
.xp-nav button::before { left: 14px; right: 14px; }
@media (min-width: 961px) { .xp-nav { flex-wrap: nowrap; gap: 0; justify-content: safe center; overflow-x: auto; scrollbar-width: none; } .xp-nav button { flex: none; white-space: nowrap; padding: 14px 10px; font-size: 14.5px; gap: 6px; } .xp-nav button::before { left: 10px; right: 10px; } }

/* 首页 GEO 横幅 */
.art-geoh .gchat { padding: 18px 20px; }
.art-geoh .gchat .hd { margin-bottom: 16px; }
.art-geoh .ai { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; padding: 6px; color: #fff; background: conic-gradient(from 210deg, #2fc77d, #2a6bf6, #7aa8ff, #2fc77d); }
.art-geoh .qb { margin-left: auto; width: 60%; padding: 10px 12px; border-radius: 14px 14px 4px 14px; background: linear-gradient(155deg, #6ea2ff, #2a6bf6); box-shadow: 0 10px 18px -10px rgba(42,107,246,.8); }
.art-geoh .qb i { display: block; height: 7px; border-radius: 6px; background: rgba(255,255,255,.75); }
.art-geoh .qb i + i { margin-top: 7px; width: 58%; }
.art-geoh .a { margin: 16px 0 12px; }
.art-geoh .rec { display: flex; align-items: center; gap: 10px; padding: 10px 12px; margin-top: 8px; border-radius: 12px; background: rgba(255,255,255,.7); border: 1px solid rgba(40,92,190,.08); }
.art-geoh .rec > div { flex: 1; }
.art-geoh .rec .ln { height: 7px; }
.art-geoh .rk { display: grid; place-items: center; width: 22px; height: 22px; flex: none; border-radius: 7px; background: rgba(40,92,190,.1); color: #6a7a96; font: 700 12px/1 var(--font); }
.art-geoh .bl { width: 30px; height: 30px; flex: none; border-radius: 9px; background: rgba(40,92,190,.14); }
.art-geoh .rec.on { background: #fff; border-color: rgba(47,199,125,.55); box-shadow: 0 0 0 4px rgba(47,199,125,.12), 0 14px 26px -16px rgba(30,170,100,.6); animation: hilite 2.4s ease-in-out infinite; }
.art-geoh .rec.on .rk { background: #2fc77d; color: #fff; }
.art-geoh .rec.on .bl { background: linear-gradient(155deg, #8ab9ff, #2a6bf6); }
.art-geoh .ok { display: grid; place-items: center; width: 22px; height: 22px; flex: none; border-radius: 50%; padding: 4px; background: #2fc77d; color: #fff; }
.art-geoh .ok svg { stroke-width: 3.4; }
.art-geoh .refs { display: flex; gap: 6px; margin-top: 14px; }
.art-geoh .refs span { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; background: rgba(42,107,246,.1); color: #2a6bf6; font: 600 11px/1 var(--font); }
.art-geoh .gscore { padding: 16px 18px; }
.art-geoh .lb { display: flex; align-items: center; justify-content: space-between; }
.art-geoh .lb i { display: block; width: 58px; height: 8px; border-radius: 6px; background: rgba(40,92,190,.2); }
.art-geoh .up { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; padding: 4px; background: rgba(47,199,125,.16); color: #1fae68; }
.art-geoh .up svg { stroke-width: 3; }
.art-geoh .gscore .num { font-size: 34px; margin: 6px 0 4px; }
.art-geoh .gscore .num small { font-size: 12px; margin-left: 6px; color: #6a7a96; font-weight: 600; letter-spacing: .06em; }
.art-geoh .gheat { padding: 16px; }
.art-geoh .hph { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; margin-bottom: 8px; }
.art-geoh .pd { display: block; height: 8px; border-radius: 4px; }
.art-geoh .p0 { background: #4d8dff; } .art-geoh .p1 { background: #2fc77d; } .art-geoh .p2 { background: #7aa8ff; } .art-geoh .p3 { background: #ffae3b; } .art-geoh .p4 { background: #8f7bff; }
.art-geoh .cells { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }
.art-geoh .cells i { display: block; height: 22px; border-radius: 6px; background: rgba(42,107,246,var(--a)); }
.art-geoh .cells i:nth-child(7), .art-geoh .cells i:nth-child(13) { background: rgba(47,199,125,.9); }
.art-geoh .gmag { display: grid; place-items: center; color: #fff; border-radius: 28px; }
.art-geoh .gmag .ico { width: 46px; height: 46px; }
.art-geoh .gmag .ico svg { stroke-width: 2.2; }
.art-geoh .gmag::after { content: ""; position: absolute; inset: -14px; border-radius: 38px; border: 1.5px solid rgba(42,107,246,.25); animation: ring 2.8s ease-out infinite; }

/* GEO 专题页横幅：闭环 */
.art-geol .gring { position: absolute; left: 0; top: 0; width: 600px; height: 440px; fill: none; animation: none; }
.art-geol .gring ellipse { stroke: rgba(42,107,246,.28); stroke-width: 2; stroke-dasharray: 5 7; }
.art-geol .gring .run { stroke: #2a6bf6; stroke-width: 3; stroke-linecap: round; stroke-dasharray: 90 1100; animation: orbit-run 7s linear infinite; }
@keyframes orbit-run { to { stroke-dashoffset: -1190; } }
.art-geol .node { display: grid; place-items: center; color: #2a6bf6; border-radius: 26px; }
.art-geol .node .ico { width: 38px; height: 38px; }
.art-geol .node .ico svg { stroke-width: 1.8; }
.art-geol .node.mt { background: linear-gradient(155deg, #a6f5cc 0%, #5ee0a0 50%, #2fc77d 100%); border-color: transparent; color: #fff; box-shadow: 0 26px 46px -22px rgba(30,170,100,.6), inset 0 1px 0 rgba(255,255,255,.5); }
.art-geol .gcore { display: grid; place-items: center; color: #fff; border-radius: 44px; padding: 40px; }
.art-geol .gcore::after { content: ""; position: absolute; inset: -16px; border-radius: 56px; border: 1.5px solid rgba(42,107,246,.25); animation: ring 2.8s ease-out infinite; }

/* ================= GEO 专题页 ================= */
.geo-note { margin: -28px auto 40px; text-align: center; color: var(--text-2); font-size: 15px; }
.geo-what .img { box-shadow: 18px 18px 0 -2px #e6eefb; }
.geo-loop { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; counter-reset: s; }
.geo-loop li { position: relative; padding: 28px 26px 26px; border-radius: 10px; background: #fff; border: 1px solid var(--line); transition: all .35s var(--ease); }
.geo-loop li:hover { transform: translateY(-4px); box-shadow: 0 22px 40px -24px rgba(31,102,255,.4); border-color: #cddcf7; }
.geo-loop li > .ico { width: 44px; height: 44px; padding: 10px; border-radius: 12px; color: #fff; background: linear-gradient(155deg, #6ea2ff, #1f66ff); box-shadow: 0 10px 20px -10px rgba(31,102,255,.8); }
.geo-loop li:nth-child(6) > .ico { background: linear-gradient(155deg, #7fe6b2, #2fc77d); box-shadow: 0 10px 20px -10px rgba(47,199,125,.8); }
.geo-loop .n { position: absolute; right: 24px; top: 22px; font: 600 28px/1 var(--font); color: #e6edf9; letter-spacing: -.02em; }
.geo-loop b { display: block; margin-top: 18px; font-size: 17px; color: var(--navy); }
.geo-loop p { margin-top: 6px; font-size: 14px; color: var(--text-2); line-height: 1.75; }
.geo-loop li:not(:nth-child(3n))::after { content: ""; position: absolute; right: -15px; top: 48px; width: 10px; height: 10px; border-top: 2px solid #b8cdf3; border-right: 2px solid #b8cdf3; transform: rotate(45deg); }
.geo-loop .nx { display: inline-block; margin-top: 12px; font-size: 12px; color: #1fae68; background: rgba(47,199,125,.12); padding: 2px 8px; border-radius: 10px; }

.geo-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.gm { padding: 24px 22px; border-radius: 10px; border: 1px solid var(--line); background: linear-gradient(180deg, #f5f8fe 0%, #fff 70%); }
.gm .k { display: inline-block; font: 600 13px/1 var(--font); color: var(--primary); background: rgba(31,102,255,.08); padding: 6px 9px; border-radius: 6px; letter-spacing: .04em; }
.gm b { display: block; margin-top: 16px; font-size: 16px; color: var(--navy); }
.gm p { margin-top: 6px; font-size: 13.5px; color: var(--text-2); line-height: 1.7; }
.gm.main { grid-row: span 2; display: flex; flex-direction: column; justify-content: flex-end; color: #fff; border: 0; background: radial-gradient(120% 80% at 100% 0%, rgba(47,199,125,.55), transparent 60%), linear-gradient(155deg, #4d8dff, #1f66ff 60%, #1550d6); box-shadow: 0 26px 50px -26px rgba(31,102,255,.8); }
.gm.main .k { align-self: flex-start; font-size: 40px; padding: 0; background: none; color: #fff; letter-spacing: -.01em; }
.gm.main b { color: #fff; font-size: 18px; } .gm.main p { color: rgba(255,255,255,.82); }

.geo-sys { display: grid; grid-template-columns: 1.45fr 1fr; gap: 48px; align-items: center; }
.geo-ui { margin: 0; }
.geo-ui figcaption { margin-top: 12px; font-size: 12.5px; color: var(--text-3, #8a94a6); text-align: center; }
.gui { border-radius: 12px; overflow: hidden; background: #fff; border: 1px solid #dfe6f2; box-shadow: 0 40px 80px -40px rgba(31,80,180,.45), 0 4px 12px -6px rgba(31,80,180,.12); font-size: 12px; color: #16233b; }
.gui-bar { display: flex; align-items: center; gap: 6px; height: 34px; padding: 0 14px; background: #f4f6fa; border-bottom: 1px solid #e6ebf3; }
.gui-bar i { width: 9px; height: 9px; border-radius: 50%; background: #dbe1ea; }
.gui-bar span { margin-left: 10px; font-size: 12px; color: #6a7a96; }
.gui-body { display: grid; grid-template-columns: 112px 1fr; min-height: 340px; }
.gui-side { display: flex; flex-direction: column; gap: 2px; padding: 12px 8px; background: #fafbfd; border-right: 1px solid #edf0f5; }
.gui-side span { padding: 7px 10px; border-radius: 6px; color: #5a6880; white-space: nowrap; }
.gui-side .on { background: rgba(31,102,255,.09); color: var(--primary); font-weight: 600; }
.gui-main { padding: 16px 18px; min-width: 0; }
.gui-hd { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.gui-hd b { font-size: 15px; } .gui-hd span { color: #8a94a6; font-size: 11.5px; }
.gui-kpi { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-top: 12px; }
.gui-kpi div { padding: 10px 11px; border-radius: 8px; border: 1px solid #edf0f5; }
.gui-kpi span { display: block; color: #8a94a6; font-size: 11px; white-space: nowrap; }
.gui-kpi b { font-size: 20px; font-weight: 600; letter-spacing: -.01em; }
.gui-kpi em { font-style: normal; margin-left: 4px; font-size: 11px; color: #1fae68; }
.gui-kpi div:first-child { background: linear-gradient(155deg, #eef4ff, #fff); border-color: #d6e3fb; } .gui-kpi div:first-child b { color: var(--primary); }
.gui-panels { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 8px; }
.gui-card { padding: 12px; border-radius: 8px; border: 1px solid #edf0f5; }
.gui-card > p { font-weight: 600; margin-bottom: 10px; }
.gui-bar-row { display: grid; grid-template-columns: 52px 1fr 30px; align-items: center; gap: 6px; margin-top: 7px; color: #5a6880; font-size: 11px; }
.gui-bar-row i { height: 7px; border-radius: 4px; background: #eef2f8; position: relative; overflow: hidden; }
.gui-bar-row i::after { content: ""; position: absolute; inset: 0 auto 0 0; width: var(--w); border-radius: 4px; background: linear-gradient(90deg, #6ea2ff, #1f66ff); }
.gui-bar-row b { font-weight: 500; text-align: right; color: #16233b; }
.gui-heat { display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; }
.gui-heat i, .gui-legend i { display: block; height: 20px; border-radius: 4px; }
.gui .h0 { background: #eef2f8; } .gui .h1 { background: #c9dbff; } .gui .h2 { background: #6ea2ff; } .gui .h3 { background: #2fc77d; }
.gui-legend { display: flex; align-items: center; gap: 4px; margin-top: 10px; color: #8a94a6; font-size: 10.5px; }
.gui-legend i { width: 14px; height: 10px; }
.geo-sys-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 20px; }
.geo-sys-list li { display: flex; gap: 14px; align-items: flex-start; }
.geo-sys-list .ico { width: 40px; height: 40px; flex: none; padding: 9px; border-radius: 10px; background: #fff; color: var(--primary); box-shadow: var(--shadow-sm); }
.geo-sys-list b { font-size: 16px; color: var(--navy); }
.geo-sys-list p { margin-top: 3px; font-size: 14px; color: var(--text-2); }

.geo-pkgs { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.geo-pkg { padding: 34px 32px; border-radius: 12px; border: 1px solid var(--line); background: #fff; scroll-margin-top: 90px; transition: all .35s var(--ease); }
.geo-pkg:hover { box-shadow: 0 24px 46px -28px rgba(31,102,255,.45); border-color: #cddcf7; }
.geo-pkg-hd { display: flex; gap: 16px; align-items: flex-start; }
.geo-pkg-hd > .ico { width: 48px; height: 48px; flex: none; padding: 11px; border-radius: 12px; color: #fff; background: linear-gradient(155deg, #6ea2ff, #1f66ff); }
.geo-pkg:nth-child(2) .geo-pkg-hd > .ico { background: linear-gradient(155deg, #7fe6b2, #2fc77d); }
.geo-pkg h3 { font-size: 20px; color: var(--navy); }
.geo-pkg-hd p { margin-top: 6px; font-size: 14px; color: var(--text-2); line-height: 1.75; }
.geo-pkg .fit { margin: 18px 0 22px; font-size: 13.5px; color: var(--text-2); }

.geo-faq { max-width: 860px; margin: 0 auto; display: grid; gap: 12px; }
.geo-faq details { border-radius: 10px; background: #fff; border: 1px solid var(--line); }
.geo-faq summary { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 22px; font-size: 16px; font-weight: 600; color: var(--navy); cursor: pointer; list-style: none; }
.geo-faq summary::-webkit-details-marker { display: none; }
.geo-faq summary .ico { width: 18px; height: 18px; flex: none; color: #8a94a6; transition: transform .3s var(--ease); }
.geo-faq details[open] summary .ico { transform: rotate(180deg); color: var(--primary); }
.geo-faq details p { padding: 0 22px 20px; font-size: 14.5px; color: var(--text-2); line-height: 1.85; }

@media (max-width: 1100px) {
  .geo-metrics { grid-template-columns: repeat(2, 1fr); } .gm.main { grid-row: auto; grid-column: span 2; }
  .geo-sys { grid-template-columns: 1fr; gap: 36px; }
}
@media (max-width: 860px) {
  .geo-loop { grid-template-columns: 1fr 1fr; } .geo-loop li::after { display: none; }
  .geo-pkgs { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .geo-loop { grid-template-columns: 1fr; }
  .geo-metrics { grid-template-columns: 1fr; } .gm.main { grid-column: auto; }
  .geo-pkg { padding: 26px 22px; } .geo-pkg .feat { grid-template-columns: 1fr; }
  .gui-body { grid-template-columns: 1fr; } .gui-side { display: none; }
  .gui-kpi { grid-template-columns: 1fr 1fr; } .gui-panels { grid-template-columns: 1fr; }
}
@media (max-width: 600px) { .slide .btns .btn.ghost { display: none; } }
.geo-factors { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.geo-core { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.geo-ana { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; margin-top: 18px; padding: 16px 20px; border-radius: 10px; background: var(--bg-2); font-size: 13.5px; color: var(--text-2); }
.geo-ana > b { color: var(--navy); font-size: 14px; margin-right: 6px; }
.geo-ana span { padding: 6px 12px; border-radius: 16px; background: #fff; border: 1px solid var(--line); }
.geo-ana em { font-style: normal; font-weight: 600; color: var(--primary); margin-right: 6px; }
.geo-rules { list-style: none; margin: 22px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.geo-rules li { display: flex; gap: 8px; font-size: 14px; color: var(--text-2); line-height: 1.7; }
.geo-rules .ico { width: 18px; height: 18px; flex: none; margin-top: 3px; color: #1fae68; }
.geo-dlv { margin-top: 20px; padding: 16px 18px; border-radius: 10px; background: #f5f8fe; }
.geo-dlv b { font-size: 14px; color: var(--navy); }
.geo-dlv ul { margin: 8px 0 0; padding-left: 18px; display: grid; gap: 4px; font-size: 13.5px; color: var(--text-2); }
.geo-vs td:first-child { font-weight: 600; color: var(--navy); white-space: nowrap; }
.geo-vs td:last-child, .geo-vs th:last-child { color: var(--primary); }
.geo-vs th:last-child { background: #eef4ff; }
@media (max-width: 1100px) { .geo-factors, .geo-core { grid-template-columns: repeat(2, 1fr); } .geo-rules { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .geo-factors, .geo-core { grid-template-columns: 1fr; } .geo-vs td:first-child { white-space: normal; } }
table.tech.geo-vs td:last-child { width: 42%; color: var(--primary); } table.tech.geo-vs td:first-child { width: 150px; } table.tech.geo-vs td:nth-child(2) { width: 38%; }
@media (max-width: 600px) {
  table.tech.geo-vs tbody tr { display: block; }
  table.tech.geo-vs td { display: block; text-align: left; font-size: 14px; margin-top: 6px; line-height: 1.7; }
  table.tech.geo-vs td:first-child { margin-top: 0; }
  table.tech.geo-vs td:nth-child(2)::before, table.tech.geo-vs td:last-child::before { display: inline-block; margin-right: 8px; padding: 0 6px; border-radius: 4px; font: 600 11px/18px var(--font); }
  table.tech.geo-vs td:nth-child(2)::before { content: "SEO"; background: #eef1f5; color: var(--text-2); }
  table.tech.geo-vs td:last-child::before { content: "GEO"; background: #eef4ff; color: var(--primary); }
}

/* ================= 业务范围页 v2 ================= */
.sv-life { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; border: 1px solid var(--line); border-radius: 12px; background: #fff; overflow: hidden; box-shadow: 0 24px 50px -36px rgba(31,80,180,.35); }
.sv-life li { position: relative; padding: 28px 22px 24px; display: flex; flex-direction: column; }
.sv-life li + li { border-left: 1px solid var(--line); }
.sv-life li::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: linear-gradient(90deg, #6ea2ff, #1f66ff); opacity: calc(.35 + var(--i, 0) * .16); }
.sv-life li:nth-child(2) { --i: 0; } .sv-life li:nth-child(3) { --i: 1; } .sv-life li:nth-child(4) { --i: 2; } .sv-life li:nth-child(5) { --i: 3; }
.sv-life li:nth-child(1)::before { background: linear-gradient(90deg, #5ee0a0, #2fc77d); opacity: 1; }
.sv-life li:nth-child(1) { background: linear-gradient(180deg, #f1fbf6 0%, #fff 70%); }
.sv-life .n { font: 600 13px/1 var(--font); color: var(--primary); letter-spacing: .06em; }
.sv-life li:nth-child(1) .n { color: #1fae68; }
.sv-life b { display: block; margin-top: 10px; font-size: 18px; color: var(--navy); }
.sv-life p { margin-top: 6px; font-size: 13.5px; color: var(--text-2); line-height: 1.7; }
.sv-life .chips { margin-top: auto; padding-top: 16px; display: flex; flex-direction: column; gap: 6px; }
.chip { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 8px; background: var(--bg-2); color: var(--text); font-size: 13px; transition: all .25s var(--ease); }
.chip .ico { width: 16px; height: 16px; color: var(--primary); flex: none; }
.chip:hover { background: #eaf1ff; color: var(--primary); }
.chip.go { background: none; color: var(--primary); padding-left: 0; }

.sv-ghd { display: flex; align-items: flex-end; gap: 22px; margin-bottom: 36px; }
.sv-ghd .no { font: 700 64px/.8 var(--font); letter-spacing: -.03em; background: linear-gradient(160deg, #9cc2ff, #1f66ff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.sv-group.tint .sv-ghd .no { background-image: linear-gradient(160deg, #9af2c4, #2fc77d); }
.sv-ghd h2 { font-size: 30px; color: var(--navy); }
.sv-ghd p { margin-top: 6px; font-size: 15px; color: var(--text-2); }

.sv-feat { display: grid; grid-template-columns: 1.15fr 1fr; gap: 0; border-radius: 14px; overflow: hidden; background: #fff; border: 1px solid var(--line); margin-bottom: 24px; scroll-margin-top: 90px; }
.sv-feat > .img { border-radius: 0; height: 100%; aspect-ratio: auto; min-height: 380px; }
.sv-feat .sv-body { padding: 36px 38px; }
.sv-feat h3 { font-size: 24px; }
.sv-cards { display: grid; gap: 24px; }
.sv-cards.c2 { grid-template-columns: 1fr 1fr; } .sv-cards.c3 { grid-template-columns: repeat(3, 1fr); }
.sv-card { display: flex; flex-direction: column; border-radius: 14px; overflow: hidden; background: #fff; border: 1px solid var(--line); scroll-margin-top: 90px; transition: transform .35s var(--ease), box-shadow .35s var(--ease); }
.sv-card:hover, .sv-feat:hover { box-shadow: 0 28px 56px -32px rgba(31,80,180,.45); }
.sv-card:hover { transform: translateY(-4px); }
.sv-card > .img { border-radius: 0; }
.sv-card .sv-body { padding: 26px 26px 28px; flex: 1; display: flex; flex-direction: column; }
.sv-hd { display: flex; align-items: center; gap: 12px; }
.sv-hd .ico { width: 40px; height: 40px; padding: 9px; flex: none; border-radius: 10px; color: #fff; background: linear-gradient(155deg, #6ea2ff, #1f66ff); box-shadow: 0 10px 20px -10px rgba(31,102,255,.8); }
.sv-group.tint .sv-hd .ico { background: linear-gradient(155deg, #7fe6b2, #2fc77d); box-shadow: 0 10px 20px -10px rgba(47,199,125,.8); }
.sv-hd h3 { font-size: 20px; color: var(--navy); }
.sv-body .desc { margin-top: 14px; font-size: 14.5px; color: var(--text-2); line-height: 1.8; }
.tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.tags span { padding: 5px 11px; border-radius: 14px; background: #f0f5ff; color: #2a5bc4; font-size: 12.5px; line-height: 1.5; }
.sv-body .dlv { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin-top: 18px; padding-top: 16px; border-top: 1px dashed #dde3ee; font-size: 13px; color: var(--text-2); }
.sv-body .dlv b { width: 100%; font-size: 13px; color: var(--navy); }
.sv-body .dlv span { display: inline-flex; align-items: center; gap: 5px; }
.sv-body .dlv .ico { width: 14px; height: 14px; color: #1fae68; }
.sv-body .fit { margin: 14px 0 0; font-size: 13px; color: var(--text-3, #8a94a6); }
.sv-body .link { margin-top: auto; padding-top: 18px; display: inline-flex; align-items: center; gap: 6px; font-size: 14px; color: var(--primary); }
.sv-body .link .ico { width: 15px; height: 15px; transition: transform .3s var(--ease); }
.sv-body .link:hover .ico { transform: translateX(3px); }
.sv-feat .sv-body { display: flex; flex-direction: column; }

.tech-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.tg { padding: 26px 26px 24px; border-radius: 12px; border: 1px solid var(--line); background: linear-gradient(180deg, #f5f8fe 0%, #fff 60%); }
.tg > .ico { width: 42px; height: 42px; padding: 10px; border-radius: 10px; background: #fff; color: var(--primary); box-shadow: var(--shadow-sm); }
.tg-hd { display: flex; align-items: baseline; justify-content: space-between; margin-top: 16px; }
.tg-hd b { font-size: 17px; color: var(--navy); }
.tg-hd span { font-size: 13px; }
.tg .tags span { background: #fff; border: 1px solid #e3e9f3; color: var(--text); }

.proc { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, 1fr); gap: 18px; position: relative; }
.proc::before { content: ""; position: absolute; left: 22px; right: 22px; top: 21px; height: 2px; background: linear-gradient(90deg, #b8cdf3, #1f66ff 60%, #2fc77d); }
.proc li { position: relative; }
.proc .dot { position: relative; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: #fff; border: 2px solid #1f66ff; color: var(--primary); font: 700 16px/1 var(--font); box-shadow: 0 0 0 6px var(--bg-2); transition: all .3s var(--ease); }
.proc li:last-child .dot { border-color: #2fc77d; color: #1fae68; }
.proc li:hover .dot { background: var(--primary); color: #fff; }
.proc b { display: block; margin-top: 18px; font-size: 17px; color: var(--navy); }
.proc p { margin-top: 6px; font-size: 13.5px; color: var(--text-2); line-height: 1.75; }

@media (max-width: 1100px) {
  .sv-life { grid-template-columns: repeat(3, 1fr); } .sv-life li:nth-child(4) { border-left: 0; } .sv-life li:nth-child(n+4) { border-top: 1px solid var(--line); }
  .sv-cards.c3 { grid-template-columns: 1fr 1fr; }
  .sv-feat { grid-template-columns: 1fr; } .sv-feat > .img { min-height: 0; aspect-ratio: 16 / 9; }
  .tech-grid { grid-template-columns: 1fr 1fr; }
  .proc { grid-template-columns: repeat(3, 1fr); row-gap: 34px; } .proc::before { display: none; }
}
@media (max-width: 700px) {
  .sv-life { grid-template-columns: 1fr; } .sv-life li + li { border-left: 0; border-top: 1px solid var(--line); }
  .sv-cards.c2, .sv-cards.c3, .tech-grid { grid-template-columns: 1fr; }
  .sv-feat .sv-body { padding: 26px 22px; } .sv-card .sv-body { padding: 22px; }
  .sv-ghd { gap: 14px; } .sv-ghd .no { font-size: 46px; } .sv-ghd h2 { font-size: 24px; }
  .proc { grid-template-columns: 1fr; row-gap: 0; }
  .proc li { display: grid; grid-template-columns: 44px 1fr; column-gap: 16px; padding-bottom: 22px; }
  .proc li::before { content: ""; position: absolute; left: 21px; top: 44px; bottom: 0; width: 2px; background: #cfdcf3; }
  .proc li:last-child::before { display: none; }
  .proc .dot { grid-row: span 2; } .proc b { margin-top: 10px; }
}
.sv-life .chip .ico { width: 16px; height: 16px; padding: 0; background: none; box-shadow: none; border-radius: 0; display: inline-flex; }
.sv-life .chip .ico svg { width: 16px; height: 16px; }
.proc::before { right: calc(100% / 12); }

/* ================= 业务配图 sv_*（统一玻璃风格） ================= */
[class*="art-sv"] .vwin { overflow: hidden; padding: 0; }
[class*="art-sv"] .vtb, [class*="art-sv"] .vurl { display: flex; align-items: center; gap: 6px; height: 38px; padding: 0 16px; border-bottom: 1px solid rgba(40,92,190,.08); }
[class*="art-sv"] .vtb i, [class*="art-sv"] .vurl i { width: 9px; height: 9px; border-radius: 50%; background: rgba(40,92,190,.18); }
[class*="art-sv"] .vtb i:first-child, [class*="art-sv"] .vurl i:first-child { background: #ff8b7b; } [class*="art-sv"] .vtb i:nth-child(2), [class*="art-sv"] .vurl i:nth-child(2) { background: #ffcb5c; } [class*="art-sv"] .vtb i:nth-child(3), [class*="art-sv"] .vurl i:nth-child(3) { background: #5ee0a0; }
[class*="art-sv"] .vurl span { flex: 1; height: 18px; margin-left: 12px; border-radius: 9px; background: rgba(40,92,190,.07); }
[class*="art-sv"] .vic { display: grid; place-items: center; color: #fff; border-radius: 30px; }
[class*="art-sv"] .vic .ico { width: 50px; height: 50px; } [class*="art-sv"] .vic .ico svg { stroke-width: 2.1; }
[class*="art-sv"] .vic::after { content: ""; position: absolute; inset: -12px; border-radius: 40px; border: 1.5px solid rgba(42,107,246,.22); animation: ring 2.8s ease-out infinite; }
[class*="art-sv"] .vic.m::after { border-color: rgba(47,199,125,.3); }
[class*="art-sv"] .vst { display: inline-block; width: 40px; height: 16px; border-radius: 8px; flex: none; }
[class*="art-sv"] .vst.g { background: rgba(47,199,125,.2); } [class*="art-sv"] .vst.b { background: rgba(42,107,246,.16); } [class*="art-sv"] .vst.a { background: rgba(255,174,59,.25); }
[class*="art-sv"] .vrow { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
[class*="art-sv"] .vrow .ln { margin: 0; flex: none; }
[class*="art-sv"] .vrow .ln.r { margin-left: auto; background: rgba(40,92,190,.1); }
[class*="art-sv"] .vbtn { display: block; width: 70px; height: 22px; border-radius: 11px; background: linear-gradient(155deg, #6ea2ff, #2a6bf6); box-shadow: 0 8px 14px -8px rgba(42,107,246,.8); }

/* 管理系统 */
.art-svsys .vside { position: absolute; left: 14px; top: 52px; bottom: 14px; width: 40px; border-radius: 12px; background: linear-gradient(180deg, #4d8dff, #2a6bf6); display: grid; align-content: start; justify-items: center; gap: 12px; padding: 14px 0; }
.art-svsys .vside i { width: 18px; height: 18px; border-radius: 6px; background: rgba(255,255,255,.35); } .art-svsys .vside i.on { background: #fff; }
.art-svsys .vmain { position: absolute; left: 68px; right: 16px; top: 52px; }
.art-svsys .vkp { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.art-svsys .vkp > div { padding: 9px 10px; border-radius: 10px; background: rgba(255,255,255,.75); border: 1px solid rgba(40,92,190,.08); }
.art-svsys .vkp .ln { height: 6px; }
.art-svsys .vkp b { display: block; margin-top: 6px; font: 600 17px/1 var(--font); color: #16233b; }
.art-svsys .bars { height: 74px; margin-top: 12px; gap: 9px; }
.art-svsys .av { width: 18px; height: 18px; border-radius: 50%; background: #dce8ff; flex: none; }
.art-svsys .vrow { margin-top: 8px; } .art-svsys .vrow .ln { height: 7px; }
.art-svsys .vrow .vst { margin-left: auto; }
.art-svsys .vdc { display: grid; justify-items: center; align-content: center; padding: 12px; }
.art-svsys .vdn { width: 104px; height: 104px; transform: rotate(-90deg); }
.art-svsys .vdn circle { fill: none; stroke-width: 12; } .art-svsys .vdn .trk { stroke: rgba(40,92,190,.1); }
.art-svsys .vdn .arc { stroke: #2a6bf6; stroke-linecap: round; stroke-dasharray: 289; animation: ring-in 1.6s var(--ease) .3s both; }
.art-svsys .vdc .num { position: absolute; top: 50px; font-size: 22px; }
.art-svsys .vdc > .ln { margin-top: 10px; }
.art-svsys .vok { display: flex; align-items: center; gap: 14px; padding: 0 16px; } .art-svsys .vok > div { flex: 1; }

/* 网站与小程序 */
.art-svweb .vhero { margin: 14px; height: 108px; border-radius: 12px; padding: 22px 20px; background: linear-gradient(120deg, #2a6bf6 0%, #4d8dff 55%, #5ee0a0 130%); position: relative; overflow: hidden; }
.art-svweb .vhero::after { content: ""; position: absolute; right: -30px; top: -40px; width: 160px; height: 160px; border-radius: 50%; background: rgba(255,255,255,.16); }
.art-svweb .vhero .ln { background: rgba(255,255,255,.85); height: 10px; } .art-svweb .vhero .ln + .ln { background: rgba(255,255,255,.5); height: 7px; }
.art-svweb .vhero .vbtn { margin-top: 14px; background: #fff; width: 64px; height: 20px; }
.art-svweb .vcards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 0 14px; }
.art-svweb .vcards > div { padding: 8px; border-radius: 10px; background: rgba(255,255,255,.8); border: 1px solid rgba(40,92,190,.08); }
.art-svweb .vcards .im { display: block; height: 44px; border-radius: 7px; margin-bottom: 8px; background: #dce8ff; } .art-svweb .vcards .im.c1 { background: #d6f5e6; } .art-svweb .vcards .im.c2 { background: #e6edfb; }
.art-svweb .vcards .ln { height: 6px; margin-top: 6px; }
[class*="art-sv"] .vphone { border-radius: 34px; padding: 9px; }
[class*="art-sv"] .vscr { position: absolute; inset: 9px; border-radius: 26px; overflow: hidden; background: linear-gradient(180deg, #f8fbff, #eef4ff); padding: 12px 11px; }
.art-svweb .vcap { display: flex; justify-content: flex-end; } .art-svweb .vcap i { display: none; }
.art-svweb .vcap b { width: 52px; height: 18px; border-radius: 9px; border: 1px solid rgba(40,92,190,.18); background: #fff; }
.art-svweb .vban { height: 74px; margin-top: 10px; border-radius: 12px; background: linear-gradient(130deg, #5c98ff, #2a6bf6 60%, #34c98a); }
.art-svweb .vgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 12px 2px; }
.art-svweb .vgrid i { aspect-ratio: 1; border-radius: 9px; background: #dce8ff; } .art-svweb .vgrid .c0 { background: linear-gradient(150deg, #8ab9ff, #2a6bf6); } .art-svweb .vgrid .c5 { background: linear-gradient(150deg, #a6f5cc, #2fc77d); }
[class*="art-sv"] .vli { display: flex; align-items: center; gap: 9px; padding: 9px; margin-top: 8px; border-radius: 11px; background: #fff; }
[class*="art-sv"] .vli > i { width: 30px; height: 30px; flex: none; border-radius: 8px; background: #e3edff; } [class*="art-sv"] .vli > div { flex: 1; } [class*="art-sv"] .vli .ln { height: 6px; margin-top: 6px; } [class*="art-sv"] .vli .ln:first-child { margin-top: 0; }
.art-svweb .vchip { display: flex; align-items: center; gap: 12px; padding: 0 18px; color: #fff; }
.art-svweb .vchip .ico { width: 30px; height: 30px; } .art-svweb .vchip > i { flex: 1; height: 9px; border-radius: 5px; background: rgba(255,255,255,.7); }

/* 移动应用 */
.art-svapp .vbig .vscr { padding: 16px 12px; }
.art-svapp .vhd2 { padding: 14px; border-radius: 14px; background: linear-gradient(135deg, #4d8dff, #2a6bf6); }
.art-svapp .vhd2 .ln { background: rgba(255,255,255,.6); height: 6px; } .art-svapp .vhd2 b { display: block; margin-top: 8px; font: 600 22px/1 var(--font); color: #fff; }
.art-svapp .vli .c1 { background: #d6f5e6; } .art-svapp .vli .c2 { background: #fff0d6; }
.art-svapp .vli .vst { width: 28px; }
.art-svapp .vtab { position: absolute; left: 0; right: 0; bottom: 0; height: 48px; background: #fff; display: flex; justify-content: space-around; align-items: center; }
.art-svapp .vtab i { width: 18px; height: 18px; border-radius: 6px; background: #d5e2f7; } .art-svapp .vtab i.on { background: #2a6bf6; }
.art-svapp .vnot { display: flex; align-items: center; gap: 14px; padding: 0 16px; } .art-svapp .vnot > div { flex: 1; }
.art-svapp .vrate { padding: 16px 18px; }
.art-svapp .vrate .hd > div { flex: 1; }
.art-svapp .appi { width: 40px; height: 40px; flex: none; border-radius: 11px; background: linear-gradient(150deg, #8ab9ff, #2a6bf6); }
.art-svapp .stars { display: flex; gap: 4px; margin: 14px 0 12px; }
.art-svapp .stars svg { width: 18px; height: 18px; fill: #ffb547; }
.art-svapp .vbell { display: grid; place-items: center; border-radius: 30px; } .art-svapp .vbell .ico { width: 46px; height: 46px; }

/* 老系统维护 */
.art-svfix .vcode { background: linear-gradient(160deg, rgba(25,40,80,.92), rgba(30,55,120,.86)); border-color: rgba(255,255,255,.25); }
.art-svfix .vcode .vtb { border-color: rgba(255,255,255,.08); }
.art-svfix .vsrc { position: relative; padding: 12px 16px; }
.art-svfix .cl { display: flex; align-items: center; gap: 7px; height: 25px; padding-left: var(--in); }
.art-svfix .cl .no { width: 18px; margin-left: calc(-1 * var(--in)); margin-right: var(--in); font: 500 10px/1 ui-monospace, Menlo, monospace; color: rgba(255,255,255,.3); text-align: right; }
.art-svfix .cl i { height: 8px; border-radius: 4px; }
.art-svfix .cl .k { background: #8fb6ff; } .art-svfix .cl .s { background: #7fe6b2; } .art-svfix .cl .f { background: #ffcf7a; } .art-svfix .cl .n { background: rgba(255,255,255,.4); } .art-svfix .cl .c { background: rgba(255,255,255,.18); }
.art-svfix .hl { position: absolute; left: 6px; right: 6px; top: 112px; height: 27px; border-radius: 6px; background: rgba(94,224,160,.16); border-left: 3px solid #5ee0a0; animation: hilite 2.4s ease-in-out infinite; }
.art-svfix .vperf { padding: 18px 20px; }
.art-svfix .cmp { display: flex; gap: 22px; align-items: flex-end; height: 92px; margin-top: 14px; padding: 0 14px; }
.art-svfix .cmp > div { flex: 1; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; }
.art-svfix .bb { display: block; width: 100%; height: var(--h); border-radius: 8px 8px 3px 3px; background: linear-gradient(180deg, #ffb59a, #ffd8c9); transform-origin: bottom; animation: grow-y 1s var(--ease) .3s both; }
.art-svfix .bb.ok { background: linear-gradient(180deg, #2fc77d, #a6f5cc); animation-delay: .6s; }
.art-svfix .cmp span { display: block; width: 60%; height: 6px; margin-top: 8px; border-radius: 3px; background: rgba(40,92,190,.14); }
.art-svfix .vbadge { display: grid; place-items: center; border-radius: 50%; padding: 14px; } .art-svfix .vbadge .ico svg { stroke-width: 3; }

/* 系统集成 */
.art-svapi .vflow { position: absolute; left: 0; top: 0; width: 600px; height: 440px; fill: none; stroke: rgba(42,107,246,.55); stroke-width: 2.2; stroke-dasharray: 6 8; animation: dash 1.2s linear infinite; }
.art-svapi .vnode { display: grid; place-items: center; color: #2a6bf6; border-radius: 24px; }
.art-svapi .vnode .ico { width: 36px; height: 36px; } .art-svapi .vnode .ico svg { stroke-width: 1.9; }
.art-svapi .vnode.vt { color: #fff; border-radius: 28px; background: linear-gradient(155deg, #a6f5cc 0%, #5ee0a0 50%, #2fc77d 100%); border-color: transparent; box-shadow: 0 26px 46px -22px rgba(30,170,100,.6), inset 0 1px 0 rgba(255,255,255,.5); }
.art-svapi .vnode.vt .ico { width: 42px; height: 42px; }
.art-svapi .vhub { display: grid; place-items: center; color: #fff; border-radius: 36px; }
.art-svapi .vhub .ico { width: 60px; height: 60px; } .art-svapi .vhub .ico svg { stroke-width: 2.1; }
.art-svapi .vhub::after { content: ""; position: absolute; inset: -14px; border-radius: 46px; border: 1.5px solid rgba(42,107,246,.25); animation: ring 2.8s ease-out infinite; }

/* 服务器运维 */
.art-svops .vrack { padding: 18px 16px; display: grid; gap: 10px; align-content: center; border-radius: 22px; }
.art-svops .u { display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 14px; border-radius: 10px; background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.22); }
.art-svops .u .led { width: 8px; height: 8px; border-radius: 50%; background: #6dffb0; box-shadow: 0 0 8px #2fc77d; animation: blink 1.6s steps(2) infinite; }
.art-svops .u .led.b { background: #bfe0ff; box-shadow: 0 0 8px #8ab9ff; animation-delay: .4s; }
.art-svops .u:nth-child(2) .led { animation-delay: .7s; } .art-svops .u:nth-child(4) .led { animation-delay: 1.1s; }
.art-svops .u span { margin-left: auto; width: 46px; height: 6px; border-radius: 3px; background: rgba(255,255,255,.3); } .art-svops .u span + span { margin-left: 0; width: 26px; }
.art-svops .vmon { padding: 16px 18px; }
.art-svops .vmon .st { width: 12px; height: 12px; border-radius: 50%; background: #2fc77d; box-shadow: 0 0 0 4px rgba(47,199,125,.2); animation: pulse 2s ease-out infinite; }
.art-svops .vmon .big { margin-top: 16px; width: 100%; height: 90px; }
.art-svops .vlst { padding: 14px 18px; }
.art-svops .vlst .vrow:first-child { margin-top: 0; } .art-svops .vlst .vst { width: 14px; height: 14px; border-radius: 50%; background: #2fc77d; box-shadow: 0 0 0 4px rgba(47,199,125,.16); }
.art-svops .vsh { border-radius: 26px; } .art-svops .vsh .ico { width: 46px; height: 46px; }
.art-svfix .vcode { background: linear-gradient(150deg, rgba(255,255,255,.9) 0%, rgba(255,255,255,.6) 100%); border-color: #fff; }
.art-svfix .vcode .vtb { border-color: rgba(40,92,190,.08); }
.art-svfix .cl .no { color: rgba(40,92,190,.35); }
.art-svfix .cl .k { background: #4d8dff; } .art-svfix .cl .s { background: #2fc77d; } .art-svfix .cl .f { background: #ffae3b; } .art-svfix .cl .n { background: rgba(40,92,190,.28); } .art-svfix .cl .c { background: rgba(40,92,190,.12); }
.art-svfix .hl { background: rgba(47,199,125,.12); }
/* 16:9 卡片里的插画按高度缩放，避免上下被裁 */
.art-fig.r-169 .art { --fk: .72; }
@container (max-width: 560px) { .art-fig.r-169 .art { --fk: .63; } }
@container (max-width: 480px) { .art-fig.r-169 .art { --fk: .54; } }
@container (max-width: 400px) { .art-fig.r-169 .art { --fk: .47; } }
@container (max-width: 340px) { .art-fig.r-169 .art { --fk: .41; } }
@media (max-width: 1100px) {
  .sv-feat .art-fig .art { --fk: .72; }
  @container (max-width: 560px) { .sv-feat .art-fig .art { --fk: .63; } }
  @container (max-width: 480px) { .sv-feat .art-fig .art { --fk: .54; } }
  @container (max-width: 400px) { .sv-feat .art-fig .art { --fk: .47; } }
}

/* ================= v60 整站视觉走查修正 ================= */
/* 排版：避免孤字、标题均衡换行 */
p, .sub, .lead, .desc, .sec-title p, li { text-wrap: pretty; }
h1, h2, h3, .sec-title h2 { text-wrap: balance; }
/* 手机端：插图背后的光斑不再撑出横向滚动 */
body { overflow-x: clip; }
@media (max-width: 760px) {
  .xp-panel .img::before, .svc .img::before, .svc:nth-child(even) .img::before { inset: -5% -3% -6% 6%; }
}
/* 栏目页横幅插画：留出与导航的呼吸距离 */
.page-banner .art { --k: .84; margin-top: calc(-220px + var(--hd) / 2 + 8px); }
.page-banner .lead { max-width: 32em; }

/* 首页行业方案：右侧改为浅色氛围面板 + 白色毛玻璃模块 */
.sol-r { display: flex; flex-direction: column; justify-content: center; color: var(--text); background: radial-gradient(120% 90% at 100% 0%, rgba(120,175,255,.38), rgba(120,175,255,0) 60%), radial-gradient(90% 80% at 0% 100%, rgba(94,224,160,.24), rgba(94,224,160,0) 60%), #eef4ff; }
.sol-r::before { right: -60px; top: -60px; background: radial-gradient(circle, rgba(255,255,255,.9), rgba(255,255,255,0) 70%); }
.sol-r h4 { color: var(--primary); font-weight: 600; letter-spacing: .04em; }
.mods span { min-height: 68px; color: var(--text); font-weight: 500; background: linear-gradient(150deg, rgba(255,255,255,.92), rgba(255,255,255,.62)); border: 1px solid #fff; box-shadow: 0 16px 32px -20px rgba(30,86,200,.38), inset 0 1px 0 #fff; backdrop-filter: blur(12px); }
.mods span:hover { background: #fff; border-color: #fff; box-shadow: 0 20px 36px -18px rgba(30,86,200,.45); }
.sol-r .core { color: #fff; background: linear-gradient(135deg, #3b82ff, #1f5fff); border: 0; box-shadow: 0 18px 36px -16px rgba(31,95,255,.6); font-weight: 600; }
.sol-r .core small { color: rgba(255,255,255,.85); font-weight: 400; }

/* 内容占位图：浅色渐变 + 虚线框 + 图标，等待替换真实照片 */
.img:not(.art-fig):not([style]) { flex-direction: column; gap: 12px; background: linear-gradient(150deg, #f3f7ff, #eaf6f1); border: 1.5px dashed rgba(31,102,255,.28); color: #6b7a96; font-size: 13.5px; }
.img:not(.art-fig):not([style])::before { content: ""; position: static; display: block; flex: none; width: 48px; height: 48px; border-radius: 14px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Ccircle cx='9' cy='9' r='2'/%3E%3Cpath d='m21 15-3.1-3.1a2 2 0 0 0-2.8 0L6 21'/%3E%3C/svg%3E") center / 22px no-repeat, linear-gradient(135deg, #3b82ff, #1f5fff); box-shadow: 0 12px 24px -12px rgba(31,95,255,.6); }
.img:not(.art-fig):not([style])::after { content: none; }

/* 页脚：二维码与说明文字贴合 */
.footer .qr { align-content: start; align-self: start; gap: 10px; }
.footer .qr span { font-size: 13px; color: var(--text-3); }
.slide .sub, .page-banner .lead { text-wrap: balance; }

/* 页头：公司全称较长时，导航不折行；手机端品牌名可收缩 */
.nav > a, .nav > .dd > a { white-space: nowrap; }
.logo { margin-right: 12px; }
@media (max-width: 1360px) and (min-width: 961px) { .nav > a, .nav > .dd > a { padding: 0 11px; } .nav > a::after, .nav > .dd > a::after { left: 11px; right: 11px; } .hd-right { gap: 14px; } .logo-text small { letter-spacing: 0; } }
@media (max-width: 600px) { .logo { min-width: 0; flex: 0 1 auto; margin-right: 8px; } .logo-text { min-width: 0; } .logo-text b { font-size: 16px; } .logo-text small { font-size: 9px; letter-spacing: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } }
@media (max-width: 1100px) and (min-width: 961px) { .logo-text small { display: none; } .nav > a, .nav > .dd > a { padding: 0 9px; font-size: 14.5px; } .nav > a::after, .nav > .dd > a::after { left: 9px; right: 9px; } }
.logo-text b { white-space: nowrap; }
@media (max-width: 380px) { .logo-text b { font-size: 15px; } .logo-img { width: 30px; height: 30px; } }
html[lang="en"] .logo-text small { display: none; }
html[lang="en"] .logo-text b { font-size: 15.5px; }
@media (max-width: 1040px) and (min-width: 961px) { .nav > a, .nav > .dd > a { padding: 0 7px; font-size: 14px; } .nav > a::after, .nav > .dd > a::after { left: 7px; right: 7px; } .lang-sw { margin-left: 10px; } }
@media (min-width: 961px) { .header > .wrap { gap: 24px; } .nav > a, .nav > .dd > a { padding-inline: 13px; } .nav > a::after, .nav > .dd > a::after { left: 13px; right: 13px; } }
@media (max-width: 1360px) and (min-width: 961px) { .nav > a, .nav > .dd > a { padding-inline: 10px; } .nav > a::after, .nav > .dd > a::after { left: 10px; right: 10px; } }
@media (max-width: 1240px) and (min-width: 961px) { .hd-tel { display: none; } }
html[lang="en"] .hd-tel { display: none; }
@media (max-width: 1200px) and (min-width: 961px) { html[lang="en"] .logo-text b { font-size: 14px; } html[lang="en"] .nav > a, html[lang="en"] .nav > .dd > a { padding-inline: 8px; font-size: 14px; } }
@media (max-width: 1100px) and (min-width: 961px) { html[lang="en"] .logo-text { display: none; } }
@media (max-width: 1000px) and (min-width: 961px) { .nav > a, .nav > .dd > a { padding-inline: 6px; } .nav > a::after, .nav > .dd > a::after { left: 6px; right: 6px; } }

/* 合作客户（文字标志） */
.clients { display: grid; grid-template-columns: repeat(3, minmax(0, 220px)); justify-content: center; gap: 20px; margin-top: 8px; }
.clients .cl { display: grid; place-items: center; height: 96px; border-radius: 14px; background: #fff; border: 1px solid var(--line); box-shadow: 0 16px 32px -24px rgba(30,86,200,.35); transition: transform .3s var(--ease), box-shadow .3s var(--ease); }
.clients .cl:hover { transform: translateY(-3px); box-shadow: 0 22px 40px -24px rgba(30,86,200,.45); }
.clients .cl b { font-size: 24px; font-weight: 600; letter-spacing: .12em; color: var(--text); }
@media (max-width: 600px) { .clients { grid-template-columns: repeat(3, 1fr); gap: 10px; } .clients .cl { height: 72px; } .clients .cl b { font-size: 18px; letter-spacing: .06em; } }
/* 关于我们：简介单栏 */
.about.about-1 { display: block; max-width: 860px; margin-inline: auto; }
.about.about-1 .text p { font-size: 16px; line-height: 1.95; }

/* 正式 Logo（2026-10-14） */
.logo img { display: block; height: 40px; width: auto; }
.footer .ft-logo { display: block; height: 36px; width: auto; margin-bottom: 14px; }
@media (max-width: 1100px) and (min-width: 961px) { .logo img { height: 34px; } }
@media (max-width: 600px) { .logo img { height: 34px; } }

/* 联系页微信卡片：悬停或点按时原位显示二维码 */
.ways > .wx-card { position: relative; overflow: hidden; cursor: pointer; outline: none; }
.wx-flip { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 12px; background: #fff; opacity: 0; transform: scale(.96); transition: opacity .25s var(--ease), transform .25s var(--ease); pointer-events: none; }
.wx-flip img { display: block; height: calc(100% - 26px); max-height: 150px; width: auto; aspect-ratio: 1; object-fit: contain; }
.wx-flip small { font-size: 12.5px; color: var(--text-2); }
.wx-card:hover .wx-flip, .wx-card:focus-within .wx-flip, .wx-card:focus .wx-flip { opacity: 1; transform: none; }
.wx-card:focus-visible { box-shadow: 0 0 0 2px var(--primary); }
.copy .beian a + a { margin-left: 16px; }

/* GEO 体验检测：横幅按钮、顶部快捷表单、体验检测板块（2026-10-14） */
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.quick-lead .hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.page-banner .banner-cta { margin-top: 26px; animation: rise .9s var(--ease) .3s both; }
.geo-quick { position: relative; z-index: 2; margin-top: -8px; padding: 0 0 8px; }
.gq-box { display: flex; align-items: center; gap: 28px; padding: 22px 28px; background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 18px 40px -24px rgba(16,40,90,.28); }
.gq-t { flex: 0 1 340px; min-width: 0; }
.gq-t b { display: block; font-size: 17px; color: var(--navy); }
.gq-t span { display: block; margin-top: 4px; font-size: 13.5px; color: var(--text-2); line-height: 1.6; }
.quick-lead { flex: 1; min-width: 0; }
.ql-row { display: flex; gap: 10px; }
.ql-f { flex: 1; min-width: 0; }
.quick-lead input:not(.hp) { width: 100%; height: 44px; font: 14px var(--font); color: var(--text); border: 1px solid #d5dbe5; border-radius: 8px; padding: 0 14px; background: #fff; transition: border-color .2s, box-shadow .2s; }
.quick-lead input:not(.hp):focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(22,100,255,.14); }
.quick-lead .btn { flex: none; height: 44px; white-space: nowrap; }
.ql-note { margin-top: 8px; font-size: 12.5px; color: var(--text-3); }
.ql-note a { color: var(--primary); }
.quick-lead .status { margin-top: 8px; font-size: 14px; }
.quick-lead .status.err { color: #e5484d; }
.quick-lead .status.ok { color: #12a150; }
.quick-lead.stacked .ql-row { flex-direction: column; }
.quick-lead.stacked .btn { width: 100%; justify-content: center; }
.trial { display: grid; grid-template-columns: 1.1fr 1fr; gap: 40px; align-items: start; }
.trial-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.trial-steps li { display: flex; gap: 18px; padding: 20px 22px; background: #fff; border: 1px solid var(--line); border-radius: 12px; }
.trial-steps .n { flex: none; width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center; font-weight: 600; color: #fff; background: var(--solid); }
.trial-steps b { display: block; font-size: 16px; color: var(--navy); }
.trial-steps p { margin-top: 4px; font-size: 14px; color: var(--text-2); line-height: 1.7; }
.trial-card { padding: 30px 28px; background: #fff; border-radius: 16px; border: 1px solid var(--line); box-shadow: 0 30px 60px -36px rgba(16,40,90,.35); }
.trial-card h3 { font-size: 22px; color: var(--navy); }
.trial-card .tc-sub { margin-top: 10px; font-size: 14px; color: var(--text-2); }
.trial-card ul { list-style: none; margin: 10px 0 22px; padding: 0; display: grid; gap: 8px; }
.trial-card li { display: flex; gap: 8px; align-items: flex-start; font-size: 14px; color: var(--text); line-height: 1.6; }
.trial-card li .ico { flex: none; width: 18px; height: 18px; margin-top: 2px; color: var(--mint, #2fc77d); }
@media (max-width: 960px) {
  .gq-box { flex-direction: column; align-items: stretch; gap: 16px; padding: 20px; }
  .gq-t { flex: none; }
  .trial { grid-template-columns: 1fr; gap: 24px; }
}
@media (max-width: 600px) {
  .geo-quick { margin-top: 0; padding-top: 16px; }
  .ql-row { flex-direction: column; }
  .quick-lead .btn { width: 100%; justify-content: center; }
}

/* 最小留言弹窗与底部通栏（2026-10-14） */
.lead-dlg { width: min(440px, calc(100vw - 32px)); padding: 32px 28px 26px; border: 0; border-radius: 16px; box-shadow: 0 40px 80px -30px rgba(10,30,80,.45); color: var(--text); }
.lead-dlg::backdrop { background: rgba(12,20,38,.45); backdrop-filter: blur(2px); }
.lead-dlg[open] { animation: rise .35s var(--ease) both; }
.lead-dlg > b { display: block; font-size: 21px; color: var(--navy); }
.lead-dlg .ld-sub { margin: 8px 0 18px; font-size: 14px; color: var(--text-2); line-height: 1.7; }
.lead-dlg .x { position: absolute; top: 10px; right: 12px; width: 34px; height: 34px; border: 0; background: none; font-size: 24px; line-height: 1; color: var(--text-3); cursor: pointer; border-radius: 8px; }
.lead-dlg .x:hover { background: #f1f4f9; color: var(--text); }
.lead-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 45; background: rgba(255,255,255,.96); backdrop-filter: blur(10px); border-top: 1px solid var(--line); box-shadow: 0 -12px 30px -18px rgba(16,40,90,.3); }
.lead-bar[hidden] { display: none; }
.lead-bar .wrap { display: flex; align-items: center; gap: 24px; padding-top: 12px; padding-bottom: 12px; padding-right: 56px; position: relative; }
.lb-t { display: flex; align-items: center; gap: 10px; flex: none; }
.lb-t .ico { width: 34px; height: 34px; padding: 8px; border-radius: 10px; color: #fff; background: var(--solid); }
.lb-t b { font-size: 16px; color: var(--navy); white-space: nowrap; }
.lb-t span { font-size: 13.5px; color: var(--text-2); white-space: nowrap; }
.lead-bar .quick-lead { flex: 1; max-width: 520px; margin-left: auto; position: relative; }
.lead-bar .ql-note { display: none; }
.lead-bar .status { position: absolute; left: 0; bottom: 100%; margin: 0 0 6px; padding: 6px 12px; background: #fff; border-radius: 8px; box-shadow: var(--shadow-sm); white-space: nowrap; }
.lb-x { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); width: 32px; height: 32px; border: 0; background: none; font-size: 22px; color: var(--text-3); cursor: pointer; border-radius: 8px; }
.lb-x:hover { background: #f1f4f9; color: var(--text); }
html.has-lbar body { padding-bottom: 70px; }
html.has-lbar .float-bar { bottom: 96px; }
@media (max-width: 1200px) { .lb-t span { display: none; } }
@media (max-width: 960px) { .lead-bar { display: none !important; } html.has-lbar body { padding-bottom: 0; } }
.page-banner .banner-cta { display: flex; flex-wrap: wrap; gap: 12px; }
@media (max-width: 1500px) { html[lang="en"] .lb-t span { display: none; } }

/* 留言弹窗：左侧留联系方式，右侧微信二维码与电话（2026-10-14） */
.lead-dlg { width: min(640px, calc(100vw - 32px)); padding: 0; display: none; overflow: hidden; }
.lead-dlg[open] { display: grid; grid-template-columns: 1fr 200px; }
.ld-main { padding: 32px 28px 26px; }
.lead-dlg .ld-main > b { display: block; font-size: 21px; color: var(--navy); padding-right: 24px; }
.ld-side { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 32px 18px 26px; background: linear-gradient(180deg, #f3f7fd, #eef6f2); border-left: 1px solid var(--line); text-align: center; }
.ld-side-t { font-size: 13px; color: var(--text-2); margin-bottom: 4px; }
.lead-dlg .ld-qr { width: 132px; height: 132px; border: 1px solid var(--line); border-radius: 10px; padding: 6px; background: #fff; }
.ld-qr-t { font-size: 12.5px; color: var(--text-3); }
.ld-tel { margin-top: 10px; display: flex; align-items: center; gap: 8px; color: var(--navy); text-decoration: none; }
.ld-tel .ico { flex: none; width: 34px; height: 34px; padding: 8px; border-radius: 50%; color: #fff; background: var(--solid); }
.ld-tel span { display: grid; text-align: left; font-size: 15px; font-weight: 600; letter-spacing: .01em; }
.ld-tel small { font-size: 11.5px; font-weight: 400; color: var(--text-3); }
.ld-tel:hover span { color: var(--primary); }
@media (max-width: 600px) {
  .lead-dlg[open] { grid-template-columns: 1fr; }
  .ld-main { padding: 28px 22px 18px; }
  .ld-side { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 14px; row-gap: 2px; align-items: center; justify-items: start; padding: 16px 22px 20px; border-left: 0; border-top: 1px solid var(--line); text-align: left; }
  .ld-side-t { grid-column: 1 / -1; margin-bottom: 8px; }
  .lead-dlg .ld-qr { width: 84px; height: 84px; padding: 4px; grid-row: 2 / 4; }
  .ld-qr-t { grid-column: 2; align-self: end; }
  .ld-qr-t::after { content: "（长按识别）"; }
  html[lang="en"] .ld-qr-t::after { content: " (long-press)"; }
  .ld-tel { grid-column: 2; margin-top: 6px; align-self: start; }
}
.lead-dlg > form[method="dialog"] { position: absolute; top: 0; right: 0; z-index: 2; }