/* tokens.css — fintech-trust（信頼のフィンテック） */
/* この変数セットをそのまま使うこと。変数には総称ファミリ(serif/sans-serif)を含めない */

:root {
  /* color */
  --color-bg: #f8f9fb;             /* 地（明るいオフホワイト） */
  --color-bg-white: #ffffff;       /* カード・パネルの地 */
  --color-bg-soft: #eef1f5;        /* セクション替え・表の見出し行 */
  --color-text: #1a1f2b;           /* 文字（濃紺墨） */
  --color-text-weak: #5b6472;      /* 弱い文字（補足・キャプション） */
  --color-accent: #1f7a6d;         /* アクセント（信頼の藍緑）唯一の彩度色 */
  --color-accent-strong: #185f55;  /* アクセント濃色（ホバー・強調テキスト） */
  --color-accent-pale: #e4f0ed;    /* アクセントの極薄面（バッジ・強調行の背景） */
  --color-line: #dde2e9;           /* 罫線（表・区切り） */
  --color-line-strong: #c3cad4;    /* 太めの罫線（表の外枠・二重罫線） */
  --color-plus: #3a7d5c;           /* プラス表示（低彩度の緑。記号▲併記が前提） */
  --color-minus: #a4453d;          /* マイナス表示（低彩度の赤。記号▼併記が前提） */

  /* typography */
  --font-heading: "Zen Kaku Gothic New"; /* 和文見出し。ウェイト600 */
  --font-body: "Zen Kaku Gothic New";    /* 和文本文。ウェイト400 */
  --font-latin: "Outfit";                /* 欧文・数字・単位。tabular-numsで組む */

  /* space / shape */
  --space-unit: 8px;
  --section-gap: 112px;
  --radius: 12px;
  --shadow-soft: 0 8px 32px rgba(26, 31, 43, 0.06); /* 影はこの1種類のみ。色付きグローは禁止 */
  --max-width: 1200px;
  --gutter: 24px;
  --cols: 12;

  /* motion */
  --motion-duration: 0.5s;
  --motion-ease: cubic-bezier(0.16, 1, 0.3, 1);
}