/* SITE 82 CABARET STANDARD DARK — design tokens
   配色: ブラック #101012 / アイボリー #F2EEE6 / ゴールド #B99A5D / ボルドー #6A2434
   書体: Playfair Display + Noto Sans JP（いずれもシステムフォールバック必須）
   角丸は 0 / 4 / 8 / 12 / 16 のうち 4 / 8 / 12 の3値のみを使用する（16は不使用） */

:root {
  /* --- color --- */
  --c-ink: #101012;          /* ページ背景 */
  --c-ink-2: #17171B;        /* セクション背景（1段明るい） */
  --c-surface: #1D1D22;      /* カード面 */
  --c-surface-2: #26262C;    /* 入れ子面・入力欄 */
  --c-ivory: #F2EEE6;        /* 主要文字 */
  --c-muted: #BDB7AC;        /* 補助文字（対 #101012 コントラスト約 9:1） */
  --c-gold: #B99A5D;         /* アクセント1（対 #101012 約 7:1） */
  --c-gold-soft: #D8C295;    /* ゴールド上位（罫線ホバー・強調） */
  --c-wine: #6A2434;         /* アクセント2（面のみ。文字色には使わない） */
  --c-wine-deep: #4B1826;
  --c-line: rgba(242, 238, 230, 0.14);
  --c-line-strong: rgba(242, 238, 230, 0.26);
  --c-ok: #7FC29B;
  --c-alert: #E6A6A6;

  /* --- typography --- */
  --f-serif: "Playfair Display", "Times New Roman", "Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", serif;
  --f-sans: "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Segoe UI", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;

  --fs-body: 1rem;        /* 16px */
  --fs-body-lg: 1.0625rem;/* 17px 長文 */
  --fs-note: 0.875rem;    /* 14px 注記の下限 */
  --fs-label: 0.9375rem;  /* 15px */
  --fs-h1: clamp(2rem, 1.4rem + 2.2vw, 3.25rem);
  --fs-h2: clamp(1.5rem, 1.2rem + 1.1vw, 2.125rem);
  --fs-h3: clamp(1.1875rem, 1.08rem + 0.4vw, 1.4375rem);
  --fs-h4: 1.125rem;
  --fs-eyebrow: 0.8125rem; /* 13px 装飾英字ラベルのみ。同内容は必ず通常サイズで併記する */

  --lh-tight: 1.28;
  --lh-heading: 1.4;
  --lh-body: 1.75;
  --lh-dense: 1.45;

  --ls-nav: 0.06em;
  --ls-eyebrow: 0.2em;
  --ls-body: 0.01em;

  /* --- spacing --- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 64px;
  --sp-9: 88px;
  --section-y: clamp(48px, 6vw, 88px);

  /* --- layout --- */
  --container: 1200px;
  --container-narrow: 880px;
  --gutter: clamp(16px, 4vw, 32px);
  --header-h: 72px;
  /* アンカー深リンクの着地位置。sticky ヘッダーの実測高さ（768px以上で 78.5px、
     767px以下で 65px）に余白を足した値。--header-h は min-height のため実高より
     小さく、そのままでは見出しがヘッダーに潜る。実測値を基準に持つ。 */
  --anchor-offset: 100px;
  /* 固定CTAの「バー全体の高さ」を MASTER §6 の 48〜56px に収める。
     内訳: 上罫線1px + 上下padding 3px×2 + タップ領域 --cta-tap 48px = 55px
     （safe-area-inset-bottom は別途 padding-bottom へ加算する） */
  --cta-h: 55px;
  --cta-tap: 48px;
  --cta-pad: 3px;

  /* --- radius（3値に統一） --- */
  --r-s: 4px;
  --r-m: 8px;
  --r-l: 12px;

  /* --- shadow（2段階まで） --- */
  --sh-1: 0 1px 2px rgba(0, 0, 0, 0.4);
  --sh-2: 0 12px 32px rgba(0, 0, 0, 0.45);

  /* --- motion（1〜2種類） --- */
  --dur: 220ms;
  --dur-slow: 420ms;
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);

  --z-header: 60;
  --z-cta: 70;
  --z-drawer: 90;
  --z-modal: 100;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur: 0ms;
    --dur-slow: 0ms;
  }
}