/* ============================================================
   TC Dépannage — tokens alignés sur le design system DCR
   Noir profond · platine · blanc cassé + rouge signal TC
   ============================================================ */

:root {
  /* ─── Palette de base ─── */
  --ink:         #121316;
  --ink-90:      #181A1E;
  --ink-80:      #26282D;
  --ink-60:      #4A4C50;
  --ink-40:      #74787F;
  --ink-30:      #9A9EA6;
  --ink-20:      #C4C7CC;
  --ink-10:      #D5D5D7;
  --ink-05:      #EBEAE6;
  --paper:       #F3F2EF;
  --paper-warm:  #EBEAE6;
  --plat:        #9A9EA6;
  --plat-d:      #74787F;
  --plat-l:      #C4C7CC;
  --line:        #D5D5D7;

  /* ─── Alias DCR ─── */
  --maniaci:     #9A9EA6;
  --maniaci-50:  #F3F2EF;
  --maniaci-100: #EBEAE6;
  --maniaci-200: #D5D5D7;
  --maniaci-400: #C4C7CC;
  --maniaci-600: #74787F;
  --maniaci-800: #26282D;
  --maniaci-900: #121316;

  /* ─── Accent TC Dépannage : rouge signal urgence ─── */
  --gold:        #C1272D;      /* alias — permet de réutiliser tel quel les CSS partagés */
  --gold-soft:   rgba(193, 39, 45, 0.14);
  --gold-line:   rgba(193, 39, 45, 0.42);
  --signal:      #C1272D;      /* nom sémantique du business */
  --signal-hot:  #E63946;      /* variante plus vive pour hover / pulse */
  --signal-dark: #5A0A0F;

  /* ─── Typographies ─── */
  --font-display: "Space Grotesk", "SF Pro Display", system-ui, sans-serif;
  --font-body:    "Geist", system-ui, -apple-system, sans-serif;
  --font-mono:    "JetBrains Mono", "SF Mono", Menlo, monospace;
  --font-serif:   "Cormorant Garamond", Georgia, serif;

  /* ─── Échelle typo ─── */
  --fs-xs:   11px;
  --fs-sm:   13px;
  --fs-base: 15px;
  --fs-md:   17px;
  --fs-lg:   21px;
  --fs-xl:   26px;
  --fs-2xl:  clamp(30px, 4vw, 42px);
  --fs-3xl:  clamp(34px, 4.4vw, 58px);
  --fs-4xl:  clamp(48px, 7vw, 96px);
  --fs-hero: clamp(52px, 7.4vw, 112px);

  /* ─── Layout ─── */
  --container: 1280px;
  --gutter:    clamp(20px, 4vw, 56px);

  /* ─── Radius / Motion ─── */
  --r-xs: 4px;
  --r-sm: 8px;
  --r-md: 12px;
  --r-card: 14px;
  --r-lg: 24px;
  --r-full: 999px;
  --shadow-pop: 4px 4px 0 0 var(--ink);
  --shadow-pop-signal: 4px 4px 0 0 var(--signal-dark);
  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
}