:root {
  /* Brand Colors */
  --color-brand-beige: #5a5448;
  --color-brand-grey: #5a5448;
  --color-text-primary: #3c3733;
  --color-text-heading: #212121;
  --color-text-light: #999;
  --color-bg-cream: #f1ede4;
  --color-bg-white: #fff;
  --color-accent: #00b8ff;
  --color-divider: #e0dcd4;
  --color-overlay: rgba(0, 0, 0, 0.3);

  /* Typography */
  --font-kr: "S-Core Dream", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  --font-en: "Century Gothic", "CenturyGothic", "AppleGothic", sans-serif;
  /* ⚠ var(--font-en) 을 그대로 앞에 두면 안 된다.
     --font-en 이 sans-serif 로 끝나는데, 제네릭은 모든 글자에 매칭되므로
     그 뒤의 --font-kr(S-Core Dream) 에 영영 도달하지 못한다.
     실제로 2026-07-15 이전까지 한글 본문이 S-Core Dream 이 아니라 시스템
     기본 산세리프로 렌더되고 있었다(실측 확인). 그래서 여기서는 영문 스택을
     제네릭 없이 직접 나열하고, 마지막 제네릭은 --font-kr 이 담당하게 한다. */
  --font-primary:
    "Century Gothic", "CenturyGothic", "AppleGothic", var(--font-kr);
  --font-size-base: 15px;
  --font-size-sm: 13px;
  --font-size-lg: 18px;
  --font-size-xl: 24px;
  --font-size-2xl: 32px;
  --font-size-hero: 42px;
  --line-height: 1.6;
  --letter-spacing-logo: 6px;
  --letter-spacing-heading: 3px;

  /* Layout */
  --max-width: 1200px;
  --max-width-wide: 1200px;
  --header-height: 70px;
  --section-padding: 80px;
  --grid-gap: 20px;

  /* Transitions */
  --transition: 0.3s ease;
}