/*
 * variables.css — GitSpire Technologies Design System Tokens
 * All custom properties used across the entire platform.
 */
:root {
  /* ── Brand Colors ──────────────────────────────────────────────────────── */
  --primary-navy:        #061c4f;
  --primary-blue:        #0b5cff;
  --secondary-blue:      #28a4ff;
  --accent-orange:       #ff7a00;
  --accent-orange-light: #ffad42;

  /* ── Backgrounds ──────────────────────────────────────────────────────── */
  --background:          #ffffff;
  --background-soft:     #f7f9fc;
  --background-navy:     #061c4f;
  --background-blue:     #0b5cff10;

  /* ── Text ─────────────────────────────────────────────────────────────── */
  --text-primary:        #07142f;
  --text-secondary:      #5e6a82;
  --text-muted:          #9aa3b5;
  --text-white:          #ffffff;
  --text-orange:         #ff7a00;

  /* ── Borders ──────────────────────────────────────────────────────────── */
  --border-soft:         #e6ebf3;
  --border-medium:       #c8d3e8;

  /* ── Status ───────────────────────────────────────────────────────────── */
  --success:             #1fa971;
  --warning:             #f0a000;
  --danger:              #dc3545;
  --info:                #0b5cff;

  /* ── Shadows ──────────────────────────────────────────────────────────── */
  --shadow-xs:   0 1px 3px rgba(6,28,79,.06);
  --shadow-sm:   0 2px 8px rgba(6,28,79,.09);
  --shadow-md:   0 4px 20px rgba(6,28,79,.10);
  --shadow-lg:   0 8px 40px rgba(6,28,79,.13);
  --shadow-xl:   0 16px 60px rgba(6,28,79,.16);

  /* ── Radius ───────────────────────────────────────────────────────────── */
  --radius-xs:   4px;
  --radius-sm:   8px;
  --radius-md:   14px;
  --radius-lg:   20px;
  --radius-xl:   28px;
  --radius-full: 9999px;

  /* ── Typography ───────────────────────────────────────────────────────── */
  --font-sans:  'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:  'JetBrains Mono', 'Fira Code', monospace;

  --fs-xs:   clamp(0.7rem,   1.5vw, 0.75rem);
  --fs-sm:   clamp(0.8rem,   1.8vw, 0.875rem);
  --fs-base: clamp(0.9rem,   2vw,   1rem);
  --fs-md:   clamp(1rem,     2.2vw, 1.125rem);
  --fs-lg:   clamp(1.1rem,   2.5vw, 1.25rem);
  --fs-xl:   clamp(1.25rem,  3vw,   1.5rem);
  --fs-2xl:  clamp(1.5rem,   3.5vw, 2rem);
  --fs-3xl:  clamp(1.75rem,  4vw,   2.5rem);
  --fs-4xl:  clamp(2rem,     5vw,   3rem);
  --fs-5xl:  clamp(2.5rem,   6vw,   3.75rem);
  --fs-hero: clamp(2.8rem,   7vw,   4.5rem);

  --fw-regular: 400;
  --fw-medium:  500;
  --fw-semibold:600;
  --fw-bold:    700;
  --fw-black:   900;

  --lh-tight:  1.15;
  --lh-snug:   1.35;
  --lh-normal: 1.6;
  --lh-relaxed:1.75;

  /* ── Spacing ──────────────────────────────────────────────────────────── */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10:2.5rem;
  --space-12:3rem;
  --space-16:4rem;
  --space-20:5rem;
  --space-24:6rem;

  /* ── Section spacing ──────────────────────────────────────────────────── */
  --section-py: clamp(3.5rem, 8vw, 6rem);

  /* ── Transitions ──────────────────────────────────────────────────────── */
  --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --ease-spring:    cubic-bezier(0.34, 1.56, 0.64, 1);
  --transition-fast:   150ms var(--ease-out-quart);
  --transition-base:   250ms var(--ease-out-quart);
  --transition-slow:   400ms var(--ease-out-quart);

  /* ── Z-index ──────────────────────────────────────────────────────────── */
  --z-dropdown:    100;
  --z-sticky:      200;
  --z-overlay:     300;
  --z-modal:       400;
  --z-toast:       500;
  --z-chatbot:     600;
  --z-cookie:      700;
}
