/* Variables */

:root {
    --color-base: #222;
    --color-highlight: #E5422B;
    --color-muted: #AAA;
    --layout-site-gutter: 2rem;
    --layout-site-section-spacer: 6rem;
    --layout-site-width: 60rem; 
    --type-system-ui: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    --type-technical: monospace;
}

/* Containers */

.page-container {
    max-width: 1280px;
    margin: 0 auto;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}


body {
    color: var(--color-base);
    font-family: var(--type-system-ui);
    line-height: 1.5;
    margin: 0; 
    /* padding: var(--layout-site-gutter) max(var(--layout-site-gutter), calc((100vw - var(--layout-site-width)) / 2)); */
}