/* SITE 87 CABARET NEW OPEN — design tokens
   配色: ホワイト #FBFAF7 / ネイビー #25344C / シャンパン #D1B98B / コーラル #C86768
   書体: Montserrat + Noto Sans JP（いずれもシステムフォールバック必須）
   角丸は 0 / 4 / 8 / 12 / 16 のうち 4 / 12 の2値のみを使う（小物=4・面=12） */

:root {
  /* --- color ---
     シャンパン #D1B98B とコーラル #C86768 は「面・罫線」用。
     文字に使う場合は本文コントラスト4.5:1を満たす -text 系を使う。 */
  --c-paper: #FBFAF7;         /* ページ背景 */
  --c-card: #FFFFFF;          /* カード面 */
  --c-paper-2: #F4F1EA;       /* セクション背景（1段沈める） */
  --c-paper-3: #EDE8DE;       /* 入力欄・入れ子面 */
  --c-ink: #25344C;           /* 主要文字＝ネイビー（対 #FBFAF7 約 12.4:1） */
  --c-ink-2: #3C4A5E;         /* 見出し補助（約 9.4:1） */
  --c-muted: #5B6675;         /* 補助文字（約 5.6:1） */
  --c-navy: #25344C;          /* アクセント1: ネイビー */
  --c-navy-deep: #16223A;     /* 押下・ホバー */
  --c-navy-tint: #E7EBF1;     /* 面（文字は必ず ink 系を載せる） */
  --c-champagne: #D1B98B;     /* アクセント2: シャンパン（罫線・面・図版） */
  --c-champagne-soft: #F3EBDA;/* 面 */
  --c-champagne-text: #7E5F26;/* シャンパン系の文字（約 5.7:1） */
  --c-coral: #C86768;         /* アクセント3: コーラル（開店告知の強調） */
  --c-coral-text: #A63F45;    /* コーラル系の文字（約 5.9:1） */
  --c-coral-soft: #FBEDEC;    /* 面 */
  --c-line: #E2DCD0;
  --c-line-strong: #BFB7A6;
  --c-ok: #1F7A52;            /* 営業中（約 4.9:1） */
  --c-alert: #B4262B;         /* エラー・休業（約 6.4:1） */
  --c-on-navy: #FFFFFF;

  /* --- typography --- */
  --f-sans: Montserrat, "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(1.75rem, 1.3rem + 1.8vw, 2.625rem);
  --fs-h2: clamp(1.375rem, 1.18rem + 0.8vw, 1.875rem);
  --fs-h3: clamp(1.125rem, 1.05rem + 0.3vw, 1.3125rem);
  --fs-h4: 1.0625rem;
  --fs-eyebrow: 0.8125rem;  /* 13px 装飾英字ラベルのみ。同内容は必ず通常サイズで併記する */
  --fs-count: clamp(2.75rem, 1.9rem + 3.6vw, 4.5rem);  /* カウントダウンの数字 */
  --fs-stat: clamp(1.625rem, 1.35rem + 1.1vw, 2.125rem);

  --lh-tight: 1.25;
  --lh-heading: 1.45;
  --lh-body: 1.75;
  --lh-dense: 1.5;

  --ls-nav: 0.02em;
  --ls-eyebrow: 0.18em;
  --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;
  --section-y: clamp(44px, 5vw, 76px);

  /* --- layout --- */
  --container: 1160px;
  --container-narrow: 840px;
  --gutter: clamp(16px, 3.5vw, 28px);
  /* PCヘッダーは MASTER §6 の 64〜80px に収める（実測 76px） */
  --header-h: 76px;
  /* アンカー着地位置。ヘッダー実測高＋余白。1023px以下は responsive.css で 84px へ */
  --anchor-offset: 96px;
  /* 固定CTA。バー全体 = 上罫線1px + padding 3px×2 + タップ領域 48px = 55px（48〜56px） */
  --cta-h: 55px;
  --cta-tap: 48px;
  --cta-pad: 3px;

  /* --- radius（4 / 12 の2値のみ） --- */
  --r-s: 4px;
  --r-m: 12px;

  /* --- shadow（2段階まで） --- */
  --sh-1: 0 1px 2px rgba(37, 52, 76, 0.08);
  --sh-2: 0 12px 32px rgba(37, 52, 76, 0.16);

  /* --- motion（1種類: fade+slide） --- */
  --dur: 180ms;
  --dur-slow: 360ms;
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);

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

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