body {
    height: 100%;

    display: block grid;
    grid-template-areas: "header" "main" "footer";
    grid-template-columns: minmax(1fr, var(--bluelib-main-width));
    grid-template-rows: auto 1fr auto;
    gap: var(--bluelib-block-gap);
}

header {
    grid-area: header;
}

main {
    grid-area: main;
}

footer {
    grid-area: footer;
}

header,
footer {
    text-align: center;
}

main {
    display: block flex;
    flex-direction: column;
    gap: var(--bluelib-block-gap);
}