/* nst design tokens — source unique de la charte NST.
   Importé par le brand book, la landing et tous les écrans de l'app.
   Palette : noir #0A0A0A, blanc #FAFAFA, rouge NST #EA4363. Dark only.
   Police : Inter (titrage en italique gras, cohérent avec le logo). */

:root {
  /* Couleurs de marque */
  --nst-black:      #0A0A0A;
  --nst-white:      #FAFAFA;
  --nst-red:        #EA4363;
  --nst-red-press:  #D23354;   /* état actif, jamais pour du texte courant */

  /* Surfaces (dark only), construites par paliers de clarté, sans dégradé */
  --bg:        #0A0A0A;
  --surface-1: #141416;
  --surface-2: #1B1B1E;
  --surface-3: #232327;

  /* Texte et lignes (blanc à opacités décroissantes) */
  --text:        rgba(250,250,250,0.96);
  --text-muted:  rgba(250,250,250,0.60);
  --text-faint:  rgba(250,250,250,0.38);
  --line:        rgba(250,250,250,0.10);
  --line-strong: rgba(250,250,250,0.18);

  /* Typographie */
  --font: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --tracking-tight: -0.02em;
  --tracking-flat:  -0.01em;
  --tracking-caps:   0.08em;

  /* Échelle de corps (mobile-first, base 390px) */
  --t-display: 600 clamp(40px, 11vw, 72px)/0.96 var(--font);
  --t-h1:      600 clamp(28px, 7vw, 40px)/1.04 var(--font);
  --t-h2:      600 22px/1.12 var(--font);
  --t-h3:      600 17px/1.2  var(--font);
  --t-body:    400 15px/1.5  var(--font);
  --t-small:   400 13px/1.45 var(--font);
  --t-caption: 600 11px/1.2  var(--font);   /* + letter-spacing caps + uppercase */

  /* Espacements, base 4 */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px;
  --s-5: 20px; --s-6: 24px; --s-8: 32px; --s-10: 40px; --s-12: 48px; --s-16: 64px;

  /* Rayons */
  --r-sm: 8px; --r-md: 14px; --r-lg: 22px; --r-xl: 28px; --r-pill: 999px;

  /* Élévation : neutre, jamais d'ombre colorée */
  --elev-1: 0 1px 0 rgba(250,250,250,0.04) inset, 0 8px 24px rgba(0,0,0,0.45);

  /* Mouvement : court, athlétique */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-1: 120ms; --dur-2: 200ms; --dur-3: 320ms;
}

/* Primitives réutilisables */
.nst-caps {
  font: var(--t-caption);
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
  color: var(--text-muted);
}
.nst-accent { color: var(--nst-red); }
.nst-em { font-style: italic; font-weight: 600; }  /* emphase, façon logo */
