/* tokens.css — Design tokens from brand-config.md (evolved) */

@import url('https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700;800&family=Geist+Mono:wght@500;600&display=swap');

:root {
  /* ── Colors: Primary ── */
  --blue: #1a6fd4;
  --blue-light: #5ba4f5;
  --violet: #6040cc;
  --violet-light: #8b6fe8;

  /* ── Colors: Backgrounds ── */
  --bg-primary: #F8F7F4;
  --off-white: #f4f6ff;
  --blue-tint: #eef5ff;

  /* ── Colors: Text ── */
  --text-dark: #1a1a2e;
  --text-mid: #4a4a6a;
  --text-muted: #8b8ba0;

  /* ── Colors: Borders ── */
  --whisper-border: rgba(26, 26, 46, 0.08);
  --border-light: #dde4f5;

  /* ── Colors: CTA Section (Blueprint) ── */
  --blueprint-bg: #1a6fd4;
  --blueprint-line: rgba(255, 255, 255, 0.08);
  --blueprint-line-fine: rgba(255, 255, 255, 0.03);

  /* ── Colors: Hero Blueprint Texture ── */
  --hero-grid-line: rgba(26, 111, 212, 0.07);
  --hero-grid-fine: rgba(26, 111, 212, 0.03);

  /* ── Typography ── */
  --font-display: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-body: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'Geist Mono', 'SF Mono', 'Fira Code', monospace;

  /* ── Typography: Sizes (clamp for fluid scaling) ── */
  --text-h1: clamp(2.5rem, 5vw, 4rem);
  --text-h2: clamp(1.75rem, 3vw, 2.5rem);
  --text-h3: clamp(1.25rem, 2vw, 1.5rem);
  --text-body: 1rem;
  --text-caption: 0.875rem;

  /* ── Spacing ── */
  --section-gap: clamp(3rem, 8vw, 6rem);
  --container-max: 1400px;
  --container-padding: clamp(1rem, 4vw, 2rem);

  /* ── Motion ── */
  --spring-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --transition-fast: 200ms var(--spring-ease);
  --transition-medium: 300ms var(--spring-ease);
  --stagger-delay: 80ms;

  /* ── Radii ── */
  --radius-card: 1.5rem;
  --radius-button: 0.75rem;
  --radius-nav: 1rem;
}
