/* ==========================================================================
   诚勤教育 官网主样式
   设计基调：青绿（#16646A）× 极简 × 科技
   ========================================================================== */

/* ---------- Design Tokens ---------- */
:root {
  /* 品牌色：取自 logo 主色 #16646A */
  --brand-900: #0B3F43;
  --brand-800: #0F5459;
  --brand-700: #135C61;
  --brand-600: #16646A;
  --brand-500: #1B8A85;
  --brand-400: #23A79A;
  --brand-300: #4FC3B4;
  --brand-100: #D6F2ED;
  --brand-50:  #EDFAF8;

  /* 高亮青绿 */
  --accent:    #2FE0AE;
  --accent-2:  #7CF5D0;
  --accent-dk: #12B98A;

  /* 深色底 */
  --ink-900: #04140F;
  --ink-800: #06201B;
  --ink-700: #0A2E28;
  --ink-600: #10423A;

  /* 中性 */
  --text:   #123330;
  --text-2: #3B5C58;
  --muted:  #6E8C88;
  --line:   #E3EEEC;
  --line-2: #D0E4E1;
  --bg:     #FFFFFF;
  --bg-soft:#F5FAF9;
  --bg-soft2:#EEF7F5;

  --grad:       linear-gradient(135deg, var(--brand-400) 0%, var(--accent) 100%);
  --grad-soft:  linear-gradient(135deg, var(--brand-50) 0%, #FFFFFF 100%);
  --grad-dark:  linear-gradient(135deg, var(--ink-800) 0%, var(--ink-700) 55%, var(--brand-800) 100%);

  /* 首页 Hero 默认背景：品牌青蓝(teal)→深墨绿，上浅下深高级渐变，叠加极光动态层 */
  --hero-grad:  linear-gradient(178deg,
                  #56BEC7 0%,
                  #37A6B1 18%,
                  #1B7F8C 42%,
                  #0D5460 68%,
                  #06333C 88%,
                  #04232B 100%);
  --hero-glow:  radial-gradient(46% 58% at 48% 26%, rgba(122, 214, 224, .5), transparent 66%);

  --shadow-sm: 0 1px 2px rgba(11, 63, 67, .06), 0 2px 8px rgba(11, 63, 67, .04);
  --shadow:    0 4px 12px rgba(11, 63, 67, .07), 0 12px 32px rgba(11, 63, 67, .06);
  --shadow-lg: 0 8px 24px rgba(11, 63, 67, .10), 0 24px 64px rgba(11, 63, 67, .10);
  --shadow-brand: 0 10px 30px rgba(22, 100, 106, .22);

  --radius-sm: 8px;
  --radius:    14px;
  --radius-lg: 20px;
  --radius-xl: 28px;

  --container: 1240px;
  --header-h: 72px;

  --ease: cubic-bezier(.22, .61, .36, 1);
  --font: "PingFang SC", "HarmonyOS Sans SC", "Microsoft YaHei", "Hiragino Sans GB",
          -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-num: "DIN Alternate", "SF Mono", "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.7;
  color: var(--text);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; display: block; border: 0; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
h1, h2, h3, h4, h5, h6 { margin: 0; font-weight: 700; line-height: 1.3; letter-spacing: -.01em; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
table { border-collapse: collapse; width: 100%; }
:focus-visible { outline: 2px solid var(--brand-400); outline-offset: 3px; border-radius: 4px; }

/* ---------- Layout ---------- */
.container { width: 100%; max-width: var(--container); margin: 0 auto; padding: 0 24px; }
.container-sm { max-width: 960px; }
.section { padding: 72px 0; position: relative; }
/* 首页各区块之间的间隙整体收窄 */
.page-home .section { padding: 52px 0; }
.section-sm { padding: 48px 0; }
.section--soft { background: var(--bg-soft); }
.section--dark { background: var(--grad-dark); color: #fff; }
.grid { display: grid; gap: 24px; }
.flex { display: flex; }
.between { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.wrap { flex-wrap: wrap; }

/* ---------- 文字 ---------- */
.eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 13px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
  color: var(--brand-500);
}
.eyebrow::before {
  content: ""; width: 24px; height: 2px; border-radius: 2px; background: var(--grad);
}
.section-title { font-size: clamp(26px, 3.4vw, 40px); margin: 12px 0 10px; }
.section-desc { color: var(--text-2); font-size: 17px; max-width: 720px; }
.grad, .grad-text {
  background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.section--dark .section-desc { color: rgba(255, 255, 255, .72); }
.section--dark .eyebrow { color: var(--accent-2); }
.section--dark .eyebrow::before { background: linear-gradient(90deg, var(--accent), var(--accent-2)); }
.ta-center { text-align: center; }
.ta-center .section-desc { margin: 0 auto; }
.ta-center .eyebrow { justify-content: center; }

.section-head { margin-bottom: 36px; }
.section-head.ta-center { text-align: center; }

/* ---------- 按钮 ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 48px; padding: 0 26px; border: 0; border-radius: 999px;
  font-size: 15px; font-weight: 600; cursor: pointer;
  transition: transform .25s var(--ease), box-shadow .25s var(--ease),
              background-color .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease);
  white-space: nowrap;
}
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }
.btn-primary { background: var(--grad); color: #fff; box-shadow: var(--shadow-brand); }
.btn-primary:hover { box-shadow: 0 16px 40px rgba(22, 100, 106, .3); }
.btn-dark { background: var(--ink-800); color: #fff; }
.btn-dark:hover { background: var(--ink-700); }
.btn-outline { background: #fff; color: var(--brand-600); border: 1.5px solid var(--line-2); }
.btn-outline:hover { border-color: var(--brand-400); color: var(--brand-500); box-shadow: var(--shadow-sm); }
.btn-ghost-light { background: rgba(255, 255, 255, .08); color: #fff; border: 1.5px solid rgba(255, 255, 255, .24); backdrop-filter: blur(6px); }
.btn-ghost-light:hover { background: rgba(255, 255, 255, .16); border-color: rgba(255, 255, 255, .45); }
.btn-sm { height: 38px; padding: 0 18px; font-size: 14px; }
.btn-lg { height: 56px; padding: 0 34px; font-size: 16px; }
.btn .arw { transition: transform .25s var(--ease); }
.btn:hover .arw { transform: translateX(4px); }

.link-more {
  display: inline-flex; align-items: center; gap: 6px;
  color: var(--brand-500); font-size: 15px; font-weight: 600;
}
.link-more .arw { transition: transform .25s var(--ease); }
.link-more:hover .arw { transform: translateX(5px); }

/* ---------- 顶部公告条 ---------- */
.topbar {
  background: var(--ink-900); color: rgba(255, 255, 255, .78);
  font-size: 13px; height: 36px; display: flex; align-items: center;
}
.topbar .container { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.topbar a:hover { color: var(--accent-2); }
.topbar-right { display: flex; align-items: center; gap: 18px; }

/* ---------- Header ---------- */
.header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(255, 255, 255, .82);
  backdrop-filter: saturate(180%) blur(16px);
  -webkit-backdrop-filter: saturate(180%) blur(16px);
  border-bottom: 1px solid transparent;
  transition: border-color .3s var(--ease), box-shadow .3s var(--ease), background .3s var(--ease);
}
.header.is-scrolled { border-bottom-color: var(--line); box-shadow: 0 4px 24px rgba(11, 63, 67, .06); }
.header-inner {
  height: var(--header-h); display: flex; align-items: center; gap: 32px;
}
.logo { display: flex; align-items: center; gap: 11px; flex-shrink: 0; }
.logo img { height: 34px; width: auto; object-fit: contain; }
.logo-mark {
  width: 36px; height: 36px; border-radius: 10px; background: var(--grad);
  display: grid; place-items: center; color: #fff; font-weight: 800; font-size: 15px;
  letter-spacing: -.5px; box-shadow: 0 6px 16px rgba(22, 100, 106, .28);
}
.logo-text { display: flex; flex-direction: column; line-height: 1.15; }
.logo-cn { font-size: 18px; font-weight: 700; letter-spacing: .04em; }
.logo-en { font-size: 10px; color: var(--muted); letter-spacing: .22em; text-transform: uppercase; }

.nav { display: flex; align-items: center; gap: 4px; margin-right: auto; }
.nav-item { position: relative; }
.nav-link {
  display: inline-flex; align-items: center; gap: 5px;
  height: var(--header-h); padding: 0 15px;
  font-size: 15px; font-weight: 500; color: var(--text);
  transition: color .2s var(--ease);
}
.nav-link:hover, .nav-item.is-active > .nav-link { color: var(--brand-600); }
.nav-link .caret { width: 12px; height: 12px; transition: transform .25s var(--ease); opacity: .6; }
.nav-item:hover .caret { transform: rotate(180deg); }
.nav-link::after {
  content: ""; position: absolute; left: 15px; right: 15px; bottom: 18px; height: 2px;
  background: var(--grad); border-radius: 2px; transform: scaleX(0); transform-origin: left;
  transition: transform .28s var(--ease);
}
.nav-item.is-active > .nav-link::after { transform: scaleX(1); }

/* 下拉菜单 */
.dropdown {
  position: absolute; top: calc(100% - 8px); left: 50%; transform: translate(-50%, 8px);
  min-width: 236px; padding: 10px;
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .22s var(--ease), transform .22s var(--ease), visibility .22s;
}
.nav-item:hover .dropdown { opacity: 1; visibility: visible; pointer-events: auto; transform: translate(-50%, 0); }
.dropdown::before { content: ""; position: absolute; top: -10px; left: 0; right: 0; height: 10px; }
.dd-item {
  display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px;
  transition: background-color .18s var(--ease);
}
.dd-item:hover { background: var(--bg-soft); }
.dd-ico {
  width: 32px; height: 32px; flex-shrink: 0; border-radius: 8px;
  /* R50：图标底色优先取后台「内容区背景底色」（--ico-bg），未设置回退品牌浅底 */
  display: grid; place-items: center; background: var(--ico-bg, var(--brand-50)); color: var(--brand-600);
}
.dd-ico svg { width: 17px; height: 17px; }
.dd-ico img { width: 17px; height: 17px; object-fit: contain; }
.dd-txt { min-width: 0; }
.dd-name { font-size: 14.5px; font-weight: 600; }
.dd-desc { font-size: 12.5px; color: var(--muted); line-height: 1.4; }

.header-actions { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.header-phone {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: 15px; font-weight: 700; color: var(--brand-600); font-variant-numeric: tabular-nums;
}
.header-phone svg { width: 16px; height: 16px; }

/* R96：站内搜索入口图标 */
.header-search {
  display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: 50%; cursor: pointer; padding: 0;
  color: var(--text-2); border: 1px solid var(--line-2); background: transparent;
  transition: color .2s, border-color .2s, background .2s;
}
.header-search:hover { color: var(--brand-600); border-color: var(--brand-600); background: var(--brand-50); }
.header-search svg { width: 18px; height: 18px; }

/* ---------- R97：页内搜索浮层 ---------- */
.search-overlay {
  position: fixed; inset: 0; z-index: 300;
  background: rgba(9, 40, 44, .42); backdrop-filter: blur(3px);
  display: flex; align-items: flex-start; justify-content: center;
  padding: 12vh 20px 40px; overflow-y: auto;
}
.search-overlay[hidden] { display: none; }
.search-panel {
  position: relative; width: 100%; max-width: 720px;
  background: #fff; border-radius: 18px; padding: 22px 22px 12px;
  box-shadow: 0 24px 60px rgba(9, 40, 44, .28);
}
.search-close {
  position: absolute; top: 12px; right: 14px; width: 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 0; background: transparent; color: var(--muted); cursor: pointer; border-radius: 50%;
}
.search-close:hover { color: var(--brand-600); background: var(--brand-50); }
.search-close svg { width: 18px; height: 18px; }
.search-field {
  display: flex; align-items: center; gap: 10px;
  padding: 0 14px; height: 52px; border-radius: 999px;
  border: 1.5px solid var(--line-2); background: var(--brand-50);
}
.search-field:focus-within { border-color: var(--brand-400); background: #fff; }
.search-ico { width: 20px; height: 20px; flex: none; color: var(--brand-600); }
.search-field input {
  flex: 1; min-width: 0; height: 100%; border: 0; background: transparent;
  font-size: 16px; color: var(--text); outline: none;
}
.search-field input::-webkit-search-cancel-button { -webkit-appearance: none; }
.search-esc { flex: none; font-size: 12px; color: var(--muted); }
.search-status { font-size: 13.5px; color: var(--muted); padding: 12px 6px 4px; min-height: 20px; }
.search-results { max-height: 52vh; overflow-y: auto; padding-bottom: 8px; }
.search-item {
  display: block; padding: 12px 14px; border-radius: 12px; text-decoration: none;
  border-bottom: 1px solid var(--line);
}
.search-item:last-child { border-bottom: 0; }
.search-item:hover { background: var(--brand-50); }
.search-item .s-type { font-size: 12px; font-weight: 700; color: var(--brand-600); }
.search-item .s-title { display: block; font-size: 15.5px; font-weight: 600; color: var(--text); margin-top: 2px; }
.search-item:hover .s-title { color: var(--brand-600); }
.search-item .s-sum {
  display: block; font-size: 13px; color: var(--muted); margin-top: 4px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.search-quick { padding: 4px 6px 12px; font-size: 13px; color: var(--muted); }
.search-quick a {
  display: inline-block; margin: 6px 6px 0 0; padding: 5px 12px; border-radius: 999px;
  background: var(--brand-50); color: var(--brand-600); font-size: 13px; text-decoration: none;
}
.search-quick a:hover { background: var(--brand-100); }
/* 搜索结果页：关键词胶囊（替代原全角引号「」，避免部分字体渲染成黑色方块） */
.search-kw {
  display: inline-block; margin: 0 4px; padding: 1px 10px; border-radius: 999px;
  background: var(--brand-100); color: var(--brand-700); font-weight: 600;
}
/* 搜索结果页表单：浅色首屏下的浅色控件（原 inline 样式是给深色首屏写的，白字白边看不见） */
.page-search-form { max-width: 560px; margin: 24px auto 0; display: flex; gap: 10px; }
.page-search-form input {
  flex: 1; min-width: 0; height: 48px; padding: 0 18px; border-radius: 999px;
  border: 1.5px solid var(--line-2); background: #fff; color: var(--text); font-size: 15px;
}
.page-search-form input:focus { outline: none; border-color: var(--brand-400); }
.search-all { display: block; text-align: center; padding: 12px; font-size: 13.5px; color: var(--brand-600); font-weight: 600; }
@media (max-width: 640px) {
  .search-overlay { padding: 8vh 14px 30px; }
  .search-esc { display: none; }
  .search-results { max-height: 58vh; }
}

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

/* 移动端抽屉 */
.mobile-nav {
  position: fixed; inset: var(--header-h) 0 0 0; z-index: 99;
  background: #fff; padding: 16px 24px 40px; overflow-y: auto;
  transform: translateY(-12px); opacity: 0; visibility: hidden;
  transition: opacity .25s var(--ease), transform .25s var(--ease), visibility .25s;
}
.mobile-nav.is-open { opacity: 1; visibility: visible; transform: translateY(0); }
.m-group { border-bottom: 1px solid var(--line); }
.m-group > summary {
  list-style: none; cursor: pointer; padding: 16px 0; font-size: 17px; font-weight: 600;
  display: flex; align-items: center; justify-content: space-between;
}
.m-group > summary::-webkit-details-marker { display: none; }
.m-group[open] > summary { color: var(--brand-600); }
.m-sub { padding: 0 0 12px 14px; }
.m-sub a { display: block; padding: 10px 0; font-size: 15px; color: var(--text-2); }
.m-sub a:active { color: var(--brand-600); }
/* R64：无下拉的一级项（客户案例/新闻动态），直接点击进入栏目页 */
.m-link {
  display: block; width: 100%; padding: 16px 0; font-size: 17px; font-weight: 600;
  color: var(--text); border-bottom: 1px solid var(--line);
}
/* R97：移动端「站内搜索」是 button（用于打开浮层），这里抹平浏览器默认按钮样式 */
button.m-link { background: transparent; border: 0; border-bottom: 1px solid var(--line); text-align: left; font-family: inherit; cursor: pointer; }
.m-link:active, .m-link.is-active { color: var(--brand-600); }

/* ==========================================================================
   HERO
   ========================================================================== */
.hero {
  position: relative; overflow: hidden;
  background: var(--hero-grad); color: #fff;
  transition: background .6s var(--ease);
  padding: 64px 0 0;
  min-height: 600px;
}
.hero-bg { position: absolute; inset: 0; pointer-events: none; background-size: cover; background-position: center; background-repeat: no-repeat; transition: background-image .5s var(--ease); }
.hero-overlay { position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(4,20,15,.55) 0%, rgba(4,20,15,.15) 38%, rgba(4,20,15,.4) 100%); transition: opacity .5s var(--ease); pointer-events: none; }
/* 光晕（动态浮动） */
.orb { position: absolute; border-radius: 50%; filter: blur(70px); opacity: .55; will-change: transform; }
.orb-1 { width: 520px; height: 520px; top: -180px; left: -120px; background: radial-gradient(circle, rgba(90, 201, 212, .62), transparent 68%); animation: orbDrift1 16s ease-in-out infinite; }
.orb-2 { width: 460px; height: 460px; bottom: -220px; right: -80px; background: radial-gradient(circle, rgba(45, 158, 170, .55), transparent 68%); animation: orbDrift2 20s ease-in-out infinite; }
.orb-3 { width: 340px; height: 340px; top: 38%; left: 44%; background: radial-gradient(circle, rgba(110, 209, 220, .34), transparent 70%); animation: orbDrift3 13s ease-in-out infinite; }
@keyframes orbDrift1 { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(60px,-40px) scale(1.1); } }
@keyframes orbDrift2 { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(-50px,30px) scale(1.08); } }
@keyframes orbDrift3 { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(30px,40px) scale(1.15); } }

/* 极光动态层 — 多层径向 + conic 缓慢旋转 + 呼吸，模糊后形成流动光晕 */
.hero-aurora {
  position: absolute; inset: -25%; z-index: 0; pointer-events: none;
  background:
    radial-gradient(38% 48% at 18% 22%, rgba(122, 214, 224, .42), transparent 62%),
    radial-gradient(32% 42% at 82% 18%, rgba(80, 188, 200, .38), transparent 65%),
    radial-gradient(45% 55% at 55% 80%, rgba(35, 128, 138, .4), transparent 62%),
    conic-gradient(from 0deg at 50% 50%, rgba(122,214,224,.10), rgba(45,158,170,.05), rgba(122,214,224,.10));
  filter: blur(28px);
  transform-origin: 50% 50%;
  animation: auroraSpin 42s linear infinite, auroraPulse 9s ease-in-out infinite;
  will-change: transform, opacity;
}
@keyframes auroraSpin  { to { transform: rotate(360deg); } }
@keyframes auroraPulse { 0%,100% { opacity: .9; } 50% { opacity: 1; } }
/* 扫描线 */
.hero-scan {
  position: absolute; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(122, 214, 224, .5), transparent);
  animation: scan 7s linear infinite;
}
@keyframes scan { 0% { top: 0; opacity: 0; } 8% { opacity: 1; } 92% { opacity: 1; } 100% { top: 100%; opacity: 0; } }

/* 减少动效偏好：关闭循环动画与背景过渡 */
@media (prefers-reduced-motion: reduce) {
  .orb-1, .orb-2, .orb-3, .hero-aurora, .hero-scan { animation: none; }
  .hero, .hero-bg, .hero-overlay { transition: none; }
}

.hero .container { position: relative; z-index: 2; }
.hero-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 56px; align-items: center; min-height: 420px; }
.hero-grid--full { grid-template-columns: 1fr; }

.hero-title {
  font-size: clamp(34px, 4.6vw, 58px); line-height: 1.18; letter-spacing: -.02em; font-weight: 800;
}
.hero-title .hl {
  background: linear-gradient(100deg, var(--accent-2), var(--accent) 45%, var(--brand-300));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.hero-sub { margin-top: 18px; font-size: 17.5px; line-height: 1.85; color: rgba(255, 255, 255, .76); max-width: 540px; }
.hero-actions { margin-top: 28px; display: flex; gap: 14px; flex-wrap: wrap; }
.hero-content { display: flex; flex-direction: column; }
.hero-content--center { text-align: center; align-items: center; margin: 0 auto; }

/* Hero 右侧数据面板 */
.hero-visual-slides { display: grid; grid-template-areas: 'stack'; }
.hero-visual-slide { grid-area: stack; position: relative; opacity: 0; visibility: hidden; transition: opacity .5s var(--ease), visibility .5s var(--ease); }
.hero-visual-slide.is-active { opacity: 1; visibility: visible; }
.dash-card {
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: var(--radius-lg);
  padding: 20px;
  backdrop-filter: blur(14px);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .3);
}
.dash-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.dash-title { font-size: 14px; font-weight: 600; color: rgba(255, 255, 255, .9); }
.dash-chip {
  font-size: 11px; padding: 3px 9px; border-radius: 999px;
  background: rgba(47, 224, 174, .16); color: var(--accent-2); border: 1px solid rgba(47, 224, 174, .3);
}
.dash-kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 16px; }
.dash-kpi { background: rgba(255, 255, 255, .05); border-radius: 10px; padding: 11px 12px; }
.dash-kpi span { display: block; font-size: 11.5px; color: rgba(255, 255, 255, .58); }
.dash-kpi b { display: block; font-size: 19px; font-weight: 700; font-family: var(--font-num); color: #fff; }
.dash-kpi em { font-style: normal; font-size: 11px; color: var(--accent); margin-left: 3px; }
.dash-chart { display: flex; align-items: flex-end; gap: 7px; height: 108px; padding-top: 8px; }
.dash-bar {
  flex: 1; border-radius: 5px 5px 2px 2px;
  background: linear-gradient(180deg, var(--accent), rgba(35, 167, 154, .35));
  animation: barGrow 1.4s var(--ease) both;
}
.dash-bar:nth-child(even) { background: linear-gradient(180deg, rgba(124, 245, 208, .9), rgba(35, 167, 154, .2)); }
@keyframes barGrow { from { height: 4px !important; opacity: .3; } }
.dash-rows { margin-top: 16px; display: grid; gap: 9px; }
.dash-row { display: flex; align-items: center; gap: 10px; font-size: 12.5px; color: rgba(255, 255, 255, .72); }
.dash-row .nm { width: 74px; flex-shrink: 0; }
.dash-row .tr { flex: 1; height: 6px; border-radius: 3px; background: rgba(255, 255, 255, .1); overflow: hidden; }
.dash-row .fl { height: 100%; border-radius: 3px; background: var(--grad); animation: fillGrow 1.6s var(--ease) both; transform-origin: left; }
@keyframes fillGrow { from { transform: scaleX(0); } }
.float-badge {
  position: absolute; display: flex; align-items: center; gap: 9px;
  padding: 11px 15px; border-radius: 12px; font-size: 12.5px; font-weight: 600;
  background: rgba(6, 32, 27, .82); border: 1px solid rgba(255, 255, 255, .16);
  backdrop-filter: blur(10px); box-shadow: 0 12px 30px rgba(0, 0, 0, .28);
  animation: floatY 5s ease-in-out infinite;
}
.float-badge .ic { width: 22px; height: 22px; border-radius: 6px; background: var(--grad); display: grid; place-items: center; font-size: 11px; }
/* 两个装饰性徽章：相对数据面板定位，一右上、一左下（贴面板外缘，不遮内容） */
.float-badge.b1 { top: -20px; right: -14px; }
.float-badge.b2 { bottom: -22px; left: -34px; animation-delay: -2.4s; }
@keyframes floatY { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }

/* 首页轮播（多张 banner 时） */
.hero-slides { position: relative; }
.hero-slide { display: none; }
.hero-slide.is-active { display: block; animation: fadeUp .7s var(--ease) both; }
@keyframes fadeUp { from { opacity: 0; transform: translateY(18px); } }

/* 轮播进度条指示器：每个 dot 是胶囊背景，active 时内部 hp-bar 从 0% 走到 100% */
.hero-dots {
  position: absolute;
  left: 0;
  bottom: 8px;
  z-index: 5;
  display: flex;
  gap: 8px;
  --hp-duration: 6000ms;
}
.hero-dots button {
  position: relative;
  width: 32px;
  height: 4px;
  border: 0;
  padding: 0;
  border-radius: 2px;
  cursor: pointer;
  background: rgba(255, 255, 255, .26);
  overflow: hidden;
  transition: background-color .3s, width .3s var(--ease);
}
.hero-dots button .hp-bar {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 0%;
  border-radius: 2px;
  background: var(--accent);
  pointer-events: none;
}
.hero-dots button.is-active {
  width: 44px;
  background: rgba(255, 255, 255, .35);
}
.hero-dots button.is-active .hp-bar {
  animation: heroProgress var(--hp-duration) linear forwards;
}
/* hover 或页面不可见时暂停进度条 */
.hero--paused .hero-dots button.is-active .hp-bar,
.hero-dots button.is-active .hp-bar.paused {
  animation-play-state: paused;
}
@keyframes heroProgress { from { width: 0%; } to { width: 100%; } }

/* ---------- 数据条 ---------- */
.stats {
  position: relative; z-index: 3; margin-top: 44px;
  background: rgba(255, 255, 255, .055); border-top: 1px solid rgba(255, 255, 255, .1);
  backdrop-filter: blur(10px);
}
.stats-inner {
  display: grid; grid-template-columns: repeat(5, 1fr);
  max-width: var(--container); margin: 0 auto; padding: 0 24px;
}
.stat {
  padding: 22px 12px; text-align: center; position: relative;
}
.stat + .stat::before {
  content: ""; position: absolute; left: 0; top: 26%; bottom: 26%; width: 1px;
  background: linear-gradient(180deg, transparent, rgba(255, 255, 255, .16), transparent);
}
.stat-num {
  font-family: var(--font-num); font-size: 38px; font-weight: 700; line-height: 1;
  letter-spacing: -.02em; font-variant-numeric: tabular-nums;
  background: linear-gradient(180deg, #fff, var(--accent-2));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.stat-num .u { font-size: 20px; margin-left: 2px; }
.stat-label { margin-top: 9px; font-size: 13.5px; color: rgba(255, 255, 255, .62); }

/* ---------- 客户案例校徽墙：4 行循环滚动 ---------- */
.case-marquee {
  margin-top: 38px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  /* 两侧渐隐遮罩，滚动出入更柔和 */
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.case-row { overflow: hidden; }
.case-track {
  display: flex;
  gap: 12px;
  width: max-content;
  animation: caseScroll linear infinite;
  will-change: transform;
}
.case-row--rev .case-track { animation-direction: reverse; }
/* 只暂停鼠标所在行，其他行正常滚动 */
.case-row:hover .case-track { animation-play-state: paused; }
@keyframes caseScroll {
  from { transform: translateX(0); }
  to { transform: translateX(calc(-50% - 6px)); /* 50% + 半个 gap，保证两份内容无缝衔接 */ }
}
.case-logo-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 228px;
  aspect-ratio: 34 / 9;
  padding: 5px 7px;
  background: #fff;
  border: 0;
  border-radius: 10px;
  overflow: hidden;
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.case-logo-cell:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg);
}
.case-logo-cell img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
@media (max-width: 900px) {
  .case-marquee { gap: 12px; }
  .case-logo-cell { width: 190px; }
}
@media (max-width: 560px) {
  .case-marquee { gap: 10px; }
  .case-logo-cell { width: 150px; padding: 8px 10px; }
}

/* ---------- 架构图 ---------- */
.arch { display: grid; gap: 18px; }
.arch-scenes {
  display: flex; flex-wrap: wrap; gap: 10px; justify-content: center;
}
.arch-scene {
  padding: 8px 18px; border-radius: 999px; font-size: 14px; color: var(--brand-600);
  background: #fff; border: 1px solid var(--line-2); box-shadow: var(--shadow-sm);
  transition: transform .25s var(--ease), background-color .25s, color .25s;
}
.arch-scene:hover { transform: translateY(-3px); background: var(--grad); color: #fff; border-color: transparent; }
.arch-arrow { display: grid; place-items: center; height: 30px; }
.arch-arrow i {
  display: block; width: 2px; height: 100%;
  background: linear-gradient(180deg, var(--brand-300), var(--accent));
  position: relative;
}
.arch-arrow i::after {
  content: ""; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);
  border: 5px solid transparent; border-top-color: var(--accent);
}
.arch-ability {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px;
  padding: 22px; border-radius: var(--radius-lg);
  background: var(--grad-soft); border: 1px solid var(--line);
}
.arch-ability .ab { text-align: center; }
.arch-ability .ab .n {
  width: 40px; height: 40px; margin: 0 auto 10px; border-radius: 12px;
  display: grid; place-items: center; font-size: 15px; font-weight: 800;
  background: var(--grad); color: #fff; box-shadow: 0 8px 18px rgba(22, 100, 106, .2);
}
.arch-ability .ab b { display: block; font-size: 15px; }
.arch-ability .ab span { display: block; margin-top: 4px; font-size: 12.5px; color: var(--muted); line-height: 1.5; }
.arch-base {
  padding: 24px 28px; border-radius: var(--radius-lg);
  background: var(--grad-dark); color: #fff; text-align: center;
  box-shadow: var(--shadow-lg); position: relative; overflow: hidden;
}
.arch-base::after {
  content: ""; position: absolute; inset: -50% -10%;
  background: radial-gradient(circle at 50% 50%, rgba(47, 224, 174, .18), transparent 60%);
}
.arch-base b { position: relative; font-size: 20px; }
.arch-base span { position: relative; display: block; margin-top: 8px; font-size: 14px; color: rgba(255, 255, 255, .68); }

/* ---------- 产品卡 ---------- */
.prod-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.prod-card {
  position: relative; display: flex; flex-direction: column;
  padding: 30px; border-radius: var(--radius-lg);
  background: #fff; border: 1px solid var(--line);
  overflow: hidden; isolation: isolate;
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease), background-color .35s var(--ease);
}
/* R54：悬浮 = 整卡上浮 + 右下角方向投影（无内部填色）。
   R57：投影色 = 该产品后台「内容区背景底色」的同色相柔和版（--prod-hover-c）。
   底色通常极浅（如 #f9f6fe），原值叠在白卡下不可见，故由 render.js 保持其色相、
   把饱和度/明度规整到柔和区间后再输出——投影始终是「该产品自己的颜色」，
   不再与深墨绿混色（混色会让投影整体偏灰发黑，与用户所选底色不符）。
   未设置底色的条目回退到品牌青绿（--prod-hover-rgb）。 */
.prod-card:hover {
  transform: translateY(-6px); border-color: transparent;
  box-shadow: 16px 18px 42px var(--prod-hover-c, rgb(var(--prod-hover-rgb, 47, 224, 174)));
}
.prod-ico {
  width: 52px; height: 52px; border-radius: 15px; display: grid; place-items: center;
  /* R50：图标底色优先取后台「内容区背景底色」（--ico-bg），未设置回退品牌浅底 */
  background: var(--ico-bg, var(--brand-50)); color: var(--brand-600); margin-bottom: 20px;
  transition: background-color .3s var(--ease), color .3s var(--ease), transform .3s var(--ease);
}
.prod-card:hover .prod-ico { background: var(--grad); color: #fff; transform: scale(1.06) rotate(-4deg); }
.prod-ico svg { width: 26px; height: 26px; }
.prod-ico img { width: 26px; height: 26px; object-fit: contain; }
/* 自定义图标（后台上传图片）时保留浅色底、不做渐变翻转，避免图片压在彩色渐变上 */
.prod-card:hover .prod-ico.has-img { background: var(--ico-bg, var(--brand-50)); color: var(--brand-600); transform: scale(1.06); }
.prod-name { font-size: 20px; }
.prod-en { margin-top: 4px; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
/* R51：卡片强调文字（小标题）字色跟随该产品后台「首屏主题颜色」，未设置回退原品牌色 */
.prod-tagline { margin-top: 12px; font-size: 14.5px; font-weight: 600; color: var(--prod-theme, var(--brand-600)); }
.prod-card .link-more { color: var(--prod-theme, var(--brand-500)); }
.prod-sum { margin-top: 10px; font-size: 14.5px; color: var(--text-2); line-height: 1.75; }
.prod-foot { margin-top: 22px; padding-top: 18px; border-top: 1px dashed var(--line-2); display: flex; align-items: center; justify-content: space-between; }
.prod-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.prod-tag { font-size: 12px; padding: 3px 9px; border-radius: 6px; background: var(--bg-soft2); color: var(--text-2); }

/* ---------- 解决方案卡 ---------- */
.sol-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.sol-card {
  position: relative; padding: 28px 26px; border-radius: var(--radius);
  background: #fff; border: 1px solid var(--line); overflow: hidden;
  transition: transform .32s var(--ease), box-shadow .32s var(--ease);
}
.sol-card::after {
  content: ""; position: absolute; left: 0; top: 0; right: 0; height: 3px;
  background: var(--grad); transform: scaleX(0); transform-origin: left;
  transition: transform .38s var(--ease);
}
.sol-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.sol-card:hover::after { transform: scaleX(1); }
.sol-ico { width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; background: var(--brand-50); color: var(--brand-600); margin-bottom: 18px; }
.sol-ico svg { width: 22px; height: 22px; }
.sol-ico img { width: 22px; height: 22px; object-fit: contain; }
.sol-name { font-size: 18px; }
.sol-tagline { margin-top: 8px; font-size: 14px; color: var(--brand-600); font-weight: 600; }
.sol-sum { margin-top: 10px; font-size: 14px; color: var(--text-2); line-height: 1.72; }
.sol-link { margin-top: 18px; display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--brand-500); }

/* ---------- AI 专区 ---------- */
.ai-sec { position: relative; overflow: hidden; }
/* 网格装饰已移除：保持简洁纯色背景 */
.ai-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; position: relative; }
.ai-card {
  padding: 32px; border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .12);
  backdrop-filter: blur(10px);
  transition: transform .32s var(--ease), background-color .32s var(--ease), border-color .32s var(--ease);
}
.ai-card:hover { transform: translateY(-5px); background: rgba(255, 255, 255, .08); border-color: rgba(124, 245, 208, .34); }
.ai-card h3 { font-size: 22px; color: #fff; }
.ai-card .en { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--accent-2); margin-top: 6px; }
.ai-card .sum { margin-top: 16px; font-size: 15px; color: rgba(255, 255, 255, .72); line-height: 1.8; }
.ai-list { margin-top: 22px; display: grid; gap: 12px; }
.ai-list li { display: flex; gap: 11px; font-size: 14.5px; color: rgba(255, 255, 255, .8); }
.ai-list li::before {
  content: ""; flex-shrink: 0; width: 18px; height: 18px; margin-top: 3px; border-radius: 50%;
  background: rgba(47, 224, 174, .18); border: 1px solid rgba(47, 224, 174, .5);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237CF5D0' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  background-size: 11px; background-repeat: no-repeat; background-position: center;
}

/* ---------- 特色/理由 ---------- */
.why-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.why-card {
  padding: 28px; border-radius: var(--radius); background: #fff; border: 1px solid var(--line);
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.why-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.why-num { font-family: var(--font-num); font-size: 30px; font-weight: 700; color: var(--brand-100); line-height: 1; }
.why-card h4 { margin-top: 12px; font-size: 17.5px; }
.why-card p { margin-top: 8px; font-size: 14.5px; color: var(--text-2); line-height: 1.75; }

/* 解决方案详情页 - 方案要点优化 */
.section-sol-points { --sol-point-top: 3px; }
.sol-points-grid { grid-template-columns: repeat(4, 1fr); gap: 22px; }
.sol-point-card {
  position: relative;
  padding: 28px 26px 30px;
  border-radius: var(--radius-lg);
  background: #fff;
  border: 1px solid var(--line);
  overflow: hidden;
  transition: transform .32s var(--ease), box-shadow .32s var(--ease), border-color .32s var(--ease);
}
.sol-point-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: var(--sol-point-top);
  background: var(--brand);
  opacity: .85;
}
.sol-point-card:hover {
  transform: translateY(-6px);
  border-color: var(--brand-300);
  box-shadow: var(--shadow-lg);
}
.sol-point-card .why-num {
  position: absolute;
  right: 14px; bottom: 8px;
  font-size: 62px;
  font-weight: 800;
  color: var(--brand-100);
  opacity: .16;
  line-height: 1;
  z-index: 0;
  user-select: none;
  pointer-events: none;
}
.sol-point-card h4 {
  position: relative;
  z-index: 1;
  margin-top: 0;
  font-size: 18px;
  font-weight: 600;
  color: var(--text);
  line-height: 1.45;
}
.sol-point-card p {
  position: relative;
  z-index: 1;
  margin-top: 10px;
  font-size: 14px;
  color: var(--text-2);
  line-height: 1.8;
}

/* 解决方案详情页 - 方案详情正文 */
.section-sol-detail { padding-top: 64px; padding-bottom: 72px; }
.section-sol-detail .section-head { margin-bottom: 30px; }
.sol-detail-body {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 44px 56px;
  box-shadow: var(--shadow-sm);
}
.sol-detail-body.markdown { font-size: 16px; line-height: 1.85; color: var(--text); }
.sol-detail-body.markdown > *:first-child { margin-top: 0 !important; }
.sol-detail-body.markdown h2 {
  font-size: 24px;
  margin: 36px 0 16px;
  padding-left: 14px;
  border-left: 4px solid var(--brand-500);
  line-height: 1.4;
}
.sol-detail-body.markdown h3 {
  font-size: 21px;
  margin: 34px 0 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
  color: var(--ink-900);
  font-weight: 700;
}
.sol-detail-body.markdown h3:first-child { margin-top: 0; }
.sol-detail-body.markdown p { margin: 0 0 14px; color: var(--text-2); font-size: 15.5px; }
.sol-detail-body.markdown strong { color: var(--brand-700); font-weight: 700; }
.sol-detail-body.markdown ol {
  list-style: none;
  counter-reset: sol-ol;
  padding: 0;
  margin: 0 0 22px;
  display: grid;
  gap: 12px;
}
.sol-detail-body.markdown ol > li {
  counter-increment: sol-ol;
  position: relative;
  padding: 14px 18px 14px 58px;
  background: var(--bg-soft2);
  border-radius: 10px;
  font-size: 15px;
  line-height: 1.75;
  color: var(--text);
}
.sol-detail-body.markdown ol > li::before {
  content: counter(sol-ol, decimal-leading-zero);
  position: absolute;
  left: 14px;
  top: 14px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--brand-500);
  color: #fff;
  font-family: var(--font-num);
  font-size: 12px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sol-detail-body.markdown ul {
  list-style: none;
  padding: 0;
  margin: 0 0 22px;
  display: grid;
  gap: 10px;
}
.sol-detail-body.markdown ul > li {
  position: relative;
  padding: 12px 18px 12px 44px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 10px;
  font-size: 15px;
  line-height: 1.7;
  color: var(--text-2);
}
.sol-detail-body.markdown ul > li::before {
  content: "";
  position: absolute;
  left: 18px;
  top: 22px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--brand-500);
  box-shadow: 0 0 0 4px rgba(47, 224, 174, .15);
}
.sol-detail-cta { margin-top: 44px; text-align: center; }

/* 产品详情页 - 详细说明区紧凑化并与上方卡片统一 */
.section-pd-values { padding-bottom: 32px; }
.section-pd-detail { padding-top: 20px; padding-bottom: 32px; }
.section-pd-detail .section-head { margin-bottom: 16px; }
.section-pd-detail .section-head .eyebrow { margin-bottom: 4px; }
.section-pd-detail .sol-detail-body {
  position: relative;
  padding: 22px 28px;
  border-radius: var(--radius);
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}
.section-pd-detail .sol-detail-body::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: var(--grad);
  transform: scaleX(0.30);
  transform-origin: left center;
  transition: transform .45s var(--ease);
  opacity: .8;
}
.section-pd-detail .sol-detail-body:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow);
  border-color: rgba(11, 63, 67, .18);
}
.section-pd-detail .sol-detail-body:hover::before {
  transform: scaleX(1);
}
/* 产品详情卡片内部进一步精简，与 why-card 体量协调 */
/* 卡片本身占满 1240px 容器（与上方价值区框架对齐），内部文字列限宽居中保证可读性 */
.section-pd-detail .sol-detail-body .markdown {
  max-width: 940px;
  margin: 0 auto;
  font-size: 14.5px;
  line-height: 1.8;
  color: var(--text);
}
.section-pd-detail .sol-detail-body .markdown > *:first-child { margin-top: 0 !important; }

.section-pd-detail .sol-detail-cta { margin-top: 20px; }
.section-pd-detail .sol-detail-cta .btn {
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.section-pd-detail .sol-detail-cta .btn:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 14px 30px rgba(11, 63, 67, .2);
}
/* 相关产品区：压缩与上方 Demo 按钮的空隙 */
.section-pd-others { padding-top: 32px; padding-bottom: 64px; }
.section-pd-others .section-head { margin-bottom: 24px; }
@media (max-width: 720px) {
  .section-pd-values { padding-bottom: 24px; }
  .section-pd-detail { padding-top: 18px; padding-bottom: 24px; }
  .section-pd-detail .sol-detail-body { padding: 18px; }
  .section-pd-detail .sol-detail-cta { margin-top: 18px; }
  .section-pd-others { padding-top: 24px; padding-bottom: 52px; }
}
@media (max-width: 720px) {
  .sol-detail-body { padding: 28px 22px; }
  .sol-detail-body.markdown h2 { font-size: 21px; }
  .sol-detail-body.markdown h3 { font-size: 19px; }
}
@media (max-width: 1170px) {
  .sol-points-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .sol-points-grid { grid-template-columns: 1fr; }
}

/* ---------- 新闻/案例 ---------- */
.news-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.post-card {
  display: flex; flex-direction: column; border-radius: var(--radius-lg); overflow: hidden;
  background: #fff; border: 1px solid var(--line);
  transition: transform .32s var(--ease), box-shadow .32s var(--ease);
}
.post-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.post-cover { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: var(--grad-soft); }
.post-cover img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.post-card:hover .post-cover img { transform: scale(1.06); }
.post-cover .ph {
  position: absolute; inset: 0; display: grid; place-items: center;
  background: linear-gradient(135deg, var(--brand-600), var(--accent));
  color: rgba(255, 255, 255, .9);
}
.post-cover .ph svg { width: 48px; height: 48px; opacity: .5; }
.post-body { padding: 24px; display: flex; flex-direction: column; flex: 1; }
.post-meta { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--muted); }
.post-cat { padding: 3px 10px; border-radius: 6px; background: var(--brand-50); color: var(--brand-600); font-weight: 600; font-size: 12.5px; }
.post-title { margin-top: 12px; font-size: 17.5px; line-height: 1.5; transition: color .25s; }
.post-card:hover .post-title { color: var(--brand-600); }
.post-sum {
  margin-top: 10px; font-size: 14.5px; color: var(--text-2); line-height: 1.75;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.post-foot { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; }

/* 列表行式 */
.post-list { display: grid; gap: 0; }
.post-row {
  display: grid; grid-template-columns: 116px 1fr auto; gap: 28px; align-items: center;
  padding: 26px 4px; border-bottom: 1px solid var(--line);
  transition: background-color .25s var(--ease), padding .25s var(--ease);
}
.post-row:hover { background: var(--bg-soft); border-radius: var(--radius); padding-left: 18px; padding-right: 18px; }
.post-row .date { font-family: var(--font-num); }
.post-row .date b { display: block; font-size: 26px; line-height: 1; color: var(--brand-600); font-weight: 700; }
.post-row .date span { font-size: 12.5px; color: var(--muted); }
.post-row h3 { font-size: 18px; transition: color .25s; }
.post-row:hover h3 { color: var(--brand-600); }
.post-row .sum { margin-top: 7px; font-size: 14.5px; color: var(--text-2); line-height: 1.7; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* ---------- 筛选 tab ---------- */
.tabs { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 32px; }
.tab {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 40px; padding: 9px 20px; border-radius: 999px; cursor: pointer;
  border: 1.5px solid var(--line-2); background: #fff; font-size: 14.5px; font-weight: 500; color: var(--text-2);
  line-height: 1; white-space: nowrap; vertical-align: top;
  transition: all .25s var(--ease);
}
.tab:hover { border-color: var(--brand-300); color: var(--brand-600); }
.tab.is-active { background: var(--grad); border-color: transparent; color: #fff; box-shadow: var(--shadow-brand); }

/* ---------- CTA ---------- */
.cta-band {
  position: relative; overflow: hidden;
  border-radius: var(--radius-xl); padding: 64px 56px;
  background: var(--grad-dark); color: #fff;
  display: grid; grid-template-columns: 1.2fr .8fr; gap: 40px; align-items: center;
}
/* 网格装饰已移除：保持简洁纯色背景 */
.cta-band::after {
  content: ""; position: absolute; width: 460px; height: 460px; right: -140px; top: -180px;
  pointer-events: none;
  background: radial-gradient(circle, rgba(47, 224, 174, .28), transparent 68%); filter: blur(30px);
}
.cta-band > * { position: relative; }
.cta-band h2 { font-size: clamp(26px, 3vw, 36px); }
.cta-band p { margin-top: 14px; color: rgba(255, 255, 255, .7); font-size: 16.5px; }
.cta-actions { display: flex; gap: 14px; flex-wrap: wrap; justify-content: flex-end; }

/* ---------- 表单 ---------- */
.form-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 34px; box-shadow: var(--shadow); }
.form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.field { display: flex; flex-direction: column; gap: 7px; }
.field.full { grid-column: 1 / -1; }
.field label { font-size: 14px; font-weight: 600; color: var(--text); }
.field label .req { color: #E5484D; margin-left: 3px; }
.field input, .field select, .field textarea {
  height: 46px; padding: 0 14px; border-radius: 10px;
  border: 1.5px solid var(--line-2); background: #fff; font-size: 15px;
  transition: border-color .22s var(--ease), box-shadow .22s var(--ease);
}
.field textarea { height: auto; min-height: 110px; padding: 12px 14px; line-height: 1.7; resize: vertical; }
.field input::placeholder, .field textarea::placeholder { color: #A9C0BD; }
.field input:focus, .field select:focus, .field textarea:focus {
  outline: none; border-color: var(--brand-400); box-shadow: 0 0 0 4px rgba(35, 167, 154, .12);
}
.form-tip { margin-top: 12px; font-size: 13px; color: var(--muted); }
.form-msg { margin-top: 14px; padding: 12px 16px; border-radius: 10px; font-size: 14.5px; display: none; }
.form-msg.is-ok { display: block; background: var(--brand-50); color: var(--brand-700); border: 1px solid var(--brand-100); }
.form-msg.is-err { display: block; background: #FDECEC; color: #A32B2B; border: 1px solid #F7CDCD; }

/* ---------- 面包屑 / 页面头 ---------- */
/* 统一所有导航页页头：高度一致（产品中心/解决方案/客户案例/新闻动态/关于诚勤等） */
/* R54：列表页页头改为「浅色图片直出」风格（后台「页头深色主题」设置已下线）：
   ① 有背景图时：图片原样铺满，不再叠深色渐变 / 深色遮罩 / 青绿光晕
   ② 无背景图时：浅色柔和渐变兜底，与全站浅色基调一致
   ③ 大标题 = 参考色 #17C498；副标题 = 中性深灰绿 --text-2(#3B5C58) */
.page-hero {
  position: relative; overflow: hidden; padding: 56px 0 48px;
  min-height: 360px; display: flex; align-items: center;
  background: linear-gradient(135deg, #F2FBF7 0%, #E9F8F2 100%);
  color: var(--text); text-align: center;
}
.page-hero.has-bg::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background-image: var(--hero-img, none);
  background-size: cover; background-position: center; background-repeat: no-repeat;
  opacity: var(--hero-img-op, 1);
}
/* 深色遮罩层已废弃：保留规则以兼容可能残留的旧 DOM，不再产生任何视觉效果 */
.page-hero-mask { display: none; }
.page-hero .container { position: relative; z-index: 2; width: 100%; text-align: center; }
/* R55：页头大标题颜色改为后台可调（--hero-title 由 pageHeroVars 注入），未设置回退默认绿 */
.page-hero h1 { font-size: clamp(28px, 3.6vw, 42px); margin: 0 auto; color: var(--hero-title, #17C498); }
.page-hero p { margin: 16px auto 0; max-width: 760px; color: var(--text-2); font-size: 16.5px; }
/* 产品中心页头：容器两侧留空，避免标题贴边 */
.page-hero--products .container { padding-left: 6vw; padding-right: 6vw; }
.page-hero--products p { margin-left: auto; margin-right: auto; }
.crumb { display: flex; gap: 8px; justify-content: center; align-items: center; font-size: 13.5px; color: var(--muted); margin-bottom: 18px; }
.crumb a:hover { color: var(--brand-500); }
.crumb span { opacity: .5; }

/* ---------- 详情正文 ---------- */
.article { padding: 72px 0; }
.article-wrap { display: grid; grid-template-columns: 1fr 300px; gap: 56px; align-items: start; }
/* 统一封面媒体卡片：白色画框 + 16:9 统一比例 + 图片完整显示（不裁切不变形，白底图自然融合） */
.cover-media {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: var(--radius-lg);
  overflow: hidden;
  margin: 0 0 36px;
  background: linear-gradient(180deg, #ffffff 0%, #f4f8f7 100%);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-lg);
  display: grid;
  place-items: center;
}
.cover-media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  padding: 14px;
}
/* 文章内封面：限宽居中，避免占满整栏过大 */
.article .cover-media {
  max-width: 660px;
  margin: 0 auto 36px;
  border-radius: 18px;
  box-shadow: var(--shadow-lg);
}
@media (max-width: 760px) {
  .article .cover-media { max-width: 100%; }
}
.markdown { font-size: 16.5px; line-height: 1.9; color: var(--text); }
.markdown h2 { font-size: 25px; margin: 42px 0 16px; padding-left: 14px; border-left: 4px solid var(--brand-400); }
.markdown h3 { font-size: 20px; margin: 32px 0 12px; }
.markdown h4 { font-size: 17px; margin: 24px 0 10px; }
.markdown p { margin: 0 0 16px; }
.markdown ul, .markdown ol { margin: 0 0 18px; padding-left: 22px; }
.markdown ul { list-style: none; padding-left: 4px; }
.markdown ul li { position: relative; padding-left: 20px; margin-bottom: 9px; }
.markdown ul li::before {
  content: ""; position: absolute; left: 2px; top: 11px; width: 6px; height: 6px; border-radius: 50%;
  background: var(--brand-400);
}
.markdown ol { list-style: decimal; }
.markdown ol li { margin-bottom: 9px; }
.markdown strong { color: var(--brand-700); font-weight: 700; }
.markdown a { color: var(--brand-500); text-decoration: underline; text-underline-offset: 3px; }
.markdown blockquote {
  margin: 22px 0; padding: 16px 20px; border-radius: 12px;
  background: var(--brand-50); border-left: 4px solid var(--brand-400); color: var(--text-2);
}
.markdown img { border-radius: var(--radius); margin: 20px 0; }
.markdown table { margin: 22px 0; font-size: 15px; }
.markdown th, .markdown td { border: 1px solid var(--line-2); padding: 11px 14px; text-align: left; }
.markdown th { background: var(--bg-soft); font-weight: 600; }
.markdown hr { border: 0; border-top: 1px solid var(--line); margin: 34px 0; }
.markdown code { padding: 2px 6px; border-radius: 5px; background: var(--bg-soft2); font-size: 14.5px; font-family: var(--font-num); }
.markdown pre { padding: 18px; border-radius: 12px; background: var(--ink-800); color: #D7F5EC; overflow-x: auto; }
.markdown pre code { background: none; color: inherit; padding: 0; }

/* 侧栏 */
.side-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 24px; margin-bottom: 22px; }
.side-card h4 { font-size: 16px; margin-bottom: 16px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.side-list li { padding: 11px 0; border-bottom: 1px dashed var(--line); font-size: 14.5px; line-height: 1.6; }
.side-list li:last-child { border-bottom: 0; }
.side-list a:hover { color: var(--brand-600); }
.side-list .d { font-size: 12.5px; color: var(--muted); }

/* ---------- 产品详情 ---------- */
/* 首屏三层结构（后台可调）：
   ① .pd-hero 自身 = 深色主题渐变 --hero-base（颜色由 hero_tint 控制）
   ② ::before     = 背景图，透明度由 --hero-img-op 控制（hero_img_op）
   ③ ::after      = 深色遮罩，颜色 + 不透明度由 --hero-tint-rgb / --hero-o1~o3 控制（hero_overlay） */
.pd-hero { position: relative; overflow: hidden; background: var(--hero-base, var(--grad-dark)); color: #fff; padding: 56px 0 44px; min-height: 518px; display: flex; align-items: center; }
.pd-hero.has-bg::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background-image: var(--hero-img, none);
  background-size: cover; background-position: center; background-repeat: no-repeat;
  opacity: var(--hero-img-op, 1);
}
.pd-hero.has-bg::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(90deg,
    rgba(var(--hero-tint-rgb, 4, 20, 15), var(--hero-o1, .93)) 0%,
    rgba(var(--hero-tint-rgb, 4, 20, 15), var(--hero-o2, .744)) 48%,
    rgba(var(--hero-tint-rgb, 4, 20, 15), var(--hero-o3, .42)) 100%);
}
/* 网格装饰已移除：保持简洁纯色背景 */
.pd-hero .container { position: relative; z-index: 2; width: 100%; }
.pd-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 36px; align-items: center; }
.pd-grid--full { grid-template-columns: 1fr; }
.pd-grid--full .pd-copy { max-width: 760px; }
.pd-copy { min-width: 0; padding-left: 3vw; }
.pd-visual { min-width: 0; position: relative; padding-right: 1.5vw; }
/* 强调文字色：后台设置了「首屏深色主题颜色」时联动为该主题的高亮色，未设置时回退品牌青绿。
   该变量只在首屏内联注入，下方正文区块不受影响。 */
.pd-en { font-size: 13px; letter-spacing: .2em; text-transform: uppercase; color: var(--hero-accent, var(--accent-2)); }
.pd-hero h1 { font-size: clamp(30px, 4vw, 46px); margin: 14px 0 18px; }
.pd-tagline { font-size: 20px; font-weight: 600; color: var(--hero-accent, var(--accent-2)); }
.pd-sum { margin-top: 16px; font-size: 16.5px; line-height: 1.9; color: rgba(255, 255, 255, .74); max-width: 30em; }
.pd-actions { margin-top: 32px; display: flex; gap: 14px; flex-wrap: wrap; }
/* 产品详情 hero 右侧展示模板：浏览器窗口风格 */
.pd-mockup {
  border-radius: 18px; overflow: hidden;
  background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .16);
  box-shadow: 0 26px 70px rgba(0,0,0,.38);
  aspect-ratio: 4 / 3; position: relative;
}
/* 后台未填写比例时，按图片自身比例自适应，避免裁剪 */
.pd-mockup--auto { aspect-ratio: auto; }
.pd-mockup--auto .pd-mockup-bd { position: relative; inset: auto; }
.pd-mockup--auto .pd-mockup-bd img { position: relative; inset: auto; width: 100%; height: auto; object-fit: contain; display: block; }
.pd-mockup-bd { position: absolute; inset: 0; }
.pd-mockup-bd img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
/* 产品/方案详情 hero 右列：先展示文字要点，再自动轮播图片（无白边、图片铺满、任意比例自适应） */
.pd-stage { position: relative; aspect-ratio: 4 / 3; border-radius: 22px; overflow: hidden; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.14); box-shadow: 0 26px 70px rgba(0,0,0,.38); }
.pd-stage-view, .pd-slide { position: absolute; inset: 0; }
.pd-slide { opacity: 0; visibility: hidden; transition: opacity .65s var(--ease), visibility .65s; }
.pd-slide.is-active { opacity: 1; visibility: visible; z-index: 2; }
.pd-slide--img { display: grid; place-items: center; padding: 16px; background: linear-gradient(180deg, rgba(255,255,255,.05) 0%, rgba(9,28,24,.26) 100%); }
.pd-slide--img img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; display: block; border-radius: 12px; background: transparent; box-shadow: 0 18px 46px rgba(0,0,0,.34); }
.pd-slide--text {
  display: flex; flex-direction: column; gap: 8px;
  padding: 20px 20px 38px; overflow-y: auto;
  background: linear-gradient(155deg, rgba(255,255,255,.09) 0%, rgba(255,255,255,.03) 60%, rgba(6,26,22,.2) 100%);
}
.pd-slide-tt {
  display: flex; align-items: center; gap: 10px; margin-bottom: 2px;
  font-size: 12px; font-weight: 700; letter-spacing: .18em; color: var(--accent-2); text-transform: uppercase; white-space: nowrap;
}
.pd-slide-tt::after { content: ""; height: 1px; flex: 1; background: linear-gradient(90deg, rgba(255,255,255,.35), transparent); }
.pd-k { display: flex; gap: 12px; padding: 10px 12px; border-radius: 12px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); }
.pd-k-n { flex-shrink: 0; width: 26px; height: 26px; margin-top: 2px; border-radius: 8px; background: var(--grad); display: grid; place-items: center; font-size: 12.5px; font-weight: 800; }
.pd-k-bd { min-width: 0; }
.pd-k b { display: block; font-size: 14.5px; line-height: 1.4; }
.pd-k p {
  margin-top: 3px; font-size: 12.5px; line-height: 1.55; color: rgba(255,255,255,.62);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.pd-stage-dots { position: absolute; left: 0; right: 0; bottom: 12px; z-index: 5; display: flex; justify-content: center; gap: 7px; }
.pd-stage-dots button {
  width: 8px; height: 8px; padding: 0; border: 0; border-radius: 99px; cursor: pointer;
  background: rgba(255,255,255,.32); box-shadow: 0 1px 3px rgba(0,0,0,.25); transition: all .3s var(--ease);
}
.pd-stage-dots button:hover { background: rgba(255,255,255,.6); }
.pd-stage-dots button.is-active { width: 24px; background: var(--grad); }
/* 左右箭头：白底圆钮垂直居中，图片屏清晰、文字屏自动淡化 */
.pd-stage-arrow {
  position: absolute; top: 50%; transform: translateY(-50%);
  z-index: 6; width: 40px; height: 40px; padding: 0;
  border: 0; border-radius: 50%; cursor: pointer;
  display: grid; place-items: center;
  color: #0b2420; background: rgba(255,255,255,.9);
  box-shadow: 0 6px 18px rgba(0,0,0,.22);
  opacity: .92; transition: opacity .25s var(--ease), background .25s var(--ease), transform .2s var(--ease);
}
.pd-stage-arrow:hover { background: #fff; transform: translateY(-50%) scale(1.08); }
.pd-stage-arrow--prev { left: 12px; }
.pd-stage-arrow--next { right: 12px; }
/* 文字屏时箭头淡化（鼠标悬停整卡仍可见），图片屏全显 */
.pd-stage:not(.is-img) .pd-stage-arrow { opacity: .45; }
.pd-stage:not(.is-img) .pd-stage-arrow:hover { opacity: 1; }
@media (max-width: 959px) {
  .pd-stage { aspect-ratio: 16 / 10; }
  .pd-mockup { aspect-ratio: 16 / 10; }
  .pd-slide--text { padding: 14px 14px 34px; }
  .pd-k p { -webkit-line-clamp: 1; }
  .pd-stage-arrow { width: 34px; height: 34px; }
  .pd-stage-arrow svg { width: 18px; height: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .pd-slide { transition: none; }
}

.feat-tabs { display: grid; grid-template-columns: 260px 1fr; gap: 32px; align-items: start; }
/* 核心能力区整体向右移一点（标题+按钮+内容一起），与页面协调 */
.pd-cap .container { padding-left: 4vw; padding-right: 1vw; }
.feat-nav { display: grid; gap: 8px; position: sticky; top: 100px; }
.feat-nav button {
  text-align: left; padding: 15px 18px; border-radius: 12px; cursor: pointer;
  border: 1.5px solid var(--line); background: #fff; font-size: 15px; font-weight: 600;
  transition: all .25s var(--ease);
}
.feat-nav button:hover { border-color: var(--brand-300); }
.feat-nav button.is-active { background: var(--grad); border-color: transparent; color: #fff; box-shadow: var(--shadow-brand); }
.feat-panel { display: none; }
.feat-panel.is-active { display: block; animation: fadeUp .4s var(--ease) both; }
.feat-stage { display: grid; gap: 0; max-width: 680px; margin: 0 auto; }
.feat-media {
  border-radius: 18px; overflow: hidden; margin-bottom: 26px;
  background: var(--grad-soft); box-shadow: var(--shadow);
}
/* 默认：图片宽度撑满、高度按自身比例自适应，完整显示不裁切 */
.feat-media img { width: 100%; height: auto; display: block; margin: 0 auto; background: #fff; }
/* 后台设置了固定比例时：.feat-media 作为统一比例框架，内部图片 contain 完整显示 */
.feat-media[style*="aspect-ratio"] { display: grid; place-items: center; }
.feat-media[style*="aspect-ratio"] img { width: 100%; height: 100%; object-fit: contain; }
.feat-media-ph {
  width: 100%; min-height: 100%; aspect-ratio: 16 / 9; display: flex; align-items: center; justify-content: center; gap: 14px;
  background: linear-gradient(135deg, var(--brand-500), var(--brand-400) 55%, var(--accent));
  color: #fff;
}
.feat-media[style*="aspect-ratio"] .feat-media-ph { aspect-ratio: auto; }
.feat-media-ph .ph-num { font-family: var(--font-num); font-size: 64px; font-weight: 800; opacity: .9; line-height: 1; }
.feat-media-ph .ph-txt { font-size: 18px; font-weight: 600; opacity: .9; letter-spacing: 1px; }
.feat-body { padding: 0 4px; }
.feat-body h3 { font-size: 24px; margin-bottom: 14px; }
.feat-body p { font-size: 16px; line-height: 1.9; color: var(--text-2); }

.value-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }

/* ---------- 关于我们 ---------- */
.timeline { position: relative; padding-left: 34px; }
.timeline::before { content: ""; position: absolute; left: 8px; top: 6px; bottom: 6px; width: 2px; background: linear-gradient(180deg, var(--brand-300), var(--accent), transparent); }
.tl-item { position: relative; padding-bottom: 32px; }
.tl-item::before {
  content: ""; position: absolute; left: -34px; top: 6px; width: 18px; height: 18px; border-radius: 50%;
  background: #fff; border: 3px solid var(--brand-400); box-shadow: 0 0 0 4px rgba(35, 167, 154, .13);
}
.tl-year { font-family: var(--font-num); font-size: 20px; font-weight: 700; color: var(--brand-600); }
.tl-item h4 { margin: 4px 0 6px; font-size: 17px; }
.tl-item p { font-size: 14.5px; color: var(--text-2); }

/* 企业文化：参考原官网的彩色圆点列表 + 照片墙 */
.culture-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 46px; max-width: 1160px; margin: 0 auto; }
.culture-item { display: flex; gap: 16px; align-items: flex-start; }
.culture-item .dot { flex: none; width: 15px; height: 15px; border-radius: 50%; margin-top: 7px; box-shadow: 0 0 0 5px rgba(11, 63, 67, .05); }
.culture-item .dot-vision { background: #38B48C; }
.culture-item .dot-mission { background: #8B5CF6; }
.culture-item .dot-value { background: #3B82F6; }
.culture-item h4 { font-size: 19px; margin-bottom: 8px; }
.culture-item p { font-size: 15px; color: var(--text-2); line-height: 1.85; }

.culture-gallery {
  margin-top: 58px;
  /* Swiper 需要确定宽度，这里让容器撑满其父级 */
  width: 100%;
}
/* 照片墙：参考原官网 coverflow 式居中轮播 */
.certify { padding: 8px 0 0; }
.culture-swiper {
  overflow: hidden;
  padding-bottom: 62px;
}
.culture-swiper .swiper-slide {
  width: 520px;
  max-width: 82vw;
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(8, 56, 56, .12);
  /* 3D 轮播动效：提升为 GPU 合成层，避免大图 + 大投影卡片在缩放位移时逐帧重绘而卡顿 */
  will-change: transform;
  backface-visibility: hidden;
}
/* wrapper 位移与卡片自身 transform 用同一条缓动曲线，避免两者错位产生「发飘/不跟手」的观感 */
.culture-swiper .swiper-wrapper,
.culture-swiper .swiper-slide {
  transition-timing-function: cubic-bezier(.22, .61, .36, 1);
}
.culture-swiper .swiper-slide img {
  display: block;
  width: 100%;
  height: auto;   /* 覆盖 HTML 属性 height，确保由 aspect-ratio 决定高度（横版 4:3） */
  aspect-ratio: 4 / 3;
  object-fit: cover;
}
.culture-swiper .swiper-slide p {
  margin: 0;
  padding: 14px 0;
  text-align: center;
  color: #5a6b6b;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
}
/* 左右箭头 */
.culture-swiper .swiper-button-prev,
.culture-swiper .swiper-button-next {
  color: var(--brand-600);
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #fff;
  box-shadow: var(--shadow);
}
.culture-swiper .swiper-button-prev::after,
.culture-swiper .swiper-button-next::after {
  font-size: 18px;
  font-weight: 700;
}
.culture-swiper .swiper-button-prev { left: 22px; }
.culture-swiper .swiper-button-next { right: 22px; }
/* 分页点 */
.culture-swiper .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  margin: 0 5px;
  background: #d5d5d5;
  opacity: 1;
  border-radius: 50%;
}
.culture-swiper .swiper-pagination-bullet-active {
  background: var(--brand-600);
}
@media (max-width: 768px) {
  .culture-swiper .swiper-slide { width: 300px; }
  .culture-swiper .swiper-button-prev { left: 8px; }
  .culture-swiper .swiper-button-next { right: 8px; }
  .culture-swiper .swiper-button-prev,
  .culture-swiper .swiper-button-next { width: 36px; height: 36px; }
}

.honor-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.honor-card { padding: 24px; border-radius: var(--radius); background: var(--grad-soft); border: 1px solid var(--line); text-align: center; }
.honor-card b { display: block; font-size: 16.5px; }
.honor-card span { display: block; margin-top: 6px; font-size: 13.5px; color: var(--muted); }

/* 城市网格 */
.office-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.office-card { padding: 22px 24px; border-radius: var(--radius); background: #fff; border: 1px solid var(--line); transition: transform .28s var(--ease), box-shadow .28s var(--ease); }
.office-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.office-card .hd { display: flex; align-items: center; gap: 10px; }
.office-card b { font-size: 17px; }
.office-card .tg { font-size: 12px; padding: 2px 9px; border-radius: 6px; background: var(--brand-50); color: var(--brand-600); font-weight: 600; }
.office-card p { margin-top: 8px; font-size: 14px; color: var(--text-2); line-height: 1.7; }
.office-card .co { margin-top: 9px; font-size: 14.5px; font-weight: 600; color: var(--text); }
.office-card .addr { margin-top: 6px; }
.office-card .tel { margin-top: 10px; display: inline-flex; align-items: center; gap: 7px; font-size: 15px; font-weight: 700; color: var(--brand-600); font-family: var(--font-num); }
.office-card .tel svg { flex: none; color: var(--brand-600); }

/* ---------- 生态合作 ---------- */
.partner-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.partner-card { padding: 32px; border-radius: var(--radius-lg); background: #fff; border: 1px solid var(--line); transition: transform .3s var(--ease), box-shadow .3s var(--ease); }
.partner-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.partner-card .tg { display: inline-block; padding: 4px 12px; border-radius: 999px; background: var(--brand-50); color: var(--brand-600); font-size: 13px; font-weight: 600; }
.partner-card h3 { margin: 16px 0 12px; font-size: 21px; }
.partner-card > p { font-size: 14.5px; color: var(--text-2); line-height: 1.8; }
.benefit-list { margin-top: 20px; padding-top: 18px; border-top: 1px dashed var(--line-2); display: grid; gap: 10px; }
.benefit-list li { display: flex; gap: 9px; font-size: 14px; color: var(--text-2); }
.benefit-list li::before { content: "▸"; color: var(--brand-400); font-weight: 700; }

.benefit-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 18px; }

/* ---------- 招聘 ---------- */
.job-item { border: 1px solid var(--line); border-radius: var(--radius); background: #fff; margin-bottom: 14px; overflow: hidden; transition: box-shadow .28s var(--ease); }
.job-item:hover { box-shadow: var(--shadow); }
.job-item > summary {
  list-style: none; cursor: pointer; padding: 22px 26px;
  display: flex; align-items: center; gap: 20px; flex-wrap: wrap;
}
.job-item > summary::-webkit-details-marker { display: none; }
.job-item h3 { font-size: 19px; flex: 1; min-width: 200px; }
.job-meta { display: flex; gap: 10px; flex-wrap: wrap; font-size: 13.5px; color: var(--muted); }
.job-meta span { padding: 3px 11px; border-radius: 6px; background: var(--bg-soft2); }
.job-body { padding: 4px 26px 26px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 26px; border-top: 1px dashed var(--line); padding-top: 22px; }
.job-body h5 { font-size: 15px; color: var(--brand-600); margin-bottom: 10px; }

/* ---------- 分页 ---------- */
.pager { display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 48px; }
.pager a, .pager span {
  min-width: 40px; height: 40px; padding: 0 12px; border-radius: 10px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 14.5px; border: 1.5px solid var(--line); background: #fff; color: var(--text-2);
  transition: all .22s var(--ease);
}
.pager a:hover { border-color: var(--brand-400); color: var(--brand-600); }
.pager .is-active { background: var(--grad); border-color: transparent; color: #fff; font-weight: 600; }
.pager .is-disabled { opacity: .45; pointer-events: none; }

/* ---------- 空态 ---------- */
.empty { padding: 80px 20px; text-align: center; color: var(--muted); }
.empty svg { width: 64px; height: 64px; opacity: .35; margin-bottom: 16px; }

/* ---------- Footer ---------- */
.footer { background: #000; color: rgba(255, 255, 255, .66); padding: 72px 0 0; position: relative; overflow: hidden; }
.footer::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(47, 224, 174, .5), transparent);
}
.footer-top { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr) 1.1fr; gap: 40px; padding-bottom: 48px; }
.footer-brand .logo { margin-bottom: 18px; }
.footer-brand p { font-size: 14.5px; line-height: 1.85; max-width: 300px; }
.footer h5 { color: #fff; font-size: 15.5px; margin-bottom: 18px; }
.footer-links li { margin-bottom: 11px; }
.footer-links a { font-size: 14.5px; transition: color .22s; }
.footer-links a:hover { color: var(--accent-2); }
.footer-contact li { display: flex; gap: 10px; margin-bottom: 13px; font-size: 14.5px; line-height: 1.6; }
.footer-contact svg { width: 16px; height: 16px; flex-shrink: 0; margin-top: 3px; color: var(--accent); }
.footer-contact b { color: #fff; display: block; font-weight: 600; }
.footer-qr { display: flex; gap: 16px; align-items: center; margin-top: 20px; }
.qr-box { width: 92px; height: 92px; border-radius: 12px; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .14); display: grid; place-items: center; overflow: hidden; }
.qr-box img { width: 100%; height: 100%; object-fit: cover; }
.qr-box span { font-size: 11.5px; color: rgba(255, 255, 255, .45); text-align: center; padding: 6px; line-height: 1.4; }
.footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, .08); padding: 22px 0 28px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
  font-size: 13.5px; color: rgba(255, 255, 255, .45);
}
.footer-bottom a:hover { color: var(--accent-2); }

/* ---------- 悬浮工具条 ---------- */
.fab { position: fixed; right: 20px; bottom: 24px; z-index: 90; display: grid; gap: 10px; }
.fab-item {
  width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; cursor: pointer;
  background: #fff; border: 1px solid var(--line); color: var(--brand-600);
  box-shadow: var(--shadow); transition: transform .25s var(--ease), background-color .25s, color .25s;
}
.fab-item:hover { transform: translateY(-3px); background: var(--grad); color: #fff; border-color: transparent; }
.fab-item svg { width: 21px; height: 21px; }
.fab-pop {
  position: absolute; right: 62px; bottom: 0; width: 244px; padding: 18px;
  background: #fff; border-radius: var(--radius); box-shadow: var(--shadow-lg); border: 1px solid var(--line);
  opacity: 0; visibility: hidden; transform: translateX(8px);
  transition: all .25s var(--ease);
}
.fab-item:hover .fab-pop { opacity: 1; visibility: visible; transform: translateX(0); }
.fab-pop b { display: block; font-size: 14.5px; margin-bottom: 8px; }
.fab-pop p { font-size: 13px; color: var(--text-2); line-height: 1.7; }
.fab-pop .qr { margin-top: 10px; width: 120px; height: 120px; background: var(--bg-soft); border-radius: 8px; display: grid; place-items: center; font-size: 12px; color: var(--muted); }

/* ---------- 动效 ---------- */
/* R54：入场位移改用独立的 translate 属性（而非 transform），
   避免与卡片 :hover 的 transform: translateY(-6px) 同特异性覆盖 —— 否则悬浮上浮会失效。 */
.reveal { opacity: 0; translate: 0 24px; transition: opacity .7s var(--ease), translate .7s var(--ease); }
.reveal.is-in { opacity: 1; translate: 0 0; }
.reveal-d1 { transition-delay: .08s; }
.reveal-d2 { transition-delay: .16s; }
.reveal-d3 { transition-delay: .24s; }
.reveal-d4 { transition-delay: .32s; }

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .reveal { opacity: 1; translate: 0 0; }
}

/* ==========================================================================
   响应式
   ========================================================================== */
@media (max-width: 1180px) {
  .footer-top { grid-template-columns: 1.2fr 1fr 1fr; }
  .benefit-grid { grid-template-columns: repeat(3, 1fr); }
  .arch-ability { grid-template-columns: repeat(5, 1fr); gap: 10px; padding: 16px; }
  .arch-ability .ab span { font-size: 11.5px; }
}
@media (max-width: 1024px) {
  .nav { display: none; }
  .burger { display: block; order: 3; }
  .header-actions .btn, .header-phone, .header-search { display: none; }
  .header-inner { justify-content: space-between; }
  .hero-grid, .pd-grid, .article-wrap, .feat-tabs, .cta-band { grid-template-columns: 1fr; }
  .hero { padding-top: 56px; min-height: auto; }
  .hero-content--center { margin: 0 auto; }
  .hero-visual { max-width: 520px; margin: 0 auto; }
.float-badge.b1 { top: -22px; right: -22px; }
.float-badge.b2 { bottom: -22px; left: -22px; }
  .prod-grid, .why-grid, .news-grid, .value-grid, .culture-grid { grid-template-columns: repeat(2, 1fr); }
  .sol-grid, .honor-grid { grid-template-columns: repeat(2, 1fr); }
  .stats-inner { grid-template-columns: repeat(3, 1fr); }
  .cta-band { padding: 44px 30px; text-align: center; }
  .cta-actions { justify-content: center; }
  .job-body { grid-template-columns: 1fr; gap: 18px; }
  .office-grid { grid-template-columns: repeat(2, 1fr); }
  .feat-nav { position: static; grid-template-columns: repeat(2, 1fr); display: grid; }
}
@media (max-width: 720px) {
  .container { padding: 0 18px; }
  .section { padding: 48px 0; }
  .section-head { margin-bottom: 32px; }
  .topbar { display: none; }
  .prod-grid, .why-grid, .news-grid, .value-grid, .culture-grid, .sol-grid, .honor-grid,
  .ai-grid, .partner-grid, .form-grid, .office-grid { grid-template-columns: 1fr; }
  .stats-inner { grid-template-columns: repeat(2, 1fr); }
  .stat-num { font-size: 30px; }
  .benefit-grid { grid-template-columns: repeat(2, 1fr); }
  .arch-ability { grid-template-columns: repeat(2, 1fr); }
  .footer-top { grid-template-columns: 1fr; gap: 30px; }
  .post-row { grid-template-columns: 1fr; gap: 12px; }
  .post-row .date { display: flex; align-items: baseline; gap: 6px; }
  .post-row .date b { font-size: 20px; }
  .cta-band { padding: 32px 22px; }
  .form-card { padding: 22px; }
  .fab { right: 12px; bottom: 16px; }
  .fab-item { width: 44px; height: 44px; }
  .fab-pop { right: 56px; width: 210px; }
  .page-hero { padding: 52px 0 44px; }
}

/* ---------- 产品详情页浅色主题（R44） ---------- */
/* 主题作用层：themeVars 在 .pd-page 上注入主题色色阶（覆盖 --brand-* / --accent* / --grad）
   与背景图变量（--hero-img），向内继承——首屏与下方内容区品牌色元素一并联动。
   未设置主题色时不输出任何覆盖，整页保持默认青绿品牌色，零回归。 */
.pd-page { position: relative; }
/* 下方内容区浅色区块底色：后台「内容区背景底色」注入 --pd-section-bg，留空为默认浅灰绿 */
.pd-page .section--soft { background: var(--pd-section-bg, var(--bg-soft)); }
/* 首屏/内容区主按钮阴影：跟随主题色的淡化投影（无主题色时回退品牌青绿），替代固定深色投影 */
.pd-page .btn-primary { border: 0; box-shadow: 0 10px 28px rgba(var(--pd-theme-rgb, 22, 100, 106), .24); }
.pd-page .btn-primary:hover { box-shadow: 0 14px 34px rgba(var(--pd-theme-rgb, 22, 100, 106), .32); }

/* 浅色首屏：背景图直接铺满（无深色渐变、无遮罩），文字改深色 */
.pd-hero--light { background: linear-gradient(165deg, #eef7f5 0%, #f8fdfb 55%, #ffffff 100%); color: var(--text); }
.pd-hero.pd-hero--light.has-bg::before { opacity: 1; }
.pd-hero.pd-hero--light::after { content: none; } /* 浅色主题不需要深色遮罩（同优先级后定义胜出，压过 .pd-hero.has-bg::after） */
.pd-hero--light .container { position: relative; z-index: 2; }
.pd-hero--light .crumb { color: var(--text-2); }
.pd-hero--light .crumb a:hover { color: var(--pd-theme, var(--brand-600)); }
.pd-hero--light .pd-en { color: var(--pd-theme, var(--brand-600)); }
.pd-hero--light h1 { color: var(--pd-theme, var(--ink-900)); margin-top: 0; }
.pd-hero--light .pd-tagline { color: var(--ink-900); }
.pd-hero--light .pd-sum { color: var(--text-2); }
/* 主按钮背景 var(--grad) 已被主题色阶覆盖，自动跟随主题；次按钮改白底深字 */
.pd-hero--light .btn-ghost-light { background: rgba(255, 255, 255, .82); color: var(--ink-900); border-color: rgba(4, 20, 15, .18); backdrop-filter: blur(6px); }
.pd-hero--light .btn-ghost-light:hover { background: #fff; border-color: rgba(4, 20, 15, .32); }
/* 右侧展示卡：白底浅描边深投影 */
.pd-hero--light .pd-mockup { background: transparent; border: 0; box-shadow: none; border-radius: 0; }