/* Chinese typography for the shared brick-red reference layout. */
@layer components {
  body { font-family: Arial, "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif; }
  h1, h2, h3 { letter-spacing: 0; }
  .hero h1 { font-size: clamp(40px, 4.4vw, 64px); line-height: 1.3; }
  .hero-copy p { line-height: 1.85; max-width: 30em; }
  .brand strong { font-size: 21px; }
  .brand small { font-size: 12px; }
  .master p, .included-grid p, .reviews-grid p { line-height: 1.9; }
  .service-card p, .band-copy p { line-height: 1.85; }
  .contact-panel h3 { line-height: 1.4; }
  .contact-tabs a { white-space: nowrap; }
  @media (max-width: 767px) {
    .hero h1 { font-size: clamp(36px, 8.6vw, 48px); max-width: none; }
    .hero-copy { padding-block: 36px 40px; }
    .hero-photo { aspect-ratio: 4 / 3; }
    .contact-tabs a { font-size: clamp(11px, 3vw, 14px); }
    .brand strong { font-size: 18px; }
    .brand small { font-size: 11px; }
  }
  @media (max-width: 359px) {
    .brand strong { font-size: 16px; }
    .brand small { font-size: 10px; }
    .brand img { width: 30px; height: 30px; }
    .hero h1 { font-size: 34px; }
    .utility { font-size: 11px; }
  }
}