/* ============================================================
   North AI Works — デザイントークン
   正典: /DESIGN.md（リポジトリ直下）
   ベースパレット: https://coolors.co/palette/f1f2eb-d8dad3-a4c2a5-566246-4a4a48

   ⚠️ このファイルが唯一のトークン定義である。
      各テンプレートで :root を再定義しないこと。
      前回の実装は3テンプレートが各自 :root を持っていたため、
      1つだけ移行して他が旧色のまま残る事故が起きた。
   ============================================================ */

:root {
  /* --- 地と面 ------------------------------------------------ */
  --color-bg: #FFFFFF;        /* 地。純白 */
  --color-surface: #F1F2EB;   /* 面。カード・セクション背景。地には使わない */
  --color-line: #D8DAD3;      /* 罫線・境界。文字を載せない（白地1.41） */
  --color-sage: #A4C2A5;      /* 面のアクセント。載せてよい文字は fg のみ */

  /* --- 文字 -------------------------------------------------- */
  --color-fg: #4A4A48;        /* 本文・見出し 8.88 AAA */
  --color-muted: #566246;     /* 補助テキスト・ラベル 6.50 AA */
  --color-grey: #8A8A88;      /* 区切り・非活性。本文には使わない（3.46） */

  /* --- アクセント -------------------------------------------- */
  --color-accent: #A9428A;        /* 主。CTAの塗りのみ・1画面1箇所 5.48 */
  --color-accent-hover: #8F3874;  /* hover。色相を変えず明度のみ */
  --color-on-accent: #FFFFFF;     /* accent 上の文字。白のみ */
  --color-accent-sub: #4A6A96;    /* 副。リンク・注記・focus の3用途のみ 5.54 */

  /* --- 書体 -------------------------------------------------- */
  --font-display: 'Zen Kaku Gothic New', sans-serif;
  --font-body: 'Noto Sans JP', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;

  /* --- 余白（8px基準） --------------------------------------- */
  --sp-xs: 4px;
  --sp-sm: 8px;
  --sp-md: 16px;
  --sp-lg: 24px;
  --sp-xl: 40px;
  --sp-2xl: 64px;
  --sp-3xl: 96px;

  /* --- 角丸（最大4px） --------------------------------------- */
  --r-sm: 3px;
  --r-md: 4px;

  /* --- signature: 一点透視の幅の収束 -------------------------- */
  /* セクションが進むほど幅を狭め、奥へ進む感覚を作る */
  --w-wide: 1200px;
  --w-mid: 1120px;
  --w-narrow: 1040px;
  --w-tight: 880px;
}