/* ============================================================
   GEEK UI — Design Tokens
   Single source of truth for the GEEK Solutions visual system.
   "Red leads. Everything else supports."
   ============================================================ */

:root {
  /* --- Brand color --- */
  --geek-red: #e60000;       /* PRIMARY · the brand */
  --geek-red-deep: #b30000;  /* hover / pressed */
  --geek-red-tint: #ff3333;  /* accents */

  /* --- Neutrals --- */
  --geek-ink: #0a0a0a;       /* primary text / dark surface */
  --geek-ink-2: #141414;     /* raised dark surface */
  --geek-ink-3: #181818;     /* card on dark */
  --geek-paper: #f4f4f4;     /* light surface */
  --geek-white: #fefefe;     /* knockout */
  --geek-gray: #6c6c6c;      /* secondary text */
  --geek-gray-light: #a8a8a8;/* muted text */
  --geek-line: rgba(255, 255, 255, 0.1); /* hairline on dark */
  --geek-line-ink: #dddddd;  /* hairline on light */

  /* --- Status --- */
  --geek-success: #1c8a4a;
  --geek-warning: #e6a000;
  --geek-danger: var(--geek-red);

  /* --- Typography --- */
  --geek-font-display: "HansonWeb", "Archivo", system-ui, sans-serif; /* headlines */
  --geek-font-body: "Archivo", system-ui, sans-serif;                  /* body / UI */
  --geek-font-detail: "Oswald", sans-serif;                            /* eyebrows / captions */
  --geek-font-mono: "JetBrains Mono", ui-monospace, monospace;         /* specs / tags / labels */

  /* Type scale — 1.25 ratio */
  --geek-text-display: clamp(48px, 11vw, 180px);
  --geek-text-h1: clamp(34px, 6vw, 90px);
  --geek-text-h2: clamp(28px, 4vw, 56px);
  --geek-text-subhead: clamp(22px, 2.4vw, 28px);
  --geek-text-body-lg: 18px;
  --geek-text-body: 16px;
  --geek-text-sm: 14px;
  --geek-text-label: 12px;
  --geek-text-micro: 11px;

  --geek-tracking-tight: -0.03em;  /* display */
  --geek-tracking-label: 0.15em;   /* mono labels */
  --geek-tracking-eyebrow: 0.3em;  /* oswald eyebrows */

  /* --- Geometry --- */
  --geek-skew: -6deg;              /* signature slant */
  --geek-radius: 0px;             /* GEEK is sharp by default */
  --geek-radius-pill: 999px;      /* toggles only */

  /* --- Spacing --- */
  --geek-space-1: 4px;
  --geek-space-2: 8px;
  --geek-space-3: 12px;
  --geek-space-4: 16px;
  --geek-space-5: 24px;
  --geek-space-6: 32px;
  --geek-space-7: 48px;
  --geek-space-8: 64px;

  /* --- Motion --- "fast in, soft out" --- */
  --geek-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --geek-dur: 0.4s;
  --geek-dur-slow: 0.85s;

  /* --- Elevation --- */
  --geek-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
  --geek-shadow-red: 0 10px 30px rgba(230, 0, 0, 0.35);
}