/* =========================================================
   開腸瑜伽協会 — デザイントークン (CSS変数のみ)
   役割: 色・タイポ・余白・レイアウト定数の単一ソース。
   依存: なし（最初に読み込む）
   静か・上質・余白・知性。深い茶を締め色に。
   ========================================================= */

:root {
  /* ---- 基調アクセント色（ブリーフ確定3色／面・チップに使用） ---- */
  --rose-greige: #D4C1C4;   /* ローズグレージュ */
  --pink-beige:  #E0C6C5;   /* ピンクベージュ */
  --mint-grey:   #CDDEDA;   /* ミントグレー */

  /* ---- 地：白ベース。沈め面は淡いミント（清潔・予防・健康） ---- */
  --paper:    #FFFFFF;   /* 基本背景：白 */
  --paper-2:  #F2F7F5;   /* 沈めたセクション地：ごく淡いミント */
  --paper-3:  #E7F0ED;   /* カード・面・プレースホルダ地：淡いミント */

  /* ---- アクセント面のトーン ---- */
  --mint-050:  #EFF6F4;   /* 最も淡いミント面 */
  --mint-100:  #E2EEEA;   /* ミント面 */
  --mint-line: #BFD6CF;   /* ミントの罫・縁 */
  --pink-050:  #FBF2F2;   /* 補助：淡い桜面 */
  --pink-100:  #F6E6E5;   /* 補助：桜面 */

  /* ---- 締め色：深い茶／墨（文字・フッター・強調セクション） ---- */
  --ink:        #28221E;   /* 主：墨に寄せた深い茶 */
  --ink-2:      #4E443D;   /* 副：本文・キャプション */
  --ink-3:      #8B7F75;   /* 弱：補助・メタ・プレースホルダ説明 */
  --rose-brown: #6E5A54;   /* ローズブラウン：差し色テキスト */
  --teal-ink:   #2F4A45;   /* 深い青緑：見出し差し色（任意） */

  /* ---- 罫・面の境界（極細ヘアライン主体） ---- */
  --line:        rgba(40, 34, 30, 0.12);
  --line-soft:   rgba(40, 34, 30, 0.07);
  --line-strong: rgba(40, 34, 30, 0.22);
  --on-dark:     rgba(252, 251, 249, 0.92);
  --on-dark-2:   rgba(252, 251, 249, 0.60);

  /* ---- タイポグラフィ ---- */
  --font-display: "Shippori Mincho", "Noto Serif JP", serif;       /* 見出し・縦組・声明文 */
  --font-sans: "Zen Kaku Gothic New", "Noto Sans JP", system-ui, sans-serif; /* 本文・UI */
  --font-latin: "Cormorant Garamond", serif;  /* 微小な欧文数字・ラベルのみ */

  /* 流体タイプスケール（PC↔SP連続） */
  --fs-hero:    clamp(3.4rem, 9vw, 8.5rem);   /* 縦組ワードマーク */
  --fs-display: clamp(2.1rem, 4.6vw, 4rem);    /* 大見出し・声明 */
  --fs-h1:      clamp(1.8rem, 3.4vw, 2.9rem);
  --fs-h2:      clamp(1.4rem, 2.4vw, 2.05rem);
  --fs-h3:      clamp(1.15rem, 1.7vw, 1.4rem);
  --fs-lead:    clamp(1.05rem, 1.5vw, 1.3rem);  /* リード文 */
  --fs-body:    clamp(0.95rem, 1.05vw, 1.0625rem);
  --fs-small:   0.8125rem;
  --fs-micro:   0.6875rem;   /* キャプション・欧文ラベル */

  --lh-tight: 1.32;
  --lh-snug:  1.55;
  --lh-body:  1.95;   /* 和文本文は広めの行間 */
  --ls-wide:  0.18em; /* トラッキング：ラベル */
  --ls-base:  0.04em; /* 和文本文の微トラッキング */

  /* ---- 余白スケール（8基準・余白主体） ---- */
  --s-1:  4px;
  --s-2:  8px;
  --s-3:  12px;
  --s-4:  16px;
  --s-5:  24px;
  --s-6:  32px;
  --s-7:  48px;
  --s-8:  64px;
  --s-9:  96px;
  --s-10: 128px;
  --s-11: 160px;
  --s-12: 200px;

  /* セクション縦リズム（流体）。data-rhythm で layout.css が上書き */
  --section-y: clamp(72px, 11vw, 168px);
  --section-y-lg: clamp(96px, 15vw, 228px);

  /* レイアウト */
  --maxw: 1320px;        /* ワイドコンテナ */
  --maxw-text: 660px;    /* 読み物の最適計測幅 */
  --gutter: clamp(20px, 5vw, 80px);  /* 画面左右の余白 */

  /* 締め色（アンカー）の既定。data-anchor で layout.css が上書き */
  --anchor: #382B22;

  /* ---- その他 ---- */
  --radius: 2px;         /* 角は最小限（上質・硬質） */
  --radius-img: 3px;
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-soft: cubic-bezier(0.4, 0, 0.1, 1);
  --dur: 0.8s;
  --shadow-soft: 0 24px 60px -32px rgba(44, 37, 33, 0.28);
}