/* === AI SEO 官网模板 v2 — 基于UI设计师Figma设计稿 === */

/* --- CSS 变量 --- */
/* 注解：全局 CSS 变量，集中定义颜色、尺寸、阴影和过渡令牌。 */
:root {
  --color-primary: #3a42fa;
  --color-primary-hover: #353de6;
  --color-primary-active: #3137d2;
  --color-primary-surface: #3a42fa;
  --color-primary-surface-hover: #353de6;
  --color-primary-surface-active: #3137d2;
  --color-primary-soft: #ebecff;
  --color-primary-border: #757bfb;
  --color-primary-focus: #3a42fa;
  --color-on-primary: #ffffff;
  --color-on-primary-rgb: 255, 255, 255;
  --color-primary-ink: #3a42fa;
  --color-primary-rgb: 58, 66, 250;
  --color-dark: #1D2138;
  --color-dark-light: #292C45;
  --color-text: #1D2138;
  --color-text-secondary: #666666;
  --color-text-muted: #999999;
  --color-bg: #F7F8FC;
  --color-white: #FFFFFF;
  --color-border: #E8EAF0;
  --color-shadow: rgba(0, 0, 0, 0.05);
  --font-family: "Microsoft YaHei", "SimHei";
  --container-width: 1200px;
  --mobile-shell-width: 100%;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 24px;
  --radius-full: 50px;
  --shadow-card: 0 4px 20px rgba(0, 0, 0, 0.05);
  --shadow-card-hover: 0 8px 30px rgba(0, 0, 0, 0.1);
  --transition: all 0.3s ease;
}

/* 产品详情页：按产品详情 UI 设计稿复刻 */
.product-detail-page {
  min-height: 100vh;
  background: #f6f6f7;
  padding: 32px 0 0;
}

.product-detail-layout.container {
  display: grid;
  grid-template-columns: 112px minmax(0, 900px);
  align-items: start;
  justify-content: center;
  gap: 26px;
  max-width: 1080px;
  padding-bottom: 70px;
}

.product-detail-category-nav {
  gap: 11px;
  padding-top: 0;
}

.product-detail-category-nav a {
  height: 30px;
  border-color: #9aa4d9;
  border-radius: 999px;
  padding: 0 12px;
  color: #263047;
  font-size: 13px;
  line-height: 28px;
}

.product-detail-category-nav a.active {
  border-color: var(--color-primary-border);
  background: var(--color-primary-surface);
  color: var(--color-on-primary);
  box-shadow: 0 6px 14px rgba(var(--color-primary-rgb), 0.18);
}

.product-detail-canvas {
  width: 100%;
}

.product-detail-hero-card {
  display: grid;
  grid-template-columns: 70px 382px minmax(0, 1fr);
  gap: 20px;
  min-height: 322px;
  margin-bottom: 18px;
  border-radius: 11px;
  background: #fff;
  box-shadow: 0 8px 26px rgb(30 42 80 / 7%);
  padding: 22px 24px;
}

.product-detail-thumbs {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 9px;
  width: 70px;
}

.product-detail-thumbs button {
  width: 58px;
  height: 58px;
  border: 1px solid #d7dcef;
  border-radius: 8px;
  background: #fff;
  padding: 4px;
  cursor: pointer;
}

.product-detail-thumbs button.active {
  border: 2px solid var(--color-primary-border);
  box-shadow: 0 4px 12px rgba(var(--color-primary-rgb), 0.18);
}

.product-detail-thumbs img {
  width: 100%;
  height: 100%;
  border-radius: 5px;
  object-fit: cover;
}

.product-detail-thumbs .product-thumb-arrow {
  width: 58px;
  height: 14px;
  border: 0;
  background: transparent;
  padding: 0;
  color: var(--color-primary-ink);
  font-size: 13px;
  line-height: 14px;
}

.product-detail-thumbs .product-thumb-arrow:disabled {
  color: #c8cee4;
  cursor: default;
  opacity: 0.55;
}

.product-detail-main-image {
  overflow: hidden;
  align-self: center;
  width: 382px;
  height: 270px;
  border-radius: 8px;
  background: #eef0f5;
}

.product-detail-main-image img,
.product-detail-main-image .product-card-placeholder {
  width: 100%;
  height: 100%;
  border-radius: 8px;
  object-fit: cover;
}

.product-detail-summary {
  padding: 14px 2px 8px 10px;
}

.product-detail-summary h1 {
  margin: 0 0 18px;
  color: #20243a;
  font-size: 19px;
  font-weight: 700;
  line-height: 1.55;
}

.product-summary-text {
  margin: -8px 0 14px;
  color: #5e6678;
  font-size: 13px;
  line-height: 1.75;
}

.product-top-params {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 8px 10px;
  margin: 0;
  color: #4b5265;
  font-size: 12px;
  line-height: 1.6;
}

.product-top-params dt {
  font-weight: 700;
}

.product-top-params dd {
  margin: 0;
}

.product-detail-consult-button {
  min-width: 104px;
  height: 42px;
  margin-top: 54px;
  border-radius: 10px;
  padding: 0 26px;
  color: var(--color-primary-ink);
  font-size: 13px;
  font-weight: 700;
  line-height: 40px;
}

.product-detail-card {
  margin-bottom: 18px;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 24px rgb(30 42 80 / 5%);
  padding: 28px 42px 38px;
}

.product-detail-card h2 {
  margin: 0 0 24px;
  border-bottom: 1px solid #e4e7ef;
  padding-bottom: 14px;
  color: #23273a;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  text-align: left;
}

.product-detail-param-table {
  max-width: 760px;
  margin: 0 auto;
}

.product-detail-param-row {
  display: grid;
  grid-template-columns: 116px minmax(0, 1fr) 116px minmax(0, 1fr);
  min-height: 38px;
  border-bottom: 1px solid #edf0f5;
  color: #2f3548;
  font-size: 12px;
  line-height: 1.55;
}

.product-detail-param-row strong,
.product-detail-param-row span {
  display: flex;
  align-items: center;
  min-width: 0;
  padding: 8px 10px;
}

.product-detail-param-row strong {
  color: #303546;
  font-weight: 700;
}

.product-detail-param-row span {
  color: #454b5f;
}

.product-detail-block {
  padding-top: 32px;
  text-align: center;
}

.product-detail-block h2 {
  border-bottom: 0;
  margin-bottom: 26px;
  padding-bottom: 0;
  font-size: 25px;
  line-height: 1.35;
  text-align: center;
}

.product-detail-block-desc {
  max-width: 680px;
  margin: -10px auto 26px;
  color: #626a7d;
  font-size: 14px;
  line-height: 1.9;
}

.product-feature-grid {
  grid-template-columns: repeat(2, 260px);
  justify-content: center;
  gap: 24px;
}

.product-feature-card {
  min-height: 176px;
  border-radius: 12px;
  background: #f4f4f6;
  padding: 26px 28px;
}

.product-feature-card img {
  width: 42px;
  height: 42px;
  margin-bottom: 12px;
  object-fit: contain;
}

.product-feature-card h3 {
  margin: 0 0 9px;
  color: #262a39;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.35;
}

.product-feature-card p {
  color: #626a7d;
  font-size: 12px;
  line-height: 1.75;
}

.product-image-text-block {
  max-width: 660px;
  margin: 0 auto;
  border-radius: 12px;
  background: #f3f3f5;
  padding: 28px 34px;
  text-align: left;
}

.product-image-text-block h3 {
  margin: 0 0 10px;
  color: #252939;
  font-size: 22px;
  line-height: 1.35;
}

.product-image-text-block p {
  margin: 0;
  color: #5f6678;
  font-size: 13px;
  line-height: 1.8;
}

.product-image-text-block img {
  width: 100%;
  max-height: 260px;
  object-fit: contain;
}

.product-image-gallery-block {
  max-width: 660px;
  grid-template-columns: 1fr;
  gap: 18px;
  margin: 0 auto;
}

.product-image-gallery-block img {
  width: 100%;
  border-radius: 12px;
  background: #f3f3f5;
  object-fit: cover;
}

.product-detail-missing {
  min-height: 360px;
}

@media (max-width: 900px) {
  .product-detail-layout.container {
    grid-template-columns: 1fr;
    gap: 20px;
    padding-right: 18px;
    padding-left: 18px;
  }

  .product-detail-category-nav {
    flex-direction: row;
    overflow-x: auto;
  }

  .product-detail-hero-card {
    grid-template-columns: 1fr;
    padding: 20px;
  }

  .product-detail-thumbs {
    flex-direction: row;
    width: 100%;
    overflow-x: auto;
  }

  .product-detail-main-image {
    width: 100%;
  }

  .product-detail-card {
    padding: 24px 18px 30px;
  }

  .product-detail-param-row {
    grid-template-columns: 96px minmax(0, 1fr);
  }

  .product-detail-param-row strong:nth-last-child(2):empty,
  .product-detail-param-row span:last-child:empty {
    display: none;
  }

  .product-feature-grid {
    grid-template-columns: 1fr;
  }

  .product-image-text-block {
    grid-template-columns: 1fr;
    padding: 24px;
  }
}

/* 产品详情页真正最终覆盖：放在文件末尾，避免旧重复样式回压 */
.product-detail-content-card.product-detail-card {
  width: 100% !important;
  max-width: 900px !important;
  margin: 0 0 18px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: 0 8px 24px rgb(30 42 80 / 5%) !important;
  padding: 28px 44px 58px !important;
}

.product-detail-content-card > .product-detail-table-section {
  max-width: 760px !important;
  margin: 0 auto 58px !important;
}

.product-detail-content-card > .product-detail-table-section > h2 {
  margin: 0 0 24px !important;
  border-bottom: 1px solid #e5e8f0 !important;
  padding-bottom: 14px !important;
  color: #252939 !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  text-align: left !important;
}

.product-detail-content-card .product-detail-param-table {
  width: 100% !important;
  max-width: 760px !important;
  margin: 0 auto !important;
}

.product-detail-content-card .product-detail-param-row {
  display: grid !important;
  grid-template-columns: 116px minmax(0, 1fr) 116px minmax(0, 1fr) !important;
  min-height: 38px !important;
  border-bottom: 1px solid #edf0f5 !important;
  color: #2f3548 !important;
  font-size: 12px !important;
  line-height: 1.55 !important;
}

.product-detail-content-card .product-detail-param-row strong,
.product-detail-content-card .product-detail-param-row span {
  display: flex !important;
  align-items: center !important;
  min-width: 0 !important;
  padding: 8px 10px !important;
  overflow-wrap: anywhere !important;
}

.product-detail-content-card .product-detail-param-row strong {
  font-weight: 700 !important;
}

.product-detail-content-card > .product-detail-block {
  max-width: 760px !important;
  margin: 0 auto 62px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  text-align: center !important;
}

.product-detail-content-card > .product-detail-block:last-child {
  margin-bottom: 0 !important;
}

.product-detail-content-card > .product-detail-block > h2 {
  max-width: 760px !important;
  margin: 0 auto 28px !important;
  border: 0 !important;
  padding: 0 !important;
  color: #252939 !important;
  font-size: 28px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  text-align: center !important;
}

.product-detail-content-card .product-detail-block-desc {
  max-width: 620px !important;
  margin: -12px auto 30px !important;
  color: #626a7d !important;
  font-size: 13px !important;
  line-height: 1.85 !important;
  text-align: center !important;
}

.product-detail-content-card .product-paragraph-block {
  max-width: 660px !important;
  margin: 0 auto !important;
  color: #51596d !important;
  font-size: 13px !important;
  line-height: 1.9 !important;
  text-align: center !important;
}

.product-detail-content-card .product-feature-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 260px) !important;
  justify-content: center !important;
  align-items: stretch !important;
  gap: 24px !important;
  max-width: 560px !important;
  margin: 0 auto !important;
}

.product-detail-content-card .product-feature-grid.single-card {
  grid-template-columns: 260px !important;
  max-width: 260px !important;
}

.product-detail-content-card .product-feature-card,
.product-detail-content-card .product-feature-grid.single-card .product-feature-card {
  display: flex !important;
  min-height: 176px !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: #f4f4f6 !important;
  box-shadow: none !important;
  padding: 26px 26px 28px !important;
}

.product-detail-content-card .product-feature-card img,
.product-detail-content-card .product-feature-grid.single-card .product-feature-card img {
  display: block !important;
  width: 48px !important;
  height: 48px !important;
  margin: 0 auto 14px !important;
  border-radius: 8px !important;
  object-fit: contain !important;
}

.product-detail-content-card .product-feature-card h3 {
  max-width: 200px !important;
  margin: 0 0 8px !important;
  color: #252939 !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  text-align: center !important;
}

.product-detail-content-card .product-feature-card p {
  max-width: 200px !important;
  margin: 0 !important;
  color: #60687a !important;
  font-size: 11px !important;
  line-height: 1.75 !important;
  text-align: center !important;
}

.product-detail-content-card .product-image-text-block {
  display: grid !important;
  max-width: 660px !important;
  grid-template-columns: minmax(0, 0.78fr) minmax(220px, 1.22fr) !important;
  align-items: center !important;
  gap: 34px !important;
  margin: 0 auto !important;
  border-radius: 12px !important;
  background: #f4f4f6 !important;
  padding: 34px 38px !important;
  text-align: left !important;
}

.product-detail-content-card .product-image-text-block.image-left {
  grid-template-columns: minmax(220px, 1.22fr) minmax(0, 0.78fr) !important;
}

.product-detail-content-card .product-image-text-block.image-left .product-image-text-copy {
  order: 2 !important;
}

.product-detail-content-card .product-image-text-block.image-left img {
  order: 1 !important;
}

.product-detail-content-card .product-image-text-block.image-top {
  grid-template-columns: 1fr !important;
  text-align: center !important;
}

.product-detail-content-card .product-image-text-copy h3 {
  margin: 0 0 12px !important;
  color: #252939 !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

.product-detail-content-card .product-image-text-copy p {
  margin: 0 !important;
  color: #5f6678 !important;
  font-size: 13px !important;
  line-height: 1.85 !important;
}

.product-detail-content-card .product-image-text-block img {
  display: block !important;
  width: 100% !important;
  max-height: 300px !important;
  border-radius: 10px !important;
  object-fit: contain !important;
}

.product-detail-content-card .product-image-gallery-block {
  display: grid !important;
  max-width: 660px !important;
  grid-template-columns: 1fr !important;
  gap: 18px !important;
  margin: 0 auto !important;
}

.product-detail-content-card .product-image-gallery-block img {
  display: block !important;
  width: 100% !important;
  border-radius: 12px !important;
  background: #f4f4f6 !important;
  object-fit: contain !important;
}

@media (max-width: 900px) {
  .product-detail-content-card.product-detail-card {
    padding: 24px 18px 36px !important;
  }

  .product-detail-content-card .product-detail-param-row {
    grid-template-columns: 96px minmax(0, 1fr) !important;
  }

  .product-detail-content-card > .product-detail-block {
    margin-bottom: 44px !important;
  }

  .product-detail-content-card > .product-detail-block > h2 {
    font-size: 23px !important;
  }

  .product-detail-content-card .product-feature-grid,
  .product-detail-content-card .product-feature-grid.single-card,
  .product-detail-content-card .product-image-text-block,
  .product-detail-content-card .product-image-text-block.image-left {
    grid-template-columns: 1fr !important;
    max-width: 100% !important;
  }

  .product-detail-content-card .product-image-text-block,
  .product-detail-content-card .product-image-text-block.image-top {
    gap: 22px !important;
    padding: 26px 22px !important;
    text-align: center !important;
  }

  .product-detail-content-card .product-image-text-block.image-left .product-image-text-copy,
  .product-detail-content-card .product-image-text-block.image-left img {
    order: initial !important;
  }
}

/* 产品详情页像素级复刻：用一个白色内容面板承载参数表和详情模块 */
.product-detail-content-card.product-detail-card {
  width: 100% !important;
  max-width: 900px !important;
  margin: 0 0 18px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: 0 8px 24px rgb(30 42 80 / 5%) !important;
  padding: 28px 44px 58px !important;
}

.product-detail-content-card > .product-detail-table-section {
  max-width: 760px !important;
  margin: 0 auto 58px !important;
}

.product-detail-content-card > .product-detail-table-section > h2 {
  margin: 0 0 24px !important;
  border-bottom: 1px solid #e5e8f0 !important;
  padding-bottom: 14px !important;
  color: #252939 !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  text-align: left !important;
}

.product-detail-content-card .product-detail-param-table {
  width: 100% !important;
  max-width: 760px !important;
  margin: 0 auto !important;
}

.product-detail-content-card .product-detail-param-row {
  display: grid !important;
  grid-template-columns: 116px minmax(0, 1fr) 116px minmax(0, 1fr) !important;
  min-height: 38px !important;
  border-bottom: 1px solid #edf0f5 !important;
  color: #2f3548 !important;
  font-size: 12px !important;
  line-height: 1.55 !important;
}

.product-detail-content-card .product-detail-param-row strong,
.product-detail-content-card .product-detail-param-row span {
  display: flex !important;
  align-items: center !important;
  min-width: 0 !important;
  padding: 8px 10px !important;
  overflow-wrap: anywhere !important;
}

.product-detail-content-card .product-detail-param-row strong {
  font-weight: 700 !important;
}

.product-detail-content-card > .product-detail-block {
  max-width: 760px !important;
  margin: 0 auto 62px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  text-align: center !important;
}

.product-detail-content-card > .product-detail-block:last-child {
  margin-bottom: 0 !important;
}

.product-detail-content-card > .product-detail-block > h2 {
  max-width: 760px !important;
  margin: 0 auto 28px !important;
  border: 0 !important;
  padding: 0 !important;
  color: #252939 !important;
  font-size: 28px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  text-align: center !important;
}

.product-detail-content-card .product-detail-block-desc {
  max-width: 620px !important;
  margin: -12px auto 30px !important;
  color: #626a7d !important;
  font-size: 13px !important;
  line-height: 1.85 !important;
  text-align: center !important;
}

.product-paragraph-block {
  max-width: 660px !important;
  margin: 0 auto !important;
  color: #51596d !important;
  font-size: 13px !important;
  line-height: 1.9 !important;
  text-align: center !important;
}

.product-detail-content-card .product-feature-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 260px) !important;
  justify-content: center !important;
  align-items: stretch !important;
  gap: 24px !important;
  max-width: 560px !important;
  margin: 0 auto !important;
}

.product-detail-content-card .product-feature-grid.single-card {
  grid-template-columns: 260px !important;
  max-width: 260px !important;
}

.product-detail-content-card .product-feature-card,
.product-detail-content-card .product-feature-grid.single-card .product-feature-card {
  display: flex !important;
  min-height: 176px !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: #f4f4f6 !important;
  box-shadow: none !important;
  padding: 26px 26px 28px !important;
}

.product-detail-content-card .product-feature-card img,
.product-detail-content-card .product-feature-grid.single-card .product-feature-card img {
  display: block !important;
  width: 48px !important;
  height: 48px !important;
  margin: 0 auto 14px !important;
  border-radius: 8px !important;
  object-fit: contain !important;
}

.product-detail-content-card .product-feature-card h3 {
  max-width: 200px !important;
  margin: 0 0 8px !important;
  color: #252939 !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  text-align: center !important;
}

.product-detail-content-card .product-feature-card p {
  max-width: 200px !important;
  margin: 0 !important;
  color: #60687a !important;
  font-size: 11px !important;
  line-height: 1.75 !important;
  text-align: center !important;
}

.product-detail-content-card .product-image-text-block {
  display: grid !important;
  max-width: 660px !important;
  grid-template-columns: minmax(0, 0.78fr) minmax(220px, 1.22fr) !important;
  align-items: center !important;
  gap: 34px !important;
  margin: 0 auto !important;
  border-radius: 12px !important;
  background: #f4f4f6 !important;
  padding: 34px 38px !important;
  text-align: left !important;
}

.product-detail-content-card .product-image-text-block.image-left {
  grid-template-columns: minmax(220px, 1.22fr) minmax(0, 0.78fr) !important;
}

.product-detail-content-card .product-image-text-block.image-left .product-image-text-copy {
  order: 2 !important;
}

.product-detail-content-card .product-image-text-block.image-left img {
  order: 1 !important;
}

.product-detail-content-card .product-image-text-block.image-top {
  grid-template-columns: 1fr !important;
  text-align: center !important;
}

.product-detail-content-card .product-image-text-copy h3 {
  margin: 0 0 12px !important;
  color: #252939 !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

.product-detail-content-card .product-image-text-copy p {
  margin: 0 !important;
  color: #5f6678 !important;
  font-size: 13px !important;
  line-height: 1.85 !important;
}

.product-detail-content-card .product-image-text-block img {
  display: block !important;
  width: 100% !important;
  max-height: 300px !important;
  border-radius: 10px !important;
  object-fit: contain !important;
}

.product-detail-content-card .product-image-gallery-block {
  display: grid !important;
  max-width: 660px !important;
  grid-template-columns: 1fr !important;
  gap: 18px !important;
  margin: 0 auto !important;
}

.product-detail-content-card .product-image-gallery-block img {
  display: block !important;
  width: 100% !important;
  border-radius: 12px !important;
  background: #f4f4f6 !important;
  object-fit: contain !important;
}

@media (max-width: 900px) {
  .product-detail-content-card.product-detail-card {
    padding: 24px 18px 36px !important;
  }

  .product-detail-content-card .product-detail-param-row {
    grid-template-columns: 96px minmax(0, 1fr) !important;
  }

  .product-detail-content-card > .product-detail-block {
    margin-bottom: 44px !important;
  }

  .product-detail-content-card > .product-detail-block > h2 {
    font-size: 23px !important;
  }

  .product-detail-content-card .product-feature-grid,
  .product-detail-content-card .product-feature-grid.single-card,
  .product-detail-content-card .product-image-text-block,
  .product-detail-content-card .product-image-text-block.image-left {
    grid-template-columns: 1fr !important;
    max-width: 100% !important;
  }

  .product-detail-content-card .product-image-text-block,
  .product-detail-content-card .product-image-text-block.image-top {
    gap: 22px !important;
    padding: 26px 22px !important;
    text-align: center !important;
  }

  .product-detail-content-card .product-image-text-block.image-left .product-image-text-copy,
  .product-detail-content-card .product-image-text-block.image-left img {
    order: initial !important;
  }
}

/* 产品详情页模块优化：让下方详情内容接近产品详情设计稿 */
.product-detail-canvas {
  display: grid;
  gap: 18px;
}

.product-detail-card {
  margin-bottom: 0;
  border: 1px solid #edf0f6;
  border-radius: 10px;
  box-shadow: 0 8px 28px rgb(30 42 80 / 5%);
  padding: 30px 44px 42px;
}

.product-params-card {
  padding-top: 28px;
}

.product-detail-card h2 {
  max-width: 760px;
  margin-right: auto;
  margin-left: auto;
}

.product-detail-param-table {
  width: 100%;
  max-width: 760px;
}

.product-detail-param-row {
  grid-template-columns: 116px minmax(0, 1fr) 116px minmax(0, 1fr);
  min-height: 40px;
  font-size: 12px;
}

.product-detail-param-row strong,
.product-detail-param-row span {
  padding: 9px 12px;
}

.product-detail-block {
  padding-top: 38px;
  padding-bottom: 48px;
}

.product-detail-block h2 {
  max-width: 760px;
  margin-bottom: 18px;
  color: #20243a;
  font-size: 27px;
  font-weight: 700;
  line-height: 1.35;
}

.product-detail-block-desc {
  max-width: 620px;
  margin: 0 auto 30px;
  color: #5f6678;
  font-size: 13px;
  line-height: 1.85;
}

.product-feature-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 280px));
  justify-content: center;
  align-items: stretch;
  gap: 24px;
  max-width: 760px;
  margin: 0 auto;
}

.product-feature-grid.single-card {
  grid-template-columns: minmax(0, 560px);
}

.product-feature-card {
  display: flex;
  min-height: 210px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 14px;
  background: #f4f4f6;
  box-shadow: none;
  padding: 30px 30px 32px;
}

.product-feature-card img {
  display: block;
  width: min(100%, 168px);
  height: 104px;
  margin: 0 auto 18px;
  border-radius: 10px;
  object-fit: contain;
}

.product-feature-grid.single-card .product-feature-card {
  min-height: 238px;
  padding-right: 48px;
  padding-left: 48px;
}

.product-feature-grid.single-card .product-feature-card img {
  width: min(100%, 220px);
  height: 132px;
}

.product-feature-card h3 {
  margin: 0 0 8px;
  color: #252939;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
}

.product-feature-card p {
  max-width: 360px;
  margin: 0;
  color: #60687a;
  font-size: 12px;
  line-height: 1.75;
  text-align: center;
}

.product-image-text-block {
  display: grid;
  max-width: 760px;
  grid-template-columns: minmax(0, 0.9fr) minmax(220px, 1.1fr);
  align-items: center;
  gap: 34px;
  margin: 0 auto;
  border-radius: 14px;
  background: #f4f4f6;
  padding: 34px 42px;
  text-align: left;
}

.product-image-text-block.image-left {
  grid-template-columns: minmax(220px, 1.1fr) minmax(0, 0.9fr);
}

.product-image-text-block.image-left .product-image-text-copy {
  order: 2;
}

.product-image-text-block.image-left img {
  order: 1;
}

.product-image-text-block.image-top {
  grid-template-columns: 1fr;
  text-align: center;
}

.product-image-text-copy h3 {
  margin: 0 0 12px;
  color: #252939;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.35;
}

.product-image-text-copy p {
  margin: 0;
  color: #5f6678;
  font-size: 13px;
  line-height: 1.85;
}

.product-image-text-block img {
  display: block;
  width: 100%;
  max-height: 320px;
  border-radius: 12px;
  object-fit: contain;
}

.product-image-gallery-block {
  max-width: 760px;
}

@media (max-width: 900px) {
  .product-detail-card {
    padding: 24px 18px 32px;
  }

  .product-detail-block {
    padding-top: 30px;
    padding-bottom: 36px;
  }

  .product-detail-block h2 {
    font-size: 23px;
  }

  .product-detail-param-row {
    grid-template-columns: 96px minmax(0, 1fr);
  }

  .product-feature-grid,
  .product-feature-grid.single-card,
  .product-image-text-block,
  .product-image-text-block.image-left {
    grid-template-columns: 1fr;
  }

  .product-feature-card,
  .product-feature-grid.single-card .product-feature-card {
    min-height: 0;
    padding: 26px 22px;
  }

  .product-image-text-block,
  .product-image-text-block.image-top {
    gap: 22px;
    padding: 26px 22px;
    text-align: center;
  }

  .product-image-text-block.image-left .product-image-text-copy,
  .product-image-text-block.image-left img {
    order: initial;
  }
}

.product-page,
.product-detail-page {
  min-height: 70vh;
  background: #f6f7fb;
}

.page-title {
  padding: 56px 0 36px;
  text-align: center;
}

.page-title.compact {
  padding-bottom: 24px;
}

.page-title h1 {
  margin: 0;
  font-size: 36px;
  color: #111827;
}

.page-title p {
  margin: 10px 0 0;
  color: #666;
}

.product-layout {
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr);
  gap: 52px;
  padding-bottom: 72px;
}

.product-layout.is-empty {
  display: block;
}

.product-category-nav {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.product-category-nav button,
.product-category-nav a {
  display: block;
  border: 1px solid var(--color-primary-border);
  border-radius: 999px;
  padding: 8px 18px;
  background: #fff;
  color: #30344d;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}

.product-category-nav .active,
.product-category-nav button.active {
  border-color: var(--color-primary-border);
  background: var(--color-primary-surface);
  color: var(--color-on-primary);
}

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

.product-card {
  display: block;
  overflow: hidden;
  width: 100%;
  border: 0;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 12px 30px rgb(30 42 80 / 8%);
  color: inherit;
  font: inherit;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease;
}

.product-card:hover {
  box-shadow: 0 18px 42px rgb(30 42 80 / 12%);
  transform: translateY(-3px);
}

.product-card img,
.product-card-placeholder {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  background: #eef1f7;
}

.product-card-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #98a1b3;
}

.product-card-body {
  position: relative;
  padding: 18px 56px 18px 18px;
}

.product-card-body h2 {
  margin: 0 0 8px;
  font-size: 18px;
}

.product-card-body p {
  overflow: hidden;
  margin: 0;
  color: #667085;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product-card-arrow {
  position: absolute;
  top: 50%;
  right: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 1px solid #dbe1f0;
  border-radius: 999px;
  color: var(--color-primary-ink);
  font-size: 28px;
  transform: translateY(-50%);
}

.pagination {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 34px;
}

.pagination button {
  min-width: 30px;
  height: 30px;
  border: 1px solid #dbe1f0;
  border-radius: 6px;
  background: #fff;
  color: var(--color-primary-ink);
  cursor: pointer;
}

.pagination button.active {
  border-color: var(--color-primary-border);
  background: var(--color-primary-surface);
  color: var(--color-on-primary);
}

.pagination button:disabled {
  color: #b8c0d4;
  cursor: not-allowed;
}

.product-empty-panel {
  max-width: 980px;
  margin: 0 auto;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 46px rgb(30 42 80 / 8%);
  padding: 48px;
  text-align: center;
}

.product-empty-kicker {
  display: inline-flex;
  margin-bottom: 12px;
  border: 1px solid var(--color-primary-border);
  border-radius: 999px;
  padding: 4px 14px;
  color: var(--color-primary-ink);
  font-size: 14px;
  line-height: 1.4;
}

.product-empty-copy h2 {
  margin: 0;
  color: #111827;
  font-size: 30px;
  line-height: 1.35;
}

.product-empty-copy p {
  max-width: 620px;
  margin: 14px auto 0;
  color: #667085;
}

.product-empty-actions {
  display: flex;
  justify-content: center;
  gap: 14px;
  margin-top: 28px;
}

.product-empty-actions a,
.product-empty-actions button {
  min-width: 118px;
  border: 1px solid var(--color-primary-border);
  border-radius: 999px;
  padding: 10px 22px;
  background: #fff;
  color: var(--color-primary-ink);
  font: inherit;
  line-height: 1.4;
  cursor: pointer;
}

.product-empty-actions button {
  background: var(--color-primary-surface);
  color: var(--color-on-primary);
}

.product-empty-services {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 36px;
}

.product-empty-service-card {
  min-height: 150px;
  border-radius: 14px;
  background: var(--color-primary-soft);
  padding: 24px;
  text-align: left;
}

.product-empty-service-card h3 {
  margin: 0 0 10px;
  color: #111827;
  font-size: 18px;
}

.product-empty-service-card p {
  margin: 0;
  color: #667085;
  font-size: 15px;
  line-height: 1.8;
}

.product-empty-contact {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  margin-top: 34px;
  border-radius: 999px;
  background: var(--color-primary-soft);
  padding: 14px 22px;
  color: #475467;
}

.product-hero-card,
.product-params-card,
.product-detail-block {
  margin-bottom: 24px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 12px 30px rgb(30 42 80 / 8%);
  padding: 28px;
}

.product-hero-card {
  display: grid;
  grid-template-columns: 70px minmax(280px, 1fr) minmax(280px, 420px);
  gap: 22px;
}

.thumbs {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.thumbs button {
  border: 1px solid #dbe1f0;
  border-radius: 8px;
  padding: 4px;
  background: #fff;
  cursor: pointer;
}

.thumbs button.active {
  border-color: var(--color-primary-border);
}

.thumbs img {
  width: 56px;
  height: 56px;
  border-radius: 6px;
  object-fit: cover;
}

.main-image img,
.main-image .product-card-placeholder {
  width: 100%;
  height: 320px;
  border-radius: 10px;
  object-fit: cover;
}

.product-hero-info h1 {
  margin: 0 0 18px;
  font-size: 24px;
  line-height: 1.4;
}

.product-hero-info p {
  color: #4b5563;
}

.product-hero-info dl {
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 8px 14px;
  color: #4b5563;
}

.product-hero-info dt {
  font-weight: 700;
}

.consult-button {
  display: inline-flex;
  margin-top: 32px;
  border: 1px solid var(--color-primary-border);
  border-radius: 8px;
  background: #fff;
  padding: 10px 28px;
  color: var(--color-primary-ink);
  font: inherit;
  text-decoration: none;
  cursor: pointer;
}

.product-params-card h2,
.product-detail-block h2 {
  margin: 0 0 18px;
  font-size: 22px;
}

.params-grid {
  display: grid;
  grid-template-columns: 160px 1fr 160px 1fr;
}

.params-grid strong,
.params-grid span {
  border-bottom: 1px solid #edf0f5;
  padding: 12px 10px;
}

.feature-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
}

.feature-card,
.image-text-block {
  border-radius: 12px;
  background: #f5f6fa;
  padding: 28px;
  text-align: center;
}

.feature-card img {
  max-width: 80px;
  max-height: 80px;
  object-fit: contain;
}

.image-text-block {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: center;
  text-align: left;
}

.image-text-block.image-left img {
  order: -1;
}

.image-text-block.image-top {
  grid-template-columns: 1fr;
}

.image-text-block img,
.image-gallery-block img {
  max-width: 100%;
  border-radius: 10px;
}

.image-gallery-block {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

@media (max-width: 900px) {
  .product-layout {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .product-category-nav {
    flex-direction: row;
    overflow-x: auto;
  }

  .product-grid {
    grid-template-columns: 1fr;
  }

  .product-empty-panel {
    padding: 32px 20px;
  }

  .product-empty-actions,
  .product-empty-contact {
    flex-direction: column;
  }

  .product-empty-services {
    grid-template-columns: 1fr;
  }

  .product-hero-card {
    grid-template-columns: 1fr;
  }

  .thumbs {
    flex-direction: row;
  }

  .params-grid {
    grid-template-columns: 120px 1fr;
  }

  .feature-card-grid,
  .image-text-block,
  .image-gallery-block {
    grid-template-columns: 1fr;
  }
}

/* --- Reset --- */
/* 注解：全局重置，统一盒模型并清除默认外边距和内边距。 */
* { margin: 0; padding: 0; box-sizing: border-box; }

/* 注解：样式块，作用于 body。 */
body {
  font-family: var(--font-family);
  font-size: 16px;
  line-height: 1.8;
  color: var(--color-text);
  background: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 注解：样式块，作用于 a。 */
a {
  color: inherit;
  text-decoration: none;
  transition: var(--transition);
}

/* 注解：样式块，作用于 img。 */
img { max-width: 100%; height: auto; }

/* --- Container --- */
/* 注解：样式块，作用于 .container。 */
.container {
  max-width: var(--container-width);
  margin: 0 auto;
  padding: 0 24px;
}

/* ============================================
   Header / Navbar
   ============================================ */
/* 注解：样式块，作用于 .site-header。 */
.site-header {
  background: var(--color-white);
  padding: 0;
  height: 96px;
  border-bottom: 1px solid var(--color-border);
  position: sticky;
  top: 0;
  z-index: 100;
}

/* 注解：样式块，作用于 .site-header .container。 */
.site-header .container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 100%;
}

/* 注解：样式块，作用于 .logo。 */
.logo {
  font-size: 24px;
  font-weight: 500;
  color: var(--color-text);
  text-decoration: none;
  white-space: nowrap;
  letter-spacing: 0.5px;
}

/* 注解：样式块，作用于 .main-nav。 */
.main-nav {
  display: flex;
  align-items: center;
  gap: 48px;
}

/* 注解：样式块，作用于 .main-nav a。 */
.main-nav a {
  color: var(--color-text);
  font-size: 15px;
  font-weight: 400;
  text-decoration: none;
  transition: var(--transition);
  white-space: nowrap;
}

.main-nav a:hover,
/* 注解：样式块，作用于 .main-nav a.router-link-active。 */
.main-nav a.router-link-active {
  color: var(--color-primary-ink);
  font-weight: 500;
}

/* ============================================
   Main Content
   ============================================ */
/* 注解：样式块，作用于 .site-main。 */
.site-main {
  min-height: 60vh;
}

/* ============================================
   Hero / Banner
   ============================================ */
/* 注解：样式块，作用于 .hero。 */
.hero {
  background: linear-gradient(135deg, var(--color-primary-active) 0%, var(--color-primary-hover) 50%, var(--color-primary) 100%);
  padding: 100px 0 120px;
  text-align: center;
  color: var(--color-on-primary);
  position: relative;
  overflow: hidden;
}

/* 注解：样式块，作用于 .hero::before。 */
.hero::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background:
    radial-gradient(circle at 20% 80%, rgba(var(--color-on-primary-rgb), 0.1) 0%, transparent 50%),
    radial-gradient(circle at 80% 20%, rgba(var(--color-on-primary-rgb), 0.08) 0%, transparent 50%);
  pointer-events: none;
}

/* 注解：样式块，作用于 .hero h1。 */
.hero h1 {
  font-size: 48px;
  font-weight: 500;
  margin-bottom: 16px;
  color: var(--color-on-primary);
  position: relative;
  letter-spacing: 1px;
}

/* 注解：样式块，作用于 .hero .industry。 */
.hero .industry {
  color: var(--color-on-primary);
  font-size: 20px;
  margin-bottom: 20px;
  font-weight: 400;
}

/* 注解：样式块，作用于 .hero .description。 */
.hero .description {
  font-size: 24px;
  color: var(--color-on-primary);
  max-width: 700px;
  margin: 0 auto;
  font-weight: 400;
}

/* ============================================
   Section 通用
   ============================================ */
/* 注解：样式块，作用于 .section。 */
.section {
  padding: 64px 0;
}

/* 注解：文章列表页顶部间距缩小一半。 */
.article-index-page {
  padding-top: 32px;
}

/* 注解：关于页从容器顶部开始展示。 */
.about-page {
  padding-top: 0;
}

/* 注解：常见问题页顶部间距固定为 32px。 */
.section.faq-page {
  padding-top: 32px;
}

/* 注解：样式块，作用于 .section h1。 */
.section h1 {
  font-size: 36px;
  font-weight: 500;
  margin-bottom: 32px;
  color: var(--color-text);
  letter-spacing: 0.5px;
}

/* 注解：样式块，作用于 .section h2。 */
.section h2 {
  font-size: 28px;
  font-weight: 500;
  margin-bottom: 20px;
  color: var(--color-text);
}

/* 注解：样式块，作用于 .section h3。 */
.section h3 {
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 10px;
  color: var(--color-text);
}

/* 注解：样式块，作用于 .section p。 */
.section p {
  margin-bottom: 14px;
  color: var(--color-text-secondary);
  line-height: 1.8;
}

/* ============================================
   Service Cards（首页/服务页通用）
   ============================================ */
/* 注解：样式块，作用于 .service-cards。 */
.service-cards {
  display: flex;
  gap: 24px;
  margin-bottom: 48px;
}

/* 注解：样式块，作用于 .service-card。 */
.service-card {
  flex: 1;
  background: linear-gradient(135deg, var(--color-primary-soft) 0%, var(--color-white) 100%);
  border-radius: var(--radius-lg);
  padding: 40px 32px;
  text-align: center;
  transition: var(--transition);
}

/* 注解：样式块，作用于 .service-card:hover。 */
.service-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-card-hover);
}

/* 注解：样式块，作用于 .service-card h3。 */
.service-card h3 {
  font-size: 24px;
  font-weight: 500;
  color: var(--color-text);
  margin-bottom: 8px;
}

/* 注解：样式块，作用于 .service-card p。 */
.service-card p {
  font-size: 14px;
  color: var(--color-text-secondary);
}

/* 服务流程 */
/* 注解：样式块，作用于 .service-process。 */
.service-process {
  margin-top: 32px;
}

/* 注解：样式块，作用于 .service-process h2。 */
.service-process h2 {
  text-align: center;
  margin-bottom: 40px;
}

/* 注解：样式块，作用于 .service-process ol。 */
.service-process ol {
  list-style: none;
  padding: 0;
  display: flex;
  gap: 0;
  margin-bottom: 24px;
  position: relative;
}

/* 注解：样式块，作用于 .service-process li。 */
.service-process li {
  flex: 1;
  text-align: center;
  position: relative;
  padding: 0 16px;
}

/* 注解：样式块，作用于 .service-process li::before。 */
.service-process li::before {
  content: attr(data-step);
  display: block;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--color-primary-surface);
  color: var(--color-on-primary);
  font-size: 20px;
  font-weight: 700;
  line-height: 56px;
  margin: 0 auto 12px;
}

/* 注解：样式块，作用于 .service-process li strong。 */
.service-process li strong {
  display: block;
  font-size: 18px;
  color: var(--color-text);
  margin-bottom: 4px;
}

/* 注解：样式块，作用于 .service-process li::after。 */
.service-process li::after {
  content: '';
  position: absolute;
  top: 28px;
  left: calc(50% + 36px);
  width: calc(100% - 72px);
  height: 2px;
  background: var(--color-border);
}

/* 注解：样式块，作用于 .service-process li:last-child::after。 */
.service-process li:last-child::after {
  display: none;
}

/* ============================================
   Articles / News
   ============================================ */
/* 注解：样式块，作用于 .article-list。 */
.article-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0 32px;
  background: var(--color-white);
  border-radius: 16px;
  box-shadow: 0 2px 12px rgba(31, 40, 72, 0.04);
  overflow: hidden;
}

/* 注解：样式块，作用于 .articles-preview .article-list。 */
.articles-preview .article-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  padding: 0;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
  overflow: visible;
}

/* 注解：样式块，作用于 .article-card。 */
.article-card {
  padding: 28px 0;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
  display: flex;
  align-items: flex-start;
  gap: 28px;
  transition: var(--transition);
  border: 0;
  border-bottom: 1px solid #edf0f6;
  color: inherit;
  text-decoration: none;
}

/* 注解：样式块，作用于 .article-card:hover。 */
.article-card:hover {
  box-shadow: none;
  transform: none;
  background: #fbfcff;
}

/* 注解：样式块，作用于 .article-card:last-child。 */
.article-card:last-child {
  border-bottom: 0;
}

/* 注解：样式块，作用于 .article-card .date-badge。 */
.article-card .date-badge {
  width: 88px;
  min-width: 88px;
  height: 86px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #f7f7f8;
  color: #202532;
  border-radius: 8px;
  padding: 0;
  text-align: center;
  flex-shrink: 0;
}

/* 注解：样式块，作用于 .article-card .date-badge .day。 */
.article-card .date-badge .day {
  font-size: 36px;
  font-weight: 800;
  line-height: 1;
  display: block;
}

/* 注解：样式块，作用于 .article-card .date-badge .month。 */
.article-card .date-badge .month {
  margin-top: 12px;
  color: #7d838f;
  font-size: 15px;
  line-height: 1;
  font-weight: 400;
  display: block;
}

/* 注解：样式块，作用于 .article-card .card-content。 */
.article-card .card-content {
  flex: 1;
  min-width: 0;
}

.article-card h2,
/* 注解：样式块，作用于 .article-card h3。 */
.article-card h3 {
  font-size: 25px;
  font-weight: 500;
  margin: 0 0 8px;
  color: var(--color-text);
  line-height: 1.55;
}

/* 注解：样式块，作用于 .article-card .card-summary。 */
.article-card .card-summary {
  font-size: 14px;
  color: var(--color-text-secondary);
  line-height: 1.6;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* 注解：样式块，作用于 .article-card .meta。 */
.article-card .meta {
  margin-top: 12px;
  font-size: 14px;
  color: var(--color-text-muted);
}

/* 注解：样式块，作用于 .article-card .meta time。 */
.article-card .meta time {
  margin-right: 16px;
}

/* ============================================
   Article Detail
   ============================================ */
/* 注解：样式块，作用于 .article-detail .article-header。 */
.article-detail .article-header {
  margin-bottom: 32px;
  padding-bottom: 24px;
  border-bottom: 2px solid var(--color-border);
}

/* 注解：样式块，作用于 .article-detail .article-header h1。 */
.article-detail .article-header h1 {
  font-size: 32px;
  font-weight: 500;
  margin-bottom: 16px;
  line-height: 1.4;
}

/* 注解：样式块，作用于 .article-detail .abstract。 */
.article-detail .abstract {
  background: var(--color-primary-soft);
  border-left: 4px solid var(--color-primary-ink);
  padding: 20px 24px;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  margin-bottom: 32px;
  font-size: 16px;
  color: var(--color-text-secondary);
  line-height: 1.8;
}

/* 注解：样式块，作用于 .article-detail .article-body。 */
.article-detail .article-body {
  font-size: 17px;
  line-height: 2;
  color: var(--color-text);
}

/* 注解：样式块，作用于 .article-detail .article-body img。 */
.article-detail .article-body img {
  border-radius: var(--radius-md);
  margin: 24px 0;
}

/* 注解：样式块，作用于 .article-detail .original-url。 */
.article-detail .original-url {
  margin-top: 40px;
  padding-top: 20px;
  border-top: 1px solid var(--color-border);
  font-size: 14px;
  color: var(--color-text-muted);
}

/* 注解：样式块，作用于 .article-detail .article-footer。 */
.article-detail .article-footer {
  margin-top: 40px;
}

/* 注解：样式块，作用于 .article-detail .article-footer a。 */
.article-detail .article-footer a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--color-primary-ink);
  font-weight: 500;
}

/* 注解：样式块，作用于 .article-detail .article-footer a:hover。 */
.article-detail .article-footer a:hover {
  color: var(--color-primary-ink);
}

/* ============================================
   FAQ
   ============================================ */
/* 注解：样式块，作用于 .faq-content。 */
.faq-content {
  font-size: 16px;
  line-height: 1.8;
}

/* 注解：样式块，作用于 .faq-list。 */
.faq-list {
  display: grid;
  gap: 16px;
}

/* 注解：样式块，作用于 .faq-card。 */
.faq-card {
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 24px 28px;
  box-shadow: var(--shadow-card);
}

/* 注解：样式块，作用于 .faq-card .faq-question。 */
.faq-card .faq-question {
  margin: 0 0 12px;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.55;
  color: var(--color-text);
}

/* 注解：样式块，作用于 .faq-card .faq-answer。 */
.faq-card .faq-answer {
  margin: 0;
  color: var(--color-text-secondary);
  line-height: 1.85;
  white-space: pre-line;
}

.faq-card .faq-question-row,
/* 注解：样式块，作用于 .faq-card .faq-answer-row。 */
.faq-card .faq-answer-row {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  column-gap: 13px;
  align-items: start;
}

/* 注解：样式块，作用于 .faq-card .faq-question-row strong。 */
.faq-card .faq-question-row strong {
  color: #202532;
  font-size: 20px;
  line-height: 1.55;
  font-weight: 700;
}

/* 注解：样式块，作用于 .faq-card .faq-answer-row。 */
.faq-card .faq-answer-row {
  margin-top: 10px;
}

/* 注解：样式块，作用于 .faq-card .faq-answer-row span:last-child。 */
.faq-card .faq-answer-row span:last-child {
  color: #5f6573;
  font-size: 17px;
  line-height: 1.75;
  font-weight: 500;
}

/* 注解：样式块，作用于 .faq-item。 */
.faq-item {
  background: var(--color-white);
  border-radius: var(--radius-md);
  margin-bottom: 12px;
  overflow: hidden;
  box-shadow: var(--shadow-card);
}

/* 注解：样式块，作用于 .faq-item .faq-question。 */
.faq-item .faq-question {
  padding: 20px 24px;
  font-size: 18px;
  font-weight: 500;
  color: var(--color-text);
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
}

/* 注解：样式块，作用于 .faq-item .faq-answer。 */
.faq-item .faq-answer {
  padding: 0 24px 20px;
  font-size: 15px;
  color: var(--color-text-secondary);
  line-height: 1.8;
}

/* 注解：样式块，作用于 .faq-preview-list。 */
.faq-preview-list {
  display: grid;
  gap: 10px;
  margin-bottom: 16px;
}

/* 注解：样式块，作用于 .faq-preview-item。 */
.faq-preview-item {
  margin: 0;
  padding: 14px 18px;
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  color: var(--color-text);
  line-height: 1.65;
  box-shadow: var(--shadow-card);
}

/* ============================================
   Contact
   ============================================ */
/* 注解：样式块，作用于 .contact-info。 */
.contact-info {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 24px;
}

/* 注解：样式块，作用于 .info-item。 */
.info-item {
  padding: 24px;
  background: var(--color-white);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-card);
  transition: var(--transition);
}

/* 注解：样式块，作用于 .info-item:hover。 */
.info-item:hover {
  box-shadow: var(--shadow-card-hover);
}

/* 注解：样式块，作用于 .info-item h3。 */
.info-item h3 {
  color: var(--color-primary-ink);
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 8px;
  text-transform: uppercase;
  letter-spacing: 1px;
}

/* 注解：样式块，作用于 .info-item p。 */
.info-item p {
  font-size: 18px;
  color: var(--color-text);
  font-weight: 500;
}

/* 注解：样式块，作用于 .info-item a。 */
.info-item a {
  color: var(--color-primary-ink);
}

/* 注解：样式块，作用于 .info-item a:hover。 */
.info-item a:hover {
  color: var(--color-primary-ink);
}

/* ============================================
   CTA (Call To Action)
   ============================================ */
/* 注解：样式块，作用于 .cta。 */
.cta {
  background: linear-gradient(135deg, #1D2138 0%, #2D3556 100%);
  color: var(--color-white);
  text-align: center;
}

/* 注解：样式块，作用于 .cta h2。 */
.cta h2 {
  color: var(--color-white);
  font-size: 32px;
}

/* 注解：样式块，作用于 .cta p。 */
.cta p {
  color: rgba(255, 255, 255, 0.8);
}

/* 注解：样式块，作用于 .btn。 */
.btn {
  display: inline-block;
  padding: 14px 40px;
  background: var(--color-primary-surface);
  color: var(--color-on-primary);
  text-decoration: none;
  border-radius: var(--radius-full);
  font-size: 16px;
  font-weight: 500;
  margin-top: 20px;
  transition: var(--transition);
  border: 2px solid var(--color-primary-border);
  cursor: pointer;
}

/* 注解：样式块，作用于 .btn:hover。 */
.btn:hover {
  background: var(--color-primary-surface-hover);
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(var(--color-primary-rgb), 0.4);
}

/* More link */
/* 注解：样式块，作用于 .more。 */
.more {
  margin-top: 20px;
}

/* 注解：样式块，作用于 .more a。 */
.more a {
  color: var(--color-primary-ink);
  text-decoration: none;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

/* 注解：样式块，作用于 .more a:hover。 */
.more a:hover {
  color: var(--color-primary-ink);
}

/* ============================================
   Services Page
   ============================================ */
/* 注解：样式块，作用于 .service-page。 */
.service-page {
  padding: 0;
  border-bottom: 0;
  background: #f4f6fb;
}

/* 注解：样式块，作用于 .service-page .container。 */
.service-page .container {
  max-width: 980px;
  padding: 29px 44px 52px;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
}

/* 注解：样式块，作用于 .service-page h1。 */
.service-page h1 {
  margin: 0 0 30px;
  text-align: center;
  color: #202536;
  font-size: 28px;
  line-height: 1.45;
  font-weight: 700;
  overflow-wrap: anywhere;
}

/* 注解：样式块，作用于 .service-page .service-cards。 */
.service-page .service-cards {
  margin: 0 0 46px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 24px;
}

.service-page .service-card,
/* 注解：样式块，作用于 .service-page .services-content。 */
.service-page .services-content {
  padding: 44px 32px;
  border-radius: 28px;
  background: var(--color-primary-soft);
  text-align: center;
  box-shadow: none;
}

/* 注解：样式块，作用于 .service-page .service-card:hover。 */
.service-page .service-card:hover {
  transform: none;
  box-shadow: none;
}

.service-page .service-card h3,
/* 注解：样式块，作用于 .service-page .services-content h2。 */
.service-page .services-content h2 {
  margin: 0 0 15px;
  color: #202536;
  font-size: 23px;
  line-height: 1.45;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.service-page .service-card p,
/* 注解：样式块，作用于 .service-page .services-content p。 */
.service-page .services-content p {
  margin: 0;
  color: #5d6370;
  font-size: 17px;
  line-height: 1.8;
  font-weight: 500;
}

/* 注解：样式块，作用于 .service-page .service-process。 */
.service-page .service-process {
  max-width: 720px;
  margin: 2px auto 0;
}

/* 注解：样式块，作用于 .service-page .service-process h2。 */
.service-page .service-process h2 {
  margin: 0 0 30px;
  color: #202536;
  font-size: 28px;
  line-height: 1.45;
  font-weight: 700;
  text-align: center;
}

/* 注解：样式块，作用于 .service-page .service-process-list。 */
.service-page .service-process-list {
  list-style: none;
  display: grid;
  gap: 23px;
  margin: 0;
  padding: 0;
}

/* 注解：样式块，作用于 .service-page .service-process-item。 */
.service-page .service-process-item {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  column-gap: 22px;
  align-items: center;
  flex: none;
  padding: 0;
  text-align: left;
  position: relative;
}

.service-page .service-process li::before,
/* 注解：样式块，作用于 .service-page .service-process li::after。 */
.service-page .service-process li::after {
  display: none;
}

/* 注解：样式块，作用于 .service-page .service-process-index。 */
.service-page .service-process-index {
  width: 49px;
  height: 49px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: var(--color-primary-surface);
  color: var(--color-on-primary);
  font-size: 20px;
  line-height: 1;
  font-weight: 800;
}

/* 注解：样式块，作用于 .service-page .service-process-text。 */
.service-page .service-process-text {
  display: grid;
  gap: 2px;
}

/* 注解：样式块，作用于 .service-page .service-process-text strong。 */
.service-page .service-process-text strong {
  color: #202536;
  font-size: 22px;
  line-height: 1.35;
  font-weight: 700;
}

/* 注解：样式块，作用于 .service-page .service-process-text small。 */
.service-page .service-process-text small {
  color: #4f5664;
  font-size: 16px;
  line-height: 1.5;
}

/* 注解：样式块，作用于 .service-detail-cta。 */
.service-detail-cta {
  margin-top: 44px;
  padding: 35px 24px;
  border-radius: 28px;
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-active) 100%);
  text-align: center;
}

/* 注解：样式块，作用于 .service-detail-cta p。 */
.service-detail-cta p {
  margin: 0 0 17px;
  color: var(--color-on-primary);
  font-size: 24px;
  line-height: 1.35;
  font-weight: 500;
}

/* 注解：样式块，作用于 .service-detail-button。 */
.service-detail-button {
  min-width: 132px;
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: var(--color-on-primary);
  color: var(--color-primary);
  font-size: 17px;
  line-height: 1;
  font-weight: 700;
}

/* ============================================
   Footer
   ============================================ */
/* 注解：样式块，作用于 .site-footer。 */
.site-footer {
  background: var(--color-dark);
  padding: 0;
  color: rgba(255, 255, 255, 0.7);
}

/* 注解：样式块，作用于 .site-footer .container。 */
.site-footer .container {
  padding-top: 32px;
  padding-bottom: 24px;
}

/* 注解：样式块，作用于 .footer-top。 */
.footer-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding-bottom: 24px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  margin-bottom: 16px;
}

/* 注解：样式块，作用于 .footer-links。 */
.footer-links {
  display: flex;
  gap: 48px;
}

/* 注解：样式块，作用于 .footer-links a。 */
.footer-links a {
  color: rgba(255, 255, 255, 0.9);
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
}

/* 注解：样式块，作用于 .footer-links a:hover。 */
.footer-links a:hover {
  color: var(--color-white);
}

/* 注解：样式块，作用于 .footer-contact。 */
.footer-contact {
  display: flex;
  gap: 40px;
  align-items: center;
  justify-content: center;
  width: 100%;
}

/* 注解：样式块，作用于 .footer-contact-item。 */
.footer-contact-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.7);
}

/* 注解：样式块，作用于 .footer-contact-item svg。 */
.footer-contact-item svg {
  width: 18px;
  height: 18px;
  stroke: rgba(255, 255, 255, 0.5);
  fill: none;
}

/* 注解：样式块，作用于 .footer-copyright。 */
.footer-copyright {
  text-align: center;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.4);
  padding-top: 4px;
}

/* 注解：样式块，作用于 .footer-copyright a。 */
.footer-copyright a {
  color: rgba(255, 255, 255, 0.4);
}

/* 注解：样式块，作用于 .footer-copyright a:hover。 */
.footer-copyright a:hover {
  color: rgba(255, 255, 255, 0.7);
}

/* ============================================
   Page Title Banner（内页顶部）
   ============================================ */
/* 注解：样式块，作用于 .page-banner。 */
.page-banner {
  background: linear-gradient(135deg, #1D2138 0%, #2D3556 100%);
  padding: 48px 0;
  text-align: center;
  color: var(--color-white);
}

/* 注解：样式块，作用于 .page-banner h1。 */
.page-banner h1 {
  color: var(--color-white);
  font-size: 36px;
  font-weight: 500;
  margin-bottom: 8px;
}

/* 注解：样式块，作用于 .page-banner .subtitle。 */
.page-banner .subtitle {
  font-size: 16px;
  color: rgba(255, 255, 255, 0.6);
  text-transform: uppercase;
  letter-spacing: 2px;
}

/* ============================================
   Empty State
   ============================================ */
/* 注解：样式块，作用于 .empty。 */
.empty {
  color: var(--color-text-muted);
  text-align: center;
  padding: 60px 0;
  font-size: 16px;
}

/* ============================================
   Responsive
   ============================================ */
/* 注解：响应式规则，按屏幕宽度覆盖局部样式。 */
@media (max-width: 768px) {
/* 注解：全局 CSS 变量，集中定义颜色、尺寸、阴影和过渡令牌。 */
  :root {
    --container-width: 100%;
  }

/* 注解：样式块，作用于 .container。 */
  .container {
    padding: 0 16px;
  }

/* 注解：样式块，作用于 .site-header。 */
  .site-header {
    height: auto;
    padding: 12px 0;
  }

/* 注解：样式块，作用于 .site-header .container。 */
  .site-header .container {
    flex-direction: column;
    gap: 12px;
  }

/* 注解：样式块，作用于 .main-nav。 */
  .main-nav {
    gap: 20px;
    flex-wrap: wrap;
    justify-content: center;
  }

/* 注解：样式块，作用于 .main-nav a。 */
  .main-nav a {
    font-size: 14px;
  }

/* 注解：样式块，作用于 .hero。 */
  .hero {
    padding: 60px 0 80px;
  }

/* 注解：样式块，作用于 .hero h1。 */
  .hero h1 {
    font-size: 32px;
  }

/* 注解：样式块，作用于 .hero .description。 */
  .hero .description {
    font-size: 18px;
  }

/* 注解：样式块，作用于 .section。 */
  .section {
    padding: 40px 0;
  }

/* 注解：样式块，作用于 .section h1。 */
  .section h1 {
    font-size: 28px;
  }

/* 注解：样式块，作用于 .faq-card。 */
  .faq-card {
    padding: 20px 18px;
  }

/* 注解：样式块，作用于 .faq-card .faq-question。 */
  .faq-card .faq-question {
    font-size: 18px;
  }

  .faq-card .faq-question-row,
/* 注解：样式块，作用于 .faq-card .faq-answer-row。 */
  .faq-card .faq-answer-row {
    grid-template-columns: 30px minmax(0, 1fr);
    column-gap: 11px;
  }

/* 注解：样式块，作用于 .faq-card .faq-question-row strong。 */
  .faq-card .faq-question-row strong {
    font-size: 15px;
  }

/* 注解：样式块，作用于 .faq-card .faq-answer-row span:last-child。 */
  .faq-card .faq-answer-row span:last-child {
    font-size: 14px;
  }

/* 注解：样式块，作用于 .faq-preview-item。 */
  .faq-preview-item {
    padding: 12px 14px;
  }

/* 注解：样式块，作用于 .articles-preview .article-list。 */
  .articles-preview .article-list {
    grid-template-columns: 1fr;
  }

/* 注解：样式块，作用于 .article-index-page。 */
  .article-index-page {
    padding: 8px 7px 0;
  }

/* 注解：样式块，作用于 .about-page。 */
  .about-page {
    padding-top: 0;
  }

/* 注解：样式块，作用于 .article-index-page .container。 */
  .article-index-page .container {
    padding: 0;
  }

/* 注解：样式块，作用于 .article-index-title。 */
  .article-index-title {
    display: none;
  }

/* 注解：样式块，作用于 .article-list。 */
  .article-list {
    padding: 0 18px;
    border-radius: 8px;
  }

/* 注解：样式块，作用于 .article-card。 */
  .article-card {
    flex-direction: row;
    gap: 17px;
    padding: 18px 0;
  }

/* 注解：样式块，作用于 .article-card .date-badge。 */
  .article-card .date-badge {
    width: 73px;
    min-width: 73px;
    height: 82px;
    padding: 0;
  }

/* 注解：样式块，作用于 .article-card .date-badge .day。 */
  .article-card .date-badge .day {
    font-size: 36px;
  }

/* 注解：样式块，作用于 .article-card .date-badge .month。 */
  .article-card .date-badge .month {
    margin-top: 10px;
    font-size: 14px;
  }

  .article-card h2,
/* 注解：样式块，作用于 .article-card h3。 */
  .article-card h3 {
    margin-top: 1px;
    font-size: 18px;
    line-height: 1.58;
  }

/* 注解：样式块，作用于 .article-card .card-summary。 */
  .article-card .card-summary {
    display: none;
  }

/* 注解：样式块，作用于 .service-cards。 */
  .service-cards {
    flex-direction: column;
  }

/* 注解：样式块，作用于 .service-process ol。 */
  .service-process ol {
    flex-direction: column;
    gap: 24px;
  }

/* 注解：样式块，作用于 .service-process li::after。 */
  .service-process li::after {
    display: none;
  }

/* 注解：样式块，作用于 .contact-info。 */
  .contact-info {
    grid-template-columns: 1fr;
  }

/* 注解：样式块，作用于 .footer-top。 */
  .footer-top {
    flex-direction: column;
    gap: 20px;
  }

/* 注解：样式块，作用于 .footer-links。 */
  .footer-links {
    flex-wrap: wrap;
    gap: 20px;
  }

/* 注解：样式块，作用于 .footer-contact。 */
  .footer-contact {
    flex-direction: column;
    gap: 12px;
    align-items: flex-start;
  }
}

/* 注解：响应式规则，按屏幕宽度覆盖局部样式。 */
@media (max-width: 480px) {
/* 注解：样式块，作用于 .hero h1。 */
  .hero h1 {
    font-size: 26px;
  }

/* 注解：样式块，作用于 .hero .industry。 */
  .hero .industry {
    font-size: 16px;
  }

/* 注解：样式块，作用于 .hero .description。 */
  .hero .description {
    font-size: 15px;
  }
}

/* ============================================
   Klepsy homepage: desktop default + phone reference
   ============================================ */
html,
/* 注解：样式块，作用于 body。 */
body {
  background: #1c2338;
}

/* 注解：样式块，作用于 .website-layout。 */
.website-layout {
  max-width: none;
  min-height: 100vh;
  margin: 0;
  background: #f4f6fb;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
}

/* 注解：样式块，作用于 .site-main。 */
.site-main {
  max-width: none;
  margin: 0;
  background: #f4f6fb;
  flex: 1 0 auto;
}

/* 注解：样式块，作用于 .site-header。 */
.site-header {
  height: 96px;
  padding: 0;
  background: #fff;
  border-bottom: 1px solid var(--color-border);
}

/* 注解：样式块，作用于 .site-header .container。 */
.site-header .container {
  max-width: var(--container-width);
  height: 100%;
  padding: 0 24px;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

/* 注解：样式块，作用于 .logo。 */
.logo {
  height: auto;
  padding: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  max-width: 42%;
  flex: 0 1 auto;
  color: #1f2437;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0;
}

/* 注解：样式块，作用于 .brand-name。 */
.brand-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 注解：样式块，作用于 .brand-logo。 */
.brand-logo {
  width: var(--brand-logo-width, auto);
  height: var(--brand-logo-height, 32px);
  max-width: var(--brand-logo-max-width, 180px);
  max-height: 72px;
  display: block;
  object-fit: contain;
  flex: 0 1 auto;
}

/* 注解：样式块，作用于 .main-nav。 */
.main-nav {
  height: auto;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 48px;
  flex-wrap: nowrap;
  overflow: visible;
  background: transparent;
}

/* 注解：样式块，作用于 .main-nav a。 */
.main-nav a {
  flex: 0 0 auto;
  padding: 0;
  border-radius: 0;
  color: #262b38;
  font-size: 15px;
  font-weight: 400;
  line-height: 1;
  white-space: nowrap;
}

.main-nav a:hover,
/* 注解：样式块，作用于 .main-nav a.router-link-active。 */
.main-nav a.router-link-active {
  background: transparent;
  color: var(--color-primary-ink);
  font-weight: 500;
}

/* 注解：样式块，作用于 .mobile-home-page。 */
.mobile-home-page {
  color: #252939;
  background: #f4f6fb;
}

/* 注解：样式块，作用于 .home-hero。 */
.home-hero {
  position: relative;
  min-height: 360px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 88px 24px;
  overflow: hidden;
  background:
    radial-gradient(circle at 88% 36%, rgba(0, 214, 172, 0.62), transparent 42%),
    radial-gradient(circle at 8% 16%, rgba(61, 177, 255, 0.58), transparent 46%),
    linear-gradient(128deg, #dff1ff 0%, #87e9ed 48%, #28dfad 100%);
}

/* 注解：样式块，作用于 .home-hero::before。 */
.home-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(125deg, transparent 0 41%, rgba(255, 255, 255, 0.28) 42%, transparent 44%),
    linear-gradient(160deg, rgba(255, 255, 255, 0.18) 0 1px, transparent 1px 100%),
    radial-gradient(circle at 13% 88%, rgba(255, 255, 255, 0.55), transparent 32%);
  background-size: auto, 24px 24px, auto;
  opacity: 0.75;
}

/* 注解：样式块，作用于 .home-hero-text。 */
.home-hero-text {
  position: relative;
  z-index: 1;
  text-align: center;
}

/* 注解：样式块，作用于 .home-hero-title。 */
.home-hero-title {
  margin: 0;
  color: #12182b;
  font-size: 48px;
  line-height: 1.35;
  font-weight: 500;
  letter-spacing: 0;
}

/* 注解：样式块，作用于 .home-hero-title-line。 */
.home-hero-title-line {
  display: block;
}

/* 注解：样式块，作用于 .home-hero p。 */
.home-hero p {
  margin: 22px 0 0;
  color: #2d3548;
  font-size: 20px;
  line-height: 1.6;
  font-weight: 500;
}

.home-hero-subtitle {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

.home-hero-subtitle span {
  display: block;
}

.home-hero.has-carousel {
  min-height: 0;
  padding: 0;
  background: #f5f7fb;
}

.home-hero.has-carousel::before {
  display: none;
}

.home-hero-carousel {
  position: relative;
  width: 100%;
  flex: 0 0 100%;
  z-index: 0;
  overflow: hidden;
}

.home-hero-carousel-track {
  display: flex;
  width: 100%;
  align-items: flex-start;
  transform: translate3d(calc(var(--hero-carousel-index, 0) * -100%), 0, 0);
  transition: transform 760ms cubic-bezier(0.22, 0.61, 0.36, 1);
  will-change: transform;
}

.home-hero-carousel-slide {
  min-width: 100%;
}

.home-hero-carousel-slide img {
  display: block;
  width: 100%;
  height: auto;
  image-rendering: auto;
}

.home-hero.has-carousel .home-hero-text {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  width: 100%;
  max-width: min(1040px, calc(100% - 180px));
  transform: translate(-50%, -50%);
  text-shadow: 0 2px 18px rgba(255, 255, 255, 0.48);
}

.home-service-arrow.home-hero-arrow {
  position: absolute;
  top: 50%;
  z-index: 3;
  width: clamp(44px, 3vw, 52px);
  height: clamp(44px, 3vw, 52px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-50%) scale(0.88);
  box-shadow: 0 12px 28px rgba(31, 45, 92, 0.12);
  transition:
    opacity 0.2s ease,
    visibility 0.2s ease,
    transform 0.2s ease,
    background 0.18s ease,
    border-color 0.18s ease,
    color 0.18s ease;
}

.home-hero-arrow-prev {
  left: clamp(12px, 3vw, 56px);
}

.home-hero-arrow-next {
  right: clamp(12px, 3vw, 56px);
}

.home-hero.has-carousel:focus-within .home-hero-arrow {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(-50%) scale(1);
}

.home-hero-arrow:focus-visible,
.home-hero-indicator:focus-visible {
  outline: 2px solid var(--color-white);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px var(--color-primary-focus);
}

.home-hero-indicators {
  position: absolute;
  left: 50%;
  bottom: clamp(6px, 1.25vw, 16px);
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2px 5px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.64);
  box-shadow: 0 4px 14px rgba(31, 45, 92, 0.08);
  transform: translateX(-50%);
}

.home-hero-indicator {
  position: relative;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.home-hero-indicator::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--color-primary-border);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.76);
  transform: translate(-50%, -50%);
  transition:
    width 0.2s ease,
    height 0.2s ease,
    background 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.2s ease;
}

.home-hero-indicator.is-active::before {
  width: 10px;
  height: 10px;
  background: var(--color-primary-surface);
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.82);
}

.home-hero-indicator.is-fade-start::before {
  background: linear-gradient(90deg, transparent, var(--color-primary-border));
  transform: translate(-50%, -50%) scale(0.78);
}

.home-hero-indicator.is-fade-end::before {
  background: linear-gradient(90deg, var(--color-primary-border), transparent);
  transform: translate(-50%, -50%) scale(0.78);
}

.home-hero-indicator:disabled {
  cursor: default;
}

@media (hover: hover) and (pointer: fine) {
  .home-hero.has-carousel:hover .home-hero-arrow {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(-50%) scale(1);
  }
}

@media (hover: none), (pointer: coarse) {
  .home-service-arrow.home-hero-arrow {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(-50%) scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-hero-carousel-track,
  .home-service-track,
  .home-service-arrow.home-hero-arrow,
  .home-hero-indicator::before,
  .home-about-more {
    transition: none;
  }
}

/* 注解：样式块，作用于 .home-section。 */
.home-section {
  max-width: var(--container-width);
  margin: 0 auto;
  padding: 32px 24px 64px;
  border: 0;
  background: #f4f6fb;
}

/* 注解：样式块，作用于 .home-section h2。 */
.home-section h2 {
  margin: 0;
  color: #1f2434;
  font-size: 28px;
  line-height: 1.35;
  font-weight: 700;
  letter-spacing: 0;
}

.home-services h2,
/* 注解：样式块，作用于 .home-about h2。 */
.home-about h2 {
  text-align: center;
}

.home-service-head {
  display: flex;
  align-items: center;
  justify-content: center;
}

.home-service-head h2 {
  margin: 0;
}

.home-service-slider {
  --service-card-gap: 28px;
  --service-card-width: calc((100% - (var(--service-card-gap) * 2)) / 3);
  --service-step-offset: calc((var(--service-card-width) + var(--service-card-gap)) * -1);
  width: min(1090px, 100%);
  margin: 30px auto 0;
}

.home-service-carousel-shell {
  position: relative;
}

.home-service-arrow {
  width: 42px;
  height: 42px;
  border: 1px solid var(--color-primary-border);
  border-radius: 999px;
  background: #fff;
  color: var(--color-primary-ink);
  font-size: 30px;
  line-height: 1;
  font-weight: 400;
  cursor: pointer;
  transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.home-service-arrow:hover:not(:disabled) {
  border-color: var(--color-primary-border);
  background: var(--color-primary-surface-hover);
  color: var(--color-on-primary);
}

.home-service-arrow:disabled {
  opacity: 0.32;
  cursor: not-allowed;
}

.home-service-side-arrow {
  position: absolute;
  top: 50%;
  z-index: 2;
  transform: translateY(-50%);
}

.home-service-arrow-prev {
  left: -62px;
}

.home-service-arrow-next {
  right: -62px;
}

/* 注解：样式块，作用于 .home-service-list。 */
.home-service-list {
  width: 100%;
  overflow: hidden;
}

.home-service-track {
  display: flex;
  gap: var(--service-card-gap);
  transform: translate3d(calc(var(--service-window-start, 0) * var(--service-step-offset)), 0, 0);
  transition: transform 760ms cubic-bezier(0.22, 0.61, 0.36, 1);
  will-change: transform;
}

.home-service-track.is-static {
  justify-content: center;
}

/* 主营业务卡片：图片、标题/简介、业务内容三段式布局。 */
.home-service-card {
  width: var(--service-card-width);
  flex: 0 0 var(--service-card-width);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid #e9edf5;
  border-radius: 20px;
  background: #fff;
  text-align: center;
  box-shadow: 0 16px 38px rgba(31, 42, 68, 0.08);
}

.home-service-image-wrap {
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #eef2f7;
}

.home-service-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.home-service-card-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 24px 26px 28px;
}

.home-service-card-heading {
  min-height: 76px;
}

.home-service-card h3 {
  margin: 0;
  color: #202536;
  font-size: 22px;
  line-height: 1.45;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.home-service-card .home-service-summary {
  margin: 6px 0 0;
  color: var(--color-primary-ink);
  font-size: 15px;
  line-height: 1.55;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.home-service-card .home-service-content {
  margin: 18px 0 0;
  padding-top: 16px;
  border-top: 1px solid #edf0f6;
  color: #5e6370;
  font-size: 15px;
  line-height: 1.75;
  font-weight: 500;
  text-align: left;
  white-space: pre-line;
  overflow-wrap: anywhere;
}

.home-service-arrow:focus-visible,
.home-service-autoplay-toggle:focus-visible {
  outline: 2px solid var(--color-white);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px var(--color-primary-focus);
}

.home-service-autoplay-controls {
  margin-top: 16px;
  display: flex;
  justify-content: center;
}

.home-service-autoplay-toggle {
  padding: 6px 12px;
  border: 1px solid var(--color-primary-border);
  border-radius: 999px;
  background: #fff;
  color: var(--color-primary-ink);
  font: inherit;
  font-size: 13px;
  line-height: 1.4;
  cursor: pointer;
}

.home-service-autoplay-toggle:hover {
  border-color: var(--color-primary-border);
}

@media (min-width: 769px) and (max-width: 1200px) {
  .home-service-slider {
    --service-card-width: calc((100% - var(--service-card-gap)) / 2);
  }

  .home-service-slider:not(.is-static) {
    width: calc(100% - 112px);
  }

  .home-service-arrow-prev {
    left: -52px;
  }

  .home-service-arrow-next {
    right: -52px;
  }
}

@media (min-width: 1201px) and (max-width: 1220px) {
  .home-service-slider:not(.is-static) {
    width: calc(100% - 112px);
  }

  .home-service-arrow-prev {
    left: -52px;
  }

  .home-service-arrow-next {
    right: -52px;
  }
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.service-page-slider {
  margin-bottom: 46px;
}

.service-page-service-list {
  margin-bottom: 0;
}

.home-services {
  max-width: 1280px;
  padding-bottom: 32px;
}

.service-page .container {
  max-width: 1280px;
}

.home-about {
  position: relative;
  isolation: isolate;
  max-width: none;
  min-height: 300px;
  margin: 0;
  padding: 32px max(24px, calc((100% - 960px) / 2)) 64px;
  display: grid;
  place-items: center;
  overflow: hidden;
}

.home-about.has-background::before {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  background: linear-gradient(90deg, rgba(5, 49, 94, 0.48), rgba(4, 41, 83, 0.58));
}

.home-about-background {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.home-about-content {
  width: min(820px, 100%);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.home-about.has-background h2 {
  color: #fff;
  text-shadow: 0 2px 12px rgba(5, 30, 62, 0.3);
}

/* 注解：样式块，作用于 .home-about p。 */
.home-about p {
  width: 100%;
  margin: 24px auto 0;
  color: #394052;
  font-size: 16px;
  line-height: 1.9;
  font-weight: 500;
  text-align: center;
  white-space: pre-line;
}

.home-about.has-background p {
  color: rgba(255, 255, 255, 0.94);
  text-shadow: 0 1px 8px rgba(5, 30, 62, 0.36);
}

.home-about-more {
  margin-top: 24px;
  padding: 9px 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border-radius: 999px;
  background: #f7b641;
  color: #fff;
  font-size: 14px;
  line-height: 1.4;
  font-weight: 600;
  box-shadow: 0 8px 18px rgba(184, 112, 6, 0.2);
  transition: background 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

.home-about-more svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.home-about-more:hover {
  background: #f2a927;
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(184, 112, 6, 0.26);
}

.home-about-more:focus-visible {
  outline: 3px solid rgba(247, 182, 65, 0.42);
  outline-offset: 4px;
}

/* 注解：样式块，作用于 .home-certificates。 */
.home-certificates {
  max-width: none;
  margin: 0;
  padding: 44px max(24px, calc((100% - 1090px) / 2)) 50px;
  background: #f8f8fc;
}

.home-certificates > h2 {
  font-size: 24px;
  line-height: 1.35;
  text-align: center;
}

.certificate-slider {
  position: relative;
  width: min(1090px, 100%);
  margin: 26px auto 0;
}

.certificate-list {
  width: 100%;
  min-width: 0;
  overflow: hidden;
}

.certificate-track {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.certificate-track.is-static {
  grid-template-columns: repeat(auto-fit, minmax(180px, 230px));
  justify-content: center;
}

.certificate-card {
  min-width: 0;
  padding: 8px 8px 12px;
  overflow: hidden;
  border-radius: 5px;
  background: #fff;
  box-shadow: 0 7px 20px rgba(31, 36, 72, 0.05);
}

.certificate-image-wrap {
  width: 100%;
  aspect-ratio: 7 / 5;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: #fff;
}

.certificate-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.certificate-card h3 {
  margin: 10px 4px 0;
  overflow: hidden;
  color: #242733;
  font-size: 14px;
  line-height: 1.45;
  font-weight: 500;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.certificate-arrow {
  position: absolute;
  top: 50%;
  z-index: 2;
  width: 36px;
  height: 50px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: transparent;
  color: var(--color-primary-ink);
  cursor: pointer;
  transform: translateY(-50%);
  transition: color 0.18s ease, opacity 0.18s ease;
}

.certificate-arrow-prev {
  left: -52px;
}

.certificate-arrow-next {
  right: -52px;
}

.certificate-arrow svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.certificate-arrow:hover:not(:disabled) {
  color: var(--color-primary-focus);
}

.certificate-arrow:focus-visible {
  outline: 2px solid var(--color-white);
  outline-offset: 2px;
  border-radius: 4px;
  box-shadow: 0 0 0 4px var(--color-primary-focus);
}

.certificate-arrow:disabled {
  opacity: 0.25;
  cursor: not-allowed;
}

/* 注解：样式块，作用于 .home-section-head。 */
.home-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* 注解：样式块，作用于 .home-section-head a。 */
.home-section-head a {
  color: var(--color-primary-ink);
  font-size: 15px;
  font-weight: 700;
}

.home-news {
  max-width: none;
  margin: 0;
  padding: 44px max(24px, calc((100% - 1090px) / 2)) 50px;
  background: #f8f8fc;
}

/* 注解：样式块，作用于 .home-faq。 */
.home-faq {
  max-width: none;
  margin: 0;
  padding: 24px max(24px, calc((100% - 1090px) / 2)) 63px;
}

.home-news .home-section-head,
/* 注解：样式块，作用于 .home-faq .home-section-head。 */
.home-faq .home-section-head {
  height: 30px;
}

.home-news .home-section-head {
  height: 34px;
}

.home-news .home-section-head h2,
/* 注解：样式块，作用于 .home-faq .home-section-head h2。 */
.home-faq .home-section-head h2 {
  font-size: 22px;
  line-height: 1;
}

.home-news .home-section-head h2 {
  font-size: 24px;
  line-height: 1.35;
}

.home-news .home-section-head a,
/* 注解：样式块，作用于 .home-faq .home-section-head a。 */
.home-faq .home-section-head a {
  color: var(--color-primary-ink);
  font-size: 14px;
  line-height: 1;
  font-weight: 700;
}

.home-news .home-section-head .home-news-more {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 16px;
}

.home-news-more svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* 注解：样式块，作用于 .home-news-card。 */
.home-news-card {
  margin-top: 15px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px 24px;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
  overflow: visible;
}

/* 注解：样式块，作用于 .home-faq-card。 */
.home-faq-card {
  margin-top: 14px;
  padding: 13px 18px;
  background: #fff;
  border-radius: 0;
  box-shadow: none;
  overflow: hidden;
}

/* 注解：样式块，作用于 .home-empty。 */
.home-empty {
  margin: 18px 0 0;
  padding: 42px 18px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 2px 10px rgba(43, 55, 98, 0.04);
}

/* 注解：样式块，作用于 .home-news-item。 */
.home-news-item {
  height: 116px;
  padding: 0;
  display: grid;
  grid-template-columns: 102px minmax(0, 1fr) 70px;
  align-items: stretch;
  gap: 0;
  overflow: hidden;
  border: 0;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(31, 36, 72, 0.05);
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.home-news-item:hover {
  box-shadow: 0 12px 28px rgba(31, 36, 72, 0.09);
  transform: translateY(-2px);
}

.home-news-item:focus-visible {
  outline: 2px solid var(--color-white);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px var(--color-primary-focus);
}

/* 注解：样式块，作用于 .home-date-box。 */
.home-date-box {
  width: 100%;
  min-width: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 0;
  background: #fff;
  border-right: 1px solid #eceef4;
}

/* 注解：样式块，作用于 .home-date-box strong。 */
.home-date-box strong {
  color: #101114;
  font-size: 42px;
  line-height: 1;
  font-weight: 500;
  letter-spacing: -1px;
}

/* 注解：样式块，作用于 .home-date-box small。 */
.home-date-box small {
  margin-top: 10px;
  color: #737780;
  font-size: 14px;
  line-height: 1;
}

/* 注解：样式块，作用于 .home-news-text。 */
.home-news-text {
  min-width: 0;
  padding: 16px 10px 16px 34px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}

/* 注解：样式块，作用于 .home-news-title。 */
.home-news-title {
  max-width: 100%;
  overflow: hidden;
  color: #17191f;
  font-size: 19px;
  line-height: 1.45;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: color 0.2s ease;
}

/* 注解：样式块，作用于 .home-news-summary。 */
.home-news-summary {
  margin-top: 5px;
  color: #6d7078;
  font-size: 14px;
  line-height: 1.6;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.home-news-arrow {
  width: 44px;
  height: 44px;
  align-self: center;
  justify-self: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #eef0f8;
  color: #7f8aa7;
  transition: background 0.2s ease, color 0.2s ease;
}

.home-news-arrow svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.home-news-item:hover .home-date-box,
.home-news-item:focus-visible .home-date-box {
  border-right-color: var(--color-primary-border);
  background: var(--color-primary-surface-hover);
}

.home-news-item:hover .home-date-box strong,
.home-news-item:hover .home-date-box small,
.home-news-item:focus-visible .home-date-box strong,
.home-news-item:focus-visible .home-date-box small {
  color: var(--color-on-primary);
}

.home-news-item:hover .home-news-title,
.home-news-item:focus-visible .home-news-title {
  color: var(--color-primary-ink);
}

.home-news-item:hover .home-news-arrow,
.home-news-item:focus-visible .home-news-arrow {
  background: var(--color-primary-surface-hover);
  color: var(--color-on-primary);
}

/* 注解：样式块，作用于 .home-faq-item。 */
.home-faq-item {
  min-height: 0;
  padding: 0 0 12px;
  border-bottom: 0;
}

/* 注解：样式块，作用于 .home-faq-item:last-child。 */
.home-faq-item:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.home-faq-question,
/* 注解：样式块，作用于 .home-faq-answer。 */
.home-faq-answer {
  margin: 0;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  column-gap: 13px;
  align-items: center;
  min-height: 28px;
}

/* 注解：样式块，作用于 .home-faq-answer。 */
.home-faq-answer {
  margin-top: 7px;
}

/* 注解：样式块，作用于 .faq-icon。 */
.faq-icon {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  color: #fff;
  font-size: 16px;
  line-height: 1;
  font-weight: 700;
}

/* 注解：样式块，作用于 .faq-icon-q。 */
.faq-icon-q {
  background: var(--color-primary-surface);
  color: var(--color-on-primary);
}

/* 注解：样式块，作用于 .faq-icon-a。 */
.faq-icon-a {
  background: #ff985f;
}

/* 注解：样式块，作用于 .home-faq-question strong。 */
.home-faq-question strong {
  color: #202532;
  font-size: 17px;
  line-height: 1.35;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 注解：样式块，作用于 .home-faq-answer span:last-child。 */
.home-faq-answer span:last-child {
  color: #4d5564;
  font-size: 15px;
  line-height: 1.45;
  font-weight: 400;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 关于我们页面图文模块：与首页关于我们使用完全独立的数据和样式。 */
.about-page-intro {
  padding: 56px max(24px, calc((100% - 1120px) / 2));
  background: var(--about-page-background, #f3f8fb);
}

.about-page-intro-inner {
  width: min(1120px, 100%);
  min-height: 320px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  overflow: hidden;
}

.about-page-intro-image {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 320px;
  object-fit: cover;
  object-position: center;
}

.about-page-intro.is-image-right .about-page-intro-image {
  order: 2;
}

.about-page-intro-content {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 44px 58px;
  text-align: center;
}

.about-page-intro-content h1 {
  margin: 0;
  color: #202536;
  font-size: 28px;
  line-height: 1.4;
  font-weight: 700;
}

.about-page-intro-subtitle {
  margin-top: 3px;
  color: #7c8496;
  font-size: 13px;
  line-height: 1.5;
  font-weight: 500;
  letter-spacing: 0.02em;
}

.about-page-intro-content p {
  width: 100%;
  margin: 22px auto 0;
  color: #394052;
  font-size: 15px;
  line-height: 1.9;
  font-weight: 500;
  text-align: left;
  white-space: pre-line;
  overflow-wrap: anywhere;
}

.about-page-intro.without-image .about-page-intro-inner {
  grid-template-columns: 1fr;
}

.about-page-intro.without-image .about-page-intro-content {
  width: min(860px, 100%);
  margin: 0 auto;
}

.about-page-features {
  padding: 62px max(24px, calc((100% - 1120px) / 2)) 72px;
  background: #fff;
}

.about-page-features > h2 {
  margin: 0;
  color: #202536;
  font-size: 28px;
  line-height: 1.4;
  font-weight: 700;
  text-align: center;
}

.about-page-feature-grid {
  width: min(1120px, 100%);
  margin: 30px auto 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  box-shadow: 0 12px 34px rgba(31, 42, 68, 0.12);
}

.about-page-feature-card {
  position: relative;
  min-width: 0;
  min-height: 340px;
  padding: 34px 28px 82px;
  border-right: 1px solid #edf0f5;
  background: #fff;
  text-align: left;
}

.about-page-feature-card:last-child {
  border-right: 0;
}

.about-page-feature-card:only-child {
  grid-column: 1 / -1;
}

.about-page-feature-card:first-child {
  border-color: transparent;
  background: var(--color-primary);
  color: var(--color-on-primary);
}

.about-page-feature-card h3 {
  margin: 0;
  color: #202536;
  font-size: 21px;
  line-height: 1.45;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.about-page-feature-card:first-child h3 {
  color: var(--color-on-primary);
}

.about-page-feature-line {
  width: 34px;
  height: 3px;
  margin-top: 25px;
  display: block;
  background: var(--color-primary);
}

.about-page-feature-card:first-child .about-page-feature-line {
  background: var(--color-on-primary);
}

.about-page-feature-card p {
  margin: 18px 0 0;
  color: #626b7d;
  font-size: 15px;
  line-height: 1.85;
  white-space: pre-line;
  overflow-wrap: anywhere;
}

.about-page-feature-card:first-child p {
  color: var(--color-on-primary);
}

.about-page-feature-number {
  position: absolute;
  right: 26px;
  bottom: 25px;
  color: var(--color-primary-border);
  font-size: 52px;
  line-height: 1;
  font-weight: 700;
}

.about-page-feature-card:first-child .about-page-feature-number {
  color: var(--color-on-primary);
}

.about-page-details {
  padding-top: 48px;
}

@media (min-width: 769px) and (max-width: 1100px) {
  .about-page-feature-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .about-page-feature-card:nth-child(2n) {
    border-right: 0;
  }

  .about-page-feature-card:nth-child(n + 3) {
    border-top: 1px solid #edf0f5;
  }
}

/* 注解：样式块，作用于 .contact-panel。 */
.contact-panel {
  max-width: 900px;
  margin: 0 auto;
  padding: 38px 44px 42px;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

/* 注解：样式块，作用于 .contact-panel h2。 */
.contact-panel h2 {
  margin: 0 0 13px;
  color: #202536;
  font-size: 28px;
  line-height: 1.45;
  font-weight: 700;
  text-align: center;
}

/* 注解：样式块，作用于 .contact-lines。 */
.contact-lines {
  display: grid;
  gap: 20px;
}

/* 注解：样式块，作用于 .contact-line。 */
.contact-line {
  margin: 0;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: center;
  column-gap: 16px;
  color: #4b5262;
  font-size: 18px;
  line-height: 1.55;
  word-break: break-word;
}

/* 注解：样式块，作用于 .contact-line a。 */
.contact-line a {
  color: inherit;
}

/* 注解：样式块，作用于 .contact-icon。 */
.contact-icon {
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: var(--color-primary-surface);
  color: var(--color-on-primary);
}

/* 注解：样式块，作用于 .contact-icon svg。 */
.contact-icon svg {
  width: 20px;
  height: 20px;
}

/* 关于我们页团队成员翻转卡片 */
.team-member-section {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto 64px;
  background: #fff;
  padding: 38px 24px 54px;
}

.team-member-heading-wrap {
  margin-bottom: 56px;
  text-align: center;
}

.team-member-heading-wrap h2 {
  margin: 0;
  color: var(--color-primary-ink);
  font-size: 30px;
  font-weight: 700;
  line-height: 1.4;
}

.team-member-heading-wrap span {
  display: block;
  width: 58px;
  height: 7px;
  margin: 24px auto 0;
  background: var(--color-primary);
}

.team-member-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 40px;
}

.team-member-card {
  min-width: 0;
  min-height: 430px;
  perspective: 1200px;
}

.team-member-card-button {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  border: 0;
  background: transparent;
  padding: 0;
  color: inherit;
  font: inherit;
  text-align: inherit;
  cursor: pointer;
}

.team-member-card-button:focus-visible {
  outline: 2px solid var(--color-white);
  outline-offset: 3px;
  box-shadow: 0 0 0 5px var(--color-primary-focus);
}

.team-member-card-inner {
  position: relative;
  display: grid;
  width: 100%;
  min-height: 430px;
  height: 100%;
  transition: transform 0.55s cubic-bezier(0.2, 0.7, 0.2, 1);
  transform-style: preserve-3d;
}

.team-member-card.is-flipped .team-member-card-inner {
  transform: rotateY(180deg);
}

.team-member-card-face {
  position: relative;
  grid-area: 1 / 1;
  display: flex;
  min-width: 0;
  min-height: 100%;
  flex-direction: column;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.team-member-card-front {
  align-items: center;
  background: #fff;
  text-align: center;
}

.team-member-portrait-wrap {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  width: 100%;
  height: 300px;
  margin-bottom: 24px;
  overflow: hidden;
}

.team-member-portrait {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
}

.team-member-card-front > strong {
  display: -webkit-box;
  max-width: 100%;
  margin-bottom: 14px;
  overflow: hidden;
  color: #22283a;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.4;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.team-member-summary {
  display: -webkit-box;
  max-width: 280px;
  overflow: hidden;
  color: #565d70;
  font-size: 16px;
  line-height: 1.75;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.team-member-card-back {
  background: var(--color-primary);
  padding: 42px 30px 34px;
  color: var(--color-on-primary);
  overflow-wrap: anywhere;
  transform: rotateY(180deg);
}

.team-member-card-back > strong {
  display: block;
  margin-bottom: 24px;
  font-size: 23px;
  font-weight: 700;
  line-height: 1.4;
}

.team-member-expertise-list {
  display: grid;
  gap: 16px;
}

.team-member-expertise-item {
  position: relative;
  display: block;
  padding-left: 16px;
  font-size: 15px;
  line-height: 1.65;
}

.team-member-expertise-item::before {
  content: "•";
  position: absolute;
  left: 0;
  top: 0;
  font-weight: 700;
}

@media (max-width: 1000px) {
  .team-member-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 36px 28px;
  }
}

@media (max-width: 600px) {
  .team-member-section {
    margin-bottom: 42px;
    padding: 30px 18px 42px;
  }

  .team-member-heading-wrap {
    margin-bottom: 38px;
  }

  .team-member-heading-wrap h2 {
    font-size: 25px;
  }

  .team-member-heading-wrap span {
    width: 48px;
    height: 5px;
    margin-top: 18px;
  }

  .team-member-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .team-member-card {
    width: 100%;
    max-width: 320px;
    min-height: 420px;
    margin: 0 auto;
  }

  .team-member-card-inner {
    min-height: 420px;
  }

  .team-member-portrait-wrap {
    height: 292px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .team-member-card-inner {
    transition: none;
  }
}

/*
  留言表单模板样式说明：
  1. 这里是官网模板源码，长期修改表单 UI 应改这个文件，不要直接改 .output/public。
  2. .output/public 是 Nuxt 生成后的静态产物，每次“生成/发布官网”都会被重新覆盖。
  3. 修改本段样式后，需要在服务器重新生成/发布官网，线上已生成站点才会同步新样式。
  4. 本段只负责右侧留言表单和收起按钮，尽量不要在这里改新闻、底部、首页等非表单样式。
*/
/* 注解：样式块，作用于 .inquiry-widget。 */
.inquiry-widget {
  /* 全屏固定容器只用来承载表单浮层，本身不拦截页面点击。 */
  pointer-events: none;
  position: fixed;
  inset: 0;
  z-index: 80;
}

/* 注解：样式块，作用于 .inquiry-float-tab。 */
.inquiry-float-tab {
  /* 表单关闭后显示的右侧竖向入口，需要重新开启点击事件。 */
  pointer-events: auto;
  position: fixed;
  right: calc(100% - 100vw);
  top: 63.5%;
  width: 47px;
  height: 156px;
  padding: 17px 0 15px;
  border: 1px solid var(--color-primary-border);
  border-right: 0;
  border-radius: 18px 0 0 18px;
  background: var(--color-primary-surface);
  color: var(--color-on-primary);
  box-shadow: none;
  transform: translateY(-50%);
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 9px;
  cursor: pointer;
}

/* 注解：样式块，作用于 .inquiry-float-icon。 */
.inquiry-float-icon {
  width: 15px;
  height: 15px;
  flex: 0 0 15px;
}

/* 注解：样式块，作用于 .inquiry-float-text。 */
.inquiry-float-text {
  writing-mode: vertical-rl;
  text-orientation: upright;
  letter-spacing: 0;
  font-size: 14px;
  line-height: 1;
  font-weight: 600;
}

/* 注解：样式块，作用于 .inquiry-dialog。 */
.inquiry-dialog {
  /* 主表单面板固定在页面右下角，覆盖所有页面使用同一套模板样式。 */
  pointer-events: auto;
  position: fixed;
  right: 0;
  bottom: 84px;
  width: 26.65vw;
  min-width: 330px;
  max-width: 440px;
  /*
    固定表单高度：
    - 设计稿表单高度约为 324px；
    - 如果只用内容自适应，服务器字体、浏览器缩放或 label 换行都会把容器撑高；
    - 高度固定后，上传模板并重新生成官网时，各页面的表单高度保持一致。
  */
  height: 324px;
  min-height: 324px;
  padding: 28px 24px 24px;
  border: 1px solid var(--color-primary-border);
  border-radius: 12px 0 0 12px;
  background: linear-gradient(180deg, var(--color-primary-soft) 0%, var(--color-white) 76%);
  box-shadow: 0 8px 16px rgba(33, 75, 114, 0.18);
}

/* 注解：样式块，作用于 .inquiry-dialog.is-success。 */
.inquiry-dialog.is-success {
  /* 提交成功态比表单态更空，需要单独保留成功图标和文字的垂直空间。 */
  min-height: 386px;
  padding: 0 24px;
}

/* 注解：样式块，作用于 .inquiry-close。 */
.inquiry-close {
  position: absolute;
  top: 13px;
  right: 14px;
  width: 18px;
  height: 18px;
  border: 0;
  padding: 0;
  background: transparent;
  color: #667085;
  font-size: 18px;
  line-height: 18px;
  font-weight: 300;
  cursor: pointer;
}

/* 注解：样式块，作用于 .inquiry-dialog h2。 */
.inquiry-dialog h2 {
  margin: 0;
  color: #111827;
  font-size: 16px;
  line-height: 1.35;
  font-weight: 700;
  text-align: center;
}

/* 注解：样式块，作用于 .inquiry-dialog-desc。 */
.inquiry-dialog-desc {
  margin: 7px 0 15px;
  color: #5f6877;
  font-size: 12px;
  line-height: 1.45;
  text-align: center;
}

/* 注解：样式块，作用于 .inquiry-dialog-form。 */
.inquiry-dialog-form {
  display: grid;
  gap: 9px;
}

/* 注解：样式块，作用于 .inquiry-dialog-field。 */
.inquiry-dialog-field {
  /* 左列给 label，右列给输入控件；72px 是为了保证“联系电话”四个字不换行。 */
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  column-gap: 9px;
  align-items: center;
  color: #111827;
  font-size: 12px;
  line-height: 1.35;
}

/* 注解：样式块，作用于 .inquiry-dialog-field span。 */
.inquiry-dialog-field span {
  text-align: left;
}

/* 注解：样式块，作用于 .inquiry-field-label。 */
.inquiry-field-label {
  /* label 内部拆成星号列 + 文案列，保证必填星号和三行标签文案左侧对齐。 */
  display: grid;
  grid-template-columns: 8px 4em;
  column-gap: 5px;
  align-items: start;
  min-width: 72px;
}

/* 注解：样式块，作用于 .inquiry-dialog-field b。 */
.inquiry-dialog-field b {
  margin: 0;
  color: #f04438;
  font-weight: 700;
}

/* 注解：样式块，作用于 .inquiry-field-label:not(.is-required) b。 */
.inquiry-field-label:not(.is-required) b {
  /* 非必填项隐藏星号但保留占位，避免“需求描述”相对前两项向左偏移。 */
  visibility: hidden;
}

/* 注解：样式块，作用于 .inquiry-field-label > span。 */
.inquiry-field-label > span {
  /* 四字 label 固定为 4em，防止服务器字体差异导致“联系电话”断行。 */
  display: block;
  min-width: 4em;
  text-align: left;
  white-space: nowrap;
}

/* 注解：样式块，作用于 .inquiry-field-label em。 */
.inquiry-field-label em {
  display: block;
  margin-top: 2px;
}

/* 注解：样式块，作用于 .inquiry-dialog-field em。 */
.inquiry-dialog-field em {
  color: #667085;
  font-style: normal;
}

.inquiry-dialog-field input,
/* 注解：样式块，作用于 .inquiry-dialog-field textarea。 */
.inquiry-dialog-field textarea {
  width: 100%;
  border: 1px solid #d6e0ef;
  border-radius: 5px;
  padding: 0 11px;
  font: inherit;
  color: #202536;
  background: rgba(255, 255, 255, 0.42);
  outline: none;
}

.inquiry-dialog-field input:focus,
/* 注解：样式块，作用于 .inquiry-dialog-field textarea:focus。 */
.inquiry-dialog-field textarea:focus {
  border-color: var(--color-primary-focus);
  background: #fff;
  box-shadow: 0 0 0 2px rgba(var(--color-primary-rgb), 0.18);
}

.inquiry-dialog-field.has-error input,
/* 注解：样式块，作用于 .inquiry-dialog-field.has-error textarea。 */
.inquiry-dialog-field.has-error textarea {
  border-color: #ff4d4f;
  color: #ff4d4f;
  background: rgba(255, 255, 255, 0.55);
}

/* 注解：样式块，作用于 .inquiry-dialog-field input。 */
.inquiry-dialog-field input {
  height: 34px;
}

/* 注解：样式块，作用于 .inquiry-dialog-field textarea。 */
.inquiry-dialog-field textarea {
  height: 51px;
  padding: 10px 11px 18px;
  resize: none;
}

.inquiry-dialog-field input::placeholder,
/* 注解：样式块，作用于 .inquiry-dialog-field textarea::placeholder。 */
.inquiry-dialog-field textarea::placeholder {
  color: #9aa4b5;
}

/* 注解：样式块，作用于 .inquiry-textarea-wrap。 */
.inquiry-textarea-wrap {
  position: relative;
  display: block;
}

/* 注解：样式块，作用于 .inquiry-dialog-field .inquiry-textarea-wrap。 */
.inquiry-dialog-field .inquiry-textarea-wrap {
  text-align: left;
}

/* 注解：样式块，作用于 .inquiry-dialog-field .inquiry-char-tip。 */
.inquiry-dialog-field .inquiry-char-tip {
  position: absolute;
  right: 9px;
  bottom: 5px;
  color: rgba(102, 112, 133, 0.45);
  font-size: 9px;
  line-height: 1;
  font-style: normal;
}

/* 注解：样式块，作用于 .inquiry-description-field.has-warning textarea。 */
.inquiry-description-field.has-warning textarea {
  border-color: #ff4d4f;
}

/* 注解：样式块，作用于 .inquiry-description-field.has-warning .inquiry-char-tip。 */
.inquiry-description-field.has-warning .inquiry-char-tip {
  color: #ff4d4f;
}

/* 注解：样式块，作用于 .inquiry-dialog-submit。 */
.inquiry-dialog-submit {
  justify-self: center;
  width: 165px;
  height: 37px;
  margin-top: 5px;
  border: 0;
  border-radius: 7px;
  background: var(--color-primary-surface);
  color: var(--color-on-primary);
  font-size: 13px;
  line-height: 1;
  font-weight: 600;
  cursor: pointer;
}

.inquiry-float-tab:focus-visible,
.inquiry-dialog-submit:focus-visible {
  outline: 2px solid var(--color-white);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px var(--color-primary-focus);
}

.inquiry-dialog-submit:hover:not(:disabled) {
  background: var(--color-primary-surface-hover);
}

/* 注解：样式块，作用于 .inquiry-dialog-submit:disabled。 */
.inquiry-dialog-submit:disabled {
  opacity: 0.65;
  cursor: not-allowed;
}

.inquiry-message,
/* 注解：样式块，作用于 .inquiry-error。 */
.inquiry-error {
  margin: 0;
  text-align: center;
  font-size: 14px;
  line-height: 1.6;
}

/* 注解：样式块，作用于 .inquiry-message。 */
.inquiry-message {
  color: #16794c;
}

/* 注解：样式块，作用于 .inquiry-error。 */
.inquiry-error {
  color: #d93025;
}

/* 注解：样式块，作用于 .inquiry-error-banner。 */
.inquiry-error-banner {
  /* 顶部错误提示固定在标题上方，避免接口失败时把表单整体向下挤压。 */
  margin: 0 0 16px;
  color: #ff3434;
  font-size: 12px;
  line-height: 1.35;
  text-align: center;
}

/* 注解：样式块，作用于 .inquiry-error-banner::before。 */
.inquiry-error-banner::before {
  /* 设计稿里的红色感叹号图标，用 CSS 画，避免额外图片资源。 */
  content: "!";
  width: 12px;
  height: 12px;
  margin-right: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid currentColor;
  border-radius: 999px;
  font-size: 9px;
  line-height: 1;
  font-weight: 700;
}

/* 注解：样式块，作用于 .inquiry-success。 */
.inquiry-success {
  /* 成功态内容居中偏上，和设计图的绿色勾选提示保持一致。 */
  min-height: 384px;
  padding-top: 128px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  text-align: center;
}

/* 注解：样式块，作用于 .inquiry-success-icon。 */
.inquiry-success-icon {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #27ad68;
  color: #fff;
  font-size: 25px;
  line-height: 1;
  font-weight: 500;
}

/* 注解：样式块，作用于 .inquiry-success h2。 */
.inquiry-success h2 {
  margin-top: 13px;
  color: #1fad63;
  font-size: 16px;
}

/* 注解：样式块，作用于 .inquiry-success p。 */
.inquiry-success p {
  margin: 14px 0 0;
  color: #3d4658;
  font-size: 13px;
  line-height: 1.5;
}

/* 注解：响应式规则，按屏幕宽度覆盖局部样式。 */
@media (min-width: 769px) {
/* 注解：样式块，作用于 .home-hero。 */
  .home-hero {
    min-height: 360px;
  }

/* 注解：样式块，作用于 .home-service-list。 */
  .home-service-list {
    grid-template-columns: repeat(3, 1fr);
  }

  .home-service-list.home-service-count-1 {
    max-width: 520px;
    grid-template-columns: minmax(0, 1fr);
    margin-right: auto;
    margin-left: auto;
  }

  .home-service-list.home-service-count-2 {
    max-width: 1040px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-right: auto;
    margin-left: auto;
  }
}

/* 注解：响应式规则，按屏幕宽度覆盖局部样式。 */
@media (max-width: 768px) {
/* 注解：样式块，作用于 .website-layout。 */
  .website-layout {
    width: 100%;
    max-width: 375px;
    min-height: 100vh;
    margin: 0 auto;
    background: #f4f6fb;
    overflow: hidden;
  }

/* 注解：样式块，作用于 .site-main。 */
  .site-main {
    width: 100%;
    max-width: 375px;
    margin: 0 auto;
    background: #f4f6fb;
  }

/* 注解：样式块，作用于 .site-header。 */
  .site-header {
    position: sticky;
    top: 0;
    z-index: 100;
    height: auto;
    padding: 0;
    background: #fff;
    border-bottom: 0;
  }

/* 注解：样式块，作用于 .site-header .container。 */
  .site-header .container {
    width: 100%;
    max-width: 375px;
    height: auto;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
  }

/* 注解：样式块，作用于 .logo。 */
  .logo {
    height: 62px;
    padding: 0 17px;
    gap: 9px;
    max-width: 100%;
    font-size: 15px;
  }

/* 注解：样式块，作用于 .brand-logo。 */
  .brand-logo {
    width: var(--brand-logo-width, auto);
    height: min(var(--brand-logo-height, 26px), 40px);
    max-width: min(var(--brand-logo-max-width, 120px), 120px);
    max-height: 40px;
  }

/* 注解：样式块，作用于 .main-nav。 */
  .main-nav {
    height: 48px;
    padding: 0 14px;
    justify-content: space-between;
    gap: 0;
    overflow-x: auto;
    background: #f6f7fb;
    scrollbar-width: none;
  }

/* 注解：样式块，作用于 .main-nav::-webkit-scrollbar。 */
  .main-nav::-webkit-scrollbar {
    display: none;
  }

/* 注解：样式块，作用于 .main-nav a。 */
  .main-nav a {
    padding: 7px 11px;
    border-radius: 18px;
    color: #262b38;
    font-size: 13px;
    font-weight: 500;
  }

  .main-nav a:hover,
/* 注解：样式块，作用于 .main-nav a.router-link-active。 */
  .main-nav a.router-link-active {
    background: var(--color-primary-surface);
    color: var(--color-on-primary);
    font-weight: 600;
  }

/* 注解：样式块，作用于 .home-hero。 */
  .home-hero {
    min-height: 196px;
    padding: 42px 18px 44px;
  }

/* 注解：样式块，作用于 .home-hero::before。 */
  .home-hero::before {
    background-size: auto, 18px 18px, auto;
  }

/* 注解：样式块，作用于 .home-hero-title。 */
  .home-hero-title {
    font-size: 27px;
    line-height: 1.48;
  }

/* 注解：样式块，作用于 .home-hero p。 */
  .home-hero p {
    margin-top: 18px;
    font-size: 14px;
  }

  .home-hero-subtitle {
    gap: 0;
  }

  .home-hero.has-carousel .home-hero-text {
    max-width: calc(100% - 86px);
  }

  .home-hero-arrow-prev {
    left: 12px;
  }

  .home-hero-arrow-next {
    right: 12px;
  }

/* 注解：样式块，作用于 .home-section。 */
  .home-section {
    max-width: none;
    padding: 14px 14px 28px;
  }

  .home-services {
    padding-bottom: 14px;
  }

/* 注解：样式块，作用于 .home-section h2。 */
  .home-section h2 {
    font-size: 19px;
  }

  .home-service-head {
    gap: 10px;
  }

  .home-service-arrow {
    width: 34px;
    height: 34px;
    font-size: 24px;
  }

  .home-service-slider {
    --service-card-width: 100%;
    --service-card-gap: 18px;
    margin-top: 18px;
  }

  .home-service-slider:not(.is-static) {
    width: calc(100% - 80px);
  }

  .home-service-arrow-prev {
    left: -38px;
  }

  .home-service-arrow-next {
    right: -38px;
  }

  .home-service-card-body {
    padding: 20px 18px 22px;
  }

  .home-service-card-heading {
    min-height: 0;
  }

  .home-service-card h3 {
    font-size: 17px;
  }

  .home-service-card .home-service-summary,
  .home-service-card .home-service-content {
    font-size: 14px;
  }

  .home-service-card .home-service-content {
    margin-top: 14px;
    padding-top: 13px;
  }

/* 注解：样式块，作用于 .home-about。 */
  .home-about {
    min-height: 280px;
    padding: 18px 20px 36px;
  }

/* 注解：样式块，作用于 .home-about p。 */
  .home-about p {
    margin-top: 16px;
    font-size: 14px;
    line-height: 1.72;
  }

  .home-about-more {
    margin-top: 20px;
    padding: 8px 18px;
    font-size: 13px;
  }

/* 注解：样式块，作用于 .home-news。 */
  .home-news {
    max-width: none;
    padding: 22px 14px 28px;
  }

/* 注解：样式块，作用于 .home-faq。 */
  .home-faq {
    max-width: none;
    padding: 18px 14px 0;
  }

/* 注解：样式块，作用于 .home-section-head。 */
  .home-section-head {
    height: 32px;
  }

  .home-section-head h2,
  .home-news .home-section-head h2,
/* 注解：样式块，作用于 .home-faq .home-section-head h2。 */
  .home-faq .home-section-head h2 {
    font-size: 18px;
  }

  .home-section-head a,
  .home-news .home-section-head a,
/* 注解：样式块，作用于 .home-faq .home-section-head a。 */
  .home-faq .home-section-head a {
    font-size: 13px;
  }

  .home-news .home-section-head .home-news-more {
    gap: 5px;
    font-size: 13px;
  }

  .home-news-more svg {
    width: 14px;
    height: 14px;
  }

/* 注解：样式块，作用于 .home-news-card。 */
  .home-news-card {
    margin-top: 10px;
    grid-template-columns: 1fr;
    gap: 12px;
    background: transparent;
    border-radius: 0;
    overflow: visible;
  }

/* 注解：样式块，作用于 .home-faq-card。 */
  .home-faq-card {
    margin-top: 7px;
    padding: 10px 14px;
    border-radius: 5px;
  }

/* 注解：样式块，作用于 .home-empty。 */
  .home-empty {
    margin-top: 7px;
    padding: 34px 14px;
    border-radius: 5px;
  }

/* 注解：样式块，作用于 .home-news-item。 */
  .home-news-item {
    height: 96px;
    padding: 0;
    grid-template-columns: 74px minmax(0, 1fr) 44px;
    gap: 0;
    border-radius: 8px;
  }

/* 注解：样式块，作用于 .home-date-box。 */
  .home-date-box {
    width: 100%;
    min-width: 0;
    align-self: stretch;
    height: 100%;
    border-radius: 0;
  }

/* 注解：样式块，作用于 .home-date-box strong。 */
  .home-date-box strong {
    font-size: 29px;
  }

/* 注解：样式块，作用于 .home-date-box small。 */
  .home-date-box small {
    margin-top: 8px;
    font-size: 11px;
  }

  .home-news-text {
    padding: 12px 8px 12px 14px;
  }

/* 注解：样式块，作用于 .home-news-title。 */
  .home-news-title {
    font-size: 15px;
  }

/* 注解：样式块，作用于 .home-news-summary。 */
  .home-news-summary {
    margin-top: 4px;
    font-size: 11px;
    line-height: 1.5;
  }

  .home-news-arrow {
    width: 32px;
    height: 32px;
  }

  .home-news-arrow svg {
    width: 17px;
    height: 17px;
  }

/* 注解：样式块，作用于 .home-faq。 */
  .home-faq {
    padding-bottom: 22px;
  }

/* 注解：样式块，作用于 .home-faq-item。 */
  .home-faq-item {
    padding: 0 0 10px;
  }

  .home-faq-question,
/* 注解：样式块，作用于 .home-faq-answer。 */
  .home-faq-answer {
    grid-template-columns: 28px minmax(0, 1fr);
    column-gap: 12px;
  }

/* 注解：样式块，作用于 .home-faq-answer。 */
  .home-faq-answer {
    margin-top: 6px;
  }

/* 注解：样式块，作用于 .faq-icon。 */
  .faq-icon {
    width: 28px;
    height: 28px;
  }

/* 注解：样式块，作用于 .home-faq-question strong。 */
  .home-faq-question strong {
    font-size: 16px;
  }

/* 注解：样式块，作用于 .home-faq-answer span:last-child。 */
  .home-faq-answer span:last-child {
    font-size: 14px;
  }

/* 注解：样式块，作用于 .service-page。 */
  .service-page {
    padding: 0;
    background: #f4f6fb;
  }

/* 注解：样式块，作用于 .service-page .container。 */
  .service-page .container {
    padding: 16.5px 24px 20px;
    border-radius: 0;
    box-shadow: none;
  }

/* 注解：样式块，作用于 .service-page h1。 */
  .service-page h1 {
    margin-bottom: 24px;
    font-size: 23px;
  }

/* 注解：样式块，作用于 .service-page .service-cards。 */
  .service-page .service-cards {
    grid-template-columns: 1fr;
    gap: 18px;
    margin-bottom: 36px;
  }

  .service-page .service-card,
/* 注解：样式块，作用于 .service-page .services-content。 */
  .service-page .services-content {
    padding: 32px 24px;
    border-radius: 24px;
  }

  .service-page .service-card h3,
/* 注解：样式块，作用于 .service-page .services-content h2。 */
  .service-page .services-content h2 {
    font-size: 19px;
  }

  .service-page .service-card p,
/* 注解：样式块，作用于 .service-page .services-content p。 */
  .service-page .services-content p {
    font-size: 15px;
    line-height: 1.82;
  }

/* 注解：样式块，作用于 .service-page .service-process h2。 */
  .service-page .service-process h2 {
    margin-bottom: 26px;
    font-size: 23px;
  }

/* 注解：样式块，作用于 .service-page .service-process-list。 */
  .service-page .service-process-list {
    gap: 22px;
  }

/* 注解：样式块，作用于 .service-page .service-process-item。 */
  .service-page .service-process-item {
    grid-template-columns: 49px minmax(0, 1fr);
    column-gap: 18px;
  }

/* 注解：样式块，作用于 .service-page .service-process-index。 */
  .service-page .service-process-index {
    width: 43px;
    height: 43px;
    font-size: 18px;
  }

/* 注解：样式块，作用于 .service-page .service-process-text strong。 */
  .service-page .service-process-text strong {
    font-size: 20px;
  }

/* 注解：样式块，作用于 .service-page .service-process-text small。 */
  .service-page .service-process-text small {
    font-size: 15px;
  }

/* 注解：样式块，作用于 .service-detail-cta。 */
  .service-detail-cta {
    margin-top: 34px;
    padding: 31px 20px 32px;
    border-radius: 24px;
  }

/* 注解：样式块，作用于 .service-detail-cta p。 */
  .service-detail-cta p {
    margin-bottom: 17px;
    font-size: 21px;
  }

/* 注解：样式块，作用于 .service-detail-button。 */
  .service-detail-button {
    min-width: 117px;
    min-height: 39px;
    font-size: 16px;
  }

  .about-page-intro {
    padding: 24px 20px;
  }

  .about-page-intro-inner {
    min-height: 0;
    grid-template-columns: 1fr;
  }

  .about-page-intro-image {
    min-height: 0;
    aspect-ratio: 16 / 10;
    order: 0 !important;
  }

  .about-page-intro-content {
    padding: 30px 22px 34px;
  }

  .about-page-intro-content h1 {
    font-size: 23px;
  }

  .about-page-intro-content p {
    margin-top: 18px;
    font-size: 15px;
    line-height: 1.85;
  }

  .about-page-intro.without-image .about-page-intro-content {
    width: 100%;
  }

  .about-page-features {
    padding: 42px 20px 48px;
  }

  .about-page-features > h2 {
    font-size: 23px;
  }

  .about-page-feature-grid {
    margin-top: 24px;
    grid-template-columns: 1fr;
  }

  .about-page-feature-card {
    min-height: 250px;
    padding: 28px 24px 70px;
    border-right: 0;
    border-bottom: 1px solid #edf0f5;
  }

  .about-page-feature-card:last-child {
    border-bottom: 0;
  }

  .about-page-feature-card h3 {
    font-size: 19px;
  }

  .about-page-feature-number {
    right: 22px;
    bottom: 20px;
    font-size: 44px;
  }

  .about-page-details {
    padding-top: 28px;
  }

/* 注解：样式块，作用于 .faq-page-title。 */
  .faq-page-title {
    display: none;
  }

/* 注解：样式块，作用于 .contact-panel。 */
  .contact-panel {
    padding: 33px 22px 36px;
    border-radius: 0;
  }

/* 注解：样式块，作用于 .contact-panel h2。 */
  .contact-panel h2 {
    margin-bottom: 12px;
    font-size: 22px;
  }

/* 注解：样式块，作用于 .contact-lines。 */
  .contact-lines {
    gap: 18px;
  }

/* 注解：样式块，作用于 .contact-line。 */
  .contact-line {
    grid-template-columns: 35px minmax(0, 1fr);
    column-gap: 13px;
    font-size: 16px;
  }

/* 注解：样式块，作用于 .contact-icon。 */
  .contact-icon {
    width: 31px;
    height: 31px;
  }

/* 注解：样式块，作用于 .contact-icon svg。 */
  .contact-icon svg {
    width: 18px;
    height: 18px;
  }

/* 注解：样式块，作用于 .inquiry-float-tab。 */
  .inquiry-float-tab {
    top: 50%;
    width: 42px;
    height: 128px;
    min-height: 128px;
    border-radius: 16px 0 0 16px;
  }

/* 注解：样式块，作用于 .inquiry-float-text。 */
  .inquiry-float-text {
    font-size: 12px;
  }

/* 注解：样式块，作用于 .inquiry-dialog。 */
  .inquiry-dialog {
    /* 窄屏时面板从右侧贴边改为左右留 14px，避免压到浏览器滚动条。 */
    top: auto;
    right: 14px;
    bottom: 22px;
    width: calc(100vw - 28px);
    /*
      窄屏同样固定高度：
      - 防止移动端/窄视口下内容自适应变高；
      - max-height 仍保留，极端小屏可滚动，不会超出视口。
    */
    height: 324px;
    min-height: 324px;
    max-height: calc(100vh - 44px);
    padding: 30px 18px 26px;
    border-radius: 12px;
    overflow: auto;
  }

/* 注解：样式块，作用于 .inquiry-dialog-field。 */
  .inquiry-dialog-field {
    grid-template-columns: 72px minmax(0, 1fr);
    column-gap: 10px;
  }

/* 注解：样式块，作用于 .inquiry-dialog-submit。 */
  .inquiry-dialog-submit {
    margin-top: 10px;
  }
}

/* 产品详情页最终覆盖层：确保覆盖旧产品详情样式 */
/* 产品详情页最终模块覆盖：压住旧重复样式，让详情模块接近产品详情设计稿 */
.product-detail-canvas {
  display: grid !important;
  gap: 18px !important;
}

.product-detail-card {
  margin-bottom: 0 !important;
  border: 1px solid #edf0f6 !important;
  border-radius: 10px !important;
  box-shadow: 0 8px 28px rgb(30 42 80 / 5%) !important;
  padding: 30px 44px 42px !important;
}

.product-detail-card h2 {
  max-width: 760px !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

.product-detail-block {
  padding-top: 38px !important;
  padding-bottom: 48px !important;
}

.product-detail-block h2 {
  max-width: 760px !important;
  margin-bottom: 18px !important;
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
  color: #20243a !important;
  font-size: 27px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  text-align: center !important;
}

.product-detail-block-desc {
  max-width: 620px !important;
  margin: 0 auto 30px !important;
  color: #5f6678 !important;
  font-size: 13px !important;
  line-height: 1.85 !important;
}

.product-feature-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 280px)) !important;
  justify-content: center !important;
  align-items: stretch !important;
  gap: 24px !important;
  max-width: 760px !important;
  margin: 0 auto !important;
}

.product-feature-grid.single-card {
  grid-template-columns: minmax(0, 560px) !important;
}

.product-feature-card {
  display: flex !important;
  min-height: 210px !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: #f4f4f6 !important;
  box-shadow: none !important;
  padding: 30px 30px 32px !important;
}

.product-feature-card img {
  display: block !important;
  width: min(100%, 168px) !important;
  height: 104px !important;
  margin: 0 auto 18px !important;
  border-radius: 10px !important;
  object-fit: contain !important;
}

.product-feature-grid.single-card .product-feature-card {
  min-height: 238px !important;
  padding-right: 48px !important;
  padding-left: 48px !important;
}

.product-feature-grid.single-card .product-feature-card img {
  width: min(100%, 220px) !important;
  height: 132px !important;
}

.product-feature-card h3 {
  margin: 0 0 8px !important;
  color: #252939 !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  text-align: center !important;
}

.product-feature-card p {
  max-width: 360px !important;
  margin: 0 !important;
  color: #60687a !important;
  font-size: 12px !important;
  line-height: 1.75 !important;
  text-align: center !important;
}

.product-image-text-block {
  display: grid !important;
  max-width: 760px !important;
  grid-template-columns: minmax(0, 0.9fr) minmax(220px, 1.1fr) !important;
  align-items: center !important;
  gap: 34px !important;
  margin: 0 auto !important;
  border-radius: 14px !important;
  background: #f4f4f6 !important;
  padding: 34px 42px !important;
  text-align: left !important;
}

.product-image-text-block.image-left {
  grid-template-columns: minmax(220px, 1.1fr) minmax(0, 0.9fr) !important;
}

.product-image-text-block.image-left .product-image-text-copy {
  order: 2 !important;
}

.product-image-text-block.image-left img {
  order: 1 !important;
}

.product-image-text-block.image-top {
  grid-template-columns: 1fr !important;
  text-align: center !important;
}

.product-image-text-copy h3 {
  margin: 0 0 12px !important;
  color: #252939 !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

.product-image-text-copy p {
  margin: 0 !important;
  color: #5f6678 !important;
  font-size: 13px !important;
  line-height: 1.85 !important;
}

.product-image-text-block img {
  display: block !important;
  width: 100% !important;
  max-height: 320px !important;
  border-radius: 12px !important;
  object-fit: contain !important;
}

@media (max-width: 900px) {
  .product-detail-card {
    padding: 24px 18px 32px !important;
  }

  .product-detail-block {
    padding-top: 30px !important;
    padding-bottom: 36px !important;
  }

  .product-detail-block h2 {
    font-size: 23px !important;
  }

  .product-feature-grid,
  .product-feature-grid.single-card,
  .product-image-text-block,
  .product-image-text-block.image-left {
    grid-template-columns: 1fr !important;
  }

  .product-feature-card,
  .product-feature-grid.single-card .product-feature-card {
    min-height: 0 !important;
    padding: 26px 22px !important;
  }

  .product-image-text-block,
  .product-image-text-block.image-top {
    gap: 22px !important;
    padding: 26px 22px !important;
    text-align: center !important;
  }

  .product-image-text-block.image-left .product-image-text-copy,
  .product-image-text-block.image-left img {
    order: initial !important;
  }
}

.product-detail-page {
  min-height: 100vh;
  background: #f6f6f7;
  padding: 32px 0 0;
}

.product-detail-layout.container {
  display: grid;
  grid-template-columns: 112px minmax(0, 900px);
  align-items: start;
  justify-content: center;
  gap: 26px;
  max-width: 1080px;
  padding-bottom: 70px;
}

.product-detail-category-nav {
  gap: 11px;
  padding-top: 0;
}

.product-detail-category-nav a {
  height: 30px;
  border-color: #9aa4d9;
  border-radius: 999px;
  padding: 0 12px;
  color: #263047;
  font-size: 13px;
  line-height: 28px;
}

.product-detail-category-nav a.active {
  border-color: var(--color-primary-border);
  background: var(--color-primary-surface);
  color: var(--color-on-primary);
  box-shadow: 0 6px 14px rgba(var(--color-primary-rgb), 0.18);
}

.product-detail-hero-card {
  display: grid;
  grid-template-columns: 70px 382px minmax(0, 1fr);
  gap: 20px;
  min-height: 322px;
  margin-bottom: 18px;
  border-radius: 11px;
  background: #fff;
  box-shadow: 0 8px 26px rgb(30 42 80 / 7%);
  padding: 22px 24px;
}

.product-detail-thumbs {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 9px;
  width: 70px;
}

.product-detail-thumbs button {
  width: 58px;
  height: 58px;
  border: 1px solid #d7dcef;
  border-radius: 8px;
  background: #fff;
  padding: 4px;
  cursor: pointer;
}

.product-detail-thumbs button.active {
  border: 2px solid var(--color-primary-border);
  box-shadow: 0 4px 12px rgba(var(--color-primary-rgb), 0.18);
}

.product-detail-thumbs img {
  width: 100%;
  height: 100%;
  border-radius: 5px;
  object-fit: cover;
}

.product-detail-thumbs .product-thumb-arrow {
  width: 58px;
  height: 14px;
  border: 0;
  background: transparent;
  padding: 0;
  color: var(--color-primary-ink);
  font-size: 13px;
  line-height: 14px;
}

.product-detail-main-image {
  overflow: hidden;
  align-self: center;
  width: 382px;
  height: 270px;
  border-radius: 8px;
  background: #eef0f5;
}

.product-detail-main-image img,
.product-detail-main-image .product-card-placeholder {
  width: 100%;
  height: 100%;
  border-radius: 8px;
  object-fit: cover;
}

.product-detail-summary {
  padding: 14px 2px 8px 10px;
}

.product-detail-summary h1 {
  margin: 0 0 18px;
  color: #20243a;
  font-size: 19px;
  font-weight: 700;
  line-height: 1.55;
}

.product-summary-text {
  margin: -8px 0 14px;
  color: #5e6678;
  font-size: 13px;
  line-height: 1.75;
}

.product-top-params {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 8px 10px;
  margin: 0;
  color: #4b5265;
  font-size: 12px;
  line-height: 1.6;
}

.product-top-params dt {
  font-weight: 700;
}

.product-top-params dd {
  margin: 0;
}

.product-detail-consult-button {
  min-width: 104px;
  height: 42px;
  margin-top: 54px;
  border-radius: 10px;
  padding: 0 26px;
  color: var(--color-primary-ink);
  font-size: 13px;
  font-weight: 700;
  line-height: 40px;
}

.product-detail-card {
  margin-bottom: 18px;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 24px rgb(30 42 80 / 5%);
  padding: 28px 42px 38px;
}

.product-detail-card h2 {
  margin: 0 0 24px;
  border-bottom: 1px solid #e4e7ef;
  padding-bottom: 14px;
  color: #23273a;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  text-align: left;
}

.product-detail-param-table {
  max-width: 760px;
  margin: 0 auto;
}

.product-detail-param-row {
  display: grid;
  grid-template-columns: 116px minmax(0, 1fr) 116px minmax(0, 1fr);
  min-height: 38px;
  border-bottom: 1px solid #edf0f5;
  color: #2f3548;
  font-size: 12px;
  line-height: 1.55;
}

.product-detail-param-row strong,
.product-detail-param-row span {
  display: flex;
  align-items: center;
  min-width: 0;
  padding: 8px 10px;
}

.product-detail-block {
  padding-top: 32px;
  text-align: center;
}

.product-detail-block h2 {
  border-bottom: 0;
  margin-bottom: 26px;
  padding-bottom: 0;
  font-size: 25px;
  line-height: 1.35;
  text-align: center;
}

.product-detail-block-desc {
  max-width: 680px;
  margin: -10px auto 26px;
  color: #626a7d;
  font-size: 14px;
  line-height: 1.9;
}

.product-feature-grid {
  grid-template-columns: repeat(2, 260px);
  justify-content: center;
  gap: 24px;
}

.product-feature-card {
  min-height: 176px;
  border-radius: 12px;
  background: #f4f4f6;
  padding: 26px 28px;
}

.product-feature-card img {
  width: 42px;
  height: 42px;
  margin-bottom: 12px;
  object-fit: contain;
}

.product-image-text-block {
  max-width: 660px;
  margin: 0 auto;
  border-radius: 12px;
  background: #f3f3f5;
  padding: 28px 34px;
  text-align: left;
}

.product-image-gallery-block {
  max-width: 660px;
  grid-template-columns: 1fr;
  gap: 18px;
  margin: 0 auto;
}

.product-image-gallery-block img {
  width: 100%;
  border-radius: 12px;
  background: #f3f3f5;
  object-fit: cover;
}

/* 产品详情页最终复刻覆盖：最后一批桌面规则之后生效 */
.product-detail-content-card.product-detail-card {
  width: 100% !important;
  max-width: 900px !important;
  margin: 0 0 18px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: 0 8px 24px rgb(30 42 80 / 5%) !important;
  padding: 28px 44px 58px !important;
}

.product-detail-content-card > .product-detail-table-section {
  max-width: 760px !important;
  margin: 0 auto 58px !important;
}

.product-detail-content-card > .product-detail-table-section > h2 {
  margin: 0 0 24px !important;
  border-bottom: 1px solid #e5e8f0 !important;
  padding-bottom: 14px !important;
  color: #252939 !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  text-align: left !important;
}

.product-detail-content-card .product-detail-param-table {
  width: 100% !important;
  max-width: 760px !important;
  margin: 0 auto !important;
}

.product-detail-content-card .product-detail-param-row {
  display: grid !important;
  grid-template-columns: 116px minmax(0, 1fr) 116px minmax(0, 1fr) !important;
  min-height: 38px !important;
  border-bottom: 1px solid #edf0f5 !important;
  color: #2f3548 !important;
  font-size: 12px !important;
  line-height: 1.55 !important;
}

.product-detail-content-card .product-detail-param-row strong,
.product-detail-content-card .product-detail-param-row span {
  display: flex !important;
  align-items: center !important;
  min-width: 0 !important;
  padding: 8px 10px !important;
  overflow-wrap: anywhere !important;
}

.product-detail-content-card > .product-detail-block {
  max-width: 760px !important;
  margin: 0 auto 62px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  text-align: center !important;
}

.product-detail-content-card > .product-detail-block:last-child {
  margin-bottom: 0 !important;
}

.product-detail-content-card > .product-detail-block > h2 {
  max-width: 760px !important;
  margin: 0 auto 28px !important;
  border: 0 !important;
  padding: 0 !important;
  color: #252939 !important;
  font-size: 28px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  text-align: center !important;
}

.product-detail-content-card .product-detail-block-desc {
  max-width: 620px !important;
  margin: -12px auto 30px !important;
  color: #626a7d !important;
  font-size: 13px !important;
  line-height: 1.85 !important;
  text-align: center !important;
}

.product-detail-content-card .product-paragraph-block {
  max-width: 660px !important;
  margin: 0 auto !important;
  color: #51596d !important;
  font-size: 13px !important;
  line-height: 1.9 !important;
  text-align: center !important;
}

.product-detail-content-card .product-feature-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 260px) !important;
  justify-content: center !important;
  align-items: stretch !important;
  gap: 24px !important;
  max-width: 560px !important;
  margin: 0 auto !important;
}

.product-detail-content-card .product-feature-grid.single-card {
  grid-template-columns: 260px !important;
  max-width: 260px !important;
}

.product-detail-content-card .product-feature-card,
.product-detail-content-card .product-feature-grid.single-card .product-feature-card {
  display: flex !important;
  min-height: 176px !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: #f4f4f6 !important;
  box-shadow: none !important;
  padding: 26px 26px 28px !important;
}

.product-detail-content-card .product-feature-card img,
.product-detail-content-card .product-feature-grid.single-card .product-feature-card img {
  display: block !important;
  width: 48px !important;
  height: 48px !important;
  margin: 0 auto 14px !important;
  border-radius: 8px !important;
  object-fit: contain !important;
}

.product-detail-content-card .product-feature-card h3 {
  max-width: 200px !important;
  margin: 0 0 8px !important;
  color: #252939 !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  text-align: center !important;
}

.product-detail-content-card .product-feature-card p {
  max-width: 200px !important;
  margin: 0 !important;
  color: #60687a !important;
  font-size: 11px !important;
  line-height: 1.75 !important;
  text-align: center !important;
}

.product-detail-content-card .product-image-text-block {
  display: grid !important;
  max-width: 660px !important;
  grid-template-columns: minmax(0, 0.78fr) minmax(220px, 1.22fr) !important;
  align-items: center !important;
  gap: 34px !important;
  margin: 0 auto !important;
  border-radius: 12px !important;
  background: #f4f4f6 !important;
  padding: 34px 38px !important;
  text-align: left !important;
}

.product-detail-content-card .product-image-text-block.image-left {
  grid-template-columns: minmax(220px, 1.22fr) minmax(0, 0.78fr) !important;
}

.product-detail-content-card .product-image-text-block.image-left .product-image-text-copy {
  order: 2 !important;
}

.product-detail-content-card .product-image-text-block.image-left img {
  order: 1 !important;
}

.product-detail-content-card .product-image-text-block.image-top {
  grid-template-columns: 1fr !important;
  text-align: center !important;
}

.product-detail-content-card .product-image-text-copy h3 {
  margin: 0 0 12px !important;
  color: #252939 !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

.product-detail-content-card .product-image-text-copy p {
  margin: 0 !important;
  color: #5f6678 !important;
  font-size: 13px !important;
  line-height: 1.85 !important;
}

.product-detail-content-card .product-image-text-block img {
  display: block !important;
  width: 100% !important;
  max-height: 300px !important;
  border-radius: 10px !important;
  object-fit: contain !important;
}

.product-detail-content-card .product-image-gallery-block {
  display: grid !important;
  max-width: 660px !important;
  grid-template-columns: 1fr !important;
  gap: 18px !important;
  margin: 0 auto !important;
}

.product-detail-content-card .product-image-gallery-block img {
  display: block !important;
  width: 100% !important;
  border-radius: 12px !important;
  background: #f4f4f6 !important;
  object-fit: contain !important;
}

@media (max-width: 900px) {
  .product-detail-content-card.product-detail-card {
    padding: 24px 18px 36px !important;
  }

  .product-detail-content-card .product-detail-param-row {
    grid-template-columns: 96px minmax(0, 1fr) !important;
  }

  .product-detail-content-card > .product-detail-block {
    margin-bottom: 44px !important;
  }

  .product-detail-content-card > .product-detail-block > h2 {
    font-size: 23px !important;
  }

  .product-detail-content-card .product-feature-grid,
  .product-detail-content-card .product-feature-grid.single-card,
  .product-detail-content-card .product-image-text-block,
  .product-detail-content-card .product-image-text-block.image-left {
    grid-template-columns: 1fr !important;
    max-width: 100% !important;
  }

  .product-detail-content-card .product-image-text-block,
  .product-detail-content-card .product-image-text-block.image-top {
    gap: 22px !important;
    padding: 26px 22px !important;
    text-align: center !important;
  }

  .product-detail-content-card .product-image-text-block.image-left .product-image-text-copy,
  .product-detail-content-card .product-image-text-block.image-left img {
    order: initial !important;
  }

  .product-detail-layout.container {
    grid-template-columns: 1fr;
    gap: 20px;
    padding-right: 18px;
    padding-left: 18px;
  }

  .product-detail-category-nav {
    flex-direction: row;
    overflow-x: auto;
  }

  .product-detail-hero-card {
    grid-template-columns: 1fr;
    padding: 20px;
  }

  .product-detail-thumbs {
    flex-direction: row;
    width: 100%;
    overflow-x: auto;
  }

  .product-detail-main-image {
    width: 100%;
  }

  .product-detail-card {
    padding: 24px 18px 30px;
  }

  .product-detail-param-row {
    grid-template-columns: 96px minmax(0, 1fr);
  }

  .product-feature-grid {
    grid-template-columns: 1fr;
  }

  .product-image-text-block {
    grid-template-columns: 1fr;
    padding: 24px;
  }
}

/* 产品详情亮点卡片最终规则：只展示一张时让配图成为视觉主体。 */
.product-detail-content-card .product-feature-grid.single-card {
  grid-template-columns: minmax(0, 660px) !important;
  max-width: 660px !important;
}

.product-detail-content-card .product-feature-grid.single-card .product-feature-card {
  display: grid !important;
  grid-template-columns: minmax(0, 0.78fr) minmax(220px, 1.22fr) !important;
  grid-template-rows: auto auto !important;
  column-gap: 34px !important;
  align-items: center !important;
  min-height: 300px !important;
  padding: 34px 38px !important;
  text-align: left !important;
}

.product-detail-content-card .product-feature-grid.single-card .product-feature-card img {
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  width: 100% !important;
  height: 260px !important;
  margin: 0 !important;
  border-radius: 10px !important;
  background: #fff !important;
  object-fit: contain !important;
}

.product-feature-grid.single-card .product-feature-card img,
.product-detail-card .product-feature-grid.single-card .product-feature-card img,
.product-detail-block.is-single-feature .product-feature-card img {
  width: 100% !important;
  height: 260px !important;
  max-width: 100% !important;
  margin: 0 !important;
  border-radius: 10px !important;
  background: #fff !important;
  object-fit: contain !important;
}

.product-detail-content-card .product-feature-grid.single-card .product-feature-card h3 {
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-self: end !important;
  max-width: 220px !important;
  margin: 0 0 10px !important;
  font-size: 26px !important;
  line-height: 1.25 !important;
  text-align: left !important;
}

.product-detail-content-card .product-feature-grid.single-card .product-feature-card p {
  grid-column: 1 !important;
  grid-row: 2 !important;
  align-self: start !important;
  max-width: 220px !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
  text-align: left !important;
}

/* 文字模块保留后台输入的换行，并按正文方式左对齐。 */
.product-detail-content-card .product-paragraph-block p {
  margin: 0;
  white-space: pre-line;
  overflow-wrap: anywhere;
  text-align: left;
}

/* 纯图模块与文字正文等宽，图片直接铺满并保持原始比例。 */
.product-detail-content-card .product-full-image-block {
  width: 100%;
  max-width: 660px;
  margin: 0 auto;
}

.product-detail-content-card .product-full-image-block img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  object-fit: contain;
}

/* 产品封面以 1:1 原图比例展示，完整保留画面而不裁切。 */
.product-card img,
.product-card-placeholder {
  aspect-ratio: 1 / 1;
  object-fit: contain;
  background: #f4f5f8;
}

.product-detail-main-image {
  width: min(382px, 100%);
  height: auto;
  aspect-ratio: 1 / 1;
  background: #f4f5f8;
}

.product-detail-main-image img,
.product-detail-main-image .product-card-placeholder,
.product-detail-thumbs img {
  object-fit: contain;
  background: #f4f5f8;
}

/* Homepage image mode: preserve uploaded aspect ratios without seams or overflow. */
.image-only-home {
  width: 100%;
  overflow-x: hidden;
  line-height: 0;
}

.image-only-home__item,
.image-only-home__media,
.image-only-home__picture,
.image-only-home__image {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
}

.image-only-home__image {
  max-width: 100%;
  height: auto;
}

@media (min-width: 376px) and (max-width: 768px) {
  .website-layout:has(.image-only-home),
  .site-main:has(.image-only-home) {
    max-width: none;
  }
}

.image-only-home__media[href]:focus-visible {
  outline: 3px solid var(--color-primary-focus);
  outline-offset: -3px;
  box-shadow: inset 0 0 0 5px var(--color-white);
}

@media (min-width: 769px) and (max-width: 1024px) {
  .certificate-slider:not(.is-static) {
    width: calc(100% - 104px);
  }

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

  .certificate-track.is-static {
    grid-template-columns: repeat(auto-fit, minmax(200px, 230px));
  }

  .certificate-arrow-prev {
    left: -46px;
  }

  .certificate-arrow-next {
    right: -46px;
  }
}

@media (min-width: 1025px) and (max-width: 1200px) {
  .certificate-slider:not(.is-static) {
    width: calc(100% - 112px);
  }

  .certificate-arrow-prev {
    left: -50px;
  }

  .certificate-arrow-next {
    right: -50px;
  }
}

@media (max-width: 768px) {
  .home-certificates {
    max-width: none;
    padding: 24px 14px 30px;
  }

  .home-certificates > h2 {
    font-size: 19px;
  }

  .certificate-slider {
    margin-top: 18px;
  }

  .certificate-slider:not(.is-static) {
    width: calc(100% - 72px);
  }

  .certificate-arrow-prev {
    left: -34px;
  }

  .certificate-arrow-next {
    right: -34px;
  }

  .certificate-track {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .certificate-track.is-static {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .certificate-card {
    padding: 6px 6px 10px;
  }

  .certificate-card h3 {
    margin-top: 8px;
    font-size: 12px;
  }

  .certificate-arrow {
    width: 28px;
    height: 42px;
  }

  .certificate-arrow svg {
    width: 18px;
    height: 18px;
  }
}

@media (max-width: 600px) {
  .certificate-track:not(.is-static) {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (prefers-reduced-motion: reduce) {
  .certificate-arrow {
    transition: none;
  }
}

/* 服务页自定义模块：支持整图以及左右交替的图文行。 */
.service-custom-modules {
  margin: 54px 0 64px;
}

.service-custom-module + .service-custom-module {
  margin-top: 64px;
}

.service-custom-module-title {
  margin: 0 0 30px;
  color: #202536;
  font-size: clamp(24px, 3vw, 32px);
  line-height: 1.35;
  font-weight: 700;
  text-align: center;
  overflow-wrap: anywhere;
}

.service-custom-module-rows {
  width: min(100%, 1040px);
  margin: 0 auto;
  display: grid;
  gap: 32px;
}

.service-custom-module-row {
  min-height: 300px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  overflow: hidden;
  border-radius: 4px;
  background: #fff;
  box-shadow: 0 12px 34px rgba(31, 42, 68, 0.06);
}

.service-custom-module-row--image-right .service-custom-module-row-image-wrap {
  grid-column: 2;
  grid-row: 1;
}

.service-custom-module-row--image-right .service-custom-module-row-copy {
  grid-column: 1;
  grid-row: 1;
}

.service-custom-module-row--without-image {
  grid-template-columns: 1fr;
}

.service-custom-module-row-image-wrap {
  min-height: 300px;
  overflow: hidden;
  background: #eef2f7;
}

.service-custom-module-row-image {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 300px;
  object-fit: cover;
}

.service-custom-module-row-copy {
  min-width: 0;
  padding: clamp(32px, 5vw, 58px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}

.service-custom-module-row-copy h3 {
  margin: 0;
  color: #242936;
  font-size: clamp(21px, 2.5vw, 27px);
  line-height: 1.4;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.service-custom-module-row-copy p {
  margin: 14px 0 0;
  color: #626a79;
  font-size: 16px;
  line-height: 1.9;
  white-space: pre-line;
  overflow-wrap: anywhere;
}

.service-custom-module-figure {
  width: min(100%, 1040px);
  margin: 0 auto;
}

.service-custom-module-full-image {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 4px;
  object-fit: contain;
  box-shadow: 0 12px 34px rgba(31, 42, 68, 0.06);
}

@media (max-width: 768px) {
  .service-custom-modules {
    margin: 40px 0 48px;
  }

  .service-custom-module + .service-custom-module {
    margin-top: 48px;
  }

  .service-custom-module-title {
    margin-bottom: 22px;
  }

  .service-custom-module-rows {
    gap: 22px;
  }

  .service-custom-module-row,
  .service-custom-module-row--image-right {
    min-height: 0;
    grid-template-columns: 1fr;
  }

  .service-custom-module-row .service-custom-module-row-image-wrap,
  .service-custom-module-row--image-right .service-custom-module-row-image-wrap {
    grid-column: 1;
    grid-row: 1;
    min-height: 0;
    aspect-ratio: 16 / 9;
  }

  .service-custom-module-row .service-custom-module-row-copy,
  .service-custom-module-row--image-right .service-custom-module-row-copy {
    grid-column: 1;
    grid-row: 2;
    padding: 28px 24px 32px;
  }

  .service-custom-module-row-image {
    min-height: 0;
  }

  .service-custom-module-row-copy p {
    font-size: 15px;
    line-height: 1.8;
  }
}

/* 首页 SEO 正文：仅标准首页展示的可见语义内容。 */
.home-seo-content {
  padding-top: clamp(48px, 7vw, 80px);
  padding-bottom: clamp(48px, 7vw, 80px);
  background: var(--color-bg);
}

.home-seo-content-inner {
  width: min(100% - 40px, var(--container-width));
  margin: 0 auto;
}

.home-seo-content h2,
.home-seo-content h3,
.home-seo-content h4,
.home-seo-content p {
  overflow-wrap: anywhere;
}

.home-seo-content h2 {
  margin: 0;
  color: var(--color-text);
  font-size: clamp(26px, 3vw, 36px);
  line-height: 1.35;
  text-align: center;
}

.home-seo-intro {
  width: min(100%, 880px);
  margin: 24px auto 0;
}

.home-seo-intro p,
.home-seo-card p {
  margin: 0;
  color: var(--color-text-secondary);
  font-size: 16px;
  line-height: 1.85;
}

.home-seo-intro p + p {
  margin-top: 12px;
}

.home-seo-group {
  margin-top: 42px;
}

.home-seo-group h3 {
  margin: 0 0 20px;
  color: var(--color-text);
  font-size: clamp(21px, 2.4vw, 27px);
  line-height: 1.4;
  text-align: center;
}

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

.home-seo-card {
  min-width: 0;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 24px;
  background: var(--color-white);
  box-shadow: var(--shadow-card);
}

.home-seo-card .home-seo-card-title {
  margin: 0 0 10px;
  color: var(--color-text);
  font-size: 18px;
  line-height: 1.5;
}

.home-seo-card .home-seo-case-metric {
  margin-bottom: 8px;
  color: var(--color-primary-ink);
  font-size: 20px;
  font-weight: 700;
}

/* 详情页可见面包屑与上下文导航。 */
.detail-breadcrumbs {
  margin: 0 0 24px;
  color: var(--color-text-secondary);
  font-size: 14px;
}

.detail-breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.detail-breadcrumbs li {
  display: inline-flex;
  align-items: center;
  min-width: 0;
}

.detail-breadcrumbs li + li::before {
  content: "/";
  margin-right: 8px;
  color: var(--color-text-muted);
}

.detail-breadcrumbs a {
  color: var(--color-primary-ink);
  text-decoration: none;
}

.detail-breadcrumbs a:hover,
.detail-breadcrumbs a:focus-visible {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.detail-breadcrumbs [aria-current="page"] {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product-detail-page > .container > .detail-breadcrumbs {
  width: min(100%, 1080px);
  margin-right: auto;
  margin-left: auto;
}

.detail-context-links {
  margin-top: 32px;
  border-top: 1px solid var(--color-border);
  padding-top: 24px;
}

.detail-context-links h2 {
  margin: 0 0 16px;
  color: var(--color-text);
  font-size: 20px;
  line-height: 1.4;
}

.detail-context-links nav {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.detail-context-links a {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-full);
  padding: 8px 16px;
  background: var(--color-white);
  color: var(--color-primary-ink);
  line-height: 1.45;
  text-decoration: none;
}

.detail-context-links a:hover,
.detail-context-links a:focus-visible {
  border-color: var(--color-primary-ink);
  background: var(--color-primary-soft);
}

@media (max-width: 768px) {
  .home-seo-content-inner {
    width: min(100% - 28px, var(--container-width));
  }

  .home-seo-grid {
    grid-template-columns: 1fr;
  }

  .home-seo-card {
    padding: 20px;
  }

  .detail-breadcrumbs {
    margin-bottom: 18px;
  }

  .detail-context-links nav {
    display: grid;
    grid-template-columns: 1fr;
  }

  .detail-context-links a {
    width: 100%;
  }
}

/* 企业区域主题：变量仅由固定白名单生成，未配置时保留模板默认值。 */
.site-header[data-theme-region="navbar"] {
  background: var(--region-navbar-background, var(--color-white));
  color: var(--region-navbar-text, var(--color-text));
}

.site-header .brand-name,
.site-header .main-nav a {
  color: var(--region-navbar-text, #262b38);
}

.site-header .main-nav a:hover,
.site-header .main-nav a.router-link-active {
  color: var(--region-navbar-accent, var(--color-primary-ink));
}

.home-hero[data-theme-region="home.hero"] {
  background: var(
    --region-home-hero-background,
    radial-gradient(circle at 88% 36%, rgba(0, 214, 172, 0.62), transparent 42%),
    radial-gradient(circle at 8% 16%, rgba(61, 177, 255, 0.58), transparent 46%),
    linear-gradient(128deg, #dff1ff 0%, #87e9ed 48%, #28dfad 100%)
  );
  color: var(--region-home-hero-text, #252939);
}

.home-hero .home-hero-title {
  color: var(--region-home-hero-text, #12182b);
}

.home-hero .home-hero-subtitle {
  color: var(--region-home-hero-text, #2d3548);
}

.home-services[data-theme-region="home.services"] {
  background: var(--region-home-services-background, transparent);
  color: var(--region-home-services-text, inherit);
}

.home-services .home-service-head > h2 {
  color: var(--region-home-services-text, #1f2434);
}

.home-services[data-theme-region="home.services"] > .home-empty {
  background: var(--region-home-services-background, #fff);
  color: var(--region-home-services-text, var(--color-text-muted));
}

.home-about[data-theme-region="home.about"] {
  background: var(--region-home-about-background, transparent);
  color: var(--region-home-about-text, inherit);
}

.home-about .home-about-content h2 {
  color: var(--region-home-about-text, #1f2434);
}

.home-about .home-about-content p {
  color: var(--region-home-about-text, #394052);
}

.home-about.has-background .home-about-content h2 {
  color: var(--region-home-about-text, #fff);
}

.home-about.has-background .home-about-content p {
  color: var(--region-home-about-text, rgba(255, 255, 255, 0.94));
}

.home-seo-content[data-theme-region="home.seo"] {
  background: var(--region-home-seo-background, var(--color-bg));
  color: var(--region-home-seo-text, inherit);
}

.home-seo-content > .home-seo-content-inner > h2,
.home-seo-content .home-seo-group > h3 {
  color: var(--region-home-seo-text, var(--color-text));
}

.home-seo-content .home-seo-intro > p {
  color: var(--region-home-seo-text, var(--color-text-secondary));
}

.home-certificates[data-theme-region="home.certificates"] {
  background: var(--region-home-certificates-background, #f8f8fc);
  color: var(--region-home-certificates-text, inherit);
}

.home-certificates > h2 {
  color: var(--region-home-certificates-text, #1f2434);
}

.home-news[data-theme-region="home.news"] {
  background: var(--region-home-news-background, #f8f8fc);
  color: var(--region-home-news-text, inherit);
}

.home-news > .home-section-head > h2 {
  color: var(--region-home-news-text, #1f2434);
}

.home-news > .home-section-head > a {
  color: var(--region-home-news-text, var(--color-primary-ink));
}

.home-news[data-theme-region="home.news"] > .home-empty {
  background: var(--region-home-news-background, #fff);
  color: var(--region-home-news-text, var(--color-text-muted));
}

.home-faq[data-theme-region="home.faq"] {
  background: var(--region-home-faq-background, transparent);
  color: var(--region-home-faq-text, inherit);
}

.home-faq > .home-section-head > h2 {
  color: var(--region-home-faq-text, #1f2434);
}

.home-faq > .home-section-head > a {
  color: var(--region-home-faq-text, var(--color-primary-ink));
}

.home-faq[data-theme-region="home.faq"] > .home-empty {
  background: var(--region-home-faq-background, #fff);
  color: var(--region-home-faq-text, var(--color-text-muted));
}

.service-overview-theme-region[data-theme-region="services.overview"] {
  background: var(--region-services-overview-background, transparent);
  color: var(--region-services-overview-text, inherit);
}

.service-overview-theme-region[data-theme-region="services.overview"] > h1 {
  color: var(--region-services-overview-text, #202536);
}

.service-overview-theme-region[data-theme-region="services.overview"] > .empty {
  color: var(--region-services-overview-text, var(--color-text-muted));
}

.service-custom-theme-region[data-theme-region="services.custom"] {
  background: var(--region-services-custom-background, transparent);
  color: var(--region-services-custom-text, inherit);
}

.service-custom-theme-region .service-custom-module-title {
  color: var(--region-services-custom-text, #202536);
}

.service-process[data-theme-region="services.process"] {
  background: var(--region-services-process-background, transparent);
  color: var(--region-services-process-text, inherit);
}

.service-process[data-theme-region="services.process"] > h2 {
  color: var(--region-services-process-text, #202536);
}

.service-process[data-theme-region="services.process"] .service-process-text > strong {
  color: var(--region-services-process-text, #202536);
}

.service-process[data-theme-region="services.process"] .service-process-text > small {
  color: var(--region-services-process-text, #4f5664);
}

.service-detail-cta[data-theme-region="services.cta"] {
  background: var(
    --region-services-cta-background,
    linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-active) 100%)
  );
  color: var(--region-services-cta-text, var(--color-on-primary));
}

.service-detail-cta[data-theme-region="services.cta"] > p {
  color: var(--region-services-cta-text, var(--color-on-primary));
}

.about-page-intro[data-theme-region="contact.intro"] {
  background: var(--region-contact-intro-background, var(--about-page-background));
  color: var(--region-contact-intro-text, inherit);
}

.about-page-intro-content > h1 {
  color: var(--region-contact-intro-text, #202536);
}

.about-page-intro-content > span {
  color: var(--region-contact-intro-text, #7c8496);
}

.about-page-intro-content > p {
  color: var(--region-contact-intro-text, #394052);
}

.about-page-features[data-theme-region="contact.features"] {
  background: var(--region-contact-features-background, var(--color-white));
  color: var(--region-contact-features-text, inherit);
}

.about-page-features > h2 {
  color: var(--region-contact-features-text, #202536);
}

.about-page-team-theme-region[data-theme-region="contact.team"] {
  background: var(--region-contact-team-background, #fff);
  color: var(--region-contact-team-text, inherit);
}

.about-page-team-theme-region .team-member-heading-wrap > h2 {
  color: var(--region-contact-team-text, var(--color-primary-ink));
}

.contact-panel[data-theme-region="contact.details"] {
  background: var(--region-contact-details-background, transparent);
  color: var(--region-contact-details-text, inherit);
}

.contact-panel[data-theme-region="contact.details"] h2 {
  color: var(--region-contact-details-text, #202536);
}

.contact-panel[data-theme-region="contact.details"] .contact-line,
.contact-panel[data-theme-region="contact.details"] .contact-line a {
  color: var(--region-contact-details-text, #4b5262);
}

.faq-page[data-theme-region="faq.main"] {
  background: var(--region-faq-main-background, transparent);
  color: var(--region-faq-main-text, inherit);
}

.faq-page > .container > .faq-page-title {
  color: var(--region-faq-main-text, inherit);
}

.faq-page[data-theme-region="faq.main"] .empty {
  color: var(--region-faq-main-text, var(--color-text-muted));
}

.product-page[data-theme-region="products.list"] {
  background: var(--region-products-list-background, #f6f7fb);
  color: var(--region-products-list-text, inherit);
}

.product-page > .page-title > h1 {
  color: var(--region-products-list-text, #111827);
}

.product-page > .page-title > p {
  color: var(--region-products-list-text, #666);
}

.product-detail-page[data-theme-region="products.detail"] {
  background: var(--region-products-detail-background, #f6f6f7);
  color: var(--region-products-detail-text, inherit);
}

.product-detail-page[data-theme-region="products.detail"] .product-detail-canvas {
  color: var(--region-products-detail-text, inherit);
}

.product-detail-page[data-theme-region="products.detail"] .detail-breadcrumbs {
  color: var(--region-products-detail-text, var(--color-text-secondary));
}

.product-detail-page[data-theme-region="products.detail"] .detail-breadcrumbs li + li::before {
  color: var(--region-products-detail-text, var(--color-text-muted));
}

.product-detail-page[data-theme-region="products.detail"] .detail-breadcrumbs a {
  color: var(--region-products-detail-text, var(--color-primary-ink));
}

.article-index-page[data-theme-region="articles.list"] {
  background: var(--region-articles-list-background, transparent);
  color: var(--region-articles-list-text, inherit);
}

.article-index-page > .container > .article-index-title {
  color: var(--region-articles-list-text, inherit);
}

.article-index-page[data-theme-region="articles.list"] .empty {
  color: var(--region-articles-list-text, var(--color-text-muted));
}

.article-detail[data-theme-region="articles.detail"] {
  background: var(--region-articles-detail-background, transparent);
  color: var(--region-articles-detail-text, inherit);
}

.article-detail .article-header > h1 {
  color: var(--region-articles-detail-text, var(--color-text));
}

.article-detail .article-body {
  color: var(--region-articles-detail-text, #1f2937);
}

.article-detail[data-theme-region="articles.detail"] .detail-breadcrumbs {
  color: var(--region-articles-detail-text, var(--color-text-secondary));
}

.article-detail[data-theme-region="articles.detail"] .detail-breadcrumbs li + li::before {
  color: var(--region-articles-detail-text, var(--color-text-muted));
}

.article-detail[data-theme-region="articles.detail"] .detail-breadcrumbs a {
  color: var(--region-articles-detail-text, var(--color-primary-ink));
}

@media (max-width: 768px) {
  .site-header[data-theme-region="navbar"] .main-nav {
    background: var(--region-navbar-background, #f6f7fb);
  }

  .site-header .main-nav a:hover,
  .site-header .main-nav a.router-link-active {
    background: var(--color-primary-surface);
    color: var(--color-on-primary);
  }
}