/* 文字の役割を管理する共通設定。各ページのCSSより後に読み込む。 */
:root {
  --text: #111;
  --text-body: #444;
  --text-muted: #666;
  --font-japanese:
    "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  --font-label: Inter, "Noto Sans JP", sans-serif;
  --type-page: 44px;
  --type-article: 40px;
  --type-lead: 36px;
  --type-section: 32px;
  --type-subheading: 24px;
  --type-item: 18px;
  --type-body: 16px;
  --type-caption: 14px;
}
body {
  color: var(--text-body);
  font-family: var(--font-japanese);
  font-size: var(--type-body);
  line-height: 1.75;
}
/* ページ名は大きさで示し、過度な太字を避ける。 */
.news-index h1,
.support-heading h1,
.strengths-content h1,
.expanded-heading h1 {
  font-size: var(--type-page);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.02em;
}
/* 記事・事例の固有タイトルは同じ扱い。 */
.article-heading h1,
.expanded-page .expanded-heading h1.green-headline {
  font-size: var(--type-article);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.02em;
}
/* 導入のメッセージは緑色を活かし、章見出しとは役割を分ける。 */
.expanded-page .prose > .green-headline,
.strengths-intro h2 {
  font-size: var(--type-lead);
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.02em;
}
.section-heading h2,
.expanded-section > h2,
.strengths-initiatives > h2,
.support-section h2,
.faq-group h2,
.policy-section h2 {
  font-size: var(--type-section);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.02em;
}
/* 項目・カード内の見出しは章見出しより一段抑える。 */
.services-intro h3,
.service-card h4,
.business-card h3,
.service-step h3,
.strengths-item h3,
.expanded-page .interview-copy h3.green-headline,
.article-body h2,
.form-section-title,
.form-review h2 {
  font-size: var(--type-subheading);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.01em;
}
.expanded-page .interview-copy h3.green-headline {
  color: var(--green-dark);
}
.services-subheading,
.service-label,
.strengths-label,
.expanded-heading .intro-subtitle,
.page-eyebrow,
.article-category {
  font-size: var(--type-item);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.02em;
}
/* TOPと一覧で、同じカードや記事名の見た目を一致させる。 */
.case-card .case-copy :is(h2, h3),
.news-list h3,
.news-index .news-list h2 {
  font-size: var(--type-item);
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.01em;
}
.service-card p {
  font-family: var(--font-japanese);
  line-height: 1.75;
}
.news-list time,
.news-index .news-list time,
.article-heading time {
  font-family: var(--font-label);
  font-size: var(--type-caption);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.02em;
  font-variant-numeric: tabular-nums;
}
.section-label,
.english-label {
  font-family: var(--font-label);
  font-size: var(--type-caption);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.08em;
}
/* ボタンの例外を整理。ヘッダーの狭い幅用サイズは既存のまま。 */
.contact-options .button,
.support-faq-intro .button,
.strengths-cta .button {
  font-size: var(--type-body);
  font-weight: 500;
  line-height: 1.5;
}
/* 長文は画面・カラムの幅に応じて伸ばす。入力フォームの幅は別管理。 */
.news-content,
.faq-content.support-narrow,
.policy-content.support-narrow {
  width: 100%;
}
@media (max-width: 767px) {
  :root {
    --type-page: 28px;
    --type-article: 28px;
    --type-lead: 28px;
    --type-section: 26px;
    --type-subheading: 22px;
    --type-item: 16px;
  }
}

/* 情報の強弱：見出しは黒、本文はグレー、補足は一段控えめに。 */
main :is(h1, h2, h3, h4, h5, h6),
.faq-item summary,
.form-field > label,
.form-field > legend {
  color: var(--text);
}
.article-heading h1,
.expanded-page .expanded-heading h1.green-headline {
  color: var(--text);
}
/* ブランドの導入コピー・英字ラベルは緑を維持。 */
.hero h1,
.expanded-page .prose > .green-headline,
.strengths-intro h2 {
  color: var(--green);
}
.news-list time,
.news-index .news-list time,
.article-heading time,
.draft-note,
.article-body .sample-note,
.form-help,
.breadcrumbs,
.preview-note {
  color: var(--text-muted);
}
