/* ============================================================
   senzhiyun-site 视觉系统 v2
   品牌：深青（主）· 绿（成功/已有）· 橙（强调/步骤）
   原则：大留白、卡片模块、真实截图、CTA 明确、移动端优先导航
   ============================================================ */

:root {
  /* 色彩 */
  --ink: #0f1f24;
  --ink-soft: #24363c;
  --muted: #55666d;
  --line: #e2ecea;
  --soft: #f4f8f7;
  --teal-700: #0e5f65;
  --teal-600: #13757b;
  --teal-100: #e0f2ef;
  --green-600: #1f8a68;
  --green-100: #e6f5ef;
  --orange-500: #f28c20;
  --orange-100: #fdeedd;

  /* 品牌化四色系统（四大能力方向专属色） */
  --safety: #e8862e;        /* 安全与现场管理 */
  --safety-deep: #b45e14;
  --safety-100: #fdf0e0;
  --equipment: #2f6fb2;     /* 设备与备件 */
  --equipment-deep: #23558c;
  --equipment-100: #e8f0fa;
  --report: #7a5cae;        /* 库存与经营报表 */
  --report-deep: #5d4389;
  --report-100: #f0ebf8;
  --energy: #2e9e6b;        /* 能源管理 */
  --energy-deep: #227a52;
  --energy-100: #e7f4ec;

  --white: #ffffff;
  --footer-text: #b9c7cc;

  /* 字体 */
  --font: "Inter", "Segoe UI", "PingFang SC", "Microsoft YaHei", "Noto Sans SC", system-ui, -apple-system, sans-serif;

  /* 形状与阴影 */
  --radius: 12px;
  --radius-sm: 8px;
  --shadow-sm: 0 1px 2px rgba(15, 31, 36, 0.06), 0 1px 3px rgba(15, 31, 36, 0.08);
  --shadow-md: 0 6px 16px rgba(15, 31, 36, 0.1);
  --shadow-lg: 0 24px 64px rgba(15, 31, 36, 0.14);

  /* 布局 */
  --container: 1200px;
  --pad: clamp(18px, 5vw, 48px);
}

* {
  box-sizing: border-box;
}

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

body {
  margin: 0;
  font-family: var(--font);
  color: var(--ink);
  background: var(--white);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  max-width: 100%;
  display: block;
}

h1, h2, h3, p {
  margin-top: 0;
}

h1, h2, h3 {
  line-height: 1.18;
  letter-spacing: -0.01em;
}

:focus-visible {
  outline: 3px solid var(--orange-500);
  outline-offset: 2px;
  border-radius: 4px;
}

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

/* ============ 顶部导航 ============ */
.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 14px var(--pad);
  background: rgba(255, 255, 255, 0.92);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(14px);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 800;
  font-size: 17px;
  white-space: nowrap;
}

.brand span {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  color: var(--white);
  background: linear-gradient(135deg, var(--teal-600), var(--teal-700));
  border-radius: 10px;
  font-size: 13px;
  letter-spacing: 0;
}

.brand-inverse { color: var(--white); }
.brand-inverse span { background: var(--white); color: var(--teal-700); }

.nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  color: var(--muted);
  font-size: 15px;
}

.nav a {
  padding: 8px 12px;
  border-radius: 8px;
  transition: color 0.16s ease, background 0.16s ease;
}

.nav a:hover {
  color: var(--teal-700);
  background: var(--teal-100);
}

.nav a.active {
  ;
  ;
}

.nav-login {
  display: none;
}

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

.language {
  color: var(--muted);
  font-size: 14px;
  font-weight: 700;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  transition: color 0.16s ease, border-color 0.16s ease;
}

.language:hover {
  color: var(--teal-700);
  border-color: var(--teal-600);
}

.login-link,
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 20px;
  border-radius: 10px;
  font-weight: 700;
  font-size: 15px;
  transition: transform 0.16s ease, box-shadow 0.16s ease, background 0.16s ease;
}

.login-link {
  color: var(--white);
  background: var(--ink);
}

.login-link:hover {
  background: var(--ink-soft);
}

.button.primary {
  color: var(--white);
  background: var(--teal-700);
  box-shadow: var(--shadow-sm);
}

.button.primary:hover {
  background: var(--teal-600);
  transform: translateY(-1px);
  box-shadow: var(--shadow-md);
}

.button.secondary {
  color: var(--ink);
  background: var(--white);
  border: 1px solid var(--line);
}

.button.secondary:hover {
  border-color: var(--teal-600);
  color: var(--teal-700);
  transform: translateY(-1px);
  box-shadow: var(--shadow-sm);
}

/* 汉堡按钮（移动端） */
.menu-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 44px;
  height: 44px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--white);
  cursor: pointer;
}

.menu-toggle span {
  display: block;
  width: 100%;
  height: 2px;
  border-radius: 2px;
  background: var(--ink);
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ============ 通用排版 ============ */
.eyebrow {
  margin: 0 0 12px;
  color: var(--teal-700);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

h1 {
  margin-bottom: 20px;
  font-size: clamp(34px, 4.6vw, 64px);
}

h2 {
  margin-bottom: 14px;
  font-size: clamp(26px, 3vw, 42px);
}

h3 {
  margin-bottom: 10px;
  font-size: 19px;
}

.hero-text,
.section-heading p,
.split-body p,
.page-head p,
.contact-card p,
.contact-form label,
.form-note,
.legal p,
.about-body p,
.notfound p,
.product-detail p,
.mini-steps li,
.cta-band p {
  color: var(--muted);
  font-size: 17px;
  line-height: 1.72;
}

.text-link {
  display: inline-block;
  margin-top: 16px;
  color: var(--teal-700);
  font-weight: 700;
}

.text-link:hover {
  text-decoration: underline;
}

/* ============ 首屏 Hero ============ */
.hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 1.05fr);
  gap: 56px;
  align-items: center;
  min-height: calc(100vh - 74px);
  padding: clamp(48px, 7vw, 88px) var(--pad);
  background:
    radial-gradient(48% 58% at 10% 6%, rgba(224, 242, 239, 0.95) 0%, rgba(255, 255, 255, 0) 68%),
    radial-gradient(38% 50% at 94% 88%, rgba(253, 238, 221, 0.85) 0%, rgba(255, 255, 255, 0) 68%),
    radial-gradient(30% 42% at 76% 12%, rgba(232, 240, 250, 0.8) 0%, rgba(255, 255, 255, 0) 62%),
    linear-gradient(180deg, #eef7f5 0%, #ffffff 78%);
}

.hero-copy h1 {
  max-width: 720px;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 28px;
}

.hero-visual {
  position: relative;
  padding: 10px 10px 0;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: var(--shadow-lg);
  transform: rotate(-0.6deg);
}

.hero-visual img {
  width: 100%;
  border-radius: 6px 6px 10px 10px;
}

.frame-bar {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 10px;
  margin-bottom: 8px;
}

.frame-bar span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--line);
}

.frame-bar span:nth-child(1) { background: #f4a261; }
.frame-bar span:nth-child(2) { background: #e9c46a; }
.frame-bar span:nth-child(3) { background: var(--green-600); }

/* ============ 区块 ============ */
.section {
  padding: clamp(56px, 7vw, 92px) var(--pad);
}

.section-heading {
  max-width: 820px;
  margin-bottom: 36px;
}

.section-more {
  margin-top: 28px;
}

.split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 48px;
  align-items: start;
  background: var(--soft);
}

.split-copy h2 {
  max-width: 480px;
}

.muted {
  background: var(--soft);
}

/* ============ 产品卡片 ============ */
.product-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
  margin-bottom: 20px;
}

.product-card {
  position: relative;
  display: flex;
  flex-direction: column;
  ;
  padding: 20px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.product-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
  border-color: #c4dcd7;
}

.product-card .icon {
  width: 30px;
  height: 30px;
  color: var(--teal-700);
}

.card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  ;
}

.product-card h3 {
  margin-bottom: 8px;
  font-size: 17.5px;
}

.product-card p {
  flex: 1;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.62;
  margin-bottom: 12px;
}

.card-link {
  color: var(--teal-700);
  font-weight: 700;
  font-size: 14px;
}

.card-link:hover {
  text-decoration: underline;
}

/* 紧凑卡片（首页 4×2 模块陈列） */
.product-card.compact {
  min-height: 200px;
  padding: 22px 20px;
}

.product-card.compact .icon {
  width: 26px;
  height: 26px;
}

.product-card.compact h3 {
  font-size: 17px;
}

.product-card.compact p {
  font-size: 14px;
  margin-bottom: 12px;
}

/* 首页四大能力分类 */
.capability-groups {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
}

.capability-group {
  display: flex;
  flex-direction: column;
  min-height: 240px;
  padding: 26px 24px;
  background: linear-gradient(180deg, #ffffff 0%, #f4faf9 100%);
  border: 1px solid #bfddd6;
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.capability-group:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}

.capability-group .icon {
  width: 30px;
  height: 30px;
  color: var(--teal-700);
}

.group-count {
  padding: 5px 10px;
  color: var(--teal-700);
  background: var(--teal-100);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.capability-group h3 {
  margin-bottom: 10px;
}

.capability-group > p {
  flex: 1;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.65;
  margin-bottom: 16px;
}

.module-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.chip {
  padding: 6px 12px;
  color: var(--teal-700);
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  transition: border-color 0.16s ease, background 0.16s ease;
}

.chip:hover {
  border-color: var(--teal-600);
  background: var(--teal-100);
}

/* ============ 品牌化四色系统 ============ */
/* 图标着色 */
.icon.color-safety { color: var(--safety); }
.icon.color-equipment { color: var(--equipment); }
.icon.color-report { color: var(--report); }
.icon.color-energy { color: var(--energy); }

/* 详情页 hero 图标 */
.hero-icon.color-safety { color: var(--safety); background: var(--safety-100); }
.hero-icon.color-equipment { color: var(--equipment); background: var(--equipment-100); }
.hero-icon.color-report { color: var(--report); background: var(--report-100); }
.hero-icon.color-energy { color: var(--energy); background: var(--energy-100); }

/* 产品卡片 hover 边框按方向色 */
.product-card[data-color="safety"]:hover { border-color: rgba(232, 134, 46, 0.55); }
.product-card[data-color="equipment"]:hover { border-color: rgba(47, 111, 178, 0.55); }
.product-card[data-color="report"]:hover { border-color: rgba(122, 92, 174, 0.55); }
.product-card[data-color="energy"]:hover { border-color: rgba(46, 158, 107, 0.55); }

/* 能力分类卡：按方向着色 */
.capability-group[data-color="safety"] { border-color: #eec9a0; }
.capability-group[data-color="equipment"] { border-color: #b9cfe6; }
.capability-group[data-color="report"] { border-color: #d2c5e8; }
.capability-group[data-color="energy"] { border-color: #b6ddc8; }

.capability-group[data-color="safety"] .group-count { color: var(--safety-deep); background: var(--safety-100); }
.capability-group[data-color="equipment"] .group-count { color: var(--equipment-deep); background: var(--equipment-100); }
.capability-group[data-color="report"] .group-count { color: var(--report-deep); background: var(--report-100); }
.capability-group[data-color="energy"] .group-count { color: var(--energy-deep); background: var(--energy-100); }

.capability-group[data-color="safety"] .chip:hover { border-color: var(--safety); background: var(--safety-100); color: var(--safety-deep); }
.capability-group[data-color="equipment"] .chip:hover { border-color: var(--equipment); background: var(--equipment-100); color: var(--equipment-deep); }
.capability-group[data-color="report"] .chip:hover { border-color: var(--report); background: var(--report-100); color: var(--report-deep); }
.capability-group[data-color="energy"] .chip:hover { border-color: var(--energy); background: var(--energy-100); color: var(--energy-deep); }

/* ============ 功能列表 ============ */
.feature-list {
  display: grid;
  gap: 12px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.feature-list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 18px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  font-weight: 600;
}

.check-icon {
  flex: none;
  width: 20px;
  height: 20px;
  margin-top: 2px;
  color: var(--green-600);
}

/* ============ 行业场景 ============ */
.scenario-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.scenario-card {
  display: flex;
  flex-direction: column;
  min-height: 150px;
  padding: 18px 20px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  ;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.scenario-card:hover {
  ;
  ;
  ;
}

.scenario-card h3 {
  margin-bottom: 8px;
  color: var(--ink);
  font-size: 17px;
}

.scenario-card p {
  flex: 1;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.55;
  margin-bottom: 12px;
}

/* ============ 步骤 ============ */
.steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
  padding: 0;
  margin: 0;
  list-style: none;
  counter-reset: steps;
}

.steps li {
  position: relative;
  min-height: 200px;
  padding: 66px 24px 24px;
  background: var(--soft);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.step-num {
  position: absolute;
  top: 22px;
  left: 24px;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  color: var(--white);
  background: var(--safety);
  border-radius: 50%;
  font-weight: 800;
}

.steps li h3 {
  margin-bottom: 10px;
}

.steps li p {
  color: var(--muted);
  font-size: 15px;
  line-height: 1.6;
}

/* 定制开发合作流程：5 步一行 */
.steps-5 {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.steps-5 li {
  min-height: 172px;
  padding: 52px 16px 18px;
}

.steps-5 .step-num {
  top: 16px;
  left: 16px;
  width: 30px;
  height: 30px;
}

.steps-5 li h3 {
  font-size: 16px;
  margin-bottom: 8px;
}

.steps-5 li p {
  font-size: 13px;
  line-height: 1.55;
}

/* ============ 联系 ============ */
.contact-section {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 400px;
  gap: 48px;
  align-items: start;
}

.contact-card {
  padding: 22px;
  background: var(--soft);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.contact-card p {
  margin-bottom: 10px;
  font-size: 14px;
}

.contact-card a {
  color: var(--teal-700);
  font-weight: 700;
}

.contact-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
  gap: 36px;
  align-items: start;
  ;
}

.contact-intro h1 {
  margin-bottom: 10px;
  font-size: clamp(26px, 3.2vw, 36px);
}

.contact-intro > p {
  max-width: 520px;
  font-size: 14.5px;
  ;
}

.contact-intro .contact-card {
  margin-top: 16px;
}

.contact-card h3, .contact-card h2 {
  margin-bottom: 12px;
  color: var(--ink);
}

.contact-form {
  padding: 20px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
}

.contact-form h2 {
  margin-bottom: 12px;
  font-size: 23px;
}

.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.form-grid label {
  display: grid;
  gap: 6px;
  font-weight: 700;
  font-size: 14px;
}

.form-grid .span-2 {
  grid-column: span 2;
}

.form-grid input,
.form-grid select,
.form-grid textarea {
  width: 100%;
  padding: 9px 12px;
  font: inherit;
  color: var(--ink);
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  transition: border-color 0.16s ease, box-shadow 0.16s ease;
}

.form-grid input:focus,
.form-grid select:focus,
.form-grid textarea:focus {
  outline: none;
  border-color: var(--teal-600);
  box-shadow: 0 0 0 3px rgba(19, 117, 123, 0.15);
}

.form-grid textarea {
  resize: vertical;
}

.contact-form .button {
  margin-top: 10px;
  width: 100%;
}

.form-note {
  margin: 10px 0 0;
  font-size: 12.5px;
}

.form-feedback {
  margin: 14px 0 0;
  padding: 12px 14px;
  border-radius: var(--radius-sm);
  font-size: 14.5px;
  font-weight: 600;
  background: var(--green-100);
  color: var(--green-600);
}

/* ============ CTA 横条 ============ */
.cta-band {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  margin: 0 var(--pad) clamp(20px, 3vw, 32px);
  padding: clamp(16px, 2.5vw, 28px);
  color: var(--white);
  background: linear-gradient(120deg, var(--teal-700) 0%, #0a3d42 100%);
  border-radius: 18px;
  box-shadow: var(--shadow-md);
}

.cta-band h2 {
  margin-bottom: 10px;
}

.cta-band p {
  color: #cfe3e1;
  margin-bottom: 0;
}

.cta-band .button.primary {
  background: var(--white);
  color: var(--teal-700);
  flex: none;
}

.cta-band .button.primary:hover {
  background: var(--orange-100);
}

/* ============ 内页通用（首屏紧凑：内容一眼看全） ============ */
.page-head {
  padding: clamp(16px, 2.2vw, 28px) var(--pad) 4px;
  max-width: 860px;
}

.page-head h1 {
  margin-bottom: 8px;
  font-size: clamp(26px, 3.2vw, 40px);
}

.page-head p:not(.eyebrow) {
  max-width: 760px;
  font-size: 14.5px;
  line-height: 1.6;
}

.page-head .hero-actions {
  margin-top: 14px;
}

.page-head .hero-actions .button {
  min-height: 38px;
  padding: 0 16px;
  font-size: 14px;
}

.module-note {
  display: inline-block;
  margin: 6px 0 0;
  padding: 10px 16px;
  color: var(--teal-700);
  background: var(--teal-100);
  border-radius: 10px;
  font-size: 14.5px;
  font-weight: 600;
  line-height: 1.6;
}

.steps-note {
  max-width: 760px;
  margin: 26px 0 0;
  padding: 14px 18px;
  color: var(--muted);
  background: var(--soft);
  border: 1px solid var(--line);
  border-radius: 10px;
  font-size: 14.5px;
  line-height: 1.7;
}

/* 产品详情页首屏压缩：hero 两列（左文字 + 右截图） */
.product-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(300px, 0.85fr);
  gap: 40px;
  align-items: center;
  padding: clamp(12px, 2vw, 22px) var(--pad) 10px;
}

.product-hero h1 {
  font-size: clamp(26px, 3.2vw, 40px);
  margin-bottom: 10px;
}

.product-hero .hero-text {
  font-size: 15px;
  line-height: 1.6;
  margin-bottom: 10px;
}

.product-hero .module-note {
  margin-top: 0;
  padding: 8px 14px;
  font-size: 13.5px;
}

.product-hero .hero-actions {
  margin-top: 16px;
}

.product-hero-shot .slot-img.wide,
.product-hero-shot .img-slot.wide {
  height: clamp(130px, 16vw, 210px);
}

.product-hero-shot .img-slot {
  border-radius: 14px;
}

/* 产品详情页信息区压缩 */
.product-detail {
  ;
  ;
}

.product-detail p {
  font-size: 15px;
  line-height: 1.6;
}

.detail-col h2 {
  ;
  ;
  ;
}

.plain-list {
  ;
  margin-bottom: 22px;
}

.mini-steps {
  ;
}

.mini-steps li span {
  ;
  ;
  ;
}

.hero-icon {
  width: 46px;
  height: 46px;
  margin-bottom: 14px;
  padding: 10px;
  color: var(--teal-700);
  background: var(--teal-100);
  border-radius: 12px;
}

/* 产品总览页首屏压缩 */
.products-section {
  padding-top: 8px;
  padding-bottom: clamp(28px, 4vw, 44px);
}

/* 能力卡片更紧凑 */
.capability-grid .product-card {
  min-height: 150px;
  padding: 16px 18px;
}

.capability-grid .product-card .card-top {
  margin-bottom: 12px;
}

.capability-grid .product-card .icon {
  width: 24px;
  height: 24px;
}

.capability-grid .product-card h3 {
  font-size: 16.5px;
  margin-bottom: 6px;
}

.capability-grid .product-card p {
  font-size: 13.5px;
  line-height: 1.55;
}

.capability-grid.cols-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

/* 图片位区段压缩 */
.product-shot,
.custom-shot {
  padding-top: 12px;
  padding-bottom: 12px;
}

/* 行业场景区（首页与行业页共用）压缩 */
.industries-section {
  padding-top: 14px;
  padding-bottom: 24px;
  background: #f2f8f7;
}

/* 定制开发能力区压缩 */
.custom-capabilities {
  padding-top: 8px;
}

/* 预留图片位 */
.img-slot {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  width: 100%;
  border: 2px dashed #c4dcd7;
  border-radius: 14px;
  background:
    repeating-linear-gradient(45deg, rgba(224, 242, 239, 0.35) 0 12px, rgba(255, 255, 255, 0) 12px 24px),
    var(--soft);
  text-align: center;
}

.img-slot.wide {
  height: clamp(160px, 22vw, 300px);
}

.img-slot.portrait {
  aspect-ratio: 4 / 3;
}

.img-slot-title {
  margin: 0;
  color: var(--teal-700);
  font-weight: 800;
  font-size: 16px;
}

.slot-img {
  display: block;
  width: 100%;
  border-radius: 12px;
  border: 1px solid var(--line);
  box-shadow: var(--shadow-sm);
}

.slot-img.wide {
  height: clamp(160px, 22vw, 300px);
  object-fit: cover;
}

.img-slot-hint {
  margin: 0;
  color: var(--muted);
  font-size: 13.5px;
}

/* 回到顶部 */
.to-top {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 40;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  color: var(--white);
  background: var(--teal-700);
  border: 0;
  border-radius: 50%;
  box-shadow: var(--shadow-md);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  opacity: 0;
  transform: translateY(10px);
  pointer-events: none;
  transition: opacity 0.2s ease, transform 0.2s ease, background 0.2s ease;
}

.to-top.show {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.to-top:hover {
  background: var(--teal-600);
}

.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 18px var(--pad) 0;
  color: var(--muted);
  font-size: 14px;
}

.breadcrumb a:hover {
  color: var(--teal-700);
  text-decoration: underline;
}

.breadcrumb span[aria-current] {
  color: var(--ink);
  font-weight: 600;
}

/* 产品详情页信息区压缩 */
.product-detail {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr);
  gap: 36px;
  align-items: start;
  padding-top: 12px;
  padding-bottom: 20px;
}

/* 右半区：核心功能 | 使用流程 并排 */
.detail-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.detail-col h2 {
  margin-top: 2px;
  margin-bottom: 10px;
  font-size: 22px;
}

.plain-list {
  display: grid;
  gap: 10px;
  padding: 0;
  margin: 0 0 22px;
  list-style: none;
}

.plain-list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.mini-steps {
  display: grid;
  gap: 10px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.mini-steps li {
  display: flex;
  align-items: center;
  gap: 12px;
}

.mini-steps li span {
  display: inline-grid;
  place-items: center;
  width: 26px;
  height: 26px;
  flex: none;
  color: var(--white);
  background: var(--teal-700);
  border-radius: 50%;
  font-size: 13px;
  font-weight: 800;
}

/* 定制开发能力 */
.capability-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

/* 关于页首屏压缩 */
.about-body {
  max-width: 820px;
  padding-top: 10px;
  padding-bottom: 14px;
}

.about-body p {
  margin-bottom: 0;
  font-size: 14.5px;
  line-height: 1.55;
}

.principles-section {
  padding-top: 14px;
  padding-bottom: 20px;
}

.principles-section .section-heading {
  margin-bottom: 20px;
}

.principles-section .capability-grid .product-card {
  min-height: 140px;
  padding: 14px 16px;
}

.principles-section .capability-grid .product-card p {
  font-size: 13px;
}

/* 登录页（一屏内完整呈现） */
.login-page {
  background: var(--soft);
}

.login-page .footer {
  display: none;
}

.login-shell {
  display: grid;
  place-items: center;
  min-height: calc(100vh - 74px);
  padding: 12px 20px;
}

.login-panel {
  width: min(100%, 440px);
  padding: 24px 30px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: var(--shadow-md);
}

.login-panel h1 {
  margin: 18px 0 10px;
  font-size: 26px;
}

.login-form {
  display: grid;
  gap: 12px;
  margin: 18px 0 12px;
}

.login-form label {
  display: grid;
  gap: 8px;
  font-weight: 700;
}

.login-form input,
.login-form select {
  width: 100%;
  min-height: 42px;
  padding: 0 12px;
  font: inherit;
  color: var(--ink);
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
}

.login-form select {
  cursor: pointer;
}

.login-form input:focus,
.login-form select:focus {
  outline: none;
  border-color: var(--teal-600);
  box-shadow: 0 0 0 3px rgba(19, 117, 123, 0.15);
}

.login-form .button {
  width: 100%;
}

/* 法律页 */
.legal {
  max-width: 860px;
  padding: 40px var(--pad) 88px;
}

.legal h1 {
  font-size: 38px;
  margin: 18px 0 22px;
}

.legal h2 {
  margin: 30px 0 10px;
  font-size: 21px;
  color: var(--ink);
}

.legal p {
  margin-bottom: 16px;
}

/* 404 */
.notfound {
  display: grid;
  place-items: center;
  min-height: 62vh;
  padding: 64px 24px;
  text-align: center;
}

.nf-code {
  font-size: clamp(72px, 12vw, 140px);
  font-weight: 800;
  line-height: 1;
  margin: 0 0 8px;
  background: linear-gradient(120deg, var(--teal-700), var(--green-600));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* ============ 页脚 ============ */
.footer {
  color: var(--footer-text);
  background: var(--ink);
}

.footer-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr);
  gap: 40px;
  max-width: var(--container);
  margin: 0 auto;
  padding: 56px var(--pad);
}

.footer-brand p {
  margin: 18px 0 0;
  color: var(--footer-text);
  font-size: 14.5px;
}

.footer-col {
  display: grid;
  align-content: start;
  gap: 10px;
}

.footer-col strong {
  margin-bottom: 8px;
  color: var(--white);
  font-size: 14px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.footer-col a {
  font-size: 15px;
  transition: color 0.16s ease;
}

.footer-col a:hover {
  color: var(--white);
  text-decoration: underline;
}

/* 电话为纯文本（非链接），原本继承 body 16px，比同列邮箱/网址（15px）大一号 → 统一 */
.footer-col > span {
  font-size: 15px;
}

.footer-meta {
  font-size: 13.5px;
  color: #7f9399;
}

/* ============ 响应式 ============ */
@media (max-width: 1080px) {
  .menu-toggle {
    display: flex;
  }

  .nav {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 60;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    gap: 4px;
    width: min(320px, 84vw);
    padding: 84px 20px 28px;
    background: var(--white);
    border-left: 1px solid var(--line);
    box-shadow: var(--shadow-lg);
    transform: translateX(-16px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: transform 0.24s ease, opacity 0.24s ease, visibility 0.24s;
    overflow-y: auto;
  }

  .nav.open {
    transform: translateX(0);
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .nav a {
    padding: 14px 16px;
    font-size: 16px;
  }

  .nav-login {
    display: block;
    margin-top: 12px;
    color: var(--white);
    background: var(--ink);
    border-radius: 10px;
    text-align: center;
    font-weight: 700;
  }

  .nav-backdrop {
    position: fixed;
    inset: 0;
    z-index: 55;
    background: rgba(15, 31, 36, 0.4);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.24s ease;
  }

  .nav-backdrop.show {
    opacity: 1;
    pointer-events: auto;
  }

  .hero,
  .split,
  .contact-section,
  .contact-layout,
  .product-detail,
  .product-hero {
    grid-template-columns: 1fr;
  }

  .detail-pair {
    grid-template-columns: 1fr;
  }

  .product-grid,
  .capability-grid,
  .capability-groups {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .capability-grid.cols-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .steps,
  .steps-5 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cta-band {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 680px) {
  .site-header {
    padding: 12px 18px;
  }

  .header-actions .login-link {
    display: none;
  }

  .hero,
  .section {
    padding-left: 18px;
    padding-right: 18px;
  }

  .page-head,
  .breadcrumb {
    padding-left: 18px;
    padding-right: 18px;
  }

  .product-grid,
  .capability-grid,
  .capability-groups,
  .scenario-grid,
  .steps,
  .steps-5,
  .form-grid {
    grid-template-columns: 1fr;
  }

  .form-grid .span-2 {
    grid-column: span 1;
  }

  .hero {
    gap: 36px;
  }

  .hero-visual {
    transform: none;
  }

  .cta-band {
    margin-left: 18px;
    margin-right: 18px;
  }

  .footer-inner {
    grid-template-columns: 1fr;
    gap: 28px;
    padding: 44px 18px;
  }
}


/* ===== 页面结构补充（来自 2026-09-05 重建版，仅保留新页面 class 规则） ===== */

.hero-points {
margin-bottom: 28px;
}

.capabilities-section {
background: var(--soft);
}

.capability-card {
padding: 28px 24px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  transition: transform .25s, box-shadow .25s, border-color .25s;
}

.capability-card:hover {
transform: translateY(-3px);
  border-color: var(--teal-600);
  box-shadow: var(--shadow-md);
}

.cap-icon {
display: grid;
  place-items: center;
  ;
  ;
  ;
  color: var(--teal-600);
  background: var(--teal-100);
  border-radius: 10px;
}

.cap-icon .icon {
width: 24px; height: 24px;
}

.capability-card h3 {
;
  font-weight: 600;
  ;
}

.capability-card p {
font-size: 14px;
  color: var(--muted);
  ;
}

.template-teaser-list {
max-width: 720px;
  margin: 0 auto;
  display: grid;
  gap: 14px;
}

.template-teaser-list li {
display: grid;
  grid-template-columns: 88px 1fr;
  grid-template-rows: auto auto;
  gap: 4px 16px;
  padding: 16px 0;
  border-top: 1px solid var(--line);
  align-items: start;
}

.template-teaser-list li:first-child {
border-top: 0;
}

.template-code {
grid-row: 1 / 3;
  ; /* 与正文/英文页字体保持一致（原 JetBrains Mono 等宽，用户要求统一） */
  ;
  ;
  ;
  ;
  padding: 4px 8px;
  background: var(--soft);
  border: 1px solid var(--line);
  ;
  text-align: center;
}

.template-teaser-list strong {
font-weight: 600;
  font-size: 15px;
}

.template-teaser-list span {
font-size: 13px;
  color: var(--muted);
}

.basic-note {
text-align: center;
  font-size: 14px;
  color: var(--muted);
  max-width: 640px;
  margin: 32px auto 0;
}

.scenario-shot {
display: block;
  aspect-ratio: 16 / 10;
  background: var(--soft);
  overflow: hidden;
}

.scenario-shot img {
width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s;
}

.scenario-card:hover .scenario-shot img {
;
}

.scenario-body {
padding: 20px 24px 24px;
}

.scenario-body h3 {
font-size: 18px;
  font-weight: 600;
  margin-bottom: 8px;
}

.scenario-body p {
color: var(--muted);
  font-size: 14px;
}

.faq-section {
background: var(--soft);
}

.footer-bottom {
max-width: var(--container);
  margin: 32px auto 0;
  padding-top: 20px;
  border-top: 1px solid #1f353b;
  text-align: center;
}

.footer-meta-line {
display: inline-flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 12px;
  color: var(--footer-text);
  font-size: 12px;
}

.footer-meta-line a {
color: var(--footer-text);
}

.footer-meta-line a:hover {
color: #fff;
}

.meta-sep {
color: #3a5358;
}

.footer-beian {
display: inline-flex;
  align-items: center;
  gap: 6px;
}

.beian-icon {
width: 14px;
  height: 14px;
  opacity: 0.8;
}

.to-top.show, .to-top.visible {
opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}


/* ===== 联系页：模板体验引导条移至联系方式卡片下方（9/2 增改） ===== */
.contact-intro .contact-guide {
  padding: 0;
  margin-top: 20px;
}
.contact-intro .contact-guide-inner {
  display: block;
  padding: 14px 18px;
}
.contact-intro .contact-guide-inner p {
  margin-bottom: 10px;
  font-size: 14px;
  line-height: 1.6;
}
.contact-intro .contact-guide-inner .button {
  display: inline-block;
  min-height: 36px;
  padding: 8px 18px;
  font-size: 13.5px;
}
@media (min-width: 900px) {
  .contact-intro .contact-guide-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 20px;
  }
  .contact-intro .contact-guide-inner p {
    flex: 1 1 300px;
    margin-bottom: 0;
  }
}

/* ===== 联系表单增强组件（区号 / 国家搜索 / 联系时间一行） ===== */
.contact-form .field-row {
  display: flex;
  gap: 8px;
  align-items: center;
}
.contact-form .field-row select,
.contact-form .field-row input {
  width: auto;
}
.contact-form .phone-field .phone-code {
  flex: 0 0 46%;
  min-width: 0;
}
.contact-form .phone-field input[name="phoneNum"] {
  flex: 1 1 auto;
  min-width: 0;
}
.contact-form .field-row-3 {
  flex-wrap: nowrap;
}
.contact-form .field-row-3 .tz-sel {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 44%;
}
.contact-form .field-row-3 input[type="time"] {
  flex: 1 1 0;
  min-width: 92px;
}
.contact-form .hint-text,
.contact-form .method-other-hint {
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--teal-700);
}
.contact-form select[name="bestMethod"],
.contact-form .tz-sel {
  cursor: pointer;
}
@media (max-width: 700px) {
  .contact-form .phone-field .phone-code {
    flex: 0 0 42%;
  }
}

/* ===== 联系表单提示与需求类型 ===== */
.contact-form .req-hint { font-size: 12px; color: var(--muted); margin: 0 0 10px; }
.contact-form .need-note { font-size: 13px; color: var(--teal-700); margin: 0 0 10px; padding: 8px 10px; background: var(--teal-50); border-radius: 6px; }
.contact-page .contact-guide { padding-top: 0; }


/* ============ 9/5 新增页面区块布局（恢复补充） ============ */

/* about：关于页两列（简介 + 联系卡） */
.about-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: 28px;
  align-items: start;
  max-width: 1000px;
}
.about-intro p {
  font-size: 16px;
  color: var(--muted);
  line-height: 1.8;
}

/* templates：模板网格与卡片 */
.template-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 24px;
}
.template-card {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  display: flex;
  flex-direction: column;
}
.template-card:hover {
  border-color: var(--teal-600);
  box-shadow: var(--shadow-lg);
  transform: translateY(-2px);
}
.template-shot {
  display: block;
  ;
  background: var(--soft);
  overflow: hidden;
}
.template-shot img {
  ;
  ;
  ;
  transition: transform .3s ease;
}
.template-card:hover .template-shot img { transform: scale(1.03); }
.template-body {
  padding: 18px 20px 20px;
  display: flex;
  flex-direction: column;
  ;
  flex: 1;
}
.template-body h3 { ; font-weight: 600; color: var(--ink); margin: 0; }
.template-body p { ; color: var(--muted); line-height: 1.6; margin: 0; }
.template-code {
  display: inline-block;
  font-family: inherit; /* 统一为正文/英文页字体（原等宽 JetBrains Mono） */
  font-weight: 700;
  letter-spacing: .02em;
  font-size: 12px;
  color: var(--teal-700);
  background: var(--teal-50);
  border: 1px solid var(--teal-200);
  padding: 3px 8px;
  border-radius: 6px;
  width: fit-content;
}
.template-actions { margin-top: auto; padding-top: 8px; }
.template-tagline { color: var(--teal-700); font-weight: 600; }
.template-exports { font-size: 13px; color: var(--muted); }

/* industries / 首页场景卡 */
.scenario-card-img { display: block; width: 100%; }
.scenario-pain { color: var(--warn, #b45309); font-size: 13px; margin-top: 6px; }
.demo-note-line { color: var(--muted); font-size: 12px; }

/* solutions：可交付形态区（复用 product-grid）与折叠 / FAQ */
.deliverables-section .product-grid { margin-top: 8px; }
.extensions-fold {
  margin-top: 26px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--white);
}
.extensions-fold summary {
  cursor: pointer;
  padding: 14px 18px;
  font-weight: 600;
  color: var(--teal-700);
  list-style: none;
}
.extensions-fold summary::-webkit-details-marker { display: none; }
.extensions-fold summary::before { content: "▸ "; }
.extensions-fold[open] summary::before { content: "▾ "; }
.extensions-fold .steps-note {
  padding: 0 18px 6px;
  color: var(--muted);
  font-size: 13px;
}
.extensions-fold .product-grid { padding: 4px 18px 18px; }
.extensions-fold .product-card.ext { grid-column: span 1; }

/* FAQ 折叠 */
.faq-item {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  overflow: hidden;
}
.faq-item + .faq-item { margin-top: 10px; }
.faq-more { margin-top: 10px; }
.faq-more summary { cursor: pointer; padding: 13px 16px; font-weight: 600; color: var(--teal-700); list-style: none; }
.faq-more summary::-webkit-details-marker { display: none; }
.faq-more summary::after { content: " ＋"; }
.faq-more[open] summary::after { content: " －"; }
.faq-more-list { padding: 0 16px 12px; color: var(--muted); font-size: 14px; line-height: 1.7; }

/* 区块段间距统一 */
.steps-section {}
.section > .product-grid, .section > .capability-grid { margin-top: 4px; }

/* 移动端 */
@media (max-width: 900px) {
  .about-grid { grid-template-columns: 1fr; }
  .template-grid { grid-template-columns: 1fr; }
}


/* ===== 表单 label / 必填星号 / 提示（contact 页） ===== */
.contact-form .field-label { font-size: 13px; font-weight: 600; color: var(--ink); }
.contact-form .req { color: var(--warn, #c0392b); margin-right: 2px; }
.form-grid .field-label { display: block; margin-bottom: 2px; }

/* 模板页顶部说明行（basic-note-line） */
.basic-note-line { font-size: 14px; }

/* 区块容器微调（无需强样式，保证 section 内 margin 归零避免双倍） */
.templates-section > .basic-note { margin-bottom: 26px; }
/* ============================================================
   9/7 最终版 · hero 轮播与页面微调（唯一权威来源）
   轮播 = 固定外框 + 横向滑动；D3 图表悬浮查看数据
   ============================================================ */

/* ---------- H1 定位语（两行语义断行，字号适配列宽） ---------- */
.hero-copy h1 {
  font-size: clamp(24px, 3.1vw, 46px);
  line-height: 1.36;
  letter-spacing: 0;
  max-width: 680px;
}
.hero-copy h1 span { display: block; }

/* ---------- hero 两列比例（宽屏）：左文宽 / 右图窄，图表不挤文字 ---------- */
@media (min-width: 1081px) {
  .hero {
    grid-template-columns: minmax(0, 1.12fr) minmax(330px, 0.88fr);
    gap: 48px;
  }
}

/* ---------- 图表不再倾斜 ---------- */
.hero-visual { transform: none; }

/* ---------- 轮播外框：固定尺寸 + 裁切窗口 ---------- */
.hero-carousel {
  position: relative;
}
.hero-carousel .carousel-track {
  position: relative;
  display: flex;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 6px 6px 10px 10px;
  background: #ffffff;
  transition: transform 0.55s cubic-bezier(0.45, 0, 0.25, 1);
}
.hero-carousel .carousel-slide {
  position: relative;
  flex: 0 0 100%;
  min-width: 100%;
  display: block;
  overflow: hidden;
  border-radius: inherit;
  cursor: pointer;
}



/* 轮播底部说明条（信息条，不覆盖图表） */
.hero-carousel .carousel-cap {
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: 6px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 6px 12px;
  padding: 6px 12px;
  color: #24363c;
  background: #f4f8f7;
  border: 1px solid #e2ecea;
  border-radius: 8px;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.4;
}
.hero-carousel .carousel-cap em {
  ;
  ;
  ;
  ;
  ;
}

/* 2026-09-11 v27：移除“悬停出现→圆圈”提示（用户反馈为多余箭头；如后续需要恢复，删掉下面这条 content:none 即可） */
.hero-carousel .carousel-slide::after { content: none !important; display: none !important; }

/* 圆点导航 */
.hero-carousel .carousel-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 0 0;
}
.hero-carousel .carousel-dot {
  ;
  ;
  padding: 0;
  border: 0;
  ;
  background: #e2ecea;
  ;
  ;
}
.hero-carousel .carousel-dot.is-active {
  background: #0e5f65;
  ;
}

/* D3 tooltip */
.hero-carousel .d3-tip {
  position: absolute;
  pointer-events: none;
  z-index: 6;
  padding: 6px 11px;
  border-radius: 8px;
  background: rgba(15, 31, 36, 0.92);
  color: #fff;
  font-size: 12.5px;
  line-height: 1.5;
  box-shadow: 0 6px 16px rgba(15, 31, 36, 0.18);
  transition: opacity 0.12s ease;
  max-width: 220px;
  white-space: nowrap;
}
.hero-carousel .d3-tip b { color: #9ad7d2; font-weight: 700; margin-right: 4px; }

/* ---------- 场景卡：真实 Chart.js 交互图（悬浮查看数据） ---------- */
.scenario-shot.scenario-chart {
  display: block;
  aspect-ratio: 16 / 10;
  background: #ffffff;
  overflow: hidden;
  position: relative;
}
.scenario-shot.scenario-chart .demo-chart {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}
.scenario-shot .shot-hint,
.template-shot .shot-hint {
  position: absolute;
  left: 10px;
  bottom: 10px;
  z-index: 2;
  padding: 5px 12px;
  border-radius: 999px;
  color: #fff;
  background: rgba(14, 95, 101, 0.92);
  font-size: 12px;
  font-weight: 700;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity 0.2s ease, transform 0.2s ease;
  pointer-events: none;
}
.scenario-shot:hover .shot-hint,
.template-shot:hover .shot-hint { opacity: 1; transform: translateY(0); }

/* 必填星号与字段同行（contact 表单） */
.form-grid label {
  display: grid;
  gap: 6px;
}
.form-grid label .field-label {
  display: block;
  font-weight: 700;
  font-size: 14px;
  line-height: 1.4;
}
.form-grid label .req {
  color: #c0392b;
  margin-right: 3px;
  font-weight: 800;
}

/* ---------- 免费模板页首屏紧凑 ---------- */
.templates-page .page-head { padding-top: clamp(8px, 1.4vw, 16px); padding-bottom: 2px; }
.templates-page .page-head h1 { margin-bottom: 6px; font-size: clamp(24px, 3vw, 34px); }
.templates-page .page-head p:not(.eyebrow) { margin-bottom: 0; }
.templates-page .templates-section { padding-top: clamp(4px, 0.8vw, 10px); }
.templates-page .template-body { padding: 12px 16px 14px; }
.templates-page .template-body .card-top { margin-bottom: 8px; }
.templates-page .template-body h3 { font-size: 16px; margin-bottom: 6px; }
.templates-page .template-exports { margin-bottom: 8px; }
.templates-page .template-body > p:not(.module-note) { font-size: 13.5px; line-height: 1.55; margin-bottom: 10px; }
.templates-page .template-grid { gap: 16px; margin-bottom: 14px; }
.templates-page .templates-section > .basic-note {
  margin: 0 auto 12px;
  padding: 8px 14px;
  font-size: 13px;
  line-height: 1.5;
  text-align: center;
  color: #0a4a4f;
  background: #eff8f7;
  border: 1px solid #bcd9d5;
  border-radius: 10px;
  font-weight: 600;
  max-width: none;
}
.basic-note-line { white-space: nowrap; }

/* ---------- 联系页首屏紧凑 ---------- */
.contact-page .contact-guide { padding-top: clamp(4px, 0.8vw, 10px); }
.contact-page .contact-guide-inner { padding: 8px 14px; }
.contact-page .contact-guide-inner p { font-size: 13.5px; line-height: 1.45; }
.contact-page .contact-guide-inner .button { min-height: 32px; padding: 0 12px; font-size: 13px; }
.contact-page .contact-layout { padding-top: clamp(2px, 0.6vw, 6px); gap: 24px; }
.contact-page .contact-intro h1 { margin-bottom: 6px; font-size: clamp(24px, 3vw, 32px); }
.contact-page .contact-intro > p { font-size: 13.5px; line-height: 1.55; }
.contact-page .contact-intro .contact-card { margin-top: 10px; padding: 16px 18px; }
.contact-page .contact-card p { margin-bottom: 8px; font-size: 13.5px; }
.contact-page .contact-form { padding: 16px 18px; }
.contact-page .contact-form h2 { margin-bottom: 8px; font-size: 20px; }
.contact-page .form-grid { gap: 6px; }
.contact-page .form-grid label { gap: 3px; font-size: 13px; }
.contact-page .form-grid input,
.contact-page .form-grid select,
.contact-page .form-grid textarea { padding: 8px 10px; }
.contact-page .req-hint { margin: 0 0 8px; font-size: 12px; }
.contact-page .need-note { margin: 0 0 10px; padding: 8px 12px; font-size: 13px; }
.contact-page .contact-form .button { margin-top: 8px; min-height: 40px; }
.contact-page .form-note { font-size: 12px; }
.contact-page .form-feedback { margin: 10px 0 0; padding: 10px 12px; font-size: 13px; }

/* 行业场景页免责声明单行（宽屏） */
.demo-note-line { max-width: none; font-size: 13px; }
@media (min-width: 1200px) { .demo-note-line { white-space: nowrap; } }

/* 小屏适配 */
@media (max-width: 700px) {
  .hero-copy h1 { font-size: clamp(21px, 5.8vw, 29px); line-height: 1.38; }
  .hero-carousel .carousel-track { aspect-ratio: 4 / 3; }
  .hero-carousel .carousel-cap { font-size: 11.5px; padding: 5px 10px; }
  .hero-carousel .carousel-cap em { font-size: 11px; }
}

/* ============================================================
   9/7 v9 最终方案：轮播改为「绝对定位叠放 + active 切换」
   不再平移整条轨道（规避真实浏览器 GPU 合成差异导致的
   “页面横滑/看不到切换内容”问题）。外框固定，内容在框内切换。
   ============================================================ */

.hero-carousel .carousel-track {
  position: relative;
  display: block;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 6px 6px 10px 10px;
  background: #ffffff;
}

/* 每张 slide：全部叠放在同一位置；默认隐藏，当前张显示 */
.hero-carousel .carousel-slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  transform: translateX(24px);
  transition: opacity 0.45s ease, transform 0.45s ease, visibility 0s linear 0.45s;
  overflow: hidden;
  border-radius: inherit;
  cursor: pointer;
  pointer-events: none;
}

.hero-carousel .carousel-slide.is-active {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
  transition: opacity 0.45s ease, transform 0.45s ease, visibility 0s;
  pointer-events: auto;
}

/* 前一张略向左滑出，新一张从右滑入：仍保留“横滑”观感但不移动轨道 */
.hero-carousel .carousel-slide.is-leaving {
  opacity: 0;
  transform: translateX(-24px);
  transition: opacity 0.45s ease, transform 0.45s ease, visibility 0s linear 0.45s;
}

/* 图表与说明条位置不变 */


.hero-carousel .carousel-cap {
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: 6px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 6px 12px;
  padding: 6px 12px;
  color: #24363c;
  background: #f4f8f7;
  border: 1px solid #e2ecea;
  border-radius: 8px;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.4;
}
.hero-carousel .carousel-cap em {
  ;
  white-space: nowrap;
  ;
  ;
  ;
}

/* 导航圆点不变 */
.hero-carousel .carousel-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 0 0;
}
.hero-carousel .carousel-dot {
  width: 9px;
  height: 9px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #e2ecea;
  cursor: pointer;
  transition: background 0.2s ease, transform 0.2s ease;
}
.hero-carousel .carousel-dot.is-active {
  background: #0e5f65;
  transform: scale(1.35);
}

@media (max-width: 700px) {
  .hero-carousel .carousel-track { aspect-ratio: 4 / 3; }
}

/* ============================================================
   9/7 v10：hero 图表改为 Chart.js canvas（与场景卡/素材库看板同引擎）
   ============================================================ */

/* hero 图表画布铺满图表区（底部留 caption） */
.hero-carousel .carousel-slide 

/* 兼容旧 .d3-stage 规则一并覆盖为 canvas 布局 */



/* ============================================================
   
/* ============================================================
   9/7 v11：radar 用方形区域居中（Chart.js radar 需近方形）
   ============================================================ */



/* ============================================================
   9/7 v12：hero 图表外层固定容器（canvas 填满容器，与 caption 分离）
   ============================================================ */
.hero-carousel .carousel-slide .hero-chart-box {
  position: absolute;
  top: 8px;
  left: 10px;
  right: 10px;
  bottom: 56px; /* caption 上方留 56px */
  overflow: hidden;
}
.hero-carousel .carousel-slide canvas[data-hero] {
  width: 100% !important;
  height: 100% !important;
  ;
}
/* radar 在容器内居中方形 */

/* ============================================================
   9/7 v12：hero 图表外层固定容器（canvas 填满容器，与 caption 分离）
   ============================================================ */
.hero-carousel .carousel-slide .hero-chart-box {
  position: absolute;
  top: 8px;
  left: 10px;
  right: 10px;
  bottom: 56px;
  overflow: hidden;
}
.hero-carousel .carousel-slide canvas[data-hero] {
  width: 100% !important;
  height: 100% !important;
  display: block;
}
/* radar 居中方形（Chart.js radar 需近方形） */
.hero-carousel .carousel-slide canvas[data-hero="radar-compare"] {
  flex: 0 0 262px;
  width: 262px !important;
  height: 262px !important;
  max-width: 262px !important;
  margin: 0 auto;
}

/* hero-chart-box 用 flex 居中（radar 等方形图） */
.hero-carousel .carousel-slide .hero-chart-box {
  display: flex;
  align-items: center;
  justify-content: center;
}
.hero-carousel .carousel-slide canvas[data-hero] {
  flex: 1 1 auto;
}

/* ============================================================
   9/7 v13：高级图补充样式（矩形树/桑基/热力/漏斗/仪表/箱线/平行/弦/旭日）
   ============================================================ */
.hero-d3-tip {
  position: fixed;
  z-index: 9000;
  padding: 6px 12px;
  border-radius: 8px;
  background: rgba(15, 31, 36, 0.92);
  color: #fff;
  font-size: 12.5px;
  line-height: 1.5;
  font-family: var(--font, 'Microsoft YaHei', sans-serif);
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.12s ease;
  white-space: nowrap;
  box-shadow: 0 6px 16px rgba(15,31,36,.18);
}

/* ============================================================
   9/8 v14：轮播左右切换箭头（← 上一张 / → 下一张，仅新增）
   ============================================================ */
.hero-carousel .carousel-arrow {
  opacity: 0.86;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 30;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255,255,255,0.92);
  color: #0e5f65;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 3px 10px rgba(15,31,36,.16);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform .18s ease, background .18s ease;
}
.hero-carousel .carousel-arrow:hover { background: #e8f4f2; }
.hero-carousel .carousel-arrow:active { background: #d7ece9; }
.hero-carousel .carousel-arrow:focus-visible { outline: 2px solid #0e5f65; outline-offset: 2px; }
.hero-carousel .carousel-arrow.prev { left: 6px; }
.hero-carousel .carousel-arrow.next { right: 6px; }
.hero-carousel .carousel-arrow svg { width: 16px; height: 16px; display: block; }

/* ============================================================
   9/8 v15：环形日历 note-dot 闪烁（1:1 复刻参考页 MEEF）
   ============================================================ */
.hero-carousel .carousel-slide .note-dot {
  animation: noteBlink 1.2s ease-in-out infinite;
  transform-box: fill-box;
  transform-origin: center;
  filter: drop-shadow(0 0 3px rgba(255, 255, 255, 0.95));
  cursor: pointer;
}
@keyframes noteBlink {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.35; transform: scale(0.68); }
}

/* ============================================================
   9/8 v16：轮播角落虚构演示数据角标（不逐图标注）
   ============================================================ */
.hero-carousel .hero-demo-note {
  position: absolute;
  left: 12px;
  bottom: 46px;
  z-index: 22;
  margin: 0;
  font-size: 11px;
  line-height: 1.5;
  color: #8a999e;
  background: rgba(255, 255, 255, 0.82);
  border-radius: 6px;
  padding: 2px 8px;
  pointer-events: none;
  max-width: calc(100% - 24px);
}
/* carousel-cap 单行化（去掉右侧悬浮提示后） */
.hero-carousel .carousel-cap {
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: 6px;
  display: block;
  padding: 6px 12px;
  color: #24363c;
  background: #f4f8f7;
  border: 1px solid #e2ecea;
  border-radius: 8px;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.4;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 首页价值主张墙：6 卡 3 列 */
.capability-grid.cols-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media (max-width: 980px) {
  .capability-grid.cols-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .capability-grid.cols-3 { grid-template-columns: 1fr; }
}

/* ============================================================
   9/8 v17：首页 对比区 + 企业进阶区
   ============================================================ */
.compare-section { background: #ffffff; }
.compare-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin-top: 18px;
}
.compare-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr);
  gap: 10px;
  align-items: stretch;
}
.compare-cell {
  border-radius: 10px;
  padding: 12px 16px;
  font-size: 14px;
  line-height: 1.55;
}
.compare-cell.theirs {
  background: #f7f2ef;
  color: #7a6359;
  border: 1px solid #efddd3;
}
.compare-cell.ours {
  background: #e9f4f1;
  color: #1f4a45;
  border: 1px solid #cfe5df;
  font-weight: 600;
}
.cmp-x { color: #c47a63; font-weight: 800; margin-right: 6px; }
.cmp-check { color: #2e9e6b; font-weight: 800; margin-right: 6px; }

.enterprise-section { background: #f2f8f7; }
.enterprise-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 18px;
}
.enterprise-card {
  background: #ffffff;
  border: 1px solid #e2ecea;
  border-radius: 12px;
  padding: 20px 22px;
  box-shadow: 0 6px 18px rgba(15, 31, 36, 0.05);
}
.enterprise-card .cap-icon { margin-bottom: 10px; }
.enterprise-card h3 { margin: 0 0 8px; font-size: 17px; color: #0e5f65; }
.enterprise-card p { margin: 0 0 8px; font-size: 14px; line-height: 1.65; color: #24363c; }
.enterprise-card small { font-size: 12px; color: #5F6F76; line-height: 1.5; display: block; }
@media (max-width: 760px) {
  .compare-row { grid-template-columns: 1fr; }
  .enterprise-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   9/9 v18：内页（非首页）紧凑化 —— 首屏内看到主要模块
   ============================================================ */
body.has-page-head .section,
.page-head + main .section {
  padding-top: 30px;
  padding-bottom: 34px;
}
body.has-page-head .section-heading { margin-bottom: 14px; }
body.has-page-head .section-heading h2 { font-size: 24px; }
body.has-page-head .section-heading p.eyebrow { margin-bottom: 4px; }
body.has-page-head .page-head { padding-bottom: 2px; }
body.has-page-head .page-head h1 { font-size: 30px; }
body.has-page-head .page-head > p:last-child { margin-top: 6px; max-width: 780px; }
@media (max-width: 900px) {
  body.has-page-head .section { padding-top: 22px; padding-bottom: 26px; }
}
.capability-grid.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 720px) { .capability-grid.cols-2 { grid-template-columns: 1fr; } }

/* ============================================================
   9/9 v19：首页模板两列分组（免费 / 演示）
   ============================================================ */
.template-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-top: 6px;
}
.template-col {
  border: 1px solid #e2ecea;
  border-radius: 12px;
  background: #fbfdfc;
  padding: 6px 18px 14px;
}
.template-col-title {
  margin: 10px 0 4px;
  font-size: 15px;
  color: #0e5f65;
  display: flex;
  align-items: center;
  gap: 8px;
}
.template-col-title::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #0e5f65;
}
.template-col .template-teaser-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.template-col .template-teaser-list li {
  ;
  ;
  ;
  padding: 10px 2px;
  border-bottom: 1px dashed #e4ecee;
}
.template-col .template-teaser-list li:last-child { ; }
.template-col .template-teaser-list strong { ; ; ; }
.template-col .template-teaser-list span:last-child { color: #5f6f76; font-size: 12.5px; line-height: 1.5; }
@media (max-width: 760px) {
  .template-cols { ; }
}

/* ============================================================
   UI-1/B（2026-09-10）：卡片分区 + 断行防治 + 首页免费模板 2×2 美化
   ============================================================ */
/* 1) 全局断行防治：标题平衡断行、正文避免孤字尾行、编号/徽章不换行 */
h1, h2, h3, h4 { text-wrap: balance; word-break: keep-all; overflow-wrap: break-word; }
p, li { text-wrap: pretty; }
.template-code, .group-count { white-space: nowrap; }
/* 2) 模板卡：名称区（编号+徽章 / 名称）与描述区明显分层 */
.template-body .card-top { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.template-body h3 { ; line-height: 1.4; margin: 0; }
.template-body .template-tagline {
  border-top: 1px dashed var(--line);
  padding-top: 10px;
  margin-top: 2px;
}
.template-body .template-desc {
  background: var(--soft);
  border-radius: 10px;
  padding: 10px 12px;
  font-size: 13px;
  line-height: 1.65;
  color: var(--muted);
}
.template-exports { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; padding: 0; margin: 0; }
.template-exports li {
  background: var(--teal-50);
  color: var(--teal-700);
  border: 1px solid var(--teal-200);
  border-radius: 999px;
  padding: 2px 9px;
  font-size: 12px;
  white-space: nowrap;
}
/* 3) 首页免费模板区：2×2 迷你卡（编号行 + 名称 + 描述三层，不再挤成一行） */
.template-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.template-col { padding: 8px 16px 14px; }
.template-col .template-teaser-list { display: grid; gap: 12px; }
.template-col .template-teaser-list li {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-areas: "code name" "desc desc";
  gap: 4px 10px;
  align-items: center;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--white);
}
.template-col .template-teaser-list li:last-child { border-bottom: 1px solid var(--line); }
.template-col .template-teaser-list .template-code { grid-area: code; }
.template-col .template-teaser-list strong {
  grid-area: name;
  font-size: 15px;
  color: var(--ink);
  white-space: normal;
  text-wrap: balance;
}
.template-col .template-teaser-list span:not(.template-code) {
  grid-area: desc;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.6;
}
@media (max-width: 760px) {
  .template-cols { grid-template-columns: 1fr; }
}

/* ============================================================
   UI-5（2026-09-10）：国际化/科技感 tokens（克制）
   —— 统一交互动效、焦点可访问性、首屏细微网格与光晕
   ============================================================ */
:focus-visible { outline: 2px solid var(--teal-600, #0E5F65); outline-offset: 2px; border-radius: 6px; }
button, .button, a.button { transition: transform .15s ease, box-shadow .2s ease, background-color .2s ease; }
button:hover, .button:hover { transform: translateY(-1px); }
.card, .template-card, .scenario-card, .enterprise-card, .contact-card { transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }

/* 首屏：极淡网格 + 顶部光晕（纯 CSS，无外部资源；不遮挡内容） */
.hero { position: relative; isolation: isolate; }
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(14, 95, 101, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(14, 95, 101, .055) 1px, transparent 1px);
  background-size: 28px 28px;
  -webkit-mask-image: radial-gradient(120% 95% at 72% 6%, #000 26%, transparent 74%);
  mask-image: radial-gradient(120% 95% at 72% 6%, #000 26%, transparent 74%);
}
.hero::after {
  content: "";
  position: absolute;
  inset: -10% -5% auto -5%;
  height: 60%;
  z-index: 0;
  pointer-events: none;
  background: radial-gradient(60% 60% at 78% 0%, rgba(47, 154, 160, .10), transparent 70%);
}
.hero > * { position: relative; z-index: 1; }

/* 轮播容器细边框 + 极浅投影（提升数据感） */
.hero-carousel { border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 10px 30px rgba(15, 31, 36, .06); }

/* 通用工具类：信任徽章行（页脚/关于页可复用） */
.trust-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.trust-row span {
  font-size: 11.5px;
  color: var(--teal-700, #0E5F65);
  background: var(--teal-50, #F1F7F6);
  border: 1px solid var(--line, #E2ECEA);
  border-radius: 999px;
  padding: 3px 10px;
  white-space: nowrap;
}

/* ============================================================
   UI-6（2026-09-10）：行业卡 D2 —— 自然色彩 + 硬分割 + 高级感细节
   （去掉去饱和、满铺网格与底部白渐变，解决"灰蒙蒙"）
   ============================================================ */
.scenario-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 1px 2px rgba(15, 31, 36, .04), 0 12px 30px -12px rgba(15, 31, 36, .18);
  transition: transform .28s cubic-bezier(.2, .7, .3, 1), box-shadow .28s ease, border-color .28s ease;
}
.scenario-card:hover {
  transform: translateY(-3px);
  border-color: #CFDEDC;
  box-shadow: 0 2px 4px rgba(15, 31, 36, .05), 0 22px 44px -16px rgba(15, 31, 36, .24);
}
.scenario-card .scenario-shot { position: relative; aspect-ratio: 16 / 9; overflow: hidden; display: block; background: #0b2b2e; }
.scenario-card .scenario-shot img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s cubic-bezier(.2, .7, .3, 1); }
.scenario-card:hover .scenario-shot img { transform: scale(1.035); }
.scenario-card .veil {
  position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(8, 38, 40, .30) 0%, rgba(8, 38, 40, 0) 58%),
    linear-gradient(180deg, rgba(8, 38, 40, .16) 0%, rgba(8, 38, 40, 0) 42%);
}
.scenario-card .mesh {
  position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image:
    linear-gradient(rgba(255, 255, 255, .10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .10) 1px, transparent 1px);
  background-size: 26px 26px;
  -webkit-mask-image: linear-gradient(180deg, #000 0%, transparent 34%);
  mask-image: linear-gradient(180deg, #000 0%, transparent 34%);
}
.scenario-card .scenario-badge {
  position: absolute; left: 14px; top: 14px; z-index: 3;
  font-size: 11.5px; color: #fff; padding: 4px 11px; border-radius: 999px;
  background: rgba(10, 40, 42, .42); border: 1px solid rgba(255, 255, 255, .34);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.scenario-card .scenario-no {
  position: absolute; right: 14px; top: 14px; z-index: 3;
  ; letter-spacing: .08em; color: rgba(255, 255, 255, .92);
  border-bottom: 1px solid rgba(255, 255, 255, .5); padding-bottom: 1px;
}
.scenario-card .scenario-flag {
  position: absolute; left: 14px; bottom: 14px; z-index: 3;
  font-size: 11px; color: #08403F; padding: 3px 9px; border-radius: 999px;
  background: rgba(255, 255, 255, .92); border: 1px solid rgba(255, 255, 255, .7);
}
.scenario-card .scenario-split { height: 2px; background: linear-gradient(90deg, var(--teal-700, #0E5F65) 0 44px, var(--line, #E4EBEA) 44px 100%); }
.scenario-card .scenario-body { padding: 16px 18px 18px; display: flex; flex-direction: column; ; flex: 1; }
.scenario-card .scenario-headline { margin: 0; ; ; letter-spacing: -.15px; color: var(--ink); }
.scenario-card .scenario-desc { margin: 0; font-size: 13px; color: var(--muted); line-height: 1.6; }
.scenario-card .scenario-pain {
  margin: 0; ; color: #7A5A1E; background: #FFFBF1;
  border: 1px solid #F3E7CE; border-left: 3px solid #E3B961; border-radius: 8px; padding: 7px 10px;
}
.scenario-card .lbl { ; font-weight: 700; color: var(--teal-700, #0E5F65); ; }
.scenario-card .scenario-chips { display: flex; flex-wrap: wrap; ; ; }
.scenario-card .chip-f { font-size: 11.5px; white-space: nowrap; border-radius: 6px; padding: 3px 9px; border: 1px solid var(--line); background: #fff; ; }
.scenario-card .chip-o { font-size: 11.5px; white-space: nowrap; border-radius: 6px; padding: 3px 9px; border: 1px solid #BEDCD6; background: #fff; color: #0B5B52; font-weight: 600; }
.scenario-card .scenario-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 2px; }
.scenario-card .sfact { border: 1px solid var(--line); border-radius: 10px; padding: 9px 11px; background: #fff; }
.scenario-card .sfact b { display: block; font-size: 13.5px; color: var(--teal-700, #0E5F65); letter-spacing: -.1px; }
.scenario-card .sfact span { font-size: 11.5px; color: var(--muted); }
.scenario-card .scenario-foot { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 10px; border-top: 1px solid var(--line); ; }
.scenario-card .scenario-foot .card-link { ; ; text-decoration: none; ; }
.scenario-card .scenario-foot .scenario-note { font-size: 11px; color: var(--muted); max-width: 52%; text-align: right; line-height: 1.45; }
.scenario-card .scenario-go { margin-top: auto; color: var(--teal-700, #0E5F65); font-size: 13px; font-weight: 600; }
.scenario-grid { align-items: stretch; }
.scenario-card { height: 100%; }
.home .scenarios-section .scenario-grid,
.industries-section .scenario-grid { gap: 24px; }
@media (max-width: 640px) { .scenario-card .scenario-facts { grid-template-columns: 1fr; } }

/* ============================================================
   9/9 v20：首页整体压缩（模块全保留但更紧凑）
   ============================================================ */
body:not(.has-page-head) .section {
  padding-top: 44px;
  padding-bottom: 48px;
}
body:not(.has-page-head) .hero { padding-bottom: 16px; }
body:not(.has-page-head) .section-heading { margin-bottom: 16px; }
body:not(.has-page-head) .scenario-body { padding: 14px 18px 18px; }
body:not(.has-page-head) .scenario-shot { aspect-ratio: 16 / 9; }
@media (max-width: 900px) {
  body:not(.has-page-head) .section { padding-top: 30px; padding-bottom: 34px; }
}

/* FAQ 列表：序号独立、不与文字重叠，2 列紧凑 */
.faq-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.faq-list li {
  position: relative;
  background: #fbfdfc;
  border: 1px solid #e2ecea;
  border-radius: 12px;
  padding: 16px 18px 16px 58px;
  margin: 0;
}
.faq-list li .step-num {
  position: absolute;
  top: 16px;
  left: 16px;
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #e6f1ef;
  color: #0e5f65;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 800;
}
.faq-list h3 { margin: 0 0 6px; font-size: 15px; color: #1f3136; line-height: 1.45; }
.faq-list p { margin: 0; font-size: 13px; line-height: 1.6; color: #4c5d63; }
.faq-more-list { margin-top: 12px; }
.faq-more-list .faq-item {
  padding: 12px 4px;
  border-bottom: 1px dashed #e2ecea;
}
@media (max-width: 860px) {
  .faq-list { grid-template-columns: 1fr; }
}

/* ============================================================
   9/9 v21：联系我们 一屏可见 + 引导按钮同行；关于我们留白
   ============================================================ */
.contact-guide-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 18px;
  padding: 10px 16px;
}
.contact-guide-inner p { margin: 0; flex: 1 1 auto; min-width: 240px; }
.contact-guide-inner .button { flex: 0 0 auto; }
.contact-guide { margin-top: 12px; }
.contact-layout { padding-top: 6px; }
.contact-intro h1 { margin: 2px 0 8px; }
.contact-intro > p { margin: 0 0 14px; line-height: 1.7; }
.contact-form { padding: 16px 18px; }
.contact-form .form-grid { gap: 10px 14px; }
.contact-form label { gap: 4px; margin-bottom: 0; }
.contact-form input,
.contact-form select,
.contact-form textarea { padding: 7px 10px; font-size: 13px; }
.contact-card { padding: 16px 18px; }
.contact-card h3, .contact-card h2 { margin-top: 0; }
/* 关于我们：卡片与正文留白 */
.about-body .about-grid { gap: 44px; }
.about-body .about-grid > div { padding-top: 8px; }
.about-body .about-grid .about-intro { line-height: 1.9; }
@media (max-width: 860px) {
  .contact-layout { grid-template-columns: 1fr; }
}
/* 联系我们整页一屏（约 900px 视口内） */
body.contact-page .contact-guide { margin-top: 4px; }
body.contact-page .contact-guide-inner { padding: 8px 14px; }
body.contact-page .contact-layout { ; }
body.contact-page .contact-intro .eyebrow { ; }
body.contact-page .contact-form .form-grid textarea { rows: 2; }
body.contact-page .contact-form h2 { margin: 0 0 8px; ; }
body.contact-page .req-hint { margin: 4px 0 8px; }
body.contact-page .form-note { margin-top: 8px; }
/* 联系我们再压缩：目标 ~900px 一屏（1440 视口） */
body.contact-page .contact-guide { margin-top: 0; padding-top: 4px; }
body.contact-page .contact-guide-inner { padding: 6px 12px; }
body.contact-page .contact-layout { padding-top: 0; gap: 18px; }
body.contact-page .contact-intro .eyebrow { margin: 0; }
body.contact-page .contact-intro h1 { margin: 2px 0 6px; ; }
body.contact-page .contact-intro > p { font-size: 13.5px; margin-bottom: 10px; }
body.contact-page .contact-form { padding: 12px 14px; }
body.contact-page .contact-form h2 { font-size: 18px; margin-bottom: 4px; }
body.contact-page .form-grid { row-gap: 6px; column-gap: 12px; }
body.contact-page .contact-form label { font-size: 12px; }
body.contact-page .contact-form input,
body.contact-page .contact-form select { padding: 5px 8px; }
body.contact-page .contact-form textarea { padding: 5px 8px; }
body.contact-page .contact-card { padding: 10px 14px; font-size: 13px; }
body.contact-page .contact-card p { margin: 3px 0; }
body.contact-page .contact-form .form-note { font-size: 11px; margin: 4px 0 0; }
body.contact-page .contact-form .form-feedback { margin: 2px 0; }
/* FAQ 分组标题 */
.faq-group { margin-top: 6px; }
.faq-group-title {
  margin: 4px 0 10px;
  font-size: 15px;
  font-weight: 700;
  color: #0e5f65;
  padding-left: 10px;
  border-left: 3px solid #2f9aa0;
}
.faq-group + .faq-group { margin-top: 18px; }

/* ============================================================
   9/9 v22：场景卡改静态图（防抄袭：不暴露活图表实现）
   ============================================================ */
.scenario-shot-img { position: relative; }
.scenario-shot-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.scenario-shot-img .shot-tip {
  position: absolute;
  left: 8px;
  bottom: 8px;
  z-index: 2;
  font-size: 11px;
  line-height: 1.5;
  color: #3c5056;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid #e2ecea;
  border-radius: 6px;
  padding: 2px 9px;
  max-width: calc(100% - 16px);
}
.scenario-shot-img:hover img { transform: scale(1.02); }
.scenario-shot-img img { transition: transform 0.25s ease; }
.footer-copy-note {
  margin: 8px auto 0;
  max-width: 900px;
  font-size: 11.5px;
  line-height: 1.6;
  color: rgba(255,255,255,0.62);
  text-align: center;
}

/* ============================================================
   9/9 v23：行业目录（8 行业卡 + 首页行业横条）
   ============================================================ */
.scenario-charts {
  margin: 6px 0 10px;
  font-size: 12px;
  color: #5F6F76;
  line-height: 1.6;
}
.scenario-charts span { color: #0e5f65; font-weight: 600; }
a.scenario-link { display: block; text-decoration: none; color: inherit; border-radius: 12px; transition: transform .2s ease, box-shadow .2s ease; }
a.scenario-link:hover { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(15,31,36,.12); }
a.scenario-link:hover img { transform: scale(1.03); }
.scenario-go { display: block; margin-top: 8px; color: #0e5f65; font-size: 13px; font-weight: 600; }
.industries-section .scenario-card-img,
.home .scenarios-section .scenario-card-img { overflow: hidden; }

/* 短段落平衡断行（消除"末行只剩一个字/词"的孤儿） */
.steps-section p, .templates-section .how p, .capability-grid p, .step-list p,
.home .steps-section p, .templates-page .how p { text-wrap: balance; }


/* 行业页底部统一能力条（替代逐卡重复卖点；并说明服务器部署升级路径） */
.feature-strip {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px;
  margin-top: 22px; padding: 16px 18px;
  background: var(--soft); border: 1px solid var(--line); border-radius: 14px;
}
.feature-strip .fs-item b { display: block; font-size: 13.5px; color: var(--teal-700, #0E5F65); margin-bottom: 2px; }
.feature-strip .fs-item span { ; color: var(--muted); line-height: 1.55; ; }
@media (max-width: 760px) { .feature-strip { grid-template-columns: 1fr; } }

/* 行业卡：痛点统一两行高度，卡片更整齐；字段提示小字 */
.scenario-card .scenario-pain { flex: 0 0 auto; font-size: 11.5px; padding: 6px 9px; height: 32px; box-sizing: border-box; display: flex; align-items: center;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.scenario-card .chips-note { margin: 6px 0 0; ; color: var(--muted); }

/* 首页免费模板区：CTA 紧跟卡片 + 紧凑说明 */
.templates-cta-row { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-top: 18px; }
.templates-cta-row .button.primary { padding: 11px 22px; font-size: 14px; }
.templates-mini-note { margin: 0; font-size: 12px; color: var(--muted); line-height: 1.6; flex: 1 1 320px; }

/* 免费模板区：标题旁直达入口（首屏可见，避免"要滚才看到按钮"） */
.heading-quick-link { margin: 8px 0 0; }
.heading-quick-link a {
  font-size: 13.5px; color: var(--teal-700, #0E5F65); font-weight: 600; text-decoration: none;
  border-bottom: 1px dashed #BBD9D4; padding-bottom: 1px;
}
.heading-quick-link a:hover { border-bottom-style: solid; }


/* ============================================================
   About 页 B 版（三段式通栏）——2026-09-10
   ============================================================ */
.about-hero-section { padding-top: 26px; }
.about-hero {
  background: linear-gradient(135deg, #0E5F65 0%, #12707A 58%, #2F9AA0 100%);
  color: #fff; border-radius: 16px; padding: 34px 36px 38px;
  box-shadow: 0 18px 40px -18px rgba(14, 95, 101, .45);
}
.about-hero .eyebrow { ; }
.about-hero h1 { color: #fff; font-size: 30px; margin: 4px 0 10px; letter-spacing: -.3px; }
.about-lede { color: rgba(255, 255, 255, .94); font-size: 16px; margin: 0 0 14px; max-width: 62ch; }
.about-body-text { color: rgba(255, 255, 255, .82); font-size: 14px; line-height: 1.75; margin: 14px 0 0; max-width: 78ch; }
.about-badges { display: flex; flex-wrap: wrap; gap: 8px; }
.about-badges span {
  font-size: 12px; color: #EAF7F5; background: rgba(255, 255, 255, .14);
  border: 1px solid rgba(255, 255, 255, .32); border-radius: 999px; padding: 4px 11px; white-space: nowrap;
}
.about-stats {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px;
  margin: -22px 18px 0; position: relative; z-index: 2;
}
.about-stat {
  background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px;
  box-shadow: 0 10px 26px -14px rgba(15, 31, 36, .28);
}
.about-stat b { display: block; font-size: 22px; color: var(--teal-700, #0E5F65); letter-spacing: -.3px; }
.about-stat span { font-size: 12.5px; color: var(--muted); }
.about-cols-section { ; }
.about-cols { display: grid; grid-template-columns: 1.15fr .85fr; gap: 34px; align-items: start; }
.about-services h2 { font-size: 19px; margin: 0 0 10px; color: var(--ink); }
.about-services ul { margin: 0; padding-left: 18px; }
.about-services li { ; ; ; margin-bottom: 6px; }
.about-cta-col .contact-card { padding: 18px 20px; }
.about-cta-col .contact-card h3, .contact-card h2 { margin-top: 0; }
@media (max-width: 860px) {
  .about-stats { grid-template-columns: 1fr; margin: -16px 10px 0; }
  .about-cols { grid-template-columns: 1fr; gap: 22px; }
  .about-hero { padding: 24px 20px 28px; }
  .about-hero h1 { font-size: 24px; }
}


/* ============================================================
   2026-09-10 第 4 轮：导航加粗+当前页高亮 / 行业卡排版放大 / About 收紧
   ============================================================ */
/* 1) 顶部导航：统一加粗，当前页加外框+底色+颜色 */
.nav a { font-weight: 600; color: #2B3A3F; }
.nav a:hover { font-weight: 700; }
.nav a.active {
  font-weight: 700; color: var(--teal-700, #0E5F65);
  background: var(--teal-50, #F1F7F6);
  border: 1px solid #BEDCD6;
  box-shadow: inset 0 -2px 0 rgba(14, 95, 101, .35);
}

/* 2) 行业卡排版放大、去碎感（字更大、留白更整、CTA 做成按钮） */
.scenario-card .scenario-badge { font-size: 12.5px; padding: 5px 12px; }
.scenario-card .scenario-no { font-size: 12px; }
.scenario-card .scenario-body { padding: 18px 20px 20px; gap: 12px; }
.scenario-card .scenario-headline { font-size: 18px; line-height: 1.35; font-weight: 700; }
.scenario-card .scenario-pain { font-size: 13px; height: 36px; padding: 8px 11px; }
.scenario-card .lbl { font-size: 12px; letter-spacing: .08em; }
.scenario-card .scenario-chips { gap: 7px; margin-top: 5px; }
.scenario-card .chip-f,
.scenario-card .chip-o { font-size: 12.5px; padding: 4px 10px; border-radius: 8px; }
.scenario-card .chip-f { border-color: #D9E5E3; color: #33474D; }
.scenario-card .chips-note { font-size: 12.5px; margin-top: 7px; }
.scenario-card .scenario-foot { padding-top: 14px; }
.scenario-card .scenario-foot .card-link {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--teal-700, #0E5F65); color: #fff;
  padding: 9px 16px; border-radius: 9px; font-size: 13.5px; font-weight: 600;
  transition: background .18s ease, transform .18s ease;
}
.scenario-card .scenario-foot .card-link:hover { background: #0B4F54; transform: translateY(-1px); }

/* 3) About：去掉三格事实卡后，下方模块上移、通栏收紧 */
.about-hero { padding-bottom: 30px; }
.about-cols-section { padding-top: 18px; }


/* ============================================================
   2026-09-10 第 5 轮：导航简化 / 英文排版 / 行业卡"规格列表"
   ============================================================ */
/* 1) 导航当前页：只改文字颜色（去外框与底色） */
.nav a.active {
  border: none; background: transparent; box-shadow: none;
  color: var(--teal-700, #0E5F65); font-weight: 700;
}

/* 2) 英文页面排版（西文优先字体栈 + 更适合拉丁字母的字距/行宽） */
html[lang="en"] { --font: "Inter", "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, "PingFang SC", "Microsoft YaHei", sans-serif; }
html[lang="en"] body { letter-spacing: .002em; }
html[lang="en"] h1, html[lang="en"] h2, html[lang="en"] h3, html[lang="en"] h4 { letter-spacing: -.012em; }
html[lang="en"] .section-heading > p, html[lang="en"] .page-head > p { max-width: 78ch; }
html[lang="en"] .scenario-body p, html[lang="en"] .spec-v { max-width: 74ch; }
html[lang="en"] .nav a { letter-spacing: .01em; }
html[lang="en"] .button, html[lang="en"] a.button { letter-spacing: .01em; }
html[lang="en"] .eyebrow { letter-spacing: .14em; }

/* 3) 行业卡"规格列表"（替代密集小 chips，形成整块信息） */
.spec-list { border-top: 1px solid var(--line); margin-top: 2px; }
.spec-row { ; ; gap: 12px; padding: 10px 0; ; }
.spec-k { ; ; ; }
.spec-v { ; ; ; }
.spec-v.teal { ; font-weight: 600; }
@media (max-width: 520px) { .spec-row { grid-template-columns: 1fr; gap: 4px; } }

/* 规格列表：平衡断行，避免末行只剩一个字 */
.spec-v { text-wrap: balance; }
.spec-row { ; }

/* 规格值：词组不可拆分（消除末行孤字） */
.spec-i { white-space: nowrap; }
.spec-sep { ; padding: 0 3px; }
.spec-v { text-wrap: pretty; }

/* ============================================================
   2026-09-10 第 6 轮：英文页字阶修正（借鉴 Dasen Packaging 字阶逻辑）
   参考站实测：H1 40.8px/700 · H2 33.6px/700 · H3 18.7px/700 · 正文 16px/1.58
   我们原状：H1 34.1px < H2 37.9px（层级倒挂）+ H3 行高 1.18（英文小标题过挤）
   ============================================================ */
html[lang="en"] h1 { font-size: clamp(38px, 3.2vw, 46px); line-height: 1.16; letter-spacing: -.018em; }
html[lang="en"] h2, html[lang="en"] .section-heading h2 { font-size: clamp(27px, 2.3vw, 34px); line-height: 1.24; letter-spacing: -.014em; }
html[lang="en"] h3 { font-size: 18.7px; line-height: 1.36; letter-spacing: -.006em; }
html[lang="en"] .hero { padding-top: 58px; padding-bottom: 54px; }
/* 中文侧同步修掉小标题过挤（1.18 → 1.32） */
h3 { line-height: 1.32; }

/* ============================================================
   2026-09-10 第 7 轮：版面分量增强（回应"板块单薄/痛点块单薄"）
   诊断：9 区块中 6 个纯白，交替底色仅 4% 差；区块 padding 仅 44px；无深色锚点
   ============================================================ */
:root { --band-soft: #EDF4F2; }

/* 1) 区块交替底色加深 + 间距放大（形成节奏） */
.section { padding-top: 68px; padding-bottom: 72px; }
.capabilities-section, .enterprise-section, .faq-section, .scenarios-section { background: var(--band-soft); }
.compare-section, .templates-section, .steps-section { background: #fff; }
@media (max-width: 720px) { .section { padding-top: 48px; padding-bottom: 52px; } }

/* 2) 收尾 CTA 做成深色带（全站唯一深色锚点，立即有分量） */
.contact-section { background: linear-gradient(135deg, #0C3B40 0%, #092A2E 100%); }
.contact-section .section-heading h2 { ; }
.contact-section .section-heading > p { ; }
.contact-section .eyebrow { ; background: rgba(255,255,255,.10); ; }
.contact-section .contact-card { background: rgba(255,255,255,.07); ; }
.contact-section .contact-card p { ; }
.contact-section .contact-card a { ; }
.contact-section .button.primary { background: #fff; ; }

/* 3) 标题区结构感：eyebrow 胶囊 + 标题下短线 */
.eyebrow { display: inline-block; font-size: 12px; letter-spacing: .16em; text-transform: uppercase;
  color: #0E5F65; background: #E9F3F1; border: 1px solid #D2E6E2; border-radius: 999px; padding: 5px 12px; margin-bottom: 12px; }
.section-heading h2::after, .page-head h2::after { content: ""; display: block; width: 46px; height: 2px;
  background: #0E5F65; opacity: .38; margin: 14px auto 0; }
.page-head h2::after { margin-left: 0; }

/* 4) 行业卡：痛点块加厚 + "能出什么图"升为浅青面板（卡片不再白连白） */
.scenario-pain { min-height: 50px; display: flex; align-items: center; padding: 12px 14px; font-size: 13.5px;
  line-height: 1.5; border-left-width: 4px; border-radius: 10px; }
.spec-row:has(.spec-v.teal) { background: #F1F8F7; border: 1px solid #D9EAE7; border-radius: 10px;
  padding: 11px 13px; margin: 6px 0 2px; }
.scenario-card { border-color: #D8E5E3; box-shadow: 0 8px 22px rgba(11, 43, 46, .07); }
.scenario-body { padding: 20px 20px 22px; ; }
.scenario-card h3, .scenario-headline { font-size: 19px; }

/* 第 7 轮补丁：提高优先级压过原有 44px/17px 规则 */
body:not(.has-page-head) .section { padding-top: 68px; padding-bottom: 72px; }
body:not(.has-page-head) .section-heading .eyebrow,
.section-heading .eyebrow, .page-head .eyebrow { font-size: 12px; line-height: 1.4; font-weight: 600; }
body:not(.has-page-head) .scenario-body { padding: 20px 20px 22px; row-gap: 14px; }
@media (max-width: 720px) {
  body:not(.has-page-head) .section { padding-top: 48px; padding-bottom: 52px; }
}

/* 第 7 轮补丁 2：子页面（has-page-head）也生效 */
main .scenario-body, .scenario-body { padding: 20px 20px 22px; row-gap: 14px; }
main .scenario-card h3, .scenario-headline { font-size: 19px; }

/* 第 7 轮补丁 3：压过 .scenario-card .scenario-body 的旧间距 */
.scenario-card .scenario-body { padding: 20px 20px 22px; gap: 14px; }

/* 移动端子页面留白（22px 太挤） */
@media (max-width: 720px) {
  body.has-page-head .section { padding-top: 34px; padding-bottom: 40px; }
}

/* ============================================================
   2026-09-10 第 8 轮：按反馈精修（不动已确认模块）
   ============================================================ */
/* ① 首页底部恢复为通用 CTA 带（撤销第 7 轮深色带，避免与页脚黑块冲突） */
.contact-section { background: transparent; }
.contact-section .section-heading h2 { color: var(--ink); }
.contact-section .section-heading > p { color: var(--muted); }
.contact-section .eyebrow { ; background: #E9F3F1; border-color: #D2E6E2; }
.contact-section .contact-card { background: #fff; border-color: var(--line); }
.contact-section .contact-card p { color: var(--ink); }
.contact-section .contact-card a { color: #0E5F65; }
.contact-section .button.primary { background: var(--teal-700, #0E5F65); color: #fff; }

/* ④ 深底 hero 上的胶囊徽标：改为浅底深字（原白字白底看不见） */
.about-hero .eyebrow { color: #0B3B3F; background: rgba(255, 255, 255, .92); border-color: rgba(255, 255, 255, .55); }

/* ⑤ 联系页：顶部引导条加底色；CONTACT 与标题不再挤 */
.contact-page .contact-guide .contact-guide-inner, .contact-guide .contact-guide-inner {
  background: #EDF4F2; border: 1px solid #D9E7E4; border-radius: 12px; padding: 12px 16px;
}
body.contact-page .contact-intro .eyebrow, .contact-intro .eyebrow { margin-bottom: 12px; }
.contact-intro h1 { margin: 0 0 12px; }
.contact-intro > p { margin-bottom: 14px; }

/* ③ 行业卡：两行都做成规范面板（对齐、等高、统一描边） */
.spec-list { display: grid; gap: 8px; border-top: none; margin-top: 2px; }
.spec-row { background: #FBFDFC; border: 1px solid #E7F0EE; ; padding: 11px 13px;
  margin: 0; ; ; ; ; }
.spec-row:has(.spec-v.teal) { background: #F1F8F7; border-color: #D9EAE7; }
.spec-k { padding-top: 1px; }

/* ⑥ 英文：试用参考站字体（Helvetica/Arial）并修文字外溢 */
html[lang="en"] { --font: "Helvetica Neue", Helvetica, Arial, sans-serif; }
html[lang="en"] .spec-i { ; }
html[lang="en"] .spec-v { ; }
.spec-row { overflow-wrap: break-word; }

/* 联系页：CONTACT 与标题间距再放宽一点 */
body.contact-page .contact-intro h1, .contact-intro h1 { margin: 4px 0 12px; }
body.contact-page .contact-intro .eyebrow { margin-bottom: 14px; }

/* 第 8 轮补丁：HERO 装饰光晕溢出（1584px 宽 → 横向滚动 72px） */
.hero { overflow-x: clip; }
main { overflow-x: clip; }

/* ============================================================
   2026-09-10 第 9 轮：语义化转行 / 短线左对齐 / 行业卡收口 / 英文专用排版
   ============================================================ */
/* ① 语义化换行：标题用 pretty 避免末行孤字，正文同理 */
h1, h2, h3 { text-wrap: pretty; }
p, li, .spec-v, .chip, .card-link, .footer-copy-note, .scenario-pain { text-wrap: pretty; }
.hero h1, .hero h1 span { text-wrap: pretty; }
/* 中文避孤字：允许标点挤压、禁止行首标点 */
body { line-break: strict; }

/* ② 标题下短线：改为跟随左对齐（原居中 387px 偏移） */
.section-heading h2::after, .page-head h2::after, .about-services h2::after { margin: 14px 0 0 0; }

/* ③ 行业卡：三块统一观感 + 收紧底部空白 + 更疏松的行距 */
.scenario-body { row-gap: 12px; justify-content: space-between; }
.scenario-pain { border-left-width: 3px; padding: 12px 14px; min-height: 52px; }
.spec-list { ; }
.spec-row { padding: 12px 14px; ; ; }
.spec-row:has(.spec-v.teal) { border-left: 3px solid #0E5F65; }
.spec-v { ; }
.spec-sep { padding: 0 5px; ; }
.chips-note { margin: 0; }
.scenario-foot { ; ; }
.scenario-card { padding-bottom: 0; }

/* ④ eyebrow 字重全站统一（联系页原本偏粗） */
.eyebrow, body.contact-page .contact-intro .eyebrow, .contact-intro .eyebrow { font-weight: 500; }
.section-heading .eyebrow, .page-head .eyebrow { font-weight: 500; }

/* ⑤ 英文专用排版（提字号/行高/行宽/按钮手感） */
html[lang="en"] body { font-size: 16.5px; line-height: 1.7; }
html[lang="en"] .hero-text, html[lang="en"] .section-heading > p, html[lang="en"] .split-body p { max-width: 66ch; }
html[lang="en"] .button { padding: 12px 22px; font-size: 15px; }
html[lang="en"] .hero h1 { max-width: 20ch; }
html[lang="en"] .spec-v { line-height: 1.75; }

/* ============================================================
   2026-09-10 第 10 轮：行业卡三块统一（标签同列 + 强调条同级 + 分隔号随前项）
   ============================================================ */
.spec-list { display: grid; gap: 14px; }
.spec-row { background: #FBFDFC; border: 1px solid #E7F0EE; border-left: 3px solid #C9D6D4;
  ; padding: 12px 14px; ; ; ; }
.spec-row .spec-k { color: #5F6F76; }
.spec-row.pain { background: #FFFBF1; border-color: #F3E7CE; border-left-color: #D9A93F; }
.spec-row.pain .spec-k { ; }
.spec-row.outputs, .spec-row:has(.spec-v.teal) { background: #F1F8F7; ; border-left-color: #0E5F65; }
.spec-row.outputs .spec-k { color: #0E5F65; }
.spec-i { white-space: nowrap; }
.spec-sep { color: #C9D6D4; padding: 0 5px; }
.scenario-body { row-gap: 12px; }
.chips-note { margin: 0; }
.scenario-foot { margin-top: 0; padding-top: 14px; }
.scenario-foot .button { padding: 11px 22px; }
.scenario-pain { display: none; }

/* 首屏收高：让 CTA 落在首屏内 */
.hero { padding-top: 60px; }
@media (max-width: 720px) { .hero { padding-top: 34px; } }

/* ============================================================
   2026-09-10 第 11 轮：行业卡行高/对齐/英文间距
   ============================================================ */
.spec-row { min-height: 44px; padding: 10px 13px; }
.spec-list { gap: 10px; }
.spec-v, .spec-k { text-align: left; }
.spec-v { ; }
.spec-v.teal { line-height: 1.5; }
.chips-note { ; }
/* 英文：逗号分隔、常规间距，词组不拆词 */
html[lang="en"] .spec-v { line-height: 1.55; }
html[lang="en"] .spec-i { white-space: nowrap; overflow-wrap: normal; }
html[lang="en"] .spec-sep { color: #C9D6D4; padding: 0; }
html[lang="en"] .spec-v { overflow-wrap: normal; hyphens: none; }

/* 第 11 轮补丁：英文标签列加宽 + 按钮内距/箭头间距 */
html[lang="en"] .spec-row { grid-template-columns: 106px minmax(0, 1fr); }
.spec-k { ; }
.scenario-foot .card-link { padding: 10px 18px; gap: 6px; display: inline-flex; align-items: center; }
.scenario-foot .card-link span[aria-hidden] { margin-left: 2px; }

/* 第 11 轮补丁 2：英文标签列回到 90px（配简短标签），避免内容被挤 */
html[lang="en"] .spec-row { grid-template-columns: 90px minmax(0, 1fr); }
.scenario-foot .card-link { padding: 10px 18px; }

/* 第 11 轮补丁 3：行高再收紧（zh 1.5 → 1.45；en 1.55 → 1.45） */
.spec-v, .spec-v.teal { line-height: 1.45; }
html[lang="en"] .spec-v, html[lang="en"] .spec-v.teal { line-height: 1.45; }
.chips-note { line-height: 1.45; }

/* ============================================================
   2026-09-10 第 12 轮：eyebrow 复原 / 卡片去"PPT 色块" / 轮播标题上移
   ============================================================ */
/* ① eyebrow 恢复原样式（13px / 800 / 字距 .08em / 大写 / 青绿，无胶囊底） */
.eyebrow, .section-heading .eyebrow, .page-head .eyebrow,
body.contact-page .contact-intro .eyebrow, .contact-intro .eyebrow {
  display: block; font-size: 13px; font-weight: 800; letter-spacing: .08em; line-height: 1.4;
  text-transform: uppercase; color: var(--teal-700, #0E5F65); background: transparent; border: none;
  border-radius: 0; padding: 0; margin: 0 0 12px;
}
.about-hero .eyebrow { color: rgba(255, 255, 255, .92); }
.contact-section .eyebrow { color: var(--teal-700, #0E5F65); }

/* ② 行业卡信息块：去掉色块与左侧色条，改为细分割线 + 胶囊标签（企业级规格块） */
.spec-list { display: block; }
.spec-row {
  display: grid; grid-template-columns: 76px minmax(0, 1fr); column-gap: 14px; align-items: baseline;
  background: transparent; border: none; border-bottom: 1px solid #EEF3F2; border-radius: 0;
  padding: 11px 0; min-height: 0; box-shadow: none;
}
.spec-row:last-child { border-bottom: none; padding-bottom: 2px; }
.spec-row.pain { border-left: none; }
.spec-k { font-size: 11.5px; font-weight: 600; letter-spacing: .06em; color: #93A3A6; white-space: nowrap; }
.spec-row.pain .spec-k { ; }
.spec-row.pain .spec-v { color: #7A6535; }
.spec-v { ; line-height: 1.6; ; }
.spec-v.teal { color: var(--teal-700, #0E5F65); }
html[lang="en"] .spec-row { grid-template-columns: 84px minmax(0, 1fr); }
html[lang="en"] .spec-k { letter-spacing: .04em; }
.tag {
  display: inline-block; border: 1px solid #DCE9E7; background: #FBFDFC; border-radius: 999px;
  padding: 1px 9px; margin: 2px 6px 2px 0; font-size: 12.5px; line-height: 1.65; color: var(--teal-700, #0E5F65);
}
.chips-note { margin-top: 6px; }

/* ③ 轮播：标题在图上方 */
.hero-carousel .carousel-cap {
  position: static; inset: auto; display: block; padding: 0 2px 10px; background: transparent;
  border: none; border-radius: 0; font-size: 14px; font-weight: 700; color: var(--ink, #1f3136);
  letter-spacing: .01em; text-align: left;
}
.hero-carousel .carousel-cap em { ; ; ; }
.hero-chart-box { min-height: 250px; }

/* 第 12 轮补丁：彻底去掉色块（压过第 10 轮的行底色/左色条） */
.spec-row.pain, .spec-row.pain:has(.spec-v) { background: transparent; border-left: none; border-color: #EEF3F2; }
.spec-row.outputs, .spec-row:has(.spec-v.teal) { background: transparent; border-left: none; border-color: #EEF3F2; }
.scenario-pain { background: transparent; border-left: none; }

/* 轮播标题：主标题 + 副标题 */
.hero-carousel .carousel-cap { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.hero-carousel .carousel-cap strong { font-size: 14.5px; font-weight: 700; color: var(--ink, #1f3136); letter-spacing: .01em; }
.hero-carousel .carousel-cap em { font-size: 12.5px; font-weight: 500; color: var(--muted, #5f6f76); font-style: normal; }

/* ============================================================
   2026-09-10 第 13 轮：About 胶囊修复 / 轮播 flex 布局 / 卡片标签字号统一
   ============================================================ */
/* ① 关于页深底 hero 上的 eyebrow：白字白底（看不见）→ 透明底白字 */
.about-hero .eyebrow {
  color: rgba(255, 255, 255, .95); background: transparent; border: none; padding: 0;
  font-size: 13px; font-weight: 800; letter-spacing: .1em;
}

/* ② 轮播：标题在上、图表在下（改 flex 列布局，不再绝对定位压住标题） */
.hero-carousel .carousel-slide { display: flex; flex-direction: column; }
.hero-carousel .carousel-slide .carousel-cap { padding: 10px 12px 8px; flex: 0 0 auto; }
.hero-carousel .carousel-slide .hero-chart-box {
  position: static; inset: auto; flex: 1 1 auto; min-height: 0; margin: 0 10px 8px; overflow: hidden;
}

/* ③ 行业卡：左侧标签字号与右侧文字一致（13.5px），仅以颜色/字重区分层级 */
.spec-k { font-size: 13.5px; font-weight: 600; color: #6B7C80; letter-spacing: .01em; }
.spec-row.pain .spec-k { color: #A9905A; }
.spec-row.outputs .spec-k, .spec-row:has(.tag) .spec-k { color: var(--teal-700, #0E5F65); }
.spec-v { font-size: 13.5px; color: #2B3F45; }
.cards-note { max-width: 900px; margin: 14px auto 12px; text-align: center; font-size: 12.5px; color: var(--muted, #5F6F76); }

/* ============================================================
   2026-09-10 第 15 轮：能力条 4 项排成一行
   ============================================================ */
.feature-strip { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.feature-strip .fs-item span { font-size: 11.5px; text-wrap: pretty; }
@media (max-width: 1023px) { .feature-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .feature-strip { grid-template-columns: 1fr; } }

/* ============================================================
   2026-09-10 第 16 轮：卡片降高 / 联系页重排 / 多语言
   ============================================================ */
/* 报表与看板四模块：方框降低（中英同步） */
.capability-card { padding: 20px 20px 18px; }
.capability-card h3 { font-size: 17px; margin-bottom: 6px; }
.capability-card p { line-height: 1.5; }
.cap-icon { width: 40px; height: 40px; margin-bottom: 12px; }
.card-top { margin-bottom: 14px; }
.product-card { min-height: 172px; padding: 18px; }
.capability-grid .product-card { min-height: 138px; padding: 15px 16px; }
html[lang="en"] .capability-card { padding: 18px 18px 16px; }
html[lang="en"] .capability-card p { ; }
html[lang="en"] .product-card { ; }

/* 联系页：引导语移到左侧空白区；联系我们标题加强 */
.contact-guide-inline {
  margin-top: 18px; padding: 14px 16px; background: var(--band-soft, #EDF4F2);
  border: 1px solid #D9E7E4; border-radius: 12px;
}
.contact-guide-inline p { margin: 0 0 12px; font-size: 13px; color: #3E5459; line-height: 1.65; }
.contact-guide-inline .button.primary { padding: 10px 18px; font-size: 13.5px; }
body.contact-page .contact-intro h1 { font-size: 32px; letter-spacing: -.02em; }

/* 卡片段落改用 pretty（避免 balance 造成的末行孤字） */
.product-card p, .capability-card p, .template-card p, .template-body p, .split-body > p, .section-heading > p { text-wrap: pretty; }

/* ============================================================
   2026-09-11 第 17 轮：英文卡片降高与防贴边 / 联系页顶部留白 / 说明分行
   ============================================================ */
/* ① 卡片内文字不贴外框（右侧留出内缩），英文再降一档高度 */
.capability-card p, .product-card p, .capability-card h3, .product-card h3 { padding-right: 8px; }
html[lang="en"] .capability-card { padding: 16px 18px 14px; }
html[lang="en"] .capability-card h3 { font-size: 16.5px; padding-right: 12px; }
html[lang="en"] .capability-card p { font-size: 13.5px; line-height: 1.4; padding-right: 14px; }
html[lang="en"] .product-card { min-height: 146px; padding: 16px 18px 14px; }
html[lang="en"] .product-card p, html[lang="en"] .product-card h3 { padding-right: 12px; }
html[lang="en"] .capability-card p, html[lang="en"] .product-card p { hyphens: none; }

/* ② 联系页：CONTACT 与顶部留出与其他页面一致的间隙 */
body.contact-page .contact-layout { padding-top: 40px; }
@media (max-width: 760px) { body.contact-page .contact-layout { padding-top: 26px; } }

/* ③ 说明文字按语义分行，每行带指引符号 */
.note-lines { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 6px; max-width: 940px; }
.note-lines li { ; padding-left: 20px; ; ; ; }
.note-lines li::before { ; position: absolute; left: 0; top: 0; color: var(--teal-700, #0E5F65); font-weight: 700; }

/* 卡片底部标签统一贴底（四张卡视觉更齐） */
.product-card .card-note, .product-card .group-note, .product-card small, .capability-card small { margin-top: auto; }
.product-card { justify-content: flex-start; }

/* ============================================================
   2026-09-11 第 19 轮：关于页 C 方案 / 说明块去 PPT 感 / 单行句 / 远程协作强调
   ============================================================ */
/* 关于页 C：标准页头 + 卡片 */
.about-head-section .page-head { margin-bottom: 18px; }
.about-head-section .page-head h1 { font-size: 34px; }
.about-cols-top { grid-template-columns: 1.4fr 1fr; align-items: start; gap: 22px; }
.about-intro-card, .about-quick-card { padding: 22px 22px 20px; background: #fff; border: 1px solid var(--line); border-radius: 14px; }
.about-intro-card h2 { margin: 0 0 10px; font-size: 19px; color: var(--teal-700, #0E5F65); }
.about-intro-card p { margin: 0 0 12px; font-size: 14px; line-height: 1.75; color: #2B3F45; }
.about-quick-card h3 { margin: 0 0 12px; ; color: var(--teal-700, #0E5F65); }
.about-kv { display: grid; grid-template-columns: 84px 1fr; gap: 8px 12px; margin: 0; font-size: 13.5px; }
.about-kv dt { color: #6B7C80; }
.about-kv dd { margin: 0; color: #2B3F45; }
.about-badges-light span { background: var(--band-soft, #EDF4F2); border-color: #D9E7E4; color: #0E5F65; }
@media (max-width: 860px) { .about-cols-top { grid-template-columns: 1fr; } }

/* 说明块：去掉 PPT 感的箭头，改为细分隔线的信息块 */
.note-lines { list-style: none; margin: 14px 0 0; padding: 12px 16px; display: grid; gap: 0; max-width: 100%;
  background: #FBFDFC; border: 1px solid #E7F0EE; border-radius: 12px; }
.note-lines li { position: relative; padding: 8px 0; font-size: 12.5px; line-height: 1.65; color: var(--muted, #5F6F76); border-top: 1px solid #EEF3F2; }
.note-lines li:first-child { border-top: none; padding-top: 2px; }
.note-lines li:last-child { padding-bottom: 2px; }
.note-lines li::before { content: none; }
.note-lines li::after { content: ""; position: absolute; left: -16px; top: 15px; width: 5px; height: 5px;
  border-radius: 50%; background: #C9D6D4; }

/* 底部说明单行显示（桌面） */
.steps-note.one-line { max-width: 100%; font-size: 12.5px; }
@media (min-width: 1024px) { .steps-note.one-line { white-space: nowrap; } }

/* 联系页"远程协作"句：加大加粗 */
.contact-guide-inline p { font-size: 15px; font-weight: 700; color: #12333A; line-height: 1.6; }
.contact-guide-inline p::before { content: ""; }

/* ============================================================
   2026-09-11 第 20 轮：模板页 2×2 大图（深色卡片图，仅图表本身）
   ============================================================ */
.templates-page .template-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.template-shot { aspect-ratio: 16 / 10; background: #0C2830; }   /* 9/11：卡图外框降为原高度 3/4（配合局部贴图） */
.template-shot img { object-fit: cover; }
.template-body { padding: 20px 22px 22px; gap: 10px; }
.template-body h3 { font-size: 19px; }
.template-body p { font-size: 14.5px; }
@media (max-width: 1180px) { .templates-page .template-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; } }
@media (max-width: 720px) { .templates-page .template-grid { grid-template-columns: 1fr; gap: 16px; } }

/* 关于页 C：同级标题与标签样式统一 */
.about-head-section h2, .about-services h2, .principles-section h2,
.about-cols-section h2, .about-intro-card h2 { font-size: 20px; font-weight: 700; letter-spacing: -.01em; }
.about-quick-card h3 { font-size: 16px; font-weight: 700; }
.about-badges-light span, .about-badges span {
  display: inline-flex; align-items: center; background: var(--band-soft, #EDF4F2);
  border: 1px solid #D9E7E4; color: #0E5F65; border-radius: 999px; padding: 4px 12px; font-size: 12.5px; font-weight: 600;
}
.about-intro-card p:first-of-type { margin-top: 0; }

/* 关于页：同级区块标题统一 24px（卡片内标题保持 20/16px） */
.about-services h2, .principles-section h2, .about-cols-section h2, .about-head-section .section-heading h2 { font-size: 24px; font-weight: 700; }

/* 关于页 C：页头与卡片左边缘对齐（原来页头多 48px 缩进） */
.about-head-section .page-head { padding-left: 0; padding-right: 0; margin-left: 0; }
.about-head-section > .page-head, .about-head-section .page-head > * { text-align: left; }

/* 9/11 v24：轮播小标题中的强调词（如 OEE）加粗 */
.carousel-cap em b { font-weight: 800; color: var(--ink, #1f3136); }


/* ============================================================
   9/11 v3：对比区改版——单板双行（数据流向）+ 要点双列 + 对比表
   设计目标：不像 PPT 幻灯片——去掉左右两个大色块面板，改为一张对比板
   ============================================================ */
/* ============================================================
   9/11 v9：对比区 = 方案 F（双栏清单，无表格/无边框）
   左栏灰字=常见做法，右栏深色=我们；中间一条发丝线分隔
   ============================================================ */
.cmp-f { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0; margin-top: 26px; }
.cmp-col { padding: 0 34px; }
.cmp-col.theirs { padding-left: 0; }
.cmp-col.ours { position: relative; padding-right: 0; }
.cmp-col.ours::before { content: ""; position: absolute; left: 0; top: 4px; bottom: 4px; width: 1px; background: var(--line); }
.cmp-col h3 { margin: 0 0 18px; font-size: 15px; font-weight: 800; }
.cmp-chip { display: inline-flex; align-items: center; gap: 9px; border-radius: 999px; padding: 7px 15px; font-size: 13.5px; font-weight: 800; letter-spacing: .01em; }
.cmp-chip.theirs { background: #f1f3f4; color: #5b6b72; }
.cmp-chip.ours { background: var(--teal-100); color: var(--teal-700); }
.cmp-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; background: #9aa8ae; }
.cmp-chip.ours .cmp-dot { background: var(--green-600); }
.cmp-col ul { list-style: none; margin: 0; padding: 0; }
.cmp-col li { position: relative; padding-left: 31px; font-size: 15px; line-height: 1.66; margin-bottom: 14px; }
.cmp-col li::before { position: absolute; left: 0; top: 5px; width: 17px; height: 17px;
  background-repeat: no-repeat; background-position: center; background-size: 17px 17px; }   /* 内联 SVG：无外框、无 emoji 字体依赖、跨平台一致 */
.cmp-col.theirs li { color: var(--muted); }
.cmp-col.theirs li::before { content: ""; background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2020%2020%22%3E%3Cpath%20d%3D%22M5%205l10%2010M15%205L5%2015%22%20fill%3D%22none%22%20stroke%3D%22%23d2382c%22%20stroke-width%3D%222.5%22%20stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E"); }   /* 红叉（叉自身红色，无底） */
.cmp-col.ours li { color: var(--ink); font-weight: 600; }
.cmp-col.ours li::before { content: ""; background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2020%2020%22%3E%3Cpath%20d%3D%22M3.6%2010.9l4.05%204.15L16.4%205.15%22%20fill%3D%22none%22%20stroke%3D%22%230f9d63%22%20stroke-width%3D%223.15%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E"); }   /* 绿勾（勾自身绿色，无外框） */
.cmp-col.theirs b { font-weight: 800; color: #a8544a; }
.cmp-col.ours b { font-weight: 800; color: var(--teal-700); background: linear-gradient(transparent 60%, rgba(47, 150, 155, .20) 0); }
.compare-note { margin-top: 22px; padding: 13px 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--soft); color: var(--ink-soft); font-size: 13px; line-height: 1.75; }
html[lang="en"] .cmp-col li { font-size: 15px; line-height: 1.6; }
html[lang="en"] .cmp-chip { font-size: 14px; }
html[lang="en"] .compare-note { font-size: 14px; }
@media (max-width: 900px) {
  .cmp-f { grid-template-columns: 1fr; gap: 30px; margin-top: 20px; }
  .cmp-col { padding: 0; }
  .cmp-col.ours::before { content: none; }
  .cmp-col.ours { border-top: 1px solid var(--line); padding-top: 26px; }
}

/* ============================================================
   9/11 模板卡改版：变体3（标题压图）+ 1×4 + 正文只留 编号/能出什么图/按钮
   ============================================================ */
.templates-page .template-card { height: 100%; }
.template-shot { position: relative; }
.template-shot img { width: 100%; height: 100%; object-fit: cover; display: block; }
.template-shot::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(9,20,24,.06) 38%, rgba(9,20,24,.84) 100%); pointer-events: none; }
.template-shot .shot-cat { position: absolute; left: 10px; top: 10px; z-index: 2; background: rgba(9,20,24,.62); color: #e6f1f2; border-radius: 999px; padding: 4px 10px; font-size: 11.5px; font-weight: 700; backdrop-filter: blur(2px); }
.template-shot .group-count { position: absolute; right: 10px; top: 10px; z-index: 2; background: rgba(255,255,255,.9); border-color: rgba(255,255,255,.5); font-weight: 700; }
.template-shot .shot-cap { position: absolute; left: 12px; right: 12px; bottom: 10px; z-index: 2; color: #fff; }
.template-shot .shot-cap b { display: block; font-size: 15.5px; line-height: 1.32; text-wrap: balance; text-shadow: 0 1px 8px rgba(0,0,0,.55); }
.template-shot .shot-cap span { display: block; margin-top: 3px; font-size: 12px; opacity: .92; text-shadow: 0 1px 6px rgba(0,0,0,.5); }
.templates-page .template-body { padding: 12px 14px 14px; gap: 8px; }
.tpl-charts { display: flex; flex-direction: column; gap: 4px; }
.tpl-charts .tpl-k { font-size: 12px; font-weight: 800; color: var(--teal-700); letter-spacing: .04em; }
.tpl-charts .tpl-v { display: grid; grid-template-columns: 1fr 1fr; column-gap: 10px; row-gap: 3px; align-items: baseline; font-size: 13px; line-height: 1.62; color: var(--ink-soft); }
.tpl-charts .tpl-i { display: flex; align-items: baseline; gap: 5px; font-style: normal; white-space: nowrap; min-width: 0; }
.tpl-charts .tpl-i::before { content: "•"; color: var(--teal-600, #0E5F65); font-size: 15px; line-height: 1; margin-right: 2px; }
html[lang="en"] .tpl-charts .tpl-v { font-size: 12.5px; }
.templates-page .template-actions { margin-top: auto; }
.templates-page .template-actions .button { width: 100%; justify-content: center; }
@media (max-width: 1180px) {
  .template-shot .shot-cap b { font-size: 16px; }
}

/* 表单蜜罐字段（反垃圾，人不可见；被填即视为机器人） */
.hp-field { position: absolute !important; left: -9999px; width: 1px; height: 1px; opacity: 0; overflow: hidden; }

/* 联系页：所有控件统一高度（select 默认比 input 矮 3–4px，会被看出不齐） */
.contact-form input:not([type="hidden"]), .contact-form select, .contact-form .combo-input { height: 34.4px; box-sizing: border-box; }

/* 联系页：电话行 / 最佳联系时间行 —— 行内控件横向排布
   标签仍在控件上方（与姓名/邮箱等字段一致），不改变其它字段的上下布局 */
.phone-field, .time-field, .combo { display: flex; width: 100%; align-items: center; gap: 8px; min-width: 0; }
.time-field { flex-wrap: nowrap; }
.phone-field, .time-field { gap: 12px; }   /* 组内控件间距 = 列间距 12px，与两列网格节奏一致 */
.time-field select { flex: 1 1 auto; min-width: 0; }
.time-field select[name="bestFrom"], .time-field select[name="bestTo"] { flex: 0 0 auto; width: 100px; }
.contact-form .time-field select[name="bestFrom"], .contact-form .time-field select[name="bestTo"] { height: 34.4px; }
.time-field .combo { flex: 0 0 326.3px; }   /* 时区框 = 左列宽，整行贴合两列网格，不再越过分栏线 */
.contact-form .time-field select[name="bestFrom"], .contact-form .time-field select[name="bestTo"] { flex: 1 1 0; width: auto; min-width: 84px; }
.time-field .time-sep { flex: 0 0 auto; color: #7a8b92; display: flex; align-items: center; }
.phone-field .phone-code { flex: 0 0 auto; width: 108px; }   /* 收窄区号，号码框左边界更靠齐 */
.phone-field input[name="phoneNum"] { flex: 1 1 auto; min-width: 0; }
.contact-form .phone-field > *, .contact-form .time-field > * { height: 34.4px; box-sizing: border-box; }
.contact-form .time-field .combo-input { height: 100%; box-sizing: border-box; }   /* 时区输入框与起止时间等高 */
@media (max-width: 900px) { .time-field { flex-wrap: wrap; } }

/* 联系页：国家 / 时区「可输入 + 关键词自动匹配」组合框（渐进增强） */
.combo { position: relative; }
.combo-native { position: absolute !important; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.combo-input { width: 100%; }
.combo-list { position: absolute; z-index: 60; left: 0; right: 0; top: calc(100% + 4px); max-height: 236px; overflow-y: auto;
  margin: 0; padding: 4px; list-style: none; background: #fff; border: 1px solid var(--line, #e2ecea);
  border-radius: 9px; box-shadow: 0 10px 26px rgba(15, 31, 36, .14); }
.combo-opt { padding: 6px 9px; border-radius: 6px; font-size: 12.5px; line-height: 1.4; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.combo-opt:hover, .combo-opt[aria-selected="true"] { background: var(--teal-50, #eef7f6); }
.combo-none { padding: 7px 9px; color: #8a9aa0; font-size: 12px; }
@media (max-width: 900px) { .combo-list { position: static; max-height: 200px; margin-top: 4px; } }

/* ============================================================
   2026-09-13：模板页底部三项提示 → 三栏要点卡（展示优化）
   ============================================================ */
.note-cards { display: grid; grid-template-columns: repeat(3, 1fr); margin: 18px 0 0; max-width: 100%;
  background: linear-gradient(180deg, #FCFEFD, #F7FBFA); border: 1px solid #E7F0EE; border-radius: 12px; overflow: hidden; }
.note-card { display: flex; gap: 11px; align-items: flex-start; padding: 15px 18px; }
.note-card + .note-card { border-left: 1px solid #E3ECEA; }
.note-card .nc-ico { flex: 0 0 auto; width: 18px; height: 18px; color: var(--teal-700, #0E5F65); margin-top: 1px; }
.note-card .nc-ico svg { display: block; width: 18px; height: 18px; }
.note-card h4, .note-card h2 { margin: 0 0 4px; font-size: 12.5px; font-weight: 800; color: #12333A; letter-spacing: .02em; line-height: 1.3; }
.note-card p { margin: 0; font-size: 12.5px; line-height: 1.7; color: var(--muted, #5F6F76); }
@media (max-width: 899px) {
  .note-cards.cols-3 { grid-template-columns: repeat(2, 1fr); }   /* 平板：三栏降两栏 */
}
@media (max-width: 639px) {
  .note-cards, .note-cards.cols-2, .note-cards.cols-3 { ; }   /* 手机：全单栏 */
  .note-card + .note-card { border-left: none; border-top: 1px solid #E3ECEA; }
}
.note-cards.cols-2 { grid-template-columns: repeat(2, 1fr); }
.note-cards.cols-1 { grid-template-columns: 1fr; }
/* 批次3：提交说明提字号并分层（正文 / 法务尾句） */
.contact-form .form-note, body.contact-page .contact-form .form-note { font-size: 12.5px; line-height: 1.6; margin: 6px 0 0; }
.form-note .fn-main { display: block; }
.form-note .fn-legal { display: block; margin-top: 4px; font-size: 11.5px; color: #5F6F76; }
/* 批次4：module-note → 标签组 */
.module-tags { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.module-tags .tag { margin: 0; }
/* 批次5a：关于页服务范围 → 2×2 勾选条目 */
.about-services ul { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 20px; }
.about-services li { display: flex; gap: 9px; align-items: flex-start; font-size: 14px; color: var(--muted); line-height: 1.7; }
.about-services li .as-ico { flex: 0 0 auto; width: 17px; height: 17px; margin-top: 3px; color: var(--teal-700, #0E5F65); }
.about-services li .as-ico svg { display: block; width: 17px; height: 17px; }
@media (max-width: 900px) { .about-services ul { grid-template-columns: 1fr; } }
/* 批次5b：首页模板速览编号 → 徽标 */
.template-teaser-list .template-code { display: inline-block; align-self: start; font-size: 11.5px; font-weight: 700;
  letter-spacing: .02em; color: var(--teal-700, #0E5F65); background: #F1F7F6; border: 1px solid #E1EDEB;
  border-radius: 999px; padding: 2px 9px; }
.module-tags .mt-tail { list-style: none; color: #5F6F76; font-size: 12.5px; line-height: 1.65; display: flex; align-items: center; }

/* 要点卡断点（置于文件末尾，确保覆盖 .cols-2/.cols-3 规则；同特异性下后写者胜） */
@media (max-width: 899px) {
  .note-cards.cols-3 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 639px) {
  .note-cards, .note-cards.cols-2, .note-cards.cols-3 { grid-template-columns: 1fr; }
  .note-card + .note-card { border-left: none; border-top: 1px solid #E3ECEA; }
}

/* ============================================================
   2026-09-13：标题层级提升（h3/h4 → h2）后的视觉锁定
   通用 h2 / html[lang=en] h2 特异性高于类选择器，会接管字号与字距 → 此处显式锁定原视觉
   ============================================================ */
.note-cards .note-card h2,
html[lang="en"] .note-cards .note-card h2 {
  margin: 0 0 4px; font-size: 12.5px; font-weight: 800; color: #12333A; letter-spacing: .02em; line-height: 1.3;
}
.contact-card h2 { font-size: 19px; line-height: 25.08px; }
html[lang="en"] .contact-card h2 { font-size: 18.7px; line-height: 25.432px; letter-spacing: -0.1122px; }
html[lang="en"] .note-cards .note-card h2 { letter-spacing: -0.012em; }

/* ========== 2026-09-15 移动端显示修复 ========== */

/* 修复1: h1 标题文字溢出屏幕 */
@media (max-width: 680px) {
  .hero-copy h1 {
    font-size: clamp(20px, 5.2vw, 26px) !important;
    line-height: 1.4 !important;
    word-break: break-all !important;
    overflow-wrap: break-word !important;
    max-width: 100% !important;
  }
  .hero-copy {
    overflow: hidden !important;
    max-width: 100vw !important;
  }
}

/* 修复2: 轮播图右侧溢出 */
@media (max-width: 700px) {
  .hero-visual {
    transform: none !important;
    padding: 6px 6px 0 !important;
    max-width: calc(100vw - 36px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }
  .hero-carousel .carousel-track {
    max-width: 100% !important;
    overflow: hidden !important;
  }
  .hero {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
    overflow-x: hidden !important;
  }
}

/* 修复3: 确保移动端导航在所有页面可见且层级正确 */
@media (max-width: 1080px) {
  .menu-toggle {
    display: flex !important;
    z-index: 70 !important;
    position: relative !important;
  }
  .nav {
    z-index: 60 !important;
  }
  .nav-backdrop {
    z-index: 55 !important;
  }
  .site-header {
    position: sticky !important;
    z-index: 50 !important;
  }
}

/* ============================================================
   2026-09-15 移动端修复 v2（真实浏览器实测定位）
   问题1：菜单抽屉"能打开但显示不全、点不到其他页面"
     根因：.site-header 的 backdrop-filter 会为 fixed 后代创建包含块，
           抽屉 .nav{position:fixed;top:0;bottom:0} 的高度被钳制在 header
           高度内（实测仅 112px，scrollHeight 454px），下方菜单项被裁。
     + 遮罩 .nav-backdrop z-index(55) 高于 header(50)，会盖住菜单项与汉堡按钮。
   问题2：首页轮播图显示过小
     根因：≤700px 给 .hero-visual 加了 margin-left/right:auto，grid item 在
           auto 水平外边距下不再 stretch，宽度退化为 fit-content（实测 261px，
           容器列宽 354px），图表区仅 227×139。
   ============================================================ */
@media (max-width: 1080px) {
  /* 1A：移动端取消 header 的 backdrop-filter（改为不透明底，视觉基本一致） */
  .site-header {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    background: #ffffff !important;
  }
  /* 1B：抽屉固定为整屏高度并可滚动 */
  .nav {
    top: 0 !important;
    bottom: auto !important;
    height: 100vh !important;
    max-height: 100vh !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
  }
  /* 1C：遮罩必须落在 header 之下，否则点不动菜单项 */
  .nav-backdrop {
    z-index: 45 !important;
  }
}

@media (max-width: 700px) {
  /* 2A：轮播外框恢复满宽（覆盖 fit-content 退化） */
  .hero-visual {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  /* 2B：小屏保持 4/3，图表区随之放大 */
  .hero-carousel .carousel-track {
    aspect-ratio: 4 / 3 !important;
  }
  /* 2C：小屏隐藏左右箭头——34px 圆钮会压住图表 Y 轴刻度（实测遮挡 40/80% 刻度），
     手机端仍可用「左右滑动 / 点击图表 / 圆点」三种方式切换 */
  .hero-carousel .carousel-arrow {
    display: none !important;
  }
}
@supports (height: 100dvh) {
  @media (max-width: 1080px) {
    .nav {
      height: 100dvh !important;
      max-height: 100dvh !important;
    }
  }
}

/* ============================================================
   2026-09-15 移动端菜单抽屉精修 v3
   用户反馈：抽屉"出来是纯白页面、太宽" —— 面板 320px(82vw) 且无分组/分隔/
   选中态，6 项之外全是大片空白。以下收窄面板并补足信息层级（纯 CSS，
   不改 HTML/JS，全站含 en/ 一致生效；纯色、无渐变）。
   ============================================================ */
@media (max-width: 1080px) {
  .nav {
    width: min(272px, 74vw) !important;
    padding: 74px 16px 20px !important;
    gap: 0 !important;
    background: #ffffff !important;
    border-left: 1px solid #E3ECEA !important;
    border-radius: 16px 0 0 16px !important;
    box-shadow: -10px 0 30px rgba(15, 31, 36, 0.14) !important;
  }
  /* 顶部小标题（与 header 下方对齐），消除上方空洞感 */
  .nav::before {
    content: "站点导航";
    display: block;
    margin: 0 4px 8px;
    padding: 0 0 10px;
    border-bottom: 1px solid #E9F0EF;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.08em;
    color: #6B8085;
  }
  html[lang="en"] .nav::before { content: "Navigation"; }
  /* 菜单项：限定分隔 + 当前页高亮（浅青底 + 左侧竖条），行高加大填补中部留白 */
  .nav a {
    padding: 16px 12px !important;
    font-size: 15.5px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    color: #2B3A3F !important;
    border-radius: 0 !important;
    border-bottom: 1px solid #F1F6F5 !important;
  }
  .nav a:first-of-type { border-top: 1px solid #F1F6F5 !important; }
  .nav a.active {
    background: #EAF4F3 !important;
    color: #0E5F65 !important;
    font-weight: 800 !important;
    box-shadow: inset 3px 0 0 #0E5F65 !important;
  }
  .nav a:active { background: #EAF4F3 !important; color: #0E5F65 !important; }

  /* 菜单项图标：纯线性 SVG 走 mask 着色（跟随文字色），与站内 icon 风格一致（stroke 1.9）
     —— 提升抽屉信息密度，避免纯文字面板显得空洞 */
  .nav a {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    --i: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'><path d='M4 10.8 12 4l8 6.8V20H4z'/><path d='M9.6 20v-5.6h4.8V20'/></svg>");
  }
  .nav a[href*="templates"] {
    --i: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'><path d='M12 3.6v9.2'/><path d='M8.4 9.6 12 13.2l3.6-3.6'/><path d='M4.8 19.6h14.4'/></svg>");
  }
  .nav a[href*="solutions"] {
    --i: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'><path d='M4.5 20V10'/><path d='M9.5 20V4.5'/><path d='M14.5 20v-6.5'/><path d='M19.5 20V8'/></svg>");
  }
  .nav a[href*="industries"] {
    --i: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'><path d='M3.5 20.5V9.5l6 3.4V9.5l6 3.4V6l5 3v11.5z'/></svg>");
  }
  .nav a[href*="about"] {
    --i: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='8.2' r='3.4'/><path d='M5.2 20c0-3.6 3-6 6.8-6s6.8 2.4 6.8 6'/></svg>");
  }
  .nav a[href*="contact"] {
    --i: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'><rect x='3.2' y='5.6' width='17.6' height='12.8' rx='2.2'/><path d='m4.2 7.2 7.8 5.8 7.8-5.8'/></svg>");
  }
  .nav a[href*="products"] {
    --i: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'><rect x='3.5' y='3.5' width='7' height='7' rx='1.5'/><rect x='13.5' y='3.5' width='7' height='7' rx='1.5'/><rect x='3.5' y='13.5' width='7' height='7' rx='1.5'/><rect x='13.5' y='13.5' width='7' height='7' rx='1.5'/></svg>");
  }
  .nav a[href*="custom-development"] {
    --i: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'><path d='M14.5 6.2a4.6 4.6 0 0 0-6.2 5.9L3.5 16.9 7 20.4l4.8-4.8a4.6 4.6 0 0 0 5.9-6.2l-2.9 2.9-2.8-2.8 2.5-3.3z'/></svg>");
  }
  .nav a[href*="login"] {
    --i: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'><rect x='4.8' y='10.5' width='14.4' height='9.5' rx='2'/><path d='M8.2 10.5V8a3.8 3.8 0 0 1 7.6 0v2.5'/></svg>");
  }
  .nav a::before {
    content: "";
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    background-color: currentColor;
    opacity: 0.85;
    -webkit-mask-image: var(--i);
    mask-image: var(--i);
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 18px 18px;
    mask-size: 18px 18px;
  }
  /* 底部按钮不参与图标 */
  .nav .nav-cta a::before { content: none !important; }
  .nav .nav-login { justify-content: center !important; gap: 8px !important; }
  /* 客户登录（部分页面存在）：次级按钮，与主 CTA“预约演示”区分层级 */
  .nav .nav-login {
    margin: 12px 0 0 !important;
    padding: 12px 10px !important;
    border: 1px solid #CFE3E0 !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    color: #0E5F65 !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    text-align: center !important;
  }
  /* 底部联系方式：贴底收尾，避免下半屏整片空白 */
  .nav::after {
    content: "联系我们\A info@senzhiyun.net\A +86 137 8986 9815";
    white-space: pre-line;
    display: block;
    margin-top: 12px;
    padding: 12px 4px 0;
    border-top: 1px solid #E9F0EF;
    font-size: 12.5px;
    line-height: 1.7;
    color: #5C7078;
  }
  html[lang="en"] .nav::after {
    content: "Contact\A info@senzhiyun.net\A +86 137 8986 9815";
  }
  .nav-backdrop { background: rgba(15, 31, 36, 0.5) !important; }

  /* 品牌信息块（由 main.js 注入）：填补菜单与底部 CTA 之间的留白 */
  .nav .nav-brand {
    display: flex !important;
    align-items: center;
    gap: 10px;
    margin-top: auto;
    padding: 14px 12px;
    background: #F4F9F8;
    border: 1px solid #E3ECEA;
    border-radius: 12px;
  }
  .nav .nav-brand .nb-logo {
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    background: #0E5F65;
    color: #ffffff;
    border-radius: 9px;
    font-size: 12px;
    font-weight: 800;
  }
  .nav .nav-brand .nb-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
  .nav .nav-brand strong { font-size: 13.5px; font-weight: 800; color: #12333A; }
  .nav .nav-brand small { font-size: 11.5px; line-height: 1.45; color: #6B8085; }

  /* 底部快捷入口（由 main.js 注入，桌面隐藏） */
  .nav .nav-cta {
    display: flex !important;
    flex-direction: column;
    gap: 8px;
    margin-top: auto;
  }
  .nav .nav-cta a {
    padding: 12px 10px !important;
    border: 0 !important;
    border-radius: 10px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    justify-content: center !important;
    text-align: center !important;
    line-height: 1.2 !important;
  }
  .nav .nav-cta-primary {
    background: #0E5F65 !important;
    color: #ffffff !important;
  }
  .nav .nav-cta-secondary {
    background: #ffffff !important;
    color: #0E5F65 !important;
    border: 1px solid #CFE3E0 !important;
  }
  /* 有“客户登录”的页面：与快捷入口一起贴底排列 */
  .nav .nav-login { margin: 12px 0 0 !important; }
}
.nav-cta { display: none; }
.nav-brand { display: none; }

/* ============================================================
   2026-09-15 联系页「扫码联系」区块（微信 / WhatsApp 二维码）
   图片规格：560×560 灰度 PNG，静区白边 = 二维码边长 8%，
   均为原始扫码结果反解校验通过（u.wechat.com / wa.me）。
   ============================================================ */
.contact-qr {
  margin-top: 18px;
  padding: 18px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}
.contact-qr h2 {
  margin: 0 0 8px;
  font-size: 19px;
  line-height: 1.3;
}
.contact-qr .qr-note {
  margin: 0 0 14px;
  font-size: 13px;
  line-height: 1.6;
  color: var(--muted);
}
.qr-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.qr-item {
  margin: 0;
  padding: 12px 10px;
  background: #F7FAF9;
  border: 1px solid #E3ECEA;
  border-radius: 10px;
  text-align: center;
}
.qr-item img {
  display: block;
  width: 144px;
  height: 144px;
  margin: 0 auto 10px;
  background: #ffffff;
  border-radius: 4px;
}
.qr-item figcaption {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.qr-item strong {
  font-size: 13.5px;
  font-weight: 800;
  color: #12333A;
}
.qr-item span {
  font-size: 11.5px;
  color: var(--muted);
}
.qr-item .qr-tip {
  margin-top: 4px;
  font-size: 11.5px;
  font-weight: 700;
  color: #0E5F65;
  text-decoration: none;
  border-bottom: 1px solid #BEDEDB;
  align-self: center;
}
.qr-item .qr-tip:hover { color: #0b4a4f; border-bottom-color: #0b4a4f; }
/* 两卡片文案行数保持一致，避免左右卡片底部错位 */
.qr-item .qr-hint {
  margin-top: 4px;
  font-size: 11.5px;
  font-weight: 700;
  color: #6B8085;
  align-self: center;
}
@media (max-width: 680px) {
  .qr-grid { gap: 10px; }
  .qr-item { padding: 10px 8px; }
  .qr-item img { width: 128px; height: 128px; }
  .contact-qr { padding: 16px 14px; }
}
/* 极窄屏（<340px）：二维码改为单列，保证显示不小于 128px 可扫尺寸 */
@media (max-width: 340px) {
  .qr-grid { grid-template-columns: 1fr; }
  .qr-item img { width: 144px; height: 144px; }
}