/* Единый шаг отступов. Подключается последним и перекрывает разнобой из style.css и dlc.css.
   Новые блоки берут значения отсюда, а не свои числа:
   --sp-gutter  поле страницы слева и справа, совпадает с шапкой
   --sp-section расстояние между секциями страницы
   --sp-card    зазор между карточками и соседними блоками
   --sp-pad     внутреннее поле большой карточки */
:root {
    --sp-gutter: 32px;
    --sp-section: 32px;
    --sp-card: 16px;
    --sp-pad: 24px;
}

@media screen and (max-width: 999px) {
    :root {
        --sp-gutter: 20px;
        --sp-section: 24px;
    }
}

@media screen and (max-width: 767px) {
    :root {
        --sp-gutter: 12px;
        --sp-card: 12px;
        --sp-pad: 16px;
    }
}

/* ---- Контейнер: одна ширина на всех страницах, края совпадают с шапкой и главной ---- */
.header__outer .header__top__outer .header__top__inner,
.header__outer .header__middle__outer .header__middle__inner,
.header__outer .header__bottom__inner,
.header__outer .header__footer__outer .header__footer__inner,
.home-stories__outer > .__inner,
.header__information__outer > .__inner,
.home-features__outer > .__inner,
.home-line__outer > .__inner,
.home-line-news__outer > .__inner,
.subscribe__outer > .__inner,
.footer__outer .footer__top__outer > .__inner,
.footer__outer .footer__bottom__outer > .__inner {
    max-width: calc(1360px + var(--sp-gutter) * 2) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: var(--sp-gutter) !important;
    padding-right: var(--sp-gutter) !important;
    box-sizing: border-box !important;
}

.catalog-page__outer > .__inner,
.catalog-page__outer.offer-page > .__inner,
.catalog-page__outer.offer-detail-page > .__inner,
.catalog-page__outer.board-detail-page > .__inner,
.board-create-page > .__inner,
.goods-page__outer > .__inner,
.lk-page > .__inner,
.workshops-page > .__inner,
.workshop-page > .__inner,
.basket-page__inner,
.checkout-page .checkout-page__inner {
    max-width: calc(1360px + var(--sp-gutter) * 2) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: var(--sp-pad) var(--sp-gutter) 0 !important;
    box-sizing: border-box !important;
}

.catalog-page__outer,
.goods-page__outer,
.lk-page,
.workshops-page,
.workshop-page,
.basket-page {
    padding: 0 0 48px !important;
}

.workshops-page,
.workshop-page {
    background: transparent !important;
}

ul.header__footer__links {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* ---- Лист страницы ----
   Страница с фильтром: карточки лежат прямо на сером фоне, общего белого листа нет.
   Страница без фильтра: лист сам становится карточкой со скруглением. */
.catalog-page__outer .__inner .catalog__columns {
    gap: var(--sp-card) !important;
    background: #fff !important;
    border: 1px solid #e4e4e6 !important;
    border-radius: 14px !important;
    overflow: hidden;
}

.catalog-page__outer .__inner .catalog__columns:has(.catalog__filter__place) {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    overflow: visible;
}

.catalog__columns:has(.catalog__filter__place) > .catalog__content > .__content__top {
    background: #fff;
    border: 1px solid #e4e4e6;
    border-radius: 14px;
    margin-bottom: var(--sp-card) !important;
}

.catalog__content > .__content__top,
.page__outer > .__inner,
.articles__outer > .__inner,
.brands__outer > .__inner {
    padding: var(--sp-pad) !important;
}

/* Лист с левой колонкой без фильтра (бренд, поставщик): логотип не прижат к краю листа */
.catalog-page__outer .__inner .catalog__columns:not(:has(.catalog__filter__place)) .catalog__level__menu {
    padding: var(--sp-pad) 0 var(--sp-pad) var(--sp-pad) !important;
}

/* В шаблоне страницы от левой колонки осталась одна подпись «Каталог товаров»: пустую колонку убираем */
.catalog-page__outer .__inner .catalog__columns .catalog__level__menu:has(> .__title:only-child) {
    display: none !important;
}

.catalog__top__control {
    margin-bottom: var(--sp-card) !important;
    padding-left: var(--sp-pad) !important;
    padding-right: var(--sp-pad) !important;
}

/* ---- Рубрики каталога: сетка вместо полей у плиток ---- */
.catalog__catalogov {
    padding: 0 var(--sp-pad) var(--sp-pad) !important;
}

.catalog__catalogov .catalog-catalogov__array {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: var(--sp-card);
}

.catalog__catalogov .catalog-catalogov__array .catalog-catalogov__block {
    width: auto !important;
    margin: 0 !important;
}

/* ---- Сетка товаров: отдельные карточки с тем же зазором, что в лентах ---- */
.catalog__container .goods__array:not(.goods__array--line) {
    gap: var(--sp-card) !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    overflow: visible !important;
    --sp-cols: 3;
}

@media screen and (min-width: 1360px) {
    .catalog__container .goods__array:not(.goods__array--line) {
        --sp-cols: 4;
    }
}

@media screen and (max-width: 999px) {
    .catalog__container .goods__array:not(.goods__array--line) {
        --sp-cols: 2;
    }
}

@media screen and (max-width: 767px) {
    .catalog__container .goods__array:not(.goods__array--line) {
        --sp-cols: 1;
    }
}

.catalog__container .goods__array:not(.goods__array--line) .goods__block {
    --sp-w: calc((100% - var(--sp-card) * (var(--sp-cols) - 1)) / var(--sp-cols));
    width: var(--sp-w) !important;
    flex: 0 0 var(--sp-w) !important;
    max-width: var(--sp-w) !important;
    border: 1px solid #e4e4e6 !important;
    border-radius: 10px !important;
    padding: var(--sp-card) !important;
}

.catalog__container .catalog__show-more {
    margin-top: var(--sp-card) !important;
}

.catalog__container .Pagination {
    margin-top: var(--sp-card) !important;
    margin-bottom: 0 !important;
}

/* ---- Ленты: заголовок и карточки с одного края, поле как у большой карточки ---- */
.home-line__position .__top {
    padding: var(--sp-card) var(--sp-pad) !important;
}

.home-line__position .__body {
    padding: calc(var(--sp-pad) - 8px) !important;
}

.home-ad-card {
    margin: 0 !important;
}

.home-offers__layout {
    padding: var(--sp-pad) !important;
}

.form__subscribe {
    padding-left: var(--sp-pad) !important;
    padding-right: var(--sp-pad) !important;
}

/* ---- Между секциями ---- */
.catalog-page__outer .home-line__position,
.goods-page__outer .home-line__position,
.basket-page__recs,
.catalog__columns + .catalog__columns {
    margin-top: var(--sp-section) !important;
    margin-bottom: 0 !important;
}

.goods-page__goods__position {
    margin-bottom: 0 !important;
}

/* Лента внутри белого блока — часть этого блока, а не отдельная секция */
.catalog-page__outer .catalog__columns .home-line__position,
.goods-page__goods__position .home-line__position {
    margin-top: 0 !important;
}

.offer-page__layout {
    gap: var(--sp-card) !important;
}

.offer-grid {
    gap: var(--sp-card) !important;
}

/* На узком экране доска объявлений добавляла к полю страницы ещё своё, остальные страницы идут от него */
@media screen and (max-width: 999px) {
    .offer-page__top,
    .offer-page__layout,
    .ad-hot__head,
    .ad-hot__row {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

/* На главной между лентой историй и преимуществами тот же шаг: пустой блок новинок добавлял лишние 10px */
@media screen and (min-width: 1000px) {
    .home-stories__outer {
        margin-bottom: 0 !important;
    }

    .header__information__outer {
        padding-top: 0 !important;
        margin-bottom: 0 !important;
    }

    .home-features__outer {
        margin-top: var(--sp-section) !important;
    }

    .header__information__outer .__inner:not(.banner-full) {
        gap: var(--sp-card) !important;
    }
}
