:root {
  --warpweb-brand-primary: #2ea3f2;
  --warpweb-brand-primary-ch: 46 163 242;
  --warpweb-brand-secondary: #1f1f1f;
  --warpweb-brand-secondary-ch: 31 31 31;
  --warpweb-brand-accent: #eac035;
  --warpweb-brand-accent-ch: 234 192 53;
  --warpweb-brand-foreground: #14293f;
  --warpweb-brand-foreground-ch: 20 41 63;
  --warpweb-brand-muted: #5f7995;
  --warpweb-brand-muted-ch: 95 121 149;
  --warpweb-brand-surface: #ffffff;
  --warpweb-brand-surface-ch: 255 255 255;
  --warpweb-brand-surface-alt: #f5fafe;
  --warpweb-brand-surface-alt-ch: 245 250 254;
  --warpweb-brand-border: #d4e2f0;
  --warpweb-brand-border-ch: 212 226 240;
  --warpweb-brand-danger: #dc2626;
  --warpweb-brand-danger-ch: 220 38 38;
  --warpweb-brand-font: 'DM Sans', system-ui, -apple-system, sans-serif;
  --warpweb-brand-font-display: 'Sora', system-ui, -apple-system, sans-serif;
  --warpweb-brand-radius: 0.625rem;
}

body {
  font-family: var(--warpweb-brand-font);
  color: var(--warpweb-brand-foreground);
  background-color: var(--warpweb-brand-surface);
}

h1, h2, h3, h4 {
  font-family: var(--warpweb-brand-font-display);
}