/* ==========================================================
   OMNIX// — THE TRAFFIC DESK
   tokens.css — design tokens (single source of truth)
   Persha PL Gatulna LTD
   ========================================================== */

:root {
  /* ===== Color — dark editorial, one press-ink spot ===== */
  --ink:        #0B0B0C;   /* base — cooled near-black */
  --ink-2:      #141417;   /* raised surface / files */
  --ink-3:      #1D1D21;   /* hairline fills, inputs */
  --paper:      #F4F1E9;   /* warm bone "printed page" + primary text */
  --bone:       #C9C3B4;   /* muted warm text */
  --mist:       rgba(244, 241, 233, 0.60); /* secondary text */
  --faint:      rgba(244, 241, 233, 0.40); /* DECORATIVE / >=24px only */
  --line:       rgba(244, 241, 233, 0.14); /* hairline rules */
  --line-2:     rgba(244, 241, 233, 0.28); /* stronger rules */
  --spot:       #21E6D4;   /* ELECTRIC TEAL — the one ownable accent */
  --spot-ink:   #0B0B0C;   /* text/icon color when placed ON --spot */
  --spot-dim:   rgba(33, 230, 212, 0.14);  /* spot wash (backgrounds) */

  /* Inverted "paper" surface tokens (the one deliberate warm-flip) */
  --spot-paper: #0A6E66;   /* deepened teal — AA-legible on --paper */
  --line-paper: rgba(11, 11, 12, 0.14);
  --mist-paper: rgba(11, 11, 12, 0.60);

  /* ===== Type families ===== */
  --serif:   'Fraunces', Georgia, 'Times New Roman', serif;
  --grotesk: 'Archivo', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --mono:    'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* ===== Type scale (fluid) ===== */
  --fs-display: clamp(3.25rem, 10.5vw, 10.5rem); /* Fraunces cover */
  --fs-h1:      clamp(2.5rem, 6.5vw, 5.5rem);    /* Fraunces */
  --fs-h2:      clamp(2.25rem, 4.5vw, 3.75rem);  /* Fraunces */
  --fs-h3:      clamp(1.5rem, 2vw, 2.1rem);      /* Fraunces sub-display */
  --fs-lede:    clamp(1.125rem, 1.4vw, 1.375rem);/* Archivo */
  --fs-read:    clamp(1.0625rem, 0.4vw + 1rem, 1.1875rem); /* Archivo prose */
  --fs-ui:      1rem;                            /* Archivo UI */
  --fs-label:   0.72rem;                         /* mono uppercase */
  --fs-data:    clamp(2.5rem, 6vw, 5rem);        /* big numerals */

  /* ===== Spacing — 8px base grid ===== */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px;
  --s-5: 24px; --s-6: 32px; --s-7: 48px; --s-8: 64px;
  --s-9: 96px; --s-10: 128px; --s-11: 160px; --s-12: 200px;

  /* ===== Layout ===== */
  --container: 1440px;
  --content:   1180px;
  --measure:   66ch;
  --pad-x:     clamp(20px, 5vw, 72px);

  /* ===== Motion ===== */
  --ease:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-io: cubic-bezier(0.22, 0.61, 0.36, 1);
  --dur:     0.5s;
  --dur-fast: 0.25s;

  /* ===== Chrome ===== */
  --nav-h: 68px;
  --z-nav: 100;
}