/* =========================================================
   未来を創る学舎 miragaku.jp ｜ デザイントークン（一元管理）
   デザインガイドライン準拠。色・余白・角丸・影・タイポ・
   ブレークポイントをここで定義し、全ページ・全部品が参照する。
   PHP移植後もこのファイルはそのまま流用する。
   ========================================================= */
:root {
  /* --- Brand / 色（現行 miragaku.jp に準拠） --- */
  --blue:        #1e73be; /* Primary（現行の青） */
  --blue-dark:   #155a94; /* 強調・hover */
  --blue-mid:    #2f6fae; /* 補助・リンク */
  --blue-soft:   #e6f0fa; /* 淡い青の面 */
  /* ポップ差し色（アクセント） */
  --y-yellow:    #ffdb00;
  --y-pink:      #eb2b64;
  --y-blue:      #0071b9;
  --y-ink:       #141414;
  --ink2:        #14201f; /* 輪郭線・極太見出し用のインク（黒に近い） */
  --y-lightblue: #f3f8fc;
  --coral:       #e87a58; /* やさしいコーラル＝少量アクセント（青の相棒） */
  --coral-dark:  #d3663f;
  --coral-soft:  #fdefe8;
  --cta:         #c2662f; /* 予備の暖色 */
  --cta-dark:    #a5551f;
  --cta-soft:    #fbeee4;

  --head:        #23252b; /* 見出し（やや柔らかい黒） */
  --ink:         #55535d; /* 本文 */
  --sub:         #86828d; /* 補足 */
  --bg:          #ffffff; /* ページ背景 */
  --bg-alt:      #f8f5f0; /* 交互セクション＝ほのかな暖色オフホワイト */
  --bg-warm:     #fbf7f1; /* 温かい面（ヒーロー下地など） */
  --panel:       #ffffff; /* カード面 */
  --line:        #ece8e2; /* 罫線＝淡く暖色寄り */

  /* --- イベント状態色 --- */
  --ok:          #2f7d6b; /* 募集中 */
  --warn:        #c9791f; /* 残りわずか */
  --stop:        #8a97a4; /* 満員・締切 */
  --ok-soft:     #e2f1ec;
  --warn-soft:   #fbf0df;
  --stop-soft:   #eef1f4;

  /* --- 余白（8pxグリッド：4/8/16/24/32/48/64） --- */
  --s-1: 4px;  --s-2: 8px;  --s-3: 16px;
  --s-4: 24px; --s-5: 32px; --s-6: 48px; --s-7: 64px;

  /* --- 角丸・影 --- */
  --r-sm: 12px;
  --r:    16px;
  --r-lg: 24px;
  --r-pill: 999px;
  --shadow: 0 1px 2px rgba(40,40,55,.04), 0 10px 26px rgba(40,40,55,.05);
  --shadow-lg: 0 4px 12px rgba(40,40,55,.05), 0 24px 56px rgba(40,40,55,.09);

  /* --- タイポグラフィ --- */
  --font: "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN", "Yu Gothic", "YuGothic", Meiryo, system-ui, sans-serif;
  --lh:   1.8;   /* 本文行間 */
  --lh-tight: 1.5; /* 見出し行間 */

  /* type scale（clampでモバイル→デスクトップ滑らかに） */
  --fs-h1: clamp(24px, 5.2vw, 34px);
  --fs-h2: clamp(21px, 4vw, 28px);
  --fs-h3: 16px;
  --fs-body: 15.5px;
  --fs-sub: 13px;
  --fs-kicker: 12.5px;

  /* --- レイアウト --- */
  --wrap: 1120px;      /* サイト最大幅 */
  --wrap-read: 760px;  /* 読み物カラム幅（入口ページ等） */
  --tap: 44px;         /* 最小タップ領域 */
}

/* ブレークポイント（参考・メディアクエリで使用）：600px / 960px */