/* ============================================================
   Apertool AI — Design Tokens
   Single source of truth for color, type, space, radius, motion.
   data-model.md §3
   ============================================================ */

:root {
  /* ---- Color: light, airy neutrals + deep ink + single teal accent ---- */
  --ink: #14181c;          /* primary text */
  --ink-2: #2b333b;        /* headings on light */
  --muted: #586472;        /* secondary text (AA on --bg) */
  --bg: #ffffff;           /* page base */
  --bg-2: #f5f8f9;         /* alternating section wash */
  --surface: #ffffff;      /* card base */
  --glass: rgba(255, 255, 255, 0.55); /* glassmorphic panel */
  --glass-strong: rgba(255, 255, 255, 0.78);
  --border: rgba(20, 24, 28, 0.10);   /* hairline */
  --border-2: rgba(20, 24, 28, 0.16);

  /* Brand teal (carried from existing brand) */
  --accent: #2f8f87;            /* accent for flows/marks */
  --accent-strong: #1f6b64;     /* button bg — white text passes AA */
  --accent-ink: #0f4d48;        /* accent text on light (AA) */
  --accent-soft: #8fc7c2;       /* glows, diagram halos */
  --accent-wash: rgba(47, 143, 135, 0.08);

  /* Contrast accent — warm coral (used sparingly for spark/contrast) */
  --coral: #ff7a59;             /* decorative: gradients, glows */
  --coral-strong: #e15a39;      /* fills/borders */
  --coral-ink: #b23a1e;         /* text on light — AA */
  --coral-soft: #ffb8a3;
  --coral-wash: rgba(255, 122, 89, 0.10);

  /* Status */
  --error: #b4233a;
  --error-bg: #fdecee;
  --success: #1f6b64;

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(16, 24, 28, 0.06);
  --shadow-md: 0 10px 30px rgba(16, 24, 28, 0.08);
  --shadow-lg: 0 24px 60px rgba(16, 24, 28, 0.12);
  --shadow-accent: 0 12px 40px rgba(31, 107, 100, 0.22);

  /* ---- Typography ---- */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --fs-display: clamp(2.6rem, 1.6rem + 4.2vw, 5rem);
  --fs-h1: clamp(2rem, 1.4rem + 2.6vw, 3.25rem);
  --fs-h2: clamp(1.5rem, 1.2rem + 1.4vw, 2.25rem);
  --fs-h3: clamp(1.15rem, 1.05rem + 0.5vw, 1.4rem);
  --fs-body: clamp(1rem, 0.97rem + 0.18vw, 1.125rem);
  --fs-lead: clamp(1.12rem, 1rem + 0.6vw, 1.4rem);
  --fs-small: 0.875rem;
  --lh-tight: 1.12;
  --lh-snug: 1.3;
  --lh-body: 1.65;
  --tracking-tight: -0.02em;
  --tracking-wide: 0.08em;

  /* ---- Space scale ---- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --space-10: 8rem;
  --section-y: clamp(4rem, 3rem + 6vw, 8rem);
  --maxw: 1120px;
  --maxw-narrow: 760px;

  /* ---- Radius / blur ---- */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-pill: 999px;
  --blur: 14px;

  /* ---- Motion (consumed only when motion is allowed) ---- */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 180ms;
  --dur-base: 420ms;
  --dur-slow: 720ms;
}