/* ============================================================
   SinergIA · tokens (Fase 2, laboratorio)
   ------------------------------------------------------------
   Base compartida con Nivora (tinta, violeta, marfil, retícula
   de 9 px, escala tipográfica, curvas) + estados funcionales
   propios de SinergIA. Fuentes oficiales de Fontshare sin
   modificar (licencia ITF FFL 2.0 en assets/fonts/FFL.txt).
   ============================================================ */

@font-face { font-family: 'Cabinet Grotesk'; font-weight: 500; font-style: normal; font-display: swap;
  src: url('../assets/fonts/CabinetGrotesk-Medium.woff2') format('woff2'); }
@font-face { font-family: 'Cabinet Grotesk'; font-weight: 700; font-style: normal; font-display: swap;
  src: url('../assets/fonts/CabinetGrotesk-Bold.woff2') format('woff2'); }
@font-face { font-family: 'Cabinet Grotesk'; font-weight: 800; font-style: normal; font-display: swap;
  src: url('../assets/fonts/CabinetGrotesk-Extrabold.woff2') format('woff2'); }
@font-face { font-family: 'Switzer'; font-weight: 400; font-style: normal; font-display: swap;
  src: url('../assets/fonts/Switzer-Regular.woff2') format('woff2'); }
@font-face { font-family: 'Switzer'; font-weight: 500; font-style: normal; font-display: swap;
  src: url('../assets/fonts/Switzer-Medium.woff2') format('woff2'); }
@font-face { font-family: 'Switzer'; font-weight: 600; font-style: normal; font-display: swap;
  src: url('../assets/fonts/Switzer-Semibold.woff2') format('woff2'); }

:root {
  /* — Color base (Nivora) — */
  --ink: #0B0B0D;
  --ink-2: #131317;
  --ink-3: #1C1C22;
  --ink-4: #26262E;
  --ivory: #F8F6F4;
  --ivory-2: #EFEBE7;
  --ivory-3: #E6E1DC;
  --violet: #5752F2;        /* acento principal */
  --violet-soft: #7C78F6;   /* texto/acento sobre tinta (≥4,5:1) */
  --violet-deep: #4741D9;   /* hover del botón principal */
  --violet-wash: #29276A;   /* violeta mezclado con tinta: fondos de selección */

  /* — Texto sobre tinta — */
  --text: var(--ivory);
  --text-muted: #A9A7A5;    /* 8,2:1 sobre --ink · 7,1:1 sobre --ink-3 */
  --text-faint: #8F8D8B;    /* 6,0:1 sobre --ink · 5,1:1 sobre --ink-3 · 4,5:1 sobre --ink-4 */
  --rule: rgba(248, 246, 244, 0.12);
  --rule-strong: rgba(248, 246, 244, 0.22);
  --rule-control: rgba(248, 246, 244, 0.4);  /* ≥3:1 sobre tinta: borde de controles */

  /* — Estados funcionales (siempre con texto) — */
  --state-ai: #9D9AF8;      /* IA atendiendo */
  --state-human: #F8F6F4;   /* Tu equipo */
  --state-open: #7C78F6;    /* Abierta */
  --state-pending: #EBA94A; /* Pendiente */
  --state-closed: #5CC795;  /* Cerrada / resuelta */

  /* — Tipografía (escala de Nivora) — */
  --font-display: 'Cabinet Grotesk', 'Switzer', system-ui, sans-serif;
  --font-text: 'Switzer', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --fs-micro: 0.8125rem;
  --fs-small: 0.9375rem;
  --fs-body: clamp(1rem, 0.96rem + 0.2vw, 1.125rem);
  --fs-lead: clamp(1.125rem, 1.02rem + 0.5vw, 1.4375rem);
  --fs-h3: clamp(1.25rem, 1.1rem + 0.7vw, 1.75rem);
  --fs-h2: clamp(2rem, 1.35rem + 3vw, 4.25rem);
  --fs-h1: clamp(2.5rem, 1.25rem + 4.1vw, 4.75rem);
  --lh-tight: 0.96;
  --lh-head: 1.04;
  --lh-text: 1.55;
  --track-display: -0.035em;
  --measure: 62ch;

  /* — Retícula — */
  --cell: 9px;
  --s-1: calc(var(--cell) * 1);
  --s-2: calc(var(--cell) * 2);
  --s-3: calc(var(--cell) * 3);
  --s-4: calc(var(--cell) * 4);
  --s-6: calc(var(--cell) * 6);
  --s-8: calc(var(--cell) * 8);
  --s-12: calc(var(--cell) * 12);
  --s-16: calc(var(--cell) * 16);
  --gutter: clamp(18px, 5vw, 36px);
  --wrap: 1320px;
  --section-y: clamp(96px, 14vw, 200px);

  /* — Forma — */
  --radius-site: 0;          /* chrome del sitio: ángulo recto de la retícula */
  --radius-app: 16px;        /* ventanas de las demostraciones */
  --radius-ui: 10px;         /* filas, tarjetas internas */
  --radius-bubble: 14px;
  --radius-pill: 999px;

  /* — Movimiento (Nivora) — */
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
  --dur-press: 140ms;
  --dur-micro: 200ms;
  --dur-ui: 260ms;

  /* — Foco — */
  --focus: 2px solid var(--violet-soft);
  --focus-offset: 3px;
}
