@font-face {
    font-family: "Source Serif";
    font-style: normal;
    font-weight: normal;
    src: url("/fonts/SourceSerif/SourceSerif4-Regular.ttf.woff2") format("woff2");
}

@font-face {
    font-family: "Source Serif";
    font-style: italic;
    font-weight: normal;
    src: url("/fonts/SourceSerif/SourceSerif4-It.ttf.woff2") format("woff2");
}

@font-face {
    font-family: "Source Serif";
    font-style: normal;
    font-weight: bold;
    src: url("/fonts/SourceSerif/SourceSerif4-Bold.ttf.woff2") format("woff2");
}

@font-face {
    font-family: "Source Serif";
    font-style: italic;
    font-weight: bold;
    src: url("/fonts/SourceSerif/SourceSerif4-BoldIt.ttf.woff2") format("woff2");
}
/* @link https://utopia.fyi/type/calculator?c=320,19.2,1.25,1140,19.2,1.25,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l */

:root {
    --color-dark: #393839;
    --color-light: #F1F0EA;

    --step--2: clamp(0.83rem, calc(0.83rem + 0.00vw), 0.83rem);
    --step--1: clamp(1.00rem, calc(1.00rem + 0.00vw), 1.00rem);
    --step-0: clamp(1.20rem, calc(1.20rem + 0.00vw), 1.20rem);
    --step-1: clamp(1.44rem, calc(1.44rem + 0.00vw), 1.44rem);
    --step-2: clamp(1.73rem, calc(1.73rem + 0.00vw), 1.73rem);
    --step-3: clamp(2.07rem, calc(2.07rem + 0.00vw), 2.07rem);
    --step-4: clamp(2.49rem, calc(2.49rem + 0.00vw), 2.49rem);
    --step-5: clamp(2.99rem, calc(2.99rem + 0.00vw), 2.99rem);
}

/* Screen only! */
@media screen {
    /* elements */
    body {
        background-color: var(--color-light);
        font-size: var(--step-0);
        margin-block: 2em;
        margin-inline: auto;
        max-inline-size: 75ch;
        padding-inline: 2em;
    }

    h1 {
        font-size: var(--step-5);
    }

    h2 {
        font-size: var(--step-4);
    }

    h1,
    h2 {
        margin-block-start: 2em;
    }
}

/* elements */
body {
    color: var(--color-dark);
    font-family: 'Source Serif', serif;
    line-height: 1.5;
}

h1,
h2 {
    line-height: 1.1;
    margin-block-end: 0;
}

li {
    list-style-type: square;
}

/* classes */
.avoid-break {
    break-inside: avoid-page;
}

.subheading {
    font-style: italic;
    margin-block: 0.5em 0;
}

.subheading + .subheading {
    margin-block-start: 0;
}