/*
 * variables.css — デザイントークン（共通基盤）
 *
 * 役割：全案件・全業態で共通のデフォルト値を定義する
 * 上書き：業態ごとの theme.css でカラーを上書きする
 * ルール：このファイルを直接案件用に編集しない
 */

:root {

  /* =====================
     カラー
     業態パックの theme.css で上書き可能
  ===================== */
  --color-primary:     #2E6B4F;   /* メインカラー */
  --color-primary-dk:  #1f4f39;   /* ホバー・強調 */
  --color-accent:      #F5A623;   /* アクセント */
  --color-accent-dk:   #d4891a;   /* アクセントホバー */
  --color-bg:          #FAFAF8;   /* ページ背景 */
  --color-bg-alt:      #F2F0EC;   /* セクション交互背景 */
  --color-surface:     #FFFFFF;   /* カード・パネル背景 */
  --color-text:        #1A1A1A;   /* 本文 */
  --color-text-sub:    #666666;   /* サブテキスト・補足 */
  --color-text-on-primary: #FFFFFF; /* プライマリ背景上のテキスト */
  --color-border:      #E0DDD8;   /* 罫線・区切り */
  --color-line:        #06C755;   /* LINE固定色（上書き不要） */
  --color-line-dk:     #05a848;   /* LINEホバー */

  /* =====================
     タイポグラフィ
  ===================== */
  --font-ja:           "Noto Sans JP", sans-serif;
  --font-size-base:    16px;
  --font-size-sm:      14px;
  --font-size-xs:      12px;
  --font-size-lg:      18px;
  --font-size-xl:      24px;
  --font-size-2xl:     32px;
  --font-size-3xl:     40px;
  --font-weight-normal: 400;
  --font-weight-mid:   500;
  --font-weight-bold:  700;
  --line-height-base:  1.8;
  --line-height-head:  1.4;
  --line-height-tight: 1.2;

  /* =====================
     スペーシング
  ===================== */
  --space-section:     80px;    /* セクション上下パディング */
  --space-section-sm:  48px;    /* SPでのセクション上下パディング */
  --space-block:       40px;    /* ブロック内要素間 */
  --space-block-sm:    24px;    /* SP版 */
  --space-inner:       16px;    /* 要素間の基本余白 */
  --space-inner-sm:    12px;
  --space-xs:           8px;

  /* =====================
     レイアウト
  ===================== */
  --container-max:     960px;   /* コンテナ最大幅 */
  --container-pad:     24px;    /* 左右余白（SP基準） */
  --container-pad-pc:  40px;    /* PC左右余白 */
  --breakpoint:        768px;   /* ブレイクポイント（1本のみ） */

  /* =====================
     形状・装飾
  ===================== */
  --radius-card:        8px;
  --radius-btn:         4px;
  --radius-pill:       50px;
  --shadow-card:       0 2px 12px rgba(0, 0, 0, 0.08);
  --shadow-card-hover: 0 4px 20px rgba(0, 0, 0, 0.12);
  --shadow-header:     0 1px 8px rgba(0, 0, 0, 0.10);

  /* =====================
     トランジション
  ===================== */
  --transition-base:   0.2s ease;

  /* =====================
     ヘッダー高さ（スクロールオフセット計算用）
  ===================== */
  --header-height:     64px;
  --header-height-pc:  72px;
}
