/* ================================================================
   REPIN ANALYTICS — DESIGN TOKENS
   The only place raw values live. Components read these variables;
   nothing else in landing.css hard-codes a colour, size or timing.
   Documented in docs/DESIGN_SYSTEM.md.
   ================================================================ */

/* Typefaces are self-hosted (OFL). No CDN, no runtime request. */
@font-face{
  font-family:"Inter";
  src:url("../fonts/Inter-Variable.woff2") format("woff2");
  font-weight:100 900; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"JetBrains Mono";
  src:url("../fonts/JetBrainsMono-Regular.woff2") format("woff2");
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"JetBrains Mono";
  src:url("../fonts/JetBrainsMono-Medium.woff2") format("woff2");
  font-weight:500; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"JetBrains Mono";
  src:url("../fonts/JetBrainsMono-SemiBold.woff2") format("woff2");
  font-weight:600; font-style:normal; font-display:swap;
}

:root{
  /* colour — ink scale (cool, near black), one brand red, one data cyan */
  --ink-0:#05070A;
  --ink-1:#0A0E14;
  --ink-2:#111820;
  --ink-3:#1A2430;
  --line:#1F2A36;
  --line-strong:#33414F;
  --text:#F2F5F8;
  --text-2:#AEB9C6;
  --text-3:#6E7C8C;
  --brand:#E8392B;     /* Repin red, taken from the original map pin */
  --data:#5CC8F2;      /* network, map and live-analysis colour */
  --ok:#56D69A;        /* done, confirmed */
  --warn:#F5B94A;      /* attention without an error */

  /* type */
  --font-sans:"Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-mono:"JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --fs-12:.75rem;
  --fs-14:.875rem;
  --fs-16:1rem;
  --fs-18:1.125rem;
  --fs-20:1.25rem;
  --fs-24:1.5rem;
  --fs-32:2rem;
  --lh-tight:.94;
  --lh-snug:1.15;
  --lh-body:1.6;
  --track-display:-.05em;
  --track-head:-.03em;
  --track-label:.12em;

  /* space — 4px base */
  --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;

  /* shape — square by default; only controls get a 2px corner */
  --radius-ctl:2px;
  --radius-0:0;
  --border:1px solid var(--line);
  --border-strong:1px solid var(--line-strong);

  /* layout */
  --max:1280px;
  --gutter:24px;
  --nav-h:64px;

  /* motion — one curve, two speeds for everything */
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-inout:cubic-bezier(.65,0,.35,1);
  --t-fast:160ms;
  --t-base:320ms;
  --t-slow:640ms;
  --t-scene:1200ms;
}