:root {

    /* Layout */
    --max-width: 1200px;
    --hero-height: 300px;

    /* Colors */
    --color-bg: #dfe5f9;  /* Seitenhintergrund */
    --color-primary: #0b1c2d;   /* Dunkelblau */
    --color-accent: #c8a85d;
    --color-light: #ffffff;
    --color-dark: #111111;
    --color-gray: #f5f5f5;

    /* Spacing */
    --space-xs: 6px;
    --space-sm: 10px;
    --space-md: 16px;
    --space-lg: 32px;
    --space-xl: 60px;

    /* Radius */
    --radius-sm: 4px;
    --radius-md: 8px;

    /* Breakpoints */
    --bp-tablet: 768px;
    --bp-desktop: 992px;
}