:root {
    /* COLORS */
    --color-primary: #000000;
    --color-secondary: #ffffff;
    --color-accent: #333333;
    --color-neutral: #666666;
    --color-light: #f0f0f0;
    --color-lighter: #f5f5f5;
    --color-placeholder: #e8e8e8;

    /* TYPOGRAPHY */
    --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
    --font-size-xs: 12px;
    --font-size-sm: 13px;
    --font-size-base: 14px;
    --font-size-md: 15px;
    --font-size-lg: 18px;
    --font-size-xl: 24px;
    --font-size-2xl: 32px;
    --font-size-3xl: 48px;

    --font-weight-light: 300;
    --font-weight-medium: 500;
    --font-weight-bold: 600;

    --letter-spacing-tight: 0px;
    --letter-spacing-normal: 0.5px;
    --letter-spacing-wide: 1px;
    --letter-spacing-wider: 2px;

    /* SPACING */
    --spacing-xs: 10px;
    --spacing-sm: 20px;
    --spacing-md: 40px;
    --spacing-lg: 60px;
    --spacing-xl: 80px;
    --spacing-2xl: 100px;

    /* LAYOUT */
    --header-height: 70px;
    --max-width: 1200px;
    --max-width-text: 800px;

    /* RADIUS */
    --radius-sm: 2px;
    --radius-md: 4px;

    /* TRANSITIONS */
    --transition-fast: 0.15s ease-in-out;
    --transition-normal: 0.3s ease-in-out;
}