/* ==========================================================================
   DESIGN TOKENS — AutomaNexus · identidad «Plano sobre papel»
   Mismos valores que ../../../marca/tokens.css (fuente única de la marca),
   traducidos a los nombres de token de la plantilla saas-flujo.
   Para cambiar la marca toca SOLO este archivo; styles.css no se edita.
   ========================================================================== */

@font-face { font-family: 'Space Grotesk'; font-weight: 500; font-display: swap; src: url('../fonts/SpaceGrotesk-500.woff2') format('woff2'); }
@font-face { font-family: 'Space Grotesk'; font-weight: 700; font-display: swap; src: url('../fonts/SpaceGrotesk-700.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-weight: 400; font-display: swap; src: url('../fonts/Inter-400.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-weight: 500; font-display: swap; src: url('../fonts/Inter-500.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-weight: 600; font-display: swap; src: url('../fonts/Inter-600.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-weight: 700; font-display: swap; src: url('../fonts/Inter-700.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Mono'; font-weight: 400; font-display: swap; src: url('../fonts/IBMPlexMono-400.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Mono'; font-weight: 500; font-display: swap; src: url('../fonts/IBMPlexMono-500.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Mono'; font-weight: 600; font-display: swap; src: url('../fonts/IBMPlexMono-600.woff2') format('woff2'); }

:root {
  /* Escala fluida (convención de la biblioteca) */
  --vw-limit: min(100vw, 1600px);
  --m: calc(var(--vw-limit) / 390);

  /* Papel */
  --c-paper: #F6F4EF;       /* fondo de la página */
  --c-ground: #EDEAE2;      /* secciones alternas */
  --c-card: #FBFAF6;        /* tarjetas y marcos (token propio) */
  --c-ink: #11141B;
  --c-ink-2: #4A5160;       /* 7,2:1 sobre papel */
  --c-line: #DAD6CC;
  --c-line-2: #BDB7AA;
  --c-grid: rgba(17, 20, 27, .06);

  /* Acción = tinta (sin segundo color) */
  --c-action: #11141B;
  --c-action-hover: #000000;
  --c-action-soft: #ECE6D6;
  --c-on-action: #F6F4EF;

  /* Acento único: dorado */
  --c-mark: #E8B25C;
  --c-mark-soft: #F2CF8E;   /* subrayado y sello */
  --c-mark-ink: #7A5414;    /* dorado como texto (6,2:1 sobre papel) */

  /* Estados */
  --c-ok: #2F6B45;   --c-ok-soft: #E1EEE4;
  --c-warn: #7A5414; --c-warn-soft: #F6E8C8;
  --c-bad: #9B2C24;  --c-bad-soft: #F6E1DD;

  /* Plano (bandas oscuras) */
  --c-band: #0B0D12;
  --c-band-fg: #E6E9EF;
  --c-band-2: #9AA3B2;      /* 7,6:1 sobre plano */
  --c-band-line: #262B36;
  --c-band-dots: rgba(215, 219, 227, .16);
  --c-band-gold: #F5D9A0;

  /* Tipografía */
  --f-display: 'Space Grotesk', system-ui, sans-serif;
  --f-body: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --f-mono: 'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;

  --t-hero: clamp(40px, 6vw, 76px);
  --t-h1: clamp(32px, 4.6vw, 56px);
  --t-h2: clamp(28px, 3.6vw, 44px);
  --t-h3: clamp(19px, calc(var(--m) * 4.8), 22px);
  --t-lead: clamp(17px, calc(var(--m) * 4.4), 20px);
  --t-body: 16px;
  --t-small: 14px;
  --t-micro: 12px;

  /* Espaciado y forma */
  --gutter: max(16px, min(calc(var(--m) * 12), 48px));
  --section: clamp(56px, calc(var(--m) * 20), 112px);
  --container: 1160px;
  --measure: 66ch;
  --r-s: 3px;
  --r-m: 6px;
  --r-l: 8px;
  --shadow-frame: none;
  --header-h: 64px;
}