/* ========================================================================
   GEO SOLUTIONS — DESIGN TOKENS
   Source of truth: design-tokens-geosolutions.md v1.1
   
   These tokens are referenced by all other CSS files.
   To change colors / fonts / spacing site-wide — change here.
   ======================================================================== */

:root {
  /* ===== FONT FAMILIES ===== */
  --font-display: "General Sans", -apple-system, "Segoe UI", system-ui, sans-serif;
  --font-body:    "General Sans", -apple-system, "Segoe UI", system-ui, sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, monospace;

  /* ===== COLORS — DARK MODE (CANONICAL) ===== */

  /* Surfaces */
  --color-bg-base:        #0A0A0B;
  --color-bg-raised:      #141417;
  --color-bg-elevated:    #1C1C20;

  /* Text */
  --color-text-primary:   #FAFAFA;
  --color-text-secondary: #A1A1A6;
  --color-text-tertiary:  #6E6E76;
  --color-text-inverse:   #0A0A0B;

  /* Borders */
  --color-border-subtle:  #1F1F23;
  --color-border-strong:  #2E2E34;

  /* Brand accent */
  --color-accent:         #FF00C8;
  --color-accent-hover:   #E600B4;
  --color-accent-muted:   rgba(255, 0, 200, 0.08);
  --color-accent-text:    #1A0014;

  /* Semantic — sparingly used */
  --color-success:        #7DFFAA;
  --color-warning:        #FFB454;
  --color-danger:         #FF6B6B;

  /* ===== TYPE SCALE ===== */
  --text-display-xl:   clamp(3.5rem, 8vw, 6rem);     /* 56–96px hero h1 */
  --text-display-lg:   clamp(3rem, 6vw, 4.5rem);     /* 48–72px section h1 */
  --text-display-md:   clamp(2.25rem, 4vw, 3rem);    /* 36–48px h2 */
  --text-h3:           1.875rem;                      /* 30px */
  --text-h4:           1.5rem;                        /* 24px */
  --text-h5:           1.25rem;                       /* 20px */
  --text-body-lg:      1.125rem;                      /* 18px */
  --text-body:         1rem;                          /* 16px */
  --text-body-sm:      0.9375rem;                     /* 15px */
  --text-caption:      0.875rem;                      /* 14px */
  --text-micro:        0.8125rem;                     /* 13px */
  --text-mono-sm:      0.8125rem;                     /* 13px */

  /* ===== LINE HEIGHTS ===== */
  --leading-tight:     1.05;
  --leading-snug:      1.2;
  --leading-normal:    1.5;
  --leading-relaxed:   1.65;

  /* ===== FONT WEIGHTS ===== */
  --weight-regular:    400;
  --weight-medium:     500;
  --weight-semibold:   600;

  /* ===== LETTER SPACING ===== */
  --tracking-tight:    -0.02em;
  --tracking-normal:   0;
  --tracking-wide:     0.04em;
  --tracking-widest:   0.08em;

  /* ===== SPACING SCALE (4px base) ===== */
  --space-1:    0.25rem;     /* 4px */
  --space-2:    0.5rem;      /* 8px */
  --space-3:    0.75rem;     /* 12px */
  --space-4:    1rem;        /* 16px */
  --space-6:    1.5rem;      /* 24px */
  --space-8:    2rem;        /* 32px */
  --space-12:   3rem;        /* 48px */
  --space-16:   4rem;        /* 64px */
  --space-24:   6rem;        /* 96px */
  --space-32:   8rem;        /* 128px */
  --space-48:   12rem;       /* 192px */

  /* ===== BORDER RADII ===== */
  --radius-sm:     4px;
  --radius-md:     6px;
  --radius-lg:     8px;
  --radius-xl:     12px;
  --radius-full:   9999px;

  /* ===== MOTION ===== */
  --duration-instant:   100ms;
  --duration-fast:      200ms;
  --duration-base:      300ms;
  --duration-slow:      500ms;

  --ease-default:       cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out:           cubic-bezier(0, 0, 0.2, 1);
  --ease-in:            cubic-bezier(0.4, 0, 1, 1);
  --ease-in-out:        cubic-bezier(0.4, 0, 0.2, 1);

  /* ===== LAYOUT ===== */
  --container-narrow:    640px;
  --container-default:   1200px;
  --container-wide:      1440px;
}

/* ===== LIGHT MODE — Phase 5.2+ (not active at launch) =====
   Light mode is supported by design tokens v1.1 but not implemented at Day-1.
   Will be enabled via [data-theme="light"] selector later. */