/* Prax Energy — tokens de marca v2 (Tablero suizo). Importar una vez, antes de cualquier otro CSS. */
@font-face{font-family:"Schibsted Grotesk";src:url("./fonts/SchibstedGrotesk-Regular.ttf") format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:"Schibsted Grotesk";src:url("./fonts/SchibstedGrotesk-Bold.ttf") format("truetype");font-weight:700;font-display:swap}
@font-face{font-family:"Schibsted Grotesk";src:url("./fonts/SchibstedGrotesk-Black.ttf") format("truetype");font-weight:900;font-display:swap}
@font-face{font-family:"Chivo Mono";src:url("./fonts/ChivoMono-Regular.ttf") format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:"Chivo Mono";src:url("./fonts/ChivoMono-SemiBold.ttf") format("truetype");font-weight:600;font-display:swap}

:root{
  /* Paleta */
  --pe-grafito:#1A1D21;   --pe-grafito-2:#24282D;
  --pe-hueso:#F4F2ED;     --pe-hueso-2:#E8E5DC;
  --pe-naranja:#E8590C;   /* único acento; texto encima SIEMPRE grafito (4.7:1) */
  --pe-naranja-texto:#B84708; /* naranja para texto chico sobre hueso (4.8:1) */
  --pe-acero:#6B7280;     --pe-acero-claro:#9AA0A8;

  /* Roles (tema claro por defecto) */
  --pe-fondo:var(--pe-hueso);
  --pe-fondo-2:var(--pe-hueso-2);
  --pe-tinta:var(--pe-grafito);
  --pe-tinta-2:#575D66;              /* texto secundario (5.9:1 sobre hueso) */
  --pe-linea:rgba(26,29,33,.16);
  --pe-linea-fuerte:var(--pe-grafito);

  /* Tipografía */
  --pe-sans:"Schibsted Grotesk","Helvetica Neue",Arial,sans-serif;
  --pe-mono:"Chivo Mono","Courier New",monospace;

  /* Escala (desktop; ver clamp en BRAND.md para móvil) */
  --pe-cifra-hero:clamp(96px,14vw,200px);
  --pe-display:clamp(40px,5.2vw,72px);
  --pe-titulo-1:clamp(30px,3.4vw,40px);
  --pe-titulo-2:22px;
  --pe-cuerpo:17px;
  --pe-cuerpo-sm:14px;
  --pe-etiqueta:12px;

  /* Espacio y retícula */
  --pe-s1:4px; --pe-s2:8px; --pe-s4:16px; --pe-s6:24px; --pe-s8:32px; --pe-s12:48px; --pe-s18:72px;
  --pe-columnas:6; --pe-medianil:24px; --pe-ancho-max:1200px;

  /* Forma */
  --pe-radio:0; /* todo recto. Única excepción: el LED de 7px (50%) */
}
.pe-oscuro{
  --pe-fondo:var(--pe-grafito); --pe-fondo-2:var(--pe-grafito-2);
  --pe-tinta:var(--pe-hueso); --pe-tinta-2:var(--pe-acero-claro);
  --pe-linea:rgba(244,242,237,.16); --pe-linea-fuerte:var(--pe-hueso);
}