/* Telemetrica International - Design Tokens (v1)
   Single source of truth: colors, type, spacing, radii, shadows.
*/

:root {
  /* Brand */
  --color-primary: #03aae5;
  --color-primary-700: #0288c7;
  --color-primary-500: #03aae5;
  --color-primary-300: #00c9ff;

  /* Neutrals */
  --color-bg: #ffffff;
  --color-surface: #ffffff;
  --color-surface-elev: #f6f8fb;
  --color-border: #e4e8f0;

  --color-text: #1a1a1a;
  --color-text-muted: #5c667a;
  --color-text-on-dark: #ffffff;

  /* Links */
  --color-link: var(--color-primary-700);
  --color-link-hover: var(--color-primary);

  /* Status */
  --color-success: #16a34a;
  --color-warning: #f59e0b;
  --color-danger: #ef4444;

  /* Dark surfaces (header/footer) */
  --color-dark: #0a0e27;
  --color-dark-2: #10183a;

  /* Typography */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell,
    "Helvetica Neue", Arial, sans-serif;

  --text-sm: 0.875rem;   /* 14 */
  --text-body: 1rem;     /* 16 */
  --text-lg: 1.125rem;   /* 18 */
  --text-xl: 1.25rem;    /* 20 */

  --lh-tight: 1.2;
  --lh-normal: 1.5;
  --lh-loose: 1.65;

  /* Spacing (8pt scale) */
  --space-0: 0px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;
  --space-9: 48px;
  --space-10: 64px;

  /* Radii */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-pill: 999px;

  /* Shadows */
  --shadow-sm: 0 4px 12px rgba(16, 24, 40, 0.08);
  --shadow-md: 0 10px 24px rgba(16, 24, 40, 0.12);
  --shadow-lg: 0 18px 45px rgba(16, 24, 40, 0.16);

  /* Layout */
  --container-max: 1200px;
  --container-pad: 16px;

  /* Focus */
  --focus-ring: 0 0 0 3px rgba(3, 170, 229, 0.35);

  /* Motion */
  --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
  --dur-1: 150ms;
  --dur-2: 220ms;
}

@media (min-width: 768px) {
  :root {
    --container-pad: 24px;
  }
}