/* ------------------------------------------------------------------
   Доработка главной страницы promputsnab.ru — вариант A/B-теста.
   Подключается из header.php для всех посетителей (A/B-тест главной завершён).
   Оригинальный вид сайта этот файл не затрагивает.
   ------------------------------------------------------------------ */

/* Маркер варианта: по нему проверяем, что файл доехал. */
html.pps-ab { --pps-ab: 1; }

/* ==================================================================
   Блок «Каталог продукции»
   Оформление повторяет страницу /catalog/ (catalog.section.list,
   шаблон catalog.tile.3) — этого требует ТЗ. Значения сняты замерами
   вычисленных стилей с живой страницы каталога.
   ================================================================== */

/* --- шапка блока --------------------------------------------------- */
.pps-cs .pps-cs-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px 24px;
}

/* Заголовок блока. Замер макета images/image2.png: высота заглавной 27px
   при толщине штриха 3px — это обычное начертание, не полужирное.
   В пересчёте по масштабу макета получается 24px — столько же, сколько
   у штатных заголовков блоков сайта (.widget-title: 24px/400). */
.pps-cs .pps-cs-title {
    font-family: Montserrat, sans-serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 31px;
    color: #1D1D1D;
}

/* «Весь каталог» — обычным регистром, цвет по макету */
.pps-cs .pps-cs-all {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: #794425;
    text-decoration: none;
    text-transform: none;
    transition: color .35s;
}

.pps-cs .pps-cs-all:hover,
.pps-cs .pps-cs-all:focus {
    color: #A05A31;
}

/* Стрелка удлиняется плавно, а не подменяется картинкой — требование ТЗ.
   Собрана из линии и «головы», чтобы анимировать именно длину. */
.pps-cs .pps-cs-all-arrow {
    position: relative;
    display: inline-block;
    width: 24px;
    height: 10px;
    flex: 0 0 auto;
    transition: width .35s ease;
}

.pps-cs .pps-cs-all-arrow-line {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 1px;
    margin-top: -1px;
    background: currentColor;
    transition: background .35s;
}

.pps-cs .pps-cs-all-arrow-head {
    position: absolute;
    top: 50%;
    right: 0;
    width: 7px;
    height: 7px;
    margin-top: -4px;
    border-top: 1px solid currentColor;
    border-right: 1px solid currentColor;
    transform: rotate(45deg);
    transform-origin: 100% 0;
    transition: border-color .35s;
}

.pps-cs .pps-cs-all:hover .pps-cs-all-arrow,
.pps-cs .pps-cs-all:focus .pps-cs-all-arrow {
    width: 40px;
}

/* --- сетка карточек ------------------------------------------------- */
/* Рамки соседних карточек накладываются друг на друга (margin -1px),
   поэтому сетка выглядит цельной, как на /catalog/. */
.pps-cs .pps-cs-items {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
}

.pps-cs .pps-cs-item {
    position: relative;
    box-sizing: border-box;
    width: 33.3333%;
    padding: 28px;
    margin: 0 -1px -1px 0;
    border: 1px solid #E8E8E8;
    background: #FFFFFF;
    transition: box-shadow .2s ease-in-out;
}

.pps-cs .pps-cs-item:hover {
    z-index: 2;
    box-shadow: 0 0 20px rgba(0, 0, 0, .15);
}

.pps-cs .pps-cs-item-wrapper {
    display: flex;
    align-items: flex-start;
    gap: 28px;
    height: 100%;
}

.pps-cs .pps-cs-item-image {
    flex: 0 0 100px;
    width: 100px;
    display: block;
    text-decoration: none;
}

.pps-cs .pps-cs-item-image img {
    display: block;
    width: 100%;
    height: auto;
}

.pps-cs .pps-cs-item-links {
    flex: 1 1 auto;
    min-width: 0;
}

.pps-cs .pps-cs-item-title {
    display: inline-block;
    font-family: Montserrat, sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 22px;
    color: #000000;
    text-decoration: none;
    transition: color .35s;
}

.pps-cs .pps-cs-item-title:hover,
.pps-cs .pps-cs-item-title:focus {
    color: #794425;
}

.pps-cs .pps-cs-item-children {
    margin-top: 12px;
}

.pps-cs .pps-cs-item-child + .pps-cs-item-child {
    margin-top: 4px;
}

.pps-cs .pps-cs-item-child-wrapper {
    display: inline-block;
    font-family: Montserrat, sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 19.5px;
    color: #1D1D1D;
    text-decoration: none;
    transition: color .35s;
}

.pps-cs .pps-cs-item-child-wrapper:hover,
.pps-cs .pps-cs-item-child-wrapper:focus {
    color: #794425;
}

.pps-cs .pps-cs-item-more-wrapper {
    margin-top: 15px;
}

.pps-cs .pps-cs-item-more {
    font-family: Montserrat, sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 19.5px;
    color: #794425;
    text-decoration: none;
    transition: color .35s;
}

.pps-cs .pps-cs-item-more:hover,
.pps-cs .pps-cs-item-more:focus {
    color: #A05A31;
}

/* Заголовок — ссылка, но на ПК ведёт себя как обычный заголовок. */
.pps-cs a.pps-cs-title {
    text-decoration: none;
    cursor: default;
}

/* Шеврон вместо надписи — только на МУ. */
.pps-cs .pps-cs-all-chevron {
    display: none;
    position: relative;
    width: 10px;
    height: 10px;
    flex: 0 0 auto;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: rotate(45deg);
}

/* --- планшет и мобильные -------------------------------------------- */
@media (max-width: 991px) {
    .pps-cs .pps-cs-item {
        width: 50%;
    }
}

@media (max-width: 767px) {
    .pps-cs .pps-cs-title {
        font-size: 20px;
    }

    /* ТЗ: на МУ по клику на название блока или стрелку открывается каталог,
       при нажатии цвет меняется на #794425. */
    .pps-cs a.pps-cs-title {
        cursor: pointer;
        transition: color .2s;
    }

    .pps-cs a.pps-cs-title:active {
        color: #794425;
    }

    /* Надпись со стрелкой уступает место шеврону. */
    .pps-cs .pps-cs-all-text,
    .pps-cs .pps-cs-all-arrow {
        display: none;
    }

    .pps-cs .pps-cs-all-chevron {
        display: block;
    }

    .pps-cs .pps-cs-all {
        color: #1D1D1D;
        padding: 4px 6px;
    }

    .pps-cs .pps-cs-all:active {
        color: #794425;
    }

    .pps-cs .pps-cs-item {
        width: 100%;
        padding: 20px;
    }

    .pps-cs .pps-cs-item-wrapper {
        gap: 20px;
    }

    .pps-cs .pps-cs-item-image {
        flex-basis: 80px;
        width: 80px;
    }
}

/* ==================================================================
   Блок «Популярные товары» — карточка товара
   Оформление по ТЗ: маркеры слева сверху скруглёнными плашками,
   три характеристики, иконки действий. Цвета сняты с макетов ТЗ
   (images/image18.png) и с эталонной мини-КТ каталожной страницы.
   ================================================================== */

/* --- маркеры ------------------------------------------------------- */
/* Штатные маркеры решения прячем: у них свои цвета и прямые углы. */
.pps-ab .widget-item-marks {
    display: none !important;
}

.pps-ab .pps-marks {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 3;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    max-width: calc(100% - 90px);
    pointer-events: none;
}

.pps-ab .pps-mark {
    display: inline-block;
    padding: 6px 8px;
    border-radius: 12px;
    font-family: Montserrat, sans-serif;
    font-size: 12px;
    line-height: 12px;
    font-weight: 500;
    color: #FFFFFF;
    white-space: nowrap;
}

.pps-ab .pps-mark-hit        { background: #F8971A; }
.pps-ab .pps-mark-recommend  { background: #31ABC0; }
.pps-ab .pps-mark-used       { background: #E15554; }
.pps-ab .pps-mark-best-price { background: #7768AE; }
.pps-ab .pps-mark-sale       { background: #1FAF38; }
.pps-ab .pps-mark-new        { background: #3BB273; }

/* Контейнер картинки точкой отсчёта быть не должен: маркер отсчитывается
   от карточки (макет: сверху 18, слева 9), а внутри контейнера уезжал на 39/30. */
.pps-ab .widget-item-image-container {
    position: static !important;
}

/* --- характеристики ------------------------------------------------ */
/* Значения сняты с эталонной плитки каталога (/catalog/relsy/?view=tile):
   подпись 10/500/18 #808080 без капса, значение 14/400/18 #1B1E25,
   между строками 8, от блока до цены 20. */
.pps-ab .pps-props {
    margin: 0 0 20px;
}

.pps-ab .pps-prop {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 6px;
    margin-bottom: 8px;
}

.pps-ab .pps-prop:last-child {
    margin-bottom: 0;
}

.pps-ab .pps-prop-name {
    font-family: Montserrat, sans-serif;
    font-size: 10px;
    line-height: 18px;
    font-weight: 500;
    color: #808080;
}

.pps-ab .pps-prop-value {
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    line-height: 18px;
    font-weight: 400;
    color: #1B1E25;
}

/* --- иконки «Сравнение» и «Быстрый просмотр» ------------------------ */
.pps-ab .widget-item-action-buttons {
    z-index: 4;
}

/* Покой: белая плашка, рамка #D6D6D6, глиф серый — замеры с макета
   images/image18.png. У решения свои классы фона, поэтому !important. */
.pps-ab .widget-item-action-button {
    border: 1px solid #BDBDBD !important;
    border-radius: 4px;
    background: #FFFFFF !important;
    color: #808080;
    transition: background .2s, border-color .2s, color .2s;
}

/* Глиф в эталоне обведён #808080, а не залит. */
.pps-ab .widget-item-action-button svg path {
    stroke: #808080;
}

.pps-ab .widget-item-action-button:hover svg path {
    stroke: #FFFFFF;
}

.pps-ab .widget-item-action-button svg,
.pps-ab .widget-item-action-button svg * {
    fill: #808080;
}

/* ТЗ: ховер иконок — коричневая заливка с белым глифом. */
.pps-ab .widget-item-action-button:hover {
    background: #794425 !important;
    border-color: #794425 !important;
    color: #FFFFFF;
}

.pps-ab .widget-item-action-button:hover svg,
.pps-ab .widget-item-action-button:hover svg * {
    fill: #FFFFFF;
    stroke: #FFFFFF;
}

/* --- на МУ характеристик и быстрого просмотра нет (требование ТЗ) --- */
@media (max-width: 767px) {
    .pps-ab .pps-props,
    .pps-ab .widget-item-action-button-quick-view {
        display: none !important;
    }
}

/* --- цена ----------------------------------------------------------- */
/* ТЗ: «Цена: от N руб. *» и серая сноска под ней. */
.pps-ab .pps-price-label,
.pps-ab .pps-price-from {
    font-weight: 700;
}

.pps-ab .pps-price-star {
    color: #BA1907;
}

.pps-ab .pps-price-note {
    margin-top: 6px;
    font-family: Montserrat, sans-serif;
    font-size: 11px;
    line-height: 15px;
    color: #9A9A9A;
}

/* Решение печатает цену дважды — основную и базовую. Вторая по макету лишняя. */
.pps-ab .widget-item-price-base:empty,
.pps-ab .widget-item-price-base {
    display: none;
}

/* На МУ приставки «Цена:» нет — только «от N руб. *». */
@media (max-width: 767px) {
    .pps-ab .pps-price-label {
        display: none;
    }
}

/* --- иконки действий: в правый верхний угол поверх фото --------------- */
/* Решение кладёт их отдельной строкой над карточкой; по макету они
   лежат в углу карточки, напротив маркеров.
   Точкой отсчёта раньше была .widget-item-base — из-за её внутренних полей
   маркер и иконки уезжали внутрь на 21px. Отсчитываем от самой карточки. */
.pps-ab .widget-item-base {
    position: static;
}

.pps-ab .widget-item-action-buttons {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 4;
    display: flex;
    gap: 8px;
    width: auto;
    height: auto;
}

.pps-ab .widget-item-action-button {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
}

/* Маркеры и иконки лежат на одной высоте — контейнер картинки сдвигаем вниз,
   чтобы они не наезжали на фото. */
.pps-ab .widget-item-image-container {
    margin-top: 44px;
}

/* --- изображение заполняет свою область ------------------------------- */
/* ТЗ: «фото должно увеличиться так, чтобы заполнить всю область изображения». */
.pps-ab .widget-item-image-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

/* Решение прячет иконки до наведения на карточку (opacity: 0).
   В макете они видны всегда — как на эталонной мини-КТ каталога. */
.pps-ab .widget-item-action-button {
    opacity: 1 !important;
}

/* --- кнопка «Получить счет» ------------------------------------------ */
/* Макет images/image23.png: кнопка с рамкой — белая заливка, красная рамка
   и красный текст. Замер покоя дал ровно #BA1907. Ховер в макете почти
   не отличается по тону, поэтому темним так же, как «В корзину» (#820E0E). */
.pps-ab .pps-invoice {
    display: block;
    width: 100%;
    margin-top: 8px;
    padding: 11px 16px;
    border: 1px solid #BA1907;
    border-radius: 2px;
    background: #FFFFFF;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    line-height: 18px;
    font-weight: 500;
    color: #BA1907;
    cursor: pointer;
    transition: color .2s, border-color .2s;
}

/* ПМ: при наведении у кнопки меняется фон на #F8F9FB. */
.pps-ab .pps-invoice:hover,
.pps-ab .pps-invoice:focus {
    border-color: #820E0E;
    background: #F8F9FB;
    color: #820E0E;
}

/* --- кнопка «В корзину» ---------------------------------------------- */
/* Решение красит её коричневым (#794425). Макет images/image23.png:
   сплошная красная #BA1907, под курсором #820E0E. */
.pps-ab .widget-item-purchase-button.intec-cl-background,
.pps-ab .widget-item-purchase .intec-ui-control-basket-button {
    background-color: #BA1907 !important;
    border-color: #BA1907 !important;
    color: #FFFFFF !important;
}

.pps-ab .widget-item-purchase-button.intec-cl-background:hover,
.pps-ab .widget-item-purchase .intec-ui-control-basket-button:hover {
    background-color: #820E0E !important;
    border-color: #820E0E !important;
}

/* Панель ховера: кнопки друг под другом, чтобы «Получить счет» помещалась. */
.pps-ab .widget-item-purchase {
    min-width: 0;
}

.pps-ab .widget-item-advanced {
    background: #FFFFFF;
}

@media (max-width: 767px) {
    /* Мобильная кнопка покупки у решения наезжала на сноску о ценах —
       ставим её в поток и отделяем от текста. */
    /* У решения правило позиционирования специфичнее нашего — иначе кнопка
       остаётся поверх сноски о ценах. */
    .pps-ab .widget-item-purchase-mobile,
    .pps-ab .widget-item-advanced,
    .pps-ab .widget-item-purchase-container {
        position: static !important;
    }

    .pps-ab .widget-item-purchase-mobile {
        margin-top: 10px;
    }

    .pps-ab .pps-price-note {
        margin-bottom: 10px;
    }

    .pps-ab .pps-invoice {
        margin-top: 10px;
    }
}

/* ==================================================================
   Блок «Услуги»
   Макет: сетка 2×2, фото слева, справа заголовок, описание,
   срок, цена и красная кнопка. Вся карточка кликабельна.
   ================================================================== */



.pps-sv .pps-sv-title {
    font-family: Montserrat, sans-serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 31px;
    color: #1D1D1D;
}

/* ПМ: между плитками 10px по горизонтали и по вертикали. Раньше рамки
   схлопывались отрицательными полями — теперь честная сетка с зазором. */
.pps-sv .pps-sv-items {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    align-items: stretch;
}

/* Замер макета: плитка 595x320, поля 20, между фото и текстом 20. */
.pps-sv .pps-sv-item {
    position: relative;
    box-sizing: border-box;
    display: flex;
    gap: 20px;
    padding: 20px;
    border: 1px solid #E8E8E8;
    background: #FFFFFF;
    transition: box-shadow .2s ease-in-out;
}

/* Ховер — как у карточек каталога: карточка приподнимается тенью. */
.pps-sv .pps-sv-item:hover {
    z-index: 2;
    box-shadow: 0 0 20px rgba(0, 0, 0, .15);
}

/* Подложка-ссылка делает кликабельной всю карточку, кнопка лежит выше неё. */
.pps-sv .pps-sv-item-link {
    position: absolute;
    inset: 0;
    z-index: 1;
    text-decoration: none;
}

/* Размер фото снят с макета: 218x280 (портрет). */
.pps-sv .pps-sv-item-picture {
    position: relative;
    z-index: 0;
    flex: 0 0 218px;
    width: 218px;
}

.pps-sv .pps-sv-item-picture img {
    display: block;
    width: 218px;
    height: 280px;
    object-fit: cover;
}

.pps-sv .pps-sv-item-body {
    position: relative;
    z-index: 2;
    flex: 1 1 auto;
    min-width: 0;
    pointer-events: none;
}

/* Замер макета (.fig, derivedTextData): 16px / 600 SemiBold / lh 22 / #2D2D2D. */
.pps-sv .pps-sv-item-name {
    font-family: Montserrat, sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 22px;
    color: #2D2D2D;
}

/* Основной текст в макете 14 / 400 / lh 21 / #000000. */
.pps-sv .pps-sv-item-text {
    margin-top: 12px;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 21px;
    color: #000000;
}

.pps-sv .pps-sv-item-props {
    margin-top: 20px;
}

.pps-sv .pps-sv-item-prop {
    display: flex;
    gap: 10px;
    align-items: baseline;
}

/* Цена в макете 14 / 400 / lh 21. Подпись серая, значение прижато вправо. */
.pps-sv .pps-sv-item-prop-name {
    flex: 0 0 auto;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    line-height: 21px;
    color: #808080;
}

/* Пунктирная выноска между подписью и значением: замер макета —
   штрих 2/2, толщина 1px, цвет #E8E8E8. */
.pps-sv .pps-sv-item-prop-dots {
    flex: 1 1 auto;
    min-width: 10px;
    height: 1px;
    align-self: center;
    background-image: linear-gradient(to right, #E8E8E8 0 2px, transparent 2px 4px);
    background-size: 4px 1px;
    background-repeat: repeat-x;
}

.pps-sv .pps-sv-item-prop-value {
    flex: 0 0 auto;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    line-height: 21px;
    color: #000000;
    white-space: nowrap;
}

.pps-sv .pps-sv-star {
    color: #BA1907;
}

/* Кнопка кликабельна, хотя тело карточки — нет (иначе перекрыло бы ссылку).
   ПМ: размер строго по макету — 186x40. */
.pps-sv .pps-sv-item-button {
    pointer-events: auto;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 186px;
    height: 40px;
    padding: 0;
    margin-top: 30px;
    border: 1px solid #BA1907;
    border-radius: 2px;
    background: #BA1907;
    font-family: Montserrat, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    color: #FFFFFF;
    cursor: pointer;
    transition: background .2s, border-color .2s;
}

.pps-sv .pps-sv-item-button:hover,
.pps-sv .pps-sv-item-button:focus {
    background: #820E0E;
    border-color: #820E0E;
}

/* Ссылки внутри тела всё же должны кликаться. */
.pps-sv .pps-sv-item-body a {
    pointer-events: auto;
}

/* ПМ: сноска под карточками. Замер макета: 14 / 400 / lh 21, #000000,
   отступ от сетки 40px, ширина по контенту. */
.pps-sv .pps-sv-note {
    margin-top: 40px;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 21px;
    color: #000000;
}

@media (max-width: 991px) {
    .pps-sv .pps-sv-items {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* ПМ: карточка услуги на МУ по фрейму «Frame 1447».
   Замер: карточка 320x650, поля 20 по бокам и 30 сверху/снизу,
   фото 280x280, до текста 30, до кнопки 30. */
@media (max-width: 767px) {
    /* Слайды раскладывает карусель — сетка бы ей мешала. */
    .pps-sv .pps-sv-items {
        display: block;
    }

    .pps-sv .pps-sv-title {
        font-size: 20px;
    }

    .pps-sv .pps-sv-item {
        flex-direction: column;
        gap: 30px;
        padding: 30px 20px;
    }

    .pps-sv .pps-sv-item-picture {
        flex-basis: auto;
        width: 100%;
    }

    /* Фото в макете квадратное во всю ширину карточки. */
    .pps-sv .pps-sv-item-picture img {
        width: 100%;
        height: auto;
        aspect-ratio: 1 / 1;
        object-fit: cover;
    }

    .pps-sv .pps-sv-item-button {
        margin-top: 30px;
    }

    /* Стрелки карусели в макете 32x32 и заходят на карточку на 14px. */
    .pps-ab .pps-sv .owl-nav button.owl-prev,
    .pps-ab .pps-sv .owl-nav button.owl-next {
        width: 32px;
        height: 32px;
    }

    .pps-ab .pps-sv .owl-nav button.owl-prev { left: -14px; }
    .pps-ab .pps-sv .owl-nav button.owl-next { right: -14px; }
}

/* ==================================================================
   Блок «Наша команда»
   ТЗ задаёт правки точными числами:
     имя      16 → 14px, #404040 → #1D1D1D, font-weight 700 → 600
     должность 16 → 14px, #808080 → #2D2D2D
     между именем и должностью 20px, между фото и подписью 30px
   Замер до правки подтвердил исходные значения.
   ================================================================== */

/* Правила решения специфичнее — повторяем его цепочку классов целиком. */
html.pps-ab .widget.c-staff.c-staff-template-1 .widget-element-name {
    font-size: 14px;
    font-weight: 600;
    color: #1D1D1D;
}

html.pps-ab .widget.c-staff.c-staff-template-1 .widget-element-position {
    margin-top: 20px;
    font-size: 14px;
    color: #2D2D2D;
}

/* У обёртки фото margin-bottom: auto (её тянет флекс), поэтому отступ
   до подписи задаём сверху у имени.
   ПМ: расстояние фото → подпись ровно 30px. У решения к нашим 30 сверху
   добавлялось собственное поле имени в 35px — гасим его. */
html.pps-ab .widget.c-staff.c-staff-template-1 .widget-element-name {
    margin-top: 30px;
    padding-top: 0;
}

/* ПМ (МУ): фото 200x200, от заголовка блока до фото 40px (п. 68,
   было 60), от фото до подписи 30px. */
@media (max-width: 767px) {
    html.pps-ab .widget.c-staff.c-staff-template-1 .widget-element-image-wrap,
    html.pps-ab .widget.c-staff.c-staff-template-1 .widget-element-image {
        width: 200px !important;
        height: 200px !important;
        padding-top: 0 !important;
        margin-left: auto;
        margin-right: auto;
    }

    html.pps-ab .widget.c-staff.c-staff-template-1 .widget-content {
        margin-top: 40px !important;
    }

    html.pps-ab .widget.c-staff.c-staff-template-1 .widget-header {
        margin-bottom: 0 !important;
    }
}

/* ==================================================================
   Блок «Благодарственные письма»
   ТЗ: «Увеличить размер изображений и добавить границы».
   Замер макета images/image31.png: письмо 134×185 при ширине макета 678,
   зазор 5px, рамка #F0F0F0. В пересчёте на контент 1200px это ≈265×366
   против нынешних 215×323 — письма и правда крупнее, а зазоры меньше.
   ================================================================== */

/* ПМ: на ПК должны помещаться ровно 4 полных письма. Замер фрейма
   «Frame 1403»: письмо 268x368, зазор 10, полоса 1100 внутри контента 1200.

   Карусель решения раскладывает 4 ячейки по ширине полосы, поэтому полосе
   задаём 4 * 278 = 1112, а зазор делаем полем ячейки справа. Настройки самой
   карусели не трогаем: destroy + init уносил вместе с разметкой блок
   навигации решения, а он живёт внутри слайдера. */
html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-items {
    margin-left: 0;
    margin-right: 0;
}

html.pps-ab .widget.c-certificates.c-certificates-template-1 [data-role="slider"] {
    max-width: 1112px;
    margin: 0 auto;
}

/* Решение даёт ячейке карусели поле в 40px — от письма оставалось 198
   вместо 268. Зазор между письмами задаёт margin карусели. */
html.pps-ab .widget.c-certificates.c-certificates-template-1 .owl-item {
    padding: 0 !important;
}

/* Ширину ячейки задаёт карусель — свои значения снимаем, иначе слайды
   разъезжаются с расчётом owl. */
html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-item {
    flex: none !important;
    width: 100% !important;
    max-width: none !important;
    padding-left: 0;
    padding-right: 10px;   /* зазор между письмами */
}

/* Рамка вокруг письма. */
html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-item-picture-wrapper {
    position: absolute;
    inset: 0;
    border: 1px solid #F0F0F0;
    box-sizing: border-box;
    background: #FFFFFF;
}

/* Пропорция рамки с макета: 268 x 368. Задаём отношением, а не высотой —
   ширину письма выбирает карусель, и на узких экранах она другая. */
html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-item-picture {
    position: relative;
    padding-top: 137.4% !important;
    width: 100%;
    height: auto;
    margin: 0;
}

/* ПМ: изображение растягивается по ширине рамки — раньше contain оставлял
   поля по бокам. */
html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-item-picture img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ПМ (МУ): письмо стоит по центру, стрелки наполовину заходят на фото.
   Решение прячет стрелки на узких экранах — возвращаем их.
   Зазор между письмами на МУ не нужен: письмо одно. */
@media (max-width: 991px) {
    html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-item {
        padding-right: 0;
    }

    html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-items {
        position: relative;
    }

    html.pps-ab .widget.c-certificates.c-certificates-template-1 [data-role="slider.navigation"] {
        display: block !important;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        pointer-events: none;
    }

    html.pps-ab .widget.c-certificates.c-certificates-template-1 .navigation-left,
    html.pps-ab .widget.c-certificates.c-certificates-template-1 .navigation-right {
        display: block !important;
        position: absolute;
        top: 40%;
        z-index: 3;
        width: 40px;
        height: 40px;
        margin-top: -20px;
        pointer-events: auto;
    }

    /* Полоса писем начинается от края .widget-items, поэтому чтобы стрелка
       легла ровно наполовину на фото, её сдвигаем на половину ширины. */
    html.pps-ab .widget.c-certificates.c-certificates-template-1 .navigation-left {
        left: -20px;
    }

    html.pps-ab .widget.c-certificates.c-certificates-template-1 .navigation-right {
        right: -20px;
    }
}

/* ПМ: синего ховера у подписей быть не должно. */
html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-item:hover .widget-item-name,
html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-item-name:hover,
html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-item-name {
    color: #2D2D2D !important;
}


/* ==================================================================
   Блок «О компании»
   Макет: фото слева, справа заголовок, три абзаца, телефон и почта
   ссылками, внизу справа «Больше о компании» со стрелкой.
   ================================================================== */

.pps-about {
    box-sizing: border-box;
    width: 100%;
}

.pps-about .pps-about-inner {
    display: flex;
    gap: 50px;
    align-items: flex-start;
    box-sizing: border-box;
    max-width: 1215px;
    margin: 0 auto;
    padding: 0 15px;
}

/* Размер фото снят с макета: 561x437. */
.pps-about .pps-about-picture {
    flex: 0 0 561px;
    max-width: 561px;
}

.pps-about .pps-about-picture img {
    display: block;
    width: 100%;
    height: auto;
}

.pps-about .pps-about-body {
    flex: 1 1 auto;
    min-width: 0;
}

/* Замер макета: 24px / 400 Regular / lh 31 / #2D2D2D — не полужирный. */
.pps-about .pps-about-title {
    font-family: Montserrat, sans-serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 31px;
    color: #2D2D2D;
}

.pps-about .pps-about-text {
    margin: 18px 0 0;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 21px;
    color: #000000;
}

/* ТЗ: при наведении (и клике на МУ) цвет меняется на #A05A31. */
.pps-about .pps-about-phone,
.pps-about .pps-about-mail {
    color: #794425;
    text-decoration: none;
    transition: color .2s;
}

.pps-about .pps-about-phone:hover,
.pps-about .pps-about-mail:hover,
.pps-about .pps-about-phone:active,
.pps-about .pps-about-mail:active {
    color: #A05A31;
}

.pps-about .pps-about-more-wrap {
    margin-top: 24px;
    text-align: right;
}

/* Ссылка со стрелкой — как «Весь каталог»: цвет и плавное удлинение. */
.pps-about .pps-about-more {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    line-height: 20px;
    color: #794425;
    text-decoration: none;
    transition: color .35s;
}

.pps-about .pps-about-more:hover {
    color: #A05A31;
}


@media (max-width: 991px) {
    .pps-about .pps-about-inner {
        flex-direction: column;
        gap: 24px;
    }

    .pps-about .pps-about-picture {
        flex-basis: auto;
        max-width: 100%;
    }

    .pps-about .pps-about-title {
        font-size: 20px;
        line-height: 27px;
    }
}

/* ==================================================================
   Мобильные слайдеры (ТЗ: свайп, стрелки, дотсы, зацикливание)
   ================================================================== */
@media (max-width: 767px) {
    /* Штатные стрелки решения прячем, чтобы не задваивались с owl. */
    .pps-ab .widget-items-navigation {
        display: none !important;
    }

    .pps-ab .pps-slider .owl-stage-outer {
        overflow: hidden;
    }

    /* Стрелки — по бокам карточки, а не строкой под блоком. */
    .pps-ab .pps-slider .owl-nav {
        position: static;
    }

    .pps-ab .pps-slider .owl-nav button.owl-prev,
    .pps-ab .pps-slider .owl-nav button.owl-next {
        position: absolute;
        top: 40%;
        z-index: 5;
        width: 34px;
        height: 34px;
        border: 1px solid #E8E8E8;
        border-radius: 2px;
        background: #FFFFFF;
        transition: background .2s, border-color .2s;
    }

    .pps-ab .pps-slider .owl-nav button.owl-prev { left: -6px; }
    .pps-ab .pps-slider .owl-nav button.owl-next { right: -6px; }

    /* Ховер стрелок — коричневая заливка, как у «Нашей команды» на ПК. */
    .pps-ab .pps-slider .owl-nav button:hover,
    .pps-ab .pps-slider .owl-nav button:active {
        background: #794425;
        border-color: #794425;
    }

    .pps-ab .pps-slider .owl-nav button.owl-prev::before,
    .pps-ab .pps-slider .owl-nav button.owl-next::before {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 8px;
        height: 8px;
        margin: -4px 0 0 -5px;
        border-top: 2px solid #1D1D1D;
        border-right: 2px solid #1D1D1D;
        transform: rotate(45deg);
    }

    .pps-ab .pps-slider .owl-nav button.owl-prev::before {
        margin-left: -3px;
        transform: rotate(-135deg);
    }

    .pps-ab .pps-slider .owl-nav button:hover::before,
    .pps-ab .pps-slider .owl-nav button:active::before {
        border-color: #FFFFFF;
    }

    /* ПМ: дотсы одинаковой длины. Замер фрейма «Frame 1441»:
       полоска 10x4, радиус 3, зазор 3, активная #794425, остальные #E8E8E8. */
    .pps-ab .pps-slider .owl-dots {
        display: flex;
        justify-content: center;
        gap: 3px;
        margin-top: 30px;
    }

    .pps-ab .pps-slider .owl-dots button.owl-dot {
        width: 10px;
        height: 4px;
        border: 0;
        border-radius: 3px;
        background: #E8E8E8;
        transition: background .2s;
    }

    .pps-ab .pps-slider .owl-dots button.owl-dot.active {
        width: 10px;
        background: #794425;
    }

    /* Контейнер — точка отсчёта для стрелок. */
    .pps-ab .pps-slider {
        position: relative;
    }
}

/* ==================================================================
   Блок «Наши работы»
   Макет: карточка кейса с рамкой, фото слева, справа название,
   описание, компания-клиент, объём поставки со ссылками, сроки,
   красная кнопка и почта. Кейсы листаются, слайдер зациклен.
   ================================================================== */

/* ПМ: фон блока #F8F9FB (замер секции макета «Наши работы»). */
.pps-works {
    box-sizing: border-box;
    width: 100%;
    padding: 60px 0;
    background: #F8F9FB;
}

.pps-works .pps-works-inner {
    box-sizing: border-box;
    position: relative;
    max-width: 1230px;
    margin: 0 auto;
    padding: 0 15px;
}



.pps-works .pps-works-title {
    font-family: Montserrat, sans-serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 31px;
    color: #1D1D1D;
}

/* ПМ: карточка кейса уже контентной области — 1100px, чтобы стрелки
   поместились внутри неё. Поля и зазор — по фрейму «Frame 48». */
.pps-works .pps-works-item {
    display: flex;
    gap: 40px;
    box-sizing: border-box;
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    padding: 40px;
    border: 1px solid #E8E8E8;
    background: #FFFFFF;
}

/* Галерея кейса по фрейму «Пролистывание изображения»: большое фото
   490x490, под ним полоса миниатюр 56x60 с зазором 8 и тонкая полоса
   прокрутки. Стрелки появляются только при наведении на большое фото. */
.pps-works .pps-works-item-gallery {
    flex: 0 0 490px;
    max-width: 490px;
}

.pps-works .pps-works-item-photos {
    position: relative;
    width: 490px;
    max-width: 100%;
}

/* Показываем только текущее фото — слайды листает ab-main.js. */
.pps-works .pps-works-item-photo {
    display: none;
}

.pps-works .pps-works-item-photo.pps-works-item-photo-active {
    display: block;
}

.pps-works .pps-works-item-photo img {
    display: block;
    width: 490px;
    max-width: 100%;
    height: 490px;
    object-fit: cover;
}

/* Стрелка в покое белая, при наведении на неё — коричневая (ПМ).
   Замер фрейма: 40x40, радиус 2, отступ от края фото 11px. */
.pps-works .pps-works-photo-nav {
    position: absolute;
    top: 50%;
    z-index: 3;
    width: 40px;
    height: 40px;
    margin-top: -20px;
    padding: 0;
    border: 1px solid #FFFFFF;
    border-radius: 2px;
    background: #FFFFFF;
    opacity: 0;
    cursor: pointer;
    transition: opacity .2s, background .2s, border-color .2s;
}

.pps-works .pps-works-item-photos:hover .pps-works-photo-nav {
    opacity: 1;
}

.pps-works .pps-works-photo-prev { left: 11px; }
.pps-works .pps-works-photo-next { right: 11px; }

.pps-works .pps-works-photo-nav:hover {
    background: #794425;
    border-color: #794425;
}

.pps-works .pps-works-photo-nav::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 8px;
    height: 8px;
    margin: -4px 0 0 -5px;
    border-top: 1.5px solid #2D2D2D;
    border-right: 1.5px solid #2D2D2D;
    transform: rotate(45deg);
}

.pps-works .pps-works-photo-prev::before {
    margin-left: -3px;
    transform: rotate(-135deg);
}

.pps-works .pps-works-photo-nav:hover::before {
    border-color: #FFFFFF;
}

/* Полоса миниатюр: 20px под фото, миниатюра 56x60, зазор 8. */
.pps-works .pps-works-item-thumbs {
    display: flex;
    gap: 8px;
    width: 490px;
    max-width: 100%;
    margin-top: 20px;
    padding-bottom: 8px;
    overflow-x: auto;
    scrollbar-width: thin;
    scrollbar-color: #B0B0B0 transparent;
}

.pps-works .pps-works-item-thumbs::-webkit-scrollbar {
    height: 2px;
}

.pps-works .pps-works-item-thumbs::-webkit-scrollbar-track {
    background: transparent;
}

.pps-works .pps-works-item-thumbs::-webkit-scrollbar-thumb {
    background: #B0B0B0;
}

.pps-works .pps-works-item-thumb {
    box-sizing: border-box;
    flex: 0 0 56px;
    width: 56px;
    height: 60px;
    padding: 0;
    border: 1px solid transparent;
    background: none;
    cursor: pointer;
}

.pps-works .pps-works-item-thumb-active {
    border-color: #BA1907;
}

.pps-works .pps-works-item-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pps-works .pps-works-item-body {
    flex: 1 1 auto;
    min-width: 0;
}

/* Замер макета: 18px / 600 SemiBold / lh 27 / #2D2D2D. */
.pps-works .pps-works-item-name {
    font-family: Montserrat, sans-serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 27px;
    color: #2D2D2D;
}

.pps-works .pps-works-item-text {
    margin-top: 12px;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    line-height: 21px;
    color: #000000;
}

.pps-works .pps-works-item-props {
    margin-top: 18px;
}

.pps-works .pps-works-item-prop {
    display: flex;
    gap: 16px;
    align-items: baseline;
    margin-bottom: 10px;
}

/* Замер макета: подпись 10 / 500 Medium / lh 18 / #808080,
   значение 14 / 400 / lh 18 / #1B1E25. */
.pps-works .pps-works-item-prop-name {
    flex: 0 0 132px;
    font-family: Montserrat, sans-serif;
    font-size: 10px;
    font-weight: 500;
    line-height: 18px;
    color: #808080;
    text-transform: uppercase;
}

.pps-works .pps-works-item-prop-value {
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    line-height: 18px;
    color: #1B1E25;
}

/* ТЗ: ссылки в объёме поставки, ховер #A05A31. */
.pps-works .pps-works-item-prop-value a,
.pps-works .pps-works-item-mail a {
    color: #794425;
    text-decoration: none;
    transition: color .2s;
}

.pps-works .pps-works-item-prop-value a:hover,
.pps-works .pps-works-item-prop-value a:active,
.pps-works .pps-works-item-mail a:hover,
.pps-works .pps-works-item-mail a:active {
    color: #A05A31;
}

.pps-works .pps-works-item-footer {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    align-items: center;
    margin-top: 22px;
}

.pps-works .pps-works-item-button {
    padding: 13px 26px;
    border: 1px solid #BA1907;
    border-radius: 2px;
    background: #BA1907;
    font-family: Montserrat, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    color: #FFFFFF;
    cursor: pointer;
    transition: background .2s, border-color .2s;
}

.pps-works .pps-works-item-button:hover {
    background: #820E0E;
    border-color: #820E0E;
}

.pps-works .pps-works-item-mail {
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    line-height: 21px;
    color: #2D2D2D;
}

/* Слайдер кейсов: стрелки снаружи карточки. */
.pps-works .pps-works-items {
    position: relative;
}

.pps-works .pps-works-items .owl-nav button.owl-prev,
.pps-works .pps-works-items .owl-nav button.owl-next {
    position: absolute;
    top: 50%;
    z-index: 4;
    width: 38px;
    height: 38px;
    margin-top: -19px;
    border: 1px solid #E8E8E8;
    border-radius: 2px;
    background: #FFFFFF;
    transition: background .2s, border-color .2s;
}

.pps-works .pps-works-items .owl-nav button.owl-prev { left: -50px; }
.pps-works .pps-works-items .owl-nav button.owl-next { right: -50px; }

.pps-works .pps-works-items .owl-nav button:hover {
    background: #794425;
    border-color: #794425;
}

.pps-works .pps-works-items .owl-nav button::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 9px;
    height: 9px;
    margin: -5px 0 0 -6px;
    border-top: 2px solid #1D1D1D;
    border-right: 2px solid #1D1D1D;
    transform: rotate(45deg);
}

.pps-works .pps-works-items .owl-nav button.owl-prev::before {
    margin-left: -3px;
    transform: rotate(-135deg);
}

.pps-works .pps-works-items .owl-nav button:hover::before {
    border-color: #FFFFFF;
}

@media (max-width: 991px) {
    .pps-works .pps-works-item {
        flex-direction: column;
        gap: 20px;
    }

    .pps-works .pps-works-item-gallery {
        flex-basis: auto;
        max-width: 100%;
    }

    .pps-works .pps-works-items .owl-nav button.owl-prev { left: -6px; }
    .pps-works .pps-works-items .owl-nav button.owl-next { right: -6px; }
}

/* ПМ: блок на МУ по фрейму «Frame 1438». Замер: карточка 320, поля 20
   по бокам и 30 сверху, фото 280x280, полоса миниатюр под ним, кнопка 268x50,
   а стрелки и дотсы стоят одной строкой ПОД карточкой. */
@media (max-width: 767px) {
    .pps-works .pps-works-title {
        font-size: 20px;
    }

    .pps-works .pps-works-item {
        padding: 30px 20px;
        gap: 30px;
    }

    .pps-works .pps-works-item-photos,
    .pps-works .pps-works-item-thumbs {
        width: 100%;
    }

    .pps-works .pps-works-item-photo img {
        width: 100%;
        height: auto;
        aspect-ratio: 1 / 1;
    }

    .pps-works .pps-works-item-prop {
        flex-direction: column;
        gap: 2px;
    }

    .pps-works .pps-works-item-prop-name {
        flex-basis: auto;
    }

    .pps-works .pps-works-item-button {
        width: 100%;
        max-width: 268px;
        height: 50px;
    }

    .pps-works .pps-works-dots {
        align-items: center;
        height: 32px;
    }
}

/* Owl прячет элемент с классом owl-carousel до появления owl-loaded.
   Мы вешаем класс сами, перед инициализацией — и карусель стартует
   с нулевой шириной, не доводя запуск до конца (проверено: появлялся
   owl-drag, но не owl-loaded, а блок оставался display: none).
   Держим наши контейнеры видимыми. */
.pps-works .pps-works-items,
.pps-works .pps-works-item-photos,
.pps-ab .pps-slider {
    display: block !important;
}

/* Свой слайдер кейсов: показываем один, остальные скрыты.
   Класс появляется из ab-main.js; без JS видны все кейсы подряд —
   это осознанный запасной вариант, блок остаётся читаемым. */
.pps-works .pps-works-items.pps-works-ready .pps-works-item {
    display: none;
}

.pps-works .pps-works-items.pps-works-ready .pps-works-item.pps-works-item-active {
    display: flex;
}

.pps-works .pps-works-nav {
    position: absolute;
    top: 50%;
    z-index: 4;
    width: 40px;
    height: 40px;
    margin-top: -20px;
    border: 1px solid #E8E8E8;
    border-radius: 2px;
    background: #FFFFFF;
    cursor: pointer;
    transition: background .2s, border-color .2s;
}

/* ПМ: стрелки внутри контентной области. Карточка 1100 центрирована,
   стрелки прижаты к краям контента — как в фрейме «Frame 1403». */
.pps-works .pps-works-prev { left: 0; }
.pps-works .pps-works-next { right: 0; }

.pps-works .pps-works-nav:hover {
    background: #794425;
    border-color: #794425;
}

.pps-works .pps-works-nav::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 9px;
    height: 9px;
    margin: -5px 0 0 -6px;
    border-top: 2px solid #1D1D1D;
    border-right: 2px solid #1D1D1D;
    transform: rotate(45deg);
}

.pps-works .pps-works-prev::before {
    margin-left: -3px;
    transform: rotate(-135deg);
}

.pps-works .pps-works-nav:hover::before {
    border-color: #FFFFFF;
}

@media (max-width: 991px) {
    .pps-works .pps-works-prev { left: -6px; }
    .pps-works .pps-works-next { right: -6px; }
}

/* ==================================================================
   Блок «Контакты» — объединён с ФОС (ТЗ)
   Карточки контактов оставлены как их рисует решение (абсолютная полоса
   поверх карты): попытки переложить их в колонку ломали карусель решения.
   Форма перенесена внутрь блока и лежит панелью справа под карточками.
   Цвета сняты с images/image30.png: панель #794425, кнопка #BA1907.
   ================================================================== */

.pps-contacts .widget-content {
    position: relative;
}

/* Раскладка макета: поверх карты две колонки — карточки 575px слева,
   панель формы 600px справа, зазор 25px, отступ сверху 60px.
   Штатную полосу карточек прячем: адреса рисует ab.contacts.php,
   потому что карусель решения не пересчитывает ширины. */
.pps-contacts .pps-hidden-items {
    display: none !important;
}

/* Колонки одной высоты: в макете и карточки, и панель формы по 652px.
   align-items: stretch тянет левую колонку до высоты панели. */
.pps-contacts .pps-contacts-overlay {
    position: absolute;
    top: 60px;
    left: 50%;
    z-index: 3;
    box-sizing: border-box;
    display: flex;
    gap: 25px;
    align-items: stretch;
    width: 1200px;
    max-width: calc(100% - 40px);
    transform: translateX(-50%);
    pointer-events: none;   /* карта под панелями остаётся живой */
}

.pps-contacts .pps-contacts-left,
.pps-contacts .pps-contacts-right {
    pointer-events: auto;
}

/* Карточки распределяют высоту колонки между собой, зазор 10px как в макете. */
.pps-contacts .pps-contacts-left {
    flex: 0 0 575px;
    max-width: 575px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.pps-contacts .pps-contacts-right {
    position: static;
    flex: 0 0 600px;
    max-width: 600px;
    box-sizing: border-box;
}

/* --- карточки контактов ------------------------------------------------ */
/* Замер макета: карточки 575px, зазор 10px, чередование тёмной и коричневой.
   Тексты 14px: заголовок 600, телефон и адрес 400. */
/* Свободную высоту делим в пропорциях макета: 214 / 235 / 183.
   Поровну карточка руководителя выходила самой высокой, а в макете она ниже всех.

   Содержимое центрируем по вертикали: в макете у карточек равные поля
   сверху и снизу (45px у адресных, 54 у карточки руководителя), то есть
   контент стоит посередине. Карточки у нас растянуты по высоте колонки,
   и без центрирования текст прижимался к верху, а низ пустовал.
   Боковые поля тоже макетные — 45px. */
.pps-contacts .pps-contacts-card,
.pps-contacts .pps-contacts-left .widget-feedback-section {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    flex: 214 1 auto;
    margin: 0;
    padding: 45px;
    background: #17171D;
}

/* ПМ: в нижнем разделе поле сверху/снизу 54, слева 45 (замер «Frame 1420»). */
.pps-contacts .pps-contacts-left .widget-feedback-section {
    padding: 54px 45px;
}

.pps-contacts .pps-contacts-card-brown {
    flex-grow: 235;
}

.pps-contacts .pps-contacts-left .widget-feedback-section {
    flex-grow: 183;
}

/* Блок наших карточек — тоже колонка. Его вес равен сумме весов карточек
   внутри (214 + 235 = 449), иначе свободная высота делилась между обёрткой
   и карточкой руководителя как 1 к 183, и та занимала почти всё. */
.pps-contacts .pps-contacts-cards {
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 449 1 auto;
}

.pps-contacts .pps-contacts-card-brown {
    background: #794425;
}

.pps-contacts .pps-contacts-card-name {
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 21px;
    color: #FFFFFF;
}

/* ПМ: между строчками карточки 20px (замер «Frame 1419»). */
.pps-contacts .pps-contacts-card-phone {
    margin-top: 20px;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 21px;
    color: #FFFFFF;
}

.pps-contacts .pps-contacts-card-phone a {
    color: #FFFFFF;
    text-decoration: none;
    transition: color .2s;
}

.pps-contacts .pps-contacts-card-phone a:hover {
    color: #A05A31;
}

.pps-contacts .pps-contacts-card-address {
    margin-top: 20px;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 21px;
    color: #BEBEBE;   /* ПМ: было #9A9A9E */
}

/* ПМ: фото руководителя 75x75, от него до текста 20px,
   от подписи до кнопки 20px (замер «Frame 1420»). */
.pps-contacts .pps-contacts-left .widget-feedback-image {
    width: 75px !important;
    height: 75px !important;
    min-width: 75px;
    background-size: cover;
}

/* Решение держит карточку в 350px и добавляет свои поля — в макете она
   занимает всю ширину плашки, а подпись стоит в одну строку. */
.pps-contacts .pps-contacts-left .widget-feedback {
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.pps-contacts .pps-contacts-left .widget-feedback .intec-grid {
    gap: 20px;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: none !important;
    flex-wrap: nowrap;
}

.pps-contacts .pps-contacts-left .widget-feedback .intec-grid > * {
    padding: 0 !important;
}

/* Колонка с подписью и кнопкой у решения зажата до 183px, и подпись
   переносилась на две строки. В макете под неё отведено 390. */
.pps-contacts .pps-contacts-left .widget-feedback .intec-grid-item {
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0;
}

html.pps-ab .pps-contacts .pps-contacts-left .widget-feedback .widget-feedback-buttons {
    margin-top: 20px !important;
}

/* Декоративное фото рабочего — CSS-фон отдельного элемента.
   По макету панель просто коричневая. */
.pps-contacts .pps-contacts-right .form-result-new-additional-picture {
    display: none !important;
}

.pps-contacts .pps-contacts-right .form-result-new-block-bg {
    background-image: none !important;
    background-color: #794425 !important;
    padding: 40px !important;
}

.pps-contacts .pps-contacts-right [class*="container-"] {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent;
}

/* Заголовок панели: в макете 24 / 400 / lh 31, белый.
   Решение рисует 48 / 700 — текст не помещался в колонку. */
.pps-contacts .pps-contacts-right .form-result-new-title {
    font-size: 24px;
    font-weight: 400;
    line-height: 31px;
    color: #FFFFFF;
    margin-bottom: 24px;
}

/* Форма свёрстана в расчёте на соседство с фотографией: её обёртка была
   зажата до 240px, а сама форма до 80. Фото убрано — растягиваем. */
.pps-contacts .pps-contacts-right .form-result-new-form-wrap,
.pps-contacts .pps-contacts-right .form-result-new-form-content,
.pps-contacts .pps-contacts-right .form-result-new-form-content > form,
.pps-contacts .pps-contacts-right .form-result-new-element,
.pps-contacts .pps-contacts-right .form-result-new-element-input-wrap {
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 100% !important;
}

.pps-contacts .pps-contacts-right .form-result-new-element-title,
.pps-contacts .pps-contacts-right label {
    font-size: 12px;
    line-height: 18px;
}

.pps-contacts .pps-contacts-right .form-result-new-button,
.pps-contacts .pps-contacts-right button[type="submit"] {
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    background: #BA1907 !important;
    border-color: #BA1907 !important;
}

/* Карту не растягиваем: попытка развернуть её на всю высоту блока ломала
   отрисовку — Яндекс.Карта размножалась плитками. Оставляем свою высоту,
   а блоку задаём высоту под панель формы. */
.pps-contacts .widget-map {
    position: relative;
    z-index: 1;
}

/* Высота блока — под панель формы: она начинается с 60 и стала 753px
   после того, как убрали лишние внутренние поля. Раньше стояло 1240
   и под картой зияло белое поле. */
.pps-contacts .widget-content {
    min-height: 880px;
    background: #FFFFFF;
}

/* ПМ: адаптив блока по макету «Frame 1445» — колонка во всю ширину,
   ФОС идёт первой, за ней карточки. Замер: поля карточек 40/20,
   поля панели ФОС 40/30.

   Здесь же чинилась горизонтальная прокрутка всей страницы: у левой
   колонки оставалось жёсткое `flex: 0 0 575px`, накладка расползалась
   до 1175px, и вслед за ней раздувался нижний фиксированный блок решения
   (он тянется во всю ширину экрана). */
@media (max-width: 991px) {
    .pps-contacts .pps-contacts-overlay {
        position: static;
        display: flex;
        flex-direction: column;
        gap: 10px;
        width: 100%;
        max-width: 100%;
        margin: 20px 0 0;
        transform: none;
    }

    .pps-contacts .pps-contacts-left {
        order: 2;
        flex: 1 1 auto;
        width: 100%;
        max-width: 100%;
    }

    .pps-contacts .pps-contacts-right {
        order: 1;
        position: static;
        flex: 1 1 auto;
        width: 100%;
        max-width: 100%;
        margin-top: 0;
    }

    .pps-contacts .widget-content {
        min-height: 0;
    }

    .pps-contacts .pps-contacts-card,
    .pps-contacts .pps-contacts-left .widget-feedback-section {
        flex: 1 1 auto;
        padding: 40px 20px;
    }

    .pps-contacts .pps-contacts-right .form-result-new-block-bg {
        padding: 20px 10px !important;   /* + 20 промежуточного узла = 40/30 */
    }
}


/* ==================================================================
   ВОССТАНОВЛЕНО. Эти правила были случайно срезаны при переписывании
   блока «Контакты» — из-за чего на странице задвоились «Каталог
   продукции» и «Услуги», а вертикальный ритм вернулся к решению.
   ================================================================== */

/* Штатные «Каталог продукции» и «Услуги» в варианте прячем: вместо них
   рисуются наши блоки. Компонент при этом продолжает кешироваться —
   отключение его кеша приводило к перегрузке базы. */
.pps-ab .pps-replaced {
    display: none !important;
}

/* Наши блоки повторяют сетку страницы: контент 1200px по центру. */
.pps-cs .pps-cs-inner,
.pps-sv .pps-sv-inner {
    box-sizing: border-box;
    max-width: 1230px;
    margin: 0 auto;
    padding: 0 15px;
}

.pps-cs,
.pps-sv {
    padding: 100px 0;
}

/* Вертикальный ритм страницы: у блока 100px сверху и снизу, между
   соседними блоками 200px. Именно padding, а не margin — соседние
   вертикальные margin схлопываются. Класс проставляет ab-main.js. */
.pps-ab .pps-section {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 100px !important;
    padding-bottom: 100px !important;
}

/* Таб «Акции %» — красный, замер макета images/image2.png. */
.pps-ab .widget-tabs a.pps-tab-shares,
.pps-ab .intec-ui-part-tab a.pps-tab-shares {
    color: #BA1907 !important;
}

.pps-ab .widget-tabs a.pps-tab-shares:hover,
.pps-ab .intec-ui-part-tab a.pps-tab-shares:hover {
    color: #820E0E !important;
}

/* Дотсы слайдера кейсов «Наших работ»: короткие полоски, активная длиннее.
   ПМ: на ПК дотсов быть не должно — показываем только на МУ. */
.pps-works .pps-works-dots {
    display: none;
    justify-content: center;
    gap: 6px;
    margin-top: 20px;
}

@media (max-width: 767px) {
    .pps-works .pps-works-dots {
        display: flex;
        gap: 3px;
        margin-top: 30px;
    }
}

/* Тот же фрейм «Frame 1441»: полоски одинаковой длины. */
.pps-works .pps-works-dot {
    width: 10px;
    height: 4px;
    padding: 0;
    border: 0;
    border-radius: 3px;
    background: #E8E8E8;
    cursor: pointer;
    transition: background .2s;
}

.pps-works .pps-works-dot.active {
    background: #794425;
}

/* Первый экран: интерлиньяж заголовка 36.6 по макету (было 42.9)
   и вес подписи плитки 500 (был 400). */
.pps-ab .left-part .top-text p.capitalised {
    line-height: 37px;
}

.pps-ab .small-tile .small-tile-label {
    font-weight: 500;
}

@media (max-width: 767px) {
    /* На узких экранах ритм плотнее: замер мобильного макета даёт 60px. */
    .pps-ab .pps-section {
        padding-top: 60px !important;
        padding-bottom: 60px !important;
    }

    .pps-cs,
    .pps-sv,
    .pps-works,
    .pps-about {
        padding: 60px 0;
    }

    /* ПМ (фрейм «Frame 1439»): стрелки уходят из середины карточки
       в строку с дотсами под ней, размер 32x32. */
    .pps-works .pps-works-nav {
        top: auto;
        bottom: 0;
        width: 32px;
        height: 32px;
        margin-top: 0;
    }

    .pps-works .pps-works-prev { left: 0; }
    .pps-works .pps-works-next { right: 0; }
}

/* Блока «Новости» нет ни в ТЗ, ни в макете — в варианте скрываем.
   Класс проставляет ab-main.js. Оригинал не трогаем. */
.pps-ab .pps-hidden-block {
    display: none !important;
}

/* ==================================================================
   Зазор от заголовка блока до содержимого.
   Замер макета: заголовок 24/lh31, до содержимого ровно 40px.
   Замер сайта до правки: каталог 0, услуги 0, наши работы 0
   (правило потерялось при срезе файла), популярные товары 35,
   благодарственные письма 25, наша команда 40 — совпадала.
   ================================================================== */
.pps-cs .pps-cs-header,
.pps-sv .pps-sv-header,
.pps-works .pps-works-header {
    margin-bottom: 40px;
}

/* Штатные блоки: доводим их шапки до тех же 40px. */
html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-header {
    margin-bottom: 40px;
}

/* Значение для «Популярных товаров» задано ниже с учётом компенсации. */

/* Внутри шапки блока у решения лежит сетка с отрицательными полями -8px
   сверху и снизу. Из-за них фактический зазор до содержимого выходил
   не 40px, а 35 у «Популярных товаров» и 25 у «Благодарственных писем»
   (заголовок выступает за нижнюю границу шапки). Гасим их — тогда
   margin-bottom: 40px даёт ровно 40. */
html.pps-ab .widget-header > .intec-grid {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Даже с погашенными отрицательными полями заголовок не совпадает с нижней
   границей шапки: внутри остаются собственные отступы сетки решения, у каждого
   блока свои. Доводим компенсацией — значения подобраны замером на живой
   странице до ровных 40px от заголовка до содержимого.
   «Популярные товары»: было 43 → 37. «Благодарственные письма»: было 33 → 47. */
/* У «Популярных товаров» зазор задаёт не шапка, а margin-top: 40px
   у .widget-content — соседние вертикальные отступы схлопываются, побеждает
   больший. Плюс у полосы табов свой margin-top: -5px. Итого выходило 43.
   Задаём 37 на контенте: 37 − 5 = 32 от низа шапки, плюс 8px, на которые
   шапка ниже заголовка, = ровно 40. */
html.pps-ab .widget.c-widget.c-widget-products-4 .widget-header {
    margin-bottom: 0;
}

html.pps-ab .widget.c-widget.c-widget-products-4 .widget-content {
    /* 45, а не 37: рамку в 8px у заголовка ПМ просил убрать (круг 3),
       и вместе с ней из зазора ушли те же 8px. */
    margin-top: 45px;
}

html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-header {
    /* 55, а не 47 — по той же причине, что и у «Популярных товаров». */
    margin-bottom: 55px;
}

/* ==================================================================
   Маркеры и иконки — привязка к карточке, а не к картинке.
   Замер мастер-компонента макета (нода 735:12370, карточка 303x568):
   маркер стоит x=9, y=18 от края карточки, иконки — top 15, right 13.
   Раньше они были привязаны к контейнеру изображения и уезжали внутрь.
   ================================================================== */
/* Точка отсчёта — сама карточка, а не её внутренняя обёртка:
   у обёртки свои поля, из-за них маркер уезжал на 39px вместо 18. */
.pps-ab [data-role="item"].widget-item {
    position: relative;
}

.pps-ab .pps-marks {
    top: 18px;
    left: 9px;
}

.pps-ab .widget-item-action-buttons {
    top: 15px;
    right: 13px;
}

/* Картинке больше не нужен сдвиг вниз: маркеры и иконки лежат поверх неё
   у самой границы карточки, как в макете. */
.pps-ab .widget-item-image-container {
    margin-top: 0;
}

/* «Получить счет» — отдельной строкой во всю ширину под рядом покупки. */
.pps-ab .pps-invoice {
    margin-top: 10px;
}

/* ==================================================================
   ФОС «Предложим лучшие условия» — поля и кнопка по макету
   Замер (нода 1245:3501): подпись над полем 12/400/#808080,
   поле 503x40 с заливкой #FBFCFD, рамкой #F2F2F2 и радиусом 3px,
   «Заявка» высотой 79px. Кнопка 205x50, #BA1907, без скругления.
   Решение рисует поля прозрачными с белым подчёркиванием и placeholder внутри.
   ================================================================== */
.pps-contacts .pps-contacts-right .pps-field-label {
    margin-bottom: 5px;
    font-family: Montserrat, sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    color: #FFFFFF;   /* ПМ: было #808080 */
}

/* ПМ: «*» у обязательных полей — #FF0000. */
.pps-contacts .pps-contacts-right .pps-field-star {
    margin-left: 3px;
    color: #FF0000;
}

.pps-contacts .pps-contacts-right .form-result-new-input,
.pps-contacts .pps-contacts-right input:not([type="hidden"]):not([type="checkbox"]),
.pps-contacts .pps-contacts-right textarea {
    box-sizing: border-box;
    height: 40px;
    padding: 9px 12px;
    border: 1px solid #F2F2F2 !important;
    border-radius: 3px;
    background: #FBFCFD !important;
    font-family: Montserrat, sans-serif;
    font-size: 14px;
    line-height: 20px;
    color: #1D1D1D !important;
}

.pps-contacts .pps-contacts-right textarea {
    height: 79px;
    resize: vertical;
}

/* «Заявка»: решение красит .form-result-new-input в .theme-light белым
   с !important и селектором сильнее общего правила выше — у input его
   перебивают :not(), у textarea нечем. */
.pps-contacts .pps-contacts-right .c-form-result-new-form-1 textarea.form-result-new-input {
    color: #1D1D1D !important;
}

.pps-contacts .pps-contacts-right .form-result-new-element {
    margin-bottom: 20px;
}

/* Кнопка: в макете прямоугольная 205x50, у решения — «таблетка». */
.pps-contacts .pps-contacts-right .form-result-new-button,
.pps-contacts .pps-contacts-right button[type="submit"],
.pps-contacts .pps-contacts-right input[type="submit"] {
    min-width: 205px;
    height: 50px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    border-radius: 0 !important;
}

/* В макете содержимое панели выровнено по левому краю и занимает всю её
   ширину: заголовок слева, поля 503px при панели 600 с полями 40,
   кнопка слева. Решение центрирует всё и зажимает форму до 320px. */
.pps-contacts .pps-contacts-right .form-result-new-block-bg,
.pps-contacts .pps-contacts-right .form-result-new-title,
.pps-contacts .pps-contacts-right .form-result-new-form-wrap,
.pps-contacts .pps-contacts-right .form-result-new-form-content,
.pps-contacts .pps-contacts-right .position-right {
    text-align: left !important;
}

.pps-contacts .pps-contacts-right .position-right,
.pps-contacts .pps-contacts-right .form-result-new-form-wrap,
.pps-contacts .pps-contacts-right .form-result-new-form-content,
.pps-contacts .pps-contacts-right form {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
}

/* Кнопка прижата влево, а не по центру. */
.pps-contacts .pps-contacts-right .form-result-new-button-wrap,
.pps-contacts .pps-contacts-right .form-result-new-button-container {
    text-align: left !important;
}

/* Внутренний контейнер формы у решения имеет padding: 80px — он и сжимал
   форму с 480 до 320px и уводил её к центру панели. В макете поля идут
   во всю ширину панели (503 при панели 600 с полями 40). Обнуляем. */
.pps-contacts .pps-contacts-right .form-result-new-form-content {
    padding: 0 !important;
}

/* Кнопку решение центрирует блоком .form-result-new-submit — в макете она
   прижата к левому краю панели. Собственное поле блока (50px сверху) уводит
   кнопку от текста согласия: расстояние до него задаёт сам текст. */
.pps-contacts .pps-contacts-right .form-result-new-submit {
    text-align: left !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* ПМ: поля панели 40 сверху/снизу/слева и 57 справа. Между фоном и формой
   у решения есть промежуточный узел со своим полем 20px, поэтому здесь
   задаём на 20 меньше — в сумме выходит ровно макетное значение. */
.pps-contacts .pps-contacts-right .form-result-new-block-bg {
    padding: 20px 37px 20px 20px !important;
}

.pps-contacts .pps-contacts-right .position-right {
    margin: 0 !important;
    padding: 0 !important;
}

/* ПМ: согласие переехало над кнопку, чекбокса нет, весь текст белый,
   а ссылки подчёркнуты пунктиром. */
.pps-contacts .pps-contacts-right .form-result-new-consent-text {
    margin: 0 0 20px !important;
    padding: 0 !important;
    font-family: Montserrat, sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    color: #FFFFFF !important;
}

.pps-contacts .pps-contacts-right .form-result-new-consent-text a {
    color: #FFFFFF !important;
    text-decoration: none;
    border-bottom: 1px dashed #FFFFFF;
}

.pps-contacts .pps-contacts-right .form-result-new-consent-text a:hover {
    border-bottom-color: transparent;
}

/* ==================================================================
   ПРАВКИ ПМ — карточка товара на МУ, макет «Frame 1351»
   Замер мастера (нода 853:3334, карточка 160x473):
     поля 20, фото 118x103, название 14/700/20 #1B1E25,
     «В наличии» 12/500 #0EAD00, цена 16/600/22 #1D1D1D,
     сноска 12/400/18, кнопки высотой 43.
   ================================================================== */
@media (max-width: 767px) {
    .pps-ab [data-role="item"].widget-item .widget-item-wrapper {
        padding: 20px !important;
    }

    /* ПМ (круг 2): фото берём как в плитке каталога — квадрат во всю
       ширину контента карточки, изображение заполняет его целиком. */
    .pps-ab [data-role="item"] .widget-item-image-container,
    .pps-ab [data-role="item"] .widget-item-image {
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 1 / 1;
        padding-top: 0 !important;
    }

    .pps-ab [data-role="item"] .widget-item-image-container {
        margin-bottom: 26px;
    }

    .pps-ab [data-role="item"] .widget-item-image-wrapper img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .pps-ab [data-role="item"] .widget-item-name,
    .pps-ab [data-role="item"] .widget-item-name a {
        font-size: 14px !important;
        font-weight: 700 !important;
        line-height: 20px !important;
        color: #1B1E25 !important;
    }

    /* На МУ «В наличии» в макете есть — решение прячет обёртку подписи
       правилом со своей цепочкой классов, поэтому повторяем её целиком. */
    html.pps-ab .widget.c-widget-products-4 [data-role="item"].widget-item
    .widget-item-information .widget-item-quantity-wrap,
    html.pps-ab [data-role="item"].widget-item .widget-item-information
    .widget-item-quantity-wrap {
        display: block !important;
    }

    /* ПМ: у названия снизу отступа нет, у наличия по 15px сверху и снизу,
       у сноски сверху 8. */
    .pps-ab [data-role="item"] .widget-item-name {
        margin-bottom: 0 !important;
    }

    .pps-ab [data-role="item"] .widget-item-information {
        margin: 15px 0 !important;
    }

    .pps-ab [data-role="item"] .pps-price-note {
        margin-top: 8px;
    }

    /* Название в макете занимает три строки, решение обрезает по двум. */
    .pps-ab [data-role="item"] .widget-item-name,
    .pps-ab [data-role="item"] .widget-item-name > * {
        height: auto !important;
        max-height: 60px;
        overflow: hidden;
    }

    /* Цена обрезалась: у блока цены `overflow: hidden`, а внутренняя сетка
       шире него из-за отрицательных полей решения. */
    .pps-ab [data-role="item"] .widget-item-price {
        overflow: visible !important;
    }

    .pps-ab [data-role="item"] .widget-item-price-wrapper {
        margin: 0 !important;
    }

    .pps-ab [data-role="item"] .widget-item-price-wrapper > * {
        padding: 0 !important;
    }

    .pps-ab [data-role="item"] .widget-item-price-limit,
    .pps-ab [data-role="item"] .widget-item-price-limited-width {
        width: auto !important;
        max-width: 100% !important;
        /* Решение рвёт длинную цену посреди слова («…ру / б.») — переносим
           только по пробелам. */
        word-break: normal;
        overflow-wrap: normal;
    }

    /* Длинные маркеры («Распродажа со склада») вылезали за карточку. */
    .pps-ab [data-role="item"] .pps-marks {
        max-width: calc(100% - 16px);
        flex-wrap: wrap;
    }

    .pps-ab [data-role="item"] .pps-mark {
        max-width: 100%;
        box-sizing: border-box;
        /* Длинные маркеры («Распродажа со склада») вылезали за карточку:
           у плашки стоит nowrap, на узкой карточке он не годится. */
        white-space: normal;
        line-height: 14px;
    }

    /* Длинное слово в названии обрезалось по краю карточки: на 118px
       «восстановленные» не помещается целиком, а break-word переносит
       только если слово шире строки — здесь оно шире всего на пару пикселей. */
    .pps-ab [data-role="item"] .widget-item-name,
    .pps-ab [data-role="item"] .widget-item-name > * {
        overflow-wrap: anywhere;
    }

    .pps-ab [data-role="item"] .widget-item-price-limited-width,
    .pps-ab [data-role="item"] .widget-item-price-limited-width span {
        font-size: 16px !important;
        font-weight: 600 !important;
        line-height: 22px !important;
        color: #1D1D1D;
    }

    .pps-ab [data-role="item"] .pps-price-note {
        font-size: 12px;
        line-height: 18px;
    }

    /* Иконки уходят из угла фото в строку над кнопками — как в макете.
       Точка отсчёта у них абсолютная, поэтому возвращаем их в поток
       и переносим в конец колонки. */
    .pps-ab [data-role="item"] .widget-item-base {
        display: flex;
        flex-direction: column;
    }

    .pps-ab [data-role="item"] .widget-item-action-buttons {
        position: static !important;
        order: 99;
        margin-top: 12px;
    }

    /* Кнопки как в плитке каталога на МУ: «Сравнение» 42x42,
       ряд покупки и «Получить счет» высотой 42. */
    .pps-ab [data-role="item"] .widget-item-action-button {
        width: 42px;
        height: 42px;
        border-radius: 4px;
    }

    .pps-ab [data-role="item"] .widget-item-purchase-mobile,
    .pps-ab [data-role="item"] .widget-item-purchase-mobile .intec-ui-control-button,
    .pps-ab [data-role="item"] .pps-invoice {
        height: 42px !important;
    }

    .pps-ab [data-role="item"] .pps-invoice {
        font-size: 14px;
        font-weight: 400;
        line-height: 22px;
        margin-top: 10px;
    }

    /* ПМ: от «Получить счет» до нижней границы карточки 20px. */
    .pps-ab [data-role="item"] .widget-item-advanced {
        padding-bottom: 20px;
    }

    .pps-ab [data-role="item"].widget-item .widget-item-base {
        padding-bottom: 20px;
    }
}

/* ==================================================================
   ПРАВКИ ПМ (03.09.2026) — «Каталог продукции»
   ================================================================== */

/* Отступ между подразделами — 10px (было 4). */
.pps-cs .pps-cs-item-child + .pps-cs-item-child {
    margin-top: 10px;
}

/* Новая стрелка: в покое линия 18px, при наведении 22px и голова уезжает
   вправо на 4px. Замер фрейма «Новые стрелки, состоят из двух элементов». */
.pps-cs .pps-arrow,
.pps-about .pps-arrow {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    color: inherit;
}

.pps-cs .pps-arrow svg,
.pps-about .pps-arrow svg {
    display: block;
    overflow: visible;
}

.pps-cs .pps-arrow .pps-arrow-line,
.pps-about .pps-arrow .pps-arrow-line,
.pps-cs .pps-arrow .pps-arrow-head,
.pps-about .pps-arrow .pps-arrow-head {
    transition: d .25s ease, transform .25s ease;
}

.pps-cs .pps-cs-all:hover .pps-arrow .pps-arrow-line,
.pps-about .pps-about-more:hover .pps-arrow .pps-arrow-line {
    transform: scaleX(1.222);   /* 18px → 22px */
    transform-origin: 0 50%;
}

.pps-cs .pps-cs-all:hover .pps-arrow .pps-arrow-head,
.pps-about .pps-about-more:hover .pps-arrow .pps-arrow-head {
    transform: translateX(4px);
}

/* Вся карточка раздела кликабельна. Подложка накрывает карточку, а ссылки
   внутри поднимаются над ней слоем выше — так работают и они, и подложка.
   Обёртке z-index не задаём: иначе она создаст свой слой и ссылки внутри
   не смогут подняться над подложкой. */
.pps-cs .pps-cs-item-cover {
    position: absolute;
    inset: 0;
    z-index: 1;
    text-decoration: none;
}

.pps-cs .pps-cs-item-wrapper {
    position: relative;
}

.pps-cs .pps-cs-item-wrapper a {
    position: relative;
    z-index: 2;
}

@media (max-width: 767px) {
    /* ПМ: на МУ фото раздела 70x74. */
    .pps-cs .pps-cs-item-image {
        flex-basis: 70px;
        width: 70px;
    }

    .pps-cs .pps-cs-item-image img {
        width: 70px;
        height: 74px;
        object-fit: contain;
    }
}

/* ==================================================================
   ПРАВКИ ПМ — «Популярные товары»
   ================================================================== */

/* Табы: боковые отступы 20px, подчёркивание во всю ширину таба
   (замер макета: фрейм таба 96px при тексте «Рельсы» 54px). */
.pps-ab .widget-tabs .intec-ui-part-tab {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.pps-ab .widget-tabs .intec-ui-part-tab > a {
    padding-left: 20px !important;
    padding-right: 20px !important;
}

.pps-ab .widget-tabs .intec-ui-part-tab > a::after {
    left: 0 !important;
    right: 0 !important;
    width: auto !important;
}

/* Активный таб — полужирный. */
.pps-ab .widget-tabs .intec-ui-part-tab[data-active="true"] > a {
    font-weight: 600 !important;
}

/* Активный таб «Акции»: и текст, и подчёркивание красные. */
.pps-ab .widget-tabs .intec-ui-part-tab[data-active="true"] > a.pps-tab-shares {
    color: #BA1907 !important;
}

.pps-ab .widget-tabs .intec-ui-part-tab[data-active="true"] > a.pps-tab-shares::after {
    background: #BA1907 !important;
}

/* Название товара: Montserrat 600, 16/22. */
.pps-ab .widget-item-name,
.pps-ab .widget-item-name a {
    font-family: Montserrat, sans-serif;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 22px !important;
}

/* ПМ (МУ): правило выше задевало и подписи нижней панели
   («Каталог», «Услуги», «Прайс», «Акции»): они вырастали до 16/22,
   не помещались и обрезались. Возвращаем панели штатные 12px / 400. */
.pps-ab .c-panel-template-1 .widget-item-name {
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
}

/* «В наличии»: Medium 12/150%, цвет текста и точки #0EAD00. */
.pps-ab .widget-item-quantity,
.pps-ab .widget-item-quantity * {
    font-family: Montserrat, sans-serif;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 150% !important;
    color: #0EAD00 !important;
}

/* Названия характеристик — #808080 (было #9A9A9E). */
.pps-ab .pps-prop-name {
    color: #808080;
}

/* Цена крупнее: 18px. */
.pps-ab .widget-item-price-limited-width,
.pps-ab .widget-item-price-limited-width span {
    font-size: 18px;
}

/* Сноска о ценах: 12/150%, «*» красная, текст #1B1E25. */
.pps-ab .pps-price-note {
    font-size: 12px;
    line-height: 150%;
    color: #1B1E25;
}

.pps-ab .pps-price-note-star {
    color: #BA1907;
}

/* ПМ: порядок иконок — сначала «Быстрый просмотр», затем «Сравнение». */
.pps-ab .widget-item-action-button-quick-view {
    order: 1;
}

.pps-ab .widget-item-action-button-compare,
.pps-ab .widget-item-action-button-compared {
    order: 2;
}

/* ПМ: маркеры и иконки не должны шевелиться при наведении.

   Причина сдвига: в покое обёртка карточки статична, и абсолютные маркер
   с иконками отсчитываются от самой карточки. При наведении решение делает
   обёртку absolute — она становится точкой отсчёта, а её padding-box начинается
   за собственной рамкой в 1px. Отсюда ровно один пиксель вниз и вправо.
   Рамку убрать нельзя (она часть ховера решения), поэтому вычитаем её. */
.pps-ab [data-role="item"].widget-item:hover .pps-marks {
    top: 17px;
    left: 8px;
}

.pps-ab [data-role="item"].widget-item:hover .widget-item-action-buttons {
    top: 14px;
    right: 12px;
}

/* Контейнер иконок должен быть флексом, иначе order не действует
   (правило потерялось при более раннем срезе файла). */
.pps-ab .widget-item-action-buttons {
    display: flex !important;
    gap: 8px;
    align-items: center;
}

/* Оформление кнопок-иконок по эталону плитки каталога: 30x30,
   радиус 4, рамка #BDBDBD, при наведении рамка пропадает. */
.pps-ab .widget-item-action-button {
    box-sizing: border-box;
    width: 30px;
    height: 30px;
    border: 1px solid #BDBDBD;
    border-radius: 4px !important;
    background: #FFFFFF;
    margin-right: 0 !important;
}

.pps-ab .widget-item-action-button:hover {
    border-color: transparent;
}

/* ПМ: панель с кнопками открывается ВНИЗ и не перекрывает содержимое
   карточки. Решение прижимает её absolute к низу обёртки, а обёртка при
   наведении подрастает лишь на высоту одного ряда — панель наезжала
   на сноску о ценах. Ставим панель в поток: обёртка растёт на всю её высоту.
   Отрицательные поля возвращают панели ширину карточки — в макете
   («Frame 1456») она идёт от края до края. */
.pps-ab [data-role="item"].widget-item .widget-item-purchase-container {
    position: static !important;
    overflow: visible !important;
    margin: 0 -20px;
}

/* Ряды панели в макете по 52px. */
.pps-ab [data-role="item"] .widget-item-purchase-container-wrapper,
.pps-ab [data-role="item"] .widget-item-counter,
.pps-ab [data-role="item"] .widget-item-purchase {
    height: 52px;
}

.pps-ab [data-role="item"] .pps-invoice {
    height: 52px;
    padding-top: 0;
    padding-bottom: 0;
}

/* ==================================================================
   АДАПТИВ (отдельный раздел из списка ПМ)

   Макетов два: 360 и 1920. Промежуточные брейкпоинты подобраны так,
   чтобы каждый перелом случался там, где раскладка реально ломается —
   это проверено замером ширины страницы на 1280 / 1024 / 992 / 768 / 480:

     > 1199  — десктоп: контентная колонка 1200, сетки как в макете;
     992-1199 — ноутбук: колонки тянутся, карточки ужимаются, но остаются
                рядом (на 1024 контакты вылезали за экран на 200px);
     768-991  — планшет: двухколоночные блоки становятся одноколоночными;
     < 768    — мобильный: раскладка по мобильным макетам.

   Кегли и вертикальные отступы между 360 и 1920 меняются плавно
   через clamp(), чтобы промежуточные ширины не выглядели «ступеньками».
   ================================================================== */

/* Контентная колонка в макете ровно 1200px. У решения внешний контейнер
   1240 при колонке 1185: 40px забирает внутренняя обёртка блока и ещё 30 —
   её поля. Значит внешнему нужно 1200 + 40 + 30 = 1270, и колонка становится
   макетной сразу во всех блоках, включая шапку и подвал.
   Наши собственные блоки считают ширину сами — им 1200 + 30 = 1230. */
html.pps-ab .intec-content {
    max-width: 1270px;
}

/* Заголовки блоков: 24px на макете ПК, 20px на мобильном. */
html.pps-ab .pps-cs-title,
html.pps-ab .pps-sv-title,
html.pps-ab .pps-works-title,
html.pps-ab .pps-about-title,
html.pps-ab .pps-contacts-title,
html.pps-ab .widget-title {
    font-size: clamp(20px, 0.256vw + 19.08px, 24px);
}

/* Колонки «Контактов» тянутся, а не стоят фиксированными: на 1024
   пара 575 + 600 не помещалась и растягивала всю страницу. */
@media (min-width: 992px) {
    .pps-contacts .pps-contacts-left {
        flex: 1 1 575px;
        min-width: 0;
        max-width: 575px;
    }

    .pps-contacts .pps-contacts-right {
        flex: 1 1 600px;
        min-width: 0;
        max-width: 600px;
    }

    /* Поля формы шире панели быть не могут. */
    .pps-contacts .pps-contacts-right .form-result-new-input,
    .pps-contacts .pps-contacts-right textarea {
        max-width: 100%;
    }
}

/* Ноутбук: карточка кейса и фото сжимаются под ширину контента,
   стрелки остаются внутри неё. */
@media (max-width: 1199px) {
    .pps-works .pps-works-item {
        max-width: calc(100% - 100px);
    }

    .pps-works .pps-works-item-gallery {
        flex: 1 1 40%;
        max-width: 490px;
    }

    .pps-works .pps-works-item-photo img,
    .pps-works .pps-works-item-photos,
    .pps-works .pps-works-item-thumbs {
        width: 100%;
    }

    .pps-works .pps-works-item-photo img {
        height: auto;
        aspect-ratio: 1 / 1;
    }
}

/* Планшет: двухколоночные блоки складываются в одну колонку. */
@media (max-width: 991px) {
    .pps-works .pps-works-item {
        max-width: 100%;
    }

    .pps-cs .pps-cs-items {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Ни один блок не должен раздвигать страницу по горизонтали:
   на узких экранах это уводило вбок и нижнюю панель решения. */
@media (max-width: 991px) {
    html.pps-ab body {
        overflow-x: hidden;
    }
}

/* В мобильных макетах колонка 320 при экране 360, то есть поля по 20.
   У решения на МУ 15 — выравниваем свои блоки по макету.
   Правило стоит в конце файла: базовые `padding: 0 15px` объявлены ниже
   мобильного медиазапроса блоков и при равной силе выигрывали. */
@media (max-width: 767px) {
    .pps-sv .pps-sv-inner,
    .pps-works .pps-works-inner {
        padding-left: 20px;
        padding-right: 20px;
    }
}

/* Стрелки писем ПМ просил не трогать — они стояли по краям контентной
   колонки. После того как колонка стала макетной (1200 вместо 1185),
   полоса .widget-items расширилась вместе с контейнером, и стрелки уехали
   на 15px наружу. Возвращаем их на край колонки. */
@media (min-width: 992px) {
    html.pps-ab .widget.c-certificates.c-certificates-template-1 .navigation-left {
        left: 15px;
    }

    html.pps-ab .widget.c-certificates.c-certificates-template-1 .navigation-right {
        right: 15px;
    }
}

/* ==================================================================
   ПРАВКИ ПМ, круг 2 (10.09.2026)

   Ключевое: сайт грузит Montserrat в весах 300/400/500/700, SemiBold
   среди них не было — поэтому всё, что мы ставили в 600, браузер рисовал
   жирным. Недостающее начертание догружается в header.php варианта,
   после чего «bold → semibold» из списка ПМ сходится само.
   ================================================================== */

/* --- Каталог: на МУ у ссылки «Весь каталог» две стрелки, нужна одна --- */
@media (max-width: 767px) {
    .pps-cs .pps-cs-all .pps-arrow {
        display: none;
    }
}

/* --- Популярные товары: воздух вокруг блока 50 → 100 --- */
html.pps-ab .widget.c-widget.c-widget-products-4 {
    padding-top: 50px;
    padding-bottom: 50px;
}

/* --- Табы --------------------------------------------------------- */
/* ПК: строка табов начиналась на 30px левее контентной области —
   сдвигаем так, чтобы левый край таба «Рельсы» совпал с колонкой. */
@media (min-width: 768px) {
    /* Сокращённая запись `margin: -5px -15px` у решения объявлена ниже
       по файлу и перебивала обычный margin-left. */
    html.pps-ab .widget-tabs.intec-ui-control-tabs {
        margin-left: 15px !important;
    }
}

/* МУ: боковые отступы таба 20 → 10, строку не двигаем. */
@media (max-width: 767px) {
    .pps-ab .widget-tabs .intec-ui-part-tab > a {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
}

/* --- Мини-карточка товара по эталону плитки каталога ---------------
   Замер /catalog/relsy/?view=tile: обёртка 20/20/0, база сверху 10 и
   снизу 30, фото → название 21, название без верхнего отступа и без
   фиксированной высоты, наличие снизу 20, характеристики снизу 20,
   сноска сверху 10, иконки 30x30 с зазором 6.
   ------------------------------------------------------------------ */
.pps-ab [data-role="item"].widget-item .widget-item-base {
    margin-top: 10px;
}

.pps-ab [data-role="item"] .widget-item-image-container {
    margin-bottom: 21px;
}

/* Высоту названия выравнивает ab-main.js по самому высокому в строке —
   поэтому фиксированную высоту решения снимаем. */
.pps-ab [data-role="item"] .widget-item-name {
    margin-top: 0 !important;
    height: auto !important;
}

.pps-ab [data-role="item"] .widget-item-information {
    margin: 10px 0 20px !important;
}

.pps-ab [data-role="item"] .pps-price-note {
    margin-top: 10px;
}

.pps-ab .widget-item-action-buttons {
    gap: 6px;
}

/* --- Услуги ------------------------------------------------------- */
/* Отступ от названия до описания 12 → 20. */
.pps-sv .pps-sv-item-text {
    margin-top: 20px;
}

/* --- Наши работы -------------------------------------------------- */
.pps-works {
    padding: 100px 0;
}

.pps-works .pps-works-item-text {
    margin-top: 25px;
}

.pps-works .pps-works-item-props {
    margin-top: 25px;
}

.pps-works .pps-works-item-prop {
    margin-bottom: 25px;
}

.pps-works .pps-works-item-prop:last-child {
    margin-bottom: 0;
}

.pps-works .pps-works-item-footer {
    margin-top: 40px;
}

/* ПМ: полосу прокрутки миниатюр оформляем как вертикальную полосу
   в выпадающем меню каталога — там работает плагин jquery.scrollbar:
   дорожка 4px #E0E0E0 с радиусом 2, ползунок #C2C2C2. Повторяем видом
   на системной полосе, чтобы не оборачивать галерею чужой разметкой. */
.pps-works .pps-works-item-thumbs {
    scrollbar-width: thin;
    scrollbar-color: #C2C2C2 #E0E0E0;
}

.pps-works .pps-works-item-thumbs::-webkit-scrollbar {
    height: 4px;
}

.pps-works .pps-works-item-thumbs::-webkit-scrollbar-track {
    background: #E0E0E0;
    border-radius: 2px;
}

.pps-works .pps-works-item-thumbs::-webkit-scrollbar-thumb {
    background: #C2C2C2;
    border-radius: 2px;
}

.pps-works .pps-works-item-thumbs::-webkit-scrollbar-button {
    display: none;
    width: 0;
    height: 0;
}

@media (max-width: 767px) {
    .pps-works {
        padding: 60px 0;
    }

    .pps-works .pps-works-item-footer {
        margin-top: 35px;
    }

    /* Между подписью характеристики и значением 8px. */
    .pps-works .pps-works-item-prop {
        gap: 8px;
    }
}

/* --- Благодарственные письма -------------------------------------- */
/* Подписи в макете обычного начертания. */
html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-item-name {
    font-weight: 400 !important;
}

/* --- Письма: зазор от стрелок до сертификатов 10px ------------------
   Замер: полоса стояла в 404..1516, от левой стрелки (кончается на 400)
   оставалось 4px, справа — 14. Стрелки трогать нельзя (они по краям
   контентной колонки), поэтому двигаем полосу: 410..1520, где последние
   10px — поле последнего письма. Зазор между письмами остаётся 10. */
@media (min-width: 992px) {
    html.pps-ab .widget.c-certificates.c-certificates-template-1 [data-role="slider"] {
        box-sizing: border-box;
        max-width: none;
        margin: 0;
        /* именно padding, а не margin: полоса лежит флекс-элементом
           в сетке решения, и поля там не сдвигают её, а схлопываются */
        padding: 0 45px 0 55px;
    }
}

/* ПМ: нижний отступ блока должен начинаться под подписью. Отрицательное
   поле сетки решения вытягивало подпись за нижнюю границу блока,
   и до следующего блока оставалось 85px вместо 100. */
html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-content {
    /* 15px = ровно та часть подписи, которую отрицательное поле сетки
       решения вытягивало за нижнюю границу блока. Проверять надо
       по самой длинной подписи: у неё две строки. */
    padding-bottom: 15px;
}

/* ПМ: ховер письма. Решение приподнимает картинку на 10px и вешает тень
   только вниз, а лента карусели режет всё, что выходит за её высоту, —
   поэтому сверху фото обрезалось. Даём ленте вертикальный запас
   (padding гасим отрицательным полем, чтобы раскладка не поехала)
   и делаем тень по всему периметру. */
html.pps-ab .widget.c-certificates.c-certificates-template-1 .owl-stage-outer {
    padding: 15px 0;
    margin: -15px 0;
}

html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-item-picture img {
    box-shadow: none;
}

/* ПМ: тень при наведении — как на странице /company/blagodarstvenniye_pisma/.
   Замер эталона: box-shadow 0 8px 9px rgba(0,0,0,.21), переход 0.4s,
   подъёма картинки там нет — гасим и его, иначе фото дёргается. */
html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-item-picture-wrapper {
    transition: box-shadow .4s;
}

html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-item:hover .widget-item-picture-wrapper {
    inset: 0 !important;
    box-shadow: 0 8px 9px rgba(0, 0, 0, .21);
}

/* На МУ письмо занимает экран целиком с полями по 20px. */
@media (max-width: 991px) {
    html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-content {
        padding-left: 20px;
        padding-right: 20px;
    }

    html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-items {
        margin-left: 0;
        margin-right: 0;
    }

    html.pps-ab .widget.c-certificates.c-certificates-template-1 [data-role="slider"] {
        padding: 0;
    }
}

/* Дотсы под слайдерами писем и команды — рисует ab-main.js.
   Оформление то же, что у «Наших работ» (фрейм «Frame 1441»). */
.pps-ab .pps-owl-dots {
    display: none;
    justify-content: center;
    gap: 3px;
    margin-top: 30px;
}

.pps-ab .pps-owl-dots button {
    width: 10px;
    height: 4px;
    padding: 0;
    border: 0;
    border-radius: 3px;
    background: #E8E8E8;
    cursor: pointer;
    transition: background .2s;
}

.pps-ab .pps-owl-dots button.active {
    background: #794425;
}

@media (max-width: 767px) {
    .pps-ab .pps-owl-dots {
        display: flex;
    }
}

/* --- Наша команда -------------------------------------------------- */
/* ПМ: нижний отступ карточки сотрудника 60 → 20. */
html.pps-ab .widget.c-staff.c-staff-template-1 .widget-element {
    padding-bottom: 20px;
}

@media (max-width: 767px) {
    /* ПМ: на МУ карточки налезали друг на друга — виновата была не сама
       карусель, а поля контента в 30px: слайдер получал 260px при экране
       в 320, и соседний слайд заходил в кадр. Отдаём слайдеру всю ширину
       колонки, поля 20px даёт внешняя обёртка блока. */
    html.pps-ab .widget.c-staff.c-staff-template-1 .widget-content {
        padding-left: 0;
        padding-right: 0;
    }

    html.pps-ab .widget.c-staff.c-staff-template-1 .widget-items {
        margin-left: 0;
        margin-right: 0;
    }

    /* Стрелки на МУ решение прячет — возвращаем, как у писем. */
    html.pps-ab .widget.c-staff.c-staff-template-1 [data-role="slider.navigation"] {
        display: block !important;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        pointer-events: none;
    }

    html.pps-ab .widget.c-staff.c-staff-template-1 .widget-items {
        position: relative;
    }

    html.pps-ab .widget.c-staff.c-staff-template-1 .navigation-left,
    html.pps-ab .widget.c-staff.c-staff-template-1 .navigation-right {
        display: block !important;
        position: absolute;
        top: 100px;
        z-index: 3;
        width: 40px;
        height: 40px;
        pointer-events: auto;
    }

    html.pps-ab .widget.c-staff.c-staff-template-1 .navigation-left {
        left: -20px;
    }

    html.pps-ab .widget.c-staff.c-staff-template-1 .navigation-right {
        right: -20px;
    }
}

/* --- «ПромПутьСнабжение — поставщик МВСП» отдельным блоком ---------- */
/* ПМ: своя полоса с фоном #F8F9FB и полями 100px (60 на МУ),
   как у блока «Услуги». */
.pps-about {
    padding: 100px 0;
    background: #F8F9FB;
}

@media (max-width: 767px) {
    .pps-about {
        padding: 60px 0;
    }
}

/* --- Контакты ------------------------------------------------------ */
/* ПМ: от верха карточки «Главный офис» до верха блока с картой 100px. */
.pps-contacts .pps-contacts-overlay {
    top: 100px;
}

/* ПМ: поля панели ФОС сверху/снизу 20 → 40. По бокам остаётся как было:
   20 здесь плюс 20 промежуточного узла слева и 37 + 20 справа. */
.pps-contacts .pps-contacts-right .form-result-new-block-bg {
    padding: 40px 37px 40px 20px !important;
}

/* ПМ: отступ под заголовком формы 50 → 42 (на МУ 32). */
.pps-contacts .pps-contacts-right .form-result-new-form-header {
    margin-bottom: 42px !important;
}

@media (max-width: 767px) {
    .pps-contacts .pps-contacts-right .form-result-new-form-header {
        margin-bottom: 32px !important;
    }
}

/* ПМ: «Связаться с руководителем» — semibold, «Написать» — regular. */
html.pps-ab .pps-contacts .pps-contacts-left .widget-feedback .widget-feedback-text {
    font-weight: 600 !important;
}

.pps-contacts .pps-contacts-left .widget-feedback-button {
    font-weight: 400 !important;
}

/* Вторая строка адреса остаётся приглушённой, первая — белая. */
.pps-contacts .pps-contacts-card-address .pps-contacts-card-street {
    display: block;
    color: #FFFFFF;
}

.pps-contacts .pps-contacts-card-address .pps-contacts-card-city {
    display: block;
}

/* Приписка про заведующего складом — отдельной строкой и некликабельная. */
.pps-contacts .pps-contacts-card-note {
    display: block;
    color: #BEBEBE;
}

/* ПМ (МУ): между ФОС и карточками контактов белых промежутков быть
   не должно, а карта уходит вниз — под «Связаться с руководителем». */
@media (max-width: 991px) {
    .pps-contacts .widget-content {
        display: flex;
        flex-direction: column;
    }

    .pps-contacts .pps-contacts-overlay {
        order: 1;
        gap: 0;
        margin: 0;
    }

    .pps-contacts .widget-map {
        order: 9;
    }

    .pps-contacts .pps-contacts-left,
    .pps-contacts .pps-contacts-cards {
        gap: 0;
    }
}

/* ПМ: от низа самой высокой карточки сотрудника до блока с картой 100px.
   Секция «Нашей команды» даёт свои 100 снизу, а сверху у секции контактов
   оставалось поле решения в 50px — итого выходило 150. */
.pps-ab .pps-contacts-section {
    margin-top: 0 !important;
}

/* ПМ: убрать белую полосу под «Нашей командой». Полосу рисовала пустая
   секция сборки: высоты у неё нет, а поля по 50px выходят наружу.
   Гасим их — и нижний отступ секции команды снова работает как надо
   (100px до карты на ПК, 60 на МУ). */
.pps-ab .pps-empty-section {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* ==================================================================
   МУ-правила карточки товара — в конце файла намеренно.

   Десктопные значения из этого же круга правок объявлены ниже
   мобильного блока и при равной силе выигрывали, поэтому мобильные
   переопределения собраны здесь.
   ================================================================== */
@media (max-width: 767px) {
    /* Наличие: по 15px сверху и снизу. */
    .pps-ab [data-role="item"] .widget-item-information {
        margin: 15px 0 !important;
    }

    /* Сноска о ценах: сверху 8. */
    .pps-ab [data-role="item"] .pps-price-note {
        margin-top: 8px !important;
    }

    /* Кнопка «Сравнение» — 42x42, как в плитке каталога на МУ. */
    .pps-ab [data-role="item"] .widget-item-action-button {
        width: 42px !important;
        height: 42px !important;
    }

    /* От «Получить счет» до нижней границы карточки ровно 20px:
       собственные поля базы и блока покупки обнуляем. */
    .pps-ab [data-role="item"].widget-item .widget-item-base {
        padding-bottom: 0 !important;
    }

    .pps-ab [data-role="item"] .widget-item-advanced {
        padding-bottom: 20px !important;
    }

    .pps-ab [data-role="item"].widget-item .widget-item-wrapper {
        padding-bottom: 0 !important;
    }
}

/* ==================================================================
   ПРАВКИ ПМ, круг 3 (11.09.2026)
   ================================================================== */

/* --- «Популярные товары»: весь контент по левому краю колонки ------
   Блок решения шире остальных: его контентная обёртка 1230 (345..1575),
   тогда как колонка страницы 1200 (360..1560). Отсюда и «отступ 15px
   слева от таба», на который указал ПМ, — на самом деле влево уезжали
   заголовок и карточки, а табы стояли правильно. Двигаем обёртку. */
html.pps-ab .widget.c-widget.c-widget-products-4 .widget-wrapper-2 {
    margin-left: 35px;
    margin-right: 35px;
}

/* Табы больше не нужно сдвигать вручную — обёртка уже на месте. */
@media (min-width: 768px) {
    html.pps-ab .widget.c-widget.c-widget-products-4 .widget-tabs.intec-ui-control-tabs {
        margin-left: 0 !important;
    }
}

/* ПМ: у заголовков «Популярные товары» и «Благодарственные письма»
   убрать рамку из отступов по 8px. Поле гасим вместе с отрицательным
   полем сетки — иначе текст уехал бы влево на те же 8px. */
html.pps-ab .widget-header .widget-title-container {
    padding: 0 !important;
}

html.pps-ab .widget-header > .intec-grid {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* ПМ: названия характеристик — верхним регистром. */
.pps-ab .pps-prop-name {
    text-transform: uppercase;
}

/* ПМ: названия и цены в карточках — bold. */
.pps-ab [data-role="item"] .widget-item-name,
.pps-ab [data-role="item"] .widget-item-name a,
.pps-ab [data-role="item"] .widget-item-price-limited-width,
.pps-ab [data-role="item"] .widget-item-price-limited-width span {
    font-weight: 700 !important;
}

@media (max-width: 767px) {
    /* ПМ: вместо двух полей по 50px — одно в 60. */
    .pps-ab .pps-products-section {
        padding-top: 60px !important;
        padding-bottom: 60px !important;
    }

    html.pps-ab .widget.c-widget.c-widget-products-4 {
        padding-top: 0;
        padding-bottom: 0;
    }

    /* На МУ обёртка блока уже совпадает с колонкой — сдвиг не нужен. */
    html.pps-ab .widget.c-widget.c-widget-products-4 .widget-wrapper-2 {
        margin-left: 20px;
        margin-right: 20px;
    }

    /* ПМ: от табов до карточек 24 → 20. Это поле у .widget-tabs-content,
       а не у .widget-content: последнее задаёт зазор от заголовка до табов,
       и правка там укоротила бы шапку блока. */
    html.pps-ab .widget.c-widget.c-widget-products-4 .widget-tabs-content {
        margin-top: 20px !important;
    }

    html.pps-ab .widget.c-widget.c-widget-products-4 .widget-content {
        margin-top: 37px !important;
    }
}

/* Картинки слайдера карточки: у части товаров исходник вертикальный,
   и при height: 100% ширина оставалась «по пропорции» — 194 вместо 258,
   то есть по бокам оставалось белое. Правило решения для слайдера
   специфичнее нашего, поэтому здесь полная цепочка. */
html.pps-ab [data-role="item"].widget-item .widget-item-image-container img,
html.pps-ab [data-role="item"].widget-item .widget-item-image-element img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    object-position: center;
}

/* --- МУ: «Сравнение» и корзина одной строкой (см. ab-main.js) ------ */
@media (max-width: 767px) {
    .pps-ab [data-role="item"] .pps-mrow {
        display: flex;
        align-items: center;
        gap: 16px;
        margin-top: 12px;
    }

    /* Порядок в строке: сначала «Сравнение», затем корзина.
       У иконок с прежней раскладки остался order: 99 — сбрасываем. */
    .pps-ab [data-role="item"] .pps-mrow .widget-item-action-buttons {
        flex: 0 0 auto;
        order: 0 !important;
        margin: 0 !important;
    }

    .pps-ab [data-role="item"] .pps-mrow .widget-item-purchase-mobile {
        flex: 1 1 auto;
        order: 1;
        min-width: 0;
        margin: 0 !important;
        padding: 0 !important;
    }

    .pps-ab [data-role="item"] .pps-mrow .widget-item-purchase-buttons {
        min-width: 0;
    }

    /* Кнопка корзины: иконка вместо надписи, радиус 4.
       display задаём только кнопке «в корзину»: у «Добавлено» показом
       управляет решение по состоянию корзины, и общий flex вытаскивал
       её поверх «Получить счет». */
    .pps-ab [data-role="item"] .pps-mrow .widget-item-purchase-button {
        height: 42px;
        border-radius: 4px !important;
    }

    .pps-ab [data-role="item"] .pps-mrow .widget-item-purchase-button-add {
        display: flex !important;
        align-items: center;
        justify-content: center;
    }

    /* «Получить счет» помещается в одну строку при поле в 8px. */
    .pps-ab [data-role="item"] .pps-invoice {
        padding-left: 8px;
        padding-right: 8px;
        white-space: nowrap;
    }

    .pps-ab [data-role="item"] .pps-mrow .widget-item-purchase-button .intec-ui-part-content {
        display: none !important;
    }

    .pps-ab [data-role="item"] .pps-mrow .pps-cart-icon {
        display: block;
        width: 20px;
        height: 20px;
    }

    /* ПМ: «Получить счет» по границам контентной области карточки.
       Отрицательные поля нужны только десктопной панели ховера. */
    .pps-ab [data-role="item"] .widget-item-purchase-container {
        margin: 0 !important;
    }

    /* ПМ: от фото до дотсов 10px, от фото до названия 26px,
       и убрать лишние 5px под названием (зазор строки у inline-block). */
    .pps-ab [data-role="item"] .widget-item-image-container {
        margin-bottom: 0 !important;
    }

    .pps-ab [data-role="item"] .widget-item-image .owl-dots {
        margin-top: 10px;
    }

    .pps-ab [data-role="item"] .widget-item-name {
        margin-top: 26px !important;
        line-height: 0 !important;
    }

    .pps-ab [data-role="item"] .widget-item-name a {
        line-height: 20px !important;
    }
}

/* ПМ: на МУ под дотсами слайдера писем не должно оставаться 15px —
   это поле мы добавляли блоку, чтобы на ПК подпись не вылезала. */
@media (max-width: 767px) {
    html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-content {
        padding-bottom: 0;
    }

    .pps-ab .pps-owl-dots {
        margin-bottom: 0;
    }
}

/* --- «ПромПутьСнабжение»: отступы на МУ ---------------------------- */
@media (max-width: 767px) {
    /* ПМ: под фото 24 → 30, под заголовком 18 → 25.
       Отступ под фото задаёт зазор колонки, а не поле картинки —
       поле пришлось бы складывать с ним и вышло бы 60. */
    .pps-about .pps-about-inner {
        gap: 30px;
    }

    .pps-about .pps-about-title {
        margin-bottom: 25px;
    }
}

/* ==================================================================
   ПРАВКИ ПМ, круг 4 (11.09.2026) — пункты 40–54
   ================================================================== */

/* --- П40: МУ, строка табов от левой границы контентной области -----
   Решение выносит строку табов влево полем -10px, чтобы собственные
   поля табов не давали двойного отступа. Гасим только левое поле:
   правое отвечает за перенос строки. */
@media (max-width: 767px) {
    html.pps-ab .widget.c-widget.c-widget-products-4 .widget-tabs.intec-ui-control-tabs {
        margin-left: 0 !important;
    }
}

/* --- П41: внутренний круг «глаза» ---------------------------------
   Глиф нарисован обводкой, а заливка закрашивала зрачок сплошным
   серым. Белая заливка возвращает контурный вид; на ховере она
   совпадает с коричневой плашкой кнопки, и круг снова читается
   как контур. */
.pps-ab .widget-item-action-button svg,
.pps-ab .widget-item-action-button svg * {
    fill: #FFFFFF;
}

.pps-ab .widget-item-action-button:hover svg,
.pps-ab .widget-item-action-button:hover svg * {
    fill: #794425;
}

/* --- П42, П43: над фото не должно быть отступов --------------------
   10px давала база карточки, 21px — контейнер картинки. Маркеры и
   иконки лежат поверх фото абсолютно, сдвигать под них фото не нужно. */
.pps-ab [data-role="item"].widget-item .widget-item-base {
    margin-top: 0 !important;
}

.pps-ab [data-role="item"].widget-item .widget-item-image-container {
    margin-top: 0 !important;
}

/* --- П47: полоса прокрутки миниатюр «Наших работ» ------------------
   ПМ: убрать серую дорожку и стрелки по краям — остаётся только
   ползунок. Дорожку гасим в обеих записях (системной и webkit). */
.pps-works .pps-works-item-thumbs {
    scrollbar-color: #C2C2C2 transparent;
}

.pps-works .pps-works-item-thumbs::-webkit-scrollbar-track,
.pps-works .pps-works-item-thumbs::-webkit-scrollbar-track-piece {
    background: transparent;
}

.pps-works .pps-works-item-thumbs::-webkit-scrollbar-button {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    background: transparent !important;
}

@media (max-width: 767px) {
    /* --- П44: корзина — красная плашка с белой иконкой ------------- */
    .pps-ab [data-role="item"] .pps-mrow .widget-item-purchase-button {
        background: #BA1907 !important;
        border-color: #BA1907 !important;
    }

    .pps-ab [data-role="item"] .pps-mrow .widget-item-purchase-button .pps-cart-icon,
    .pps-ab [data-role="item"] .pps-mrow .widget-item-purchase-button .pps-cart-icon * {
        fill: #FFFFFF !important;
    }

    /* ПМ: по нажатию кнопка уходит в коричневый. */
    .pps-ab [data-role="item"] .pps-mrow .widget-item-purchase-button:active {
        background: #794425 !important;
        border-color: #794425 !important;
    }

    /* --- П45: радиус «Получить счет» ------------------------------- */
    .pps-ab [data-role="item"] .pps-invoice {
        border-radius: 4px !important;
    }

    /* --- П46: пустая полоса между сноской и кнопками ---------------
       Строка покупки решения на МУ пуста: счётчик и десктопный блок
       скрыты, а корзину мы перенесли в .pps-mrow — остаётся пустая
       полоса в 52px. Убираем её только у перебранных карточек
       (класс ставит ab-main.js), иначе на карточке, до которой скрипт
       не дошёл, спряталась бы сама корзина. */
    .pps-ab [data-role="item"].pps-card-ready .widget-item-purchase-container-wrapper {
        display: none !important;
    }
}

/* --- П49, П50: подпись под письмом — внутри коробки блока ----------
   Лента писем раздвинута полем -15px при внутреннем отступе 15px
   (так у решения не обрезается тень при наведении). Из-за нижнего
   отрицательного поля коробка блока заканчивалась на 15px выше, чем
   видимая подпись: на ПК отступ 100px до следующего блока начинался
   ещё под подписью, а на МУ дотсы вставали к ней вплотную. Гасим
   нижнее поле — горизонтальные не трогаем — и лишний отступ под
   лентой, который держал подпись раньше. */
html.pps-ab .widget.c-certificates.c-certificates-template-1 .owl-stage-outer {
    margin-bottom: 0;
}

/* Второе такое же поле — у сетки. Без него отрицательное поле
   схлопывается через .widget-content наружу и снова крадёт 15px. */
html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-items {
    margin-bottom: 0 !important;
}

html.pps-ab .widget.c-certificates.c-certificates-template-1 .widget-content {
    padding-bottom: 0;
}

/* ==================================================================
   ПРАВКИ ПМ, круг 5 (14.09.2026) — пункты 55–64
   ================================================================== */

/* --- П58: активное «Сравнение» держит коричневый вид ---------------
   Решение само подменяет кнопку: в списке сравнения показывается
   .widget-item-action-button-compared, повторный клик возвращает
   обычную. Состояние есть, вида не было — обе выглядели одинаково.
   Красим активную как ховер: коричневая плашка, белый глиф; заливка
   внутренних фигур совпадает с фоном, поэтому круг снова читается
   контуром. */
.pps-ab .widget-item-action-button-compared {
    background: #794425 !important;
    border-color: #794425 !important;
    color: #FFFFFF;
}

.pps-ab .widget-item-action-button-compared svg path {
    stroke: #FFFFFF;
}

.pps-ab .widget-item-action-button-compared svg,
.pps-ab .widget-item-action-button-compared svg * {
    fill: #794425;
}

/* --- П59: ползунок под миниатюрами рисуем сами ---------------------
   Системную полосу прячем целиком: скрыть у неё стрелки надёжно
   нельзя — Chrome на Windows рисует их по-своему, и ПМ видел их
   даже при display: none у ::-webkit-scrollbar-button. Разметку
   ползунка добавляет ab-main.js. */
.pps-works .pps-works-item-thumbs {
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding-bottom: 0;
}

.pps-works .pps-works-item-thumbs::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}

.pps-works .pps-thumbs-bar {
    position: relative;
    width: 490px;
    max-width: 100%;
    height: 4px;
    margin-top: 8px;
    cursor: pointer;
}

.pps-works .pps-thumbs-bar-thumb {
    position: absolute;
    top: 0;
    left: 0;
    height: 4px;
    border-radius: 2px;
    background: #C2C2C2;
}

/* --- П63: под карточкой сотрудника отступа нет --------------------- */
html.pps-ab .widget.c-staff.c-staff-template-1 .widget-element {
    padding-bottom: 0;
}

@media (max-width: 767px) {
    /* --- П56: кнопка «Добавлено» не показывается -------------------
       Решение держит её в разметке всегда; на узком экране она
       помещалась рядом с корзиной и налезала на «Получить счет». */
    .pps-ab [data-role="item"] .pps-mrow .widget-item-purchase-button-added {
        display: none !important;
    }

    /* --- П55: после нажатия у корзины остаётся коричневый контур ---
       Заливку не трогаем: на нажатии она и так уходит в #794425
       (п. 44), а признак добавления должен быть виден и после. */
    .pps-ab [data-role="item"] .pps-mrow .widget-item-purchase-button.pps-cart-added {
        border-color: #794425 !important;
    }
}

/* ==================================================================
   ПРАВКИ ПМ, круг 6 (15.09.2026) — пункты 65–68
   ================================================================== */

/* --- П67: за ползунок должно быть удобно взяться -------------------
   Сам ползунок 4px — пальцем в него не попасть. Полосу делаем выше,
   ползунок оставляем на прежнем месте, а область захвата расширяем
   невидимым слоем: события с него приходят самому ползунку.
   touch-action убирает перехват жеста браузером — иначе палец тянет
   страницу, а не ленту. */
.pps-works .pps-thumbs-bar {
    height: 16px;
    margin-top: 2px;
}

.pps-works .pps-thumbs-bar-thumb {
    top: 6px;
    touch-action: none;
}

.pps-works .pps-thumbs-bar-thumb::after {
    content: '';
    position: absolute;
    top: -6px;
    right: 0;
    bottom: -6px;
    left: 0;
}

/* --- П66: пустышка вместо отсутствующего блока ---------------------
   Разметку подставляет ab-main.js; поля пустышка берёт из правил
   своего же класса, содержимого у неё нет. */
.pps-ab .pps-stub {
    visibility: hidden;
}

@media (max-width: 767px) {
    /* --- П65: после нажатия у корзины коричневая заливка ----------- */
    .pps-ab [data-role="item"] .pps-mrow .widget-item-purchase-button.pps-cart-added {
        background: #794425 !important;
    }
}

/* ==================================================================
   ПРАВКИ ПМ (28.09.2026) — «Популярные товары»
   ================================================================== */

/* На ПК «Получить счет» видна только в панели ховера — от кнопки
   до края карточки 0 (решение давало панели 54px снизу).
   На МУ остаются 20px из правок выше. */
@media (min-width: 768px) {
    .pps-ab [data-role="item"] .widget-item-advanced {
        padding-bottom: 0 !important;
    }
}