/* =====================================================================
   畅享思维 - 官网样式表  style.css  (v2 · 科技蓝亮色主题)
   ---------------------------------------------------------------------
   设计令牌统一在 :root；改色只需改这里，全站生效。
   ===================================================================== */

:root {
  /* 背景（亮色） */
  --bg:        #eaf1fb;     /* 页面底色 */
  --bg-soft:   #f4f8ff;     /* 次级区块 */
  --bg-card:   #ffffff;     /* 卡片 */
  --nav-bg:    rgba(255,255,255,0.82);

  /* 文字 */
  --ink:       #0b1a3a;     /* 标题 */
  --ink-2:     #243656;     /* 正文 */
  --muted:     #5d6f92;     /* 次要 */
  --dim:       #8a99b8;     /* 更弱 */

  /* 描边 */
  --line:      #dde8fb;
  --line-2:    #c7d8f5;

  /* 品牌色 - 科技蓝 */
  --primary:   #0a6cff;
  --primary-d: #0856d8;
  --cyan:      #00b4ff;
  --purple:    #6d5cff;
  --teal:      #00b8c4;

  /* 渐变 */
  --grad:      linear-gradient(135deg, #0a6cff 0%, #00b4ff 100%);
  --grad-2:    linear-gradient(135deg, #0a6cff 0%, #6d5cff 100%);
  --grad-text: linear-gradient(120deg, #0a6cff 0%, #00a3ff 55%, #6d5cff 100%);

  /* 阴影 / 光晕 */
  --shadow-card: 0 12px 34px -16px rgba(20,55,130,0.22);
  --shadow-hover: 0 26px 54px -20px rgba(10,108,255,0.42);
  --glow: 0 10px 36px -8px rgba(10,108,255,0.5);

  --radius: 16px;
  --radius-lg: 26px;
  --nav-h: 74px;
  --container: 1200px;
  --ease: cubic-bezier(.22,1,.36,1);
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body {
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  background:var(--bg);
  color:var(--ink-2);
  line-height:1.7;
  font-size:16px;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img,svg { max-width:100%; display:block; }
a { color:inherit; text-decoration:none; transition:color .25s var(--ease); }
ul { list-style:none; }
button { font-family:inherit; cursor:pointer; border:none; background:none; }

/* 全局光斑装饰（亮色） */
body::before {
  content:""; position:fixed; top:0; right:0; bottom:0; left:0; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(620px 480px at 88% -4%, rgba(0,180,255,.18), transparent 60%),
    radial-gradient(560px 460px at -4% 12%, rgba(109,92,255,.14), transparent 58%),
    radial-gradient(700px 500px at 50% 110%, rgba(10,108,255,.10), transparent 60%);
}

/* ---------- 排版 ---------- */
h1,h2,h3,h4 { color:var(--ink); line-height:1.22; font-weight:800; letter-spacing:-.01em; }
h1 { font-size:2.6rem; font-size:clamp(2.1rem,4.6vw,3.5rem); }
h2 { font-size:2.1rem; font-size:clamp(1.7rem,3vw,2.4rem); }
h3 { font-size:1.22rem; font-weight:700; }
p { color:var(--muted); }
.gradient-text {
  color:#0a6cff;
  background:var(--grad-text); -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
}
.eyebrow {
  display:inline-flex; align-items:center; gap:8px;
  font-size:.76rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  color:var(--primary); padding:7px 15px; border-radius:100px;
  background:rgba(10,108,255,.08); border:1px solid rgba(10,108,255,.22);
}

/* ---------- 布局 ---------- */
.container { width:100%; max-width:var(--container); margin:0 auto; padding:0 24px; }
.section { padding:90px 0; padding:clamp(64px,8vw,110px) 0; position:relative; }
.section-head { max-width:720px; margin:0 auto 54px; text-align:center; }
.section-head p { margin-top:14px; font-size:1.04rem; }
/* 栅格：先给 flexbox 兜底（老浏览器），支持 grid 时升级 */
.grid { display:flex; flex-wrap:wrap; }
.grid > * { margin:12px; }
.text-center { text-align:center; }
.cols-2 > * { width:calc(50% - 24px); }
.cols-3 > * { width:calc(33.3333% - 24px); }
.cols-4 > * { width:calc(25% - 24px); }
@supports (display:grid) {
  .grid { display:grid; gap:24px; }
  .grid > * { margin:0; width:auto; }
  .cols-2 { grid-template-columns:repeat(2,1fr); }
  .cols-3 { grid-template-columns:repeat(3,1fr); }
  .cols-4 { grid-template-columns:repeat(4,1fr); }
}

/* ---------- 按钮 ---------- */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:14px 28px; border-radius:100px; font-weight:700; font-size:.98rem; white-space:nowrap;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease);
}
.btn-primary { background:var(--grad); color:#fff; box-shadow:var(--glow); }
.btn-primary:hover { transform:translateY(-3px); box-shadow:0 16px 44px -10px rgba(10,108,255,.6); }
.btn-ghost { background:#fff; color:var(--primary); border:1.5px solid var(--line-2); }
.btn-ghost:hover { transform:translateY(-3px); border-color:var(--primary); box-shadow:var(--shadow-hover); }
.btn-light { background:rgba(255,255,255,.16); color:#fff; border:1.5px solid rgba(255,255,255,.5); backdrop-filter:blur(6px); }
.btn-light:hover { background:rgba(255,255,255,.28); transform:translateY(-3px); }
.btn-sm { padding:10px 20px; font-size:.9rem; }

/* =====================================================================
   导航（共享组件注入到 #site-header）
   顶部透明白字（压在深色Hero/Banner上）；滚动后白底深字
   ===================================================================== */
.nav {
  position:fixed; top:0; left:0; right:0; height:var(--nav-h); z-index:100;
  display:flex; align-items:center;
  transition:background .3s var(--ease), box-shadow .3s, height .3s, border-color .3s;
  border-bottom:1px solid transparent;
}
.nav.scrolled {
  background:var(--nav-bg); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  box-shadow:0 6px 24px -14px rgba(20,55,130,.3); border-bottom-color:var(--line);
  height:64px;
}
.nav .container { display:flex; align-items:center; justify-content:space-between; width:100%; }
.brand { display:flex; align-items:center; gap:12px; }
.brand img { width:46px; height:46px; }
.brand-text { display:flex; flex-direction:column; line-height:1.05; }
.brand-text .cn { font-weight:800; font-size:1.08rem; letter-spacing:.02em; }
.brand-text .en { font-size:.62rem; letter-spacing:.14em; margin-top: 2px; font-weight:600; }

/* 顶部（透明态）白字 */
.nav .brand-text .cn, .nav .nav-links > a { color:#fff; }
.nav .brand-text .en { color:rgba(255,255,255,.8); }
.nav .nav-links > a:hover { color:var(--cyan); }
.nav-toggle span { background:#fff; }

/* 滚动后深字 */
.nav.scrolled .brand-text .cn { color:var(--ink); }
.nav.scrolled .brand-text .en { color:var(--dim); }
.nav.scrolled .nav-links > a { color:var(--ink-2); }
.nav.scrolled .nav-links > a:hover { color:var(--primary); background:rgba(10,108,255,.07); }
.nav.scrolled .nav-links > a.active { color:var(--primary); }
.nav.scrolled .nav-toggle span { background:var(--ink); }

.nav-links { display:flex; align-items:center; gap:2px; }
.nav-links > a {
  padding:9px 16px; border-radius:10px; font-size:.95rem; font-weight:600; transition:.25s;
}
.nav-links > a.active { color:var(--cyan); }
.nav-cta { margin-left:10px; }

.nav-toggle { display:none; flex-direction:column; gap:5px; padding:8px; }
.nav-toggle span { width:24px; height:2px; border-radius:2px; transition:.3s; }
.nav-toggle.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.nav-toggle.open span:nth-child(2) { opacity:0; }
.nav-toggle.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* =====================================================================
   Hero（首页 · 深色大图背景 + 白字）
   背景图通过 HTML 内联 style 设置，便于替换
   ===================================================================== */
.hero {
  position:relative; min-height:100vh; display:flex; align-items:center;
  padding:calc(var(--nav-h) + 40px) 0 90px; overflow:hidden; color:#fff;
  background-size:cover; background-position:center;
}
/* 轮播模式下遮罩由 .hero-overlay 提供 */
.hero::after { content:none; }
#hero-canvas { position:absolute; top:0; right:0; bottom:0; left:0; inset:0; width:100%; height:100%; z-index:2; opacity:.6; }

/* ---------- Hero 背景轮播 ---------- */
.hero-slides { position:absolute; top:0; right:0; bottom:0; left:0; inset:0; z-index:0; }
.hero-slide {
  position:absolute; top:0; right:0; bottom:0; left:0; inset:0; background-size:cover; background-position:center;
  opacity:0; transition:opacity 1.5s var(--ease);
  animation:kenburns 14s ease-in-out infinite alternate;
}
.hero-slide.active { opacity:1; }
@keyframes kenburns { from { transform:scale(1.04); } to { transform:scale(1.15); } }
.hero-overlay {
  position:absolute; top:0; right:0; bottom:0; left:0; inset:0; z-index:1;
  background:linear-gradient(100deg, rgba(5,12,35,.8) 0%, rgba(5,18,50,.46) 42%, rgba(10,60,150,.32) 100%);
}
/* 轮播内容面板：默认绝对定位叠放（老浏览器），支持 grid 时改用同格重叠（高度更稳） */
.hero-panels { position:relative; }
.hero-panel { position:absolute; top:0; left:0; width:100%; opacity:0; visibility:hidden; transition:opacity .7s var(--ease), visibility 0s linear .7s; }
.hero-panel.active { position:relative; opacity:1; visibility:visible; transition:opacity .7s var(--ease), visibility 0s; }
@supports (display:grid) {
  .hero-panels { display:grid; }
  .hero-panel { position:static; grid-area:1 / 1; }
  .hero-panel.active { position:static; }
}
.hero-panel .eyebrow { color:#fff; background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.4); }
.hero-panel.active .eyebrow,
.hero-panel.active h1,
.hero-panel.active .lead,
.hero-panel.active .hero-actions { animation:heroIn .8s var(--ease) both; }
.hero-panel.active h1 { animation-delay:.08s; }
.hero-panel.active .lead { animation-delay:.16s; }
.hero-panel.active .hero-actions { animation-delay:.24s; }
@keyframes heroIn { from { transform:translateY(22px); } to { transform:none; } }

/* 轮播指示点 */
.hero-dots { display:flex; gap:8px; margin-top:36px; }
.dot { width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,.35); cursor:pointer;
  padding:0; border:none; transition:.35s var(--ease); }
.dot:hover { background:rgba(255,255,255,.6); }
.dot.active { width:26px; border-radius:6px; background:var(--cyan); box-shadow:0 0 12px rgba(0,224,255,.8); }
.hero .container { position:relative; z-index:3; }
.hero-inner { max-width:830px; }
.hero h1 { color:#fff; margin:22px 0; }
.hero h1 .gradient-text { color:#fff; -webkit-text-fill-color:transparent; }
.hero .lead { font-size:1.18rem; max-width:640px; color:rgba(255,255,255,.9); }
.hero .lead b { color:#fff; }
.hero-actions { display:flex; gap:16px; margin-top:38px; flex-wrap:wrap; }
.hero-stats {
  display:flex; gap:44px; margin-top:66px; flex-wrap:wrap; padding-top:34px;
  border-top:1px solid rgba(255,255,255,.18);
}
.hero-stats .stat-num {
  font-size:2.2rem; font-weight:800; color:#fff;
  text-shadow:0 0 30px rgba(0,180,255,.5);
}
.hero-stats .stat-label { font-size:.85rem; color:rgba(255,255,255,.7); }

.scroll-hint { position:absolute; bottom:26px; left:50%; transform:translateX(-50%); z-index:3;
  font-size:.7rem; letter-spacing:.2em; color:rgba(255,255,255,.7); text-transform:uppercase; }
.scroll-hint::after { content:""; display:block; width:1px; height:40px; margin:10px auto 0;
  background:linear-gradient(var(--cyan), transparent); animation:scrollLine 2s var(--ease) infinite; }
@keyframes scrollLine { 0%{transform:scaleY(0);transform-origin:top} 50%{transform:scaleY(1);transform-origin:top} 51%{transform-origin:bottom} 100%{transform:scaleY(0);transform-origin:bottom} }

/* =====================================================================
   栏目 Banner（products/solutions/cases/about 页头 · 深色图+白字）
   ===================================================================== */
.page-hero {
  position:relative; text-align:center; color:#fff; overflow:hidden;
  padding:calc(var(--nav-h) + 96px) 0 80px;
  background-size:cover; background-position:center;
}
.page-hero::after { content:""; position:absolute; top:0; right:0; bottom:0; left:0; inset:0; z-index:0;
  background:linear-gradient(180deg, rgba(5,12,35,.15) 0%, rgba(5,12,35,.4) 100%); }
.page-hero .container { position:relative; z-index:1; }
.page-hero h1 { color:#fff; margin:18px 0; }
.page-hero p { max-width:660px; margin:0 auto; font-size:1.08rem; color:rgba(255,255,255,.92); }
.page-hero .eyebrow { color:#fff; background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.4); }

/* ---------- 卡片 ---------- */
.card {
  background:var(--bg-card); border:1px solid var(--line); border-radius:var(--radius);
  padding:30px; position:relative; overflow:hidden;
  box-shadow:var(--shadow-card);
  transition:transform .35s var(--ease), box-shadow .35s, border-color .35s;
}
.card::before { content:""; position:absolute; top:0; right:0; bottom:0; left:0; inset:0; pointer-events:none; opacity:0; transition:opacity .35s;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%), rgba(10,108,255,.10), transparent 60%); }
.card:hover { transform:translateY(-7px); border-color:var(--line-2); box-shadow:var(--shadow-hover); }
.card:hover::before { opacity:1; }

.icon-badge {
  width:58px; height:58px; border-radius:14px; display:flex; align-items:center; justify-content:center; margin-bottom:22px;
  background:var(--grad); color:#fff; box-shadow:0 10px 24px -10px rgba(10,108,255,.6);
}
.icon-badge.alt { background:var(--grad-2); }
.icon-badge svg { width:30px; height:30px; }

/* 图标与标题水平对齐（卡片头部） */
.card-head { display:flex; align-items:center; gap:16px; margin-bottom:20px; }
.card-head .icon-badge { margin-bottom:0; flex:0 0 auto; }
.card-head .head-text { min-width:0; }
.card-head .head-text h2,
.card-head .head-text h3 { margin:0 0 4px; }
.card-head .head-text h2 { font-size:1.5rem; line-height:1.3; }
.card-head .head-text .eyebrow,
.card-head .head-text .tagline { margin:0; }

/* 产品卡 */
.product-card { display:flex; flex-direction:column; height:100%; }
.product-card h3 { font-size:1.28rem; margin-bottom:10px; }
.product-card .tagline { color:var(--primary); font-size:.85rem; font-weight:700; margin-bottom:14px; }
.feature-list { margin-top:16px; }
.feature-list li { display:flex; align-items:flex-start; font-size:.92rem; color:var(--ink-2); margin-bottom:10px; }
.feature-list li:last-child { margin-bottom:0; }
.feature-list li::before { content:""; flex:0 0 16px; width:16px; height:16px; margin:5px 10px 0 0;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230a6cff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><path d='M20 6L9 17l-5-5'/></svg>") center/contain no-repeat; }
@supports (display:grid) {
  .feature-list { display:grid; gap:10px; }
  .feature-list li { margin-bottom:0; }
}
@supports ((-webkit-mask-image:none) or (mask-image:none)) {
  .feature-list li::before { background:var(--grad);
    -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M20 6L9 17l-5-5'/></svg>") center/contain no-repeat;
    mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M20 6L9 17l-5-5'/></svg>") center/contain no-repeat; }
}
.product-link { margin-top:auto; padding-top:22px; color:var(--primary); font-weight:700; font-size:.92rem; display:inline-flex; gap:6px; align-items:center; }
.product-link svg { width:16px; height:16px; transition:transform .3s; }
.product-card:hover .product-link svg { transform:translateX(4px); }

/* 技术胶囊 */
.tech-pills { display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.tech-pills span { font-size:.78rem; padding:5px 12px; border-radius:100px; background:var(--bg-soft); border:1px solid var(--line); color:var(--ink-2); font-weight:500; }

/* 解决方案 - 左右结构（左：方案描述 / 右：痛点·能力·成效） */
.sol-panel { position:relative; display:grid; grid-template-columns:1.05fr 1fr; gap:0;
  padding:36px 40px; margin-bottom:24px;
  border-radius:var(--radius-lg); border:1px solid var(--line); overflow:hidden;
  box-shadow:var(--shadow-card);
  background:linear-gradient(120deg, var(--bg-card) 0%, var(--bg-soft) 100%);
  transition:transform .35s var(--ease), box-shadow .35s, border-color .35s; }
.sol-panel:last-child { margin-bottom:0; }
.sol-panel:hover { transform:translateY(-4px); border-color:var(--line-2); box-shadow:var(--shadow-hover); }
.sol-left { min-width:0; padding-right:44px; }
.sol-title { display:flex; align-items:center; margin-bottom:18px; }
.sol-ic { flex:0 0 auto; width:46px; height:46px; margin-right:14px; border-radius:13px;
  display:flex; align-items:center; justify-content:center; background:var(--grad); color:#fff;
  box-shadow:0 10px 22px -10px rgba(10,108,255,.65); }
.sol-ic.alt { background:var(--grad-2); box-shadow:0 10px 22px -10px rgba(109,92,255,.6); }
.sol-ic svg { width:25px; height:25px; }
.sol-title h3 { font-size:1.42rem; line-height:1.3; margin:0; }
.sol-desc { font-size:1rem; line-height:1.95; color:var(--ink-2); margin:0; }
.sol-right { min-width:0; display:flex; flex-direction:column; gap:20px;
  padding-left:44px; border-left:1px solid var(--line); }
.sol-cell { min-width:0; }
.sol-label { display:flex; align-items:center; gap:8px; font-size:.84rem; font-weight:800; margin-bottom:8px; }
.sol-label svg { width:18px; height:18px; flex:0 0 auto; }
.sol-cell.pain .sol-label { color:#e0556a; }
.sol-cell.do   .sol-label { color:var(--primary); }
.sol-cell.win  .sol-label { color:#06a88c; }
.sol-cell p { font-size:.92rem; line-height:1.75; color:var(--ink-2); margin:0; }
@media (max-width:860px) {
  .sol-panel { grid-template-columns:1fr; gap:0; padding:28px 22px; }
  .sol-left { padding-right:0; padding-bottom:24px; border-bottom:1px solid var(--line); }
  .sol-right { padding-left:0; border-left:none; padding-top:24px; }
  .sol-title h3 { font-size:1.3rem; }
}

/* 产品详情双栏 info-box */
.info-box { background:linear-gradient(135deg, rgba(10,108,255,.08), rgba(109,92,255,.05)); border:1px solid var(--line); }
.info-box .sub { padding:18px; border-radius:12px; background:rgba(10,108,255,.06); margin-top:24px; }
.info-box .sub small { color:var(--primary); font-weight:700; }
.info-box .scene { font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:var(--purple); font-weight:700; margin-bottom:12px; }

/* ---------- 案例 ---------- */
.case-card { padding:0; overflow:hidden; display:flex; flex-direction:column; }
.case-thumb { height:180px; position:relative; overflow:hidden; }
.case-thumb img { width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.case-card:hover .case-thumb img { transform:scale(1.07); }
.case-thumb::after { content:""; position:absolute; top:0; right:0; bottom:0; left:0; inset:0;
  background:linear-gradient(180deg, transparent 40%, rgba(8,18,48,.55)); }
.case-thumb .case-no { position:absolute; top:14px; left:16px; z-index:2; font-size:.72rem; font-weight:700;
  color:#fff; background:rgba(10,108,255,.85); padding:4px 12px; border-radius:100px; backdrop-filter:blur(4px); }
.case-body { padding:24px; display:flex; flex-direction:column; flex:1; }
.case-body h3 { font-size:1.14rem; margin-bottom:12px; }
.case-meta { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.case-meta .pill { font-size:.72rem; padding:4px 11px; border-radius:100px; background:rgba(10,108,255,.08); color:var(--primary); border:1px solid rgba(10,108,255,.2); font-weight:600; }
.case-client { margin-top:auto; padding-top:16px; border-top:1px dashed var(--line); font-size:.84rem; color:var(--dim); }
.case-client b { color:var(--ink-2); font-weight:600; }

/* ---------- 步骤 ---------- */
.step { position:relative; padding:28px 28px 28px 88px; }
.step .num { position:absolute; left:26px; top:24px; font-size:1.6rem; font-weight:800;
  background:var(--grad-text); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.step::before { content:""; position:absolute; left:37px; top:64px; bottom:-24px; width:2px;
  background:linear-gradient(var(--line-2), transparent); }
.step:last-child::before { display:none; }

/* ---------- 统计 / 价值 ---------- */
.stat-grid { display:flex; flex-wrap:wrap; }
.stat-grid > * { flex:1 1 160px; margin:12px; }
@supports (display:grid) {
  .stat-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:24px; }
  .stat-grid > * { margin:0; }
}
.stat-box { text-align:center; padding:36px 20px; background:var(--bg-card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-card); }
.stat-box .num { font-size:2.2rem; font-weight:800; white-space:nowrap; line-height:1.1; background:var(--grad-text); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.stat-box .label { color:var(--muted); margin-top:6px; font-size:.95rem; }

.value-card h3 { display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.value-card h3 .v-icon { width:42px; height:42px; flex:0 0 42px; border-radius:11px; display:flex; align-items:center; justify-content:center; background:var(--grad); color:#fff; }
.value-card h3 .v-icon svg { width:22px; height:22px; }

/* ---------- CTA 横幅 ---------- */
.cta-banner { position:relative; border-radius:var(--radius-lg); padding:56px; padding:clamp(40px,6vw,72px); text-align:center; overflow:hidden;
  background:linear-gradient(135deg,#0a1838,#0a2a6b 60%,#3a2a8a); color:#fff; box-shadow:var(--shadow-hover); }
.cta-banner::before { content:""; position:absolute; top:0; right:0; bottom:0; left:0; inset:0;
  background:radial-gradient(600px 300px at 50% 0%, rgba(0,180,255,.4), transparent 70%); }
.cta-banner > * { position:relative; z-index:1; }
.cta-banner h2 { color:#fff; margin-bottom:16px; }
.cta-banner p { max-width:560px; margin:0 auto 30px; color:rgba(255,255,255,.9); }
.cta-actions { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }

/* ---------- 联系 ---------- */
.contact-grid { display:flex; flex-wrap:wrap; }
.contact-grid > * { flex:1 1 180px; margin:12px; }
@supports (display:grid) {
  .contact-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:24px; }
  .contact-grid > * { margin:0; }
}
.contact-item { display:flex; gap:16px; align-items:flex-start; }
.contact-item .ic { width:50px; height:50px; flex:0 0 50px; border-radius:13px; display:flex; align-items:center; justify-content:center; background:var(--grad); color:#fff; }
.contact-item .ic svg { width:24px; height:24px; }
.contact-item .k { font-size:.8rem; color:var(--dim); }
.contact-item .v { font-size:1.05rem; font-weight:700; color:var(--ink); }

/* =====================================================================
   页脚（共享组件注入 #site-footer · 深蓝）
   ===================================================================== */
.footer { border-top:1px solid rgba(255,255,255,.06); background:#060f28; color:rgba(255,255,255,.75); padding:64px 0 28px; position:relative; }
.footer::before { content:""; position:absolute; top:0; right:0; bottom:0; left:0; inset:0; pointer-events:none;
  background:radial-gradient(700px 300px at 80% 0%, rgba(0,180,255,.12), transparent 60%); }
.footer .container { position:relative; }
.footer-grid { display:flex; flex-wrap:wrap; }
.footer-grid > * { margin:20px; }
.footer-grid > *:nth-child(1) { flex:1.6 1 220px; }
.footer-grid > *:nth-child(2),
.footer-grid > *:nth-child(3) { flex:1 1 150px; }
.footer-grid > *:nth-child(4) { flex:1.2 1 170px; }
@supports (display:grid) {
  .footer-grid { display:grid; grid-template-columns:1.6fr 1fr 1fr 1.2fr; gap:40px; }
  .footer-grid > * { margin:0; }
}
.footer .brand { margin-bottom:18px; }
.footer .brand-text .cn { color:#fff; }
.footer .brand-text .en { color:rgba(255,255,255,.6); }
.footer-about p { font-size:.9rem; color:rgba(255,255,255,.6); }
.footer h4 { font-size:.95rem; margin-bottom:18px; color:#fff; }
.footer li { margin-bottom:11px; }
.footer li a { color:rgba(255,255,255,.6); font-size:.9rem; }
.footer li a:hover { color:var(--cyan); }
.footer-contact li { display:flex; gap:10px; align-items:flex-start; color:rgba(255,255,255,.6); font-size:.9rem; margin-bottom:12px; }
.footer-contact svg { width:18px; height:18px; color:var(--cyan); flex:0 0 18px; margin-top:3px; }
.footer-bottom { margin-top:48px; padding-top:24px; border-top:1px solid rgba(255,255,255,.08); display:flex; justify-content:center; align-items:center; flex-wrap:nowrap; gap:12px; font-size:.82rem; color:rgba(255,255,255,.45); white-space:nowrap; text-align:center; }
.footer-bottom a { color:inherit; }
.footer-bottom a:hover { color:var(--cyan); }
.footer-bottom img { display:inline-block; width:16px; height:16px; vertical-align:middle; margin:0 4px 0 10px; }

/* ---------- 动画 ---------- */
.reveal { opacity:0; transform:translateY(34px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.in { opacity:1; transform:none; }
.reveal.d1 { transition-delay:.1s; } .reveal.d2 { transition-delay:.2s; } .reveal.d3 { transition-delay:.3s; } .reveal.d4 { transition-delay:.4s; }

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

/* ---------- 响应式 ---------- */
@media (max-width:980px) {
  .cols-4 > * { width:calc(50% - 24px); }
  .cols-3 > * { width:calc(50% - 24px); }
  .footer-grid > * { flex:1 1 240px; }
  @supports (display:grid) {
    .footer-grid { grid-template-columns:1fr 1fr; gap:32px; }
    .cols-4 { grid-template-columns:repeat(2,1fr); }
    .cols-3 { grid-template-columns:repeat(2,1fr); }
  }
}
@media (max-width:768px) {
  .nav-toggle { display:flex; }
  .nav-links {
    position:fixed; top:var(--nav-h); left:0; right:0; flex-direction:column; align-items:stretch; gap:0;
    background:rgba(255,255,255,.98); backdrop-filter:blur(18px);
    border-bottom:1px solid var(--line); padding:12px 24px 24px;
    transform:translateY(-130%); transition:transform .4s var(--ease);
    max-height:calc(100vh - var(--nav-h)); overflow-y:auto; box-shadow:0 20px 40px -20px rgba(20,55,130,.3);
  }
  .nav-links.open { transform:translateY(0); }
  /* 移动菜单始终深字 */
  .nav .nav-links > a { color:var(--ink-2) !important; }
  .nav .nav-links > a:hover, .nav .nav-links > a.active { color:var(--primary) !important; background:rgba(10,108,255,.07); }
  .nav-links > a { padding:14px 12px; border-radius:10px; font-size:1rem; border-bottom:1px solid var(--line); }
  .nav-cta { margin:14px 0 0; }
  .hero-stats { gap:26px; }
  .cols-2 > *, .cols-3 > *, .cols-4 > * { width:100%; }
  .footer-grid > * { flex:1 1 100%; }
  .stat-grid > *, .contact-grid > * { flex:1 1 100%; }
  @supports (display:grid) {
    .cols-2,.cols-3,.cols-4 { grid-template-columns:1fr; }
    .footer-grid { grid-template-columns:1fr; }
  }
  .footer-bottom { flex-direction:column; white-space:normal; }
  .step { padding-left:80px; }
}

/* =====================================================================
   元素间距：统一用 margin 实现，兼容所有浏览器
   说明：旧版 Edge / Chromium 的 flex `gap` 不可靠，且 @supports(gap) 会误报，
   无法可靠做特性检测。故所有 flex 容器统一改走 margin，现代浏览器效果与 gap 一致。
   第一步：把这些容器的 gap 清零，避免现代浏览器出现 margin+gap 双倍间距。
   ===================================================================== */
.eyebrow,.btn,.brand,.nav-links,.nav-toggle,.hero-dots,.hero-actions,.hero-stats,
.card-head,.product-link,.tech-pills,.case-meta,.value-card h3,.cta-actions,
.contact-item,.footer-contact li,.footer-bottom { gap:0; }

/* 单行排列：相邻兄弟元素之间补左间距（纵向容器补上间距） */
.brand > * + * { margin-left:12px; }
.nav-links > * + * { margin-left:2px; }
.nav-toggle > * + * { margin-top:5px; }
.card-head > * + * { margin-left:16px; }
.contact-item > * + * { margin-left:16px; }
.hero-dots > * + * { margin-left:8px; }
.hero-actions > * + * { margin-left:16px; }
.tech-pills > * + * { margin-left:8px; }
.case-meta > * + * { margin-left:8px; }
.cta-actions > * + * { margin-left:16px; }
.hero-stats > * + * { margin-left:44px; }

/* 图标与文字混排（文本节点无法用 * 选中，单独给图标加边距） */
.product-link svg { margin-left:6px; }
.value-card h3 .v-icon { margin-right:12px; }
.footer-contact li svg { margin-right:10px; }

/* footer-bottom 居中，仅保留下边距用于纵向间距 */
.footer-bottom > * { margin:0 0 12px; }

/* 移动端 hero-stats 收窄间距（覆盖上面的 44px） */
@media (max-width:768px) {
  .hero-stats > * + * { margin-left:26px; }
}