/* Veluto — design tokens. Single source of truth for brand + website.
   Fonts: self-hosted, see fonts.css (do not load Google Fonts: GDPR).
*/
:root {
  /* Core palette */
  --vt-midnight:  #0A1626; /* primary dark background */
  --vt-deep-navy: #12243A; /* cards / raised surfaces on dark */
  --vt-blue:      #2F5BEA; /* brand primary — buttons, symbol. Not for text on dark */
  --vt-cyan:      #3DE0F0; /* AI accent — max ~5% of any surface */
  --vt-slate:     #64748B; /* borders, secondary text on light only */
  --vt-steel:     #94A3B8; /* secondary text on dark */
  --vt-graphite:  #1E293B; /* body text on light */
  --vt-mist:      #EEF2F6; /* light alternate sections */
  --vt-paper:     #F8FAFC; /* white / text on dark */
  --vt-green:     #22C55E; /* positive data in charts only */

  /* Derived */
  --vt-blue-hover: #2549C4;
  --vt-line-dark:  rgba(148, 163, 184, 0.16);
  --vt-line-light: #D9E0E8;
  --vt-cyan-glow:  0 0 0 1px rgba(61, 224, 240, 0.35), 0 0 24px rgba(61, 224, 240, 0.12);

  /* Typography */
  --vt-font-sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --vt-font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;
  --vt-text-xs:   0.75rem;   /* 12 — labels, mono tags */
  --vt-text-sm:   0.875rem;  /* 14 */
  --vt-text-base: 1rem;      /* 16 — body */
  --vt-text-lg:   1.125rem;  /* 18 — lead */
  --vt-text-xl:   1.375rem;  /* 22 — h4 */
  --vt-text-2xl:  1.75rem;   /* 28 — h3 */
  --vt-text-3xl:  2.25rem;   /* 36 — h2 */
  --vt-text-4xl:  clamp(2.5rem, 5vw, 3.75rem); /* h1 */
  --vt-leading-tight: 1.15;
  --vt-leading-body:  1.6;
  --vt-tracking-tight: -0.02em;
  --vt-tracking-label:  0.08em;

  /* Spacing (4px base) */
  --vt-space-1: 4px;  --vt-space-2: 8px;  --vt-space-3: 12px; --vt-space-4: 16px;
  --vt-space-6: 24px; --vt-space-8: 32px; --vt-space-12: 48px; --vt-space-16: 64px;
  --vt-space-24: 96px; --vt-space-32: 128px;
  --vt-container: 1200px;
  --vt-gutter: 16px;

  /* Shape */
  --vt-radius-sm: 6px;
  --vt-radius-md: 10px;
  --vt-radius-lg: 16px;
  --vt-radius-pill: 999px;
  --vt-shadow-card: 0 1px 2px rgba(10, 22, 38, 0.06), 0 8px 24px rgba(10, 22, 38, 0.08);
}