/**
 * DX-Systems — кастомные стили темы.
 *
 * Перенесено из Elementor -> Custom Code.
 * ВАЖНО: после подключения этого файла тот сниппет нужно удалить,
 * иначе стили будут дублироваться в двух местах.
 *
 * Внимание на .elementor-kit-95 в селекторах: это ID набора настроек
 * Elementor текущего сайта. Он нужен для веса селектора, но если кит
 * когда-нибудь пересоздадут, номер сменится и эти правила перестанут
 * применяться. Тогда искать надо будет именно здесь.
 */

/* --- Слайдер миниатюр в галерее товара --- */

.thumbs-slider-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	margin: 10px auto;
	max-width: 480px;
}

.flex-control-nav.flex-control-thumbs {
	display: flex !important;
	gap: 15px;
	overflow-x: auto;
	scroll-behavior: smooth;
	padding: 0;
	list-style: none;
	scrollbar-width: none;
	margin: 0 !important;
}

.flex-control-nav.flex-control-thumbs::-webkit-scrollbar {
	display: none;
}

.woocommerce div.product div.images .flex-control-thumbs li {
	flex: 0 0 auto;
	height: auto;
	aspect-ratio: 1/1;
	padding: 0 !important;
}

.flex-control-nav.flex-control-thumbs img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	cursor: pointer;
}

/* --- Стрелки слайдера миниатюр --- */

.elementor-kit-95 .thumbs-prev,
.elementor-kit-95 .thumbs-next {
	background: transparent;
	color: #5F5E5D;
	border: none;
	cursor: pointer;
	font-size: 16px;
	flex-shrink: 0;
	padding: 12px !important;
}

.elementor-kit-95 .thumbs-prev:hover,
.elementor-kit-95 .thumbs-next:hover,
.elementor-kit-95 .thumbs-prev:focus,
.elementor-kit-95 .thumbs-next:focus,
.elementor-kit-95 .thumbs-prev:active,
.elementor-kit-95 .thumbs-next:active {
	border: none;
	background: transparent;
	color: #5F5E5D;
}

.thumbs-prev.disabled,
.thumbs-next.disabled {
	opacity: 0.4;
	cursor: default;
	pointer-events: none;
}

/* --- Вкладки: скрытие разделителя у соседа активной вкладки --- */

.hide-after::after {
	display: none;
}

/* --- Раскладка миниатюр --- */

@media (max-width: 767px) {
	.woocommerce div.product div.images .flex-control-thumbs li {
		width: calc((100% - 15px * 2) / 3);
	}
}

@media (min-width: 768px) {
	.woocommerce div.product div.images .flex-control-thumbs li {
		width: calc((100% - 15px * 4) / 5);
	}
}

@media (min-width: 1024px) {
	.thumbs-slider-wrapper {
		max-width: 100%;
	}

	.elementor-kit-95 .thumbs-prev,
	.elementor-kit-95 .thumbs-next {
		font-size: 22px;
	}
}


/* ==========================================================================
   Интерактивные видеоблоки на страницах приборов
   Перенесено из Elementor -> Custom Code, ТРИ отдельных сниппета.

     .video_block_new  — BRAINTEST
     .video_block      — BRAINTEST, второй блок на той же странице
     .video_block-two  — M-TEST

   ПЕРЕНОС ДОСЛОВНЫЙ. Селекторы НЕ объединялись между блоками, порядок
   правил сохранён, повторяющиеся объявления оставлены как есть.
   Причина: в исходнике .try-me описана дважды подряд, а потом ещё раз
   в общем правиле с .submit-btn и .stimul — и порядок этих правил
   в двух блоках РАЗНЫЙ. В .video_block общее правило идёт после,
   в .video_block-two — перед. От порядка зависит, какой фон, отступы
   и позиция победят. Объединение селекторов ломает внешний вид.

   Единственная правка — пути к картинкам: с абсолютных
   /wp-content/themes/hello-elementor/assets/images/ на относительные
   ../images/, чтобы не сломались при переименовании папки темы.
   Все 10 файлов на месте, проверено.
   ========================================================================== */

/* ---------- Сниппет 1: .video_block_new ---------- */

.video_block_new {
    position: relative;
    padding: 0 170px;
	margin: 0 0 50px;
}

.video_new {
		background: url('../images/pc.png') center center / cover no-repeat;
    width: 100%;
    display: block;
		padding: 21px 51px 78px;
    height: 750px;
}
.video_block_new .start-descr {
    border: none;
    background: transparent;
		color: #FF770E;
    border-radius: 5px;
    padding: 10px;
    color: #FF770E;
    font-family: "Segoe UI", Sans-serif;
    position: absolute;
		    top: -3%;
    left: 26%;
    font-size: 56px;
	    animation: pulse2 1.8s ease-out infinite;
}
	.video_block_new .start-descr:before {
		content: '';
    position: absolute;
    background: url(../images/arrow-t.svg) center center / cover no-repeat;
    display: block;
    width: 29px;
    height: 49px;
    bottom: -50px;
    left: -7px;
	}
.video_block_new .start {
    border: none;
    border-radius: 5px;
    padding: 10px;
    color: #fff;
    font-family: "Segoe UI", Sans-serif;
    position: absolute;
		top: 10%;
    left: 22%;
    font-size: 36px;
		background: #FF770E;
    width: 40px;
    height: 40px;
}
	.video_block_new .start:before {
		content: '';
		background: url(../images/paly_white.svg) center center / cover no-repeat;
		width: 20px;
    height: 20px;
    display: block;
}
.video_block_new .change,
.video_block_new .final {
    display: none;
}

.video_block_new .change {
    border: none;
    background: #FF770E;
    border-radius: 5px;
    padding: 10px;
    color: #fff;
    font-family: "Segoe UI", Sans-serif;
    position: absolute;
    top: 45%;
    left: 15%;
    font-size: 28px;
}

.video_block_new .final {
    border: none;
    background: #FF770E;
    border-radius: 5px;
    padding: 10px;
    color: #fff;
    font-family: "Segoe UI", Sans-serif;
    position: absolute;
    top: 72%;
    left: 38%;

    font-size: 28px;
}
@keyframes pulse2 {
    0% {
        transform: scale(1);
    }

    70% {
        transform: scale(1.08);
    }

    100% {
        transform: scale(1);
    }
}
@keyframes pulse {
    0% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(243, 143, 28, 0.616);
    }

    70% {
        transform: scale(1.08);
        box-shadow: 0 0 10px 5px rgba(243, 143, 28, 0.616);
    }

    100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(243, 143, 28, 0.616);
    }
}

.video_block_new .start,
.video_block_new .change,
.video_block_new .final {
    animation: pulse 1.8s ease-out infinite;
}
.video_block_new .start:hover,
.video_block_new .change:hover,
	.video_block_new .final:hover {
		background: rgba(255, 255, 255, 1);
    border: 2px solid rgba(255, 119, 14, 1);
    color: #FF770E;
	}
	.video_block_new .start:hover:before {
		background: url(../images/play_orange.svg) center center / cover no-repeat;
	}

@media (max-width: 1440px) {
	.video_block_new {
    padding: 0 150px;
}
   .video_new {
		padding: 32px 45px 74px;
		height: 660px;
}
.video_block_new .start-descr {
		    top: -5%;
}

.video_block_new .final {
		top: 72%;
        left: 35%;
}

@media (max-width: 1365px) {
    .video_block_new {
        display: none;
    }
}

}

/* ---------- Сниппет 2: .video_block ---------- */

.video_block {
    position: relative;
	padding: 0 170px 100px;
}

.video {
    background: url('../images/pc.png') center center / cover no-repeat;
    padding: 21px 51px 78px;
    height: 750px;
}

.video_block .video {
    width: 100%;
    display: block;
}

@keyframes pulseText {
    0% {
        transform: scale(1);
        text-shadow: 0 0 0 rgba(0, 0, 0, 0);
        opacity: 1;
    }

    50% {
        transform: scale(var(--pulse-scale));
        text-shadow:
            0 8px 20px var(--shadow-color),
            0 0 18px rgba(255, 255, 255, 0.06);
        opacity: 0.96;
    }

    100% {
        transform: scale(1);
        text-shadow: 0 0 0 rgba(0, 0, 0, 0);
        opacity: 1;
    }
}

.video_block .stimul:hover,
.video_block .submit-btn:hover {
    background: rgba(255, 255, 255, 1);
    border: 2px solid rgba(255, 119, 14, 1);
    color: #FF770E;
}

.video_block .try-me {
    display: block;
    border-radius: 2px;
    position: absolute;
		top: 128px;
    left: 45%;
    background: rgba(255, 255, 255, 1);
    border: 1px solid rgba(255, 119, 14, 1);
    padding: 0;
    box-shadow:
        0px 6.62px 6.62px 6.62px rgba(245, 148, 34, 0.5),
        0px 6.62px 6.62px 0px rgba(0, 0, 0, 0.25);
}
	.video_block .try-me {
		padding: 0;
		display: flex;
		gap: 5px;
		text-align: center;
    padding: 5px 10px;
    align-items: center;
		top: 12%;
    left: 39%;
	}
.video_block .try-me:before {
    content: '';
    display: block;
    background: url('../images/flash.svg') center center/cover no-repeat;
    width: 12px;
    height: 18px;
}
.video_block-two .stimul:hover::before {
    content: '';
    background: url('../images/flash-b.svg') center center/cover no-repeat;
    display: block;
    width: 12px;
    height: 18px;
}
.video_block .try-me:hover {
    background: rgba(255, 255, 255, 1);
    border-radius: 2px;
    border: 1px solid rgba(255, 119, 14, 1);
    transform: scale(1.05) translateZ(0);
}
.video_block .try-me,
.video_block .submit-btn,
.video_block .stimul {
    position: absolute;
    top: 15%;
    left: 50%;
    transform: translateX(-50%);
    background: #FF770E;
    padding: 15px 60px;
    color: #fff;
    border: none;
    border-radius: 8px;
    box-shadow: 0 0 0 0 rgba(245, 148, 34, 0.6);
    animation: pulse 1.8s ease-out infinite;
    cursor: pointer;
    font-size: 18px;
    display: inline-block;
    text-align: center;
}

.video_block .submit-btn {
    display: none;
  	top: 26%;
    left: 57%;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    padding: 10px 25px;
}

.video_block .submit-btn::before {
    content: '';
    background: url('../images/submit.svg') center center/cover no-repeat;
    display: block;
    width: 18px;
    height: 18px;
}

.video_block .submit-btn:hover::before {
    content: '';
    background: url('../images/submit-o.svg') center center/cover no-repeat;
    display: block;
    width: 18px;
    height: 18px;
}

.video_block .title {
    color: #FF770E;
    font-family: "Segoe UI", Sans-serif;
    position: absolute;
    top: 4px;
    left: 49%;
    font-size: 52px;
    --pulse-scale: 1.08;
    --pulse-duration: 1.9s;
    --shadow-color: rgba(0, 0, 0, 0.18);
    animation: pulseText var(--pulse-duration) ease-in-out infinite;
    transform-origin: center;
}

.video_block .title:before {
    content: '';
    position: absolute;
    background: url('../images/arrow-t.svg') center center / cover no-repeat;
    display: block;
    width: 37px;
    height: 62px;
    bottom: -85px;
    left: -17px;
}

.video_block .stimul {
    display: none;
    top: 15.5%;
    left: 48%;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    padding: 10px 25px;
}

.video_block .stimul::before {
    content: '';
    background: url('../images/stimul.svg') center center/cover no-repeat;
    display: block;
    width: 18px;
    height: 18px;
}

.video_block .stimul:hover::before {
    content: '';
    background: url('../images/stimul-o.svg') center center/cover no-repeat;
    display: block;
    width: 18px;
    height: 18px;
}

.video_block .visible {
    display: flex;
}

.video_block .hidden {
    display: none;
}

/* ========== Адаптив ========== */
@media (max-width: 1440px) {
    .video_block {
			display: block;
			padding: 0 150px 90px;
    }

    .video {
        background: url('../images/pc.png') center center / cover no-repeat;
			padding: 32px 45px 74px;
        height: 660px;
    }
		.video_block .try-me {
			top: 117px;
			left: 45.5%;
		}
		.video_block .title {
			top: 2px;
   	 left: 49%;
		}
		.video_block .submit-btn {
			top: 26.5%;
    	left: 57%;
		}

}

@media (max-width: 1024px) {
    .video_block {
        padding: 0 100px;
				display:none
    }

    .video {
        background: url('../images/pc.png') center center / cover no-repeat;
        padding: 24px 36px 50px;
        height: 528px;
    }

    .video_block .try-me {
        font-size: 14px;
        left: 40%;
    }

    .video_block .submit-btn {
        top: 15%;
        left: 69%;
        font-size: 14px;
    }

    .video_block .stimul {
        font-size: 14px;
    }

    .video_block .stimul::before {
        width: 14px;
        height: 14px;
    }

    .video_block .submit-btn::before {
        width: 14px;
        height: 14px;
    }
}

@media (max-width: 960px) {
    .video_block {
        display: none;
    }
}

@media (max-width: 768px) {
    .video_block {
        display: none;
    }

    .video_block .try-me,
    .video_block .submit-btn {
        padding: 10px 40px;
        font-size: 12px;
        left: 35%;
    }
}

/* ---------- Сниппет 3: .video_block-two ---------- */

.video_block-two {
    position: relative;
		padding: 0 170px 100px;
}

.video-two {
    background: url('../images/pc.png') center center / cover no-repeat;
    padding: 21px 53px 78px;
    height: 750px;
}

.video_block-two .video-two {
    width: 100%;
    display: block;
}

.video_block-two .stimul:hover,
.video_block-two .submit-btn:hover {
    background: rgba(255, 255, 255, 1);
    border: 2px solid rgba(255, 119, 14, 1);
		color: #FF770E;
}

.video_block-two .try-me {
    display: block;
    border-radius: 2px;
    position: absolute;
    top: 90px;
    left: 42.5%;
    background: rgba(255, 255, 255, 1);
    border: 1px solid rgba(255, 119, 14, 1);
		padding: 0;
    box-shadow:
        0px 6.62px 6.62px 6.62px rgba(245, 148, 34, 0.5),
        0px 6.62px 6.62px 0px rgba(0, 0, 0, 0.25);
}
	.video_block-two .try-me:before {
		content: '';
		display: block;
		background: url('../images/flash.svg') center center/cover no-repeat;
		width: 12px;
    height: 18px;
	}
	.video_block-two .try-me:hover {
		background: rgba(255, 255, 255, 1);
		border-radius: 2px;
		border: 1px solid rgba(255, 119, 14, 1);
		transform: scale(1.05) translateZ(0);
		color: rgba(255, 119, 14, 1);
	}
	.video_block-two .try-me:hover::before {
		background: url('../images/flash-b.svg') center center/cover no-repeat;
	}
.video_block-two .try-me,
.video_block-two .submit-btn,
.video_block-two .stimul {
    position: absolute;
    top: 15%;
    left: 50%;
    transform: translateX(-50%);
    background: #FF770E;
    padding: 15px 60px;
    color: #fff;
    border: none;
    border-radius: 2px;
    box-shadow: 0 0 0 0 rgba(245, 148, 34, 0.6);
    animation: pulse 1.8s ease-out infinite;
    cursor: pointer;
    font-size: 18px;
    display: inline-block;
    text-align: center;
}
	.video_block-two .try-me {
		padding: 0;
		display: flex;
		gap: 5px;
		text-align: center;
    padding: 5px 10px;
    align-items: center;
		top: 12%;
    left: 39%;
	}
.video_block-two .submit-btn {
    display: none;
    top: 17%;
    left: 69%;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    padding: 10px 25px;
}

.video_block-two .submit-btn::before {
    content: '';
    background: url('../images/submit.svg') center center/cover no-repeat;
    display: block;
    width: 18px;
    height: 18px;
}
.video_block-two .submit-btn:hover::before {
    content: '';
    background: url('../images/submit-o.svg') center center/cover no-repeat;
    display: block;
    width: 18px;
    height: 18px;
}
.video_block-two .title {
    color: #FF770E;
    font-family: "Segoe UI", Sans-serif;
    position: absolute;
    top: -10px;
    left: 47%;
    font-size: 52px;
    --pulse-scale: 1.08;
    --pulse-duration: 1.9s;
    --shadow-color: rgba(0, 0, 0, 0.18);
    animation: pulseText var(--pulse-duration) ease-in-out infinite;
    transform-origin: center;
}

.video_block-two .title:before {
    content: '';
    position: absolute;
    background: url('../images/arrow-t.svg') center center / cover no-repeat;
    display: block;
		width: 29px;
    height: 49px;
    bottom: -67px;
    left: -7px;
}

.video_block-two .stimul {
    display: none;
    top: 15.5%;
    left: 48%;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    padding: 10px 25px;
}

.video_block-two .stimul::before {
    content: '';
    background: url('../images/flash.svg') center center/cover no-repeat;
    display: block;
    width: 12px;
    height: 18px;
}
.video_block-two .stimul:hover::before {
    content: '';
    background: url('../images/flash-b.svg') center center/cover no-repeat;
    display: block;
    width: 12px;
    height: 18px;
}
.video_block-two .visible {
    display: flex;
}

.video_block-two .hidden {
    display: none;
}

/* ========== Адаптив ========== */
@media (max-width: 1440px) {
    .video_block-two {
       padding: 0 150px 90px;
    }

    .video-two {
        background: url('../images/pc.png') center center / cover no-repeat;
        padding: 32px 45px 74px;
        height: 660px;
    }
}

@media (max-width: 960px) {
    .video_block-two {
        padding: 0 100px;
    }

    .video-two {
        background: url('../images/pc.png') center center / cover no-repeat;
        padding: 24px 36px 50px;
        height: 528px;
    }

    .video_block-two .try-me {
        font-size: 14px;
        left: 40%;
    }

    .video_block-two .submit-btn {
        top: 15%;
        left: 69%;
        font-size: 14px;
    }

    .video_block-two .stimul {
        font-size: 14px;
    }

    .video_block-two .stimul::before {
        width: 14px;
        height: 14px;
    }

    .video_block-two .submit-btn::before {
        width: 14px;
        height: 14px;
    }
}

@media (max-width: 960px) {
    .video_block-two {
        display: none;
    }
}

@media (max-width: 768px) {
    .video_block-two {
        display: none;
    }

    .video_block-two .try-me,
    .video_block-two .submit-btn {
        padding: 10px 40px;
        font-size: 12px;
        left: 35%;
    }
}
