/* =====================================================
   variables.css
   確定済みの配色 + 可変トークン(余白・フォント・コンポーネント)
   2026-08-26: デザイン確定（旧pattern-soft.css案を正式採用）。
   案A/pattern-soft.cssの比較検証は終了し、値をこのファイルに統合済み。
===================================================== */
@import url('https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@500;700;900&family=M+PLUS+Rounded+1c:wght@400;500;700&display=swap');

:root{
  --navy-900:#152F49;
  --navy-800:#1E3F62;
  --navy-700:#2C5A85;
  --navy-500:#4B7BA8;
  --navy-100:#EAF1F7;
  --navy-050:#F4F8FB;
  --ink:#213241;
  --muted:#5C6D7A;
  --line:#E1E7EC;
  --surface:#F5F7F9;
  --white:#FFFFFF;
  --orange:#ED7D26;
  --orange-dark:#D3691A;
  --orange-100:#FCEADA;
  --green:#2E8B57;

  /* ---- 「単独」/「同席」区別用アクセントカラー ----
     本文サイズの文字色・小さな塗り文字には使用しないこと（コントラスト比不足のため）。
     枠線・アイコン・矢印・大きめの強調文字（見出し級）に限定して使用する。 */
  --scenario-blue:#257ac0;
  --scenario-teal:#09816D;

  /* ---- 可変トークン: 余白 (spacing) ---- */
  --space-section: 48px;
  --space-section-sp: 32px;

  /* ---- 可変トークン: フォント (typography) ----
     丸みのあるゴシック体（Zen Maru Gothic / M PLUS Rounded 1c）で統一 */
  --font-body-size: 17px;
  --line-height-body: 1.9;
  --font-body-family: "M PLUS Rounded 1c", "Noto Sans JP", sans-serif;
  --font-head-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  --font-h1-size: clamp(1.85rem, 3.2vw, 2.5rem);
  --font-h2-size: clamp(1.4rem, 1.9vw, 1.8rem);
  --font-eyebrow-size: .95rem;

  /* ---- 可変トークン: コンポーネント (buttons / cards) ----
     角丸を大きく、ボタンはピル型に統一 */
  --btn-radius: 999px;
  --btn-padding-y: .9rem;
  --btn-padding-x: 3.4rem;
  --card-radius: 28px;
}