/* 企易掌官网模板 · 首页样式
   品牌主色 #0F6BB0 / 辅助色 #2E90D9 ／ 全宽自适应布局 */

:root {
  --brand: #0F6BB0;
  --brand-2: #2E90D9;
  --brand-grad: linear-gradient(90deg, #0F6BB0 0%, #2E90D9 100%);
  --ink: #111827;
  --text: #555555;
  --muted: #8b94a3;
  --line: #e6eaf2;
  --soft: #F4F4FF;
  --dark: #202020;
  --radius: 10px;
  --container: 1728px;
  --container-w: min(90vw, var(--container));
  --shadow-sm: 0 6px 20px rgba(15, 107, 176, .06);
  --shadow-md: 0 14px 34px rgba(15, 107, 176, .13);
  --ease: cubic-bezier(.22, .61, .36, 1);
  --ease-lift: cubic-bezier(.33, .33, .67, 1);
  --dur-lift: .3s;
}

* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: var(--text);
  background: #fff;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; display: block; border: 0; }
a { color: inherit; text-decoration: none; transition: color .25s var(--ease); }
h1, h2, h3 { margin: 0; color: var(--ink); line-height: 1.3; }
p { margin: 0; }

.container {
  width: 90%;
  max-width: var(--container);
  margin: 0 auto;
}

/* ---------- 通用按钮 ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 52px;
  padding: 0 36px;
  border: 0;
  border-radius: 6px;
  font-size: 16px;
  font-family: inherit;
  font-weight: 500;
  cursor: pointer;
  transition: transform var(--dur-lift) var(--ease-lift),
              box-shadow var(--dur-lift) var(--ease-lift),
              background .25s var(--ease);
}
.btn-primary {
  color: #fff;
  background: var(--brand-grad);
  box-shadow: 0 10px 22px rgba(15, 107, 176, .22);
}
.btn-primary:hover { transform: translate3d(0, -2px, 0); box-shadow: 0 14px 28px rgba(15, 107, 176, .3); }
.btn-primary:active { transform: translate3d(0, 0, 0); }
.btn-ghost {
  color: var(--brand);
  background: #fff;
  border: 1px solid rgba(15, 107, 176, .35);
}
.btn-ghost:hover { background: #f5f9ff; border-color: var(--brand); }
.btn-ghost .arrow-down { font-size: 15px; line-height: 1; transform: translateY(1px); }

/* ---------- 按钮：跟随鼠标的局部光晕 ---------- */
/* 光斑以指针为圆心、半径固定向外渐隐，所以只点亮鼠标附近的一小块，
   不会把整个按钮铺亮。坐标 --mx/--my 由 main.js 的 pointermove 写入（rAF 合并）。
   isolation + z-index:-1 的组合让光晕压在按钮底色之上、文字之下。 */
.btn,
.hero-arrow,
.nav-login {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.btn::before,
.hero-arrow::before,
.nav-login::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  pointer-events: none;
  background: radial-gradient(circle var(--glow-r, 132px) at var(--mx, 50%) var(--my, 50%),
              rgba(var(--glow, 255, 255, 255), .36) 0%,
              rgba(var(--glow, 255, 255, 255), .16) 36%,
              rgba(var(--glow, 255, 255, 255), .05) 66%,
              rgba(var(--glow, 255, 255, 255), 0) 100%);
  opacity: 0;
  transition: opacity .3s var(--ease);
}
/* 浅底按钮改用品牌蓝光——白光照在白底上等于没有 */
.hero-arrow,
.btn-ghost { --glow: 15, 107, 176; }
/* 登录按钮 hover 后底色本身就是品牌蓝，光晕得用白光才看得见 */
.nav-login { --glow: 255, 255, 255; --glow-r: 92px; }
/* 小尺寸按钮把光斑半径收小，否则整颗被点亮，看不出"跟着鼠标走" */
.hero-arrow { --glow-r: 64px; }

@media (hover: hover) and (pointer: fine) {
  .btn:hover::before,
  .hero-arrow:hover::before,
  .nav-login:hover::before { opacity: 1; }
}

/* ---------- 头部导航 ---------- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 60;
  background: #fff;
  transition: box-shadow .3s var(--ease);
}
.site-header.is-scrolled { box-shadow: 0 6px 20px rgba(17, 24, 39, .08); }

/* 三段式：logo 靠左、导航在容器正中、登录靠右。
   用 grid 的 1fr auto 1fr 而不是 flex——两侧等分，中间那列才真的落在容器中线上 */
.header-inner {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  height: 80px;
  gap: 24px;
}
.brand { display: flex; align-items: center; justify-self: start; }
.brand-logo { height: 44px; width: auto; }

.header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  justify-self: end;
}

.site-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  justify-self: center;
  gap: 4px;
}
.site-nav > a {
  position: relative;
  padding: 8px 12px;
  font-size: 15px;
  color: #333;
  white-space: nowrap;
}
.site-nav > a::after {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 0;
  height: 2px;
  border-radius: 2px;
  background: var(--brand-grad);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .28s var(--ease);
}
.site-nav > a:hover { color: var(--brand); }
.site-nav > a:hover::after,
.site-nav > a.is-active::after { transform: scaleX(1); }
.site-nav > a.is-active { color: var(--brand); font-weight: 500; }

.nav-login {
  padding: 8px 22px !important;
  border: 1px solid rgba(15, 107, 176, .4);
  border-radius: 6px;
  color: var(--brand) !important;
  font-weight: 500;
  transition: background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
}
.nav-login::after { display: none; }
.nav-login:hover { background: var(--brand); border-color: var(--brand); color: #fff !important; }

.nav-toggle {
  display: none;
  width: 44px;
  height: 44px;
  margin-left: auto;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.nav-toggle span {
  display: block;
  width: 22px;
  height: 2px;
  margin: 5px auto;
  border-radius: 2px;
  background: #222;
  transition: transform .3s var(--ease), opacity .2s var(--ease);
}
.nav-toggle.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle.is-open span:nth-child(2) { opacity: 0; }
.nav-toggle.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ---------- 首屏轮播 ---------- */
.hero {
  position: relative;
  height: 420px;
  scroll-margin-top: 88px;
  overflow: hidden;
  background: #eef3fb;
  cursor: grab;
  /* 水平方向交给脚本拖拽，纵向仍可正常滚动页面；保留双指缩放 */
  touch-action: pan-y pinch-zoom;
}
.hero.is-grabbing,
.hero.is-grabbing a { cursor: grabbing; }
/* 轮播结构：平移、循环、拖拽全由 Swiper 负责，这里只管每张的铺法与视觉 */
.hero-track { height: 100%; }
.hero-slide {
  position: relative;
  height: 100%;
  display: flex;
  align-items: center;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  -webkit-user-select: none;
  user-select: none;          /* 拖拽时不要选中文案 */
}
.hero-slide a { -webkit-user-drag: none; }
.hero-slide-a { background-image: url("https://oss.linggo.holypro.xin/cus-000100007/templates/20261022/1349c53bf5a984fd.jpg"); }
.hero-slide-b { background-image: url("https://oss.linggo.holypro.xin/cus-000100007/templates/20261022/bd1d00a85d005d2a.jpg"); }
.hero-slide-a::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(95deg, rgba(9, 44, 88, .38) 0%, rgba(9, 44, 88, .16) 42%, rgba(9, 44, 88, 0) 68%);
  pointer-events: none;
}

.hero-inner { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; }
.hero-slide-a .hero-inner { color: #fff; }
.hero-slide-a .hero-title { color: #fff; }
.hero-slide-a .hero-desc { color: rgba(255, 255, 255, .92); }
.hero-slide-b .hero-title { color: #0d2036; }
.hero-slide-b .hero-desc { color: #3f4a5a; }

.hero-title {
  font-size: 48px;
  font-weight: 700;
  letter-spacing: .5px;
  margin: 0;
}
.hero-desc { margin-top: 14px; font-size: 22px; line-height: 1.6; }
.hero-btn { margin-top: 34px; height: 54px; padding: 0 40px; }

/* 第 1 张首屏：底图本身就是大面积蓝，品牌蓝渐变和背景同色同亮度，按钮几乎看不出来。
   改成浅蓝渐变 + 品牌蓝字——蓝色照片上放浅色按钮是最常规、也最稳的反差做法。
   渐变从近白起、到淡蓝收，和站里其他按钮一样是双色渐变，只是亮一档；
   字色用品牌蓝，浅底上对比够，比压白字更清楚 */
.hero-slide-a .hero-btn {
  color: var(--brand);
  font-weight: 600;          /* 浅底蓝字比白字压蓝底看着细，加半档才不显虚 */
  background: linear-gradient(100deg, #ffffff 0%, #e8f3ff 55%, #d7eafd 100%);
  box-shadow: 0 12px 28px rgba(6, 52, 108, .3);
  --glow: 15, 107, 176;      /* 浅底按钮的光晕改品牌蓝，白光在上面等于没有 */
  --glow-r: 96px;            /* 半径按按钮尺寸收小，否则整颗被点亮，看不出跟随 */
}
.hero-slide-a .hero-btn:hover {
  color: #0a5c9c;
  background: linear-gradient(100deg, #f7fbff 0%, #ddeeff 55%, #c9e2fb 100%);
  box-shadow: 0 16px 34px rgba(6, 52, 108, .36);
}

.hero-ctrl {
  position: absolute;
  right: max(24px, calc((100% - var(--container-w)) / 2 + 24px));
  bottom: 40px;
  display: flex;
  gap: 12px;
  z-index: 3;
}
.hero-arrow {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: #4a5a70;
  background: rgba(255, 255, 255, .72);
  backdrop-filter: blur(4px);
  cursor: pointer;
  transition: background .25s var(--ease), color .25s var(--ease), transform var(--dur-lift) var(--ease-lift);
}
.hero-arrow svg { width: 20px; height: 20px; }
.hero-arrow:hover { background: #fff; color: var(--brand); transform: translate3d(0, -2px, 0); }

.hero .hero-dots {
  position: absolute;
  left: max(24px, calc((100% - var(--container-w)) / 2 + 24px));
  bottom: 46px;
  display: flex;
  gap: 8px;
  z-index: 3;
}
.hero .hero-dot {
  display: block;
  width: 26px;
  height: 4px;
  padding: 0;
  border: 0;
  border-radius: 3px;
  background: rgba(255, 255, 255, .45);
  cursor: pointer;
  transition: background .3s var(--ease), width .3s var(--ease);
}
.hero-dot.is-active { background: #fff; }
.hero.is-light .hero-dot { background: rgba(13, 32, 54, .18); }
.hero.is-light .hero-dot.is-active { background: var(--brand); }

/* ---------- 通用区块 ---------- */
.sec { position: relative; isolation: isolate; padding: 66px 0 72px; scroll-margin-top: 88px; }
.sec-call,
.sec-crm { background: var(--soft); }
.sec-lead,
.sec-news { background: #fff; }

/* 联系我们：原来整块纯白太平。加一层很淡的蓝，
   左上角 + 右下角各一团极淡光晕（.08 / .05），底色竖向近白→微蓝→近白，
   有起伏但不下压，白卡片照样浮得起来。 */
.sec-contact {
  background:
    radial-gradient(880px 460px at 92% 4%, rgba(46, 144, 217, .08), rgba(46, 144, 217, 0) 70%),
    radial-gradient(760px 420px at 4% 96%, rgba(15, 107, 176, .05), rgba(15, 107, 176, 0) 72%),
    linear-gradient(180deg, #fbfdff 0%, #f4f9ff 52%, #fbfdff 100%);
}

/* 企业线索平台：原来底色和卡片都是纯白，卡片只有 6% 的阴影，
   整块看着像一张白纸戳了几个洞。
   改成"顶部近白 → 底部淡蓝"的竖向渐变打底，白色卡片自然浮起来；
   再叠一层向下渐隐的细点阵，让大面积平涂不至于空。 */
.sec-lead {
  background: linear-gradient(180deg, #fcfdff 0%, #f0f6fd 100%);
}
.sec-lead::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image:
    radial-gradient(820px 400px at 50% -10%, rgba(46, 144, 217, .14), rgba(46, 144, 217, 0) 70%),
    radial-gradient(rgba(15, 107, 176, .14) 1px, transparent 1.4px);
  background-size: 100% 100%, 24px 24px;
  background-repeat: no-repeat, repeat;
  /* 点阵越往下越淡，到区块底部完全消失，不会在接缝处留下一条硬边 */
  -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, .95) 0%, rgba(0, 0, 0, .55) 52%, rgba(0, 0, 0, 0) 94%);
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, .95) 0%, rgba(0, 0, 0, .55) 52%, rgba(0, 0, 0, 0) 94%);
}

/* 通栏背景装饰：只在 3 个区块各加一团极淡的品牌蓝光晕，峰值透明度 0.09，
   作用只是让大面积平涂的底色有一点呼吸感，不参与视觉焦点。
   z-index:-1 + isolation 让它落在区块底色之上、内容之下，不会盖住文字。 */
.sec-call::before,
.sec-crm::before,
.sec-news::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}
.sec-call::before {
  background:
    radial-gradient(700px 400px at 13% -6%, rgba(46, 144, 217, .17), rgba(46, 144, 217, 0) 72%),
    radial-gradient(620px 380px at 92% 106%, rgba(15, 107, 176, .08), rgba(15, 107, 176, 0) 74%);
}
.sec-crm::before {
  background:
    radial-gradient(700px 400px at 87% -6%, rgba(46, 144, 217, .17), rgba(46, 144, 217, 0) 72%),
    radial-gradient(620px 380px at 8% 106%, rgba(15, 107, 176, .08), rgba(15, 107, 176, 0) 74%);
}
.sec-news::before {
  background: radial-gradient(1100px 360px at 50% 118%, rgba(46, 144, 217, .10), rgba(46, 144, 217, 0) 72%);
}

.sec-head { text-align: center; margin-bottom: 46px; }
.sec-title {
  font-size: 36px;
  font-weight: 700;
  letter-spacing: .5px;
}
.sec-title::after {
  content: "";
  display: block;
  width: 46px;
  height: 4px;
  margin: 16px auto 0;
  border-radius: 3px;
  background: var(--brand-grad);
}
.sec-desc {
  margin: 18px auto 0;
  max-width: 1180px;
  font-size: 16px;
  color: var(--text);
  line-height: 1.75;
}
.sec-more { margin-top: 46px; text-align: center; }

.grid { display: grid; gap: 30px; }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* ---------- 产品功能卡片 ---------- */
.feature-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 34px 30px 38px;
  text-align: center;
  background: #fff;
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  transition: transform var(--dur-lift) var(--ease-lift), box-shadow var(--dur-lift) var(--ease-lift);
}
.feature-card:hover { transform: translate3d(0, -6px, 0); box-shadow: var(--shadow-md); }
.feature-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 150px;
  margin-bottom: 18px;
}
.feature-icon img {
  max-height: 150px;
  width: auto;
  object-fit: contain;
  transition: transform .38s var(--ease-lift);
}
.feature-card:hover .feature-icon img { transform: scale(1.05); }
.feature-title { font-size: 22px; font-weight: 700; }
.feature-line {
  width: 26px;
  height: 3px;
  margin: 14px 0 16px;
  border-radius: 2px;
  background: var(--brand-grad);
}
.feature-desc { font-size: 15px; color: var(--text); line-height: 1.8; }

/* ---------- 企业线索卡片 ---------- */
.lead-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 28px 24px 32px;
  text-align: center;
  background: #fff;
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  transition: transform var(--dur-lift) var(--ease-lift), box-shadow var(--dur-lift) var(--ease-lift);
}
.lead-card:hover { transform: translate3d(0, -6px, 0); box-shadow: var(--shadow-md); }
.lead-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 126px;
  margin-bottom: 16px;
}
.lead-icon img { max-height: 126px; width: auto; object-fit: contain; transition: transform .38s var(--ease-lift); }
.lead-card:hover .lead-icon img { transform: scale(1.05); }
.lead-label { font-size: 16px; font-weight: 600; color: #1f2937; line-height: 1.6; }

/* ---------- CRM 特性（多页同屏轮播） ---------- */
/* 位移、循环、分页、拖拽全部交给 Swiper，这里只保留卡片自身的样子。
   Swiper 容器是 overflow:hidden，圆形图标 hover 上浮 + 投影都会撞到上下边缘被切，
   所以上下各留出一段内边距当作"活动余量"（padding 在裁剪盒内部，内容进去不会被切） */
.crm-swiper { padding: 16px 0 18px; }
.crm-item { text-align: center; }
/* 分页指示器：两条小横杠，够看出"一共两页、现在第几页"，点一下也能手动切回去 */
.crm-dots { display: flex; justify-content: center; gap: 8px; margin-top: 24px; }
.crm-dots .crm-dot {
  width: 18px;
  height: 5px;
  border-radius: 3px;
  background: rgba(15, 107, 176, .2);
  cursor: pointer;
  transition: background .25s var(--ease), width .25s var(--ease);
}
.crm-dots .crm-dot.is-active { width: 26px; background: var(--brand); }
.sec-crm .sec-more { margin-top: 28px; }
.crm-icon {
  width: 120px;
  height: 120px;
  margin: 0 auto 22px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 10px 24px rgba(15, 107, 176, .1);
  transition: transform var(--dur-lift) var(--ease-lift),
              box-shadow var(--dur-lift) var(--ease-lift);
}
.crm-icon img { width: 72px; height: auto; }
.crm-item:hover .crm-icon {
  transform: translate3d(0, -6px, 0);
  box-shadow: 0 18px 34px rgba(15, 107, 176, .16);
}
.crm-title { font-size: 20px; font-weight: 700; }
.crm-desc { margin-top: 10px; font-size: 15px; color: var(--text); line-height: 1.75; }

/* ---------- 新闻动态 ---------- */
.news-card {
  display: flex;
  flex-direction: column;
  background: var(--soft);
  border-radius: var(--radius);
  overflow: hidden;
  transition: transform var(--dur-lift) var(--ease-lift),
              box-shadow var(--dur-lift) var(--ease-lift),
              background-color .3s var(--ease);
}
.news-card:hover {
  transform: translate3d(0, -6px, 0);
  box-shadow: var(--shadow-md);
  background: #fff;      /* 底色由淡紫灰转白，卡片跟着"提"起来 */
}
.news-cover { aspect-ratio: 402 / 235; overflow: hidden; background: #e9eefb; }
.news-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .45s var(--ease-lift);
}
.news-card:hover .news-cover img { transform: scale(1.04); }
.news-body { padding: 20px 22px 24px; display: flex; flex-direction: column; flex: 1; }
.news-title {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.55;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.news-card:hover .news-title { color: var(--brand); }
.news-desc {
  margin-top: 12px;
  font-size: 14px;
  color: #5b6474;
  line-height: 1.75;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.news-date { margin-top: auto; padding-top: 18px; font-size: 13px; color: var(--muted); }

/* ---------- 底部 CTA + 页脚 ---------- */
.site-footer {
  position: relative;
  overflow: hidden;        /* 波浪层是 200% 宽，需要裁掉溢出部分 */
  isolation: isolate;
  color: #cfd3d8;
  background: linear-gradient(180deg, #242424 0%, #1c1c1c 100%);
}

/* 页脚底部两道很浅的曲面波浪，横向匀速流动、循环无缝。
   无缝原理：层宽 200%、背景块 50%（= 一个视口宽），平移 -50% 正好走完一整块，
   所以接缝处的位移与起点完全重合，永远看不出"重启"。
   速度一档 46s、一档 72s 且反向，两层错开才不会像一块板在滑动。
   两条曲线在首尾的 y 与斜率都相同，横向平铺时接缝处不会出现折角。 */
.site-footer::before,
.site-footer::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 200%;
  z-index: -1;
  pointer-events: none;
  background-repeat: repeat-x;
  background-position: left bottom;
  background-size: 50% 100%;
}
.site-footer::before {
  height: 260px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 200' preserveAspectRatio='none'%3E%3Cpath d='M0,110 C200,20 400,20 600,110 C800,200 1000,200 1200,110 L1200,200 L0,200 Z' fill='%23ffffff' fill-opacity='0.06'/%3E%3Cpath d='M0,110 C200,20 400,20 600,110 C800,200 1000,200 1200,110' fill='none' stroke='%23ffffff' stroke-opacity='0.055' stroke-width='1.6'/%3E%3C/svg%3E");
  animation: waveDrift 46s linear infinite;
}
.site-footer::after {
  height: 176px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 200' preserveAspectRatio='none'%3E%3Cpath d='M0,140 C200,92 400,92 600,140 C800,188 1000,188 1200,140 L1200,200 L0,200 Z' fill='%23ffffff' fill-opacity='0.04'/%3E%3Cpath d='M0,140 C200,92 400,92 600,140 C800,188 1000,188 1200,140' fill='none' stroke='%23ffffff' stroke-opacity='0.05' stroke-width='1.4'/%3E%3C/svg%3E");
  animation: waveDrift 72s linear infinite reverse;
}
@keyframes waveDrift {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(-50%, 0, 0); }
}
.site-footer .container { padding-top: 64px; padding-bottom: 26px; }

.cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}
.cta-title { font-size: 42px; font-weight: 700; color: #fff; letter-spacing: .5px; }
.cta-consult {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 20px;
  font-family: inherit;
  color: #fff;
  white-space: nowrap;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
}
.cta-consult svg { width: 22px; height: 22px; transition: transform .3s var(--ease); }
.cta-consult:hover { color: #8fc6ef; }
.cta-consult:hover svg { transform: translateY(3px); }

.cta-form {
  display: flex;
  gap: 14px;
  margin-top: 34px;
  flex-wrap: wrap;
}
.cta-input {
  flex: 1 1 220px;
  height: 50px;
  padding: 0 16px;
  border: 0;
  border-radius: 5px;
  background: #fff;
  font-size: 14px;
  font-family: inherit;
  color: #222;
  outline: none;
  transition: box-shadow .25s var(--ease);
}
.cta-input-wide { flex: 2 1 320px; }
.cta-input::placeholder { color: #9aa3b2; }
.cta-input:focus { box-shadow: 0 0 0 3px rgba(46, 144, 217, .32); }
.cta-submit { flex: 0 0 auto; height: 50px; padding: 0 34px; color: #fff; text-decoration: none; }

.footer-main {
  display: grid;
  grid-template-columns: 1.6fr .8fr .8fr 1fr;
  gap: 40px;
  margin-top: 56px;
  padding-top: 46px;
  border-top: 1px solid rgba(255, 255, 255, .1);
}
.footer-logo { height: 46px; width: auto; }
.footer-slogan { margin-top: 18px; font-size: 13px; line-height: 1.8; color: #a6acb5; max-width: 330px; }
.footer-col h3 { margin-bottom: 16px; font-size: 16px; font-weight: 700; color: #fff; }
.footer-col a { display: block; margin-bottom: 11px; font-size: 13px; color: #a6acb5; width: fit-content; }
.footer-col a:hover { color: #fff; }
.footer-contact p { margin-bottom: 11px; font-size: 13px; color: #a6acb5; }
.footer-contact a { display: inline; margin: 0; color: #a6acb5; }
/* 公众号：圆形按钮 + 二维码浮层
   注意选择器带上 .footer-contact —— `.footer-col a`（0,1,1）比单个类名（0,1,0）权重高，
   之前 display:grid 就是被它顶成 block，图标才偏到了圆形的左上角 */
.footer-wx { position: relative; width: fit-content; margin-top: 18px; }
.footer-contact .footer-wechat {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .12);
  color: #d8dde4;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background var(--dur-lift) var(--ease-lift),
              color var(--dur-lift) var(--ease-lift),
              box-shadow var(--dur-lift) var(--ease-lift),
              transform var(--dur-lift) var(--ease-lift);
}
.footer-contact .footer-wechat svg { display: block; width: 22px; height: 22px; }
.footer-contact .footer-wechat:hover,
.footer-contact .footer-wechat:focus-visible {
  background: var(--brand);
  color: #fff;
  transform: translateY(-3px);
  box-shadow: 0 12px 24px rgba(15, 107, 176, .34);
  outline: none;
}
.footer-contact .footer-wechat:active { transform: translateY(-1px); }

/* 浮层：底部 10px 是透明内边距，正好在按钮和卡片之间铺一条"无缝"的悬停通道，
   鼠标从按钮往上移不会因为空隙触发 mouseleave 闪一下 */
.wx-pop {
  position: absolute;
  left: 50%;
  bottom: 100%;
  width: 140px;
  margin-left: -70px;
  padding-bottom: 10px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(6px) scale(.965);
  transform-origin: 50% 100%;
  transition: opacity .24s var(--ease), transform .28s var(--ease-lift), visibility .28s;
  z-index: 6;
}
.footer-wx.is-open .wx-pop { opacity: 1; visibility: visible; transform: none; }
.wx-pop-card {
  padding: 10px 10px 9px;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 14px 32px rgba(6, 16, 30, .3);
  text-align: center;
}
.wx-pop-qr {
  width: 118px;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  margin: 0 auto;
  border-radius: 4px;
  background: #fff;
  /* 后台传的二维码原图只有 150 多像素，缩小后按最近邻重采样，
     模块边缘是硬的（默认插值会把黑白格糊在一起），手机扫码更容易识别 */
  image-rendering: -webkit-optimize-contrast;
  image-rendering: pixelated;
}
/* 浮层内部文字必须带上 .wx-pop-card 作用域：
   `.footer-contact p`（0,2,1）权重高于单个类名，会把字号顶回 13px、
   还会塞进 11px 的 margin-bottom（卡片里凭空多出一截空白） */
.wx-pop-card .wx-pop-title { margin: 8px 0 0; font-size: 12px; font-weight: 700; color: var(--ink); line-height: 1.4; }
.wx-pop-card .wx-pop-desc { margin: 2px 0 0; font-size: 10.5px; line-height: 1.5; color: var(--muted); }
/* 「长按识别」只在触屏设备上给，桌面端扫码就够了 */
.wx-pop-card .wx-pop-tip { display: none; margin: 4px 0 0; font-size: 10.5px; line-height: 1.45; color: var(--brand); }
.footer-wx.is-touch .wx-pop-tip { display: block; }
.wx-pop-arrow {
  position: absolute;
  left: 50%;
  bottom: 5px;
  width: 10px;
  height: 10px;
  margin-left: -5px;
  background: #fff;
  border-radius: 2px;
  transform: rotate(45deg);
}

.footer-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 44px;
  padding-top: 22px;
  border-top: 1px solid rgba(255, 255, 255, .08);
  font-size: 12px;
  color: #8b9099;
}
.footer-bottom a { color: #8b9099; }
.footer-bottom a:hover { color: #fff; }
.footer-bottom .sep { margin: 0 4px; }
.powered { color: #7a8089; }

/* 进入视口动效
   位移改用独立的 translate 属性：transform 留给卡片 hover，
   避免 .reveal.is-in{transform:none} 把 :hover 的上浮覆盖掉 */
.reveal {
  opacity: 0;
  translate: 0 22px;
  transition: opacity .7s var(--ease), translate .7s var(--ease),
              transform var(--dur-lift) var(--ease-lift),
              box-shadow var(--dur-lift) var(--ease-lift);
}
.reveal.is-in { opacity: 1; translate: 0 0; }

/* ---------- 响应式 ---------- */
/* 宽屏档：≥1600px 整体放大一档，全宽后内容不至于显空 */
@media (min-width: 1600px) {
  .hero { height: 500px; }
  .hero-title { font-size: 56px; }
  .hero-desc { font-size: 24px; }
  .hero-btn { height: 58px; padding: 0 46px; margin-top: 38px; }

  .sec { padding: 84px 0 92px; }
  .sec-title { font-size: 40px; }
  .sec-desc { max-width: 1320px; font-size: 17px; }
  .grid { gap: 36px; }

  .feature-card { padding: 44px 40px 50px; }
  .feature-icon { height: 178px; margin-bottom: 22px; }
  .feature-icon img { max-height: 178px; }
  .feature-title { font-size: 24px; }
  .feature-desc { font-size: 16px; }

  .lead-card { padding: 34px 30px 40px; }
  .lead-icon { height: 150px; margin-bottom: 20px; }
  .lead-icon img { max-height: 150px; }
  .lead-label { font-size: 18px; }

  .crm-icon { width: 142px; height: 142px; margin-bottom: 26px; }
  .crm-icon img { width: 84px; }
  .crm-title { font-size: 22px; }
  .crm-desc { font-size: 16px; }

  .news-body { padding: 24px 28px 30px; }
  .news-title { font-size: 20px; }

  .cta-title { font-size: 46px; }
  .footer-col h3 { font-size: 17px; }
  .footer-col a { font-size: 14px; margin-bottom: 12px; }
}

@media (max-width: 1180px) {
  .site-nav > a { padding: 8px 10px; font-size: 14px; }
  .hero-title { font-size: 42px; }
  .hero-desc { font-size: 20px; }
  .cta-title { font-size: 36px; }
}

@media (max-width: 1024px) {
  .nav-toggle { display: block; }
  /* 桌面那套 grid 三列在这里必须让位：导航变成 fixed 面板后中间列没有内容，
     会塌成一条窄缝（实测宽度只剩 120px）。改成两端对齐的 flex 最稳 */
  .header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 64px;
    gap: 12px;
  }
  .site-nav {
    position: fixed;
    top: 64px;
    left: 0;
    right: 0;
    width: auto;
    justify-self: auto;
    justify-content: flex-start;
    max-height: calc(100vh - 64px);
    overflow-y: auto;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 8px 24px 24px;
    background: #fff;
    border-top: 1px solid var(--line);
    box-shadow: 0 18px 30px rgba(17, 24, 39, .08);
    transform: translateY(-12px);
    opacity: 0;
    visibility: hidden;
    transition: opacity .28s var(--ease), transform .28s var(--ease), visibility .28s;
  }
  .site-nav.is-open { opacity: 1; visibility: visible; transform: none; }
  .site-nav > a { padding: 14px 4px; font-size: 16px; border-bottom: 1px solid #f1f3f8; }
  .site-nav > a::after { display: none; }
  /* 登录按钮现在在 header-actions 里，不参与下拉面板，
     顺带解决了面板底部把它下边框压掉的问题 */
  .nav-login { padding: 0 14px !important; height: 34px; display: inline-flex; align-items: center; font-size: 13px; border-radius: 6px; }
  .header-actions { gap: 8px; }
  .nav-toggle { margin-left: 0; }

  .brand-logo { height: 38px; }

  .hero { height: 380px; }
  .hero-title { font-size: 36px; }
  .hero-desc { font-size: 18px; }
  .hero-btn { height: 48px; padding: 0 30px; font-size: 15px; margin-top: 26px; }
  .hero-ctrl { bottom: 28px; }
  .hero-dots { bottom: 34px; }

  .sec { padding: 52px 0 58px; }
  .sec-title { font-size: 30px; }
  .grid { gap: 22px; }
  .grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cta-title { font-size: 30px; }
  .footer-main { grid-template-columns: 1fr 1fr; gap: 32px; }
  .footer-brand { grid-column: 1 / -1; }
}

@media (max-width: 720px) {
  body { font-size: 15px; }

  .hero { height: 330px; }
  .hero-slide-a::before {
    background: linear-gradient(180deg, rgba(8, 40, 80, .55) 0%, rgba(8, 40, 80, .28) 55%, rgba(8, 40, 80, .42) 100%);
  }
  .hero-title { font-size: 26px; letter-spacing: 0; }
  .hero-desc { margin-top: 10px; font-size: 15px; line-height: 1.6; }
  .hero-slide-a .hero-desc { max-width: 88%; }
  .container { width: calc(100% - 30px); }
  .hero-btn { margin-top: 22px; height: 44px; padding: 0 24px; font-size: 14px; }
  .hero-ctrl { display: none; }
  .hero-dots { bottom: 18px; left: 18px; }
  .hero-dot { width: 18px; }

  .sec { padding: 42px 0 46px; }
  .sec-head { margin-bottom: 30px; }
  .sec-title { font-size: 23px; }
  .sec-title::after { width: 36px; height: 3px; margin-top: 12px; }
  .sec-desc { margin-top: 12px; font-size: 14px; line-height: 1.7; }
  .grid-3 { grid-template-columns: 1fr; }
  .grid { gap: 16px; }
  .sec-more { margin-top: 30px; }
  .btn { height: 46px; padding: 0 26px; font-size: 15px; }

  /* 窄屏上波浪按比例缩一档，否则波长被压短、起伏会显得比桌面端抢眼 */
  .site-footer::before { height: 170px; }
  .site-footer::after { height: 112px; }

  .feature-card { padding: 24px 20px 28px; }
  .feature-icon { height: 118px; margin-bottom: 14px; }
  .feature-icon img { max-height: 118px; }
  .feature-title { font-size: 18px; }
  .feature-line { margin: 10px 0 12px; }
  .feature-desc { font-size: 14px; }

  .lead-card { padding: 20px 18px 24px; }
  .lead-icon { height: 108px; margin-bottom: 12px; }
  .lead-icon img { max-height: 108px; }
  .lead-label { font-size: 15px; }

  .crm-swiper { padding: 12px 0 14px; }
  .crm-icon { width: 96px; height: 96px; margin-bottom: 16px; }
  .crm-icon img { width: 58px; }
  .crm-title { font-size: 17px; }
  .crm-desc { font-size: 14px; }

  .news-body { padding: 16px 18px 20px; }
  .news-title { font-size: 16px; }
  .news-desc { font-size: 13px; -webkit-line-clamp: 2; }

  .site-footer .container { padding-top: 44px; }
  .cta { flex-direction: column; align-items: flex-start; gap: 12px; }
  .cta-title { font-size: 22px; line-height: 1.5; }
  .cta-consult { font-size: 16px; }
  .cta-form { margin-top: 22px; gap: 10px; }
  .cta-input, .cta-input-wide { flex: 1 1 100%; }
  .cta-submit { width: 100%; }

  .footer-main { grid-template-columns: 1fr; gap: 26px; margin-top: 34px; padding-top: 30px; }
  .footer-col h3 { margin-bottom: 12px; }
  /* 单列时联系列贴屏幕左侧，浮层居中对齐会被裁掉，改成从图标左沿向右展开 */
  .wx-pop { left: 0; margin-left: 0; width: 120px; transform-origin: 21px 100%; }
  .wx-pop-card { padding: 9px 8px 8px; border-radius: 9px; }
  .wx-pop-qr { width: 100px; }
  .wx-pop-card .wx-pop-title { margin-top: 7px; font-size: 11px; }
  .wx-pop-card .wx-pop-desc { margin-top: 2px; font-size: 10px; }
  .wx-pop-card .wx-pop-tip { margin-top: 3px; font-size: 10px; }
  .wx-pop-arrow { left: 21px; margin-left: -5px; }
  .footer-bottom { flex-direction: column; align-items: flex-start; gap: 8px; margin-top: 28px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  /* 这里只关页面级的滑动式进场，不再动组件过渡。
     原来那条 `* { transition-duration: .001ms !important }` 会把 Swiper 的 750ms
     覆盖成 0.001ms —— 点箭头就是"一帧跳到下一张"，也就是用户看到的"闪现"；
     同理卡片 hover 上浮也会被压成瞬跳。系统开"减少动画效果"的人会 100% 命中。 */
  .reveal { opacity: 1; translate: none; transition: none; }
}

/* ---------- 右下角悬浮工具：回到顶部 + 在线客服 ---------- */
/* 两个按钮竖排，客服在下、常驻，回到顶部滚过一屏才出现。
   显隐位移一律用独立的 translate 属性（和 hover 上浮同一个属性，靠权重后者胜），
   不再碰 transform —— 卡片 hover 那套已经被 transform 坑过一次。 */
.fab {
  position: fixed;
  right: 28px;
  bottom: 32px;
  z-index: 90;
  display: flex;
  flex-direction: column;
  gap: 12px;
  pointer-events: none; /* 容器不挡页面点击，只让按钮本身可点 */
}
.fab-btn {
  /* 这里不能写 overflow:hidden：左侧那个「在线客服」文字标签是按钮的子元素，
     会被一起裁掉。光晕伪元素 inset:0 + border-radius:inherit 本身就不会出界 */
  position: relative;
  isolation: isolate;
  pointer-events: auto;
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  padding: 0;
  border: 1px solid rgba(15, 107, 176, .14);
  border-radius: 50%;
  background: rgba(255, 255, 255, .96);
  color: var(--brand);
  box-shadow: 0 10px 24px rgba(11, 32, 56, .14);
  cursor: pointer;
  transition: background var(--dur-lift) var(--ease-lift),
              color var(--dur-lift) var(--ease-lift),
              border-color var(--dur-lift) var(--ease-lift),
              box-shadow var(--dur-lift) var(--ease-lift),
              translate var(--dur-lift) var(--ease-lift),
              scale .16s var(--ease),
              opacity .26s var(--ease),
              visibility .26s;
}
.fab-btn svg { width: 22px; height: 22px; display: block; }
.fab-btn:hover { translate: 0 -3px; box-shadow: 0 16px 30px rgba(11, 32, 56, .2); }
/* 和页面主按钮同一套局部光晕：浅底打品牌蓝光，蓝底打白光（小按钮半径收小） */
.fab-btn::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  pointer-events: none;
  background: radial-gradient(circle var(--glow-r, 64px) at var(--mx, 50%) var(--my, 50%),
              rgba(var(--glow, 15, 107, 176), .34) 0%,
              rgba(var(--glow, 15, 107, 176), .16) 36%,
              rgba(var(--glow, 15, 107, 176), .05) 66%,
              rgba(var(--glow, 15, 107, 176), 0) 100%);
  opacity: 0;
  transition: opacity .3s var(--ease);
}
.fab-btn:hover::before { opacity: 1; }

/* 回到顶部：默认收起（opacity 0 + visibility hidden，不可聚焦不上屏） */
.fab-top { opacity: 0; visibility: hidden; translate: 0 12px; }
.fab-top.is-show { opacity: 1; visibility: visible; translate: 0 0; }
.fab-top:hover { background: var(--brand); border-color: transparent; color: #fff; box-shadow: 0 16px 30px rgba(15, 107, 176, .34); --glow: 255, 255, 255; }

/* 在线客服：品牌渐变底，比回到顶部更醒目一点 */
.fab-service {
  --glow: 255, 255, 255;
  background: var(--brand-grad);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 12px 26px rgba(15, 107, 176, .34);
}
.fab-service:hover { box-shadow: 0 18px 34px rgba(15, 107, 176, .44); }
.fab-service:active { translate: 0 -1px; }

/* 桌面端 hover 时在按钮左侧给一个文字标签 */
.fab-label {
  position: absolute;
  right: calc(100% + 12px);
  top: 50%;
  translate: 0 -50%;
  padding: 5px 11px;
  border-radius: 7px;
  background: rgba(17, 24, 39, .92);
  color: #fff;
  font-size: 12px;
  line-height: 1.5;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .2s var(--ease), visibility .2s, translate .24s var(--ease-lift);
}
.fab-btn:hover .fab-label { opacity: 1; visibility: visible; translate: 6px -50%; }

/* ---------- 在线客服留言弹窗 ---------- */
/* 遮罩：半透明黑 + 背景模糊；面板用独立 translate / scale，避免和 hover 的 transform 打架 */
.lead-modal {
  position: fixed;
  inset: 0;
  z-index: 110; /* 低于验证码弹窗（120），提交时验证码才能盖在留言弹窗之上 */
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.lead-modal[hidden] { display: none; }
.lead-mask {
  position: absolute;
  inset: 0;
  background: rgba(8, 15, 26, .55);
  -webkit-backdrop-filter: blur(7px) saturate(.9);
  backdrop-filter: blur(7px) saturate(.9);
  opacity: 0;
  transition: opacity .26s var(--ease);
}
.lead-panel {
  position: relative;
  width: min(452px, 100%);
  max-height: calc(100vh - 48px);
  overflow-y: auto;
  padding: 30px 30px 26px;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 30px 74px rgba(6, 16, 30, .36);
  opacity: 0;
  translate: 0 16px;
  scale: .985;
  transition: opacity .24s var(--ease), translate .32s var(--ease-lift), scale .32s var(--ease-lift);
}
.lead-modal.is-open .lead-mask { opacity: 1; }
.lead-modal.is-open .lead-panel { opacity: 1; translate: 0 0; scale: 1; }
.lead-close {
  position: absolute;
  top: 14px;
  right: 14px;
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  padding: 0 0 2px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--muted);
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  transition: background .2s var(--ease), color .2s var(--ease);
}
.lead-close:hover { background: #f1f4f9; color: var(--ink); }
.lead-title { font-size: 21px; font-weight: 700; color: var(--ink); }
.lead-desc { margin-top: 8px; font-size: 13.5px; line-height: 1.6; color: var(--muted); }
.lead-form { margin-top: 20px; }
.lead-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.lead-input {
  width: 100%;
  height: 48px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #f7f9fc;
  color: var(--ink);
  font-family: inherit;
  font-size: 15px;
  transition: border-color .2s var(--ease), background .2s var(--ease), box-shadow .2s var(--ease);
}
.lead-input::placeholder { color: #a6afbd; }
.lead-input:focus {
  outline: none;
  border-color: var(--brand-2);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(46, 144, 217, .14);
}
.lead-textarea {
  height: auto;
  min-height: 96px;
  margin-top: 12px;
  padding: 12px 14px;
  line-height: 1.6;
  resize: vertical;
}
.lead-submit { width: 100%; margin-top: 16px; }
/* 白底弹窗里不能沿用页脚那套浅粉/浅绿提示色，单聊换成深一点的红与绿 */
.lead-form .cta-tip { margin-top: 12px; font-size: 13px; color: #d64545; }
.lead-form .cta-tip.is-ok { color: #12855a; }

@media (max-width: 1024px) {
  .fab { right: 20px; bottom: 24px; gap: 10px; }
  .fab-btn { width: 48px; height: 48px; }
  .fab-btn svg { width: 20px; height: 20px; }
}
@media (max-width: 720px) {
  /* 手机上贴边更近一点，拇指够得着；文字标签只在桌面 hover 时出现 */
  .fab { right: 16px; bottom: 20px; gap: 10px; }
  .fab-btn { width: 46px; height: 46px; }
  .fab-label { display: none; }
  .lead-modal { padding: 16px; align-items: center; }
  .lead-panel { padding: 26px 20px 22px; border-radius: 16px; }
  .lead-title { font-size: 19px; }
  .lead-desc { margin-top: 6px; font-size: 13px; }
  /* 手机竖排更好填：两列挤在 350px 里姓名框只剩半屏，输入时容易看漏 */
  .lead-row { grid-template-columns: 1fr; }
  .lead-textarea { min-height: 88px; }
}
/* 触屏设备没有真正的 hover：点完手指抬起后会"粘住"悬浮态（按钮一直浮起来、一直亮着），
   所以把 hover 的位移与配色撤掉，只保留按下的反馈 */
@media (hover: none) {
  .fab-btn:hover { translate: none; }
  .fab-btn:hover::before { opacity: 0; }
  .fab-top:hover { background: rgba(255, 255, 255, .96); border-color: rgba(15, 107, 176, .14); color: var(--brand); box-shadow: 0 10px 24px rgba(11, 32, 56, .14); }
  .fab-service:hover { box-shadow: 0 12px 26px rgba(15, 107, 176, .34); }
  .fab-btn:active { translate: none; scale: .95; }
}

/* ---------- 表单验证码弹窗 ---------- */
/* 服务端要求 captchaToken + captchaAnswer 成对提交，所以验证码必须在提交前拿到；
   做成弹窗而不是塞进页脚那一行，是为了不打散「姓名 / 电话 / 留言 / 提交」的横排节奏 */
.cap-modal {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.cap-modal[hidden] { display: none; }
.cap-mask {
  position: absolute;
  inset: 0;
  background: rgba(8, 26, 48, .58);
  opacity: 0;
  transition: opacity .28s var(--ease);
}
.cap-panel {
  position: relative;
  width: 100%;
  max-width: 372px;
  padding: 32px 30px 26px;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 30px 80px rgba(6, 32, 64, .34);
  text-align: center;
  opacity: 0;
  translate: 0 14px;
  transition: opacity .3s var(--ease), translate .3s var(--ease-lift);
}
.cap-modal.is-open .cap-mask { opacity: 1; }
.cap-modal.is-open .cap-panel { opacity: 1; translate: 0 0; }
.cap-close {
  position: absolute;
  top: 12px;
  right: 14px;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 6px;
  background: none;
  color: #9aa3b2;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  transition: color .2s var(--ease), background .2s var(--ease);
}
.cap-close:hover { color: #333; background: #f4f6fa; }
.cap-title { font-size: 20px; font-weight: 600; color: #1a1a1a; }
.cap-desc { margin-top: 8px; font-size: 13px; line-height: 1.6; color: #7b8494; }
.cap-figure {
  display: grid;
  place-items: center;
  height: 66px;
  margin-top: 20px;
  border-radius: 8px;
  background: #f5f7fa;
  overflow: hidden;
  cursor: pointer;
}
.cap-figure svg { display: block; width: 100%; height: 100%; }
.cap-figure.is-loading::after {
  content: "";
  width: 22px;
  height: 22px;
  border: 2px solid rgba(15, 107, 176, .22);
  border-top-color: var(--brand);
  border-radius: 50%;
  animation: capSpin .8s linear infinite;
}
@keyframes capSpin { to { transform: rotate(360deg); } }
.cap-input {
  width: 100%;
  height: 48px;
  margin-top: 14px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-family: inherit;
  font-size: 16px;
  letter-spacing: 2px;
  text-align: center;
  color: #222;
  outline: none;
  transition: border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.cap-input:focus { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(46, 144, 217, .18); }
.cap-tip { min-height: 18px; margin-top: 10px; font-size: 13px; line-height: 1.4; color: #d93f3f; }
.cap-tip.is-ok { color: #1f9d55; }
.cap-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 6px; }
.cap-actions .btn { height: 46px; padding: 0 10px; font-size: 15px; }
.cap-ok[disabled] { opacity: .6; cursor: default; }
body.cap-lock, body.lead-lock { overflow: hidden; }

/* 页脚表单的提示行：底色是深灰，错误用浅红、成功用浅绿 */
.cta-tip { flex: 1 0 100%; min-height: 18px; margin: 0; font-size: 13px; line-height: 1.4; color: #ffb0b0; }
.cta-tip.is-ok { color: #93e3af; }
/* 蜜罐字段：给爬虫填，真人看不见 */
.cta-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; pointer-events: none; }

/* 加载更多：加载中与「已经到底」都要有明确状态，否则用户不知道点了有没有反应 */
.news-more[disabled] { opacity: .55; cursor: default; }
.news-card.is-appended { animation: cardIn .42s var(--ease) both; }
@keyframes cardIn {
  from { opacity: 0; translate: 0 14px; }
  to { opacity: 1; translate: 0 0; }
}

/* ============================================================
   内页（关于 / 外呼 / 线索 / 代理 / 下载 / 联系 / 体验 / 新闻）
   与首页同一套全宽容器、同一套 0.3s 上浮动效
   ============================================================ */

/* ---------- 内页页头 ---------- */
.page-hero {
  position: relative;
  isolation: isolate;
  display: grid;
  place-items: center;
  min-height: 380px;
  padding: 104px 0 78px;
  text-align: center;
  color: #fff;
  background-color: #0b2137;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  overflow: hidden;
}
.page-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(8, 26, 46, .76) 0%, rgba(8, 26, 46, .48) 54%, rgba(8, 26, 46, .8) 100%);
}
/* 底部一团品牌色柔光，和内页白底之间有过渡，不生硬 */
.page-hero::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -150px;
  z-index: -1;
  width: 980px;
  height: 300px;
  margin-left: -490px;
  background: radial-gradient(closest-side, rgba(46, 144, 217, .5), transparent 72%);
  pointer-events: none;
}
.page-hero-inner { position: relative; z-index: 2; }
.page-hero h1 {
  font-size: 46px;
  font-weight: 700;
  line-height: 1.25;
  color: #fff;
  letter-spacing: 2px;
}
.page-hero-en {
  margin-top: 18px;
  font-size: 12px;
  letter-spacing: .34em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .7);
}
.page-hero-sub {
  max-width: 880px;
  margin: 20px auto 0;
  font-size: 17px;
  line-height: 1.85;
  color: rgba(255, 255, 255, .92);
}
.page-hero-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 14px;
  margin-top: 34px;
}
.page-hero-actions .btn { height: 50px; padding: 0 34px; }
.btn-outline {
  border: 1px solid rgba(255, 255, 255, .62);
  background: rgba(255, 255, 255, .1);
  color: #fff;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}
.btn-outline:hover { background: #fff; border-color: #fff; color: var(--brand); }

/* 各页头图 */
.phero-about { background-image: url("https://oss.linggo.holypro.xin/cus-000100007/templates/20261022/1858ba1a0a8b2a3a.jpg"); }
.phero-call { background-image: url("https://oss.linggo.holypro.xin/cus-000100007/templates/20261022/68ffe52d73b50933.jpg"); }
.phero-data { background-image: url("https://oss.linggo.holypro.xin/cus-000100007/templates/20261022/3e1a7e3d95f71fca.webp"); }
.phero-reseller { background-image: url("https://oss.linggo.holypro.xin/cus-000100007/templates/20261022/0eaabd5462e836e5.jpg"); }
.phero-contact { background-image: url("https://oss.linggo.holypro.xin/cus-000100007/templates/20261022/4a54841364ac8d07.webp"); }
.phero-apply { background-image: url("https://oss.linggo.holypro.xin/cus-000100007/templates/20261022/eae34ffd410092f8.jpg"); }

/* ---------- 两栏：文 + 图 ---------- */
.split {
  display: grid;
  grid-template-columns: 1.02fr .98fr;
  gap: 64px;
  align-items: center;
}
.split-title { font-size: 34px; font-weight: 700; }
.split-title-line {
  display: block;
  width: 54px;
  height: 3px;
  margin-top: 18px;
  border-radius: 2px;
  background: var(--brand-grad);
}
.split-text { margin-top: 20px; font-size: 16px; line-height: 1.95; color: var(--text); }
.split-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  margin-top: 34px;
}
.phone-chip {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  height: 52px;
  padding: 0 24px 0 20px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  box-shadow: var(--shadow-sm);
  transition: transform var(--dur-lift) var(--ease-lift), box-shadow var(--dur-lift) var(--ease-lift), border-color var(--dur-lift) var(--ease-lift);
}
.phone-chip:hover { transform: translate3d(0, -3px, 0); box-shadow: var(--shadow-md); border-color: rgba(15, 107, 176, .28); }
.phone-chip svg { width: 20px; height: 20px; color: var(--brand); }
.phone-chip span { font-size: 13px; color: var(--muted); }
.phone-chip b { font-size: 17px; font-weight: 700; color: var(--ink); letter-spacing: .3px; }

.split-media { position: relative; isolation: isolate; padding: 0 52px 52px 0; }
.split-media img {
  border-radius: 18px;
  box-shadow: 0 26px 60px rgba(15, 42, 74, .18);
}
.split-img-main {
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: cover;
}
/* 右下角错位叠压的第二张图，还原旧站拼贴版式 */
.split-img-sub {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 47%;
  height: auto;
  border: 6px solid #fff;
  border-radius: 12px;
}
/* 点阵装饰挪到左下角，避开叠压的小图 */
.split-media::after {
  content: '';
  position: absolute;
  left: -18px;
  right: auto;
  bottom: -18px;
  width: 132px;
  height: 132px;
  border-radius: 4px;
  background-image: radial-gradient(rgba(15, 107, 176, .28) 1.6px, transparent 1.6px);
  background-size: 12px 12px;
  z-index: -1;
}
.split-rev .split-media { order: -1; }
.split-rev .split-media::after { right: auto; left: -18px; }

/* ---------- 使命 / 愿景 ---------- */
.mission {
  position: relative;
  isolation: isolate;
  padding: 86px 0 92px;
  text-align: center;
  background: var(--soft);
  overflow: hidden;
}
.mission::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image: url("https://oss.linggo.holypro.xin/cus-000100007/templates/20261022/ed5458f9ffdc4faf.webp");
  background-position: center;
  background-size: cover;
  opacity: .55;
}
.mission-title { font-size: 38px; font-weight: 700; }
.mission-title::after {
  content: '';
  display: block;
  width: 46px;
  height: 3px;
  margin: 18px auto 0;
  border-radius: 2px;
  background: var(--brand-grad);
}
.mission-list { display: grid; gap: 16px; margin-top: 34px; }
.mission-line { font-size: 21px; line-height: 1.7; color: #39424f; }
.mission-line em { font-style: normal; font-weight: 700; color: var(--brand); }
.mission .sec-more { margin-top: 34px; }

/* ---------- 统计条 ---------- */
.stat-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
  margin-top: 54px;
}
.stat-item {
  padding: 32px 18px 28px;
  text-align: center;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  transition: transform var(--dur-lift) var(--ease-lift), box-shadow var(--dur-lift) var(--ease-lift), border-color var(--dur-lift) var(--ease-lift);
}
.stat-item:hover { transform: translate3d(0, -4px, 0); box-shadow: var(--shadow-md); border-color: rgba(15, 107, 176, .22); }
.stat-num {
  font-size: 44px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -1px;
  color: var(--brand);
  font-variant-numeric: tabular-nums;
}
.stat-num small { margin-left: 2px; font-size: 20px; font-weight: 700; }
.stat-label { margin-top: 12px; font-size: 14px; line-height: 1.6; color: var(--muted); }

/* ---------- 行业解决方案卡片 ---------- */
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.industry-card {
  display: block;
  overflow: hidden;
  border-radius: 14px;
  background: #fff;
  box-shadow: var(--shadow-sm);
  transition: transform var(--dur-lift) var(--ease-lift), box-shadow var(--dur-lift) var(--ease-lift);
}
.industry-card:hover { transform: translate3d(0, -6px, 0); box-shadow: var(--shadow-md); }
.industry-shot { position: relative; aspect-ratio: 352 / 189; overflow: hidden; background: #eef3f9; }
.industry-shot img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .45s var(--ease-lift);
}
.industry-card:hover .industry-shot img { transform: scale(1.05); }
/* 悬浮遮罩：50% 黑 + 简介 */
.industry-mask {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  padding: 14px 16px;
  background: rgba(0, 0, 0, .5);
  opacity: 0;
  transition: opacity var(--dur-lift) var(--ease-lift);
}
.industry-mask p {
  margin: 0;
  color: #fff;
  font-size: 12.5px;
  line-height: 1.62;
  letter-spacing: .01em;
  display: -webkit-box;
  -webkit-line-clamp: 6;
  line-clamp: 6;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transform: translate3d(0, 8px, 0);
  transition: transform var(--dur-lift) var(--ease-lift);
}
.industry-card:hover .industry-mask,
.industry-card:focus-visible .industry-mask { opacity: 1; }
.industry-card:hover .industry-mask p,
.industry-card:focus-visible .industry-mask p { transform: translate3d(0, 0, 0); }
/* 触屏没有真正的悬浮态，遮罩会「点一下就粘住」，直接不显示 */
@media (hover: none) {
  .industry-mask { display: none; }
}
.industry-cap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 16px 18px 18px;
}
.industry-cap h3 { font-size: 15px; font-weight: 600; line-height: 1.5; }
.industry-arw {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--muted);
  transition: background var(--dur-lift) var(--ease-lift), border-color var(--dur-lift) var(--ease-lift), color var(--dur-lift) var(--ease-lift), transform var(--dur-lift) var(--ease-lift);
}
.industry-arw svg { width: 13px; height: 13px; }
.industry-card:hover .industry-arw { background: var(--brand); border-color: var(--brand); color: #fff; transform: translateX(2px); }

/* ---------- 支持 / 条件卡片 ---------- */
.support-card {
  padding: 32px 28px 30px;
  background: #fff;
  border-radius: 16px;
  box-shadow: var(--shadow-sm);
  transition: transform var(--dur-lift) var(--ease-lift), box-shadow var(--dur-lift) var(--ease-lift);
}
.support-card:hover { transform: translate3d(0, -6px, 0); box-shadow: var(--shadow-md); }
.support-ico {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  margin-bottom: 20px;
  border-radius: 14px;
  color: var(--brand);
  background: linear-gradient(135deg, rgba(15, 107, 176, .1), rgba(46, 144, 217, .18));
}
.support-ico svg { width: 27px; height: 27px; }
.support-card h3 { font-size: 19px; font-weight: 700; }
.support-card p { margin-top: 12px; font-size: 15px; line-height: 1.85; color: var(--text); }
.cond-card { text-align: center; padding: 38px 30px 34px; }
.cond-card .support-ico {
  margin: 0 auto 24px;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 46%, #f1f7ff 0%, #e9f2ff 62%, #e3eeff 100%);
}
.cond-card .support-ico img { width: 46px; height: 46px; display: block; }
.cond-card .support-ico svg { width: 30px; height: 30px; }

/* ---------- 表单卡（联系我们 / 代理商申请） ---------- */
.form-card {
  padding: 46px 48px 42px;
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 24px 64px rgba(15, 42, 74, .1);
}
.form-card h2 { font-size: 30px; font-weight: 700; }
.form-card h2::after {
  content: '';
  display: block;
  width: 42px;
  height: 3px;
  margin-top: 16px;
  border-radius: 2px;
  background: var(--brand-grad);
}
.form-card .form-desc { margin-top: 14px; font-size: 15px; line-height: 1.8; color: var(--muted); }
/* 代理商申请：表单铺满内容宽度，标题与描述居中（对应旧站版式） */
.form-card.form-center { text-align: center; }
.form-card.form-center h2::after { margin-left: auto; margin-right: auto; }
.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 30px;
}
.form-grid .full { grid-column: 1 / -1; }
.form-grid .form-tip { grid-column: 1 / -1; }
.field {
  width: 100%;
  height: 52px;
  padding: 0 18px;
  border: 1px solid #dfe6ef;
  border-radius: 10px;
  background: #f8fafc;
  font-family: inherit;
  font-size: 15px;
  color: var(--ink);
  transition: background .25s var(--ease), border-color .25s var(--ease), box-shadow .25s var(--ease);
}
.field::placeholder { color: #9aa3b2; }
.field:focus {
  outline: 0;
  background: #fff;
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(46, 144, 217, .16);
}
textarea.field { height: auto; min-height: 148px; padding: 15px 18px; line-height: 1.75; resize: vertical; }
.form-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 18px;
  margin-top: 24px;
}
.form-tip { flex: 1 1 100%; min-height: 18px; margin: 0; font-size: 13px; line-height: 1.5; color: #d93f3f; }
.form-tip.is-ok { color: #1f9d55; }

/* ---------- 联系信息卡 ---------- */
.info-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
  margin-top: 44px;
}
.info-card {
  padding: 36px 22px 32px;
  text-align: center;
  background: #fff;
  border-radius: 16px;
  box-shadow: var(--shadow-sm);
  transition: transform var(--dur-lift) var(--ease-lift), box-shadow var(--dur-lift) var(--ease-lift);
}
.info-card:hover { transform: translate3d(0, -6px, 0); box-shadow: var(--shadow-md); }
.info-ico {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  margin: 0 auto 18px;
  border-radius: 50%;
  color: #fff;
  background: var(--brand-grad);
  box-shadow: 0 12px 24px rgba(15, 107, 176, .26);
}
.info-ico svg { width: 28px; height: 28px; }
.info-card h3 { font-size: 17px; font-weight: 700; }
.info-card p { margin-top: 10px; font-size: 14px; line-height: 1.75; color: var(--text); word-break: break-word; }

/* ---------- APP 下载 ---------- */
.dl {
  position: relative;
  isolation: isolate;
  padding: 74px 0 82px;
  text-align: center;
  color: #fff;
  overflow: hidden;
  background: linear-gradient(135deg, #0a3f6f 0%, #0f6bb0 46%, #2e90d9 100%);
}
.dl::before {
  content: '';
  position: absolute;
  z-index: -1;
  left: -12%;
  top: -34%;
  width: 64%;
  height: 130%;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(255, 255, 255, .16), transparent 70%);
}
.dl::after {
  content: '';
  position: absolute;
  z-index: -1;
  right: -14%;
  bottom: -30%;
  width: 56%;
  height: 100%;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(9, 40, 70, .35), transparent 72%);
}
.dl h1 { font-size: 44px; font-weight: 700; color: #fff; letter-spacing: 2px; }
.dl-desc { max-width: 900px; margin: 22px auto 0; font-size: 16px; line-height: 1.95; color: rgba(255, 255, 255, .92); }
.dl-stage { position: relative; width: min(320px, 74vw); margin: 46px auto 0; }
/* 必须显式 height:auto：<img height> 属性会变成 height:1467px 的呈现提示，压过宽度自适应 → 样机被拉扁 */
.dl-stage > img { width: 100%; height: auto; display: block; }
.dl-qr {
  position: absolute;
  left: 50%;
  top: 59%;
  width: 140px;
  height: 140px;
  padding: 6px;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(4, 20, 40, .26);
  transform: translate(-50%, -50%);
}
.dl-qr img { width: 100%; height: 100%; object-fit: contain; image-rendering: pixelated; }
.dl-note { margin-top: 26px; font-size: 13px; color: rgba(255, 255, 255, .78); }

/* ---------- 快速体验：浮起的功能条（标题在上，表单在下） ---------- */
.exp-bar {
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 26px;
  margin-top: 84px;
  padding: 40px 42px;
  border-radius: 18px;
  color: #fff;
  background: linear-gradient(100deg, #0f6bb0 0%, #2e90d9 100%);
  box-shadow: 0 22px 48px rgba(15, 107, 176, .3);
}
.exp-bar h2 { font-size: 23px; font-weight: 700; color: #fff; text-align: center; }
.exp-form { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px; width: 95%; }
.exp-input {
  flex: 1 1 170px;
  min-width: 0;
  height: 50px;
  padding: 0 16px;
  border: 0;
  border-radius: 8px;
  background: #fff;
  font-size: 14px;
  font-family: inherit;
  color: #16283c;
}
.exp-input::placeholder { color: #8a99ab; }
.exp-input:focus { outline: none; }
.exp-submit {
  height: 50px;
  padding: 0 42px;
  border: 0;
  border-radius: 6px;
  background: linear-gradient(180deg, #ffffff 0%, #ddeffb 100%);
  color: var(--brand);
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: none;
  transition: transform var(--dur-lift) var(--ease-lift), box-shadow var(--dur-lift) var(--ease-lift);
}
.exp-submit:hover { transform: translate3d(0, -2px, 0); box-shadow: 0 14px 28px rgba(6, 32, 60, .3); }
.exp-submit:active { transform: translate3d(0, 0, 0); }
.exp-bar .cta-tip { color: #ffd7d7; min-height: 0; }

/* ---------- 交替图文 ---------- */
.alt-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 60px;
  align-items: center;
}
.alt-row + .alt-row { margin-top: 72px; }
.alt-row.is-rev .alt-media { order: 2; }
.alt-media img {
  width: 100%;
  height: auto;   /* 必须显式置 auto，否则 img 的 height 属性会以演示性提示锁死高度 */
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 16px;
  box-shadow: 0 22px 50px rgba(15, 42, 74, .15);
}
.alt-kicker { font-size: 13px; letter-spacing: .16em; color: var(--brand); }
.alt-title { margin-top: 10px; font-size: 28px; font-weight: 700; }
.alt-text { margin-top: 16px; font-size: 15px; line-height: 1.95; color: var(--text); }

/* ---------- 新闻列表页 ---------- */
.news-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; }
.news-total { margin-top: -26px; margin-bottom: 34px; text-align: center; font-size: 14px; color: var(--muted); }

/* 内页左对齐的介绍段（企业线索页）：左文右按钮，与旧站一致 */
.data-intro {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 48px;
  margin-bottom: 44px;
}
.data-intro-main { min-width: 0; }
.data-intro .split-text { max-width: 1120px; }
.data-intro .btn { flex: 0 0 auto; }
@media (max-width: 900px) {
  .data-intro { flex-direction: column; align-items: flex-start; gap: 24px; }
  .data-intro .btn { width: 100%; }
}

/* ---------- 企业线索：产品瀑布流 ---------- */
.product-feed .industry-shot img { aspect-ratio: 352 / 189; object-fit: cover; }
.feed-sentinel { height: 1px; }
.feed-status { margin-top: 34px; text-align: center; font-size: 14px; color: var(--muted); }
.feed-status[hidden], .feed-end[hidden] { display: none; }
.feed-end { margin-top: 34px; text-align: center; font-size: 14px; color: var(--muted); }

/* ---------- 产品详情：两列（左：封面+标题+简介+按钮 / 右：正文详情） ----------
   宽度直接吃 .container（与全站内容宽度对齐），左栏固定 380，右栏吃剩下的；
   左栏 sticky 跟随，右侧截图很长时标题和按钮不会滚丢。 */
.prod-layout {
  display: grid;
  grid-template-columns: minmax(0, 380px) minmax(0, 1fr);
  gap: 56px;
  align-items: start;
  margin-top: 26px;
}
.prod-side { position: sticky; top: 96px; }
.prod-media img {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 18px;
  background: #eef3f9;
  box-shadow: 0 26px 60px rgba(15, 42, 74, .16);
}
.prod-kicker { margin-top: 26px; font-size: 13px; letter-spacing: .16em; color: var(--brand); }
.prod-title { margin-top: 10px; font-size: 30px; font-weight: 700; line-height: 1.35; }
.prod-summary { margin-top: 16px; font-size: 15px; line-height: 1.95; color: var(--text); }
.prod-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.prod-actions .btn { height: 48px; }

/* 右栏正文：复用 .article-content 的排版，去掉它的上边距，截图不放大 */
.prod-main { min-width: 0; }
/* .article-content 自带 34px 上边距，右栏要跟左栏图文顶齐，压掉（同权重，需双类选择器） */
.prod-main.article-content { margin-top: 0; font-size: 15.5px; }
.prod-main > :first-child { margin-top: 0; }
.prod-main img { border-radius: 14px; box-shadow: 0 20px 46px rgba(15, 42, 74, .12); }

/* ---------- 详情页（文章 / 产品）淡蓝渐变打底 ----------
   纯白大底配长文看久了发闷，改成「顶部微蓝 → 中部最淡 → 底部回白」的竖向渐变，
   再叠两团极淡的品牌蓝光晕（峰值 .10 / .06）收在边角，只让大面积底色透口气，
   不参与正文视线。挂 <main class="page-detail"> 上，整页一条渐变，不按区块重启。 */
.page-detail {
  background:
    radial-gradient(1000px 520px at 10% 0%, rgba(46, 144, 217, .10), rgba(46, 144, 217, 0) 66%),
    radial-gradient(880px 460px at 94% 10%, rgba(15, 107, 176, .06), rgba(15, 107, 176, 0) 70%),
    linear-gradient(180deg, #fbfdff 0%, #f4f9ff 42%, #fbfdff 100%);
}

@media (max-width: 1024px) {
  .prod-layout { grid-template-columns: 1fr; gap: 34px; }
  .prod-side { position: static; }
  .prod-title { font-size: 26px; }
  .prod-summary { font-size: 14.5px; }
}
@media (max-width: 720px) {
  .prod-title { font-size: 24px; }
  .prod-actions { flex-direction: column; }
  .prod-actions .btn { width: 100%; }
}

/* ---------- 文章详情 ---------- */
.article-wrap { max-width: 960px; margin: 0 auto; }
.crumb { display: flex; align-items: center; gap: 8px; margin-bottom: 22px; font-size: 14px; color: var(--muted); }
.crumb a:hover { color: var(--brand); }
.crumb .sep { color: #c6cdd8; }
.article-title { font-size: 38px; font-weight: 700; line-height: 1.4; }
.article-meta { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 16px; font-size: 13px; color: var(--muted); }
.article-cover { margin-top: 28px; overflow: hidden; border-radius: 16px; background: #eef3f9; }
.article-cover img { width: 100%; display: block; }
.article-content { margin-top: 34px; font-size: 16.5px; line-height: 2; color: #333d4b; }
.article-content p { margin: 18px 0; }
.article-content h2 { margin: 36px 0 14px; font-size: 24px; }
.article-content h3 { margin: 28px 0 12px; font-size: 20px; }
.article-content h4 { margin: 24px 0 10px; font-size: 17px; }
.article-content img { max-width: 100%; height: auto !important; margin: 22px auto; border-radius: 10px; }
.article-content ul, .article-content ol { margin: 16px 0; padding-left: 24px; }
.article-content li { margin: 8px 0; }
.article-content blockquote { margin: 22px 0; padding: 14px 20px; border-left: 3px solid var(--brand); background: #f5f9fd; color: #4a5666; }
.article-content a { color: var(--brand); text-decoration: underline; }
/* 正文里的媒体必须自己兜住尺寸，否则会把布局撑破 */
.article-content video { width: 100%; height: auto; display: block; }
.article-content iframe { width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0; }
.article-content table { width: 100%; margin: 20px 0; border-collapse: collapse; }
.article-content th, .article-content td { padding: 10px 12px; border: 1px solid var(--line); }
.article-back { margin-top: 44px; }
.related { margin-top: 60px; }
.related-title { margin-bottom: 26px; font-size: 24px; font-weight: 700; }

/* ---------- 分页器 ---------- */
.pager { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 48px; }
/* [hidden] 的浏览器默认 display:none 会被上面的 display:flex 盖掉，必须显式写回 */
.pager[hidden] { display: none; }
.pager-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 44px;
  padding: 0 24px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  font-size: 14px;
  color: var(--text);
  transition: border-color .25s var(--ease), color .25s var(--ease), transform var(--dur-lift) var(--ease-lift);
}
.pager-btn:hover { border-color: var(--brand); color: var(--brand); transform: translate3d(0, -2px, 0); }
.pager-btn[aria-disabled="true"] { opacity: .4; pointer-events: none; }
.pager-info { font-size: 14px; color: var(--muted); }

/* ---------- 站内搜索 ---------- */
.search-form { display: flex; gap: 12px; max-width: 720px; margin: 0 auto; }
.search-form .field { flex: 1 1 auto; }
.search-form .btn { flex: 0 0 auto; height: 52px; }
.search-block { margin-top: 52px; }
.search-empty { padding: 70px 0; text-align: center; color: var(--muted); }

/* ---------- 404 ---------- */
.nf { padding: 108px 0 118px; text-align: center; }
.nf-code {
  font-size: 128px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -5px;
  background-image: var(--brand-grad);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: var(--brand);
}
.nf h1 { margin-top: 16px; font-size: 30px; }
.nf p { margin-top: 14px; color: var(--muted); }
.nf-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin-top: 34px; }

/* ---------- MCP 端点 ---------- */
.ep-list { display: grid; gap: 14px; margin-top: 34px; }
.ep {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  padding: 18px 22px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  transition: box-shadow var(--dur-lift) var(--ease-lift), transform var(--dur-lift) var(--ease-lift);
}
.ep:hover { transform: translate3d(0, -3px, 0); box-shadow: var(--shadow-sm); }
.ep-method {
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(15, 107, 176, .1);
  font-size: 12px;
  font-weight: 700;
  color: var(--brand);
}
.ep-path { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 14px; color: #243b53; }
.ep-name { margin-left: auto; font-size: 14px; color: var(--muted); }

/* 无配图的纯渐变页头（搜索 / 404 / MCP） */
.phero-plain { background-image: linear-gradient(135deg, #0a3f6f 0%, #0f6bb0 54%, #2e90d9 100%); }
.phero-plain::before { background: linear-gradient(180deg, rgba(8, 26, 46, .3) 0%, rgba(8, 26, 46, .12) 55%, rgba(8, 26, 46, .35) 100%); }

/* ---------- 按钮内箭头 ---------- */
.btn svg { width: 18px; height: 18px; transition: transform .3s var(--ease-lift); }
.btn:hover svg { transform: translateX(3px); }

/* ---------- 外呼系统：图文卡 ---------- */
.call-card {
  overflow: hidden;
  border-radius: 16px;
  background: #fff;
  box-shadow: var(--shadow-sm);
  transition: transform var(--dur-lift) var(--ease-lift), box-shadow var(--dur-lift) var(--ease-lift);
}
.call-card:hover { transform: translate3d(0, -6px, 0); box-shadow: var(--shadow-md); }
.call-shot { aspect-ratio: 16 / 10; overflow: hidden; background: #eef6ff; }
.call-shot img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 68%;
  transition: transform .45s var(--ease-lift);
}
.call-card:hover .call-shot img { transform: scale(1.05); }
.call-body { padding: 24px 26px 26px; }
.call-body .feature-title { font-size: 20px; }
.call-body .feature-line { margin: 10px 0 12px; }
.call-body .feature-desc { font-size: 14.5px; line-height: 1.85; }

/* 内页里 .sec 之间的软底与纯白交替 */
.sec-alt { background: var(--soft); }

@media (min-width: 1600px) {
  .page-hero { min-height: 440px; padding: 124px 0 96px; }
  .page-hero h1 { font-size: 52px; }
  .page-hero-sub { font-size: 18px; }
  .split-title { font-size: 38px; }
  .split-text { font-size: 17px; }
  .stat-num { font-size: 50px; }
  .industry-cap h3 { font-size: 16px; }
  .industry-mask { padding: 18px 20px; }
  .industry-mask p { font-size: 13.5px; line-height: 1.7; }
  .alt-title { font-size: 31px; }
  .alt-text { font-size: 16px; }
  .dl h1 { font-size: 50px; }
  .form-card { padding: 54px 56px 48px; }
}

@media (max-width: 1180px) {
  .split { grid-template-columns: 1fr; gap: 40px; }
  .split-rev .split-media { order: 0; }
  .split-media { padding: 0 32px 32px 0; }
  .split-media::after { right: auto; left: 0; bottom: -14px; width: 108px; height: 108px; }
  .split-img-sub { width: 44%; border-width: 4px; }
  .grid-4 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .stat-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 42px; }
  .info-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .alt-row { gap: 38px; }
  .alt-row + .alt-row { margin-top: 52px; }
  .news-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .exp-bar { margin-top: 96px; padding: 32px 28px; }
  .exp-bar h2 { font-size: 19px; }
}

@media (max-width: 1024px) {
  .page-hero { min-height: 320px; padding: 88px 0 62px; }
  .page-hero h1 { font-size: 34px; }
  .page-hero-sub { font-size: 15px; margin-top: 16px; }
  .page-hero-actions { margin-top: 26px; }
  .split-title { font-size: 28px; }
  .mission { padding: 62px 0 66px; }
  .mission-title { font-size: 24px; }
  .mission-line { font-size: 18px; }
  .support-card { padding: 26px 22px 24px; }
  .cond-card { padding: 30px 22px 28px; }
  .alt-title { font-size: 23px; }
  .dl { padding: 66px 0 72px; }
  .dl h1 { font-size: 32px; }
  .dl-stage { width: min(280px, 70vw); margin-top: 38px; }
  .dl-qr { width: 128px; height: 128px; }
  .form-card { padding: 34px 28px 32px; }
  .form-card h2 { font-size: 24px; }
  .industry-cap { padding: 13px 14px 15px; }
  .industry-cap h3 { font-size: 14px; }
}

@media (max-width: 720px) {
  .page-hero { min-height: 260px; padding: 72px 0 52px; }
  .page-hero h1 { font-size: 26px; letter-spacing: 1px; }
  .page-hero-en { font-size: 11px; letter-spacing: .26em; }
  .page-hero-sub { font-size: 14px; line-height: 1.8; }
  .page-hero-actions .btn { height: 46px; padding: 0 24px; font-size: 15px; }
  .split-title { font-size: 23px; }
  .split-text { font-size: 15px; }
  .split-actions { margin-top: 26px; }
  .phone-chip { height: 48px; padding: 0 18px 0 15px; }
  .phone-chip b { font-size: 16px; }
  .mission-line { font-size: 16px; }
  .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  .industry-cap { padding: 12px 12px 13px; gap: 6px; }
  .industry-cap h3 { font-size: 13px; }
  .industry-arw { width: 22px; height: 22px; }
  .industry-arw svg { width: 11px; height: 11px; }
  .stat-row { gap: 12px; }
  .stat-item { padding: 22px 10px 20px; }
  .stat-num { font-size: 30px; }
  .stat-num small { font-size: 15px; }
  .stat-label { font-size: 12px; }
  .info-grid { grid-template-columns: 1fr; gap: 14px; }
  /* 手机端把联系卡压成「图标 + 两行文字」的横条：
     用 grid 让图标跨两行，标题与内容各占一行，标题不会被挤成两行 */
  .info-card {
    display: grid;
    grid-template-columns: 44px 1fr;
    gap: 4px 14px;
    align-items: center;
    padding: 18px 18px;
    text-align: left;
  }
  .info-ico { grid-row: 1 / span 2; width: 44px; height: 44px; margin: 0; }
  .info-ico svg { width: 21px; height: 21px; }
  .info-card h3 { font-size: 16px; }
  .info-card p { margin-top: 0; font-size: 13px; }
  .form-card { padding: 26px 20px 24px; border-radius: 16px; }
  .form-card h2 { font-size: 21px; }
  .form-grid { grid-template-columns: 1fr; gap: 14px; margin-top: 22px; }
  .field { height: 48px; font-size: 15px; }
  textarea.field { min-height: 120px; }
  .form-actions .btn { width: 100%; }
  .alt-row { grid-template-columns: 1fr; gap: 22px; }
  .alt-row.is-rev .alt-media { order: 0; }
  .alt-row + .alt-row { margin-top: 42px; }
  .alt-title { font-size: 21px; }
  .alt-text { font-size: 14px; line-height: 1.85; }
  .news-list { grid-template-columns: 1fr; gap: 18px; }
  .exp-bar { margin-top: 68px; padding: 26px 18px; gap: 18px; border-radius: 14px; }
  .exp-bar h2 { font-size: 17px; }
  .exp-input { flex: 1 1 100%; height: 46px; }
  .exp-submit { width: 100%; }
  .dl h1 { font-size: 26px; letter-spacing: 1px; }
  .dl-desc { font-size: 14px; line-height: 1.85; }
  .dl-stage { width: min(260px, 78vw); margin-top: 32px; }
  .dl-qr { width: 112px; height: 112px; padding: 5px; }
}

/* ---------- 快速体验：页头整体压矮 80px ---------- */
/* ---------- 内页页头：全站统一固定高度（对齐快速体验页），内容竖向居中 ---------- */
.page-hero { height: 300px; min-height: 0; padding: 0; }
@media (min-width: 1600px) { .page-hero { height: 360px; } }
@media (max-width: 1024px) { .page-hero { height: 240px; } }
/* 手机端内容换行多，改为自适应 + 保底高度，避免文字溢出 */
@media (max-width: 720px) { .page-hero { height: auto; min-height: 190px; padding: 56px 0; } }