/* ============================================================
   SEOSOUCMS · default「云澜蓝」2.0 —— 现代营销型
   蓝色渐变首屏 / 居中区块 / 卡片悬浮 / 深蓝页脚
   兼容策略：所有新语法（clamp/渐变变量）均有旧内核 px 兜底；
   flex 间距用 margin 而非 gap（百度APP 旧 WebView 也能正确布局）。
   ============================================================ */
:root {
  --pri: #2563eb;
  --pri-d: #1d4ed8;
  --ink: #0f172a;
  --text: #334155;
  --muted: #64748b;
  --line: #e2e8f0;
  --soft: #f1f5f9;
  --foot-bg: #f4f7fc;
  --price: #e11d48;
  --radius: 14px;
  --shadow: 0 10px 30px rgba(15, 23, 42, .08);
  --shadow-lg: 0 18px 44px rgba(37, 99, 235, .16);
}

* { box-sizing: border-box; }
html { height: 100%; }
body {
  margin: 0; min-height: 100vh; display: flex; flex-direction: column;
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
  color: var(--text); line-height: 1.75; background: #fff;
  -webkit-font-smoothing: antialiased;
}
main { flex: 1 0 auto; width: 100%; }
header.site-header, footer.site-footer { flex: 0 0 auto; }

.wrap { --pad: 20px; max-width: 1680px; margin: 0 auto; padding-left: var(--pad); padding-right: var(--pad); }
@media (min-width: 900px) { .wrap { --pad: 36px; } }
a { color: var(--pri); text-decoration: none; }
img { max-width: 100%; }
.empty { color: var(--muted); background: var(--soft); border: 1px dashed var(--line); border-radius: var(--radius); padding: 28px; text-align: center; }

/* ---------- 头部 ---------- */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: #ffffff; /* 旧内核兜底 */
  background: rgba(255, 255, 255, .94);
  border-bottom: 1px solid var(--line);
}
.site-header .nav { display: flex; align-items: center; justify-content: space-between; min-height: 66px; padding: 8px var(--pad, 20px); }
.logo { display: inline-block; font-weight: 800; font-size: 19px; color: var(--ink); text-decoration: none; letter-spacing: .3px; }
.logo-dot { display: inline-block; width: 10px; height: 10px; border-radius: 3px; background: #2563eb; margin-right: 9px; vertical-align: 1px; }
.site-nav { display: flex; align-items: center; flex-wrap: wrap; }
.site-nav > a { margin-left: 4px; padding: 8px 12px; border-radius: 8px; color: var(--text); text-decoration: none; font-size: 15px; transition: color .18s, background .18s; }
.site-nav > a:hover { color: var(--pri); background: #eff4ff; }
.site-nav > a.active { color: var(--pri); background: #eff4ff; font-weight: 600; }
.nav-search, .nav-search.active { color: #fff !important; background: var(--pri); margin-left: 8px; }
.nav-search:hover { background: var(--pri-d) !important; color: #fff !important; }

/* 二级栏目下拉 */
.site-nav .nav-item { position: relative; }
.site-nav .nav-item > a { display: inline-block; margin-left: 4px; padding: 8px 12px; border-radius: 8px; color: var(--text); text-decoration: none; font-size: 15px; }
.site-nav .nav-item > a:hover, .site-nav .nav-item > a.active { color: var(--pri); background: #eff4ff; }
.site-nav .caret { display: inline-block; margin-left: 7px; vertical-align: middle; width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid currentColor; opacity: .5; }
.nav-drop {
  position: absolute; left: 0; top: 100%; min-width: 176px;
  background: #fff; border: 1px solid var(--line); border-radius: 12px;
  box-shadow: var(--shadow-lg); padding: 7px; display: none; z-index: 40;
}
.site-nav .nav-item:hover > .nav-drop, .site-nav .nav-item:focus-within > .nav-drop { display: block; }
.nav-drop a { display: block; padding: 8px 12px; border-radius: 8px; color: var(--text); text-decoration: none; white-space: nowrap; font-size: 14.5px; }
.nav-drop a:hover { background: #eff4ff; color: var(--pri); }
.nav-drop a.active { color: var(--pri); font-weight: 600; background: #eff4ff; }

/* ---------- 首屏 ---------- */
.hero {
  position: relative; overflow: hidden;
  margin: 0 0 8px; padding: 80px 24px 72px; text-align: center; border-radius: 0 0 28px 28px;
  background:
    radial-gradient(60% 130% at 50% -12%, rgba(37, 99, 235, .10), transparent 60%),
    linear-gradient(180deg, #f4f8ff 0%, #eaf1fe 100%);
  color: var(--ink);
}
.hero-eyebrow {
  display: inline-block; margin: 0 0 14px; padding: 5px 16px; border-radius: 999px;
  background: rgba(37, 99, 235, .10);
  border: 1px solid rgba(37, 99, 235, .35);
  font-size: 13px; letter-spacing: 2px;
}
.hero h1 { margin: 0 0 14px; font-size: 36px; font-size: clamp(27px, 4vw, 46px); line-height: 1.3; letter-spacing: 1px; color: var(--ink); }
.hero-sub { margin: 0 auto; max-width: 640px; font-size: 16px; font-size: clamp(14.5px, 1.5vw, 17px); color: var(--text); }
.hero-chips { margin-top: 30px; font-size: 0; }
.hero-chips span {
  display: inline-block; padding: 7px 18px; border-radius: 999px; font-size: 13.5px;
  margin: 5px 6px 0;
  background: #fff; border: 1px solid #cdd9f3; color: var(--pri);
}

/* ---------- 区块 ---------- */
.block { padding: 52px 0 12px; }
.block-alt { background: var(--soft); margin: 44px 0 0; padding: 52px 28px 56px; border-radius: 24px; }
.block-head { text-align: center; margin-bottom: 34px; }
.block-head h2 { display: inline-block; margin: 0; font-size: 25px; font-size: clamp(22px, 2.4vw, 28px); color: var(--ink); letter-spacing: 1px; }
.block-head h2::after { content: ""; display: block; width: 44px; height: 4px; border-radius: 2px; background: linear-gradient(90deg, #3b82f6, #1d4ed8); margin: 10px auto 0; }
.block-head p { margin: 10px 0 0; color: var(--muted); font-size: 14.5px; }

/* ---------- 卡片网格 ---------- */
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(252px, 1fr)); gap: 22px; list-style: none; padding: 0; margin: 0; }
@media (min-width: 1400px) { .grid { grid-template-columns: repeat(auto-fill, minmax(352px, 1fr)); gap: 26px; } }
.card {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  overflow: hidden; transition: box-shadow .22s ease, transform .22s ease, border-color .22s ease;
}
.card:hover { border-color: transparent; box-shadow: var(--shadow-lg); }
.card > a { display: flex; flex-direction: column; height: 100%; color: inherit; text-decoration: none; }
.card-media { display: block; height: 168px; background: linear-gradient(135deg, #e8eefc, #f6f8fd); overflow: hidden; }
.card-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.card-body { display: flex; flex-direction: column; flex: 1; padding: 15px 17px 16px; }
.card h3 { margin: 0 0 6px; font-size: 16.5px; color: var(--ink); line-height: 1.5; }
.card p { margin: 0 0 10px; color: var(--muted); font-size: 13.8px; line-height: 1.7; }
.card .price { color: var(--price); font-weight: 800; font-size: 15.5px; margin: 0 0 8px; }
.card-more { margin-top: auto; font-size: 13px; color: var(--pri); font-weight: 600; }

/* ---------- 客户案例（独立模板） ---------- */
.grid-cases { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 26px; }
@media (min-width: 1400px) { .grid-cases { grid-template-columns: repeat(auto-fill, minmax(430px, 1fr)); gap: 30px; } }
.card-case .card-media { height: 210px; position: relative; }
.card-case .card-media img { transition: transform .7s cubic-bezier(.22, .61, .36, 1); }
.card-case:hover .card-media img { transform: scale(1.03); }
.card-case .card-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(15, 23, 42, .42)); pointer-events: none; }
.case-tag { position: absolute; left: 12px; bottom: 10px; z-index: 2; background: rgba(255, 255, 255, .92); color: var(--pri); font-size: 12px; font-weight: 700; padding: 3px 10px; border-radius: 999px; }
.case-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 0 0 8px; }
.case-meta span { color: var(--muted); font-size: 12.5px; }
.case-meta b { color: var(--pri); font-size: 13.5px; }
/* 列表页头条案例的效果数据带 */
.case-stats { display: flex; flex-wrap: wrap; gap: 10px 26px; margin: 12px 0 10px; padding: 0; list-style: none; }
.case-stats li { display: flex; flex-direction: column; }
.case-stats b { color: var(--pri); font-size: 19px; line-height: 1.2; }
.case-stats span { color: var(--muted); font-size: 12px; }
/* 详情页：头图 / 标题区 / 效果数据带 / 信息网格 */
.c-hero-img { margin: 0 0 18px; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-lg); }
.c-hero-img img { width: 100%; height: auto; display: block; }
.c-head { margin: 0 0 18px; }
.c-head .p-title { margin: 0 0 8px; }
.c-meta { display: flex; flex-wrap: wrap; gap: 6px 18px; color: var(--muted); font-size: 13px; margin: 0 0 10px; }
.c-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px; margin: 0 0 20px; background: linear-gradient(135deg, #eff6ff, #eef2ff); border: 1px solid #dbeafe; border-radius: var(--radius); padding: 20px 22px; }
.c-stat { display: flex; flex-direction: column; align-items: center; text-align: center; }
.c-stat b { color: var(--pri); font-size: 24px; line-height: 1.25; }
.c-stat span { color: var(--muted); font-size: 13px; margin-top: 2px; }
.c-fields { margin: 0 0 20px; }
@media (max-width: 720px) { .grid-cases { grid-template-columns: 1fr 1fr; gap: 14px; } .card-case .card-media { height: 140px; } .c-stats { grid-template-columns: 1fr 1fr; padding: 14px 16px; } .c-stat b { font-size: 19px; } }
@media (max-width: 460px) { .grid-cases { grid-template-columns: 1fr; } .c-stats { grid-template-columns: 1fr 1fr; } }

/* ---------- 新闻列表 ---------- */
.news { list-style: none; padding: 0; margin: 0; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.news li { display: flex; align-items: center; justify-content: space-between; padding: 15px 20px; border-bottom: 1px solid var(--line); }
.news li:last-child { border-bottom: 0; }
.news li:hover { background: #f8faff; }
.news a { color: var(--ink); text-decoration: none; font-size: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.news a:hover { color: var(--pri); }
.news time { color: var(--muted); font-size: 13px; white-space: nowrap; margin-left: 16px; }

/* ---------- 面包屑 ---------- */
.breadcrumb { font-size: 13px; color: var(--muted); padding: 16px 0 0; }
.breadcrumb a { color: var(--muted); text-decoration: none; }
.breadcrumb a:hover { color: var(--pri); }
.breadcrumb .sep { margin: 0 7px; color: #cbd5e1; }
.breadcrumb [aria-current] { color: var(--ink); font-weight: 500; }

/* ---------- 列表页头 ---------- */
.page-head { padding: 26px 0 8px; border-bottom: 1px solid var(--line); margin-bottom: 28px; }
.page-head h1 { margin: 0 0 8px; font-size: 26px; font-size: clamp(22px, 2.6vw, 28px); color: var(--ink); letter-spacing: .5px; }

/* ---------- 详情页 ---------- */
.detail { max-width: none; margin: 30px auto 44px; }
.detail h1 { font-size: 27px; font-size: clamp(22px, 2.8vw, 29px); color: var(--ink); line-height: 1.45; margin: 6px 0 10px; }
.meta { color: var(--muted); font-size: 13px; padding-bottom: 16px; border-bottom: 1px solid var(--line); margin-bottom: 20px; }
.lead { color: var(--text); background: #f0f6ff; border-left: 4px solid var(--pri); padding: 13px 16px; border-radius: 0 10px 10px 0; margin: 0 0 22px; }
.content { font-size: 15.5px; color: #374151; overflow-wrap: break-word; }
.content img { max-width: 100%; height: auto; border-radius: 10px; }
.content table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.content h2 { color: var(--ink); margin: 30px 0 12px; font-size: 20px; }
.content blockquote { margin: 18px 0; padding: 12px 18px; background: var(--soft); border-left: 4px solid #93c5fd; border-radius: 0 10px 10px 0; color: var(--muted); }
.content a { color: var(--pri); text-decoration: none; }
.detail .h2 { margin: 30px 0 12px; font-size: 20px; color: var(--ink); }

/* 价格 */
.price-lg { margin: 2px 0 16px; font-size: 26px; font-weight: 800; color: var(--price); }

/* 参数表 */
table.spec { width: 100%; border-collapse: collapse; font-size: 14.5px; border: 1px solid var(--line); }
table.spec th, table.spec td { border: 0; border-bottom: 1px solid var(--line); padding: 11px 14px; text-align: left; }
table.spec tr:last-child th, table.spec tr:last-child td { border-bottom: 0; }
table.spec th { width: 34%; background: var(--soft); font-weight: 600; color: var(--ink); }

/* 翻页/上下篇 */
.pager { margin-top: 30px; display: flex; flex-wrap: wrap; }
.pager a { text-decoration: none; font-size: 14px; }
.pager-btn {
  display: inline-block; padding: 10px 16px; border-radius: 10px;
  border: 1px solid var(--line); color: var(--text); background: #fff; transition: .18s;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 48%;
}
.pager-btn:hover { border-color: var(--pri); color: var(--pri); background: #eff4ff; }
.pager-btn.next { margin-left: auto; }

/* ---------- 页脚 ---------- */
.site-footer { margin-top: 56px; background: #f4f7fc; color: var(--muted); }
.foot-grid { display: flex; flex-wrap: wrap; gap: 26px 30px; padding: 38px var(--pad) 10px; }
.foot-brand { flex: 0 0 250px; margin: 0 48px 0 0; } /* 2026-09-19：公司名列与右侧「关于我们」栏目列之间留出间距（移动端第275行 margin:0 覆盖，手机端不受影响） */
.foot-name { margin: 0 0 6px; color: var(--ink); font-size: 18px; font-weight: 700; letter-spacing: .5px; }
.foot-desc { margin: 0; font-size: 13.5px; color: var(--muted); }
.foot-nav { display: flex; flex-direction: column; align-items: flex-start; flex: 1 1 0; min-width: 116px; max-width: 210px; margin: 0; }
.foot-nav a { color: var(--muted); text-decoration: none; font-size: 14px; margin: 0 0 7px; }
.foot-nav a:hover { color: var(--pri); }
.foot-bar { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; padding: 16px var(--pad, 36px) 22px; border-top: 1px solid #e2e9f5; margin-top: 22px; }
.foot-bar p { margin: 0; font-size: 13px; color: var(--muted); }
.foot-bar a { color: var(--pri); text-decoration: none; }

/* ---------- Logo 图片（后台设置 Logo 后替代文字站名） ---------- */
.logo-img { max-height: 42px; width: auto; vertical-align: middle; }

/* ---------- 关于我们横带 ---------- */
.about-band { background: linear-gradient(135deg, #f0f6ff, #e9f0fd); border: 1px solid #dbe7fb; border-radius: var(--radius); padding: 34px 38px; }
.about-text h2 { margin: 0 0 10px; font-size: 22px; color: var(--ink); letter-spacing: 1px; }
.about-text p { margin: 0 0 18px; color: var(--text); max-width: 960px; }
.btn-line { display: inline-block; padding: 9px 22px; border: 1px solid var(--pri); border-radius: 999px; color: var(--pri); text-decoration: none; font-size: 14px; transition: .18s; }
.btn-line:hover { background: var(--pri); color: #fff; }

/* ---------- 联系 CTA 横带 ---------- */
.cta-band { margin: 52px 0 0; padding: 30px 40px; background: linear-gradient(135deg, #eef4ff, #e3edfd); color: var(--ink); border-radius: 24px; }
.cta-inner { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.cta-text h2 { margin: 0 0 6px; font-size: 24px; letter-spacing: 1px; }
.cta-text p { margin: 0; opacity: .85; font-size: 14.5px; }
.cta-btns { margin: 0; }
.btn-pri { display: inline-block; padding: 11px 28px; background: var(--pri); color: #fff; border-radius: 999px; font-weight: 700; text-decoration: none; margin-right: 12px; }
.btn-ghost { display: inline-block; padding: 11px 28px; border: 1px solid var(--pri); color: var(--pri); border-radius: 999px; text-decoration: none; }
.btn-ghost:hover { background: rgba(37, 99, 235, .08); }

/* ---------- 404 ---------- */
.e404 { text-align: center; padding: 70px 16px 40px; }
.e404 .code { margin: 0; font-size: 108px; font-weight: 800; line-height: 1; color: var(--pri-d); letter-spacing: 8px; }
.e404 .code i { font-style: normal; color: var(--pri); }
.e404 h1 { margin: 18px 0 8px; font-size: 24px; color: var(--ink); }
.e404 .tip { color: var(--muted); margin: 0 0 26px; }
.e404 .btns { margin: 0; }
.e404 .btns .btn-pri { background: var(--pri); color: #fff; }
.e404 .btns .btn-ghost { border-color: var(--line); color: var(--text); }
.e404 .btns .btn-ghost:hover { border-color: var(--pri); color: var(--pri); background: transparent; }
@media (max-width: 720px) {
  .cta-inner { flex-direction: column; text-align: center; }
  .cta-btns { margin-top: 16px; }
  .cta-band { border-radius: 20px 20px 0 0; padding-left: 16px; padding-right: 16px; }
  .e404 { padding: 48px 14px 30px; }
  .e404 .code { font-size: 72px; }
  .about-band { padding: 26px 22px; }
}

/* ---------- 响应式：平板 / 手机 / 小屏全覆盖 ---------- */
@media (min-width: 1600px) {
  .hero { padding: 96px 0 88px; }
}
@media (max-width: 1024px) {
  .grid { grid-template-columns: repeat(auto-fill, minmax(226px, 1fr)); }
}
@media (max-width: 860px) {
  .site-nav > a, .site-nav .nav-item > a { padding: 7px 8px; font-size: 14px; }
}
@media (max-width: 720px) {
  .hero { padding: 50px 0 46px; border-radius: 0 0 20px 20px; }
  .grid { grid-template-columns: 1fr 1fr; gap: 14px; }
  .card-media { height: 120px; }
  .block { padding: 40px 0 8px; }
  .block-alt { margin: 36px 0 0; padding: 40px 20px 44px; border-radius: 18px; }
  .foot-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px 18px; }
  .foot-brand { grid-column: 1 / -1; flex: none; margin: 0; }
  .foot-nav { min-width: 0; }
  .pager-btn { max-width: 100%; }
  .pager-btn.next { margin-left: 0; }
}
@media (max-width: 460px) {
  .grid { grid-template-columns: 1fr; }
  .foot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hero-chips span { padding: 6px 12px; font-size: 12px; }
}


/* ============================================================
   3.0 全站优化层（2026-09-15）—— 首屏/列表页头/卡片/详情/单页全覆盖
   ============================================================ */
::selection { background: rgba(37, 99, 235, .16); }
:focus-visible { outline: 2px solid var(--pri); outline-offset: 2px; border-radius: 4px; }

/* ---------- 首屏：光斑层次 ---------- */
.hero {
  background:
    radial-gradient(46% 90% at 18% 0%, rgba(96, 165, 250, .16), transparent 60%),
    radial-gradient(40% 80% at 86% 18%, rgba(37, 99, 235, .14), transparent 65%),
    linear-gradient(180deg, #f4f8ff 0%, #eaf1fe 100%);
}
.hero-eyebrow { backdrop-filter: blur(2px); }
.hero-sub { color: var(--text); }

/* ---------- 列表页头 / 单页页头：横幅化 ---------- */
.page-head {
  position: relative; overflow: hidden;
  margin: 18px 0 28px; padding: 30px 34px 28px;
  border: 1px solid #dce7fa; border-bottom: 1px solid #dce7fa;
  border-radius: var(--radius);
  background: linear-gradient(135deg, #eef4ff, #f9fbff);
}
.page-head::after {
  content: ""; position: absolute; right: -46px; top: -46px;
  width: 190px; height: 190px; border-radius: 50%;
  background: radial-gradient(circle, rgba(59, 130, 246, .14), transparent 70%);
}
.page-head h1 { position: relative; font-size: clamp(24px, 3vw, 32px); }
.page-head h1::before {
  content: ""; display: block; width: 46px; height: 5px; border-radius: 3px;
  background: linear-gradient(90deg, #3b82f6, #1d4ed8); margin: 0 0 12px;
}
.page-head .lead { margin: 10px 0 0; background: transparent; border-left: 0; padding: 0; color: var(--muted); border-radius: 0; }

/* ---------- 卡片：顶部流光 + 图片缩放 ---------- */
.card { position: relative; }
/* 2026-09-19：去掉卡片 hover 时展开的顶部蓝色条（原 .card::before / .card:hover::before） */
/* 封面图 hover 放大统一放在文件末尾「19. 封面图交互设计」，此处不再重复定义（原 1.05 与后文冲突） */
.card h3 { transition: color .18s; }
.card:hover h3 { color: var(--pri); }
.card-more { transition: color .18s; }
.card:hover .card-more { color: var(--pri-d); }

/* ---------- 新闻列表：日期胶囊 ---------- */
.news li { transition: background .18s; }
.news time { background: var(--soft); border-radius: 999px; padding: 3px 12px; }

/* ---------- 面包屑：胶囊化 ---------- */
.breadcrumb {
  display: inline-block; margin-top: 14px; padding: 7px 16px;
  background: var(--soft); border-radius: 999px;
}

/* ---------- 详情页排版 ---------- */
.detail h1 { letter-spacing: .5px; }
.meta { padding-bottom: 14px; }
.lead { line-height: 1.8; }
.content { font-size: 16px; line-height: 1.95; }
.content p { margin: 0 0 14px; }
.content h2, .content h3 { margin-top: 34px; margin-bottom: 14px; }
.content blockquote { background: #f6f9ff; }
table.spec tr { transition: background .15s; }
table.spec tbody tr:hover td { background: #f6f9ff; }

/* ---------- 翻页/上下篇 ---------- */
.pager-btn { transition: transform .18s, box-shadow .18s, border-color .18s, background .18s; }
.pager-btn:hover { box-shadow: 0 8px 18px rgba(37, 99, 235, .12); }

/* ---------- 页脚：顶部流光 hairline ---------- */
.site-footer { position: relative; }
.site-footer::before {
  content: ""; display: block; height: 3px;
  background: linear-gradient(90deg, transparent 4%, #3b82f6 30%, #93c5fd 50%, #3b82f6 70%, transparent 96%);
}
.foot-nav a { transition: color .15s; }

/* ---------- CTA 横带：光斑 ---------- */
.cta-band {
  background:
    radial-gradient(52% 120% at 80% 0%, rgba(37, 99, 235, .12), transparent 62%),
    linear-gradient(135deg, #eef4ff, #e3edfd);
}
.btn-pri { transition: transform .18s, box-shadow .18s; }
.btn-pri:hover { box-shadow: 0 10px 24px rgba(37, 99, 235, .25); }

/* ---------- 404 ---------- */
.e404 .code { color: var(--pri-d); background: linear-gradient(180deg, #3b82f6, #1d4ed8); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }

/* ---------- 首页服务范围导航条 ---------- */
.svc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; list-style: none; padding: 0; margin: 0; }
.svc-grid a {
  display: flex; align-items: center; justify-content: space-between;
  padding: 15px 18px; background: #fff; border: 1px solid var(--line); border-radius: 12px;
  color: var(--ink); text-decoration: none; font-size: 15px; font-weight: 600;
  transition: border-color .18s, box-shadow .18s, transform .18s, color .18s;
}
.svc-grid a span { color: var(--pri); font-weight: 400; transition: transform .18s; }
.svc-grid a:hover { border-color: #bcd0f9; box-shadow: var(--shadow-lg);  color: var(--pri); }
.svc-grid a:hover span { transform: translateX(4px); }
@media (max-width: 720px) { .svc-grid { grid-template-columns: 1fr 1fr; gap: 10px; } .svc-grid a { padding: 12px 14px; font-size: 14px; } }
@media (max-width: 460px) { .svc-grid { grid-template-columns: 1fr; } }

/* ---------- 响应式补充 ---------- */
@media (max-width: 720px) {
  .page-head { margin: 12px 0 22px; padding: 22px 20px 20px; }
  .content { font-size: 15.5px; }
}


/* ============================================================
   3.1 宽屏排版层（2026-09-15）—— 详情页两栏 + 右侧文章目录 + 排版精修
   ============================================================ */
/* 锚点跳转不被吸顶头遮挡 */
.content [id] { scroll-margin-top: 92px; }

@media (min-width: 1100px) {
  /* 详情页容器宽屏：宽度全权交给内部 .wrap */
  .detail { max-width: none; }
  /* 旧结构标题/摘要跟随正文列宽；企业版 hero/body/面包屑豁免（面包屑与三类版式容器
     由第 20 节各自按内容列居中/限宽，这里必须一并豁免，否则被压成 100%-376px） */
  .detail > :not(.content):not(.e-hero):not(.e-body):not(.breadcrumb):not(.nw-wrap):not(.pd-wrap):not(.cs-wrap):not(.pd-hero) { max-width: calc(100% - 376px); }
  .detail.page > .page-head { max-width: none; }   /* 单页横幅保持全宽 */

  /* 正文 Grid 两栏：左侧正文，右侧目录栏
     判定必须用「直接子元素」> .toc-box：目录被插件插进某个卡片内部时（后代选择器仍会命中），
     会凭空启用右侧 320px 空栏、把正文压窄。 */
  .content:has(> .toc-box) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    column-gap: 56px;
    align-items: start; }
  .content:not(:has(> .toc-box)) { display: block; }
  .content > * { grid-column: 1; }
  .content > .toc-box {
    grid-column: 2;
    grid-row: 1 / span 200;
    width: 320px; justify-self: end;
    position: sticky; top: 92px;
    margin: 0; padding: 18px 20px;
    background: #f6f9ff; border: 1px solid #dce7fa; border-left: 3px solid var(--pri);
    border-radius: 12px;
    max-height: calc(100vh - 130px); overflow-y: auto; }
  .content > .toc-box .toc-t { color: var(--ink); font-size: 15px; letter-spacing: 1px; }
  .content > .toc-box .toc-l { padding-left: 16px; }
  .content > .toc-box .toc-l a { color: var(--pri); text-decoration: none; }
  .content > .toc-box .toc-l a:hover { color: var(--pri-d); }
}

/* ---------- 排版精修 ---------- */
.detail .meta { letter-spacing: .3px; }
.content h2 { border-left: 4px solid var(--pri); padding-left: 14px; border-radius: 2px 0 0 2px; }
.content h3 { color: var(--ink); }
.content strong { color: var(--ink); }
.content img { border-radius: 12px; box-shadow: 0 10px 30px rgba(15, 23, 42, .12); }
.content hr { border: 0; height: 1px; margin: 30px 0; background: linear-gradient(90deg, transparent, var(--line), transparent); }
.content ul, .content ol { margin: 0 0 16px; padding-left: 24px; }
.content li { margin: 5px 0; }
.content blockquote { box-shadow: 0 4px 14px rgba(15, 23, 42, .04); }
table.spec { border-radius: 12px; overflow: hidden; box-shadow: 0 4px 16px rgba(15, 23, 42, .05); }

/* ============================================================
   3.2 流式字体层（2026-09-15）—— 字号随视口自动缩放
   手机收小不挤、大屏放大更舒展；clamp(下限, 随视口, 上限)
   ============================================================ */
html { font-size: clamp(15px, 0.3vw + 14.2px, 16.5px); }
body { font-size: clamp(14.5px, 0.18vw + 14px, 16px); line-height: 1.72; }
.logo { font-size: clamp(17px, 0.4vw + 15.4px, 20px); }
.site-nav > a, .site-nav .nav-item > a { font-size: clamp(14px, 0.16vw + 13.5px, 15.5px); }
.nav-drop a { font-size: clamp(13.8px, 0.14vw + 13.4px, 15px); }
.hero h1 { font-size: clamp(28px, 3.2vw + 8px, 54px); }
.hero-sub { font-size: clamp(15px, 0.3vw + 14px, 17.5px); }
.hero-chips span { font-size: clamp(12.8px, 0.12vw + 12.5px, 14px); }
.block-head h2 { font-size: clamp(21px, 1vw + 16px, 31px); }
.block-head p { font-size: clamp(13.8px, 0.15vw + 13.4px, 15.2px); }
.card h3 { font-size: clamp(15.5px, 0.3vw + 14.5px, 18px); }
.card p { font-size: clamp(13.2px, 0.16vw + 12.7px, 14.8px); }
.card .price { font-size: clamp(14.8px, 0.2vw + 14px, 16.5px); }
.card-more { font-size: clamp(12.8px, 0.1vw + 12.6px, 14px); }
.news a { font-size: clamp(14px, 0.2vw + 13.5px, 15.8px); }
.news time { font-size: clamp(12.5px, 0.1vw + 12.3px, 13.6px); }
.breadcrumb { font-size: clamp(12.5px, 0.1vw + 12.3px, 13.8px); }
.page-head h1 { font-size: clamp(22px, 1vw + 16.5px, 31px); }
.detail h1 { font-size: clamp(22px, 1vw + 16.5px, 32px); }
.meta { font-size: clamp(12.5px, 0.1vw + 12.3px, 13.8px); }
.content { font-size: clamp(15px, 0.22vw + 14.3px, 17px); }
.content h2, .detail .h2 { font-size: clamp(18px, 0.55vw + 16px, 23px); }
.content h3 { font-size: clamp(16.5px, 0.35vw + 15.5px, 19.5px); }
table.spec { font-size: clamp(13.8px, 0.16vw + 13.4px, 15.4px); }
.pager a { font-size: clamp(13.8px, 0.12vw + 13.5px, 15px); }
.btn-line { font-size: clamp(13.8px, 0.15vw + 13.4px, 15.2px); }
.foot-name { font-size: clamp(16px, 0.35vw + 15px, 18.8px); }
.foot-desc, .foot-nav a, .foot-bar p { font-size: clamp(12.8px, 0.12vw + 12.5px, 14.2px); }
.cta-text h2 { font-size: clamp(20px, 0.8vw + 16.5px, 27px); }
.cta-text p { font-size: clamp(14px, 0.15vw + 13.6px, 15.2px); }
.svc-grid a { font-size: clamp(14px, 0.18vw + 13.5px, 15.6px); }
.about-text h2 { font-size: clamp(19px, 0.5vw + 17px, 23.5px); }
.e404 h1 { font-size: clamp(21px, 0.6vw + 17.5px, 26px); }

/* ---------- 单页全宽化：跟随 .wrap，与列表页同宽 ---------- */
@media (min-width: 1100px) {
  .detail.page { max-width: none; }
  .detail.page > .content { display: block; }
}

/* ---------- 移动端精修（随视口收窄自动调整） ---------- */
@media (max-width: 720px) {
  .wrap { --pad: 16px; }
  table.spec { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .content img { max-width: 100%; height: auto; }
  .lead { padding: 11px 13px; }
  .content a { overflow-wrap: anywhere; }
}
@media (max-width: 460px) {
  body { font-size: 14.5px; }
  .content { font-size: 15px; }
  .cls-hero, .biz-hero { padding-left: 16px; padding-right: 16px; }
}


/* ============================================================
   3.4 层（2026-09-15）—— 移动端汉堡菜单 + 美工精修
   ============================================================ */

/* ---------- 3.4 移动端汉堡菜单（checkbox hack，零 JS） ---------- */
.nav-toggle { position: absolute; opacity: 0; pointer-events: none; }
.nav-burger { display: none; }
@media (max-width: 1100px) {
  .site-header { position: relative; z-index: 90; }
  .nav-burger {
    display: inline-flex; flex-direction: column; justify-content: center; gap: 5px;
    margin-left: auto; width: 44px; height: 44px; padding: 10px;
    border: 1px solid var(--line); border-radius: 10px; background: #fff; cursor: pointer;
    -webkit-tap-highlight-color: transparent; }
  .nav-burger i { display: block; height: 2px; border-radius: 2px; background: var(--ink); transition: transform .25s ease, opacity .2s ease; }
  .nav-toggle:checked ~ .nav-burger i:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nav-toggle:checked ~ .nav-burger i:nth-child(2) { opacity: 0; }
  .nav-toggle:checked ~ .nav-burger i:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .site-nav {
    display: none; position: absolute; top: 100%; left: 0; right: 0; z-index: 95;
    flex-direction: column; flex-wrap: nowrap; align-items: stretch; gap: 2px;
    margin: 0; padding: 12px 16px 16px; max-height: calc(100vh - 120px); overflow-y: auto;
    background: #fff; border-bottom: 1px solid var(--line); box-shadow: 0 18px 40px rgba(15, 23, 42, .14);
    animation: navDrop .22s ease; }
  .nav-toggle:checked ~ .site-nav { display: flex; }
  @keyframes navDrop { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
  .site-nav > a, .site-nav .nav-item > a { display: flex; align-items: center; justify-content: space-between; margin: 0; padding: 12px 10px; border-radius: 10px; font-size: 15.5px; }
  .site-nav .nav-item { display: block; }
  /* 二级菜单在移动端静态展开，不再悬浮 */
  .site-nav .nav-drop {
    position: static; display: block; opacity: 1; visibility: visible; transform: none;
    box-shadow: none; border: 0; background: transparent; padding: 2px 0 6px 14px; min-width: 0; }
  .site-nav .nav-drop a { padding: 10px 10px; border-radius: 8px; }
  .site-nav .caret { transition: transform .2s; }
  .nav-search, .cls-search, .biz-search { margin-top: 6px; text-align: center; }
}
@media (min-width: 1101px) {
  .nav-burger { display: none !important; }
}


/* ---------- 3.4 美工精修 ---------- */
html { scroll-behavior: smooth; }
img { max-width: 100%; }
.page-head h1, .detail h1, .hero h1, .cls-page-head h1, .cls-detail h1, .biz-page-head h1, .biz-detail h1 { text-wrap: balance; }
.card, .cls-card, .biz-card { transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
/* hover 零闪烁铁律：抬升只许用阴影/描边表达，hover 元素几何一像素都不动
   （否则光标贴到卡片底边就会「抬升→踩空→掉 hover→回落」无限抖） */
.card:hover, .cls-card:hover, .biz-card:hover { box-shadow: var(--shadow-lg); border-color: #d8e3f6; }
.news a:hover { color: var(--pri); }
.breadcrumb a:hover { color: var(--pri); }
.foot-nav a:hover { color: var(--pri); }
.breadcrumb a { transition: color .15s; }

/* ============================================================
   3.5 图片间距收紧层（2026-09-15）—— 正文图片块级化 + 含图段落边距收窄
   ============================================================ */
.content img { display: block; max-width: 100%; height: auto; margin: 10px auto; }
.content p:has(> img), .content p:has(> span > img) { margin-bottom: 6px; }
.content p:has(> img) + p, .content p:has(> span > img) + p { margin-top: 0; }

/* ============================================================
   3.6 视觉升级层（2026-09-15）—— 按专业网页设计师标准统一设计体系
   圆角/阴影节奏、按钮体系、焦点态、滚动条、微交互全面归一
   ============================================================ */

/* ---------- 全局微基础 ---------- */
::selection { background: rgba(37, 99, 235, .16); color: var(--ink); }
* { scrollbar-width: thin; scrollbar-color: #cbd5e1 transparent; }
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; border: 2px solid transparent; background-clip: content-box; }
*::-webkit-scrollbar-thumb:hover { background: #94a3b8; border: 2px solid transparent; background-clip: content-box; }
*::-webkit-scrollbar-track { background: transparent; }

/* ---------- 按钮体系：主按钮渐变 + 按压反馈，线性按钮填充式 hover ---------- */
.btn-pri {
  background: linear-gradient(180deg, #3b82f6, #2563eb);
  box-shadow: 0 4px 14px rgba(37, 99, 235, .30), inset 0 1px 0 rgba(255, 255, 255, .18);
  border-radius: 10px;
}
.btn-pri:hover { background: linear-gradient(180deg, #2f74ee, #1d4ed8); }
.btn-pri:active { transform: translateY(0) scale(.98); box-shadow: 0 2px 8px rgba(37, 99, 235, .30); }
.btn-line {
  border: 1px solid #c7d7f7; border-radius: 10px; color: var(--pri);
  background: rgba(255, 255, 255, .75);
  transition: color .18s, background .18s, border-color .18s, transform .18s, box-shadow .18s;
}
.btn-line:hover { background: #fff; border-color: var(--pri); box-shadow: 0 6px 16px rgba(37, 99, 235, .12); }

/* ---------- 卡片：默认浅投影，hover 统一升起节奏 ---------- */
.card { border-radius: var(--radius); box-shadow: 0 2px 10px rgba(15, 23, 42, .05); border: 1px solid #e8edf4; }
.card:hover { box-shadow: var(--shadow); border-color: #d8e3f6; }

/* ---------- 新闻/翻页 hover 统一 ---------- */
.news li:hover { background: #f8fafd; }
.pager a { transition: color .15s, border-color .15s, background .15s; }
.pager a:hover { border-color: var(--pri); }

/* ---------- 表单控件统一（搜索框、留言表单等） ---------- */
input[type="text"], input[type="search"], input[type="email"], input[type="tel"], textarea, select {
  border-radius: 10px; border-color: #dbe2ec;
  transition: border-color .15s, box-shadow .15s;
}
input[type="text"]:hover, input[type="search"]:hover, input[type="email"]:hover, input[type="tel"]:hover, textarea:hover, select:hover { border-color: #b9c7de; }
input[type="text"]:focus, input[type="search"]:focus, input[type="email"]:focus, input[type="tel"]:focus, textarea:focus, select:focus {
  outline: 0; border-color: var(--pri); box-shadow: 0 0 0 3px rgba(37, 99, 235, .14);
}

/* ---------- 列表页头横幅与详情微调 ---------- */
.page-head { box-shadow: 0 8px 26px rgba(37, 99, 235, .07); }
.lead { border-radius: 10px; }

/* ================= 3.7 栏目侧栏层（侧栏 + 卡片网格） ================= */
.cat-layout { display: grid; grid-template-columns: 248px minmax(0, 1fr); gap: 30px; align-items: start; margin-top: 4px; }
.cat-side { position: sticky; top: 24px; }
.cat-side-box { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 2px 10px rgba(15, 23, 42, .05); overflow: hidden; }
.cat-side-title { padding: 14px 18px 13px; font-size: 15.5px; font-weight: 700; color: var(--ink); background: linear-gradient(180deg, #f6f9ff, #fff); border-bottom: 1px solid var(--line); }
.cat-side ul { list-style: none; margin: 0; padding: 10px; }
.cat-side li + li { margin-top: 2px; }
.cat-side a { display: flex; align-items: center; gap: 9px; padding: 9px 12px; border-radius: 8px; color: var(--text); text-decoration: none; font-size: 14.5px; line-height: 1.5; transition: background .15s, color .15s; }
.cat-side a::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: var(--line); flex: none; transition: background .15s; }
.cat-side a:hover { background: var(--soft); color: var(--pri); }
.cat-side a:hover::before { background: var(--pri); }
.cat-side a.on { background: var(--pri); color: #fff; font-weight: 600; }
.cat-side a.on::before { background: rgba(255, 255, 255, .85); }
@media (max-width: 960px) {
  .cat-layout { grid-template-columns: 1fr; gap: 18px; }
  .cat-side { position: static; }
  .cat-side-title { display: none; }
  .cat-side ul { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px; }
  .cat-side li + li { margin-top: 0; }
  .cat-side a { padding: 6px 14px; border-radius: 999px; border: 1px solid var(--line); font-size: 13.5px; }
  .cat-side a::before { display: none; }
  .cat-side a.on { border-color: var(--pri); background: var(--soft); color: var(--pri); }
}

/* ================= 3.8 首页营销层（hero双CTA / 优势 / 流程 / 新闻卡） ================= */
.hero-btns { margin: 24px 0 0; }
.hero-btns a { margin-right: 12px; }
.adv-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; list-style: none; margin: 0; padding: 0; }
.adv-grid li { background: #ffffff; border: 1px solid var(--line); border-radius: var(--radius); padding: 26px 24px; transition: transform .22s ease, box-shadow .22s ease; }
.adv-grid li:hover { box-shadow: var(--shadow); }
.adv-no { display: inline-block; font-size: 26px; font-weight: 800; line-height: 1; color: var(--pri); opacity: .9; letter-spacing: 1px; }
.adv-grid h3 { margin: 12px 0 8px; font-size: 17px; color: var(--ink); }
.adv-grid p { margin: 0; font-size: 14px; line-height: 1.75; color: var(--muted); }
.steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; list-style: none; margin: 0; padding: 0; counter-reset: step; }
.steps li { position: relative; background: #ffffff; border: 1px solid var(--line); border-radius: var(--radius); padding: 24px 22px; }
.step-no { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: var(--pri); color: #fff; font-weight: 800; font-size: 16px; }
.steps h3 { margin: 14px 0 6px; font-size: 16.5px; color: var(--ink); }
.steps p { margin: 0; font-size: 13.8px; line-height: 1.7; color: var(--muted); }
.news-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; list-style: none; margin: 0; padding: 0; }
.news-cards li { background: #ffffff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; transition: transform .22s ease, box-shadow .22s ease; }
.news-cards li:hover { box-shadow: var(--shadow); }
.news-cards a { display: flex; flex-direction: column; gap: 8px; height: 100%; padding: 22px 22px 20px; color: inherit; text-decoration: none; }
.news-cards time { font-size: 13px; font-weight: 700; color: var(--pri); letter-spacing: .5px; margin-top: auto; padding-top: 4px; } /* 2026-09-29 用户指令：时间放描述下方，底部对齐 */
.news-cards h3 { margin: 0; font-size: 16.5px; line-height: 1.55; color: var(--ink); }
.news-cards p { margin: 0; font-size: 13.8px; line-height: 1.7; color: var(--muted); }
.news-cards .news-more { margin-top: auto; padding-top: 6px; font-size: 13px; font-weight: 600; color: var(--pri); }
.news-cards .news-media { margin: -22px -22px 12px; height: 150px; background: linear-gradient(135deg, #eef4ff, #e3edfd); }
.news-cards .news-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.news-cards .news-media .news-ph { display: flex; align-items: center; justify-content: center; height: 100%; color: #9db6e8; }
.news-cards .news-media .news-ph svg { width: 34px; height: 34px; }
@media (max-width: 1100px) {
  .adv-grid { grid-template-columns: repeat(2, 1fr); }
  .steps { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .adv-grid { grid-template-columns: 1fr; }
  .steps { grid-template-columns: 1fr; }
  .news-cards { grid-template-columns: 1fr; }
  .hero-btns a { width: 100%; margin: 0 0 10px; text-align: center; }
  .hero-btns { display: block; }
}

/* ================= 3.9 详情转化层（详情页底部咨询CTA） ================= */
.detail-cta { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 18px; margin: 34px 0 8px; padding: 28px 30px; background: linear-gradient(135deg, #f2f7ff, #eaf1fe); border: 1px solid #cdd9f3; border-radius: var(--radius); }
.detail-cta-text h2, .detail-cta-text .detail-cta-t { margin: 0 0 6px; font-size: 20px; color: var(--ink); }
.detail-cta-text p { margin: 0; font-size: 14.5px; color: var(--muted); }
.detail-cta-btns { margin: 0; }
.detail-cta .btn-pri { display: inline-block; padding: 11px 26px; background: var(--pri); color: #fff; border-radius: 999px; font-weight: 700; text-decoration: none; margin-right: 10px; transition: transform .18s, box-shadow .18s; }
.detail-cta .btn-pri:hover { box-shadow: 0 10px 24px rgba(37, 99, 235, .22); }
.detail-cta .btn-ghost { display: inline-block; padding: 11px 26px; border: 1px solid var(--pri); color: var(--pri); border-radius: 999px; text-decoration: none; transition: transform .18s; }
.detail-cta .btn-ghost:hover { border-color: var(--pri); color: #ffffff; box-shadow: 0 8px 18px rgba(37, 99, 235, .20); }
@media (max-width: 720px) {
  .detail-cta { padding: 22px 20px; }
  .detail-cta .btn-pri, .detail-cta .btn-ghost { display: block; text-align: center; margin: 0 0 10px; }
}

/* ===== 3.10 导航层：吸顶 + 行动按钮 + 精修 ===== */
@media (min-width: 861px) {
  .site-header {
    position: sticky; top: 0; z-index: 100;
    box-shadow: 0 8px 30px rgba(15, 23, 42, .07);
    backdrop-filter: blur(8px) saturate(1.15);
    -webkit-backdrop-filter: blur(8px) saturate(1.15); }
  .site-nav .caret { transition: transform .2s ease; }
  .site-nav .nav-item:hover .caret { transform: rotate(180deg); }
}
.site-nav .nav-cta {
  display: inline-block; margin-left: 14px; padding: 9px 20px;
  border-radius: 999px; background: var(--pri); color: #fff;
  font-weight: 600; font-size: 14.5px; text-decoration: none; white-space: nowrap;
  box-shadow: 0 6px 16px rgba(37, 99, 235, .28);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.site-nav .nav-cta:hover { background: var(--pri-d); box-shadow: 0 10px 24px rgba(37, 99, 235, .34); color: #fff; }
.site-nav .nav-cta:active { transform: translateY(0); }
@media (max-width: 1100px) {
  .site-nav .nav-cta { display: block; text-align: center; margin: 10px 4px 2px; padding: 11px 18px; }
}

/* ===== 3.11 关于图文层 ===== */
.about-band { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 40px; align-items: center; }
.about-img { border-radius: var(--radius); overflow: hidden; box-shadow: 0 12px 32px rgba(37, 99, 235, .14); }
.about-img img { display: block; width: 100%; height: 100%; min-height: 240px; object-fit: cover; }
@media (max-width: 860px) {
  .about-band { grid-template-columns: 1fr; gap: 22px; }
  .about-img img { min-height: 0; aspect-ratio: 16/9; }
}

/* ===== 3.12 宽屏栏目层：横向筛选胶囊 ===== */
.cat-pills { display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0 28px; }
.cat-pills a {
  display: inline-block; padding: 8px 20px; border-radius: 999px;
  background: #fff; border: 1px solid var(--line); color: var(--text);
  font-size: 14.5px; text-decoration: none;
  transition: color .18s, border-color .18s, background .18s, transform .18s;
}
.cat-pills a:hover { color: var(--pri); border-color: var(--pri); }
.cat-pills a.on { background: var(--pri); border-color: var(--pri); color: #fff; font-weight: 600; }
.cat-main { margin-top: 2px; }
@media (max-width: 720px) { .cat-pills { gap: 8px; } .cat-pills a { padding: 7px 15px; font-size: 13.5px; } }

/* ===== 3.13 导航精修层：下划线菜单 + 搜索图标 + 下拉卡片 ===== */
@media (min-width: 861px) {
  .site-nav > a, .site-nav .nav-item > a { position: relative; background: transparent; padding: 10px 14px; font-weight: 500; }
  .site-nav > a:hover, .site-nav > a.active,
  .site-nav .nav-item > a:hover, .site-nav .nav-item > a.active { background: transparent; color: var(--pri); }
  .site-nav > a::after, .site-nav .nav-item > a::after {
    content: ''; position: absolute; left: 14px; right: 14px; bottom: 3px; height: 2px;
    border-radius: 2px; background: var(--pri); transform: scaleX(0); transform-origin: center;
    transition: transform .2s ease; }
  .site-nav > a:hover::after, .site-nav > a.active::after,
  .site-nav .nav-item:hover > a::after, .site-nav .nav-item > a.active::after { transform: scaleX(1); }
  .site-nav .nav-search {
    background: transparent !important; color: var(--text) !important;
    display: inline-flex; align-items: center; justify-content: center;
    width: 38px; height: 38px; padding: 0; margin-left: 6px; border-radius: 50%; }
  .site-nav .nav-search:hover, .site-nav .nav-search.active { background: #eff4ff !important; color: var(--pri) !important; }
  .nav-drop {
    border: 1px solid var(--line); border-radius: 12px; padding: 8px;
    box-shadow: 0 18px 44px rgba(15, 23, 42, .13);
    transform: translateY(6px); opacity: 0; visibility: hidden;
    transition: transform .18s ease, opacity .18s ease, visibility .18s; }
  .site-nav .nav-item:hover > .nav-drop, .site-nav .nav-item:focus-within > .nav-drop {
    display: block; transform: translateY(0); opacity: 1; visibility: visible; }
}

/* ---------- 站内搜索页 ---------- */
.search-box { display: flex; gap: 12px; max-width: 660px; margin: 4px 0 24px; }
.search-box input { flex: 1; min-width: 0; height: 46px; padding: 0 16px; border: 1.5px solid var(--line); border-radius: 12px; font-size: 15px; font-family: inherit; color: var(--ink); background: #fff; }
.search-box input:focus { outline: none; border-color: var(--pri); }
.search-box .btn-pri { height: 46px; padding: 0 26px; border-radius: 12px; }
.search-meta { color: var(--muted); font-size: 14px; margin: -8px 0 24px; }

/* ---------- 页脚备案行 ---------- */
.foot-legal { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 18px; margin: 0; font-size: 13px; color: var(--muted); }
.foot-legal a { color: var(--pri); text-decoration: none; transition: color .15s; }
.foot-legal a:hover { color: #1d4ed8; }
.foot-police { display: inline-flex; align-items: center; gap: 5px; }
.foot-police img { flex: none; }

/* ============================================================
   企业版式层（E-Series）：栏目列表 / 详情 / 单页 / 404
   ============================================================ */
/* ---- 1. 页面头带 ---- */
.e-hero { position: relative; z-index: 1; overflow: hidden; padding: 42px 0; background: linear-gradient(180deg, #eef4ff 0%, #fafcff 100%); border-bottom: 1px solid var(--line); }
.e-hero::before, .e-hero::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; }
.e-hero::before { right: -140px; top: -160px; width: 380px; height: 380px; background: radial-gradient(circle, rgba(37, 99, 235, .16), transparent 65%); }
.e-hero::after { left: -110px; bottom: -180px; width: 340px; height: 340px; background: radial-gradient(circle, rgba(124, 58, 237, .08), transparent 60%); }
/* 企业版模板内层不再包 .wrap（外层 main 已是 wrap 容器），hero 上下留白由自身承担 */
.e-crumb { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 18px; font-size: 12.5px; color: var(--muted); }
.e-crumb a { color: var(--muted); }
.e-crumb a:hover { color: var(--pri); }
.e-crumb .sep { color: #cbd5e1; }
.e-eyebrow { display: inline-flex; align-items: center; gap: 9px; margin: 0 0 10px; font-size: 12.5px; font-weight: 800; letter-spacing: 3px; color: var(--pri); }
.e-eyebrow::before { content: ""; width: 24px; height: 2px; border-radius: 2px; background: var(--pri); }
.e-hero h1 { margin: 0 0 12px; font-size: clamp(26px, 3.2vw, 38px); line-height: 1.25; letter-spacing: .5px; color: var(--ink); }
.e-desc { margin: 0; max-width: 780px; color: var(--muted); font-size: 15px; line-height: 1.85; }
.e-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 24px; margin: 18px 0 0; font-size: 13.5px; color: var(--muted); }
.e-meta b { color: var(--text); font-weight: 600; }
.e-num { font-size: 22px; font-weight: 800; color: var(--pri); }
/* ---- 2. 列表页 ---- */
.e-body { padding: 30px 0 10px; }
.e-narrow { max-width: 100%; margin-left: auto; margin-right: auto; }
.e-feature { display: grid; grid-template-columns: 1.12fr 1fr; background: #fff; border: 1px solid var(--line); border-radius: 18px; overflow: hidden; margin: 0 0 24px; transition: box-shadow .22s ease, transform .22s ease; }
.e-feature:hover { box-shadow: var(--shadow-lg); }
.e-feature-media { position: relative; min-height: 300px; background: linear-gradient(135deg, #e8eefc, #f6f8fd); }
.e-feature-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.e-feature-body { display: flex; flex-direction: column; justify-content: center; gap: 14px; padding: 36px 38px; }
.e-feature-body h2 { margin: 0; font-size: clamp(19px, 1.9vw, 24px); line-height: 1.5; color: var(--ink); }
.e-feature-body h2 a { color: inherit; }
.e-feature-body p { margin: 0; color: var(--muted); font-size: 14.5px; line-height: 1.9; }
.e-flag { position: absolute; left: 16px; top: 16px; z-index: 2; padding: 4px 13px; border-radius: 999px; background: rgba(37, 99, 235, .94); color: #fff; font-size: 12px; font-weight: 700; letter-spacing: 2px; box-shadow: 0 4px 12px rgba(37, 99, 235, .35); }
.list-page .card-media { position: relative; }
.e-date { position: absolute; left: 14px; top: 14px; z-index: 2; padding: 4px 11px; border-radius: 9px; background: rgba(255, 255, 255, .95); color: var(--pri); font-size: 12px; font-weight: 700; letter-spacing: .5px; box-shadow: 0 2px 10px rgba(15, 23, 42, .12); }
.e-meta2 { display: flex; gap: 14px; margin-top: auto; padding-top: 12px; border-top: 1px dashed var(--line); color: var(--muted); font-size: 12.5px; }
@media (min-width: 1100px) { .list-page .grid { grid-template-columns: repeat(3, 1fr); } .list-page .card-media { height: 190px; } }
.list-page .pager { justify-content: center; }
/* ---- 3. 详情页 ---- */
.e-meta-bar { display: flex; flex-wrap: wrap; gap: 8px 26px; padding: 14px 20px; margin: 20px 0 26px; background: var(--soft); border-radius: 12px; font-size: 13.5px; color: var(--muted); }
.e-meta-bar b { color: var(--text); font-weight: 600; }
.e-content-card { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 34px 38px 30px; }
.e-content-card .content { font-size: 15.5px; line-height: 2.05; }
.e-content-card .content img { border-radius: 12px; }
.e-content-card .content ul, .e-content-card .content ol { padding-left: 24px; margin: 0 0 16px; }
.e-content-card .content li { margin: 0 0 6px; }
.e-postnav { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 30px 0 0; }
.e-postnav a { display: flex; flex-direction: column; gap: 7px; padding: 18px 22px; background: #fff; border: 1px solid var(--line); border-radius: 14px; min-width: 0; transition: border-color .18s, box-shadow .18s, transform .18s; }
.e-postnav a:hover { border-color: var(--pri); box-shadow: var(--shadow); }
.e-postnav .dir { font-size: 12.5px; color: var(--muted); letter-spacing: 1px; }
.e-postnav .t { font-size: 14.5px; font-weight: 600; color: var(--ink); line-height: 1.6; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.e-postnav .next { text-align: right; }
.e-rel { margin: 46px 0 0; }
.e-rel-h { display: flex; align-items: center; gap: 11px; margin: 0 0 18px; font-size: 20px; color: var(--ink); letter-spacing: .5px; }
.e-rel-h::before { content: ""; width: 4px; height: 22px; border-radius: 2px; background: var(--pri); }
.e-rel-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.e-rel-card { display: flex; flex-direction: column; gap: 8px; padding: 20px 22px; background: #fff; border: 1px solid var(--line); border-radius: 14px; transition: border-color .18s, box-shadow .18s, transform .18s; }
.e-rel-card:hover { border-color: var(--pri); box-shadow: var(--shadow); }
.e-rel-card .t { font-size: 14.5px; font-weight: 600; color: var(--ink); line-height: 1.65; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.e-rel-card time { font-size: 12.5px; color: var(--muted); }
@media (max-width: 860px) { .e-rel-grid { grid-template-columns: 1fr; } .e-postnav { grid-template-columns: 1fr; } .e-postnav .next { text-align: left; } }
/* ---- 4. 单页 ---- */
.e-page-card { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 36px 40px; margin: 30px 0 0; }
/* ---- 5. 404 ---- */
.e-404 { text-align: center; padding: 76px 0 84px; }
.e-404-num { font-size: clamp(72px, 10vw, 120px); font-weight: 800; line-height: 1; letter-spacing: 4px; background: linear-gradient(135deg, #2563eb, #7c3aed); -webkit-background-clip: text; background-clip: text; color: transparent; }
.e-404-t { margin: 18px 0 8px; font-size: 22px; color: var(--ink); }
.e-404 p { margin: 0; color: var(--muted); }
.e-404-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin-top: 30px; }
/* ---- 6. 响应式收口 ---- */
@media (max-width: 860px) { .e-feature { grid-template-columns: 1fr; } .e-feature-media { min-height: 210px; } .e-feature-body { padding: 24px 22px; } }
@media (max-width: 720px) { .e-page-card { padding: 26px 20px; } .e-hero { padding-top: 32px; padding-bottom: 32px; } .e-hero h1 { font-size: 24px; } }

/* ===== 宽屏自适应：1920px 以上放宽容器，保持满屏观感 ===== */
@media (min-width: 1920px) {
  .wrap { max-width: 1840px; --pad: 48px; }
}

/* ===== 首页/搜索页区块英文眉标 ===== */
.bk-eyebrow { margin: 0 0 8px; font-size: 12.5px; font-weight: 800; letter-spacing: 3px; color: var(--pri); }

/* ===== 插件模板接入：blocks 运营块位 + tags 标签云 ===== */
.home-block { margin: 26px 0 0; }
.home-block .seo-block-text { font-size: 14.5px; line-height: 1.9; color: var(--text); }
.home-block .seo-block-html { font-size: 14.5px; line-height: 1.9; color: var(--text); }
.cat-side-tags .seo-tag-cloud { padding: 14px 18px 16px; display: flex; flex-wrap: wrap; gap: 8px 10px; line-height: 1.8; }
.cat-side-tags .seo-tag-cloud a { color: var(--muted); text-decoration: none; border: 1px solid var(--line); border-radius: 999px; padding: 2px 11px; background: #fff; transition: color .15s, border-color .15s; }
.cat-side-tags .seo-tag-cloud a:hover { color: var(--pri); border-color: var(--pri); }

/* ============================================================
   4.0 转化与体验升级层（2026-09-16）—— 首屏信任条 / 卡片图标兜底 / 页脚联系列 / 搜索高亮
   ============================================================ */

/* ---------- 首屏信任条：无数字、中性文案，任何客户站可用 ---------- */
.hero-facts {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 10px;
  list-style: none; margin: 26px 0 0; padding: 0;
}
.hero-facts li {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 20px; background: #fff; border: 1px solid #cdd9f3;
  border-radius: 12px; box-shadow: 0 4px 14px rgba(37, 99, 235, .07);
}
.hero-facts b { font-size: 14.5px; color: var(--pri); letter-spacing: .5px; }
.hero-facts span { font-size: 13px; color: var(--text); }
@media (max-width: 720px) {
  .hero-facts { gap: 8px; margin-top: 20px; }
  .hero-facts li { padding: 8px 14px; }
  .hero-facts b { font-size: 13.5px; }
  .hero-facts span { font-size: 12px; }
}
@media (max-width: 460px) {
  .hero-facts li { flex: 1 1 calc(50% - 8px); justify-content: center; flex-direction: column; gap: 2px; text-align: center; }
}

/* ---------- 卡片图标兜底：无缩略图时不空白 ---------- */
.card-ph {
  display: flex; align-items: center; justify-content: center;
  width: 100%; height: 100%; color: #9db6e8;
  background: linear-gradient(135deg, #eef4ff, #e3edfd);
}
.card-ph svg { width: 40px; height: 40px; }
@media (max-width: 720px) { .card-ph svg { width: 34px; height: 34px; } }

/* ---------- 页脚：联系列 + 导航标题 ---------- */
.foot-nav .foot-title { margin: 0 0 10px; font-size: 15px; font-weight: 700; color: var(--ink); letter-spacing: .5px; text-decoration: none; transition: color .15s; }
.foot-nav .foot-title:hover { color: var(--pri); }
.foot-nav { flex-direction: column; align-items: flex-start; }
.foot-nav a { margin: 0 0 7px; }
.foot-contact { list-style: none; margin: 14px 0 0; padding: 0; }
.foot-contact li { display: flex; align-items: baseline; gap: 8px; margin: 7px 0; font-size: 13.5px; line-height: 1.6; }
.foot-contact .fc-label {
  flex: none; min-width: 34px; padding: 1px 8px; border-radius: 6px;
  background: rgba(37, 99, 235, .10); color: var(--pri); font-size: 12px; font-weight: 600;
  text-align: center;
}
.foot-contact a { color: var(--text); text-decoration: none; transition: color .15s; }
.foot-contact a:hover { color: var(--pri); }
@media (max-width: 860px) { .foot-contact { margin-top: 10px; } }

/* ---------- 搜索关键词高亮 ---------- */
mark {
  background: rgba(37, 99, 235, .14); color: var(--ink);
  border-radius: 3px; padding: 0 2px;
}

/* ============================================================
   5.0 营销转化层（2026-09-16）—— 漏斗结构 / 痛点 / 成果带 / 联系卡 / FAQ / CTA 强化
   ============================================================ */

/* ---------- 营销顶部信息条（高端浅色，克制不压） ---------- */
.topbar { background: #f8fafc; border-bottom: 1px solid #eef2f7; color: #64748b; font-size: 12.5px; }
.topbar-in { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 34px; }
.topbar-contacts { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 0; }
.topbar-contacts a, .topbar-contacts span { display: inline-flex; align-items: center; gap: 6px; color: #64748b; text-decoration: none; line-height: 1.4; transition: color .15s; }
.topbar-contacts a:hover { color: #1d4ed8; }
.topbar-contacts svg { opacity: .6; flex: none; }
.topbar-addr { color: #94a3b8; }
.topbar-slogan { margin: 0; color: #94a3b8; letter-spacing: 1px; }
@media (max-width: 860px) {
  .topbar-slogan { display: none; }
  .topbar-in { justify-content: center; }
  .topbar-addr { display: none; }
}

/* ---------- 首屏强化：网格底纹 + 光斑 ---------- */
.hero {
  background:
    radial-gradient(60% 130% at 50% -12%, rgba(37, 99, 235, .12), transparent 60%),
    radial-gradient(38% 60% at 88% 12%, rgba(124, 58, 237, .07), transparent 65%),
    radial-gradient(30% 50% at 8% 82%, rgba(59, 130, 246, .08), transparent 60%),
    linear-gradient(rgba(37, 99, 235, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(37, 99, 235, .035) 1px, transparent 1px),
    linear-gradient(180deg, #f4f8ff 0%, #eaf1fe 100%);
  background-size: auto, auto, auto, 46px 46px, 46px 46px, auto;
}
.hero-facts li { box-shadow: 0 6px 18px rgba(37, 99, 235, .10); }
.hero-facts b { font-size: 15px; }
.hero-btns .btn-pri, .hero-btns .btn-ghost { display: inline-block; padding: 13px 34px; border-radius: 999px; font-size: 15.5px; }
.hero-btns .btn-ghost { background: rgba(255, 255, 255, .7); }

/* ---------- 痛点共鸣区 ---------- */
.pain-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; list-style: none; margin: 0; padding: 0; }
.pain-grid li { position: relative; background: #fff; border: 1px solid var(--line); border-top: 3px solid #93b4f2; border-radius: var(--radius); padding: 26px 22px 22px; transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease; }
.pain-grid li:hover { box-shadow: var(--shadow); border-top-color: var(--pri); }
.pain-no { display: block; font-size: 26px; font-weight: 800; line-height: 1; color: #c7d7f7; letter-spacing: 1px; }
.pain-grid h3 { margin: 12px 0 8px; font-size: 16.5px; line-height: 1.5; color: var(--ink); }
.pain-grid p { margin: 0 0 12px; font-size: 13.8px; line-height: 1.8; color: var(--muted); }
.pain-grid a { font-size: 13.5px; font-weight: 600; color: var(--pri); }
.pain-grid a:hover { color: var(--pri-d); }

/* ---------- 数据成果带（blocks code=home_stats，数字条约定：<b>/<strong> 为大数字）· 统一浅色 ---------- */
.stats-band { margin: 34px 0 0; background: linear-gradient(135deg, #f0f6ff, #e6effe); border: 1px solid #e2ecfd; border-radius: 20px; overflow: hidden; }
.stats-in { display: flex; flex-wrap: wrap; justify-content: space-around; gap: 22px 30px; padding: 34px 24px; }
.stats-in > * { text-align: center; }
.stats-in b, .stats-in strong { display: block; font-size: clamp(26px, 3vw, 36px); font-weight: 800; line-height: 1.25; color: #1d4ed8; letter-spacing: .5px; }
.stats-in b, .stats-in strong { font-family: "Segoe UI", "Microsoft YaHei", sans-serif; }
.stats-in p, .stats-in span, .stats-in div > span:last-child { color: #475569; font-size: 14px; line-height: 1.6; }

/* ---------- 服务信息卡（custom_fields 插件字段网格） ---------- */
.svc-info { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; margin: 6px 0 26px; padding: 0; }
.svc-info-item { background: #f6f9ff; border: 1px solid #dbe7fb; border-radius: 12px; padding: 14px 16px; }
.svc-info dt { font-size: 12.5px; color: var(--muted); margin-bottom: 4px; }
.svc-info dd { margin: 0; font-size: 15px; font-weight: 600; color: var(--ink); line-height: 1.6; }
@media (max-width: 720px) { .svc-info { grid-template-columns: 1fr 1fr; } }

/* ---------- 列表/单页头带 CTA ---------- */
.e-hero-cta { margin: 20px 0 0; }
.e-hero-cta .btn-pri, .e-hero-cta .btn-ghost { display: inline-block; padding: 10px 24px; border-radius: 999px; margin-right: 10px; font-size: 14px; }
@media (max-width: 720px) {
  .e-hero-cta .btn-pri, .e-hero-cta .btn-ghost { display: block; text-align: center; margin: 0 0 10px; }
}

/* ---------- 页头带左右留白：避免文字贴边 ---------- */
.e-hero { padding-left: 26px; padding-right: 26px; }
@media (max-width: 720px) { .e-hero { padding-left: 16px; padding-right: 16px; } }

/* ---------- 全站统一面包屑（hero 下方）· 高端浅色 ---------- */
.breadcrumb {
  display: flex; flex-wrap: wrap; align-items: center;
  margin: 0 0 28px;
  padding: 11px 26px;
  font-size: 12.5px;
  letter-spacing: .2px;
  color: #64748b;
  background: #f8fafc;
  border: 1px solid #eef2f7;
  border-radius: 10px;
  box-sizing: border-box;
}
.breadcrumb a { color: #64748b; text-decoration: none; transition: color .15s; }
.breadcrumb a:hover { color: #1d4ed8; }
.breadcrumb .sep { margin: 0 10px; color: #cbd5e1; font-size: 11px; }
.breadcrumb [aria-current] { color: #0f172a; font-weight: 600; }
@media (max-width: 720px) {
  .breadcrumb { margin: 0 0 20px; padding: 10px 16px; font-size: 12px; }
}

/* ---------- 详情转化 CTA 强化 ---------- */
.detail-cta-wx { margin: 12px 0 0; font-size: 13.5px; color: var(--muted); }
.detail-cta-wx b { color: var(--ink); font-weight: 600; }

/* ---------- 栏目侧栏联系卡 ---------- */
.cat-side-contact .side-contact-list { padding: 14px; }
.side-contact-list li { display: flex; align-items: baseline; gap: 8px; padding: 6px 4px; font-size: 13.5px; line-height: 1.6; }
.side-contact-list .sc-label { flex: none; min-width: 34px; text-align: center; padding: 1px 8px; border-radius: 6px; background: rgba(37, 99, 235, .10); color: var(--pri); font-size: 12px; font-weight: 600; }
.side-contact-list a { color: var(--text); }
.side-contact-list a:hover { color: var(--pri); }
.side-contact-btns { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 14px 16px; }
.btn-sm { padding: 7px 16px; font-size: 13px; border-radius: 999px; }
@media (max-width: 960px) {
  .cat-side-contact { margin-top: 12px; }
}

/* ---------- 联系页大卡（仅限 page/index.html 的 .contact-cards 区块）
   注意：必须带 .contact-cards 前缀。原先裸写 .contact-card 的 display:flex
   会外溢到「联系我们」页（.contact-layout 里的白卡），把卡内 h3 与列表挤成并排两栏，
   症状是卡片里的文字竖着排一行一个字。 ---------- */
.contact-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin: 6px 0 20px; }
.contact-cards .contact-card { display: flex; align-items: center; gap: 14px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 20px 22px; box-shadow: 0 2px 10px rgba(15, 23, 42, .05); }
.contact-cards .cc-icon { flex: none; width: 46px; height: 46px; border-radius: 12px; background: rgba(37, 99, 235, .10); color: var(--pri); display: flex; align-items: center; justify-content: center; }
.contact-cards .contact-card b { display: block; font-size: 15px; color: var(--ink); margin-bottom: 3px; }
.contact-cards .contact-card p { margin: 0; font-size: 14px; color: var(--muted); }
.contact-cards .contact-card a { color: var(--pri); font-weight: 600; }
.contact-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 6px 0 30px; }
.contact-actions .btn-pri, .contact-actions .btn-ghost { display: inline-block; padding: 11px 26px; border-radius: 999px; font-size: 14.5px; }

/* ---------- FAQ（details/summary 展开，零 JS；也兼容 blocks 写入的 .faq-panel 内容） ---------- */
.faq-panel { max-width: none; margin: 0; } /* 2026-09-19：常见问题面板左右与其它区块对齐，不再 860px 居中收窄 */
.faq-panel details { background: #fff; border: 1px solid var(--line); border-radius: 14px; margin: 0 0 12px; overflow: hidden; transition: box-shadow .18s ease, border-color .18s ease; }
.faq-panel details[open] { box-shadow: var(--shadow); border-color: #b9cdf5; }
.faq-panel summary { cursor: pointer; list-style: none; padding: 18px 48px 18px 22px; font-size: 15.5px; font-weight: 600; color: var(--ink); position: relative; line-height: 1.6; }
.faq-panel summary::-webkit-details-marker { display: none; }
.faq-panel summary::after { content: '+'; position: absolute; right: 20px; top: 50%; transform: translateY(-50%); font-size: 20px; font-weight: 400; color: var(--pri); transition: transform .18s ease; }
.faq-panel details[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.faq-panel details p { margin: 0; padding: 0 22px 18px; font-size: 14.5px; color: var(--muted); line-height: 1.85; }

/* ---------- 区块底部「更多」 ---------- */
.block-more { text-align: center; margin: 26px 0 0; }
.block-more .btn-pri, .block-more .btn-line { display: inline-block; padding: 11px 30px; border-radius: 999px; font-size: 14.5px; }

/* ---------- 转化 CTA 横幅（统一浅色系：浅蓝底 + 深蓝主按钮） ---------- */
.cta-band { background: linear-gradient(135deg, #eef4ff 0%, #e0ecfe 100%); color: var(--ink); position: relative; overflow: hidden; border: 1px solid #dbe7fb; box-shadow: 0 10px 28px rgba(37, 99, 235, .10); }
.cta-band::before { content: ""; position: absolute; right: -120px; top: -140px; width: 340px; height: 340px; border-radius: 50%; background: radial-gradient(circle, rgba(37, 99, 235, .08), transparent 65%); pointer-events: none; }
.cta-band::after { content: ""; position: absolute; left: -80px; bottom: -160px; width: 300px; height: 300px; border-radius: 50%; background: radial-gradient(circle, rgba(147, 197, 253, .22), transparent 60%); pointer-events: none; }
.cta-inner { position: relative; z-index: 1; }
.cta-text h2 { color: #0f172a; }
.cta-text p { color: #475569; }
.cta-btns .btn-pri { background: #2563eb; color: #fff; box-shadow: 0 8px 20px rgba(37, 99, 235, .28); }
.cta-btns .btn-pri:hover { background: #1d4ed8;  box-shadow: 0 12px 26px rgba(37, 99, 235, .32); }
.cta-btns .btn-ghost { border-color: #93b4f2; color: #1d4ed8; }
.cta-btns .btn-ghost:hover { background: rgba(37, 99, 235, .06); border-color: #2563eb; color: #1d4ed8; }
.btn-line-inv { display: inline-block; padding: 11px 26px; border: 1px solid #93b4f2; color: #1d4ed8; border-radius: 999px; text-decoration: none; font-size: 14.5px; transition: background .18s, transform .18s; }
.btn-line-inv:hover { background: rgba(37, 99, 235, .06); color: #1d4ed8; }

/* ---------- 搜索空结果转化入口 ---------- */
.search-fallback { margin: 6px 0 26px; padding: 24px 22px; background: #f6f9ff; border: 1px dashed #b9cdf5; border-radius: 14px; text-align: center; }
.search-fallback-t { margin: 0 0 14px; font-size: 14.5px; color: var(--muted); }
.search-fallback-links { margin: 0; display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }

/* ---------- 404 搜索框 ---------- */
.e404-search { margin: 18px auto 8px; }
.e404-search input { text-align: center; }

/* ---------- 5.0 响应式 ---------- */
@media (max-width: 1100px) { .pain-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) {
  .pain-grid { grid-template-columns: 1fr; gap: 14px; }
  .stats-in { padding: 26px 18px; }
  .stats-in > * { flex: 1 1 calc(50% - 30px); }
  .contact-card { padding: 16px 18px; }
}

/* ---------- 尊重减弱动效偏好（系统辅助功能） ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .card:hover, .card-media img, .btn-pri, .btn-line { transform: none !important; }
}

/* ============================================================
   5.1 宽屏营销层（2026-09-16）—— 全站宽屏化 + 营销视觉统一
   ============================================================ */

/* ---------- 宽屏：列宽放宽，区块更大气 ---------- */
@media (min-width: 1100px) {
  .hero-sub { max-width: 800px; }
  .e-desc { max-width: 940px; }
  .search-box { max-width: 880px; }
  .e-content-card { padding: 44px 52px 40px; }
  .e-page-card { padding: 44px 52px; }
  .e-404 { padding: 90px 0 100px; }
}

/* ---------- 宽屏：列表网格 4 列 ---------- */
@media (min-width: 1500px) {
  .list-page .grid { grid-template-columns: repeat(4, 1fr); }
}

/* ---------- 宽屏：FAQ 两列（含 blocks 版） ---------- */
@media (min-width: 960px) {
  .faq-panel { max-width: none; display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; align-items: start; }
  .faq-panel .seo-block { display: contents; }
}
@media (max-width: 959px) {
  .faq-panel { max-width: none; margin: 0; } /* 2026-09-19：常见问题面板左右与其它区块对齐，不再 860px 居中收窄 */
}
.faq-panel details { margin-bottom: 12px; }

/* ---------- 详情页：上下篇/相关阅读宽屏间距 ---------- */
@media (min-width: 1400px) {
  .e-postnav { gap: 22px; }
  .e-rel-grid { gap: 22px; }
}

/* ============================================================
   5.2 全站营销细节层（2026-09-16）—— 卡片整齐 + 正文阅读宽度 + 宽屏呼吸
   ============================================================ */

/* ---------- 1. 卡片标题/摘要两行截断，列表整齐等高 ---------- */
.card h3, .news-cards h3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.card p, .news-cards p { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.e-rel-card .t { -webkit-line-clamp: 2; }

/* ---------- 2. 详情/单页正文宽屏阅读宽度（排版专业留白） ---------- */
@media (min-width: 1280px) {
  .e-content-card .content:not(:has(> .toc-box)), .e-page-card .content:not(:has(> .toc-box)) { max-width: 980px; margin-left: auto; margin-right: auto; }
  .e-content-card .content:has(> .toc-box), .e-page-card .content:has(> .toc-box) { max-width: 1320px; margin-left: auto; margin-right: auto; }
  .e-content-card .content img, .e-page-card .content img { border-radius: 14px; }
}

/* ---------- 3. 宽屏区块间距放大（呼吸感） ---------- */
@media (min-width: 1100px) {
  .block { padding: 78px 0 20px; }
  .block-head { margin-bottom: 46px; }
  .cta-band { margin: 66px 0 0; padding: 34px 48px; }
  .detail-cta { padding: 32px 36px; }
  .hero-facts { gap: 18px; }
}

/* ---------- 4. 首页新闻宽屏 3 列（2026-09-29 调用 6 条改 3 列，两行排满不落单） ---------- */
@media (min-width: 1500px) {
  .news-cards { grid-template-columns: repeat(3, 1fr); gap: 24px; }
}

/* ============================================================
   5.3 首屏全宽 + 单页营销化（2026-09-16）
   ============================================================ */

/* ---------- 1. 首屏全宽：突破 wrap 铺满视口，内容仍对齐容器 ----------
   三处修正（2026-09-19）：
   ① 去掉 @media (min-width: 861px) 门槛。移动端原先完全不出血，实测 480/375 下
      .e-hero 都是 left=16 w=448（左右各留 16px 白边），观感与大屏不一致。
   ② 把 .pd-hero 并入选择器。三类详情页 hero 里只有它不是全宽（桌面端固定 1368px，
      左右各留 36px）。它此前靠「自身 max-width 居中」假装与 .e-hero 对齐，其实没铺满。
   ③ 移除公式里多加的 var(--pad)。这是本次的关键修正，说明如下。

   为什么出血量恰好等于 50vw - 50%：
   .wrap 是「max-width + margin:0 auto + padding:0 var(--pad)」的居中容器。
   设视口宽 vw、.wrap 内容盒宽 W，则内容盒左缘到视口左缘的距离 = (vw - W) / 2，
   而 50vw - 50% 展开正是 vw/2 - W/2，两者恒等（任意断点、任意 max-width 都成立）。
   所以：负 margin 取 -(50vw - 50%) 时，hero 左缘正好落在视口 x=0，宽度正好等于 vw；
   水平 padding 取同一个值，内文正好被推回 .wrap 的内容边缘。负 margin 与水平 padding
   必须是这对等值量，内容才既铺满视口、又与主体左右对齐。

   历史 bug：公式原先写成 50vw - 50% + var(--pad)，比正确值多出整整一个 --pad，
   于是 hero 在两侧各多出血 --pad（1440 视口下 hero 宽 1512、左右各被裁掉 36px）。
   两个可见后果：
   - 首页 .hero 带 border-radius: 0 0 28px 28px，圆角被推到视口外、整条下边缘看起来是直角；
   - 必须靠 html/body 的 overflow 兜底才不出现整页横向滚动条（见下方兜底规则）。
   注意：任何后写的 .pd-hero / .e-hero 规则都不得用 `padding: Xpx 0` 这类简写重置水平 padding，
   否则负 margin 失去抵消，内容会被推出视口左缘（.pd-hero 那处已改为只写 padding-top）。 */
.hero, .e-hero, .pd-hero {
  margin-left: calc(-1 * (50vw - 50%));
  margin-right: calc(-1 * (50vw - 50%));
  padding-left: calc(50vw - 50%);
  padding-right: calc(50vw - 50%);
}

/* 2026-09-19 宽度自适应修正：桌面经典滚动条下 100vw 含滚动条宽度、而 50% 不含，
   上面的 vw 公式会让全出血 hero 两侧各多出「半个滚动条」宽度（实测 1440 下右溢 5px，
   全站每个带 hero 的页面都出现横向溢出）。改用容器查询单位 cqi：把 body 声明为
   inline-size 容器后，1cqi = body 内容盒宽度的 1%，恒等于「不含滚动条的可视宽度」，
   任意断点都精确铺满视口且零横向溢出。vw 公式保留为旧内核兜底（cqi 需要
   Chrome105+/Safari16+/FF110+，站点已用 :has()，目标内核一致）。
   inline-size containment 不建立定位包含块，fixed 常驻询价条 / sticky 导航与侧栏不受影响。 */
@supports (container-type: inline-size) {
  body { container-type: inline-size; }
  .hero, .e-hero, .pd-hero {
    margin-left: calc(-1 * (50cqi - 50%));
    margin-right: calc(-1 * (50cqi - 50%));
    padding-left: calc(50cqi - 50%);
    padding-right: calc(50cqi - 50%); }
}

/* 兜底规则已移除（2026-09-19）。
   它们原本是为「公式多算一个 --pad、hero 比视口宽出 2×--pad」而加的：
   - html { overflow-x: hidden }（传播到视口，禁横向滚动，但 scrollWidth 仍计入溢出）
   - body { overflow-x: clip }（真正把溢出裁掉，让体检指标全绿）
   出血量修正后不再有任何元素越过视口，这两条就失去了理由，且留着有害：
   overflow 会把真正超宽的内容（宽表格、长英文串、超宽图片）直接裁掉且无法滚动查看，
   同时让「横向溢出」这项体检永久失真（永远测不出问题）。
   现已删除，横向溢出重新由 41 URL × 4 宽度的几何回归真实把关。 */

/* ---------- 2. 单页/列表/详情 e-hero 背景统一为营销网格光斑（与首页同族） ---------- */
.e-hero {
  background:
    radial-gradient(46% 120% at 10% -20%, rgba(37, 99, 235, .08), transparent 60%),
    radial-gradient(28% 90% at 97% 0%, rgba(124, 58, 237, .05), transparent 60%),
    linear-gradient(rgba(37, 99, 235, .03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(37, 99, 235, .03) 1px, transparent 1px),
    linear-gradient(180deg, #eef4ff 0%, #fafcff 100%);
  background-size: auto, auto, 44px 44px, 44px 44px, auto;
}

/* ---------- 3. 单页 hero 信任条（e-hero-facts：数字/标签徽章） ---------- */
.e-hero-facts { display: flex; flex-wrap: wrap; gap: 10px 16px; list-style: none; margin: 24px 0 0; padding: 0; }
.e-hero-facts li { display: flex; align-items: baseline; gap: 8px; background: rgba(255, 255, 255, .92); border: 1px solid #dbe7fb; padding: 9px 18px; border-radius: 999px; box-shadow: 0 4px 14px rgba(37, 99, 235, .07); }
.e-hero-facts b { font-size: 15px; font-weight: 700; color: var(--pri); }
.e-hero-facts span { font-size: 13.5px; color: var(--text); }
@media (max-width: 720px) {
  /* 移动端信任数据：竖排小卡（数字在上、说明在下），2 列，文字不再挤压换行（2026-10-02 用户指令） */
  .e-hero-facts { gap: 10px; margin-top: 18px; }
  .e-hero-facts li {
    flex: 1 1 calc(50% - 10px);
    flex-direction: column; align-items: flex-start; gap: 3px;
    justify-content: center; text-align: left;
    padding: 12px 14px; border-radius: 12px;
  }
  .e-hero-facts b { font-size: 19px; line-height: 1.2; }
  .e-hero-facts span { font-size: 12px; line-height: 1.5; }
}

/* ---------- 4. 单页正文营销排版（标题/引用/表格/列表精致化） ---------- */
.e-page-card .content h2 {
  margin: 38px 0 14px; padding-left: 14px; border-left: 4px solid var(--pri);
  font-size: clamp(19px, 1.2vw, 23px); color: var(--ink); letter-spacing: .5px;
}
.e-page-card .content h3 { margin: 28px 0 10px; font-size: clamp(16.5px, 0.9vw, 19px); color: var(--ink); }
.e-page-card .content p { margin: 0 0 16px; color: #334155; }
.e-page-card .content ul, .e-page-card .content ol { padding-left: 22px; margin: 0 0 18px; color: #334155; }
.e-page-card .content li { margin: 0 0 8px; line-height: 1.9; }
.e-page-card .content blockquote {
  margin: 22px 0; padding: 16px 20px; background: #f6f9ff;
  border-left: 4px solid #93b4f2; border-radius: 0 12px 12px 0; color: #475569;
}
.e-page-card .content table { width: 100%; border-collapse: collapse; margin: 18px 0; font-size: 14.5px; }
.e-page-card .content th { background: #f0f6ff; color: var(--ink); font-weight: 600; }
.e-page-card .content th, .e-page-card .content td { border: 1px solid var(--line); padding: 10px 14px; text-align: left; }
.e-page-card .content tr:nth-child(even) td { background: #fafbfd; }
.e-page-card .content img { border-radius: 14px; }

/* ---------- 5. 服务信息卡升级（svc-info） ---------- */
.svc-info { gap: 16px; margin: 8px 0 30px; }
.svc-info-item {
  background: linear-gradient(135deg, #f6f9ff, #fbfdff); border: 1px solid #e2ecfd;
  border-radius: 14px; padding: 18px 20px; position: relative; overflow: hidden;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.svc-info-item:hover { box-shadow: 0 8px 20px rgba(37, 99, 235, .08); border-color: #b9cdf5; }
.svc-info-item::before { content: ""; position: absolute; right: -24px; top: -24px; width: 66px; height: 66px; border-radius: 50%; background: rgba(37, 99, 235, .05); }
.svc-info dt { font-size: 12.5px; color: #64748b; margin-bottom: 6px; letter-spacing: 1px; }
.svc-info dd { margin: 0; font-size: 16px; font-weight: 600; color: var(--ink); line-height: 1.6; }

/* ---------- 6. 单页底部信任条（trust-band：为什么选择我们） ---------- */
.trust-band { margin: 34px 0 8px; padding: 28px 30px; background: #fff; border: 1px solid var(--line); border-radius: 18px; box-shadow: 0 4px 16px rgba(15, 23, 42, .04); }
.trust-t { margin: 0 0 18px; font-size: 16px; font-weight: 700; color: var(--ink); letter-spacing: .5px; }
.trust-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; list-style: none; margin: 0; padding: 0; }
.trust-grid li { position: relative; padding: 14px 16px 14px 44px; background: #f8fafc; border: 1px solid #eef2f7; border-radius: 12px; }
.trust-grid li::before { content: ""; position: absolute; left: 16px; top: 18px; width: 10px; height: 10px; border-radius: 50%; background: linear-gradient(135deg, #3b82f6, #1d4ed8); }
.trust-grid b { display: block; font-size: 14.5px; color: var(--ink); margin-bottom: 3px; }
.trust-grid span { font-size: 13px; color: var(--muted); line-height: 1.6; }
@media (max-width: 720px) { .trust-band { padding: 22px 20px; } .trust-grid { grid-template-columns: 1fr 1fr; gap: 10px; } }
@media (max-width: 460px) { .trust-grid { grid-template-columns: 1fr; } }

/* ---------- 7. 发展历程时间轴（about 页，custom_fields milestones） ---------- */
.timeline-card { margin: 34px 0 8px; padding: 30px 32px; background: #fff; border: 1px solid var(--line); border-radius: 18px; }
.timeline-card .h2 { margin: 0 0 24px; }
.timeline { list-style: none; margin: 0; padding: 0; position: relative; }
.timeline::before { content: ""; position: absolute; left: 19px; top: 10px; bottom: 10px; width: 2px; background: linear-gradient(180deg, #3b82f6, #dbe7fb); }
.timeline li { position: relative; padding: 0 0 24px 56px; }
.timeline li:last-child { padding-bottom: 0; }
.timeline li::before { content: ""; position: absolute; left: 11px; top: 5px; width: 18px; height: 18px; border-radius: 50%; background: #fff; border: 3px solid #2563eb; box-shadow: 0 0 0 4px rgba(37, 99, 235, .12); }
.tl-year { display: inline-block; font-size: 15px; font-weight: 800; color: var(--pri); letter-spacing: 1px; margin-bottom: 4px; }
.timeline p { margin: 0; font-size: 14.5px; color: #475569; line-height: 1.8; }
@media (max-width: 720px) { .timeline-card { padding: 24px 20px; } .timeline li { padding-left: 46px; } }
/* ============================================================
   5.4 单页营销化升级层（2026-09-17）—— 贴导航零间距 hero / 精致面包屑 / 宽屏内容 / 服务横向导航
   ============================================================ */

/* ---------- 1. 单页 hero 紧贴吸顶导航：去掉 .detail 顶部留白 ---------- */
.detail.page { margin-top: 0; }

/* ---------- 2. 单页 hero 增强：加高呼吸、标题更大气 ---------- */
.e-hero-page { padding-top: 60px; padding-bottom: 56px; }
.e-hero-page .e-eyebrow { margin-bottom: 12px; }
/* 列表页/详情页 hero 标题与单页面同字号（统一营销视觉） */
.e-hero-page h1, .e-hero h1 { font-size: clamp(30px, 3.6vw, 46px); letter-spacing: 1px; }
.e-hero-page h1 { margin-bottom: 14px; }
.e-hero-page .e-desc { font-size: clamp(15px, 0.4vw + 14.2px, 17px); }
@media (min-width: 1600px) {
  .e-hero-page { padding-top: 74px; padding-bottom: 68px; }
  .e-hero-page h1, .e-hero h1 { font-size: clamp(34px, 3vw, 48px); }
}
@media (max-width: 720px) {
  .e-hero-page { padding-top: 40px; padding-bottom: 38px; }
  .e-hero-page h1, .e-hero h1 { font-size: 25px; }
}

/* ---------- 3. 面包屑升级：去灰条，改精致内联胶囊（首页图标 + 细分隔 + 悬停反馈） ---------- */
.breadcrumb {
  display: flex; flex-wrap: wrap; align-items: center; gap: 2px 4px;
  margin: 26px 0 30px; padding: 0;
  font-size: 13px; letter-spacing: .2px; color: var(--muted);
  background: transparent; border: 0; border-radius: 0; box-sizing: border-box;
}
.breadcrumb::before {
  content: ""; flex: none; width: 15px; height: 15px; margin: 0 7px 0 2px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 10 9-7 9 7v10a2 2 0 0 1-2 2h-4v-7h-6v7H5a2 2 0 0 1-2-2z'/%3E%3C/svg%3E") center/contain no-repeat;
  opacity: .55;
}
.breadcrumb a {
  color: var(--muted); text-decoration: none;
  padding: 3px 10px; border-radius: 999px;
  transition: color .15s, background .15s;
}
.breadcrumb a:hover { color: var(--pri); background: #eff4ff; }
.breadcrumb .sep {
  position: relative; width: 13px; flex: none;
  font-size: 0; color: transparent;
}
.breadcrumb .sep::after {
  content: "›"; position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -54%); font-size: 14px; line-height: 1; color: #cbd5e1;
}
.breadcrumb [aria-current] { color: var(--ink); font-weight: 600; padding: 3px 10px; }
@media (max-width: 720px) {
  .breadcrumb { margin: 18px 0 22px; gap: 2px; }
  .breadcrumb::before { margin-left: 0; }
  .breadcrumb a, .breadcrumb [aria-current] { padding: 3px 8px; }
}

/* ---------- 4. 单页主体宽屏：内容卡跟随 .wrap 全宽（覆盖 5.2 的 980px 阅读宽度限制） ---------- */
.e-page-body { padding: 30px 0 10px; }
@media (min-width: 1280px) {
  .e-page-card .content:not(:has(.toc-box)),
  .e-page-card .content:has(.toc-box) { max-width: none; margin-left: 0; margin-right: 0; }
}
@media (min-width: 1600px) {
  .e-page-body .e-page-card { padding: 52px 60px; }
}

/* ---------- 5. 内容卡定位基准（卡内装饰元素依赖；原顶部蓝色渐变细线已按需求移除） ---------- */
.e-page-body .e-page-card { position: relative; }

/* ---------- 6. 单页小节标题：左侧蓝色竖条（服务信息/发展历程等） ---------- */
.e-page-body .h2 {
  display: flex; align-items: center; gap: 10px;
  margin: 42px 0 18px;
  font-size: clamp(19px, 1vw, 23px); color: var(--ink); letter-spacing: .5px;
}
.e-page-body .h2::before {
  content: ""; flex: none; width: 5px; height: 22px; border-radius: 3px;
  background: linear-gradient(180deg, #3b82f6, #1d4ed8);
}

/* ---------- 7. 服务横向导航（web/seo/geo/video 相互引导） ---------- */
.svc-tabs {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  margin: 0 0 24px; padding: 16px 20px;
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
  box-shadow: 0 4px 14px rgba(15, 23, 42, .04);
}
.svc-tabs-t { font-size: 13px; font-weight: 700; color: var(--ink); letter-spacing: 1px; margin-right: 2px; }
.svc-tabs a {
  display: inline-block; padding: 7px 18px; border-radius: 999px;
  background: #f6f9ff; border: 1px solid #e2ecfd; color: var(--text);
  font-size: 14px; text-decoration: none; white-space: nowrap;
  transition: color .18s, border-color .18s, background .18s, transform .18s;
}
.svc-tabs a:hover { border-color: var(--pri); color: var(--pri); }
/* 当前栏目（读者正停在这一栏）：主色实心胶囊，表示「你在这里」。
   原「咨询报价」CTA 已下线（2026-10-01），实心主色改由当前态占用。 */
.svc-tabs .svc-tabs-now,
.svc-tabs a[aria-current="page"] {
  background: var(--pri); border-color: var(--pri); color: #fff; font-weight: 600;
}
.svc-tabs .svc-tabs-now:hover,
.svc-tabs a[aria-current="page"]:hover { background: var(--pri-d); border-color: var(--pri-d); color: #fff; }
@media (max-width: 720px) {
  .svc-tabs { padding: 14px 16px; gap: 8px; }
  .svc-tabs a { padding: 6px 14px; font-size: 13px; }
}

/* ---------- 8. 页面级运营块（blocks：page_<dirname>） ---------- */
.page-block { margin: 34px 0 0; }
.page-block .seo-block-text,
.page-block .seo-block-html {
  background: #fff; border: 1px solid var(--line); border-radius: 18px;
  padding: 32px 36px; font-size: 15px; line-height: 1.9; color: var(--text);
}
@media (max-width: 720px) {
  .page-block .seo-block-text,
  .page-block .seo-block-html { padding: 24px 20px; }
}

/* ---------- 9. 信任带与 CTA 微升级：圆角节奏统一 ---------- */
.e-page-body .trust-band { border-top: 3px solid #e2ecfd; }
.e-page-body .detail-cta { border-radius: 18px; }


/* ---------- 10. 文章正文标题区：H1 与元信息移至正文顶部（营销型 + 语义化） ---------- */
.e-hero .e-desc { margin: 0 0 22px; }
.e-content-card .a-head { padding-bottom: 22px; margin-bottom: 24px; border-bottom: 1px solid var(--line); }
.e-content-card .a-title { margin: 0 0 14px; font-size: clamp(24px, 2.4vw, 34px); line-height: 1.35; letter-spacing: .5px; color: var(--ink); }
.e-content-card .a-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 22px; font-size: 13.5px; color: var(--muted); }
.e-content-card .a-meta b { color: var(--text); font-weight: 600; }
.e-content-card .a-meta time { color: var(--text); font-weight: 600; }
@media (max-width: 720px) {
  .e-content-card .a-title { font-size: 22px; }
  .e-content-card .a-meta { gap: 6px 14px; font-size: 13px; }
}

/* ---------- 11. 首页默认数据成果带（参考图样式：浅蓝圆角面板 + 四组数字） ---------- */
.stats-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 26px; margin: 0; }
.stats-grid > div { text-align: center; position: relative; }
.stats-grid > div + div::before { content: ""; position: absolute; left: -13px; top: 14%; bottom: 14%; width: 1px; background: #dbe7fb; }
.stats-grid dt { font-size: clamp(30px, 3.4vw, 44px); font-weight: 800; line-height: 1.2; color: #1d4ed8; letter-spacing: .5px; font-family: "Segoe UI", "Microsoft YaHei", sans-serif; }
.stats-grid dd { margin: 10px 0 0; color: #475569; font-size: 14.5px; line-height: 1.6; }
@media (max-width: 860px) {
  .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 16px; }
  .stats-grid > div + div::before { display: none; }
}

/* ---------- 12. 产品详情（营销型 v6：主图双栏 + 规格 + 相关产品） ---------- */
.p-info { display: grid; grid-template-columns: minmax(0, 46%) 1fr; gap: 34px; align-items: start; margin: 0 0 34px; }
.p-media { margin: 0; border-radius: 16px; overflow: hidden; border: 1px solid var(--line); background: linear-gradient(160deg, #f6faff, #eef4fe); aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center; }
.p-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.p-media .card-ph { width: 46%; height: auto; color: #b8c9e8; }
.p-side { display: flex; flex-direction: column; gap: 0; min-width: 0; }
.p-title { margin: 0 0 10px; font-size: clamp(24px, 2.6vw, 32px); font-weight: 800; line-height: 1.35; color: var(--ink); }
.p-side .price-lg { font-size: clamp(28px, 3vw, 36px); color: #2563eb; }
.p-side .lead { margin: 0 0 18px; }
.p-kv { margin: 0 0 20px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 18px; }
.p-kv > div { background: #f6f9ff; border: 1px solid #e4edfc; border-radius: 10px; padding: 9px 13px; display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.p-kv dt { flex: none; color: #64748b; font-size: 13px; }
.p-kv dd { margin: 0; color: var(--ink); font-weight: 600; font-size: 13.5px; }
.p-cta { display: flex; flex-wrap: wrap; gap: 10px; margin: 2px 0 0; }
.p-wx { margin: 22px 0 0; padding: 16px 20px; border: 1px dashed #bfd7ff; background: #f3f8ff; border-radius: 12px; }
.p-wx-t { margin: 0 0 4px; font-weight: 700; color: #1e40af; }
.p-wx-d { margin: 0; color: #475569; font-size: 14px; }
.p-wx b { color: #1d4ed8; }
.p-related { margin: 34px 0 0; }
.p-related-head { display: flex; align-items: baseline; justify-content: space-between; margin: 0 0 16px; }
.p-related-head h2 { margin: 0; font-size: 21px; font-weight: 800; }
.p-related-head a { color: #2563eb; font-size: 14px; text-decoration: none; }
.p-related-head a:hover { text-decoration: underline; }
@media (max-width: 900px) {
  .p-info { grid-template-columns: 1fr; gap: 20px; }
  .p-kv { grid-template-columns: 1fr; }
}

/* ============ 13. 样式统一层（参考图驱动：CTA 按钮组 / 服务卡 / 新闻卡 / 数据带 / 侧边栏） ============ */
/* 13.1 按钮体系统一：圆角 12px；亮底描边按钮 = 白底浅蓝描边（参考图 CTA 按钮组） */
.btn-pri, .btn-ghost, .btn-line, .btn-line-inv, .btn-sm,
.block-more .btn-pri, .block-more .btn-line,
.e-hero-cta .btn-pri, .e-hero-cta .btn-ghost,
.detail-cta-btns .btn-pri, .detail-cta-btns .btn-ghost,
.contact-actions .btn-pri, .contact-actions .btn-ghost { border-radius: 12px; }
.btn-ghost { background: #ffffff; border-color: #bcd2f6; transition: color .18s, background .18s, border-color .18s, transform .18s, box-shadow .18s; }
.btn-ghost:hover { background: var(--pri); border-color: var(--pri); color: #ffffff;  box-shadow: 0 8px 18px rgba(37, 99, 235, .20); }
.btn-line-inv { background: rgba(255, 255, 255, .08); } /* 暗底透明描边（hero/深色区），视觉统一圆角 */

/* 13.2 服务项目卡（参考图 CORE SERVICES：顶部色块图标，首卡红色其余浅蓝，底部「了解服务 →」） */
.svc-card { display: flex; padding: 0; }
.svc-card a { display: flex; flex-direction: column; height: 100%; width: 100%; padding: 22px 22px 20px; }
.svc-card .card-body { padding: 0; }
.svc-ico { width: 60px; height: 60px; margin: 0 0 16px; border-radius: 14px; background: #e7effe; color: var(--pri); display: flex; align-items: center; justify-content: center; }
.svc-ico svg { width: 29px; height: 29px; }
.svc-card:first-child .svc-ico { background: #ef4444; color: #ffffff; }
.svc-card h3 { margin: 0 0 8px; font-size: 17.5px; color: var(--ink); line-height: 1.5; }
.svc-card p { margin: 0 0 18px; font-size: 13.8px; line-height: 1.75; color: var(--muted); flex: 1; }
.svc-more { display: inline-flex; align-items: center; gap: 4px; font-size: 14px; font-weight: 700; color: var(--pri); transition: color .18s; }
.svc-card:hover { box-shadow: var(--shadow); }
.svc-card:hover .svc-more { color: var(--pri-d); }
.svc-card:hover h3 { color: var(--pri); }

/* 13.3 新闻资讯卡（参考图 NEWS CENTER：两列左图右文，日期/标题/摘要/查看详情） */
.news-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.news-cards li { overflow: hidden; }
.news-cards a { flex-direction: row; align-items: stretch; gap: 0; padding: 0; }
/* 2026-09-29 用户指令：桌面端左图等比缩小——不再拉伸到卡片全高，按 4:3 原图比例、宽度 42%→34%，垂直居中 */
.news-cards .news-media { flex: none; width: 34%; margin: 0; height: auto; min-height: 0; align-self: center; aspect-ratio: 4 / 3; background: linear-gradient(135deg, #eef4ff, #e3edfd); }
.news-cards .news-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.news-cards .news-media .news-ph { display: flex; align-items: center; justify-content: center; height: 100%; color: #9db6e8; }
.news-cards .news-media .news-ph svg { width: 36px; height: 36px; }
.news-body { display: flex; flex-direction: column; gap: 8px; padding: 20px 20px 18px; min-width: 0; }
.news-cards .news-more { margin-top: auto; padding-top: 8px; }

/* 13.4 数据成果带说明文字加深（参考图：大号蓝字 + 深色说明） */
.stats-grid dd { color: #334155; }
.stats-in p, .stats-in span, .stats-in div > span:last-child { color: #334155; }

/* 13.5 产品中心侧边栏细节统一（参考图：标签圆角胶囊、咨询按钮一致） */
.cat-side-tags .seo-tag-cloud a { border-radius: 999px; }

/* 13.6 移动端：新闻卡单列；2026-09-29 用户指令：图片在上、文字在下（竖排卡） */
@media (max-width: 720px) {
  .news-cards { grid-template-columns: 1fr; }
  .news-cards a { flex-direction: column; }
  .news-cards .news-media { width: 100%; height: 170px; margin: 0; min-height: 0; }
  .news-cards .news-body { padding: 14px 16px 16px; }
}

/* ============ 14. 全站图片化 + 国际大牌视觉（深色 hero 大图 / 区块配图 / 克制蓝调） ============ */
/* 14.1 首页 hero：深色大图 + 遮罩 + 白字（营销基础不变：H1/CTA/信任条结构保留） */
.hero {
  background:
    linear-gradient(180deg, rgba(6, 14, 33, .80) 0%, rgba(10, 21, 46, .60) 55%, rgba(12, 25, 56, .88) 100%),
    url('/uploads/site/hero-home.webp') center 30% / cover no-repeat;
}
.hero-eyebrow { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .35); color: #dbeafe; backdrop-filter: blur(8px); }
.hero h1 { color: #ffffff; text-shadow: 0 2px 22px rgba(2, 8, 23, .50); }
.hero-sub { color: rgba(255, 255, 255, .86); }
.hero-chips span { background: rgba(255, 255, 255, .10); border: 1px solid rgba(255, 255, 255, .22); color: #e2e8f0; backdrop-filter: blur(6px); }
.hero-facts li { background: rgba(255, 255, 255, .09); border: 1px solid rgba(255, 255, 255, .16); backdrop-filter: blur(10px); box-shadow: 0 8px 24px rgba(2, 8, 23, .35); }
.hero-facts b { color: #ffffff; }
.hero-facts span { color: rgba(255, 255, 255, .82); }
.hero-btns .btn-pri { background: linear-gradient(180deg, #4f8ef7, #2563eb); box-shadow: 0 10px 28px rgba(37, 99, 235, .45); }

/* 14.2 列表页/详情页 hero（e-hero）与单页 hero（e-hero-page）：深色大图 + 白字 */
.e-hero, .e-hero-page {
  background:
    linear-gradient(180deg, rgba(6, 14, 33, .84) 0%, rgba(10, 21, 46, .66) 60%, rgba(12, 25, 56, .90) 100%),
    url('/uploads/site/hero-list.webp') center / cover no-repeat;
  background-size: cover;
}
.e-hero-page {
  background:
    linear-gradient(180deg, rgba(6, 14, 33, .84) 0%, rgba(10, 21, 46, .66) 60%, rgba(12, 25, 56, .90) 100%),
    url('/uploads/site/hero-page.webp') center / cover no-repeat;
  background-size: cover;
}
.e-hero h1, .e-hero-page h1 { color: #ffffff; text-shadow: 0 2px 20px rgba(2, 8, 23, .45); }
.e-eyebrow { color: #a5c8ff; }
.e-eyebrow::before { background: #a5c8ff; }
.e-desc { color: rgba(255, 255, 255, .84); }
.e-meta { color: rgba(255, 255, 255, .78); }
.e-meta b { color: #ffffff; }
.e-num { color: #8ab6ff; }
.e-crumb { color: rgba(255, 255, 255, .72); }
.e-crumb a { color: rgba(255, 255, 255, .80); }
.e-crumb a:hover { color: #ffffff; }
.e-crumb .sep { color: rgba(255, 255, 255, .45); }
/* 14.x（2026-10-01 删）原暗色 hero 信任芯片白字三行已删：
   .e-hero-facts li{白10%底+blur} / b{#a5c8ff} / span{白85%}
   —— 全站 hero 已浅色化（§41.3 定版），这组残留只坑裸 hero 单页
   （.ab-hero/.sv-hero/.ct-hero，无 .e-hero/.e-hero-page 恢复段罩着），
   叠在白纱背景上成「幽灵字」。删除后回落 §3 的 1232-1234 浅色原设计
   （白 .92 底 + #dbe7fb 边 + 蓝数字 var(--pri) + 深灰说明），与业务页一致。 */
.e-hero-cta .btn-ghost, .e-hero-cta .btn-line { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .45); color: #ffffff; }
.e-hero-cta .btn-ghost:hover { background: #ffffff; border-color: #ffffff; color: #0f2a6e; }

/* 14.3 痛点区：浅色纹理背景（保留原卡片结构） */
.pain-band { background: url('/uploads/site/pain-bg.webp') center / cover no-repeat; }

/* 14.4 转化 CTA 区：深色光效背景 + 白字（按钮组与 img4 参考图保持一致） */
.cta-band {
  background:
    linear-gradient(180deg, rgba(9, 18, 40, .90), rgba(13, 27, 58, .94)),
    url('/uploads/site/cta-bg.webp') center / cover no-repeat;
  color: #ffffff; border-color: rgba(255, 255, 255, .08);
  box-shadow: 0 14px 40px rgba(2, 8, 23, .30);
}
.cta-text h2 { color: #ffffff; }
.cta-text p { color: rgba(255, 255, 255, .82); }
.cta-band .btn-ghost { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .45); color: #ffffff; }
.cta-band .btn-ghost:hover { background: #ffffff; border-color: #ffffff; color: #0f2a6e; }
.cta-band::before, .cta-band::after { opacity: .35; }

/* 14.5 文章/单页正文顶部主图（国际大牌：16:9 圆角大图 + 细腻阴影） */
.a-cover { display: block; margin: 0 0 26px; border-radius: 18px; overflow: hidden; box-shadow: 0 16px 40px rgba(15, 23, 42, .12); line-height: 0; }
.a-cover img { width: 100%; height: auto; display: block; }

/* ============ 15. 细节统一修复层（左右留白 / 板块间距 / 圆点 / 按钮高度 / 数据带竖版） ============ */
/* 15.1 内容宽度：宽屏布局（1560px，流行宽屏，左右适度留白） */
.wrap { max-width: 1560px; }

/* 15.2 侧边栏：板块之间留间距；去掉咨询联系方式与按钮前面的圆点（保留分类导航圆点） */
.cat-side-box + .cat-side-box { margin-top: 16px; }
.cat-side .side-contact-list a::before, .cat-side .side-contact-btns a::before { content: none; }

/* 15.3 CTA / 详情 / 联系区按钮高度统一：在线询价等线框按钮与主按钮同高（参考图 CTA 按钮组） */
.cta-btns .btn-pri, .cta-btns .btn-ghost, .cta-btns .btn-line,
.detail-cta-btns .btn-pri, .detail-cta-btns .btn-ghost, .detail-cta-btns .btn-line,
.contact-actions .btn-pri, .contact-actions .btn-ghost, .contact-actions .btn-line {
  padding: 12px 30px; font-size: 14.5px; display: inline-block;
}

/* 15.4 卡片网格视觉分层：静态阴影增强，区块浅蓝底（卡片不再和背景挤在一起） */
.block-alt { background: linear-gradient(180deg, #f2f7ff 0%, #e9f1fd 100%); }
.block .card, .block-alt .card, .adv-grid li, .steps li, .news-cards li {
  box-shadow: 0 8px 26px rgba(15, 23, 42, .07);
}
.svc-card { box-shadow: 0 10px 30px rgba(15, 23, 42, .08); }

/* 15.5 数据成果带：按参考图重排为竖版（大号蓝字 + 深色说明 + 行间分隔线，面板居中） */
.stats-band { max-width: 860px; margin-left: auto; margin-right: auto; }
.stats-in { justify-content: center; }
.stats-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; max-width: 1120px; margin: 0 auto; }
.stats-grid > div { padding: 22px 12px; }
.stats-grid > div + div { border-top: 1px solid #dbe7fb; }
.stats-grid > div + div::before { display: none; }
.stats-grid dt { font-size: clamp(28px, 3vw, 40px); }
.stats-grid dd { margin: 6px 0 0; }
/* 15.2b 分类导航圆点也去掉（贴合参考图：纯文字 + 高亮块） */
.cat-side a::before { content: none; }

/* ============ 16. 全站轻量化 + 色彩统一（克制、轻盈、少重量） ============ */
/* 16.1 统一色板：主蓝唯一 + 派生浅蓝，收敛全部硬编码蓝 */
:root {
  --blue-50: #f2f7ff;
  --blue-100: #e9f1fd;
  --blue-200: #d9e6fb;
  --blue-300: #b3cdf7;
  --shadow: 0 4px 16px rgba(15, 23, 42, .06);
  --shadow-lg: 0 12px 32px rgba(37, 99, 235, .14);
}

/* 16.2 hero 减淡：遮罩降透明度、图片更通透（深色大图保留，白字保留） */
.hero {
  background:
    linear-gradient(180deg, rgba(8, 18, 40, .62) 0%, rgba(12, 24, 52, .46) 55%, rgba(10, 22, 50, .72) 100%),
    url('/uploads/site/hero-home.webp') center 30% / cover no-repeat;
}
.e-hero, .e-hero-page {
  background:
    linear-gradient(180deg, rgba(8, 18, 40, .66) 0%, rgba(12, 24, 52, .48) 60%, rgba(10, 22, 50, .74) 100%),
    url('/uploads/site/hero-list.webp') center / cover no-repeat;
  background-size: cover;
}
.e-hero-page {
  background:
    linear-gradient(180deg, rgba(8, 18, 40, .66) 0%, rgba(12, 24, 52, .48) 60%, rgba(10, 22, 50, .74) 100%),
    url('/uploads/site/hero-page.webp') center / cover no-repeat;
  background-size: cover;
}
.hero h1 { text-shadow: 0 1px 14px rgba(2, 8, 23, .35); }
.hero-facts li { background: rgba(255, 255, 255, .10); border-color: rgba(255, 255, 255, .20); box-shadow: 0 4px 18px rgba(2, 8, 23, .22); }
.hero-btns .btn-pri { background: linear-gradient(180deg, #3f83f8, #2563eb); box-shadow: 0 8px 22px rgba(37, 99, 235, .35); }

/* 16.3 按钮渐变与描边统一（主蓝渐变唯一 + 浅蓝描边唯一） */
.btn-pri { background: linear-gradient(180deg, #3f83f8, #2563eb); box-shadow: 0 4px 14px rgba(37, 99, 235, .25), inset 0 1px 0 rgba(255, 255, 255, .18); }
.btn-pri:hover { background: linear-gradient(180deg, #3475ef, #1d4ed8); }
.btn-ghost { border-color: var(--blue-300); }
.btn-line { border-color: var(--blue-200); }
.btn-line-inv { border-color: var(--blue-300); }

/* 16.4 阴影统一减轻：静态轻、hover 适度 */
.card, .svc-card, .adv-grid li, .steps li, .news-cards li, .cat-side-box, .e-rel-card {
  box-shadow: 0 3px 12px rgba(15, 23, 42, .05);
}
.card:hover, .svc-card:hover, .adv-grid li:hover, .steps li:hover, .news-cards li:hover { box-shadow: 0 10px 26px rgba(15, 23, 42, .10); }

/* 16.5 浅色区块背景统一为同族浅蓝 */
.block-alt { background: linear-gradient(180deg, var(--blue-50) 0%, var(--blue-100) 100%); }
.stats-band { background: linear-gradient(135deg, var(--blue-50), var(--blue-100)); border-color: var(--blue-200); }
.svc-ico { background: var(--blue-100); }

/* 16.6 转化 CTA 区：改回浅蓝渐变（参考图 img4：浅蓝底 + 深蓝主按钮 + 白描边按钮），去掉深色重量 */
.cta-band {
  background: linear-gradient(135deg, var(--blue-50) 0%, var(--blue-100) 100%);
  color: var(--ink); border-color: var(--blue-200);
  box-shadow: 0 8px 24px rgba(37, 99, 235, .08);
}
.cta-text h2 { color: var(--ink); }
.cta-text p { color: var(--muted); }
.cta-band .btn-ghost { background: #ffffff; border-color: var(--blue-300); color: var(--pri); }
.cta-band .btn-ghost:hover { background: var(--pri); border-color: var(--pri); color: #ffffff; }
.cta-band::before, .cta-band::after { opacity: .25; }

/* 16.7 深色 hero 内文字蓝统一为浅蓝派生色 */
/* （2026-10-01）原 `.e-eyebrow, .e-hero-facts b, .e-num` 同染浅蓝：
   .e-hero-facts b 摘出——浅色单页 hero 上数字变幽灵蓝（about/services），
   回落 §3 的 1233 蓝数字 var(--pri)。其余两个不动。 */
.e-eyebrow, .e-num { color: var(--blue-300); }
.e-eyebrow::before { background: var(--blue-300); }

/* 16.8 区块标题横线统一为主蓝渐变 */
.block-head h2::after { background: linear-gradient(90deg, var(--pri), var(--pri-d)); }

/* 16.9 玻璃胶囊轻量化：更透更薄 */
.hero-eyebrow { background: rgba(255, 255, 255, .10); border-color: rgba(255, 255, 255, .28); backdrop-filter: blur(6px); }
.hero-chips span { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .18); }

/* 16.10 痛点区：浅蓝面板 + 卡片间距加大 + 阴影分层（参考图 img18） */
.pain-band { background: transparent; border-radius: 0; padding: 52px 0 12px; margin-top: 0; } /* 2026-09-19：痛点区去掉浅蓝背景，与其它区块统一 */
.pain-grid { gap: 26px; }
.pain-grid li { border-color: var(--blue-200); border-top: 3px solid var(--blue-300); box-shadow: 0 6px 18px rgba(15, 23, 42, .06); padding: 30px 26px 24px; }
.pain-grid li:hover { box-shadow: 0 12px 28px rgba(15, 23, 42, .10); }
.pain-no { color: var(--blue-200); }

/* 16.11 数据成果带：4 组排成一行（用户要求横排，保留大号蓝字+说明样式） */
.stats-band { max-width: none; }
.stats-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; max-width: 1120px; margin: 0 auto; }
.stats-grid > div { padding: 18px 26px; }
.stats-grid > div + div { border-top: none; border-left: 1px solid #dbe7fb; }
@media (max-width: 640px) { .stats-grid { grid-template-columns: 1fr 1fr; } .stats-grid > div + div { border-left: none; } .stats-grid > div:nth-child(3) { border-left: none; } }

/* 16.12 首页区块左右对齐（2026-09-19）：内容已在 main.wrap(20px padding) 内，
   区块自身不再额外加左右 padding / 限宽居中，使核心产品/关于我们/客户案例/常见问题等
   卡片网格的左右边缘与头部导航完全对齐。色块(.block-alt)铺满 main 内容盒。 */
.block { padding: 52px 0 12px; }
.block-alt { padding: 52px 0 56px; }
.block > .block-head,
.block > .grid,
.block > ol.steps,
.block > ul.adv-grid,
.block > ul.news-cards,
.block > .pain-grid,
.block > .about-grid {
  max-width: none; margin-left: 0; margin-right: 0;
}
@media (max-width: 640px) {
  .block { padding: 44px 0 12px; }
  .block-alt { padding: 44px 0 48px; }
}

/* ============ 17. 全站按钮统一（hover 任何状态文字清晰，参考图 CTA 按钮组） ============ */
.btn-pri, .btn-ghost, .btn-line, .btn-line-inv, .btn-sm {
  font-weight: 600;
}
/* 主按钮：蓝渐变底白字；hover 深蓝渐变，文字始终白色 */
.btn-pri { color: #ffffff; }
.btn-pri:hover { color: #ffffff; }
.btn-pri:active { color: #ffffff; }
/* 描边按钮：白底蓝字；hover 蓝底白字（强反馈） */
.btn-ghost { color: var(--pri); }
.btn-ghost:hover { color: #ffffff; }
/* 线框按钮：白底蓝字；hover 蓝底白字（修复查看更多 hover 文字不可见/弱反馈） */
.btn-line { color: var(--pri); background: #ffffff; }
.btn-line:hover { color: #ffffff; background: var(--pri); border-color: var(--pri); box-shadow: 0 6px 16px rgba(37, 99, 235, .18); }
/* 暗底透明描边：半透明白底白字；hover 白底蓝字 */
.btn-line-inv { color: #ffffff; border-color: rgba(255, 255, 255, .55); background: rgba(255, 255, 255, .12); }
.btn-line-inv:hover { color: var(--pri); background: #ffffff; border-color: #ffffff; }
/* 小按钮（侧边栏在线预约/在线询价）：蓝字；hover 蓝底白字 */
.btn-sm { color: var(--pri); border: 1px solid var(--blue-300); background: #ffffff; }
.btn-sm:hover { color: #ffffff; background: var(--pri); border-color: var(--pri); }
/* 卡片内文字链接（查看详情/了解服务等）统一主蓝，hover 深蓝 */
.card-more, .svc-more { color: var(--pri); font-weight: 700; }
.card-more:hover, .svc-more:hover { color: var(--pri-d); }

/* 18.1 头部 LOGO：图标 + 公司名组合（国际大牌式） */
.logo { display: inline-flex; align-items: center; gap: 11px; }
.logo-mark { width: 44px; height: 44px; border-radius: 10px; object-fit: cover; box-shadow: 0 2px 8px rgba(30, 64, 175, .18); }
.logo-text { font-size: clamp(17px, 0.4vw + 15.4px, 20px); font-weight: 800; color: var(--ink); letter-spacing: .4px; line-height: 1.2; }

/* 18.2 联系我们页：双栏布局（左：联系信息；右：询价表单直接融入页面主体） */
.contact-layout { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 30px; align-items: start; }
.contact-info { display: flex; flex-direction: column; gap: 16px; }
.contact-card { background: #fff; border: 1px solid #e8edf4; border-radius: 14px; padding: 22px 24px; box-shadow: 0 2px 10px rgba(15, 23, 42, .04); }
.contact-card h3 { margin: 0 0 12px; font-size: 17px; font-weight: 800; color: var(--ink); }
.contact-card p { margin: 0 0 8px; font-size: 14.5px; line-height: 1.8; color: var(--muted); }
.contact-card p:last-child { margin-bottom: 0; }
.contact-list { list-style: none; margin: 0; padding: 0; }
.contact-list li { display: flex; align-items: flex-start; gap: 10px; margin: 0 0 13px; font-size: 14.5px; line-height: 1.65; color: #334155; }
.contact-list li:last-child { margin-bottom: 0; }
.contact-list svg { flex: none; margin-top: 2px; color: var(--pri); }
.contact-list b { color: var(--ink); }
.contact-list a { color: var(--pri); text-decoration: none; }
.contact-list a:hover { text-decoration: underline; }
.contact-info-img { width: 100%; border-radius: 14px; object-fit: cover; box-shadow: 0 2px 10px rgba(15, 23, 42, .06); }
.contact-form { background: #fff; border: 1px solid #e8edf4; border-radius: 16px; padding: 26px 28px 30px; box-shadow: 0 4px 18px rgba(15, 23, 42, .06); }
.contact-form h3 { margin: 0 0 6px; font-size: 20px; font-weight: 800; color: var(--ink); }
.contact-form > p { margin: 0 0 18px; font-size: 14px; color: var(--muted); }
.contact-form .iq-embed { padding: 0; background: transparent; }
@media (max-width: 960px) {
  .contact-layout { grid-template-columns: 1fr; }
}

/* 18.3 首页数据带横排（stats-in 内 blocks 容器四组一行：大蓝字 + 说明 + 组间分隔线） */
.stats-in .seo-block-html { display: flex; flex-wrap: wrap; justify-content: center; gap: 0; width: 100%; }
.stats-in .seo-block-html > div { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 0 34px; text-align: center; }
.stats-in .seo-block-html > div + div { border-left: 1px solid #dbe7fb; }
.stats-in .seo-block-html b, .stats-in .seo-block-html strong { display: block; font-size: clamp(26px, 3vw, 36px); font-weight: 800; line-height: 1.25; color: #1d4ed8; font-family: "Segoe UI", "Microsoft YaHei", sans-serif; }
.stats-in .seo-block-html p, .stats-in .seo-block-html span { margin: 0; color: #475569; font-size: 14px; line-height: 1.6; }
@media (max-width: 760px) {
  .stats-in .seo-block-html { gap: 18px 0; }
  .stats-in .seo-block-html > div { flex: 1 1 40%; padding: 0 12px; }
  .stats-in .seo-block-html > div:nth-child(3) { border-left: none; }
}

/* 18.4 申请友情链接页（全站统一营销型双栏） */
.apply-layout { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 30px; align-items: start; }
.apply-side { display: flex; flex-direction: column; gap: 16px; }
.apply-card { background: #fff; border: 1px solid #e8edf4; border-radius: 14px; padding: 22px 24px; box-shadow: 0 2px 10px rgba(15, 23, 42, .04); }
.apply-card h3 { margin: 0 0 12px; font-size: 17px; font-weight: 800; color: var(--ink); }
.apply-note { margin: 0 0 14px; font-size: 13.5px; line-height: 1.7; color: var(--muted); }
.apply-link-box { background: linear-gradient(135deg, #f0f6ff, #e6effe); border: 1px dashed #bfd7ff; border-radius: 12px; padding: 16px 18px; }
.apply-link-name { margin: 0 0 6px; font-size: 15.5px; font-weight: 800; color: var(--ink); }
.apply-link-url { margin: 0 0 12px; font-size: 13.5px; color: var(--pri); word-break: break-all; }
.apply-copy { padding: 7px 18px; font-size: 13px; }
.apply-rules { list-style: none; margin: 0; padding: 0; }
.apply-rules li { position: relative; padding: 0 0 9px 18px; font-size: 14px; line-height: 1.6; color: #475569; }
.apply-rules li::before { content: ""; position: absolute; left: 0; top: 7px; width: 7px; height: 7px; border-radius: 50%; background: var(--pri); }
.apply-rules li:last-child { padding-bottom: 0; }
.apply-contact { list-style: none; margin: 0; padding: 0; }
.apply-contact li { font-size: 14px; line-height: 1.8; color: #475569; }
.apply-contact b { color: var(--ink); }
.apply-main .contact-form { padding: 26px 28px 30px; }
.apply-main .contact-form label { display: block; margin: 14px 0 4px; font-size: 14px; font-weight: 700; color: var(--ink); }
.apply-main .contact-form input[type="text"] { width: 100%; box-sizing: border-box; margin-top: 6px; padding: 11px 14px; border: 1px solid #d6e0ef; border-radius: 10px; font-size: 14.5px; font-family: inherit; transition: border-color .15s, box-shadow .15s; }
.apply-main .contact-form input[type="text"]:focus { outline: none; border-color: var(--pri); box-shadow: 0 0 0 3px rgba(37, 99, 235, .12); }
.apply-main .contact-form button[type="submit"] { width: 100%; margin-top: 20px; padding: 13px 30px; border: 0; cursor: pointer; font-size: 15px; }
.fa-hp { position: absolute; left: -9999px; }
.fa-hint { color: #94a3b8; font-size: 12px; margin: 4px 0 0; font-weight: 400; }
.fa-err { background: #fef2f2; border: 1px solid #fecaca; color: #b91c1c; border-radius: 10px; padding: 10px 14px; font-size: 13.5px; margin: 0 0 12px; }
.fa-err p { margin: 2px 0; }
.apply-result { max-width: 640px; margin: 0 auto; background: #fff; border: 1px solid #e8edf4; border-radius: 16px; padding: 42px 36px; text-align: center; box-shadow: 0 4px 18px rgba(15, 23, 42, .06); }
.apply-result-text { font-size: 15px; line-height: 1.8; color: #475569; margin: 0 0 22px; }
.apply-result-back { margin: 0; }
@media (max-width: 960px) {
  .apply-layout { grid-template-columns: 1fr; }
}

/* ============ 19. 封面图交互设计 ============
   两条硬约定：
   ① 列表卡封面（可点进详情的缩略图）保留极轻 hover：只做 3% 缓慢放大 + 很淡的底部压暗；
   ② 正文大图 / 详情页首图 / 单页大图一律「不做交互动作」——不放大、不加遮罩、不加位移。
   第 ② 组用 !important 显式锁死，防止以后加样式时又给大图带出动效。 */
.card-media, .news-media, .p-media, .a-cover { position: relative; overflow: hidden; }
/* ① 列表卡封面：放大 6% → 3%，时长 .55s → .7s，缓出更柔，不再"猛地跳一下" */
.card-media img, .news-media img {
  transition: transform .7s cubic-bezier(.22, .61, .36, 1);
  backface-visibility: hidden;
}
.card:hover .card-media img,
.news-cards li:hover .news-media img { transform: scale(1.03); }
/* 列表卡 hover 压暗遮罩：浓度 .40 → .16，过渡 .35s → .5s（原来一悬停就"啪"地黑一块） */
.card-media::after, .news-media::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0) 52%, rgba(15, 23, 42, .16));
  opacity: 0; transition: opacity .5s ease;
}
.card:hover .card-media::after,
.news-cards li:hover .news-media::after { opacity: 1; }
/* ② 正文 / 详情 / 单页大图：锁死无交互（含富文本正文图 .content img、联系页 .contact-info-img） */
.a-cover img, .p-media img, .c-hero-img img, .content img, .contact-info-img {
  transform: none !important;
  transition: none !important;
}
.a-cover::after, .p-media::after { content: none !important; }
/* 卡片整体提升：上浮 5px → 2px、阴影减半，hover 不再"顿"一下 */
.grid .card, .news-cards li { transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease; }
.grid .card:hover, .news-cards li:hover { box-shadow: 0 12px 28px rgba(15, 23, 42, .09); border-color: #dfe8f6; }
/* 卡内文字链接动感：查看详情/了解服务 hover 主蓝 + 微移 */
.news-more, .card-more, .svc-more { transition: color .2s ease, transform .2s ease; }

/* ============================================================
20. 三种详情页独立版式（2026-09-19 信息架构级重做）
   三类详情页的访客意图不同，所以「模块顺序」与「专属模块」各自独立，不再共用同一套文末块：
   ① 文章 = 阅读型（nw-*）：栏目条 → 标题署名 → 导读摘要 → 正文（右侧目录吸附高亮）
                            → 上下篇 / 继续阅读 → 弱转化细条
   ② 产品 = 决策型（pd-*）：决策首屏（名/价/转化/规格亮点）→ 简介·参数·承诺·包含·场景·答疑
                            ＋右侧吸附报价卡 → 相关产品比价 → 强转化 → 窄屏底部常驻询价条
   ③ 案例 = 说服型（cs-*）：实景图带（标题＋客户画像＋效果数据）→ 挑战/做法/成果 叙事链
                            → 客户证言 → 补充正文 → 相关案例 → 同款方案转化
   版心宽度三类统一走宽屏档 1280px（2026-09-19 调整，原为 1180/1280/1120 三档）；
   差异全部落在「模块顺序 + 专属模块 + 配色」上，不再靠版心宽度区分。
   样式统一放文件末尾：同权重时后写的生效，不去动前面的历史规则（回滚只需删掉本节）。
============================================================ */
:root { --stick-top: 78px; }   /* 吸顶导航（.site-header）高度 + 留白，sticky 元素统一用它 */

/* ---------- 20.1 文章（资讯）· 阅读型（nw-*） ---------- */
/* 版心宽屏档 1280px（三类统一）。正文列 1040px：宽屏下仍是可读行长，同时不再是「窄栏」。 */
.detail-news { --detail-col: 1640px; --nw-read: 1040px; } /* 2026-09-19：版心对齐 .wrap 内容盒(1680-2*20)，与头部导航左右对齐 */

/* 栏目条：浅底细条，不铺深色大图、不挂信任条，把注意力让给正文 */
/* 注意：绝不覆盖 .e-hero 的水平 padding —— 主题的「全出血」规则（≥861px）用
   负 margin 把 hero 拉满视口、再用同值 padding 把内容推回容器，两者必须成对；
   一旦把水平 padding 改成固定值，负 margin 就没人抵消，内容会被拖出视口左边缘。
   这里只调垂直间距。 */
.detail-news .e-hero-mini {
  background: linear-gradient(180deg, var(--blue-50, #f2f7ff), #fbfdff);
  border-bottom: 1px solid var(--line);
  padding-top: 22px;
  padding-bottom: 20px;
}
.detail-news .e-hero-mini::before, .detail-news .e-hero-mini::after { content: none; }
.detail-news .e-hero-mini .e-eyebrow { color: var(--pri); margin: 0 0 8px; }
.detail-news .e-hero-mini .e-eyebrow::before { background: var(--pri); }
.detail-news .e-hero-mini .e-desc { color: var(--muted); margin: 0; font-size: 14.5px; }

/* 主体 */
.nw-wrap { max-width: var(--detail-col); margin: 0 auto; padding: 34px 0 64px; }
.nw-card { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 42px 48px 36px; }

/* 标题 + 署名（阅读型的作者/时间/篇幅信息带，也是 E-E-A-T 的落点） */
.nw-head { margin: 0 0 22px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
/* 注意：选择器必须带上 .detail-news 前缀。基础层有 `.detail h1 { font-size; color: var(--ink); margin }`
   这种 (0,1,1) 的元素级规则，纯类选择器 (0,1,0) 会被它压掉（字号、颜色、外边距全部失效）。 */
.detail-news .nw-title { margin: 0 0 14px; font-size: clamp(24px, 1.6vw + 16px, 34px); line-height: 1.42; letter-spacing: .2px; color: var(--ink); }
.nw-meta { display: flex; flex-wrap: wrap; gap: 6px 20px; font-size: 13.5px; color: var(--muted); }
.nw-meta b { color: var(--ink); font-weight: 600; }
.nw-by { color: var(--pri); }

/* 导读摘要：让人 5 秒判断这篇要不要读下去 */
.nw-lead { margin: 0 0 26px; padding: 15px 20px 16px; background: #f6f9ff; border-left: 3px solid var(--pri); border-radius: 0 10px 10px 0; color: #33415c; font-size: 15px; line-height: 1.95; }
.nw-lead::before { content: "导读"; display: block; margin: 0 0 5px; font-size: 11.5px; font-weight: 700; letter-spacing: 2px; color: var(--pri); }

/* 封面图（不做交互由第 19 节统一锁死） */
.detail-news .a-cover { margin: 0 0 28px; border-radius: 14px; }

/* 正文：行高 2.1 / 字号 16.5 —— 三类版式里最松的阅读密度 */
.detail-news .content { font-size: 16.5px; line-height: 2.1; color: #263449; }
.detail-news .content > p { margin: 0 0 20px; }
.detail-news .content > h2 { margin: 34px 0 16px; padding-left: 14px; border-left: 4px solid var(--pri); font-size: 21px; line-height: 1.5; color: var(--ink); }
.detail-news .content > h3 { margin: 26px 0 12px; font-size: 18px; color: var(--ink); }
/* 无目录时给阅读宽度上限并左对齐（有目录时走插件的目录双栏，不套这条） */
.detail-news .content:not(:has(> .toc-box)) { max-width: var(--nw-read); margin-left: 0; margin-right: auto; }
/* 目录当前章节高亮（由 front_enhance() 的滚动联动加 .cur） */
.content > .toc-box .toc-l a.cur { color: var(--pri); font-weight: 700; }
.content > .toc-box .toc-l a.cur::before { content: "▍"; color: var(--pri); margin-right: 1px; }

/* 文末：上下篇（卡片式）→ 继续阅读（文字流）→ 弱转化细条 */
.nw-foot { margin: 26px 0 0; }
.nw-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 0 0 24px; }
.nw-nav-a { display: block; padding: 16px 20px; background: #fff; border: 1px solid var(--line); border-radius: 14px; text-decoration: none; transition: border-color .2s, box-shadow .2s; }
.nw-nav-a:hover { border-color: #cfdffb; box-shadow: 0 10px 24px rgba(15, 23, 42, .06); }
.nw-nav-a.next { text-align: right; }
.nw-nav-a .dir { display: block; margin: 0 0 6px; font-size: 12.5px; color: var(--pri); }
.nw-nav-a .t { display: block; font-size: 14.5px; line-height: 1.6; color: var(--ink); }
.nw-rel { margin: 0 0 24px; }
.nw-rel-h { margin: 0 0 12px; font-size: 15px; font-weight: 600; color: var(--muted); }
.nw-rel-list { list-style: none; margin: 0; padding: 0; }
.nw-rel-list li + li { border-top: 1px solid var(--line); }
.nw-rel-list a { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; padding: 13px 2px; text-decoration: none; }
.nw-rel-list .t { font-size: 15px; color: var(--ink); transition: color .18s; }
.nw-rel-list a:hover .t { color: var(--pri); }
.nw-rel-list time { flex: none; font-size: 12.5px; color: var(--muted); }
/* 弱转化：一条安静的联系带，不摆按钮组跟正文抢注意力 */
.nw-soft { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin: 0 0 20px; padding: 14px 20px; background: #f8fafd; border: 1px solid var(--line); border-radius: 12px; font-size: 13.5px; color: var(--muted); }
.nw-soft-t { color: var(--ink); font-weight: 600; }
.nw-soft a { color: var(--pri); text-decoration: none; border-bottom: 1px solid rgba(37, 99, 235, .28); }
.nw-soft a:hover { border-bottom-color: var(--pri); }
.nw-soft i { font-style: normal; }
.nw-totop { margin: 0; text-align: right; }
.nw-totop a { display: inline-block; padding: 8px 18px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: 13px; text-decoration: none; transition: color .18s, border-color .18s; }
.nw-totop a:hover { color: var(--pri); border-color: var(--pri); }
/* FAQ：迁移自源站 frontmatter，详情页正文之后的问答块（配 FAQPage 结构化数据） */
.nw-faq { margin: 26px 0 0; padding-top: 22px; border-top: 1px solid var(--line); }
.nw-faq-item { margin: 0 0 16px; }
.nw-faq-q { margin: 0 0 8px; font-size: 15.5px; line-height: 1.6; color: var(--ink); font-weight: 600; padding-left: 12px; border-left: 3px solid var(--pri); }
.nw-faq-a { margin: 0; padding-left: 15px; font-size: 14.5px; line-height: 1.9; color: var(--muted); }
.nw-faq-a p { margin: 0; }
/* 作者实体卡（2026-09-29 内容页美化）：真人署名 + 资质 + 转化入口 */
.nw-author { display: flex; gap: 18px; margin: 26px 0 0; padding: 22px 24px; background: #f8fafd; border: 1px solid var(--line); border-radius: 14px; }
.nw-author-avatar { flex: none; display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; border-radius: 50%; background: var(--pri); color: #fff; font-size: 21px; font-weight: 700; box-shadow: 0 0 0 3px #fff, 0 2px 8px rgba(15, 23, 42, .12); overflow: hidden; }
.nw-author-avatar img { width: 100%; height: 100%; object-fit: cover; object-position: center 18%; display: block; }
.nw-author-name { margin: 0 0 8px; font-size: 15.5px; font-weight: 700; color: var(--ink); }
.nw-author-name i { margin-left: 10px; font-style: normal; font-size: 12.5px; font-weight: 400; color: var(--muted); }
.nw-author-desc { margin: 0 0 14px; font-size: 13.8px; line-height: 1.85; color: var(--muted); }
.nw-author-cta { margin: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.nw-author-cta .btn-pri, .nw-author-cta .btn-line { display: inline-block; padding: 8px 20px; border-radius: 999px; font-size: 13.5px; }
.nw-author-cred { margin: 0 0 10px; font-size: 12.5px; line-height: 1.7; color: var(--pri); font-weight: 600; }
/* 作者卡信任数据条（2026-10-02 用户指令）：数字在上、说明在下，2 列小卡，口径与 about 页 hero_facts 一致 */
.nw-author-facts {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px;
  list-style: none; margin: 0 0 14px; padding: 0;
}
.nw-author-facts li {
  padding: 9px 11px; background: #fff; border: 1px solid var(--line); border-radius: 10px;
  display: flex; flex-direction: column; gap: 2px; min-width: 0;
}
.nw-author-facts b { font-size: 15px; font-weight: 700; color: var(--pri); line-height: 1.2; }
.nw-author-facts span { font-size: 11.5px; line-height: 1.45; color: var(--muted); }
@media (max-width: 600px) { .nw-author { flex-direction: column; gap: 12px; padding: 18px; } }
/* 更新时间徽标（新鲜度信号，利于搜索引擎与 AI 判断内容时效） */
.nw-upd { color: #0e9f6e; }
.nw-upd time { font-weight: 600; }
/* 目录（TOC）基础样式：桌面右侧吸附由第 12 节 grid 规则接管，这里保证移动端/无 grid 时也是可读卡片 */
.toc-box { margin: 0 0 22px; padding: 16px 18px; background: #f6f9ff; border: 1px solid #dce7fa; border-left: 3px solid var(--pri); border-radius: 12px; }
.toc-box .toc-t { margin: 0 0 8px; font-size: 14px; font-weight: 700; color: var(--ink); letter-spacing: 1px; }
.toc-box .toc-l { padding-left: 4px; }
.toc-box .toc-l a { display: block; padding: 4px 0; color: var(--muted); font-size: 13.5px; line-height: 1.6; text-decoration: none; border-bottom: 1px solid transparent; }
.toc-box .toc-l a:hover { color: var(--pri); }

/* ---------- 20.2 产品 · 决策型（pd-*） ---------- */
.detail-product { --detail-col: 1640px; } /* 2026-09-19：版心对齐 .wrap 内容盒，与头部导航左右对齐 */

/* 决策首屏：深蓝渐变底，左「名 / 定位 / 价格 / 转化」、右产品实拍图，下方一条规格亮点带。
   产品名、价格、询价入口同屏出现 —— 这是三类版式里唯一把「转化按钮」放进首屏的。 */
/* 只写垂直 padding —— 水平 padding 由主题的「全出血补偿」统一提供（见 5.3 节开头）。
   若这里写成 `padding: 46px 0 0` 简写，会把水平 padding 归零、负 margin 失去抵消，
   .pd-hero-in 会被整体推到视口左缘之外。 */
.pd-hero { background: linear-gradient(135deg, #0c1a32 0%, #16305c 56%, #1d4278 100%); padding-top: 46px; }
.pd-hero-in { max-width: var(--detail-col); margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 44px; align-items: center; }
/* 首屏文案统一加 .detail-product 前缀：基础层 `.detail h1` (0,1,1) 会压掉纯类选择器，
   产品名会因此被染成深色（在深蓝底上直接看不见）。 */
.detail-product .pd-eyebrow { margin: 0 0 12px; font-size: 12.5px; font-weight: 600; letter-spacing: 2px; color: #8fb8f5; }
.detail-product .pd-title { margin: 0 0 14px; font-size: clamp(26px, 2.2vw + 16px, 38px); line-height: 1.34; letter-spacing: .3px; color: #fff; }
.detail-product .pd-sub { margin: 0 0 20px; max-width: 620px; font-size: 15.5px; line-height: 1.9; color: rgba(255, 255, 255, .78); }
.detail-product .pd-price { display: flex; align-items: baseline; gap: 10px; margin: 0 0 22px; }
.detail-product .pd-price b { font-size: 34px; font-weight: 700; letter-spacing: .5px; color: #ffd166; }
.detail-product .pd-price span { font-size: 13px; color: rgba(255, 255, 255, .58); }
.detail-product .pd-cta { display: flex; flex-wrap: wrap; gap: 12px; margin: 0; }
.pd-hero-media { position: relative; overflow: hidden; margin: 0; aspect-ratio: 4 / 3; border-radius: 16px; border: 1px solid rgba(255, 255, 255, .16); background: rgba(255, 255, 255, .06); }
.pd-hero-media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.pd-hero-points { max-width: var(--detail-col); margin: 30px auto 0; display: flex; flex-wrap: wrap; gap: 14px 40px; list-style: none; padding: 18px 0 22px; border-top: 1px solid rgba(255, 255, 255, .14); }
.pd-hero-points li { display: flex; align-items: baseline; gap: 9px; font-size: 14px; }
.pd-hero-points li span { color: rgba(255, 255, 255, .56); }
.pd-hero-points li b { color: #fff; font-weight: 600; }

/* 主体：左模块化正文 / 右吸附报价卡 */
.pd-wrap { max-width: var(--detail-col); margin: 0 auto; padding: 34px 0 64px; }
.pd-cols { display: grid; grid-template-columns: minmax(0, 1fr) 328px; gap: 40px; align-items: start; }
.pd-main { min-width: 0; }
.pd-sec { margin: 0 0 18px; padding: 24px 28px 22px; background: #fff; border: 1px solid var(--line); border-radius: 16px; }
.pd-h2 { margin: 0 0 16px; padding-left: 12px; border-left: 4px solid var(--pri); font-size: 19px; line-height: 1.5; color: var(--ink); }
.pd-sec .content { font-size: 15.5px; line-height: 2; }
.pd-sec .content > p { margin: 0 0 16px; }

/* 清单：勾（承诺 / 包含）与圆点（场景）两种记号 */
.pd-list { list-style: none; margin: 0; padding: 0; }
.pd-list li { position: relative; padding: 7px 0 7px 26px; font-size: 15px; line-height: 1.85; color: #33415c; }
.pd-list-tick li::before { content: ""; position: absolute; left: 3px; top: 14px; width: 8px; height: 5px; border-left: 2px solid var(--pri); border-bottom: 2px solid var(--pri); transform: rotate(-45deg); }
.pd-list-dot li::before { content: ""; position: absolute; left: 6px; top: 16px; width: 5px; height: 5px; border-radius: 50%; background: var(--pri); }

/* 常见问题：原生 details 手风琴，零 JS */
.pd-faq-item { margin: 0 0 10px; background: #fcfdff; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.pd-faq-item summary { position: relative; padding: 14px 46px 14px 18px; font-size: 15px; font-weight: 600; color: var(--ink); cursor: pointer; list-style: none; }
.pd-faq-item summary::-webkit-details-marker { display: none; }
.pd-faq-item summary::after { content: "+"; position: absolute; right: 18px; top: 50%; transform: translateY(-50%); font-size: 18px; color: var(--pri); }
.pd-faq-item[open] summary { border-bottom: 1px solid var(--line); }
.pd-faq-item[open] summary::after { content: "−"; }
.pd-faq-item p { margin: 0; padding: 14px 18px 16px; font-size: 14.5px; line-height: 1.95; color: var(--muted); }

/* 参数表：斑马纹 + 整行悬停高亮（决策型特有的"查表"手感） */
.detail-product .spec tbody tr:nth-child(even) { background: #fafcff; }
.detail-product .spec tbody tr:hover { background: #eff6ff; }

/* 吸附报价卡 */
.pd-rail { position: sticky; top: var(--stick-top); }
.pd-rail-card { background: linear-gradient(180deg, #f7faff, #fff); border: 1px solid #dbe7fb; border-radius: 16px; padding: 22px; box-shadow: 0 10px 28px rgba(37, 99, 235, .07); }
.pd-rail-t { margin: 0 0 6px; font-size: 16px; font-weight: 700; color: var(--ink); }
.pd-rail-price { display: flex; align-items: baseline; gap: 6px; margin: 0 0 10px; }
.pd-rail-price b { font-size: 24px; color: var(--pri); }
.pd-rail-price span { font-size: 12.5px; color: var(--muted); }
.pd-rail-d { margin: 0 0 16px; font-size: 13px; line-height: 1.7; color: var(--muted); }
.pd-rail-btns { margin: 0 0 14px; display: flex; flex-direction: column; gap: 10px; }
.pd-rail-btns .btn-pri, .pd-rail-btns .btn-ghost, .pd-rail-btns .btn-line { display: block; margin: 0; text-align: center; padding: 11px 16px; border-radius: 10px; text-decoration: none; font-weight: 600; }
.pd-rail-wx { margin: 0 0 14px; font-size: 13px; color: var(--muted); }
.pd-rail-wx b { color: var(--ink); }
.pd-rail-kv { list-style: none; margin: 0; padding: 14px 0 0; border-top: 1px dashed #dbe7fb; }
.pd-rail-kv li { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 6px 0; font-size: 13px; }
.pd-rail-kv li span { flex: none; color: var(--muted); }
.pd-rail-kv li b { color: var(--ink); font-weight: 600; text-align: right; }

/* 窄屏常驻询价条（默认隐藏，宽屏由右侧报价卡承担这个角色；显示规则见 20.6） */
.pd-stickybar { display: none; }

/* ---------- 20.3 案例 · 说服型（cs-*） ---------- */
.detail-case { --detail-col: 1640px; } /* 2026-09-19：版心对齐 .wrap 内容盒，与头部导航左右对齐 */

/* 实景图带：用案例自己的图铺底，标题 / 客户画像 / 效果数据全部压在图上 —— 案例页的「证据第一屏」 */
/* 竖向 padding 交给内层 .e-hero-case-in；水平 padding 仍由 .e-hero 的
   「全出血补偿」提供，不要在这里清零（否则内容溢出视口左边缘） */
.e-hero-case { padding-top: 0; padding-bottom: 0; background: #0b1730; }
.e-hero-case::before { content: none; }
.e-hero-case::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(180deg, rgba(6, 14, 33, .58) 0%, rgba(8, 18, 40, .52) 46%, rgba(6, 14, 33, .88) 100%);
}
.e-hero-case-in { position: relative; z-index: 2; padding: 92px 0 64px; }
.e-hero-case .e-eyebrow { margin: 0 0 10px; }
/* 案例标题同样要带 .detail-case 前缀：基础层 `.e-hero h1` (0,1,1) 会压掉纯类选择器。
   （它恰好把标题设成白色，所以看起来"没坏"，但字号会变成 46px 而不是这里的 44px。） */
.detail-case .e-hero-h1 { margin: 0 0 14px; font-size: clamp(28px, 3.4vw, 44px); line-height: 1.28; letter-spacing: .5px; color: #fff; text-shadow: 0 2px 20px rgba(2, 8, 23, .45); }

/* 客户画像：脱敏客户名 + 行业 / 规模 / 周期（缺项不渲染，不编造客户信息） */
.cs-profile { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; margin: 18px 0 0; }
.cs-profile-name { padding: 5px 15px; border-radius: 999px; background: rgba(255, 255, 255, .16); border: 1px solid rgba(255, 255, 255, .28); color: #fff; font-size: 13.5px; font-weight: 600; }
.cs-profile-i { font-size: 13.5px; color: rgba(255, 255, 255, .80); }
.cs-profile-i i { font-style: normal; margin-right: 6px; color: rgba(255, 255, 255, .52); }

.c-hero-stats { display: flex; flex-wrap: wrap; gap: 14px 18px; list-style: none; margin: 26px 0 0; padding: 0; }
.c-hero-stats li { min-width: 150px; padding: 14px 22px; border-radius: 14px; background: rgba(255, 255, 255, .10); border: 1px solid rgba(255, 255, 255, .20); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.c-hero-stats b { display: block; font-size: 26px; line-height: 1.2; color: #fff; }
.c-hero-stats span { display: block; margin-top: 4px; font-size: 12.5px; color: rgba(255, 255, 255, .80); }

/* 主体 */
.cs-wrap { max-width: var(--detail-col); margin: 0 auto; padding: 34px 0 64px; }
.cs-card { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 38px 44px 34px; }

/* 服务内容：胶囊标签带（案例涉及的服务项，先给个范围感） */
.cs-services { margin: 0 0 30px; padding: 16px 20px; background: #f7faff; border-radius: 14px; }
.cs-services-t { margin: 0 0 10px; font-size: 12.5px; font-weight: 700; letter-spacing: 2px; color: var(--muted); }
.cs-services-list { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
.cs-services-list li { padding: 6px 14px; border-radius: 999px; background: #fff; border: 1px solid #dbe7fb; color: #24406e; font-size: 13.5px; }

/* 叙事链：编号圆点 + 竖线串成时间轴 —— 案例页的核心结构，
   既不像文章页的线性阅读，也不像产品页的模块并列。 */
.cs-chain { margin: 0; }
.cs-step { position: relative; padding: 0 0 30px 60px; }
.cs-step::before { content: ""; position: absolute; left: 17px; top: 38px; bottom: 6px; width: 2px; background: linear-gradient(180deg, #cfe0fb, #eef4fd); }
.cs-step:last-child { padding-bottom: 6px; }
.cs-step:last-child::before { content: none; }
.cs-step-n { position: absolute; left: 0; top: 0; width: 36px; height: 36px; border-radius: 50%; background: var(--pri); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; letter-spacing: .5px; box-shadow: 0 6px 16px rgba(37, 99, 235, .24); }
.cs-step-t { margin: 0 0 12px; padding-top: 4px; font-size: 20px; line-height: 1.5; color: var(--ink); }
.cs-step-p { margin: 0; font-size: 15.5px; line-height: 2; color: #33415c; }
.cs-step .pd-list li { font-size: 15.5px; }

/* 客户证言（案例页最有说服力的一块，没填就不出现） */
.cs-quote { margin: 26px 0 4px; padding: 24px 28px; background: linear-gradient(135deg, #f3f7ff, #fbfdff); border-left: 4px solid var(--pri); border-radius: 0 14px 14px 0; }
.cs-quote-t { margin: 0 0 12px; font-size: 17px; line-height: 1.95; color: #1e2f4d; }
.cs-quote-c { font-style: normal; font-size: 13.5px; color: var(--muted); }

/* 补充正文：与叙事链用虚线分隔，明确「这是补充说明，不是主线」 */
.cs-note { margin: 28px 0 0; padding-top: 26px; border-top: 1px dashed var(--line); }
.cs-note .content { font-size: 15.5px; line-height: 2; color: #33415c; }
.cs-note .content > p { margin: 0 0 16px; }

/* ---------- 20.4 三种版式共用：hero 内文 / 面包屑 / 主体对齐到同一条「内容列」 ----------
   背景：主题的「全出血」规则（见 5.3 节第 1 条）用负 margin 把 .e-hero 拉满视口，再用
   **等值** padding 把内文推回 .wrap 的内容边缘 —— 负 margin 与水平 padding 是一对，缺一不可。
   这里在等值 padding（50vw - 50%）之上再叠加「内容列居中的偏移量」，让 hero 内文与主体
   左右对齐，整页只剩一条竖线。绝不能用固定 px 覆盖水平 padding（会抵消失配对的负 margin，
   内容被推出视口左缘，h1 被截断）。
   注意：下方两条 padding 必须与 5.3 节基础规则的 bleed 量严格一致；若基础规则改了出血量，
   这里要同步改，否则文章/案例详情页 hero 的内文会偏出内容列一条 --pad 的距离。
   注：产品页首屏是 .pd-hero，它已并入 5.3 节的全出血选择器（自身 max-width 居中定位内文）。 */
@media (min-width: 861px) {
  .detail-news .e-hero, .detail-case .e-hero {
    padding-left: calc(50vw - 50% + max(0px, (100% - var(--detail-col)) / 2));
    padding-right: calc(50vw - 50% + max(0px, (100% - var(--detail-col)) / 2)); }
}
/* cqi 根治版（与 5.3 节基础出血规则配对，说明见该处） */
@supports (container-type: inline-size) {
  @media (min-width: 861px) {
    .detail-news .e-hero, .detail-case .e-hero {
      padding-left: calc(50cqi - 50% + max(0px, (100% - var(--detail-col)) / 2));
      padding-right: calc(50cqi - 50% + max(0px, (100% - var(--detail-col)) / 2)); } }
}
/* 面包屑同上一条竖线（宽屏旧规则已把面包屑豁免，这里按内容列居中） */
.detail-news > nav.breadcrumb,
.detail-product > nav.breadcrumb,
.detail-case > nav.breadcrumb {
  max-width: var(--detail-col); margin-left: auto; margin-right: auto;
}

/* ---------- 20.5 文末转化块（产品 / 案例各一套，文章页刻意没有这一块） ---------- */
.pd-final, .cs-final { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; margin: 26px 0 0; padding: 26px 30px; border-radius: 16px; }
.pd-final { background: linear-gradient(135deg, #0e1c36, #1a3a68); }
.cs-final { background: linear-gradient(135deg, #0b1730, #17335c); }
.pd-final-text, .cs-final-text { min-width: 260px; }
.pd-final-t, .cs-final-t { margin: 0 0 6px; font-size: 18px; font-weight: 700; color: #fff; }
.pd-final-text p:last-child, .cs-final-text p:last-child { margin: 0; font-size: 14px; line-height: 1.7; color: rgba(255, 255, 255, .72); }
.pd-final-btns, .cs-final-btns { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; }
.pd-final-btns a, .cs-final-btns a { margin: 0; padding: 11px 22px; border-radius: 10px; font-size: 14px; font-weight: 600; text-decoration: none; }
.pd-final-wx, .cs-final-wx { flex: 1 1 100%; margin: 0; font-size: 13px; color: rgba(255, 255, 255, .62); }
.pd-final-wx b, .cs-final-wx b { color: #fff; }

/* ---------- 20.6 移动端：一律单列，吸附元素退回文档流 ---------- */
@media (max-width: 1080px) {
  .pd-hero-in { grid-template-columns: minmax(0, 1fr) 300px; gap: 30px; }
  .pd-cols { grid-template-columns: minmax(0, 1fr); gap: 26px; }
  .pd-rail { position: static; }
}
@media (max-width: 960px) {
  .nw-wrap, .pd-wrap, .cs-wrap { max-width: none; padding-left: 16px; padding-right: 16px; }
  .nw-card { padding: 28px 22px 26px; }
  .cs-card { padding: 26px 22px 24px; }
  .pd-hero-in { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .pd-hero-media { order: -1; aspect-ratio: 16 / 10; }
  .nw-title { font-size: 24px; }
}
@media (max-width: 720px) {
  .e-hero-case-in { padding: 56px 0 40px; }
  .c-hero-stats li { flex: 1 1 calc(50% - 9px); min-width: 0; }
  .detail-news .e-hero-mini { padding-top: 18px; padding-bottom: 16px; }
  /* 2026-09-29 用户指令：移动端详情页左右只留少量空白，主内容优先。
     此前 wrap16 + nw-wrap16 + 卡片22 ≈ 55px/侧，375px 屏正文仅 ~265px 太挤；
     第一轮收到 33px/侧后用户要求再小 → 现 8+6+10+1 ≈ 25px/侧，正文 ~325px。 */
  main.wrap:has(> .detail-news) { --pad: 8px; }
  .nw-wrap, .pd-wrap, .cs-wrap { padding-left: 6px; padding-right: 6px; }
  .nw-card, .cs-card { padding-left: 10px; padding-right: 10px; }
  /* 手机端目录：限高 + 内部滚动。窄屏下目录不是侧栏而是正文顶部的普通块，
     一条 9 级目录能把首屏内容整段顶下去（用户要滚一屏才见到正文）。 */
  .content > .toc-box { max-height: 200px; overflow-y: auto; }
  /* 上下篇 / 继续阅读 / 叙事链在窄屏收成单列 */
  .nw-nav { grid-template-columns: 1fr; }
  .nw-nav-a.next { text-align: left; }
  .nw-rel-list a { flex-direction: column; gap: 4px; }
  .cs-step { padding-left: 46px; }
  .cs-step-n { width: 30px; height: 30px; font-size: 12px; }
  .cs-step::before { left: 14px; top: 32px; }
  .pd-hero-points { gap: 10px 22px; }
  .pd-final, .cs-final { flex-direction: column; align-items: stretch; padding: 22px 20px; }
  .pd-final-text, .cs-final-text { min-width: 0; }
  .pd-final-btns a, .cs-final-btns a { flex: 1 1 100%; text-align: center; }
}
/* 窄屏底部常驻询价条：滚到哪儿都能一键联系（宽屏不显示，由右侧报价卡承担） */
@media (max-width: 860px) {
  .pd-stickybar { display: flex; align-items: center; justify-content: space-between; gap: 14px;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
    background: rgba(255, 255, 255, .97); border-top: 1px solid var(--line);
    box-shadow: 0 -6px 20px rgba(15, 23, 42, .08);
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
  .pd-sb-price { display: flex; align-items: baseline; gap: 4px; margin: 0; }
  .pd-sb-price b { font-size: 19px; color: var(--pri); }
  .pd-sb-price span { font-size: 12px; color: var(--muted); }
  .pd-sb-btns { display: flex; gap: 10px; margin: 0; }
  .pd-sb-btns a { margin: 0; padding: 10px 18px; border-radius: 999px; font-size: 13.5px; font-weight: 600; text-decoration: none; }
  .detail-product .pd-wrap { padding-bottom: 96px; }
}

/* ============================================================
21. 三种栏目列表页独立版式（2026-09-19 信息架构级重做）
   原先三套列表模板共用同一副骨架（.list-page > .e-hero + .e-feature + .grid），
   换的只是类名和文案，所以「案例列表和文章列表长得一模一样」。
   现在按访客意图拆开，骨架互不复用 —— 三条轴同时不同：

     ① 文章 = 资讯流（nl-*）  深色转化头带？否 → 浅色细条 ＋ 站内搜索
                              结构：无侧栏 · 日期块主导的行式条目 · 密度优先
                              收尾：弱转化细条（读的人不该被大 CTA 拦住）
     ② 产品 = 货架（ps- 与 shelf- 前缀）深色转化头带 ＋ 左侧筛选栏
                              结构：左栏 ＋ 参数/价格网格 · 让人不点进详情就能筛掉一半
                              收尾：强转化（四路出口）
     ③ 案例 = 作品墙（cw-*）  实景图头带（底图取本页第一个案例的真实项目图）
                              结构：无侧栏 · 大图墙 · 行业标签叠图上 · 效果数据排卡面
                              收尾：同款方案（与案例详情页文末同族）

   列数 / 方向 / 主导元素三者都不同：无栏-左栏-无栏；行-格-墙；日期-参数-图片。
   样式统一放文件末尾：同权重时后写的生效，不去动前面的历史规则（回滚只需删掉本节）。
============================================================ */

/* ---------- 21.1 文章 = 资讯流（nl-*） ---------- */

/* 头带浅色化：覆盖 14.2 / 16.2 两处深色大图规则（本节在文件末尾，同权重后写者胜） */
.nl-hero {
  background: linear-gradient(180deg, #f4f8ff 0%, #fbfdff 100%);
  border-bottom: 1px solid var(--line);
  padding-top: 32px; padding-bottom: 30px;
}
.nl-hero::before, .nl-hero::after { content: none; }
.nl-hero h1 { color: var(--ink); text-shadow: none; font-size: clamp(26px, 3vw, 40px); }
.nl-hero .e-eyebrow { color: var(--pri); }
.nl-hero .e-eyebrow::before { background: var(--pri); }
.nl-hero .e-desc { color: var(--muted); font-size: 15px; }
.nl-count { margin: 18px 0 0; font-size: 13.5px; color: var(--muted); }
.nl-count b { font-size: 17px; font-weight: 800; color: var(--pri); }

/* 站内搜索：资讯站的核心动作是「找」，把它放到头带里，访客不必去翻分页 */
.nl-search { display: flex; gap: 10px; max-width: 520px; margin: 20px 0 0; }
.nl-search input {
  flex: 1 1 auto; min-width: 0; height: 44px; padding: 0 16px;
  border: 1px solid var(--line); border-radius: 10px; background: #fff;
  font-size: 14.5px; color: var(--ink); font-family: inherit;
}
.nl-search input::placeholder { color: #9aa7bb; }
.nl-search input:focus { outline: none; border-color: var(--pri); box-shadow: 0 0 0 3px rgba(37, 99, 235, .12); }
.nl-search button {
  flex: 0 0 auto; height: 44px; padding: 0 24px; border: 0; border-radius: 10px;
  background: linear-gradient(180deg, #3f83f8, #2563eb); color: #fff;
  font-size: 14.5px; font-weight: 600; font-family: inherit; cursor: pointer;
  transition: background .18s ease;
}
.nl-search button:hover { background: linear-gradient(180deg, #3475ef, #1d4ed8); }

.nl-body { padding: 26px 0 10px; }

/* 行式条目：日期块 → 文字 → 缩略图。密度是这套版式的第一目标。 */
.nl-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.nl-item { border-bottom: 1px solid var(--line); }
.nl-link {
  display: grid; grid-template-columns: 74px minmax(0, 1fr) 168px;
  gap: 26px; align-items: center; padding: 22px 6px;
  text-decoration: none; color: inherit; transition: background .18s ease;
}
.nl-link:hover { background: #f7faff; }

.nl-date { display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 6px 0; }
.nl-date b { font-size: 25px; font-weight: 800; line-height: 1; letter-spacing: .5px; color: var(--pri); font-variant-numeric: tabular-nums; }
.nl-date span { font-size: 11.5px; letter-spacing: .4px; color: var(--muted); font-variant-numeric: tabular-nums; }

.nl-body-in { min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.nl-flags { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 12.5px; color: var(--muted); }
.nl-badge {
  font-style: normal; padding: 2px 10px; border-radius: 999px;
  background: rgba(37, 99, 235, .10); color: var(--pri);
  font-size: 11.5px; font-weight: 700; letter-spacing: .5px;
}
.nl-title {
  font-size: 18px; font-weight: 700; line-height: 1.55; color: var(--ink);
  transition: color .18s ease;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.nl-link:hover .nl-title { color: var(--pri); }
.nl-desc {
  font-size: 14px; line-height: 1.85; color: var(--muted);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

.nl-thumb {
  display: block; aspect-ratio: 16 / 10; border-radius: 12px; overflow: hidden;
  background: linear-gradient(135deg, #e8eefc, #f6f8fd);
}
.nl-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.nl-ph { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: #b8c9e4; }
.nl-ph svg { width: 30px; height: 30px; }

/* 头条行：图更大、标题更大，给资讯流一个视觉入口 */
.nl-item-top .nl-link { grid-template-columns: 74px minmax(0, 1fr) 300px; padding: 28px 6px; }
.nl-item-top .nl-title { font-size: 22px; }
.nl-item-top .nl-desc { -webkit-line-clamp: 3; font-size: 14.5px; }

/* 弱转化细条：与文章详情页的「弱转化」人格保持一致 */
.nl-cta { margin: 36px 0 0; }
.nl-cta-in {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 14px 28px; padding: 20px 26px;
  background: #f7faff; border: 1px solid #e2ecfb; border-radius: 14px;
}
.nl-cta-in > div { min-width: 240px; }
.nl-cta-t { margin: 0 0 5px; font-size: 16.5px; font-weight: 700; color: var(--ink); }
.nl-cta-p { margin: 0; font-size: 13.8px; line-height: 1.7; color: var(--muted); }
.nl-cta-btns { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; }
.nl-cta-btns a { margin: 0; padding: 10px 22px; border-radius: 999px; font-size: 13.8px; font-weight: 600; text-decoration: none; }

/* ---------- 21.2 产品 = 货架（ps-* / shelf-*） ---------- */
.ps-page .cat-layout { margin-top: 26px; }
.cat-layout-plain { grid-template-columns: minmax(0, 1fr); }

.ps-bar {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between;
  gap: 6px 20px; margin: 0 0 16px; padding: 0 2px 12px; border-bottom: 1px solid var(--line);
}
.ps-bar-n { font-size: 14px; color: var(--muted); }
.ps-bar-n b { font-size: 19px; font-weight: 800; color: var(--ink); }
.ps-bar-hint { font-size: 12.8px; color: #97a3b6; }

.shelf-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(272px, 1fr));
  gap: 22px; list-style: none; margin: 0; padding: 0;
}
.shelf-card {
  display: flex; min-width: 0; overflow: hidden;
  background: #fff; border: 1px solid #e8edf4; border-radius: 16px;
  box-shadow: 0 2px 10px rgba(15, 23, 42, .05);
  transition: transform .26s ease, box-shadow .26s ease, border-color .26s ease;
}
.shelf-card:hover { box-shadow: 0 14px 32px rgba(15, 23, 42, .10); border-color: #d8e3f6; }
.shelf-card > a { display: flex; flex-direction: column; width: 100%; color: inherit; text-decoration: none; }

.shelf-media { display: block; position: relative; height: 176px; overflow: hidden; background: linear-gradient(135deg, #e8eefc, #f6f8fd); }
.shelf-media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.22, .61, .36, 1); }
.shelf-card:hover .shelf-media img { transform: scale(1.035); }

.shelf-body { display: flex; flex-direction: column; flex: 1; gap: 10px; padding: 16px 18px 18px; }
.shelf-title {
  font-size: 16.5px; font-weight: 700; line-height: 1.5; color: var(--ink);
  transition: color .18s ease;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.shelf-card:hover .shelf-title { color: var(--pri); }
.shelf-price { font-size: 18px; font-weight: 800; letter-spacing: .3px; color: var(--price); }
.shelf-price-todo { font-size: 15px; font-weight: 600; color: var(--muted); }

/* 参数行：货架的signature —— 把 spec 摊开在卡面上，这是「比规格」而非「看故事」 */
.shelf-specs {
  list-style: none; margin: 0; padding: 12px 0 0;
  border-top: 1px dashed var(--line); display: grid; gap: 7px;
}
.shelf-specs li { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font-size: 12.8px; line-height: 1.6; }
.shelf-specs li b { flex: 0 0 auto; font-weight: 500; color: #8c99ad; }
.shelf-specs li span { min-width: 0; text-align: right; font-weight: 600; color: #33415c; }
.shelf-desc {
  font-size: 13px; line-height: 1.75; color: var(--muted);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

/* ---------- 21.3 案例 = 作品墙（cw-*） ---------- */
/* 实景图头带：底图是本页第一个案例的真实项目图（不是通用素材图） */
.cw-hero { background: #0b1730; padding-top: 0; padding-bottom: 0; }
.cw-hero::before { content: none; }
.cw-hero::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  /* 必须显式把宽高改回 auto —— 基础层 .e-hero::after 写死了 width/height:340px，
     只给 inset:0 无法撤销它（left+right+width 三者都非 auto 时 right 被忽略），
     结果会画出 340×340 的小方块而不是整幅遮罩。 */
  width: auto; height: auto;
  background: linear-gradient(180deg, rgba(6, 14, 33, .62) 0%, rgba(8, 18, 40, .55) 48%, rgba(6, 14, 33, .90) 100%);
}
.cw-hero-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.cw-hero-in { position: relative; z-index: 2; padding: 74px 0 58px; }
.cw-hero .e-eyebrow { margin: 0 0 10px; }
/* 标题带 .cw-hero 前缀：基础层 `.e-hero h1` (0,1,1) 会压掉纯类选择器 */
.cw-hero .cw-hero-h1 { margin: 0 0 14px; font-size: clamp(28px, 3.4vw, 44px); line-height: 1.28; letter-spacing: .5px; color: #fff; text-shadow: 0 2px 20px rgba(2, 8, 23, .45); }

.cw-body { padding: 26px 0 10px; }
.cw-wall { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px; }
.cw-card {
  display: flex; flex-direction: column; min-width: 0; overflow: hidden;
  background: #fff; border: 1px solid #e8edf4; border-radius: 18px;
  text-decoration: none; color: inherit; box-shadow: 0 2px 10px rgba(15, 23, 42, .05);
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.cw-card:hover { box-shadow: 0 18px 40px rgba(15, 23, 42, .12); border-color: #d8e3f6; }
.cw-card-lead { grid-column: 1 / -1; }

.cw-media { display: block; position: relative; height: 240px; overflow: hidden; background: linear-gradient(135deg, #e8eefc, #f6f8fd); }
.cw-card-lead .cw-media { height: 310px; }
.cw-media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.22, .61, .36, 1); }
.cw-card:hover .cw-media img { transform: scale(1.03); }
.cw-ph { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: #b8c9e4; }
.cw-ph svg { width: 44px; height: 44px; }
.cw-tag {
  position: absolute; left: 14px; top: 14px; z-index: 2;
  font-style: normal; padding: 5px 13px; border-radius: 999px;
  background: rgba(255, 255, 255, .94); color: var(--pri);
  font-size: 12px; font-weight: 700; letter-spacing: .5px;
  box-shadow: 0 4px 14px rgba(15, 23, 42, .14);
}
.cw-pin {
  position: absolute; right: 14px; top: 14px; z-index: 2;
  font-style: normal; padding: 5px 13px; border-radius: 999px;
  background: rgba(37, 99, 235, .94); color: #fff;
  font-size: 12px; font-weight: 700; letter-spacing: 1.4px;
  box-shadow: 0 4px 12px rgba(37, 99, 235, .35);
}

.cw-cap { display: flex; flex-direction: column; flex: 1; gap: 10px; padding: 20px 22px 22px; }
.cw-client { font-size: 12.8px; letter-spacing: .4px; color: var(--muted); }
.cw-title {
  font-size: 17.5px; font-weight: 700; line-height: 1.55; color: var(--ink);
  transition: color .18s ease;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.cw-card-lead .cw-title { font-size: 20px; }
.cw-card:hover .cw-title { color: var(--pri); }

/* 效果数据：案例卡面上最有说服力的一块（取自 spec 的「指标: 结果」） */
.cw-stats { display: flex; flex-wrap: wrap; gap: 10px; }
.cw-stat {
  display: flex; flex-direction: column; gap: 3px; min-width: 104px;
  padding: 10px 14px; border-radius: 11px;
  background: #f4f8ff; border: 1px solid #e2ecfb;
}
.cw-stat b { font-size: 16px; font-weight: 800; line-height: 1.25; color: var(--pri); }
.cw-stat i { font-style: normal; font-size: 11.8px; color: #7b8aa3; }
.cw-desc {
  font-size: 13.5px; line-height: 1.8; color: var(--muted);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.cw-more { margin-top: auto; font-size: 13.2px; font-weight: 700; color: var(--pri); }

.cw-final { margin: 34px 0 0; }
.cw-final-in {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 18px; padding: 26px 30px; border-radius: 16px;
  background: linear-gradient(135deg, #0b1730, #17335c);
}
.cw-final-text { min-width: 260px; }
.cw-final-t { margin: 0 0 6px; font-size: 18px; font-weight: 700; color: #fff; }
.cw-final-text p:last-child { margin: 0; font-size: 14px; line-height: 1.7; color: rgba(255, 255, 255, .72); }
.cw-final-btns { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; }
.cw-final-btns a { margin: 0; padding: 11px 22px; border-radius: 10px; font-size: 14px; font-weight: 600; text-decoration: none; }

/* ---------- 21.4 三套列表版式的响应式收口 ---------- */
@media (max-width: 1080px) {
  .nl-link, .nl-item-top .nl-link { grid-template-columns: 70px minmax(0, 1fr) 220px; gap: 20px; }
}
@media (max-width: 860px) {
  .nl-link, .nl-item-top .nl-link { grid-template-columns: 56px minmax(0, 1fr) 92px; gap: 14px; padding: 18px 2px; }
  .nl-thumb { aspect-ratio: 1 / 1; border-radius: 10px; }
  .nl-title, .nl-item-top .nl-title { font-size: 16.5px; }
  .nl-desc, .nl-item-top .nl-desc { -webkit-line-clamp: 2; font-size: 13.4px; }
  .nl-date b { font-size: 21px; }
  .nl-search { max-width: none; }
  .nl-cta-in { padding: 18px 20px; }
  .nl-cta-in > div { min-width: 0; }

  .shelf-grid { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
  .shelf-media { height: 150px; }

  .cw-wall { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .cw-media { height: 210px; }
  .cw-card-lead .cw-media { height: 230px; }
  .cw-hero-in { padding: 52px 0 44px; }
  .cw-final-in { padding: 22px 20px; }
  .cw-final-text, .cw-final-btns a { min-width: 0; }
}
@media (max-width: 560px) {
  .nl-desc, .nl-item-top .nl-desc { display: none; }
  .nl-link, .nl-item-top .nl-link { grid-template-columns: 48px minmax(0, 1fr) 76px; gap: 12px; }
  .nl-thumb { border-radius: 8px; }
  .nl-cta-btns a { flex: 1 1 100%; text-align: center; }
  .cw-stat { min-width: 88px; padding: 8px 11px; }
  .cw-final-btns a { flex: 1 1 100%; text-align: center; }
  .shelf-body { padding: 14px 14px 16px; }
}



/* ============ 20. 栏目 hero 浅色化 + 高度统一 + 封面图交互自然化（2026-09-19） ============ */

/* 20.1 非首页 hero 统一高度：内容垂直居中（文章详情 mini 头部除外） */
.e-hero, .pd-hero {
  min-height: 300px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.detail-news .e-hero-mini { min-height: 0; display: block; }
@media (max-width: 720px) {
  .e-hero, .pd-hero { min-height: 220px; }
  .detail-news .e-hero-mini { min-height: 0; }
}

/* 20.2 列表/单页 hero：深色大图 → 浅色遮罩提亮（首页深色 hero 保留不动） */
.e-hero, .e-hero-page {
  background:
    linear-gradient(180deg, rgba(238, 244, 255, .90) 0%, rgba(246, 250, 255, .84) 55%, rgba(232, 240, 253, .94) 100%),
    url('/uploads/site/hero-list.webp') center / cover no-repeat;
  background-size: cover;
}
.e-hero-page {
  background:
    linear-gradient(180deg, rgba(238, 244, 255, .90) 0%, rgba(246, 250, 255, .84) 55%, rgba(232, 240, 253, .94) 100%),
    url('/uploads/site/hero-page.webp') center / cover no-repeat;
  background-size: cover;
}

/* 20.3 hero 内文字恢复浅色系配色（白字 → 深字，可读性在浅底上成立） */
.e-hero h1, .e-hero-page h1, .detail-case .e-hero-h1, .cw-hero .cw-hero-h1 { color: var(--ink); text-shadow: none; }
.e-hero .e-eyebrow, .e-hero-page .e-eyebrow, .cw-hero .e-eyebrow { color: var(--pri); }
.e-hero .e-eyebrow::before, .e-hero-page .e-eyebrow::before, .cw-hero .e-eyebrow::before { background: var(--pri); }
.e-hero .e-desc, .e-hero-page .e-desc, .cw-hero .e-desc { color: var(--text); }
.e-hero .e-meta, .e-hero-page .e-meta { color: var(--muted); }
.e-hero .e-meta b, .e-hero-page .e-meta b { color: var(--ink); }
.e-hero .e-num, .e-hero-page .e-num { color: var(--pri); }
.e-hero .e-crumb, .e-hero-page .e-crumb { color: var(--muted); }
.e-hero .e-crumb a, .e-hero-page .e-crumb a { color: var(--text); }
.e-hero .e-crumb a:hover, .e-hero-page .e-crumb a:hover { color: var(--pri); }
.e-hero .e-crumb .sep, .e-hero-page .e-crumb .sep { color: #cbd5e1; }
.e-hero .e-hero-facts li { background: rgba(255, 255, 255, .92); border-color: #dbe7fb; backdrop-filter: none; box-shadow: 0 4px 14px rgba(37, 99, 235, .07); }
.e-hero .e-hero-facts b { color: var(--pri); }
.e-hero .e-hero-facts span { color: var(--text); }

/* 20.4 案例列表/详情 hero：深蓝底 + 深遮罩 → 浅色提亮 + 浅遮罩 */
.cw-hero { background: #eef4ff; }
.cw-hero::after {
  width: auto; height: auto;
  background: linear-gradient(180deg, rgba(238, 244, 255, .90) 0%, rgba(244, 249, 255, .84) 48%, rgba(229, 240, 253, .95) 100%);
}
.cw-hero-bg { filter: brightness(1.25) saturate(.88); opacity: .92; }
.e-hero-case { background: #eef4ff; }
.e-hero-case::after {
  background: linear-gradient(180deg, rgba(238, 244, 255, .90) 0%, rgba(244, 249, 255, .84) 48%, rgba(229, 240, 253, .95) 100%);
}

/* 20.5 产品详情 hero：深蓝渐变 → 浅色营销网格（与单页/列表同族） */
.pd-hero {
  background:
    radial-gradient(46% 120% at 10% -20%, rgba(37, 99, 235, .08), transparent 60%),
    radial-gradient(28% 90% at 97% 0%, rgba(124, 58, 237, .05), transparent 60%),
    linear-gradient(rgba(37, 99, 235, .03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(37, 99, 235, .03) 1px, transparent 1px),
    linear-gradient(180deg, #eef4ff 0%, #fafcff 100%);
  background-size: auto, auto, 44px 44px, 44px 44px, auto;
}
.detail-product .pd-eyebrow { color: var(--pri); }
.detail-product .pd-title { color: var(--ink); text-shadow: none; }
.detail-product .pd-sub { color: var(--text); }
.detail-product .pd-price b { color: var(--price); }
.detail-product .pd-price span { color: var(--muted); }
.pd-hero-media { border: 1px solid #dbe7fb; background: #eef4ff; box-shadow: 0 18px 40px rgba(37, 99, 235, .12); }
.pd-hero-points { border-top: 1px solid var(--line); }
.pd-hero-points li span { color: var(--muted); }
.pd-hero-points li b { color: var(--ink); }

/* 20.6 首页封面图（产品/案例/新闻）交互自然化：柔和缩放 + 底部浅渐变 + 缓动曲线 */
.card, .news-cards li {
  transition: box-shadow .4s cubic-bezier(.22, .61, .36, 1), transform .4s cubic-bezier(.22, .61, .36, 1), border-color .4s ease;
}
/* 2026-09-19 封面图交互柔化（用户要求"自然、不硬"）：
   放大幅度 1.06 → 1.025（几乎察觉不到的缓推），时长 0.9s → 1.4s 更慢更柔；
   去掉 hover 压暗遮罩（不再"啪"地暗一块），改为极淡的柔光过渡，hover 只让图片亮度轻微提升。 */
.card-media, .news-cards .news-media { position: relative; }
.card-media img, .news-cards .news-media img {
  transition: transform 1.4s cubic-bezier(.16, .72, .28, 1), filter .6s ease, opacity .6s ease;
  will-change: transform;
}
.card:hover .card-media img, .news-cards li:hover .news-media img { transform: scale(1.025); filter: brightness(1.04); }
.card-media::after, .news-cards .news-media::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(180deg, transparent 70%, rgba(37, 99, 235, .04));
  opacity: 0; transition: opacity .6s ease;
}
.card:hover .card-media::after, .news-cards li:hover .news-media::after { opacity: 1; }



/* ============ 21. 详情页宽屏化 + 页脚版权栏左右留距（2026-09-19） ============ */

/* 21.1 产品/案例/新闻详情：--detail-col 对齐 .wrap 内容盒宽度（1680 - 2*20 = 1640px），
   使详情正文区左右边缘与头部导航完全对齐（此前 1440px 居中导致内容比导航窄、左右留白不均）。 */
.detail-product, .detail-case, .detail-news { --detail-col: 1640px; }
/* 新闻正文阅读列同步加宽（保持可读性，不过度超行宽） */
.detail-news { --nw-read: 1160px; }

/* 21.2 原「负 margin 出血」规则已移除（2026-09-19）：负 margin 让详情容器相对 .wrap 的 20px padding
   左右各外扩 20px，会比导航内容更宽、反而不对齐。现在详情容器 max-width 已等于 .wrap 内容盒，
   铺满即可，无需出血。 */

/* 21.3 页脚版权栏：左侧（版权/备案）与右侧（友链/统计）之间保证最小间距，
   space-between 之外再给 gap，右侧内容再多也不会贴住左侧 */
.foot-bar { gap: 16px 48px; }
@media (max-width: 720px) {
  .foot-bar { gap: 14px 16px; }
}
/* 平板/小笔记本（≤1024）：右侧友链整行换到版权下方并左对齐，与左侧版权栏
   保持明确垂直间距，避免两块在临界宽度悬空相挤。.foot-bar .flinks 特异性高于
   友链插件内联样式表中的 .flinks，确保模板侧可控 */
@media (max-width: 1024px) {
  .foot-bar .flinks { width: 100%; justify-content: flex-start; margin: 14px 0 0; }
}


/* ============ 22. 国际营销型高标准 · 现代质感升级（2026-09-19） ============ */
/* 原则：所有新特性均带降级（旧内核忽略新声明即回退旧表现）；JS 动画渐进增强，
   无 IntersectionObserver 或用户开启减动效时元素始终可见；纯静态直出与语义结构不变。 */

/* 22.1 字体与排版：现代系统字体栈（Inter 在则优先，中文回退苹方/鸿蒙/雅黑）+ 渲染优化 */
body {
  font-family: "Inter", -apple-system, "SF Pro Text", "PingFang SC", "HarmonyOS Sans SC", "Microsoft YaHei", "Segoe UI", system-ui, sans-serif;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "kern" 1, "liga" 1;
}
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* 22.2 排版细节：标题平衡换行 / 正文段落断行优化（不支持的内核自动忽略） */
.hero h1, .block-head h2, .e-hero h1, .e-hero-page h1, .nw-title, .pd-title, .cw-hero-h1, .e-hero-h1,
.detail h1, .cls-page-head h1, .biz-page-head h1 { text-wrap: balance; }
p, li { text-wrap: pretty; }

/* 22.3 品牌选中色 */
::selection { background: #2563eb; color: #fff; }

/* 22.4 无障碍焦点环：键盘导航可见、鼠标点击不闪（国际站标准细节） */
a:focus-visible, button:focus-visible, .nav-toggle:focus-visible + .nav-burger,
summary:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid #2563eb; outline-offset: 2px; border-radius: 6px;
}

/* 22.5 现代细滚动条（WebKit 内核；Firefox 用 scrollbar-width 精简） */
html { scrollbar-width: thin; scrollbar-color: #c7d4ea #f1f5f9; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: #c7d4ea; border-radius: 8px; border: 2px solid #f1f5f9; }
::-webkit-scrollbar-thumb:hover { background: #a9bce0; }

/* 22.6 首页 hero 标题层级向国际大品牌看齐：更大更醒目（旧内核回退原字号） */
.hero h1 { font-size: clamp(30px, 4.4vw, 54px); letter-spacing: .5px; }

/* 22.7 滚动渐入动画（CSS 侧：仅当 .reveal-ready 存在时隐藏，JS 渐进增强保证无 JS 可见） */
.reveal-ready [data-reveal] {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity .7s cubic-bezier(.22, .61, .36, 1), transform .7s cubic-bezier(.22, .61, .36, 1);
}
.reveal-ready [data-reveal].in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .reveal-ready [data-reveal] { opacity: 1; transform: none; transition: none; }
}


/* ============ 23. 描边按钮统一：浅色边框 + 同行按钮等高（2026-09-19） ============ */
/* .btn-line（查看全部/了解更多等次要按钮）边框由深蓝 var(--pri) 改为浅蓝 #bcd2f6，
   与 .btn-ghost 同一浅色体系；hover 填充主蓝时边框随同变深，视觉不突兀。 */
.btn-line { border-color: #bcd2f6; }
.btn-line:hover { border-color: var(--pri); background: var(--pri); color: #fff; }

/* ============================================================
   24. 全站按钮样式统一（2026-09-19）
   按用户要求：全站所有按钮统一为「白底 + 1px 蓝边 + 蓝字 + 小圆角」，
   hover 时填充主蓝、文字变白。覆盖此前散落的实心蓝/渐变/胶囊圆角等变体。
   ============================================================ */
.btn-pri, .btn-ghost, .btn-line, .btn-line-inv, .btn-sm,
.site-nav .nav-cta,
.hero-btns .btn-pri, .hero-btns .btn-ghost,
.e-hero-cta .btn-pri, .e-hero-cta .btn-ghost, .e-hero-cta .btn-line,
.detail-cta .btn-pri, .detail-cta .btn-ghost,
.detail-cta-btns .btn-pri, .detail-cta-btns .btn-ghost, .detail-cta-btns .btn-line,
.cta-btns .btn-pri, .cta-btns .btn-ghost, .cta-btns .btn-line,
.contact-actions .btn-pri, .contact-actions .btn-ghost, .contact-actions .btn-line,
.block-more .btn-pri, .block-more .btn-line,
.cta-band .btn-pri, .cta-band .btn-ghost,
.pd-rail-btns .btn-pri, .pd-rail-btns .btn-ghost, .pd-rail-btns .btn-line,
.search-box .btn-pri,
.e404 .btns .btn-pri, .e404 .btns .btn-ghost {
  display: inline-block;
  padding: 10px 24px;
  background: #ffffff;
  border: 1px solid var(--pri);
  border-radius: 8px;
  color: var(--pri);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  box-shadow: none;
  margin-right: 0;
  transition: background .18s, color .18s, border-color .18s, box-shadow .18s, transform .18s;
}
.btn-pri:hover, .btn-ghost:hover, .btn-line:hover, .btn-line-inv:hover, .btn-sm:hover,
.site-nav .nav-cta:hover,
.hero-btns .btn-pri:hover, .hero-btns .btn-ghost:hover,
.e-hero-cta .btn-pri:hover, .e-hero-cta .btn-ghost:hover, .e-hero-cta .btn-line:hover,
.detail-cta .btn-pri:hover, .detail-cta .btn-ghost:hover,
.detail-cta-btns .btn-pri:hover, .detail-cta-btns .btn-ghost:hover, .detail-cta-btns .btn-line:hover,
.cta-btns .btn-pri:hover, .cta-btns .btn-ghost:hover, .cta-btns .btn-line:hover,
.contact-actions .btn-pri:hover, .contact-actions .btn-ghost:hover, .contact-actions .btn-line:hover,
.block-more .btn-pri:hover, .block-more .btn-line:hover,
.cta-band .btn-pri:hover, .cta-band .btn-ghost:hover,
.pd-rail-btns .btn-pri:hover, .pd-rail-btns .btn-ghost:hover, .pd-rail-btns .btn-line:hover,
.search-box .btn-pri:hover,
.e404 .btns .btn-pri:hover, .e404 .btns .btn-ghost:hover { background: var(--pri);
  border-color: var(--pri);
  color: #ffffff;
  box-shadow: 0 6px 16px rgba(37, 99, 235, .18); }
.btn-pri:active, .btn-ghost:active, .btn-line:active, .btn-line-inv:active, .btn-sm:active,
.site-nav .nav-cta:active { transform: translateY(0); box-shadow: none; }
/* 小按钮（侧边栏在线预约/在线询价）保持更小尺寸 */
.btn-sm { padding: 7px 16px; font-size: 13px; }
/* 导航栏 CTA 保持合适尺寸 */
.site-nav .nav-cta { padding: 9px 20px; }
/* 搜索框按钮高度对齐输入框 */
.search-box .btn-pri { height: 46px; padding: 0 26px; }
/* 移动端：hero/cta 区按钮占满整行 */
@media (max-width: 720px) {
  .hero-btns .btn-pri, .hero-btns .btn-ghost,
  .e-hero-cta .btn-pri, .e-hero-cta .btn-ghost,
  .detail-cta .btn-pri, .detail-cta .btn-ghost,
  .cta-btns .btn-pri, .cta-btns .btn-ghost,
  .contact-actions .btn-pri, .contact-actions .btn-ghost,
  .site-nav .nav-cta {
    display: block; width: 100%; margin: 0 0 10px; }
}

/* 24.1 主按钮（强调/转化）：蓝底白字，与次按钮（白底蓝字描边）形成层级（2026-09-19 用户要求加强） */
.btn-pri,
.site-nav .nav-cta,
.hero-btns .btn-pri,
.e-hero-cta .btn-pri,
.detail-cta .btn-pri,
.detail-cta-btns .btn-pri,
.cta-btns .btn-pri,
.contact-actions .btn-pri,
.block-more .btn-pri,
.cta-band .btn-pri,
.pd-rail-btns .btn-pri,
.search-box .btn-pri,
.e404 .btns .btn-pri {
  background: var(--pri);
  border-color: var(--pri);
  color: #ffffff;
  font-weight: 600;
  box-shadow: 0 4px 14px rgba(37, 99, 235, .22);
}
.btn-pri:hover,
.site-nav .nav-cta:hover,
.hero-btns .btn-pri:hover,
.e-hero-cta .btn-pri:hover,
.detail-cta .btn-pri:hover,
.detail-cta-btns .btn-pri:hover,
.cta-btns .btn-pri:hover,
.contact-actions .btn-pri:hover,
.block-more .btn-pri:hover,
.cta-band .btn-pri:hover,
.pd-rail-btns .btn-pri:hover,
.search-box .btn-pri:hover,
.e404 .btns .btn-pri:hover {
  background: var(--pri-d);
  border-color: var(--pri-d);
  color: #ffffff;
  box-shadow: 0 8px 20px rgba(37, 99, 235, .30);
}
/* 深色 hero 背景上的主按钮：蓝底加一点透明亮感，避免与深蓝背景融在一起 */
.hero-btns .btn-pri, .e-hero-cta .btn-pri {
  box-shadow: 0 6px 18px rgba(37, 99, 235, .45);
}

/* 25. hero 左文右图布局 + 右侧图交互动画（2026-09-19） */
.hero { text-align: left; padding: 72px 0 28px; }
.hero-in {
  max-width: 1560px; margin-left: auto; margin-right: auto;
  padding-left: var(--pad); padding-right: var(--pad);
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 42%);
  gap: 48px; align-items: stretch;
}
.hero-facts {
  max-width: 1560px; margin: 34px auto 0;
  padding-left: var(--pad); padding-right: var(--pad);
}
/* 宽屏不另设 1840：15.1 节 .wrap{ max-width:1560px}（后写）实际已让全站容器统一为
   1560，旧的 ≥1920=1840 规则被其覆盖失效；hero 容器严格跟随 .wrap，保证与导航对齐 */
.hero-text .hero-sub { margin-left: 0; max-width: 560px; }
.hero-text .hero-chips { text-align: left; }
/* 右侧展示图：圆角卡片 + 柔和上下浮动 + hover 上浮放大 */
.hero-visual { position: relative; }
.hero-visual img {
  width: 100%; height: auto; display: block;
  border-radius: 20px;
  box-shadow: 0 24px 60px rgba(2, 8, 23, .45);
  animation: heroFloat 6s ease-in-out infinite;
  transition: transform .5s ease, box-shadow .5s ease;
}
.hero-visual:hover img {
  transform: translateY(-6px) scale(1.02);
  box-shadow: 0 32px 72px rgba(2, 8, 23, .55);
}
@keyframes heroFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}
.hero-facts { margin-top: 34px; }
/* 平板/手机：上下堆叠，右图收窄居中 */
@media (max-width: 960px) {
  .hero { padding: 50px 0 28px; }
  .hero-in { grid-template-columns: 1fr; gap: 28px; align-items: stretch; }
  .hero-visual { max-width: 460px; margin: 0 auto; align-self: auto; }
  .hero-side-video { height: auto; aspect-ratio: 16 / 9; }
}
/* 减动效：关闭浮动 */
@media (prefers-reduced-motion: reduce) {
  .hero-visual img { animation: none; }
}


/* ============================================================
   26. 国际大品牌风 · 栏目 hero 深色沉浸式重设计（2026-09-19）
   设计语言：Stripe / Linear / Vercel —— 近黑深靛蓝底 + 柔和光晕图 +
   极淡工程网格 + 白字大标题 + 玻璃拟态徽章/按钮。左对齐、克制、大留白。
   作用域：栏目列表页(.e-hero)、单页(.e-hero-page)、案例墙(.cw-hero)。
   首页 .hero 已是深色左文右图，保持不动以全站统一。
   本层为最终覆盖层（后写即生效）；旧图已备份 *.lightbak.webp / *.bak.webp。
   ============================================================ */

/* ---- 26.1 底色：新光晕图 + 左深右透可读遮罩 + 极淡网格 ---- */
.e-hero, .e-hero-page {
  background:
    linear-gradient(90deg, rgba(6,10,20,.94) 0%, rgba(6,10,20,.78) 42%, rgba(6,10,20,.36) 100%),
    linear-gradient(180deg, rgba(6,10,20,.60) 0%, rgba(6,10,20,.28) 48%, rgba(6,10,20,.62) 100%),
    linear-gradient(rgba(148,178,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(148,178,255,.05) 1px, transparent 1px),
    url('/uploads/site/hero-list.webp') center / cover no-repeat,
    #0a0f1e;
  background-size: auto, auto, 44px 44px, 44px 44px, cover, auto;
  border-bottom: 1px solid rgba(148,178,255,.10);
}
/* 单页用更柔的蓝紫光晕变体 */
.e-hero-page {
  background-image:
    linear-gradient(90deg, rgba(6,10,20,.94) 0%, rgba(6,10,20,.78) 42%, rgba(6,10,20,.36) 100%),
    linear-gradient(180deg, rgba(6,10,20,.60) 0%, rgba(6,10,20,.28) 48%, rgba(6,10,20,.62) 100%),
    linear-gradient(rgba(148,178,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(148,178,255,.05) 1px, transparent 1px),
    url('/uploads/site/hero-page.webp') center / cover;
}
/* 旧营销光斑圆 ::before/::after 关闭，避免与新光晕打架 */
.e-hero::before, .e-hero::after { content: none; }

/* ---- 26.2 排版：超大左对齐标题 + 精致 eyebrow ---- */
.e-hero, .e-hero-page { text-align: left; }
.e-hero h1, .e-hero-page h1, .detail-case .e-hero-h1, .cw-hero .cw-hero-h1 {
  color: #f8fafc;
  text-shadow: 0 2px 28px rgba(2,8,23,.55);
  font-size: clamp(32px, 4.4vw, 58px);
  line-height: 1.08;
  letter-spacing: -.01em;
  font-weight: 700;
  margin: 0 0 16px;
}
.e-hero .e-eyebrow, .e-hero-page .e-eyebrow, .cw-hero .e-eyebrow {
  color: #7dd3fc;
  font-size: 12px;
  letter-spacing: 4px;
  font-weight: 700;
  text-transform: uppercase;
  margin: 0 0 16px;
}
.e-hero .e-eyebrow::before, .e-hero-page .e-eyebrow::before, .cw-hero .e-eyebrow::before {
  background: #38bdf8;
  width: 28px;
  height: 2px;
}
.e-hero .e-desc, .e-hero-page .e-desc, .cw-hero .e-desc,
.ab-hero .e-desc, .ct-hero .e-desc, .sv-hero .e-desc {
  color: rgba(226,232,240,.80);
  font-size: clamp(15px, .35vw + 14px, 17px);
  line-height: 1.8;
  max-width: 640px;
}
.e-hero .e-meta, .e-hero-page .e-meta { color: rgba(203,213,225,.72); }
.e-hero .e-meta b, .e-hero-page .e-meta b { color: #f1f5f9; }
.e-hero .e-num, .e-hero-page .e-num { color: #7dd3fc; }

/* ---- 26.3 信任徽章：玻璃拟态 ---- */
.e-hero .e-hero-facts li, .e-hero-page .e-hero-facts li {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: none;
}
.e-hero .e-hero-facts b, .e-hero-page .e-hero-facts b { color: #7dd3fc; }
.e-hero .e-hero-facts span, .e-hero-page .e-hero-facts span { color: rgba(226,232,240,.85); }

/* ---- 26.4 CTA：主按钮白底蓝字，次按钮玻璃拟态 ---- */
.e-hero-cta .btn-pri {
  background: #ffffff !important;
  border-color: #ffffff !important;
  color: #0f1e3d !important;
  font-weight: 600;
  box-shadow: 0 8px 24px rgba(2,8,23,.35);
}
.e-hero-cta .btn-pri:hover {
  background: #eaf2ff !important; border-color: #eaf2ff !important; color: #1d4ed8 !important;
  box-shadow: 0 10px 28px rgba(2,8,23,.4);
}
.e-hero-cta .btn-ghost {
  background: rgba(255,255,255,.08) !important;
  border-color: rgba(255,255,255,.35) !important;
  color: #ffffff !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: none !important;
}
.e-hero-cta .btn-ghost:hover {
  background: rgba(255,255,255,.16) !important; border-color: rgba(255,255,255,.6) !important; color: #ffffff !important;
}

/* ---- 26.5 资讯列表 hero：搜索框与计数深色适配 ---- */
.nl-hero .nl-count { color: rgba(203,213,225,.72); }
.nl-hero .nl-count b { color: #7dd3fc; }
.nl-hero .nl-search input {
  background: rgba(255,255,255,.07);
  border-color: rgba(255,255,255,.18);
  color: #f1f5f9;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.nl-hero .nl-search input::placeholder { color: rgba(203,213,225,.55); }
.nl-hero .nl-search input:focus {
  border-color: #7dd3fc;
  box-shadow: 0 0 0 3px rgba(125,211,252,.18);
  background: rgba(255,255,255,.10);
}
.nl-hero .nl-search button {
  background: #ffffff;
  color: #0f1e3d;
  font-weight: 600;
}
.nl-hero .nl-search button:hover { background: #eaf2ff; }

/* ---- 26.6 案例墙 hero：深底 + 案例图加深遮罩（保留真实项目图证据感） ---- */
.cw-hero { background: #0a0f1e; }
.cw-hero::before { content: none; }
.cw-hero::after {
  width: auto; height: auto;
  background: linear-gradient(90deg, rgba(6,10,20,.94) 0%, rgba(6,10,20,.78) 42%, rgba(6,10,20,.36) 100%),
              linear-gradient(180deg, rgba(6,10,20,.60) 0%, rgba(6,10,20,.28) 48%, rgba(6,10,20,.62) 100%);
}
.cw-hero-bg { filter: none; opacity: 1; }

/* ---- 26.7 移动端收束 ---- */
@media (max-width: 720px) {
  .e-hero h1, .e-hero-page h1, .detail-case .e-hero-h1, .cw-hero .cw-hero-h1 {
    font-size: 27px; }
  .e-hero .e-eyebrow, .e-hero-page .e-eyebrow, .cw-hero .e-eyebrow { letter-spacing: 3px; }
}

/* ---- 26.8 hero CTA 双按钮间距（用户反馈：电话/免费获取方案贴在一起） ---- */
.e-hero-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.e-hero-cta .btn-pri, .e-hero-cta .btn-ghost, .e-hero-cta .btn-line { margin-right: 0; }
@media (max-width: 720px) {
  .e-hero-cta { gap: 0; }
  .e-hero-cta .btn-pri, .e-hero-cta .btn-ghost, .e-hero-cta .btn-line { width: 100%; margin: 0 0 10px; }
}
/* ============================================================
   27. 浅色国际风 · 全站 hero 与深色块统一（2026-09-19）
   设计语言：Apple / Notion / Stripe 浅色模式 —— 纯白/极浅底 +
   极淡蓝紫雾光晕 + 深色大标题 + 浅灰卡片 + 蓝底主按钮。
   覆盖第 26 层深色规则与首页/案例旧深色规则，全站统一浅色。
   ============================================================ */

/* ---- 27.1 栏目 hero（列表/单页）：浅色底 + 新浅色光晕图 ---- */
.e-hero, .e-hero-page {
  background:
    linear-gradient(90deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.72) 45%, rgba(255,255,255,.35) 100%),
    linear-gradient(180deg, rgba(255,255,255,.78) 0%, rgba(248,250,252,.60) 50%, rgba(241,245,249,.80) 100%),
    url('/uploads/site/hero-list.webp') center / cover no-repeat,
    #ffffff;
  background-size: auto, auto, cover, auto;
  border-bottom: 1px solid #eef2f7;
}
.e-hero-page {
  background-image:
    linear-gradient(90deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.72) 45%, rgba(255,255,255,.35) 100%),
    linear-gradient(180deg, rgba(255,255,255,.78) 0%, rgba(248,250,252,.60) 50%, rgba(241,245,249,.80) 100%),
    url('/uploads/site/hero-page.webp') center / cover;
}

/* ---- 27.2 文字配色：深色标题 + 中灰描述 + 品牌蓝 eyebrow ---- */
.e-hero h1, .e-hero-page h1, .detail-case .e-hero-h1, .cw-hero .cw-hero-h1 {
  color: #0f172a;
  text-shadow: none;
}
.e-hero .e-eyebrow, .e-hero-page .e-eyebrow, .cw-hero .e-eyebrow {
  color: #2563eb;
}
.e-hero .e-eyebrow::before, .e-hero-page .e-eyebrow::before, .cw-hero .e-eyebrow::before {
  background: #2563eb;
}
.e-hero .e-desc, .e-hero-page .e-desc, .cw-hero .e-desc { color: #64748b; }
.e-hero .e-meta, .e-hero-page .e-meta { color: #94a3b8; }
.e-hero .e-meta b, .e-hero-page .e-meta b { color: #0f172a; }
.e-hero .e-num, .e-hero-page .e-num { color: #2563eb; }

/* ---- 27.3 信任徽章：浅灰卡片 ---- */
.e-hero .e-hero-facts li, .e-hero-page .e-hero-facts li {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: 0 2px 8px rgba(15,23,42,.04);
}
.e-hero .e-hero-facts b, .e-hero-page .e-hero-facts b { color: #2563eb; }
.e-hero .e-hero-facts span, .e-hero-page .e-hero-facts span { color: #475569; }

/* ---- 27.4 hero CTA：主按钮蓝底白字，次按钮白底灰边 ---- */
.e-hero-cta .btn-pri {
  background: #2563eb !important;
  border-color: #2563eb !important;
  color: #ffffff !important;
  box-shadow: 0 6px 18px rgba(37,99,235,.22);
}
.e-hero-cta .btn-pri:hover { background: #1d4ed8 !important; border-color: #1d4ed8 !important; color: #fff !important; }
.e-hero-cta .btn-ghost {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: 0 2px 8px rgba(15,23,42,.04);
}
.e-hero-cta .btn-ghost:hover { background: #f8fafc !important; border-color: #94a3b8 !important; color: #0f172a !important; }

/* ---- 27.5 资讯列表搜索框与计数浅色 ---- */
.nl-hero .nl-count { color: #94a3b8; }
.nl-hero .nl-count b { color: #2563eb; }
.nl-hero .nl-search input {
  background: #ffffff;
  border-color: #e2e8f0;
  color: #0f172a;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.nl-hero .nl-search input::placeholder { color: #94a3b8; }
.nl-hero .nl-search input:focus { border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.12); background: #fff; }
.nl-hero .nl-search button { background: #2563eb; color: #ffffff; }
.nl-hero .nl-search button:hover { background: #1d4ed8; }

/* ---- 27.6 案例墙 hero：浅色遮罩 + 深色文字（保留真实项目图） ---- */
.cw-hero { background: #f8fafc; }
.cw-hero::after {
  background:
    linear-gradient(90deg, rgba(255,255,255,.94) 0%, rgba(255,255,255,.74) 45%, rgba(255,255,255,.40) 100%),
    linear-gradient(180deg, rgba(255,255,255,.70) 0%, rgba(255,255,255,.45) 100%);
}
.cw-hero-bg { filter: none; opacity: .95; }

/* ---- 27.7 首页 hero：浅色底 + 深色文字 + 浅灰 chips/facts ---- */
.hero {
  background:
    linear-gradient(90deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.70) 50%, rgba(255,255,255,.30) 100%),
    url('/uploads/site/hero-list.webp') center / cover no-repeat,
    #ffffff;
}
.hero-eyebrow {
  background: #eff6ff; border-color: #dbe7fb; color: #2563eb; backdrop-filter: none;
}
.hero h1 { color: #0f172a; text-shadow: none; }
.hero-sub { color: #475569; }
.hero-chips span {
  background: #f1f5f9; border: 1px solid #e2e8f0; color: #475569; backdrop-filter: none;
}
.hero-facts li {
  background: #f8fafc; border: 1px solid #e2e8f0; backdrop-filter: none;
  box-shadow: 0 2px 8px rgba(15,23,42,.04);
}
.hero-facts b { color: #2563eb; }
.hero-facts span { color: #64748b; }
.hero-btns .btn-pri {
  background: #2563eb; border-color: #2563eb; color: #fff;
  box-shadow: 0 6px 18px rgba(37,99,235,.22);
}
.hero-btns .btn-ghost { background: #fff; border-color: #cbd5e1; color: #0f172a; }

/* ---- 27.8 案例详情 hero（e-hero-case）浅色 ---- */
.e-hero-case { background: #f8fafc; }
.e-hero-case::after {
  background:
    linear-gradient(90deg, rgba(255,255,255,.94) 0%, rgba(255,255,255,.74) 45%, rgba(255,255,255,.40) 100%),
    linear-gradient(180deg, rgba(255,255,255,.70) 0%, rgba(255,255,255,.45) 100%);
}
.detail-case .e-hero-h1 { color: #0f172a; text-shadow: none; }

/* ---- 27.9 案例/资讯底部深色 CTA 带统一浅色 ---- */
.cw-final, .cs-final, .nl-cta-in {
  background: #f1f5f9;
}
.cw-final-t, .cs-final-text h2, .cs-final-text .h2, .nl-cta-t { color: #0f172a; }
.cw-final-text p, .cs-final-text p, .nl-cta-p { color: #64748b; }

/* ---- 27.10 修正：案例/资讯底部 CTA 带的深蓝背景在 -in 容器上 ---- */
.cw-final-in, .cs-final-in, .nl-cta-in {
  background: #f1f5f9 !important;
  border: 1px solid #e2e8f0;
}
.cw-final-t, .cs-final-text h2, .cs-final-text .h2, .nl-cta-t { color: #0f172a !important; }
.cw-final-text p, .cs-final-text p, .nl-cta-p { color: #64748b !important; }
.cw-final-btns .btn-pri, .cs-final-btns .btn-pri { background: #2563eb; border-color: #2563eb; color: #fff; }
.cw-final-btns .btn-ghost, .cs-final-btns .btn-ghost { background: #fff; border-color: #cbd5e1; color: #0f172a; }

/* ---- 27.11 案例列表 hero：去掉真实项目图背景，改用与其他栏目统一的浅色光晕底，保证文字清晰 ---- */
.cw-hero-bg { display: none !important; }
.cw-hero {
  background:
    linear-gradient(90deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.72) 45%, rgba(255,255,255,.35) 100%),
    linear-gradient(180deg, rgba(255,255,255,.78) 0%, rgba(248,250,252,.60) 50%, rgba(241,245,249,.80) 100%),
    url('/uploads/site/hero-list.webp') center / cover no-repeat,
    #ffffff;
  background-size: auto, auto, cover, auto;
}
/* ---- 27.12 案例详情 hero ＝ 证据第一屏：案例大图 + 深色渐变遮罩 + 白字 ----
   营销型案例页标准：列表页浅色负责导航，详情页深色大图负责证据冲击。
   覆盖 27.8 的错误浅色化，明确为深色遮罩证据屏。 ---- */
.e-hero-case { background: #0b1730 !important; }
.e-hero-case::after {
  background: linear-gradient(90deg, rgba(8,15,35,.90) 0%, rgba(10,20,45,.62) 45%, rgba(10,20,45,.18) 100%) !important;
}
.detail-case .e-hero-h1 { color: #ffffff !important; text-shadow: 0 2px 20px rgba(0,0,0,.35) !important; }
.detail-case .e-eyebrow { color: #93c5fd !important; }
.cs-profile-name { background: rgba(255,255,255,.16) !important; color: #ffffff !important; }
.cs-profile-i { color: rgba(255,255,255,.85) !important; }
.c-hero-stats li { background: rgba(255,255,255,.10) !important; border: 1px solid rgba(255,255,255,.22) !important; }
.c-hero-stats b { color: #ffffff !important; }
.c-hero-stats span { color: rgba(255,255,255,.82) !important; }
/* ---- 27.13 首页右侧视觉：去掉白色卡片感，透明玻璃元素直接漂浮 ---- */
.hero-visual img {
  border-radius: 0 !important;
  box-shadow: none !important;
}
.hero-visual:hover img {
  box-shadow: none !important;
}
/* ============================================================
   28. 精致度提升 · 微交互与视觉层次（2026-09-19）
   Stripe / Linear 级：卡片 hover 上浮、箭头位移、按钮质感。
   ============================================================ */

/* 28.1 全站卡片：默认细腻阴影，hover 上浮 + 阴影加深 + 边框提亮 */
.card, .pain-grid li, .svc-card, .news-cards li, .why-grid li, .why-list li, .proc-step, .step-card {
  transition: transform .28s cubic-bezier(.4,0,.2,1), box-shadow .28s cubic-bezier(.4,0,.2,1), border-color .28s ease;
}
.card:hover, .pain-grid li:hover, .svc-card:hover, .news-cards li:hover,
.why-grid li:hover, .why-list li:hover, .proc-step:hover, .step-card:hover { box-shadow: 0 14px 34px rgba(15,23,42,.09), 0 3px 10px rgba(15,23,42,.05);
  border-color: #dbe4f0; }

/* 28.2 服务图标统一蓝色系（去掉突兀红色） */
.svc-ico {
  background: #eff6ff !important;
  color: #2563eb !important;
}

/* 28.3 链接 hover 变色 + 整行右移（箭头跟随） */
.card-more, .svc-more, .news-more, .pain-grid a {
  transition: color .2s ease, transform .2s ease;
  will-change: transform;
}
.card-more:hover, .svc-more:hover, .news-more:hover, .pain-grid a:hover { color: #1d4ed8 !important; }

/* 28.4 主按钮质感：微渐变 + 悬浮上浮 + 阴影加深 */
.btn-pri {
  background: linear-gradient(180deg, #3b82f6, #2563eb) !important;
  box-shadow: 0 6px 16px rgba(37,99,235,.26);
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.btn-pri:hover { box-shadow: 0 10px 26px rgba(37,99,235,.34);
  background: linear-gradient(180deg, #2f76f0, #1d4ed8) !important; }

/* 28.5 次按钮 hover 轻微上浮 */
.btn-ghost, .btn-line {
  transition: transform .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease;
}
/* 次按钮 hover：零位移，只加阴影 + 描边 */

/* 28.6 卡片占位图：浅蓝渐变代替纯灰块 */
.card-ph, .news-ph {
  background: linear-gradient(135deg, #f1f5f9 0%, #e8eef7 100%) !important;
}

/* 28.7 数据成果大数字：字重更饱满、颜色更稳 */
.stats-grid b, .stats-grid dt {
  letter-spacing: -.01em;
}
/* ---- 28.14 右侧玻璃元素：mix-blend-mode 让纯白底自然融合浅色 hero ---- */
.hero-visual img {
  mix-blend-mode: multiply;
}
/* ============================================================
   29. 联系我们页重新设计（2026-09-19）
   现代两栏 + 精致卡片 + 表单突出
   ============================================================ */

/* 29.1 联系卡片精致化 */
.contact-cards .contact-card {
  transition: transform .28s cubic-bezier(.4,0,.2,1), box-shadow .28s cubic-bezier(.4,0,.2,1);
  border-radius: 16px;
  padding: 24px;
}
.contact-cards .contact-card:hover { box-shadow: 0 12px 32px rgba(15,23,42,.08); }
.contact-cards .cc-icon {
  width: 52px; height: 52px;
  border-radius: 14px;
}
.contact-cards .contact-card b { font-size: 16px; }
.contact-cards .contact-card p { font-size: 15px; }

/* 29.2 联系操作按钮更大更突出 */
.contact-actions .btn-pri, .contact-actions .btn-ghost {
  padding: 13px 32px;
  font-size: 15px;
  border-radius: 12px;
}

/* 29.3 inquiry 表单卡片精致化 */
.iq-embed {
  border-radius: 16px !important;
  padding: 28px !important;
  box-shadow: 0 4px 20px rgba(15,23,42,.05);
}
.iq-embed .iq-t { font-size: 18px; }
.iq-embed .iq-d { font-size: 14px; margin: 8px 0 16px; }

/* 29.4 底部信任带精致化 */
.trust-band {
  border-radius: 16px;
  padding: 32px;
}
.trust-grid li {
  border-radius: 12px;
  transition: transform .25s, box-shadow .25s;
}
.trust-grid li:hover { box-shadow: 0 8px 24px rgba(15,23,42,.06); }

/* 29.5 底部 CTA 带精致化 */
.detail-cta {
  border-radius: 16px;
  padding: 32px;
}
/* ============================================================
   30. 栏目 hero 右侧统一加玻璃元素小图标（2026-09-19）
   ============================================================ */
.e-hero::before, .e-hero-page::before {
  content: '';
  position: absolute;
  right: 4%;
  top: 50%;
  transform: translateY(-50%);
  width: 380px;
  height: 280px;
  background: url('/themes/default/img/hero-visual.webp') center/contain no-repeat;
  opacity: 0.85;
  mix-blend-mode: multiply;
  pointer-events: none;
  z-index: 1;
}
/* 文字层级在图标之上 */
.e-hero .e-hero-in, .e-hero-page .e-hero-in,
.e-hero .e-eyebrow, .e-hero h1, .e-hero .e-desc,
.e-hero .e-hero-cta, .e-hero .e-hero-facts,
.e-hero .nl-search, .e-hero .nl-count {
  position: relative;
  z-index: 2;
}
/* 案例详情 hero 不加（它是证据屏） */
.e-hero-case::before { display: none !important; }
/* 移动端隐藏右侧图标 */
@media (max-width: 768px) {
  .e-hero::before, .e-hero-page::before { display: none; }
}

/* ============================================================
   31. 玻璃卡片质感：右侧玻璃元素加淡淡大圆角磨砂背景（2026-09-19）
   ============================================================ */
.hero-visual::before {
  content: '';
  position: absolute;
  inset: -20px;
  background: rgba(255, 255, 255, 0.35);
  backdrop-filter: blur(20px);
  border-radius: 28px;
  border: 1px solid rgba(255, 255, 255, 0.5);
  box-shadow: 0 8px 32px rgba(37, 99, 235, 0.08);
  z-index: -1;
}
.e-hero::before {
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.35);
  backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.5);
  box-shadow: 0 8px 32px rgba(37, 99, 235, 0.08);
}
/* ============================================================
   30. 栏目 hero 右侧统一加玻璃元素小图标（2026-09-19）
   ============================================================ */
/* ::before 做玻璃边框背景 */
.e-hero::before, .e-hero-page::before {
  content: '';
  position: absolute;
  right: 4%;
  top: 50%;
  transform: translateY(-50%);
  width: 380px;
  height: 280px;
  background: rgba(255, 255, 255, 0.35);
  backdrop-filter: blur(20px);
  border-radius: 28px;
  border: 1px solid rgba(255, 255, 255, 0.5);
  box-shadow: 0 8px 32px rgba(37, 99, 235, 0.08);
  pointer-events: none;
  z-index: 1;
}
/* ::after 做玻璃元素图 */
.e-hero::after, .e-hero-page::after {
  content: '';
  position: absolute;
  right: 4%;
  top: 50%;
  transform: translateY(-50%);
  width: 380px;
  height: 280px;
  background: url('/themes/default/img/hero-visual.webp') center/contain no-repeat;
  opacity: 0.85;
  mix-blend-mode: multiply;
  pointer-events: none;
  z-index: 2;
}
/* 文字层级在图标之上 */
.e-hero .e-hero-in, .e-hero-page .e-hero-in,
.e-hero .e-eyebrow, .e-hero h1, .e-hero .e-desc,
.e-hero .e-hero-cta, .e-hero .e-hero-facts,
.e-hero .nl-search, .e-hero .nl-count {
  position: relative;
  z-index: 3;
}
/* 案例详情 hero 不加（它是证据屏） */
.e-hero-case::before, .e-hero-case::after { display: none !important; }
/* 移动端隐藏右侧图标 */
@media (max-width: 768px) {
  .e-hero::before, .e-hero-page::before,
  .e-hero::after, .e-hero-page::after { display: none; }
}
/* ============================================================
   32. 去掉背后大白框，保留玻璃元素本身质感（2026-09-19）
   ============================================================ */
.hero-visual::before {
  display: none !important;
}
.e-hero::before, .e-hero-page::before {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
.e-hero::after, .e-hero-page::after {
  opacity: 0.9;
}
/* ============================================================
   32. 去掉背后大白框，保留玻璃元素本身质感（2026-09-19）
   ============================================================ */
.hero-visual::before {
  display: none !important;
}
.e-hero::before, .e-hero-page::before {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
.e-hero::after, .e-hero-page::after {
  opacity: 0.9;
}
/* ============================================================
   33. 修正栏目 hero 玻璃元素位置到右侧（2026-09-19）
   ============================================================ */
.e-hero::after, .e-hero-page::after {
  content: '';
  position: absolute;
  right: 6%;
  top: 50%;
  transform: translateY(-50%);
  width: 300px;
  height: 220px;
  background: url('/themes/default/img/hero-visual.webp') center/contain no-repeat;
  opacity: 0.9;
  mix-blend-mode: multiply;
  pointer-events: none;
  z-index: 2;
}
/* ============================================================
   34. 强制修正栏目 hero 玻璃元素位置到右侧（2026-09-19）
   ============================================================ */
.e-hero::after, .e-hero-page::after {
  left: auto !important;
  right: 5% !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 280px !important;
  height: 200px !important;
  position: absolute !important;
}
/* ============================================================
   35. 各栏目 hero 右侧用对应主题图标（2026-09-19）
   ============================================================ */
.ps-hero::after {
  background: url('/themes/default/img/hero-product.webp') center/contain no-repeat !important;
}
.cw-hero::after {
  background: url('/themes/default/img/hero-case.webp') center/contain no-repeat !important;
}
.nl-hero::after {
  background: url('/themes/default/img/hero-news.webp') center/contain no-repeat !important;
}
/* 关于我们单页 */
.e-hero-page::after {
  background: url('/themes/default/img/hero-about.webp') center/contain no-repeat !important;
}
/* ============================================================
   36. 首页 hero 右侧视频（2026-09-19）
   原全屏背景视频移入右侧图片区（取代静态插画）；hero 背景图
   /uploads/site/hero-list.webp + 白色渐变（见 27.7）原样保留。
   ============================================================ */
.hero { position: relative; overflow: hidden; }
.hero-in, .hero-facts {
  position: relative;
  z-index: 1;
}
/* 右侧视频：跟随右列宽度，4:3 卡片，圆角与柔和阴影，真实影像不用 multiply 融合 */
/* 右侧视频：严格 16:9 等比（宽度变则高度自动，不拉伸/不变形）；
   顶部贴 hero 上边（-72px 上 padding）、右贴 hero 右缘（-var(--pad)）；无边框/阴影，与背景图融为一体。 */
.hero-visual {
  align-self: start; min-height: 0;
  margin-top: -36px;
  margin-right: calc(-1 * var(--pad));
}
.hero-side-video {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  height: auto;
  object-fit: cover;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  -webkit-mask-image:
    linear-gradient(to right, transparent 0, #000 12%, #000 88%, transparent 100%),
    linear-gradient(to bottom, transparent 0, #000 10%, #000 78%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(to right, transparent 0, #000 12%, #000 88%, transparent 100%),
    linear-gradient(to bottom, transparent 0, #000 10%, #000 78%, transparent 100%);
  mask-composite: intersect;
}
@media (prefers-reduced-motion: reduce) {
  .hero-side-video { animation: none; }
}

/* 移动端/平板单列：取消桌面融边负 margin，视频恢复 16:9 居中圆角卡片 */
@media (max-width: 960px) {
  .hero-visual { align-self: auto; min-height: 0; margin: 0 auto; }
  .hero-side-video {
    height: auto; aspect-ratio: 1 / 1;
    border-radius: 16px; box-shadow: 0 10px 24px rgba(15, 23, 42, .12); }
}

/* ============================================================
   37. 全站 hero 浅色统一 + 非首页高度统一 + 首页视频 16:9（2026-09-19）
   37.1 非首页「栏目级 hero」统一高度：同一 min-height + 垂直居中 + 同一竖向留白；
        内容超出时自然增高（不裁切）。阅读型文章的 e-hero-mini 是紧凑栏目条，保持紧凑。
   37.2 案例详情 hero 改浅色（覆盖 27.12 的深色 !important 证据屏）。
   37.3 首页右侧视频 1:1 → 16:9，垂直居中，降低首屏高度。
   ============================================================ */

/* ---- 37.1 高度统一：只写竖向 padding，水平 padding 仍由全出血负 margin 规则提供 ---- */
.e-hero {
  min-height: 360px;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.pd-hero {
  min-height: 360px;
  padding-top: 40px;
  padding-bottom: 32px;
}
/* cw/case 的 hero 内容在 -in 内层，竖向留白统一到同一值 */
.e-hero .e-hero-in,
.cw-hero-in,
.e-hero-case-in { padding-top: 52px; padding-bottom: 52px; }
/* 阅读型文章 mini 头带：标题在正文卡片里，这里只做紧凑分类条 */
.detail-news .e-hero-mini { min-height: 0; display: block; padding-top: 22px; padding-bottom: 20px; }
@media (max-width: 720px) {
  .e-hero, .pd-hero { min-height: 240px; }
  .e-hero .e-hero-in,
  .cw-hero-in,
  .e-hero-case-in { padding-top: 34px; padding-bottom: 34px; }
  .pd-hero { padding-top: 28px; padding-bottom: 24px; }
  .detail-news .e-hero-mini { min-height: 0; padding-top: 16px; padding-bottom: 14px; }
}

/* ---- 37.2 案例详情 hero：案例实景封面照打底（数据驱动 --cs-hero-img）+ 深色文字 ----
   2026-09-30 用户指令：案例详情页 hero 补上背景图。
   封面照由模板按「本案例 article.thumb → 所属主栏目 hero_image → 案例通用头图」算出并写入 --cs-hero-img。
   手法与 .cse-hero / .ld-hero 完全一致：左白右透渐变遮罩，右侧留给实景照片，左上深色标题照常可读。
   （此前这里引用 /uploads/site/hero-list.webp 且 display:none 掉真实封面，而该文件在服务器上不存在 → hero 退化成纯白空底。） */
.e-hero-case {
  background:
    linear-gradient(90deg, #eef4ff 0%, rgba(250, 252, 255, .93) 38%, rgba(250, 252, 255, .62) 66%, rgba(250, 252, 255, .20) 100%),
    var(--cs-hero-img, none) center right / cover no-repeat,
    linear-gradient(180deg, #eef4ff 0%, #f8fafc 100%) !important;
  background-size: auto, cover, auto !important;
  border-bottom: 1px solid #eef2f7;
}
/* 窄屏：改为居中裁切 + 整体加大遮罩，避免照片把标题压花 */
@media (max-width: 860px) {
  .e-hero-case {
    background:
      linear-gradient(90deg, rgba(250, 252, 255, .97) 0%, rgba(250, 252, 255, .93) 55%, rgba(250, 252, 255, .74) 100%),
      var(--cs-hero-img, none) center / cover no-repeat,
      linear-gradient(180deg, #eef4ff 0%, #fafcff 100%) !important;
    background-size: auto, cover, auto !important; }
}
.e-hero-case::before,
.e-hero-case::after { content: none !important; display: none !important; }
/* 案例详情页 hero 必须与顶部导航齐平（2026-09-30 用户报「hero 背景图和顶部导航中间有空白」）：
   `.detail { margin: 30px auto 44px }` 给详情页留了 30px 上边距，案例 hero 是全出血实景图，
   这 30px 就成了导航正下方一条 30px 空白带（列表页 .list-page 没有这个边距，所以只有案例详情页有）。
   只清上边距，下边距与左右留白不动，正文排版不受影响。 */
.detail.detail-case { margin-top: 0; }
.detail-case .e-hero-h1 { color: #0f172a !important; text-shadow: none !important; }
.detail-case .e-eyebrow { color: #2563eb !important; }
.detail-case .e-eyebrow::before { background: #2563eb !important; }
.detail-case .e-desc { color: #64748b !important; }
.cs-profile-name {
  background: #eff6ff !important;
  border: 1px solid #dbe7fb !important;
  color: #1d4ed8 !important;
}
.cs-profile-i { color: #475569 !important; }
.cs-profile-i i { color: #94a3b8 !important; }
.c-hero-stats li {
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: 0 2px 8px rgba(15,23,42,.04) !important;
}
.c-hero-stats b { color: #2563eb !important; }
.c-hero-stats span { color: #475569 !important; }

/* ---- 37.3 首页右侧视频：1:1 方形 → 16:9，垂直居中（右融边与 mask 保留） ---- */
.hero-visual { align-self: center; margin-top: 0; }
.hero-side-video { aspect-ratio: 16 / 9; }
@media (max-width: 960px) {
  .hero-side-video { aspect-ratio: 16 / 9; }
}

/* ---- 37.4 首页 hero 两行副标题：上行服务关键词（加重），下行技术背书 ---- */
.hero-sub-lead {
  margin-bottom: 12px;
  font-size: clamp(15px, 1.2vw + 13px, 18px);
  font-weight: 600;
  color: #0f172a;
}

/* ---- 37.5 媒体元素自适应兜底（img 已在基础层覆盖；不恢复 html/body 横向裁剪） ---- */
video, canvas, iframe, embed, object, svg { max-width: 100%; }
/* ============================================================
   37.6 产品详情 hero 与其它栏目高度对齐（桌面收到 360 基线，内容超高自然增高）；
        版权栏友链在桌面端避让右下悬浮组件，避免被遮挡（2026-09-20）
   ============================================================ */
@media (min-width: 861px) {
  .pd-hero { padding-top: 24px; padding-bottom: 20px; }
  .pd-hero-in { grid-template-columns: minmax(0, 1fr) 320px; gap: 34px; }
  .pd-hero-media { aspect-ratio: 16 / 10; }
  .pd-hero-points { margin-top: 16px; padding: 10px 0 12px; gap: 10px 36px; }
}
@media (max-width: 860px) {
  .pd-hero { padding-top: 22px; padding-bottom: 18px; }
  .pd-hero-points { margin-top: 14px; padding: 10px 0; gap: 8px 20px; }
}
@media (min-width: 1025px) {
  .foot-bar { padding-right: 200px; }
}
@media (max-width: 860px) {
  .foot-bar { padding-right: 104px; }
}

/* ---------- 20.4 栏目营销落地页（ld-*，2026-09-29 栏目重设计） ----------
   栏目页从「文章列表」升级为营销型落地页：
   Hero(主张+benefit+双CTA+信任数字) → 客户路径三要点 → 主线区块(双引擎/引用实证)
   → 栏目FAQ → 精选文章卡 → 全部文章行式流 → 转化细条。文章区块复用 nl-*/card/faq-panel。 */
.ld-hero .e-hero-facts b { color: var(--pri); }
.ld-block { padding-top: 46px; }
/* 客户路径三要点 */
.ld-points { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; list-style: none; margin: 0; padding: 0; }
.ld-points li { position: relative; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 24px 22px 22px; transition: transform .22s ease, box-shadow .22s ease; }
.ld-points li:hover { box-shadow: var(--shadow); }
.ld-no { display: inline-block; font-size: 13px; font-weight: 700; letter-spacing: 1px; color: var(--pri); background: #eef4ff; border-radius: 999px; padding: 4px 12px; }
.ld-points h3 { margin: 12px 0 8px; font-size: 16.5px; line-height: 1.5; color: var(--ink); }
.ld-points p { margin: 0; font-size: 13.8px; line-height: 1.85; color: var(--muted); }
/* 双引擎（seo 栏主线）：两条获客入口并列 */
.ld-engine-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.ld-engine { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 26px 26px 22px; }
.ld-engine-b { background: linear-gradient(180deg, #f5f8ff 0%, #fff 70%); border-color: #cfdffb; }
.ld-engine-tag { margin: 0 0 10px; display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: 1px; color: var(--pri); background: #eef4ff; border-radius: 999px; padding: 3px 12px; }
.ld-engine h3 { margin: 0 0 10px; font-size: 19px; color: var(--ink); }
.ld-engine p { margin: 0 0 8px; font-size: 14.2px; line-height: 1.85; color: var(--muted); }
.ld-engine-more a, .ld-engine-in { font-size: 13.8px; font-weight: 600; color: var(--pri); }
.ld-engine-more a { text-decoration: none; }
.ld-engine-more a:hover { color: var(--pri-d); }
/* 大模型引用实证（geo 栏主线）：4 张引用形态示意卡 + 透明说明 */
.ld-proof-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.ld-proof-card { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 22px 22px 18px; }
.ld-proof-q { margin: 0 0 12px; font-size: 14.5px; font-weight: 600; color: var(--ink); line-height: 1.6; padding-left: 12px; border-left: 3px solid var(--pri); }
.ld-proof-a { margin: 0 0 14px; font-size: 13.8px; line-height: 1.85; color: var(--muted); }
.ld-proof-a b { color: var(--pri-d); }
.ld-proof-src { margin: 0; font-size: 12.5px; color: var(--muted); padding-top: 10px; border-top: 1px dashed var(--line); }
.ld-proof-note { margin: 16px 0 0; font-size: 13px; line-height: 1.8; color: var(--muted); background: var(--soft); border: 1px dashed var(--line); border-radius: 12px; padding: 12px 16px; }
/* 全部文章区头顶留白微调 */
.ld-all { padding-top: 40px; }
.ld-all .nl-list { margin-top: 6px; }
/* 二级栏目链接条（2026-09-29 用户指令：直接放在封面页）：面包屑下药丸按钮排，无区块标题 */
.ld-kids-bar { padding: 4px 0 8px; }
.ld-kid-btns { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; }
.ld-kid-btns a {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 11px 22px; border: 1px solid var(--line); border-radius: 999px;
  background: #fff; font-size: 14.5px; font-weight: 600; color: var(--ink);
  text-decoration: none; transition: border-color .16s ease, color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.ld-kid-btns a:hover { border-color: var(--pri); color: var(--pri); box-shadow: 0 6px 18px rgba(37, 99, 235, .10); }
/* 客户案例三卡：一行排 3 个、左右与容器两缘对齐（2026-09-29 用户指令）。
   .grid 的 auto-fill minmax(252px,1fr) 在宽屏会开出 4 条轨道，3 张卡只占前 3 格、右侧留空；
   ld-grid3 强制正好 3 等分铺满整行。
   注意：1118 行有 @media(min-width:1500px) 的 `.list-page .grid { repeat(4) }`（特异性 0,2,0），
   会压过单类 .ld-grid3，故此处用 .list-page .grid.ld-grid3（0,3,0）保底，任何屏宽都是 3 等分。 */
.ld-grid3,
.list-page .grid.ld-grid3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
/* 响应式 */
@media (max-width: 1100px) {
  .ld-points { grid-template-columns: repeat(3, 1fr); gap: 14px; }
  .ld-proof-grid { grid-template-columns: 1fr 1fr; gap: 14px; }
}
@media (max-width: 860px) {
  .ld-points { grid-template-columns: 1fr; }
  .ld-engine-grid { grid-template-columns: 1fr; }
  .ld-proof-grid { grid-template-columns: 1fr; }
  /* 2026-09-29 用户指令：移动端客户案例一行一个；选择器需与上方 .list-page .grid.ld-grid3 同特异性（0,3,0），
     否则会被那条基础规则压掉、移动端硬塞 3 列 */
  .ld-grid3,
  .list-page .grid.ld-grid3 { grid-template-columns: 1fr; }
  .ld-block { padding-top: 36px; }
}
@media (max-width: 720px) {
  /* 落地页 Hero 信任胶囊：不强制半宽，按内容自适应换行，杜绝 375 下文字被裁 */
  .ld-hero .e-hero-facts li { flex: 0 1 auto; }
}

/* ---------- 20.5 共享分页组件（pgn-*，2026-09-29 全站分页美化） ----------
   上一页/下一页 + 窗口化页码(1 … 4 [5] 6 … 12) + 「第 N / M 页」指示；
   同选择器后置覆盖旧 .pager 流式数字版式，四个列表模板统一换装。 */
.pager.pgn { display: flex; flex-direction: column; align-items: center; gap: 12px; margin-top: 34px; }
.pgn-info { margin: 0; font-size: 13px; color: var(--muted); }
.pgn-info b { color: var(--pri); font-weight: 700; }
.pgn-btns { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; }
.pgn-num, .pgn-nav, .pgn-dot {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 38px; height: 38px; padding: 0 14px;
  background: #fff; border: 1px solid var(--line); border-radius: 10px;
  font-size: 14px; color: var(--ink); text-decoration: none;
  transition: color .16s, border-color .16s, background .16s, transform .16s, box-shadow .16s;
}
.pgn-num:hover, .pgn-nav:hover { color: var(--pri); border-color: var(--pri); background: #eff4ff;  box-shadow: 0 6px 14px rgba(37, 99, 235, .10); }
.pgn-num.on { background: var(--pri); border-color: var(--pri); color: #fff; font-weight: 700; transform: none; box-shadow: 0 6px 16px rgba(37, 99, 235, .28); }
.pgn-num.on:hover { transform: none; }
.pgn-nav { font-weight: 600; }
.pgn-nav.is-off { color: #b6c2d4; background: var(--soft); cursor: not-allowed; }
.pgn-nav.is-off:hover { transform: none; box-shadow: none; }
.pgn-dot { min-width: 24px; padding: 0; border: 0; background: none; color: var(--muted); }
@media (max-width: 600px) {
  .pager.pgn { gap: 10px; }
  .pgn-num { display: none; }          /* 移动端只留前后翻页 + 页码指示，页码流在小屏是噪音 */
  .pgn-dot { display: none; }
  .pgn-num.on { display: inline-flex; } /* 当前页保留，翻页感不丢 */
  .pgn-nav { flex: 1 1 auto; max-width: 46%; }
}

/* ---------- 20.6 首页改版组件（hm-*，2026-09-29 全站改版） ---------- */
/* 页脚品牌区：关于/联系入口 */
.foot-about { margin: 10px 0 0; font-size: 13px; }
.foot-about a { color: var(--pri); text-decoration: none; }
.foot-about a:hover { color: var(--pri-d); }
/* Hero 右栏：双引擎入口卡（替代原视频位） */
.hm-hero-card { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 22px 24px; box-shadow: 0 14px 34px rgba(15, 23, 42, .07); }
.hm-hero-card + .hm-hero-card { margin-top: 14px; }
.hm-hero-card-b { background: linear-gradient(135deg, #f5f8ff 0%, #fff 70%); border-color: #cfdffb; }
.hm-hero-tag { display: inline-block; font-size: 11.5px; font-weight: 700; letter-spacing: 1px; color: var(--pri); background: #eef4ff; border-radius: 999px; padding: 3px 12px; margin: 0 0 8px; }
.hm-hero-card h2 { margin: 0 0 6px; font-size: 20px; color: var(--ink); }
.hm-hero-card p { margin: 0; font-size: 13.5px; line-height: 1.75; color: var(--muted); }
/* 区块节奏 */
.hm-block { padding-top: 52px; }
/* 访客身份分流卡 */
.hm-aud-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; list-style: none; margin: 0; padding: 0; }
.hm-aud-grid li { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); transition: box-shadow .22s ease, border-color .22s ease; }
.hm-aud-grid li:hover { box-shadow: var(--shadow); border-color: #cfdffb; }
/* hover 零闪烁 A 式：上浮只加在内层 a，命中区仍归静止的外层 li ——
   整卡上浮 4px 的手感一点没变，但光标贴到卡片底边也不会再抖 */
.hm-aud-grid a { display: block; height: 100%; padding: 24px 22px 20px; text-decoration: none; transition: transform .22s ease; }
.hm-aud-grid li:hover a { transform: translateY(-4px); }
.hm-aud-grid h3 { margin: 0 0 10px; font-size: 16.5px; color: var(--ink); }
.hm-aud-pain { margin: 0 0 14px; font-size: 13.8px; line-height: 1.8; color: var(--muted); }
.hm-aud-go { margin: 0; font-size: 13.8px; font-weight: 700; color: var(--pri); }
/* 阜阳本地获客 band（2026-09-29 用户指令：改浅色背景） */
.hm-local { background: linear-gradient(135deg, #f2f7ff 0%, #e8f1fe 60%, #ddebfd 100%); border: 1px solid #d5e5fb; border-radius: 20px; padding: 44px 48px; }
.hm-local-text .bk-eyebrow { color: var(--pri); margin: 0 0 10px; font-size: 12.5px; font-weight: 600; letter-spacing: 2px; }
.hm-local-text h2 { margin: 0 0 14px; font-size: clamp(22px, 1.8vw + 12px, 30px); color: var(--ink); }
.hm-local-text p { margin: 0 0 22px; max-width: 760px; font-size: 14.5px; line-height: 1.95; color: var(--muted); }
.hm-local-text .btn-pri { background: var(--pri); color: #fff; border-color: var(--pri); }
.hm-local-text .btn-pri:hover { background: var(--pri-d); border-color: var(--pri-d); }
@media (max-width: 1100px) {
  .hm-aud-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 860px) {
  .hm-block { padding-top: 38px; }
  .hm-aud-grid { grid-template-columns: 1fr; }
  .hm-local { padding: 30px 22px; border-radius: 14px; }
}

/* ---------- 20.7 导航下拉/Logo/单页专属版式（2026-09-29 源站整合改版） ---------- */

/* Logo 完整显示：实际 logo 为 214×60 横版，按高自适应宽，不再压成 44×44 方块 */
.logo-mark { width: auto; height: 44px; max-width: 180px; object-fit: contain; border-radius: 6px; box-shadow: none; }

/* 导航下拉补充：快捷入口落「栏目内搜索」，末行给"看全部"出口 */
.nav-drop .nav-drop-all { margin-top: 5px; padding-top: 9px; border-top: 1px dashed var(--line); color: var(--pri); font-weight: 600; }

/* 栏目落地页 Hero：案例页保留真实头图打底（作品集/信任感）；文章封面与列表改为 clean 编辑风，
   不再和案例共用同一套大图 Hero，避免访客把「知识栏目」误看成「案例栏目」。 */
.cse-hero {
  background:
    linear-gradient(90deg, #eef4ff 0%, rgba(250, 252, 255, .97) 40%, rgba(250, 252, 255, .72) 68%, rgba(250, 252, 255, .30) 100%),
    var(--ld-hero-img, none) center right / cover no-repeat,
    linear-gradient(180deg, #eef4ff 0%, #fafcff 100%);
}
@media (max-width: 860px) {
  .cse-hero {
    background:
      linear-gradient(90deg, rgba(250, 252, 255, .96) 0%, rgba(250, 252, 255, .90) 55%, rgba(250, 252, 255, .62) 100%),
      var(--ld-hero-img, none) center / cover no-repeat,
      linear-gradient(180deg, #eef4ff 0%, #fafcff 100%); }
}
/* 文章封面/列表 Hero：栏目 hero_image 打底（左白渐变保深字可读），无图回落 clean 编辑渐变（2026-09-29 用户指令：所有栏目 hero 背景图） */
.ld-hero, .acl-hero {
  position: relative;
  background:
    linear-gradient(90deg, #eef4ff 0%, rgba(250, 252, 255, .97) 40%, rgba(250, 252, 255, .72) 68%, rgba(250, 252, 255, .30) 100%),
    var(--ld-hero-img, none) center right / cover no-repeat,
    linear-gradient(180deg, #f4f8ff 0%, #fafcff 60%, #ffffff 100%);
}
@media (max-width: 860px) {
  .ld-hero, .acl-hero {
    background:
      linear-gradient(90deg, rgba(250, 252, 255, .96) 0%, rgba(250, 252, 255, .90) 55%, rgba(250, 252, 255, .62) 100%),
      var(--ld-hero-img, none) center / cover no-repeat,
      linear-gradient(180deg, #f4f8ff 0%, #fafcff 100%); }
}
/* 原装饰纹理（::before 叠在头图上方，但左上被白色渐变盖住、其余极淡，不影响头图观感） */
.ld-hero::before, .acl-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  width: auto; height: auto; /* 覆盖 .e-hero::before 基础光斑的 380px 定宽高 */
  border-radius: 0;
  background:
    linear-gradient(135deg, rgba(219, 234, 254, .45) 0%, transparent 40%),
    repeating-linear-gradient(90deg, rgba(37, 99, 235, .03) 0px, rgba(37, 99, 235, .03) 1px, transparent 1px, transparent 80px);
  pointer-events: none;
}
.ld-hero > *, .acl-hero > * { position: relative; z-index: 1; }

/* 首页 Hero：真实头图打底（整幅淡遮罩，居中深字不受影响） */
.hero.hero-img {
  background:
    linear-gradient(180deg, rgba(244, 248, 255, .93) 0%, rgba(234, 241, 254, .95) 100%),
    var(--hm-hero-img, none) center / cover no-repeat,
    linear-gradient(180deg, #f4f8ff 0%, #eaf1fe 100%);
}

/* 首页专题研究（hm-topics） */
.hm-topics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; list-style: none; margin: 0; padding: 0; }
.hm-topic-card a { display: flex; flex-direction: column; height: 100%; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; text-decoration: none; transition: transform .22s ease, box-shadow .22s ease; }
.hm-topic-card a:hover { box-shadow: var(--shadow-lg); }
.hm-topic-media { display: block; aspect-ratio: 21 / 8; overflow: hidden; background: #eef4ff; }
.hm-topic-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hm-topic-body { display: flex; flex-direction: column; gap: 8px; padding: 16px 18px 18px; }
.hm-topic-body b { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; font-size: 16.5px; color: var(--ink); }
.hm-topic-body b i { font-style: normal; font-size: 12.5px; font-weight: 500; color: var(--muted); }
.hm-topic-body > span { font-size: 13.8px; line-height: 1.8; color: var(--muted); }
.hm-topic-body em { font-style: normal; font-size: 13.5px; font-weight: 600; color: var(--pri); margin-top: auto; }
.blk-more { margin: 18px 0 0; text-align: center; }
.blk-more a { font-size: 14.5px; font-weight: 600; color: var(--pri); text-decoration: none; }
.blk-more a:hover { text-decoration: underline; }
@media (max-width: 960px) { .hm-topics { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .hm-topics { grid-template-columns: 1fr; } }

/* ---- 单页专属版式公共：Hero（关于/联系/服务） ---- */
.ab-hero, .ct-hero, .sv-hero {
  position: relative; overflow: hidden; padding: 52px 0 46px; margin: 0 0 8px;
  border-bottom: 1px solid var(--line);
  background:
    linear-gradient(90deg, #f6f9ff 0%, rgba(250, 252, 255, .96) 42%, rgba(250, 252, 255, .62) 72%, rgba(250, 252, 255, .22) 100%),
    var(--pg-hero-img, none) center right / cover no-repeat,
    linear-gradient(180deg, #eef4ff 0%, #fafcff 100%);
}
/* 关于我们 hero：加了双 CTA + 信任数据后控制整体高度，垂直居中、移动端还原自然高度 */
.ab-hero {
  min-height: 440px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media (max-width: 768px) {
  .ab-hero { min-height: 0; display: block; }
}
@media (max-width: 860px) {
  .ab-hero, .ct-hero, .sv-hero {
    background:
      linear-gradient(90deg, rgba(250, 252, 255, .96), rgba(250, 252, 255, .88)),
      var(--pg-hero-img, none) center / cover no-repeat,
      linear-gradient(180deg, #eef4ff 0%, #fafcff 100%); }
}
.pg-block { padding-top: 40px; }
.pg-band { background: linear-gradient(180deg, #f7faff, #fbfdff); border: 1px solid var(--line); border-radius: var(--radius); padding: 34px 28px 30px; margin-top: 26px; }
@media (max-width: 720px) { .pg-band { padding: 26px 18px 24px; } }

/* ---- 关于页 ---- */
.ab-two { display: grid; grid-template-columns: 1.35fr 1fr; gap: 26px; align-items: start; }
.ab-p { margin: 0 0 14px; font-size: 15px; line-height: 2.0; color: var(--muted); }
.ab-story .h2 { margin: 8px 0 16px; }
.ab-promise { background: #eef4ff; border: 1px solid #dbe7ff; border-radius: var(--radius); padding: 24px 24px 20px; }
.ab-promise h3 { margin: 0 0 14px; font-size: 18px; color: var(--ink); }
.ab-promise ul { list-style: none; margin: 0; padding: 0; }
.ab-promise li { display: flex; gap: 10px; margin: 0 0 12px; font-size: 14.2px; line-height: 1.85; color: var(--text); }
.ab-promise li span { color: var(--pri); font-weight: 700; flex: 0 0 auto; }
/* 里程碑时间线 */
.ab-timeline { list-style: none; margin: 22px 0 0; padding: 0 0 0 26px; border-left: 2px solid #cfe0ff; }
.ab-timeline li { position: relative; margin: 0 0 18px; }
.ab-timeline li:last-child { margin-bottom: 0; }
.ab-dot { position: absolute; left: -33px; top: 20px; width: 12px; height: 12px; border-radius: 50%; background: var(--pri); box-shadow: 0 0 0 4px #dbe7ff; }
.ab-ms-card { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 16px 20px 14px; transition: transform .2s ease, box-shadow .2s ease; }
.ab-ms-card:hover { box-shadow: var(--shadow); }
.ab-ms-head { display: flex; align-items: baseline; gap: 12px; }
.ab-ms-head b { font-size: 19px; color: var(--pri); letter-spacing: .5px; }
.ab-ms-head h3 { margin: 0; font-size: 15.5px; color: var(--ink); }
.ab-ms-card p { margin: 8px 0 0; font-size: 14px; line-height: 1.9; color: var(--muted); }
/* 作者实体卡 */
/* 旧 .ab-author/.ab-facts/.ab-avatar 规则已于 2026-10-02 由 .ct-author 组件替代（作者卡与联系页同款） */
.ab-tags { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 14px 0 0; padding: 0; }
.ab-tags li { font-size: 12.8px; color: var(--muted); background: #f1f5fb; border: 1px solid var(--line); border-radius: 999px; padding: 4px 12px; }
.ab-wx { font-size: 13.5px; color: var(--muted); }
/* 价值观 */
.ab-values { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; list-style: none; margin: 0; padding: 0; }
.ab-values li { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 20px 20px 18px; }
.ab-vicon { font-size: 26px; }
.ab-values h3 { margin: 10px 0 6px; font-size: 15.5px; color: var(--ink); }
.ab-values p { margin: 0; font-size: 13.5px; line-height: 1.8; color: var(--muted); }
/* FAQ 手风琴 */
.ab-faqs { max-width: 860px; margin: 0 auto; }
.ab-faq { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 4px 20px; margin: 0 0 12px; }
.ab-faq summary { cursor: pointer; list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 13px 0; font-size: 15px; font-weight: 600; color: var(--ink); }
.ab-faq summary::-webkit-details-marker { display: none; }
.ab-faq summary span { color: var(--pri); font-weight: 700; transition: transform .2s ease; }
.ab-faq[open] summary span { transform: rotate(45deg); }
.ab-faq p { margin: 0 0 14px; font-size: 14.2px; line-height: 1.95; color: var(--muted); }

/* ---- 联系页 ---- */
.ct-grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: 26px; align-items: start; }
/* 2026-10-01 用户指令：4 卡横排一行（全宽），卡片内构纵排（图标+标题 → 文案 → 二维码贴底） */
.ct-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 26px; }
.ct-card { display: flex; flex-direction: column; gap: 10px; background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 18px 20px; }
.ct-card-top { display: flex; align-items: center; gap: 10px; }
.ct-icon { flex: 0 0 auto; width: 44px; height: 44px; border-radius: 12px; background: #eef4ff; display: inline-flex; align-items: center; justify-content: center; font-size: 20px; }
.ct-card b { font-size: 15px; color: var(--ink); }
.ct-card p { margin: 0; font-size: 14px; line-height: 1.7; color: var(--muted); word-break: break-all; }
.ct-card a { color: var(--pri); text-decoration: none; font-weight: 600; }
/* 联系卡二维码（微信/抖音）：贴卡底左对齐，点击新窗口看大图 */
.ct-qr-link { flex: 0 0 auto; margin-top: auto; align-self: flex-start; display: block; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: #fff; box-shadow: 0 2px 8px rgba(15, 23, 42, .06); }
.ct-qr-link:hover { border-color: #c7dbfc; }
.ct-qr { display: block; width: 92px; height: 92px; }
@media (max-width: 1100px) { .ct-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .ct-cards { grid-template-columns: 1fr; } .ct-qr { width: 76px; height: 76px; } }
.ct-panel { background: #eef4ff; border: 1px solid #dbe7ff; border-radius: var(--radius); padding: 20px 22px; }
.ct-panel h3 { margin: 0 0 8px; font-size: 17px; color: var(--ink); }
.ct-panel p { margin: 0; font-size: 14px; line-height: 1.9; color: var(--text); }
/* 2026-10-01 合作三问：H2 居中、3 卡一行（卡内内容左对齐——用户澄清「只是标题居中」），hover 微浮起 */
.ct-ask3 { margin-bottom: 26px; }
.ct-ask3 .h2 { margin: 0 0 20px; text-align: center; }
.ct-ask-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ct-ask-card { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 24px 22px; transition: border-color .18s ease, box-shadow .18s ease; }
.ct-ask-card:hover { border-color: #c7dbfc; box-shadow: 0 14px 30px rgba(37, 99, 235, .10); }
.ct-ask-no { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 50%; background: #eef4ff; color: var(--pri); font-weight: 800; font-size: 15px; display: inline-flex; align-items: center; justify-content: center; }
.ct-ask-card b { font-size: 15.5px; color: var(--ink); }
.ct-ask-card span { font-size: 13.8px; line-height: 1.8; color: var(--muted); }
@media (max-width: 900px) { .ct-ask-grid { grid-template-columns: 1fr; } }
.ct-panel-row { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
.ct-panel-row > div { flex: 1 1 420px; }
.ct-panel-row .btn-pri { flex: 0 0 auto; }
@media (max-width: 640px) { .ct-panel-row .btn-pri { display: block; text-align: center; } }

/* ---- 服务与报价页 ---- */
.sv-tabs { display: flex; flex-wrap: wrap; gap: 9px; margin: 4px 0 6px; }
.sv-tabs a { font-size: 13.8px; font-weight: 600; color: var(--text); text-decoration: none; background: #fff; border: 1px solid var(--line); border-radius: 999px; padding: 7px 16px; transition: color .18s, border-color .18s, background .18s; }
.sv-tabs a:hover { color: var(--pri); border-color: var(--pri); background: #eef4ff; }
.sv-tabs .sv-tabs-cta { color: #fff; background: var(--pri); border-color: var(--pri); }
.sv-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; list-style: none; margin: 0; padding: 0; }
.sv-card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; transition: transform .22s ease, box-shadow .22s ease; }
.sv-card:hover { box-shadow: var(--shadow-lg); }
.sv-card.is-featured { border-color: #c9dbff; box-shadow: 0 8px 24px rgba(37, 99, 235, .08); }
.sv-media { display: block; aspect-ratio: 21 / 8; overflow: hidden; background: #eef4ff; }
.sv-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sv-body { display: flex; flex-direction: column; gap: 9px; padding: 18px 20px 20px; flex: 1; }
.sv-name { display: flex; align-items: center; gap: 10px; font-size: 16.5px; color: var(--ink); }
.sv-hot { font-style: normal; font-size: 11.5px; font-weight: 700; color: #b45309; background: #fef3c7; border-radius: 999px; padding: 2px 10px; }
.sv-short { font-size: 13.8px; font-weight: 600; color: var(--pri); }
.sv-desc { font-size: 13.6px; line-height: 1.85; color: var(--muted); }
.sv-feats { display: grid; grid-template-columns: 1fr 1fr; gap: 5px 14px; list-style: none; margin: 2px 0 0; padding: 10px 0 0; border-top: 1px dashed var(--line); }
.sv-feats li { position: relative; padding-left: 16px; font-size: 12.8px; color: var(--text); }
.sv-feats li::before { content: "✓"; position: absolute; left: 0; color: var(--pri); font-weight: 700; }
.sv-cta { margin-top: auto; padding-top: 8px; font-size: 13.8px; font-weight: 700; color: var(--pri); text-decoration: none; }
.sv-cta:hover { text-decoration: underline; }
.sv-process { margin-top: 22px; }
@media (max-width: 960px) {
  .sv-grid { grid-template-columns: 1fr; }
  .ab-two, .ct-grid { grid-template-columns: 1fr; }
  .ab-values { grid-template-columns: 1fr 1fr; }
  .ab-author { flex-direction: column; }
}
@media (max-width: 560px) {
  .ab-values { grid-template-columns: 1fr; }
  .ab-facts { grid-template-columns: 1fr; }
}

/* ---------- 20.8 Hero 通栏全宽（2026-09-29 用户指令；2026-09-29 下午修正）
   .hero/.e-hero 的通栏由 §15（1195 负 margin + 1209 cqi 修正）负责，此处不得再用
   width:100vw 重复叠加（滚动条宽 + 负 margin 双重出血 → 375 下 hero 内容整体右溢被裁）。
   本块只处理单页 hero（ab/ct/sv）：同样走负 margin 方案（cqi 优先，vw 兜底）。 */
body { overflow-x: clip; }
.ab-hero, .ct-hero, .sv-hero {
  margin-left: calc(-1 * (50vw - 50%));
  margin-right: calc(-1 * (50vw - 50%));
}
@supports (container-type: inline-size) {
  .ab-hero, .ct-hero, .sv-hero {
    margin-left: calc(-1 * (50cqi - 50%));
    margin-right: calc(-1 * (50cqi - 50%)); }
}
/* 文字对齐补偿：hero 文本左缘回到原 wrap 内容位置（--pad 从 .wrap 继承） */
.e-hero { padding-left: calc(50vw - 50% + 26px); padding-right: calc(50vw - 50% + 26px); }
@supports (container-type: inline-size) {
  .e-hero { padding-left: calc(50cqi - 50% + 26px); padding-right: calc(50cqi - 50% + 26px); }
}
@media (max-width: 720px) { .e-hero { padding-left: calc(50cqi - 50% + 16px); padding-right: calc(50cqi - 50% + 16px); } }
.ab-hero, .ct-hero, .sv-hero { padding-left: calc(50vw - 50% + var(--pad, 20px)); padding-right: calc(50vw - 50% + var(--pad, 20px)); }
@supports (container-type: inline-size) {
  .ab-hero, .ct-hero, .sv-hero { padding-left: calc(50cqi - 50% + var(--pad, 20px)); padding-right: calc(50cqi - 50% + var(--pad, 20px)); }
}
@media (min-width: 900px) { .ab-hero, .ct-hero, .sv-hero { padding-left: calc(50cqi - 50% + 36px); padding-right: calc(50cqi - 50% + 36px); } }
/* 首页 hero：自身有 hero-in（自带 max-width+padding 居中），无需补偿；圆角改直角贴合通栏 */
.hero { border-radius: 0; }

/* ---------- 20.9 首页 Hero v2（参考源站设计）：左文右 AI 回答示意卡 ---------- */
/* 栏目 hero 上下留白与「客户案例」栏目对齐（2026-09-29 用户反馈，基准=cse-hero 的 64/56） */
.ld-hero, .acl-hero { padding-top: 64px; padding-bottom: 56px; }
.hero.hm-hero2 {
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, .95) 42%, rgba(255, 255, 255, .62) 70%, rgba(255, 255, 255, .18) 100%),
    var(--hm-hero-img, none) center right / cover no-repeat,
    linear-gradient(180deg, #f4f8ff 0%, #eaf1fe 100%);
}
@media (max-width: 900px) {
  .hero.hm-hero2 {
    background:
      linear-gradient(90deg, rgba(255, 255, 255, .97), rgba(255, 255, 255, .88)),
      var(--hm-hero-img, none) center / cover no-repeat,
      linear-gradient(180deg, #f4f8ff 0%, #eaf1fe 100%); }
}
.hm-hl { color: var(--pri); white-space: nowrap; }
.hm-hero-bullets { display: flex; flex-wrap: wrap; gap: 8px 26px; list-style: none; margin: 26px 0 0; padding: 0; }
.hm-hero-bullets li { display: flex; align-items: center; gap: 8px; font-size: 14.5px; color: var(--muted); }
.hm-hero-bullets li span { color: var(--pri); font-weight: 700; }
/* AI 回答示意卡：毛玻璃浮在背景图上（2026-09-29 用户反馈「太宽」：限宽 480 靠右，
   右列同步收窄为 42%，把宽度还给左侧主文案） */
.hm-ai-card {
  position: relative; background: rgba(255, 255, 255, .78); backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, .85); border-radius: 16px;
  padding: 20px 22px 18px; box-shadow: 0 18px 44px rgba(30, 64, 175, .14);
  max-width: 480px; margin-left: auto;
}
.hm-ai-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid rgba(226, 232, 240, .9); padding-bottom: 12px; margin-bottom: 12px; }
.hm-ai-who { display: inline-flex; align-items: center; gap: 8px; font-size: 14.5px; font-weight: 600; color: #334155; }
.hm-ai-ico { font-style: normal; width: 24px; height: 24px; border-radius: 50%; background: #dbe7ff; color: var(--pri); font-size: 11px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #c3d7ff; }
.hm-ai-badge { font-size: 12px; font-weight: 600; color: #047857; background: #ecfdf5; border: 1px solid #a7f3d0; border-radius: 999px; padding: 2px 10px; }
.hm-ai-body { margin: 0; font-size: 14.2px; line-height: 1.95; color: #475569; }
.hm-ai-body strong { color: #0f172a; font-weight: 700; }
.hm-ai-src { display: flex; align-items: center; gap: 8px; margin: 14px 0 0; font-size: 13px; color: #94a3b8; }
.hm-ai-src span { background: #f1f5f9; border-radius: 6px; padding: 2px 9px; }
.hm-ai-src b { background: #eef4ff; color: var(--pri); border-radius: 6px; padding: 2px 9px; font-weight: 600; }
.hm-ai-cta { display: inline-block; margin-top: 12px; font-size: 14px; font-weight: 600; color: var(--pri); }
.hm-ai-cta:hover { text-decoration: underline; }

/* ---------- 20.10 栏目内搜索（qsearch，列表页/内容页通用） ---------- */
.qsearch { display: flex; gap: 10px; max-width: 560px; margin: 16px 0 6px; }
.qsearch input[type="search"] {
  flex: 1 1 auto; min-width: 0; height: 44px; padding: 0 16px;
  border: 1px solid var(--line); border-radius: 10px; background: #fff;
  font-size: 14.5px; color: var(--ink); font-family: inherit;
}
.qsearch input[type="search"]::placeholder { color: #9aa7bb; }
.qsearch input[type="search"]:focus { outline: none; border-color: var(--pri); box-shadow: 0 0 0 3px rgba(37, 99, 235, .12); }
.qsearch button {
  flex: 0 0 auto; height: 44px; padding: 0 24px; border: 0; border-radius: 10px;
  background: linear-gradient(180deg, #3f83f8, #2563eb); color: #fff;
  font-size: 14.5px; font-weight: 600; font-family: inherit; cursor: pointer;
  transition: background .18s ease;
}
.qsearch button:hover { background: #1d4ed8; }
@media (max-width: 560px) { .qsearch button { padding: 0 16px; } }

/* ---------- 20.11 文章列表专属模板 v3（acl-*，2026-09-29 编辑部/杂志风）
   与案例模板（作品集风：深Hero大数字+编号卡墙）明确区分：
   文章 = 期刊索引（浅 Hero + meta 行 + 日期行式列表 + tag pills 过滤 + 一行尾注 CTA） ---------- */
.acl-hero .qsearch { margin-top: 26px; max-width: 460px; }
/* Hero：期刊刊头 */
.acl-eyebrow { display: flex; align-items: center; gap: 12px; margin: 0 0 16px; font-size: 12.5px; font-weight: 700; letter-spacing: 4px; color: var(--pri); text-transform: uppercase; }
.acl-eyebrow::before { content: ""; flex: none; width: 40px; height: 2px; background: var(--pri); border-radius: 2px; }
.acl-eyebrow a { color: inherit; text-decoration: none; text-transform: none; letter-spacing: 1.5px; }
.acl-eyebrow a:hover { text-decoration: underline; }
.acl-title { margin: 0 0 14px; max-width: 880px; font-size: clamp(30px, 3.4vw, 46px); line-height: 1.22; letter-spacing: -.5px; font-weight: 800; color: var(--ink); }
.acl-lead { margin: 0; max-width: 720px; font-size: clamp(15px, 1vw + 12.5px, 16.5px); line-height: 1.9; color: var(--muted); }
.acl-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 18px 0 0; font-size: 13px; color: var(--muted); }
.acl-meta i { font-style: normal; color: #cbd5e1; }
.acl-meta a { color: var(--pri); text-decoration: none; border-bottom: 1px dashed var(--blue-300); }
.acl-meta a:hover { color: #1d4ed8; border-bottom-style: solid; }
/* 期刊 tag pills 过滤（区别于案例的下划线式 cse-filter） */
.acl-pills { display: flex; flex-wrap: wrap; gap: 10px; margin: 4px 0 26px; }
.acl-pill { display: inline-flex; align-items: baseline; gap: 5px; font-size: 14px; font-weight: 600; color: var(--muted); background: #fff; border: 1px solid var(--line); border-radius: 999px; padding: 8px 18px; text-decoration: none; transition: all .18s ease; }
.acl-pill sup { font-size: 11px; color: #94a3b8; }
.acl-pill:hover { border-color: var(--blue-300); color: var(--pri); }
.acl-pill.on { background: var(--pri); border-color: var(--pri); color: #fff; box-shadow: 0 6px 16px rgba(37, 99, 235, .28); }
.acl-pill.on sup { color: rgba(255, 255, 255, .7); }

/* ---------- 20.11 文章阅读清单（ar-*，文字为主：日期·标题·摘要·作者，无缩略图） ----------
   与案例作品墙（大图）、产品货架（卡片网格）在信息架构上拉开：文章清单 = 排版密度优先的行式阅读。 */
/* 文章列表：封面图卡片网格（桌面每行 3 条，区别于案例作品集 cse-pf） */
.ar-grid { list-style: none; margin: 34px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.ar-card { background: #fff; border: 1px solid var(--line); border-radius: 16px; overflow: hidden; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; display: flex; flex-direction: column; }
.ar-card:hover { box-shadow: 0 16px 36px rgba(37, 99, 235, .12); border-color: #c7dbfc; }
.ar-card > a { display: flex; flex-direction: column; flex: 1 1 auto; text-decoration: none; color: inherit; }
.ar-card-media { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: #f1f5f9; position: relative; }
.ar-card-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease; }
.ar-card:hover .ar-card-media img { transform: scale(1.04); }
.ar-card-ph { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: #cbd5e1; }
.ar-card-ph svg { width: 30px; height: 30px; }
.ar-card-badge { position: absolute; left: 12px; top: 12px; background: var(--pri); color: #fff; font-size: 11.5px; font-weight: 700; letter-spacing: .5px; padding: 3px 10px; border-radius: 999px; }
.ar-card-body { display: flex; flex-direction: column; gap: 8px; padding: 16px 18px 18px; flex: 1 1 auto; min-width: 0; }
.ar-card-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: auto; padding: 0 18px 16px; font-size: 12.5px; color: #94a3b8; }
.ar-card-meta time { font-variant-numeric: tabular-nums; }
/* 2026-10-01 用户指令：列表卡标签只显示文字，不要边框和背景；改为链接可点进标签页 */
.ar-card-ind { font-style: normal; font-size: 12.5px; font-weight: 400; color: var(--muted); text-decoration: none; transition: color .15s; }
.ar-card-ind:hover { color: var(--pri); }
/* 封面页文章卡底部行（2026-09-29 用户指令：标签和时间放一行）：标签左、时间右，整行贴卡底 */
.news-cards .news-foot { margin-top: auto; padding-top: 8px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.news-cards .news-ind { font-style: normal; font-size: 12px; font-weight: 700; color: var(--pri); background: #eef4ff; border-radius: 999px; padding: 2px 10px; white-space: nowrap; }
.ar-card-title { font-size: 17px; font-weight: 700; line-height: 1.5; color: var(--ink); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; transition: color .15s ease; }
.ar-card > a:hover .ar-card-title { color: var(--pri); }
.ar-card-desc { font-size: 13.5px; line-height: 1.8; color: var(--muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ar-card-more { margin-top: auto; padding-top: 10px; font-size: 14px; font-weight: 600; color: var(--pri); }
.ar-card-more::after { content: " \2192"; }
@media (max-width: 900px) { .ar-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; } }
@media (max-width: 560px) { .ar-grid { grid-template-columns: 1fr; gap: 14px; } .ar-card-media { aspect-ratio: 16 / 9; } }

/* ---------- 20.12 客户案例专属模板（cse-*，2026-09-29 国际风：大字排版 / 编辑感卡片 / 大留白） ---------- */
.cse-hero { padding-top: 64px; padding-bottom: 56px; }
.cse-hero-intl { border-bottom: 0; }
.cse-eyebrow { display: flex; align-items: center; gap: 12px; margin: 0 0 18px; font-size: 12.5px; font-weight: 700; letter-spacing: 4px; color: var(--pri); text-transform: uppercase; }
.cse-hero .cse-eyebrow::before { content: ""; flex: none; width: 40px; height: 2px; background: var(--pri); border-radius: 2px; }
.cse-eyebrow a { color: inherit; text-decoration: none; text-transform: none; letter-spacing: 1.5px; }
.cse-eyebrow a:hover { text-decoration: underline; }
.cse-eyebrow-dim { color: #94a3b8; }
.cse-title { margin: 0 0 18px; max-width: 880px; font-size: clamp(30px, 3.6vw, 48px); line-height: 1.22; letter-spacing: -.5px; font-weight: 800; color: var(--ink); }
.cse-lead { margin: 0; max-width: 720px; font-size: clamp(15px, 1vw + 12.5px, 17px); line-height: 1.9; color: var(--muted); }
.cse-stats { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 26px 56px; margin: 36px 0 0; padding-top: 24px; position: relative; }
.cse-stat { display: flex; flex-direction: column; gap: 4px; }
.cse-stat b { font-size: 30px; font-weight: 800; color: var(--ink); letter-spacing: -.5px; }
.cse-stat span { font-size: 13px; color: var(--muted); }
/* 过滤条：国际作品集式 */
.cse-filter { display: flex; flex-wrap: wrap; gap: 6px 30px; margin: 26px 0 10px; padding: 14px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.cse-fitem { position: relative; font-size: 15px; font-weight: 600; color: var(--muted); text-decoration: none; padding: 6px 0; transition: color .18s ease; }
.cse-fitem sup { margin-left: 5px; font-size: 11px; color: #94a3b8; font-weight: 600; }
.cse-fitem:hover { color: var(--ink); }
.cse-fitem.on { color: var(--pri); }
.cse-fitem.on::after { content: ""; position: absolute; left: 0; right: 0; bottom: -15px; height: 2px; background: var(--pri); }
/* 区块标题 */
.cse-section { padding-top: 56px; }
.cse-sec-head { margin-bottom: 30px; }
.cse-sec-title { margin: 0 0 10px; font-size: clamp(22px, 1.8vw, 30px); font-weight: 800; color: var(--ink); letter-spacing: -.3px; }
.cse-sec-sub { margin: 0; font-size: 14.5px; color: var(--muted); }
/* 案例卡：编辑感——大图、编号、细元信息、无重边框 */
.cse-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 44px 36px; list-style: none; margin: 0; padding: 0; }
.cse-card a { display: flex; flex-direction: column; height: 100%; text-decoration: none; }
.cse-media { display: block; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 14px; background: #eef4ff; }
.cse-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease; }
.cse-card a:hover .cse-media img { transform: scale(1.035); }
.cse-body { display: flex; flex-direction: column; gap: 9px; padding: 18px 4px 0; flex: 1; }
.cse-meta { display: flex; align-items: center; gap: 12px; font-size: 12.5px; color: #94a3b8; letter-spacing: 1px; }
.cse-meta b { font-size: 13px; font-weight: 800; color: var(--pri); letter-spacing: 2px; }
.cse-meta .cse-ind { font-style: normal; padding-right: 12px; border-right: 1px solid var(--line); }
.cse-body h3 { margin: 0; font-size: clamp(17px, 1.2vw + 13px, 21px); line-height: 1.5; font-weight: 700; color: var(--ink); }
.cse-card a:hover h3 { color: var(--pri); }
.cse-body p { margin: 0; font-size: 14px; line-height: 1.85; color: var(--muted); }
.cse-more { margin-top: auto; padding-top: 6px; font-size: 13.5px; font-weight: 600; color: var(--pri); }
.cse-more em { font-style: normal; display: inline-block; transition: transform .2s ease; }
.cse-card a:hover .cse-more em { transform: translateX(4px); }
/* 极简 CTA：一行大字 + 按钮，弱化装饰 */
.cse-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; margin-top: 8px; padding: 36px 0 10px; border-top: 1px solid var(--line); }
.cse-cta-t { margin: 0 0 6px; font-size: clamp(18px, 1.4vw + 13px, 24px); font-weight: 800; color: var(--ink); }
.cse-cta-p { margin: 0; font-size: 14px; color: var(--muted); }
.cse-cta-btns { display: flex; gap: 12px; flex-wrap: wrap; }
@media (max-width: 860px) {
  .cse-grid { grid-template-columns: 1fr; gap: 36px; }
  .cse-stats { gap: 26px; }
  .cse-filter { gap: 6px 18px; }
  .cse-fitem.on::after { bottom: -8px; }
}

/* ===== 案例模板 v3：图文横条列表（cse-rowlist，2026-09-29）
   案例封面页/列表页统一：图左(38%)文右的大条目，无图用编号占位；与文章行式索引区分 ===== */
.cse-rowlist { list-style: none; margin: 0; padding: 0; }
.cse-rowitem { border-bottom: 1px solid var(--line); }
.cse-rowitem:first-child { border-top: 2px solid var(--ink); }
.cse-rowitem a { display: grid; grid-template-columns: minmax(0, 38%) minmax(0, 1fr); gap: 30px; align-items: center; padding: 26px 0 28px; text-decoration: none; }
.cse-row-media { display: block; overflow: hidden; border-radius: var(--radius); background: #eef4ff; }
.cse-row-media img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; transition: transform .3s ease; }
.cse-rowitem a:hover .cse-row-media img { transform: scale(1.03); }
.cse-row-ph { display: flex; align-items: center; justify-content: center; aspect-ratio: 16 / 10; font-size: 46px; font-weight: 800; letter-spacing: 2px; color: #b9cdf2; background: linear-gradient(135deg, #f2f7ff, #e8f0fe); }
.cse-row-body { display: block; }
.cse-row-body .cse-meta { margin: 0; }
.cse-row-t { display: block; margin-top: 10px; font-size: clamp(17px, 1.4vw, 21px); font-weight: 800; line-height: 1.5; letter-spacing: -.2px; color: var(--ink); transition: color .15s ease; }
.cse-rowitem a:hover .cse-row-t { color: var(--pri); }
.cse-row-p { display: block; margin-top: 10px; font-size: 14px; line-height: 1.9; color: var(--muted); }
.cse-rowitem a:hover .cse-more em { transform: translateX(4px); }
@media (max-width: 860px) {
  .cse-rowitem a { grid-template-columns: 1fr; gap: 14px; padding: 22px 0 24px; }
  .cse-row-media { order: -1; }
  .cse-row-t { font-size: 16.5px; }
  .cse-row-p { margin-top: 7px; }
}

.cse-feat { display: grid; grid-template-columns: 1.15fr 1fr; margin: 0 0 48px; background: #fff; border: 1px solid var(--line); border-radius: 18px; overflow: hidden; text-decoration: none; transition: transform .22s ease, box-shadow .22s ease; }
.cse-feat:hover { box-shadow: var(--shadow-lg); }
.cse-feat-media { display: block; min-height: 320px; overflow: hidden; background: #eef4ff; }
.cse-feat-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease; }
.cse-feat:hover .cse-feat-media img { transform: scale(1.035); }
.cse-feat-body { display: flex; flex-direction: column; gap: 12px; padding: 34px 36px; }
.cse-feat-body .cse-ind { color: var(--pri); }
.cse-feat-t { font-size: clamp(20px, 1.5vw + 14px, 27px); line-height: 1.45; font-weight: 800; letter-spacing: -.3px; color: var(--ink); }
.cse-feat:hover .cse-feat-t { color: var(--pri); }
.cse-feat-body p { margin: 0; font-size: 14.5px; line-height: 1.9; color: var(--muted); }
.cse-feat-body .cse-more { margin-top: auto; padding-top: 8px; }
@media (max-width: 860px) {
  .cse-feat { grid-template-columns: 1fr; margin-bottom: 36px; }
  .cse-feat-media { min-height: 0; aspect-ratio: 16 / 9; }
  .cse-feat-body { padding: 22px 20px 24px; }
}
/* 头条无封面图：纯文字编辑版式（左竖线强调） */
.cse-feat-notpl { grid-template-columns: 1fr; background: linear-gradient(90deg, rgba(148, 163, 184, .07), transparent 40%), #fff; }
.cse-feat-notpl .cse-feat-body { padding: 34px 40px; border-left: 3px solid var(--pri); border-radius: 2px; }





/* ===== 2026-09-29 美化巡检修复 ===== */
/* 1) 浅色单页 Hero（关于/联系/服务）：修正被深色 Hero 全局规则染白的描述与眉题 */
.ab-hero .e-eyebrow, .ct-hero .e-eyebrow, .sv-hero .e-eyebrow { color: var(--pri); }
.ab-hero .e-eyebrow::before, .ct-hero .e-eyebrow::before, .sv-hero .e-eyebrow::before { background: var(--pri); }
.ab-hero .e-desc, .ct-hero .e-desc, .sv-hero .e-desc { color: var(--muted); }
/* 2) 底栏链接（备案/隐私/RSS/友链）与左侧版权同色，hover 加深 */
.foot-bar a { color: var(--muted); text-decoration: none; transition: color .15s; }
.foot-bar a:hover { color: var(--ink); }
.foot-legal a { color: var(--muted); text-decoration: none; transition: color .15s; }
.foot-legal a:hover { color: var(--ink); }
/* 3) Hero 内搜索框统一位置与宽度（落地页/案例/文章三类封面页一致） */
.ld-hero .qsearch, .cse-hero .qsearch { margin-top: 24px; max-width: 480px; }
/* 4) 隐私政策正文排版 */
.pv-prose { max-width: 860px; }
.pv-prose h2 { margin: 30px 0 12px; font-size: 20px; font-weight: 800; color: var(--ink); letter-spacing: -.2px; }
.pv-prose h2:first-child { margin-top: 0; }
.pv-prose p { margin: 0 0 12px; font-size: 14.5px; line-height: 2.0; color: var(--muted); }
.pv-prose ul { margin: 0 0 12px; padding-left: 22px; }
.pv-prose li { font-size: 14.5px; line-height: 1.95; color: var(--muted); margin-bottom: 6px; }
.pv-prose strong { color: var(--ink); }

/* ===== 2026-09-29 全站正文表格统一样式（.content 四处渲染点：文章/产品/案例/单页）
   纯 CSS 实现，不加任何内联样式；:not(.spec) 不影响产品参数表既有版式 ===== */
.content table:not(.spec) {
  display: table; /* 覆盖 177 行旧 display:block：block 表内匿名盒收缩，列少时右侧大片留白；宽表滚动交给 ≤720 的 media query */
  width: 100%; max-width: 100%; margin: 22px 0;
  border-collapse: separate; border-spacing: 0;
  border: 1px solid #dfe7f5; border-radius: 12px;
  font-size: 14.5px; line-height: 1.8; color: var(--text);
  box-shadow: 0 2px 12px rgba(15, 23, 42, .05);
}
.content table:not(.spec) th, .content table:not(.spec) td {
  padding: 11px 16px; text-align: left; vertical-align: top;
  border: 0; border-bottom: 1px solid #e8eefb;
  font-variant-numeric: tabular-nums;
}
.content table:not(.spec) thead th {
  background: linear-gradient(180deg, #f2f7ff, #eaf1fe);
  color: var(--ink); font-weight: 700; font-size: 13.8px; letter-spacing: .4px; white-space: nowrap;
}
.content table:not(.spec) tbody tr { transition: background .15s ease; }
.content table:not(.spec) tbody tr:nth-child(even) td { background: #fafcff; }
.content table:not(.spec) tbody tr:hover td { background: #f0f6ff; }
.content table:not(.spec) tbody tr:last-child td { border-bottom: 0; }
/* 圆角交给四角单元格（block+滚动场景不能用 overflow:hidden） */
.content table:not(.spec) thead tr:first-child th:first-child { border-top-left-radius: 11px; }
.content table:not(.spec) thead tr:first-child th:last-child { border-top-right-radius: 11px; }
.content table:not(.spec) tbody tr:last-child td:first-child { border-bottom-left-radius: 11px; }
.content table:not(.spec) tbody tr:last-child td:last-child { border-bottom-right-radius: 11px; }
/* 单元格内段落间距收敛 */
.content table:not(.spec) td p { margin: 0 0 6px; }
.content table:not(.spec) td p:last-child { margin-bottom: 0; }
@media (max-width: 720px) {
  /* 移动端切 block 局部滚动，宽表不撑破页面 */
  .content table:not(.spec) { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; font-size: 13.5px; border-radius: 10px; }
  .content table:not(.spec) th, .content table:not(.spec) td { padding: 9px 12px; white-space: nowrap; }
  .content table:not(.spec) tbody tr:hover td { background: inherit; }
}

/* ===== 2026-09-29 下午：首页 hero 可读性 + 品牌故事条 + 案例详情 v2（cs-brief） ===== */
/* 1) 照片 hero 上的 eyebrow：白底胶囊加深蓝字（原 12.5px 蓝字压照片对比度不足） */
.hm-hero2 .e-eyebrow {
  display: inline-flex; align-items: center; width: fit-content;
  background: rgba(255, 255, 255, .93); color: var(--pri);
  border: 1px solid #dbe7fb; border-radius: 999px;
  padding: 8px 18px; font-size: 13.5px; font-weight: 700; letter-spacing: 2px;
  box-shadow: 0 3px 14px rgba(15, 23, 42, .10); backdrop-filter: blur(6px);
}
.hm-hero2 .hero-sub { color: #1f2937; text-shadow: 0 1px 0 rgba(255, 255, 255, .65); }
@media (max-width: 720px) {
  /* 375 下长 eyebrow 胶囊允许换行，杜绝横向溢出 */
  .hm-hero2 .e-eyebrow { display: inline-block; white-space: normal; line-height: 1.7; padding: 7px 14px; font-size: 12.5px; letter-spacing: 1px; border-radius: 14px; }
}
/* 2) 品牌故事引言条（hero 正下方） */
/* 3) 案例详情 v2：GEO 速览卡（description 真实摘要 + 关键词标签，结构化短答利于 AI 引用） */
.cs-brief { margin: 0 0 30px; padding: 24px 26px; background: linear-gradient(180deg, #f2f7ff, #fafcff); border: 1px solid #dbe7fb; border-left: 4px solid var(--pri); border-radius: var(--radius); }
.cs-brief-t { margin: 0 0 10px; font-size: 12.5px; font-weight: 700; letter-spacing: 3px; color: var(--pri); text-transform: uppercase; }
.cs-brief-d { margin: 0 0 14px; font-size: 15px; line-height: 2.0; color: var(--ink); }
.cs-brief-tags { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
.cs-brief-tags li { font-size: 12.5px; font-weight: 600; color: var(--pri); background: #fff; border: 1px solid var(--blue-300); border-radius: 999px; padding: 3px 12px; }
/* 案例详情 FAQ 复用 nw-faq 版式（本页容器非 nw-wrap，补一版间距兜底） */
.cs-card .nw-faq { margin-top: 34px; }

/* ---------- 20.13 案例作品集网格（cse-pf-*，2026-09-29 v4：大图卡片 + 图上徽章）
   与文章行式索引明确区分：案例以图为主视觉，2 栏大卡，首条通栏放大；hover 图缩放 + 标题变色 ===== */
.cse-pf-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 46px 40px; list-style: none; margin: 0; padding: 0; }
.cse-pf-lead { grid-column: 1 / -1; }
.cse-pf a { display: flex; flex-direction: column; height: 100%; text-decoration: none; }
.cse-pf-media { position: relative; display: block; overflow: hidden; border-radius: 16px; background: #eef4ff; aspect-ratio: 16 / 9; box-shadow: 0 10px 30px rgba(15, 23, 42, .08); }
.cse-pf-lead .cse-pf-media { aspect-ratio: 21 / 9; }
.cse-pf-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .45s ease; }
.cse-pf a:hover .cse-pf-media img { transform: scale(1.045); }
.cse-pf-ph { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-size: 64px; font-weight: 800; letter-spacing: 3px; color: #b9cdf2; background: linear-gradient(135deg, #f2f7ff, #e4eefc); }
/* 图上徽章：编号（左，墨色）+ 服务类型胶囊（右，白底） */
.cse-pf-no { position: absolute; top: 14px; left: 14px; padding: 5px 12px; border-radius: 9px; background: rgba(15, 23, 42, .80); color: #fff; font-size: 13px; font-weight: 800; letter-spacing: 2px; backdrop-filter: blur(4px); }
.cse-pf-badge { position: absolute; top: 14px; right: 14px; padding: 5px 13px; border-radius: 999px; background: rgba(255, 255, 255, .93); color: var(--pri); font-size: 12px; font-weight: 700; letter-spacing: 1px; backdrop-filter: blur(4px); box-shadow: 0 3px 12px rgba(15, 23, 42, .10); }
.cse-pf-body { display: flex; flex-direction: column; gap: 9px; padding: 20px 4px 0; flex: 1; }
.cse-pf-meta { display: flex; align-items: center; gap: 12px; margin: 0; font-size: 12.5px; color: #94a3b8; letter-spacing: 1px; }
.cse-pf-meta i { font-style: normal; padding-right: 12px; border-right: 1px solid var(--line); }
.cse-pf-t { font-size: clamp(17px, 1.3vw + 13px, 21px); line-height: 1.5; font-weight: 800; letter-spacing: -.2px; color: var(--ink); transition: color .15s ease; }
.cse-pf a:hover .cse-pf-t { color: var(--pri); }
.cse-pf-p { margin: 0; font-size: 14px; line-height: 1.85; color: var(--muted); }
.cse-pf .cse-more { margin-top: auto; padding-top: 8px; font-size: 13.5px; font-weight: 600; color: var(--pri); }
.cse-pf .cse-more em { font-style: normal; display: inline-block; transition: transform .2s ease; }
.cse-pf a:hover .cse-more em { transform: translateX(4px); }
@media (max-width: 860px) {
  .cse-pf-grid { grid-template-columns: 1fr; gap: 34px; }
  .cse-pf-lead .cse-pf-media, .cse-pf-media { aspect-ratio: 16 / 10; }
  .cse-pf-body { padding-top: 14px; }
}
/* 封面页案例区块：一行排 3 条（2026-09-29 用户指令），紧凑三列版式 */
.cse-pf-grid-3 { grid-template-columns: repeat(3, 1fr); gap: 30px; }
.cse-pf-grid-3 .cse-pf-media { aspect-ratio: 4 / 3; border-radius: 13px; box-shadow: 0 6px 20px rgba(15, 23, 42, .07); }
.cse-pf-grid-3 .cse-pf-body { padding-top: 15px; gap: 7px; }
.cse-pf-grid-3 .cse-pf-t { font-size: 16.5px; }
.cse-pf-grid-3 .cse-pf-p { font-size: 13.5px; line-height: 1.75; }
@media (max-width: 1024px) { .cse-pf-grid-3 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 720px) { .cse-pf-grid-3 { grid-template-columns: 1fr; gap: 26px; } .cse-pf-grid-3 .cse-pf-media { aspect-ratio: 16 / 10; } }

/* 5) 单页 hero 标题字号对齐栏目封面页（.e-hero h1 同规格；此前 ab/ct/sv 走浏览器默认 32px 偏小） */
.ab-hero h1, .ct-hero h1, .sv-hero h1 {
  font-size: clamp(32px, 4.4vw, 58px);
  line-height: 1.08;
  letter-spacing: -.01em;
  font-weight: 700;
  margin: 0 0 16px;
}

/* 2026-09-29 修复：前台按钮/卡片 hover 在部分集成显卡上合成层微闪
   现象：鼠标放到带 hover 动效的按钮、卡片、CTA 上，元素不停闪动。
   根因：hover 同时改 box-shadow + transform 并走 transition，在集成显卡 Chrome 上
        重绘合成层抖动（无头 --disable-gpu 环境不闪，真机明显）。
   修复：给所有 hover 用 transform 动效的交互元素预置合成层，强制稳定，
        消除「放上去不停闪」。仅声明 will-change，不改变任何视觉与布局。
   注意：导航普通项(.site-nav>a)只改 color/background 不闪，未列入。 */
.btn-pri, .btn-ghost, .btn-line, .btn-line-inv, .btn-sm,
.card, .cls-card, .biz-card, .card-case, .adv-grid li,
.svc-grid a, .pager-btn,
.cta-btns .btn-pri, .cta-btns .btn-ghost,
.detail-cta .btn-pri, .detail-cta .btn-ghost, .detail-cta .btn-line,
.nw-author-cta .btn-pri, .nw-author-cta .btn-line,
.hero-btns .btn-pri, .hero-btns .btn-ghost,
.e-hero-cta .btn-pri, .e-hero-cta .btn-ghost,
.contact-actions .btn-pri, .contact-actions .btn-ghost,
.block-more .btn-pri, .block-more .btn-line,
.pd-final-btns a, .cs-final-btns a, .pd-sb-btns a,
.site-nav .nav-cta,
.card-case .card-media img,
/* 插件浮窗按钮（float_service 客服浮窗 / lead_form 线索悬浮）：同为 fixed + 阴影悬停过渡，
   不纳入合成层同样会闪（本机无头 --disable-gpu 测不出，但真机集成显卡可见）。 */
.fs-btn, .fs-btn::after, .ld-btn, .ld-go {
  will-change: transform;
  backface-visibility: hidden;
}

/* ---------- 文章详情两栏：左正文 + 右侧栏（2026-09-29 用户指令） ----------
   桌面 ≥1100px：nw-grid 两栏（左 minmax(0,1fr) + 右 320px），侧栏 sticky 吸顶；
   窄屏单列，侧栏整体落到正文之后（目录由 JS 插回正文顶部，见模板脚本）。
   SEO/豆包：正文 HTML 顺序仍是「标题→正文→FAQ」，侧栏为 aside 不影响抓取主次。 */
.nw-grid { display: block; }
@media (max-width: 1099px) {
  .nw-side { margin-top: 26px; } /* 单列时侧栏与主卡留出呼吸间距 */
}
.nw-side .side-box { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 18px 18px 14px; }
.nw-side .side-box[hidden] { display: none; }
.side-t { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font-size: 15px; font-weight: 700; color: var(--ink); letter-spacing: .5px; }
.side-t::before { content: ""; width: 4px; height: 15px; border-radius: 2px; background: var(--pri); }
.side-list { list-style: none; margin: 0; padding: 0; }
.side-rel .side-list li + li { border-top: 1px dashed var(--line); }

/* 相关业务卡片：左图 + 右文（2026-10-02 用户指令：去箭头 + 美化） */
.side-biz .side-list li + li { margin-top: 10px; }
.side-biz .side-list a.sb-card {
  position: relative;
  display: flex; align-items: center; gap: 12px;
  padding: 12px; font-size: 14px; color: var(--text); text-decoration: none;
  background: #fff; border: 1px solid var(--line); border-radius: 12px;
  box-shadow: 0 1px 4px rgba(15, 23, 42, .04);
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
  overflow: hidden;
}
/* hover 左侧蓝色竖条：无箭头也有明确的「可点」暗示 */
.side-biz .side-list a.sb-card::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: linear-gradient(180deg, var(--pri), #7c3aed);
  opacity: 0; transition: opacity .15s ease;
}
.side-biz .side-list a.sb-card:hover {
  border-color: #bfdbfe; box-shadow: 0 6px 18px rgba(59, 130, 246, .10);
  transform: translateY(-2px);
}
.side-biz .side-list a.sb-card:hover::before { opacity: 1; }
.side-biz .side-list .sb-thumb {
  flex: none; width: 56px; height: 56px; border-radius: 10px;
  background: #f1f5f9; overflow: hidden; display: flex; align-items: center; justify-content: center;
}
.side-biz .side-list .sb-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }
.side-biz .side-list a.sb-card:hover .sb-thumb img { transform: scale(1.06); }
.side-biz .side-list .sb-main { display: flex; flex-direction: column; gap: 3px; min-width: 0; flex: 1; }
.side-biz .side-list .sb-title { font-size: 15px; font-weight: 700; color: var(--ink); line-height: 1.35; transition: color .15s ease; }
.side-biz .side-list .sb-desc {
  font-size: 12.5px; line-height: 1.5; color: #64748b;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.side-biz .side-list a.sb-card:hover .sb-title { color: var(--pri); }
.side-biz .side-list a.sb-card:hover .sb-desc { color: #475569; }
.side-rel .side-list a { display: block; padding: 9px 2px; text-decoration: none; }
.side-rel .side-list .t { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 13.8px; line-height: 1.6; color: var(--text); }
.side-rel .side-list time { display: block; margin-top: 2px; font-size: 12px; color: #94a3b8; }
.side-rel .side-list a:hover .t { color: var(--pri); }
/* 相关标签：tags 插件输出在侧栏作用域内胶囊化 */
.side-tags .seo-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.side-tags .seo-tags-label { display: none; }
.side-tags .seo-tags a { display: inline-block; padding: 5px 12px; background: #f4f7fd; border: 1px solid var(--line); border-radius: 999px; font-size: 12.5px; line-height: 1.5; color: var(--text); text-decoration: none; transition: color .15s, background .15s, border-color .15s; }
.side-tags .seo-tags a:hover { color: #fff; background: var(--pri); border-color: var(--pri); }
/* 侧栏目录：复用 toc-box 链接基础样式，外壳融入白卡 */
.side-toc .toc-box { margin: 0; padding: 0; background: transparent; border: 0; border-radius: 0; }
.side-toc .toc-t { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font-size: 15px; font-weight: 700; color: var(--ink); letter-spacing: .5px; }
.side-toc .toc-t::before { content: ""; width: 4px; height: 15px; border-radius: 2px; background: var(--pri); }
.side-toc .toc-l a { font-size: 13.5px; padding: 5px 0; }
@media (min-width: 1100px) {
  .nw-grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 28px; align-items: start; }
  .nw-side-in { position: sticky; top: 84px; display: flex; flex-direction: column; gap: 16px; }
  .nw-side .side-toc { max-height: calc(100vh - 120px); overflow-y: auto; }
}

/* 2026-09-29 用户指令：移动端详情页右侧栏白卡内边距同步收窄（置于文件末尾以覆盖 4343 行基础规则） */
@media (max-width: 720px) {
  .nw-grid .nw-side .side-box { padding: 12px 12px 10px; }
}

/* 2026-09-29：信任数字带 dt/dd 结构样式（trust_facts 全站统一数据源；与 .stats-in b/strong 同视觉） */
.stats-grid { margin: 0; }
.stats-grid > div { min-width: 150px; }
.stats-grid dt { font-size: clamp(26px, 3vw, 36px); font-weight: 800; line-height: 1.25; color: #1d4ed8; letter-spacing: .5px; font-family: "Segoe UI", "Microsoft YaHei", sans-serif; font-variant-numeric: tabular-nums; }
.stats-grid dd { margin: 6px 0 0; color: #475569; font-size: 14px; line-height: 1.6; }

/* ---------- 2026-09-29 内容页 hero：背景图 + 栏目搜索框（用户指令） ---------- */
/* 手法与原站 Hero 一致：真实摄影图铺满 + 左白右透渐变，文字/搜索框全部压在近白区保证对比度 */
.detail-news .e-hero-mini { position: relative; }
.e-hero-bg { position: absolute; inset: 0; pointer-events: none; z-index: 0; }
.e-hero-bg img { width: 100%; height: 100%; object-fit: cover; }
.e-hero-bg .e-hero-bg-veil { position: absolute; inset: 0; display: block; background: linear-gradient(90deg, #ffffff 0%, rgba(255, 255, 255, .95) 45%, rgba(255, 255, 255, .42) 100%); }
.detail-news .e-hero-mini > .e-eyebrow,
.detail-news .e-hero-mini > .e-desc,
.detail-news .e-hero-mini > .qsearch { position: relative; z-index: 1; }
.detail-news .e-hero-mini .qsearch { margin: 16px 0 0; max-width: 480px; }
@media (max-width: 720px) {
  .e-hero-bg .e-hero-bg-veil { background: linear-gradient(90deg, rgba(255, 255, 255, .97) 0%, rgba(255, 255, 255, .92) 100%); }
  .detail-news .e-hero-mini .qsearch { max-width: none; }
}

/* 2026-09-29 用户指令：内容页 hero 背景图与导航之间的空白清掉——阅读型详情页 article 顶部 30px margin 取消，
   hero 背景直接顶到导航下沿（402 行 .detail 基础 margin:30px auto 44px 的顶值对铺图版式不适用） */
main > .detail-news { margin-top: 0; }
main > .detail-news ~ * { margin-top: 0; }

/* ---------- 2026-09-29 用户指令：作者卡移入右侧栏顶部，滚动时固定在右侧 ---------- */
/* 侧栏总高（含作者卡）超视口会使 sticky 失效 → 限高 + 内部滚动，sticky 始终成立、作者卡恒可见 */
@media (min-width: 1100px) {
  .nw-side-in { max-height: calc(100vh - 96px); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: none; -ms-overflow-style: none; }
  .nw-side-in::-webkit-scrollbar { display: none; width: 0; height: 0; } /* 用户指令：右侧栏不显示滚动条（滚轮/触控滚动保留） */
  .nw-side .side-toc { max-height: none; overflow-y: visible; } /* 滚动交给侧栏整体，目录不再单独滚动 */
}
/* 作者卡窄栏紧凑化：头像居上、按钮通栏，适配 320px 侧栏 */
.nw-side .nw-author { flex-direction: column; gap: 12px; margin: 0; padding: 16px; background: linear-gradient(160deg, #eef4ff, #f8fafd); }
.nw-side .nw-author-name i { display: block; margin: 6px 0 0; }
.nw-side .nw-author-cta .btn-pri, .nw-side .nw-author-cta .btn-line { display: block; width: 100%; text-align: center; box-sizing: border-box; }
/* sticky 生效关键：.nw-grid 原 align-items:start 会把 .nw-side 塌成内容高（sticky 无移动空间），
   改 stretch 让侧栏列撑到主列高度，sticky 侧栏才有行程 */
@media (min-width: 1100px) {
  .nw-grid { align-items: stretch; }
  .nw-side { position: relative; } /* 方向感知吸附的定位基准：JS absolute 以侧栏列为包含块 */
}

/* ---- 34. 全站统一高亮为蓝色 UI（2026-09-29）：侧栏目录当前项（TOC 移入侧栏后旧选择器匹配不到） ---- */
.side-toc .toc-l a.cur { color: var(--pri); font-weight: 700; }

/* ---- 35. 右侧栏只吸附作者卡（2026-09-29 用户指令）：上方目录/相关内容随页面正常滚过，
   仅作者卡到达吸顶线后固定；侧栏列整体恢复自然流，不再整栏吸附、无内部滚动 ---- */
@media (min-width: 1100px) {
  .nw-side-in {
    max-height: none;
    height: 100%;
    overflow: visible;
    scrollbar-width: auto;
    -ms-overflow-style: auto; }
  .nw-side-in::-webkit-scrollbar { display: block; width: 0; height: 0; }
  .nw-author {
    position: sticky;
    top: 84px;
    z-index: 5; }
}

/* ---- 36. 侧栏「相关内容」带封面图（2026-09-29 用户指令）：左图右文，16:10 缩略图 ---- */
.side-rel .side-rel-cards a { display: flex; align-items: flex-start; gap: 10px; padding: 10px 0; }
.side-rel .side-rel-cards li + li { border-top: 1px dashed var(--line); }
.side-rel .rel-thumb {
  flex: none; width: 96px; height: 60px; object-fit: cover;
  border-radius: 8px; border: 1px solid var(--line); background: #f1f5f9;
}
.side-rel .rel-body { flex: 1; min-width: 0; }
.side-rel .rel-body .t {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  font-size: 13.6px; line-height: 1.55; color: var(--text);
  transition: color .15s ease;
}
.side-rel .rel-body time { display: block; margin-top: 4px; font-size: 12px; color: #94a3b8; }
.side-rel .side-rel-cards a:hover .t { color: var(--pri); }
.side-rel .side-rel-cards a:hover .rel-thumb { border-color: rgba(37, 99, 235, .35); }
@media (max-width: 1099px) {
  .side-rel .rel-thumb { width: 84px; height: 53px; }
}

/* ---- 37. 分页排成一行（2026-09-29 用户指令）：「第N/M页·共N篇」+ 翻页 + 页码 同一行居中 ---- */
.pager.pgn { flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px 14px; }
.pgn-info { white-space: nowrap; }
.pgn-btns { flex-wrap: nowrap; }
@media (max-width: 719px) {
  .pgn-nav { flex: 0 0 auto; max-width: none; }
  .pgn-info { order: 3; width: 100%; text-align: center; } /* 窄屏空间不够时指示文字退到第二行居中，按钮永不断行 */
}

/* ---- 38. 移动端侧栏卡片间距（2026-09-29 用户指令）：单列堆叠时各卡片留 16px，与桌面端 gap 一致 ---- */
@media (max-width: 1099px) {
  .nw-side-in { display: flex; flex-direction: column; gap: 16px; }
}

/* ---- 39. 案例页底部转化换首页 cta-band 同款（2026-09-29 用户指令）：微信号小字行 ---- */
.cta-text .cta-wx { margin-top: 6px !important; font-size: 12.5px; opacity: .65; }
.cta-text .cta-wx b { font-weight: 600; }

/* ---- 40. 详情页底部 CTA 带间距收紧（2026-09-29 用户指令）：带上方 66→28、带下方 100→76/164→76 ---- */
.detail .cta-band { margin: 28px 0 0; }
.detail { margin-bottom: 20px; }
.cs-wrap { padding-bottom: 0; }
.nw-wrap { padding-bottom: 0; }

/* ---- 41. 首页服务网格：全宽电话直拨卡（2026-09-29 用户指令） ---- */
.svc-tel { grid-column: 1 / -1; }
.svc-tel a {
  display: flex; align-items: center; justify-content: space-between; gap: 14px 22px; flex-wrap: wrap;
  padding: 22px 28px;
  background: linear-gradient(135deg, #eef4ff 0%, #e0ecfe 100%);
  border: 1px solid #dbe7fb; border-radius: var(--radius);
  transition: transform .18s, box-shadow .18s;
}
.svc-tel a:hover { box-shadow: 0 10px 26px rgba(37, 99, 235, .16); }
.svc-tel-txt h3 { margin: 0 0 4px; font-size: 18px; color: var(--ink); }
.svc-tel-txt p { margin: 0; font-size: 13.8px; color: var(--muted); }
.svc-tel-num {
  display: inline-block; padding: 11px 28px; background: var(--pri); color: #fff;
  border-radius: 999px; font-weight: 700; font-size: 15.5px; white-space: nowrap;
  box-shadow: 0 6px 16px rgba(37, 99, 235, .25);
}
@media (max-width: 719px) {
  .svc-tel a { flex-direction: column; align-items: flex-start; }
}

/* ---- 42. 首页本地 band 整合电话直拨（2026-09-29 用户指令）：左文右钮 CTA，服务网格电话卡已删 ---- */
.hm-local { display: flex; align-items: center; justify-content: space-between; gap: 26px 48px; }
.hm-local-text { flex: 1 1 auto; min-width: 0; }
.hm-local-cta {
  flex: 0 0 auto; display: flex; flex-direction: column; align-items: stretch;
  gap: 12px; min-width: 285px;
}
/* 两钮样式统一：同宽 / 同圆角 / 同字号同高，只区分实心与描边 */
.hm-local-case, .hm-local-tel {
  display: flex; align-items: center; justify-content: center;
  padding: 12px 26px; border-radius: 12px;
  font-weight: 700; font-size: 15px; text-align: center; white-space: nowrap;
  text-decoration: none; box-sizing: border-box;
  transition: transform .18s, box-shadow .18s, background .18s, border-color .18s;
}
.hm-local-case { background: #fff; color: var(--pri); border: 1px solid #b9d2f8; }
.hm-local-case:hover { border-color: var(--pri); color: var(--pri-d); }
.hm-local-tel { background: var(--pri); color: #fff; box-shadow: 0 6px 16px rgba(37, 99, 235, .25); }
.hm-local-tel:hover { background: var(--pri-d); color: #fff; }
.hm-local-cta .hm-local-note { margin: 4px 0 0; font-size: 12.5px; line-height: 1.7; color: var(--muted); text-align: center; }
@media (max-width: 899px) {
  .hm-local { flex-direction: column; align-items: stretch; }
  .hm-local-cta { min-width: 0; width: 100%; }
}

/* 29. 文章卡悬停闪烁修复（2026-09-29 夜·用户反馈"悬停有时不停闪"）：
   整卡 translateY 上浮会让停在卡片下边缘的鼠标反复进出 hover 区，形成悬停循环闪烁；
   改为只加深阴影与边框，不再位移，杜绝循环。 */
.news-cards li:hover { transform: none; }

/* ============================================================
   2026-09-29 卡片标签组：首页/封面页/列表页卡片调用 3 个标签
   ============================================================ */
.news-tags { display: flex; flex-wrap: wrap; gap: 6px; min-width: 0; }
.ar-card-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.cse-pf-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.cse-pf-tags i { font-style: normal; font-size: 12px; font-weight: 700; color: var(--pri); background: #eef4ff; border-radius: 999px; padding: 2px 10px; }
.news-foot { flex-wrap: wrap; }
.news-foot time { white-space: nowrap; margin-left: auto; }

/* ============================================================
   2026-09-29 封面图 hover 放大优化（用户反馈「太生硬」）：
   文章列表卡原 .35s ease / 案例卡原 .45s ease，又快又急像「跳一下」。
   统一对齐首页 news-media 的丝滑缓动曲线，幅度收敛到 1.03，加亮度微调。
   ============================================================ */
.ar-card-media img, .cse-pf-media img {
  transition: transform 1.1s cubic-bezier(.16, .72, .28, 1), filter .6s ease;
  will-change: transform;
  backface-visibility: hidden;
}
.ar-card:hover .ar-card-media img { transform: scale(1.03); filter: brightness(1.03); }
.cse-pf a:hover .cse-pf-media img { transform: scale(1.03); filter: brightness(1.03); }

/* 2026-09-29 用户指令：案例卡标签和时间排在一行（标签左、时间右），标题独立一行 */
.cse-pf-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 10px; margin-top: auto; padding-top: 4px; }
.cse-pf-foot .cse-pf-tags { min-width: 0; }
.cse-pf-foot time { white-space: nowrap; flex-shrink: 0; margin-left: auto; font-size: 12.5px; color: #94a3b8; font-variant-numeric: tabular-nums; }
/* 2026-09-29 用户指令：移动端时间放在左侧 */
@media (max-width: 720px) {
  .cse-pf-foot { justify-content: flex-start; }
  .cse-pf-foot time { margin-left: 0; }
}

/* ============================================================
   2026-09-29 用户指令：标签和时间的颜色设计为浅色
   标签 pill：深蓝字 → 浅蓝字，底色更浅；时间：灰/蓝 → 浅灰
   覆盖三处卡片：news-cards（首页/封面文章卡）、ar-card（列表）、cse-pf（案例卡）
   ============================================================ */
.news-cards .news-ind, .cse-pf-tags i { color: #9db9f0; background: #f3f7fe; }
.news-cards .news-foot time, .ar-card-meta time, .cse-pf-foot time { color: #b3bfd0; }

/* 2026-09-29 用户指令：案例图片上的数字和栏目名称放到图片底部 */
.cse-pf-no { top: auto; bottom: 14px; }
.cse-pf-badge { top: auto; bottom: 14px; }

/* 2026-09-29 用户指令：标签 pill 用浅色边框 */
.news-cards .news-ind, .cse-pf-tags i { border: 1px solid #dbe7fb; }

/* 2026-09-29 用户指令：标签字体颜色和时间一致（浅灰） */
.news-cards .news-ind, .cse-pf-tags i { color: #b3bfd0; }

/* 2026-09-29 目录插件改注入右侧栏最上方：H3 二级项缩进（服务端结构用 a.sub，区别于旧 li.sub） */
.side-toc .toc-l a.sub { margin-left: 14px; font-size: 13px; }
.content .toc-l a.sub { margin-left: 14px; font-size: 13px; }

/* ============================================================
   2026-09-30 案例族重设计（封面 / 列表 / 详情 三套模板共用一套设计语言）
   前缀 cx-：与旧案例样式 cse-*（旧封面）/ cw-*（旧列表）零冲突，整段可回滚。
   原则「证据感优先」：实拍图主导 + 数据/徽章强化 + 装饰克制（细边框 / 留白 / 分割线）。
   理由：B2B 老板先确认「你真做过」，再看好不好看 —— 花哨渐变反而削弱「真实项目」的可信度。
   hero 不另造一套，复用全站变量约定：--ld-hero-img（封面 + 列表）、--cs-hero-img（详情）。
   ============================================================ */

/* ---------- 1. 共用小件 ---------- */
.cx-eyebrow { margin: 0 0 10px; font-size: 12px; font-weight: 700; letter-spacing: .14em; color: var(--pri); }
.cx-eyebrow-dim { color: #94a3b8; }
.cx-sec-head { margin: 0 0 20px; max-width: 800px; }
.cx-sec-h2 { margin: 0 0 8px; font-size: clamp(20px, 2.1vw, 26px); line-height: 1.32; font-weight: 800; color: var(--ink); letter-spacing: -.01em; }
.cx-sec-sub { margin: 0; font-size: 14px; line-height: 1.8; color: var(--muted); }
.cx-band { padding: 46px 0; }
.cx-band + .cx-band { border-top: 1px solid #eef2f7; }
.cx-empty { margin: 0; padding: 30px; border: 1px dashed var(--line); border-radius: var(--radius); background: var(--soft); color: var(--muted); text-align: center; font-size: 14px; }

/* 效果数据位：仅当案例后台填了「效果数据」字段才渲染 —— 不留空壳、不编数字 */
.cx-metrics { display: flex; flex-wrap: wrap; gap: 9px; margin: 0; padding: 0; list-style: none; }
.cx-metric { display: inline-flex; align-items: baseline; gap: 6px; padding: 7px 13px; border: 1px solid #dbe7fb; border-radius: 10px; background: #f6faff; }
.cx-metric b { font-size: 17px; font-weight: 800; color: var(--pri-d); letter-spacing: -.02em; line-height: 1; }
.cx-metric i { font-style: normal; font-size: 12.5px; color: var(--muted); }

/* 标签胶囊 */
.cx-chips { display: flex; flex-wrap: wrap; gap: 7px; margin: 0; padding: 0; list-style: none; }
.cx-chip { padding: 4px 10px; border: 1px solid var(--line); border-radius: 999px; background: #fff; font-size: 12px; color: #94a3b8; white-space: nowrap; }

/* ---------- 2. 证据卡（封面页 / 列表页共用同一张卡） ---------- */
.cx-wall { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin: 0; padding: 0; list-style: none; }
.cx-cell { display: flex; }
.cx-card {
  display: flex; flex-direction: column; width: 100%; overflow: hidden;
  border: 1px solid var(--line); border-radius: var(--radius); background: #fff;
  transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease;
}
.cx-cell:hover .cx-card { transform: translateY(-4px); border-color: #cfe0fb; box-shadow: var(--shadow); }
.cx-card-media { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; background: #eef2f7; }
.cx-card-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.cx-cell:hover .cx-card-media img { transform: scale(1.045); }
.cx-card-no, .cx-card-kind {
  position: absolute; bottom: 12px; z-index: 2; padding: 3px 10px; border-radius: 8px; font-size: 12px;
}
.cx-card-no { left: 12px; color: #fff; background: rgba(15, 23, 42, .55); font-weight: 700; letter-spacing: .04em; }
.cx-card-kind { right: 12px; color: #fff; background: rgba(37, 99, 235, .84); font-weight: 600; }
.cx-card-body { display: flex; flex-direction: column; gap: 9px; padding: 16px 17px 18px; }
.cx-card-ind { font-size: 12.5px; font-weight: 700; color: var(--pri); }
.cx-card-t { margin: 0; font-size: 16.5px; line-height: 1.5; font-weight: 700; color: var(--ink); transition: color .2s; }
.cx-cell:hover .cx-card-t { color: var(--pri-d); }
.cx-card-p { margin: 0; font-size: 13.6px; line-height: 1.8; color: var(--muted); }
.cx-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 2px; }
.cx-card-go { font-size: 13px; font-weight: 600; color: var(--pri); white-space: nowrap; }
.cx-card-foot time { font-size: 12.5px; color: #b3bfd0; }

/* 首条通栏：横向大图，证据感最强（列表页第 1 条 / 封面页精选首条） */
.cx-cell-lead { grid-column: 1 / -1; }
.cx-card-lead { flex-direction: row; }
.cx-card-lead .cx-card-media { flex: 0 0 58%; aspect-ratio: auto; min-height: 310px; }
.cx-card-lead .cx-card-body { flex: 1; justify-content: center; gap: 12px; padding: 26px 30px; }
.cx-card-lead .cx-card-t { font-size: clamp(19px, 2vw, 24px); }
.cx-card-lead .cx-card-p { font-size: 14.2px; }

/* ---------- 3. 列表页（案例库） ---------- */
.cx-lib-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 14px; }
.cx-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin: 0 0 26px; padding: 0; list-style: none; }
.cx-filter-lb { font-size: 13px; color: var(--muted); margin-right: 3px; }
.cx-filter a { padding: 7px 15px; border: 1px solid var(--line); border-radius: 999px; background: #fff; font-size: 13.5px; color: var(--text); transition: border-color .2s, color .2s, background .2s; }
.cx-filter a:hover { border-color: var(--pri); color: var(--pri); }
.cx-filter a.on { border-color: var(--pri); background: var(--pri); color: #fff; font-weight: 600; }
.cx-filter a sup { margin-left: 5px; font-size: 11.5px; opacity: .75; }

/* ---------- 4. 封面页（/cases 营销入口） ---------- */
/* 服务分流卡：让访客先按「我要哪种服务」对号入座，再进对应案例库 */
.cx-split { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin: 0; padding: 0; list-style: none; } /* 2026-10-01 用户指令：一行 4 卡各占 25% */
.cx-split a {
  display: flex; flex-direction: column; gap: 9px; height: 100%; padding: 24px 22px;
  border: 1px solid var(--line); border-radius: var(--radius); background: #fff;
  transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease;
}
/* 悬停态挂在不动的 li 上（li 是 grid 项、盒高固定），transform 作用在内层 a —— 避免鼠标停在卡片下边缘时
   「抬起→离开命中区→落下→又命中」的无限震荡（闪烁）。下同 .cx-cell:hover .cx-card。 */
.cx-split li:hover a { transform: translateY(-4px); border-color: #cfe0fb; box-shadow: var(--shadow); }
.cx-split-n { display: inline-flex; align-items: baseline; gap: 6px; }
.cx-split-n b { font-size: 30px; font-weight: 800; color: var(--ink); letter-spacing: -.03em; line-height: 1; }
.cx-split-n i { font-style: normal; font-size: 13px; color: var(--muted); }
.cx-split-t { margin: 0; font-size: 17px; font-weight: 700; color: var(--ink); }
.cx-split-p { margin: 0; flex: 1; font-size: 13.6px; line-height: 1.8; color: var(--muted); }
.cx-split-go { font-size: 13px; font-weight: 600; color: var(--pri); }

/* ---------- 5. 详情页（案例复盘） ---------- */
/* hero 内的一句话结论（摘要首句）：让访客 3 秒判断「这篇跟我像不像」 */
.detail-case .cs-gist { max-width: 660px; margin: 0 0 4px; font-size: 15.5px; line-height: 1.8; color: #334155; }

/* hero 内的效果数据条：压在图区下方、与画像同行域，spec 有值才出现 */
.cx-dt-metrics { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0 0; padding: 0; list-style: none; }
.cx-dt-metrics li { display: inline-flex; align-items: baseline; gap: 7px; padding: 8px 15px; border: 1px solid rgba(37, 99, 235, .22); border-radius: 10px; background: rgba(255, 255, 255, .78); backdrop-filter: blur(4px); }
.cx-dt-metrics b { font-size: 19px; font-weight: 800; color: var(--pri-d); letter-spacing: -.02em; line-height: 1; }
.cx-dt-metrics span { font-size: 12.5px; color: var(--muted); }

/* 结论先行条：正文之前先给「一句话结论」，AI 搜索与老板都只看这一段 */
.cx-verdict { display: flex; gap: 12px; margin: 0 0 22px; padding: 16px 18px; border: 1px solid #dbe7fb; border-left: 3px solid var(--pri); border-radius: 10px; background: #f8fbff; }
.cx-verdict-t { flex: 0 0 auto; font-size: 12.5px; font-weight: 700; color: var(--pri); letter-spacing: .04em; padding-top: 2px; }
.cx-verdict p { margin: 0; font-size: 14.4px; line-height: 1.85; color: var(--text); }

/* 相关案例小列表（详情页右下） */.cx-rel { display: flex; flex-direction: column; gap: 12px; margin: 0; padding: 0; list-style: none; }
.cx-rel a { display: flex; gap: 11px; align-items: flex-start; }
.cx-rel img { flex: 0 0 72px; width: 72px; height: 54px; object-fit: cover; border-radius: 8px; background: var(--soft); }
.cx-rel-t { font-size: 13.4px; line-height: 1.6; color: var(--ink); font-weight: 600; }
.cx-rel a:hover .cx-rel-t { color: var(--pri); }
.cx-rel em { display: block; margin-top: 4px; font-style: normal; font-size: 12px; color: #b3bfd0; }

/* ---------- 6. 响应式 ---------- */
@media (max-width: 1080px) {
  .cx-wall { grid-template-columns: repeat(2, 1fr); gap: 20px; }
  .cx-split { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 860px) {
  .cx-band { padding: 36px 0; }
  .cx-card-lead { flex-direction: column; }
  .cx-card-lead .cx-card-media { flex: none; width: 100%; aspect-ratio: 16 / 10; min-height: 0; }
  .cx-card-lead .cx-card-body { padding: 20px 20px 22px; }
}
@media (max-width: 640px) {
  .cx-wall { grid-template-columns: 1fr; gap: 18px; }
  .cx-split { grid-template-columns: 1fr; }
  .cx-card-t { font-size: 16px; }
  .cx-filter a { padding: 6px 12px; font-size: 13px; }
  .cx-split-n b { font-size: 26px; }
  .cx-rel img { flex-basis: 64px; width: 64px; height: 48px; }
}

/* ============================================================
   §55 文章封面页 / 列表页 精修层（2026-09-30）
   作用域：.ld-page（栏目营销落地页＝文章封面页） + .acl-page（文章列表页）
   原则：纯增量覆盖，不改旧规则；删除本段即可整段回滚。
   四优先级：视觉风格焕新 / 信息层级·可读性 / 移动端体验 / 转化效率（CTA）
   ============================================================ */

/* ---- 1. Hero 视觉焕新 + 内容聚焦 ---- */
.ld-page .ld-hero h1,
.acl-page .acl-hero .acl-title { max-width: 20em; }
.ld-page .ld-hero .e-desc,
.acl-page .acl-hero .acl-lead { max-width: 42em; }
/* Hero CTA 突出（转化） */
.ld-page .e-hero-cta .btn-pri,
.acl-page .e-hero-cta .btn-pri { box-shadow: 0 10px 24px rgba(37, 99, 235, .28); }
.ld-page .e-hero-cta .btn-pri:hover,
.acl-page .e-hero-cta .btn-pri:hover { box-shadow: 0 14px 30px rgba(37, 99, 235, .34); }
/* 二级栏目 / 兄弟栏目 导航药丸：更大可点、更强悬停（转化） */
.ld-page .ld-kid-btns a {
  padding: 12px 24px; border-radius: 12px;
  box-shadow: 0 4px 14px rgba(37, 99, 235, .06);
}
.ld-page .ld-kid-btns a:hover { box-shadow: 0 10px 24px rgba(37, 99, 235, .14); }
.acl-page .acl-pill { border-radius: 12px; }
.acl-page .acl-pill:hover { box-shadow: 0 8px 18px rgba(37, 99, 235, .12); }
.acl-page .acl-pill.on { box-shadow: 0 8px 20px rgba(37, 99, 235, .30); }

/* ---- 2. 区块标题 eyebrow 徽章化（视觉焕新） + 副标题限宽 ----
   2026-10-01 用户指令：英文眉标必须在 H2 标题上方（原 inline-block 会和 h2 同行） */
.ld-page .bk-eyebrow {
  display: table;
  margin: 0 auto 10px;
  background: var(--blue-50);
  border: 1px solid var(--blue-200);
  border-radius: 999px;
  padding: 4px 14px;
  letter-spacing: 2px;
}
.ld-page .block-head p { max-width: 46em; margin-left: auto; margin-right: auto; }

/* ---- 3. 客户路径三要点（ld-points）：序号方块 + 顶部强调线 + 悬停浮起 ---- */
.ld-page .ld-points li {
  border-top: 3px solid var(--blue-200);
  box-shadow: var(--shadow);
  padding-top: 22px;
}
.ld-page .ld-points li:hover { border-top-color: var(--pri);
  box-shadow: var(--shadow-lg); }
.ld-page .ld-no {
  width: 34px; height: 34px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 10px; padding: 0;
  font-size: 14px; letter-spacing: 0;
}
.ld-page .ld-points h3 { font-size: 17px; }
.ld-page .ld-points p { line-height: 1.9; }

/* ---- 4. 双引擎 / 引用实证 卡（悬停浮起 + 阴影，强化可点感） ---- */
.ld-page .ld-engine { box-shadow: var(--shadow); }
.ld-page .ld-engine:hover { box-shadow: var(--shadow-lg); }
.ld-page .ld-proof-card {
  box-shadow: var(--shadow);
  transition: box-shadow .22s ease, transform .22s ease, border-color .22s ease;
}
.ld-page .ld-proof-card:hover { box-shadow: var(--shadow-lg);  border-color: var(--blue-200); }

/* ---- 5. 文章列表卡（ar-card）：更挺的默认阴影、悬停上浮、正文可读 ---- */
.acl-page .ar-grid { gap: 22px; }
.acl-page .ar-card { box-shadow: 0 4px 16px rgba(15, 23, 42, .06); border-color: var(--blue-200); }
.acl-page .ar-card:hover { box-shadow: var(--shadow-lg); border-color: var(--pri); }
.acl-page .ar-card-media { aspect-ratio: 16 / 9; }
.acl-page .ar-card-title { font-size: 17px; line-height: 1.5; }
.acl-page .ar-card-desc { line-height: 1.85; color: var(--text); margin-top: 2px; }
.acl-page .ar-card-meta { border-top: 1px dashed var(--line); padding-top: 10px; margin-top: 4px; }

/* ---- 6. 封面页最新文章（news-cards 左图右文两列）：卡片化 + 悬停浮起 ---- */
.ld-page .news-cards { gap: 18px; }
.ld-page .news-cards li { box-shadow: 0 4px 16px rgba(15, 23, 42, .05); border-color: var(--blue-200); }
.ld-page .news-cards li > a { display: flex; align-items: center; gap: 16px; }
.ld-page .news-cards .news-media { border-radius: 10px; }
.ld-page .news-cards .news-body h3 { font-size: 16.5px; line-height: 1.5; }
.ld-page .news-cards .news-body p { line-height: 1.8; }
.ld-page .news-cards .news-foot { padding-top: 6px; margin-top: 6px; border-top: 1px dashed var(--line); }
.ld-page .news-cards li:hover { box-shadow: var(--shadow-lg); border-color: var(--pri); }

/* ---- 7. FAQ 手风琴（可读性：悬停浅底 + 更大圆角） ---- */
.ld-page .faq-panel details { border-radius: 16px; }
.ld-page .faq-panel summary { transition: background .16s ease; }
.ld-page .faq-panel summary:hover { background: var(--blue-50); }

/* ---- 8. 收尾 CTA 带（转化：整宽圆角 + 强阴影） ---- */
.ld-page .cta-band,
.acl-page .cta-band { border-radius: 20px; }
.ld-page .cta-btns,
.acl-page .cta-btns { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.ld-page .ld-cta-band .cta-text h2,
.acl-page .acl-cta-band .cta-text h2 { letter-spacing: .5px; }

/* ---- 9. 「查看更多」按钮（转化：更挺的描边主按钮） ---- */
.ld-page .block-more .btn-line,
.acl-page .block-more .btn-line {
  padding: 12px 34px; font-weight: 700;
  box-shadow: 0 6px 16px rgba(37, 99, 235, .12);
}
.ld-page .block-more .btn-line:hover,
.acl-page .block-more .btn-line:hover { box-shadow: 0 10px 24px rgba(37, 99, 235, .20); }

/* ---- 10. 移动端体验（375 / 480 / 820 断点） ---- */
@media (max-width: 820px) {
  .ld-page .ld-hero, .acl-page .acl-hero { padding-top: 48px; padding-bottom: 42px; }
  .ld-page .ld-points li { padding: 22px 18px; }
}
@media (max-width: 480px) {
  .ld-page .qsearch, .acl-page .qsearch { max-width: none; }
  .ld-page .ld-kid-btns { gap: 10px; }
  .ld-page .ld-kid-btns a { flex: 1 1 auto; justify-content: center; }
  .ld-page .news-cards li > a { flex-direction: column; align-items: stretch; gap: 0; }
  .ld-page .news-cards .news-media { width: 100%; aspect-ratio: 16 / 9; }
  .ld-page .news-cards .news-body { padding: 12px 14px 14px; }
}
@media (max-width: 375px) {
  .ld-page .ld-points { gap: 12px; }
  .acl-page .ar-grid { gap: 12px; }
  .acl-page .ar-card-body { padding: 14px 15px 16px; }
  .ld-page .ld-hero h1, .acl-page .acl-hero .acl-title { font-size: clamp(26px, 8vw, 32px); }
}
/* 窄屏 CTA 按钮整宽（转化） */
@media (max-width: 640px) {
  .ld-page .cta-btns, .acl-page .cta-btns { flex-direction: column; align-items: stretch; }
  .ld-page .cta-btns .btn-pri, .ld-page .cta-btns .btn-ghost,
  .acl-page .cta-btns .btn-pri, .acl-page .cta-btns .btn-ghost {
    display: block; text-align: center; margin: 0; }
}

/* ---- 7. 首页「最新实战文章」8 条（2026-09-30 用户指令「参考文章封面页 一行排2条 排4行」）----
   不再自设 4 列覆盖：直接复用全局 news-cards 两列左图右文设计（与封面栏目页完全一致），
   8 条 = 2 列 × 4 行；移动端走全局断点收单列。 */

/* ---- 8. 首页业务卡片/双引擎方案配图占位（2026-09-30 用户指令：先占位后设计）---- */
.svc-card .svc-media { display: block; margin: -22px -22px 12px; height: 132px; overflow: hidden; background: linear-gradient(135deg, #eef4ff, #e3edfd); }
.svc-card .svc-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s ease; }
.svc-card:hover .svc-media img { transform: scale(1.03); }
.ld-engine-media { display: block; margin: -26px -26px 14px; height: 150px; border-radius: 15px 15px 0 0; overflow: hidden; background: linear-gradient(135deg, #eef4ff, #e3edfd); }
.ld-engine-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 640px) {
  .svc-card .svc-media { height: 160px; }
  .ld-engine-media { height: 170px; }
}

/* ---- 9. 联系页「关于孙老师」区块（2026-09-30）---- */
/* —— 联系页·孙老师信任作者卡（2026-10-02 重新设计） —— */
.ct-author { display: flex; gap: 28px; align-items: stretch; background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 28px 30px; box-shadow: 0 1px 4px rgba(15, 23, 42, .04); }
.ct-author-photo { flex: 0 0 250px; min-height: 330px; border-radius: 14px; overflow: hidden; border: 1px solid var(--line); align-self: flex-start; }
.ct-author-photo img { width: 100%; height: 100%; min-height: 330px; object-fit: cover; object-position: center 20%; display: block; }
.ct-author-body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.ct-author-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.ct-author-head h3 { margin: 0; font-size: 21px; font-weight: 800; color: var(--ink); letter-spacing: .5px; }
.ct-author-role { margin: 5px 0 0; font-size: 13.5px; color: var(--pri); font-weight: 600; }
.ct-author-badge { flex: none; display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: 999px; background: #eef4ff; border: 1px solid #dbe7ff; color: var(--pri); font-size: 12.5px; font-weight: 600; }
.ct-author-intro { margin: 14px 0 0; font-size: 15px; line-height: 1.95; color: var(--ink); }
.ct-author-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; list-style: none; margin: 18px 0 0; padding: 0; }
.ct-author-facts li { padding: 11px 14px; background: #f8fafd; border: 1px solid var(--line); border-radius: 12px; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.ct-author-facts b { font-size: 17px; font-weight: 800; color: var(--pri); line-height: 1.2; }
.ct-author-facts span { font-size: 12px; line-height: 1.5; color: var(--muted); }
.ct-author-cta { margin: 18px 0 0; display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.ct-author-cta .btn-pri, .ct-author-cta .btn-line { display: inline-block; padding: 10px 24px; border-radius: 999px; font-size: 14px; }
@media (max-width: 860px) {
  .ct-author { flex-direction: column; padding: 20px; gap: 18px; }
  .ct-author-photo { flex-basis: auto; width: 100%; min-height: 0; max-width: 340px; }
  .ct-author-photo img { min-height: 0; aspect-ratio: 4 / 3; }
  .ct-author-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* 2026-10-01 联系页：关于孙老师全宽 + 左侧图片占位（虚线框，落真图时换成 <img> 即可） */
/* 旧 .ct-about* 规则已于 2026-10-02 由 .ct-author 组件替代（见上） */
/* 2026-10-01 联系页 FAQ：一行 2 个、去整块背景（ab-faqs-2col 仅联系页用，关于页不受影响） */
.ab-faqs-2col { max-width: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; }
.ab-faqs-2col .ab-faq { margin: 0; }
@media (max-width: 860px) { .ab-faqs-2col { grid-template-columns: 1fr; } }

/* ---- 10. 首页四大主营业务卡（2026-09-30 用户定版：百度SEO/豆包GEO/营销型网站/短视频排名获客）----
   4 卡一行（auto-fill 会拆行，这里固定 4 列）；≤1100px 收 2 列，≤640px 单列。 */
.hm-block .grid-svc { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px) { .hm-block .grid-svc { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .hm-block .grid-svc { grid-template-columns: 1fr; } }

/* ============================================================
   11. 首页「客户最想了解的6个问题」问答主轴（2026-09-30 整页聚焦改版）
   结构：问题导航(#qnav) → 6 个 QA 模块（steps/cost/time/checks/criteria/pitfalls）
   ============================================================ */
html { scroll-behavior: smooth; }
#qnav, .hm-qa { scroll-margin-top: 84px; } /* 锚点跳转避开 sticky 头部 */

/* 问题导航 */
.hm-qnav-wrap { padding: 50px 0 10px; }
.hm-qnav { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.hm-qnav a { display: block; background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 20px 22px; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.hm-qnav a:hover { box-shadow: var(--shadow); border-color: #b9cdf5; }
.hm-qnav-no { display: inline-block; font-weight: 800; color: var(--pri); font-size: 13px; letter-spacing: 1px; }
.hm-qnav-tag { display: inline-block; margin-left: 8px; font-size: 12px; color: var(--muted); background: var(--soft); border-radius: 999px; padding: 2px 10px; }
.hm-qnav-q { display: block; margin-top: 10px; font-size: 16.5px; font-weight: 700; color: var(--ink); line-height: 1.5; }
.hm-qnav-hint { text-align: center; margin: 18px 0 0; color: var(--muted); font-size: 14px; }

/* QA 模块外壳 */
.hm-qa-head { display: flex; align-items: flex-start; gap: 16px; margin-bottom: 14px; }
.hm-qa-no { flex: none; width: 46px; height: 46px; border-radius: 12px; background: linear-gradient(135deg, #3b82f6, #1d4ed8); color: #fff; font-weight: 800; font-size: 18px; display: flex; align-items: center; justify-content: center; }
.hm-qa-h { padding-top: 2px; }
.hm-qa-h h2 { margin: 0; font-size: 22px; font-size: clamp(20px, 2vw, 25px); color: var(--ink); letter-spacing: .5px; }
.hm-qa-lead { color: var(--text); font-size: 15.5px; line-height: 1.85; margin: 0 0 22px; max-width: 900px; }
.hm-qa-body { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 26px 28px; box-shadow: var(--shadow); }

/* 做法：三步时间线（竖向） */
.hm-qa-steps { list-style: none; margin: 0; padding: 0; counter-reset: hmstep; }
.hm-qa-steps li { position: relative; padding: 0 0 20px 54px; border-left: 2px solid var(--line); margin-left: 18px; }
.hm-qa-steps li:last-child { border-left-color: transparent; padding-bottom: 0; }
.hm-qa-steps li::before { content: counter(hmstep); counter-increment: hmstep; position: absolute; left: -19px; top: 0; width: 36px; height: 36px; border-radius: 50%; background: linear-gradient(135deg, #3b82f6, #1d4ed8); color: #fff; font-weight: 800; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 12px rgba(37, 99, 235, .25); }
.hm-qa-steps b { display: block; font-size: 16.5px; color: var(--ink); margin-bottom: 6px; }
.hm-qa-steps p { margin: 0; color: var(--muted); font-size: 14.5px; line-height: 1.85; }

/* 费用：三块卡片 */
.hm-qa-cost { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.hm-qa-cost li { background: var(--soft); border: 1px solid var(--line); border-radius: 14px; padding: 18px 20px; }
.hm-qa-cost b { display: block; color: var(--ink); font-size: 16px; margin-bottom: 6px; }
.hm-qa-cost p { margin: 0; color: var(--muted); font-size: 14.5px; line-height: 1.8; }

/* 周期：三阶段卡片 */
/* 时间轴网格：auto-fit 按条目数自动分列（4 条→4 列各 25%，3 条→3 列），≤860px 收单列（4987 行） */
.hm-qa-time { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.hm-qa-time li { background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--pri); border-radius: 14px; padding: 20px 20px 18px; box-shadow: var(--shadow); }
.hm-qa-time .hm-qa-stage { display: inline-block; font-weight: 800; color: #fff; background: linear-gradient(135deg, #3b82f6, #1d4ed8); border-radius: 999px; padding: 4px 14px; font-size: 13px; margin-bottom: 10px; }
.hm-qa-time b { display: block; font-size: 16px; color: var(--ink); margin-bottom: 6px; }
.hm-qa-time p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.8; }

/* 适配：双列勾选清单 */
.hm-qa-checks { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.hm-qa-checks li { display: flex; gap: 12px; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px; }
.hm-qa-tick { flex: none; width: 26px; height: 26px; border-radius: 50%; background: #dcfce7; color: #16a34a; font-weight: 800; display: flex; align-items: center; justify-content: center; font-size: 15px; }
.hm-qa-checks b { display: block; font-size: 15px; color: var(--ink); margin-bottom: 4px; }
.hm-qa-checks p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.75; }

/* 选商：编号清单 */
.hm-qa-criteria { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.hm-qa-criteria li { display: flex; gap: 14px; background: var(--soft); border: 1px solid var(--line); border-radius: 14px; padding: 16px 20px; }
.hm-qa-num { flex: none; width: 30px; height: 30px; border-radius: 9px; background: linear-gradient(135deg, #3b82f6, #1d4ed8); color: #fff; font-weight: 800; display: flex; align-items: center; justify-content: center; font-size: 14px; }
.hm-qa-criteria b { display: block; font-size: 15.5px; color: var(--ink); margin-bottom: 4px; }
.hm-qa-criteria p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.8; }

/* 避坑：警示清单 */
.hm-qa-pitfalls { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.hm-qa-pitfalls li { background: #fff5f5; border: 1px solid #fecaca; border-left: 4px solid #ef4444; border-radius: 12px; padding: 15px 18px; }
.hm-qa-pitfalls b { display: block; font-size: 15.5px; color: #b91c1c; margin-bottom: 4px; }
.hm-qa-pitfalls p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.8; }

/* 模块内延伸链接 + 透明说明 */
.hm-qa-more { margin: 20px 0 0; }
.hm-qa-more a { display: inline-block; font-weight: 700; color: var(--pri); font-size: 15px; }
.hm-qa-note { margin: 14px 0 0; padding: 12px 16px; background: #fffbeb; border: 1px solid #fde68a; border-radius: 12px; color: #92400e; font-size: 14px; line-height: 1.8; }

/* 轻量服务入口（首页底部「顺带一提」） */
.hm-svc-slim .svc-card p { -webkit-line-clamp: 2; line-clamp: 2; }

/* 移动端：网格收列 + 间距压缩 */
@media (max-width: 860px) {
  .hm-qnav, .hm-qa-time, .hm-qa-checks { grid-template-columns: 1fr; }
  .hm-qa-body { padding: 20px 18px; }
  .hm-qa-h h2 { font-size: 19px; }
  .hm-qa-steps li { margin-left: 14px; padding-left: 46px; }
}

/* ============================================================
   40. 功能页统一骨架（2026-09-30 模板全面升级）
   搜索 / 404 / 网站地图 / 聚合标签 四个功能页此前是「无 hero、无面包屑、
   无转化入口」的裸功能页。本轮统一补齐营销型骨架：
   hero 头图 → 面包屑 → 业务入口 → 转化 CTA。
   同时把散在各模板里的内联 <style> 全部外移到这里 —— 改一处全生效、
   换皮肤不跑版（内联样式是静态生成后才注入的，不利于统一维护）。
   ============================================================ */

/* 40.1 功能页 hero：左白渐变压底 + 照片居右 + 底色渐变。
   未设 --pg-hero-img 时该层为 none，只留渐变，与原先观感一致。
   ::after 关掉全局 .e-hero-page 硬编码的「关于我们」装饰图。 */
.fx-hero {
  background:
    linear-gradient(90deg, #f6f9ff 0%, rgba(250, 252, 255, .96) 42%, rgba(250, 252, 255, .62) 72%, rgba(250, 252, 255, .22) 100%),
    var(--pg-hero-img, none) center right / cover no-repeat,
    linear-gradient(180deg, #eef4ff 0%, #fafcff 100%);
}
.fx-hero::after { display: none; }

/* 40.2 搜索页：大搜索框 + 热词 + 结果卡（带栏目标签） */
.fx-sform { display: flex; gap: 12px; max-width: 720px; margin: 20px 0 0; }
.fx-sform input {
  flex: 1; min-width: 0; height: 52px; padding: 0 18px;
  border: 1.5px solid var(--line); border-radius: 14px;
  font-size: 16px; font-family: inherit; color: var(--ink); background: #fff;
}
.fx-sform input:focus { outline: none; border-color: var(--pri); box-shadow: 0 0 0 4px rgba(37, 99, 235, .10); }
.fx-sform .btn-pri { height: 52px; padding: 0 30px; border-radius: 14px; }
.fx-hot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 14px 0 0; font-size: 13.5px; color: var(--muted); }
.fx-hot a {
  padding: 5px 13px; border: 1px solid var(--line); border-radius: 999px;
  background: #fff; color: var(--ink-2); font-size: 13px; text-decoration: none;
}
.fx-hot a:hover { border-color: var(--pri); color: var(--pri); }
.fx-meta { margin: 0 0 22px; color: var(--muted); font-size: 14.5px; }
.fx-meta b { color: var(--ink); }
.fx-cat {
  display: inline-block; margin: 0 0 8px; padding: 2px 9px; border-radius: 6px;
  background: #eef4ff; color: var(--pri-d); font-size: 12px; font-weight: 600; letter-spacing: .3px;
}
.fx-card-title { display: block; font-size: 16.5px; font-weight: 700; color: var(--ink); line-height: 1.55; margin: 0 0 6px; }
a:hover .fx-card-title { color: var(--pri); }
.fx-card-desc { display: block; color: var(--muted); font-size: 14px; line-height: 1.75; margin: 0 0 10px; }
mark { background: #fff3b8; color: inherit; border-radius: 3px; padding: 0 2px; }

/* 40.3 404：业务入口卡（找不到页面时把人接住，别让他直接走掉） */
.fx-cats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 34px 0 0; }
.fx-cat-card {
  display: block; padding: 22px 20px; background: #fff;
  border: 1px solid var(--line); border-radius: 16px; text-decoration: none;
  transition: all .18s ease;
}
.fx-cat-card:hover { border-color: var(--pri); box-shadow: 0 10px 24px rgba(37, 99, 235, .10); }
.fx-cat-card b { display: block; font-size: 16px; color: var(--ink); margin: 0 0 6px; }
.fx-cat-card span { display: block; font-size: 13.5px; color: var(--muted); line-height: 1.7; }
.fx-cat-card i { display: inline-block; margin-top: 10px; font-style: normal; font-size: 13.5px; font-weight: 700; color: var(--pri); }

/* 40.4 聚合标签（原 page/tags.html 内联，2026-09-30 外移） */
.tg-h { font-size: 15px; font-weight: 700; margin: 26px 0 14px; padding-bottom: 8px; border-bottom: 2px solid var(--pri); }
.tg-h:first-child { margin-top: 0; }
.tg-cloud { display: flex; flex-wrap: wrap; gap: 8px; }
.tg-pill {
  display: inline-flex; align-items: baseline; gap: 4px; padding: 5px 13px;
  border: 1px solid var(--line); border-radius: 999px; background: #fff;
  color: var(--ink-2); font-size: 13px; text-decoration: none; transition: all .15s ease;
}
.tg-pill sup { font-size: 10.5px; color: #94a3b8; font-weight: 600; }
.tg-pill:hover { border-color: var(--pri); color: var(--pri); }
.tg-hot .tg-pill-big { padding: 7px 16px; font-size: 14px; font-weight: 600; color: var(--ink); }
.tg-hot .tg-pill-big:hover { background: var(--pri); border-color: var(--pri); color: #fff; }
.tg-hot .tg-pill-big:hover sup { color: rgba(255, 255, 255, .75); }

/* 40.5 网站地图（2026-10-01 v3 重设计：栏目瀑布流 + 计数徽章 + 独立页胶囊 + CTA 与主体同宽） */
.sm-grid { columns: 240px 4; column-gap: 32px; }
.sm-col { break-inside: avoid; margin: 0 0 30px; }
.sm-title { font-size: 15px; font-weight: 700; margin: 0 0 12px; padding-bottom: 8px; border-bottom: 2px solid var(--pri); }
.sm-title a { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: inherit; text-decoration: none; }
.sm-title a:hover { color: var(--pri); }
.sm-cnt {
  flex: none; min-width: 22px; padding: 1px 7px; border-radius: 999px;
  background: var(--blue-50, #eff6ff); color: var(--pri);
  font-size: 11.5px; font-weight: 600; text-align: center; line-height: 1.6;
}
.sm-list { list-style: none; margin: 0; padding: 0; }
.sm-list li { margin: 0; }
.sm-list a {
  position: relative; display: block; padding: 5px 0 5px 14px;
  color: var(--ink-2); font-size: 13.5px; line-height: 1.6;
  text-decoration: none; transition: color .15s;
}
.sm-list a::before {
  content: ""; position: absolute; left: 0; top: 12px;
  width: 5px; height: 5px; border-radius: 50%;
  background: #cbd5e1; transition: background .15s;
}
.sm-list a:hover { color: var(--pri); }
.sm-list a:hover::before { background: var(--pri); }
/* 组内首选链接：落地子页（如 百度SEO / 豆包GEO），加重并蓝点标识 */
.sm-list .sm-fea > a { font-weight: 600; color: var(--ink); }
.sm-list .sm-fea > a::before { top: 11px; width: 6px; height: 6px; background: var(--pri); }
/* 独立单页胶囊区 */
.sm-pages { margin-top: 36px; padding-top: 26px; border-top: 1px solid var(--line); }
.sm-sec-h { font-size: 15px; font-weight: 700; margin: 0 0 14px; color: var(--ink); }
.sm-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.sm-chip {
  display: inline-flex; align-items: center; gap: 7px; padding: 8px 18px;
  border: 1px solid var(--line); border-radius: 999px; background: #fff;
  color: var(--ink-2); font-size: 13.5px; text-decoration: none; transition: all .15s ease;
}
.sm-chip::after { content: "→"; font-size: 12px; color: #94a3b8; transition: transform .15s, color .15s; }
.sm-chip:hover { border-color: var(--pri); color: var(--pri); }
.sm-chip:hover::after { color: var(--pri); transform: translateX(2px); }
/* CTA 与主体（.e-page-card）同宽：.detail.page 不吃 3.1 节的目录栏限宽（calc(100%-376px)） */
@media (min-width: 1100px) {
  .detail.page > .cta-band { max-width: 100% !important; }
}

/* 40.6 移动端：搜索框竖排、入口卡收列、地图单列 */
@media (max-width: 860px) {
  .fx-hero {
    background:
      linear-gradient(90deg, rgba(250, 252, 255, .96), rgba(250, 252, 255, .88)),
      var(--pg-hero-img, none) center / cover no-repeat,
      linear-gradient(180deg, #eef4ff 0%, #fafcff 100%); }
  .fx-sform { flex-direction: column; }
  .fx-sform .btn-pri { width: 100%; }
  .fx-cats { grid-template-columns: repeat(2, 1fr); }
  .sm-grid { columns: 1; }
}
@media (max-width: 520px) {
  .fx-cats { grid-template-columns: 1fr; }
}

/* ============================================================
   41. 关掉 hero 右侧装饰小图 + 单页 hero 支持背景大图（2026-10-01）

   一、右侧小图：第 30/31/33/34/35 节给 .e-hero / .e-hero-page 的
   ::before（玻璃底框）与 ::after（hero-visual.webp、hero-about.webp
   等插画）叠了一张 280~380px 的右侧装饰图。用户反馈观感廉价、
   和正文抢视觉，全站关掉。
   注意排除 .e-hero-case：案例详情页的 ::after 是深色渐变遮罩，
   关掉会让白字压在亮图上读不清（同理 .cw-hero 的遮罩不动）。

   二、背景大图：给 .e-hero-page 补 --pg-hero-img 三层背景
   （左白渐变压底 + 照片居右 + 底色渐变），与 .fx-hero 同款，
   一级聚合页 / 二级业务页挂各自真实业务大图，未设变量时只留渐变。
   ============================================================ */
.e-hero:not(.e-hero-case)::before,
.e-hero:not(.e-hero-case)::after,
.e-hero-page::before,
.e-hero-page::after { content: none !important; display: none !important; }

.e-hero-page {
  background:
    linear-gradient(90deg, #f6f9ff 0%, rgba(250, 252, 255, .96) 42%, rgba(250, 252, 255, .62) 72%, rgba(250, 252, 255, .22) 100%),
    var(--pg-hero-img, none) center right / cover no-repeat,
    linear-gradient(180deg, #eef4ff 0%, #fafcff 100%);
}
@media (max-width: 860px) {
  .e-hero-page {
    background:
      linear-gradient(90deg, rgba(250, 252, 255, .96), rgba(250, 252, 255, .88)),
      var(--pg-hero-img, none) center / cover no-repeat,
      linear-gradient(180deg, #eef4ff 0%, #fafcff 100%); }
}

/* ============================================================
   42. SEO优化栏目 · 营销型聚合页专属（2026-10-01）
   本栏目单独一套模板（template/default/page/seo.html），不复用通用聚合页。
   新增三类区块，其余（步骤/双引擎/要点/案例/FAQ/CTA）复用全站既有类：
   .sg-pains 痛点卡 → .sg-kids 业务大卡 → .sg-cmp 决策对比表。
   ============================================================ */

/* 42.1 痛点卡：老板对号入座，比上来就讲概念有效 */
.sg-pains { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin: 0; padding: 0; list-style: none; }
.sg-pain {
  padding: 26px 24px 24px; background: #fff;
  border: 1px solid var(--line); border-radius: 16px;
  box-shadow: 0 2px 10px rgba(15, 23, 42, .04);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.sg-pain:hover { border-color: var(--pri); box-shadow: 0 12px 26px rgba(37, 99, 235, .10); }
.sg-pain-no {
  display: block; margin: 0 0 12px; font-size: 13px; font-weight: 700;
  letter-spacing: 1.5px; color: var(--pri); font-variant-numeric: tabular-nums;
}
.sg-pain h3 { margin: 0 0 10px; font-size: 17px; font-weight: 700; line-height: 1.5; color: var(--ink); }
.sg-pain p { margin: 0; font-size: 14px; line-height: 1.85; color: var(--muted); }

/* 42.2 业务大卡：左图右文，带两个要点 chip 与入口 */
.sg-kids { display: grid; grid-template-columns: repeat(auto-fit, minmax(330px, 1fr)); gap: 22px; margin: 0; padding: 0; list-style: none; }
.sg-kid {
  background: #fff; border: 1px solid var(--line); border-radius: 18px; overflow: hidden;
  box-shadow: 0 2px 12px rgba(15, 23, 42, .05);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.sg-kid:hover { border-color: var(--pri); box-shadow: 0 14px 30px rgba(37, 99, 235, .12); }
.sg-kid > a { display: block; text-decoration: none; }
.sg-kid-media { display: block; height: 190px; overflow: hidden; background: linear-gradient(180deg, #eef4ff, #f8fbff); }
.sg-kid-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease; }
.sg-kid:hover .sg-kid-media img { transform: scale(1.04); }
.sg-kid-body { display: block; padding: 22px 24px 24px; }
.sg-kid-t { display: block; font-size: 18px; font-weight: 700; color: var(--ink); margin: 0 0 8px; }
a:hover .sg-kid-t { color: var(--pri); }
.sg-kid-p { display: block; font-size: 14px; line-height: 1.85; color: var(--muted); margin: 0 0 14px; }
.sg-kid-pts { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }
.sg-kid-pts i {
  font-style: normal; font-size: 12.5px; color: var(--pri-d);
  background: #eef4ff; border-radius: 999px; padding: 4px 11px;
}
.sg-kid-more { display: inline-block; font-size: 14px; font-weight: 700; color: var(--pri); }

/* 42.3 决策对比表：SEO 列高亮，帮老板判断钱往哪边花 */
.sg-cmp { overflow-x: auto; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: 0 2px 12px rgba(15, 23, 42, .05); margin-bottom: 36px; }
.sg-cmp table { width: 100%; border-collapse: collapse; min-width: 640px; }
.sg-cmp th, .sg-cmp td { padding: 15px 20px; text-align: left; font-size: 14.5px; line-height: 1.75; border-bottom: 1px solid var(--line); }
.sg-cmp thead th { font-size: 14px; font-weight: 700; color: var(--ink); background: #f8fafc; }
.sg-cmp thead .sg-cmp-hi { background: var(--pri); color: #fff; }
.sg-cmp tbody tr:last-child th, .sg-cmp tbody tr:last-child td { border-bottom: none; }
.sg-cmp tbody tr:hover { background: #fbfdff; }
.sg-cmp .sg-cmp-k { width: 20%; font-weight: 600; color: var(--ink); background: #fcfdff; }
.sg-cmp tbody .sg-cmp-hi { background: rgba(37, 99, 235, .05); color: var(--text); }
.sg-cmp-note {
  margin: 16px 0 24px; padding: 14px 18px; font-size: 14px; line-height: 1.85; color: var(--muted);
  background: #f8fafc; border-left: 3px solid var(--pri); border-radius: 0 12px 12px 0;
}

/* 42.4 相关文章：每个二级栏目一个独立区块（H2 用全站 block-head 样式），
   组内沿用全站 news-cards 左图右文卡；末尾「看全部」收口按钮居中 */
.sg-news { margin: 0; }
.sg-news-all { margin: 6px 0 0; text-align: center; }

/* 42.5 我们怎么做：四步横排卡（2026-10-01 用户指令「横排」），数字圆点沿用全站蓝渐变风格 */
.sg-steps {
  list-style: none; margin: 0; padding: 0; counter-reset: sgstep;
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px;
}
.sg-steps li {
  counter-increment: sgstep; position: relative;
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  padding: 74px 20px 20px; box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
  transition: transform .2s ease, box-shadow .2s ease;
}
.sg-steps li:hover { box-shadow: var(--shadow); }
.sg-steps li::before {
  content: counter(sgstep); position: absolute; top: 20px; left: 20px;
  width: 36px; height: 36px; border-radius: 50%;
  background: linear-gradient(135deg, #3b82f6, #1d4ed8); color: #fff; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 12px rgba(37, 99, 235, .25);
}
.sg-steps b { display: block; font-size: 16px; color: var(--ink); margin: 0 0 8px; line-height: 1.55; }
.sg-steps p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.8; }

/* 42.6 平板：4 列太挤，先压成 2×2 */
@media (max-width: 1100px) {
  .sg-pains { grid-template-columns: repeat(2, 1fr); }
}

/* 42.7 移动端：痛点单列、大卡单列、对比表转卡片 */
@media (max-width: 860px) {
  .sg-pains { grid-template-columns: 1fr; gap: 14px; }
  .sg-pain { padding: 22px 20px; }
  .sg-steps { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .sg-steps li { padding: 64px 18px 18px; }
}
@media (max-width: 760px) {
  .sg-kids { grid-template-columns: 1fr; gap: 16px; }
  .sg-kid-media { height: 170px; }
  .sg-steps { grid-template-columns: 1fr; }

  /* 42.7 对比表（.sg-cmp）移动端卡片化：一行 = 一张卡。
     表头（thead）收起；首列「比什么」变成卡片顶部标题条；
     两个值列改为「列名小标签 + 内容」，列名来自模板 <td data-label>。
     本节覆盖 42.3 的 min-width:640px 横滚方案（手机上不用再左右拖）。 */
  .sg-cmp { overflow-x: visible; border: 0; background: transparent; border-radius: 0; box-shadow: none; }
  .sg-cmp table { display: block; width: 100%; min-width: 0; }
  .sg-cmp thead { display: none; }
  .sg-cmp tbody { display: block; }
  .sg-cmp tbody tr {
    display: block; margin: 0 0 14px; padding: 0;
    background: #fff; border: 1px solid var(--line); border-radius: 14px;
    box-shadow: 0 2px 10px rgba(15, 23, 42, .05); overflow: hidden;
  }
  .sg-cmp tbody tr:last-child { margin-bottom: 0; }
  .sg-cmp tbody tr:hover { background: #fff; }
  .sg-cmp tbody th, .sg-cmp tbody td {
    display: block; width: auto; padding: 0; border-bottom: 0; text-align: left;
  }
  /* 注意：42.3 里 .sg-cmp .sg-cmp-k{width:20%}（0,2,0）特异性高于
     本节的 .sg-cmp tbody th（0,1,1），不显式写 width 会被压成 20%
     → 移动端标题条只占卡片一角（实测 71/358px）。必须在此写 width:100%。 */
  .sg-cmp tbody th.sg-cmp-k {
    display: block; width: 100%; padding: 13px 16px;
    font-size: 15px; font-weight: 700; color: var(--ink);
    background: #f8fafc; border-bottom: 1px solid var(--line);
  }
  .sg-cmp tbody td { padding: 12px 16px; font-size: 14px; line-height: 1.75; }
  .sg-cmp tbody td + td { border-top: 1px dashed var(--line); }
  .sg-cmp tbody td::before {
    content: attr(data-label); display: block; margin: 0 0 4px;
    font-size: 12px; font-weight: 700; letter-spacing: .02em; color: var(--muted);
  }
  .sg-cmp tbody td.sg-cmp-hi { background: rgba(37, 99, 235, .06); }
  .sg-cmp tbody td.sg-cmp-hi::before { color: var(--pri); }
  .sg-cmp-note { margin-top: 14px; }
}

/* 42.8 老板最想知道的 6 问：标题 + 内容融合在一张卡片内（3×2 网格） */
.gc-qcards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin: 0;
  padding: 0;
}
.gc-qcard {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 24px;
  box-shadow: 0 2px 12px rgba(15, 23, 42, .05);
  display: flex;
  flex-direction: column;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.gc-qcard:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow);
  border-color: #b9cdf5;
}
.gc-qcard-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
}
.gc-qcard-no {
  flex: none;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: linear-gradient(135deg, #3b82f6, #1d4ed8);
  color: #fff;
  font-weight: 800;
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.gc-qcard-tag {
  font-size: 12px;
  color: var(--muted);
  background: var(--soft);
  border-radius: 999px;
  padding: 3px 11px;
}
.gc-qcard-q {
  margin: 0 0 10px;
  font-size: 18px;
  font-weight: 700;
  color: var(--ink);
  line-height: 1.45;
}
.gc-qcard-lead {
  margin: 0 0 16px;
  font-size: 14px;
  color: var(--text);
  line-height: 1.7;
}
.gc-qcard-body {
  flex: 1;
}
.gc-qcard-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}
.gc-qcard-list li {
  background: #f8fafc;
  border-radius: 12px;
  padding: 12px 14px;
}
.gc-qcard-list b {
  display: block;
  font-size: 14px;
  color: var(--ink);
  margin-bottom: 4px;
  line-height: 1.45;
}
.gc-qcard-list p {
  margin: 0;
  font-size: 13px;
  color: var(--muted);
  line-height: 1.7;
}
.gc-qcard-note {
  margin: 14px 0 0;
  font-size: 13px;
  color: var(--muted);
  line-height: 1.7;
  padding: 12px 14px;
  background: #eff6ff;
  border-left: 3px solid var(--pri);
  border-radius: 0 12px 12px 0;
}
@media (max-width: 1100px) {
  .gc-qcards { grid-template-columns: repeat(2, 1fr); gap: 18px; }
}
@media (max-width: 640px) {
  .gc-qcards { grid-template-columns: 1fr; gap: 16px; }
  .gc-qcard { padding: 20px; }
  .gc-qcard-q { font-size: 17px; }
}

/* ============================================================
   43. 百度SEO优化 · 营销页专属（2026-10-01）
   本栏目单独一套模板（template/default/page/seo-baidu.html）。
   只新增三类本页独有的区块，其余全部复用全站既有类：
   痛点 .sg-pains / 步骤 .sg-steps / 对比表 .sg-cmp / 要点 .ld-points
   / 文章卡 .news-cards / 案例 .cx-wall / FAQ .faq-panel / 转化 .detail-cta。
   ============================================================ */

/* 43.1 百度结果页示意：让老板一眼看懂自己买的是哪个位置 */
.bd-serp {
  max-width: 720px; margin: 0; padding: 18px;
  background: #fff; border: 1px solid var(--line); border-radius: 16px;
  box-shadow: 0 2px 12px rgba(15, 23, 42, .05);
}
.bd-serp-bar { display: flex; gap: 0; margin: 0 0 16px; }
.bd-serp-box {
  flex: 1; min-width: 0; height: 44px; padding: 0 16px;
  display: flex; align-items: center;
  border: 1.5px solid var(--pri); border-right: none;
  border-radius: 10px 0 0 10px;
  font-size: 15px; color: var(--ink-2); background: #fff;
}
.bd-serp-btn {
  flex: 0 0 auto; padding: 0 22px; height: 44px;
  display: flex; align-items: center; justify-content: center;
  background: var(--pri); color: #fff; font-size: 15px; font-weight: 600;
  border-radius: 0 10px 10px 0;
}
.bd-serp-list { list-style: none; margin: 0; padding: 0; }
.bd-serp-row {
  display: flex; gap: 14px; align-items: flex-start;
  padding: 14px 0; border-top: 1px dashed var(--line);
}
.bd-serp-row:first-child { border-top: none; padding-top: 0; }
.bd-serp-tag {
  flex: 0 0 auto; margin-top: 2px; padding: 2px 9px; border-radius: 6px;
  font-size: 12px; font-weight: 700; line-height: 1.7; letter-spacing: .5px;
}
.bd-serp-tag-ad { background: #fff4e5; color: #b45309; }
.bd-serp-tag-organic { background: var(--pri); color: #fff; }
.bd-serp-tag-own { background: #eef4ff; color: var(--pri-d); }
.bd-serp-body { display: block; min-width: 0; }
.bd-serp-body b { display: block; font-size: 15.5px; font-weight: 700; color: var(--ink); line-height: 1.6; margin: 0 0 4px; }
.bd-serp-body span { display: block; font-size: 14px; line-height: 1.85; color: var(--muted); }

/* 43.0 百度结果页「三种位置」区块：加背景图，整块与正文等宽（不出出血，区别于 hero 全幅） */
.bd-serp-section {
  position: relative;
  overflow: hidden;
  border-radius: 20px;
  padding: 40px 36px 34px;
  background-image: linear-gradient(180deg, rgba(255,255,255,.78) 0%, rgba(255,255,255,.82) 100%), url('/images/bg-serp-baidu.webp');
  background-size: cover;
  background-position: center right;
  background-repeat: no-repeat;
  border: 1px solid #e3ebfa;
  box-shadow: 0 10px 30px rgba(37,99,235,.07);
}
.bd-serp-section > .block-head,
.bd-serp-section > .bd-serp,
.bd-serp-section > .bd-note { position: relative; z-index: 1; }
.bd-serp-section .bd-serp {
  max-width: none;          /* 不再限 720px 窄卡，整块与正文同宽 */
  margin: 4px 0 0;
  background: rgba(255,255,255,.9);
  border: 1px solid #e3ebfa;
  border-radius: 14px;
  padding: 22px 24px;
  box-shadow: 0 4px 18px rgba(15,23,42,.05);
}
.bd-serp-section .bd-note { margin-top: 16px; }
@media (max-width: 768px) {
  .bd-serp-section { padding: 28px 20px 24px; border-radius: 16px; }
  .bd-serp-section .bd-serp { padding: 18px 16px; }
}

/* 43.2 三类关键词卡：先立靶子，后面的动作才有依据 */
.bd-kw {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px;
}
.bd-kw li {
  position: relative; padding: 26px 22px 22px;
  background: #fff; border: 1px solid var(--line); border-radius: 16px;
  box-shadow: 0 2px 10px rgba(15, 23, 42, .04);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.bd-kw li:hover { border-color: var(--pri); box-shadow: 0 12px 26px rgba(37, 99, 235, .10); }
.bd-kw-no {
  display: block; margin: 0 0 10px; font-size: 13px; font-weight: 700;
  letter-spacing: 1.5px; color: var(--pri); font-variant-numeric: tabular-nums;
}
.bd-kw b { display: block; font-size: 17px; font-weight: 700; color: var(--ink); margin: 0 0 8px; line-height: 1.5; }
.bd-kw p { margin: 0 0 14px; font-size: 14px; line-height: 1.85; color: var(--muted); }
.bd-kw-tip {
  display: inline-block; padding: 4px 11px; border-radius: 999px;
  background: rgba(37, 99, 235, .08); color: var(--pri-d);
  font-size: 12.5px; font-weight: 600;
}

/* 43.3 自查清单：两列勾选条，老板自己就能过一遍 */
.bd-check {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px 18px;
}
.bd-check li {
  display: grid; grid-template-columns: 22px 1fr; gap: 4px 12px;
  padding: 18px 20px; background: #fff;
  border: 1px solid var(--line); border-radius: 14px;
}
.bd-check-ic {
  grid-row: span 2; width: 22px; height: 22px; border-radius: 50%;
  background: var(--pri); color: #fff; font-size: 12px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}
.bd-check b { font-size: 15px; font-weight: 700; color: var(--ink); line-height: 1.6; }
.bd-check p { margin: 0; font-size: 13.5px; line-height: 1.8; color: var(--muted); }

/* 43.4 区块收口说明 */
.bd-note {
  margin: 16px 0 0; padding: 14px 18px; font-size: 14px; line-height: 1.85; color: var(--muted);
  background: #f8fafc; border-left: 3px solid var(--pri); border-radius: 0 12px 12px 0;
}

/* 43.5 移动端：结果页示意留一屏内、词卡单列、清单单列 */
@media (max-width: 860px) {
  .bd-kw { grid-template-columns: 1fr; gap: 14px; }
  .bd-check { grid-template-columns: 1fr; }
  .bd-serp { padding: 16px; }
}
@media (max-width: 520px) {
  .bd-serp-box { height: 42px; font-size: 14px; padding: 0 12px; }
  .bd-serp-btn { height: 42px; padding: 0 16px; font-size: 14px; }
  .bd-serp-row { gap: 10px; }
  .bd-kw li { padding: 22px 18px 18px; }
}

/* ---------- 45. Google SEO 页专属版式（gg-*，2026-10-01 对标国际一流 B2B 落地页） ---------- */
/* 45.1 Google 结果页示意：把买家搜完那一屏放大讲清楚（本页最有说服力的一屏） */
.gg-serp {
  max-width: 780px; margin: 0 auto; padding: 20px 22px 18px;
  border: 1px solid var(--line); border-radius: var(--radius); background: #fff;
  box-shadow: 0 12px 32px rgba(15, 23, 42, .05);
}
.gg-serp-bar { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; }
.gg-serp-q {
  flex: 1; min-width: 0; padding: 9px 16px; border: 1px solid var(--line); border-radius: 999px;
  background: #f6f8fb; font-size: 13.5px; color: #3f4a5a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.gg-serp-btn { padding: 8px 18px; border-radius: 999px; background: var(--pri); color: #fff; font-size: 13px; font-weight: 600; white-space: nowrap; }
.gg-serp-list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 14px; }
.gg-serp-row {
  display: grid; grid-template-columns: 20px 1fr auto; align-items: start; gap: 10px;
  padding-bottom: 14px; border-bottom: 1px dashed var(--line);
}
.gg-serp-row:last-child { border-bottom: 0; padding-bottom: 0; }
.gg-serp-dot { width: 20px; height: 20px; border-radius: 50%; background: #eaf0f8; }
.gg-serp-body { display: block; min-width: 0; }
.gg-serp-t { display: block; color: #1a0dab; font-size: 16.5px; line-height: 1.45; font-weight: 500; }
.gg-serp-url { display: block; margin: 1px 0 2px; color: #202124; font-size: 12.5px; }
.gg-serp-url i { font-style: normal; color: #5f6b7a; }
.gg-serp-d { display: block; color: #4d5156; font-size: 13px; line-height: 1.7; }
.gg-serp-tag { padding: 2px 9px; border: 1px solid var(--line); border-radius: 999px; background: #fff; font-size: 11.5px; color: #7b8798; white-space: nowrap; }
.gg-serp-row-ad .gg-serp-tag { border-color: #f0c9c9; background: #fdecec; color: #b23c3c; }
.gg-serp-row-own .gg-serp-tag { border-color: #cfe0fb; background: #f2f7ff; color: var(--pri); }
.gg-note, .bd-note {
  margin: 16px 0 0; padding: 12px 16px; border-left: 3px solid var(--pri); border-radius: 0 8px 8px 0;
  background: #f8fbff; font-size: 13.4px; line-height: 1.8; color: var(--text);
}

/* 45.2 排名三支柱 */
.gg-pillar { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin: 0; padding: 0; list-style: none; }
.gg-pillar li { padding: 26px 24px 24px; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; transition: box-shadow .22s ease, border-color .22s ease; }
.gg-pillar li:hover { box-shadow: var(--shadow); border-color: #cfdffb; }  /* 零位移，无闪烁 */
.gg-pillar-no {
  display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px;
  border-radius: 10px; background: #eef4ff; color: var(--pri); font-size: 15px; font-weight: 800; margin-bottom: 14px;
}
.gg-pillar h3 { margin: 0 0 8px; font-size: 17px; line-height: 1.5; color: var(--ink); }
.gg-pillar p { margin: 0; font-size: 13.8px; line-height: 1.85; color: var(--muted); }

/* 45.3 交付节奏时间轴 */
.gg-timeline { position: relative; margin: 0; padding: 0; list-style: none; }
.gg-timeline::before { content: ''; position: absolute; left: 100px; top: 12px; bottom: 30px; width: 1px; background: var(--line); }
.gg-timeline li { position: relative; display: grid; grid-template-columns: 88px 24px 1fr; align-items: start; }
.gg-tl-w { padding: 5px 0; font-size: 13px; font-weight: 700; color: var(--pri); letter-spacing: .01em; }
.gg-tl-dot { justify-self: center; margin-top: 8px; width: 11px; height: 11px; border-radius: 50%; background: var(--pri); box-shadow: 0 0 0 3px #fff; }
.gg-tl-body { padding-bottom: 22px; }
.gg-tl-body b { display: block; font-size: 15.5px; color: var(--ink); margin-bottom: 4px; }
.gg-tl-body p { margin: 0; font-size: 13.6px; line-height: 1.8; color: var(--muted); }

/* 45.4 投入包含什么（What you get） */
.gg-include { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin: 0; padding: 0; list-style: none; }
.gg-include li { padding: 22px 22px 20px; border: 1px solid var(--line); border-radius: var(--radius); background: #fbfdff; transition: box-shadow .22s ease, border-color .22s ease; }
.gg-include li:hover { box-shadow: var(--shadow); border-color: #cfdffb; }  /* 零位移 */
.gg-include-no {
  display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px;
  border-radius: 9px; background: var(--pri); color: #fff; font-size: 12.5px; font-weight: 700; margin-bottom: 12px;
}
.gg-include b { display: block; margin-bottom: 6px; font-size: 15.5px; color: var(--ink); }
.gg-include p { margin: 0; font-size: 13.6px; line-height: 1.8; color: var(--muted); }

@media (max-width: 900px) {
  .gg-pillar, .gg-include { grid-template-columns: 1fr; }
  .gg-timeline li { grid-template-columns: 84px 24px 1fr; }
  .gg-timeline::before { left: 96px; }
}
@media (max-width: 560px) {
  .gg-serp { padding: 16px 16px 14px; }
  .gg-serp-bar { flex-wrap: wrap; gap: 8px; }
  .gg-serp-q { flex: 1 1 100%; }
  .gg-serp-row { grid-template-columns: 18px 1fr; }
  .gg-serp-tag { grid-column: 2; justify-self: start; }
  .gg-note, .bd-note { padding: 10px 13px; font-size: 13px; }
}

/* ========== 短视频获客聚合页高端样式（2026-10-01） ========== */

/* 痛点卡片：红色警示感 */
.pain-points li {
  background: linear-gradient(135deg, #fef2f2 0%, #fff 100%);
  border-left: 3px solid #ef4444;
  border-radius: 0 12px 12px 0;
}
.pain-points li:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(239, 68, 68, 0.12);
}
.pain-points .pain-no {
  background: #ef4444;
  color: #fff;
  width: 32px; height: 32px;
  border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 15px;
}

/* 为什么选我们卡片：蓝色信任感 */
.why-us-points li {
  background: linear-gradient(135deg, #eff6ff 0%, #fff 100%);
  border-left: 3px solid #2563eb;
  border-radius: 0 12px 12px 0;
}
.why-us-points li:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(37, 99, 235, 0.12);
}
.why-us-points .why-no {
  background: linear-gradient(135deg, #2563eb, #1d4ed8);
  color: #fff;
}

/* 带图二级卡片：高端产品卡风格 */
.agg-kid-media {
  overflow: hidden;
  border-radius: 16px;
  transition: transform .25s ease, box-shadow .25s ease;
}
.agg-kid-media:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.12);
}
.agg-kid-img {
  display: block;
  height: 200px;
  overflow: hidden;
}
.agg-kid-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .35s ease;
}
.agg-kid-media:hover .agg-kid-img img {
  transform: scale(1.05);
}
.agg-kid-body {
  display: block;
  padding: 24px 24px 20px;
}
.agg-kid-eyebrow {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: #2563eb;
  background: #eff6ff;
  padding: 4px 10px;
  border-radius: 6px;
  margin-bottom: 10px;
}
.agg-kid-body h3 {
  margin: 0 0 10px;
  font-size: 20px;
  font-weight: 700;
  color: #0f172a;
}
.agg-kid-body p {
  margin: 0 0 16px;
  font-size: 14.5px;
  line-height: 1.75;
  color: #64748b;
}
.agg-kid-body .card-more {
  font-size: 14px;
  font-weight: 600;
  color: #2563eb;
}

/* 区块标题下划线优化 */
.block-head h2 {
  position: relative;
  padding-bottom: 16px;
}
.block-head h2::after {
  content: '';
  position: absolute;
  bottom: 0; left: 50%;
  transform: translateX(-50%);
  width: 48px; height: 3px;
  background: linear-gradient(90deg, #2563eb, #3b82f6);
  border-radius: 2px;
}

@media (max-width: 768px) {
  .agg-kid-img { height: 180px; }
  .agg-kid-body { padding: 20px 18px 16px; }
}

/* ========== 全局排版细节优化（2026-10-01） ========== */

/* 区块上下间距加大，更有呼吸感 */
.agg-block { padding: 72px 0; }
@media (max-width: 768px) {
  .agg-block { padding: 48px 0; }
}

/* 区块标题层次优化 */
.block-head { margin-bottom: 40px; }
.block-head .bk-eyebrow {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.15em;
  color: #2563eb;
  text-transform: uppercase;
  margin-bottom: 12px;
}
.block-head h2 {
  font-size: 32px;
  font-weight: 800;
  line-height: 1.3;
  color: #0f172a;
  margin-bottom: 12px;
}
.block-head p {
  font-size: 16px;
  color: #64748b;
  line-height: 1.7;
  max-width: 600px;
  margin: 0 auto;
}
@media (max-width: 768px) {
  .block-head h2 { font-size: 24px; }
  .block-head p { font-size: 14.5px; }
  .block-head { margin-bottom: 28px; }
}

/* ld-points 卡片内边距加大 */
.ld-points li {
  padding: 28px 26px 24px;
}
.ld-points h3 {
  font-size: 17px;
  font-weight: 700;
  margin: 14px 0 10px;
}
.ld-points p {
  font-size: 14.5px;
  line-height: 1.8;
}

/* Hero 区域优化 */
.e-hero-page {
  /* 仅设上下留白；左右留白由 3969 行全出血补偿规则负责（calc(50cqi-50%+26px)），
     绝不可用 padding 简写，否则左右 padding 被清零、hero 文字贴左缘 */
  padding-top: 100px;
  padding-bottom: 80px;
}
.e-hero-page h1 {
  font-size: 48px;
  font-weight: 800;
  line-height: 1.2;
  margin-bottom: 20px;
}
.e-hero-page .e-desc {
  font-size: 18px;
  line-height: 1.8;
  max-width: 640px;
  margin-bottom: 32px;
}
.e-hero-facts {
  margin-top: 40px;
}
@media (max-width: 768px) {
  .e-hero-page { padding-top: 60px; padding-bottom: 48px; }
  .e-hero-page h1 { font-size: 32px; }
  .e-hero-page .e-desc { font-size: 15px; }
}

/* CTA 区块优化 */
.detail-cta {
  padding: 48px 40px;
  border-radius: 16px;
}
.detail-cta-t {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 8px;
}
@media (max-width: 768px) {
  .detail-cta { padding: 32px 24px; }
  .detail-cta-t { font-size: 20px; }
}

/* 面包屑间距优化 */
.breadcrumb {
  padding: 20px 0;
  font-size: 14px;
}

/* ========== 设计大升级：高端B2B风格（2026-10-01） ========== */

/* Hero 深色渐变叠加，更有冲击力 */
.e-hero-page {
  position: relative;
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #0f172a 100%) !important;
  color: #fff !important;
}
.e-hero-page::before {
  content: '';
  position: absolute;
  inset: 0;
  background: 
    radial-gradient(circle at 20% 50%, rgba(37, 99, 235, 0.15) 0%, transparent 50%),
    radial-gradient(circle at 80% 20%, rgba(59, 130, 246, 0.1) 0%, transparent 50%);
  pointer-events: none;
}
.e-hero-page .e-eyebrow {
  color: #60a5fa !important;
}
.e-hero-page h1 {
  color: #fff !important;
  letter-spacing: -0.02em;
}
.e-hero-page .e-desc {
  color: rgba(255, 255, 255, 0.8) !important;
}
.e-hero-page .e-hero-facts li {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  backdrop-filter: blur(10px);
}
.e-hero-page .e-hero-facts li b {
  color: #fff !important;
}
.e-hero-page .e-hero-facts li span {
  color: rgba(255, 255, 255, 0.6) !important;
}

/* 区块交替背景色，增加节奏感（2026-10-01 用户指令：背景不得超过主体宽度，
   原 margin:0 -24px 会让条纹外扩 24px，改为与 .e-page-body 等宽） */
.agg-block:nth-of-type(even) {
  background: linear-gradient(180deg, var(--blue-50) 0%, var(--blue-100) 100%);
  margin: 0;
  border-radius: 20px;
}

/* 卡片更精致：渐变边框 + 深层阴影 */
.ld-points li, .agg-kid-media {
  background: #fff;
  border: 1px solid #e2e8f0;
  box-shadow: 
    0 1px 3px rgba(15, 23, 42, 0.04),
    0 4px 12px rgba(15, 23, 42, 0.04);
}
.ld-points li:hover, .agg-kid-media:hover {
  box-shadow: 
    0 4px 12px rgba(15, 23, 42, 0.08),
    0 12px 32px rgba(15, 23, 42, 0.08);
}

/* 按钮升级：渐变 + 发光 */
.btn-pri {
  background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
  box-shadow: 0 4px 14px rgba(37, 99, 235, 0.3) !important;
  transition: all 0.2s ease !important;
}
.btn-pri:hover {
  box-shadow: 0 6px 20px rgba(37, 99, 235, 0.4) !important;
  transform: translateY(-1px);
}

/* 区块标题下划线：更长更粗 */
.block-head h2::after {
  width: 64px !important;
  height: 4px !important;
  background: linear-gradient(90deg, #2563eb, #60a5fa) !important;
}

/* 数字编号更大更醒目 */
.ld-points .ld-no {
  width: 40px !important;
  height: 40px !important;
  font-size: 16px !important;
  font-weight: 800 !important;
}

/* 痛点卡片：更强烈的对比 */
.pain-points li {
  background: linear-gradient(135deg, #fef2f2 0%, #fff 100%) !important;
  border-left: 4px solid #ef4444 !important;
}

/* 优势卡片：更专业的蓝色 */
.why-us-points li {
  background: linear-gradient(135deg, #eff6ff 0%, #fff 100%) !important;
  border-left: 4px solid #2563eb !important;
}

/* CTA 区块：浅色渐变（2026-10-01 用户要求改浅色）
   与首页 .cta-band（1058 行）同一套语言：浅蓝底 + 1px 淡蓝边 + 柔和蓝光晕，
   深字在左、蓝底主按钮 + 白底描边次按钮，与全站浅色体系一致。
   实现用多层 background 而不是 ::before/::after，避免光晕层盖住文字/按钮。 */
.detail-cta {
  background:
    radial-gradient(circle at 92% -30%, rgba(37, 99, 235, .10), transparent 62%),
    radial-gradient(circle at 4% 132%, rgba(147, 197, 253, .28), transparent 58%),
    linear-gradient(135deg, #eef4ff 0%, #e0ecfe 100%) !important;
  border: 1px solid #dbe7fb !important;
  color: var(--ink) !important;
  box-shadow: 0 10px 28px rgba(37, 99, 235, .10);
}
/* 标题必须用 (0,2,0) 选择器，否则被上面 .detail-cta p 的 (0,1,1) 压过去 */
.detail-cta .detail-cta-t,
.detail-cta .detail-cta-text h2 {
  color: var(--ink) !important;
}
.detail-cta p {
  color: var(--muted) !important;
}
.detail-cta-wx {
  color: var(--muted) !important;
}
.detail-cta-wx b {
  color: var(--ink) !important;
}
@media (max-width: 768px) {
  .detail-cta { box-shadow: 0 6px 18px rgba(37, 99, 235, .08); }
}

/* 面包屑更紧凑：去背景色 + 与主体内容同宽（不向两侧外扩） */
.breadcrumb {
  background: transparent;
  border: 0;
  padding: 16px 0 !important;
  margin: 0;
}

@media (max-width: 768px) {
  .e-hero-page h1 { font-size: 28px !important; }
  .block-head h2 { font-size: 22px !important; }
}

/* ========== 痛点卡片布局修正：2x2 网格 ========== */
.pain-points {
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 24px !important;
}
@media (max-width: 768px) {
  .pain-points {
    grid-template-columns: 1fr !important;
  }
}

/* ========== 恢复 Hero 原始样式（用户要求不改 hero） ========== */
.e-hero-page {
  background: transparent !important;
  color: inherit !important;
}
.e-hero-page::before {
  display: none !important;
}
.e-hero-page .e-eyebrow {
  color: var(--pri, #2563eb) !important;
}
.e-hero-page h1 {
  color: var(--ink, #0f172a) !important;
}
.e-hero-page .e-desc {
  color: var(--muted, #64748b) !important;
}
.e-hero-page .e-hero-facts li {
  background: #fff !important;
  border: 1px solid var(--line, #e2e8f0) !important;
  backdrop-filter: none;
}
.e-hero-page .e-hero-facts li b {
  color: var(--ink, #0f172a) !important;
}
.e-hero-page .e-hero-facts li span {
  color: var(--muted, #64748b) !important;
}

/* ========== 恢复 Hero 背景图样式（和实战案例页一致） ========== */
.e-hero-page {
  background: 
    linear-gradient(90deg, rgba(255,255,255,0.95) 0%, rgba(255,255,255,0.75) 50%, rgba(255,255,255,0.4) 100%),
    var(--pg-hero-img, none) center right / cover no-repeat !important;
}
.e-hero-page::before {
  display: none !important;
}
.e-hero-page h1 {
  color: #0f172a !important;
  text-shadow: none !important;
}
.e-hero-page .e-desc {
  color: #475569 !important;
}
.e-hero-page .e-eyebrow {
  color: #2563eb !important;
}
.e-hero-page .e-hero-facts li {
  background: rgba(255,255,255,0.9) !important;
  border: 1px solid #e2e8f0 !important;
  backdrop-filter: blur(8px);
}
.e-hero-page .e-hero-facts li b {
  /* 数字蓝色突出，与关于页 hero（.e-hero-facts b→var(--pri)）同一套颜色（2026-10-01 用户要求） */
  color: var(--pri, #2563eb) !important;
}
.e-hero-page .e-hero-facts li span {
  color: #64748b !important;
}

@media (max-width: 768px) {
  .e-hero-page {
    background: 
      linear-gradient(180deg, rgba(255,255,255,0.95) 0%, rgba(255,255,255,0.85) 100%),
      var(--pg-hero-img, none) center / cover no-repeat !important;
  }
}

/* 2026-10-01 删除误改：原「Hero 文字左对齐 LOGO」连续四版规则（margin:0!important / max-width / width:100%）
   把 .e-hero-page 的全出血负 margin 清零，导致 SEO 业务/聚合/功能页 hero 卡在版心内不通栏。
   全出血由 §5.3(1187/1203) 提供，背景由 §41.3 提供，文字左对齐由 2865 行提供，三者互不冲突，
   无需在此重复声明。hero 通栏行为现与首页 .hero 一致。 */

/* ========== 二级业务卡片网格：一行2个各占50%（2026-10-01 用户要求） ==========
   .grid 默认 auto-fill 三列，只有2个二级栏目时右侧空一格；
   本规则压过 104 行 auto-fill，≤460px 回落单列（与 278 行 .grid 一致）。 */
.grid-2, .agg-kid-media-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 460px) {
  .grid-2, .agg-kid-media-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   41.3 单页栏目 hero：背景图通栏全宽（2026-10-01 定版；同日补 ab/ct/sv 单页模板）
   改动点：图由 center right（只露右半边）改为 center center / cover 满铺整屏，
   遮罩由「左侧 96% 白、右侧 22%」收敛为「左深右浅的白纱」，
   保证深字在左仍可读、右侧画面透出来；底部再叠一层自下而上融白，
   让通栏大图与下方白底正文自然衔接，不出现硬切边。
   生效范围：.e-hero-page / .fx-hero（10 个二级业务栏目、一级聚合页、功能页）
   ＋ .ab-hero / .ct-hero / .sv-hero（单页模板：about/contact/services/privacy）——
   后者原先漏配，hero 图仍停在 center right「只露右半」的旧样式，本次补齐。
   文章页 .e-hero 与案例页 .e-hero-case 不动。
   ============================================================ */
.e-hero-page, .fx-hero, .ab-hero, .ct-hero, .sv-hero {
  background:
    linear-gradient(90deg, rgba(250, 252, 255, .94) 0%, rgba(250, 252, 255, .82) 32%, rgba(250, 252, 255, .42) 66%, rgba(250, 252, 255, .14) 100%),
    linear-gradient(0deg, rgba(250, 252, 255, .92) 0%, rgba(250, 252, 255, .55) 16%, rgba(250, 252, 255, 0) 42%),
    var(--pg-hero-img, none) center center / cover no-repeat,
    linear-gradient(180deg, #eef4ff 0%, #fafcff 100%) !important;
  background-size: auto, auto, cover, auto !important;
  background-position: left top, left bottom, center center, center top !important;
  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat !important;
}
@media (max-width: 860px) {
  .e-hero-page, .fx-hero, .ab-hero, .ct-hero, .sv-hero {
    background:
      linear-gradient(90deg, rgba(250, 252, 255, .93) 0%, rgba(250, 252, 255, .76) 58%, rgba(250, 252, 255, .58) 100%),
      linear-gradient(0deg, rgba(250, 252, 255, .94) 0%, rgba(250, 252, 255, .60) 18%, rgba(250, 252, 255, 0) 46%),
      var(--pg-hero-img, none) center center / cover no-repeat,
      linear-gradient(180deg, #eef4ff 0%, #fafcff 100%) !important;
    background-size: auto, auto, cover, auto !important;
  }
}
@media (max-width: 768px) {
  .e-hero-page, .fx-hero, .ab-hero, .ct-hero, .sv-hero {
    background:
      linear-gradient(90deg, rgba(250, 252, 255, .93) 0%, rgba(250, 252, 255, .78) 66%, rgba(250, 252, 255, .62) 100%),
      linear-gradient(0deg, rgba(250, 252, 255, .94) 0%, rgba(250, 252, 255, .60) 20%, rgba(250, 252, 255, 0) 50%),
      var(--pg-hero-img, none) center center / cover no-repeat,
      linear-gradient(180deg, #eef4ff 0%, #fafcff 100%) !important;
  }
}

/* ════════════════════════════════════════════════════════════════
   §61 全站小图标浅色化（2026-10-01）
   历史 emoji 图标（🔍🤖🌐📞💬📍🎯📚🤝）由系统彩色字体渲染、CSS 无法改色，
   现统一替换为单色描边 SVG（app/Helpers.php icon_light()），随 currentColor 取色。
   色彩口径：浅蓝 = var(--pri) 加透明度，不用任何彩色 emoji。
   ════════════════════════════════════════════════════════════════ */
.ic-light {
  width: 1em; height: 1em;
  fill: none; stroke: currentColor; stroke-width: 1.8;
  stroke-linecap: round; stroke-linejoin: round;
  vertical-align: -0.14em;
}
/* 卡片 h3 标题里的入口图标（搜索/AI/谷歌入口） */
h3 > .ic-light {
  width: 20px; height: 20px;
  margin-right: 7px;
  color: var(--pri); opacity: .55;
  vertical-align: -4px;
}
/* 关于我们 · 价值观卡图标（数据仍为 emoji，icon_light 映射） */
.ab-vicon { display: inline-block; line-height: 1; }
.ab-vicon .ic-light { width: 30px; height: 30px; color: var(--pri); opacity: .5; vertical-align: 0; }
/* 联系我们 · 联系方式卡图标（淡蓝底芯片内） */
.ct-icon { color: var(--pri); }
.ct-icon .ic-light { width: 22px; height: 22px; vertical-align: 0; }

/* ============================================================
   60. 底部转化 CTA 全站统一为案例页 cta-band 同款（2026-10-01 用户指令）
   基准 = .cta-band（16.6 节定版）：blue-50→blue-100 135° 渐变底
   + blue-200 细边 + 24px 圆角卡片 + 柔和蓝阴影。
   统一两类底部 CTA：
   ① .nl-cta —— 关于我们 / 服务报价单页的底部 CTA（原裸版无背景）
   ② .e-page-body .detail-cta —— 业务详解模板与通用单页底部 CTA
     （文章详情侧栏的 .content .detail-cta 是「相关服务」内链盒，
      不在 .e-page-body 内，不受影响）
   ============================================================ */
.nl-cta,
.e-page-body .detail-cta {
  position: relative; overflow: hidden;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px;
  margin: 44px 0 0;
  padding: 34px 48px;
  background: linear-gradient(135deg, var(--blue-50) 0%, var(--blue-100) 100%) !important;
  border: 1px solid var(--blue-200) !important;
  border-radius: 24px !important;
  box-shadow: 0 8px 24px rgba(37, 99, 235, .08);
}
/* 与 cta-band 同款双光斑装饰（多层背景会被上面 !important 渐变覆盖，改用伪元素） */
.nl-cta::before,
.e-page-body .detail-cta::before {
  content: ""; position: absolute; right: -120px; top: -140px;
  width: 340px; height: 340px; border-radius: 50%;
  background: radial-gradient(circle, rgba(37, 99, 235, .08), transparent 65%);
  pointer-events: none;
}
.nl-cta::after,
.e-page-body .detail-cta::after {
  content: ""; position: absolute; left: -80px; bottom: -160px;
  width: 300px; height: 300px; border-radius: 50%;
  background: radial-gradient(circle, rgba(147, 197, 253, .22), transparent 60%);
  pointer-events: none;
}
/* 内容浮于光斑之上 */
.nl-cta > *, .e-page-body .detail-cta > * { position: relative; z-index: 1; }
/* 关于/服务页 CTA 文字升到 cta-band 的层级 */
.nl-cta-t { margin: 0 0 6px; font-size: 22px; letter-spacing: .5px; color: #0f172a; }
.nl-cta-text p { margin: 0; font-size: 14.5px; color: #475569; }
/* 手机档收窄（覆盖上方 34px 48px 与业务层 32px 24px） */
@media (max-width: 768px) {
  .nl-cta, .e-page-body .detail-cta { padding: 24px 20px; border-radius: 20px; }
  .nl-cta-t { font-size: 19px; }
}

/* ============================================================
   61. 序号徽章移到卡片右上角（2026-10-01 用户指令）
   生效范围：HOW IT WORKS 01/02/03、WHY US 01-04、痛点「!」等全部 ld-points 卡片
   ============================================================ */
.ld-points .ld-no {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  left: auto !important;
}
/* 标题右侧给徽章让位，避免长标题顶到序号 */
.ld-points h3 { padding-right: 48px; }

/* ============================================================
   61.1 短视频页 4 卡一行（2026-10-02 用户指令）
   痛点 / WHY US / 自查 三个 4 项区块在桌面端排成一行 4 列
   ============================================================ */
.sv-4col { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 20px !important; }
.sv-4col li { min-width: 0; }
/* 自查卡片在 4 列下改为上下堆叠，避免横向 flex 太挤 */
.agg-page .hm-qa-checks.sv-4col li { flex-direction: column; gap: 8px; }
.agg-page .hm-qa-checks.sv-4col li b { font-size: 15px; }
.agg-page .hm-qa-checks.sv-4col li p { margin: 0; font-size: 13.5px; line-height: 1.75; color: var(--muted); }
@media (max-width: 1100px) {
  .sv-4col { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 14px !important; }
}
@media (max-width: 640px) {
  .sv-4col { grid-template-columns: 1fr !important; }
}

/* ============================================================
   62. 短视频获客页视觉升级 svx-*（2026-10-02 用户指令：营销型网页重新设计）
   作用域：.svx-page（仅 template/default/page/short-video.html）
   内容：hero 平台徽章 / 痛点大编号卡 / 流程箭头 / 交付清单 / 横向时间轴 / 打勾自查
   红线：全部新前缀，不触碰公共类；断点 1100 / 900 / 640
   ============================================================ */

/* —— 62.2 痛点：大编号卡（红渐变顶条） —— */
.svx-pains { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; list-style: none; margin: 0; padding: 0; }
.svx-pains li {
  position: relative; overflow: hidden;
  background: #fff; border: 1px solid var(--line); border-radius: 16px;
  padding: 46px 20px 20px; box-shadow: var(--shadow);
  transition: transform .25s ease, box-shadow .25s ease;
}
.svx-pains li::before {
  content: ""; position: absolute; left: 0; top: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, #e11d48, #f97316);
}
.svx-pains li:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(225, 29, 72, .12); }
.svx-pain-no {
  position: absolute; top: 14px; right: 16px;
  font-style: normal; font-size: 30px; font-weight: 800; line-height: 1;
  color: #fde8ee; letter-spacing: 1px;
}
.svx-pains h3 { margin: 0 0 8px; font-size: 16px; line-height: 1.5; color: var(--ink); }
.svx-pains p { margin: 0; font-size: 13.5px; line-height: 1.75; color: var(--muted); }

/* —— 62.3 HOW IT WORKS：三步流程 + 连接箭头 —— */
.svx-flow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; list-style: none; margin: 0; padding: 0; }
.svx-flow li {
  position: relative;
  background: linear-gradient(180deg, var(--blue-50), #fff 60%);
  border: 1px solid var(--blue-200); border-radius: 16px;
  padding: 26px 22px 22px;
}
.svx-flow li:not(:last-child)::after {
  content: ""; position: absolute; top: 50%; right: -16px; z-index: 2;
  width: 12px; height: 12px;
  border-top: 2px solid var(--blue-300); border-right: 2px solid var(--blue-300);
  transform: translateY(-50%) rotate(45deg);
}
.svx-flow-no {
  display: inline-flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; border-radius: 12px; margin: 0 0 14px;
  background: linear-gradient(135deg, var(--pri), var(--pri-d));
  color: #fff; font-weight: 800; font-size: 16px;
  box-shadow: 0 6px 14px rgba(37, 99, 235, .28);
}
.svx-flow h3 { margin: 0 0 8px; font-size: 16.5px; color: var(--ink); }
.svx-flow p { margin: 0; font-size: 13.5px; line-height: 1.75; color: var(--muted); }

/* —— 62.4 WHAT YOU GET：交付清单（营销漏斗新增环） —— */
.svx-delivers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; list-style: none; margin: 0; padding: 0; }
.svx-delivers li {
  display: flex; align-items: flex-start; gap: 14px;
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
  padding: 20px; box-shadow: var(--shadow);
  transition: border-color .2s ease, transform .2s ease;
}
.svx-delivers li:hover { border-color: var(--blue-300); transform: translateY(-2px); }
.svx-delivers li:last-child:nth-child(odd) { grid-column: 1 / -1; }
.svx-dl-no {
  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; border-radius: 10px;
  background: var(--blue-50); border: 1px solid var(--blue-200);
  color: var(--pri-d); font-style: normal; font-weight: 800; font-size: 13px;
}
.svx-dl-body h3 { margin: 0 0 5px; font-size: 15.5px; color: var(--ink); }
.svx-dl-body p { margin: 0; font-size: 13.5px; line-height: 1.75; color: var(--muted); }

/* —— 62.5 TIMELINE：横向轨道时间轴 —— */
.svx-tline {
  position: relative; text-align: center;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px;
  list-style: none; margin: 0; padding: 0;
}
.svx-tline::before {
  content: ""; position: absolute; left: 3%; right: 3%; top: 38px; height: 3px;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--blue-200), var(--pri) 50%, var(--blue-200));
}
.svx-tline li { position: relative; padding-top: 74px; }
.svx-tline li::before {
  content: ""; position: absolute; top: 27px; left: 50%; transform: translateX(-50%);
  width: 17px; height: 17px; border-radius: 50%;
  background: #fff; border: 4px solid var(--pri);
  box-shadow: 0 0 0 4px rgba(37, 99, 235, .15);
}
.svx-tl-stage {
  position: absolute; top: 0; left: 50%; transform: translateX(-50%);
  white-space: nowrap;
  display: inline-block; padding: 4px 14px; border-radius: 999px;
  background: var(--pri); color: #fff;
  font-size: 12.5px; font-weight: 700; letter-spacing: .5px;
}
.svx-tline b { display: block; margin: 0 0 6px; font-size: 16px; color: var(--ink); }
.svx-tline p { margin: 0; font-size: 13.5px; line-height: 1.75; color: var(--muted); }

/* —— 62.6 SELF CHECK：打勾清单卡 —— */
.svx-checks { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; list-style: none; margin: 0; padding: 0; }
.svx-checks li {
  position: relative;
  background: var(--blue-50); border: 1px solid var(--blue-200); border-radius: 14px;
  padding: 24px 18px 18px;
}
.svx-checks li::before {
  content: "\2713"; position: absolute; top: -12px; left: 18px;
  width: 26px; height: 26px; border-radius: 50%;
  background: var(--pri); color: #fff;
  font-size: 14px; font-weight: 800; line-height: 26px; text-align: center;
  box-shadow: 0 4px 10px rgba(37, 99, 235, .3);
}
.svx-checks b { display: block; margin: 4px 0 8px; font-size: 15px; line-height: 1.55; color: var(--ink); }
.svx-checks p { margin: 0; font-size: 13.5px; line-height: 1.75; color: var(--muted); }

/* —— 62.7 响应式 —— */
@media (max-width: 1100px) {
  .svx-pains, .svx-checks { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .svx-tline { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .svx-tline::before, .svx-tline li::before { display: none; }
  .svx-tline li { padding-top: 0; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 18px; }
  .svx-tl-stage { position: static; transform: none; margin-bottom: 8px; }
}
@media (max-width: 900px) {
  .svx-flow { grid-template-columns: 1fr; }
  .svx-flow li:not(:last-child)::after {
    top: auto; bottom: -16px; right: auto; left: 50%;
    transform: translateX(-50%) rotate(135deg);
  }
  .svx-delivers { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .svx-pains, .svx-checks, .svx-tline { grid-template-columns: 1fr; }
}

/* —— 62.8 底色块与内容留白（2026-10-02 用户指令） ——
   仅带底色的块（nth-of-type(even)）内容内缩 48px 留出间距；
   无背景区块保持原全宽不动。 */
.svx-page .agg-block:nth-of-type(even) { padding-left: 48px; padding-right: 48px; }
@media (max-width: 768px) {
  .svx-page .agg-block:nth-of-type(even) { padding-left: 20px; padding-right: 20px; }
}

/* —— 62.9 平台矩阵：六大视频获客平台（2026-10-02 用户指令；同日改 3 列带图卡） —— */
.svx-platforms { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; list-style: none; margin: 0; padding: 0; }
.svx-platforms li {
  position: relative;
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
  padding: 0 0 18px; text-align: center; overflow: hidden;
  box-shadow: var(--shadow);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.svx-pf-img { display: block; height: 150px; overflow: hidden; }
.svx-pf-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s ease; }
.svx-platforms li:hover { transform: translateY(-3px); border-color: var(--blue-300); box-shadow: 0 10px 26px rgba(37, 99, 235, .14); }
.svx-platforms li:hover .svx-pf-img img { transform: scale(1.04); }
.svx-platforms b { display: block; margin: 16px 0 8px; font-size: 16.5px; color: var(--ink); letter-spacing: .5px; }
.svx-platforms p { margin: 0; padding: 0 18px; font-size: 13px; line-height: 1.75; color: var(--muted); }
@media (max-width: 900px) {
  .svx-platforms { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .svx-platforms { grid-template-columns: 1fr; }
  .svx-pf-img { height: 170px; }
}
/* 62.9a 平台卡整卡可点（2026-10-02 用户指令：六平台卡链接到对应二级页） */
.svx-pf-a { display: block; text-decoration: none; color: inherit; }

/* ===== 62.11 首页 hero 上下留白升级（2026-10-02 用户令：文案与背景上下要留空） ===== */
.hero.hm-hero2 { padding: 108px 0 96px; }
@media (max-width: 960px) {
  .hero.hm-hero2 { padding: 68px 0 58px; }
}
/* 62.11a 首页 hero 副标题字号下调（2026-10-02 用户令：字号小一些），只作用首页 */
.hero.hm-hero2 .hero-sub.hero-sub-lead { font-size: clamp(13.5px, 0.5vw + 12.6px, 15px); font-weight: 500; line-height: 1.8; }
/* 62.11b 首页 AI 卡下移（2026-10-02 用户令：不要挡住背景人物的脸），手机端复位 */
.hero.hm-hero2 .hm-ai-card { top: 130px; }
@media (max-width: 960px) {
  .hero.hm-hero2 .hm-ai-card { top: 0; }
}
/* 62.11c 首页 hero 文字版式对齐其它页 hero（2026-10-02 用户令：参考其它 hero 样式）
   其它页 h1 = clamp(30,3.6vw,46)/行高1.25/字距1px（≥1600 封顶48、≤720 为25px），首页原为 clamp(30,4.4vw,54) 偏大 */
.hero.hm-hero2 h1 { font-size: clamp(30px, 3.6vw, 46px); line-height: 1.25; letter-spacing: 1px; }
@media (min-width: 1600px) {
  .hero.hm-hero2 h1 { font-size: clamp(34px, 3vw, 48px); }
}
@media (max-width: 720px) {
  .hero.hm-hero2 h1 { font-size: 25px; }
}

/* ===== 62.12 首页主体内容营销化升级（2026-10-02 用户令：按营销型首页策划） ===== */
/* 12.1 分流卡：编号 + 痛点原话引号体，强化「对号入座」 */
.hm-aud-grid a { display: flex; flex-direction: column; height: 100%; }
.hm-aud-no { font-style: normal; font-size: 13px; font-weight: 800; letter-spacing: 1px; color: var(--pri); background: #eef4ff; border-radius: 8px; padding: 2px 9px; width: fit-content; margin-bottom: 12px; }
.hm-aud-grid .hm-aud-pain { color: var(--muted); }
.hm-aud-grid .hm-aud-go { margin-top: auto; padding-top: 4px; }
/* 12.2 双引擎要点列表：勾选条目，讲清「怎么做」 */
.ld-engine-pts { list-style: none; margin: 12px 0 4px; padding: 0; border-top: 1px dashed var(--line); }
.ld-engine-pts li { position: relative; padding: 9px 0 9px 26px; font-size: 13.8px; line-height: 1.75; color: var(--text); border-bottom: 1px dashed var(--line); }
.ld-engine-pts li::before { content: "✓"; position: absolute; left: 2px; top: 9px; font-weight: 800; color: var(--pri); }
/* 12.3 首页 FAQ 两列（≥861px；about 页 .ab-faqs-2col 同款思路，作用域限首页） */
@media (min-width: 861px) {
  .hm-faq2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; align-items: start; }
  .hm-faq2 details:nth-child(odd) { grid-column: 1; }
  .hm-faq2 details { break-inside: avoid; }
}