/* Design Tokens */
:root {
  /* Brand Palette */
  --color-primary: #0A2463;
  --color-primary-light: #15337B;
  --color-secondary: #1E3888;
  --color-accent: #3E92CC;
  --color-gold: #D4AF37;
  --color-ink: #1A1D23;
  --color-text: #21242C;
  --color-text-soft: #495064;
  --color-text-muted: #80879A;
  --color-border: rgba(13, 34, 83, 0.08);
  --color-border-strong: rgba(13, 34, 83, 0.16);
  --color-background: #FFFFFF;
  --color-surface: #F7F8FB;
  --color-surface-alt: #EFF2F9;
  --color-overlay: rgba(10, 36, 99, 0.08);
  --color-success: #3BA776;
  --color-danger: #E45858;

  /* Typography */
  --font-primary: 'Playfair Display', serif;
  --font-secondary: 'Inter', sans-serif;
  --font-accent: 'Montserrat', sans-serif;

  --font-size-display: clamp(40px, 6vw, 64px);
  --font-size-h1: clamp(32px, 4vw, 48px);
  --font-size-h2: clamp(28px, 3vw, 40px);
  --font-size-h3: clamp(22px, 2vw, 28px);
  --font-size-body-xl: 20px;
  --font-size-body-lg: 18px;
  --font-size-body: 16px;
  --font-size-body-sm: 14px;
  --font-size-caption: 12px;

  --line-height-tight: 1.15;
  --line-height-snug: 1.3;
  --line-height-normal: 1.5;
  --line-height-relaxed: 1.7;

  /* Spacing Scale */
  --space-2xs: 4px;
  --space-xs: 8px;
  --space-sm: 12px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --space-3xl: 64px;
  --space-4xl: 96px;

  /* Radius */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 24px;
  --radius-pill: 999px;

  /* Shadows */
  --shadow-xs: 0 1px 2px rgba(8, 15, 35, 0.08);
  --shadow-sm: 0 6px 18px rgba(8, 15, 35, 0.08);
  --shadow-md: 0 12px 30px rgba(8, 15, 35, 0.12);
  --shadow-lg: 0 20px 50px rgba(8, 15, 35, 0.18);
  --shadow-soft: 0 24px 80px rgba(10, 36, 99, 0.14);

  /* Transitions */
  --transition-fast: 0.18s ease;
  --transition-normal: 0.28s ease;
  --transition-slow: 0.45s ease;

  /* Layout */
  --container-max: 1280px;
  --container-padding: clamp(16px, 4vw, 36px);
  --header-height: 92px;
  --header-z: 120;
  --backdrop-z: 110;
  --drawer-z: 200;
  --overlay-z: 220;
}

body[data-theme="dark"] {
  --color-primary: #3E92CC;
  --color-primary-light: #4EA0D6;
  --color-secondary: #5BA3D4;
  --color-accent: #7BB5E0;
  --color-gold: #D4AF37;
  --color-ink: #0F121B;
  --color-text: #F1F3F9;
  --color-text-soft: #C6CBD7;
  --color-text-muted: #7E8699;
  --color-border: rgba(124, 150, 196, 0.16);
  --color-border-strong: rgba(124, 150, 196, 0.28);
  --color-background: #0B0E16;
  --color-surface: #161B26;
  --color-surface-alt: #1F2432;
  --color-overlay: rgba(62, 146, 204, 0.08);
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.65);
  --shadow-sm: 0 6px 18px rgba(0, 0, 0, 0.45);
  --shadow-md: 0 12px 30px rgba(0, 0, 0, 0.5);
  --shadow-lg: 0 20px 50px rgba(0, 0, 0, 0.55);
  --shadow-soft: 0 24px 80px rgba(62, 146, 204, 0.16);
}

body[data-theme="light"] {
  --color-primary: #0A2463;
  --color-primary-light: #15337B;
  --color-secondary: #1E3888;
  --color-accent: #3E92CC;
  --color-gold: #D4AF37;
  --color-ink: #1A1D23;
  --color-text: #21242C;
  --color-text-soft: #495064;
  --color-text-muted: #80879A;
  --color-border: rgba(13, 34, 83, 0.08);
  --color-border-strong: rgba(13, 34, 83, 0.16);
  --color-background: #FFFFFF;
  --color-surface: #F7F8FB;
  --color-surface-alt: #EFF2F9;
  --color-overlay: rgba(10, 36, 99, 0.08);
  --shadow-xs: 0 1px 2px rgba(8, 15, 35, 0.08);
  --shadow-sm: 0 6px 18px rgba(8, 15, 35, 0.08);
  --shadow-md: 0 12px 30px rgba(8, 15, 35, 0.12);
  --shadow-lg: 0 20px 50px rgba(8, 15, 35, 0.18);
  --shadow-soft: 0 24px 80px rgba(10, 36, 99, 0.14);
}