/* ============================================================
   ALTIRA AI — DESIGN TOKENS
   Single source of truth. Champagne / dark / Newsreader+Inter.
   ============================================================ */

:root {
  /* COLOR — black ground, champagne accent */
  --color-bg-deep:   #0D0C0A;
  --color-bg-base:   #0D0C0A;
  --color-bg-mid:    #14130F;
  --color-bg-card:   rgba(255, 255, 255, 0.018);

  --color-text-primary:   #F0EDE5;
  --color-text-secondary: rgba(240, 237, 229, 0.66);
  --color-text-muted:     rgba(240, 237, 229, 0.42);
  --color-text-dim:       rgba(240, 237, 229, 0.20);

  --color-accent:              #C9B17F;
  --color-accent-dim:          rgba(201, 177, 127, 0.65);
  --color-accent-glow-strong:  rgba(201, 177, 127, 0.32);
  --color-accent-glow:         rgba(201, 177, 127, 0.16);
  --color-accent-glow-soft:    rgba(201, 177, 127, 0.06);

  --color-border:        rgba(255, 255, 255, 0.08);
  --color-border-strong: rgba(255, 255, 255, 0.16);
  --color-divider:       rgba(255, 255, 255, 0.05);

  /* TYPOGRAPHY */
  --font-serif: 'Newsreader', Georgia, 'Times New Roman', serif;
  --font-sans:  'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono:  'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  --fs-micro:   0.6875rem;  /* 11px — mono meta */
  --fs-small:   0.8125rem;  /* 13px — mono labels */
  --fs-body:    1rem;       /* 16px — body */
  --fs-body-lg: 1.125rem;   /* 18px */
  --fs-h4:      1.5rem;     /* 24px */
  --fs-h3:      2.125rem;   /* 34px */
  --fs-h2:      clamp(2.25rem, 4vw + 0.5rem, 4rem);
  --fs-h1:      clamp(3rem, 7vw + 0.75rem, 7.25rem);
  --fs-number:  clamp(2.5rem, 5vw, 4rem);
  --fs-stat:    clamp(2rem, 4vw, 3.5rem);

  --lh-tight: 1.0;
  --lh-snug:  1.15;
  --lh-base:  1.55;
  --lh-prose: 1.65;

  --tracking-wide:  0.16em;
  --tracking-wider: 0.32em;
  --tracking-tight: -0.025em;

  /* SPACING */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 2.75rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --space-10: 8rem;
  --space-11: 10rem;

  --section-py: clamp(80px, 12vw, 160px);
  --container-px: clamp(20px, 4vw, 56px);
  --container-max: 1280px;
  --container-narrow: 880px;

  /* RADIUS */
  --radius-xs:   6px;
  --radius-sm:   10px;
  --radius-md:   16px;
  --radius-lg:   20px;
  --radius-xl:   28px;
  --radius-pill: 999px;
  --border-thin: 1px;

  /* SHADOWS */
  --shadow-lift:        0 24px 70px -22px rgba(0, 0, 0, 0.65), 0 10px 28px -10px rgba(0, 0, 0, 0.45);
  --shadow-glow:        0 0 40px rgba(201, 177, 127, 0.16);
  --shadow-glow-strong: 0 0 60px rgba(201, 177, 127, 0.30);

  /* MOTION */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.76, 0, 0.24, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  --dur-instant: 120ms;
  --dur-fast: 200ms;
  --dur-base: 360ms;
  --dur-slow: 600ms;
  --dur-crawl: 1200ms;

  /* Z */
  --z-bg: 0;
  --z-content: 5;
  --z-nav: 50;
  --z-modal: 100;
}