/* ==========================================================================
   Titán SW · tokens.css
   Sistema de diseño "Taller de ingeniería" — Dirección 01, Rev. A
   Todo valor de color, tipografía y espacio del sitio vive aquí.
   Cambiar un token cambia el sitio completo.
   ========================================================================== */

:root{

  /* ---------- COLOR ------------------------------------------------------
     Tinta y grafito portados de la Dirección 01.
     Fondo #FCFCFB por decisión de marca (el original era #F7F5F0).
     --accent-strong existe por accesibilidad: el naranja original con texto
     claro da 3.68:1 y no alcanza el mínimo de 4.5:1 para texto de 12–15px.  */

  --bg:              #FCFCFB;   /* papel                                    */
  --ink:             #0D1B2A;   /* tinta profunda · texto principal 16.9:1  */
  --ink-2:           #1B2A38;   /* tinta secundaria · párrafos              */
  --graphite:        #5A6472;   /* etiquetas y valores atenuados · 5.8:1    */
  --accent:          #E4572E;   /* naranja de señalización · marcas         */
  --accent-strong:   #C7431D;   /* relleno de botón + texto claro · 4.9:1   */
  --paper-on-ink:    #F7F5F0;   /* texto sobre tinta                        */
  --rule:            #C9C4B8;   /* regla fina de plano                      */
  --rule-soft:       #DFDBD2;   /* regla interior de tabla                  */
  --ok:             #0F6B5C;    /* estado correcto en telemetría            */
  --grid-line:      rgba(13,27,42,.05);

  /* ---------- TIPOGRAFÍA ------------------------------------------------- */

  --f-display: 'IBM Plex Sans Condensed', 'Arial Narrow', sans-serif;
  --f-body:    'IBM Plex Sans', system-ui, -apple-system, sans-serif;
  --f-mono:    'IBM Plex Mono', ui-monospace, 'SFMono-Regular', monospace;

  /* Escala portada de la hoja de especificación (Rev. A).
     Los valores fijos del diseño son el TOPE; clamp() da el escalado fluido. */

  --t-h1:    clamp(34px, 5.4vw, 68px);   /* Cond 700 · 68/1.02 · −1.5%      */
  --t-h2:    clamp(26px, 3.2vw, 40px);   /* Cond 700 · 40/1.06              */
  --t-h3:    clamp(22px, 2.4vw, 30px);   /* Cond 700 · 30/1.10              */
  --t-h4:    clamp(18px, 1.6vw, 22px);
  --t-lead:  clamp(17px, 1.45vw, 19px);  /* Sans 400 · 19/1.58              */
  --t-body:  clamp(15.5px, 1.2vw, 16.5px);/* Sans 400 · 16.5/1.62           */
  --t-meta:  11.5px;                     /* Mono 500 · +14% tracking        */
  --t-data:  12.5px;                     /* Mono 500 · dato de tabla        */
  --t-nav:   12px;                       /* Mono 400 · +8% tracking         */

  --lh-h1:1.02;  --lh-h2:1.06;  --lh-h3:1.10;
  --tr-h1:-.015em;
  --tr-meta:.14em;  --tr-nav:.08em;  --tr-folio:.10em;

  /* ---------- ESTRUCTURA -------------------------------------------------
     El carril de anotación es la idea que sostiene la dirección: margen
     izquierdo con el folio de sección girado, como la columna de un plano. */

  --rail-w:      88px;          /* ancho del carril en escritorio           */
  --rail-w-md:   56px;          /* carril reducido en tableta               */
  --pad-x:       clamp(18px, 3.4vw, 56px);
  --pad-r:       clamp(18px, 3.4vw, 56px);
  --sec-y:       clamp(34px, 4.2vw, 48px);
  --gap:         clamp(24px, 3.6vw, 56px);
  --maxw:        1440px;        /* ancho de lámina del diseño original      */
  --grid-size:   64px;

  --bd-major: 2px solid var(--ink);   /* corte entre secciones              */
  --bd-minor: 1px solid var(--rule);  /* regla fina                         */
}

/* Modo de impresión: el sitio ya es una hoja de especificación, que se
   imprima como tal. */
@media print{
  :root{ --bg:#fff; --grid-line:transparent }
}
