https://inchbyinch.ru/local/templates/inch/js/main.js?174601195347439

1const formsTargets = {
2	"modal-ekskursia": "excursion",
3	"ekskursia-green": "excursion",
4	"modal-material": "free",
5	chek: "chek",
6	feedback: "Feedback",
7	"modal-postuplenie": "zayavka",
8	diagnostika: "diagnostika",
9	"modal-degustation": "degustation",
10	"modal-menu": "menu",
11	"modal-callback": "zvonok",
12};
13
14/* Отправка формы в php BEGIN */
15document.addEventListener("DOMContentLoaded", function () {
16	const ajaxForms = document.querySelectorAll(".ajax-form");
17	ajaxForms.forEach((form) => {
18		form.addEventListener("submit", async (event) => {
19			event.preventDefault();
20			onFormSubmit(form);
21		});
22	});
23
24	const onFormSubmit = async (form) => {
25		const submitBtn = form.querySelector('[type="submit"]');
26		const formData = new FormData(form);
27		const thanksModal = form.dataset.thanks === undefined ? "#modal-thanks" : form.dataset.thanks;
28		const ymTarget = form.dataset.ymtarget === undefined ? '' : form.dataset.ymtarget;
29
30		// if validation clean
31		if (!isValidForm(form)) return;
32
33		// submit button disable
34		submitBtn.disabled = true;
35		submitBtn.classList.add("loading");
36		const submitBtnText = submitBtn.textContent;
37		submitBtn.textContent = "Обработка...";
38
39		// add input labels to formData
40		const inputWithLabels = form.querySelectorAll("[data-label]");

41		inputWithLabels.forEach((input) => {
42			const cleanInputName = input.name.replace("[]", ""); // подготовка при множественных чекбоксах
43			const input_label__name = `${cleanInputName}_label`;
44			const input_label__value = input.dataset.label.toString();
45			formData.set(input_label__name, input_label__value);
46		});
47
48		// do request
49		let response = await fetch("/ajax/send.php", {
50			method: "POST",
51			body: formData,
52		});
53
54		// submit button enable
55		setTimeout(() => {
56			submitBtn.classList.remove("loading");
57			submitBtn.disabled = false;
58			submitBtn.textContent = submitBtnText;
59		}, 3000);
60
61		// server errors
62		if (!response.ok) {
63			console.log("HTTP error: " + response.status);
64			Fancybox.close();
65			Fancybox.show([{ src: "#modal-error" }]);
66			return;
67		}
68
69		// Response is not JSON
70		if (response.headers.get("Content-Type") !== "application/json") {
71			console.log("Response header Content-Type (need application/json): " + response.headers.get("Content-Type"));
72			console.log("Respons data: \n" + (await response.text()));
73			Fancybox.close();
74			Fancybox.show([{ src: "#modal-error" }]);
75			return;
76		}
77
78		// get response in json
79		let result = await response.json();
80		console.log(result);
81
82		Fancybox.close();
83
84		// often requests
85		if (result.errors == "Request already sended") {
86			Fancybox.show([{ src: "#modal-error-repeat" }]);
87			return;
88		}
89
90		if (result.mailSended) {
91			setTimeout(() => {
92				Fancybox.show([{ src: thanksModal }]);
93			}, 600);
94			setTimeout(() => {
95				Fancybox.close();
96			}, 5000);
97			form.reset();
98			try {
99				yandexTarget();
100				if (ymTarget.length > 0){
101					console.log(`Send YMTarget: ${ymTarget}`);
102					ym(97191043, 'reachGoal', ymTarget);
103				}
104			} catch (error) {
105				console.log(error);
106			}
107		} else {
108			Fancybox.show([{ src: "#modal-error" }]);
109		}
110
111		function yandexTarget() {
112			const formParent = form.closest(".modal");
113			const isAjaxForm = form.closest(".green-form");
114
115			if (formParent) {
116				const formParentID = formParent.id;
117				const yandexMetricTarget = formsTargets[formParentID];
118
119				if (yandexMetricTarget) {
120					console.log(yandexMetricTarget);
121
122					ym(97191043, "reachGoal", yandexMetricTarget);
123				}
124			}
125
126			if (isAjaxForm) {
127				const ajaxFormID = isAjaxForm.id;
128				const yandexMetricTarget = formsTargets[ajaxFormID];
129				if (yandexMetricTarget) {
130					console.log(yandexMetricTarget);
131
132					ym(97191043, "reachGoal", yandexMetricTarget);
133				}
134			}
135		}
136
137
138		
139	};
140
141	const isValidForm = (form) => {
142		const requiredFields = form.querySelectorAll('[data-req="true"]');
143		let isValid = true;
144
145		requiredFields.forEach((field) => {
146			if (field.value.length <= 0) {
147				field.classList.add("error");
148				isValid = false;
149			}
150			if (field.matches('input[type="checkbox"]')) {
151				if (field.checked !== true) {
152					field.classList.add("error");
153					isValid = false;
154				}
155			}
156			if (field.matches('input[type="tel"]')) {
157				if (field.value.length < 18) {
158					field.classList.add("error");
159					isValid = false;
160				}
161			}
162		});
163
164		requiredFields.forEach((field) => {
165			field.addEventListener("click", () => {
166				field.classList.remove("error");
167			});
168		});
169
170		if (isValid) {
171			return true;
172		} else {
173			return false;
174		}
175	};
176});
177/* Отправка формы в php END */
178
179
180// Цели в Яндекс.Метрике DEV-1234 START
181document.addEventListener("DOMContentLoaded", function () {
182
183		
184		const clickTeam = document.querySelectorAll('[data-trigger="click_team"]');
185		const clickVideo = document.querySelectorAll('[data-trigger="click_video"]');
186		const clickConcept = document.querySelectorAll('[data-trigger="click_concept"]');
187		const clickReview = document.querySelectorAll('[data-trigger="click_reviews"]');
188		const clickPhoto = document.querySelectorAll('[data-trigger="click_photo"]');
189
190
191		const triggers = [...clickTeam, ...clickVideo, ...clickConcept, ...clickReview, ...clickPhoto];
192		
193

194			triggers.forEach((item) => {
195		 	item.addEventListener("click", yandexTargetStaticElement);
196		 });
197
198		 function yandexTargetStaticElement() {
199			const target = this.getAttribute("data-trigger");	
200			console.log(target);
201			ym(97191043, "reachGoal", target);
202			
203		}
204
205		
206
207		
208});	
209
210// Цели в Яндекс.Метрике DEV-1234 END
211
212/* Phone inputs mask BEGIN */
213document.addEventListener("DOMContentLoaded", function () {
214	const telinputs = document.querySelectorAll("input[type='tel']");
215	telinputs.forEach((input) => {
216		var keyCode;
217		function mask(event) {
218			event.keyCode && (keyCode = event.keyCode);
219			var pos = this.selectionStart;
220			if (pos < 3) event.preventDefault();
221			var matrix = "+7 (___) ___-__-__",
222				i = 0,
223				def = matrix.replace(/\D/g, ""),
224				val = this.value.replace(/\D/g, ""),
225				new_value = matrix.replace(/[_\d]/g, function (a) {
226					return i < val.length ? val.charAt(i++) : a;
227				});
228			i = new_value.indexOf("_");
229			if (i != -1) {
230				i < 5 && (i = 3);
231				new_value = new_value.slice(0, i);
232			}
233			var reg = matrix
234				.substr(0, this.value.length)
235				.replace(/_+/g, function (a) {
236					return "\\d{1," + a.length + "}";
237				})
238				.replace(/[+()]/g, "\\$&");
239			reg = new RegExp("^" + reg + "$");
240			if (!reg.test(this.value) || this.value.length < 5 || (keyCode > 47 && keyCode < 58)) {
241				this.value = new_value;
242			}
243			if (event.type == "blur" && this.value.length < 5) {
244				this.value = "";
245			}
246		}
247
248		input.addEventListener("input", mask, false);
249		input.addEventListener("focus", mask, false);
250		input.addEventListener("blur", mask, false);
251		input.addEventListener("keydown", mask, false);
252	});
253});
254/* Phone inputs mask END */
255
256/* UTM to Forms Begin */
257document.addEventListener("DOMContentLoaded", function () {
258	if (window.localStorage) {
259		const params = new URLSearchParams(window.location.search);
260		const utmParams = ["utm_source", "utm_medium", "utm_content", "utm_campaign", "utm_term"];
261		utmParams.forEach((param) => {
262			const value = params.get(param);
263			if (value !== null && value !== "") {
264				localStorage.setItem(param, value);
265			}
266		});
267	} else {
268		console.error("No localStorage in window");
269	}
270
271	const forms = document.querySelectorAll("form");
272	forms.forEach((form) => {
273		const utmParams = ["source", "medium", "content", "term", "campaign"];
274		utmParams.forEach((param) => {
275			const input = document.createElement("input");
276			input.type = "hidden";
277			input.name = `utm_${param}`;
278			input.value = localStorage.getItem(`utm_${param}`) || "";
279			form.appendChild(input);
280		});
281	});
282});
283/* UTM to Forms End */
284
285/* fancybox BEGIN */
286Fancybox.defaults.placeFocusBack = false;
287Fancybox.defaults.autoFocus = false;
288Fancybox.defaults.trapFocus = false;
289Fancybox.defaults.compact = false;
290Fancybox.defaults.Toolbar = {
291	display: {
292		left: ["infobar"],
293		middle: ["zoomIn", "zoomOut"],
294		right: ["close"],
295	},
296};
297Fancybox.defaults.l10n = {
298	CLOSE: "Закрыть",
299	NEXT: "Дальше",
300	PREV: "Назад",
301	MODAL: "Вы можете закрыть данное окно, нажав клавишу ESC",
302	ERROR: "Что-то пошло не так. Пожалуйста, повторите попытку позже",
303	IMAGE_ERROR: "Изображение не найдено",
304	ELEMENT_NOT_FOUND: "HTML элемент не найден",
305	AJAX_NOT_FOUND: "Ошибка загрузки AJAX : Не найдено",
306	AJAX_FORBIDDEN: "Ошибка загрузки AJAX : Запрещено",
307	IFRAME_ERROR: "Ошибка загрузки страницы",
308	TOGGLE_ZOOM: "Переключить уровень масштаба",
309	TOGGLE_THUMBS: "Переключить эскиз",
310	TOGGLE_SLIDESHOW: "Переключить презентацию",
311	TOGGLE_FULLSCREEN: "Переключить режим полного экрана",
312	DOWNLOAD: "Скачать",
313	ZOOMIN: "Увеличить",
314	ZOOMOUT: "Уменьшить",
315};
316
317function initFancy() {
318	Fancybox.bind(".fancy");
319
320	Fancybox.bind(".fancy-modal", {
321		dragToClose: false,
322	});
323
324	Fancybox.bind(".fancy-video", {
325		dragToClose: false,
326	});
327
328	Fancybox.bind(".fancy-map", {
329		dragToClose: false,
330		defaultType: "iframe",
331	});
332}
333
334document.addEventListener("DOMContentLoaded", function () {
335	initFancy();
336});
337/* fancybox END */
338
339/* Прокрутка к секциям BEGIN */
340document.addEventListener("DOMContentLoaded", function () {
341	const links = document.querySelectorAll(".scrollto");
342	links.forEach((link) => {
343		link.addEventListener("click", (event) => {
344			event.preventDefault();
345			if (link.getAttribute("href").length <= 0) return;
346			const target = document.querySelector(`${link.getAttribute("href")}`);
347			if (target == null) return;
348			let headerH = 110;
349			if (window.matchMedia("(max-width: 1600px)").matches) {
350				headerH = 70;
351			}
352			if (window.matchMedia("(max-width: 1250px)").matches) {
353				headerH = 0;
354			}
355			const scrollVal = target.getBoundingClientRect().top + window.scrollY - headerH - 20;
356			window.scrollTo({
357				top: scrollVal,
358				behavior: "smooth",
359			});
360		});
361	});
362});
363/* Прокрутка к секциям END */
364
365/* Anim Observer BEGIN */
366document.addEventListener("DOMContentLoaded", function () {
367	const elements = document.querySelectorAll(".anim");
368	const options = {
369		rootMargin: "-50px 0px",
370		threshold: 0,
371	};
372	const callback = (entries) => {

373		entries.forEach((entry) => {
374			if (entry.intersectionRatio > 0) {
375				entry.target.classList.add("animated");
376				observer.unobserve(entry.target);
377			} else {
378				//entry.target.classList.remove('animated');
379			}
380		});
381	};
382
383	const observer = new IntersectionObserver(callback, options);
384
385	elements.forEach((element) => {
386		observer.observe(element);
387	});
388});
389/* Anim Observer END */
390
391/* Lozad BEGIN */
392function initLozad() {
393	const observerLozad = lozad(".lozad", {
394		rootMargin: "500px 500px",
395		threshold: 0,
396		enableAutoReload: true,
397	});
398	observerLozad.observe();
399}
400
401document.addEventListener("DOMContentLoaded", function () {
402	initLozad();
403});
404/* Lozad END */
405
406/* header Begin */
407document.addEventListener("DOMContentLoaded", function () {
408	const header = document.querySelector(".s-header");
409	let offset = 10;
410	const intro = document.querySelector(".s-intro");
411
412	if (intro) {
413		offset = intro.clientHeight;
414	}
415
416	document.addEventListener("scroll", () => {
417		if (window.scrollY > offset) {
418			header.classList.add("scrolled");
419		} else {
420			header.classList.remove("scrolled");
421		}
422	});
423});
424/* header End */
425
426/* Mob menu Begin */
427document.addEventListener("DOMContentLoaded", function () {
428	const burger = document.querySelector(".burger");
429	const menu = document.querySelector(".mob-panel");
430
431	burger.addEventListener("click", () => {
432		if (menu.classList.contains("active")) {
433			closeMenu();
434		} else {
435			openMenu();
436		}
437	});
438
439	function openMenu() {
440		burger.classList.add("active");
441		menu.classList.add("active");
442	}
443
444	function closeMenu() {
445		burger.classList.remove("active");
446		menu.classList.remove("active");
447	}
448
449	window.addEventListener("click", function (e) {
450		if (
451			!document.querySelector(".mob-panel").contains(e.target) &&
452			!document.querySelector(".burger").contains(e.target)
453		) {
454			closeMenu();
455		}
456	});
457
458	const menuParents = document.querySelectorAll(".mob-panel__nav__parent");
459	menuParents.forEach((menuParent) => {
460		menuParent.addEventListener("click", () => {
461			const pop = menuParent.nextElementSibling;
462			menuParent.classList.toggle("active");
463			slideToggle(pop);
464		});
465	});
466});
467/* Mob menu End */
468
469/* Menu popups Begin */
470document.addEventListener("DOMContentLoaded", function () {
471	const navSection = document.querySelector(".s-header");
472	const links = document.querySelectorAll(".header__nav__link");
473	const subs = document.querySelectorAll(".menu-popup");
474	const body = document.querySelector("body");
475
476	function openSubMenu(item) {
477		const parentLink = document.querySelector(`.header__nav__link[data-sub=${item}]`);
478		const needSub = document.querySelector(`.menu-popup[data-sub=${item}]`);
479		if (!needSub) return;
480
481		parentLink.classList.add("opened");
482		needSub.classList.add("active");
483		body.classList.add("overlayed");
484		navSection.classList.add("opened");
485	}
486
487	function closeSubMenu() {
488		links.forEach((link) => link.classList.remove("opened"));
489		subs.forEach((sub) => sub.classList.remove("active"));
490		body.classList.remove("overlayed");
491		navSection.classList.remove("opened");
492	}
493
494	links.forEach((link) => {
495		link.addEventListener("mouseenter", function (event) {
496			closeSubMenu();
497			if (link.dataset.sub) {
498				openSubMenu(link.dataset.sub);
499			}
500		});
501	});
502
503	navSection.addEventListener("mouseleave", function (event) {
504		closeSubMenu();
505	});
506
507	document.querySelector(".header__right").addEventListener("mouseenter", function (event) {
508		closeSubMenu();
509	});
510	document.querySelector(".header__logo").addEventListener("mouseenter", function (event) {
511		closeSubMenu();
512	});
513});
514/* Menu popups End */
515
516gsap.registerPlugin(ScrollTrigger);
517
518/* Parallax Begin */
519document.addEventListener("DOMContentLoaded", function () {
520	const elems = document.querySelectorAll("[data-par]");
521	let scrubVal = 1.5;
522	if (!device.desktop()) {
523		scrubVal = 0;
524	}
525	elems.forEach((elem) => {
526		const val = elem.dataset.par;
527		gsap.fromTo(
528			elem,
529			{ y: val },
530			{
531				y: -val,
532				ease: "none",
533				scrollTrigger: {
534					trigger: elem.parentNode,
535					scrub: scrubVal,
536					// markers: true
537				},
538			}
539		);
540	});
541});
542/* Parallax End */
543
544/* Fade Zoom In Begin */
545const initInAnims = () => {
546	ScrollTrigger.batch(".fadeIn", {
547		interval: 0,
548		batchMax: 6,
549		onEnter: (elements, triggers) => {
550			gsap.to(elements, {
551				opacity: 1,
552				stagger: 0.1,
553				ease: "power3.out",
554				duration: 1.5,
555			});
556		},
557		start: "top 85%",
558		end: "bottom top",
559		// markers: true
560	});
561	ScrollTrigger.batch(".fadeZoomIn", {
562		interval: 0,
563		batchMax: 6,
564		onEnter: (elements, triggers) => {
565			gsap.to(elements, {
566				autoAlpha: 1,
567				scale: 1,
568				stagger: 0.2,
569				ease: "power3.out",
570				duration: 1.5,
571			});
572		},
573		start: "top 85%",
574		end: "bottom top",
575		// markers: true
576	});
577};
578document.addEventListener("DOMContentLoaded", function () {
579	initInAnims();
580});
581/* Fade Zoom In End */
582
583/* Intro Begin */
584document.addEventListener("DOMContentLoaded", function () {
585	const title = document.querySelector(".intro-title");
586	if (!title) return;
587	const titleWrap = document.querySelector(".intro-title-wrap");
588	const logoWrap = document.querySelector(".intro-stage__logo");
589	const letters = document.querySelectorAll(".intro-stage__logo>img");
590	const childWrap = document.querySelector(".intro-stage__child");
591	const childImg = document.querySelector(".intro-stage__child-img");
592	const monsterLeftWrap = document.querySelector(".intro-stage__monstr-left");
593	const monsterLeft = document.querySelector(".intro-stage__monstr-left img");
594	const monsterRightWrap = document.querySelector(".intro-stage__monstr-right");
595	const monsterRight = document.querySelector(".intro-stage__monstr-right img");
596	const header = document.querySelector(".header");
597	let headerH = header.clientHeight;
598
599	imagesLoaded(document.querySelector(".intro-stage"), function (instance) {
600		openTl.play();
601		document.querySelector(".s-home-video").classList.add("loaded");
602	});
603
604	const openTlcomplete = () => {
605		document.querySelector('.intro-title .btn').classList.add('pulsed');
606	}
607
608	let openTl = gsap.timeline({
609		paused: true,
610		// smoothChildTiming: true,
611		// autoRemoveChildren: true,
612		onComplete: openTlcomplete,
613	});
614
615	openTl
616		.fromTo(
617			title,
618			{ scale: 0.9, y: "-100%", autoAlpha: 0 },
619			{ scale: 1, y: "0%", autoAlpha: 1, ease: "power3", duration: 1 }
620		)
621		.fromTo(
622			letters,
623			{ scale: 0.8, y: "10%", autoAlpha: 0 },
624			{
625				scale: 1,
626				y: "0%",
627				autoAlpha: 1,
628				ease: "power3",
629				duration: 1.5,
630				stagger: 0.2,
631			},
632			"-=30%"
633		)
634		.fromTo(childWrap, { y: "10%", autoAlpha: 0 }, { y: "0%", autoAlpha: 1, ease: "power3", duration: 1.5 }, "-=80%")
635		.fromTo(
636			monsterLeft,
637			{ scale: 0.5, y: "0%", autoAlpha: 0 },
638			{ scale: 1, y: "0%", autoAlpha: 1, ease: "power3", duration: 1.5 },
639			"-=80%"
640		)
641		.fromTo(
642			monsterRight,
643			{ scale: 0.5, y: "0%", autoAlpha: 0 },
644			{ scale: 1, y: "0%", autoAlpha: 1, ease: "power3", duration: 1.5 },
645			"-=80%"
646		);
647
648	let pin = ".s-intro";
649	let scrub = 1.5;
650	if (window.matchMedia("(max-width: 1250px)").matches) {
651		pin = false;
652	}
653	if (!device.desktop()) {
654		scrub = 0;
655	}
656
657	gsap
658		.timeline({
659			scrollTrigger: {
660				trigger: ".s-intro",
661				start: `-${headerH}px top`,

662				end: "bottom top",
663				scrub: scrub,
664				pin: pin,
665				refreshPriority: 10,
666				// markers: true,
667			},
668		})
669		.to(titleWrap, { y: "-15%" })
670		.to(logoWrap, { y: "15%" }, 0)
671		.to(childImg, { y: "5%", scale: 1.3 }, 0)
672		.to(monsterLeftWrap, { y: "-15%", scale: 1.1, rotate: -30 }, 0)
673		.to(monsterRightWrap, { y: "-20%", scale: 1.1, rotate: 60 }, 0);
674});
675/* Intro End */
676
677/* line Begin */
678document.addEventListener("DOMContentLoaded", function () {
679	const lines = document.querySelectorAll(".line__row");
680	if (!lines) return;
681
682	lines.forEach((line) => {
683		const logos = line.querySelectorAll(".line__logo");
684		gsap.fromTo(
685			line,
686			{ x: 0 },
687			{
688				x: "-50%",
689				ease: "linear",
690				repeat: -1,
691				duration: 40,
692			}
693		);
694		gsap.to(logos, {
695			x: "-=200px",
696			ease: "none",
697			scrollTrigger: {
698				trigger: line,
699				scrub: 1,
700				anticipatePin: 1,
701			},
702		});
703	});
704});
705/* line End */
706
707/* team tabs Begin */
708document.addEventListener("DOMContentLoaded", function () {
709	const navWrapper = document.querySelector(".js-team-tabs");
710	const tabs = document.querySelectorAll(".js-team-tabs .tab");
711	const cats = document.querySelectorAll(".team-cat");
712
713	tabs.forEach((tab, index) => {
714		tab.addEventListener("click", () => {
715			//Срабатывает цель
716			if (!cats[index]) return;

717			tabs.forEach((tab) => tab.classList.remove("active"));
718			tab.classList.add("active");
719			cats.forEach((cat) => cat.classList.remove("active"));
720			cats[index].classList.add("active");
721			const panels = cats[index].querySelectorAll(".hero-preview");
722			if (panels.length <= 0) return;
723			gsap.fromTo(
724				panels,
725				{ opacity: 0 },
726				{
727					opacity: 1,
728					stagger: 0.1,
729					ease: "power3.out",
730					duration: 1.5,
731				}
732			);
733			ScrollTrigger.refresh();
734			dest = tab.offsetLeft - navWrapper.clientWidth / 2 + tab.clientWidth / 2;
735			navWrapper.scroll({
736				left: dest,
737				behavior: "smooth",
738			});
739		});
740	});
741});
742/* team tabs End */
743
744/* reviews Begin */
745document.addEventListener("DOMContentLoaded", function () {
746	const reviews = document.querySelectorAll(".review-video");
747
748	if (reviews.length <= 0) return;
749
750	const setVideoProgress = (videoBlock) => {
751		const thisVideo = videoBlock.querySelector(".review-video__video");
752		const thisProgressBar = videoBlock.querySelector(".review-video__progress");
753		percentageCompleted = (thisVideo.currentTime / thisVideo.duration) * 100;
754		thisProgressBar.style.width = `${percentageCompleted}%`;
755	};
756
757	const setStateIcon = (videoBlock, icon) => {
758		const playIcon = videoBlock.querySelector(".review-video__icon-play");
759		const pauseIcon = videoBlock.querySelector(".review-video__icon-pause");
760		if (icon == "play") {
761			pauseIcon.style.display = "none";
762			playIcon.style.display = "block";
763		} else {
764			pauseIcon.style.display = "block";
765			playIcon.style.display = "none";
766		}
767	};
768
769	const initReviews = () => {
770		const reviews = document.querySelectorAll(".review-video");
771		const videoBlocks = document.querySelectorAll(".review-video__main");
772		const videos = document.querySelectorAll(".review-video__video");
773
774		reviews.forEach((thisReview) => {
775			if (thisReview.dataset.inited) return;
776			thisReview.dataset.inited = true;
777			const thisVideoBlock = thisReview.querySelector(".review-video__main");
778			const thisVideo = thisVideoBlock.querySelector(".review-video__video");
779			thisVideoBlock.addEventListener("click", () => {
780				// Срабатывает цель
781				// останавливаем остальные видео
782				videos.forEach((video) => {
783					if (video !== thisVideo) {
784						video.pause();
785						video.currentTime = 0;
786					}
787				});
788				videoBlocks.forEach((videoBlock) => {
789					setStateIcon(videoBlock, "play");
790				});
791				// затемняем остальные видео
792				reviews.forEach((review) => {
793					if (review !== thisReview) {
794						review.classList.add("faded");
795					}
796				});
797				thisReview.classList.remove("faded");
798				if (thisVideo.paused) {
799					thisVideo.play();
800					thisVideo.ontimeupdate = function () {
801						setVideoProgress(thisVideoBlock);
802					};
803					setStateIcon(thisVideoBlock, "pause");
804				} else {
805					thisVideo.pause();
806					setStateIcon(thisVideoBlock, "play");
807					reviews.forEach((review) => {
808						review.classList.remove("faded");
809					});
810				}
811			});
812		});
813	};
814
815	initReviews();
816
817	const reviewsSlider = new Swiper(".reviews-slider", {
818		slidesPerView: "auto",
819		grabCursor: true,
820		spaceBetween: 10,
821		navigation: {
822			nextEl: ".js-home-review-next",
823			prevEl: ".js-home-review-prev",
824		},
825		scrollbar: {
826			el: ".swiper-scrollbar",
827			draggable: true,
828			dragSize: 80,
829		},
830		breakpoints: {
831			1024: {
832				spaceBetween: 15,
833			},
834		},
835	});
836
837	const slides = document.querySelectorAll(".reviews-slider__slide");
838	if (slides.length <= 0) return;
839	gsap.fromTo(
840		slides,
841		{ opacity: 0, x: 150 },
842		{
843			opacity: 1,
844			x: 0,
845			stagger: 0.15,
846			ease: "power3.out",
847			duration: 2,
848			scrollTrigger: {
849				trigger: ".reviews-slider",
850				start: "50% bottom",
851				end: "bottom top",
852			},
853		}
854	);
855});
856/* reviews End */
857
858/* about-princip Begin */
859document.addEventListener("DOMContentLoaded", function () {
860	const princips = document.querySelectorAll(".about-princip");
861	if (princips.length <= 0) return;
862
863	princips.forEach((princip) => {
864		princip.addEventListener("click", () => {
865			princip.classList.toggle("active");

866			const descr = princip.querySelector(".about-princip__descr");
867			slideToggle(descr);
868			setTimeout(() => {
869				ScrollTrigger.refresh();
870			}, 500);
871		});
872	});
873});
874/* about-princip End */
875
876/* about family Begin */
877document.addEventListener("DOMContentLoaded", function () {
878	const heroes = document.querySelectorAll(".family-stage svg path");
879	const panels = document.querySelectorAll(".family-stage__item");
880
881	heroes.forEach((hero) => {
882		const index = hero.id;
883
884		hero.addEventListener("mouseenter", () => {
885			heroes.forEach((item) => item.classList.add("disabled"));
886			hero.classList.remove("disabled");
887			panels.forEach((panel) => panel.classList.remove("active"));
888			document.querySelector(`.family-stage__item--${index}`).classList.add("active");
889		});
890		hero.addEventListener("mouseleave", () => {
891			heroes.forEach((item) => item.classList.remove("disabled"));
892			panels.forEach((panel) => panel.classList.remove("active"));
893		});
894
895		hero.addEventListener("click", () => {
896			Fancybox.show([{ src: `#family-modal-${hero.id}` }], {
897				dragToClose: false,
898			});
899		});
900	});
901});
902/* about family End */
903
904/* Fond news slider Begin */
905document.addEventListener("DOMContentLoaded", function () {
906	const slider = new Swiper(".fond-news-slider", {
907		slidesPerView: "auto",
908		// grabCursor: true,
909		spaceBetween: 10,
910		navigation: {
911			nextEl: ".js-fond-next",
912			prevEl: ".js-fond-prev",
913		},
914		scrollbar: {
915			el: ".swiper-scrollbar",
916			draggable: true,
917			dragSize: 80,
918		},
919		breakpoints: {
920			1024: {
921				spaceBetween: 15,
922				slidesPerView: 4,
923			},
924		},
925	});
926});
927/* Fond news slider End */
928
929/* Time chooser in modals Begin */
930document.addEventListener("DOMContentLoaded", function () {
931	const timeChoosers = document.querySelectorAll(".time-chooser");
932	if (timeChoosers.length <= 0) return;
933
934	timeChoosers.forEach((timeChooser) => {
935		const types = timeChooser.querySelectorAll('[name="user_time_type"]');
936		const chooserBlock = timeChooser.querySelector(".time-chooser__selected");
937		const timeSelect = timeChooser.querySelector('[name="user_time"]');
938		types.forEach((type) => {
939			type.addEventListener("change", () => {
940				if (type.checked) {
941					if (type.value == "Выбранное время") {
942						chooserBlock.style.display = "block";
943					} else {
944						chooserBlock.style.display = "none";
945						timeSelect.selectedIndex = 0;
946					}
947				}
948			});
949		});
950	});
951});
952/* Time chooser in modals End */
953
954/* quiz Begin */
955document.addEventListener("DOMContentLoaded", function () {
956	const slider = new Swiper(".qiuz-slider", {
957		slidesPerView: 1,
958		autoHeight: true,
959		allowTouchMove: false,
960		on: {
961			slideNextTransitionEnd: () => {
962				setTimeout(() => {
963					ScrollTrigger.refresh();
964				}, 100);
965			},
966		},
967	});
968
969	const qiuzAll = document.querySelectorAll(".qiuz-slider");
970	qiuzAll.forEach((quiz) => {
971		const btns = quiz.querySelectorAll(".quiz__btn");
972		btns.forEach((btn) => {
973			btn.addEventListener("click", () => {
974				quiz.swiper.slideNext(1000);
975			});
976		});
977	});
978});
979/* quiz End */
980
981/* begin-services Begin */
982document.addEventListener("DOMContentLoaded", function () {
983	const slider = new Swiper(".begin-services", {
984		slidesPerView: "auto",
985		spaceBetween: 10,
986		navigation: {
987			nextEl: ".js-begin-services-next",
988			prevEl: ".js-begin-services-prev",
989		},
990		scrollbar: {
991			el: ".swiper-scrollbar",
992			draggable: true,
993			dragSize: 80,
994		},
995		breakpoints: {
996			1024: {
997				spaceBetween: 15,
998				slidesPerView: "auto",
999			},
1000		},
1001	});
1002
1003	const slides = document.querySelectorAll(".begin-service");
1004	if (slides.length <= 0) return;
1005	gsap.fromTo(
1006		slides,
1007		{ opacity: 0, x: 150 },
1008		{
1009			opacity: 1,
1010			x: 0,
1011			stagger: 0.15,
1012			ease: "power3.out",
1013			duration: 2,
1014			scrollTrigger: {
1015				trigger: ".begin-services",
1016				start: "50% bottom",
1017				end: "bottom top",
1018			},
1019		}
1020	);
1021});
1022/* begin-services End */
1023
1024/* Contacts Begin */
1025async function initMap() {
1026	await ymaps3.ready;
1027

1028	const { YMap, YMapDefaultSchemeLayer, YMapControls, YMapDefaultFeaturesLayer, YMapMarker } = ymaps3;
1029	const { YMapZoomControl } = await ymaps3.import("@yandex/[email protected]");
1030	const mapElems = document.querySelectorAll(".contacts__map");
1031
1032	mapElems.forEach((mapElem) => {
1033		if (!mapElem.dataset.coords) return;
1034		const coords = mapElem.dataset.coords.replaceAll(" ", "").split(",");
1035		const needCoords = [coords[1], coords[0]];
1036		const map = new YMap(mapElem, {
1037			location: {
1038				center: needCoords,
1039				zoom: 17,
1040			},
1041			// mode: 'vector',
1042			behaviors: ["drag", "pinchZoom", "mouseTilt"],
1043		});
1044		//добавляем слой карты (обязательно)
1045		map.addChild(new YMapDefaultSchemeLayer({}));
1046		// добавляем управление
1047		map.addChild(new YMapDefaultFeaturesLayer());
1048		const controls = new YMapControls({ position: "right" });
1049		controls.addChild(new YMapZoomControl({}));
1050		map.addChild(controls);
1051		// добавляем pin
1052		const pin = document.createElement("img");
1053		pin.className = "map-pin";
1054		pin.src = "/local/templates/inch/img/pin.svg";
1055		map.addChild(new YMapMarker({ coordinates: needCoords }, pin));
1056	});
1057}
1058
1059const loadDynamicYMaps = (lang = "ru_RU") => {
1060	const script = document.createElement("script");
1061	script.src = `https://api-maps.yandex.ru/v3/?apikey=4ed1918a-924a-4c32-b8c5-d8f8773abe89&lang=${lang}`;
1062	document.body.appendChild(script);
1063	script.onload = () => {
1064		initMap();
1065	};
1066};
1067
1068document.addEventListener("DOMContentLoaded", function () {
1069	const contactsMap = document.querySelector(".s-contacts");
1070	if (!contactsMap) return;
1071
1072	const observerCallback = (entries) => {
1073		entries.forEach((entry) => {
1074			if (entry.intersectionRatio > 0) {
1075				loadDynamicYMaps();
1076				observer.unobserve(entry.target);
1077			}
1078		});
1079	};
1080	const observer = new IntersectionObserver(observerCallback, {
1081		rootMargin: "200px 0px",
1082		threshold: 0,
1083	});
1084	observer.observe(contactsMap);
1085});
1086
1087/* Contacts End */
1088
1089/* faq Begin */
1090document.addEventListener("DOMContentLoaded", function () {
1091	const faqHeaders = document.querySelectorAll(".faq__header");
1092	faqHeaders.forEach((faqHeader) => {
1093		faqHeader.addEventListener("click", () => {
1094			const pop = faqHeader.nextElementSibling;
1095			faqHeader.classList.toggle("active");
1096			slideToggle(pop, 500);
1097		});
1098	});
1099});
1100/* faq End */
1101
1102/* Style file input Begin */
1103document.addEventListener("DOMContentLoaded", function () {
1104	const inputBlocks = document.querySelectorAll(".input-file");
1105	if (inputBlocks.length <= 0) return;
1106
1107	inputBlocks.forEach((inputBlock) => {
1108		const input = inputBlock.querySelector('input[type="file"]');
1109		const label = inputBlock.querySelector(".input-file__text");
1110		const labelInitVal = label.textContent;
1111
1112		input.addEventListener("change", function (e) {
1113			let fileName = "";
1114
1115			if (this.files && this.files.length > 1) {
1116				fileName = (this.getAttribute("data-multiple-caption") || "").replace("{count}", this.files.length);
1117			} else if (e.target.value) {
1118				fileName = e.target.value.split("\\").pop();
1119			}
1120
1121			if (fileName) {
1122				label.textContent = fileName;
1123			} else {
1124				label.textContent = labelInitVal;
1125			}
1126		});
1127	});
1128});
1129/* Style file input End */
1130
1131/* tt slider Begin */
1132document.addEventListener("DOMContentLoaded", function () {
1133	const slider = new Swiper(".tt-slider", {
1134		slidesPerView: 1,
1135		spaceBetween: 30,
1136		allowTouchMove: false,
1137		slideToClickedSlide: true,
1138		navigation: {
1139			nextEl: ".js-tt-next",
1140			prevEl: ".js-tt-prev",
1141		},
1142		breakpoints: {
1143			680: {
1144				spaceBetween: 50,
1145				slidesPerView: 1,
1146			},
1147			1024: {
1148				spaceBetween: 100,
1149				slidesPerView: 1,
1150			},
1151		},
1152	});
1153
1154	const innerSlider = new Swiper(".tt-item-slider", {
1155		slidesPerView: 1,
1156		pagination: {
1157			el: ".swiper-pagination",
1158			type: "bullets",
1159			clickable: true,
1160		},
1161	});
1162
1163	const navWrapper = document.querySelector(".tt-times");
1164	const times = document.querySelectorAll(".tt-time");
1165	times.forEach((time, index) => {
1166		time.addEventListener("click", () => {
1167			setTabActive(index);
1168			slider.slideTo(index);
1169		});
1170	});
1171
1172	slider.on("slideChange", function () {
1173		setTabActive(slider.activeIndex);
1174	});
1175
1176	function setTabActive(index) {
1177		const navWrapper = document.querySelector(".tt-times");
1178		const times = document.querySelectorAll(".tt-time");
1179		if (!times[index]) return;

1180		times.forEach((item) => item.classList.remove("active"));
1181		times[index].classList.add("active");
1182		let dest = times[index].offsetLeft - navWrapper.clientWidth / 2 + times[index].clientWidth / 2;
1183		navWrapper.scroll({
1184			left: dest,
1185			behavior: "smooth",
1186		});
1187	}
1188});
1189/* tt slider End */
1190
1191/* evo sections tabs Begin */
1192document.addEventListener("DOMContentLoaded", function () {
1193	const navWrapper = document.querySelector(".js-sections-tabs");
1194	const tabs = document.querySelectorAll(".js-sections-tabs .tab");
1195	const cats = document.querySelectorAll(".sections-cat");
1196
1197	tabs.forEach((tab, index) => {
1198		tab.addEventListener("click", (e) => {
1199			e.preventDefault();
1200			if (!cats[index]) return;
1201			tabs.forEach((tab) => tab.classList.remove("active"));
1202			tab.classList.add("active");
1203			cats.forEach((cat) => cat.classList.remove("active"));
1204			cats[index].classList.add("active");
1205			ScrollTrigger.refresh();
1206			dest = tab.offsetLeft - navWrapper.clientWidth / 2 + tab.clientWidth / 2;
1207			navWrapper.scroll({
1208				left: dest,
1209				behavior: "smooth",
1210			});
1211		});
1212	});
1213});
1214/* evo sections tabs End */
1215
1216/* home video Begin */
1217
1218let player;
1219function onYouTubeIframeAPIReady() {
1220	const homePlayer = document.querySelector("#player");
1221	if (homePlayer) {
1222		const id = homePlayer.dataset.video;
1223		if (!id) return;
1224		 player = new YT.Player("player", {
1225			height: "360",
1226			width: "640",
1227			videoId: id,
1228			playerVars: {
1229				rel: 0,
1230			},
1231			events: {
1232				'onReady': onHomePlayerReady,
1233				'onStateChange': onPlayerStateChange
1234			},
1235		});
1236	}
1237}
1238function onHomePlayerReady(event) {
1239	event.target.playVideo();
1240}
1241document.addEventListener("DOMContentLoaded", function () {
1242	const videoBlock = document.querySelector(".home-video");
1243	if (!videoBlock) return;
1244	const front = document.querySelector(".home-video__front");
1245
1246	videoBlock.addEventListener("click", () => {
1247		var tag = document.createElement("script");
1248		tag.src = "https://www.youtube.com/iframe_api";
1249		var firstScriptTag = document.getElementsByTagName("script")[0];
1250		firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
1251		front.classList.add("hidden");
1252	});
1253});
1254/* home video End */
1255
1256// Ютуб цели START
1257
1258 let half = false;
1259 let full = false;
1260
1261
1262function onPlayerStateChange(event) {
1263
1264	if (!full && event.data === YT.PlayerState.PLAYING){
1265		checkProgress();
1266	}
1267
1268	if(!full && event.data === YT.PlayerState.ENDED){
1269		ym(97191043,'reachGoal','viewed_100_video')
1270		full = true;
1271	}
1272
1273}
1274
1275function checkProgress(){
1276
1277	if(!player) return;
1278
1279	let duration = player.getDuration();
1280	let currentTime = Math.round(player.getCurrentTime());
1281
1282	if( currentTime >= duration / 2){
1283		
1284		ym(97191043,'reachGoal','viewed_50_video')
1285		half = true;		
1286	}
1287
1288	if(!half){
1289		setTimeout(checkProgress, 1000);
1290	}
1291}
1292
1293// Ютуб цели END
1294
1295/* video block Begin */
1296document.addEventListener("DOMContentLoaded", function () {
1297	const videoBlocks = document.querySelectorAll(".video-block");
1298	if (videoBlocks.length <= 0) return;
1299
1300	var tag = document.createElement("script");
1301	tag.src = "https://www.youtube.com/iframe_api";
1302	var firstScriptTag = document.getElementsByTagName("script")[0];
1303	firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
1304
1305	videoBlocks.forEach((videoBlock) => {
1306		videoBlock.addEventListener("click", () => {
1307			const front = videoBlock.querySelector(".video-block__cover");
1308			const player = videoBlock.querySelector(".video-block__player");
1309			const id = player.dataset.video;
1310			if (!id) return;
1311			let ytPlayer = new YT.Player(player, {
1312				height: "360",
1313				width: "640",
1314				videoId: id,
1315				playerVars: { autoplay: 1 },
1316				events: {
1317					onReady: function (event) {
1318						event.target.playVideo();
1319					},
1320				},
1321			});
1322			front.classList.add("hidden");
1323		});
1324	});
1325});
1326/* video block End */
1327
1328/* Hero learn slider Begin */
1329document.addEventListener("DOMContentLoaded", function () {
1330	const slider = new Swiper(".hero-learn-slider", {
1331		slidesPerView: "auto",
1332		spaceBetween: 10,
1333		navigation: {
1334			nextEl: ".js-learn-next",
1335			prevEl: ".js-learn-prev",
1336		},
1337		scrollbar: {
1338			el: ".swiper-scrollbar",
1339			draggable: true,
1340			dragSize: 80,
1341		},
1342		breakpoints: {
1343			1024: {
1344				spaceBetween: 20,
1345				slidesPerView: 2,
1346			},
1347		},
1348	});
1349});
1350/* Hero learn slider End */
1351
1352/* competencies Begin */
1353document.addEventListener("DOMContentLoaded", function () {
1354	const btn = document.querySelector(".competencies-show-all");
1355	if (!btn) return;
1356	const hiddenItems = document.querySelectorAll(".competencies-list__item--hidden");
1357
1358	btn.addEventListener("click", () => {
1359		if (btn.innerHTML === "Показать все") {
1360			btn.innerHTML = "Свернуть";

1361			hiddenItems.forEach((item) => {
1362				item.style.display = "flex";
1363			});
1364		} else {
1365			btn.innerHTML = "Показать все";
1366			hiddenItems.forEach((item) => {
1367				item.style.display = "none";
1368			});
1369		}
1370		setTimeout(() => {
1371			ScrollTrigger.refresh();
1372		}, 100);
1373	});
1374});
1375/* competencies End */
1376
1377/* Sert slider Begin */
1378document.addEventListener("DOMContentLoaded", function () {
1379	const slider = new Swiper(".serts-slider", {
1380		slidesPerView: "auto",
1381		spaceBetween: 10,
1382		navigation: {
1383			nextEl: ".js-serts-next",
1384			prevEl: ".js-serts-prev",
1385		},
1386		scrollbar: {
1387			el: ".swiper-scrollbar",
1388			draggable: true,
1389			dragSize: 80,
1390		},
1391		breakpoints: {
1392			1024: {
1393				spaceBetween: 12,
1394				slidesPerView: "auto",
1395			},
1396		},
1397	});
1398});
1399/* Sert slider End */
1400
1401/* home-photos */
1402document.addEventListener("DOMContentLoaded", function () {
1403	const sliders = document.querySelectorAll(".home-photos");
1404	if (sliders.length <= 0) return;
1405
1406	const slidesImgs = sliders[0].querySelectorAll(".home-photo");
1407
1408	sliders.forEach((slider) => {
1409		const slides = slider.querySelectorAll(".swiper-slide");
1410
1411		const photoSlider = new Swiper(slider, {
1412			slidesPerView: "auto",
1413			grabCursor: true,
1414			spaceBetween: 10,
1415			observeParents: true,
1416			navigation: {
1417				nextEl: ".js-home-photos-next",
1418				prevEl: ".js-home-photos-prev",
1419			},
1420			scrollbar: {
1421				el: ".swiper-scrollbar",
1422				draggable: true,
1423				dragSize: 80,
1424			},
1425			breakpoints: {
1426				1024: {
1427					spaceBetween: 15,
1428				},
1429			},
1430		});
1431
1432		photoSlider.on("touchStart", function (swiper, event) {
1433			gsap.to(slides, {
1434				scale: 0.9,
1435				ease: "power3.out",
1436				duration: 0.6,
1437				stagger: {
1438					grid: [1, swiper.slides.length],
1439					axis: "x",
1440					from: swiper.slides.indexOf(event.target),
1441					amount: 0.15,
1442				},
1443			});
1444		});
1445		photoSlider.on("touchEnd", function (swiper, event) {
1446			gsap.to(slides, {
1447				scale: 1,
1448				ease: "power3.out",
1449				duration: 0.6,
1450				overwrite: true,
1451			});
1452		});
1453	});
1454
1455	gsap.fromTo(
1456		slidesImgs,
1457		{ opacity: 0, x: 150 },
1458		{
1459			opacity: 1,
1460			x: 0,
1461			stagger: 0.15,
1462			ease: "power3.out",
1463			duration: 2,
1464			scrollTrigger: {
1465				trigger: ".home-photos",
1466				start: "50% bottom",
1467				end: "bottom top",
1468			},
1469		}
1470	);
1471
1472	setTimeout(() => {
1473		ScrollTrigger.refresh();
1474	}, 100);
1475});
1476/* home-photos */
1477
1478/* Interiors Begin */
1479document.addEventListener("DOMContentLoaded", function () {
1480	const navWrapper = document.querySelector(".js-interior-tabs");
1481	const tabs = document.querySelectorAll(".js-interior-tabs .tab");
1482	const cats = document.querySelectorAll(".interior");
1483
1484	tabs.forEach((tab, index) => {
1485		tab.addEventListener("click", (e) => {
1486			e.preventDefault();
1487			if (!cats[index]) return;

1488			tabs.forEach((tab) => tab.classList.remove("active"));
1489			tab.classList.add("active");
1490			cats.forEach((cat) => cat.classList.remove("active"));
1491			cats[index].classList.add("active");
1492			ScrollTrigger.refresh();
1493			dest = tab.offsetLeft - navWrapper.clientWidth / 2 + tab.clientWidth / 2;
1494			navWrapper.scroll({
1495				left: dest,
1496				behavior: "smooth",
1497			});
1498
1499			const slidesImgs = cats[index].querySelectorAll(".home-photo");
1500			gsap.fromTo(
1501				slidesImgs,
1502				{ opacity: 0, x: 150 },
1503				{
1504					opacity: 1,
1505					x: 0,
1506					stagger: 0.1,
1507					ease: "power3.out",
1508					duration: 1,
1509					scrollTrigger: {
1510						trigger: ".home-photos",
1511						start: "50% bottom",
1512						end: "bottom top",
1513					},
1514				}
1515			);
1516		});
1517	});
1518});
1519/* Interiors End */
1520
1521/* blog pop slider Begin */
1522document.addEventListener("DOMContentLoaded", function () {
1523	const photoSlider = new Swiper(".blog-pop-slider", {
1524		slidesPerView: 1,
1525		spaceBetween: 10,
1526		navigation: {
1527			nextEl: ".js-blog-pop-next",
1528			prevEl: ".js-blog-pop-prev",
1529		},
1530		scrollbar: {
1531			el: ".swiper-scrollbar",
1532			draggable: true,
1533			dragSize: 80,
1534		},
1535	});
1536});
1537/* blog pop slider End */
1538
1539/* Inch by inch Begin */
1540document.addEventListener("DOMContentLoaded", function () {
1541	const letters = document.querySelectorAll(".diary__logo__sign");
1542	if (letters.length <= 0) return;
1543
1544	gsap.set(letters, { scale: 0.8, autoAlpha: 0, transformOrigin: "50% 100%" });
1545	let cursor = 0;
1546	setInterval(() => {
1547		gsap.fromTo(
1548			letters[cursor],
1549			{ scale: 0.8, autoAlpha: 0 },
1550			{ scale: 1, autoAlpha: 1, ease: "power3", duration: 1.5 }
1551		);
1552		gsap.to(letters[cursor], {
1553			scale: 1,
1554			autoAlpha: 0,
1555			ease: "power3",
1556			duration: 1.5,
1557			delay: 1.2,
1558		});
1559		cursor++;
1560		if (cursor > letters.length - 1) {
1561			cursor = 0;
1562		}
1563	}, 400);
1564});
1565/* Inch by inch End */
1566
1567/* Tariff Begin */
1568document.addEventListener("DOMContentLoaded", function () {
1569	const elements = document.querySelectorAll(".tariff-anim");
1570	const options = {
1571		rootMargin: "-250px 0px",
1572		threshold: 0,
1573	};
1574	const callback = (entries) => {
1575		entries.forEach((entry) => {
1576			if (entry.intersectionRatio > 0) {
1577				entry.target.classList.add("animated");
1578				observer.unobserve(entry.target);
1579			} else {
1580				//entry.target.classList.remove('animated');
1581			}
1582		});
1583	};
1584
1585	const observer = new IntersectionObserver(callback, options);
1586
1587	elements.forEach((element) => {
1588		observer.observe(element);
1589	});
1590});
1591/* Tariff End */
1592
1593/* Head decors parallax Begin */
1594document.addEventListener("DOMContentLoaded", function () {
1595	const elems = document.querySelectorAll("[data-head-par]");
1596	if (elems.length <= 0) return;
1597	let introH = document.querySelector(".round-intro").clientHeight;
1598	// const introH = window.innerHeight;
1599	const headerH = document.querySelector(".s-header").clientHeight;
1600	let h = introH + headerH;
1601	let scrubVal = 1.5;
1602	if (!device.desktop()) {
1603		scrubVal = 0;
1604	}
1605	const initAnim = (h) => {
1606		elems.forEach((elem) => {
1607			const val = elem.dataset.headPar;
1608			gsap.fromTo(
1609				elem,
1610				{ y: 0, rotate: 0, scale: 1 },
1611				{
1612					y: val,
1613					rotate: 60,
1614					scale: 1.2,
1615					ease: "none",
1616					scrollTrigger: {
1617						trigger: "body",
1618						scrub: scrubVal,
1619						start: "top top",
1620						end: `${h} top`,

1621						// markers: true
1622					},
1623				}
1624			);
1625		});
1626	};
1627
1628	imagesLoaded(document.querySelector(".round-intro__stage"), function (instance) {
1629		introH = document.querySelector(".round-intro").clientHeight;
1630		h = introH + headerH;
1631		initAnim(h);
1632		ScrollTrigger.refresh();
1633	});
1634});
1635/* Head decors parallax End */
1636
1637/* Home subscribe img Begin */
1638document.addEventListener("DOMContentLoaded", function () {
1639	const img = document.querySelector(".home-subscribe__img");
1640	if (!img) return;
1641	let scrubVal = 1.5;
1642	if (!device.desktop()) {
1643		scrubVal = 0;
1644	}
1645	gsap.fromTo(
1646		img,
1647		{ y: "-50%", rotate: 20, scale: 0.8 },
1648		{
1649			y: 0,
1650			rotate: 0,
1651			scale: 1,
1652			ease: "none",
1653			scrollTrigger: {
1654				trigger: ".home-subscribe",
1655				scrub: scrubVal,
1656				start: "top bottom",
1657				end: `center bottom`,
1658				// markers: true
1659			},
1660		}
1661	);
1662});
1663/* Home subscribe img End */
1664
1665/* Begin process slider Begin */
1666document.addEventListener("DOMContentLoaded", function () {
1667	const images = document.querySelectorAll(".begin-process__img");
1668	const titles = document.querySelectorAll(".begin-process__title__item");
1669	if (images.length <= 0) return;
1670
1671	const slider = new Swiper(".begin-process__slider", {
1672		slidesPerView: 1,
1673		autoHeight: true,
1674		effect: "fade",
1675		fadeEffect: {
1676			crossFade: true,
1677		},
1678		navigation: {
1679			nextEl: ".js-begin-process-next",
1680			prevEl: ".js-begin-process-prev",
1681		},
1682		scrollbar: {
1683			el: ".swiper-scrollbar",
1684			draggable: true,
1685			dragSize: 80,
1686		},
1687		pagination: {
1688			el: ".js-begin-process-pagination",
1689			type: "bullets",
1690			clickable: true,
1691		},
1692	});
1693
1694	slider.on("slideChange", function () {
1695		images.forEach((img) => img.classList.remove("active"));
1696		images[this.activeIndex].classList.add("active");
1697		if (this.activeIndex == 3) {
1698			titles[0].classList.remove("active");
1699			titles[1].classList.add("active");
1700		} else {
1701			titles[1].classList.remove("active");
1702			titles[0].classList.add("active");
1703		}
1704	});
1705	slider.on("slideChangeTransitionEnd", function () {
1706		setTimeout(() => {
1707			ScrollTrigger.refresh();
1708		}, 100);
1709	});
1710
1711	const timesTypes = document.querySelectorAll('[name="user_time_type"]');
1712	timesTypes.forEach((type) => {
1713		type.addEventListener("change", () => {
1714			slider.updateAutoHeight(200);
1715		});
1716	});
1717});
1718/* Begin process slider End */
1719
1720/* Popup Begin */
1721function getCookie(name) {
1722	let matches = document.cookie.match(
1723		new RegExp("(?:^|; )" + name.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g, "\\$1") + "=([^;]*)")
1724	);
1725	return matches ? decodeURIComponent(matches[1]) : undefined;
1726}
1727
1728function setCookie(name, value, days) {
1729	var expires = "";
1730	if (days) {
1731		var date = new Date();
1732		date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);
1733		expires = "; expires=" + date.toUTCString();
1734	}
1735	document.cookie = name + "=" + (value || "") + expires + "; path=/";
1736}
1737
1738document.addEventListener("DOMContentLoaded", function () {
1739	const modal = document.querySelector("#modal-sun");
1740	if (!modal) return;
1741	let version = modal.dataset.version;
1742	if (getCookie(`popup_closed_${version}`) == 1) return;
1743	let delay = 5000;
1744	if (modal.dataset.delay) {
1745		delay = parseInt(modal.dataset.delay) * 1000;
1746	}
1747	setTimeout(() => {
1748		new Fancybox([{ src: `#${modal.id}` }], {
1749			on: {
1750				close: (fancybox, slide) => {
1751					setCookie(`popup_closed_${version}`, 1, 365);
1752				},
1753			},
1754		});
1755	}, delay);
1756});
1757/* Popup End */
1758
1759
1760
1761window.addEventListener("load", () => {
1762	setTimeout(() => {
1763		ScrollTrigger.refresh();
1764	}, 1500);
1765});
1766
1767
1768// Cookie modal Begin
1769document.addEventListener("DOMContentLoaded", function () {
1770	
1771		const modal = document.querySelector('#cookie-consent-modal');
1772
1773		if(modal){
1774			const acceptBtn  = modal.querySelector('.cookie-consent-accept');
1775			modal.classList.add('active'); 
1776
1777			acceptBtn.addEventListener('click', function() {
1778				modal.classList.remove('active'); 
1779			});
1780		}
1781		
1782});
1783
1784// Cookie modal end