/* ============================================================================
   tokens.css — Taller Cano y García (Manzanares)
   Identidad: "Industrial Garage" · Neo-Brutalism + Heritage automotriz.
   Paleta de marca BLOQUEADA (sacada del logo): rojo #E43137 · negro · blanco.
   Mood: asfalto, chapa, grasa honrada. Tipografía condensada pesada.
   ========================================================================== */
:root{
  /* ---- PALETA (marca bloqueada: rojo + negro + blanco + grises asfalto) ---- */
  --bg:        #131315;   /* asfalto / fondo página            */
  --surface:   #1b1b1e;   /* tarjetas / paneles                */
  --surface-2: #242428;   /* segundo nivel / hover             */
  --text:      #f5f1ea;   /* blanco cálido principal           */
  --muted:     #a7a29a;   /* texto secundario (humo)           */
  --line:      rgba(255,255,255,.11); /* bordes/divisores       */
  --accent:    #e43137;   /* ROJO de marca (exacto del logo)   */
  --accent-2:  #b3242a;   /* rojo profundo (sombras/gradiente) */
  --accent-ink:#ffffff;   /* texto SOBRE el rojo               */
  --steel:     #cfd2d6;   /* cromo/acero para detalles fríos   */
  --footer-bg: #0d0d0e;
  --footer-text:#cfcbc3;

  /* Hazard / energía visual */
  --hazard-a: #131315;    /* banda diagonal oscura  */
  --hazard-b: #e43137;    /* banda diagonal roja    */

  /* ---- TIPOGRAFÍA ---------------------------------------------------------- */
  /* Display: Anton (condensada, caps, peso brutal). Texto: Barlow.            */
  /* Etiquetas/cifras: Barlow Semi Condensed.                                  */
  --font-display: "Anton", "Arial Narrow", system-ui, sans-serif;
  --font-body:    "Barlow", system-ui, -apple-system, sans-serif;
  --font-cond:    "Barlow Semi Condensed", "Barlow", system-ui, sans-serif;
  --font-mono:    ui-monospace, "JetBrains Mono", monospace;

  /* escala fluida (clamp: min, ideal-vw, max) — más grande para impacto */
  --fs-900: clamp(2.9rem, 8.5vw, 6.4rem);  /* display hero   */
  --fs-800: clamp(2.1rem, 5vw, 3.8rem);    /* h2 sección     */
  --fs-700: clamp(1.45rem, 2.8vw, 2.1rem); /* h3             */
  --fs-600: 1.2rem;                         /* lead           */
  --fs-500: 1.0625rem;                      /* body           */
  --fs-400: .9375rem;                       /* small          */
  --fs-300: .8125rem;                       /* caption/label  */
  --lh-tight: .98;
  --lh-snug:  1.25;
  --lh-body:  1.62;
  --tracking-label: .22em;                  /* mayúsculas muy espaciadas */
  --weight-display: 400;                    /* Anton solo tiene 400 */
  --weight-strong: 700;

  /* ---- ESPACIADO / RITMO --------------------------------------------------- */
  --space-1:.5rem; --space-2:1rem; --space-3:1.5rem; --space-4:2rem;
  --space-5:3rem;  --space-6:4.5rem; --space-7:7rem; --space-8:10rem;
  --container: 1200px;
  --gutter: clamp(1.25rem, 4vw, 3rem);
  --section-y: clamp(4rem, 9vw, 8rem);

  /* ---- FORMA (industrial = esquinas duras, no blandas) --------------------- */
  --radius-sm:3px; --radius:5px; --radius-lg:8px; --radius-pill:4px;
  --border:1px solid var(--line);
  --border-hard:2px solid #000;
  --shadow-sm:0 2px 8px -4px rgba(0,0,0,.6);
  --shadow:   0 18px 40px -22px rgba(0,0,0,.7);
  --shadow-lg:0 40px 80px -30px rgba(0,0,0,.75);
  --shadow-hard: 7px 7px 0 #000;            /* sombra dura neo-brutalist */
  --shadow-hard-red: 7px 7px 0 var(--accent);

  /* ---- MOVIMIENTO ---------------------------------------------------------- */
  --ease: cubic-bezier(.22,1,.36,1);
  --ease-inout: cubic-bezier(.76,0,.24,1);
  --dur-fast:.22s; --dur:.45s; --dur-slow:.8s;

  /* ---- CAPAS --------------------------------------------------------------- */
  --z-nav:50; --z-overlay:80; --z-modal:100;
}