/* ═══════════════════════════════════════════
   Design Tokens — 닥터바이블 MC Press
   Mayo Clinic Press 기반 디자인 시스템
   ═══════════════════════════════════════════ */

:root {
  /* ── Primary Blues ── */
  --color-primary:       #0057b8;
  --color-primary-dark:  #004395;
  --color-primary-light: #009cde;

  /* ── Accent Colors ── */
  --color-accent:     #9cdbd9;
  --color-green:      #00873e;
  --color-purple:     #8246af;
  --color-red:        #e4002b;
  --color-orange:     #fe5000;
  --color-amber:      #ffc845;

  /* ── Neutrals ── */
  --color-black:  #000000;
  --color-white:  #ffffff;
  --color-bg:     #ffffff;
  --color-bg-dark:    #eff0f0;
  --color-bg-darker:  #e1e3e5;

  /* ── Borders / Contrast ── */
  --color-contrast-low:    #d9d9d6;
  --color-contrast-medium: #c8c8c8;
  --color-contrast-high:   #a2a8af;

  /* ── Semantic ── */
  --color-meta: rgba(0, 0, 0, 0.65);
  --color-overlay: rgba(0, 0, 0, 0.55);
  --color-overlay-dark: rgba(0, 0, 0, 0.8);
  --color-warning: #ffc845;
  --color-success: #00873e;
  --color-error:   #e4002b;

  /* ── Typography ── */
  --font-sans:          Inter, Pretendard, "Noto Sans KR", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-serif:         "Source Serif 4", "Noto Serif KR", Georgia, serif;
  --font-serif-display: "Playfair Display", "Noto Serif KR", Georgia, serif;

  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold:   700;

  /* ── Font Size Scale ── */
  --text-sm:   0.875rem;   /* 14px */
  --text-base: 1rem;       /* 16px */
  --text-md:   1.125rem;   /* 18px */
  --text-lg:   1.75rem;    /* 28px */

  /* ── Heading Scale (mobile-first) ── */
  --heading-xs:  1rem;
  --heading-sm:  1.25rem;
  --heading-md:  1.375rem;
  --heading-lg:  2rem;
  --heading-xl:  2.375rem;
  --heading-xxl: 3rem;

  /* ── Line Heights ── */
  --line-height-tight: 1.2;
  --line-height-base:  1.5;
  --line-height-snug:  1.3;
  --line-height-heading: 1.15;

  /* ── Spacing Scale ── */
  --space-xxxs: 0.125rem;
  --space-xxs:  0.25rem;
  --space-xs:   0.5rem;
  --space-sm:   0.75rem;
  --space-base: 1rem;
  --space-md:   1.5rem;
  --space-lg:   2rem;
  --space-xl:   2.5rem;
  --space-xxl:  3rem;
  --space-xxxl: 4rem;
  --space-xxxxl: 5rem;

  /* ── Layout ── */
  --container-width: 80rem;
  --gap: 1.5rem;
  --component-padding: 1rem;

  /* ── Z-Index ── */
  --z-header:  100;
  --z-drawer:  200;
  --z-overlay: 300;
  --z-popover: 10;

  /* ── Transitions ── */
  --transition-fast: 0.15s ease;
  --transition-base: 0.3s ease;
  --transition-slow: 0.5s ease;

  /* ── Borders ── */
  --border-section: 2px solid var(--color-black);
  --border-light: 1px solid var(--color-contrast-low);
  --radius-none: 0;
  --radius-round: 50%;
}

/* ── Desktop Heading Scale Override ── */
@media (min-width: 64rem) {
  :root {
    --heading-md:  1.5rem;
    --heading-lg:  2.5rem;
    --heading-xl:  3rem;
    --heading-xxl: 3.875rem;
  }
}