:root {
  /* === 색상 (Colors) === */
  --color-primary: #1B6DB2;
  --color-primary-dark: #0E4A7A;
  --color-primary-darker: #0A3558;
  --color-primary-light: #E8F2FB;
  --color-primary-gradient: linear-gradient(135deg, #1B6DB2 0%, #0E4A7A 100%);

  --color-accent: #F0A500;
  --color-accent-light: #FFF3D6;

  --color-success: #28a745;
  --color-kakao: #FEE500;
  --color-kakao-text: #3C1E1E;

  --color-text: #222222;
  --color-text-secondary: #555555;
  --color-text-light: #888888;
  --color-text-white: #FFFFFF;

  --color-bg-white: #FFFFFF;
  --color-bg-light: #F5F7FA;
  --color-bg-dark: #1A1D2E;
  --color-bg-footer: #111827;

  --color-border: #E0E0E0;
  --color-border-light: #F0F0F0;

  /* === 폰트 (Typography) === */
  --font-family: 'Pretendard', 'Noto Sans KR', -apple-system, BlinkMacSystemFont, sans-serif;

  /* --- 폰트 크기 체계 (Fluid Typography with clamp) --- */
  /* 히어로 */
  --font-hero-title: clamp(1.75rem, 1rem + 3.5vw, 3.5rem);
  --font-hero-subtitle: clamp(1.125rem, 0.5rem + 2.5vw, 2.5rem);

  /* 섹션 */
  --font-section-title: clamp(1.5rem, 0.9rem + 2.5vw, 2.5rem);
  --font-section-subtitle: clamp(1rem, 0.75rem + 1vw, 1.5rem);

  /* 네비게이션 */
  --font-nav: 1.125rem;

  /* 카드/콘텐츠 */
  --font-card-title: clamp(1.063rem, 0.9rem + 0.5vw, 1.375rem);
  --font-card-desc: 1.0625rem;

  /* 본문 */
  --font-body: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --font-body-sm: 1rem;

  /* 캡션/로고 */
  --font-caption: 0.875rem;
  --font-small: 0.75rem;

  /* --- 폰트 두께 (Font Weight) --- */
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-weight-extrabold: 800;

  /* --- 행간 (Line Height) --- */
  --line-height-tight: 1.3;
  --line-height-normal: 1.6;
  --line-height-relaxed: 1.8;

  /* === 간격 (Spacing) === */
  --container-max-width: 1200px;
  --container-padding: 0 20px;

  --section-padding-y: clamp(40px, 5vw, 80px);
  --section-padding-y-sm: clamp(30px, 4vw, 60px);

  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --space-3xl: 64px;

  /* === 모서리 (Border Radius) === */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-2xl: 24px;
  --radius-full: 9999px;

  /* === 그림자 (Shadows) === */
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.1);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.12);
  --shadow-xl: 0 12px 40px rgba(0,0,0,0.15);
  --shadow-header: 0 2px 8px rgba(0,0,0,0.1);

  /* === 전환 (Transitions) === */
  --transition-fast: 0.15s ease;
  --transition-normal: 0.3s ease;
  --transition-slow: 0.5s ease;

  /* === 헤더 (Header) === */
  --header-height: 70px;
  --header-height-mobile: 60px;

  /* === 플로팅 CTA === */
  --floating-cta-bottom: 20px;
  --floating-cta-size: 56px;
}
