/* ============================================================
   Webタイポグラフィ強化（第1段階）— 全ページ共通
   - --swl-* は変更しない（SWELL本体への影響なし）
   - 配色は変更しない（既存の色指定・テーマ配色を継承する）
   - page.css 等の既存クラス指定（.tz-page-content h2 など）は
     クラス込みで詳細度が高いため、本ファイルの指定より優先される
   ============================================================ */

/* ---- 見出し（全ページ共通の基準値） ---- */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--tz-font-title);
  line-height: var(--tz-typo-lh-heading);
  letter-spacing: var(--tz-typo-ls-heading);
}

h1 { font-size: var(--tz-typo-fz-h1); }
h2 { font-size: var(--tz-typo-fz-h2); }
h3 { font-size: var(--tz-typo-fz-h3); }
h4 { font-size: var(--tz-typo-fz-h4); }
h5 { font-size: var(--tz-typo-fz-h5); }
h6 { font-size: var(--tz-typo-fz-h6); }

/* ---- 本文・リスト（記事/固定ページの本文エリアに限定） ---- */
.entry-content,
.tz-page-content {
  font-family: var(--tz-font-base);
}

.entry-content p,
.entry-content li,
.entry-content dd,
.entry-content dt,
.tz-page-content p,
.tz-page-content li,
.tz-page-content dd,
.tz-page-content dt {
  line-height: var(--tz-typo-lh-body);
  letter-spacing: var(--tz-typo-ls-body);
}

.entry-content p,
.tz-page-content p {
  font-size: var(--tz-typo-fz-body);
  margin-bottom: var(--tz-typo-space-paragraph);
}

.entry-content li + li,
.tz-page-content li + li {
  margin-top: var(--tz-typo-space-list-item);
}

/* ---- リンク（下線の視認性向上。色は既存指定を継承） ---- */
.entry-content a,
.tz-page-content a {
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

/* ---- ボタン・CTA（文字サイズ・字間のみ統一。配色・装飾は既存指定を継承） ---- */
.swell-block-button__link,
.wp-block-button__link,
.tz-btn,
.tz-footer-cta__btn {
  font-size: var(--tz-typo-fz-btn);
  letter-spacing: var(--tz-typo-ls-btn);
  line-height: 1.4;
}

/* ---- カード内テキスト（行間のみ調整。配色・レイアウトは既存指定を継承） ---- */
.swell-block-cardLink__name,
.swell-block-cardLink__text,
.c-box__title,
.c-box p {
  line-height: var(--tz-typo-lh-body);
}

/* ---- 小テキスト（キャプション・注釈） ---- */
small,
figcaption {
  font-size: var(--tz-typo-fz-small);
  line-height: var(--tz-typo-lh-small);
}

/* ============================================================
   スマホでの読みやすさ最優先（〜480px）
   ============================================================ */
@media (max-width: 480px) {
  .entry-content p,
  .entry-content li,
  .tz-page-content p,
  .tz-page-content li {
    line-height: 1.85;
  }
}
