:root {
    --color-paper: #f3ebdd;
    --color-paper-light: #f7f1e7;
    --color-bone: #e7dfd0;
    --color-charcoal: #29241f;
    --color-petrol: #315a5b;
    --color-berry: #8b3c52;
    --color-saffron: #d39a38;
    --color-moss: #66704c;
    --color-thread: #e8dcc7;
    --color-muted: #716a61;
    --color-line: rgb(41 36 31 / 24%);
    --font-display: Georgia, "Times New Roman", serif;
    --font-body: Arial, Helvetica, sans-serif;
    --page-gutter: 1.25rem;
    --spine-size: 5rem;
    --transition-fast: 180ms ease;
    --transition-slow: 820ms cubic-bezier(.22, 1, .36, 1);
}

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

@media (min-width: 73.75rem) {
    :root {
        --page-gutter: 5.5vw;
        --spine-size: 9.5rem;
    }
}