/* Start:/bitrix/templates/wilmart_test2/components/bitrix/news/sevice-item/bitrix/news.detail/.default/style.css?17412565698750*/
.service-item:not(.right-image) img{
	border-radius: 0 270.5px 270.5px 0;}
	.service-item.right-image img{
border-radius: 270.5px 0 0 270.5px;}
			.service-item img {
border: 0;
    max-width: 100%;
width: 50%;
height: auto; 

			}

			.service-item.right-image .text{
				max-width:500px;
padding-top:5%;
				padding-left:15%;}
			.service-item.right-image .buttons {
				padding-top:5%;
				position:relative;}
			.service-item.right-image .text-content{
				line-height:28px;
padding-top:10%;
				font-size:20px;}
			.service-item.right-image {



				background-color:#DFE0E1;
    display: flex;
max-height:705px;
	gap: 10%;
}
		.service-item {
				max-height:519px;
				width: auto;
				height:auto;
				margin-bottom:30px;
position: relative;
    display: flex; /* Размещаем элементы в строку */
    gap: 64px; /* Добавляем расстояние между картинкой и текстом */

}
.header-transparent {

				background-color: rgba(0, 0, 0, 0.25); /* Черный цвет с 25% непрозрачности */
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 1;
}
/* Применение белого цвета к ссылкам (a) и дивам (div) внутри прозрачного хедера */
header.header-transparent a,
header.header-transparent div {
    color: white; /* Белый цвет текста */
}

header.header-transparent a:hover {
    color: #ccc; /* Например, светло-серый при наведении на ссылку */
}

/* Если вы хотите изменить только текст внутри определённых div, можно уточнить селекторы */
header.header-transparent .logo a,
header.header-transparent .a_mail {
    color: white;
}

			.title-one {
				font-family: 'TT Hoves', sans-serif;
				font-weight: 700;
				line-height: 53.01px;
		}
        .highlighted-title {
				font-size:45px;
            font-family: 'TT Hoves', sans-serif;
            font-style: normal;
            font-weight: 600;
            color: #F6532D;

        }

.service-item:not(.right-image) .text {
    padding-right: 285px ;
}

.text {

				height:auto;
				width:auto;

	max-height: 519px; /* Задаём ширину текстового блока */
}

.btn {
width: auto;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 12px 59px;
    gap: 10px;
 /* Строгая ширина */
    height: 46px;
    background: #F6532D;
    border-radius: 5px;
    color: white;
    text-decoration: none;
    font-size: 17px;
    box-sizing: border-box; /* Учитываем padding в ширину */
    overflow: hidden; /* Обрезаем текст, если он слишком длинный */
    text-overflow: ellipsis; /* Добавляем многоточие для длинного текста */
    white-space: nowrap; /* Текст не будет переноситься */
}
.btn:hover {
    color: white; /* Указываем, что цвет текста не меняется при наведении */
}
.buttons {
				padding-top:5%;
position:relative;
    bottom: 0;
flex-wrap: wrap;

    display: flex;
    gap: 39px; /* Расстояние между кнопками */
}
li::marker {
    font-size: 12px; /* Устанавливаем размер маркера */

}
.text-content {
				line-height: 22.4px;}

@media (max-width: 1750px) {
				.service-item{
					height:450px;}
    .service-item .text .text-content {
        
    }

    .text-content {
					font-size:14px;

					padding-top: 15px;
    }
.service-item.right-image .text {
    padding-left: 230px; /* Например, смещение влево */
}

.service-item:not(.right-image) .text {
    padding-right: 230px;
}


    .buttons {
        justify-content: center;
    }
}
			@media (max-width: 1600px){

 .text-content {
					font-size:14px;
					line-height:19px;
					padding-top: 20px;
    }
.service-item.right-image .text {
    padding-left: 170px; /* Например, смещение влево */
}

.service-item:not(.right-image) .text {
    padding-right: 170px;
}
				.service-item {
					gap: 50px;
				}
	
				.p {
line-height: 19px;
				}
				.li{
line-height: 19px;
}
		}
			@media (max-width: 1320px)
 {

    .highlighted-title {
					text-align:center;
        font-size: 25px;
        line-height: 30px;
    }
.service-item.right-image .text-content {
					font-size:18px;}

 .text-content {
					font-size:13px;
					line-height:17px;
					padding-top: 15px !important;
    }
.service-item.right-image .text {
    padding-left: 80px; /* Например, смещение влево */
}

.service-item:not(.right-image) .text {
    padding-right: 80px ;
}
				.service-item {
					gap: 30px;
					height:400px;
				}
				.service-item.right-image {

				}
				.p {
line-height: 17px;
				}
				.li{
line-height: 17px;
}
		}
			@media (max-width: 980px) {.btn{ min-width:340px;}

				.container{
					width:auto;}
    .service-item {
display: flex;
padding-top: 30px;
					width:auto;
        flex-direction: column;
        gap: 20px;


    margin-bottom: 40px;;
margin-top: auto;

					height:auto;
					max-height:1200px;

    }
				.text {
					margin-left:20px;
margin-right:20px;

					width:auto;
				}
    .service-item img {
        width: 100%;

    }

    .service-item .text {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
				.service-item.right-image .text{
					max-width: 1000px;}
    .service-item.right-image {
padding-top: 80px;
    padding-bottom: 30px;

        flex-direction: column-reverse;
    }

    .buttons {

        position: relative;
        justify-content: center;
        gap: 20px;

display: flex;
        flex-wrap: wrap;
    }

    .form-container {
        width: 100%;
        margin-right: 0;
        padding: 20px;
    }

    .form-container h2 {
        font-size: 24px;
        line-height: 28px;
    }

    .form-container p {
        font-size: 16px;
        line-height: 20px;
        margin-bottom: 30px;
    }

    .form-container input,
    .form-container select,
    .form-container button {
        max-width: 100%;
    }

    .custom-select {
        max-width: 100%;
    }

    .select-selected::after {
        right: 10px;
    }

    .background {
					flex-direction:column;
background-image: url('/test/img/303-1mob.jpg')!important;
        height: 200px !important;
        padding: 20px 0;
					margin-top:32px;
					display:none !important;
    }
.background img {
    max-height: 300px; /* Максимальная высота картинки */
    width: auto; /* Сохраняем пропорции */
}
				.service-item img{
					content: url('/test/img/305-1mob2.png');}
    .hero img {
content: url('/test/img/303-1mob3.png');
        width: 100%;
        height: 400px;
					
    }

    .title-one {
		padding: 24px 0 0 0;
        font-size: 30px;
        line-height: 28px;
					max-width:374px;
 margin-left: auto; /* Автоматические отступы по бокам */
    margin-right: auto;
    }

    .highlighted-title {
					text-align:center;
        font-size: 30px;
        line-height: 35px;
    }
				.service-item.right-image .text-content {
  font-size: 20px;
        line-height: 28px;

    .text-content {
        font-size: 14px;
        line-height: 16.5px;
        padding-top: 10px;
width:auto;
    }
				.buttons{
					min-height:95px;
					display:unset;
       }

    .btn {
        padding: 10px 20px;
        font-size: 17px;
					margin-bottom: 12px;
    }

    .service-item {
        flex-direction: column; /* Меняем направление на колонку */
    }

    .service-item img {
        order: 0; /* Изображение будет после текста */
        width: 100%; /* Изображение занимает всю ширину */
        height: auto; /* Сохраняем пропорции */
					max-height:350px;
    }
    .service-item.right-image img {
        order: 2; /* Текст будет перед изображением */
        width: 100%; /* Текст занимает всю ширину */
    }

    .service-item .text {
        order: 1; /* Текст будет перед изображением */
        width: auto; /* Текст занимает всю ширину */
    }
					.hero:
						height:auto;}
}



			@media (max-width: 400px){
.service-item:not(.right-image) {
display: flex;

    margin-bottom: 100px;

					width:auto;
        flex-direction: column;
        gap: 20px;



margin-top: auto;

					height:auto;
					max-height:1200px;

				}}

/* End */
/* /bitrix/templates/wilmart_test2/components/bitrix/news/sevice-item/bitrix/news.detail/.default/style.css?17412565698750 */