/* =============================================================
   Design Tokens / CSS Variables
   金子公認会計士・税理士事務所 オリジナルテーマ
   確定日: 2026-05-26
   ============================================================= */

:root {
  /* ===== カラー ===== */

  /* メイン青（中明度・親しみと信頼のバランス） */
  --color-primary:      #2D75B6;
  --color-secondary:    #0085B2;
  --color-primary-dark: #1B4F87;  /* FV等の濃いブルーパネル・グラデーション用 */

  /* 半透明オーバーレイ用のRGB成分（rgba()で使用） */
  --color-primary-rgb:      45, 117, 182;
  --color-primary-dark-rgb: 27, 79, 135;

  /* アクセント（温かい黄・お問い合わせCTA等） */
  --color-accent:       #F2C94C;
  --color-accent-hover: #E5B73A;

  /* アクセントのグラデーション（強調テキスト等。明るい黄→深い金） */
  --gradient-accent: linear-gradient(120deg, var(--color-accent) 0%, var(--color-accent-hover) 100%);

  /* ヘッダー高さ（FVの全画面高さ計算等に使用。SPは responsive.css で64pxに上書き） */
  --header-height: 80px;

  /* 背景 */
  --color-bg:         #FFFFFF;
  --color-bg-alt:     #F2F8FC;  /* セクション交互の薄水色 */

  /* テキスト */
  --color-black:      #333333;  /* 本文の基本色（黒に近いが柔らかい） */
  --color-white:      #FFFFFF;
  --color-gray:       #666666;  /* サブテキスト */
  --color-gray-light: #F5F5F5;  /* グレー背景 */
  --color-gray-border:#E5E5E5;  /* 境界線 */

  /* リンク */
  --color-link:       var(--color-primary);
  --color-link-hover: var(--color-secondary);

  /* ===== フォント ===== */
  --font-jp: 'Noto Sans JP', 'Hiragino Sans', 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, sans-serif;
  --font-en: 'Inter', 'Noto Sans JP', sans-serif;

  /* フォントサイズ（clamp で流動的に） */
  --fz-xs:   clamp(11px, 0.75rem,  12px);
  --fz-sm:   clamp(12px, 0.85rem,  14px);
  --fz-base: clamp(14px, 1.00rem,  16px);
  --fz-md:   clamp(16px, 1.10rem,  18px);
  --fz-lg:   clamp(18px, 1.35rem,  22px);
  --fz-xl:   clamp(22px, 1.85rem,  30px);
  --fz-2xl:  clamp(28px, 2.50rem,  40px);
  --fz-3xl:  clamp(32px, 3.00rem,  48px);

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

  /* レタースペーシング */
  --ls-sm: 0.05em;
  --ls-md: 0.08em;  /* 本文・和文の標準字間 */
  --ls-lg: 0.15em;  /* 見出し・装飾 */

  /* ラインハイト */
  --lh-sm: 1.4;  /* 見出し */
  --lh-md: 1.6;  /* 短文 */
  --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.10);
  --shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.12);
}