/* ============================================================
   INTERNA EC · Design System — Tokens
   Black × Fire × Human · v1.0
   ============================================================ */

:root {
  /* ---------- Color · Neutros (Carbon) ---------- */
  --carbon-950: #08080a;                     /* fondo base */
  --carbon-900: #0e0e11;                     /* superficies */
  --carbon-850: #151518;                     /* tarjetas elevadas */
  --carbon-800: #1c1c20;                     /* inputs */
  --carbon-700: #28282d;                     /* bordes fuertes */
  --line-dark: #303038;                      /* bordes 1px */
  --paper: #f8f6f2;                          /* texto principal / fondo claro */
  --paper-dim: #eceae2;
  --text-secondary: #c4c4cc;                 /* soporte · máximo contraste sobre carbon */
  --text-muted: #8f8f99;                     /* secundario legible (AA sobre carbon) */
  --text-on-fire: #12080a;

  /* ---------- Color · Fuego (Fire) ---------- */
  --fire-700: #a92f08;
  --fire-600: #c93d0d;
  --fire-500: #f15a24;                       /* naranja Interna · CTA */
  --fire-400: #ff7a38;
  --fire-300: #ffa270;
  --fire-200: #ffd0b3;
  --fire-100: #ffe9dc;
  --fire-glow: rgba(241, 90, 36, 0.38);
  --fire-aura: rgba(241, 90, 36, 0.12);      /* aura ambiental suave */

  /* Gradiente "llama" (firma de marca · Tt· série) */
  --fire-grad: linear-gradient(120deg, #fd9a55 0%, var(--fire-500) 38%, var(--fire-600) 72%, #ff7a38 100%);

  /* Línea de brasa (separadores entre secciones) */
  --line-brasa: linear-gradient(90deg, transparent 0%, rgba(241, 90, 36, 0.55) 18%, rgba(241, 90, 36, 0.55) 82%, transparent 100%);

  /* ---------- Color · Cobre (calor contenido) ---------- */
  --copper: #d19a6e;
  --copper-dim: rgba(209, 154, 110, 0.24);
  --copper-aura: rgba(209, 154, 110, 0.08);

  /* ---------- Color · Estado ---------- */
  --success: #6fae75;
  --error: #e5484d;
  --warning: #e8b04b;

  /* ---------- Tipografía ---------- */
  --font-display: "Archivo", system-ui, sans-serif;
  --font-body: "Inter", system-ui, sans-serif;
  --font-serif: "Instrument Serif", Georgia, serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;

  /* Escala responsive (fluid) */
  --text-display-hero: clamp(2.75rem, 2.5rem + 4.5vw, 7rem);
  --text-display-section: clamp(2.125rem, 1.875rem + 2.8vw, 4.5rem);
  --text-h2: clamp(1.75rem, 1.5rem + 1.6vw, 3rem);
  --text-h3: clamp(1.375rem, 1.25rem + 0.8vw, 2rem);
  --text-h4: clamp(1.125rem, 1.0625rem + 0.35vw, 1.375rem);
  --text-lead: clamp(1.125rem, 1.1rem + 0.15vw, 1.25rem);
  --text-body: clamp(1rem, 0.975rem + 0.1vw, 1.125rem);
  --text-small: 0.875rem;
  --text-micro: 0.75rem;                     /* mono · mayúsculas · tracking .14em */
  --text-metric: clamp(2.5rem, 2rem + 2vw, 5.25rem);

  --leading-display: 1.04;
  --leading-body: 1.6;
  --tracking-display: -0.02em;
  --tracking-mono: 0.14em;
  --tracking-mono-wide: 0.22em;

  /* ---------- Espaciado (base 4px) ---------- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;
  --space-9: 48px;
  --space-10: 64px;
  --space-11: 80px;
  --space-12: 96px;
  --space-13: 128px;
  --space-14: 160px;

  --section-pad: clamp(5.5rem, 8vw, 10rem);   /* sección estándar 88–160px */
  --row-gap: clamp(1rem, 1.5vw, 1.5rem);       /* gap entre cards */
  --stack: 1.5;                                 /* ritmo vertical párrafos */

  /* ---------- Layout ---------- */
  --container: 1400px;
  --gutter: clamp(20px, 4vw, 64px);
  --gutter-card: clamp(24px, 3vw, 40px);

  /* ---------- Radios ---------- */
  --radius-btn: 8px;
  --radius-sm: 6px;
  --radius-card: 12px;

  /* ---------- Elevación / trazos ---------- */
  --border: 1px solid var(--line-dark);
  --border-fire: 1px solid var(--fire-500);
  --header-blur: rgba(8, 8, 10, 0.85);

  /* ---------- Motion ---------- */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 200ms;
  --dur-med: 320ms;
  --dur-slow: 560ms;

  /* ---------- Z-index ---------- */
  --z-header: 100;
  --z-mobile: 150;
  --z-chat: 200;
}

/* ---------- Fit de media por defecto ---------- */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 1ms;
    --dur-med: 1ms;
    --dur-slow: 1ms;
  }
}