/* SIGNATURE SIDEBAR (SITE 58) — tokens.css
   高級クラブ・左右固定3カラム・明るいクリームの会員制サロン。
   配色: クリーム / ブラック / シャンパンゴールド（design-plan B5 SITE 58）
   48 private-salon（暗い深緑書斎）とは正反対の「明るいクリームのサロン」。 */
:root {
  /* ---- 配色 ---- */
  --cream:        #f5f0e3;  /* 基調・地の色 */
  --cream-panel:  #efe7d5;  /* 面（カード・右レール widget） */
  --cream-panel2: #eae0cc;  /* 沈めた面 */
  --cream-hi:     #faf7ee;  /* 最も明るい面（中央本文カード） */
  --ink:          #1c1a16;  /* 本文・見出し（対クリーム 15:1） */
  --ink-2:        #3a352c;  /* 副次テキスト（9.4:1） */
  --ink-3:        #5b5344;  /* 補助・注釈（コントラスト確保） */
  --gold:         #b39355;  /* シャンパンゴールド：大きい装飾・見出し罫のみ */
  --gold-deep:    #8f7440;  /* 中程度の罫・境界 */
  --gold-ink:     #6b5324;  /* 読ませるアクセント文字・リンク（6.4:1） */
  --gold-soft:    #c8ab72;  /* 明るい金の光沢 */

  /* ---- 派生 ---- */
  --line:      rgba(107, 83, 36, .24);   /* 金の細罫 */
  --line-soft: rgba(107, 83, 36, .13);
  --line-ink:  rgba(28, 26, 22, .12);
  --shade:     rgba(28, 26, 22, .06);
  --sheet-scrim: rgba(28, 26, 22, .46);

  /* ---- タイポ ---- */
  --font-display: "Petrona", "Noto Serif JP", Georgia, serif;   /* 58専用 display（既存50サイトと非重複） */
  --font-body:    "Noto Sans JP", system-ui, -apple-system, sans-serif;
  --font-mono:    "Space Mono", "IBM Plex Mono", ui-monospace, monospace;

  --fs-hero:  clamp(2.5rem, 5vw, 4.1rem);
  --fs-h2:    clamp(1.5rem, 2.6vw, 2.15rem);
  --fs-h3:    clamp(1.18rem, 1.7vw, 1.4rem);
  --fs-lead:  clamp(1.02rem, 1.2vw, 1.14rem);
  --fs-body:  1rem;        /* 16px 下限 */
  --fs-small: 0.875rem;    /* 14px：注釈下限 */
  --fs-kicker:0.8125rem;   /* 13px：装飾英字ラベルのみ（読み替え本文を別途用意） */

  /* ---- レイアウト（3カラム・自然高sticky） ---- */
  --rail-left:  clamp(220px, 18vw, 264px);
  --rail-right: clamp(240px, 20vw, 288px);
  --center-max: 760px;
  --shell-gap:  clamp(1.4rem, 2.4vw, 2.6rem);
  --sec-py:     clamp(3.4rem, 6vw, 5.4rem);
  --pad:        clamp(1.15rem, 3.5vw, 2rem);
  --radius:     3px;       /* 端正・角丸は控えめ */
  --radius-lg:  6px;

  --topbar-h: 60px;        /* モバイル上部バー */
  --cta-h:    64px;        /* モバイル固定CTA（フッター余白計算に使用） */
  --sheet-tab-h: 56px;     /* モバイル右レール＝ボトムシート起動タブ */

  --shadow-s:  0 2px 10px -4px rgba(28,26,22,.20);
  --shadow-m:  0 18px 44px -26px rgba(28,26,22,.42);
  --shadow-panel: 0 26px 60px -32px rgba(28,26,22,.55);
  --ease: cubic-bezier(.22, 1, .36, 1);
}