@font-face {
    font-family: "MontserratUnderline";
    src: url("../fonts/MontserratUnderline-VariableFont_wght.woff2") format("woff2")
}

:root {
    --font-size: 1.125rem;
    --factor: 1.5;

    font-family: MontserratUnderline, sans-serif;
    line-height: 1.4;
}

p {
    font-size: var(--font-size);
}

section {
    max-width: 80rem;
    margin-inline: auto;
    padding-inline: 1rem;

    .metadetails {
        font-style: italic;
    }

    .introduction {
        font-weight: bold;

    }

    >h1 {
        font-size: calc(var(--font-size) * (3 * var(--factor)));

        +p {
            margin-block-start: 2rem;
        }
    }

    >h2 {
        font-size: calc(var(--font-size) * (2 * var(--factor)));

        +p {
            margin-block-start: 2rem;
        }
    }

    >h3 {
        font-size: calc(var(--font-size) * (1 * var(--factor)));

        +p {
            margin-block-start: 2rem;
        }
    }

    >h2 {
        +h3 {
            margin-block-start: 0.1rem;
        }
    }
}