:root{
    /* Brand colors */
    --color-cd-rot: #FF0000;
    --color-cd-dunkelrot: #6F003C;
    --color-cd-dunkelgruen: #004B5B;
    --color-cd-tuerkis: #00B19C;
    --color-cd-violett: #8100A1;
    --color-cd-rosa: #D675D8;
    --color-cd-blau: #2E4FC4;
    --color-cd-hellblau: #D4D4FF;

    --color-primary: var(--color-cd-rot);
    --color-secondary: var(--color-cd-dunkelrot);
    --color-tertiary: var(--color-cd-dunkelgruen);
    --color-quaternary: var(--color-cd-tuerkis);

    --color-white: #ffffff;
    --color-dark: #111111;
    --color-muted: #4b5563;

    --background-body: #f8f8f8;
    --background-wrapper: var(--color-white);

    :root{
        --nav-bg: rgba(106, 15, 160, .35);
        --nav-bg-hover: rgba(106, 15, 160, .55);
        --nav-icon: #fff;
        --nav-border: rgba(255,255,255,.25);
    }

    --section-white: var(--color-white);
    --section-primary: var(--color-cd-dunkelrot);
    --section-secondary: var(--color-secondary);
    --section-tertiary: var(--color-tertiary);
    --section-quaternary: var(--color-quaternary);
    --section-footer: var(--color-cd-dunkelgruen);

    /* Layout / UI tokens */
    --wrapper-width: 1100px;
    --radius: 10px;
    --shadow: 0 8px 24px rgba(0,0,0,.08);

    --gutter: 1rem;
    --gutter-h2: 0.5rem;
    --gap: 2rem;

    --font-inter-regular: "Inter Regular", system-ui, Arial, sans-serif;
    --font-inter-bold: "Inter Bold", system-ui, Arial, sans-serif;
    --font-worksans-black: "WorkSans Black", system-ui, Arial, sans-serif;
    --font-worksans-light: "WorkSans Light", system-ui, Arial, sans-serif;

    --fw-thin: 100;
    --fw-light: 300;
    --fw-regular: 400;
    --fw-medium: 500;
    --fw-semibold: 600;
    --fw-bold: 700;
    --fw-black: 900;

    /* Headline sizes (px -> rem, base 16px) */
    --h1: 3.375rem;  /* 54px */
    --h2: 2.625rem;  /* 42px */
    --h3: 1.875rem;  /* 30px */
    --h4: 1.5rem;    /* 24px */
    --h5: 1.125rem;  /* 18px */
    --h6: 1rem;      /* 16px */
    --h7: 0.875rem;  /* 14px */
    --h8: 0.75rem;   /* 12px */
    --h9: 0.625rem;  /* 10px */
}