/* VybeSafe — design tokens. Edit here, propagates everywhere. */

:root {
  /* Palette — off-black mono with one cold mint status accent */
  --color-bg:          #0A0A0A;
  --color-surface:     #111111;
  --color-surface-2:   #161616;
  --color-border:      #1F1F1F;
  --color-border-2:    #262626;
  --color-text:        #EDEDED;
  --color-text-muted:  #8A8A8A;
  --color-text-dim:    #555555;
  --color-accent:      #7DFFB4;          /* cold mint, status-only */
  --color-accent-dim:  #2A4D3C;
  --color-danger:      #E5947A;          /* desaturated, severity pills only */
  --color-warn:        #D4B978;
  --color-info:        #9AB6E0;

  /* Type — self-hosted Geist + Geist Mono */
  --font-display: "Geist", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono:    "Geist Mono", ui-monospace, "JetBrains Mono", "SF Mono", Menlo, monospace;

  --fs-h1:     clamp(40px, 6vw, 72px);
  --fs-h2:     clamp(28px, 3.6vw, 44px);
  --fs-h3:     clamp(20px, 2.2vw, 26px);
  --fs-eyebrow: 12px;
  --fs-body:   17px;
  --fs-small:  14px;
  --fs-mono:   14px;

  --lh-tight:  1.05;
  --lh-snug:   1.25;
  --lh-body:   1.6;

  --tracking-tight: -0.02em;
  --tracking-mono:  -0.005em;
  --tracking-eyebrow: 0.18em;

  /* Layout */
  --container:    1200px;
  --gutter:       max(20px, 4vw);
  --section-y:    clamp(72px, 10vw, 140px);
  --radius-sm:    4px;
  --radius:       8px;
  --radius-lg:    12px;

  /* Motion */
  --ease:     cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 150ms;
  --dur:      280ms;
  --dur-slow: 600ms;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}