/**
 * LIMAF v2.0 — Design Tokens
 * ============================================================
 * CONCEPTO: "PRESIÓN CONTROLADA"
 * El agua contiene al fuego. La ingeniería contiene la energía.
 * Toda la paleta proviene del logotipo LIMAF:
 *   · Fuego  #E8341A (naranja-rojo del isotipo)
 *   · Carbón #3D3E42 (gris oscuro del isotipo)
 *   · Blanco #FFFFFF
 * ============================================================
 */

:root {

  /* ── PALETA — extraída del logo ─────────────────────── */

  /* Fuego */
  --fire-700:  #A11B08;
  --fire-600:  #C4240C;
  --fire-500:  #E8341A;      /* naranja principal del logo */
  --fire-400:  #FF4D29;
  --fire-300:  #FF6B45;
  --fire-glow: rgba(232, 52, 26, 0.35);
  --fire-dim:  rgba(232, 52, 26, 0.12);

  /* Carbón (derivado del gris #3D3E42 del logo) */
  --carbon-950: #0A0A0B;     /* negro casi absoluto — fondo v2 */
  --carbon-900: #101012;
  --carbon-850: #141417;
  --carbon-800: #1A1B1E;
  --carbon-700: #232428;
  --carbon-600: #2E2F34;
  --carbon-500: #3D3E42;     /* gris del logo */
  --carbon-400: #55565C;
  --carbon-300: #7C7D85;
  --carbon-200: #A9AAB2;
  --carbon-100: #D6D6DC;
  --carbon-050: #F0F0F3;

  --white:     #FFFFFF;
  --paper:     #F4F3F0;      /* sección editorial clara */

  /* ── ALIASES SEMÁNTICOS — TEMA CLARO (sitio-b) ──────────
     Base blanca, tinta carbón, rojo como acento presente.  */
  --bg:          var(--white);        /* #FFFFFF */
  --bg-2:        #FAFAFB;
  --bg-3:        #F4F4F6;
  --surface:     #FFFFFF;             /* tarjetas: blanco + borde + sombra suave */
  --surface-2:   #F4F4F6;
  --line:        rgba(20, 20, 28, 0.12);
  --line-soft:   rgba(20, 20, 28, 0.07);
  --line-hot:    rgba(232, 52, 26, 0.45);
  --ink:         #14151A;             /* texto principal (carbón casi negro) */
  --ink-mid:     #4A4B52;             /* texto secundario */
  --ink-low:     #74757D;             /* texto terciario / captions */

  /* Sección clara (isla de separación) */
  --paper:          #F5F5F7;
  --paper-ink:      #131316;
  --paper-ink-mid:  #4A4B52;
  --paper-line:     rgba(19, 19, 22, 0.12);

  /* ── TIPOGRAFÍA ──────────────────────────────────────
     Display: Clash Display  (Fontshare) — editorial, contundente
     Body:    Satoshi        (Fontshare) — neo-grotesca premium
     Mono:    JetBrains Mono (Google)    — voz técnica / datos
  ───────────────────────────────────────────────────── */
  --f-display: 'Clash Display', 'Arial Narrow', Impact, sans-serif;
  --f-body:    'Satoshi', 'Inter', 'Helvetica Neue', Arial, sans-serif;
  --f-mono:    'JetBrains Mono', 'Space Mono', 'Courier New', monospace;

  /* Escala fluida */
  --t-2xs:  clamp(0.625rem, 0.72vw, 0.6875rem);
  --t-xs:   clamp(0.6875rem, 0.85vw, 0.78rem);
  --t-sm:   clamp(0.82rem, 0.95vw, 0.92rem);
  --t-base: clamp(0.95rem, 1.1vw, 1.06rem);
  --t-md:   clamp(1.08rem, 1.35vw, 1.22rem);
  --t-lg:   clamp(1.2rem, 1.65vw, 1.45rem);
  --t-xl:   clamp(1.5rem, 2.2vw, 1.95rem);
  --t-2xl:  clamp(1.9rem, 3vw, 2.6rem);
  --t-3xl:  clamp(2.1rem, 3.6vw, 3.1rem);
  --t-4xl:  clamp(2.6rem, 4.6vw, 4.2rem);
  --t-hero: clamp(2.8rem, 6.5vw, 6.2rem);
  --t-mega: clamp(3.2rem, 9vw, 8.8rem);

  /* ── ESPACIADO base-8 ───────────────────────────────── */
  --s-1:  0.25rem;  --s-2:  0.5rem;   --s-3:  0.75rem;
  --s-4:  1rem;     --s-5:  1.25rem;  --s-6:  1.5rem;
  --s-8:  2rem;     --s-10: 2.5rem;   --s-12: 3rem;
  --s-16: 4rem;     --s-20: 5rem;     --s-24: 6rem;
  --s-32: 8rem;     --s-40: 10rem;

  /* ── LAYOUT ─────────────────────────────────────────── */
  --container: 1360px;
  --pad: clamp(1.25rem, 4.5vw, 4.5rem);
  --nav-h: 76px;

  /* ── RADIOS ─────────────────────────────────────────── */
  --r-xs: 3px;  --r-sm: 6px;  --r-md: 10px;
  --r-lg: 18px; --r-xl: 28px; --r-full: 9999px;

  /* ── SOMBRAS ────────────────────────────────────────── */
  --sh-sm:   0 1px 3px rgba(20,20,30,.06), 0 1px 2px rgba(20,20,30,.09);
  --sh-md:   0 8px 30px rgba(20,20,30,.10), 0 2px 8px rgba(20,20,30,.06);
  --sh-lg:   0 24px 70px rgba(20,20,30,.14), 0 6px 20px rgba(20,20,30,.08);
  --sh-fire: 0 8px 30px rgba(232,52,26,.22), 0 2px 10px rgba(232,52,26,.14);
  --sh-card: 0 4px 20px rgba(20,20,30,.08), 0 1px 3px rgba(20,20,30,.06);

  /* ── MOVIMIENTO ─────────────────────────────────────── */
  --e-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --e-inout:  cubic-bezier(0.65, 0, 0.35, 1);
  --e-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  --d-fast: 180ms;
  --d-base: 320ms;
  --d-slow: 560ms;
  --d-xslow: 900ms;

  /* ── GRADIENTES ─────────────────────────────────────── */
  --g-fire:      linear-gradient(120deg, var(--fire-600), var(--fire-400));
  --g-fire-text: linear-gradient(105deg, var(--fire-500) 0%, var(--fire-600) 55%, var(--fire-700) 100%);
  --g-fade-btm:  linear-gradient(180deg, transparent, var(--white));
  --g-glow-top:  radial-gradient(ellipse 65% 55% at 50% 0%, rgba(232,52,26,.09), transparent 70%);

  /* ── Z-STACK ────────────────────────────────────────── */
  --z-bg: -1;   --z-raised: 10;  --z-sticky: 40;
  --z-nav: 200; --z-menu: 250;   --z-loader: 900; --z-cursor: 999;

  /* ── PATRONES TÉCNICOS ──────────────────────────────── */
  --blueprint-grid:
    linear-gradient(rgba(20,30,60,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(20,30,60,0.05) 1px, transparent 1px);
  --blueprint-size: 72px 72px;

  --dot-grid: radial-gradient(circle, rgba(20,20,30,.10) 1px, transparent 1.5px);
}