/*
 * XD typography, inspected 2026-10-03 at native 1920px design size.
 * Desktop text uses the specified px values, not viewport-proportional scaling.
 * Layout widths remain fluid; mobile adjustments are explicit below.
 * Avenir -> Lato; Aoto Gothic -> Noto Sans JP.
 * Japanese line-heights follow XD's rendered line pitch, not its CSS export:
 * Aoto Gothic with "auto" spacing renders at ~1.7x (16.5->28, 18->31, 24->41px)
 * while the export reports the Latin auto value (20/22/29px).
 */
:root {
  --cr-type-body: 16.5px;
  --cr-type-section: 60px;
  --cr-type-page: 42px;
  --cr-type-subheading: 40px;
  --cr-type-quote: 24px;
  --cr-type-lead: 24px;
  --cr-type-intro: 21px;
  --cr-type-detail: 18px;
  --cr-type-card-title: 20px;
  --cr-type-card-meta: 16px;
  --cr-type-card-excerpt: 12px;
}
body.cr-site {
  font-size: var(--cr-type-body);
  line-height: 1.7;
}
header.cr-header,
.cr-desktop-nav a {
  font-size: 20px;
  font-weight: 700;
  line-height: 27px;
}
.cr-contact-link {
  font-size: 18px;
  font-weight: 900;
  line-height: 25px;
}
.cr-menu a { font-size: 16px; }
.cr-heading {
  font-size: var(--cr-type-section);
  font-weight: 700;
  line-height: 1.35;
}
.cr-quote {
  font-size: var(--cr-type-quote);
  font-weight: 400;
  line-height: 41px;
}
.cr-about-intro > p,
.cr-about-copy > p {
  font-size: var(--cr-type-body);
  line-height: 28px;
}
.cr-concept h3 {
  font-size: var(--cr-type-subheading);
  font-weight: 700;
  line-height: 1.35;
}
.cr-concept .cr-concept-lead {
  font-size: var(--cr-type-lead);
  line-height: 41px;
}
.cr-principles li {
  font-size: var(--cr-type-detail);
  line-height: 31px;
}
.cr-principles span {
  font-size: 40px;
  font-weight: 900;
  line-height: 1.4;
}
.cr-business-item {
  font-size: 20px;
  font-weight: 700;
  line-height: 27px;
}
.cr-section-intro {
  font-size: var(--cr-type-intro);
  line-height: 36px;
}
/* Card text is embedded in the XD reference image, rather than text layers.
 * Native-scale reference: title ~20px, date/category ~16px, excerpt ~12px. */
.cr-card time,
.cr-card-category {
  font-size: var(--cr-type-card-meta);
  line-height: 1.5;
}
.cr-card h3 {
  font-size: var(--cr-type-card-title);
  font-weight: 700;
  line-height: 1.5;
}
.cr-excerpt {
  font-size: var(--cr-type-card-excerpt);
  line-height: 1.8;
}
.cr-more {
  font-size: 16px;
  font-weight: 400;
  line-height: 27px;
}
body.cr-site #company-info {
  font-size: var(--cr-type-detail);
  line-height: 31px;
}
.cr-footer-nav a {
  font-size: 14px;
  font-weight: 700;
  line-height: 19px;
}
.cr-footer-bottom {
  font-size: 14px;
  font-weight: 700;
  line-height: 19px;
}
.cr-footer-bottom small {
  font-size: 12px;
  line-height: 16px;
}
.cr-page-heading h1 {
  font-size: var(--cr-type-page);
  font-weight: 700;
  line-height: 1.35;
}
.cr-page-heading p,
.cr-feature-copy,
.cr-contact-intro,
.cr-privacy {
  font-size: var(--cr-type-body);
  line-height: 28px;
}
.cr-page-heading time,
.cr-feature-title time {
  font-size: 14px;
  line-height: 24px;
}
.cr-filters {
  font-size: 18px;
  line-height: 25px;
}
.cr-filters a[aria-current] { font-weight: 700; }
.cr-feature-title h2 {
  font-size: 24px;
  font-weight: 400;
  line-height: 41px;
}
.cr-pagination { font-size: 16px; }
.cr-media-grid article,
.cr-media-grid h2 {
  font-size: 15px;
  font-weight: 400;
  line-height: 25px;
}
.cr-media-grid article > p:last-child {
  font-size: 13px;
  line-height: 20px;
}
.cr-article .cr-prose { font-size: 18px; line-height: 1.9; }
.cr-article-nav { font-size: 16px; }
/* The form table is a masked reference in XD; retain the existing 20px field
 * treatment. The consent copy and SEND button are inspectable text layers. */
.cr-contact table { font-size: 20px; line-height: 1.5; }
.cr-contact .wpcf7-form > p { font-size: var(--cr-type-body); line-height: 28px; }
.cr-contact .wpcf7-form > p:has(.wpcf7-acceptance) { font-size: 20px; line-height: 34px; }
.cr-contact .wpcf7-not-valid-tip { font-size: 14px; }
.cr-contact .red { font-size: 13px; }
.cr-contact input[type=submit] {
  font-size: 24px;
  font-weight: 900;
  line-height: 28.8px;
  letter-spacing: .05em;
}
@media (max-width: 600px) {
  :root {
    --cr-type-body: 16px;
    --cr-type-section: 32px;
    --cr-type-page: 30px;
    --cr-type-subheading: 28px;
    --cr-type-quote: 20px;
    --cr-type-lead: 18px;
    --cr-type-intro: 16px;
    --cr-type-detail: 16px;
    --cr-type-card-title: 18px;
    --cr-type-card-meta: 14px;
    --cr-type-card-excerpt: 14px;
  }
  .cr-contact-link { font-size: 14px; line-height: 20px; }
  .cr-quote,
  .cr-about-intro > p,
  .cr-about-copy > p,
  .cr-concept .cr-concept-lead,
  .cr-principles li,
  .cr-section-intro,
  body.cr-site #company-info,
  .cr-page-heading p,
  .cr-feature-copy,
  .cr-contact-intro,
  .cr-privacy { line-height: 1.8; }
  .cr-principles span { font-size: 32px; }
  .cr-business-item { font-size: 16px; line-height: 22px; }
  .cr-filters { font-size: 16px; line-height: 24px; }
  .cr-feature-title h2 { font-size: 22px; line-height: 1.5; }
  .cr-card-grid { grid-template-columns: 1fr; }
  .cr-card-grid .cr-card-copy { padding: 16px; }
  .cr-card-grid .cr-card h3 { min-height: 0; }
  .cr-card-grid .cr-excerpt { -webkit-line-clamp: 3; }
  .cr-contact table,
  .cr-contact .wpcf7-form > p,
  .cr-contact .wpcf7-list-item { font-size: 16px; }
  .cr-contact input[type=submit] { font-size: 24px; }
  .cr-view-article .cr-page-heading h1 { font-size: 28px; }
  .cr-article .cr-prose { font-size: 16px; }
  /* Footer navigation stays at the specified 14px on every viewport. */
  .cr-footer-nav a { padding: 10px 12px; }
  .cr-footer-bottom { line-height: 1.8; }
}
