/*
 * デザイントークン(色・書体・余白)を1ファイルに集約する。
 * コンポーネント側のCSSは直接HEX値を書かず、必ず var(--token名) 経由で参照すること。
 *
 * 配色は方向性B「深紅と紺青 — コンビクション」の暫定値(2026-07-28時点)。
 * docs/design-system.md が確定版に更新された後は、このファイルの値だけを
 * 差し替えれば全ページに反映される(テンプレート/CSSの他ファイルは変更不要)。
 * NOTE: docs/design-system.md と design/wireframes/preview.html は別エージェントが
 * 並行編集中のため、このファイルからは参照のみで編集しない。
 */

:root {
  /* --- カラー: 方向性B(コンビクション) 暫定値 --- */
  --navy: #14263F;       /* ブランドカラー。ヘッダー/フッター背景、見出しアクセント */
  --navy-deep: #0B1524;  /* より深い紺。フッターや強調背景 */
  --crimson: #E60027;    /* ロゴの赤。CTA等、行動喚起の一点のみに限定使用 */
  --ink: #16202C;        /* 本文・見出しの基本文字色 */
  --slate: #5C6B78;      /* 補助テキスト・キャプション・罫線 */
  --canvas: #F2F3F1;     /* ページ背景 */
  --panel: #FFFFFF;      /* カード・パネルの地 */
  --line: #D3D7D6;       /* 罫線・区切り線 */

  /* --- 反転配色(紺背景セクション用) --- */
  --on-navy-text: #FFFFFF;
  --on-navy-muted: #C7D0DA;

  /* --- タイポグラフィ: 和文は明朝(見出し)/ゴシック(本文)、Webフォント不使用 --- */
  --font-serif: "Hiragino Mincho ProN", "Yu Mincho", YuMincho, "游明朝", serif;
  --font-sans: "Hiragino Kaku Gothic ProN", "Yu Gothic", YuGothic, "Noto Sans JP", sans-serif;

  --font-size-h1: 2.75rem;
  --font-size-h2: 1.875rem;
  --font-size-h3: 1.25rem;
  --font-size-body: 1rem;
  --font-size-caption: 0.8125rem;

  /* --- スペーシング: 4pxベース --- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --space-32: 128px;

  /* --- その他 --- */
  --radius-sm: 4px;
  --max-content-width: 1120px;
}