/* ==========================================================================
   tt24-7.ru — слой современного оформления
   Подключается ПОСЛЕ main.min.css и bootstrap.min.css и переопределяет
   только визуальные детали (отступы, скругления, тени, переходы).
   Структура HTML, классы, формы и скрипты не затронуты —
   вся функциональность (заявки, модалки, аналитика) работает как прежде.
   ========================================================================== */

:root{
	--accent:#96c02c;
	--accent-dark:#6c8a20;
	--accent-light:#b3d856;
	--accent-soft:#f0f3e7;
	--ink:#242424;
	--ink-soft:#5b5f57;
	--paper:#ffffff;
	--paper-soft:#f6f7f2;
	--line:#e6e8e0;
	--radius-lg:20px;
	--radius-md:14px;
	--radius-sm:10px;
	--shadow-sm:0 2px 10px rgba(30,34,20,.06);
	--shadow-md:0 12px 30px rgba(30,34,20,.10);
	--shadow-lg:0 24px 60px rgba(30,34,20,.16);
	--ease:cubic-bezier(.22,1,.36,1);
}

@media (prefers-reduced-motion: reduce){
	*{animation-duration:.001ms !important;transition-duration:.001ms !important;}
}

html{scroll-behavior:smooth;}

body{
	-webkit-font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}

a, button, input[type=submit], .buy a, .menuButton, .nav-link{
	transition:all .25s var(--ease);
}

img{ image-rendering:-webkit-optimize-contrast; }

/* ---------- Заголовки ---------- */
h1{ margin:0; font-size:inherit; font-weight:inherit; }
h2{ letter-spacing:.2px; }
.complect h2, .spectr h2, .needs h2, .status h2, .dates h2, .faq h2, .contacts h2, .newsBlock h2{
	position:relative;
}

/* ---------- Хедер ---------- */
.header{
	box-shadow:0 4px 24px rgba(0,0,0,.18);
	transition:height .3s var(--ease), box-shadow .3s var(--ease);
}
.header .contact .adr, .header .contact .phone a{ letter-spacing:.2px; }
.header .contact .phone a span{ color:var(--accent-light); }

.header .contact .adr a{
	text-decoration:none !important;
	display:inline-flex;
	align-items:center;
	gap:6px;
	position:relative;
}
.header .contact .adr a:before{
	content:"";
	display:inline-block;
	width:14px; height:11px;
	flex:0 0 auto;
	background-color:currentColor;
	-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m2 7 10 6 10-6'/%3E%3C/svg%3E") no-repeat center / contain;
	mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m2 7 10 6 10-6'/%3E%3C/svg%3E") no-repeat center / contain;
	transition:transform .35s var(--ease), color .25s var(--ease);
}
.header .contact .adr a:after{
	content:"";
	position:absolute;
	left:20px; right:0; bottom:-2px;
	height:1px;
	background:currentColor;
	transform:scaleX(0);
	transform-origin:left;
	transition:transform .3s var(--ease);
}
.header .contact .adr a:hover{ color:var(--accent-light); }
.header .contact .adr a:hover:before{ transform:translateY(-1px) rotate(-8deg) scale(1.1); }
.header .contact .adr a:hover:after{ transform:scaleX(1); }
.menu .nav-link{
	position:relative;
	border-radius:8px;
}
.menu .nav-link:after{
	content:"";
	position:absolute;
	left:12px; right:12px; bottom:2px;
	height:2px;
	background:var(--accent);
	transform:scaleX(0);
	transform-origin:left;
	transition:transform .25s var(--ease);
}
.menu .nav-link:hover:after{ transform:scaleX(1); }
.menu .nav-link:hover{ color:var(--accent-light) !important; }

.menuButton{
	border-radius:8px;
	transition:background .25s var(--ease), color .25s var(--ease);
}
.menuButton:hover{ background:var(--accent); color:#fff; }

/* ---------- Меню: все пункты видны всегда, без кнопки "Меню" ----------
   Раньше на узких экранах меню сворачивалось в выпадающий список за кнопкой
   "Меню" (или, при промежуточных ширинах, пункты просто переносились и
   наезжали на баннер). Теперь пункты меню показаны всегда полностью:
   шапка становится "sticky" (а не фиксированной с жёсткой высотой) и сама
   растёт по высоте, если пунктам нужно перейти на вторую строку —
   баннер ниже сам сдвигается вслед за реальной высотой шапки, без наездов.
   Кнопка "Меню" скрыта на всех ширинах, разметка/JS не меняются. */
.header, .header.min{
	position:-webkit-sticky !important;
	position:sticky !important;
	top:0 !important;
	height:auto !important;
}
.indexSlider{ padding-top:0 !important; }

.header .menu .menuButton{ display:none !important; }

.header .menu ul{
	position:static !important;
	top:auto !important; left:auto !important;
	display:flex !important;
	flex-wrap:wrap !important;
	width:auto !important;
	background:transparent !important;
	padding:4px 0 !important; margin:0 !important;
	border-radius:0; overflow:visible; box-shadow:none;
}
.header .menu ul li{ display:block !important; flex:0 0 auto !important; }
.header .menu ul li a{
	display:block !important;
	padding:6px 12px !important;
	font-size:1rem !important;
	white-space:nowrap;
}
.header .menu ul li a.active, .header .menu ul li a:hover{ text-decoration:none; }
.header .menu .row{ align-items:center; row-gap:6px; }
.header.min .menu ul{ padding:2px 0 !important; }

@media (max-width:479.98px){
	.header .menu ul li a{ padding:5px 8px !important; font-size:.9rem !important; }
	.header .menu .feedPhone{ width:27px; }
	.header .menu .feedPhone a{ font-size:0; background:url(../img/phone.png) no-repeat center; width:27px; height:27px; }
}

.feedPhone a{
	display:inline-block;
	border-radius:999px;
	padding:0 4px;
	transition:transform .2s var(--ease), box-shadow .2s var(--ease);
}
.feedPhone a:hover{ transform:translateY(-1px); box-shadow:0 8px 20px rgba(162,191,62,.35); }

/* ---------- Слайдер на главной ---------- */
.indexSlider .sliderContainer .sliderBlock .item{
	position:relative;
}
.indexSlider .sliderContainer .sliderBlock .item:after{
	content:"";
	position:absolute; inset:0;
	background:linear-gradient(90deg, rgba(10,12,6,.55) 0%, rgba(10,12,6,.15) 55%, rgba(10,12,6,0) 80%);
	pointer-events:none;
}
.indexSlider .content{
	position:relative;
	z-index:2;
	background:rgba(20,22,14,.42);
	-webkit-backdrop-filter:blur(6px);
	backdrop-filter:blur(6px);
	border-radius:var(--radius-lg);
	border:1px solid rgba(255,255,255,.12);
	box-shadow:var(--shadow-lg);
	padding:36px 40px !important;
}
.indexSlider .content .title{
	color:#fff !important;
	text-shadow:0 2px 12px rgba(0,0,0,.35);
}
.indexSlider .content .text{
	color:#f1f1ea !important;
}
.indexSlider .content .text3 a{
	display:inline-block;
	border-radius:999px;
	background:linear-gradient(135deg, var(--accent) 0%, var(--accent-dark) 100%);
	box-shadow:var(--shadow-md);
}
.indexSlider .content .text3 a:hover{
	transform:translateY(-2px);
	box-shadow:0 16px 32px rgba(135,166,46,.4);
}

/* Баннер (слайдер) на главной был 723px высотой и вместе с шапкой не
   помещался на экран на типичных ноутбучных разрешениях (напр. 1366x768) —
   приходилось сразу прокручивать. Уменьшаем высоту и отступы контента,
   не трогая сам текст/картинки слайдов. */
@media (min-width:992px){
	.indexSlider .sliderContainer,
	.indexSlider .sliderContainer .sliderBlock,
	.indexSlider .sliderContainer .sliderBlock .item{
		height:560px !important;
	}
	.indexSlider .sliderContainer .sliderBlock .item .content{
		margin-top:90px !important;
	}
	.indexSlider .sliderContainer .sliderBlock .item .content.item3{
		margin-top:70px !important;
	}
	.indexSlider .sliderContainer .sliderBlock .item .content.item4{
		margin-top:14px !important;
	}
	.indexSlider .sliderContainer .sliderBlock .item .content.item4 .text1{ padding:0 0 12px 0 !important; }
	.indexSlider .sliderContainer .sliderBlock .item .content.item4 .text3{ padding:14px 0 16px 0 !important; }
	.indexSlider .sliderContainer .sliderBlock .item .content.item4 .text4{ padding:14px 22px !important; }
}

/* Зелёная плашка "на 12/36 месяцев" в акционном слайде имела фиксированную
   высоту 40px и при переносе текста на 2 строки наезжала на цену под ней —
   даём ей расти по содержимому. */
.indexSlider .sliderContainer .sliderBlock .item .content.item3 .tr1{
	height:auto !important;
	min-height:40px;
	padding-top:2px !important;
	padding-bottom:2px !important;
}
.sliderButtons .slick-arrow{
	border-radius:50%;
	background-color:rgba(20,22,14,.45) !important;
	-webkit-backdrop-filter:blur(4px);
	backdrop-filter:blur(4px);
	border:1px solid rgba(255,255,255,.25);
	transition:background-color .25s var(--ease), transform .25s var(--ease);
}
.sliderButtons .slick-arrow:hover{
	background-color:var(--accent) !important;
	transform:translateY(-50%) scale(1.06);
}

/* ---------- Комплекты и цены (карточки товаров) ---------- */
.complect{ background:var(--paper-soft); }
.complect .item{
	background:var(--paper) !important;
	border-radius:var(--radius-lg);
	box-shadow:var(--shadow-sm);
	margin:0 0 28px 0;
	padding:40px !important;
	transition:box-shadow .3s var(--ease), transform .3s var(--ease);
}
.complect .item:hover{
	box-shadow:var(--shadow-md);
	transform:translateY(-3px);
}
.complect .item .img img{
	filter:drop-shadow(0 18px 24px rgba(20,20,10,.14));
	transition:transform .4s var(--ease);
}
.complect .item:hover .img img{ transform:scale(1.08); }
.complect .item .title{
	color:var(--ink);
	font-weight:500;
}
.complect .item .title span{
	display:inline-block;
	background:var(--accent-soft);
	color:var(--accent-dark);
	border-radius:999px;
	padding:2px 12px;
	vertical-align:middle;
}

.price .priceWrap .inner{
	background:linear-gradient(90deg, var(--accent-soft) 0%, #f8faf0 100%);
	border-radius:var(--radius-sm) 0 0 var(--radius-sm);
	transition:transform .2s var(--ease);
}
.price .priceWrap .inner:after{
	border-left-color:#f8faf0;
}
.price .priceWrap:hover .inner{ transform:translateX(2px); }
.price .priceWrap .price3 .inner, .price .priceWrap .price3.inner{
	background:linear-gradient(90deg, var(--accent) 0%, var(--accent-dark) 100%);
	color:#fff;
}

.buy a{
	border-radius:999px !important;
	background:linear-gradient(135deg, var(--accent) 0%, var(--accent-dark) 100%) !important;
	box-shadow:var(--shadow-sm);
	font-weight:400;
}
.buy a:hover{
	box-shadow:0 14px 28px rgba(135,166,46,.35);
	transform:translateY(-2px);
}

.advantageLink a{
	display:inline-flex;
	align-items:center;
	gap:6px;
	text-decoration:none !important;
	color:var(--accent-dark);
	font-weight:500;
	border-bottom:1px dashed transparent;
}
.advantageLink a:hover{ color:var(--ink); }
.advantage{
	background:var(--paper-soft);
	border-radius:var(--radius-sm);
	padding:16px 20px;
	margin-top:10px;
}

/* ---------- «Под ключ» и «Полный спектр услуг» ---------- */
.spectr{
	position:relative;
}
.spectr:before{
	content:"";
	position:absolute; inset:0;
	background:linear-gradient(180deg, rgba(24,30,10,.38) 0%, rgba(234,242,213,.94) 78%);
}
.spectr .container{ position:relative; z-index:1; }
.spectr h2{ color:#fff; text-shadow:0 2px 10px rgba(0,0,0,.35); margin-top:14px; }
.spectr h2.bold{ color:var(--ink); text-shadow:none; }
.spectr h2 span{
	display:inline-block;
	background:linear-gradient(135deg, #ffd166 0%, #f0a93a 100%);
	color:#3d2b00;
	padding:4px 18px;
	border-radius:999px;
	font-size:.8em;
	box-shadow:0 8px 20px rgba(0,0,0,.2);
	vertical-align:middle;
	text-shadow:none;
}

.spectr .row1 .card{
	border-radius:var(--radius-lg);
	background:linear-gradient(160deg, var(--accent) 0%, var(--accent-dark) 100%) !important;
	box-shadow:var(--shadow-md);
	padding:32px 28px 130px 28px !important;
	min-height:220px;
	transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.spectr .row1 .card.custom{
	background:linear-gradient(160deg, var(--accent) 0%, var(--accent-dark) 100%) !important;
	padding-bottom:160px !important;
}
.spectr .row1 .card.custom .card-title{
	background:rgba(0,0,0,.2) !important;
	box-shadow:none !important;
}
.spectr .row1 .card:hover{
	transform:translateY(-4px);
	box-shadow:var(--shadow-lg);
}
.spectr .card-title{ color:#fff !important; }
.spectr .card-text p{ color:rgba(255,255,255,.92) !important; }
.spectr .old-price{ color:rgba(255,255,255,.75) !important; }
.spectr .new-price span{
	display:inline-block;
	background:rgba(0,0,0,.22);
	border-radius:var(--radius-sm);
	padding:6px 18px;
	color:#fff !important;
}
.spectr .row1 .card .card-price .new-price span{
	background:rgba(0,0,0,.22);
}

.spectr .desc{
	background:var(--paper);
	border-radius:var(--radius-lg);
	box-shadow:var(--shadow-sm);
	padding:30px 40px;
	margin:36px auto 44px auto;
	max-width:920px;
	color:var(--ink-soft);
	font-size:1.02rem;
	font-style:italic;
	line-height:1.7;
	letter-spacing:.15px;
	border-left:3px solid var(--accent);
	border-radius:4px var(--radius-lg) var(--radius-lg) 4px;
}
@media (max-width:767px){
	.spectr .desc{ margin:24px auto 28px auto; padding:22px 24px; font-size:.95rem; }
}

/* У .item margin-bottom:40px (из main.min.css) учитывается внутри высоты
   растянутой .card (height:100%), но не создаёт зазор МЕЖДУ строками
   сетки — соседние карточки из разных строк касались друг друга вплотную
   (0px между ними), из-за чего скруглённые углы визуально "наезжали"
   друг на друга. row-gap добавляет настоящий зазор между строками. */
.spectr .row2{ row-gap:24px; }

.spectr .row2 .card{
	background:var(--paper);
	border-radius:var(--radius-lg);
	box-shadow:var(--shadow-sm);
	padding:28px 10px;
	height:100%;
	transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.spectr .row2 .card:hover{
	transform:translateY(-4px);
	box-shadow:var(--shadow-md);
}
.spectr .row2 .item{
	transition:transform .3s var(--ease);
}
.spectr .row2 .card:hover .item{ transform:translateY(-2px); }
.spectr .row2 .item:before{
	transition:transform .3s var(--ease), background .3s var(--ease);
}
.spectr .row2 .card:hover .item:before{
	transform:scale(1.06);
	background-color:var(--accent-soft) !important;
}

/* ---------- Форма обратного звонка на главной ---------- */
.feed-block{ position:relative; }
.feed-block:before{
	content:"";
	position:absolute; inset:0;
	background:linear-gradient(120deg, rgba(20,24,10,.55) 0%, rgba(20,24,10,.28) 100%);
}
.feed-block .container{ position:relative; z-index:1; }
.feed-block .form-wrap{
	background:rgba(255,255,255,.14) !important;
	border:1px solid rgba(255,255,255,.28);
	border-radius:var(--radius-lg);
	box-shadow:var(--shadow-lg);
	-webkit-backdrop-filter:blur(8px);
	backdrop-filter:blur(8px);
}
.feed-block .form-wrap .title, .feed-block .form-wrap .desc{
	text-shadow:0 2px 10px rgba(0,0,0,.35);
}
.feed-block .form-wrap input[type=text]{
	border-radius:var(--radius-sm) !important;
}
.feed-block .form-wrap input[type=submit]{
	border-radius:999px !important;
	background:linear-gradient(135deg, var(--accent) 0%, var(--accent-dark) 100%) !important;
}

input[type=text], input[type=tel]{
	border-radius:var(--radius-sm) !important;
	border:1px solid var(--line) !important;
	transition:border-color .2s var(--ease), box-shadow .2s var(--ease);
}
input[type=text]:focus, input[type=tel]:focus{
	outline:none;
	border-color:var(--accent) !important;
	box-shadow:0 0 0 4px var(--accent-soft);
}
input[type=submit]{
	border-radius:999px !important;
	background:linear-gradient(135deg, var(--accent) 0%, var(--accent-dark) 100%) !important;
	box-shadow:var(--shadow-sm);
	font-weight:400;
}
input[type=submit]:hover{
	box-shadow:0 14px 28px rgba(135,166,46,.35);
	transform:translateY(-2px);
}

/* ---------- «У каждого бизнеса свои потребности» ---------- */
.needs .item .img{
	border-radius:var(--radius-lg);
	box-shadow:var(--shadow-sm);
	transition:box-shadow .3s var(--ease);
	overflow:hidden;
}
.needs .item .img img{
	width:100% !important;
	height:100% !important;
	max-width:none !important;
	max-height:none !important;
	-o-object-fit:cover;
	object-fit:cover;
	-o-object-position:center;
	object-position:center;
	display:block;
	transition:transform .4s var(--ease);
}
.needs .item:hover .img{ box-shadow:var(--shadow-md); }
.needs .item:hover .img img{ transform:scale(1.05); }
.needs .item .title{ font-weight:500; }

/* ---------- Наши статусы (карусель) ---------- */
.status .img.icon7{ background-image:url(../img/status-icon7.png); }
.status .img.icon8{ background-image:url(../img/status-icon8.png); }
.status .img.icon9{ background-image:url(../img/status-icon9.png); }
.status{ background:var(--paper-soft); padding-bottom:8px; }
.status .img{
	background-color:var(--paper);
	background-repeat:no-repeat;
	background-position:center;
	border-radius:var(--radius-md);
	box-shadow:var(--shadow-sm);
	transition:transform .3s var(--ease), box-shadow .3s var(--ease);
	background-size:auto 40px !important;
}
.statusCarousel{
	overflow:hidden;
	padding:6px 0 46px 0;
	-webkit-mask-image:linear-gradient(90deg, transparent 0, #000 60px, #000 calc(100% - 60px), transparent 100%);
	mask-image:linear-gradient(90deg, transparent 0, #000 60px, #000 calc(100% - 60px), transparent 100%);
}
.statusCarousel__track{
	display:flex;
	width:-webkit-max-content;
	width:max-content;
	gap:24px;
	animation:statusScroll 48s linear infinite;
}
.statusCarousel:hover .statusCarousel__track{ animation-play-state:paused; }
.statusCarousel__item{
	flex:0 0 auto;
	width:260px;
	text-align:center;
}
.statusCarousel__item .img{
	height:110px;
	background-size:auto 40px !important;
}
.statusCarousel__item:hover .img{
	transform:translateY(-3px);
	box-shadow:var(--shadow-md);
}
.statusCarousel__item .name{
	margin-top:14px;
	font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
	font-size:.86rem;
	font-weight:500;
	letter-spacing:.2px;
	color:var(--ink-soft);
	padding:0 8px;
}
@keyframes statusScroll{
	from{ transform:translateX(0); }
	to{ transform:translateX(-50%); }
}
@media (prefers-reduced-motion: reduce){
	.statusCarousel__track{ animation:none; }
}
@media (max-width:600px){
	.statusCarousel__item{ width:200px; }
}

/* ---------- Сроки перехода ---------- */
.dates .item{ position:relative; padding-left:0; }
.dates .item span{ text-shadow:0 0 30px rgba(162,191,62,.35); }

/* ---------- FAQ ---------- */
.faq .quest{
	background:var(--paper) !important;
	border:1px solid var(--line);
	border-radius:var(--radius-md) !important;
	box-shadow:var(--shadow-sm);
	transition:border-color .25s var(--ease), box-shadow .25s var(--ease);
}
.faq .quest:hover{
	border-color:var(--accent);
	box-shadow:var(--shadow-md);
}
.faq .quest .img{
	background:var(--accent-soft) !important;
	border-radius:var(--radius-md) 0 0 var(--radius-md) !important;
}
.faq .answer{
	background:var(--accent-soft) !important;
	border-radius:var(--radius-md) !important;
	margin-top:-3px !important;
}
.faq .answer .text{ color:var(--ink); }
.faq .answer .img{
	background:rgba(255,255,255,.5) !important;
	border-radius:var(--radius-md) 0 0 var(--radius-md) !important;
}
.faq .allQuest a{
	display:inline-block;
	border-radius:999px;
	padding:10px 26px;
	border:1px solid var(--accent);
	color:var(--accent-dark) !important;
	text-decoration:none !important;
	transition:background .25s var(--ease), color .25s var(--ease);
}
.faq .allQuest a:hover{ background:var(--accent); color:#fff !important; }

/* ---------- Новости (виджет 1С) ----------
   Раньше это был просто голый iframe с чёрной рамкой без заголовка,
   прямо между блоками — добавили заголовок и оформили как карточку,
   в общем стиле сайта. Сам виджет (contents) не трогаем. */
.newsBlock{
	background:var(--paper-soft);
	padding:56px 0 60px 0;
}
.newsBlock h2{
	color:var(--ink);
	font-size:2.4rem;
	font-weight:300;
	text-align:center;
	margin:0 0 32px 0;
	letter-spacing:.2px;
}
.newsBlock__frame{
	background:var(--paper);
	border-radius:var(--radius-lg);
	box-shadow:var(--shadow-md);
	padding:22px;
}
.newsBlock__frame iframe{
	display:block;
	border-radius:var(--radius-sm);
	max-width:100%;
}
@media (max-width:767px){
	.newsBlock{ padding:36px 0 40px 0; }
	.newsBlock h2{ font-size:1.8rem; margin-bottom:20px; }
	.newsBlock__frame{ padding:12px; }
}

/* ---------- Контакты / карта ---------- */
.contacts__wrapper{
	border-radius:var(--radius-lg) !important;
	box-shadow:var(--shadow-lg) !important;
	background-color:rgba(255,255,255,.9) !important;
	-webkit-backdrop-filter:blur(6px);
	backdrop-filter:blur(6px);
}
.contacts__wrapper button{
	border-radius:999px !important;
	background-image:linear-gradient(135deg, #ffc94d 0%, #ffb712 100%) !important;
	border-bottom:none !important;
	box-shadow:var(--shadow-sm);
	transition:transform .2s var(--ease), box-shadow .2s var(--ease);
}
.contacts__wrapper button:after{ display:none !important; }
.contacts__wrapper button:hover{ transform:translateY(-2px); box-shadow:var(--shadow-md); }

/* ---------- Форма «Обратная связь» ---------- */
.feedForm{ position:relative; }
.feedForm:before{
	content:"";
	position:absolute; inset:0;
	background:linear-gradient(180deg, rgba(15,17,10,.55), rgba(15,17,10,.72));
}
.feedForm .container{ position:relative; z-index:1; }
.feedForm #form{
	background:rgba(255,255,255,.06);
	border:1px solid rgba(255,255,255,.14);
	border-radius:var(--radius-lg);
	padding:28px 30px;
	-webkit-backdrop-filter:blur(4px);
	backdrop-filter:blur(4px);
}

/* ---------- Футер ---------- */
.footer{ padding:36px 0 !important; }
.footer .social a{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	border-radius:50%;
	background-color:var(--paper);
	box-shadow:var(--shadow-sm);
	transition:transform .25s var(--ease), box-shadow .25s var(--ease), background-color .25s var(--ease);
}
.footer .social a:hover{
	transform:translateY(-3px);
	background-color:var(--accent-soft);
	box-shadow:var(--shadow-md);
}

/* ---------- Модальное окно заявки ---------- */
.modal-content{
	border-radius:var(--radius-lg) !important;
	box-shadow:var(--shadow-lg) !important;
	border:none !important;
	overflow:hidden;
}
.modal-header{
	background:linear-gradient(135deg, var(--accent) 0%, var(--accent-dark) 100%) !important;
	color:#fff !important;
	justify-content:center !important;
	text-align:center;
	font-size:1.3rem;
	font-weight:700;
	padding:22px 40px !important;
}
.modalForm input[type=text]{ border-radius:var(--radius-sm) !important; }
.modalForm .sendButton input[type=submit]{ border-radius:999px !important; }

/* Крестик закрытия модального окна — аккуратный кружок с белым «X» вместо
   мелкой серой иконки img/close.png, которая терялась на зелёном фоне. */
.modal-header .close{
	background:rgba(255,255,255,.18) !important;
	border-radius:50% !important;
	width:30px !important;
	height:30px !important;
	top:50% !important;
	right:18px !important;
	margin-top:-15px;
	transition:transform .25s var(--ease), background-color .25s var(--ease);
}
.modal-header .close:hover{
	background:rgba(255,255,255,.32) !important;
	transform:rotate(90deg);
}
.modal-header .close:before,
.modal-header .close:after{
	content:"";
	position:absolute;
	left:9px;
	top:14px;
	width:12px;
	height:2px;
	background:#fff;
	border-radius:2px;
}
.modal-header .close:before{ transform:rotate(45deg); }
.modal-header .close:after{ transform:rotate(-45deg); }

/* ---------- Кнопка "наверх" ---------- */
#upPage{
	border-radius:50%;
	box-shadow:var(--shadow-md);
	transition:transform .25s var(--ease), box-shadow .25s var(--ease);
}
#upPage:hover{ transform:translateY(-3px); box-shadow:var(--shadow-lg); }

/* ---------- Окно "Связаться" ---------- */
#contactModal .modal-body{
	padding:28px 26px 30px !important;
}
#contactModal .modal-dialog{
	max-width:460px;
}
.contactChoices{
	display:flex;
	flex-direction:column;
	gap:12px;
}
.contactChoice{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:16px;
	padding:16px 18px;
	border-radius:var(--radius-md);
	background:var(--paper-soft);
	border:1px solid var(--line);
	text-decoration:none !important;
	color:var(--ink) !important;
	text-align:center;
	transition:transform .2s var(--ease), box-shadow .2s var(--ease), border-color .2s var(--ease);
}
.contactChoice:hover{
	transform:translateY(-2px);
	box-shadow:var(--shadow-sm);
	border-color:var(--accent);
}
.contactChoice .cc-ico{
	width:26px; height:26px;
	flex:0 0 auto;
	border-radius:50%;
	background-repeat:no-repeat;
	background-position:center;
	background-size:15px;
}
.contactChoice .cc-txt{
	font-size:1.02rem;
	font-weight:500;
}
.contactChoice .cc-txt small{
	display:block;
	font-weight:400;
	font-size:.78rem;
	color:var(--ink-soft);
	margin-top:2px;
}
.contactChoice.cc-tg .cc-ico{
	background-color:#29a9eb;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M21.9 3.6 2.7 11.1c-1.2.5-1.2 1.2-.2 1.5l4.9 1.5 1.9 5.8c.2.6.4.9.9.9.4 0 .6-.2.9-.5l2.1-2 4.4 3.2c.8.4 1.3.2 1.6-.7l2.8-13.1c.4-1.2-.3-1.7-1.1-1.1zM8.6 13.4l9-5.6c.5-.3.9-.1.5.2l-7.4 6.7-.3 3.3z'/%3E%3C/svg%3E");
}
.contactChoice.cc-wa .cc-ico{
	background-color:#25D366;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M12 2C6.5 2 2 6.5 2 12c0 1.8.5 3.5 1.3 5L2 22l5.2-1.4c1.4.8 3.1 1.2 4.8 1.2 5.5 0 10-4.5 10-10S17.5 2 12 2zm5.8 14.3c-.2.7-1.4 1.3-2 1.4-.5.1-1.1.1-1.8-.1-.4-.1-1-.3-1.7-.6-3-1.3-4.9-4.3-5.1-4.5-.1-.2-1.2-1.6-1.2-3.1s.8-2.2 1.1-2.5c.3-.3.6-.4.8-.4h.6c.2 0 .5 0 .7.5.3.7.9 2.1 1 2.3.1.2.1.4 0 .6-.1.2-.2.4-.4.6-.2.2-.4.4-.2.8.3.5 1.2 1.9 2.6 3 1.7 1.4 2.1 1.5 2.5 1.4.4-.1.9-.5 1.2-.9.2-.4.5-.3.9-.2.4.2 2.1 1 2.5 1.2.4.2.6.3.7.4.1.2.1.9-.1 1.6z'/%3E%3C/svg%3E");
}
.contactChoice.cc-max .cc-ico{
	background-color:#1f2430;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M4 4h16a1 1 0 0 1 1 1v11a1 1 0 0 1-1 1H9l-4.4 3.3A.6.6 0 0 1 3.7 20V16H4a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1z'/%3E%3C/svg%3E");
}
.contactChoice.cc-phone .cc-ico{
	background-color:var(--accent);
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6 19.8 19.8 0 0 1-3.1-8.7A2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1 1 .3 2 .6 3a2 2 0 0 1-.5 2.1L8 10a16 16 0 0 0 6 6l1.2-1.2a2 2 0 0 1 2.1-.5c1 .3 2 .5 3 .6a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E");
	background-size:13px;
}

/* ---------- Галочка «согласие на обработку персональных данных» ----------
   Заменяет плоский зелёный квадратик (img/checkbox.png) на аккуратный
   чекбокс со скруглением, рамкой и белой галочкой при выборе.
   Затрагивает все формы сайта: модалки «Связаться»/«Оформить заказ»
   и форму «Запросите обратный звонок» — везде одинаковая разметка. */
.checkboxField{
	padding:6px 0 5px 0 !important;
}
.checkboxField input[type=checkbox]{
	visibility:hidden;
	width:0;
	position:absolute;
	left:-99999px;
}
.privacyLabel,
.checkboxField input[type=checkbox] + label{
	display:block !important;
	cursor:pointer;
	text-align:left;
	line-height:20px;
}
.checkboxField input[type=checkbox] + label:before{
	content:"" !important;
	display:inline-block !important;
	vertical-align:-5px;
	width:20px;
	height:20px;
	margin:0 11px 0 0 !important;
	top:0 !important;
	border-radius:6px;
	border:2px solid var(--line);
	background:var(--paper) !important;
	background-repeat:no-repeat;
	background-position:center;
	background-size:12px;
	box-sizing:border-box;
	transition:background-color .2s var(--ease), border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.checkboxField input[type=checkbox]:hover + label:before{
	border-color:var(--accent);
}
.checkboxField input[type=checkbox]:checked + label:before{
	background-color:var(--accent) !important;
	border-color:var(--accent) !important;
	background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='4 12 9 17 20 6'/%3E%3C/svg%3E") !important;
	background-repeat:no-repeat !important;
	background-position:center !important;
	background-size:12px !important;
}
/* Тёмная секция «Запросите обратный звонок» — рамка светлее для контраста на фото-фоне */
.feed-block .checkboxField input[type=checkbox] + label:before{
	border-color:rgba(255,255,255,.55);
	background-color:rgba(255,255,255,.1) !important;
}
.feed-block .checkboxField input[type=checkbox]:checked + label:before{
	background-color:var(--accent) !important;
	border-color:var(--accent) !important;
}

@media (max-width: 767px){
	.indexSlider .content{ padding:24px 22px !important; }
	.complect .item{ padding:26px 20px !important; }
	.feed-block .form-wrap{ padding:24px 20px; }
}

/* ---------- Кастомный анимированный курсор (точка + кольцо), js/cursor.js ----------
   Не заменяет системный курсор — декоративные точка и кольцо поверх него,
   следуют за мышью и увеличиваются/подсвечиваются при наведении на ссылки,
   кнопки, карточки и пункты меню. Включается только при pointer:fine и
   с учётом prefers-reduced-motion (см. js/cursor.js). */
.cursor-dot,.cursor-ring{
	position:fixed;top:0;left:0;z-index:9999;pointer-events:none;border-radius:50%;
	transform:translate(-50%,-50%);opacity:0;transition:opacity .3s;
}
.cursor-dot{
	width:6px;height:6px;background:var(--accent-dark);
}
.cursor-ring{
	width:34px;height:34px;border:1.5px solid rgba(150,192,44,.55);
	transition:opacity .3s,width .28s var(--ease),height .28s var(--ease),background .28s,border-color .28s;
}
.cursor-ring.is-hover{
	width:56px;height:56px;background:rgba(150,192,44,.13);border-color:rgba(108,138,32,.8);
}
@media (hover:none),(pointer:coarse){
	.cursor-dot,.cursor-ring{ display:none; }
}

/* Статусы: логотипы разных пропорций вписываются в плашку целиком, с одинаковыми полями
   (раньше у всех была фиксированная высота 40px — широкие обрезались, высокие выглядели мелко) */
.statusCarousel__item .img{
	background-size:contain !important;
	background-origin:content-box;
	box-sizing:border-box;
	padding:26px 30px;
}
@media (max-width:767px){
	.statusCarousel__item .img{ padding:24px 22px; }
}