/* ============================================================================
   CybNodes : DESIGN TOKENS
   Source unique de vérité du style. Aucune règle de composant ici : seulement
   des variables. Les composants (main.css) consomment ces tokens.
   ============================================================================ */

:root {
  /* ---- Couleurs : fond cyberpunk profond ---- */
  --c-bg:          #070a0f;
  --c-bg-soft:     #0a0e16;
  --c-surface:     #0e1420;
  --c-surface-2:   #131a28;
  --c-border:      #1d2738;
  --c-border-lit:  #2b3a52;

  /* ---- Texte ---- */
  --c-text:        #e7edf7;
  --c-text-dim:    #93a3bd;
  --c-text-faint:  #5d6b85;

  /* ---- Néons (la patte) ---- */
  --c-accent:      #00e5ff;   /* cyan loup */
  --c-accent-2:    #b14dff;   /* violet circuit */
  --c-accent-3:    #ff2bd6;   /* magenta rare */
  --c-ok:          #3ce8b0;

  /* ---- Lueurs ---- */
  --glow-accent:   0 0 18px rgba(0, 229, 255, .45);
  --glow-accent-2: 0 0 18px rgba(177, 77, 255, .40);
  --glow-soft:     0 0 40px rgba(0, 229, 255, .10);

  /* ---- Dégradés ---- */
  --grad-accent:   linear-gradient(120deg, var(--c-accent), var(--c-accent-2));
  --grad-text:     linear-gradient(120deg, #00e5ff 0%, #7af0ff 40%, #b14dff 100%);
  --grad-line:     linear-gradient(90deg, transparent, var(--c-accent), transparent);

  /* ---- Typographie ---- */
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", "Cascadia Code", Menlo, monospace;

  --fs-xs:   .8rem;
  --fs-sm:   .9rem;
  --fs-base: 1rem;
  --fs-md:   1.15rem;
  --fs-lg:   1.4rem;
  --fs-xl:   2rem;
  --fs-2xl:  clamp(2.4rem, 6vw, 4.2rem);
  --fs-3xl:  clamp(3rem, 9vw, 6rem);

  --lh-tight: 1.1;
  --lh-body:  1.65;

  /* ---- Espacements ---- */
  --sp-1: .25rem;  --sp-2: .5rem;   --sp-3: .75rem;  --sp-4: 1rem;
  --sp-6: 1.5rem;  --sp-8: 2rem;    --sp-12: 3rem;   --sp-16: 4rem;
  --sp-24: 6rem;   --sp-32: 8rem;

  /* ---- Formes & profondeur ---- */
  --radius:    14px;
  --radius-sm: 9px;
  --radius-lg: 22px;
  --border:    1px solid var(--c-border);
  --shadow:    0 18px 50px rgba(0, 0, 0, .55);

  /* ---- Animation ---- */
  --ease:      cubic-bezier(.2, .7, .2, 1);
  --dur:       .5s;
  --dur-fast:  .25s;

  /* ---- Layout ---- */
  --maxw:    1080px;
  --gutter:  clamp(1.2rem, 4vw, 2.5rem);
}