/*
  AimSight Design System — 00 Tokens
  Source of truth for color, type, spacing, radius, shadows, and breakpoints.
*/

:root {
  /* Brand */
  --as-color-ink: #0e1024;
  --as-color-ink-2: #22233e;
  --as-color-text: #38405f;
  --as-color-muted: #737b99;
  --as-color-soft: #f8f7ff;
  --as-color-soft-blue: #eef5ff;
  --as-color-white: #ffffff;
  --as-color-purple: #5b2df4;
  --as-color-violet: #7c3aed;
  --as-color-cyan: #13c8d2;
  --as-color-pink: #ec4899;
  --as-color-border: rgba(14, 16, 36, 0.10);
  --as-color-border-soft: rgba(14, 16, 36, 0.07);

  /* Dark */
  --as-dark-bg: #070914;
  --as-dark-surface: #0d1029;
  --as-dark-card: #10142f;
  --as-dark-border: rgba(255, 255, 255, 0.12);
  --as-dark-text: #eef2ff;
  --as-dark-muted: #aab3d5;

  /* Typography */
  --as-font-body: Poppins, "Segoe UI", Arial, sans-serif;
  --as-font-weight-regular: 400;
  --as-font-weight-medium: 500;
  --as-font-weight-semibold: 600;
  --as-font-weight-bold: 700;
  --as-font-weight-black: 800;

  /* Fluid type */
  --as-type-hero: clamp(3.1rem, 7.2vw, 5.75rem);
  --as-type-section: clamp(2rem, 4.6vw, 4.2rem);
  --as-type-card: clamp(1rem, 1.5vw, 1.25rem);
  --as-type-body: clamp(0.95rem, 1.35vw, 1.1rem);

  /* Spacing */
  --as-space-1: 0.25rem;
  --as-space-2: 0.5rem;
  --as-space-3: 0.75rem;
  --as-space-4: 1rem;
  --as-space-5: 1.25rem;
  --as-space-6: 1.5rem;
  --as-space-8: 2rem;
  --as-space-10: 2.5rem;
  --as-space-12: 3rem;
  --as-space-16: 4rem;
  --as-space-20: 5rem;
  --as-space-section: clamp(5rem, 8vw, 7.5rem);

  /* Radius */
  --as-radius-xs: 0.625rem;
  --as-radius-sm: 0.875rem;
  --as-radius-md: 1rem;
  --as-radius-lg: 1.375rem;
  --as-radius-xl: 1.75rem;
  --as-radius-2xl: 2.25rem;
  --as-radius-pill: 999px;

  /* Shadows */
  --as-shadow-sm: 0 10px 24px rgba(14, 16, 36, 0.08);
  --as-shadow-md: 0 18px 50px rgba(14, 16, 36, 0.12);
  --as-shadow-lg: 0 32px 100px rgba(14, 16, 36, 0.16);
  --as-shadow-purple: 0 22px 60px rgba(91, 45, 244, 0.28);

  /* Layout */
  --as-container: 1160px;
  --as-container-wide: 1240px;
  --as-page-gutter: clamp(1rem, 4vw, 2rem);
  --as-header-height: 66px;
  --as-header-top: 14px;

  /* Breakpoints reference:
     phone-s: 360px
     phone: 430px
     tablet: 768px
     tablet-wide: 900px
     laptop-nav: 1100px
     desktop: 1280px
  */
}