/* =========================================================
   カウンセリングスペース ここのば — デザイントークン
   指示書「8．デザイン・トーン」より
     ベース   : アイボリー／オフホワイト
     メイン   : セージグリーン〜深緑
     アクセント: 控えめなゴールド
   避ける: 鮮やかすぎる緑／強すぎるコントラスト／派手なグラデーション
   ========================================================= */
:root {
  /* --- ベース（アイボリー／オフホワイト） --- */
  --ivory:        #FBF8F1;   /* ページ地色 */
  --ivory-2:      #F6F2E8;   /* 交互セクション */
  --ivory-3:      #F1ECE0;   /* さらに一段沈めた面 */
  --card:         #FFFDF9;   /* カード地色（白すぎない白） */
  --white:        #FFFFFF;

  /* --- メイン（セージグリーン〜深緑） --- */
  --green-900:    #123227;   /* 見出し・最も濃い緑 */
  --green-800:    #1A4433;
  --green-700:    #24573F;   /* ボタン地色 */
  --green-600:    #33684C;
  --sage:         #8CA68C;   /* セージグリーン */
  --sage-2:       #A9BEA4;
  --sage-soft:    #DDE6D8;   /* アイコン背景・淡い面 */
  --sage-mist:    #EDF1E8;

  /* --- アクセント（控えめなゴールド） --- */
  --gold:         #B08B4F;
  --gold-2:       #C6A36A;
  --gold-soft:    #E7D8B4;

  /* --- 文字 --- */
  --ink:          #2B332F;   /* 本文 */
  --ink-soft:     #5D6A63;   /* 補足 */
  --ink-mute:     #8A938C;   /* さらに弱い補足 */

  /* --- 罫線 --- */
  --line:         #E6DFD0;
  --line-soft:    #EFEAE0;

  /* --- 書体 --- */
  /* 見出し＝明朝（上品さ）／本文＝ゴシック（読みやすさ）
     日本語Webフォントは読み込まず、OS標準の明朝・ゴシックで表示する（表示速度優先）。
     ラテン小見出しのみ Cormorant Garamond（latinサブセット＝軽量）。 */
  --serif: "Hiragino Mincho ProN", "Hiragino Mincho Pro", "Yu Mincho", "YuMincho",
           "Noto Serif JP", "Shippori Mincho", "MS PMincho", serif;
  --sans:  "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic Medium", "Yu Gothic",
           "Noto Sans JP", "Meiryo", sans-serif;
  --latin: "Cormorant Garamond", "Hiragino Mincho ProN", Georgia, "Times New Roman", serif;

  /* --- レイアウト --- */
  /* ★カンプは横1672pxで描かれており、3枚並びのカードが1枚480px前後ある。
     コンテナが狭いとカード内の文章が3行に折り返して窮屈に見えるため 1200px を採る。 */
  --wrap:         1200px;   /* 通常コンテナ */
  --wrap-wide:    1320px;   /* ヘッダー等の広いコンテナ */
  --read:         760px;    /* 本文の最大読み幅（余白もデザインの一部） */
  --radius:       18px;
  --radius-lg:    26px;
  --radius-pill:  999px;

  /* --- 影（弱く・柔らかく） --- */
  --shadow-sm: 0 3px 12px rgba(24, 48, 36, .06);
  --shadow:    0 14px 38px rgba(24, 48, 36, .09);
  --shadow-lg: 0 24px 64px rgba(24, 48, 36, .12);

  /* --- 余白スケール --- */
  --sec-pad:    120px;  /* PC セクション上下 */
  --sec-pad-sp:  72px;  /* SP セクション上下 */
}

@media (max-width: 760px) {
  :root {
    --radius:    14px;
    --radius-lg: 20px;
  }
}