/**
 * Ширина контейнеров: шапка шире основного контента (независимо).
 * Подключается в конце страницы — перебивает дефолтные max-width Bootstrap.
 */
@media (min-width: 992px) {
    .site-header__navbar > .container,
    .site-header__navbar > .site-header__container {
        max-width: var(--header-max-width) !important;
        padding-left: var(--header-padding-x);
        padding-right: var(--header-padding-x);
    }

    .site-main > .container,
    .site-footer > .container {
        max-width: var(--container-max-width-md) !important;
    }
}

@media (min-width: 1200px) {
    .site-header__navbar > .container,
    .site-header__navbar > .site-header__container {
        max-width: var(--header-max-width) !important;
        padding-left: var(--header-padding-x);
        padding-right: var(--header-padding-x);
    }

    .site-main > .container,
    .site-footer > .container {
        max-width: var(--container-max-width) !important;
    }
}

@media (min-width: 1400px) {
    .site-header__navbar > .container,
    .site-header__navbar > .site-header__container {
        max-width: min(var(--header-max-width), calc(100% - 2 * var(--header-padding-x))) !important;
    }
}