﻿
/* ==================================================
   设计原则：干净 · 清晰 · 现代
   1) 全站无衬线字体（Windows 下宋体渲染发虚，弃用）
   2) 深藏青 + 商务蓝，呼应源页面配色
   3) 统一居中标题层级，白卡片 + 柔和阴影
   4) 正文文案与源页面完全一致，未做任何改写
   ================================================== */
* { margin:0; padding:0; box-sizing:border-box; }
:root {
  --navy:#0A2540;
  --navy-deep:#061B30;
  --blue:#1D6FE0;
  --blue-dark:#124BA0;
  --blue-bg:#EFF5FF;
  --alt:#EFF3F9;
  --text:#1B2A40;
  --muted:#47566C;
  --line:#D9E2EE;
  --radius:14px;
  --shadow:0 10px 34px rgba(10,37,64,.08);
  --shadow-lg:0 22px 54px rgba(10,37,64,.13);
  --sec-pad:80px;
  --container:1320px;   /* 适度加宽后的内容宽度 */
  --gutter:32px;        /* 左右安全边距，随屏幕自适应 */
}
html { scroll-behavior:smooth; font-size:16px; scroll-padding-top:90px; overflow-x:hidden; }
body {
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Segoe UI",sans-serif;
  color:var(--text); background:#fff; line-height:1.85;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
.container { max-width:var(--container); margin:0 auto; padding:0 var(--gutter); }
/* 窄屏时容器不超宽，避免横向滚动 */
@supports (width: min(1px, 100%)) {
  .container { max-width:min(var(--container), 100%); }
}
section { padding:var(--sec-pad) 0; }
b { color:var(--navy); font-weight:700; }
h1, h2, h3 { text-wrap:balance; }

/* ---------- 统一区块标题（居中，全站一致） ---------- */
.sec-head { text-align:center; max-width:820px; margin:0 auto 46px; }
.sec-head .eyebrow {
  display:inline-block; color:var(--blue); background:var(--blue-bg);
  font-size:1.3rem; font-weight:800; letter-spacing:6px;
  padding:13px 38px; border-radius:999px; margin-bottom:26px;
}
.sec-head h2 { font-size:clamp(1.9rem,3.4vw,2.6rem); font-weight:800; color:var(--navy);
  line-height:1.45; letter-spacing:.5px; }
.sec-head .sub { color:var(--muted); font-size:1.05rem; margin-top:16px; }

/* ---------- 深色板块通用（背景衬托文字：深底 + 亮字） ---------- */
.dark-sec { background:linear-gradient(160deg,#081B31 0%,#0C2440 55%,#123252 100%); color:rgba(255,255,255,.9); position:relative; overflow:hidden; }
.dark-sec::before { content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(760px 380px at 50% -8%, rgba(127,181,245,.14), transparent 68%); }
.dark-sec .container { position:relative; z-index:1; }
.dark-sec .sec-head h2 { color:#fff; text-shadow:0 0 30px rgba(127,181,245,.25); }
.dark-sec .sec-head .sub { color:rgba(255,255,255,.72); }
.dark-sec .sec-head .eyebrow { color:#BFE0FF; background:rgba(127,181,245,.14);
  border:1px solid rgba(127,181,245,.35); }
.dark-sec .sec-head::before { background:radial-gradient(closest-side, rgba(127,181,245,.17), transparent 72%); }
.dark-sec .grad { background:linear-gradient(92deg,#7FB5F5 15%,#C4DEFC 85%);
  -webkit-background-clip:text; background-clip:text; }
.dark-sec b { color:#fff; }
.dark-sec .reveal { transform:translateY(28px); }

/* ---------- 动画 ---------- */
.reveal { opacity:0; transform:translateY(28px);
  transition:opacity .8s cubic-bezier(.2,.6,.2,1), transform .8s cubic-bezier(.2,.6,.2,1); }
.reveal.in { opacity:1; transform:none; }

/* ---------- 导航 ---------- */
nav { position:fixed; top:0; width:100%; z-index:100; transition:background .35s, box-shadow .35s; }
nav.scrolled { background:rgba(6,27,48,.96); backdrop-filter:blur(12px); box-shadow:0 4px 20px rgba(0,0,0,.25); }
.nav-inner { max-width:var(--container); margin:0 auto; padding:0 var(--gutter); height:72px;
  display:flex; justify-content:space-between; align-items:center; }
.logo { display:flex; align-items:center; gap:12px; color:#fff; font-weight:800; font-size:1.1rem; letter-spacing:2px; }
.logo-mark { width:38px; height:38px; border-radius:9px; flex-shrink:0;
  background:linear-gradient(135deg,#1D6FE0,#6FB0F2);
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-size:.58rem; font-weight:800; letter-spacing:1px;
  box-shadow:0 4px 14px rgba(29,111,224,.45); }
/* 导航栏 LOGO 图片（后台「站点设置」上传后显示） */
.logo-img { height:36px; width:auto; max-width:160px; object-fit:contain; display:block; flex-shrink:0; }
/* 上传 LOGO 图片后隐藏文字标识（[hidden] 需显式覆盖类样式） */
.logo-mark[hidden] { display:none; }
.nav-links { display:flex; gap:36px; list-style:none; align-items:center; }
.nav-links a { color:rgba(255,255,255,.88); text-decoration:none; font-size:.92rem; font-weight:700;
  padding:7px 16px; margin:0 -16px; border-radius:999px; border:1px solid transparent;
  transition:color .25s, background .25s, border-color .25s, box-shadow .25s; white-space:nowrap; }
.nav-links a:hover { color:#7FB5F5; }
.nav-cta { background:var(--blue); color:#fff !important; padding:9px 24px;
  border-radius:999px; font-weight:600; transition:background .2s, transform .2s !important; }
.nav-cta:hover { background:#2E7EEF; transform:translateY(-1px); }
@media(max-width:900px){ .nav-links li:not(:last-child){display:none;} }

/* ---------- Hero ---------- */
.hero { min-height:100vh; display:flex; align-items:center; position:relative; color:#fff;
  background:linear-gradient(150deg,#061B30 0%,#0A2540 55%,#0E3358 100%);
  padding:150px 0 84px; overflow:hidden; }
.hero::before, .hero::after { content:""; position:absolute; border-radius:50%; filter:blur(90px); }
.hero::before { width:560px; height:560px; right:-140px; top:-160px; background:rgba(29,111,224,.28); }
.hero::after { width:440px; height:440px; left:-120px; bottom:-160px; background:rgba(29,111,224,.16); }
.hero-inner { position:relative; z-index:2; text-align:center; width:100%; }
.hero-badge { display:inline-flex; align-items:center; gap:10px; color:#9CC6F8;
  background:rgba(29,111,224,.14); border:1px solid rgba(127,181,245,.35);
  font-size:.88rem; font-weight:500; letter-spacing:2px; padding:9px 24px;
  border-radius:999px; margin-bottom:34px; }
.hero h1 { font-size:clamp(2.1rem,4.6vw,3.3rem); font-weight:800; line-height:1.4; letter-spacing:2px; }
.hero h1 .accent {
  background:linear-gradient(92deg,#7FB5F5 10%,#C4DEFC 90%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 0 20px rgba(127,181,245,.4));
}
.hero-slogan { margin:22px 0 24px; font-size:clamp(1.05rem,2vw,1.3rem); font-weight:600;
  color:#CFE4FB; letter-spacing:4px; }
.hero-desc { max-width:720px; margin:0 auto; color:rgba(255,255,255,.78); font-size:1rem; line-height:2.1; }
.hero-desc b { color:#fff; }
.hero-btns { display:flex; gap:18px; justify-content:center; margin-top:46px; flex-wrap:wrap; }
.btn { display:inline-block; padding:15px 44px; border-radius:999px; text-decoration:none;
  font-weight:600; font-size:1rem; letter-spacing:1px; transition:all .25s; }
.btn-primary { background:var(--blue); color:#fff; box-shadow:0 10px 30px rgba(29,111,224,.4); }
.btn-primary:hover { background:#2E7EEF; transform:translateY(-2px); }
.btn-ghost { border:1px solid rgba(255,255,255,.4); color:#fff; }
.btn-ghost:hover { border-color:#7FB5F5; color:#7FB5F5; transform:translateY(-2px); }
.hero-stats { display:flex; justify-content:center; gap:0; margin-top:70px; flex-wrap:wrap; }
.stat { padding:0 44px; text-align:center; border-left:1px solid rgba(255,255,255,.18); }
.stat:first-child { border-left:none; }
.stat b { display:block; font-size:1.6rem; font-weight:800; color:#7FB5F5; letter-spacing:1px; }
.stat span { font-size:.84rem; color:rgba(255,255,255,.66); letter-spacing:1px; }
@media(max-width:760px){ .stat{padding:0 20px; margin-bottom:14px;} }

/* ---------- 痛点：深色板块 ---------- */
.pain { padding-top:110px; }
.dark-sec.pain::before { display:none; }
.pain-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.pain-card { background:rgba(255,255,255,.055); border:1px solid rgba(255,255,255,.15);
  border-radius:var(--radius); padding:40px 34px; transition:transform .3s, background .3s, border-color .3s; }
.pain-card:hover { transform:translateY(-6px); background:rgba(255,255,255,.09);
  border-color:rgba(127,181,245,.45); }
.pain-icon { width:56px; height:56px; border-radius:14px; background:rgba(127,181,245,.14);
  border:1px solid rgba(127,181,245,.3); flex-shrink:0;
  display:flex; align-items:center; justify-content:center; }
.pain-icon svg { width:27px; height:27px; stroke:#9CC6F8; stroke-width:2; fill:none;
  stroke-linecap:round; stroke-linejoin:round; }
.pain-head { display:flex; align-items:center; gap:18px; margin-bottom:10px; }
.pain-card h3 { font-size:1.42rem; font-weight:800; color:#fff; line-height:1.25; letter-spacing:1px; }
.pain-sub { font-size:1.02rem; font-weight:700; color:#9CC6F8; margin:0; letter-spacing:.5px; }
.pain-card .rule { width:40px; height:3px; background:linear-gradient(90deg,#1D6FE0,#6FB0F2); border-radius:2px; margin:18px 0 20px; }
.pain-card ul { list-style:none; }
.pain-card li { color:rgba(255,255,255,.82); font-size:.94rem; line-height:1.85; padding:10px 0 10px 22px;
  position:relative; }
.pain-card li::before { content:""; position:absolute; left:0; top:21px; width:7px; height:7px;
  border-radius:50%; background:#6FB0F2; opacity:.75; }
.pain-foot { text-align:center; margin-top:48px; font-size:1rem; color:rgba(255,255,255,.8); }
.pain-foot b { color:#9CC6F8; }
@media(max-width:960px){ .pain-grid{grid-template-columns:1fr;} }

/* ---------- 客户 ---------- */
.focus { background:var(--alt); }
.focus-grid { display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.focus-card { border-radius:var(--radius); padding:46px 42px; color:#fff; overflow:hidden;
  position:relative; box-shadow:var(--shadow-lg); }
.focus-card.f1 { background:linear-gradient(160deg,#0A2540,#12406E); }
.focus-card.f2 { background:linear-gradient(160deg,#0E3A33,#17655A); }
.focus-card .head { display:flex; align-items:center; gap:16px; margin-bottom:10px; }
.focus-card .num { display:inline-flex; align-items:baseline; gap:7px; flex-shrink:0;
  color:#fff; background:linear-gradient(135deg,#124BA0,#1D6FE0); border:none;
  padding:8px 16px; border-radius:9px; box-shadow:0 6px 16px rgba(29,111,224,.35); }
.focus-card .num em { font-style:normal; font-size:.68rem; font-weight:600; letter-spacing:2.5px; opacity:.78; }
.focus-card .num b { color:#fff; font-weight:800; font-size:.95rem; letter-spacing:1px; }
.focus-card.f2 .num { background:linear-gradient(135deg,#0B6B50,#0E8C6A); box-shadow:0 6px 16px rgba(14,140,106,.35); }
.focus-card h3 { font-size:1.34rem; font-weight:800; margin-bottom:0; line-height:1.4; }
.focus-card .sub { font-size:.92rem; color:rgba(255,255,255,.7); margin-bottom:24px; }
.focus-card ul { list-style:none; }
.focus-card li { font-size:.93rem; color:rgba(255,255,255,.88); line-height:1.9;
  padding:12px 0 12px 26px; border-bottom:1px solid rgba(255,255,255,.12); position:relative; }
.focus-card li:last-child { border-bottom:none; }
.focus-card.f1 li::before { content:"✓"; position:absolute; left:0; color:#7FB5F5; font-weight:800; }
.focus-card.f2 li::before { content:"✓"; position:absolute; left:0; color:#A8E3D2; font-weight:800; }
@media(max-width:960px){ .focus-grid{grid-template-columns:1fr;} }

/* ---------- 核心定位 ---------- */
.position { background:linear-gradient(150deg,#061B30,#0E3358); color:#fff; text-align:center; }
.position .eyebrow { color:#9CC6F8; font-size:1.05rem; font-weight:700; letter-spacing:5px; margin-bottom:26px; }
.position h2 { font-size:clamp(1.45rem,2.8vw,2.05rem); font-weight:800; line-height:1.9; max-width:860px; margin:0 auto; }
.position h2 em { font-style:normal; color:#7FB5F5; }
.position > .container > p { max-width:740px; margin:28px auto 0; color:rgba(255,255,255,.78);
  font-size:1rem; line-height:2.05; }
.position .steps { display:flex; justify-content:center; align-items:stretch; gap:18px; margin-top:56px; flex-wrap:wrap; }
.step { background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.16);
  border-radius:var(--radius); padding:28px 36px; min-width:220px; }
.step b { display:block; color:#7FB5F5; font-size:1.1rem; font-weight:800; margin-bottom:6px; }
.step span { font-size:.88rem; color:rgba(255,255,255,.68); }
.step-arrow { display:flex; align-items:center; color:rgba(255,255,255,.4); font-size:1.3rem; }

/* ---------- 三大服务 ---------- */
.svc { background:linear-gradient(180deg,#EEF4FB 0%,#FFFFFF 400px); }
.svc-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.svc-card { background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  overflow:hidden; display:flex; flex-direction:column; box-shadow:var(--shadow);
  transition:transform .3s, box-shadow .3s, border-color .3s; }
.svc-card:hover { transform:translateY(-6px); box-shadow:var(--shadow-lg); border-color:rgba(29,111,224,.5); }
.svc-top { padding:32px 34px 26px; position:relative; }
.svc-top::before { content:""; position:absolute; top:0; left:0; right:0; height:4px; }
.svc-card:nth-child(1) .svc-top { background:linear-gradient(180deg,#EFF5FF 0%,rgba(239,245,255,0) 100%); }
.svc-card:nth-child(2) .svc-top { background:linear-gradient(180deg,#E9F7F1 0%,rgba(233,247,241,0) 100%); }
.svc-card:nth-child(3) .svc-top { background:linear-gradient(180deg,#FBF4E4 0%,rgba(251,244,228,0) 100%); }
.svc-card:nth-child(1) .svc-top::before { background:linear-gradient(90deg,#1D6FE0,#6FB0F2); }
.svc-card:nth-child(2) .svc-top::before { background:linear-gradient(90deg,#0E8C6A,#5BC7A6); }
.svc-card:nth-child(3) .svc-top::before { background:linear-gradient(90deg,#B07E1E,#E0B45C); }
.svc-head { display:flex; align-items:center; gap:16px; }
.svc-no { font-family:Georgia,serif; font-size:2.5rem; font-weight:700; color:var(--line); line-height:1; }
.svc-tag { display:inline-block; font-size:.78rem; font-weight:700;
  letter-spacing:2px; color:var(--blue); background:var(--blue-bg); padding:5px 14px; border-radius:999px; }
.svc-card:nth-child(2) .svc-tag { color:#0E8C6A; background:#E9F7F1; }
.svc-card:nth-child(3) .svc-tag { color:#9A6F1B; background:#FBF4E4; }
.svc-card h3 { font-size:1.26rem; font-weight:800; color:var(--navy); margin:16px 0 0; }
.svc-card .desc { padding:14px 34px 30px; color:var(--muted); font-size:.94rem; line-height:1.95; flex:1; }
.svc-deliv { padding:22px 34px 26px; background:var(--alt); border-top:1px solid var(--line); }
.svc-deliv .d-title { font-size:.78rem; font-weight:800; letter-spacing:3px; color:var(--navy); margin-bottom:10px; }
.svc-deliv .d-item { display:inline-block; font-size:.86rem; font-weight:600; color:var(--blue-dark);
  background:#fff; border:1px solid var(--line); border-radius:999px; padding:6px 16px; margin:4px 8px 4px 0; }
@media(max-width:960px){ .svc-grid{grid-template-columns:1fr;} }

/* ---------- 专家团队：深色板块 ---------- */
.team .sec-head { margin-bottom:28px; }
.team-intro { max-width:780px; margin:0 auto 38px; text-align:center; color:rgba(255,255,255,.82);
  font-size:1.04rem; line-height:2.1; }
.team-intro b { color:#fff; }
.team-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.team-card { background:rgba(255,255,255,.055); border:1px solid rgba(255,255,255,.15);
  border-radius:var(--radius); padding:38px 32px; transition:transform .3s, background .3s, border-color .3s; }
.team-card:hover { transform:translateY(-6px); background:rgba(255,255,255,.09);
  border-color:rgba(127,181,245,.45); }
.team-card .icon { width:52px; height:52px; border-radius:13px; background:rgba(127,181,245,.14);
  border:1px solid rgba(127,181,245,.3); flex-shrink:0; display:flex; align-items:center; justify-content:center; }
.team-card .icon svg { width:25px; height:25px; stroke:#9CC6F8; stroke-width:2; fill:none;
  stroke-linecap:round; stroke-linejoin:round; }
.team-head { display:flex; align-items:center; gap:15px; margin-bottom:12px; }
.team-card h3 { font-size:1.24rem; font-weight:800; color:#fff; margin-bottom:0; letter-spacing:.5px; }
.team-card p { color:rgba(255,255,255,.8); font-size:.94rem; }
@media(max-width:960px){ .team-grid{grid-template-columns:1fr;} }

/* ---------- 服务模式（弹性分阶） ---------- */
.model { background:linear-gradient(180deg,#EEF4FB 0%,#FFFFFF 400px); }
.model-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; position:relative; }
.model-card { background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:38px 34px; position:relative; overflow:hidden; box-shadow:var(--shadow);
  transition:transform .3s, box-shadow .3s, border-color .3s; }
.model-card::before { content:""; position:absolute; top:0; left:0; right:0; height:4px;
  background:linear-gradient(90deg,#0A2540 10%,#1D6FE0 90%); }
.model-card:hover { transform:translateY(-6px); box-shadow:var(--shadow-lg); border-color:rgba(29,111,224,.5); }
.model-head { display:flex; align-items:center; gap:16px; margin-bottom:14px; }
.model-card .no { display:inline-flex; align-items:center; justify-content:center; flex-shrink:0;
  width:54px; height:54px; border-radius:50%; background:linear-gradient(135deg,#0A2540 15%,#1D6FE0 135%);
  color:#fff; font-weight:800; font-size:1.15rem;
  box-shadow:0 8px 20px rgba(10,37,64,.28); }
.model-card h3 { font-size:1.15rem; font-weight:800; color:var(--navy); margin:0; line-height:1.4; letter-spacing:0; }
.model-card h3 .opt { display:inline-block; margin-left:8px; font-size:.72rem; font-weight:700;
  letter-spacing:2px; color:var(--blue); background:var(--blue-bg); border:1px solid rgba(29,111,224,.3);
  padding:2px 10px; border-radius:999px; vertical-align:2px; }
.model-card p { color:var(--muted); font-size:.94rem; }
@media(max-width:960px){ .model-grid{grid-template-columns:1fr;} }

/* ---------- 差异化优势 ---------- */
.moat { background:var(--alt); }
.moat-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:28px; }
.moat-card { background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:38px 36px; box-shadow:var(--shadow); transition:transform .3s, box-shadow .3s; }
.moat-card:hover { transform:translateY(-6px); box-shadow:var(--shadow-lg); }
.moat-card .head { display:flex; align-items:center; gap:16px; margin-bottom:14px; }
.moat-card .no { flex-shrink:0; width:44px; height:44px; border-radius:12px; background:var(--navy);
  color:#7FB5F5; font-family:Georgia,serif; font-weight:700; font-size:1.05rem;
  display:flex; align-items:center; justify-content:center; }
.moat-card h3 { font-size:1.2rem; font-weight:800; color:var(--navy); }
.moat-card p { color:var(--muted); font-size:.94rem; }
@media(max-width:960px){ .moat-grid{grid-template-columns:1fr;} }

/* ---------- CTA ---------- */
.cta { background:linear-gradient(150deg,#061B30,#0E3358); text-align:center; color:#fff;
  position:relative; overflow:hidden; }
.cta::before { content:""; position:absolute; width:500px; height:500px; border-radius:50%;
  left:50%; bottom:-300px; transform:translateX(-50%); background:rgba(29,111,224,.2); filter:blur(80px); }
.cta .container { position:relative; z-index:2; }
.cta h2 { font-size:clamp(1.7rem,3.2vw,2.4rem); font-weight:800; letter-spacing:1px; }
.cta .slogan { color:#9CC6F8; letter-spacing:4px; font-size:1rem; font-weight:600; margin:18px 0 40px; }

/* ---------- 文字抓睛系统 ---------- */
/* 标题关键词：蓝色渐变文字 */
.grad {
  background:linear-gradient(92deg,#0F4FB8 15%,#1D6FE0 85%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
/* 区块标题背后的柔光晕：背景衬托标题 */
.sec-head { position:relative; }
.sec-head::before {
  content:""; position:absolute; left:50%; top:-46px; transform:translateX(-50%);
  width:520px; height:230px; border-radius:50%; z-index:0; pointer-events:none;
  background:radial-gradient(closest-side, rgba(29,111,224,.12), transparent 72%);
}
.sec-head > * { position:relative; z-index:1; }
/* 正文关键词：荧光笔衬底，扫读视线落点 */
.svc b, .model b, .moat b {
  background:linear-gradient(180deg, transparent 64%, rgba(29,111,224,.16) 64%);
  padding:0 2px;
}
/* 深色区关键词辉光 */
.position h2 em { text-shadow:0 0 26px rgba(127,181,245,.55); }
.cta h2 { text-shadow:0 0 28px rgba(127,181,245,.4); }
.focus-card h3 { text-shadow:0 0 22px rgba(255,255,255,.28); }
.hero-slogan { text-shadow:0 0 22px rgba(127,181,245,.35); }

/* ---------- 合作客户 ---------- */
.clients { background:linear-gradient(180deg,#EEF4FB 0%,#FFFFFF 400px); }
.logo-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.logo-tile {
  height:100px; background:#fff; border:1px solid var(--line); border-radius:12px;
  display:flex; align-items:center; justify-content:center; gap:10px;
  color:#9AA9BC; font-weight:700; font-size:.95rem; letter-spacing:1px;
  filter:grayscale(1); opacity:.62; transition:all .3s;
}
.logo-tile:hover { filter:none; opacity:1; color:var(--navy);
  border-color:rgba(29,111,224,.45); box-shadow:var(--shadow); transform:translateY(-4px); }
.logo-tile .mark { width:20px; height:20px; border-radius:5px; flex-shrink:0;
  background:linear-gradient(135deg,#C9D6E5,#8FA6BF); transform:rotate(45deg); }
.logo-note { text-align:center; margin-top:34px; color:#9AA9BC; font-size:.85rem; letter-spacing:1px; }
@media(max-width:960px){ .logo-grid{grid-template-columns:1fr 1fr;} }

/* ---------- 动态交互组件 ---------- */
#progress { position:fixed; top:0; left:0; height:3px; width:0; z-index:200;
  background:linear-gradient(90deg,#1D6FE0,#6FB0F2); transition:width .1s linear; }
/* 导航联动高亮：滚动到对应区块时，背景胶囊 + 描边 + 文字同步变化 */
.nav-links a.active {
  color:#fff !important;
  background:linear-gradient(135deg, rgba(29,111,224,.55), rgba(111,176,242,.38));
  border-color:rgba(127,181,245,.75);
  box-shadow:0 6px 18px rgba(29,111,224,.35);
  font-weight:800;
}
.nav-links a.active::after {
  content:''; position:absolute; left:50%; transform:translateX(-50%); bottom:2px;
  width:6px; height:6px; border-radius:50%; background:#7FB5F5;
}
.nav-links a { position:relative; }
/* 「预约沟通」按钮保持实心胶囊样式 */
.nav-links a.nav-cta.active {
  background:var(--blue); border-color:transparent; box-shadow:0 8px 22px rgba(29,111,224,.45);
}
#toTop { position:fixed; right:28px; bottom:32px; width:48px; height:48px; border-radius:50%;
  background:var(--navy); color:#fff; border:none; font-size:1.1rem; cursor:pointer;
  opacity:0; pointer-events:none; transform:translateY(14px); transition:all .3s;
  box-shadow:0 10px 26px rgba(10,37,64,.35); z-index:150; }
#toTop.show { opacity:1; pointer-events:auto; transform:none; }
#toTop:hover { background:var(--blue); }

/* 卡片聚光灯：光斑跟随鼠标 */
.spot { position:relative; overflow:hidden; }
.spot::after { content:""; position:absolute; inset:0; opacity:0; transition:opacity .4s;
  background:radial-gradient(340px circle at var(--mx,50%) var(--my,50%), rgba(29,111,224,.09), transparent 55%);
  pointer-events:none; border-radius:inherit; }
.spot:hover::after { opacity:1; }

/* 网格卡片入场节奏（配合 reveal） */
.d1 { transition-delay:.08s; }
.d2 { transition-delay:.16s; }
.d3 { transition-delay:.24s; }
.d4 { transition-delay:.32s; }

/* Hero 入场动画 */
.hero-inner > * { animation:heroIn .9s cubic-bezier(.2,.6,.2,1) both; }
.hero-inner > :nth-child(1) { animation-delay:.05s; }
.hero-inner > :nth-child(2) { animation-delay:.15s; }
.hero-inner > :nth-child(3) { animation-delay:.25s; }
.hero-inner > :nth-child(4) { animation-delay:.35s; }
.hero-inner > :nth-child(5) { animation-delay:.45s; }
.hero-inner > :nth-child(6) { animation-delay:.6s; }
@keyframes heroIn { from { opacity:0; transform:translateY(28px); } to { opacity:1; transform:none; } }

/* ---------- 客户服务 ---------- */
.service { background:var(--alt); }
.svc-flow { display:grid; grid-template-columns:repeat(4,1fr); gap:26px; margin-bottom:36px; }
.flow-card { background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:34px 28px; text-align:center; box-shadow:var(--shadow);
  transition:transform .3s, box-shadow .3s; }
.flow-card:hover { transform:translateY(-6px); box-shadow:var(--shadow-lg); }
.flow-card .step-no { width:50px; height:50px; margin:0 auto 16px; border-radius:50%;
  background:linear-gradient(135deg,#1D6FE0,#6FB0F2); color:#fff; font-weight:800; font-size:1.05rem;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 20px rgba(29,111,224,.32); }
.flow-card:hover { border-color:rgba(29,111,224,.45); }
@media(min-width:961px){
  .svc-flow { position:relative; }
  /* 流程步骤之间的虚线连接 */
  .svc-flow::before { content:""; position:absolute; top:59px; left:13%; right:13%; height:2px;
    background:repeating-linear-gradient(90deg,#C3D2E4 0 8px,transparent 8px 17px); }
  .flow-card { position:relative; z-index:1; }
  .flow-arrow { display:none; }
}
.flow-card h3 { font-size:1.1rem; font-weight:800; color:var(--navy); margin-bottom:8px; }
.flow-card p { color:var(--muted); font-size:.9rem; }
.flow-arrow { color:#B9C6D6; font-size:1.2rem; align-items:center; justify-content:center; }
@media(max-width:960px){
  .svc-flow { grid-template-columns:1fr; }
  .flow-arrow { display:none; }
}

/* ---------- Footer（含联系通道） ---------- */
footer { background:#040F1C; padding:46px 0 30px; }
.foot-contact { display:grid; grid-template-columns:repeat(3,1fr); gap:24px;
  padding-bottom:32px; border-bottom:1px solid rgba(255,255,255,.1); }
.fc-item { display:flex; align-items:center; gap:14px; justify-content:center; }
.fc-qr { width:66px; height:66px; flex-shrink:0; border-radius:8px; background:rgba(255,255,255,.95);
  border:1px dashed rgba(29,111,224,.55); display:flex; align-items:center; justify-content:center;
  color:var(--blue); font-size:.68rem; font-weight:800; letter-spacing:1px; }
.fc-icon { width:42px; height:42px; flex-shrink:0; border-radius:50%;
  background:linear-gradient(135deg,#1D6FE0,#6FB0F2);
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 16px rgba(29,111,224,.35); }
.fc-icon svg { width:18px; height:18px; stroke:#fff; stroke-width:2; fill:none;
  stroke-linecap:round; stroke-linejoin:round; }
.fc-label { display:block; font-size:.76rem; letter-spacing:2px; color:#8FB8E8; font-weight:600; }
.fc-value { display:block; color:#fff; font-size:1rem; font-weight:800; margin-top:2px; }
.fc-note { display:block; color:rgba(255,255,255,.4); font-size:.72rem; margin-top:2px; }
footer .copy { color:rgba(255,255,255,.5); font-size:.85rem; letter-spacing:1px; text-align:center; margin-top:24px; }
@media(max-width:960px){
  .foot-contact { grid-template-columns:1fr 1fr; }
  .fc-item { justify-content:flex-start; }
}
@media(max-width:620px){
  .foot-contact { grid-template-columns:1fr; }
}

/* ---------- 预约弹窗 ---------- */
.modal { position:fixed; inset:0; z-index:1200; display:flex; align-items:center; justify-content:center; padding:24px; }
.modal[hidden] { display:none; }
.modal-mask { position:absolute; inset:0; background:rgba(6,20,38,.62); backdrop-filter:blur(4px); animation:fadeIn .22s ease; }
.modal-box {
  position:relative; z-index:1; width:100%; max-width:520px; max-height:88vh; overflow-y:auto;
  background:#fff; border-radius:18px; padding:34px 34px 28px;
  box-shadow:0 30px 70px rgba(4,20,40,.45); animation:modalIn .26s cubic-bezier(.2,.7,.3,1);
}
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes modalIn { from { opacity:0; transform:translateY(22px) scale(.97); } to { opacity:1; transform:none; } }
.modal-box h3 { font-size:1.28rem; font-weight:800; color:var(--navy); letter-spacing:.5px; }
.modal-note { color:var(--muted); font-size:.88rem; margin:8px 0 20px; }
.modal-close {
  position:absolute; top:14px; right:16px; width:34px; height:34px; border:none; cursor:pointer;
  border-radius:50%; background:#F1F5FB; color:#5B6B85; font-size:1.3rem; line-height:1;
  transition:background .2s, color .2s;
}
.modal-close:hover { background:#E3ECF8; color:var(--navy); }
.bk-field { display:block; margin-bottom:14px; }
.bk-field span { display:block; font-size:13px; color:#40506A; font-weight:600; margin-bottom:7px; }
.bk-field i { color:var(--blue); font-style:normal; }
.bk-field input, .bk-field textarea {
  width:100%; padding:11px 14px; border:1px solid var(--line); border-radius:10px;
  font-size:14.5px; font-family:inherit; background:#FBFCFE; transition:border-color .2s, box-shadow .2s;
}
.bk-field textarea { resize:vertical; line-height:1.7; }
.bk-field input:focus, .bk-field textarea:focus {
  outline:none; border-color:var(--blue); box-shadow:0 0 0 3px rgba(29,111,224,.13); background:#fff;
}
.bk-err { color:#D93B3B; min-height:20px; font-size:13px; }
.modal-box > form > .btn-primary { width:100%; height:46px; border-radius:10px; font-size:15px; letter-spacing:2px; }
.modal-box > form > .btn-primary:disabled { opacity:.7; cursor:not-allowed; }
.modal-tip { text-align:center; font-size:12.5px; color:#8A97AB; margin-top:12px; }
.bk-success { text-align:center; padding:16px 0 6px; }
.bk-ok {
  width:62px; height:62px; margin:0 auto 16px; border-radius:50%; color:#fff; font-size:1.7rem;
  background:linear-gradient(135deg,#2FA36B,#57C98A); display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 24px rgba(47,163,107,.32);
}
.bk-success h4 { font-size:1.1rem; color:var(--navy); font-weight:800; }
.bk-success p { color:var(--muted); font-size:.9rem; margin:8px 0 20px; }
.bk-success .btn-primary { width:100%; height:44px; border-radius:10px; }
@media(max-width:620px){
  .modal { padding:14px; align-items:flex-end; }
  .modal-box { max-height:92vh; padding:26px 20px 22px; border-radius:16px; }
  .modal-box h3 { font-size:1.12rem; }
}

/* ==================================================
   统一响应式适配（加宽后的多断点）
   1440+  三/四列大屏  |  1180 平板两/三列  |  780 手机单列
   ================================================== */
@media(max-width:1400px){
  :root { --gutter:30px; --sec-pad:74px; }
  .hero h1 { letter-spacing:1.5px; }
}
@media(max-width:1180px){
  :root { --gutter:26px; }
  /* 三列网格降为两列，避免卡片被压扁 */
  .pain-grid, .svc-grid, .team-grid, .model-grid { grid-template-columns:repeat(2,1fr); }
  .svc-flow { grid-template-columns:repeat(2,1fr); }
  .logo-grid { grid-template-columns:repeat(3,1fr); }
  .foot-contact { grid-template-columns:repeat(3,1fr); }
}
@media(max-width:860px){
  :root { --gutter:20px; --sec-pad:58px; }
  html { scroll-padding-top:76px; }
  .svc-flow::before { display:none; }
  .fc-item { justify-content:flex-start; }
}
@media(max-width:780px){
  /* 手机端统一单列 */
  .pain-grid, .focus-grid, .svc-grid, .team-grid, .model-grid,
  .moat-grid, .svc-flow, .logo-grid { grid-template-columns:1fr; }
  .sec-head { margin-bottom:34px; }
  .hero-stats { gap:0; }
}
@media(max-width:620px){
  :root { --gutter:16px; --sec-pad:46px; }
  .footer .copy { font-size:.8rem; }
  .foot-contact { grid-template-columns:1fr; }
}

/* ---------- 移动端导航：横向滚动，不再只保留一个按钮 ---------- */
@media(max-width:960px){
  .nav-inner { height:64px; gap:14px; }
  .logo { font-size:.98rem; letter-spacing:1px; }
  .logo-img { height:32px; max-width:130px; }
  .nav-links {
    gap:18px; overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch;
    scrollbar-width:none; flex-wrap:nowrap; max-width:62vw;
    -webkit-mask-image:linear-gradient(90deg,#000 88%,transparent 100%);
            mask-image:linear-gradient(90deg,#000 88%,transparent 100%);
  }
  .nav-links::-webkit-scrollbar { display:none; }
  /* 覆盖早期「移动端仅保留最后一个导航项」的规则 */
  .nav-links li, .nav-links li:not(:last-child) { display:block; }
  .nav-links li { flex:0 0 auto; }
  .nav-links a { font-size:.86rem; padding:6px 12px; margin:0 -12px; white-space:nowrap; }
  .nav-cta { padding:7px 16px; }
}

