:root {
    --color-paper: #fffaf0;
    --color-cream: #f1e9db;
    --color-ink: #242522;
    --color-sage: #b9d35d;
    --color-sage-dark: #405a43;
    --color-pink: #ed7fa9;
    --color-pink-dark: #b34c75;
    --color-rose: #c69b98;
    --color-line: rgb(36 37 34 / 24%);
    --font-display: Georgia, "Times New Roman", serif;
    --font-body: Arial, Helvetica, sans-serif;
    --page-gutter: 1.375rem;
    --header-size: 5.35rem;
    --transition-fast: 180ms ease;
    --transition-slow: 820ms cubic-bezier(.22, 1, .36, 1);
}

@media (min-width: 48rem) {
    :root {
        --page-gutter: 3.75rem;
        --header-size: 6.5rem;
    }
}

@media (min-width: 73.75rem) {
    :root {
        --page-gutter: clamp(5rem, 7vw, 7.5rem);
    }
}