/* Sitefinity grid wrapper — wider than Bootstrap .container / .ETcontainer */

.et-container-wide {
    width: 100%;
    max-width: none;
    margin-left: auto;
    margin-right: auto;
    padding-left: 16px;
    padding-right: 16px;
    box-sizing: border-box;
}

/* Tablet: 576–991px — fluid, comfortable padding */
@media (min-width: 576px) {
    .et-container-wide {
        padding-left: 24px;
        padding-right: 24px;
    }
}

/* Desktop: 992–1399px — wide, capped at 1320px */
@media (min-width: 992px) {
    .et-container-wide {
        max-width: 1320px;
        padding-left: 32px;
        padding-right: 32px;
    }
}

/* Large / ultra-wide: 1400px+ — capped at 1440px */
@media (min-width: 1400px) {
    .et-container-wide {
        max-width: 1440px;
    }
}

/* Match Bootstrap .navbar > .container flex behavior when used as header shell.
   Keep shared et-container-wide padding so util / header / page content gutters align. */
.navbar > .et-container-wide {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

@media (min-width: 992px) {
    .navbar-expand-lg > .et-container-wide {
        flex-wrap: nowrap;
    }
}