/* Design tokens : ariane-cosmetics.com, thème « Nuit » (2026-10-07)
   Même palette que l'app Ariane Beauty Club (ariane-mobile lib/theme.ts) :
   marine nuit, ivoire, or champagne. Décision de Mehdi : la landing promeut
   l'app et adopte son thème sombre, sans variante claire.

   tokens.css reste la SEULE source de vérité des couleurs : aucune couleur
   littérale ailleurs (test/public/palette.test.js), sauf le fond blanc des QR.

   Règles (ratios WCAG vérifiés par le test) :
   1. Texte courant en --ink ou --muted, jamais en or décoratif.
   2. L'or des textes est --gold-text ; --gold sert aux remplissages (boutons)
      avec un texte --on-gold.
   3. L'élévation se lit au filet (--line) et à la surface, pas à l'ombre seule. */

:root {
  color-scheme: dark;

  --bg:           #0B1530;   /* page */
  --surface:      #111D3E;   /* panneaux */
  --surface-high: #18264F;   /* champs, cartes en relief */
  --line:         #26335A;   /* filets */
  --line-gold:    #6B5A35;   /* filets dorés discrets */

  --ink:          #F3EEE6;   /* texte principal */
  --muted:        #AEB4C6;   /* texte secondaire */
  --gold:         #D2B06A;   /* remplissages : bouton principal, jauges */
  --gold-text:    #D9BC7E;   /* or en texte et en trait */
  --on-gold:      #0B1530;   /* texte sur remplissage or */
  --success:      #7CCB9C;
  --error:        #F09A8E;
  --qr-white:     #FFFFFF;   /* fond des QR uniquement (lisibilité) */

  --scrim:        rgba(11, 21, 48, 0.72);
  --gold-wash:    rgba(210, 176, 106, 0.12);
  --shadow-deep:  0 30px 60px -24px rgba(3, 7, 18, 0.75);

  --font-display: 'Cormorant Garamond', 'Times New Roman', serif;
  --font-body:    'Jost', system-ui, sans-serif;

  --radius:       16px;      /* cartes, visuels */
  --radius-pill:  999px;     /* boutons, champs */
  --wrap:         1180px;
}