/* Use system Chinese fonts only while a Chinese locale is selected. */
@layer mrai-chinese-typography {
  html[lang="zh-CN"] {
    --mrai-chinese-font: "PingFang SC", "Microsoft YaHei", "Heiti SC", sans-serif;
  }
  html[lang="zh-TW"] {
    --mrai-chinese-font: "PingFang TC", "Microsoft JhengHei", "Microsoft YaHei", sans-serif;
  }

  /* Layered important rules take precedence over existing page font overrides. */
  html:is([lang="zh-CN"], [lang="zh-TW"]),
  html:is([lang="zh-CN"], [lang="zh-TW"]) body,
  html:is([lang="zh-CN"], [lang="zh-TW"]) body *,
  html:is([lang="zh-CN"], [lang="zh-TW"]) body *::before,
  html:is([lang="zh-CN"], [lang="zh-TW"]) body *::after {
    font-family: var(--mrai-chinese-font) !important;
  }

  /* Keep Simplified and Traditional Chinese video-hero titles consistent. */
  html:is([lang="zh-CN"], [lang="zh-TW"]) .mrai-progressive-hero h1,
  html:is([lang="zh-CN"], [lang="zh-TW"]) .mrai-progressive-hero h1 * {
    font-weight: 500 !important;
    line-height: 80px !important;
  }

  /* Use proportional title spacing with the smaller mobile font sizes. */
  @media (max-width: 820px) {
    html:is([lang="zh-CN"], [lang="zh-TW"]) .mrai-progressive-hero h1,
    html:is([lang="zh-CN"], [lang="zh-TW"]) .mrai-progressive-hero h1 * {
      line-height: 1.3 !important;
    }
  }

  /* Preserve the requested Chinese title clauses on their own lines. */
  html:is([lang="zh-CN"], [lang="zh-TW"]):is([data-i18n-page="hr"], [data-i18n-page="knowledge"]) .mrai-progressive-hero h1 {
    white-space: pre-line !important;
  }
  html:is([lang="zh-CN"], [lang="zh-TW"]):is([data-i18n-page="image"], [data-i18n-page="video"], [data-i18n-page="training"]) .mrai-progressive-hero h1 > :is(em, span) {
    display: block !important;
  }

  /* Keep the official English slogan in the site's existing Latin font stack. */
  html:is([lang="zh-CN"], [lang="zh-TW"]) :is(.mrai-shell-footer-slogan, .mrai-footer-slogan) {
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, Helvetica, sans-serif !important;
  }

  /* Price figures retain the original Latin typography in Chinese locales. */
  html:is([lang="zh-CN"], [lang="zh-TW"]) :is(
    .mrai-pricing-service-price small,
    .mrai-pricing-service-price strong,
    .plan-price small,
    .plan-price strong,
    .member-price .mp-prefix,
    .member-price .mp-value:not(.mp-phrase),
    .cost-card-price > strong,
    .usage-discount > strong
  ) {
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, Helvetica, sans-serif !important;
  }
}
