:root {
  /* === PALETTE PRINCIPALE === */
  --color-primary:        #6B2D8B;   /* Violet principal */
  --color-primary-dark:   #3D1A5C;   /* Violet profond (hero, header, footer) */
  --color-primary-light:  #9B59C4;   /* Violet clair (hover, gradients) */
  --color-accent:         #E91E8C;   /* Rose/Magenta (CTA, badges, icônes) */
  --color-accent-light:   #F06CB5;   /* Rose clair (hover sur accent) */

  /* === NEUTRES === */
  --color-white:          #FFFFFF;
  --color-bg-light:       #F8F5FC;   /* Fond sections claires (violet très pâle) */
  --color-bg-card:        #FFFFFF;   /* Fond des cards */
  --color-text-dark:      #1A1A2E;   /* Texte principal */
  --color-text-body:      #3D3D5C;   /* Texte secondaire */
  --color-text-muted:     #7A7A9A;   /* Texte grisé, légendes */
  --color-border:         #E8E0F0;   /* Bordures légères */

  /* === DÉGRADÉS === */
  --gradient-hero:        linear-gradient(135deg, #3D1A5C 0%, #6B2D8B 60%, #9B59C4 100%);
  --gradient-cta:         linear-gradient(135deg, #6B2D8B 0%, #E91E8C 100%);
  --gradient-card:        linear-gradient(180deg, rgba(107, 45, 139, 0.05) 0%, rgba(107, 45, 139, 0) 100%);

  /* === ÉTATS === */
  --color-success:        #27AE60;
  --color-error:          #E74C3C;
  --color-warning:        #F39C12;

  /* === TYPOGRAPHIE === */
  /* === FAMILLES === */
  --font-display:   'Playfair Display', Georgia, serif;
  --font-body:      'DM Sans', 'Inter', system-ui, sans-serif;
  --font-accent:    'Dancing Script', cursive;

  /* === ÉCHELLE DE TAILLES === */
  --text-xs:    0.75rem;    /*  12px */
  --text-sm:    0.875rem;   /*  14px */
  --text-base:  1rem;       /*  16px */
  --text-lg:    1.125rem;   /*  18px */
  --text-xl:    1.25rem;    /*  20px */
  --text-2xl:   1.5rem;     /*  24px */
  --text-3xl:   1.875rem;   /*  30px */
  --text-4xl:   2.25rem;    /*  36px */
  --text-5xl:   3rem;       /*  48px */
  --text-6xl:   3.75rem;    /*  60px */

  /* === POIDS === */
  --weight-regular:   400;
  --weight-medium:    500;
  --weight-semibold:  600;
  --weight-bold:      700;
  --weight-extrabold: 800;

  /* === HAUTEURS DE LIGNE === */
  --leading-tight:    1.2;
  --leading-snug:     1.35;
  --leading-normal:   1.5;
  --leading-relaxed:  1.7;
  --leading-loose:    2;

  /* === ESPACEMENT LETTRES === */
  --tracking-tight:   -0.02em;
  --tracking-normal:  0;
  --tracking-wide:    0.05em;
  --tracking-wider:   0.1em;
  --tracking-widest:  0.2em;

  /* === ESPACEMENT (Spacing Scale) === */
  --space-1:    0.25rem;   /*  4px */
  --space-2:    0.5rem;    /*  8px */
  --space-3:    0.75rem;   /* 12px */
  --space-4:    1rem;      /* 16px */
  --space-5:    1.25rem;   /* 20px */
  --space-6:    1.5rem;    /* 24px */
  --space-8:    2rem;      /* 32px */
  --space-10:   2.5rem;    /* 40px */
  --space-12:   3rem;      /* 48px */
  --space-16:   4rem;      /* 64px */
  --space-20:   5rem;      /* 80px */
  --space-24:   6rem;      /* 96px */
  --space-32:   8rem;      /* 128px */

  /* Sections */
  --section-padding-y:  var(--space-20);
  --section-padding-x:  var(--space-6);

  /* Container */
  --container-max:      1200px;
  --container-padding:  var(--space-6);

  /* === BORDURES ET ARRONDIS === */
  --radius-sm:    0.375rem;  /*  6px */
  --radius-md:    0.75rem;   /* 12px */
  --radius-lg:    1rem;      /* 16px */
  --radius-xl:    1.5rem;    /* 24px */
  --radius-2xl:   2rem;      /* 32px */
  --radius-full:  9999px;    /* Pill shape */

  --border-thin:  1px solid var(--color-border);
  --border-card:  1px solid rgba(107, 45, 139, 0.1);

  /* === OMBRES === */
  --shadow-sm:    0 1px 3px rgba(61, 26, 92, 0.08);
  --shadow-md:    0 4px 16px rgba(61, 26, 92, 0.12);
  --shadow-lg:    0 8px 32px rgba(61, 26, 92, 0.16);
  --shadow-xl:    0 16px 48px rgba(61, 26, 92, 0.20);
  --shadow-glow:  0 0 32px rgba(107, 45, 139, 0.3);  /* Glow violet pour highlights */
  --shadow-card:  0 2px 12px rgba(61, 26, 92, 0.08), 0 1px 3px rgba(61, 26, 92, 0.04);

  /* === TRANSITIONS ET ANIMATIONS === */
  /* Durées */
  --duration-fast:    150ms;
  --duration-normal:  300ms;
  --duration-slow:    500ms;
  --duration-slower:  800ms;

  /* Easings */
  --ease-default:   cubic-bezier(0.4, 0, 0.2, 1);
  --ease-in:        cubic-bezier(0.4, 0, 1, 1);
  --ease-out:       cubic-bezier(0, 0, 0.2, 1);
  --ease-bounce:    cubic-bezier(0.34, 1.56, 0.64, 1);

  /* Transitions communes */
  --transition-base:    all var(--duration-normal) var(--ease-default);
  --transition-colors:  color var(--duration-fast) var(--ease-default),
                        background-color var(--duration-fast) var(--ease-default),
                        border-color var(--duration-fast) var(--ease-default);
  --transition-transform: transform var(--duration-normal) var(--ease-bounce);

  /* === Z-INDEX === */
  --z-below:    -1;
  --z-base:      0;
  --z-raised:   10;
  --z-dropdown: 100;
  --z-sticky:   200;
  --z-overlay:  300;
  --z-modal:    400;
  --z-toast:    500;
  --z-whatsapp: 999;
}
