/* =============================================================
   Agence Mantu — LP AI Workflow Automation
   Design tokens (source : Mantu Design System 2026)
   Aucune couleur en dur ailleurs que dans ce fichier.
   ============================================================= */

:root {
  /* ---------- Marque ---------- */
  --purple:        #2B0058; /* Mantu Purple 2026, accent maître */
  --purple-ink:    #17101A; /* bas des dégradés sombres */
  --purple-black:  #1A0038; /* footer / bas de page */
  --purple-600:    #4E2BCD; /* survols, erreurs */
  --purple-500:    #5B2BC4;
  --purple-400:    #905BF4; /* labels de section, halos */
  --purple-300:    #A368E8;
  --pink:          #FFD6FF; /* capsule / highlight / accents */
  --pink-light:    #FFF9FE; /* off-white éditorial, fonds de carte */
  --white:         #FFFFFF;

  /* ---------- Neutres ---------- */
  --grey-900: #1F1F1F;
  --grey-700: #2D2D2D;
  --grey-500: #545454;
  --grey-300: #BDBDBD;
  --grey-100: #DCDCDC;
  --grey-50:  #EFEFEF;
  --grey-25:  #F8F8F8;

  /* ---------- Gris teintés violet (bordures, textes doux) ---------- */
  --line:       #ECE7F3; /* bordure de carte sur clair */
  --line-2:     #E3DAF0;
  --muted-ink:  #6E6285; /* texte secondaire violacé */
  --muted-ink-2:#9A8FB0;
  --tint:       #FAF6FD; /* fond très clair (rail, options) */
  --tint-hover: #F3ECFB; /* survol clair */

  /* ---------- Surfaces sémantiques ---------- */
  --bg:            #F1EEF6; /* fond de page */
  --surface:       var(--white);
  --surface-tint:  var(--pink-light);
  --surface-soft:  var(--grey-25);

  /* ---------- Textes sémantiques ---------- */
  --text:        var(--grey-900);
  --text-soft:   var(--grey-500);
  --accent-ink:  #7A3FD4; /* texte violet accessible (contraste AA sur clair) */
  --on-dark:            rgba(255, 255, 255, 1);
  --on-dark-80:         rgba(255, 255, 255, 0.82);
  --on-dark-65:         rgba(255, 255, 255, 0.66);
  --on-dark-50:         rgba(255, 255, 255, 0.50);
  --on-dark-hairline:   rgba(255, 255, 255, 0.10);
  --on-dark-border:     rgba(255, 255, 255, 0.16);

  /* ---------- Verre translucide (sur fond sombre) ---------- */
  --glass-04:         rgba(255, 255, 255, 0.04);
  --glass-06:         rgba(255, 255, 255, 0.06);
  --pink-glass:       rgba(255, 214, 255, 0.16);
  --pink-glass-border:rgba(255, 214, 255, 0.40);

  /* ---------- Teintes du diagnostic / enrichissement ---------- */
  --surface-2:     #EEEDF3; /* bloc détaché du diagnostic */
  --surface-bonus: #F8F4FB;
  --line-bonus:    #F0E8F6;
  --tint-select:   #FAF5FF; /* option sélectionnée */
  --purple-metric: #7A3FD4;

  /* ---------- Dégradés & halos ---------- */
  --gradient-dark:  linear-gradient(160deg, var(--purple) 0%, var(--purple-ink) 100%);
  --gradient-case:  linear-gradient(120deg, var(--purple) 0%, #3D1170 100%);
  --gradient-metric:linear-gradient(90deg, var(--purple-500), var(--purple-300));
  --halo-purple:    radial-gradient(ellipse, rgba(144, 91, 244, 0.42) 0%, rgba(43, 0, 88, 0) 65%);
  --halo-circle:    radial-gradient(circle, rgba(144, 91, 244, 0.50), transparent 70%);

  /* ---------- Typographie ---------- */
  --font-sans:      'Space Grotesk', 'Helvetica Neue', Arial, sans-serif;
  --font-editorial: 'Flecha M', Georgia, serif;

  --fw-light:   300;
  --fw-regular: 400;
  --fw-medium:  500;
  --fw-bold:    700;

  /* ---------- Rayons ---------- */
  --radius-sm:   10px;
  --radius-md:   12px;
  --radius-lg:   16px;
  --radius-xl:   24px;
  --radius-pill: 1000px;

  /* ---------- Espacements ---------- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 40px;
  --space-7: 80px;

  /* ---------- Ombres ---------- */
  --shadow-card:  0 6px 22px rgba(23, 16, 26, 0.10);
  --shadow-float: 0 18px 50px rgba(43, 0, 88, 0.35);
  --shadow-pop:   0 16px 40px rgba(23, 16, 26, 0.20);

  /* ---------- Voiles de modale (overlay) ---------- */
  --scrim:      rgba(23, 16, 26, 0.55);
  --scrim-diag: linear-gradient(160deg, rgba(43, 0, 88, 0.94), rgba(23, 16, 26, 0.96));

  /* ---------- Layout ---------- */
  --shell-max: 1320px;
  --shell-pad: clamp(14px, 3vw, 30px);
  --hero-h:    440px;

  /* ---------- Motion ---------- */
  --ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 160ms;
  --dur-base: 240ms;
  --dur-slow: 480ms;
}