:root {
    --color-primary: #445060;
    --color-secondary: #6b7280;
    --color-background: #f3f4f6;
    --spacing-base: 1rem;
    --font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
}

body {
    background-color: var(--color-background);
    font-family: var(--font-family);
}

header, footer {
    background-color: var(--color-primary);
    color: white;
}

nav a:hover {
    background-color: var(--color-secondary);
    color: white;
}