/* Saldipe · tokens de marca
   Copiados de EVO-Lab/20-29 Clients/22 Saldipe/Brand Kit/design-system/colors_and_type.css
   el 2026-11-04. Si cambia la marca, se actualiza allá y se vuelve a copiar el bloque :root.
   Las fuentes se cargan desde fonts.css, autoalojadas. */

:root {

  /* === COLORES DE MARCA === */

  /* Primary · Azul Acero */
  --color-primary:        #22223B;
  --color-primary-90:     #2F2F49;
  --color-primary-70:     #646476;
  --color-primary-20:     #D3D3D8;
  --color-primary-10:     #E9E9ED;

  /* Accent · Ámbar Industrial */
  --color-accent:         #F2A900;
  --color-accent-hover:   #CE9000;
  --color-accent-10:      #FEF7E6;

  /* Superficies y neutros */
  --color-neutral:        #FFFFFF;
  --color-surface:        #F9F7F7;   /* Blanco Invierno */
  --color-surface-2:      #EEECEA;
  --color-border:         rgba(34, 34, 59, 0.18);

  /* Texto */
  --color-text:           #22223B;
  --color-text-muted:     #5A5A78;
  --color-text-on-dark:   #FFFFFF;
  --color-on-primary:     #FFFFFF;
  --color-on-accent:      #22223B;   /* texto oscuro sobre ámbar */

  /* Deep · para fondos de máximo contraste */
  --color-deep:           #13132A;


  /* === TIPOGRAFÍA === */

  --font-heading:  'Saira Semi Condensed', sans-serif;
  --font-body:     'Roboto', sans-serif;

  /* Pesos */
  --fw-extrabold:  800;
  --fw-medium:     500;
  --fw-bold:       700;
  --fw-regular:    400;
  --fw-light:      300;

  /* Escala tipográfica */
  --text-display:   3rem;        /* 48px · Saira ExtraBold */
  --text-h1:        2.25rem;     /* 36px · Saira ExtraBold */
  --text-h2:        1.625rem;    /* 26px · Saira Medium */
  --text-h3:        1.25rem;     /* 20px · Saira Medium */
  --text-body-lg:   1.125rem;    /* 18px · Roboto Regular */
  --text-body-md:   1rem;        /* 16px · Roboto Regular */
  --text-body-sm:   0.875rem;    /* 14px · Roboto Regular */
  --text-label:     0.8125rem;   /* 13px · Roboto Bold, UPPERCASE */

  /* Line heights */
  --lh-display:   1.05;
  --lh-heading:   1.1;
  --lh-subhead:   1.2;
  --lh-body:      1.6;
  --lh-body-lg:   1.65;

  /* Letter spacing */
  --ls-heading:   -0.01em;
  --ls-label:      0.06em;


  /* === ESPACIADO (base 8px) === */

  --space-xs:   4px;
  --space-sm:   8px;
  --space-md:   16px;
  --space-lg:   24px;
  --space-xl:   40px;
  --space-2xl:  64px;


  /* === BORDER RADIUS === */

  --radius-none: 0px;
  --radius-sm:   2px;
  --radius-md:   4px;
  --radius-lg:   8px;


  /* === SOMBRAS === */

  --shadow-card:   0 2px 8px rgba(34, 34, 59, 0.08);
  --shadow-modal:  0 8px 32px rgba(34, 34, 59, 0.14);


  /* === BARRA DE ACENTO (firma visual) === */

  --accent-bar-height: 6px;   /* barra ámbar de portada y encabezados */
}