/* Source Han Sans (Noto Sans SC subset) for the About page, 2026-11-09.
   Subset to the characters used on /about/; license: SIL OFL 1.1 (OFL.txt). */
@font-face {
  font-family: "Source Han Sans SC";
  src: url("/assets/kerlala-ui/about-fonts/source-han-sans-regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Source Han Sans SC";
  src: url("/assets/kerlala-ui/about-fonts/source-han-sans-bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

body[data-page-kind="about"] main {
  font-family: "Source Han Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
}

@media (min-width: 1024px) {
  body[data-page-kind="about"] .kl-banner h1 { font-size: 64px; line-height: 1.25; }
  body[data-page-kind="about"] .kl-banner p { font-size: 20px; line-height: 1.8; }

  body[data-page-kind="about"] #intro h2 { font-size: 32px; }
  body[data-page-kind="about"] .kc-intro-copy p { font-size: 16px; }
  body[data-page-kind="about"] .kc-intro-copy .kc-offices { font-size: 16px; }

  body[data-page-kind="about"] .kc-facts dt { font-size: 14px; }
  body[data-page-kind="about"] .kc-facts dd { font-size: 38px; }
  body[data-page-kind="about"] .kc-facts small { font-size: 14px; }

  body[data-page-kind="about"] #vision h2 { font-size: 38px; }
  body[data-page-kind="about"] .kc-vision-marker { font-size: 18px; }
  body[data-page-kind="about"] .kc-vision > p { font-size: 16px; }

  body[data-page-kind="about"] #values h2,
  body[data-page-kind="about"] #culture h2,
  body[data-page-kind="about"] #services h2,
  body[data-page-kind="about"] #workflow h2 { font-size: 32px; }

  body[data-page-kind="about"] .kc-cards h3 { font-size: 22px; }
  body[data-page-kind="about"] .kc-cards p { font-size: 16px; }
  body[data-page-kind="about"] .kc-culture summary > span { font-size: 32px; }
  body[data-page-kind="about"] .kc-culture h3 { font-size: 22px; }
  body[data-page-kind="about"] .kc-culture p { font-size: 16px; }
  body[data-page-kind="about"] .kc-service-grid h3 { font-size: 22px; }
  body[data-page-kind="about"] .kc-service-grid p { font-size: 16px; }
  body[data-page-kind="about"] .kh-step h3 { font-size: 22px; }
  body[data-page-kind="about"] .kh-step p { font-size: 16px; }
}

/* About workflow icons, 2026-11-09 */
body[data-page-kind="about"] .kh-step-icon { width: 42px; height: 42px; border: 0; background: transparent; border-radius: 0; }
body[data-page-kind="about"] .kh-step-icon img { width: 42px; height: 42px; display: block; }
body[data-page-kind="about"] .kh-step-icon .on { display: none; }
body[data-page-kind="about"] .kh-step[open] .kh-step-icon .on { display: block; }
body[data-page-kind="about"] .kh-step[open] .kh-step-icon .off { display: none; }

/* Service card icons are CMS-managed; override their rendered content with the supplied 2026-11-09 assets. */
body[data-page-kind="about"] #services .kc-service-grid article:nth-child(1) img { content: url("/assets/about-icons-20261109/service-website.png"); }
body[data-page-kind="about"] #services .kc-service-grid article:nth-child(2) img { content: url("/assets/about-icons-20261109/service-articles.png"); }
body[data-page-kind="about"] #services .kc-service-grid article:nth-child(3) img { content: url("/assets/about-icons-20261109/service-ir.png"); }
body[data-page-kind="about"] #services .kc-service-grid article:nth-child(4) img { content: url("/assets/about-icons-20261109/service-video.png"); }
body[data-page-kind="about"] #services .kc-service-grid article:nth-child(5) img { content: url("/assets/about-icons-20261109/service-editorial.png"); }
body[data-page-kind="about"] #services .kc-service-grid article:nth-child(6) img { content: url("/assets/about-icons-20261109/service-distribution.png"); }