/* CJK display type needs a taller line box than the Latin headline system. */
html[lang="zh-CN"] .atelier-index #at-hero-title,
html[lang="zh-CN"] .atelier-index #at-manifest-title,
html[lang="zh-CN"] .atelier-index #at-scale-title,
html[lang="zh-CN"] .atelier-about .about-display,
html[lang="zh-CN"] .atelier-network .nt-markets h2,
html[lang="zh-CN"] .atelier-network .nt-responsible h2,
html[lang="zh-CN"] .solutions-atelier .sf-title,
html[lang="zh-CN"] .solutions-atelier #decision-title {
  line-height: 1.08;
  letter-spacing: -0.018em !important;
  overflow: visible;
  text-wrap: balance;
}

/* The Latin reveal uses clip-path on a 0.91 line box, which trims CJK glyphs. */
html[lang="zh-CN"] .atelier-index #at-hero-title > span {
  clip-path: none !important;
  overflow: visible;
}

html[lang="zh-CN"] .atelier-index #at-hero-title > span + span,
html[lang="zh-CN"] .atelier-about .about-title-line + .about-title-line,
html[lang="zh-CN"] .solutions-atelier .sf-title strong {
  margin-top: 0.06em;
}

/* Keep this paired statement to exactly two lines at every breakpoint. */
html[lang="zh-CN"] .atelier-index #at-manifest-title {
  font-size: clamp(2.4rem, 3.6vw, 4.4rem);
  white-space: nowrap;
}

html[lang="zh-CN"] .atelier-index #at-manifest-title > em {
  display: block;
  margin-top: 0.06em;
  white-space: nowrap;
}

html[lang="zh-CN"] .atelier-index #at-hero-title > span,
html[lang="zh-CN"] .atelier-about .about-title-line,
html[lang="zh-CN"] .solutions-atelier .sf-title,
html[lang="zh-CN"] .solutions-atelier .sf-heading {
  padding-block: 0.035em;
}

html[lang="zh-CN"] .atelier-network .nt-markets h2 > span,
html[lang="zh-CN"] .atelier-network .nt-markets h2 > em,
html[lang="zh-CN"] .atelier-network .nt-responsible h2 > span,
html[lang="zh-CN"] .atelier-network .nt-responsible h2 > em {
  display: block;
}

html[lang="zh-CN"] .atelier-network .nt-markets h2 > em,
html[lang="zh-CN"] .atelier-network .nt-responsible h2 > em {
  margin-top: 0.06em;
}

@media (max-width: 767px) {
  html[lang="zh-CN"] .atelier-index #at-hero-title,
  html[lang="zh-CN"] .atelier-index #at-manifest-title,
  html[lang="zh-CN"] .atelier-index #at-scale-title,
  html[lang="zh-CN"] .atelier-about .about-display,
  html[lang="zh-CN"] .atelier-network .nt-markets h2,
  html[lang="zh-CN"] .atelier-network .nt-responsible h2,
  html[lang="zh-CN"] .solutions-atelier .sf-title,
  html[lang="zh-CN"] .solutions-atelier #decision-title {
    line-height: 1.12;
  }
}