/* SITE 70 — HOST EVENT RED / design tokens
   配色: ブラック #111111 / レッド #C92432 / オフホワイト #F7F5F1 / ダークグレー #44464B
   角丸は 4px のみ（MASTER §8: 1サイト内で混在させない。67 の 8px とも変える）
   影は 2段階まで
   本文16px / 注記14px を最小値とする
   数字は lining-nums / tabular-nums 固定（日付・料金・時刻に old-style 数字を出さない） */
:root {
  /* --- 面 --- */
  --c-bg: #111111;
  --c-bg-2: #17171A;
  --c-bg-3: #1F1F23;
  --c-bg-inset: #0C0C0D;

  /* --- 罫線 --- */
  --c-line: #2C2C30;
  --c-line-strong: #3E3E44;

  /* --- 文字 ---
     #F7F5F1 / #111111 = 16.4:1、#C9C6C0 = 11.1:1、#94918B = 6.0:1（いずれも4.5:1以上） */
  --c-fg: #F7F5F1;
  --c-fg-2: #C9C6C0;
  --c-muted: #94918B;

  /* --- アクセント（レッド1色 + 状態色） ---
     --c-accent (#C92432) は「面」用。#F7F5F1 の文字を載せて 5.1:1。
     文字色として使うのは --c-accent-bright (#F4635C) のほう（#111111 上で 6.1:1）。
     この2つを取り違えると赤文字が 3.4:1 まで落ちるので、用途を分けている。 */
  --c-accent: #C92432;
  --c-accent-bright: #F4635C;
  --c-accent-ink: #FFF6F5;
  --c-accent-soft: rgba(201, 36, 50, 0.16);
  --c-accent-line: rgba(244, 99, 92, 0.45);

  --c-ok: #79C99A;      /* 営業中・出勤あり */
  --c-off: #B7B4AE;     /* 休業・出勤なし */
  /* エラーはブランドの赤と同系色にすると「装飾の赤」と区別できないため、
     意図的にアンバーへ振っている（#111111 上で 11.6:1）。「！」記号と枠線も併用する。 */
  --c-alert: #FFC24D;
  --c-focus: #F4635C;

  /* --- 角丸（4px 単一） --- */
  --radius: 4px;

  /* --- 影（2段階） --- */
  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.55);
  --shadow-2: 0 14px 36px rgba(0, 0, 0, 0.6);

  /* --- 寸法 --- */
  --w-page: 1240px;
  --w-text: 760px;
  --h-header: 68px;
  /* 固定CTAの項目高。48〜56px の範囲に収める。body の padding-bottom もこの値に追従する。 */
  --h-cta: 56px;
  --tap: 44px;

  /* --- 余白 --- */
  --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;

  /* --- 文字サイズ（最小14px） --- */
  --fs-note: 14px;   /* 注記・補足 */
  --fs-body: 16px;   /* 本文・料金・時刻・住所・ラベル */
  --fs-lead: 17px;
  --fs-h4: 18px;
  --fs-h3: 22px;
  --fs-h2: clamp(24px, 2.5vw, 32px);
  --fs-h1: clamp(28px, 4vw, 42px);
  --fs-display: clamp(30px, 4.8vw, 50px);

  --lh-tight: 1.3;
  --lh-normal: 1.6;
  --lh-long: 1.75;

  /* --- 書体 ---
     見出し・日付・数字は Oswald（イベント告知に合う条件付きの縦長サンセリフ）。
     日本語グリフを持たないため、必ず Noto Sans JP へフォールバックさせる。
     本文は Noto Sans JP のみ（Oswald を本文へ使わない）。 */
  --font-base: "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  --font-display: "Oswald", "Noto Sans JP", -apple-system, BlinkMacSystemFont,
    "Segoe UI", Roboto, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  --font-num: "Oswald", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  /* --- モーション（1サイト1種類: fade-up） --- */
  --dur: 380ms;
  --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: 1ms; }
}
