@layer modifiers {
    body {
        main {

            padding-top: 5em;

            width: 640px;
            margin: auto;

            color: #45556C;


            /* Body/primary */
            font-family: 'Inter';
            font-style: normal;
            font-weight: 400;
            font-size: 16px;
            line-height: 26px;
            /* identical to box height, or 162% */
            letter-spacing: -0.4px;

            color: #45556C;

            .byline {
                font-size: .75rem;

                a, :visited {
                    text-decoration: none;
                }
            }

            nav {
                margin-bottom: 48px;

                ol {
                    padding: 0;

                    li {
                        display: inline-block;

                        a {
                            text-decoration: none;
                        }                    
                    }

                    li:before {
                        content: "> ";
                    }

                    li:first-child:before {
                        content: "⌂ "
                    }
                }

            }

            h1 {
                /* Headline/Desktop/secondary */
                font-family: 'Source Serif Pro';
                font-style: normal;
                font-weight: 400;
                font-size: 56px;
                line-height: 48px;
                /* identical to box height, or 86% */
                letter-spacing: -2.5px;

                color: #020618;
            }

            h2 {
                width: 446px;
                height: 24px;

                font-family: 'Source Serif Pro';

                /* Title/primary */
                font-family: 'Inter';
                font-style: normal;
                font-weight: 600;
                font-size: 16px;
                line-height: 24px;
                margin-top: 1rem;

                /* identical to box height, or 150% */
                letter-spacing: -0.6px;
                margin-bottom: 1rem;
            }

            p {
                margin-top: 1rem;
            }

            section, section:last-child p {
                padding-bottom: 1rem;
                border-bottom: 1px solid #E2E8F0;
                margin-top: 1rem;
            }

            section:last-child {
                border-bottom: none;
                margin-bottom: 4rem;
            }

            a, :visited {
                line-height: 24px;
                /* identical to box height, or 150% */
                text-align: center;
                letter-spacing: -0.6px;

                color: #020618;
            }

            ol {

                padding-left: 5px;

                li {
                    list-style-type: none;

                    h2 {
                        /* Headline/Desktop/secondary */
                        font-family: 'Source Serif Pro';
                        font-style: normal;
                        font-weight: 400;
                        line-height: 48px;

                        font-size: 24px;
                        padding-bottom: 40px;
                        color: #020618;
                    }
                }
            }

        }

        footer {
            margin-top: 2em;
        }
    }
}