/* ============================================================
   ROLUM · Ingeniería y Mantenimiento
   css/tokens.css — Tokens del sitio v2.0 · agosto 2026
   Fuente: ROLUM-direccion-visual (Sarape · Gerardo Garza)

   El sitio es claro-primario: campo Cal, estructura Forja,
   naranja Fragua dosificado al 4% de la superficie.
   Reparto de referencia: 56 Cal · 20 Forja · 10 Cemento ·
   8 Grafito · 4 Fragua · 2 Estado.
   Los hex son los del manual v1.0; lo que cambia es el uso.
   ============================================================ */

:root{
  /* ---- Neutros: metal con temperatura, nunca #000/#FFF ---- */
  --rol-cal:        #F5F2ED;  /* el campo: fondo del sitio     */
  --rol-cemento:    #DED9D1;  /* fondo hundido / líneas claras */
  --rol-zinc:       #8A7F76;  /* texto 2° SOLO sobre oscuro    */
  --rol-grafito:    #4A4139;  /* texto 2° sobre claro (8.9:1)  */
  --rol-hierro:     #332B25;  /* bordes dentro del modo oscuro */
  --rol-acero:      #1F1915;  /* superficie elevada en oscuro  */
  --rol-forja:      #14100D;  /* el negro ROLUM: texto y bloques */

  /* ---- Señal ---------------------------------------------- */
  --rol-fragua:     #E85B12;  /* solo pinta: botón, franja, subrayado */
  --rol-chispa:     #FF8A2B;  /* exclusiva del modo oscuro     */
  --rol-oxido:      #7E2E0C;  /* el naranja cuando es letra (8.2:1 sobre Cal) */

  /* ---- Estado — solo fichas y reportes -------------------- */
  --rol-operativo:  #4F8A3D;
  --rol-alerta:     #E0A020;
  --rol-paro:       #B4321E;

  /* ---- Roles del documento (modo claro por defecto) ------- */
  --campo:        var(--rol-cal);      /* fondo de página          */
  --superficie:   #EDE9E2;             /* tarjeta sobre Cal        */
  --hundido:      var(--rol-cemento);  /* fondo bajo el campo      */
  --tinta:        var(--rol-forja);    /* todo el texto            */
  --tenue:        var(--rol-grafito);  /* texto secundario         */
  --acento:       var(--rol-oxido);    /* antetítulos, enlaces, cifras */
  --senal:        var(--rol-fragua);   /* rellenos de acción       */
  --senal-hover:  var(--rol-chispa);
  --sobre-senal:  var(--rol-forja);    /* texto dentro del botón   */
  --regla:        rgba(20,16,13,.20);  /* líneas y divisiones       */
  --regla-control:rgba(20,16,13,.50);  /* borde de control · 3.47:1 sobre Cal */

  /* ---- Tipografía ----------------------------------------- */
  --f-display: 'Saira Condensed','Arial Narrow',sans-serif;
  --f-texto:   'Barlow',Arial,sans-serif;
  --f-mono:    'IBM Plex Mono',Consolas,monospace;

  --t-display: clamp(2.5rem, 6.4vw, 4.6rem);   /* 40–74 · Saira 800 */
  --t-h1:      clamp(2.1rem, 4.6vw, 3.4rem);
  --t-h2:      clamp(1.5rem, 2.6vw, 1.875rem); /* 24–30 · Saira 700 */
  --t-sub:     1.3125rem;                       /* 21 · Barlow 600  */
  --t-cuerpo:  1.09375rem;                      /* 17.5 · Barlow 400 */
  --t-chico:   0.84375rem;                      /* 13.5             */
  --t-boton:   0.78125rem;                      /* 12.5 · Saira 700 */
  --t-antetitulo: 0.71875rem;                   /* 11.5 · Plex 500  */
  --t-dato:    0.9375rem;                       /* 15 · Plex 500    */

  --lh-display: 1.02;
  --lh-cuerpo:  1.7;
  --medida:     66ch;

  /* ---- Espaciado · escala 4px ----------------------------- */
  --s1:4px;  --s2:8px;  --s3:12px; --s4:16px; --s5:24px;
  --s6:32px; --s7:48px; --s8:64px; --s9:96px; --s10:128px;

  /* ---- Chaflán · elemento de firma ------------------------ */
  --chaflan-sm: polygon(6px 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%, 0 6px);
  --chaflan:    polygon(12px 0, 100% 0, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0 100%, 0 12px);
  /* radio 0 en toda la marca; el chaflán reemplaza al redondeo */

  /* ---- Textura acero cepillado (solo bloques oscuros) ----- */
  --cepillado: repeating-linear-gradient(90deg, rgba(245,242,237,.035) 0 1px, transparent 1px 3px);

  /* ---- Movimiento ----------------------------------------- */
  --dur-fast: 140ms;
  --dur:      200ms;
  --ease-out: cubic-bezier(0,0,.2,1);
}

/* ---- Región oscura: nav, objeción, footer -------------------
   Un solo escalón sobre Forja, nunca dos. Chispa solo vive aquí. */
.region-forja{
  --campo:       var(--rol-forja);
  --superficie:  var(--rol-acero);
  --tinta:       var(--rol-cal);
  --tenue:       var(--rol-zinc);
  --acento:      var(--rol-chispa);
  --regla:       rgba(245,242,237,.16);
  --regla-control:rgba(245,242,237,.42);
  background: var(--cepillado), var(--campo);
  color: var(--tinta);
}
