/* Load after styles.css. The original Chinese sentence stays intact in the DOM. */
.hero h1.hero-slogan {
  max-width: 100%;
  margin: 0;
  font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", sans-serif;
  font-size: clamp(29px, 3.6vw, 44px);
  font-weight: 600;
  letter-spacing: -.025em;
  line-height: 1.48;
  color: var(--ink);
}
.hero h1.hero-slogan > .hero-slogan-lead,
.hero h1.hero-slogan > .hero-slogan-impact {
  display: block;
  white-space: nowrap;
}
.hero h1.hero-slogan > .hero-slogan-lead {
  color: var(--ink);
}
.hero h1.hero-slogan > .hero-slogan-impact {
  color: var(--blue);
}
.hero-slogan .hero-slogan-emphasis {
  font-weight: 700;
}
/* Tablet keeps the existing two-column composition, so nine characters fit its narrow column. */
@media (min-width: 721px) and (max-width: 1000px) {
  .hero h1.hero-slogan { font-size: 29px; }
}
/* On phones the sentence uses the full copy width: 320 → 29px, 390 → 35.49px. */
@media (max-width: 720px) {
  .hero h1.hero-slogan {
    font-size: clamp(29px, 9.1vw, 40px);
    line-height: 1.5;
    letter-spacing: -.03em;
  }
}