/* ============================================================
   EASYPRINT RÉUNION — DESIGN TOKENS
   Single source of truth. Zero hardcoded values elsewhere.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Syne:wght@400;500;600;700;800&family=Plus+Jakarta+Sans:wght@400;500;600;700&family=Inter:wght@400;500;600&family=Space+Grotesk:wght@400;500;600&display=swap');

:root {

  /* ── PALETTE ──────────────────────────────────────────────── */
  --ep-ink:           #0A1628;
  --ep-ink-deep:      #050D1A;
  --ep-electric:      #258EEA;
  --ep-electric-glow: #4DAED8;
  --ep-azur:          #00D4FF;
  --ep-flame:         #FF6B35;
  --ep-flame-soft:    #FFA07A;
  --ep-pearl:         #F5F7FA;
  --ep-cloud:         #FFFFFF;
  --ep-steel:         #8898AA;
  --ep-graphite:      #2D3748;

  /* ── SEMANTIC ALIASES ─────────────────────────────────────── */
  --ep-bg:            var(--ep-ink);
  --ep-surface:       rgba(255, 255, 255, 0.03);
  --ep-surface-hover: rgba(255, 255, 255, 0.06);
  --ep-border:        rgba(37, 142, 234, 0.15);
  --ep-border-hover:  rgba(37, 142, 234, 0.60);
  --ep-text:          var(--ep-cloud);
  --ep-text-secondary:var(--ep-steel);
  --ep-accent:        var(--ep-electric);
  --ep-cta:           var(--ep-flame);

  /* ── GRADIENTS ────────────────────────────────────────────── */
  --ep-grad-hero:     linear-gradient(135deg, #050D1A 0%, #0A1628 50%, #133A6B 100%);
  --ep-grad-electric: linear-gradient(135deg, #258EEA 0%, #4DAED8 100%);
  --ep-grad-flame:    linear-gradient(135deg, #FF6B35 0%, #FFA07A 100%);
  --ep-grad-text:     linear-gradient(135deg, var(--ep-electric) 0%, var(--ep-azur) 100%);

  /* ── TYPOGRAPHY ───────────────────────────────────────────── */
  --ep-font-display:  'Syne', sans-serif;
  --ep-font-heading:  'Plus Jakarta Sans', sans-serif;
  --ep-font-body:     'Inter', sans-serif;
  --ep-font-mono:     'Space Grotesk', monospace;

  /* ── TYPE SCALE (ratio 1.25) ──────────────────────────────── */
  --ep-text-xs:    0.75rem;
  --ep-text-sm:    0.875rem;
  --ep-text-base:  1rem;
  --ep-text-lg:    1.125rem;
  --ep-text-xl:    1.5rem;
  --ep-text-2xl:   2rem;
  --ep-text-3xl:   2.5rem;
  --ep-text-4xl:   3.5rem;
  --ep-text-hero:  clamp(2.5rem, 6vw, 5.5rem);

  /* ── LINE HEIGHT ──────────────────────────────────────────── */
  --ep-lh-tight:   1.15;
  --ep-lh-snug:    1.35;
  --ep-lh-normal:  1.5;
  --ep-lh-relaxed: 1.65;

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

  /* ── SHADOWS ──────────────────────────────────────────────── */
  --ep-shadow-sm:       0 2px 8px rgba(10, 22, 40, 0.08);
  --ep-shadow-md:       0 8px 24px rgba(10, 22, 40, 0.12);
  --ep-shadow-lg:       0 20px 60px rgba(10, 22, 40, 0.20);
  --ep-glow-electric:   0 0 40px rgba(37, 142, 234, 0.35);
  --ep-glow-flame:      0 0 32px rgba(255, 107, 53, 0.30);
  --ep-glow-azur:       0 0 20px rgba(0, 212, 255, 0.50);
  --ep-glow-azur-line:  0 0 12px rgba(0, 212, 255, 0.60);

  /* ── BORDER RADIUS ────────────────────────────────────────── */
  --ep-radius-xs:   4px;
  --ep-radius-sm:   8px;
  --ep-radius-md:   14px;
  --ep-radius-lg:   24px;
  --ep-radius-xl:   32px;
  --ep-radius-full: 9999px;

  /* ── MOTION ───────────────────────────────────────────────── */
  --ep-ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ep-ease-in:     cubic-bezier(0.7, 0, 0.84, 0);
  --ep-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ep-ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);

  --ep-duration-fast:   150ms;
  --ep-duration-normal: 250ms;
  --ep-duration-slow:   400ms;
  --ep-duration-xslow:  700ms;

  /* ── LAYOUT ───────────────────────────────────────────────── */
  --ep-container:      1280px;
  --ep-container-sm:   900px;
  --ep-nav-height:     72px;
  --ep-section-py:     clamp(4rem, 8vw, 7rem);

  /* ── Z-INDEX ──────────────────────────────────────────────── */
  --ep-z-base:    1;
  --ep-z-card:    10;
  --ep-z-sticky:  100;
  --ep-z-overlay: 200;
  --ep-z-modal:   300;
  --ep-z-toast:   400;

  /* ── PRECISION LINE (signature) ───────────────────────────── */
  --ep-line-color:     rgba(0, 212, 255, 0.85);
  --ep-line-glow:      0 0 12px rgba(0, 212, 255, 0.55),
                       0 0 28px rgba(0, 212, 255, 0.25);
  --ep-line-thickness: 1px;
}
