:root {
  /* ── Color Tokens ── */
  --color-midnight: #0d1117;
  --color-deep-navy: #111827;
  --color-charcoal: #1f2937;
  --color-navy-beige: #1e2a38;
  --color-warm-ivory: #f5f0e8;
  --color-warm-beige: #e8ddd0;
  --color-warm-wall: #f0e8db;
  --color-muted-amber: #c4953a;
  --color-soft-gold: #d4a84b;
  --color-fog-gray: #6b7280;
  --color-white: #ffffff;
  --color-warm-white: #faf8f5;
  --color-green-ok: #4caf7d;

  /* ── Semantic Aliases ── */
  --bg: var(--color-white);
  --bg-warm: var(--color-warm-white);
  --text: #1a1a1a;
  --text-dim: rgba(26, 26, 26, 0.55);
  --text-faint: rgba(26, 26, 26, 0.3);
  --amber: var(--color-muted-amber);
  --green-ok: var(--color-green-ok);

  /* ── Typography ── */
  /* 디자인 시스템 기준: 섹션 헤딩은 Outfit, 브랜드 선언문만 Serif */
  --font-heading: 'Outfit', 'Pretendard Variable', sans-serif;
  --font-display: 'Cormorant Garamond', 'Noto Serif KR', serif;
  --font-body: 'Pretendard Variable', 'Inter', sans-serif;

  /* ── 8px Spacing Grid (디자인 시스템 기준) ── */
  --sp-1: 8px;
  --sp-2: 16px;
  --sp-3: 24px;
  --sp-4: 32px;
  --sp-5: 40px;
  --sp-6: 48px;
  --sp-8: 64px;
  --sp-10: 80px;
  --sp-12: 96px;
  --sp-15: 120px;

  /* ── Layout ── */
  --section-padding-v: var(--sp-15);  /* 120px */
  --container-max: 1200px;
  --container-px: var(--sp-6);        /* 48px */

  /* ── Shadows (offset 없는 ambient blur — 디자인 시스템 기준) ── */
  --shadow-sm: 0 0 12px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 0 16px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 0 20px rgba(0, 0, 0, 0.10);
  --shadow-xl: 0 0 24px rgba(0, 0, 0, 0.12);

  /* ── Motion ── */
  --ease-calm: cubic-bezier(0.37, 0, 0.63, 1);
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-hover: 280ms;
  --dur-text: 700ms;
  --dur-section: 900ms;
  --dur-breathing: 5000ms;
}

/* ── Time State Palettes ─────────────────────────── */

.section--midnight {
  --s-bg: var(--color-deep-navy);
  --s-text: var(--color-warm-ivory);
  --s-accent: var(--color-muted-amber);
  --s-dim: rgba(245, 240, 232, 0.5);
  --s-divider: rgba(245, 240, 232, 0.12);
}

.section--deep-night {
  --s-bg: var(--color-charcoal);
  --s-text: var(--color-warm-ivory);
  --s-accent: var(--color-fog-gray);
  --s-dim: rgba(245, 240, 232, 0.45);
  --s-divider: rgba(245, 240, 232, 0.1);
}

.section--pre-dawn {
  --s-bg: var(--color-navy-beige);
  --s-text: var(--color-warm-ivory);
  --s-accent: var(--color-muted-amber);
  --s-dim: rgba(245, 240, 232, 0.55);
  --s-divider: rgba(245, 240, 232, 0.15);
}

.section--dawn {
  --s-bg: var(--color-warm-wall);
  --s-text: #1a1a1a;
  --s-accent: var(--color-soft-gold);
  --s-dim: rgba(26, 26, 26, 0.5);
  --s-divider: rgba(26, 26, 26, 0.1);
}