:root {
  /* ==========================================================================
     カラー
     ========================================================================== */
  --color-primary: #054eab;    /* メインカラー: Blue（信頼感・グローバル・toB訴求） */
  --color-primary-light: #edf4fa; /* primary の極薄トーン: タイル・ピル・ラベルの下地 */
  --color-secondary: #52c3f7;  /* サブカラー: Sky Blue（CTA・アクセント・見出しハイライト） */
  --color-secondary-light: #a9e1fb; /* secondary の薄いトーン: 入力欄の枠線など */
  --color-accent: #c1d736;     /* アクセントカラー: Lime Green（強調ポイント） */
  --color-black: #111111;
  --color-white: #ffffff;
  --color-gray: #666666;
  --color-gray-light: #f5f5f5;
  --color-gray-border: #dddddd;
  --color-bg: #ffffff;         /* ベースカラー: 白 */
  --color-bg-alt: #f5f7fa;     /* 交互背景: 極薄ネイビーグレー */

  /* ==========================================================================
     フォント
     ========================================================================== */
  --font-en: 'Roboto', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;
  --font-jp: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;

  /* ==========================================================================
     フォントサイズ（clamp / SP〜PCで流動。SPで大きくなりすぎないよう最小値を抑制）
     ========================================================================== */
  --fz-xs:   clamp(0.6875rem, 0.67rem + 0.08vw, 0.75rem);   /* 11 → 12px */
  --fz-sm:   clamp(0.75rem, 0.71rem + 0.17vw, 0.875rem);    /* 12 → 14px */
  --fz-base: clamp(0.875rem, 0.82rem + 0.23vw, 1rem);       /* 14 → 16px */
  --fz-md:   clamp(0.9375rem, 0.85rem + 0.4vw, 1.125rem);   /* 15 → 18px */
  --fz-lg:   clamp(1.0625rem, 0.95rem + 0.5vw, 1.375rem);   /* 17 → 22px */
  --fz-xl:   clamp(1.25rem, 1rem + 1.1vw, 1.875rem);        /* 20 → 30px */
  --fz-2xl:  clamp(1.5rem, 1.1rem + 1.7vw, 2.5rem);         /* 24 → 40px */
  --fz-3xl:  clamp(1.75rem, 1.2rem + 2.35vw, 3rem);         /* 28 → 48px */

  /* ==========================================================================
     フォントウェイト
     ========================================================================== */
  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  /* ==========================================================================
     レタースペーシング
     ========================================================================== */
  --ls-sm: 0.05em;
  --ls-md: 0.1em;
  --ls-lg: 0.15em;

  /* ==========================================================================
     ラインハイト
     ========================================================================== */
  --lh-sm: 1.2;
  --lh-md: 1.5;
  --lh-lg: 1.8;

  /* ==========================================================================
     角丸
     ========================================================================== */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-full: 50px;

  /* ==========================================================================
     余白スケール
     ========================================================================== */
  --space-xs: 8px;
  --space-sm: 16px;
  --space-md: 24px;
  --space-lg: 40px;
  --space-xl: 64px;
  --space-2xl: 100px;
  --space-3xl: 140px;

  /* ==========================================================================
     コンテナ幅
     ========================================================================== */
  --container-max: 1200px;
  --container-narrow: 960px;
  --container-padding: 20px;

  /* ==========================================================================
     トランジション
     ========================================================================== */
  --easing: cubic-bezier(0.25, 1, 0.5, 1);
  --transition-speed: 0.3s;
  --transition-slow: 0.6s;

  /* ==========================================================================
     シャドウ
     ========================================================================== */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.12);
}
