body {
    word-break: break-word;
}
// Basic layout of content
body > main {
    @extend .row;

    & > header {
        @extend .col-12;
        @extend .order-xl-1;
        margin-bottom: $spacer * 2;
    }

    & > aside {
        @extend .col-xl-4;
        @extend .col-12;
        @extend .order-xl-3;

        nav ul {
            list-style: none;
            padding-left: 0;
        }
    }

    & > section {
        @extend .col-xl-8;
        @extend .col-12;
        @extend .order-xl-2;
    }

    & article > aside {
        margin-bottom: $spacer * 2;

        nav ul {
            list-style: none;
            padding-left: 0;
        }
    }
}

aside,
main > header {
    h1, h2, h3, h4, h5, h6 {
        padding : 0;
        margin: 0;
    }
}

section > article {
    margin-bottom: 4rem;

    &:last-of-type {
        margin-bottom: 0;
    }
}

article {
    &:first-of-type {
        padding-top: 0;
        margin-top: 0;
    }

    margin-top: 2.75em;

    main {
        h1:first-of-type {
            padding-top: 0;
        }
    }

    & > header {
        font-size: 1.25em;
        margin-bottom: $spacer * 2;

        h1, h2, h3, h4, h5, h6 {
            padding-bottom: 0;
        }

        p {
            font-size: 0.75em;
            margin: 0;
        }
    }
}

main > article > main > h2:first-of-type,
main > section > h2:first-of-type,
main article h1 {
    padding-top: 0;
}

aside,
nav {
    details > summary > h2 {
        display: inline;
    }
}

@media (max-width: 1439px) {
    body > main {
        & aside {
            padding-bottom: 0;

            h1, h2, h3, h4, h5, h6 {
                margin-bottom: 0;
            }
        }
        & aside,
        & article > aside {
            li {
                margin-right: $spacer;
                line-height: $spacer * 2;
            }
            nav ul {
                columns: 4;
            }
        }
    }

    article {
        padding-top: 0;

        header h1 {
            padding-top: 0;
        }
    }
}

@media (max-width: 768px) {
    body > main {
        & article aside,
        & aside {
            nav {
                ul {
                    columns: 2;
                }
            }
        }
    }
}