:root {
  /* =========================================
     CORES PRIMITIVAS
     ========================================= */
  /* Midnight Blue (Primary)*/
  --midnight-blue-50: #F5F7F9;
  --midnight-blue-100: #E6EBF0;
  --midnight-blue-200: #C7D3DE;
  --midnight-blue-300: #9AAEC3;
  --midnight-blue-400: #5B7C9D;
  --midnight-blue-500: #023568;
  --midnight-blue-600: #022D58;
  --midnight-blue-700: #012549;
  --midnight-blue-800: #011B34;
  --midnight-blue-900: #01101F;

  /* Gold (Secondary) */
  --gold-50: #FCFAF7;
  --gold-100: #F7F2EA;
  --gold-200: #EDE2D2;
  --gold-300: #DFCBAD;
  --gold-400: #CAAA7A;
  --gold-500: #AE7D32;
  --gold-600: #946A2A;
  --gold-700: #7A5723;
  --gold-800: #573E19;
  --gold-900: #34250F;

  /* Neutral (Base) */
  --neutral-50: #F9F9F9;
  --neutral-100: #F1F1F1;
  --neutral-200: #E2E2E2;
  --neutral-300: #C8C8C8;
  --neutral-400: #A0A0A0;
  --neutral-500: #757575;
  --neutral-600: #565656;
  --neutral-700: #3E3E3E;
  --neutral-800: #272727;
  --neutral-900: #111111;

  /* Feedback & Base */
  --color-success: #228B44;
  --color-warning: #E0A825;
  --color-error: #CC2E2E;
  --color-info: #2E75CA;
  --color-white: #FFFFFF;
  --color-black: #000000;

  /* =========================================
     TOKENS SEMÂNTICOS (Exemplo de mapeamento Light/Dark)
     ========================================= */
  --bg-primary: var(--color-white);
  --bg-secondary: var(--midnight-blue-50);
  --text-primary: var(--neutral-900);
  --text-inverse: var(--color-white);
  --brand-primary: var(--midnight-blue-500);
  --brand-secondary: var(--gold-500);

  /* =========================================
     ESPAÇAMENTO
     ========================================= */
  --spacing-2xs: 2px;
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 12px;
  --spacing-lg: 16px;
  --spacing-xl: 24px;
  --spacing-2xl: 32px;
  --spacing-3xl: 48px;
  --spacing-4xl: 64px;
  --spacing-5xl: 96px;

  /* =========================================
     BORDER RADIUS
     ========================================= */
  --radius-none: 0px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-2xl: 24px;
  --radius-full: 999px;

  /* =========================================
     TIPOGRAFIA (Família Figtree)
     ========================================= */
  --font-family-base: 'Figtree', sans-serif;
  
  --font-size-display: 60px;
  --line-height-display: 68px;
  --font-weight-display: 700; /* Bold */

  --font-size-h1: 48px;
  --line-height-h1: 56px;
  --font-weight-h1: 700; /* Bold */

  --font-size-h2: 36px;
  --line-height-h2: 44px;
  --font-weight-h2: 600; /* SemiBold */

  --font-size-h3: 30px;
  --line-height-h3: 38px;
  --font-weight-h3: 600; /* SemiBold */

  --font-size-body: 16px;
  --line-height-body: 24px;
  --font-weight-body: 400; /* Regular */
}