/* A calm sans-serif system for product photography and clear project details. */
:root {
  --reading-font: 'Source Sans 3 Variable', Arial, sans-serif;
  --display-font: var(--reading-font);
}
:root:lang(zh-CN) {
  --reading-font: 'Source Sans 3 Variable', 'ZZ Beauty Sans SC Core', 'ZZ Beauty Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;
  --display-font: var(--reading-font);
}
:root:lang(ko), :lang(ko) {
  --reading-font: 'Source Sans 3 Variable', 'Pretendard', sans-serif;
  --display-font: var(--reading-font);
}
:root:lang(ar), :lang(ar) {
  --reading-font: 'Source Sans 3 Variable', 'Noto Sans Arabic', sans-serif;
  --display-font: var(--reading-font);
}
html body {
  font-family: var(--reading-font);
  font-weight: 400;
  font-kerning: normal;
  font-optical-sizing: auto;
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
}
html:lang(zh-CN) body { letter-spacing: 0; }
h1, h2, h3, h4, .format-tabs button {
  font-family: var(--reading-font);
}
button, input, select, textarea,
.zz-header, .zz-header nav, .zz-language, .zz-lang-code,
.language-switch, .language-trigger, .language-code,
.menu-dialog .language-options a,
#inquiry-dialog .mode-name, #inquiry-dialog .form-progress {
  font-family: var(--reading-font);
}
strong, b { font-weight: 600; }
.hero h1, .display, .page-head h1, .split-body h1,
.catalog-hero h1, .service-hero h1, .evidence-hero h1,
.product-summary h1, .manufacturing-intro h1,
.section-title h2, .section h2, .closing h2,
.inquiry-layout aside h1, .close-section h2,
.about-hero h1, .about-section h2, .sample-information h3,
.exhibition-feature h2, .exhibitions-heading h2,
.exhibition-feature-copy h3, .exhibition-story h3 {
  font-weight: 500;
  letter-spacing: -.022em;
}
.home-narrative .display, .home-narrative .close-section h2,
#cosmetics .chapter-stage h2, #color .chapter-stage h2,
#inquiry h2 { font-weight: 500; }
.exhibition-feature-copy > p:not(.exhibition-place),
.exhibition-body p { line-height: 1.85; }
.exhibitions h4, .exhibition-film figcaption strong,
.zz-footer h2, .footer-columns h2 {
  font-family: var(--reading-font);
  font-weight: 500;
}
.zz-header nav a, .primary, .text-link, .zz-button, .text-action {
  font-weight: 500;
}
.zz-header nav a { font-size: 14px; }
html:lang(zh-CN) :is(
  .hero h1, .display, .page-head h1, .split-body h1,
  .catalog-hero h1, .service-hero h1, .evidence-hero h1,
  .product-summary h1, .manufacturing-intro h1,
  .section-title h2, .section h2, .closing h2,
  .inquiry-layout aside h1, .close-section h2,
  .about-hero h1, .about-section h2, .sample-information h3,
  .exhibition-feature h2, .exhibitions-heading h2,
  .exhibition-feature-copy h3, .exhibition-story h3
) {
  font-weight: 500;
  letter-spacing: .005em;
  line-height: 1.4;
}
html:lang(zh-CN) :is(#cosmetics, #color) .chapter-stage h2,
html:lang(zh-CN) #inquiry h2 {
  font-weight: 500;
  letter-spacing: .005em;
  line-height: 1.4;
}
html:lang(zh-CN) .home-narrative .hero-copy h1 {
  letter-spacing: .005em;
  line-height: 1.38;
}
html:lang(zh-CN) .home-narrative .hero-copy .hero-intro > p {
  max-width: 34em;
  text-wrap: pretty;
}
html:lang(ko) :is(h1, h2, .exhibition-feature-copy h3, .exhibition-story h3) {
  font-weight: 500;
  letter-spacing: -.025em;
  line-height: 1.4;
}
html:lang(ar) :is(h1, h2, .exhibition-feature-copy h3, .exhibition-story h3) {
  letter-spacing: 0;
  line-height: 1.6;
}
@media (max-width: 767px) {
  .home-narrative .hero-copy h1,
  html:lang(zh-CN) .home-narrative .hero-copy h1,
  html:lang(ko) .home-narrative .hero-copy h1 {
    letter-spacing: 0;
    line-height: 1.35;
  }
}