/* Start:/bitrix/templates/ik555.base/components/bitrix/search.title/visual/style.css?17906035374117*/

.bx-searchtitle .bx-block-title {
	font-family: "Open Sans", Arial, "Helvetica Neue", Helvetica, sans-serif;
	color: #343434;
	text-transform: uppercase;
	font-size: 12px;
	margin-bottom: 9px;
	font-weight: 600;
}
.bx-searchtitle .bx-input-group {
	position: relative;
	display: table;
	border-collapse: separate;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.bx-searchtitle .bx-input-group {}
.bx-searchtitle .bx-input-group .bx-form-control {
	display: table-cell;
	position: relative;
	z-index: 2;
	float: left;
	width: 100%;
	margin-bottom: 0;
	display: block;
	width: 100%;
	height: 34px;
	padding: 6px 12px;
	font-size: 14px;
	line-height: 1.42857143;
	color: #555;
	background-color: #f8fafc;
	border: 1px solid #d5dadc;
	border-right: none;
	border-radius: 2px 0 0 2px;
	outline: none;
	box-shadow: none !important;
	-webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
	transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
.bx-ios .bx-searchtitle .bx-input-group .bx-form-control {
	/* Fix of input shadow for IOS browsers. */
	background-image: -webkit-linear-gradient(#f8fafc 0%, #f8fafc 100%);
	background-image: linear-gradient(#f8fafc 0%, #f8fafc 100%);
}
.bx-searchtitle .bx-input-group-btn {
	position: relative;
	font-size: 0;
	width: 1%;
	white-space: nowrap;
	vertical-align: middle;
	display: table-cell;
}
.bx-searchtitle .bx-input-group-btn button {
	position: relative;
	border: none;
	background: #95a1a8;
	display: inline-block;
	margin-bottom: 0;
	cursor: pointer;
	padding:6px 12px;
	border-radius: 0 2px 2px 0;
	color: #fff;
	font-size: 16px;
	line-height: 1.42857143;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	-o-transition: all .3s ease;
	transition: all .3s ease;
}
.bx-searchtitle .bx-input-group-btn button:hover {
	background: #1484CE;
}


div.title-search-result {
	border:1px solid #c6c6c6;
	display:none;
	overflow:hidden;
	z-index:1999;
	min-width: 370px;
	margin-top:-3px;
	background-color: #FFF;
}

div.title-search-fader {
	display:none;
	background-image: url('/bitrix/templates/ik555.base/components/bitrix/search.title/visual/images/fader.png');
	background-position: right top;
	background-repeat: repeat-y;
	position:absolute;
}

p.title-search-preview {
	font-size:12px;
}
div.title-search-result td.title-search-price span {
	font-size: 26px;
}

/*========================*/
.bx_searche{}
.bx_searche .bx_img_element{
	background: #fafafa;
	float: left;
	width: 67px;
	padding: 5px 10px;
	position: absolute;
	top: 0;
	bottom: 0;
}
.bx_searche .bx_item_block{
	min-height: 65px;
	position: relative
}
.bx_searche .bx_image{
	width: 45px;
	height: 45px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	border: 1px solid #e8e8e8;
}
.bx_searche .bx_item_element{
	/*float: left;*/
	padding-left: 10px;
	margin-left: 70px;
}
.bx_searche .bx_item_element hr{
	margin: 0;
	border: none;
	border-bottom: 1px solid #e5e5e5;
}
.bx_searche .bx_item_element a{
	margin-top: 8px;
	display: inline-block;
	color: #000;
	font-size: 13px;
	text-decoration: none;
	line-height: 1.3;
	padding-right: 10px;
}
.bx_searche .bx_item_element a b{color: #ee1d23;font-weight: normal;}
.bx_searche .bx_item_element a:hover,
.bx_searche .bx_item_element a:hover b{text-decoration: underline;}
.bx_searche .bx_price{
	font-weight:bold;
	font-size:13px;
}
.bx_searche .bx_price .old{
	font-weight:normal;
	text-decoration: line-through;
	color: #636363
}
.bx_item_block.all_result{min-height:0}
.bx_item_block.others_result{
	min-height: 0;
	margin-bottom: 6px;
	line-height: 1;
}
.bx_item_block.all_result .all_result_title{
	display: block;
	font-size: 12px;
	color: #a7a7a7;
	padding-top: 15px;
	padding-bottom: 10px;
}
.bx_item_block.all_result .all_result_title a{
	color: #a7a7a7
}
.bx_item_block.all_result .all_result_title a:hover{
	color: #4788cb
}
.bx_item_block.all_result a{
	margin-top: 0;
	color: #000;
}
.bx_item_block.all_result a:hover{
	color: #ee1d23;
}

/* End */


/* Start:/bitrix/templates/ik555.base/components/bitrix/news.detail/catalog-type.type/style.css?1759181772550*/
table.examples-cat__line {display: table;width: 100%;}
.staty_block{
    padding: 15px 0;
}
.staty {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    padding: 20px 0;
}
.staty .item {
    width: calc(50% - 15px);
    display: flex;
    gap: 10px;
    align-items: flex-start;
}
.staty .item a.img{
    flex:none;
}
.staty .item a:not(.img){
    color: #ee1d23;
    text-decoration: underline;
    transition: 0.8s;
}
.staty .item a:hover{
    text-decoration: none;
}
@media (max-width:991px){
    .staty .item {
        width:100%;
    }
}
/* End */


/* Start:/bitrix/templates/ik555.base/css/redesign.page.css?178841866959942*/
/* ==========================================================================
   Редизайн 2026 — часть страницы «Ремонт оборудования по типу».

   Подключается из шаблона компонента
   components/bitrix/news.detail/catalog-type.type/template.php,
   то есть только на страницах, где эта секция реально выводится.
   Токены, типографика и кнопки — в redesign.base.css, он грузится всегда.
   ========================================================================== */
/* --------------------------------------------------------------------------
   Секция «Гарантии и юридическая ответственность»
   Разметка: include/guarantees.php
   -------------------------------------------------------------------------- */

.rd-guarantee {
    background: var(--rd-surface);
}

.rd-guarantee__lead {
    max-width: 700px;
    margin-top: 17px;
}

.rd-guarantee__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
    margin-top: 40px;
}

/* Карточка: цветная полоса сверху, дальше иконка, заголовок, описание.
   Полоса чередуется тёмная / красная — акцент задаётся модификатором. */
.rd-guarantee__card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 25px 20px 33px;
    border-top: 5px solid var(--rd-ink);
    background: var(--rd-white);
}

.rd-guarantee__card--accent {
    border-top-color: var(--rd-red);
}

.rd-guarantee__icon {
    width: 48px;
    height: 48px;
    border-radius: 4px;
    background: var(--rd-tile);
    color: var(--rd-ink);
}

.rd-guarantee__card--accent .rd-guarantee__icon {
    background: var(--rd-tile-accent);
    color: var(--rd-red);
}

.rd-guarantee__icon svg {
    display: block;
    width: 48px;
    height: 48px;
}

.rd-guarantee__title {
    margin: 34px 0 0;
    color: var(--rd-heading);
    font-family: var(--rd-font-medium);
    font-size: 18px;
    font-weight: 500;
    line-height: 22px;
}

.rd-guarantee__text {
    margin: 9px 0 0;
    color: var(--rd-text);
    font-family: var(--rd-font);
    font-size: 14px;
    font-weight: 400;
    line-height: 17px;
}
@media (max-width: 1199px) {
    .rd-guarantee__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }}

/* --- Мобильные: карточки в слайдер с точками, как в макете --- */
@media (max-width: 767px) {
    .rd-guarantee {
        padding: var(--rd-section-y-mob) 0;
    }

    .rd-guarantee__grid {
        display: block;
    }}

/* --------------------------------------------------------------------------
   Секция «Часто задаваемые вопросы»
   Разметка: blocks/faq.php, данные — свойство FAQ элемента инфоблока
   -------------------------------------------------------------------------- */

.rd-faq {
    background: var(--rd-white);
}

/* Шапка в две колонки: слева надзаголовок и H2, справа пояснение */
.rd-faq__head {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 40px;
    align-items: start;
}

.rd-faq__note {
    margin: 0;
    padding-top: 9px;
    color: var(--rd-text);
    font-family: var(--rd-font);
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
}

.rd-faq__list {
    margin-top: 40px;
}

.rd-faq__item + .rd-faq__item {
    margin-top: 20px;
}

/* Вопрос — кнопка на всю ширину плашки */
.rd-faq__q {
    display: flex;
    align-items: center;
    gap: 26px;
    width: 100%;
    min-height: 63px;
    margin: 0;
    padding: 20px 22px;
    border: 0;
    background: var(--rd-surface);
    color: var(--rd-heading);
    font-family: var(--rd-font-medium);
    font-size: 16px;
    font-weight: 500;
    line-height: 22px;
    text-align: left;
    cursor: pointer;
    transition: background-color .15s ease, color .15s ease;
}

.rd-faq__icon {
    flex: 0 0 auto;
    width: 14px;
    height: 14px;
    fill: #999999;
    transition: fill .15s ease;
}

/* Раскрытый вопрос: подложка темнее, текст и знак — красные */
.rd-faq__item.is-open .rd-faq__q {
    background: var(--rd-surface-active);
    color: var(--rd-red);
}

.rd-faq__item.is-open .rd-faq__icon {
    fill: var(--rd-red);
}

.rd-faq__a {
    display: none;
    padding: 18px 22px 15px;
    background: var(--rd-surface);
    color: var(--rd-text);
    font-family: var(--rd-font);
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
}

.rd-faq__item.is-open .rd-faq__a {
    display: block;
}

.rd-faq__a p {
    margin: 0;
    font-size: inherit;
    line-height: inherit;
}
@media (max-width: 991px) {
    .rd-faq__head {
        display: block;
    }

    .rd-faq__note {
        margin-top: 20px;
        padding-top: 0;
    }}
@media (max-width: 767px) {
    .rd-faq {
        padding: var(--rd-section-y-mob) 0;
    }

    .rd-faq__q {
        gap: 18px;
        padding: 16px;
    }

    .rd-faq__a {
        padding: 16px;
    }}

/* --------------------------------------------------------------------------
   Текстовая секция.
   Разметка: blocks/content.php, содержимое — «Подробное описание» элемента,
   то есть обычный HTML из визуального редактора. Поэтому стилизуем не классы,
   а сами теги: что бы контент-менеджер ни вставил, оно выглядит как в макете.
   -------------------------------------------------------------------------- */

.rd-content {
    background: var(--rd-surface);
}

.rd-content__body {
    color: var(--rd-text);
    font-family: var(--rd-font);
    font-size: 16px;
    line-height: 19px;
}

.rd-content__body > *:first-child {
    margin-top: 0;
}

.rd-content__body h2 {
    margin: 48px 0 35px;
    color: var(--rd-heading);
    font-family: var(--rd-font-medium);
    font-size: 30px;
    font-weight: 500;
    line-height: 1.25;
}

.rd-content__body h3 {
    margin: 36px 0 35px;
    color: var(--rd-heading);
    font-family: var(--rd-font-medium);
    font-size: 24px;
    font-weight: 500;
    line-height: 1.25;
}

.rd-content__body h4 {
    margin: 30px 0 20px;
    color: var(--rd-heading);
    font-family: var(--rd-font-medium);
    font-size: 18px;
    font-weight: 500;
    line-height: 1.3;
}

.rd-content__body p {
    margin: 0 0 15px;
    font-size: 16px;
    line-height: 19px;
}

.rd-content__body ol,
.rd-content__body ul {
    margin: 0 0 15px;
    padding-left: 22px;
}

.rd-content__body li {
    margin: 0 0 5px;
    font-size: 16px;
    line-height: 19px;
}

.rd-content__body a {
    color: var(--rd-red);
}

/* Таблицы. Шапка тёмная, строки через одну, разделители тонкие. */
.rd-content__body table {
    width: 100%;
    margin: 0 0 15px;
    border-collapse: collapse;
    font-size: 14px;
    line-height: 20px;
}

.rd-content__body thead th,
.rd-content__body tr:first-child th {
    padding: 15px 25px;
    background: var(--rd-ink);
    color: var(--rd-white);
    font-family: var(--rd-font-medium);
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.04em;
    text-align: left;
    text-transform: uppercase;
}

.rd-content__body td {
    padding: 14px 25px;
    border-bottom: 1px solid var(--rd-border);
    background: var(--rd-white);
    color: var(--rd-heading);
    vertical-align: top;
}

.rd-content__body tbody tr:nth-child(even) td {
    background: var(--rd-surface);
}

.rd-content__body td:first-child {
    width: 42.5%;
}

/* Обёртка для горизонтальной прокрутки — вешает js/redesign.js,
   иначе широкая таблица из редактора рвёт вёрстку на телефоне. */
.rd-table-scroll {
    margin: 0 0 15px;
    overflow-x: auto;
}

.rd-table-scroll table {
    margin: 0;
    min-width: 560px;
}
@media (max-width: 767px) {
    .rd-content {
        padding: var(--rd-section-y-mob) 0;
    }

    .rd-content__body h2 { font-size: 26px; }
    .rd-content__body h3 { font-size: 20px; }

    .rd-content__body thead th,
    .rd-content__body td {
        padding: 12px 16px;
    }}

/* --------------------------------------------------------------------------
   Секция «Ремонт оборудования в отраслях»
   Разметка: blocks/industries.php
   Данные: свойство APPLICATION элемента (значение — текст, описание — код иконки)
   -------------------------------------------------------------------------- */

.rd-industries {
    background: var(--rd-white);
}

.rd-industries__lead {
    max-width: 700px;
    margin-top: 24px;
}

.rd-industries__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 21px 20px;
    margin-top: 47px;
}

.rd-industries__item {
    display: flex;
    align-items: center;
    gap: 20px;
    min-height: 90px;
    padding: 16px 20px;
    background: var(--rd-surface);
}

.rd-industries__icon {
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    border-radius: 4px;
    background: #E0E5EA;
    color: var(--rd-heading);
}

.rd-industries__icon svg {
    display: block;
    width: 36px;
    height: 36px;
}

.rd-industries__text {
    margin: 0;
    color: var(--rd-heading);
    font-family: var(--rd-font-medium);
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
}
@media (max-width: 1199px) {
    .rd-industries__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }}
@media (max-width: 991px) {
    .rd-industries__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }}
@media (max-width: 767px) {
    .rd-industries {
        padding: var(--rd-section-y-mob) 0;
    }

    .rd-industries__grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
        margin-top: 24px;
    }}

/* --------------------------------------------------------------------------
   Секция «Что входит в ремонт»
   Разметка: blocks/included.php
   Данные: свойство INCLUDED элемента (множественная строка)
   -------------------------------------------------------------------------- */

.rd-included {
    padding: var(--rd-section-y) 0;
}

.rd-included::before,
.rd-included::after {
    content: "";
    position: absolute;
    top: 0;
    width: 960px;
    height: 476px;
    background-repeat: no-repeat;
    pointer-events: none;
}

.rd-included::before {
    left: 0;
    background-image: url(/bitrix/templates/ik555.base/css/../img/decor/included-dots-left.svg);
    background-position: top left;
}

.rd-included::after {
    right: 0;
    background-image: url(/bitrix/templates/ik555.base/css/../img/decor/included-dots-right.svg);
    background-position: top right;
}

.rd-included > .container {
    position: relative;
    z-index: 1;
}

.rd-included__lead {
    max-width: 1150px;
    margin-top: 25px;
}

.rd-included__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 21px 20px;
    margin-top: 47px;
}

.rd-included__item {
    display: flex;
    align-items: center;
    gap: 21px;
    min-height: 78px;
    padding: 12px 30px;
    border: 1px solid #2B384C;
    background: #0F172A;
}

.rd-included__check {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    background: var(--rd-red);
    color: var(--rd-white);
}

.rd-included__check svg {
    width: 14px;
    height: 14px;
    fill: currentColor;
}

.rd-included__text {
    margin: 0;
    color: var(--rd-white);
    font-family: var(--rd-font);
    font-size: 16px;
    font-weight: 400;
    line-height: 18px;
}
@media (max-width: 991px) {
    .rd-included__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }}
@media (max-width: 767px) {
    .rd-included {
        padding: var(--rd-section-y-mob) 0;
    }

    .rd-included__grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
        margin-top: 24px;
    }

    .rd-included::before { display: none; }}

/* --------------------------------------------------------------------------
   Секция «Ремонтируем ... всех ведущих производителей»
   Разметка: blocks/brands.php
   Данные: свойство MANUFACTURERS элемента (элементы инфоблока 4)
   -------------------------------------------------------------------------- */

.rd-brands {
    background: var(--rd-white);
}

.rd-brands__head {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 40px;
    align-items: start;
}

.rd-brands__note {
    margin: 0;
    padding-top: 9px;
    color: var(--rd-text);
    font-family: var(--rd-font);
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
}

.rd-brands__grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 21px 20px;
    margin-top: 40px;
}

/* Ячейка сетки. Плитка тянется на всю её высоту, а на телефоне ячейка
   становится слайдом — отступ у слайда даёт зазор между плитками. */
.rd-brands__cell {
    display: flex;
    min-width: 0;
}

.rd-brands__item {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    height: 140px;
    padding: 16px 12px;
    border: 1px solid var(--rd-border);
    background: var(--rd-white);
    text-decoration: none;
    transition: border-color .15s ease;
}

.rd-brands__item:hover {
    border-color: var(--rd-red);
    text-decoration: none;
}

.rd-brands__logo {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 0;
}

.rd-brands__logo img {
    max-width: 100%;
    max-height: 62px;
    object-fit: contain;
}

/* Подпись под логотипом — замечание оптимизатора №6.2 */
.rd-brands__name {
    margin: 0;
    color: var(--rd-text);
    font-family: var(--rd-font);
    font-size: 13px;
    font-weight: 400;
    line-height: 16px;
    text-align: center;
    transition: color .15s ease;
}

.rd-brands__item:hover .rd-brands__name {
    color: var(--rd-red);
}

/* Последняя плитка — переход ко всем производителям */
.rd-brands__more {
    gap: 10px;
    border-color: var(--rd-red);
    color: var(--rd-red);
    font-family: var(--rd-font);
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0.04em;
    text-align: center;
    text-transform: uppercase;
}

.rd-brands__more svg {
    width: 13px;   /* пропорции символа rd-arrow: 13x11 */
    height: 11px;
    fill: currentColor;
}

.rd-brands__more:hover {
    background: var(--rd-red);
    color: var(--rd-white);
}
@media (max-width: 1199px) {
    .rd-brands__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }}
@media (max-width: 991px) {
    .rd-brands__head { display: block; }
    .rd-brands__note { margin-top: 20px; padding-top: 0; }
    .rd-brands__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }}
@media (max-width: 767px) {
    .rd-brands {
        padding: var(--rd-section-y-mob) 0;
    }

    /* Зазор между плитками — отступом слайда. Отрицательное поле у списка
       делать нельзя: он станет шире экрана. */
    .rd-brands__grid .slick-slide {
        padding: 0 6px;
    }

    /* Крайние плитки не должны отступать от края секции сильнее остальных. */
    .rd-brands__grid .slick-list {
        margin: 0 -6px;
        padding: 0 6px;
    }

    .rd-brands__grid {
        display: block;
        margin-top: 24px;
    }

    /* Класс сетки в селекторе перебивает slick-овское
       .slick-slide { height: auto } — плитка здесь сама является слайдом. */
    .rd-brands__item {
        height: 175px;
        gap: 18px;
        padding: 20px 14px;
    }

    .rd-brands__logo img {
        max-height: 78px;
    }}

/* --------------------------------------------------------------------------
   Секция «Примеры ремонта ...» (короткие карточки под заголовком страницы)
   Разметка: blocks/examples-type.php
   Данные: свойство CALLBACK элемента (элементы инфоблока 8)
   -------------------------------------------------------------------------- */

.rd-extype {
    background: var(--rd-white);
}

.rd-extype__head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 252px;
    column-gap: 40px;
    align-items: start;
}

.rd-extype__actions {
    display: grid;
    gap: 12px;
}

.rd-extype__actions .rd-btn {
    justify-content: center;
    width: 100%;
}

.rd-extype__lead {
    max-width: 700px;
    margin-top: 24px;
}

.rd-extype__lead a {
    color: var(--rd-red);
    text-decoration: none;
}

.rd-extype__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 21px 20px;
    margin-top: 47px;
}

.rd-extype__item {
    display: flex;
    align-items: stretch;
    min-height: 86px;
    background: var(--rd-surface);
    text-decoration: none;
}

.rd-extype__img {
    flex: 0 0 116px;
    width: 116px;
}

.rd-extype__img img {
    display: block;
    width: 116px;
    height: 100%;
    object-fit: cover;
}

.rd-extype__body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    justify-content: space-between;
    min-width: 0;
    padding: 16px 21px 16px 20px;
}

.rd-extype__name {
    margin: 0;
    color: var(--rd-heading);
    font-family: var(--rd-font-medium);
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
}

.rd-extype__meta {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin-top: 10px;
    color: var(--rd-text);
    font-family: var(--rd-font);
    font-size: 14px;
    line-height: 17px;
}

.rd-extype__item:hover .rd-extype__name {
    color: var(--rd-red);
}
@media (max-width: 991px) {
    .rd-extype__head { display: block; }
    .rd-extype__actions { margin-top: 20px; }
    .rd-extype__grid { grid-template-columns: minmax(0, 1fr); }}
@media (max-width: 767px) {
    .rd-extype {
        padding: var(--rd-section-y-mob) 0;
    }

    .rd-extype__grid { gap: 12px; margin-top: 24px; }
    .rd-extype__meta { flex-direction: column; gap: 2px; }}

/* --------------------------------------------------------------------------
   Секция «Стоимость ремонта»
   Разметка: blocks/prices.php
   Данные: свойство PRICES элемента (значение — наименование, описание — цена)
   -------------------------------------------------------------------------- */

.rd-prices {
    background: var(--rd-white);
}

.rd-prices__head {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 40px;
    align-items: start;
}

.rd-prices__note-top {
    margin: 0;
    padding-top: 27px;
    color: var(--rd-text);
    font-family: var(--rd-font);
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
}

/* Внутри лежит таблица из визуального редактора — оформляем что придёт.
   Обёртка нужна, чтобы широкая таблица прокручивалась на телефоне. */
.rd-prices__table {
    margin-top: 47px;
    overflow-x: auto;
}

.rd-prices__table table {
    width: 100%;
    border-collapse: collapse;
}

/* Верхний отступ на 2px больше нижнего — поправка на метрики PF Din: у
   шрифта большой нижний вынос, из-за него прописные в шапке вставали выше
   оптического центра. Та же поправка, что у подписи «Смотреть скан». */
.rd-prices__table th {
    padding: 17px 25px 13px;
    background: var(--rd-ink);
    color: var(--rd-white);
    font-family: var(--rd-font-medium);
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.04em;
    text-align: left;
    text-transform: uppercase;
}

.rd-prices__table th:last-child,
.rd-prices__table td:last-child {
    text-align: right;
}

.rd-prices__table td {
    padding: 16px 25px;
    border-bottom: 1px solid var(--rd-border);
    color: var(--rd-heading);
    font-family: var(--rd-font);
    font-size: 16px;
    line-height: 19px;
}

.rd-prices__table tbody tr:nth-child(even) td {
    background: var(--rd-surface);
}

.rd-prices__table td:last-child {
    color: var(--rd-red);
    font-family: var(--rd-font-medium);
    font-weight: 500;
    white-space: nowrap;
}

.rd-prices__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-top: 55px;
}

.rd-prices__note {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin: 0;
    color: var(--rd-muted);
    font-family: var(--rd-font);
    font-size: 14px;
    line-height: 17px;
}

.rd-prices__note svg {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    margin-top: 1px;
    fill: var(--rd-muted);
}
@media (max-width: 991px) {
    .rd-prices__head { display: block; }
    .rd-prices__note-top { margin-top: 20px; padding-top: 0; }}
@media (max-width: 767px) {
    .rd-prices {
        padding: var(--rd-section-y-mob) 0;
    }

    .rd-prices__table { margin-top: 24px; }

    .rd-prices__table th,
    .rd-prices__table td { padding: 12px 16px; font-size: 14px; }
    .rd-prices__table th { padding: 14px 16px 10px; }

    .rd-prices__foot {
        flex-direction: column;
        align-items: stretch;
        margin-top: 24px;
    }

    .rd-prices__foot .rd-btn {
        justify-content: center;
        width: 100%;
    }}

/* --------------------------------------------------------------------------
   Секция «Как мы ремонтируем: 4 шага»
   Разметка: include/steps.php (включаемая область, правится в админке)
   -------------------------------------------------------------------------- */

.rd-steps {
    background: var(--rd-white);
}

.rd-steps__head {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 40px;
    align-items: start;
}

.rd-steps__note {
    margin: 0;
    padding-top: 9px;
    color: var(--rd-text);
    font-family: var(--rd-font);
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
}

.rd-steps__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
    margin-top: 47px;
}

.rd-step {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 25px 21px 30px;
    border-top: 5px solid var(--rd-ink);
    background: var(--rd-surface);
}

/* Нечётные шаги красные — как в макете */
.rd-step--accent {
    border-top-color: var(--rd-red);
}

.rd-step__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.rd-step__num {
    margin: 0;
    color: var(--rd-heading);
    font-family: var(--rd-font-medium);
    font-size: 34px;
    font-weight: 500;
    line-height: 1;
}

.rd-step--accent .rd-step__num {
    color: var(--rd-red);
}

.rd-step__icon {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    border-radius: 4px;
    background: var(--rd-tile);
    color: var(--rd-heading);
}

.rd-step--accent .rd-step__icon {
    background: var(--rd-tile-accent);
    color: var(--rd-red);
}

.rd-step__icon svg {
    display: block;
    width: 40px;
    height: 40px;
}

.rd-step__title {
    margin: 45px 0 0;
    color: var(--rd-heading);
    font-family: var(--rd-font-medium);
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
}

.rd-step__text {
    margin: 12px 0 0;
    color: var(--rd-text);
    font-family: var(--rd-font);
    font-size: 14px;
    font-weight: 400;
    line-height: 17px;
}

.rd-step__note {
    margin: 30px 0 0;
    padding-top: 30px;
    border-top: 1px solid #E0E6EF;
    color: var(--rd-heading);
    font-family: var(--rd-font);
    font-size: 14px;
    font-weight: 400;
    line-height: 17px;
}

/* Акцентная подпись — в макете у части шагов она красная */
.rd-step__note--accent {
    color: var(--rd-red);
}

.rd-step__spacer {
    flex: 1 1 auto;
}
@media (max-width: 1199px) {
    .rd-steps__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }}
@media (max-width: 991px) {
    .rd-steps__head { display: block; }
    .rd-steps__note { margin-top: 20px; padding-top: 0; }}
@media (max-width: 767px) {
    .rd-steps {
        padding: var(--rd-section-y-mob) 0;
    }

    /* Слайдер раскладывает слайды сам, поэтому сетку на телефоне снимаем. */
    .rd-steps__grid {
        display: block;
        margin-top: 24px;
    }

    /* Slick ставит слайдам display: block правилом специфичнее нашего —
       возвращаем колоночный флекс классом контейнера в цепочке. */
    .rd-steps__grid .rd-step.slick-slide {
        display: flex;
    }

    /* Страховка от съехавшего трека: слайд не должен вылезать за экран. */
    .rd-steps__grid .slick-list {
        overflow: hidden;
    }

    /* На десктопе карточка высокая и заголовок стоит заметно ниже номера;
       в мобильном макете этот отбив меньше. */
    .rd-step__title {
        margin-top: 16px;
    }

    /* В ряду карточки выравниваются по высоте, и распорка прижимает подпись
       к низу. В слайдере карточка одна, растягивать её нечем — распорка
       только раздувает пустоту вокруг разделителя. */
    .rd-step__spacer {
        display: none;
    }

    .rd-step__note {
        margin-top: 16px;
        padding-top: 16px;
    }}

/* --------------------------------------------------------------------------
   Hero — первый экран страницы
   Разметка: blocks/hero.php
   -------------------------------------------------------------------------- */

/* H1 шапка выводит до компонента, из разметки его не убрать. В макете он
   внутри первого экрана. Файл грузится только на новых страницах. */
.page-title {
    display: none;
}

/* В макете крошки — часть первого экрана: красим в его фон и убираем
   разрыв. На других страницах файл не подключается. */
.breadcrumbs {
    padding: 24px 0 0;
    background: var(--rd-surface);
}

.breadcrumbs ul li,
.breadcrumbs ul li a {
    color: var(--rd-muted);
    font-family: var(--rd-font);
    font-size: 13px;
    line-height: 17px;
}

.rd-hero {
    position: relative;
    padding: 56px 0 80px;   /* сверху меньше: свой отступ уже дали крошки */
    background: var(--rd-surface);
    overflow: hidden;
}

/* Точечный узор справа — вырезан из макета */
.rd-hero::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 770px;
    height: 711px;
    background: url(/bitrix/templates/ik555.base/css/../img/decor/hero-dots.svg) no-repeat top right;
    pointer-events: none;
}

.rd-hero > .container {
    position: relative;
    z-index: 1;
}

.rd-hero__title {
    max-width: 900px;
    margin: 0;
    color: var(--rd-heading);
    font-family: var(--rd-font-medium);
    font-size: 46px;
    font-weight: 500;
    line-height: 57px;
}

.rd-hero__lead {
    max-width: 900px;
    margin: 38px 0 0;
    color: var(--rd-text);
    font-family: var(--rd-font);
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
}

.rd-hero__grid {
    display: grid;
    grid-template-columns: repeat(4, 208px);
    gap: 20px;
    margin-top: 46px;
}

.rd-hero__card {
    display: flex;
    flex-direction: column;
    min-height: 192px;
    padding: 25px 20px;
    border: 1px solid var(--rd-border);
    background: var(--rd-white);
}

.rd-hero__icon {
    width: 28px;
    height: 28px;
    color: var(--rd-red);
}

.rd-hero__icon svg {
    display: block;
    width: 28px;
    height: 28px;
}

.rd-hero__card-title {
    margin: 15px 0 0;
    color: var(--rd-heading);
    font-family: var(--rd-font-medium);
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
}

.rd-hero__card-text {
    margin: 12px 0 0;
    color: var(--rd-text);
    font-family: var(--rd-font);
    font-size: 14px;
    font-weight: 400;
    line-height: 17px;
}

.rd-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 46px;
}

.rd-hero__actions .rd-btn {
    justify-content: center;
    flex-direction: column;
    gap: 2px;
    min-width: 437px;
    min-height: 57px;
    padding: 10px 24px;
}

.rd-hero__actions .rd-btn > span:first-of-type {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Кнопка hero двухстрочная, поэтому иконка лежит внутри того же span,
   что и текст, и уехала вместе с ним — возвращаем её на место.
   Подпись второй строки не двигаем вовсе. */
.rd-hero__actions .rd-btn__icon {
    position: relative;
    top: -1px;
}

.rd-hero__hint {
    top: 0;
}

/* Вторая строка кнопки в макете серая, а не красная: цвет от контурной
   кнопки не наследуем. На ховере она заливается красным, поэтому там
   подпись становится белой вместе с основным текстом. */
.rd-hero__hint {
    color: var(--rd-muted);
    font-family: var(--rd-font);
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
}

.rd-hero__actions .rd-btn:hover .rd-hero__hint,
.rd-hero__actions .rd-btn:focus-visible .rd-hero__hint {
    color: var(--rd-white);
}
@media (max-width: 1199px) {
    .rd-hero__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .rd-hero__actions .rd-btn { min-width: 0; flex: 1 1 260px; }
    .rd-hero::after { opacity: .5; }}
@media (max-width: 767px) {
    .rd-hero {
        padding: 24px 0 var(--rd-section-y-mob);
    }

    .rd-hero::after { display: none; }

    .rd-hero__title { font-size: 32px; line-height: 38px; }
    .rd-hero__lead { margin-top: 20px; }

    .rd-hero__grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
        margin-top: 24px;
    }

    .rd-hero__card { min-height: 0; }
    .rd-hero__card-title { margin-top: 20px; }

    .rd-hero__actions {
        gap: 12px;
        margin-top: 24px;
    }

    .rd-hero__actions .rd-btn { width: 100%; flex: 1 1 100%; }}

/* --------------------------------------------------------------------------
   Секция «Заявка на ремонт» + «Схема взаимодействия»
   Разметка: blocks/request.php
   -------------------------------------------------------------------------- */

.rd-request {
    background: var(--rd-white);
}

.rd-request__note {
    margin: 25px 0 0;
    color: var(--rd-text);
    font-family: var(--rd-font);
    font-size: 16px;
    line-height: 20px;
}

.rd-request__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 624px;
    column-gap: 48px;
    align-items: start;
    margin-top: 40px;
}

/* --- Форма --- */

/* Внутри лежит форма Bitrix24 (см. blocks/request.php). Разметку она приносит
   свою — правится только в настройках формы, — а оформление приводим к макету
   здесь.

   Два уровня. Цвета и шрифт задаём переменными --b24-*: форма themable, это
   её штатный способ, и он переживёт обновление их стилей. Геометрию (скругления,
   высоты, положение подписей) приходится перебивать селекторами — стили B24
   грузятся скриптом уже после нашего CSS, поэтому при равной специфичности
   выигрывают они, и нужен лишний класс в цепочке.

   Всё обязательно от .rd-request__form: та же форма живёт в попапе из шапки
   и подвала, его оформление трогать нельзя. */
.rd-request__form {
    min-width: 0;
    padding: 30px;
    background: var(--rd-surface);
}

/* B24 объявляет свои переменные прямо на .b24-form, поэтому задавать их
   на родителе бесполезно — перебиваются. Объявляем на том же элементе. */
.rd-request__form .b24-form {
    --b24-font-family:                  var(--rd-font);
    --b24-text-color:                   var(--rd-heading);
    --b24-primary-color:                var(--rd-red);
    --b24-primary-hover-color:          var(--rd-red-hover);
    --b24-primary-text-color:           var(--rd-white);
    --b24-background-color:             var(--rd-surface);
    --b24-field-background-color:       var(--rd-white);
    --b24-field-focus-background-color: var(--rd-white);
    --b24-field-border-color:           var(--rd-border);
}

/* Свой заголовок у секции уже есть, второй не нужен. */
.rd-request__form .b24-form-header {
    display: none;
}

.rd-request__form .b24-form-wrapper,
.rd-request__form .b24-form-content {
    padding: 0;
    background: transparent;
    box-shadow: none;
}

/* Имя и телефон в одну строку, остальное во всю ширину — как в макете. */
.rd-request__form .b24-form-content form > div:first-child {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 20px;
}

.rd-request__form .b24-form-field-string,
.rd-request__form .b24-form-field-file,
.rd-request__form .b24-form-field-layout {
    grid-column: 1 / -1;
}

/* --- Поля ------------------------------------------------------------- */

/* Отступ между полями задаём в одном месте. У B24 их два — своя отбивка
   поля (15px) и отступ контейнера, — и они складывались. */
.rd-request__form .b24-form-field {
    margin-bottom: 20px;
}

.rd-request__form .b24-form-control-container {
    margin-bottom: 0;
}

/* Запас под подпись нужен только там, где она плавает внутри поля.
   У блока загрузки подпись обычная, и этот запас давал лишнюю дыру. */
.rd-request__form .b24-form-control-string .b24-form-control-container,
.rd-request__form .b24-form-control-text .b24-form-control-container {
    padding-top: 24px;
}

.rd-request__form .b24-form-control-string .b24-form-control,
.rd-request__form .b24-form-control-text .b24-form-control {
    box-sizing: border-box;
    height: 48px;
    min-height: 48px;
    padding: 13px 16px;
    border: 1px solid var(--rd-border);
    border-radius: 0;
    background-color: var(--rd-white);
    background-image: none;
    font: 15px/20px var(--rd-font);
}

.rd-request__form .b24-form-control-text .b24-form-control {
    height: 104px;
    padding-top: 13px;
}

/* Подпись прибита к верху и не «прыгает» при фокусе — три правила B24
   (обычное, :focus и .b24-form-control-not-empty) перекрываем разом. */
.rd-request__form .b24-form-control-string .b24-form-control-label,
.rd-request__form .b24-form-control-text .b24-form-control-label,
.rd-request__form .b24-form-control-not-empty + .b24-form-control-label,
.rd-request__form .b24-form-control:focus + .b24-form-control-label {
    top: 0;
    padding-left: 0;
    transform: none;
    opacity: 1;               /* B24 приглушает подпись до .5 — отсюда серый */
    color: var(--rd-heading);
    font: 14px/18px var(--rd-font);
}

.rd-request__form .b24-form-control-required {
    color: var(--rd-red);
}

.rd-request__form .b24-form-control-alert-message {
    margin-top: 6px;
    color: var(--rd-red);
    font: 12px/16px var(--rd-font);
}

/* --- Загрузка фото ------------------------------------------------------ */

/* Своя серая подложка со скруглением — в макете её нет, рамка пунктирная.
   Padding обнуляем тоже: он добавлялся к отступу поля и ломал ритм. */
.rd-request__form .b24-form-control-file {
    padding: 0;
    border: none;
    border-radius: 0;
    background-color: transparent;
}

.rd-request__form .b24-form-control-file .b24-form-control-filelist {
    padding: 24px;
    border: 1px dashed var(--rd-muted);
    text-align: center;
}

/* Подсказки под кнопкой в форме нет — в разметку B24 не влезть, поэтому
   выводим её псевдоэлементом. Правильное место для неё — описание поля
   в настройках формы; появится там — это правило можно убрать. */
.rd-request__form .b24-form-control-file .b24-form-control-filelist:after {
    content: "Нажмите чтобы выбрать фото шильдика или ошибки";
    display: block;
    margin-top: 16px;
    color: var(--rd-muted);
    font: 14px/18px var(--rd-font);
}

.rd-request__form .b24-form-control-file .b24-form-control-file-button {
    width: auto;
    min-height: 41px;
    padding: 12px 24px;
    border: 1px solid var(--rd-red);
    border-radius: 0;
    background: transparent;
    opacity: 1;               /* B24 приглушает кнопку до .71 — отсюда блёклость */
    color: var(--rd-red);
    font: 12px/1 var(--rd-font);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
}



/* Врезка «Внимание! Размер файла…» — мелкая серая подпись, а не заголовок. */
.rd-request__form .b24-form-field-layout-section,
.rd-request__form .b24-form-field-layout-section * {
    margin: 0;
    color: var(--rd-muted);
    font: 13px/17px var(--rd-font);
}

/* --- Согласия ----------------------------------------------------------- */

/* Текст согласия и звёздочка обязательности должны идти одним потоком,
   иначе звёздочка становится отдельной колонкой флекса и улетает вправо.
   Поэтому чекбокс выносим абсолютом, а всё остальное оставляем инлайном. */
.rd-request__form .b24-form-control-agreement label {
    display: block;
    position: relative;
    padding-left: 30px;
    cursor: pointer;
}

.rd-request__form .b24-form-control-agreement .b24-form-control-desc,
.rd-request__form .b24-form-control-agreement .b24-form-control-required {
    display: inline;
}

.rd-request__form .b24-form-control-agreement .b24-form-control-desc {
    color: var(--rd-text);
    font: 12px/16px var(--rd-font);
}

/* --- Кнопка ------------------------------------------------------------- */

.rd-request__form .b24-form-btn-container {
    margin: 24px 0 0;
}

/* По умолчанию кнопка тянется во всю ширину — в макете она по содержимому. */
.rd-request__form .b24-form-btn-block {
    flex: 0 0 auto;
    padding: 0;
}

/* Кнопка B24 — блочная: при min-height лишняя высота уходит вниз, и подпись
   прижимается к верхнему краю (сверху и снизу разные отступы). Центрируем
   содержимое флексом — так же, как в .rd-btn рядом. */
.rd-request__form .b24-form-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    min-height: 41px;
    padding: 12px 24px;
    border-radius: 0;
    font: 12px/1 var(--rd-font);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    box-shadow: none;
}

/* --- Доводка до макета -------------------------------------------------- */

/* Ошибки B24 — красная плашка с белым текстом и восклицательным знаком.
   В макете это просто красная подпись под полем. */
.rd-request__form .b24-form-control-alert-message {
    position: static;
    margin-top: 6px;
    padding: 0;
    border: none;
    border-radius: 0;
    background: none;
    color: var(--rd-red);
    font: 12px/16px var(--rd-font);
}

.rd-request__form .b24-form-control-alert-message:before,
.rd-request__form .b24-form-control-alert-message:after {
    display: none;
}

.rd-request__form .b24-form-control-alert .b24-form-control {
    border-color: var(--rd-red);
    background-color: var(--rd-white);
}

/* В состоянии ошибки B24 добавляет полю margin-bottom: 24px !important —
   это запас под всплывающую плашку. Плашку мы вернули в обычный поток,
   запас не нужен, оставляем общий шаг 20px. */
.rd-request__form .b24-form-control-alert {
    margin-bottom: 20px !important;
}

/* Пустой контейнер под сообщение об ошибке B24 не скрывает — он берёт
   отступ и ломает ритм. Прячем, пока в нём ничего нет. */
.rd-request__form .b24-form-control-alert-message:empty {
    display: none;
}

/* Кнопка выбора файла: у B24 слева нарисован плюс двумя псевдоэлементами —
   гасим их и ставим иконку осмотра, как в макете. */
.rd-request__form .b24-form-control-file .b24-form-control-file-button:before,
.rd-request__form .b24-form-control-file .b24-form-control-file-button:after {
    display: none;
}

.rd-request__form .b24-form-control-file .b24-form-control-file-button {
    padding: 12px 24px 12px 48px !important;
    background: transparent url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2032%2032%22%20fill=%22none%22%20stroke=%22%23DA1E28%22%20stroke-width=%222%22%20stroke-miterlimit=%2210%22%3E%3Cpath%20d=%22M16%2021a5%205%200%201%200%200-10%205%205%200%200%200%200%2010Z%22/%3E%3Cpath%20d=%22M19%2018.95L26%2026%22/%3E%3Cpath%20d=%22M26%2017V8L24%206H6V26H17%22/%3E%3Cpath%20d=%22M19%2026H21%22/%3E%3Cpath%20d=%22M25%2020H27%22/%3E%3C/svg%3E") no-repeat 24px center;
    background-size: 16px 16px;
}

.rd-request__form .b24-form-control-file .b24-form-control-file-button:hover {
    background-color: var(--rd-red);
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2032%2032%22%20fill=%22none%22%20stroke=%22%23fff%22%20stroke-width=%222%22%20stroke-miterlimit=%2210%22%3E%3Cpath%20d=%22M16%2021a5%205%200%201%200%200-10%205%205%200%200%200%200%2010Z%22/%3E%3Cpath%20d=%22M19%2018.95L26%2026%22/%3E%3Cpath%20d=%22M26%2017V8L24%206H6V26H17%22/%3E%3Cpath%20d=%22M19%2026H21%22/%3E%3Cpath%20d=%22M25%2020H27%22/%3E%3C/svg%3E");   /* на красном нужна белая иконка */
    color: var(--rd-white);
}

/* Врезка с ограничениями: тёмный текст и иконка ⓘ слева. */
.rd-request__form .b24-form-field-layout-section {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.rd-request__form .b24-form-field-layout-section:before {
    content: "";
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    margin-top: 1px;
    background: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2016%2016%22%20fill=%22%23DA1E28%22%3E%3Cpath%20d=%22M8%200a8%208%200%201%200%200%2016A8%208%200%200%200%208%200Zm0%2014.4A6.4%206.4%200%201%201%208%201.6a6.4%206.4%200%200%201%200%2012.8Z%22/%3E%3Cpath%20d=%22M7.2%206.8h1.6V12H7.2zM7.2%204h1.6v1.6H7.2z%22/%3E%3C/svg%3E") no-repeat center / contain;
}

.rd-request__form .b24-form-field-layout-section,
.rd-request__form .b24-form-field-layout-section * {
    color: var(--rd-text);
    font: 14px/18px var(--rd-font);
}

/* Согласия: B24 гасит их до opacity .5 и 11px — возвращаем читаемый вид,
   а блок отделяем линией, как в макете. */
/* Врезка с ограничениями прижата к блоку загрузки — это подпись к нему,
   а не самостоятельное поле, поэтому 10px вместо общих 20px. */
.rd-request__form .b24-form-field-file {
    margin-bottom: 10px;
}

/* Свой нижний отступ у врезки складывался с отступом блока согласий
   и давал провал вдвое больше макетного. */
.rd-request__form .b24-form-field-layout {
    margin-bottom: 0;
}

.rd-request__form .b24-form-content form > div:nth-of-type(2) {
    margin-top: 24px;
    padding-top: 18px;
    border-top: 1px solid var(--rd-border);
}

/* Между согласиями в макете узкий зазор, у последнего его нет. */
.rd-request__form .b24-form-field-agreement {
    margin-bottom: 10px;
}

.rd-request__form .b24-form-field-agreement:last-of-type {
    margin-bottom: 0;
}

.rd-request__form .b24-form-field-agreement .b24-form-control-container {
    margin-bottom: 0;
    padding-top: 0;
}

.rd-request__form .b24-form-field-agreement .b24-form-control-desc,
.rd-request__form .b24-form-field-agreement .b24-form-field-agreement-link,
.rd-request__form .b24-form-field-agreement .b24-form-control-required {
    opacity: 1;
    color: var(--rd-text);
    font: 12px/16px var(--rd-font);
}

.rd-request__form .b24-form-field-agreement a.b24-form-field-agreement-link {
    color: var(--rd-red);
}

/* Чекбоксы: у B24 системные, в макете красный квадрат с белой галкой. */
.rd-request__form .b24-form-control-agreement input[type=checkbox] {
    -webkit-appearance: none;
    appearance: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 20px;
    height: 20px;
    margin: 0;
    border: 1px solid var(--rd-border);
    border-radius: 4px;
    background: var(--rd-white);
    cursor: pointer;
}

.rd-request__form .b24-form-control-agreement input[type=checkbox]:checked {
    border-color: var(--rd-red);
    background: var(--rd-red) url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2012%2010%22%3E%3Cpath%20d=%22M1%205l3.2%203.2L11%201.4%22%20fill=%22none%22%20stroke=%22%23fff%22%20stroke-width=%222%22/%3E%3C/svg%3E") no-repeat center;
    background-size: 11px 9px;
}

/* Подпись блока загрузки B24 делает мельче и бледнее прочих — уравниваем. */
.rd-request__form .b24-form-control-file .b24-form-control-label {
    display: block;
    margin-bottom: 8px;
    opacity: 1;
    color: var(--rd-heading);
    font: 14px/18px var(--rd-font);
}

/* Кнопка отправки — с иконкой заявки, как остальные кнопки страницы. */
.rd-request__form .b24-form-btn {
    min-width: 204px;
    padding: 12px 24px 12px 50px;
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2017%2020%22%3E%20%3Cpath%20d=%22M9.31351%2020H10.7421V18.5714H9.31351V20Z%22%20fill=%22white%22/%3E%20%3Cpath%20d=%22M14.2857%2012.8574H15.7143V11.4289H14.2857V12.8574Z%22%20fill=%22white%22/%3E%20%3Cpath%20d=%22M7.82927%2018.5714H1.42857V3.57144H4.28571V2.14287H0V20H7.82927V18.5714Z%22%20fill=%22white%22/%3E%20%3Cpath%20d=%22M11.4285%203.57143H14.2857V10H15.7142V2.14286H11.4285V3.57143Z%22%20fill=%22white%22/%3E%20%3Cpath%20d=%22M11.4286%204.28571V3.57143H5.00007V1.72428L5.2958%201.42857H10.4186L10.7144%201.72428V4.28571H11.4286H12.1429V1.13285L11.0101%203.8147e-06H4.70435L3.5715%201.13285V5H12.1429V4.28571H11.4286Z%22%20fill=%22white%22/%3E%20%3Cpath%20d=%22M16.0492%2018.1969H16.7635V16.8912L11.7986%2011.9255L11.2935%2012.4304L11.9585%2012.6905C12.1614%2012.1712%2012.2628%2011.6226%2012.2628%2011.0733C12.2643%209.94616%2011.8321%208.81259%2010.9707%207.95188C10.1107%207.09045%208.97641%206.65903%207.84927%206.65975C7.3007%206.65975%206.7514%206.76118%206.23212%206.96403L5.21499%207.36259L8.38784%2010.5355C8.53927%2010.6876%208.61212%2010.8797%208.61283%2011.0783C8.61212%2011.2783%208.53927%2011.4705%208.38784%2011.6226C8.2357%2011.774%208.04285%2011.8469%207.84285%2011.8476C7.64499%2011.8469%207.45211%2011.774%207.30068%2011.6226L4.12783%208.44973L3.72999%209.46688C3.52642%209.98616%203.42499%2010.5355%203.42499%2011.084C3.42427%2012.2112%203.85569%2013.3454%204.71712%2014.2054C5.57783%2015.0669%206.71142%2015.499%207.83856%2015.4976C8.38784%2015.4976%208.93639%2015.3962%209.45568%2015.1933L9.1957%2014.5283L8.69068%2015.0333L13.6564%2019.999H15.2585L16.7635%2018.4933V18.1969H16.0492L15.5443%2017.6919L14.6664%2018.5705H14.2478L9.37068%2013.6926L8.93569%2013.8626C8.58426%2014.0004%208.21142%2014.069%207.83856%2014.069C7.07142%2014.0683%206.31213%2013.7797%205.72713%2013.1955C5.14284%2012.6105%204.85427%2011.8519%204.85356%2011.084C4.85356%2010.7119%204.92282%2010.339%205.05996%209.98759L4.39499%209.72688L3.88997%2010.2319L6.28998%2012.6326C6.7164%2013.0597%207.28214%2013.2769%207.84285%2013.2762C8.40213%2013.2769%208.96996%2013.0612%209.39781%2012.6326C9.82567%2012.2054%2010.0421%2011.6383%2010.0414%2011.0783C10.0421%2010.5183%209.82496%209.95188%209.39781%209.52545L6.99711%207.12475L6.49212%207.62974L6.75283%208.29474C7.10355%208.1576%207.47641%208.08832%207.84927%208.08832C8.61641%208.08903%209.3757%208.3776%209.9607%208.96189C10.545%209.5476%2010.8336%2010.3062%2010.8343%2011.0733C10.8343%2011.4462%2010.7657%2011.819%2010.6278%2012.1705L10.4578%2012.6055L15.335%2017.4826V18.1969H16.0492Z%22%20fill=%22white%22/%3E%20%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: 24px center;
    background-size: 14px 16px;
}

/* Заплатка: подпись кнопки приходит из формы. Меняем оформлением, а не
   через DOM — форма на Vue и правку затрёт. Место для текста — настройки
   формы в Bitrix24; поправят там — эти два правила можно убрать. */
.rd-request__form .b24-form-btn {
    font-size: 0;
}

.rd-request__form .b24-form-btn:after {
    content: "Отправить заявку";
    /* Тот же сдвиг на 1px, что у .rd-btn > span: метрики PF Din поднимают
       прописные выше оптического центра, и подпись стояла на 1.5px выше,
       чем на соседней кнопке «Перезвоните мне». */
    position: relative;
    top: 1px;
    font: 12px/1 var(--rd-font);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

/* --- Карточка с телефоном --- */
.rd-phone {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 26px 30px;
    background: var(--rd-surface);
}

.rd-phone__label {
    margin: 0 0 6px;
    color: var(--rd-heading);
    font-family: var(--rd-font-medium);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.rd-phone__num {
    display: block;
    margin: 0;
    color: var(--rd-heading);
    font-family: var(--rd-font-medium);
    font-size: 32px;
    font-weight: 500;
    line-height: 38px;
    text-decoration: none;
}

.rd-phone__hint {
    margin: 6px 0 0;
    color: var(--rd-text);
    font-family: var(--rd-font);
    font-size: 14px;
    line-height: 17px;
}

/* --- Схема взаимодействия --- */
.rd-scheme {
    margin-top: 40px;
}

.rd-scheme__body {
    display: grid;
    grid-template-columns: 227px minmax(0, 1fr);
    align-items: start;
    gap: 20px;
    margin-top: 30px;
}

/* Фон — на самой плитке, а не на контейнере: контейнер здесь ещё и слайдер,
   и точки, которые он дорисовывает внизу, оказывались бы на серой подложке.
   В остальных секциях точки лежат под блоком, а не внутри него. */
.rd-scheme__preview {
    background: none;
}

/* Плитки шагов лежат в разметке все сразу, видна активная. */
.rd-scheme__slide {
    display: none;
    flex-direction: column;
    padding: 16px;
    background: var(--rd-surface);
}

.rd-scheme__slide.is-active {
    display: flex;
}

.rd-scheme__preview-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--rd-border);
}

.rd-scheme__badge {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    /* Цифра всплывает на 2px: в строке резервируется место под выносные
       элементы, а цифры его не занимают. Паддинг опускает её на место. */
    padding-top: 4px;
    border-radius: 50%;
    background: var(--rd-red);
    color: var(--rd-white);
    font-family: var(--rd-font-medium);
    font-size: 14px;
    font-weight: 500;
}

.rd-scheme__caption {
    color: var(--rd-text);
    font-family: var(--rd-font);
    font-size: 12px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.rd-scheme__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 96px;
    padding: 20px 0;
}

.rd-scheme__icon img {
    width: 72px;
    height: 72px;
    object-fit: contain;
}

.rd-scheme__name {
    margin: 0;
    color: var(--rd-heading);
    font-family: var(--rd-font-medium);
    font-size: 15px;
    font-weight: 500;
    line-height: 19px;
    text-align: center;
}

/* В styles.min.css у всех ul li висит псевдоэлемент с дефисом — здесь он
   вылезает слева от плашек. Гасим точечно, не трогая остальные списки. */
.rd-scheme__list li::before {
    content: none;
}

.rd-scheme__list {
    display: grid;
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.rd-scheme__step {
    display: flex;
    align-items: center;
    gap: 16px;
    width: 100%;
    min-height: 52px;
    padding: 12px 20px;
    border: 0;
    background: var(--rd-surface);
    color: var(--rd-heading);
    font-family: var(--rd-font-medium);
    font-size: 15px;
    font-weight: 500;
    line-height: 19px;
    text-align: left;
    cursor: pointer;
    transition: background-color .15s ease, color .15s ease;
}

.rd-scheme__num {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    /* Та же компенсация, что у бейджа, но кружок меньше и line-height
       наследуется другой, поэтому подобрано отдельно: замерено 1px. */
    padding-top: 1px;
    border-radius: 50%;
    background: var(--rd-white);
    color: var(--rd-text);
    font-size: 13px;
}

.rd-scheme__arrow {
    flex: 0 0 auto;
    margin-left: auto;
    width: 9px;
    height: 14px;
    fill: var(--rd-muted);
}

.rd-scheme__item.is-active .rd-scheme__step {
    background: var(--rd-red);
    color: var(--rd-white);
}

.rd-scheme__item.is-active .rd-scheme__num {
    background: var(--rd-white);
    color: var(--rd-red);
}

.rd-scheme__item.is-active .rd-scheme__arrow {
    fill: var(--rd-white);
}
@media (max-width: 1199px) {
    .rd-request__grid { grid-template-columns: minmax(0, 1fr); row-gap: 40px; }}
@media (max-width: 767px) {
    .rd-request {
        padding: var(--rd-section-y-mob) 0;
    }

    /* Имя и телефон в одну колонку: в две они не помещаются. */
    .rd-request__form .b24-form-content form > div:first-child {
        grid-template-columns: minmax(0, 1fr);
    }

    /* Кнопка отправки и «Перезвоните мне» — одинаковые: во всю ширину
       и повыше, как в мобильном макете. */
    .rd-request__form .b24-form-btn,
    .rd-phone .rd-btn {
        width: 100%;
        min-width: 0;
        min-height: 48px;
    }

    .rd-request__form .b24-form-btn-block {
        flex: 1 1 auto;
    }

    .rd-request__form {
        padding: 16px;
    }

    .rd-phone {
        flex-direction: column;
        align-items: flex-start;
        /* Те же боковые отступы, что у формы, иначе кнопки внутри них
           получаются разной ширины. */
        padding: 20px 16px;
    }

    .rd-phone .rd-btn { width: 100%; justify-content: center; }

    /* Номер должен влезать в строку на любом телефоне: на узких экранах
       кегль тянется от ширины окна, перенос запрещён. Полный размер
       макета возвращается примерно с 427px. */
    .rd-phone__num {
        font-size: clamp(20px, 7.5vw, 32px);
        line-height: 1.2;
        white-space: nowrap;
    }

    /* На телефоне список шагов не нужен: плитки сами листаются. */
    .rd-scheme__list {
        display: none;
    }

    .rd-scheme__slide,
    .rd-scheme__slide.is-active {
        display: flex;
    }

    .rd-scheme__body { grid-template-columns: minmax(0, 1fr); }}
/* End */


/* Start:/bitrix/templates/ik555.base/components/bitrix/news.list/reviews.block.image.rd/style.css?17884186692534*/
.reviews__body--row{
    display: flex;
    align-items: flex-start;
	justify-content: center;
}
.reviews__image{
    flex-shrink: 0;
    border: 1px solid #e0e1e1;
    overflow: hidden;
}
.reviews__image>img{
    transition: all .3s ease;
}
.reviews__image:hover>img{
    transform: scale(1.1);
}
.reviews__all{
    display: flex;
}
.reviews__all a{
    font-size: 22px;
    margin-left: auto;
}
@media (max-width: 379px){
    .reviews--image .reviews__text p{
        margin: 0 0 8px;
        font-size: 13px;
        line-height: 1.4;
    }
    .reviews--image .reviews__body{
        padding: 15px;
    }
    .reviews--image  .reviews__header{
        padding-left: 15px;
        padding-right: 15px;
    }
}
@media (max-width: 679px){
    .reviews__image{
        width: 100px;
        margin-right: 10px;
    }
	
	.reviews__carousel_items .reviews__image{
		margin-right: 0;
	}
}
@media (min-width: 680px){
    .reviews__image{
        width: 200px;
        height: 284px;
        margin-right: 20px;
    }
	
	.reviews__carousel_items .reviews__image{
		margin-right: 0;
	}
}

.block_info_reviews {display: flex;align-items: center;padding-bottom: 22px;margin-left: 68px;}
.block_item_info_reviews:last-child{margin-right:0;}
.block_item_info_reviews {background: #F8F8F8;
    border-radius: 64px;padding: 4px;display: flex;align-items: center;margin-right: 32px;min-width: 165px;}

.block_item_info_reviews .block_ico {margin-right: 4px;}

.block_txt .block_label {
    font-style: normal;
    font-weight: 700;
    font-size: 12px;
    line-height: 16px;
    color: #231F20;
    margin-bottom: 4px;}

.info_rating strong {font-size: 12px;
    line-height: 16px;padding: 0 4px;color: #231F20;}

.info_rating {
    font-style: normal;
    font-size: 12px;
    line-height: 16px;
    color: #AFABAC;
    display: flex;
    align-items: center;
}

.block_title_info {display: flex;align-items: center;}
@media(max-width:1438.5px){
    .block_info_reviews {margin-left:32px;}
    .block_item_info_reviews{margin-right:16px}
}
@media(max-width:1199.5px){
    .block_info_reviews {margin-left:0;}
    .block_title_info{flex-direction:column;align-items:flex-start;width: 100%;}
}

@media(max-width:766.5px){
    .reviews__all {flex-direction: column;padding-bottom: 24px;}
    .reviews__all .manuf__btn {max-width:100%;width:100%;}
}

@media(max-width:666.5px){
    .block_info_reviews {flex-wrap: wrap;}
    .block_item_info_reviews {width: 100%;margin: 0 0 8px;}
}

.reviews__carousel_items .reviews__header p {
	font-size: 14px;
}
/* End */


/* Start:/bitrix/templates/ik555.base/components/bitrix/news.list/reviews.block.image.rd/magnific/magnific-popup.css?17884186696951*/
/* Magnific Popup CSS */
.mfp-bg {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1042;
  overflow: hidden;
  position: fixed;
  background: #0b0b0b;
  opacity: 0.8; }

.mfp-wrap {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1043;
  position: fixed;
  outline: none !important;
  -webkit-backface-visibility: hidden; }

.mfp-container {
  text-align: center;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  padding: 0 8px;
  box-sizing: border-box; }

.mfp-container:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle; }

.mfp-align-top .mfp-container:before {
  display: none; }

.mfp-content {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  margin: 0 auto;
  text-align: left;
  z-index: 1045; }

.mfp-inline-holder .mfp-content,
.mfp-ajax-holder .mfp-content {
  width: 100%;
  cursor: auto; }

.mfp-ajax-cur {
  cursor: progress; }

.mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
  cursor: -moz-zoom-out;
  cursor: -webkit-zoom-out;
  cursor: zoom-out; }

.mfp-zoom {
  cursor: pointer;
  cursor: -webkit-zoom-in;
  cursor: -moz-zoom-in;
  cursor: zoom-in; }

.mfp-auto-cursor .mfp-content {
  cursor: auto; }

.mfp-close,
.mfp-arrow,
.mfp-preloader,
.mfp-counter {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none; }

.mfp-loading.mfp-figure {
  display: none; }

.mfp-hide {
  display: none !important; }

.mfp-preloader {
  color: #CCC;
  position: absolute;
  top: 50%;
  width: auto;
  text-align: center;
  margin-top: -0.8em;
  left: 8px;
  right: 8px;
  z-index: 1044; }
  .mfp-preloader a {
    color: #CCC; }
    .mfp-preloader a:hover {
      color: #FFF; }

.mfp-s-ready .mfp-preloader {
  display: none; }

.mfp-s-error .mfp-content {
  display: none; }

button.mfp-close,
button.mfp-arrow {
  overflow: visible;
  cursor: pointer;
  background: transparent;
  border: 0;
  -webkit-appearance: none;
  display: block;
  outline: none;
  padding: 0;
  z-index: 1046;
  box-shadow: none;
  touch-action: manipulation; }

button::-moz-focus-inner {
  padding: 0;
  border: 0; }

.mfp-close {
  width: 44px;
  height: 44px;
  line-height: 44px;
  position: absolute;
  right: 0;
  top: 0;
  text-decoration: none;
  text-align: center;
  opacity: 0.65;
  padding: 0 0 18px 10px;
  color: #FFF;
  font-style: normal;
  font-size: 28px;
  font-family: Arial, Baskerville, monospace; }
  .mfp-close:hover,
  .mfp-close:focus {
    opacity: 1; }
  .mfp-close:active {
    top: 1px; }

.mfp-close-btn-in .mfp-close {
  color: #333; }

.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close {
  color: #FFF;
  right: -6px;
  text-align: right;
  padding-right: 6px;
  width: 100%; }

.mfp-counter {
  position: absolute;
  top: 0;
  right: 0;
  color: #CCC;
  font-size: 12px;
  line-height: 18px;
  white-space: nowrap; }

.mfp-arrow {
  position: absolute;
  opacity: 0.65;
  margin: 0;
  top: 50%;
  margin-top: -55px;
  padding: 0;
  width: 90px;
  height: 110px;
  -webkit-tap-highlight-color: transparent; }
  .mfp-arrow:active {
    margin-top: -54px; }
  .mfp-arrow:hover,
  .mfp-arrow:focus {
    opacity: 1; }
  .mfp-arrow:before,
  .mfp-arrow:after {
    content: '';
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    left: 0;
    top: 0;
    margin-top: 35px;
    margin-left: 35px;
    border: medium inset transparent; }
  .mfp-arrow:after {
    border-top-width: 13px;
    border-bottom-width: 13px;
    top: 8px; }
  .mfp-arrow:before {
    border-top-width: 21px;
    border-bottom-width: 21px;
    opacity: 0.7; }

.mfp-arrow-left {
  left: 0; }
  .mfp-arrow-left:after {
    border-right: 17px solid #FFF;
    margin-left: 31px; }
  .mfp-arrow-left:before {
    margin-left: 25px;
    border-right: 27px solid #3F3F3F; }

.mfp-arrow-right {
  right: 0; }
  .mfp-arrow-right:after {
    border-left: 17px solid #FFF;
    margin-left: 39px; }
  .mfp-arrow-right:before {
    border-left: 27px solid #3F3F3F; }

.mfp-iframe-holder {
  padding-top: 40px;
  padding-bottom: 40px; }
  .mfp-iframe-holder .mfp-content {
    line-height: 0;
    width: 100%;
    max-width: 900px; }
  .mfp-iframe-holder .mfp-close {
    top: -40px; }

.mfp-iframe-scaler {
  width: 100%;
  height: 0;
  overflow: hidden;
  padding-top: 56.25%; }
  .mfp-iframe-scaler iframe {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
    background: #000; }

/* Main image in popup */
img.mfp-img {
  width: auto;
  max-width: 100%;
  height: auto;
  display: block;
  line-height: 0;
  box-sizing: border-box;
  padding: 40px 0 40px;
  margin: 0 auto; }

/* The shadow behind the image */
.mfp-figure {
  line-height: 0; }
  .mfp-figure:after {
    content: '';
    position: absolute;
    left: 0;
    top: 40px;
    bottom: 40px;
    display: block;
    right: 0;
    width: auto;
    height: auto;
    z-index: -1;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
    background: #444; }
  .mfp-figure small {
    color: #BDBDBD;
    display: block;
    font-size: 12px;
    line-height: 14px; }
  .mfp-figure figure {
    margin: 0; }

.mfp-bottom-bar {
  margin-top: -36px;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  cursor: auto; }

.mfp-title {
  text-align: left;
  line-height: 18px;
  color: #F3F3F3;
  word-wrap: break-word;
  padding-right: 36px; }

.mfp-image-holder .mfp-content {
  max-width: 100%; }

.mfp-gallery .mfp-image-holder .mfp-figure {
  cursor: pointer; }

@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
  /**
       * Remove all paddings around the image on small screen
       */
  .mfp-img-mobile .mfp-image-holder {
    padding-left: 0;
    padding-right: 0; }
  .mfp-img-mobile img.mfp-img {
    padding: 0; }
  .mfp-img-mobile .mfp-figure:after {
    top: 0;
    bottom: 0; }
  .mfp-img-mobile .mfp-figure small {
    display: inline;
    margin-left: 5px; }
  .mfp-img-mobile .mfp-bottom-bar {
    background: rgba(0, 0, 0, 0.6);
    bottom: 0;
    margin: 0;
    top: auto;
    padding: 3px 5px;
    position: fixed;
    box-sizing: border-box; }
    .mfp-img-mobile .mfp-bottom-bar:empty {
      padding: 0; }
  .mfp-img-mobile .mfp-counter {
    right: 5px;
    top: 3px; }
  .mfp-img-mobile .mfp-close {
    top: 0;
    right: 0;
    width: 35px;
    height: 35px;
    line-height: 35px;
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    text-align: center;
    padding: 0; } }

@media all and (max-width: 900px) {
  .mfp-arrow {
    -webkit-transform: scale(0.75);
    transform: scale(0.75); }
  .mfp-arrow-left {
    -webkit-transform-origin: 0;
    transform-origin: 0; }
  .mfp-arrow-right {
    -webkit-transform-origin: 100%;
    transform-origin: 100%; }
  .mfp-container {
    padding-left: 6px;
    padding-right: 6px; } }

/* End */
/* /bitrix/templates/ik555.base/components/bitrix/search.title/visual/style.css?17906035374117 */
/* /bitrix/templates/ik555.base/components/bitrix/news.detail/catalog-type.type/style.css?1759181772550 */
/* /bitrix/templates/ik555.base/css/redesign.page.css?178841866959942 */
/* /bitrix/templates/ik555.base/components/bitrix/news.list/reviews.block.image.rd/style.css?17884186692534 */
/* /bitrix/templates/ik555.base/components/bitrix/news.list/reviews.block.image.rd/magnific/magnific-popup.css?17884186696951 */