/* Wide frontend layout. Below 1600 CSS px all existing rules remain unchanged.
 * 1320px means visible content, excluding wrapper gutters (24px or Bootstrap 15px).
 * Keep selectors scoped: no admin, modal, compact auth/QR, or video-player sizing.
 */
@media (min-width: 1600px) {
    /* Bootstrap wrappers: 1350 - 15 * 2 = 1320. */
    body > .navbar > .container,
    body .container.tutorial-page,
    body #content-container.container,
    body #container.container {
        width: 1350px;
        max-width: 1350px;
    }

    /* Keep the member navigation at its original 1170 / 4 column width. */
    body #content-container.container > .row > .col-md-3,
    body #container.container > .row > .col-md-3 {
        width: 292.5px;
    }
    body #content-container.container > .row > .col-md-9,
    body #container.container > .row > .col-md-9 {
        width: calc(100% - 292.5px);
    }

    /* The hero border and the content edges of the sections line up. */
    body > main > .hero {
        max-width: 1320px;
    }
    body > main > section.section,
    body .course-browser,
    body .course-content,
    body .checkout-shell {
        max-width: 1368px;
    }
    body .home-tutorials-inner,
    body .course-list-wrap,
    body .detail-hero > .detail-wrap {
        max-width: 1320px;
    }
    body #courses .course-card .cover,
    body .course-browser .course-card .cover {
        height: 209px;
    }

    body .qa-page:not(.qa-narrow) {
        max-width: 1350px;
    }
    /* Existing tutorial and Q&A grid columns keep their fixed sidebars. */
    body .tutorial-reading > *,
    body .qa-detail-page .qa-body,
    body .policy-card > * {
        max-width: 900px;
        margin-left: auto;
        margin-right: auto;
    }
    body .course-content .course-intro {
        max-width: 900px;
    }
    body #content-container > .row > .col-md-10.col-md-offset-1 > article > .panel-body {
        max-width: 964px;
        margin-left: auto;
        margin-right: auto;
    }
    body .policy-shell {
        max-width: 1360px;
    }
    body .points-checkout {
        max-width: 1356px;
    }
    body .custom-page .container {
        max-width: 1368px;
    }

    /* Align footer content; leave the fixed right toolbar unchanged. */
    body .site-footer {
        padding-left: calc((100% - 1320px) / 2);
        padding-right: calc((100% - 1320px) / 2);
    }
}