/* VALUESIGNAL — Brand Tokens
   IA: Security (foundation) → Confidence (structure) → Trust (signal)
*/

:root {
  /* ===== Brand Colors ===== */
  --vs-bg-950: #060b14; /* foundation */
  --vs-bg-900: #0a1324; /* foundation gradient */
  --vs-surface-900: rgba(255, 255, 255, 0.04);
  --vs-surface-800: rgba(255, 255, 255, 0.06);
  --vs-border-700: rgba(255, 255, 255, 0.10);
  --vs-border-600: rgba(255, 255, 255, 0.14);

  --vs-text-100: rgba(255, 255, 255, 0.92);
  --vs-text-200: rgba(255, 255, 255, 0.78);
  --vs-text-300: rgba(255, 255, 255, 0.62);

  /* Signal */
  --vs-signal-500: #7fd7ff; /* glacier */
  --vs-signal-600: #4fb3c8; /* teal */
  --vs-signal-glow: rgba(127, 215, 255, 0.22);
  --vs-signal-line: rgba(127, 215, 255, 0.14);
  --vs-signal-line-soft: rgba(127, 215, 255, 0.08);

  /* ===== Typography ===== */
  --vs-font-sans: "Sora", "Space Grotesk", "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --vs-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

  --vs-text-xs: 0.8125rem;
  --vs-text-sm: 0.875rem;
  --vs-text-md: 1rem;
  --vs-text-lg: 1.125rem;
  --vs-text-xl: 1.375rem;
  --vs-text-2xl: 1.75rem;
  --vs-text-3xl: clamp(2rem, 3.5vw, 3rem);

  --vs-leading-tight: 1.15;
  --vs-leading-normal: 1.5;

  --vs-tracking-tight: -0.02em;
  --vs-tracking-wide: 0.12em;

  /* ===== Structure ===== */
  --vs-radius-sm: 10px;
  --vs-radius-md: 14px;
  --vs-radius-lg: 18px;

  --vs-shadow-1: 0 10px 30px rgba(0, 0, 0, 0.35);
  --vs-shadow-2: 0 20px 60px rgba(0, 0, 0, 0.45);

  /* Spacing scale (predictable rhythm = confidence) */
  --vs-space-1: 4px;
  --vs-space-2: 8px;
  --vs-space-3: 12px;
  --vs-space-4: 16px;
  --vs-space-5: 20px;
  --vs-space-6: 24px;
  --vs-space-8: 32px;
  --vs-space-10: 40px;
  --vs-space-12: 48px;
  --vs-space-16: 64px;

  /* Layout */
  --vs-content-max: 1320px;
  --vs-hero-max: 980px;
  --page-max-width: 1200px;
  --page-gutter: clamp(18px, 4vw, 48px);

  /* Grid (confidence layer) */
  --vs-grid-size: 32px;
  --vs-grid-line: rgba(255, 255, 255, 0.05);
}