@font-face {
  font-family: 'Chivo';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url('/assets/fonts/Chivo-Regular.woff2') format('woff2');
}

@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/assets/fonts/SpaceGrotesk-Bold.woff2') format('woff2');
}
/* Tokens */
:root {
    /* Colors - High contrast, industrial, avoiding generic purple/blue/glassmorphism */
    --color-bg: #f9f9f8; /* Off-white paper */
    --color-fg: #111111; /* Almost black */
    --color-fg-muted: #555555;

    --color-brand: #da291c; /* A specific, intentional red (Pantone 485C) */
    --color-brand-muted: #f5e6e5;

    --color-border: #d4d4d4;
    --color-surface: #ffffff;
    --color-surface-alt: #ececec;

    --color-chart-1: #111111;
    --color-chart-2: #555555;
    --color-chart-3: #999999;
    --color-chart-4: #da291c;

    /* Typography */
    --font-display: 'Space Grotesk', system-ui, sans-serif;
    --font-text: 'Chivo', system-ui, sans-serif;

    /* Fluid Typography (320px to 1200px) */
    --step--2: clamp(0.7014rem, 0.6723rem + 0.1453vw, 0.8rem);
    --step--1: clamp(0.8767rem, 0.814rem + 0.3134vw, 1.09rem);
    --step-0: clamp(1.0959rem, 0.9856rem + 0.5513vw, 1.4705rem);
    --step-1: clamp(1.3699rem, 1.1927rem + 0.886vw, 1.9705rem);
    --step-2: clamp(1.7123rem, 1.4423rem + 1.3503vw, 2.6289rem);
    --step-3: clamp(2.1404rem, 1.7417rem + 1.9934vw, 3.4939rem);
    --step-4: clamp(2.6755rem, 2.0999rem + 2.8782vw, 4.6253rem);
    --step-5: clamp(3.3444rem, 2.5273rem + 4.0857vw, 6.1235rem);

    /* Spacing */
    --space-3xs: clamp(0.25rem, 0.2324rem + 0.088vw, 0.31rem);
    --space-2xs: clamp(0.5rem, 0.4648rem + 0.1761vw, 0.62rem);
    --space-xs: clamp(0.75rem, 0.6972rem + 0.2641vw, 0.93rem);
    --space-s: clamp(1rem, 0.9296rem + 0.3521vw, 1.24rem);
    --space-m: clamp(1.5rem, 1.3944rem + 0.5282vw, 1.86rem);
    --space-l: clamp(2rem, 1.8592rem + 0.7042vw, 2.48rem);
    --space-xl: clamp(3rem, 2.7887rem + 1.0563vw, 3.72rem);
    --space-2xl: clamp(4rem, 3.7183rem + 1.4085vw, 4.96rem);
    --space-3xl: clamp(6rem, 5.5775rem + 2.1127vw, 7.44rem);

    /* Layout */
    --container-max: 1200px;
    --container-tight: 800px;
    --grid-gap: var(--space-m);

    /* Shapes - Intentional lack of rounded corners to avoid cliches */
    --radius-none: 0;
    --radius-sm: 2px;
}