:root {
    --padding-inline: 20px;
    --content-max-width: 1160px;
}

body {
    display: grid;
    grid-template-columns: [body-full-width-start] minmax(var(--padding-inline), 1fr) [body-content-start] min( 100% - (var(--padding-inline) * 2), var(--content-max-width) ) [body-content-end] minmax(var(--padding-inline), 1fr) [body-full-width-end];
}

    body > header, body > footer {
        grid-column: body-content;
    }

main {
    grid-column: body-full-width;
    display: grid;
    grid-template-columns: [full-width-start] minmax(var(--padding-inline), 1fr) [content-start] min( 100% - (var(--padding-inline) * 2), var(--content-max-width) ) [content-end] minmax(var(--padding-inline), 1fr) [full-width-end];
}

    main > * {
        grid-column: content;
        margin-bottom: 30px;
    }

.intro > * {
    grid-column: content;
    margin-bottom: 10px !important;
}

.richTextBlock {
    /* a container for rich text where we don't know if it will have one or more <p> tags */
}
/* footer line */
footer {
    border-top: 1px solid var(--green);
    padding-top: 50px;
}
