/*
  Design tokens — SD Electric S.L.
  Colores extraídos del logotipo real de la empresa (azul acero + ámbar del rayo).
  Cambiar la marca = cambiar estas variables. No se repiten valores sueltos en el resto del CSS.
*/
:root {
  /* Azules de marca — muestreados directamente de los píxeles de vuestro logo real */
  --color-navy-900: #0d2540;
  --color-navy-800: #103868;
  --color-blue-700: #1c6090;
  --color-blue-600: #2472b8;
  --color-blue-500: #3e8dce;
  --color-blue-100: #e8f0f8;

  /* Ámbar de marca — muestreado del rayo del logo */
  --color-amber-500: #daa815;
  --color-amber-600: #b8860b;
  --color-amber-100: #faf1d9;

  /* Neutros — industrial / grafito */
  --color-graphite-900: #12161b;
  --color-graphite-800: #1a2027;
  --color-graphite-700: #262e37;

  --color-white: #ffffff;
  --color-offwhite: #f6f7f9;
  --color-gray-100: #edeff2;
  --color-gray-300: #c7cdd4;

  --color-text: #1b1f24;
  --color-text-muted: #5b6570;
  --color-text-inverse: #f2f4f6;
  --color-text-inverse-muted: #a7b1bb;
  --color-border: #e3e6ea;

  /* Semántico */
  --color-bg: var(--color-white);
  --color-bg-alt: var(--color-offwhite);
  --color-bg-dark: var(--color-graphite-900);
  --color-primary: var(--color-blue-700);
  --color-primary-hover: var(--color-navy-800);
  --color-accent: var(--color-amber-500);
  --color-accent-hover: var(--color-amber-600);

  /* Tipografía — pila de sistema: cero peticiones externas, cero CLS */
  --font-base: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  --fs-xs: 0.8125rem;
  --fs-sm: 0.9375rem;
  --fs-base: 1rem;
  --fs-md: 1.125rem;
  --fs-lg: 1.375rem;
  --fs-xl: 1.75rem;
  --fs-2xl: 2.25rem;
  --fs-3xl: 3rem;
  --fs-4xl: 3.75rem;

  /* Espaciado */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2.5rem;
  --space-xl: 4rem;
  --space-2xl: 6rem;

  --container-max: 1200px;
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;

  --shadow-sm: 0 1px 3px rgba(15, 23, 32, 0.08);
  --shadow-md: 0 8px 24px rgba(15, 23, 32, 0.12);
  --shadow-lg: 0 20px 48px rgba(15, 23, 32, 0.18);

  --transition-base: 180ms ease;
}
