.wx-content,
.wx-solution,
.db-product-detail,
.ai-product-detail,
.ai-content-block,
.product-optimized-content,
.ai-blog-guide,
.ai-case-story,
.ai-hotkey-entry {
  --ai-accent: var(--site-theme-color, #0064c8);
  --ai-accent-rgb: var(--site-theme-rgb, 0, 100, 200);
  --ai-ink: #172b45;
  --ai-copy: #455b73;
  --ai-muted: #6b7d90;
  --ai-line: #dce5ee;
  --ai-soft: #f5f8fb;
  --ai-note: #eef7f3;
  width: 100%;
  max-width: 100%;
  color: var(--ai-copy);
  font-size: 16px;
  line-height: 1.78;
  overflow-wrap: anywhere;
}

.wx-content *,
.wx-solution *,
.db-product-detail *,
.ai-product-detail *,
.ai-content-block *,
.product-optimized-content *,
.ai-blog-guide *,
.ai-case-story *,
.ai-hotkey-entry * {
  box-sizing: border-box;
}

.wx-content .wx-section,
.wx-content .db-section,
.wx-content .ai-section,
.wx-solution .wx-solution-hero,
.wx-solution .wx-solution-card,
.db-product-detail > section,
.ai-product-detail > section,
.ai-content-block > section,
.product-optimized-content > section,
.ai-blog-guide > section,
.ai-case-story > section,
.ai-hotkey-entry > section {
  margin: 0 0 24px;
  padding: 24px 0;
  border: 0;
  border-bottom: 1px solid var(--ai-line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.wx-content .wx-intro,
.wx-content .db-intro,
.wx-content .ai-intro,
.wx-solution .wx-solution-hero,
.db-product-detail > section:first-child,
.ai-product-detail > section:first-child,
.ai-content-block > section:first-child,
.product-optimized-content > section:first-child,
.ai-blog-guide > section:first-child,
.ai-case-story > section:first-child,
.ai-hotkey-entry > section:first-child {
  padding: 22px 24px;
  border-bottom: 0;
  border-left: 4px solid var(--ai-accent);
  border-radius: 6px;
  background: var(--ai-soft);
}

.wx-content h2,
.wx-solution h2,
.db-product-detail h2,
.ai-product-detail h2,
.ai-content-block h2,
.product-optimized-content h2,
.ai-blog-guide h2,
.ai-case-story h2,
.ai-hotkey-entry h2 {
  position: relative;
  margin: 34px 0 16px;
  padding: 0 0 12px;
  color: var(--ai-ink);
  font-size: 28px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0;
  border-bottom: 1px solid var(--ai-line);
}

.wx-content h2::after,
.wx-solution h2::after,
.db-product-detail h2::after,
.ai-product-detail h2::after,
.ai-content-block h2::after,
.product-optimized-content h2::after,
.ai-blog-guide h2::after,
.ai-case-story h2::after,
.ai-hotkey-entry h2::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 54px;
  height: 3px;
  background: var(--ai-accent);
}

.wx-content section > h2:first-child,
.wx-solution section > h2:first-child,
.db-product-detail section > h2:first-child,
.ai-product-detail section > h2:first-child,
.ai-content-block section > h2:first-child,
.product-optimized-content section > h2:first-child,
.ai-blog-guide section > h2:first-child,
.ai-case-story section > h2:first-child,
.ai-hotkey-entry section > h2:first-child {
  margin-top: 0;
}

.wx-content h3,
.wx-solution h3,
.db-product-detail h3,
.ai-product-detail h3,
.ai-content-block h3,
.product-optimized-content h3,
.ai-blog-guide h3,
.ai-case-story h3,
.ai-hotkey-entry h3 {
  margin: 26px 0 11px;
  color: var(--ai-ink);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0;
}

.wx-content p,
.wx-solution p,
.db-product-detail p,
.ai-product-detail p,
.ai-content-block p,
.product-optimized-content p,
.ai-blog-guide p,
.ai-case-story p,
.ai-hotkey-entry p {
  margin: 0 0 14px;
  color: var(--ai-copy);
  font-size: 16px;
  line-height: 1.78;
}

.wx-content ul,
.wx-content ol,
.wx-solution ul,
.wx-solution ol,
.db-product-detail ul,
.db-product-detail ol,
.ai-product-detail ul,
.ai-product-detail ol,
.ai-content-block ul,
.ai-content-block ol,
.product-optimized-content ul,
.product-optimized-content ol,
.ai-blog-guide ul,
.ai-blog-guide ol,
.ai-case-story ul,
.ai-case-story ol,
.ai-hotkey-entry ul,
.ai-hotkey-entry ol {
  margin: 12px 0 20px;
  padding-left: 24px;
}

.wx-content li,
.wx-solution li,
.db-product-detail li,
.ai-product-detail li,
.ai-content-block li,
.product-optimized-content li,
.ai-blog-guide li,
.ai-case-story li,
.ai-hotkey-entry li {
  margin: 7px 0;
  padding-left: 3px;
  color: var(--ai-copy);
}

.wx-content li::marker,
.wx-solution li::marker,
.db-product-detail li::marker,
.ai-product-detail li::marker,
.ai-content-block li::marker,
.product-optimized-content li::marker,
.ai-blog-guide li::marker,
.ai-case-story li::marker,
.ai-hotkey-entry li::marker {
  color: var(--ai-accent);
}

.wx-content a,
.wx-solution a,
.db-product-detail a,
.ai-product-detail a,
.ai-content-block a,
.product-optimized-content a,
.ai-blog-guide a,
.ai-case-story a,
.ai-hotkey-entry a {
  color: var(--ai-accent);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.wx-content img,
.wx-solution img,
.db-product-detail img,
.ai-product-detail img,
.ai-content-block img,
.product-optimized-content img,
.ai-blog-guide img,
.ai-case-story img,
.ai-hotkey-entry img {
  max-width: 100%;
  height: auto;
  border-radius: 6px;
}

.wx-content table,
.wx-solution table,
.db-product-detail table,
.ai-product-detail table,
.ai-content-block table,
.product-optimized-content table,
.ai-blog-guide table,
.ai-case-story table,
.ai-hotkey-entry table {
  width: 100%;
  margin: 18px 0 24px;
  border: 1px solid var(--ai-line);
  border-collapse: collapse;
  background: #fff;
}

.wx-content th,
.wx-solution th,
.db-product-detail th,
.ai-product-detail th,
.ai-content-block th,
.product-optimized-content th,
.ai-blog-guide th,
.ai-case-story th,
.ai-hotkey-entry th {
  padding: 12px 14px;
  border: 1px solid var(--ai-line);
  background: var(--ai-soft);
  color: var(--ai-ink);
  font-weight: 700;
  text-align: left;
}

.wx-content td,
.wx-solution td,
.db-product-detail td,
.ai-product-detail td,
.ai-content-block td,
.product-optimized-content td,
.ai-blog-guide td,
.ai-case-story td,
.ai-hotkey-entry td {
  padding: 12px 14px;
  border: 1px solid var(--ai-line);
  color: var(--ai-copy);
  vertical-align: top;
}

.wx-content blockquote,
.wx-solution blockquote,
.db-product-detail blockquote,
.ai-product-detail blockquote,
.ai-content-block blockquote,
.product-optimized-content blockquote,
.ai-blog-guide blockquote,
.ai-case-story blockquote,
.ai-hotkey-entry blockquote {
  margin: 20px 0;
  padding: 16px 20px;
  border-left: 4px solid #23836f;
  background: var(--ai-note);
  color: #315b52;
}

.wx-content details,
.wx-solution details,
.db-product-detail details,
.ai-product-detail details,
.ai-content-block details,
.product-optimized-content details,
.ai-blog-guide details,
.ai-case-story details,
.ai-hotkey-entry details {
  margin: 12px 0;
  padding: 14px 16px;
  border: 1px solid var(--ai-line);
  border-radius: 6px;
  background: #fff;
}

.wx-content summary,
.wx-solution summary,
.db-product-detail summary,
.ai-product-detail summary,
.ai-content-block summary,
.product-optimized-content summary,
.ai-blog-guide summary,
.ai-case-story summary,
.ai-hotkey-entry summary {
  color: var(--ai-ink);
  font-weight: 700;
  cursor: pointer;
}

.wx-content .cta,
.wx-content .ai-cta,
.wx-solution .cta,
.wx-solution .ai-cta,
.db-product-detail .cta,
.db-product-detail .ai-cta,
.ai-product-detail .cta,
.ai-product-detail .ai-cta,
.ai-content-block .cta,
.ai-content-block .ai-cta,
.product-optimized-content .cta,
.product-optimized-content .ai-cta,
.ai-blog-guide .cta,
.ai-blog-guide .ai-cta,
.ai-case-story .cta,
.ai-case-story .ai-cta,
.ai-hotkey-entry .cta,
.ai-hotkey-entry .ai-cta {
  margin: 26px 0 0;
  padding: 20px 22px;
  border-left: 4px solid var(--ai-accent);
  border-radius: 6px;
  background: var(--ai-soft);
}

@media (max-width: 768px) {
  .wx-content,
  .wx-solution,
  .db-product-detail,
  .ai-product-detail,
  .ai-content-block,
  .product-optimized-content,
  .ai-blog-guide,
  .ai-case-story,
  .ai-hotkey-entry {
    font-size: 15px;
  }

  .wx-content .wx-section,
  .wx-content .db-section,
  .wx-content .ai-section,
  .wx-solution .wx-solution-hero,
  .wx-solution .wx-solution-card,
  .db-product-detail > section,
  .ai-product-detail > section,
  .ai-content-block > section,
  .product-optimized-content > section,
  .ai-blog-guide > section,
  .ai-case-story > section,
  .ai-hotkey-entry > section {
    margin-bottom: 16px;
    padding: 18px 0;
  }

  .wx-content .wx-intro,
  .wx-content .db-intro,
  .wx-content .ai-intro,
  .wx-solution .wx-solution-hero,
  .db-product-detail > section:first-child,
  .ai-product-detail > section:first-child,
  .ai-content-block > section:first-child,
  .product-optimized-content > section:first-child,
  .ai-blog-guide > section:first-child,
  .ai-case-story > section:first-child,
  .ai-hotkey-entry > section:first-child {
    padding: 18px 16px;
  }

  .wx-content h2,
  .wx-solution h2,
  .db-product-detail h2,
  .ai-product-detail h2,
  .ai-content-block h2,
  .product-optimized-content h2,
  .ai-blog-guide h2,
  .ai-case-story h2,
  .ai-hotkey-entry h2 {
    margin-top: 26px;
    font-size: 23px;
  }

  .wx-content h3,
  .wx-solution h3,
  .db-product-detail h3,
  .ai-product-detail h3,
  .ai-content-block h3,
  .product-optimized-content h3,
  .ai-blog-guide h3,
  .ai-case-story h3,
  .ai-hotkey-entry h3 {
    font-size: 18px;
  }
}

/* Plain article bodies do not carry an AI wrapper class. Keep their typography
   inside the existing article content area so page layout remains unchanged. */
.bd-arcticle .arc-content.arc-iframe,
.bd-article .ar-body {
  --ai-accent: var(--site-theme-color, #0064c8);
  --ai-ink: #172b45;
  --ai-copy: #455b73;
  --ai-line: #dce5ee;
  --ai-soft: #f5f8fb;
  --ai-note: #eef7f3;
  color: var(--ai-copy);
  font-size: 16px;
  line-height: 1.78;
  overflow-wrap: anywhere;
}

:where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) * {
  box-sizing: border-box;
}

:where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) h2 {
  position: relative;
  margin: 34px 0 16px;
  padding: 0 0 12px;
  border-bottom: 1px solid var(--ai-line);
  color: var(--ai-ink);
  font-size: 28px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0;
}

:where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) h2::after {
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 54px;
  height: 3px;
  background: var(--ai-accent);
  content: "";
}

:where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) h2:first-child {
  margin-top: 0;
}

:where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) h3 {
  margin: 26px 0 11px;
  color: var(--ai-ink);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0;
}

:where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) p {
  margin: 0 0 14px;
  color: var(--ai-copy);
  font-size: 16px;
  line-height: 1.78;
}

:where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) ul,
:where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) ol {
  margin: 12px 0 20px;
  padding-left: 24px;
  list-style-position: outside;
}

:where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) ul {
  list-style-type: disc;
}

:where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) ol {
  list-style-type: decimal;
}

:where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) li {
  margin: 7px 0;
  padding-left: 3px;
  color: var(--ai-copy);
  font-size: 16px;
  line-height: 1.72;
  list-style: inherit;
}

:where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) li::marker {
  color: var(--ai-accent);
}

:where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) a {
  color: var(--ai-accent);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

:where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) img {
  max-width: 100%;
  height: auto;
  border-radius: 6px;
}

:where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) table {
  width: 100%;
  margin: 18px 0 24px;
  border: 1px solid var(--ai-line);
  border-collapse: collapse;
  background: #fff;
}

:where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) th,
:where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) td {
  padding: 12px 14px;
  border: 1px solid var(--ai-line);
  color: var(--ai-copy);
  text-align: left;
  vertical-align: top;
}

:where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) th {
  background: var(--ai-soft);
  color: var(--ai-ink);
  font-weight: 700;
}

:where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) blockquote {
  margin: 20px 0;
  padding: 16px 20px;
  border-left: 4px solid #23836f;
  background: var(--ai-note);
  color: #315b52;
}

@media (max-width: 768px) {
  .bd-article .ar-body {
    font-size: 15px;
    line-height: 1.72;
  }

  :where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) h2 {
    margin-top: 26px;
    font-size: 23px;
  }

  :where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) h3 {
    font-size: 18px;
  }

  :where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) p,
  :where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) li {
    font-size: 15px;
  }

  :where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  :where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) th,
  :where(.bd-arcticle .arc-content.arc-iframe, .bd-article .ar-body) td {
    min-width: 120px;
    padding: 10px 12px;
    font-size: 14px;
    line-height: 1.55;
  }
}