/* AOG Hub Design System — Colors & Typography tokens
   Sourced from DesignSysten/aoghub-design-system v1.0.0
   Subset of Inter weights loaded for the marketing site. */

@font-face { font-family: 'Inter'; src: url('../fonts/Inter-Regular.otf') format('opentype');   font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-Medium.otf') format('opentype');    font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-SemiBold.otf') format('opentype');  font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-Bold.otf') format('opentype');      font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-ExtraBold.otf') format('opentype'); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('../fonts/Inter-Black.otf') format('opentype');     font-weight: 900; font-style: normal; font-display: swap; }

:root {
  /* Brand */
  --color-brand-50:  #EAEEF7;
  --color-brand-100: #CBD6EC;
  --color-brand-200: #9DB0D9;
  --color-brand-300: #6F8AC6;
  --color-brand-400: #41639E;
  --color-brand-500: #1E3A8A;   /* Primary brand navy */
  --color-brand-600: #1A3279;
  --color-brand-700: #152968;
  --color-brand-800: #102052;
  --color-brand-900: #0A1538;

  /* Neutrals */
  --color-neutral-0:   #FFFFFF;
  --color-neutral-50:  #F9FAFB;
  --color-neutral-100: #F3F4F6;
  --color-neutral-200: #E5E7EB;
  --color-neutral-300: #D1D5DB;
  --color-neutral-400: #9CA3AF;
  --color-neutral-500: #6B7280;
  --color-neutral-600: #4B5563;
  --color-neutral-700: #374151;
  --color-neutral-800: #1F2937;
  --color-neutral-900: #111827;

  /* Semantic */
  --color-danger-500:  #EF4444;
  --color-warning-500: #F59E0B;
  --color-success-500: #0EA5E9;
  --color-info-500:    #3B82F6;

  /* AOG priority */
  --color-aog-critical: #EF4444;
  --color-aog-delay:    #F59E0B;
  --color-aog-routine:  #0EA5E9;

  /* Aliases */
  --color-primary:        var(--color-brand-500);
  --color-primary-hover:  var(--color-brand-700);
  --color-primary-light:  var(--color-brand-50);

  --color-bg:             #F0F2F5;
  --color-surface:        var(--color-neutral-0);
  --color-surface-subtle: var(--color-neutral-50);
  --color-ink:            var(--color-neutral-900);   /* dark sections */

  --color-border:        var(--color-neutral-200);
  --color-border-strong: var(--color-neutral-300);

  --color-text:           var(--color-neutral-900);
  --color-text-secondary: var(--color-neutral-500);
  --color-text-tertiary:  var(--color-neutral-400);
  --color-text-inverse:   var(--color-neutral-0);
  --color-text-link:      var(--color-brand-600);

  /* Typography */
  --font-family-base: 'Inter', system-ui, -apple-system, sans-serif;
  --font-family-mono: 'Courier New', 'Menlo', monospace;

  --font-weight-regular:  400;
  --font-weight-medium:   500;
  --font-weight-semibold: 600;
  --font-weight-bold:     700;
  --font-weight-extrabold:800;
  --font-weight-black:    900;

  --letter-spacing-tight:  -0.02em;
  --letter-spacing-wide:    0.04em;
  --letter-spacing-widest:  0.08em;

  /* Spacing scale (base 4px) */
  --space-1: 4px;   --space-2: 8px;   --space-3: 12px;  --space-4: 16px;
  --space-5: 20px;  --space-6: 24px;  --space-8: 32px;  --space-10: 40px;
  --space-12: 48px; --space-16: 64px; --space-20: 80px; --space-24: 96px;

  /* Radii */
  --radius-sm:   4px;
  --radius-md:   6px;
  --radius-lg:   8px;
  --radius-xl:   12px;
  --radius-2xl:  20px;
  --radius-full: 9999px;

  /* Shadows */
  --shadow-xs: 0 1px 2px rgba(0,0,0,0.05);
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.07), 0 1px 2px rgba(0,0,0,0.04);
  --shadow-md: 0 4px 6px rgba(0,0,0,0.07), 0 2px 4px rgba(0,0,0,0.04);
  --shadow-lg: 0 10px 15px rgba(0,0,0,0.08), 0 4px 6px rgba(0,0,0,0.04);
  --shadow-xl: 0 20px 25px rgba(0,0,0,0.10), 0 8px 10px rgba(0,0,0,0.04);

  /* Layout */
  --content-max-width: 1200px;
  --nav-height: 72px;
}