/* ==========================================================================
   tokens.css — デザイントークン（規定書2章／既存LPの:rootが正）
   サイト全域の単一ソース。色・タイポ・余白・角丸・影を集約する。
   ========================================================================== */

:root{
  /* --- 背景・面 --- */
  --bg:#f4f7fc;        /* ページ地。青みグレーで清潔・知的 */
  --soft:#eaf0f9;      /* セクション交互背景・チップ地 */
  --card:#ffffff;      /* カード・記事本文面 */

  /* --- 文字 --- */
  --ink:#0c1b30;       /* 見出し（最濃） */
  --text:#33445c;      /* 本文 */
  --muted:#6b7990;     /* 補助・キャプション */
  --line:#e3eaf4;      /* 罫線・境界 */

  /* --- ブランド：navy（信頼の基調）--- */
  --navy:#0a1729;
  --navy2:#13294a;

  /* --- ブランド：gold（実績・満足のアクセント）--- */
  --gold:#a87f25;
  --gold-d:#8a661a;       /* テキスト用の濃gold（コントラスト確保）*/
  --gold-on-dark:#e4c36b; /* 濃色背景上のgold */
  --gold-l:#f1da97;       /* 見出し内ハイライト */

  /* --- 機能色：green（成功・CTA）--- */
  --green:#2c9650;
  --green-l:#3cbc66;

  /* --- Google Play 4色（専門性アクセント・装飾ドット）--- */
  --gp-green:#2ea84f;
  --gp-red:#ea4335;
  --gp-yellow:#f9c011;
  --gp-blue:#4285f4;

  /* --- タイポグラフィ --- */
  --font-base: -apple-system,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;

  /* サイズスケール（rem・モジュラー） */
  --fs-hero:2.35rem;   /* H1（トップのみ） */
  --fs-h2:1.95rem;     /* セクション見出し h2.t */
  --fs-h3:1.35rem;     /* 小見出し・記事内H3 */
  --fs-lead:1.05rem;   /* リード文 */
  --fs-body:1rem;      /* 本文（16px） */
  --fs-sm:0.9rem;      /* 補助 */
  --fs-xs:0.78rem;     /* eyebrow・キャプション */

  /* --- 余白スケール（8pxベース）--- */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px;
  --sp-5:24px; --sp-6:32px; --sp-7:44px; --sp-8:64px; --sp-9:84px;

  /* コンテンツ最大幅 */
  --wrap:1080px;

  /* --- 角丸 --- */
  --r-sm:8px;    /* チップ・小ボタン・タグ */
  --r-md:14px;   /* カード・details・FAQ */
  --r-lg:20px;   /* 画像フレーム・大カード */
  --r-pill:50px; /* CTA・チップ */

  /* --- 影（elevation）--- */
  --sh-1:0 6px 16px rgba(12,27,48,.04);    /* 面のわずかな浮き */
  --sh-2:0 10px 30px rgba(12,27,48,.06);   /* カード */
  --sh-3:0 22px 50px rgba(12,27,48,.18);   /* 画像フレーム */
  --sh-cta:0 10px 26px rgba(44,150,80,.34);/* CTA */
}