[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_213":214,"_215":216},"routes/_app.x.$handle.$name",{"_94":93,"_32":45,"_102":84,"_27":103,"_13":14,"_104":-5,"_11":105,"_106":107,"_108":109,"_110":111,"_112":113,"_20":-5,"_114":-5,"_115":-5,"_116":25,"_117":118,"_119":25,"_120":-5,"_121":-5,"_122":123},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_43":44,"_32":45,"_38":46,"_47":-5,"_48":25,"_49":50,"_51":50,"_52":-5,"_53":-5,"_18":54,"_55":-5,"_56":25,"_57":-5,"_58":-5,"_59":60,"_61":62,"_63":-5,"_64":-5,"_65":-5,"_66":-5,"_67":68,"_69":68,"_70":71,"_72":71,"_73":71,"_74":68,"_75":68,"_76":77,"_78":79,"_80":81,"_82":25},"version",496,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":23,"_24":25,"_26":25,"_27":28,"_29":28},"file",{"_30":31,"_32":33,"_34":35,"_36":37,"_38":39,"_40":14,"_41":42,"_24":25},"previous",{"_30":31,"_32":33,"_34":35,"_36":37},"deleted",false,"deletedHere","path","ARCHIVES/10-03-2026_12-29.js","latestPath","fileId","7fb47db6-1c6f-11f1-b62b-42dde27851f2","name","10-03-2026_12-29.js","fileType","script","content","/* =========================\n 📆 UPDATE 10-03-2026_12:29\n ========================= */\n\n/* =========================\n ✅ GESTION TYPEFORM (laisser en haut)\n ========================= */\n\n(function () {\n /* =========================\n CONFIG\n ========================= */\n\n const CONFIG = {\n triggerSelector: '[OpenTf=\"trigger\"]',\n iframeSelector: \".tf-v1-iframe-wrapper iframe\",\n iframeDelayMs: 400, // délai pour laisser Typeform injecter l’iframe\n };\n\n /* =========================\n HELPERS\n ========================= */\n\n function getEmailFromElement(element) {\n const mailInput =\n element.querySelector('input[type=\"email\"]')?.value?.replace(\n /\\+/g,\n \"%2B\",\n ) || \"\";\n if (mailInput) console.log(mailInput);\n return mailInput;\n }\n\n function updateIframeParams(params) {\n const iframe = document.querySelector(CONFIG.iframeSelector);\n if (!iframe) return;\n\n let currentSrc = iframe.getAttribute(\"src\");\n let newSrc = currentSrc;\n\n if (params.email) {\n const sep = currentSrc.includes(\"?\") ? \"&\" : \"?\";\n newSrc = `${currentSrc}${sep}email=${params.email}`;\n }\n\n iframe.setAttribute(\"src\", newSrc);\n console.log(\"Updated iframe src:\", iframe.src);\n }\n\n function openTf({ email = \"\" } = {}) {\n const trigger = document.querySelector(CONFIG.triggerSelector);\n if (!trigger) {\n console.warn(\"Typeform trigger not found\");\n return;\n }\n\n // 1 — ouvrir popup\n trigger.click();\n\n // 2 — injecter email après création iframe\n if (email) {\n setTimeout(() => {\n updateIframeParams({ email });\n }, CONFIG.iframeDelayMs);\n }\n }\n\n /* =========================\n LISTENERS\n ========================= */\n\n // submit formulaire → récupère email\n document.querySelectorAll('[OpenTf=\"form\"]').forEach((form) => {\n form.addEventListener(\"submit\", function (event) {\n event.preventDefault();\n const email = getEmailFromElement(form);\n openTf({ email });\n });\n });\n\n // clic simple → ouvre juste\n document.querySelectorAll('[OpenTf=\"btn\"]').forEach((el) => {\n el.addEventListener(\"click\", function (event) {\n event.preventDefault();\n openTf();\n });\n });\n})();\n\n/* =========================\n ✅ NAVBAR\n ========================= */\n\n// Animation BG navbar\n// Vérifie si la largeur de la fenêtre est inférieure à 769px (tablette et mobile)\nif (window.innerWidth < 769) {\n document.addEventListener(\"DOMContentLoaded\", function () {\n const menuButton = document.querySelector(\"#menuButton\");\n const navbarMenus = document.querySelectorAll(\".navbar5_menu\");\n const mainWrapper = document.querySelector(\".main-wrapper\");\n const backgroundNavbar = document.querySelector(\".background-navbar\");\n\n function updateBackgroundNavbarStyles() {\n // Vérifie si au moins un .navbar5_menu est en display flex\n const atLeastOneMenuOpen = Array.from(navbarMenus).some((menu) => {\n return window.getComputedStyle(menu).display === \"flex\";\n });\n\n if (atLeastOneMenuOpen) {\n // Quand au moins un menu est ouvert\n backgroundNavbar.style.position = \"absolute\";\n backgroundNavbar.style.top = \"0\";\n backgroundNavbar.style.left = \"0\";\n backgroundNavbar.style.width = \"100vw\";\n backgroundNavbar.style.height = \"100vh\";\n backgroundNavbar.style.transform = \"translateY(0)\";\n backgroundNavbar.style.display = \"block\";\n\n // Appliquer le filtre blur de 4px\n mainWrapper.style.filter = \"blur(4px)\";\n mainWrapper.style.transition =\n \"filter 0.5s cubic-bezier(.165, .84, .44, 1)\";\n\n // Bloquer le scroll\n document.body.style.overflow = \"hidden\";\n } else {\n // Quand tous les menus sont fermés\n backgroundNavbar.style.display = \"none\";\n backgroundNavbar.style.transform = \"translateY(-100%)\";\n\n // Remettre le filtre blur à 0px\n mainWrapper.style.filter = \"blur(0px)\";\n\n // Force tous les .navbar5_menu en display none\n navbarMenus.forEach((menu) => {\n menu.style.display = \"none\";\n });\n\n // Réactiver le scroll\n document.body.style.overflow = \"\";\n }\n }\n\n // Appel initial de la fonction pour mettre à jour les styles\n updateBackgroundNavbarStyles();\n\n // Écouteur d'événement au clic sur #menuButton\n if (menuButton) {\n menuButton.addEventListener(\"click\", () => {\n // Petit délai pour laisser le temps au menu de s'ouvrir/fermer\n setTimeout(updateBackgroundNavbarStyles, 50);\n });\n }\n\n // Observer les changements de style sur chaque .navbar5_menu\n navbarMenus.forEach((menu) => {\n const observer = new MutationObserver(updateBackgroundNavbarStyles);\n observer.observe(menu, {\n attributes: true,\n attributeFilter: [\"style\", \"class\"],\n });\n });\n });\n}\n\n/* =========================\n ✅ GSAP ANIM GLOBAL\n ========================= */\n\ngsap.registerPlugin(ScrollTrigger);\n\nfunction animateElements() {\n ScrollTrigger.getAll().forEach((trigger) => trigger.kill());\n\n // Masquer tous les finals dès le départ\n document.querySelectorAll('[display=\"final\"]').forEach((final) => {\n gsap.set(final, { display: \"none\", opacity: 0 });\n });\n\n gsap.utils.toArray('[data-animate=\"fade-up\"]').forEach((element) => {\n const delay = parseFloat(element.dataset.delay) || 0;\n const startY = element.dataset.startY;\n const startX = element.dataset.startX;\n const endY = element.dataset.endY;\n const endX = element.dataset.endX;\n const startRotate = element.dataset.startRotate || 0;\n const endRotate = element.dataset.endRotate || 0;\n\n const skeletons = element.querySelectorAll('[display=\"skeleton\"]');\n const finals = element.querySelectorAll('[display=\"final\"]');\n\n gsap.fromTo(element, {\n opacity: 0,\n y: startY,\n x: startX,\n rotate: startRotate,\n }, {\n opacity: 1,\n y: endY,\n x: endX,\n rotate: endRotate,\n duration: 1,\n delay: delay,\n ease: \"power3.out\",\n scrollTrigger: {\n trigger: element,\n start: \"top 95%\",\n toggleActions: \"play none none none\",\n once: true,\n onEnter: () => {\n if (!skeletons.length || !finals.length) return;\n\n const skeletonDuration = 500;\n\n setTimeout(() => {\n skeletons.forEach((skeleton, i) => {\n const final = finals[i];\n if (!final) return;\n\n const tl = gsap.timeline();\n\n tl.to(skeleton, {\n opacity: 0,\n duration: 0.3,\n ease: \"power2.in\",\n onComplete: () => gsap.set(skeleton, { display: \"none\" }),\n });\n\n tl.set(final, { display: \"block\" });\n\n tl.to(final, {\n opacity: 1,\n duration: 0.4,\n ease: \"power2.out\",\n });\n });\n }, (delay * 1) + skeletonDuration);\n },\n },\n });\n });\n}\n\n// ============================================\n// INIT\n// ============================================\n\nanimateElements();\n\ndocument.querySelectorAll('[gsap-trigger=\"click\"]').forEach((trigger) => {\n trigger.addEventListener(\"click\", function () {\n setTimeout(() => {\n animateElements();\n }, 300);\n });\n});\n\n/* =========================\n ✅ BENTO TO TABS TABLET/MOBILE\n ========================= */\n\nconst mediaQuery = window.matchMedia(\"(max-width: 991px)\");\n\nfunction initCardBlurTabs() {\n if (!mediaQuery.matches) {\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) => {\n list.style.height = \"\";\n list.style.overflow = \"\";\n list.style.display = \"\";\n });\n return;\n }\n\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) => {\n const isFirst = list.getAttribute(\"card-blur-tabs-load\") === \"first\";\n\n if (isFirst) {\n list.style.setProperty(\"height\", \"auto\", \"important\");\n list.style.setProperty(\"overflow\", \"visible\", \"important\");\n list.style.setProperty(\"display\", \"flex\", \"important\");\n } else {\n list.style.setProperty(\"height\", \"0px\", \"important\");\n list.style.setProperty(\"overflow\", \"hidden\", \"important\");\n list.style.setProperty(\"display\", \"none\", \"important\");\n }\n });\n\n setTimeout(updateDropdownStyles, 100);\n}\n\nfunction updateDropdownStyles() {\n if (!mediaQuery.matches) {\n document.querySelectorAll('[card-blur-tabs=\"dropdown\"]').forEach(\n (dropdown) => {\n const dropdownChild = dropdown.children[0];\n if (dropdownChild) dropdownChild.style.transform = \"\";\n dropdown.style.color = \"\";\n dropdown.style.backgroundImage = \"\";\n },\n );\n\n document.querySelectorAll('[card-blur-tabs=\"dropdown-dark\"]').forEach(\n (dropdown) => {\n const dropdownChild = dropdown.children[0];\n if (dropdownChild) dropdownChild.style.transform = \"\";\n dropdown.style.backgroundColor = \"\";\n dropdown.style.color = \"\";\n dropdown.style.border = \"\";\n },\n );\n return;\n }\n\n document.querySelectorAll('[card-blur-tabs=\"toggle\"]').forEach((toggle) => {\n const dropdown = toggle.querySelector('[card-blur-tabs=\"dropdown\"]');\n const dropdownDark = toggle.querySelector(\n '[card-blur-tabs=\"dropdown-dark\"]',\n );\n\n const siblingLists = Array.from(\n toggle.parentElement.querySelectorAll('[card-blur-tabs=\"list\"]'),\n );\n\n const isAnyListOpen = siblingLists.some((list) => {\n const style = window.getComputedStyle(list);\n return style.height !== \"0px\" && style.display !== \"none\";\n });\n\n // Gestion dropdown-close couleur\n toggle.querySelectorAll(\"[dropdown-close]\").forEach((el) => {\n const closeColor = el.getAttribute(\"dropdown-close\");\n if (!closeColor) return;\n el.style.setProperty(\"transition\", \"color 0.3s ease\", \"important\");\n if (isAnyListOpen) {\n el.style.setProperty(\"color\", \"white\", \"important\");\n } else {\n el.style.setProperty(\"color\", closeColor, \"important\");\n }\n });\n\n // Gestion dropdown normal\n if (dropdown) {\n const dropdownChild = dropdown.children[0];\n if (isAnyListOpen) {\n if (dropdownChild) {\n dropdownChild.style.setProperty(\n \"transition\",\n \"transform 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdownChild.style.setProperty(\n \"transform\",\n \"rotate(0deg)\",\n \"important\",\n );\n });\n }\n dropdown.style.setProperty(\n \"transition\",\n \"color 0.3s ease, background-image 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdown.style.setProperty(\"color\", \"white\", \"important\");\n dropdown.style.setProperty(\"background-image\", \"none\", \"important\");\n });\n } else {\n if (dropdownChild) {\n dropdownChild.style.setProperty(\n \"transition\",\n \"transform 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdownChild.style.setProperty(\n \"transform\",\n \"rotate(180deg)\",\n \"important\",\n );\n });\n }\n dropdown.style.setProperty(\n \"transition\",\n \"color 0.3s ease, background-image 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdown.style.setProperty(\"color\", \"\", \"important\");\n dropdown.style.setProperty(\"background-image\", \"\", \"important\");\n });\n }\n }\n\n // Gestion dropdown-dark\n if (dropdownDark) {\n const dropdownDarkChild = dropdownDark.children[0];\n if (isAnyListOpen) {\n if (dropdownDarkChild) {\n dropdownDarkChild.style.setProperty(\n \"transition\",\n \"transform 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdownDarkChild.style.setProperty(\n \"transform\",\n \"rotate(0deg)\",\n \"important\",\n );\n });\n }\n dropdownDark.style.setProperty(\n \"transition\",\n \"background-color 0.3s ease, color 0.3s ease, border 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdownDark.style.setProperty(\n \"background-color\",\n \"#00094A\",\n \"important\",\n );\n dropdownDark.style.setProperty(\"color\", \"white\", \"important\");\n dropdownDark.style.setProperty(\"border\", \"none\", \"important\");\n });\n } else {\n if (dropdownDarkChild) {\n dropdownDarkChild.style.setProperty(\n \"transition\",\n \"transform 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdownDarkChild.style.setProperty(\n \"transform\",\n \"rotate(180deg)\",\n \"important\",\n );\n });\n }\n dropdownDark.style.setProperty(\n \"transition\",\n \"background-color 0.3s ease, color 0.3s ease, border 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdownDark.style.setProperty(\"background-color\", \"\", \"important\");\n dropdownDark.style.setProperty(\"color\", \"\", \"important\");\n dropdownDark.style.setProperty(\"border\", \"\", \"important\");\n });\n }\n }\n });\n}\n\nfunction handleCardBlurTabsClick() {\n document.querySelectorAll('[card-blur-tabs=\"toggle\"]').forEach((button) => {\n button.addEventListener(\"click\", () => {\n if (!mediaQuery.matches) return;\n\n const siblingLists = Array.from(\n button.parentElement.querySelectorAll('[card-blur-tabs=\"list\"]'),\n );\n\n const isOpen = siblingLists.some((list) => {\n const style = window.getComputedStyle(list);\n return style.height !== \"0px\" && style.display !== \"none\";\n });\n\n // Changer les couleurs dropdown-close immédiatement au clic\n button.querySelectorAll(\"[dropdown-close]\").forEach((el) => {\n const closeColor = el.getAttribute(\"dropdown-close\");\n if (!closeColor) return;\n el.style.setProperty(\"transition\", \"color 0.3s ease\", \"important\");\n if (isOpen) {\n // On ferme → retour à closeColor\n el.style.setProperty(\"color\", closeColor, \"important\");\n } else {\n // On ouvre → blanc\n el.style.setProperty(\"color\", \"white\", \"important\");\n }\n });\n\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) => {\n list.style.setProperty(\"height\", \"0px\", \"important\");\n list.style.setProperty(\"overflow\", \"hidden\", \"important\");\n list.style.setProperty(\"display\", \"none\", \"important\");\n });\n\n if (!isOpen) {\n siblingLists.forEach((list) => {\n list.style.setProperty(\"height\", \"auto\", \"important\");\n list.style.setProperty(\"overflow\", \"visible\", \"important\");\n list.style.setProperty(\"display\", \"flex\", \"important\");\n });\n }\n\n setTimeout(updateDropdownStyles, 100);\n });\n });\n}\n\nmediaQuery.addEventListener(\"change\", () => {\n initCardBlurTabs();\n updateDropdownStyles();\n});\n\nif (document.readyState === \"loading\") {\n document.addEventListener(\"DOMContentLoaded\", () => {\n initCardBlurTabs();\n handleCardBlurTabsClick();\n });\n} else {\n initCardBlurTabs();\n handleCardBlurTabsClick();\n}\n\n/* =========================\n ✅ IM MARQUEE INVESTIR : GESTION HIGHLIGHT\n ========================= */\nfunction startRandomHighlight() {\n const viewport = document.querySelector(\"[data-marquee-viewport]\");\n\n if (!viewport) {\n return;\n }\n\n let currentHighlightedItem = null;\n let currentLineIndex = 0;\n let rotationInterval = null;\n\n function getLines() {\n const lines = viewport.querySelectorAll(\"[data-line]\");\n return Array.from(lines);\n }\n\n function getVisibleItemsInLine(line) {\n const viewportRect = viewport.getBoundingClientRect();\n const items = line.querySelectorAll(\"[data-highlight-target]\");\n const visibleItems = [];\n\n const margin = 50;\n const visibleLeft = viewportRect.left + margin;\n const visibleRight = viewportRect.right - margin;\n\n items.forEach((item) => {\n const itemRect = item.getBoundingClientRect();\n const itemCenter = itemRect.left + itemRect.width / 2;\n const isVisible = itemCenter > visibleLeft && itemCenter < visibleRight;\n\n if (isVisible) {\n visibleItems.push({\n element: item,\n center: itemCenter,\n text: item.textContent.trim(),\n });\n }\n });\n\n return visibleItems;\n }\n\n function isItemStillVisible(item) {\n if (!item) return false;\n\n const viewportRect = viewport.getBoundingClientRect();\n const itemRect = item.element.getBoundingClientRect();\n const itemCenter = itemRect.left + itemRect.width / 2;\n\n const margin = 50;\n const visibleLeft = viewportRect.left + margin;\n const visibleRight = viewportRect.right - margin;\n\n return itemCenter > visibleLeft && itemCenter < visibleRight;\n }\n\n function removeHighlight() {\n if (currentHighlightedItem) {\n currentHighlightedItem.element.classList.remove(\"is-highlighted\");\n\n // Retirer la classe couleur du label\n const labelElement = currentHighlightedItem.element.querySelector(\n \".label-industrie\",\n );\n if (labelElement) {\n labelElement.classList.remove(\"text-color-custom\");\n }\n\n // Remettre l'opacité à 0 pour .gradient-industrie\n const gradientElement = currentHighlightedItem.element.querySelector(\n \".gradient-industrie\",\n );\n if (gradientElement) {\n gradientElement.style.opacity = \"0\";\n }\n\n currentHighlightedItem = null;\n }\n }\n\n function applyRandomHighlightOnCurrentLine() {\n const lines = getLines();\n const currentLine = lines[currentLineIndex];\n\n if (!currentLine) return false;\n\n const visibleItems = getVisibleItemsInLine(currentLine);\n\n if (visibleItems.length === 0) {\n return false;\n }\n\n const randomIndex = Math.floor(Math.random() * visibleItems.length);\n const selectedItem = visibleItems[randomIndex];\n\n currentHighlightedItem = selectedItem;\n selectedItem.element.classList.add(\"is-highlighted\");\n\n // Ajouter la classe couleur au label\n const labelElement = selectedItem.element.querySelector(\".label-industrie\");\n if (labelElement) {\n labelElement.classList.add(\"text-color-custom\");\n }\n\n // Mettre l'opacité à 1 pour .gradient-industrie\n const gradientElement = selectedItem.element.querySelector(\n \".gradient-industrie\",\n );\n if (gradientElement) {\n gradientElement.style.opacity = \"1\";\n }\n\n return true;\n }\n\n function findNextLineWithVisibleItems() {\n const lines = getLines();\n let attempts = 0;\n const maxAttempts = lines.length;\n\n while (attempts < maxAttempts) {\n currentLineIndex = (currentLineIndex + 1) % lines.length;\n attempts++;\n\n if (applyRandomHighlightOnCurrentLine()) {\n return true;\n }\n }\n\n return false;\n }\n\n function applyRandomHighlightOnNextLine() {\n removeHighlight();\n\n if (findNextLineWithVisibleItems()) {\n resetRotationInterval();\n }\n }\n\n function checkVisibility() {\n if (currentHighlightedItem && !isItemStillVisible(currentHighlightedItem)) {\n removeHighlight();\n\n if (!applyRandomHighlightOnCurrentLine()) {\n findNextLineWithVisibleItems();\n }\n\n resetRotationInterval();\n }\n }\n\n function resetRotationInterval() {\n if (rotationInterval) {\n clearInterval(rotationInterval);\n }\n\n rotationInterval = setInterval(() => {\n applyRandomHighlightOnNextLine();\n }, 4000);\n }\n\n setInterval(checkVisibility, 100);\n\n setTimeout(() => {\n if (!applyRandomHighlightOnCurrentLine()) {\n findNextLineWithVisibleItems();\n }\n\n resetRotationInterval();\n }, 100);\n}\n\ndocument.addEventListener(\"DOMContentLoaded\", () => {\n setTimeout(() => {\n startRandomHighlight();\n }, 500);\n});\n\n/* =========================\n 🚧 Auto animate Startup Tags on map\n ========================= */\nwindow.initTagsAnimateOnMap = initTagsAnimateOnMap;\nfunction initTagsAnimateOnMap() {\n // ── CONFIG ──\n var INTERVAL = 2000;\n var FADE = 400;\n var STAGGER = 300;\n\n // ── RUN FOR EACH INSTANCE ──\n document.querySelectorAll(\"[data-tag-rotator]\").forEach(function (container) {\n var pool = Array.from(container.querySelectorAll(\"[data-tag]\"));\n var allSlots = container.querySelectorAll(\"[data-tag-slot]\");\n var slots = Array.from(allSlots).filter(function (slot) {\n return getComputedStyle(slot).display !== \"none\";\n });\n var poolIndex = 0;\n var slotIndex = 0;\n\n function nextTag() {\n var tag = pool[poolIndex].cloneNode(true);\n poolIndex = poolIndex + 1;\n if (poolIndex >= pool.length) {\n poolIndex = 0;\n }\n return tag;\n }\n\n slots.forEach(function (slot, i) {\n slot.innerHTML = \"\";\n slot.style.width = \"auto\";\n slot.style.height = \"auto\";\n slot.appendChild(nextTag());\n setTimeout(function () {\n slot.classList.add(\"visible\");\n }, i * STAGGER);\n });\n\n function fadeOut() {\n var slot = slots[slotIndex];\n slot.classList.remove(\"visible\");\n slot.classList.add(\"exit\");\n setTimeout(swapAndFadeIn, FADE);\n }\n\n function swapAndFadeIn() {\n var slot = slots[slotIndex];\n slot.innerHTML = \"\";\n slot.appendChild(nextTag());\n slot.style.transition = \"none\";\n slot.classList.remove(\"exit\");\n slot.offsetHeight;\n slot.style.transition = \"\";\n slot.classList.add(\"visible\");\n slotIndex = slotIndex + 1;\n if (slotIndex >= slots.length) {\n slotIndex = 0;\n }\n }\n\n setTimeout(function () {\n setInterval(fadeOut, INTERVAL);\n }, slots.length * STAGGER);\n });\n}\n\n/* =========================\n ✅ AUTO ROTATE FAKE TABS ANIMATION\n ========================= */\n\nwindow.AutoRotateFakeTabs = AutoRotateFakeTabs;\nfunction AutoRotateFakeTabs() {\n // ---- FIND ELEMENTS ----\n var wrap = document.querySelector(\"[data-tabs-wrap]\");\n var triggers = wrap.querySelectorAll(\"[data-tabs-trigger]\");\n var panels = wrap.querySelectorAll(\"[data-tabs-panel]\");\n var bars = wrap.querySelectorAll(\"[data-tabs-progress-bar]\");\n var duration = Number(wrap.getAttribute(\"data-tabs-duration\")) || 5000;\n\n // ---- STATE ----\n var currentIndex = 0;\n var timer = null;\n\n // ---- SWITCH TO A TAB ----\n function switchToTab(index) {\n // 1. Remove \"is-active\" from all triggers and panels\n for (var i = 0; i < triggers.length; i++) {\n triggers[i].classList.remove(\"is-active\");\n panels[i].classList.remove(\"is-active\");\n }\n\n // 2. Add \"is-active\" to the chosen trigger and panel\n triggers[index].classList.add(\"is-active\");\n panels[index].classList.add(\"is-active\");\n\n // 3. Reset all progress bars to 0\n for (var i = 0; i < bars.length; i++) {\n bars[i].style.transition = \"none\";\n bars[i].style.width = \"0%\";\n }\n\n // 4. Animate the active progress bar to 100%\n void bars[index].offsetWidth; // force browser to apply the reset before animating\n bars[index].style.transition = \"width \" + duration + \"ms linear\";\n bars[index].style.width = \"100%\";\n\n // 5. Update state\n currentIndex = index;\n }\n\n // ---- GO TO NEXT TAB ----\n function goToNextTab() {\n var nextIndex = (currentIndex + 1) % triggers.length;\n switchToTab(nextIndex);\n }\n\n // ---- START / STOP AUTOPLAY ----\n function startAutoplay() {\n stopAutoplay();\n timer = setInterval(goToNextTab, duration);\n }\n\n function stopAutoplay() {\n clearInterval(timer);\n }\n\n // ---- CLICK ON A TAB ----\n for (var i = 0; i < triggers.length; i++) {\n (function (index) {\n triggers[index].addEventListener(\"click\", function () {\n switchToTab(index);\n startAutoplay(); // restart timer after manual click\n });\n })(i);\n }\n\n // ---- PAUSE ON HOVER ----\n //wrap.addEventListener(\"mouseenter\", stopAutoplay);\n //wrap.addEventListener(\"mouseleave\", startAutoplay);\n\n // ---- INIT ----\n switchToTab(0);\n startAutoplay();\n // Mark as ready — this activates the CSS that hides inactive panels\n // Without JS (e.g. in the Webflow Designer), all panels stay visible\n wrap.setAttribute(\"data-tabs-ready\", \"\");\n}\n\ndocument.addEventListener(\"DOMContentLoaded\", () => {\n AutoRotateFakeTabs();\n});\n\n/* =========================\n ✅ VIDEO MAGNETIC BTN\n ========================= */\n\n/* ---------- Magnetic Effect ---------- */\nfunction initMagneticEffect() {\n // On sélectionne maintenant la zone \"wrapper\" (.btn-magnetic) qui est plus grande\n const magnets = document.querySelectorAll(\".btn-magnetic\");\n if (window.innerWidth <= 991) return;\n\n // Fonction pour tuer les tweens et réinitialiser\n const resetEl = (el, immediate) => {\n if (!el) return;\n gsap.killTweensOf(el);\n (immediate ? gsap.set : gsap.to)(el, {\n x: \"0em\",\n y: \"0em\",\n rotate: \"0deg\",\n clearProps: \"all\",\n ...(!immediate && { ease: \"elastic.out(1, 0.3)\", duration: 1.6 }),\n });\n };\n\n const resetOnEnter = (e) => {\n const m = e.currentTarget;\n const target = m.querySelector(\".btn-magnetic__click\");\n if (!target) return;\n resetEl(target, true);\n resetEl(target.querySelector(\"[data-magnetic-inner-target]\"), true);\n };\n\n const moveMagnet = (e) => {\n const m = e.currentTarget; // Le wrapper invisible grand format\n const target = m.querySelector(\".btn-magnetic__click\"); // Le bouton visuel\n if (!target) return;\n\n const b = m.getBoundingClientRect(),\n strength = parseFloat(target.getAttribute(\"data-magnetic-strength\")) ||\n 25,\n inner = target.querySelector(\"[data-magnetic-inner-target]\"),\n innerStrength =\n parseFloat(target.getAttribute(\"data-magnetic-strength-inner\")) ||\n strength,\n // offsetX et Y calculent la position par rapport au wrapper (350x350)\n offsetX = ((e.clientX - b.left) / m.offsetWidth - 0.5) * (strength / 16),\n offsetY = ((e.clientY - b.top) / m.offsetHeight - 0.5) * (strength / 16);\n\n // On déplace le bouton \".btn-magnetic__click\" à l'intérieur du wrapper\n gsap.to(target, {\n x: offsetX + \"em\",\n y: offsetY + \"em\",\n rotate: \"0.001deg\",\n ease: \"power4.out\",\n duration: 1.6,\n });\n\n if (inner) {\n const innerOffsetX = ((e.clientX - b.left) / m.offsetWidth - 0.5) *\n (innerStrength / 16),\n innerOffsetY = ((e.clientY - b.top) / m.offsetHeight - 0.5) *\n (innerStrength / 16);\n gsap.to(inner, {\n x: innerOffsetX + \"em\",\n y: innerOffsetY + \"em\",\n rotate: \"0.001deg\",\n ease: \"power4.out\",\n duration: 2,\n });\n }\n };\n\n const resetMagnet = (e) => {\n const m = e.currentTarget;\n const target = m.querySelector(\".btn-magnetic__click\");\n if (!target) return;\n\n const inner = target.querySelector(\"[data-magnetic-inner-target]\");\n\n // Retour fluide au centre\n gsap.to(target, {\n x: \"0em\",\n y: \"0em\",\n ease: \"elastic.out(1, 0.3)\",\n duration: 1.6,\n clearProps: \"all\",\n });\n if (inner) {\n gsap.to(inner, {\n x: \"0em\",\n y: \"0em\",\n ease: \"elastic.out(1, 0.3)\",\n duration: 2,\n clearProps: \"all\",\n });\n }\n };\n\n magnets.forEach((m) => {\n m.addEventListener(\"mouseenter\", resetOnEnter);\n m.addEventListener(\"mousemove\", moveMagnet);\n m.addEventListener(\"mouseleave\", resetMagnet);\n });\n}\n\n/* ---------- Init Vimeo Lightbox ---------- */\nfunction initVimeoLightboxAdvanced() {\n // Single lightbox container\n const lightbox = document.querySelector(\"[data-vimeo-lightbox-init]\");\n if (!lightbox) return;\n\n // Open & close buttons\n const openButtons = document.querySelectorAll(\n '[data-vimeo-lightbox-control=\"open\"]',\n );\n const closeButtons = document.querySelectorAll(\n '[data-vimeo-lightbox-control=\"close\"]',\n );\n\n // Core elements inside lightbox\n let iframe = lightbox.querySelector(\"iframe\"); // ← now let\n const placeholder = lightbox.querySelector(\".vimeo-lightbox__placeholder\");\n const calcEl = lightbox.querySelector(\".vimeo-lightbox__calc\");\n const wrapEl = lightbox.querySelector(\".vimeo-lightbox__calc-wrap\");\n const playerContainer = lightbox.querySelector(\n \"[data-vimeo-lightbox-player]\",\n );\n\n // State\n let player = null;\n let currentVideoID = null;\n let videoAspectRatio = null;\n let globalMuted = lightbox.getAttribute(\"data-vimeo-muted\") === \"true\";\n const isTouch = (\"ontouchstart\" in window) || navigator.maxTouchPoints > 0;\n const playedOnce = new Set(); // track first play on touch\n\n // Format time (seconds → \"m:ss\")\n function formatTime(s) {\n const m = Math.floor(s / 60);\n const sec = Math.floor(s % 60).toString().padStart(2, \"0\");\n return `${m}:${sec}`;\n }\n\n // Clamp wrap height\n function clampWrapSize(ar) {\n const w = calcEl.offsetWidth;\n const h = calcEl.offsetHeight;\n wrapEl.style.maxWidth = Math.min(w, h / ar) + \"px\";\n }\n\n // Adjust sizing in \"cover\" mode\n function adjustCoverSizing() {\n if (!videoAspectRatio) return;\n const cH = playerContainer.offsetHeight;\n const cW = playerContainer.offsetWidth;\n const r = cH / cW;\n const wEl = lightbox.querySelector(\".vimeo-lightbox__iframe\");\n if (r > videoAspectRatio) {\n wEl.style.width = (r / videoAspectRatio * 100) + \"%\";\n wEl.style.height = \"100%\";\n } else {\n wEl.style.height = (videoAspectRatio / r * 100) + \"%\";\n wEl.style.width = \"100%\";\n }\n }\n\n // Close & pause lightbox\n function closeLightbox() {\n lightbox.setAttribute(\"data-vimeo-activated\", \"false\");\n if (player) {\n player.pause();\n lightbox.setAttribute(\"data-vimeo-playing\", \"false\");\n }\n }\n\n // Wire Escape key & close buttons\n document.addEventListener(\"keydown\", (e) => {\n if (e.key === \"Escape\") closeLightbox();\n });\n closeButtons.forEach((btn) => btn.addEventListener(\"click\", closeLightbox));\n\n // Close when clicking outside the video\n lightbox.addEventListener(\"click\", (e) => {\n // Ignorer si le clic est sur le composant vidéo en lui-même (data-vimeo-lightbox-player)\n if (e.target.closest(\"[data-vimeo-lightbox-player]\")) return;\n\n // Ignorer si le clic est sur un bouton de contrôle (play/pause/timeline...)\n if (e.target.closest(\"[data-vimeo-control]\")) return;\n\n // Ignorer si le clic est sur une autre action interne (*à l'exception* de l'arrière-plan/fermeture).\n // On vérifie que c'est un bouton \"open\" ou qu'on ne cible pas la classe background.\n if (\n e.target.closest('[data-vimeo-lightbox-control=\"open\"]') ||\n (e.target.closest(\"[data-vimeo-lightbox-control]\") &&\n !e.target.closest(\".vimeo-lightbox__bg\") &&\n !e.target.closest('[data-vimeo-lightbox-control=\"close\"]')) // Le bouton close ferme déjà seul, c'est optionnel\n ) {\n return;\n }\n\n // Sinon, on ferme.\n closeLightbox();\n });\n\n // Setup Vimeo Player event handlers\n function setupPlayerEvents() {\n // Hide placeholder when playback starts\n player.on(\"play\", () => {\n lightbox.setAttribute(\"data-vimeo-loaded\", \"true\");\n lightbox.setAttribute(\"data-vimeo-playing\", \"true\");\n });\n // Close on video end\n player.on(\"ended\", closeLightbox);\n\n // Paused\n player.on(\"pause\", () => {\n lightbox.setAttribute(\"data-vimeo-playing\", \"false\");\n });\n\n // Duration UI\n const durEl = lightbox.querySelector(\"[data-vimeo-duration]\");\n player.getDuration().then((d) => {\n if (durEl) durEl.textContent = formatTime(d);\n lightbox.querySelectorAll('[data-vimeo-control=\"timeline\"],progress')\n .forEach((el) => el.max = d);\n });\n\n // Timeline & progress updates\n const tl = lightbox.querySelector('[data-vimeo-control=\"timeline\"]');\n const pr = lightbox.querySelector(\"progress\");\n player.on(\"timeupdate\", (data) => {\n if (tl) tl.value = data.seconds;\n if (pr) pr.value = data.seconds;\n if (durEl) durEl.textContent = formatTime(Math.trunc(data.seconds));\n });\n if (tl) {\n [\"input\", \"change\"].forEach((evt) =>\n tl.addEventListener(evt, (e) => {\n const v = e.target.value;\n player.setCurrentTime(v);\n if (pr) pr.value = v;\n })\n );\n }\n\n // Hover → hide controls after a timeout\n let hoverTimer;\n playerContainer.addEventListener(\"mousemove\", () => {\n lightbox.setAttribute(\"data-vimeo-hover\", \"true\");\n clearTimeout(hoverTimer);\n hoverTimer = setTimeout(() => {\n lightbox.setAttribute(\"data-vimeo-hover\", \"false\");\n }, 3000);\n });\n\n // Fullscreen toggle on player container\n const fsBtn = lightbox.querySelector('[data-vimeo-control=\"fullscreen\"]');\n if (fsBtn) {\n const isFS = () =>\n document.fullscreenElement || document.webkitFullscreenElement;\n if (!(document.fullscreenEnabled || document.webkitFullscreenEnabled)) {\n fsBtn.style.display = \"none\";\n }\n fsBtn.addEventListener(\"click\", () => {\n if (isFS()) {\n lightbox.setAttribute(\"data-vimeo-fullscreen\", \"false\");\n (document.exitFullscreen || document.webkitExitFullscreen).call(\n document,\n );\n } else {\n lightbox.setAttribute(\"data-vimeo-fullscreen\", \"true\");\n (playerContainer.requestFullscreen ||\n playerContainer.webkitRequestFullscreen)\n .call(playerContainer);\n }\n });\n [\"fullscreenchange\", \"webkitfullscreenchange\"].forEach((evt) =>\n document.addEventListener(\n evt,\n () =>\n lightbox.setAttribute(\n \"data-vimeo-fullscreen\",\n isFS() ? \"true\" : \"false\",\n ),\n )\n );\n }\n }\n\n // Run sizing logic\n async function runSizing() {\n const mode = lightbox.getAttribute(\"data-vimeo-update-size\");\n const w = await player.getVideoWidth();\n const h = await player.getVideoHeight();\n const ar = h / w;\n const bef = lightbox.querySelector(\".vimeo-lightbox__before\");\n\n if (mode === \"true\") {\n if (bef) bef.style.paddingTop = (ar * 100) + \"%\";\n clampWrapSize(ar);\n } else if (mode === \"cover\") {\n videoAspectRatio = ar;\n if (bef) bef.style.paddingTop = \"0%\";\n adjustCoverSizing();\n } else {\n clampWrapSize(ar);\n }\n }\n\n // Re-run sizing on viewport resize\n window.addEventListener(\"resize\", () => {\n if (player) runSizing();\n });\n\n // Open or switch video\n async function openLightbox(id, placeholderBtn) {\n // Enter loading state immediately\n lightbox.setAttribute(\"data-vimeo-activated\", \"loading\");\n lightbox.setAttribute(\"data-vimeo-loaded\", \"false\");\n\n // — FULL RESET if new video ID —\n if (player && id !== currentVideoID) {\n await player.pause();\n await player.unload();\n\n // Replace old iframe with a fresh one\n const oldIframe = iframe;\n const newIframe = document.createElement(\"iframe\");\n newIframe.className = oldIframe.className;\n newIframe.setAttribute(\"allow\", oldIframe.getAttribute(\"allow\"));\n newIframe.setAttribute(\"frameborder\", \"0\");\n newIframe.setAttribute(\"allowfullscreen\", \"true\");\n newIframe.setAttribute(\"allow\", \"autoplay; encrypted-media\");\n oldIframe.parentNode.replaceChild(newIframe, oldIframe);\n\n // Reset state\n iframe = newIframe;\n player = null;\n currentVideoID = null;\n lightbox.setAttribute(\"data-vimeo-playing\", \"false\");\n }\n\n // Update placeholder image attributes\n if (placeholderBtn) {\n [\"src\", \"srcset\", \"sizes\", \"alt\", \"width\"].forEach((attr) => {\n const val = placeholderBtn.getAttribute(attr);\n if (val != null) {\n placeholder.setAttribute(attr, val);\n } else {\n placeholder.removeAttribute(attr);\n }\n });\n }\n\n // Build a brand-new player if needed\n if (!player) {\n iframe.src =\n `https://player.vimeo.com/video/${id}?api=1&background=1&autoplay=0&loop=0&muted=0`;\n player = new Vimeo.Player(iframe);\n setupPlayerEvents();\n currentVideoID = id;\n await runSizing();\n }\n\n // Now sizing is ready — show lightbox\n lightbox.setAttribute(\"data-vimeo-activated\", \"true\");\n\n // Autoplay logic\n if (!isTouch) {\n player.setVolume(globalMuted ? 0 : 1).then(() => {\n lightbox.setAttribute(\"data-vimeo-playing\", \"true\");\n setTimeout(() => player.play(), 50);\n });\n } else {\n // Sur mobile (isTouch), on lance la vidéo au premier clic\n if (!playedOnce.has(currentVideoID)) {\n // Pour que le navigateur accepte l'autoplay sur mobile, on doit souvent forcer le mute au lancement\n player.setVolume(0).then(() => {\n lightbox.setAttribute(\"data-vimeo-playing\", \"true\");\n player.play();\n // On remet le son après un court instant si ce n'était pas muet globalement\n if (!globalMuted) {\n setTimeout(() => {\n player.setVolume(1);\n lightbox.setAttribute(\"data-vimeo-muted\", \"false\");\n }, 100);\n }\n playedOnce.add(currentVideoID);\n });\n } else {\n player.setVolume(globalMuted ? 0 : 1).then(() => {\n lightbox.setAttribute(\"data-vimeo-playing\", \"true\");\n player.play();\n });\n }\n }\n }\n\n // Internal controls\n lightbox.querySelector('[data-vimeo-control=\"play\"]').addEventListener(\n \"click\",\n () => {\n if (isTouch) {\n if (!playedOnce.has(currentVideoID)) {\n player.setVolume(0).then(() => {\n lightbox.setAttribute(\"data-vimeo-playing\", \"true\");\n player.play();\n if (!globalMuted) {\n setTimeout(() => {\n player.setVolume(1);\n lightbox.setAttribute(\"data-vimeo-muted\", \"false\");\n }, 100);\n }\n playedOnce.add(currentVideoID);\n });\n } else {\n player.setVolume(globalMuted ? 0 : 1).then(() => {\n lightbox.setAttribute(\"data-vimeo-playing\", \"true\");\n player.play();\n });\n }\n } else {\n player.setVolume(globalMuted ? 0 : 1).then(() => {\n lightbox.setAttribute(\"data-vimeo-playing\", \"true\");\n setTimeout(() => player.play(), 50);\n });\n }\n },\n );\n\n lightbox.querySelector('[data-vimeo-control=\"pause\"]').addEventListener(\n \"click\",\n () => {\n player.pause();\n },\n );\n\n lightbox.querySelector('[data-vimeo-control=\"mute\"]').addEventListener(\n \"click\",\n () => {\n globalMuted = !globalMuted;\n player.setVolume(globalMuted ? 0 : 1).then(() =>\n lightbox.setAttribute(\n \"data-vimeo-muted\",\n globalMuted ? \"true\" : \"false\",\n )\n );\n },\n );\n\n // Wire up open buttons\n openButtons.forEach((btn) => {\n btn.addEventListener(\"click\", () => {\n const vid = btn.getAttribute(\"data-vimeo-lightbox-id\");\n const img = btn.querySelector(\"[data-vimeo-lightbox-placeholder]\");\n console.log(\"--- Vimeo Lightbox Clicked ---\");\n console.log(\"Video ID found:\", vid);\n console.log(\"Thumbnail (img) found:\", img);\n openLightbox(vid, img);\n });\n });\n}\n\n/* ---------- Parallax Effect ---------- */\nfunction initParallaxLayers() {\n document.querySelectorAll(\"[data-parallax-layers]\").forEach(\n (triggerElement) => {\n let tl = gsap.timeline({\n scrollTrigger: {\n trigger: triggerElement,\n start: \"top bottom\",\n end: \"bottom top\",\n scrub: 1,\n },\n });\n const layers = [\n { layer: \"1\", yPercentFrom: 0, yPercent: -20 },\n { layer: \"2\", yPercentFrom: 0, yPercent: -25 },\n { layer: \"3\", yPercentFrom: 0, yPercent: -16 },\n { layer: \"4\", yPercentFrom: 0, yPercent: -6 },\n ];\n layers.forEach((layerObj, idx) => {\n tl.fromTo(\n triggerElement.querySelectorAll(\n `[data-parallax-layer=\"${layerObj.layer}\"]`,\n ),\n {\n yPercent: layerObj\n .yPercentFrom,\n },\n { yPercent: layerObj.yPercent, ease: \"none\" },\n idx === 0 ? undefined : \"<\",\n );\n });\n },\n );\n}\n\n/* =========================\n ✅ MAP RENCONTRER CITY ROTATOR\n ========================= */\nwindow.initMapRotator = initMapRotator;\nfunction initMapRotator() {\n const DELAY_BETWEEN_CITIES = 200;\n const VISIBLE_DURATION = 500;\n const FADE_DURATION = 500;\n const MIN_GROUP_SIZE = 1;\n const MAX_GROUP_SIZE = 3;\n\n const cityRotator = document.querySelector(\"[data-city-rotator]\");\n if (!cityRotator) return;\n\n const cityElements = cityRotator.querySelectorAll(\"[data-city]\");\n if (cityElements.length === 0) return;\n\n function showCityElement(el) {\n el.style.opacity = \"1\";\n el.style.transform = \"translateY(0)\";\n }\n\n function hideCityElement(el) {\n el.style.opacity = \"0\";\n el.style.transform = \"translateY(10px)\";\n }\n\n function wait(ms) {\n return new Promise((resolve) => setTimeout(resolve, ms));\n }\n\n function shuffleArray(array) {\n const shuffled = [...array];\n for (let i = shuffled.length - 1; i > 0; i--) {\n const j = Math.floor(Math.random() * (i + 1));\n [shuffled[i], shuffled[j]] = [shuffled[j], shuffled[i]];\n }\n return shuffled;\n }\n\n function randomInt(min, max) {\n return Math.floor(Math.random() * (max - min + 1)) + min;\n }\n\n function getExclusions(el) {\n const raw = el.dataset.cityExclude;\n if (!raw) return [];\n return raw.split(\",\").map((s) => s.trim());\n }\n\n function isCompatible(el, group) {\n const elCity = el.dataset.city;\n const elExclusions = getExclusions(el);\n return group.every((groupEl) => {\n const groupCity = groupEl.dataset.city;\n const groupExclusions = getExclusions(groupEl);\n return !elExclusions.includes(groupCity) &&\n !groupExclusions.includes(elCity);\n });\n }\n\n async function startLoop() {\n while (true) {\n const shuffled = shuffleArray([...cityElements]);\n let i = 0;\n while (i < shuffled.length) {\n const groupSize = Math.min(\n randomInt(MIN_GROUP_SIZE, MAX_GROUP_SIZE),\n shuffled.length - i,\n );\n const group = [shuffled[i]];\n for (let j = i + 1; j < i + groupSize; j++) {\n if (isCompatible(shuffled[j], group)) {\n group.push(shuffled[j]);\n }\n }\n i += groupSize;\n group.forEach((el, index) => {\n setTimeout(() => showCityElement(el), index * DELAY_BETWEEN_CITIES);\n });\n await wait(FADE_DURATION + VISIBLE_DURATION);\n group.forEach((el, index) => {\n setTimeout(() => hideCityElement(el), index * DELAY_BETWEEN_CITIES);\n });\n await wait(DELAY_BETWEEN_CITIES);\n }\n }\n }\n\n startLoop();\n}\n\n// ============================================================\n// ✅ YC CARDS STARTUP VISIBILITY MANAGER\n// ============================================================\nwindow.VisibilityManager = (() => {\n const FADE_DURATION = 600;\n let observer = null;\n const visibleItems = new Set();\n let transitionReady = false;\n\n function init(groupName) {\n const scope = document.querySelector(\n `[data-visibility-group=\"${groupName}\"]`,\n );\n if (!scope) return console.warn(\"[VM] Groupe introuvable:\", groupName);\n\n const items = scope.querySelectorAll(\"[data-visibility-item]\");\n if (!items.length) return console.warn(\"[VM] Aucun item trouvé\");\n\n items.forEach((el) => {\n el.style.opacity = \"1\";\n });\n\n observer = new IntersectionObserver((entries) => {\n entries.forEach((entry) => {\n if (entry.isIntersecting) {\n entry.target.setAttribute(\"data-visible\", \"true\");\n visibleItems.add(entry.target);\n if (entry.target.getAttribute(\"data-fading\") !== \"true\") {\n entry.target.style.opacity = \"1\";\n }\n } else {\n entry.target.setAttribute(\"data-visible\", \"false\");\n visibleItems.delete(entry.target);\n if (transitionReady) {\n entry.target.style.opacity = \"0\";\n }\n }\n });\n }, { root: null, threshold: 0.1 });\n\n items.forEach((el) => observer.observe(el));\n\n setTimeout(() => {\n items.forEach((el) => {\n el.style.transition =\n `opacity ${FADE_DURATION}ms cubic-bezier(0.4, 0, 0.2, 1)`;\n });\n transitionReady = true;\n console.log(\"[VM] Transitions activées\");\n }, 1200);\n\n console.log(`[VM] ${items.length} items observés`);\n }\n\n function getVisibleItems() {\n return [...visibleItems];\n }\n function logVisible() {\n console.log(\n `[VM] ${getVisibleItems().length} visibles:`,\n getVisibleItems().map((el) => el.getAttribute(\"data-item-id\")),\n );\n }\n function destroy() {\n if (observer) {\n observer.disconnect();\n observer = null;\n visibleItems.clear();\n }\n }\n\n return { init, destroy, getVisibleItems, logVisible, FADE_DURATION };\n})();\n\n// ============================================================\n// POOL BUILDER\n// ============================================================\nwindow.PoolBuilder = (() => {\n function build(groupName) {\n const scope = document.querySelector(\n `[data-visibility-group=\"${groupName}\"]`,\n );\n if (!scope) return [];\n const seen = {};\n const pool = [];\n scope.querySelectorAll(\"[data-visibility-item]\").forEach((el) => {\n const id = el.getAttribute(\"data-item-id\");\n if (!id || seen[id]) return;\n seen[id] = true;\n pool.push({ id, html: el.innerHTML });\n });\n console.log(`[Pool] ${pool.length} items uniques`);\n return pool;\n }\n return { build };\n})();\n\n// ============================================================\n// RANDOM FADER\n// ============================================================\nwindow.RandomFader = (() => {\n let intervalId = null;\n let pool = [];\n const fadingItems = new Set();\n\n function swapItem(el) {\n const currentId = el.getAttribute(\"data-item-id\");\n const candidates = pool.filter((item) => item.id !== currentId);\n if (!candidates.length) return;\n const picked = candidates[Math.floor(Math.random() * candidates.length)];\n el.innerHTML = picked.html;\n el.setAttribute(\"data-item-id\", picked.id);\n }\n\n function initialShuffle(groupName) {\n const visible = window.VisibilityManager.getVisibleItems();\n if (!visible.length) {\n setTimeout(() => initialShuffle(groupName), 100);\n return;\n }\n const shuffledPool = [...pool].sort(() => Math.random() - 0.5);\n visible.forEach((el, i) => {\n const picked = shuffledPool[i % shuffledPool.length];\n el.innerHTML = picked.html;\n el.setAttribute(\"data-item-id\", picked.id);\n });\n console.log(\n `[RF] Shuffle initial — ${visible.length} items visibles assignés`,\n );\n }\n\n function fadeItem(el) {\n if (fadingItems.has(el)) return;\n fadingItems.add(el);\n el.setAttribute(\"data-fading\", \"true\");\n const fadeDuration = window.VisibilityManager.FADE_DURATION;\n\n el.style.opacity = \"0.15\";\n\n setTimeout(() => {\n swapItem(el);\n setTimeout(() => {\n el.style.opacity = \"1\";\n setTimeout(() => {\n fadingItems.delete(el);\n el.setAttribute(\"data-fading\", \"false\");\n }, fadeDuration);\n }, 80);\n }, fadeDuration);\n }\n\n function start(groupName = \"main\", interval = 2000) {\n if (intervalId) stop();\n\n setTimeout(() => {\n pool = window.PoolBuilder.build(groupName);\n\n setTimeout(() => {\n initialShuffle(groupName);\n\n intervalId = setInterval(() => {\n const visible = window.VisibilityManager.getVisibleItems()\n .filter((el) => el.getAttribute(\"data-fading\") !== \"true\");\n if (!visible.length) return;\n\n // Nombre d'items random selon la largeur d'écran\n const isLarge = window.innerWidth >= 1440;\n const isMobile = window.innerWidth < 768;\n const min = isMobile ? 1 : isLarge ? 3 : 2;\n const max = isMobile ? 2 : isLarge ? 5 : 3;\n const count = Math.floor(Math.random() * (max - min + 1)) + min; // ← ligne manquante\n\n const shuffled = [...visible].sort(() => Math.random() - 0.5);\n shuffled.slice(0, count).forEach((el) => {\n const delay = Math.random() * 600;\n setTimeout(() => fadeItem(el), delay);\n });\n }, interval);\n\n console.log(`[RF] Démarré — interval: ${interval}ms`);\n }, 800);\n }, 300);\n }\n\n function stop() {\n clearInterval(intervalId);\n intervalId = null;\n fadingItems.clear();\n window.VisibilityManager.getVisibleItems().forEach((el) =>\n el.style.opacity = \"1\"\n );\n console.log(\"[RF] Stoppé\");\n }\n\n return { start, stop };\n})();\n\n// ============================================================\n// LANCEMENT\n// ============================================================\nif (document.querySelector('[data-visibility-group=\"main\"]')) {\n VisibilityManager.init(\"main\");\n RandomFader.start(\"main\", 2000);\n}\n\n/* =========================\n 🚧 GESTION DES SWIPERS (laisser tout en bas)\n ========================= */\n\n// Helper pour la pagination animée globale\nfunction setupSwiperPagination(swiperInstance, paginationEl, durationMs) {\n if (!paginationEl) return;\n\n if (durationMs) {\n paginationEl.style.setProperty(\n \"--swiper-autoplay-duration\",\n durationMs + \"ms\",\n );\n }\n\n var lastBulletIndex = -1;\n\n var updateAnimation = function () {\n var currentIndex = swiperInstance.realIndex;\n if (currentIndex === lastBulletIndex) return;\n lastBulletIndex = currentIndex;\n\n var bullets = paginationEl.querySelectorAll(\".swiper-pagination-bullet\");\n bullets.forEach(function (b) {\n b.classList.remove(\"is-animating\");\n });\n\n requestAnimationFrame(function () {\n var activeBullet = paginationEl.querySelector(\n \".swiper-pagination-bullet-active\",\n );\n if (activeBullet) activeBullet.classList.add(\"is-animating\");\n });\n };\n\n swiperInstance.on(\"slideChange\", updateAnimation);\n setTimeout(updateAnimation, 50);\n}\n\n// Helper pour lire data-sw-speed=\"desktop[, mobile]\"\nfunction parseSwiperSpeed(section) {\n var raw = section.getAttribute(\"data-sw-speed\");\n if (!raw) return { desktop: 0, mobile: 0 };\n var parts = raw.split(\",\");\n var desktop = parseInt(parts[0].trim()) || 0;\n var mobile = parts.length > 1 ? (parseInt(parts[1].trim()) || 0) : desktop;\n return { desktop: desktop, mobile: mobile };\n}\n\n//////////////////////////////////// 1. Swiper 1 (Autoplay: true, espace mobile: 0)\nfunction Init_Swiper_1() {\n console.log(\"[Swiper 1] Initialisation lancée\");\n\n var sections = document.querySelectorAll('[data-sw=\"swiper-1\"]');\n if (sections.length === 0) {\n console.log(\n '[Swiper 1] Section parent introuvable (pas de data-sw=\"swiper-1\" sur la page)',\n );\n return;\n }\n\n sections.forEach(function (section) {\n console.log(\"[Swiper 1] Section trouvée !\", section);\n\n var sliderEl = section.querySelector('[data-sw=\"slider\"]');\n var slidesEl = section.querySelector('[data-sw=\"slides\"]');\n var slides = section.querySelectorAll('[data-sw=\"slide\"]');\n var prevBtn = section.querySelector('[data-sw=\"prev\"]');\n var nextBtn = section.querySelector('[data-sw=\"next\"]');\n var pagination = section.querySelector('[data-sw=\"pagination\"]');\n\n if (!sliderEl) {\n console.error(\n '[Swiper 1] Configuration incomplète : data-sw=\"slider\" introuvable !',\n );\n return;\n }\n\n if (slides.length === 0) {\n console.warn(\n '[Swiper 1] Aucune slide (data-sw=\"slide\") trouvée à l\\'intérieur du slider.',\n );\n return;\n } else {\n console.log(\"[Swiper 1] Nombre de slides trouvées: \" + slides.length);\n }\n\n if (sliderEl) sliderEl.classList.add(\"swiper\");\n if (slidesEl) slidesEl.classList.add(\"swiper-wrapper\");\n slides.forEach(function (s) {\n s.classList.add(\"swiper-slide\");\n });\n\n // Paramètres \"en dur\" propres au Swiper 1\n var desktopSpace = 8;\n var mobileSpace = 0;\n var speed = 500;\n var speeds = parseSwiperSpeed(section);\n\n var buildConfig = function (isDesktop) {\n var effect = isDesktop ? \"slide\" : \"creative\";\n var autoplayDelay = isDesktop ? speeds.desktop : speeds.mobile;\n\n var config = {\n slidesPerView: \"auto\",\n spaceBetween: isDesktop ? desktopSpace : mobileSpace,\n direction: \"horizontal\",\n loop: true,\n centeredSlides: true,\n speed: speed,\n grabCursor: true,\n effect: effect,\n observer: true,\n observeParents: true,\n slideActiveClass: \"active\",\n slideNextClass: \"next\",\n slidePrevClass: \"prev\",\n autoplay: autoplayDelay > 0\n ? { delay: autoplayDelay, disableOnInteraction: false }\n : false,\n };\n\n if (prevBtn && nextBtn) {\n console.log(\"[Swiper 1] Flèches de navigation activées\");\n config.navigation = { prevEl: prevBtn, nextEl: nextBtn };\n }\n\n if (pagination) {\n console.log(\"[Swiper 1] Pagination activée\");\n config.pagination = { el: pagination, clickable: true };\n }\n\n // Effet carte customisé sur mobile\n if (effect === \"creative\") {\n config.creativeEffect = {\n prev: {\n shadow: false,\n translate: [\"-120%\", 0, -500],\n rotate: [0, 0, -8],\n opacity: 0,\n },\n next: {\n shadow: false,\n translate: [\"12%\", \"-2%\", -1],\n scale: 0.85,\n origin: \"center center\",\n },\n limitProgress: 2,\n };\n }\n\n return config;\n };\n\n var mql = window.matchMedia(\"(min-width: 768px)\");\n var currentSwiper;\n\n var updateSwiper = function (e) {\n console.log(\n \"[Swiper 1] Adaptation de l'écran. Mode desktop ? \" + e.matches,\n );\n if (currentSwiper && !currentSwiper.destroyed) {\n currentSwiper.destroy(true, true);\n }\n var currentDelay = e.matches ? speeds.desktop : speeds.mobile;\n currentSwiper = new Swiper(sliderEl, buildConfig(e.matches));\n setupSwiperPagination(currentSwiper, pagination, currentDelay);\n console.log(\n \"[Swiper 1] Nouvelle instance Swiper créée avec succès\",\n currentSwiper,\n );\n };\n\n mql.addEventListener(\"change\", updateSwiper);\n updateSwiper(mql);\n });\n}\n\n//////////////////////////////////// 2. Swiper 2 (Autoplay: false, espace mobile: 8)\nfunction Init_Swiper_2() {\n console.log(\"[Swiper 2] Initialisation lancée\");\n\n var sections = document.querySelectorAll('[data-sw=\"swiper-2\"]');\n if (sections.length === 0) {\n console.log(\n '[Swiper 2] Section parent introuvable (pas de data-sw=\"swiper-2\" sur la page)',\n );\n return;\n }\n\n sections.forEach(function (section) {\n console.log(\"[Swiper 2] Section trouvée !\", section);\n\n var sliderEl = section.querySelector('[data-sw=\"slider\"]');\n var slidesEl = section.querySelector('[data-sw=\"slides\"]');\n var slides = section.querySelectorAll('[data-sw=\"slide\"]');\n var prevBtn = section.querySelector('[data-sw=\"prev\"]');\n var nextBtn = section.querySelector('[data-sw=\"next\"]');\n var pagination = section.querySelector('[data-sw=\"pagination\"]');\n\n if (!sliderEl) {\n console.error(\n '[Swiper 2] Configuration incomplète : data-sw=\"slider\" introuvable !',\n );\n return;\n }\n\n if (slides.length === 0) {\n console.warn(\n '[Swiper 2] Aucune slide (data-sw=\"slide\") trouvée à l\\'intérieur du slider.',\n );\n return;\n } else {\n console.log(\"[Swiper 2] Nombre de slides trouvées: \" + slides.length);\n }\n\n if (sliderEl) sliderEl.classList.add(\"swiper\");\n if (slidesEl) slidesEl.classList.add(\"swiper-wrapper\");\n slides.forEach(function (s) {\n s.classList.add(\"swiper-slide\");\n });\n\n // Paramètres \"en dur\" propres au Swiper 2\n var desktopSpace = 8;\n var mobileSpace = 8;\n var speed = 500;\n var speeds = parseSwiperSpeed(section);\n\n var buildConfig = function (isDesktop) {\n var effect = isDesktop ? \"slide\" : \"creative\";\n var autoplayDelay = isDesktop ? speeds.desktop : speeds.mobile;\n\n var config = {\n slidesPerView: \"auto\",\n spaceBetween: isDesktop ? desktopSpace : mobileSpace,\n direction: \"horizontal\",\n loop: true,\n centeredSlides: true,\n speed: speed,\n grabCursor: true,\n effect: effect,\n observer: true,\n observeParents: true,\n slideActiveClass: \"active\",\n slideNextClass: \"next\",\n slidePrevClass: \"prev\",\n autoplay: autoplayDelay > 0\n ? { delay: autoplayDelay, disableOnInteraction: false }\n : false,\n };\n\n if (prevBtn && nextBtn) {\n console.log(\"[Swiper 2] Flèches de navigation activées\");\n config.navigation = { prevEl: prevBtn, nextEl: nextBtn };\n }\n\n if (pagination) {\n console.log(\"[Swiper 2] Pagination activée\");\n config.pagination = { el: pagination, clickable: true };\n }\n\n // Effet carte customisé sur mobile\n if (effect === \"creative\") {\n config.creativeEffect = {\n prev: {\n shadow: false,\n translate: [\"-120%\", 0, -500],\n rotate: [0, 0, -8],\n opacity: 0,\n },\n next: {\n shadow: false,\n translate: [\"12%\", \"-2%\", -1],\n scale: 0.85,\n origin: \"center center\",\n },\n limitProgress: 2,\n };\n }\n\n return config;\n };\n\n var mql = window.matchMedia(\"(min-width: 768px)\");\n var currentSwiper;\n\n var updateSwiper = function (e) {\n console.log(\n \"[Swiper 2] Adaptation de l'écran. Mode desktop ? \" + e.matches,\n );\n if (currentSwiper && !currentSwiper.destroyed) {\n currentSwiper.destroy(true, true);\n }\n var currentDelay = e.matches ? speeds.desktop : speeds.mobile;\n currentSwiper = new Swiper(sliderEl, buildConfig(e.matches));\n setupSwiperPagination(currentSwiper, pagination, currentDelay);\n console.log(\n \"[Swiper 2] Nouvelle instance Swiper créée avec succès\",\n currentSwiper,\n );\n };\n\n mql.addEventListener(\"change\", updateSwiper);\n updateSwiper(mql);\n });\n}\n\n//////////////////////////////////// Swiper INVESTIR\nfunction InitSwiperInvestir() {\n console.log(\"[Swiper Investir] Initialisation lancée\");\n var section = document.querySelector('[data-sw=\"investir\"]');\n if (!section) return;\n\n var sliderEl = section.querySelector('[data-sw=\"slider\"]');\n var slidesEl = section.querySelector('[data-sw=\"slides\"]');\n var slides = section.querySelectorAll('[data-sw=\"slide\"]');\n var btnPrev = section.querySelector('[data-sw=\"prev\"]');\n var btnNext = section.querySelector('[data-sw=\"next\"]');\n var pagination = section.querySelector('[data-sw=\"pagination\"]');\n\n if (!sliderEl) return;\n\n sliderEl.classList.add(\"swiper\");\n slidesEl.classList.add(\"swiper-wrapper\");\n slides.forEach(function (s) {\n s.classList.add(\"swiper-slide\");\n });\n\n var speeds = parseSwiperSpeed(section);\n\n var buildConfig = function (isDesktop) {\n var autoplayDelay = isDesktop ? speeds.desktop : speeds.mobile;\n return {\n loop: true,\n speed: 600,\n effect: \"fade\",\n fadeEffect: { crossFade: true },\n allowTouchMove: true,\n observer: true,\n observeParents: true,\n watchSlidesProgress: true,\n navigation: { prevEl: btnPrev, nextEl: btnNext },\n pagination: pagination ? { el: pagination, clickable: true } : false,\n autoplay: autoplayDelay > 0\n ? { delay: autoplayDelay, disableOnInteraction: false }\n : false,\n };\n };\n\n var mql = window.matchMedia(\"(min-width: 768px)\");\n var currentSwiper;\n\n var updateSwiper = function (e) {\n console.log(\n \"[Swiper Investir] Adaptation de l'écran. Mode desktop ? \" + e.matches,\n );\n if (currentSwiper && !currentSwiper.destroyed) {\n currentSwiper.destroy(true, true);\n }\n var currentDelay = e.matches ? speeds.desktop : speeds.mobile;\n currentSwiper = new Swiper(sliderEl, buildConfig(e.matches));\n setupSwiperPagination(currentSwiper, pagination, currentDelay);\n console.log(\n \"[Swiper Investir] Nouvelle instance Swiper créée avec succès\",\n currentSwiper,\n );\n };\n\n mql.addEventListener(\"change\", updateSwiper);\n updateSwiper(mql);\n}\n\n//////////////////////////////////// Swiper 4 (Page Levées ?)\nfunction Init_Swiper_4() {\n console.log(\"[Swiper 4] Initialisation lancée\");\n\n var sections = document.querySelectorAll('[data-sw=\"swiper-4\"]');\n if (sections.length === 0) {\n console.log(\n '[Swiper 4] Section parent introuvable (pas de data-sw=\"swiper-4\" sur la page)',\n );\n return;\n }\n\n sections.forEach(function (section) {\n console.log(\"[Swiper 4] Section trouvée !\", section);\n\n var sliderEl = section.querySelector('[data-sw=\"slider\"]');\n var slidesEl = section.querySelector('[data-sw=\"slides\"]');\n var slides = section.querySelectorAll('[data-sw=\"slide\"]');\n var prevBtn = section.querySelector('[data-sw=\"prev\"]');\n var nextBtn = section.querySelector('[data-sw=\"next\"]');\n var pagination = section.querySelector('[data-sw=\"pagination\"]');\n\n if (!sliderEl) {\n console.error(\n '[Swiper 4] Configuration incomplète : data-sw=\"slider\" introuvable !',\n );\n return;\n }\n\n if (slides.length === 0) {\n console.warn(\n '[Swiper 4] Aucune slide (data-sw=\"slide\") trouvée à l\\'intérieur du slider.',\n );\n return;\n } else {\n console.log(\"[Swiper 4] Nombre de slides trouvées: \" + slides.length);\n }\n\n if (sliderEl) sliderEl.classList.add(\"swiper\");\n if (slidesEl) slidesEl.classList.add(\"swiper-wrapper\");\n slides.forEach(function (s) {\n s.classList.add(\"swiper-slide\");\n });\n\n // Paramètres \"en dur\" propres au Swiper 4\n var desktopSpace = 168;\n var mobileSpace = 8;\n var speed = 500;\n var speeds = parseSwiperSpeed(section);\n\n var buildConfig = function (isDesktop) {\n var autoplayDelay = isDesktop ? speeds.desktop : speeds.mobile;\n var config = {\n slidesPerView: isDesktop ? \"auto\" : 1,\n spaceBetween: isDesktop ? desktopSpace : mobileSpace,\n direction: \"horizontal\",\n loop: true,\n centeredSlides: true,\n speed: speed,\n grabCursor: true,\n effect: \"slide\",\n observer: true,\n observeParents: true,\n slideActiveClass: \"active\",\n slideNextClass: \"next\",\n slidePrevClass: \"prev\",\n autoplay: autoplayDelay > 0\n ? { delay: autoplayDelay, disableOnInteraction: false }\n : false,\n };\n\n if (prevBtn && nextBtn) {\n console.log(\"[Swiper 4] Flèches de navigation activées\");\n config.navigation = { prevEl: prevBtn, nextEl: nextBtn };\n }\n\n if (pagination) {\n console.log(\"[Swiper 4] Pagination activée\");\n config.pagination = { el: pagination, clickable: true };\n }\n\n return config;\n };\n\n var mql = window.matchMedia(\"(min-width: 768px)\");\n var currentSwiper;\n\n var updateSwiper = function (e) {\n console.log(\n \"[Swiper 4] Adaptation de l'écran. Mode desktop ? \" + e.matches,\n );\n if (currentSwiper && !currentSwiper.destroyed) {\n currentSwiper.destroy(true, true);\n }\n var currentDelay = e.matches ? speeds.desktop : speeds.mobile;\n currentSwiper = new Swiper(sliderEl, buildConfig(e.matches));\n setupSwiperPagination(currentSwiper, pagination, currentDelay);\n console.log(\n \"[Swiper 4] Nouvelle instance Swiper créée avec succès\",\n currentSwiper,\n );\n };\n\n mql.addEventListener(\"change\", updateSwiper);\n updateSwiper(mql);\n });\n}\n\n//////////////////////////////////// Swiper KOL\nfunction InitSwiperKOL() {\n console.log(\"[Swiper KOL] Initialisation lancée\");\n var section = document.querySelector('[data-sw=\"kol\"]');\n if (!section) return;\n\n var sliderEl = section.querySelector('[data-sw=\"slider\"]');\n var slidesEl = section.querySelector('[data-sw=\"slides\"]');\n var slides = section.querySelectorAll('[data-sw=\"slide\"]');\n var btnPrev = section.querySelector('[data-sw=\"prev\"]');\n var btnNext = section.querySelector('[data-sw=\"next\"]');\n var pagination = section.querySelector('[data-sw=\"pagination\"]');\n\n if (!sliderEl) return;\n\n sliderEl.classList.add(\"swiper\");\n slidesEl.classList.add(\"swiper-wrapper\");\n slides.forEach(function (s) {\n s.classList.add(\"swiper-slide\");\n });\n\n var speeds = parseSwiperSpeed(section);\n\n var buildConfig = function (isDesktop) {\n var autoplayDelay = isDesktop ? speeds.desktop : speeds.mobile;\n return {\n loop: true,\n loopedSlides: slides.length || 5,\n slidesPerView: \"auto\",\n spaceBetween: 8,\n centeredSlides: true,\n allowTouchMove: true,\n grabCursor: true,\n observer: true,\n observeParents: true,\n watchSlidesProgress: true,\n navigation: { prevEl: btnPrev, nextEl: btnNext },\n pagination: pagination ? { el: pagination, clickable: true } : false,\n autoplay: autoplayDelay > 0\n ? {\n delay: autoplayDelay,\n disableOnInteraction: false,\n pauseOnMouseEnter: false,\n }\n : false,\n on: {\n touchEnd: function () {\n var s = this;\n if (s.autoplay && !s.autoplay.running) {\n s.autoplay.start();\n }\n },\n },\n };\n };\n\n var mql = window.matchMedia(\"(min-width: 768px)\");\n var currentSwiper;\n\n var updateSwiper = function (e) {\n console.log(\n \"[Swiper KOL] Adaptation de l'écran. Mode desktop ? \" + e.matches,\n );\n if (currentSwiper && !currentSwiper.destroyed) {\n currentSwiper.destroy(true, true);\n }\n var currentDelay = e.matches ? speeds.desktop : speeds.mobile;\n currentSwiper = new Swiper(sliderEl, buildConfig(e.matches));\n setupSwiperPagination(currentSwiper, pagination, currentDelay);\n console.log(\n \"[Swiper KOL] Nouvelle instance Swiper créée avec succès\",\n currentSwiper,\n );\n };\n\n mql.addEventListener(\"change\", updateSwiper);\n // Délai iOS Safari : laisser le DOM se peindre avant d'init\n setTimeout(function () {\n updateSwiper(mql);\n }, 150);\n}\n\n//////////////////////////////////// Swiper Levées\nfunction InitSwiperLevees() {\n console.log(\"[Swiper Levées] Initialisation lancée\");\n var section = document.querySelector('[data-sw=\"levees\"]');\n if (!section) return;\n\n var sliderEl = section.querySelector('[data-sw=\"slider\"]');\n var slidesEl = section.querySelector('[data-sw=\"slides\"]');\n var slides = section.querySelectorAll('[data-sw=\"slide\"]');\n var btnPrev = section.querySelector('[data-sw=\"prev\"]');\n var btnNext = section.querySelector('[data-sw=\"next\"]');\n var pagination = section.querySelector('[data-sw=\"pagination\"]');\n\n if (!sliderEl) return;\n\n sliderEl.classList.add(\"swiper\");\n slidesEl.classList.add(\"swiper-wrapper\");\n slides.forEach(function (s) {\n s.classList.add(\"swiper-slide\");\n });\n\n var speeds = parseSwiperSpeed(section);\n\n var buildConfig = function (isDesktop) {\n var autoplayDelay = isDesktop ? speeds.desktop : speeds.mobile;\n return {\n loop: true,\n spaceBetween: 8,\n slidesPerView: \"auto\",\n allowTouchMove: true,\n grabCursor: true,\n loopedSlides: slides.length || 5,\n observer: true,\n observeParents: true,\n watchSlidesProgress: true,\n navigation: { prevEl: btnPrev, nextEl: btnNext },\n pagination: pagination ? { el: pagination, clickable: true } : false,\n breakpoints: {\n 0: { centeredSlides: true },\n 769: { centeredSlides: false },\n },\n autoplay: autoplayDelay > 0\n ? {\n delay: autoplayDelay,\n disableOnInteraction: false,\n pauseOnMouseEnter: false,\n }\n : false,\n };\n };\n\n var mql = window.matchMedia(\"(min-width: 768px)\");\n var currentSwiper;\n\n var updateSwiper = function (e) {\n console.log(\n \"[Swiper Levées] Adaptation de l'écran. Mode desktop ? \" + e.matches,\n );\n if (currentSwiper && !currentSwiper.destroyed) {\n currentSwiper.destroy(true, true);\n }\n var currentDelay = e.matches ? speeds.desktop : speeds.mobile;\n currentSwiper = new Swiper(sliderEl, buildConfig(e.matches));\n setupSwiperPagination(currentSwiper, pagination, currentDelay);\n console.log(\n \"[Swiper Levées] Nouvelle instance Swiper créée avec succès\",\n currentSwiper,\n );\n };\n\n mql.addEventListener(\"change\", updateSwiper);\n updateSwiper(mql);\n}\n\n//////////////////////////////////// Swiper Membres\nfunction InitSwiperMembres() {\n console.log(\"[Swiper Membres] Initialisation lancée\");\n\n var sections = document.querySelectorAll('[data-sw=\"membres\"]');\n if (sections.length === 0) {\n console.log(\n '[Swiper Membres] Section parent introuvable (pas de data-sw=\"membres\" sur la page)',\n );\n return;\n }\n\n sections.forEach(function (section) {\n console.log(\"[Swiper Membres] Section trouvée !\", section);\n\n var sliderEl = section.querySelector('[data-sw=\"slider\"]');\n var slidesEl = section.querySelector('[data-sw=\"slides\"]');\n var slides = section.querySelectorAll('[data-sw=\"slide\"]');\n var prevBtn = section.querySelector('[data-sw=\"prev\"]');\n var nextBtn = section.querySelector('[data-sw=\"next\"]');\n var pagination = section.querySelector('[data-sw=\"pagination\"]');\n\n if (!sliderEl) {\n console.error(\n '[Swiper Membres] Configuration incomplète : data-sw=\"slider\" introuvable !',\n );\n return;\n }\n\n if (slides.length === 0) {\n console.warn(\n '[Swiper Membres] Aucune slide (data-sw=\"slide\") trouvée à l\\'intérieur du slider.',\n );\n return;\n } else {\n console.log(\n \"[Swiper Membres] Nombre de slides trouvées: \" + slides.length,\n );\n }\n\n if (sliderEl) sliderEl.classList.add(\"swiper\");\n if (slidesEl) slidesEl.classList.add(\"swiper-wrapper\");\n slides.forEach(function (s) {\n s.classList.add(\"swiper-slide\");\n });\n\n // Paramètres \"en dur\" propres au Swiper Membres\n var desktopSpace = 32;\n var mobileSpace = 32;\n var speed = 500;\n var speeds = parseSwiperSpeed(section);\n\n var buildConfig = function (isDesktop) {\n var autoplayDelay = isDesktop ? speeds.desktop : speeds.mobile;\n\n var config = {\n slidesPerView: \"auto\",\n spaceBetween: isDesktop ? desktopSpace : mobileSpace,\n loop: true,\n speed: speed,\n autoplay: autoplayDelay > 0\n ? { delay: autoplayDelay, disableOnInteraction: false }\n : false,\n };\n\n if (prevBtn && nextBtn) {\n console.log(\"[Swiper Membres] Flèches de navigation activées\");\n config.navigation = { prevEl: prevBtn, nextEl: nextBtn };\n }\n\n if (pagination) {\n console.log(\"[Swiper Membres] Pagination activée\");\n config.pagination = { el: pagination, clickable: true };\n }\n\n return config;\n };\n\n var mql = window.matchMedia(\"(min-width: 768px)\");\n var currentSwiper;\n\n var updateSwiper = function (e) {\n console.log(\n \"[Swiper Membres] Adaptation de l'écran. Mode desktop ? \" + e.matches,\n );\n if (currentSwiper && !currentSwiper.destroyed) {\n currentSwiper.destroy(true, true);\n }\n var currentDelay = e.matches ? speeds.desktop : speeds.mobile;\n currentSwiper = new Swiper(sliderEl, buildConfig(e.matches));\n setupSwiperPagination(currentSwiper, pagination, currentDelay);\n console.log(\n \"[Swiper Membres] Nouvelle instance Swiper créée avec succès\",\n currentSwiper,\n );\n };\n\n mql.addEventListener(\"change\", updateSwiper);\n updateSwiper(mql);\n });\n}\n\n//////////////////////////////////// Swiper Trustpilot\nfunction InitSwiperTrustpilot() {\n console.log(\"[Swiper Trustpilot] Initialisation lancée\");\n\n var sections = document.querySelectorAll('[data-sw=\"trustpilot\"]');\n if (sections.length === 0) {\n console.log(\n '[Swiper Trustpilot] Section parent introuvable (pas de data-sw=\"trustpilot\" sur la page)',\n );\n return;\n }\n\n sections.forEach(function (section) {\n console.log(\"[Swiper Trustpilot] Section trouvée !\", section);\n\n var sliderEl = section.querySelector('[data-sw=\"slider\"]');\n var slidesEl = section.querySelector('[data-sw=\"slides\"]');\n var slides = section.querySelectorAll('[data-sw=\"slide\"]');\n var prevBtn = section.querySelector('[data-sw=\"prev\"]');\n var nextBtn = section.querySelector('[data-sw=\"next\"]');\n var pagination = section.querySelector('[data-sw=\"pagination\"]');\n\n if (!sliderEl) {\n console.error(\n '[Swiper Trustpilot] Configuration incomplète : data-sw=\"slider\" introuvable !',\n );\n return;\n }\n\n if (slides.length === 0) {\n console.warn(\n '[Swiper Trustpilot] Aucune slide (data-sw=\"slide\") trouvée à l\\'intérieur du slider.',\n );\n return;\n } else {\n console.log(\n \"[Swiper Trustpilot] Nombre de slides trouvées: \" + slides.length,\n );\n }\n\n if (sliderEl) sliderEl.classList.add(\"swiper\");\n if (slidesEl) slidesEl.classList.add(\"swiper-wrapper\");\n slides.forEach(function (s) {\n s.classList.add(\"swiper-slide\");\n });\n\n var speeds = parseSwiperSpeed(section);\n\n var buildConfig = function (isDesktop) {\n var autoplayDelay = isDesktop ? speeds.desktop : speeds.mobile;\n\n var config = {\n slidesPerView: \"auto\",\n spaceBetween: 8,\n centeredSlides: false,\n loop: true,\n allowTouchMove: true,\n grabCursor: true,\n loopedSlides: slides.length || 5,\n observer: true,\n observeParents: true,\n watchSlidesProgress: true,\n autoplay: autoplayDelay > 0\n ? {\n delay: autoplayDelay,\n disableOnInteraction: false,\n pauseOnMouseEnter: false,\n }\n : false,\n };\n\n if (prevBtn && nextBtn) {\n console.log(\"[Swiper Trustpilot] Flèches de navigation activées\");\n config.navigation = { prevEl: prevBtn, nextEl: nextBtn };\n }\n\n if (pagination) {\n console.log(\"[Swiper Trustpilot] Pagination activée\");\n config.pagination = { el: pagination, clickable: true };\n }\n\n return config;\n };\n\n var mql = window.matchMedia(\"(min-width: 768px)\");\n var currentSwiper;\n\n var updateSwiper = function (e) {\n console.log(\n \"[Swiper Trustpilot] Adaptation de l'écran. Mode desktop ? \" +\n e.matches,\n );\n if (currentSwiper && !currentSwiper.destroyed) {\n currentSwiper.destroy(true, true);\n }\n var currentDelay = e.matches ? speeds.desktop : speeds.mobile;\n currentSwiper = new Swiper(sliderEl, buildConfig(e.matches));\n setupSwiperPagination(currentSwiper, pagination, currentDelay);\n console.log(\n \"[Swiper Trustpilot] Nouvelle instance Swiper créée avec succès\",\n currentSwiper,\n );\n };\n\n mql.addEventListener(\"change\", updateSwiper);\n updateSwiper(mql);\n });\n}\n\n// ============================================================\n// init SWIPERS\n// ============================================================\n\n//////////////////////////////////// Init swipers\nfunction initAllSwipers() {\n console.log(\"[Initialisation] Lancement de tous les Swipers...\");\n document.querySelector('[data-sw=\"swiper-1\"]') && Init_Swiper_1();\n document.querySelector('[data-sw=\"swiper-2\"]') && Init_Swiper_2();\n document.querySelector('[data-sw=\"investir\"]') && InitSwiperInvestir();\n document.querySelector('[data-sw=\"swiper-4\"]') && Init_Swiper_4();\n document.querySelector('[data-sw=\"kol\"]') && InitSwiperKOL();\n document.querySelector('[data-sw=\"levees\"]') && InitSwiperLevees();\n document.querySelector('[data-sw=\"membres\"]') && InitSwiperMembres();\n document.querySelector('[data-sw=\"trustpilot\"]') && InitSwiperTrustpilot();\n}\n\nfunction initPageScripts() {\n document.querySelector(\"[data-magnetic-wrapper]\") && initMagneticEffect();\n document.querySelector(\"[data-vimeo-lightbox-id]\") &&\n initVimeoLightboxAdvanced();\n document.querySelector(\"[data-parallax-layers]\") && initParallaxLayers();\n document.querySelector(\"[data-city-rotator]\") && initMapRotator();\n document.querySelector(\"[data-tag-rotator]\") && initTagsAnimateOnMap();\n}\ninitAllSwipers();\ninitPageScripts();","createdAt",["D",1774881268449],"branchVersion","branchId","defac886-05cf-11f1-9b96-42dde27851f2","id","defa3682-05cf-11f1-9b96-42dde27851f2","blast",["D",1770652578242],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","imageUrl","51e0f890-4215-11f0-8fa4-2945475a7e7e","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount",0,"orgId","9d7676f2-7a4d-4e3f-975a-15aca5bcc997","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_94":93,"_101":97},"org",{"_94":93,"_95":-5,"_96":97,"_18":54,"_98":99,"_100":25},"branch",{"_13":83,"_32":84,"_43":42,"_85":44,"_86":-5,"_87":-5,"_88":-5,"_89":-5,"_90":-5,"_91":45,"_92":93},"isOwned",683,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","ncf","handle","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoiZGVmYXVsdCIsImlpZCI6Imluc18yTm10cGhQUklwU0tqZHNiOHNnNGd2ZjJURFUiLCJyaWQiOiJ1c2VyXzJ5NWtrVUd1NlAwbmxWS2NMVFB4N0Ezb0drSyJ9","tier","free","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_43":44,"_32":45,"_38":209,"_47":-5,"_48":25,"_49":50,"_51":50,"_52":-5,"_53":-5,"_18":54,"_55":-5,"_56":25,"_57":-5,"_58":-5,"_59":60,"_61":62,"_63":-5,"_64":-5,"_65":-5,"_66":-5,"_67":68,"_69":68,"_70":71,"_72":71,"_73":71,"_74":68,"_75":68,"_76":210,"_78":211,"_80":212,"_82":25},"tree",[182,184,185,186,187],"files",[182,183,184,185,186,187],"counts",{"_172":60,"_173":169,"_174":60,"_175":176,"_177":178},"contents",[124,125,126,127,128],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_43":163,"_32":164,"_30":165,"_132":-5,"_41":42,"_40":166,"_134":167,"_38":168,"_13":169,"_34":170,"_36":-5,"_24":25,"_138":-5,"_27":171},{"_43":155,"_32":156,"_30":157,"_132":-5,"_41":42,"_40":158,"_134":25,"_38":159,"_13":160,"_34":35,"_36":161,"_24":25,"_138":-5,"_27":162},{"_43":148,"_32":149,"_30":150,"_132":-5,"_41":42,"_40":151,"_134":25,"_38":152,"_13":153,"_34":35,"_36":146,"_24":25,"_138":-5,"_27":154},{"_43":140,"_32":141,"_30":142,"_132":-5,"_41":42,"_40":143,"_134":25,"_38":144,"_13":145,"_34":35,"_36":146,"_24":25,"_138":-5,"_27":147},{"_43":129,"_32":130,"_30":131,"_132":-5,"_41":42,"_40":133,"_134":25,"_38":135,"_13":136,"_34":35,"_36":137,"_24":25,"_138":-5,"_27":139},"b62a4f2e-22e1-11f1-b7ea-42dde27851f2","swipers.js","deb4d098-1d34-11f1-92f9-42dde27851f2","parentId",469,"latest",["D",1773848824427],18,"/* =========================\n 🚧 GESTION DES SWIPERS (laisser tout en bas)\n ========================= */\n// Helper pour préserver les classes Custom Webflow des bullets (variants de couleur)\nfunction getSwiperPaginationConfig(paginationEl) {\n if (!paginationEl) return { el: paginationEl, clickable: true };\n var existingBullet = paginationEl.querySelector(\".swiper-pagination-bullet\");\n var extraClasses = existingBullet\n ? existingBullet.className.replace(\"swiper-pagination-bullet\", \"\").trim()\n : \"\";\n\n return {\n el: paginationEl,\n clickable: true,\n renderBullet: function (index, className) {\n var fullClass = extraClasses ? className + \" \" + extraClasses : className;\n return '';\n },\n };\n}\n\n// Helper pour la pagination animée globale\nfunction setupSwiperPagination(swiperInstance, paginationEl, durationMs) {\n if (!paginationEl) return;\n\n if (durationMs) {\n paginationEl.style.setProperty(\n \"--swiper-autoplay-duration\",\n durationMs + \"ms\",\n );\n }\n\n var lastBulletIndex = -1;\n\n var updateAnimation = function () {\n var currentIndex = swiperInstance.realIndex;\n if (currentIndex === lastBulletIndex) return;\n lastBulletIndex = currentIndex;\n\n var bullets = paginationEl.querySelectorAll(\".swiper-pagination-bullet\");\n bullets.forEach(function (b) {\n b.classList.remove(\"is-animating\");\n });\n\n requestAnimationFrame(function () {\n var activeBullet = paginationEl.querySelector(\n \".swiper-pagination-bullet-active\",\n );\n if (activeBullet) activeBullet.classList.add(\"is-animating\");\n });\n };\n\n swiperInstance.on(\"slideChange\", updateAnimation);\n setTimeout(updateAnimation, 50);\n}\n\n// Helper pour lire data-sw-speed=\"desktop[, mobile]\"\nfunction parseSwiperSpeed(section) {\n var raw = section.getAttribute(\"data-sw-speed\");\n if (!raw) return { desktop: 0, mobile: 0 };\n var parts = raw.split(\",\");\n var desktop = parseInt(parts[0].trim()) || 0;\n var mobile = parts.length > 1 ? (parseInt(parts[1].trim()) || 0) : desktop;\n return { desktop: desktop, mobile: mobile };\n}\n\n//////////////////////////////////// 1. Swiper 1 (Autoplay: true, espace mobile: 0)\nfunction Init_Swiper_1() {\n console.log(\"[Swiper 1] Initialisation lancée\");\n\n var sections = document.querySelectorAll('[data-sw=\"swiper-1\"]');\n if (sections.length === 0) {\n console.log(\n '[Swiper 1] Section parent introuvable (pas de data-sw=\"swiper-1\" sur la page)',\n );\n return;\n }\n\n sections.forEach(function (section) {\n console.log(\"[Swiper 1] Section trouvée !\", section);\n\n var sliderEl = section.querySelector('[data-sw=\"slider\"]');\n var slidesEl = section.querySelector('[data-sw=\"slides\"]');\n var slides = section.querySelectorAll('[data-sw=\"slide\"]');\n var prevBtn = section.querySelector('[data-sw=\"prev\"]');\n var nextBtn = section.querySelector('[data-sw=\"next\"]');\n var pagination = section.querySelector('[data-sw=\"pagination\"]');\n\n if (!sliderEl) {\n console.error(\n '[Swiper 1] Configuration incomplète : data-sw=\"slider\" introuvable !',\n );\n return;\n }\n\n if (slides.length === 0) {\n console.warn(\n '[Swiper 1] Aucune slide (data-sw=\"slide\") trouvée à l\\'intérieur du slider.',\n );\n return;\n } else {\n console.log(\"[Swiper 1] Nombre de slides trouvées: \" + slides.length);\n }\n\n if (sliderEl) sliderEl.classList.add(\"swiper\");\n if (slidesEl) slidesEl.classList.add(\"swiper-wrapper\");\n slides.forEach(function (s) {\n s.classList.add(\"swiper-slide\");\n });\n\n // Paramètres \"en dur\" propres au Swiper 1\n var desktopSpace = 8;\n var mobileSpace = 0;\n var speed = 500;\n var speeds = parseSwiperSpeed(section);\n\n var buildConfig = function (isDesktop) {\n var effect = isDesktop ? \"slide\" : \"creative\";\n var autoplayDelay = isDesktop ? speeds.desktop : speeds.mobile;\n\n var config = {\n slidesPerView: \"auto\",\n spaceBetween: isDesktop ? desktopSpace : mobileSpace,\n direction: \"horizontal\",\n loop: true,\n centeredSlides: true,\n speed: speed,\n grabCursor: true,\n effect: effect,\n observer: true,\n observeParents: true,\n slideActiveClass: \"active\",\n slideNextClass: \"next\",\n slidePrevClass: \"prev\",\n autoplay: autoplayDelay > 0\n ? {\n delay: autoplayDelay,\n disableOnInteraction: false,\n pauseOnMouseEnter: isDesktop,\n }\n : false,\n };\n\n if (prevBtn && nextBtn) {\n console.log(\"[Swiper 1] Flèches de navigation activées\");\n config.navigation = { prevEl: prevBtn, nextEl: nextBtn };\n }\n\n if (pagination) {\n console.log(\"[Swiper 1] Pagination activée\");\n config.pagination = getSwiperPaginationConfig(pagination);\n }\n\n // Effet carte customisé sur mobile\n if (effect === \"creative\") {\n config.creativeEffect = {\n prev: {\n shadow: false,\n translate: [\"-120%\", 0, -500],\n rotate: [0, 0, -8],\n opacity: 0,\n },\n next: {\n shadow: false,\n translate: [\"12%\", \"-2%\", -1],\n scale: 0.85,\n origin: \"center center\",\n },\n limitProgress: 2,\n };\n }\n\n return config;\n };\n\n var mql = window.matchMedia(\"(min-width: 768px)\");\n var currentSwiper;\n\n var updateSwiper = function (e) {\n console.log(\n \"[Swiper 1] Adaptation de l'écran. Mode desktop ? \" + e.matches,\n );\n if (currentSwiper && !currentSwiper.destroyed) {\n currentSwiper.destroy(true, true);\n }\n var currentDelay = e.matches ? speeds.desktop : speeds.mobile;\n currentSwiper = new Swiper(sliderEl, buildConfig(e.matches));\n setupSwiperPagination(currentSwiper, pagination, currentDelay);\n console.log(\n \"[Swiper 1] Nouvelle instance Swiper créée avec succès\",\n currentSwiper,\n );\n };\n\n mql.addEventListener(\"change\", updateSwiper);\n updateSwiper(mql);\n });\n}\n\n//////////////////////////////////// 2. Swiper 2 (Autoplay: false, espace mobile: 8)\nfunction Init_Swiper_2() {\n console.log(\"[Swiper 2] Initialisation lancée\");\n\n var sections = document.querySelectorAll('[data-sw=\"swiper-2\"]');\n if (sections.length === 0) {\n console.log(\n '[Swiper 2] Section parent introuvable (pas de data-sw=\"swiper-2\" sur la page)',\n );\n return;\n }\n\n sections.forEach(function (section) {\n console.log(\"[Swiper 2] Section trouvée !\", section);\n\n var sliderEl = section.querySelector('[data-sw=\"slider\"]');\n var slidesEl = section.querySelector('[data-sw=\"slides\"]');\n var slides = section.querySelectorAll('[data-sw=\"slide\"]');\n var prevBtn = section.querySelector('[data-sw=\"prev\"]');\n var nextBtn = section.querySelector('[data-sw=\"next\"]');\n var pagination = section.querySelector('[data-sw=\"pagination\"]');\n\n if (!sliderEl) {\n console.error(\n '[Swiper 2] Configuration incomplète : data-sw=\"slider\" introuvable !',\n );\n return;\n }\n\n if (slides.length === 0) {\n console.warn(\n '[Swiper 2] Aucune slide (data-sw=\"slide\") trouvée à l\\'intérieur du slider.',\n );\n return;\n } else {\n console.log(\"[Swiper 2] Nombre de slides trouvées: \" + slides.length);\n }\n\n if (sliderEl) sliderEl.classList.add(\"swiper\");\n if (slidesEl) slidesEl.classList.add(\"swiper-wrapper\");\n slides.forEach(function (s) {\n s.classList.add(\"swiper-slide\");\n });\n\n // Paramètres \"en dur\" propres au Swiper 2\n var desktopSpace = 8;\n var mobileSpace = 8;\n var speed = 500;\n var speeds = parseSwiperSpeed(section);\n\n var buildConfig = function (isDesktop) {\n var effect = isDesktop ? \"slide\" : \"creative\";\n var autoplayDelay = isDesktop ? speeds.desktop : speeds.mobile;\n\n var config = {\n slidesPerView: \"auto\",\n spaceBetween: isDesktop ? desktopSpace : mobileSpace,\n direction: \"horizontal\",\n loop: true,\n centeredSlides: true,\n speed: speed,\n grabCursor: true,\n effect: effect,\n observer: true,\n observeParents: true,\n slideActiveClass: \"active\",\n slideNextClass: \"next\",\n slidePrevClass: \"prev\",\n autoplay: autoplayDelay > 0\n ? {\n delay: autoplayDelay,\n disableOnInteraction: false,\n pauseOnMouseEnter: isDesktop,\n }\n : false,\n };\n\n if (prevBtn && nextBtn) {\n console.log(\"[Swiper 2] Flèches de navigation activées\");\n config.navigation = { prevEl: prevBtn, nextEl: nextBtn };\n }\n\n if (pagination) {\n console.log(\"[Swiper 2] Pagination activée\");\n config.pagination = getSwiperPaginationConfig(pagination);\n }\n\n // Effet carte customisé sur mobile\n if (effect === \"creative\") {\n config.creativeEffect = {\n prev: {\n shadow: false,\n translate: [\"-120%\", 0, -500],\n rotate: [0, 0, -8],\n opacity: 0,\n },\n next: {\n shadow: false,\n translate: [\"12%\", \"-2%\", -1],\n scale: 0.85,\n origin: \"center center\",\n },\n limitProgress: 2,\n };\n }\n\n return config;\n };\n\n var mql = window.matchMedia(\"(min-width: 768px)\");\n var currentSwiper;\n\n var updateSwiper = function (e) {\n console.log(\n \"[Swiper 2] Adaptation de l'écran. Mode desktop ? \" + e.matches,\n );\n if (currentSwiper && !currentSwiper.destroyed) {\n currentSwiper.destroy(true, true);\n }\n var currentDelay = e.matches ? speeds.desktop : speeds.mobile;\n currentSwiper = new Swiper(sliderEl, buildConfig(e.matches));\n setupSwiperPagination(currentSwiper, pagination, currentDelay);\n console.log(\n \"[Swiper 2] Nouvelle instance Swiper créée avec succès\",\n currentSwiper,\n );\n };\n\n mql.addEventListener(\"change\", updateSwiper);\n updateSwiper(mql);\n });\n}\n\n//////////////////////////////////// Swiper INVESTIR\nfunction InitSwiperInvestir() {\n console.log(\"[Swiper Investir] Initialisation lancée\");\n var section = document.querySelector('[data-sw=\"investir\"]');\n if (!section) return;\n\n var sliderEl = section.querySelector('[data-sw=\"slider\"]');\n var slidesEl = section.querySelector('[data-sw=\"slides\"]');\n var slides = section.querySelectorAll('[data-sw=\"slide\"]');\n var btnPrev = section.querySelector('[data-sw=\"prev\"]');\n var btnNext = section.querySelector('[data-sw=\"next\"]');\n var pagination = section.querySelector('[data-sw=\"pagination\"]');\n\n if (!sliderEl) return;\n\n sliderEl.classList.add(\"swiper\");\n slidesEl.classList.add(\"swiper-wrapper\");\n slides.forEach(function (s) {\n s.classList.add(\"swiper-slide\");\n });\n\n var speeds = parseSwiperSpeed(section);\n\n var buildConfig = function (isDesktop) {\n var autoplayDelay = isDesktop ? speeds.desktop : speeds.mobile;\n return {\n loop: true,\n speed: 600,\n effect: \"fade\",\n fadeEffect: { crossFade: true },\n allowTouchMove: true,\n observer: true,\n observeParents: true,\n watchSlidesProgress: true,\n navigation: { prevEl: btnPrev, nextEl: btnNext },\n pagination: pagination ? getSwiperPaginationConfig(pagination) : false,\n slideActiveClass: \"active\",\n autoplay: autoplayDelay > 0\n ? { delay: autoplayDelay, disableOnInteraction: false }\n : false,\n };\n };\n\n var mql = window.matchMedia(\"(min-width: 768px)\");\n var currentSwiper;\n\n var updateSwiper = function (e) {\n console.log(\n \"[Swiper Investir] Adaptation de l'écran. Mode desktop ? \" + e.matches,\n );\n if (currentSwiper && !currentSwiper.destroyed) {\n currentSwiper.destroy(true, true);\n }\n var currentDelay = e.matches ? speeds.desktop : speeds.mobile;\n currentSwiper = new Swiper(sliderEl, buildConfig(e.matches));\n setupSwiperPagination(currentSwiper, pagination, currentDelay);\n console.log(\n \"[Swiper Investir] Nouvelle instance Swiper créée avec succès\",\n currentSwiper,\n );\n };\n\n mql.addEventListener(\"change\", updateSwiper);\n updateSwiper(mql);\n}\n\n//////////////////////////////////// Swiper 4 (Page Levées ?)\nfunction Init_Swiper_4() {\n console.log(\"[Swiper 4] Initialisation lancée\");\n\n var sections = document.querySelectorAll('[data-sw=\"swiper-4\"]');\n if (sections.length === 0) {\n console.log(\n '[Swiper 4] Section parent introuvable (pas de data-sw=\"swiper-4\" sur la page)',\n );\n return;\n }\n\n sections.forEach(function (section) {\n console.log(\"[Swiper 4] Section trouvée !\", section);\n\n var sliderEl = section.querySelector('[data-sw=\"slider\"]');\n var slidesEl = section.querySelector('[data-sw=\"slides\"]');\n var slides = section.querySelectorAll('[data-sw=\"slide\"]');\n var prevBtn = section.querySelector('[data-sw=\"prev\"]');\n var nextBtn = section.querySelector('[data-sw=\"next\"]');\n var pagination = section.querySelector('[data-sw=\"pagination\"]');\n\n if (!sliderEl) {\n console.error(\n '[Swiper 4] Configuration incomplète : data-sw=\"slider\" introuvable !',\n );\n return;\n }\n\n if (slides.length === 0) {\n console.warn(\n '[Swiper 4] Aucune slide (data-sw=\"slide\") trouvée à l\\'intérieur du slider.',\n );\n return;\n } else {\n console.log(\"[Swiper 4] Nombre de slides trouvées: \" + slides.length);\n }\n\n if (sliderEl) sliderEl.classList.add(\"swiper\");\n if (slidesEl) slidesEl.classList.add(\"swiper-wrapper\");\n slides.forEach(function (s) {\n s.classList.add(\"swiper-slide\");\n });\n\n // Paramètres \"en dur\" propres au Swiper 4\n var desktopSpace = 168;\n var mobileSpace = 8;\n var speed = 500;\n var speeds = parseSwiperSpeed(section);\n\n var buildConfig = function (isDesktop) {\n var effect = isDesktop ? \"slide\" : \"creative\";\n var autoplayDelay = isDesktop ? speeds.desktop : speeds.mobile;\n\n var config = {\n slidesPerView: \"auto\",\n spaceBetween: isDesktop ? desktopSpace : mobileSpace,\n direction: \"horizontal\",\n loop: true,\n centeredSlides: true,\n speed: speed,\n grabCursor: true,\n effect: effect,\n observer: true,\n observeParents: true,\n slideActiveClass: \"active\",\n slideNextClass: \"next\",\n slidePrevClass: \"prev\",\n autoplay: autoplayDelay > 0\n ? {\n delay: autoplayDelay,\n disableOnInteraction: false,\n pauseOnMouseEnter: isDesktop,\n }\n : false,\n };\n\n if (prevBtn && nextBtn) {\n console.log(\"[Swiper 4] Flèches de navigation activées\");\n config.navigation = { prevEl: prevBtn, nextEl: nextBtn };\n }\n\n if (pagination) {\n console.log(\"[Swiper 4] Pagination activée\");\n config.pagination = getSwiperPaginationConfig(pagination);\n }\n\n // Effet carte customisé sur mobile\n if (effect === \"creative\") {\n config.creativeEffect = {\n prev: {\n shadow: false,\n translate: [\"-120%\", 0, -500],\n rotate: [0, 0, -8],\n opacity: 0,\n },\n next: {\n shadow: false,\n translate: [\"12%\", \"-2%\", -1],\n scale: 0.85,\n origin: \"center center\",\n },\n limitProgress: 2,\n };\n }\n\n return config;\n };\n\n var mql = window.matchMedia(\"(min-width: 768px)\");\n var currentSwiper;\n\n var updateSwiper = function (e) {\n console.log(\n \"[Swiper 4] Adaptation de l'écran. Mode desktop ? \" + e.matches,\n );\n if (currentSwiper && !currentSwiper.destroyed) {\n currentSwiper.destroy(true, true);\n }\n var currentDelay = e.matches ? speeds.desktop : speeds.mobile;\n currentSwiper = new Swiper(sliderEl, buildConfig(e.matches));\n setupSwiperPagination(currentSwiper, pagination, currentDelay);\n console.log(\n \"[Swiper 4] Nouvelle instance Swiper créée avec succès\",\n currentSwiper,\n );\n };\n\n mql.addEventListener(\"change\", updateSwiper);\n updateSwiper(mql);\n });\n}\n\n//////////////////////////////////// Swiper KOL\nfunction InitSwiperKOL() {\n console.log(\"[Swiper KOL] Initialisation lancée\");\n var section = document.querySelector('[data-sw=\"kol\"]');\n if (!section) return;\n\n var sliderEl = section.querySelector('[data-sw=\"slider\"]');\n var slidesEl = section.querySelector('[data-sw=\"slides\"]');\n var slides = section.querySelectorAll('[data-sw=\"slide\"]');\n var btnPrev = section.querySelector('[data-sw=\"prev\"]');\n var btnNext = section.querySelector('[data-sw=\"next\"]');\n var pagination = section.querySelector('[data-sw=\"pagination\"]');\n\n if (!sliderEl) return;\n\n sliderEl.classList.add(\"swiper\");\n slidesEl.classList.add(\"swiper-wrapper\");\n slides.forEach(function (s) {\n s.classList.add(\"swiper-slide\");\n });\n\n var speeds = parseSwiperSpeed(section);\n\n var buildConfig = function (isDesktop) {\n var autoplayDelay = isDesktop ? speeds.desktop : speeds.mobile;\n return {\n loop: true,\n loopedSlides: slides.length || 5,\n slidesPerView: \"auto\",\n spaceBetween: 8,\n centeredSlides: true,\n allowTouchMove: true,\n grabCursor: true,\n observer: true,\n observeParents: true,\n watchSlidesProgress: true,\n navigation: { prevEl: btnPrev, nextEl: btnNext },\n pagination: pagination ? getSwiperPaginationConfig(pagination) : false,\n slideActiveClass: \"active\",\n autoplay: autoplayDelay > 0\n ? {\n delay: autoplayDelay,\n disableOnInteraction: false,\n pauseOnMouseEnter: false,\n }\n : false,\n on: {\n touchEnd: function () {\n var s = this;\n if (s.autoplay && !s.autoplay.running) {\n s.autoplay.start();\n }\n },\n },\n };\n };\n\n var mql = window.matchMedia(\"(min-width: 768px)\");\n var currentSwiper;\n\n var updateSwiper = function (e) {\n console.log(\n \"[Swiper KOL] Adaptation de l'écran. Mode desktop ? \" + e.matches,\n );\n if (currentSwiper && !currentSwiper.destroyed) {\n currentSwiper.destroy(true, true);\n }\n var currentDelay = e.matches ? speeds.desktop : speeds.mobile;\n currentSwiper = new Swiper(sliderEl, buildConfig(e.matches));\n setupSwiperPagination(currentSwiper, pagination, currentDelay);\n console.log(\n \"[Swiper KOL] Nouvelle instance Swiper créée avec succès\",\n currentSwiper,\n );\n };\n\n mql.addEventListener(\"change\", updateSwiper);\n // Délai iOS Safari : laisser le DOM se peindre avant d'init\n setTimeout(function () {\n updateSwiper(mql);\n }, 150);\n}\n\n//////////////////////////////////// Swiper Levées\nfunction InitSwiperLevees() {\n console.log(\"[Swiper Levées] Initialisation lancée\");\n var section = document.querySelector('[data-sw=\"levees\"]');\n if (!section) return;\n\n var sliderEl = section.querySelector('[data-sw=\"slider\"]');\n var slidesEl = section.querySelector('[data-sw=\"slides\"]');\n var slides = section.querySelectorAll('[data-sw=\"slide\"]');\n var btnPrev = section.querySelector('[data-sw=\"prev\"]');\n var btnNext = section.querySelector('[data-sw=\"next\"]');\n var pagination = section.querySelector('[data-sw=\"pagination\"]');\n\n if (!sliderEl) return;\n\n sliderEl.classList.add(\"swiper\");\n slidesEl.classList.add(\"swiper-wrapper\");\n slides.forEach(function (s) {\n s.classList.add(\"swiper-slide\");\n });\n\n var speeds = parseSwiperSpeed(section);\n\n var buildConfig = function (isDesktop) {\n var autoplayDelay = isDesktop ? speeds.desktop : speeds.mobile;\n return {\n loop: true,\n spaceBetween: 8,\n slidesPerView: \"auto\",\n allowTouchMove: true,\n grabCursor: true,\n loopedSlides: slides.length || 5,\n observer: true,\n observeParents: true,\n watchSlidesProgress: true,\n navigation: { prevEl: btnPrev, nextEl: btnNext },\n pagination: pagination ? getSwiperPaginationConfig(pagination) : false,\n breakpoints: {\n 0: { centeredSlides: true },\n 769: { centeredSlides: false },\n },\n slideActiveClass: \"active\",\n autoplay: autoplayDelay > 0\n ? {\n delay: autoplayDelay,\n disableOnInteraction: false,\n pauseOnMouseEnter: false,\n }\n : false,\n };\n };\n\n var mql = window.matchMedia(\"(min-width: 768px)\");\n var currentSwiper;\n\n var updateSwiper = function (e) {\n console.log(\n \"[Swiper Levées] Adaptation de l'écran. Mode desktop ? \" + e.matches,\n );\n if (currentSwiper && !currentSwiper.destroyed) {\n currentSwiper.destroy(true, true);\n }\n var currentDelay = e.matches ? speeds.desktop : speeds.mobile;\n currentSwiper = new Swiper(sliderEl, buildConfig(e.matches));\n setupSwiperPagination(currentSwiper, pagination, currentDelay);\n console.log(\n \"[Swiper Levées] Nouvelle instance Swiper créée avec succès\",\n currentSwiper,\n );\n };\n\n mql.addEventListener(\"change\", updateSwiper);\n updateSwiper(mql);\n}\n\n//////////////////////////////////// Swiper Membres\nfunction InitSwiperMembres() {\n console.log(\"[Swiper Membres] Initialisation lancée\");\n\n var sections = document.querySelectorAll('[data-sw=\"membres\"]');\n if (sections.length === 0) {\n console.log(\n '[Swiper Membres] Section parent introuvable (pas de data-sw=\"membres\" sur la page)',\n );\n return;\n }\n\n sections.forEach(function (section) {\n console.log(\"[Swiper Membres] Section trouvée !\", section);\n\n var sliderEl = section.querySelector('[data-sw=\"slider\"]');\n var slidesEl = section.querySelector('[data-sw=\"slides\"]');\n var slides = section.querySelectorAll('[data-sw=\"slide\"]');\n var prevBtn = section.querySelector('[data-sw=\"prev\"]');\n var nextBtn = section.querySelector('[data-sw=\"next\"]');\n var pagination = section.querySelector('[data-sw=\"pagination\"]');\n\n if (!sliderEl) {\n console.error(\n '[Swiper Membres] Configuration incomplète : data-sw=\"slider\" introuvable !',\n );\n return;\n }\n\n if (slides.length === 0) {\n console.warn(\n '[Swiper Membres] Aucune slide (data-sw=\"slide\") trouvée à l\\'intérieur du slider.',\n );\n return;\n } else {\n console.log(\n \"[Swiper Membres] Nombre de slides trouvées: \" + slides.length,\n );\n }\n\n if (sliderEl) sliderEl.classList.add(\"swiper\");\n if (slidesEl) slidesEl.classList.add(\"swiper-wrapper\");\n slides.forEach(function (s) {\n s.classList.add(\"swiper-slide\");\n });\n\n // Paramètres \"en dur\" propres au Swiper Membres\n var desktopSpace = 32;\n var mobileSpace = 32;\n var speed = 500;\n var speeds = parseSwiperSpeed(section);\n\n var buildConfig = function (isDesktop) {\n var autoplayDelay = isDesktop ? speeds.desktop : speeds.mobile;\n\n var config = {\n slidesPerView: \"auto\",\n spaceBetween: isDesktop ? desktopSpace : mobileSpace,\n loop: true,\n speed: speed,\n slideActiveClass: \"active\",\n autoplay: autoplayDelay > 0\n ? { delay: autoplayDelay, disableOnInteraction: false }\n : false,\n };\n\n if (prevBtn && nextBtn) {\n console.log(\"[Swiper Membres] Flèches de navigation activées\");\n config.navigation = { prevEl: prevBtn, nextEl: nextBtn };\n }\n\n if (pagination) {\n console.log(\"[Swiper Membres] Pagination activée\");\n config.pagination = getSwiperPaginationConfig(pagination);\n }\n\n return config;\n };\n\n var mql = window.matchMedia(\"(min-width: 768px)\");\n var currentSwiper;\n\n var updateSwiper = function (e) {\n console.log(\n \"[Swiper Membres] Adaptation de l'écran. Mode desktop ? \" + e.matches,\n );\n if (currentSwiper && !currentSwiper.destroyed) {\n currentSwiper.destroy(true, true);\n }\n var currentDelay = e.matches ? speeds.desktop : speeds.mobile;\n currentSwiper = new Swiper(sliderEl, buildConfig(e.matches));\n setupSwiperPagination(currentSwiper, pagination, currentDelay);\n console.log(\n \"[Swiper Membres] Nouvelle instance Swiper créée avec succès\",\n currentSwiper,\n );\n };\n\n mql.addEventListener(\"change\", updateSwiper);\n updateSwiper(mql);\n });\n}\n\n//////////////////////////////////// Swiper Trustpilot\nfunction InitSwiperTrustpilot() {\n console.log(\"[Swiper Trustpilot] Initialisation lancée\");\n\n var sections = document.querySelectorAll('[data-sw=\"trustpilot\"]');\n if (sections.length === 0) {\n console.log(\n '[Swiper Trustpilot] Section parent introuvable (pas de data-sw=\"trustpilot\" sur la page)',\n );\n return;\n }\n\n sections.forEach(function (section) {\n console.log(\"[Swiper Trustpilot] Section trouvée !\", section);\n\n var sliderEl = section.querySelector('[data-sw=\"slider\"]');\n var slidesEl = section.querySelector('[data-sw=\"slides\"]');\n var slides = section.querySelectorAll('[data-sw=\"slide\"]');\n var prevBtn = section.querySelector('[data-sw=\"prev\"]');\n var nextBtn = section.querySelector('[data-sw=\"next\"]');\n var pagination = section.querySelector('[data-sw=\"pagination\"]');\n\n if (!sliderEl) {\n console.error(\n '[Swiper Trustpilot] Configuration incomplète : data-sw=\"slider\" introuvable !',\n );\n return;\n }\n\n if (slides.length === 0) {\n console.warn(\n '[Swiper Trustpilot] Aucune slide (data-sw=\"slide\") trouvée à l\\'intérieur du slider.',\n );\n return;\n } else {\n console.log(\n \"[Swiper Trustpilot] Nombre de slides trouvées: \" + slides.length,\n );\n }\n\n if (sliderEl) sliderEl.classList.add(\"swiper\");\n if (slidesEl) slidesEl.classList.add(\"swiper-wrapper\");\n slides.forEach(function (s) {\n s.classList.add(\"swiper-slide\");\n });\n\n var speeds = parseSwiperSpeed(section);\n\n var buildConfig = function (isDesktop) {\n var autoplayDelay = isDesktop ? speeds.desktop : speeds.mobile;\n\n var config = {\n slidesPerView: \"auto\",\n spaceBetween: 8,\n centeredSlides: false,\n loop: true,\n allowTouchMove: true,\n grabCursor: true,\n loopedSlides: slides.length || 5,\n observer: true,\n observeParents: true,\n watchSlidesProgress: true,\n slideActiveClass: \"active\",\n autoplay: autoplayDelay > 0\n ? {\n delay: autoplayDelay,\n disableOnInteraction: false,\n pauseOnMouseEnter: false,\n }\n : false,\n };\n\n if (prevBtn && nextBtn) {\n console.log(\"[Swiper Trustpilot] Flèches de navigation activées\");\n config.navigation = { prevEl: prevBtn, nextEl: nextBtn };\n }\n\n if (pagination) {\n console.log(\"[Swiper Trustpilot] Pagination activée\");\n config.pagination = getSwiperPaginationConfig(pagination);\n }\n\n return config;\n };\n\n var mql = window.matchMedia(\"(min-width: 768px)\");\n var currentSwiper;\n\n var updateSwiper = function (e) {\n console.log(\n \"[Swiper Trustpilot] Adaptation de l'écran. Mode desktop ? \" +\n e.matches,\n );\n if (currentSwiper && !currentSwiper.destroyed) {\n currentSwiper.destroy(true, true);\n }\n var currentDelay = e.matches ? speeds.desktop : speeds.mobile;\n currentSwiper = new Swiper(sliderEl, buildConfig(e.matches));\n setupSwiperPagination(currentSwiper, pagination, currentDelay);\n console.log(\n \"[Swiper Trustpilot] Nouvelle instance Swiper créée avec succès\",\n currentSwiper,\n );\n };\n\n mql.addEventListener(\"change\", updateSwiper);\n updateSwiper(mql);\n });\n}\n\n// ============================================================\n// init SWIPERS\n// ============================================================\n\n//////////////////////////////////// Init swipers\nfunction initAllSwipers() {\n document.querySelector('[data-sw=\"swiper-1\"]') && Init_Swiper_1();\n document.querySelector('[data-sw=\"swiper-2\"]') && Init_Swiper_2();\n document.querySelector('[data-sw=\"investir\"]') && InitSwiperInvestir();\n document.querySelector('[data-sw=\"swiper-4\"]') && Init_Swiper_4();\n document.querySelector('[data-sw=\"kol\"]') && InitSwiperKOL();\n document.querySelector('[data-sw=\"levees\"]') && InitSwiperLevees();\n document.querySelector('[data-sw=\"membres\"]') && InitSwiperMembres();\n document.querySelector('[data-sw=\"trustpilot\"]') && InitSwiperTrustpilot();\n}\n\ninitAllSwipers();","label",[130],"c78fb7d2-29e3-11f1-967b-42dde27851f2","main.js","df00279a-05cf-11f1-9b96-42dde27851f2",488,["D",1774619370746],429,"/* =========================\n 📆 UPDATE 27-03-2026_14:49\n ========================= */\n\n/* =========================\n ✅ GESTION TYPEFORM (laisser en haut)\n ========================= */\n\n(function () {\n /* =========================\n CONFIG\n ========================= */\n\n const CONFIG = {\n triggerSelector: '[OpenTf=\"trigger\"]',\n iframeSelector: \".tf-v1-iframe-wrapper iframe\",\n iframeDelayMs: 400, // délai pour laisser Typeform injecter l’iframe\n };\n\n /* =========================\n HELPERS\n ========================= */\n\n function getEmailFromElement(element) {\n const mailInput =\n element.querySelector('input[type=\"email\"]')?.value?.replace(\n /\\+/g,\n \"%2B\",\n ) || \"\";\n if (mailInput) console.log(mailInput);\n return mailInput;\n }\n\n function updateIframeParams(params) {\n const iframe = document.querySelector(CONFIG.iframeSelector);\n if (!iframe) return;\n\n let currentSrc = iframe.getAttribute(\"src\");\n let newSrc = currentSrc;\n\n if (params.email) {\n const sep = currentSrc.includes(\"?\") ? \"&\" : \"?\";\n newSrc = `${currentSrc}${sep}email=${params.email}`;\n }\n\n iframe.setAttribute(\"src\", newSrc);\n console.log(\"Updated iframe src:\", iframe.src);\n }\n\n function openTf({ email = \"\" } = {}) {\n const trigger = document.querySelector(CONFIG.triggerSelector);\n if (!trigger) {\n console.warn(\"Typeform trigger not found\");\n return;\n }\n\n // 1 — ouvrir popup\n trigger.click();\n\n // 2 — injecter email après création iframe\n if (email) {\n setTimeout(() => {\n updateIframeParams({ email });\n }, CONFIG.iframeDelayMs);\n }\n }\n\n /* =========================\n LISTENERS\n ========================= */\n\n // submit formulaire → récupère email\n document.querySelectorAll('[OpenTf=\"form\"]').forEach((form) => {\n form.addEventListener(\"submit\", function (event) {\n event.preventDefault();\n const email = getEmailFromElement(form);\n openTf({ email });\n });\n });\n\n // clic simple → ouvre juste\n document.querySelectorAll('[OpenTf=\"btn\"]').forEach((el) => {\n el.addEventListener(\"click\", function (event) {\n event.preventDefault();\n openTf();\n });\n });\n})();\n\n/* =========================\n ✅ NAVBAR\n ========================= */\n\n// Animation BG navbar\n// Vérifie si la largeur de la fenêtre est inférieure à 769px (tablette et mobile)\nif (window.innerWidth < 769) {\n document.addEventListener(\"DOMContentLoaded\", function () {\n const menuButton = document.querySelector(\"#menuButton\");\n const navbarMenus = document.querySelectorAll(\".navbar5_menu\");\n const mainWrapper = document.querySelector(\".main-wrapper\");\n const backgroundNavbar = document.querySelector(\".background-navbar\");\n\n function updateBackgroundNavbarStyles() {\n // Vérifie si au moins un .navbar5_menu est en display flex\n const atLeastOneMenuOpen = Array.from(navbarMenus).some((menu) => {\n return window.getComputedStyle(menu).display === \"flex\";\n });\n\n if (atLeastOneMenuOpen) {\n // Quand au moins un menu est ouvert\n backgroundNavbar.style.position = \"absolute\";\n backgroundNavbar.style.top = \"0\";\n backgroundNavbar.style.left = \"0\";\n backgroundNavbar.style.width = \"100vw\";\n backgroundNavbar.style.height = \"100vh\";\n backgroundNavbar.style.transform = \"translateY(0)\";\n backgroundNavbar.style.display = \"block\";\n\n // Appliquer le filtre blur de 4px\n mainWrapper.style.filter = \"blur(4px)\";\n mainWrapper.style.transition =\n \"filter 0.5s cubic-bezier(.165, .84, .44, 1)\";\n\n // Bloquer le scroll\n document.body.style.overflow = \"hidden\";\n } else {\n // Quand tous les menus sont fermés\n backgroundNavbar.style.display = \"none\";\n backgroundNavbar.style.transform = \"translateY(-100%)\";\n\n // Remettre le filtre blur à 0px\n mainWrapper.style.filter = \"blur(0px)\";\n\n // Force tous les .navbar5_menu en display none\n navbarMenus.forEach((menu) => {\n menu.style.display = \"none\";\n });\n\n // Réactiver le scroll\n document.body.style.overflow = \"\";\n }\n }\n\n // Appel initial de la fonction pour mettre à jour les styles\n updateBackgroundNavbarStyles();\n\n // Écouteur d'événement au clic sur #menuButton\n if (menuButton) {\n menuButton.addEventListener(\"click\", () => {\n // Petit délai pour laisser le temps au menu de s'ouvrir/fermer\n setTimeout(updateBackgroundNavbarStyles, 50);\n });\n }\n\n // Observer les changements de style sur chaque .navbar5_menu\n navbarMenus.forEach((menu) => {\n const observer = new MutationObserver(updateBackgroundNavbarStyles);\n observer.observe(menu, {\n attributes: true,\n attributeFilter: [\"style\", \"class\"],\n });\n });\n });\n}\n\n/* =========================\n ✅ GSAP ANIM GLOBAL\n ========================= */\n\ngsap.registerPlugin(ScrollTrigger);\n\nfunction animateElements() {\n ScrollTrigger.getAll().forEach((trigger) => trigger.kill());\n\n // Masquer tous les finals dès le départ\n document.querySelectorAll('[display=\"final\"]').forEach((final) => {\n gsap.set(final, { display: \"none\", opacity: 0 });\n });\n\n gsap.utils.toArray('[data-animate=\"fade-up\"]').forEach((element) => {\n const delay = parseFloat(element.dataset.delay) || 0;\n const startY = element.dataset.startY;\n const startX = element.dataset.startX;\n const endY = element.dataset.endY;\n const endX = element.dataset.endX;\n const startRotate = element.dataset.startRotate || 0;\n const endRotate = element.dataset.endRotate || 0;\n\n const skeletons = element.querySelectorAll('[display=\"skeleton\"]');\n const finals = element.querySelectorAll('[display=\"final\"]');\n\n gsap.fromTo(element, {\n opacity: 0,\n y: startY,\n x: startX,\n rotate: startRotate,\n }, {\n opacity: 1,\n y: endY,\n x: endX,\n rotate: endRotate,\n duration: 1,\n delay: delay,\n ease: \"power3.out\",\n scrollTrigger: {\n trigger: element,\n start: \"top 95%\",\n toggleActions: \"play none none none\",\n once: true,\n onEnter: () => {\n if (!skeletons.length || !finals.length) return;\n\n const skeletonDuration = 500;\n\n setTimeout(() => {\n skeletons.forEach((skeleton, i) => {\n const final = finals[i];\n if (!final) return;\n\n const tl = gsap.timeline();\n\n tl.to(skeleton, {\n opacity: 0,\n duration: 0.3,\n ease: \"power2.in\",\n onComplete: () => gsap.set(skeleton, { display: \"none\" }),\n });\n\n tl.set(final, { display: \"block\" });\n\n tl.to(final, {\n opacity: 1,\n duration: 0.4,\n ease: \"power2.out\",\n });\n });\n }, (delay * 1) + skeletonDuration);\n },\n },\n });\n });\n}\n\n// ============================================\n// INIT\n// ============================================\n\nanimateElements();\n\ndocument.querySelectorAll('[gsap-trigger=\"click\"]').forEach((trigger) => {\n trigger.addEventListener(\"click\", function () {\n setTimeout(() => {\n animateElements();\n }, 300);\n });\n});\n\n/* =========================\n ✅ BENTO TO TABS TABLET/MOBILE\n ========================= */\n\nconst mediaQuery = window.matchMedia(\"(max-width: 991px)\");\n\nfunction initCardBlurTabs() {\n if (!mediaQuery.matches) {\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) => {\n list.style.height = \"\";\n list.style.overflow = \"\";\n list.style.display = \"\";\n });\n return;\n }\n\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) => {\n const isFirst = list.getAttribute(\"card-blur-tabs-load\") === \"first\";\n\n if (isFirst) {\n list.style.setProperty(\"height\", \"auto\", \"important\");\n list.style.setProperty(\"overflow\", \"visible\", \"important\");\n list.style.setProperty(\"display\", \"flex\", \"important\");\n } else {\n list.style.setProperty(\"height\", \"0px\", \"important\");\n list.style.setProperty(\"overflow\", \"hidden\", \"important\");\n list.style.setProperty(\"display\", \"none\", \"important\");\n }\n });\n\n setTimeout(updateDropdownStyles, 100);\n}\n\nfunction updateDropdownStyles() {\n if (!mediaQuery.matches) {\n document.querySelectorAll('[card-blur-tabs=\"dropdown\"]').forEach(\n (dropdown) => {\n const dropdownChild = dropdown.children[0];\n if (dropdownChild) dropdownChild.style.transform = \"\";\n dropdown.style.color = \"\";\n dropdown.style.backgroundImage = \"\";\n },\n );\n\n document.querySelectorAll('[card-blur-tabs=\"dropdown-dark\"]').forEach(\n (dropdown) => {\n const dropdownChild = dropdown.children[0];\n if (dropdownChild) dropdownChild.style.transform = \"\";\n dropdown.style.backgroundColor = \"\";\n dropdown.style.color = \"\";\n dropdown.style.border = \"\";\n },\n );\n return;\n }\n\n document.querySelectorAll('[card-blur-tabs=\"toggle\"]').forEach((toggle) => {\n const dropdown = toggle.querySelector('[card-blur-tabs=\"dropdown\"]');\n const dropdownDark = toggle.querySelector(\n '[card-blur-tabs=\"dropdown-dark\"]',\n );\n\n const siblingLists = Array.from(\n toggle.parentElement.querySelectorAll('[card-blur-tabs=\"list\"]'),\n );\n\n const isAnyListOpen = siblingLists.some((list) => {\n const style = window.getComputedStyle(list);\n return style.height !== \"0px\" && style.display !== \"none\";\n });\n\n // Gestion dropdown-close couleur\n toggle.querySelectorAll(\"[dropdown-close]\").forEach((el) => {\n const closeColor = el.getAttribute(\"dropdown-close\");\n if (!closeColor) return;\n el.style.setProperty(\"transition\", \"color 0.3s ease\", \"important\");\n if (isAnyListOpen) {\n el.style.setProperty(\"color\", \"white\", \"important\");\n } else {\n el.style.setProperty(\"color\", closeColor, \"important\");\n }\n });\n\n // Gestion dropdown normal\n if (dropdown) {\n const dropdownChild = dropdown.children[0];\n if (isAnyListOpen) {\n if (dropdownChild) {\n dropdownChild.style.setProperty(\n \"transition\",\n \"transform 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdownChild.style.setProperty(\n \"transform\",\n \"rotate(0deg)\",\n \"important\",\n );\n });\n }\n dropdown.style.setProperty(\n \"transition\",\n \"color 0.3s ease, background-image 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdown.style.setProperty(\"color\", \"white\", \"important\");\n dropdown.style.setProperty(\"background-image\", \"none\", \"important\");\n });\n } else {\n if (dropdownChild) {\n dropdownChild.style.setProperty(\n \"transition\",\n \"transform 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdownChild.style.setProperty(\n \"transform\",\n \"rotate(180deg)\",\n \"important\",\n );\n });\n }\n dropdown.style.setProperty(\n \"transition\",\n \"color 0.3s ease, background-image 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdown.style.setProperty(\"color\", \"\", \"important\");\n dropdown.style.setProperty(\"background-image\", \"\", \"important\");\n });\n }\n }\n\n // Gestion dropdown-dark\n if (dropdownDark) {\n const dropdownDarkChild = dropdownDark.children[0];\n if (isAnyListOpen) {\n if (dropdownDarkChild) {\n dropdownDarkChild.style.setProperty(\n \"transition\",\n \"transform 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdownDarkChild.style.setProperty(\n \"transform\",\n \"rotate(0deg)\",\n \"important\",\n );\n });\n }\n dropdownDark.style.setProperty(\n \"transition\",\n \"background-color 0.3s ease, color 0.3s ease, border 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdownDark.style.setProperty(\n \"background-color\",\n \"#00094A\",\n \"important\",\n );\n dropdownDark.style.setProperty(\"color\", \"white\", \"important\");\n dropdownDark.style.setProperty(\"border\", \"none\", \"important\");\n });\n } else {\n if (dropdownDarkChild) {\n dropdownDarkChild.style.setProperty(\n \"transition\",\n \"transform 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdownDarkChild.style.setProperty(\n \"transform\",\n \"rotate(180deg)\",\n \"important\",\n );\n });\n }\n dropdownDark.style.setProperty(\n \"transition\",\n \"background-color 0.3s ease, color 0.3s ease, border 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdownDark.style.setProperty(\"background-color\", \"\", \"important\");\n dropdownDark.style.setProperty(\"color\", \"\", \"important\");\n dropdownDark.style.setProperty(\"border\", \"\", \"important\");\n });\n }\n }\n });\n}\n\nfunction handleCardBlurTabsClick() {\n document.querySelectorAll('[card-blur-tabs=\"toggle\"]').forEach((button) => {\n button.addEventListener(\"click\", () => {\n if (!mediaQuery.matches) return;\n\n const siblingLists = Array.from(\n button.parentElement.querySelectorAll('[card-blur-tabs=\"list\"]'),\n );\n\n const isOpen = siblingLists.some((list) => {\n const style = window.getComputedStyle(list);\n return style.height !== \"0px\" && style.display !== \"none\";\n });\n\n // Changer les couleurs dropdown-close immédiatement au clic\n button.querySelectorAll(\"[dropdown-close]\").forEach((el) => {\n const closeColor = el.getAttribute(\"dropdown-close\");\n if (!closeColor) return;\n el.style.setProperty(\"transition\", \"color 0.3s ease\", \"important\");\n if (isOpen) {\n // On ferme → retour à closeColor\n el.style.setProperty(\"color\", closeColor, \"important\");\n } else {\n // On ouvre → blanc\n el.style.setProperty(\"color\", \"white\", \"important\");\n }\n });\n\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) => {\n list.style.setProperty(\"height\", \"0px\", \"important\");\n list.style.setProperty(\"overflow\", \"hidden\", \"important\");\n list.style.setProperty(\"display\", \"none\", \"important\");\n });\n\n if (!isOpen) {\n siblingLists.forEach((list) => {\n list.style.setProperty(\"height\", \"auto\", \"important\");\n list.style.setProperty(\"overflow\", \"visible\", \"important\");\n list.style.setProperty(\"display\", \"flex\", \"important\");\n });\n }\n\n setTimeout(updateDropdownStyles, 100);\n });\n });\n}\n\nmediaQuery.addEventListener(\"change\", () => {\n initCardBlurTabs();\n updateDropdownStyles();\n});\n\nif (document.readyState === \"loading\") {\n document.addEventListener(\"DOMContentLoaded\", () => {\n initCardBlurTabs();\n handleCardBlurTabsClick();\n });\n} else {\n initCardBlurTabs();\n handleCardBlurTabsClick();\n}\n\n/* =========================\n ✅ IM MARQUEE INVESTIR : GESTION HIGHLIGHT\n ========================= */\nfunction startRandomHighlight() {\n const viewport = document.querySelector(\"[data-marquee-viewport]\");\n\n if (!viewport) {\n return;\n }\n\n let currentHighlightedItem = null;\n let currentLineIndex = 0;\n let rotationInterval = null;\n\n function getLines() {\n const lines = viewport.querySelectorAll(\"[data-line]\");\n return Array.from(lines);\n }\n\n function getVisibleItemsInLine(line) {\n const viewportRect = viewport.getBoundingClientRect();\n const items = line.querySelectorAll(\"[data-highlight-target]\");\n const visibleItems = [];\n\n const margin = 50;\n const visibleLeft = viewportRect.left + margin;\n const visibleRight = viewportRect.right - margin;\n\n items.forEach((item) => {\n const itemRect = item.getBoundingClientRect();\n const itemCenter = itemRect.left + itemRect.width / 2;\n const isVisible = itemCenter > visibleLeft && itemCenter < visibleRight;\n\n if (isVisible) {\n visibleItems.push({\n element: item,\n center: itemCenter,\n text: item.textContent.trim(),\n });\n }\n });\n\n return visibleItems;\n }\n\n function isItemStillVisible(item) {\n if (!item) return false;\n\n const viewportRect = viewport.getBoundingClientRect();\n const itemRect = item.element.getBoundingClientRect();\n const itemCenter = itemRect.left + itemRect.width / 2;\n\n const margin = 50;\n const visibleLeft = viewportRect.left + margin;\n const visibleRight = viewportRect.right - margin;\n\n return itemCenter > visibleLeft && itemCenter < visibleRight;\n }\n\n function removeHighlight() {\n if (currentHighlightedItem) {\n currentHighlightedItem.element.classList.remove(\"is-highlighted\");\n\n // Retirer la classe couleur du label\n const labelElement = currentHighlightedItem.element.querySelector(\n \".label-industrie\",\n );\n if (labelElement) {\n labelElement.classList.remove(\"text-color-custom\");\n }\n\n // Remettre l'opacité à 0 pour .gradient-industrie\n const gradientElement = currentHighlightedItem.element.querySelector(\n \".gradient-industrie\",\n );\n if (gradientElement) {\n gradientElement.style.opacity = \"0\";\n }\n\n currentHighlightedItem = null;\n }\n }\n\n function applyRandomHighlightOnCurrentLine() {\n const lines = getLines();\n const currentLine = lines[currentLineIndex];\n\n if (!currentLine) return false;\n\n const visibleItems = getVisibleItemsInLine(currentLine);\n\n if (visibleItems.length === 0) {\n return false;\n }\n\n const randomIndex = Math.floor(Math.random() * visibleItems.length);\n const selectedItem = visibleItems[randomIndex];\n\n currentHighlightedItem = selectedItem;\n selectedItem.element.classList.add(\"is-highlighted\");\n\n // Ajouter la classe couleur au label\n const labelElement = selectedItem.element.querySelector(\".label-industrie\");\n if (labelElement) {\n labelElement.classList.add(\"text-color-custom\");\n }\n\n // Mettre l'opacité à 1 pour .gradient-industrie\n const gradientElement = selectedItem.element.querySelector(\n \".gradient-industrie\",\n );\n if (gradientElement) {\n gradientElement.style.opacity = \"1\";\n }\n\n return true;\n }\n\n function findNextLineWithVisibleItems() {\n const lines = getLines();\n let attempts = 0;\n const maxAttempts = lines.length;\n\n while (attempts < maxAttempts) {\n currentLineIndex = (currentLineIndex + 1) % lines.length;\n attempts++;\n\n if (applyRandomHighlightOnCurrentLine()) {\n return true;\n }\n }\n\n return false;\n }\n\n function applyRandomHighlightOnNextLine() {\n removeHighlight();\n\n if (findNextLineWithVisibleItems()) {\n resetRotationInterval();\n }\n }\n\n function checkVisibility() {\n if (currentHighlightedItem && !isItemStillVisible(currentHighlightedItem)) {\n removeHighlight();\n\n if (!applyRandomHighlightOnCurrentLine()) {\n findNextLineWithVisibleItems();\n }\n\n resetRotationInterval();\n }\n }\n\n function resetRotationInterval() {\n if (rotationInterval) {\n clearInterval(rotationInterval);\n }\n\n rotationInterval = setInterval(() => {\n applyRandomHighlightOnNextLine();\n }, 4000);\n }\n\n setInterval(checkVisibility, 100);\n\n setTimeout(() => {\n if (!applyRandomHighlightOnCurrentLine()) {\n findNextLineWithVisibleItems();\n }\n\n resetRotationInterval();\n }, 100);\n}\n\ndocument.addEventListener(\"DOMContentLoaded\", () => {\n setTimeout(() => {\n startRandomHighlight();\n }, 500);\n});\n\n/* =========================\n 🚧 Auto animate Startup Tags on map\n ========================= */\nwindow.initTagsAnimateOnMap = initTagsAnimateOnMap;\nfunction initTagsAnimateOnMap() {\n // ── CONFIG ──\n var INTERVAL = 2000;\n var FADE = 1200;\n var STAGGER = 1200;\n\n function shuffle(arr) {\n var a = arr.slice();\n for (var i = a.length - 1; i > 0; i--) {\n var j = Math.floor(Math.random() * (i + 1));\n var tmp = a[i];\n a[i] = a[j];\n a[j] = tmp;\n }\n return a;\n }\n\n document.querySelectorAll(\"[data-tag-rotator]\").forEach(function (container) {\n var opacityOnly = container.dataset.tagFade === \"opacity\";\n var pool = Array.from(container.querySelectorAll(\"[data-tag]\"));\n var slots = Array.from(container.querySelectorAll(\"[data-tag-slot]\"))\n .filter(function (slot) {\n return getComputedStyle(slot).display !== \"none\";\n });\n\n var poolIndex = 0;\n function nextTag() {\n var tag = pool[poolIndex].cloneNode(true);\n poolIndex = (poolIndex + 1) % pool.length;\n return tag;\n }\n\n // ── Visibilité par slot ──\n var visibleSlots = new Set();\n\n var slotObserver = new IntersectionObserver(function (entries) {\n entries.forEach(function (entry) {\n if (entry.isIntersecting) {\n visibleSlots.add(entry.target);\n } else {\n visibleSlots.delete(entry.target);\n }\n });\n }, { threshold: 0.1 });\n\n // ── Affichage initial ──\n slots.forEach(function (slot) {\n slot.innerHTML = \"\";\n slot.style.width = \"auto\";\n slot.style.height = \"auto\";\n slot.appendChild(nextTag());\n\n if (opacityOnly) {\n slot.style.opacity = \"0\";\n slot.style.transition = \"opacity \" + FADE + \"ms ease\";\n slot.style.opacity = \"1\";\n } else {\n slot.classList.add(\"visible\");\n }\n\n slotObserver.observe(slot);\n });\n\n // ── Cycle batch — uniquement sur les slots visibles ──\n function runBatch() {\n var visible = shuffle(Array.from(visibleSlots));\n if (visible.length === 0) return;\n\n var count = Math.floor(Math.random() * Math.min(3, visible.length)) + 1;\n var picked = visible.slice(0, count);\n\n picked.forEach(function (slot, i) {\n setTimeout(function () {\n if (opacityOnly) {\n slot.style.opacity = \"0\";\n setTimeout(function () {\n slot.innerHTML = \"\";\n slot.appendChild(nextTag());\n slot.style.opacity = \"1\";\n }, FADE);\n } else {\n slot.classList.remove(\"visible\");\n slot.classList.add(\"exit\");\n setTimeout(function () {\n slot.innerHTML = \"\";\n slot.appendChild(nextTag());\n slot.style.transition = \"none\";\n slot.classList.remove(\"exit\");\n slot.offsetHeight;\n slot.style.transition = \"\";\n slot.classList.add(\"visible\");\n }, FADE);\n }\n }, i * STAGGER);\n });\n }\n\n // ── Démarrage ──\n runBatch();\n setInterval(runBatch, INTERVAL);\n });\n}\n/* =========================\n ✅ AUTO ROTATE FAKE TABS ANIMATION\n ========================= */\n\nwindow.AutoRotateFakeTabs = AutoRotateFakeTabs;\nfunction AutoRotateFakeTabs() {\n // ---- FIND ELEMENTS ----\n var wrap = document.querySelector(\"[data-tabs-wrap]\");\n var triggers = wrap.querySelectorAll(\"[data-tabs-trigger]\");\n var panels = wrap.querySelectorAll(\"[data-tabs-panel]\");\n var bars = wrap.querySelectorAll(\"[data-tabs-progress-bar]\");\n var duration = Number(wrap.getAttribute(\"data-tabs-duration\")) || 5000;\n\n // ---- STATE ----\n var currentIndex = 0;\n var timer = null;\n\n // ---- SWITCH TO A TAB ----\n function switchToTab(index) {\n // 1. Remove \"is-active\" from all triggers and panels\n for (var i = 0; i < triggers.length; i++) {\n triggers[i].classList.remove(\"is-active\");\n panels[i].classList.remove(\"is-active\");\n }\n\n // 2. Add \"is-active\" to the chosen trigger and panel\n triggers[index].classList.add(\"is-active\");\n panels[index].classList.add(\"is-active\");\n\n // 3. Reset all progress bars to 0\n for (var i = 0; i < bars.length; i++) {\n bars[i].style.transition = \"none\";\n bars[i].style.width = \"0%\";\n }\n\n // 4. Animate the active progress bar to 100%\n void bars[index].offsetWidth; // force browser to apply the reset before animating\n bars[index].style.transition = \"width \" + duration + \"ms linear\";\n bars[index].style.width = \"100%\";\n\n // 5. Update state\n currentIndex = index;\n }\n\n // ---- GO TO NEXT TAB ----\n function goToNextTab() {\n var nextIndex = (currentIndex + 1) % triggers.length;\n switchToTab(nextIndex);\n }\n\n // ---- START / STOP AUTOPLAY ----\n function startAutoplay() {\n stopAutoplay();\n timer = setInterval(goToNextTab, duration);\n }\n\n function stopAutoplay() {\n clearInterval(timer);\n }\n\n // ---- CLICK ON A TAB ----\n for (var i = 0; i < triggers.length; i++) {\n (function (index) {\n triggers[index].addEventListener(\"click\", function () {\n switchToTab(index);\n startAutoplay(); // restart timer after manual click\n });\n })(i);\n }\n\n // ---- PAUSE ON HOVER ----\n //wrap.addEventListener(\"mouseenter\", stopAutoplay);\n //wrap.addEventListener(\"mouseleave\", startAutoplay);\n\n // ---- INIT ----\n switchToTab(0);\n startAutoplay();\n // Mark as ready — this activates the CSS that hides inactive panels\n // Without JS (e.g. in the Webflow Designer), all panels stay visible\n wrap.setAttribute(\"data-tabs-ready\", \"\");\n}\n\ndocument.addEventListener(\"DOMContentLoaded\", () => {\n AutoRotateFakeTabs();\n});\n\n/* =========================\n ✅ VIDEO MAGNETIC BTN\n ========================= */\n\n/* ---------- Magnetic Effect ---------- */\nfunction initMagneticEffect() {\n // On sélectionne maintenant la zone \"wrapper\" (.btn-magnetic) qui est plus grande\n const magnets = document.querySelectorAll(\".btn-magnetic\");\n if (window.innerWidth <= 991) return;\n\n // Fonction pour tuer les tweens et réinitialiser\n const resetEl = (el, immediate) => {\n if (!el) return;\n gsap.killTweensOf(el);\n (immediate ? gsap.set : gsap.to)(el, {\n x: \"0em\",\n y: \"0em\",\n rotate: \"0deg\",\n clearProps: \"all\",\n ...(!immediate && { ease: \"elastic.out(1, 0.3)\", duration: 1.6 }),\n });\n };\n\n const resetOnEnter = (e) => {\n const m = e.currentTarget;\n const target = m.querySelector(\".btn-magnetic__click\");\n if (!target) return;\n resetEl(target, true);\n resetEl(target.querySelector(\"[data-magnetic-inner-target]\"), true);\n };\n\n const moveMagnet = (e) => {\n const m = e.currentTarget; // Le wrapper invisible grand format\n const target = m.querySelector(\".btn-magnetic__click\"); // Le bouton visuel\n if (!target) return;\n\n const b = m.getBoundingClientRect(),\n strength = parseFloat(target.getAttribute(\"data-magnetic-strength\")) ||\n 25,\n inner = target.querySelector(\"[data-magnetic-inner-target]\"),\n innerStrength =\n parseFloat(target.getAttribute(\"data-magnetic-strength-inner\")) ||\n strength,\n // offsetX et Y calculent la position par rapport au wrapper (350x350)\n offsetX = ((e.clientX - b.left) / m.offsetWidth - 0.5) * (strength / 16),\n offsetY = ((e.clientY - b.top) / m.offsetHeight - 0.5) * (strength / 16);\n\n // On déplace le bouton \".btn-magnetic__click\" à l'intérieur du wrapper\n gsap.to(target, {\n x: offsetX + \"em\",\n y: offsetY + \"em\",\n rotate: \"0.001deg\",\n ease: \"power4.out\",\n duration: 1.6,\n });\n\n if (inner) {\n const innerOffsetX = ((e.clientX - b.left) / m.offsetWidth - 0.5) *\n (innerStrength / 16),\n innerOffsetY = ((e.clientY - b.top) / m.offsetHeight - 0.5) *\n (innerStrength / 16);\n gsap.to(inner, {\n x: innerOffsetX + \"em\",\n y: innerOffsetY + \"em\",\n rotate: \"0.001deg\",\n ease: \"power4.out\",\n duration: 2,\n });\n }\n };\n\n const resetMagnet = (e) => {\n const m = e.currentTarget;\n const target = m.querySelector(\".btn-magnetic__click\");\n if (!target) return;\n\n const inner = target.querySelector(\"[data-magnetic-inner-target]\");\n\n // Retour fluide au centre\n gsap.to(target, {\n x: \"0em\",\n y: \"0em\",\n ease: \"elastic.out(1, 0.3)\",\n duration: 1.6,\n clearProps: \"all\",\n });\n if (inner) {\n gsap.to(inner, {\n x: \"0em\",\n y: \"0em\",\n ease: \"elastic.out(1, 0.3)\",\n duration: 2,\n clearProps: \"all\",\n });\n }\n };\n\n magnets.forEach((m) => {\n m.addEventListener(\"mouseenter\", resetOnEnter);\n m.addEventListener(\"mousemove\", moveMagnet);\n m.addEventListener(\"mouseleave\", resetMagnet);\n });\n}\n\n/* ---------- Init Vimeo Lightbox ---------- */\nfunction initVimeoLightboxAdvanced() {\n // Single lightbox container\n const lightbox = document.querySelector(\"[data-vimeo-lightbox-init]\");\n if (!lightbox) return;\n\n // Open & close buttons\n const openButtons = document.querySelectorAll(\n '[data-vimeo-lightbox-control=\"open\"]',\n );\n const closeButtons = document.querySelectorAll(\n '[data-vimeo-lightbox-control=\"close\"]',\n );\n\n // Core elements inside lightbox\n let iframe = lightbox.querySelector(\"iframe\"); // ← now let\n const placeholder = lightbox.querySelector(\".vimeo-lightbox__placeholder\");\n const calcEl = lightbox.querySelector(\".vimeo-lightbox__calc\");\n const wrapEl = lightbox.querySelector(\".vimeo-lightbox__calc-wrap\");\n const playerContainer = lightbox.querySelector(\n \"[data-vimeo-lightbox-player]\",\n );\n\n // State\n let player = null;\n let currentVideoID = null;\n let videoAspectRatio = null;\n let globalMuted = lightbox.getAttribute(\"data-vimeo-muted\") === \"true\";\n const isTouch = (\"ontouchstart\" in window) || navigator.maxTouchPoints > 0;\n const playedOnce = new Set(); // track first play on touch\n\n // Format time (seconds → \"m:ss\")\n function formatTime(s) {\n const m = Math.floor(s / 60);\n const sec = Math.floor(s % 60).toString().padStart(2, \"0\");\n return `${m}:${sec}`;\n }\n\n // Clamp wrap height\n function clampWrapSize(ar) {\n const w = calcEl.offsetWidth;\n const h = calcEl.offsetHeight;\n wrapEl.style.maxWidth = Math.min(w, h / ar) + \"px\";\n }\n\n // Adjust sizing in \"cover\" mode\n function adjustCoverSizing() {\n if (!videoAspectRatio) return;\n const cH = playerContainer.offsetHeight;\n const cW = playerContainer.offsetWidth;\n const r = cH / cW;\n const wEl = lightbox.querySelector(\".vimeo-lightbox__iframe\");\n if (r > videoAspectRatio) {\n wEl.style.width = (r / videoAspectRatio * 100) + \"%\";\n wEl.style.height = \"100%\";\n } else {\n wEl.style.height = (videoAspectRatio / r * 100) + \"%\";\n wEl.style.width = \"100%\";\n }\n }\n\n // Close & pause lightbox\n function closeLightbox() {\n lightbox.setAttribute(\"data-vimeo-activated\", \"false\");\n document.body.style.overflow = \"\";\n if (player) {\n player.pause();\n lightbox.setAttribute(\"data-vimeo-playing\", \"false\");\n }\n }\n\n // Wire Escape key & close buttons\n document.addEventListener(\"keydown\", (e) => {\n if (e.key === \"Escape\") closeLightbox();\n });\n closeButtons.forEach((btn) => btn.addEventListener(\"click\", closeLightbox));\n\n // Close when clicking outside the video\n lightbox.addEventListener(\"click\", (e) => {\n // Ignorer si le clic est sur le composant vidéo en lui-même (data-vimeo-lightbox-player)\n if (e.target.closest(\"[data-vimeo-lightbox-player]\")) return;\n\n // Ignorer si le clic est sur un bouton de contrôle (play/pause/timeline...)\n if (e.target.closest(\"[data-vimeo-control]\")) return;\n\n // Ignorer si le clic est sur une autre action interne (*à l'exception* de l'arrière-plan/fermeture).\n // On vérifie que c'est un bouton \"open\" ou qu'on ne cible pas la classe background.\n if (\n e.target.closest('[data-vimeo-lightbox-control=\"open\"]') ||\n (e.target.closest(\"[data-vimeo-lightbox-control]\") &&\n !e.target.closest(\".vimeo-lightbox__bg\") &&\n !e.target.closest('[data-vimeo-lightbox-control=\"close\"]')) // Le bouton close ferme déjà seul, c'est optionnel\n ) {\n return;\n }\n\n // Sinon, on ferme.\n closeLightbox();\n });\n\n // Setup Vimeo Player event handlers\n function setupPlayerEvents() {\n // Hide placeholder when playback starts\n player.on(\"play\", () => {\n lightbox.setAttribute(\"data-vimeo-loaded\", \"true\");\n lightbox.setAttribute(\"data-vimeo-playing\", \"true\");\n });\n // Close on video end\n player.on(\"ended\", closeLightbox);\n\n // Paused\n player.on(\"pause\", () => {\n lightbox.setAttribute(\"data-vimeo-playing\", \"false\");\n });\n\n // Duration UI\n const durEl = lightbox.querySelector(\"[data-vimeo-duration]\");\n player.getDuration().then((d) => {\n if (durEl) durEl.textContent = formatTime(d);\n lightbox.querySelectorAll('[data-vimeo-control=\"timeline\"],progress')\n .forEach((el) => el.max = d);\n });\n\n // Timeline & progress updates\n const tl = lightbox.querySelector('[data-vimeo-control=\"timeline\"]');\n const pr = lightbox.querySelector(\"progress\");\n player.on(\"timeupdate\", (data) => {\n if (tl) tl.value = data.seconds;\n if (pr) pr.value = data.seconds;\n if (durEl) durEl.textContent = formatTime(Math.trunc(data.seconds));\n });\n if (tl) {\n [\"input\", \"change\"].forEach((evt) =>\n tl.addEventListener(evt, (e) => {\n const v = e.target.value;\n player.setCurrentTime(v);\n if (pr) pr.value = v;\n })\n );\n }\n\n // Hover → hide controls after a timeout\n let hoverTimer;\n playerContainer.addEventListener(\"mousemove\", () => {\n lightbox.setAttribute(\"data-vimeo-hover\", \"true\");\n clearTimeout(hoverTimer);\n hoverTimer = setTimeout(() => {\n lightbox.setAttribute(\"data-vimeo-hover\", \"false\");\n }, 3000);\n });\n\n // Fullscreen toggle on player container\n const fsBtn = lightbox.querySelector('[data-vimeo-control=\"fullscreen\"]');\n if (fsBtn) {\n const isFS = () =>\n document.fullscreenElement || document.webkitFullscreenElement;\n if (!(document.fullscreenEnabled || document.webkitFullscreenEnabled)) {\n fsBtn.style.display = \"none\";\n }\n fsBtn.addEventListener(\"click\", () => {\n if (isFS()) {\n lightbox.setAttribute(\"data-vimeo-fullscreen\", \"false\");\n (document.exitFullscreen || document.webkitExitFullscreen).call(\n document,\n );\n } else {\n lightbox.setAttribute(\"data-vimeo-fullscreen\", \"true\");\n (playerContainer.requestFullscreen ||\n playerContainer.webkitRequestFullscreen)\n .call(playerContainer);\n }\n });\n [\"fullscreenchange\", \"webkitfullscreenchange\"].forEach((evt) =>\n document.addEventListener(\n evt,\n () =>\n lightbox.setAttribute(\n \"data-vimeo-fullscreen\",\n isFS() ? \"true\" : \"false\",\n ),\n )\n );\n }\n }\n\n // Run sizing logic\n async function runSizing() {\n const mode = lightbox.getAttribute(\"data-vimeo-update-size\");\n const w = await player.getVideoWidth();\n const h = await player.getVideoHeight();\n const ar = h / w;\n const bef = lightbox.querySelector(\".vimeo-lightbox__before\");\n\n if (mode === \"true\") {\n if (bef) bef.style.paddingTop = (ar * 100) + \"%\";\n clampWrapSize(ar);\n } else if (mode === \"cover\") {\n videoAspectRatio = ar;\n if (bef) bef.style.paddingTop = \"0%\";\n adjustCoverSizing();\n } else {\n clampWrapSize(ar);\n }\n }\n\n // Re-run sizing on viewport resize\n window.addEventListener(\"resize\", () => {\n if (player) runSizing();\n });\n\n // Open or switch video\n async function openLightbox(id, placeholderBtn) {\n // Enter loading state immediately\n lightbox.setAttribute(\"data-vimeo-activated\", \"loading\");\n document.body.style.overflow = \"hidden\";\n lightbox.setAttribute(\"data-vimeo-loaded\", \"false\");\n\n // — FULL RESET if new video ID —\n if (player && id !== currentVideoID) {\n await player.pause();\n await player.unload();\n\n // Replace old iframe with a fresh one\n const oldIframe = iframe;\n const newIframe = document.createElement(\"iframe\");\n newIframe.className = oldIframe.className;\n newIframe.setAttribute(\"allow\", oldIframe.getAttribute(\"allow\"));\n newIframe.setAttribute(\"frameborder\", \"0\");\n newIframe.setAttribute(\"allowfullscreen\", \"true\");\n newIframe.setAttribute(\"allow\", \"autoplay; encrypted-media\");\n oldIframe.parentNode.replaceChild(newIframe, oldIframe);\n\n // Reset state\n iframe = newIframe;\n player = null;\n currentVideoID = null;\n lightbox.setAttribute(\"data-vimeo-playing\", \"false\");\n }\n\n // Update placeholder image attributes\n if (placeholderBtn) {\n [\"src\", \"srcset\", \"sizes\", \"alt\", \"width\"].forEach((attr) => {\n const val = placeholderBtn.getAttribute(attr);\n if (val != null) {\n placeholder.setAttribute(attr, val);\n } else {\n placeholder.removeAttribute(attr);\n }\n });\n }\n\n // Build a brand-new player if needed\n if (!player) {\n iframe.src =\n `https://player.vimeo.com/video/${id}?api=1&background=1&autoplay=0&loop=0&muted=0`;\n player = new Vimeo.Player(iframe);\n setupPlayerEvents();\n currentVideoID = id;\n await runSizing();\n }\n\n // Now sizing is ready — show lightbox\n lightbox.setAttribute(\"data-vimeo-activated\", \"true\");\n\n // Autoplay logic\n if (!isTouch) {\n player.setVolume(globalMuted ? 0 : 1).then(() => {\n lightbox.setAttribute(\"data-vimeo-playing\", \"true\");\n setTimeout(() => player.play(), 50);\n });\n } else {\n // Sur mobile (isTouch), on lance la vidéo au premier clic\n if (!playedOnce.has(currentVideoID)) {\n // Pour que le navigateur accepte l'autoplay sur mobile, on doit souvent forcer le mute au lancement\n player.setVolume(0).then(() => {\n lightbox.setAttribute(\"data-vimeo-playing\", \"true\");\n player.play();\n // On remet le son après un court instant si ce n'était pas muet globalement\n if (!globalMuted) {\n setTimeout(() => {\n player.setVolume(1);\n lightbox.setAttribute(\"data-vimeo-muted\", \"false\");\n }, 100);\n }\n playedOnce.add(currentVideoID);\n });\n } else {\n player.setVolume(globalMuted ? 0 : 1).then(() => {\n lightbox.setAttribute(\"data-vimeo-playing\", \"true\");\n player.play();\n });\n }\n }\n }\n\n // Internal controls\n lightbox.querySelector('[data-vimeo-control=\"play\"]').addEventListener(\n \"click\",\n () => {\n if (isTouch) {\n if (!playedOnce.has(currentVideoID)) {\n player.setVolume(0).then(() => {\n lightbox.setAttribute(\"data-vimeo-playing\", \"true\");\n player.play();\n if (!globalMuted) {\n setTimeout(() => {\n player.setVolume(1);\n lightbox.setAttribute(\"data-vimeo-muted\", \"false\");\n }, 100);\n }\n playedOnce.add(currentVideoID);\n });\n } else {\n player.setVolume(globalMuted ? 0 : 1).then(() => {\n lightbox.setAttribute(\"data-vimeo-playing\", \"true\");\n player.play();\n });\n }\n } else {\n player.setVolume(globalMuted ? 0 : 1).then(() => {\n lightbox.setAttribute(\"data-vimeo-playing\", \"true\");\n setTimeout(() => player.play(), 50);\n });\n }\n },\n );\n\n lightbox.querySelector('[data-vimeo-control=\"pause\"]').addEventListener(\n \"click\",\n () => {\n player.pause();\n },\n );\n\n lightbox.querySelector('[data-vimeo-control=\"mute\"]').addEventListener(\n \"click\",\n () => {\n globalMuted = !globalMuted;\n player.setVolume(globalMuted ? 0 : 1).then(() =>\n lightbox.setAttribute(\n \"data-vimeo-muted\",\n globalMuted ? \"true\" : \"false\",\n )\n );\n },\n );\n\n // Wire up open buttons\n openButtons.forEach((btn) => {\n btn.addEventListener(\"click\", () => {\n const vid = btn.getAttribute(\"data-vimeo-lightbox-id\");\n const img = btn.querySelector(\"[data-vimeo-lightbox-placeholder]\");\n console.log(\"--- Vimeo Lightbox Clicked ---\");\n console.log(\"Video ID found:\", vid);\n console.log(\"Thumbnail (img) found:\", img);\n openLightbox(vid, img);\n });\n });\n}\n\n/* ---------- Parallax Effect ---------- */\nfunction initParallaxLayers() {\n document.querySelectorAll(\"[data-parallax-layers]\").forEach(\n (triggerElement) => {\n let tl = gsap.timeline({\n scrollTrigger: {\n trigger: triggerElement,\n start: \"top bottom\",\n end: \"bottom top\",\n scrub: 1,\n },\n });\n const isMobile = window.innerWidth < 768;\n const layers = [\n { layer: \"1\", yPercentFrom: 0, yPercent: isMobile ? -12 : -20 },\n { layer: \"2\", yPercentFrom: 0, yPercent: isMobile ? -15 : -25 },\n ];\n layers.forEach((layerObj, idx) => {\n tl.fromTo(\n triggerElement.querySelectorAll(\n `[data-parallax-layer=\"${layerObj.layer}\"]`,\n ),\n {\n yPercent: layerObj\n .yPercentFrom,\n },\n { yPercent: layerObj.yPercent, ease: \"none\" },\n idx === 0 ? undefined : \"<\",\n );\n });\n },\n );\n}\n\n/* =========================\n ✅ MAP RENCONTRER CITY ROTATOR\n ========================= */\nwindow.initMapRotator = initMapRotator;\nfunction initMapRotator() {\n const DELAY_BETWEEN_CITIES = 200;\n const VISIBLE_DURATION = 500;\n const FADE_DURATION = 500;\n const MIN_GROUP_SIZE = 1;\n const MAX_GROUP_SIZE = 3;\n\n const cityRotator = document.querySelector(\"[data-city-rotator]\");\n if (!cityRotator) return;\n\n const cityElements = cityRotator.querySelectorAll(\"[data-city]\");\n if (cityElements.length === 0) return;\n\n function showCityElement(el) {\n el.style.opacity = \"1\";\n el.style.transform = \"translateY(0)\";\n }\n\n function hideCityElement(el) {\n el.style.opacity = \"0\";\n el.style.transform = \"translateY(10px)\";\n }\n\n function wait(ms) {\n return new Promise((resolve) => setTimeout(resolve, ms));\n }\n\n function shuffleArray(array) {\n const shuffled = [...array];\n for (let i = shuffled.length - 1; i > 0; i--) {\n const j = Math.floor(Math.random() * (i + 1));\n [shuffled[i], shuffled[j]] = [shuffled[j], shuffled[i]];\n }\n return shuffled;\n }\n\n function randomInt(min, max) {\n return Math.floor(Math.random() * (max - min + 1)) + min;\n }\n\n function getExclusions(el) {\n const raw = el.dataset.cityExclude;\n if (!raw) return [];\n return raw.split(\",\").map((s) => s.trim());\n }\n\n function isCompatible(el, group) {\n const elCity = el.dataset.city;\n const elExclusions = getExclusions(el);\n return group.every((groupEl) => {\n const groupCity = groupEl.dataset.city;\n const groupExclusions = getExclusions(groupEl);\n return !elExclusions.includes(groupCity) &&\n !groupExclusions.includes(elCity);\n });\n }\n\n async function startLoop() {\n while (true) {\n const shuffled = shuffleArray([...cityElements]);\n let i = 0;\n while (i < shuffled.length) {\n const groupSize = Math.min(\n randomInt(MIN_GROUP_SIZE, MAX_GROUP_SIZE),\n shuffled.length - i,\n );\n const group = [shuffled[i]];\n for (let j = i + 1; j < i + groupSize; j++) {\n if (isCompatible(shuffled[j], group)) {\n group.push(shuffled[j]);\n }\n }\n i += groupSize;\n group.forEach((el, index) => {\n setTimeout(() => showCityElement(el), index * DELAY_BETWEEN_CITIES);\n });\n await wait(FADE_DURATION + VISIBLE_DURATION);\n group.forEach((el, index) => {\n setTimeout(() => hideCityElement(el), index * DELAY_BETWEEN_CITIES);\n });\n await wait(DELAY_BETWEEN_CITIES);\n }\n }\n }\n\n startLoop();\n}\n\n/* =========================\n ✅ CSS HowTo Progress Tabs\n ========================= */\n\n(function () {\n const tabs = document.querySelectorAll(\"[auto-tab]\");\n const images = document.querySelectorAll(\"[auto-tab-image]\");\n const media = document.querySelector(\"[auto-tabs-media]\");\n\n // On lance le script uniquement si des tabs existent sur la page\n if (!tabs.length) return;\n\n const DURATION = 6000; // Durée par tab en ms\n\n let currentIndex = 0;\n let startTime = null;\n let animFrame = null;\n\n /* ----------------------------------------------------------\n Injection des styles CSS au runtime\n → Invisible en édition Webflow, actif uniquement en live\n ---------------------------------------------------------- */\n\n function injectStyles() {\n const style = document.createElement(\"style\");\n style.textContent = `\n [auto-tab] { opacity: 0.4; transition: opacity 0.4s ease; cursor: pointer; }\n [auto-tab][active] { opacity: 1; }\n [auto-tab-body] { opacity: 0; transition: opacity 0.4s ease; }\n [auto-tab-progress] { height: 2px !important; overflow: hidden; background: rgba(0, 9, 74, 0.1); }\n [auto-tab-bar] { height: 2px !important; display: block; background: #FF4920; }\n [auto-tabs-media] { position: relative; }\n [auto-tab-image] { position: absolute; inset: 0; opacity: 0; transition: opacity 0.4s ease; pointer-events: none; }\n [auto-tab-image][active]{ opacity: 1; pointer-events: auto; }\n `;\n document.head.appendChild(style);\n }\n\n /* ----------------------------------------------------------\n Calcul de la hauteur du wrapper d'images\n → Les images sont en position absolute, donc le wrapper\n perd sa hauteur naturelle — on la force en JS\n ---------------------------------------------------------- */\n\n function setMediaHeight() {\n if (!media || !images.length) return;\n\n // Affichage temporaire de toutes les images pour pouvoir les mesurer\n images.forEach(function (img) {\n img.style.display = \"block\";\n });\n const height = images[0].offsetHeight;\n images.forEach(function (img) {\n img.style.display = \"\";\n });\n\n if (height > 0) media.style.height = height + \"px\";\n }\n\n /* ----------------------------------------------------------\n Activation d'une tab\n → Reset de tout, puis activation de la tab ciblée\n ---------------------------------------------------------- */\n\n function setActive(index) {\n // Reset de toutes les tabs\n tabs.forEach(function (tab) {\n tab.removeAttribute(\"active\");\n\n const bar = tab.querySelector(\"[auto-tab-bar]\");\n const body = tab.querySelector(\"[auto-tab-body]\");\n const number = tab.querySelector(\"[auto-tab-number]\");\n\n if (bar) bar.style.width = \"0%\";\n if (body) {\n body.style.display = \"none\";\n body.style.opacity = \"0\";\n }\n if (number) number.style.color = \"\";\n });\n\n // Reset de toutes les images\n images.forEach(function (img) {\n img.removeAttribute(\"active\");\n });\n\n // Activation de la tab et de l'image ciblées\n const activeTab = document.querySelector(\n '[auto-tab][tab-index=\"' + index + '\"]',\n );\n const activeImg = document.querySelector(\n '[auto-tab-image][tab-index=\"' + index + '\"]',\n );\n\n if (activeTab) {\n activeTab.setAttribute(\"active\", \"\");\n\n const body = activeTab.querySelector(\"[auto-tab-body]\");\n const number = activeTab.querySelector(\"[auto-tab-number]\");\n\n if (number) number.style.color = \"#FF4920\";\n if (body) {\n body.style.display = \"block\";\n // rAF nécessaire pour que la transition CSS se déclenche après le display:block\n requestAnimationFrame(function () {\n body.style.opacity = \"1\";\n });\n }\n }\n\n if (activeImg) activeImg.setAttribute(\"active\", \"\");\n\n // Réinitialisation de l'animation\n currentIndex = index;\n startTime = null;\n cancelAnimationFrame(animFrame);\n animFrame = requestAnimationFrame(animate);\n }\n\n /* ----------------------------------------------------------\n Animation de la barre de progression\n → Appelée ~60x/s par le navigateur via requestAnimationFrame\n ---------------------------------------------------------- */\n\n function animate(timestamp) {\n if (!startTime) startTime = timestamp;\n\n const elapsed = timestamp - startTime;\n const percentage = Math.min((elapsed / DURATION) * 100, 100);\n\n const activeTab = document.querySelector(\n '[auto-tab][tab-index=\"' + currentIndex + '\"]',\n );\n if (activeTab) {\n const bar = activeTab.querySelector(\"[auto-tab-bar]\");\n if (bar) bar.style.width = percentage + \"%\";\n }\n\n if (percentage < 100) {\n animFrame = requestAnimationFrame(animate);\n } else {\n // % toutesLesTabs.length permet de revenir à 0 après la dernière tab\n setActive((currentIndex + 1) % tabs.length);\n }\n }\n\n /* ----------------------------------------------------------\n Clic manuel sur une tab\n ---------------------------------------------------------- */\n\n tabs.forEach(function (tab) {\n tab.addEventListener(\"click\", function () {\n cancelAnimationFrame(animFrame);\n setActive(parseInt(tab.getAttribute(\"tab-index\")));\n });\n });\n\n /* ----------------------------------------------------------\n Init\n ---------------------------------------------------------- */\n\n injectStyles();\n setMediaHeight();\n window.addEventListener(\"resize\", setMediaHeight);\n setActive(0);\n})();\n\n/* ----------------------------------------------------------\n Init Page Scripts\n ---------------------------------------------------------- */\n\nfunction initPageScripts() {\n document.querySelector(\"[data-magnetic-wrapper]\") && initMagneticEffect();\n document.querySelector(\"[data-vimeo-lightbox-id]\") &&\n initVimeoLightboxAdvanced();\n document.querySelector(\"[data-parallax-layers]\") && initParallaxLayers();\n document.querySelector(\"[data-city-rotator]\") && initMapRotator();\n document.querySelector(\"[data-tag-rotator]\") && initTagsAnimateOnMap();\n}\ninitPageScripts();",[141],"e1f40f4c-29e3-11f1-ac38-42dde27851f2","backup2703.ts","dcf9c4be-29e3-11f1-ac38-42dde27851f2",492,["D",1774619415020],2,[149],"daf15902-29e3-11f1-b2b4-42dde27851f2","backup-1803.js","3b7dd95a-1961-11f1-bfcb-42dde27851f2",489,["D",1774619403257],17,"/* =========================\n 📆 UPDATE 18-03-2026_13:42\n ========================= */\n\n/* =========================\n ✅ GESTION TYPEFORM (laisser en haut)\n ========================= */\n\n(function () {\n /* =========================\n CONFIG\n ========================= */\n\n const CONFIG = {\n triggerSelector: '[OpenTf=\"trigger\"]',\n iframeSelector: \".tf-v1-iframe-wrapper iframe\",\n iframeDelayMs: 400, // délai pour laisser Typeform injecter l’iframe\n };\n\n /* =========================\n HELPERS\n ========================= */\n\n function getEmailFromElement(element) {\n const mailInput =\n element.querySelector('input[type=\"email\"]')?.value?.replace(\n /\\+/g,\n \"%2B\",\n ) || \"\";\n if (mailInput) console.log(mailInput);\n return mailInput;\n }\n\n function updateIframeParams(params) {\n const iframe = document.querySelector(CONFIG.iframeSelector);\n if (!iframe) return;\n\n let currentSrc = iframe.getAttribute(\"src\");\n let newSrc = currentSrc;\n\n if (params.email) {\n const sep = currentSrc.includes(\"?\") ? \"&\" : \"?\";\n newSrc = `${currentSrc}${sep}email=${params.email}`;\n }\n\n iframe.setAttribute(\"src\", newSrc);\n console.log(\"Updated iframe src:\", iframe.src);\n }\n\n function openTf({ email = \"\" } = {}) {\n const trigger = document.querySelector(CONFIG.triggerSelector);\n if (!trigger) {\n console.warn(\"Typeform trigger not found\");\n return;\n }\n\n // 1 — ouvrir popup\n trigger.click();\n\n // 2 — injecter email après création iframe\n if (email) {\n setTimeout(() => {\n updateIframeParams({ email });\n }, CONFIG.iframeDelayMs);\n }\n }\n\n /* =========================\n LISTENERS\n ========================= */\n\n // submit formulaire → récupère email\n document.querySelectorAll('[OpenTf=\"form\"]').forEach((form) => {\n form.addEventListener(\"submit\", function (event) {\n event.preventDefault();\n const email = getEmailFromElement(form);\n openTf({ email });\n });\n });\n\n // clic simple → ouvre juste\n document.querySelectorAll('[OpenTf=\"btn\"]').forEach((el) => {\n el.addEventListener(\"click\", function (event) {\n event.preventDefault();\n openTf();\n });\n });\n})();\n\n/* =========================\n ✅ NAVBAR\n ========================= */\n\n// Animation BG navbar\n// Vérifie si la largeur de la fenêtre est inférieure à 769px (tablette et mobile)\nif (window.innerWidth < 769) {\n document.addEventListener(\"DOMContentLoaded\", function () {\n const menuButton = document.querySelector(\"#menuButton\");\n const navbarMenus = document.querySelectorAll(\".navbar5_menu\");\n const mainWrapper = document.querySelector(\".main-wrapper\");\n const backgroundNavbar = document.querySelector(\".background-navbar\");\n\n function updateBackgroundNavbarStyles() {\n // Vérifie si au moins un .navbar5_menu est en display flex\n const atLeastOneMenuOpen = Array.from(navbarMenus).some((menu) => {\n return window.getComputedStyle(menu).display === \"flex\";\n });\n\n if (atLeastOneMenuOpen) {\n // Quand au moins un menu est ouvert\n backgroundNavbar.style.position = \"absolute\";\n backgroundNavbar.style.top = \"0\";\n backgroundNavbar.style.left = \"0\";\n backgroundNavbar.style.width = \"100vw\";\n backgroundNavbar.style.height = \"100vh\";\n backgroundNavbar.style.transform = \"translateY(0)\";\n backgroundNavbar.style.display = \"block\";\n\n // Appliquer le filtre blur de 4px\n mainWrapper.style.filter = \"blur(4px)\";\n mainWrapper.style.transition =\n \"filter 0.5s cubic-bezier(.165, .84, .44, 1)\";\n\n // Bloquer le scroll\n document.body.style.overflow = \"hidden\";\n } else {\n // Quand tous les menus sont fermés\n backgroundNavbar.style.display = \"none\";\n backgroundNavbar.style.transform = \"translateY(-100%)\";\n\n // Remettre le filtre blur à 0px\n mainWrapper.style.filter = \"blur(0px)\";\n\n // Force tous les .navbar5_menu en display none\n navbarMenus.forEach((menu) => {\n menu.style.display = \"none\";\n });\n\n // Réactiver le scroll\n document.body.style.overflow = \"\";\n }\n }\n\n // Appel initial de la fonction pour mettre à jour les styles\n updateBackgroundNavbarStyles();\n\n // Écouteur d'événement au clic sur #menuButton\n if (menuButton) {\n menuButton.addEventListener(\"click\", () => {\n // Petit délai pour laisser le temps au menu de s'ouvrir/fermer\n setTimeout(updateBackgroundNavbarStyles, 50);\n });\n }\n\n // Observer les changements de style sur chaque .navbar5_menu\n navbarMenus.forEach((menu) => {\n const observer = new MutationObserver(updateBackgroundNavbarStyles);\n observer.observe(menu, {\n attributes: true,\n attributeFilter: [\"style\", \"class\"],\n });\n });\n });\n}\n\n/* =========================\n ✅ GSAP ANIM GLOBAL\n ========================= */\n\ngsap.registerPlugin(ScrollTrigger);\n\nfunction animateElements() {\n ScrollTrigger.getAll().forEach((trigger) => trigger.kill());\n\n // Masquer tous les finals dès le départ\n document.querySelectorAll('[display=\"final\"]').forEach((final) => {\n gsap.set(final, { display: \"none\", opacity: 0 });\n });\n\n gsap.utils.toArray('[data-animate=\"fade-up\"]').forEach((element) => {\n const delay = parseFloat(element.dataset.delay) || 0;\n const startY = element.dataset.startY;\n const startX = element.dataset.startX;\n const endY = element.dataset.endY;\n const endX = element.dataset.endX;\n const startRotate = element.dataset.startRotate || 0;\n const endRotate = element.dataset.endRotate || 0;\n\n const skeletons = element.querySelectorAll('[display=\"skeleton\"]');\n const finals = element.querySelectorAll('[display=\"final\"]');\n\n gsap.fromTo(element, {\n opacity: 0,\n y: startY,\n x: startX,\n rotate: startRotate,\n }, {\n opacity: 1,\n y: endY,\n x: endX,\n rotate: endRotate,\n duration: 1,\n delay: delay,\n ease: \"power3.out\",\n scrollTrigger: {\n trigger: element,\n start: \"top 95%\",\n toggleActions: \"play none none none\",\n once: true,\n onEnter: () => {\n if (!skeletons.length || !finals.length) return;\n\n const skeletonDuration = 500;\n\n setTimeout(() => {\n skeletons.forEach((skeleton, i) => {\n const final = finals[i];\n if (!final) return;\n\n const tl = gsap.timeline();\n\n tl.to(skeleton, {\n opacity: 0,\n duration: 0.3,\n ease: \"power2.in\",\n onComplete: () => gsap.set(skeleton, { display: \"none\" }),\n });\n\n tl.set(final, { display: \"block\" });\n\n tl.to(final, {\n opacity: 1,\n duration: 0.4,\n ease: \"power2.out\",\n });\n });\n }, (delay * 1) + skeletonDuration);\n },\n },\n });\n });\n}\n\n// ============================================\n// INIT\n// ============================================\n\nanimateElements();\n\ndocument.querySelectorAll('[gsap-trigger=\"click\"]').forEach((trigger) => {\n trigger.addEventListener(\"click\", function () {\n setTimeout(() => {\n animateElements();\n }, 300);\n });\n});\n\n/* =========================\n ✅ BENTO TO TABS TABLET/MOBILE\n ========================= */\n\nconst mediaQuery = window.matchMedia(\"(max-width: 991px)\");\n\nfunction initCardBlurTabs() {\n if (!mediaQuery.matches) {\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) => {\n list.style.height = \"\";\n list.style.overflow = \"\";\n list.style.display = \"\";\n });\n return;\n }\n\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) => {\n const isFirst = list.getAttribute(\"card-blur-tabs-load\") === \"first\";\n\n if (isFirst) {\n list.style.setProperty(\"height\", \"auto\", \"important\");\n list.style.setProperty(\"overflow\", \"visible\", \"important\");\n list.style.setProperty(\"display\", \"flex\", \"important\");\n } else {\n list.style.setProperty(\"height\", \"0px\", \"important\");\n list.style.setProperty(\"overflow\", \"hidden\", \"important\");\n list.style.setProperty(\"display\", \"none\", \"important\");\n }\n });\n\n setTimeout(updateDropdownStyles, 100);\n}\n\nfunction updateDropdownStyles() {\n if (!mediaQuery.matches) {\n document.querySelectorAll('[card-blur-tabs=\"dropdown\"]').forEach(\n (dropdown) => {\n const dropdownChild = dropdown.children[0];\n if (dropdownChild) dropdownChild.style.transform = \"\";\n dropdown.style.color = \"\";\n dropdown.style.backgroundImage = \"\";\n },\n );\n\n document.querySelectorAll('[card-blur-tabs=\"dropdown-dark\"]').forEach(\n (dropdown) => {\n const dropdownChild = dropdown.children[0];\n if (dropdownChild) dropdownChild.style.transform = \"\";\n dropdown.style.backgroundColor = \"\";\n dropdown.style.color = \"\";\n dropdown.style.border = \"\";\n },\n );\n return;\n }\n\n document.querySelectorAll('[card-blur-tabs=\"toggle\"]').forEach((toggle) => {\n const dropdown = toggle.querySelector('[card-blur-tabs=\"dropdown\"]');\n const dropdownDark = toggle.querySelector(\n '[card-blur-tabs=\"dropdown-dark\"]',\n );\n\n const siblingLists = Array.from(\n toggle.parentElement.querySelectorAll('[card-blur-tabs=\"list\"]'),\n );\n\n const isAnyListOpen = siblingLists.some((list) => {\n const style = window.getComputedStyle(list);\n return style.height !== \"0px\" && style.display !== \"none\";\n });\n\n // Gestion dropdown-close couleur\n toggle.querySelectorAll(\"[dropdown-close]\").forEach((el) => {\n const closeColor = el.getAttribute(\"dropdown-close\");\n if (!closeColor) return;\n el.style.setProperty(\"transition\", \"color 0.3s ease\", \"important\");\n if (isAnyListOpen) {\n el.style.setProperty(\"color\", \"white\", \"important\");\n } else {\n el.style.setProperty(\"color\", closeColor, \"important\");\n }\n });\n\n // Gestion dropdown normal\n if (dropdown) {\n const dropdownChild = dropdown.children[0];\n if (isAnyListOpen) {\n if (dropdownChild) {\n dropdownChild.style.setProperty(\n \"transition\",\n \"transform 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdownChild.style.setProperty(\n \"transform\",\n \"rotate(0deg)\",\n \"important\",\n );\n });\n }\n dropdown.style.setProperty(\n \"transition\",\n \"color 0.3s ease, background-image 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdown.style.setProperty(\"color\", \"white\", \"important\");\n dropdown.style.setProperty(\"background-image\", \"none\", \"important\");\n });\n } else {\n if (dropdownChild) {\n dropdownChild.style.setProperty(\n \"transition\",\n \"transform 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdownChild.style.setProperty(\n \"transform\",\n \"rotate(180deg)\",\n \"important\",\n );\n });\n }\n dropdown.style.setProperty(\n \"transition\",\n \"color 0.3s ease, background-image 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdown.style.setProperty(\"color\", \"\", \"important\");\n dropdown.style.setProperty(\"background-image\", \"\", \"important\");\n });\n }\n }\n\n // Gestion dropdown-dark\n if (dropdownDark) {\n const dropdownDarkChild = dropdownDark.children[0];\n if (isAnyListOpen) {\n if (dropdownDarkChild) {\n dropdownDarkChild.style.setProperty(\n \"transition\",\n \"transform 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdownDarkChild.style.setProperty(\n \"transform\",\n \"rotate(0deg)\",\n \"important\",\n );\n });\n }\n dropdownDark.style.setProperty(\n \"transition\",\n \"background-color 0.3s ease, color 0.3s ease, border 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdownDark.style.setProperty(\n \"background-color\",\n \"#00094A\",\n \"important\",\n );\n dropdownDark.style.setProperty(\"color\", \"white\", \"important\");\n dropdownDark.style.setProperty(\"border\", \"none\", \"important\");\n });\n } else {\n if (dropdownDarkChild) {\n dropdownDarkChild.style.setProperty(\n \"transition\",\n \"transform 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdownDarkChild.style.setProperty(\n \"transform\",\n \"rotate(180deg)\",\n \"important\",\n );\n });\n }\n dropdownDark.style.setProperty(\n \"transition\",\n \"background-color 0.3s ease, color 0.3s ease, border 0.3s ease\",\n \"important\",\n );\n requestAnimationFrame(() => {\n dropdownDark.style.setProperty(\"background-color\", \"\", \"important\");\n dropdownDark.style.setProperty(\"color\", \"\", \"important\");\n dropdownDark.style.setProperty(\"border\", \"\", \"important\");\n });\n }\n }\n });\n}\n\nfunction handleCardBlurTabsClick() {\n document.querySelectorAll('[card-blur-tabs=\"toggle\"]').forEach((button) => {\n button.addEventListener(\"click\", () => {\n if (!mediaQuery.matches) return;\n\n const siblingLists = Array.from(\n button.parentElement.querySelectorAll('[card-blur-tabs=\"list\"]'),\n );\n\n const isOpen = siblingLists.some((list) => {\n const style = window.getComputedStyle(list);\n return style.height !== \"0px\" && style.display !== \"none\";\n });\n\n // Changer les couleurs dropdown-close immédiatement au clic\n button.querySelectorAll(\"[dropdown-close]\").forEach((el) => {\n const closeColor = el.getAttribute(\"dropdown-close\");\n if (!closeColor) return;\n el.style.setProperty(\"transition\", \"color 0.3s ease\", \"important\");\n if (isOpen) {\n // On ferme → retour à closeColor\n el.style.setProperty(\"color\", closeColor, \"important\");\n } else {\n // On ouvre → blanc\n el.style.setProperty(\"color\", \"white\", \"important\");\n }\n });\n\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) => {\n list.style.setProperty(\"height\", \"0px\", \"important\");\n list.style.setProperty(\"overflow\", \"hidden\", \"important\");\n list.style.setProperty(\"display\", \"none\", \"important\");\n });\n\n if (!isOpen) {\n siblingLists.forEach((list) => {\n list.style.setProperty(\"height\", \"auto\", \"important\");\n list.style.setProperty(\"overflow\", \"visible\", \"important\");\n list.style.setProperty(\"display\", \"flex\", \"important\");\n });\n }\n\n setTimeout(updateDropdownStyles, 100);\n });\n });\n}\n\nmediaQuery.addEventListener(\"change\", () => {\n initCardBlurTabs();\n updateDropdownStyles();\n});\n\nif (document.readyState === \"loading\") {\n document.addEventListener(\"DOMContentLoaded\", () => {\n initCardBlurTabs();\n handleCardBlurTabsClick();\n });\n} else {\n initCardBlurTabs();\n handleCardBlurTabsClick();\n}\n\n/* =========================\n ✅ IM MARQUEE INVESTIR : GESTION HIGHLIGHT\n ========================= */\nfunction startRandomHighlight() {\n const viewport = document.querySelector(\"[data-marquee-viewport]\");\n\n if (!viewport) {\n return;\n }\n\n let currentHighlightedItem = null;\n let currentLineIndex = 0;\n let rotationInterval = null;\n\n function getLines() {\n const lines = viewport.querySelectorAll(\"[data-line]\");\n return Array.from(lines);\n }\n\n function getVisibleItemsInLine(line) {\n const viewportRect = viewport.getBoundingClientRect();\n const items = line.querySelectorAll(\"[data-highlight-target]\");\n const visibleItems = [];\n\n const margin = 50;\n const visibleLeft = viewportRect.left + margin;\n const visibleRight = viewportRect.right - margin;\n\n items.forEach((item) => {\n const itemRect = item.getBoundingClientRect();\n const itemCenter = itemRect.left + itemRect.width / 2;\n const isVisible = itemCenter > visibleLeft && itemCenter < visibleRight;\n\n if (isVisible) {\n visibleItems.push({\n element: item,\n center: itemCenter,\n text: item.textContent.trim(),\n });\n }\n });\n\n return visibleItems;\n }\n\n function isItemStillVisible(item) {\n if (!item) return false;\n\n const viewportRect = viewport.getBoundingClientRect();\n const itemRect = item.element.getBoundingClientRect();\n const itemCenter = itemRect.left + itemRect.width / 2;\n\n const margin = 50;\n const visibleLeft = viewportRect.left + margin;\n const visibleRight = viewportRect.right - margin;\n\n return itemCenter > visibleLeft && itemCenter < visibleRight;\n }\n\n function removeHighlight() {\n if (currentHighlightedItem) {\n currentHighlightedItem.element.classList.remove(\"is-highlighted\");\n\n // Retirer la classe couleur du label\n const labelElement = currentHighlightedItem.element.querySelector(\n \".label-industrie\",\n );\n if (labelElement) {\n labelElement.classList.remove(\"text-color-custom\");\n }\n\n // Remettre l'opacité à 0 pour .gradient-industrie\n const gradientElement = currentHighlightedItem.element.querySelector(\n \".gradient-industrie\",\n );\n if (gradientElement) {\n gradientElement.style.opacity = \"0\";\n }\n\n currentHighlightedItem = null;\n }\n }\n\n function applyRandomHighlightOnCurrentLine() {\n const lines = getLines();\n const currentLine = lines[currentLineIndex];\n\n if (!currentLine) return false;\n\n const visibleItems = getVisibleItemsInLine(currentLine);\n\n if (visibleItems.length === 0) {\n return false;\n }\n\n const randomIndex = Math.floor(Math.random() * visibleItems.length);\n const selectedItem = visibleItems[randomIndex];\n\n currentHighlightedItem = selectedItem;\n selectedItem.element.classList.add(\"is-highlighted\");\n\n // Ajouter la classe couleur au label\n const labelElement = selectedItem.element.querySelector(\".label-industrie\");\n if (labelElement) {\n labelElement.classList.add(\"text-color-custom\");\n }\n\n // Mettre l'opacité à 1 pour .gradient-industrie\n const gradientElement = selectedItem.element.querySelector(\n \".gradient-industrie\",\n );\n if (gradientElement) {\n gradientElement.style.opacity = \"1\";\n }\n\n return true;\n }\n\n function findNextLineWithVisibleItems() {\n const lines = getLines();\n let attempts = 0;\n const maxAttempts = lines.length;\n\n while (attempts < maxAttempts) {\n currentLineIndex = (currentLineIndex + 1) % lines.length;\n attempts++;\n\n if (applyRandomHighlightOnCurrentLine()) {\n return true;\n }\n }\n\n return false;\n }\n\n function applyRandomHighlightOnNextLine() {\n removeHighlight();\n\n if (findNextLineWithVisibleItems()) {\n resetRotationInterval();\n }\n }\n\n function checkVisibility() {\n if (currentHighlightedItem && !isItemStillVisible(currentHighlightedItem)) {\n removeHighlight();\n\n if (!applyRandomHighlightOnCurrentLine()) {\n findNextLineWithVisibleItems();\n }\n\n resetRotationInterval();\n }\n }\n\n function resetRotationInterval() {\n if (rotationInterval) {\n clearInterval(rotationInterval);\n }\n\n rotationInterval = setInterval(() => {\n applyRandomHighlightOnNextLine();\n }, 4000);\n }\n\n setInterval(checkVisibility, 100);\n\n setTimeout(() => {\n if (!applyRandomHighlightOnCurrentLine()) {\n findNextLineWithVisibleItems();\n }\n\n resetRotationInterval();\n }, 100);\n}\n\ndocument.addEventListener(\"DOMContentLoaded\", () => {\n setTimeout(() => {\n startRandomHighlight();\n }, 500);\n});\n\n/* =========================\n 🚧 Auto animate Startup Tags on map\n ========================= */\nwindow.initTagsAnimateOnMap = initTagsAnimateOnMap;\nfunction initTagsAnimateOnMap() {\n // ── CONFIG ──\n var INTERVAL = 2000;\n var FADE = 400;\n var STAGGER = 300;\n\n // ── RUN FOR EACH INSTANCE ──\n document.querySelectorAll(\"[data-tag-rotator]\").forEach(function (container) {\n var pool = Array.from(container.querySelectorAll(\"[data-tag]\"));\n var allSlots = container.querySelectorAll(\"[data-tag-slot]\");\n var slots = Array.from(allSlots).filter(function (slot) {\n return getComputedStyle(slot).display !== \"none\";\n });\n var poolIndex = 0;\n var slotIndex = 0;\n\n function nextTag() {\n var tag = pool[poolIndex].cloneNode(true);\n poolIndex = poolIndex + 1;\n if (poolIndex >= pool.length) {\n poolIndex = 0;\n }\n return tag;\n }\n\n slots.forEach(function (slot, i) {\n slot.innerHTML = \"\";\n slot.style.width = \"auto\";\n slot.style.height = \"auto\";\n slot.appendChild(nextTag());\n setTimeout(function () {\n slot.classList.add(\"visible\");\n }, i * STAGGER);\n });\n\n function fadeOut() {\n var slot = slots[slotIndex];\n slot.classList.remove(\"visible\");\n slot.classList.add(\"exit\");\n setTimeout(swapAndFadeIn, FADE);\n }\n\n function swapAndFadeIn() {\n var slot = slots[slotIndex];\n slot.innerHTML = \"\";\n slot.appendChild(nextTag());\n slot.style.transition = \"none\";\n slot.classList.remove(\"exit\");\n slot.offsetHeight;\n slot.style.transition = \"\";\n slot.classList.add(\"visible\");\n slotIndex = slotIndex + 1;\n if (slotIndex >= slots.length) {\n slotIndex = 0;\n }\n }\n\n setTimeout(function () {\n setInterval(fadeOut, INTERVAL);\n }, slots.length * STAGGER);\n });\n}\n\n/* =========================\n ✅ AUTO ROTATE FAKE TABS ANIMATION\n ========================= */\n\nwindow.AutoRotateFakeTabs = AutoRotateFakeTabs;\nfunction AutoRotateFakeTabs() {\n // ---- FIND ELEMENTS ----\n var wrap = document.querySelector(\"[data-tabs-wrap]\");\n var triggers = wrap.querySelectorAll(\"[data-tabs-trigger]\");\n var panels = wrap.querySelectorAll(\"[data-tabs-panel]\");\n var bars = wrap.querySelectorAll(\"[data-tabs-progress-bar]\");\n var duration = Number(wrap.getAttribute(\"data-tabs-duration\")) || 5000;\n\n // ---- STATE ----\n var currentIndex = 0;\n var timer = null;\n\n // ---- SWITCH TO A TAB ----\n function switchToTab(index) {\n // 1. Remove \"is-active\" from all triggers and panels\n for (var i = 0; i < triggers.length; i++) {\n triggers[i].classList.remove(\"is-active\");\n panels[i].classList.remove(\"is-active\");\n }\n\n // 2. Add \"is-active\" to the chosen trigger and panel\n triggers[index].classList.add(\"is-active\");\n panels[index].classList.add(\"is-active\");\n\n // 3. Reset all progress bars to 0\n for (var i = 0; i < bars.length; i++) {\n bars[i].style.transition = \"none\";\n bars[i].style.width = \"0%\";\n }\n\n // 4. Animate the active progress bar to 100%\n void bars[index].offsetWidth; // force browser to apply the reset before animating\n bars[index].style.transition = \"width \" + duration + \"ms linear\";\n bars[index].style.width = \"100%\";\n\n // 5. Update state\n currentIndex = index;\n }\n\n // ---- GO TO NEXT TAB ----\n function goToNextTab() {\n var nextIndex = (currentIndex + 1) % triggers.length;\n switchToTab(nextIndex);\n }\n\n // ---- START / STOP AUTOPLAY ----\n function startAutoplay() {\n stopAutoplay();\n timer = setInterval(goToNextTab, duration);\n }\n\n function stopAutoplay() {\n clearInterval(timer);\n }\n\n // ---- CLICK ON A TAB ----\n for (var i = 0; i < triggers.length; i++) {\n (function (index) {\n triggers[index].addEventListener(\"click\", function () {\n switchToTab(index);\n startAutoplay(); // restart timer after manual click\n });\n })(i);\n }\n\n // ---- PAUSE ON HOVER ----\n //wrap.addEventListener(\"mouseenter\", stopAutoplay);\n //wrap.addEventListener(\"mouseleave\", startAutoplay);\n\n // ---- INIT ----\n switchToTab(0);\n startAutoplay();\n // Mark as ready — this activates the CSS that hides inactive panels\n // Without JS (e.g. in the Webflow Designer), all panels stay visible\n wrap.setAttribute(\"data-tabs-ready\", \"\");\n}\n\ndocument.addEventListener(\"DOMContentLoaded\", () => {\n AutoRotateFakeTabs();\n});\n\n/* =========================\n ✅ VIDEO MAGNETIC BTN\n ========================= */\n\n/* ---------- Magnetic Effect ---------- */\nfunction initMagneticEffect() {\n // On sélectionne maintenant la zone \"wrapper\" (.btn-magnetic) qui est plus grande\n const magnets = document.querySelectorAll(\".btn-magnetic\");\n if (window.innerWidth <= 991) return;\n\n // Fonction pour tuer les tweens et réinitialiser\n const resetEl = (el, immediate) => {\n if (!el) return;\n gsap.killTweensOf(el);\n (immediate ? gsap.set : gsap.to)(el, {\n x: \"0em\",\n y: \"0em\",\n rotate: \"0deg\",\n clearProps: \"all\",\n ...(!immediate && { ease: \"elastic.out(1, 0.3)\", duration: 1.6 }),\n });\n };\n\n const resetOnEnter = (e) => {\n const m = e.currentTarget;\n const target = m.querySelector(\".btn-magnetic__click\");\n if (!target) return;\n resetEl(target, true);\n resetEl(target.querySelector(\"[data-magnetic-inner-target]\"), true);\n };\n\n const moveMagnet = (e) => {\n const m = e.currentTarget; // Le wrapper invisible grand format\n const target = m.querySelector(\".btn-magnetic__click\"); // Le bouton visuel\n if (!target) return;\n\n const b = m.getBoundingClientRect(),\n strength = parseFloat(target.getAttribute(\"data-magnetic-strength\")) ||\n 25,\n inner = target.querySelector(\"[data-magnetic-inner-target]\"),\n innerStrength =\n parseFloat(target.getAttribute(\"data-magnetic-strength-inner\")) ||\n strength,\n // offsetX et Y calculent la position par rapport au wrapper (350x350)\n offsetX = ((e.clientX - b.left) / m.offsetWidth - 0.5) * (strength / 16),\n offsetY = ((e.clientY - b.top) / m.offsetHeight - 0.5) * (strength / 16);\n\n // On déplace le bouton \".btn-magnetic__click\" à l'intérieur du wrapper\n gsap.to(target, {\n x: offsetX + \"em\",\n y: offsetY + \"em\",\n rotate: \"0.001deg\",\n ease: \"power4.out\",\n duration: 1.6,\n });\n\n if (inner) {\n const innerOffsetX = ((e.clientX - b.left) / m.offsetWidth - 0.5) *\n (innerStrength / 16),\n innerOffsetY = ((e.clientY - b.top) / m.offsetHeight - 0.5) *\n (innerStrength / 16);\n gsap.to(inner, {\n x: innerOffsetX + \"em\",\n y: innerOffsetY + \"em\",\n rotate: \"0.001deg\",\n ease: \"power4.out\",\n duration: 2,\n });\n }\n };\n\n const resetMagnet = (e) => {\n const m = e.currentTarget;\n const target = m.querySelector(\".btn-magnetic__click\");\n if (!target) return;\n\n const inner = target.querySelector(\"[data-magnetic-inner-target]\");\n\n // Retour fluide au centre\n gsap.to(target, {\n x: \"0em\",\n y: \"0em\",\n ease: \"elastic.out(1, 0.3)\",\n duration: 1.6,\n clearProps: \"all\",\n });\n if (inner) {\n gsap.to(inner, {\n x: \"0em\",\n y: \"0em\",\n ease: \"elastic.out(1, 0.3)\",\n duration: 2,\n clearProps: \"all\",\n });\n }\n };\n\n magnets.forEach((m) => {\n m.addEventListener(\"mouseenter\", resetOnEnter);\n m.addEventListener(\"mousemove\", moveMagnet);\n m.addEventListener(\"mouseleave\", resetMagnet);\n });\n}\n\n/* ---------- Init Vimeo Lightbox ---------- */\nfunction initVimeoLightboxAdvanced() {\n // Single lightbox container\n const lightbox = document.querySelector(\"[data-vimeo-lightbox-init]\");\n if (!lightbox) return;\n\n // Open & close buttons\n const openButtons = document.querySelectorAll(\n '[data-vimeo-lightbox-control=\"open\"]',\n );\n const closeButtons = document.querySelectorAll(\n '[data-vimeo-lightbox-control=\"close\"]',\n );\n\n // Core elements inside lightbox\n let iframe = lightbox.querySelector(\"iframe\"); // ← now let\n const placeholder = lightbox.querySelector(\".vimeo-lightbox__placeholder\");\n const calcEl = lightbox.querySelector(\".vimeo-lightbox__calc\");\n const wrapEl = lightbox.querySelector(\".vimeo-lightbox__calc-wrap\");\n const playerContainer = lightbox.querySelector(\n \"[data-vimeo-lightbox-player]\",\n );\n\n // State\n let player = null;\n let currentVideoID = null;\n let videoAspectRatio = null;\n let globalMuted = lightbox.getAttribute(\"data-vimeo-muted\") === \"true\";\n const isTouch = (\"ontouchstart\" in window) || navigator.maxTouchPoints > 0;\n const playedOnce = new Set(); // track first play on touch\n\n // Format time (seconds → \"m:ss\")\n function formatTime(s) {\n const m = Math.floor(s / 60);\n const sec = Math.floor(s % 60).toString().padStart(2, \"0\");\n return `${m}:${sec}`;\n }\n\n // Clamp wrap height\n function clampWrapSize(ar) {\n const w = calcEl.offsetWidth;\n const h = calcEl.offsetHeight;\n wrapEl.style.maxWidth = Math.min(w, h / ar) + \"px\";\n }\n\n // Adjust sizing in \"cover\" mode\n function adjustCoverSizing() {\n if (!videoAspectRatio) return;\n const cH = playerContainer.offsetHeight;\n const cW = playerContainer.offsetWidth;\n const r = cH / cW;\n const wEl = lightbox.querySelector(\".vimeo-lightbox__iframe\");\n if (r > videoAspectRatio) {\n wEl.style.width = (r / videoAspectRatio * 100) + \"%\";\n wEl.style.height = \"100%\";\n } else {\n wEl.style.height = (videoAspectRatio / r * 100) + \"%\";\n wEl.style.width = \"100%\";\n }\n }\n\n // Close & pause lightbox\n function closeLightbox() {\n lightbox.setAttribute(\"data-vimeo-activated\", \"false\");\n document.body.style.overflow = \"\";\n if (player) {\n player.pause();\n lightbox.setAttribute(\"data-vimeo-playing\", \"false\");\n }\n }\n\n // Wire Escape key & close buttons\n document.addEventListener(\"keydown\", (e) => {\n if (e.key === \"Escape\") closeLightbox();\n });\n closeButtons.forEach((btn) => btn.addEventListener(\"click\", closeLightbox));\n\n // Close when clicking outside the video\n lightbox.addEventListener(\"click\", (e) => {\n // Ignorer si le clic est sur le composant vidéo en lui-même (data-vimeo-lightbox-player)\n if (e.target.closest(\"[data-vimeo-lightbox-player]\")) return;\n\n // Ignorer si le clic est sur un bouton de contrôle (play/pause/timeline...)\n if (e.target.closest(\"[data-vimeo-control]\")) return;\n\n // Ignorer si le clic est sur une autre action interne (*à l'exception* de l'arrière-plan/fermeture).\n // On vérifie que c'est un bouton \"open\" ou qu'on ne cible pas la classe background.\n if (\n e.target.closest('[data-vimeo-lightbox-control=\"open\"]') ||\n (e.target.closest(\"[data-vimeo-lightbox-control]\") &&\n !e.target.closest(\".vimeo-lightbox__bg\") &&\n !e.target.closest('[data-vimeo-lightbox-control=\"close\"]')) // Le bouton close ferme déjà seul, c'est optionnel\n ) {\n return;\n }\n\n // Sinon, on ferme.\n closeLightbox();\n });\n\n // Setup Vimeo Player event handlers\n function setupPlayerEvents() {\n // Hide placeholder when playback starts\n player.on(\"play\", () => {\n lightbox.setAttribute(\"data-vimeo-loaded\", \"true\");\n lightbox.setAttribute(\"data-vimeo-playing\", \"true\");\n });\n // Close on video end\n player.on(\"ended\", closeLightbox);\n\n // Paused\n player.on(\"pause\", () => {\n lightbox.setAttribute(\"data-vimeo-playing\", \"false\");\n });\n\n // Duration UI\n const durEl = lightbox.querySelector(\"[data-vimeo-duration]\");\n player.getDuration().then((d) => {\n if (durEl) durEl.textContent = formatTime(d);\n lightbox.querySelectorAll('[data-vimeo-control=\"timeline\"],progress')\n .forEach((el) => el.max = d);\n });\n\n // Timeline & progress updates\n const tl = lightbox.querySelector('[data-vimeo-control=\"timeline\"]');\n const pr = lightbox.querySelector(\"progress\");\n player.on(\"timeupdate\", (data) => {\n if (tl) tl.value = data.seconds;\n if (pr) pr.value = data.seconds;\n if (durEl) durEl.textContent = formatTime(Math.trunc(data.seconds));\n });\n if (tl) {\n [\"input\", \"change\"].forEach((evt) =>\n tl.addEventListener(evt, (e) => {\n const v = e.target.value;\n player.setCurrentTime(v);\n if (pr) pr.value = v;\n })\n );\n }\n\n // Hover → hide controls after a timeout\n let hoverTimer;\n playerContainer.addEventListener(\"mousemove\", () => {\n lightbox.setAttribute(\"data-vimeo-hover\", \"true\");\n clearTimeout(hoverTimer);\n hoverTimer = setTimeout(() => {\n lightbox.setAttribute(\"data-vimeo-hover\", \"false\");\n }, 3000);\n });\n\n // Fullscreen toggle on player container\n const fsBtn = lightbox.querySelector('[data-vimeo-control=\"fullscreen\"]');\n if (fsBtn) {\n const isFS = () =>\n document.fullscreenElement || document.webkitFullscreenElement;\n if (!(document.fullscreenEnabled || document.webkitFullscreenEnabled)) {\n fsBtn.style.display = \"none\";\n }\n fsBtn.addEventListener(\"click\", () => {\n if (isFS()) {\n lightbox.setAttribute(\"data-vimeo-fullscreen\", \"false\");\n (document.exitFullscreen || document.webkitExitFullscreen).call(\n document,\n );\n } else {\n lightbox.setAttribute(\"data-vimeo-fullscreen\", \"true\");\n (playerContainer.requestFullscreen ||\n playerContainer.webkitRequestFullscreen)\n .call(playerContainer);\n }\n });\n [\"fullscreenchange\", \"webkitfullscreenchange\"].forEach((evt) =>\n document.addEventListener(\n evt,\n () =>\n lightbox.setAttribute(\n \"data-vimeo-fullscreen\",\n isFS() ? \"true\" : \"false\",\n ),\n )\n );\n }\n }\n\n // Run sizing logic\n async function runSizing() {\n const mode = lightbox.getAttribute(\"data-vimeo-update-size\");\n const w = await player.getVideoWidth();\n const h = await player.getVideoHeight();\n const ar = h / w;\n const bef = lightbox.querySelector(\".vimeo-lightbox__before\");\n\n if (mode === \"true\") {\n if (bef) bef.style.paddingTop = (ar * 100) + \"%\";\n clampWrapSize(ar);\n } else if (mode === \"cover\") {\n videoAspectRatio = ar;\n if (bef) bef.style.paddingTop = \"0%\";\n adjustCoverSizing();\n } else {\n clampWrapSize(ar);\n }\n }\n\n // Re-run sizing on viewport resize\n window.addEventListener(\"resize\", () => {\n if (player) runSizing();\n });\n\n // Open or switch video\n async function openLightbox(id, placeholderBtn) {\n // Enter loading state immediately\n lightbox.setAttribute(\"data-vimeo-activated\", \"loading\");\n document.body.style.overflow = \"hidden\";\n lightbox.setAttribute(\"data-vimeo-loaded\", \"false\");\n\n // — FULL RESET if new video ID —\n if (player && id !== currentVideoID) {\n await player.pause();\n await player.unload();\n\n // Replace old iframe with a fresh one\n const oldIframe = iframe;\n const newIframe = document.createElement(\"iframe\");\n newIframe.className = oldIframe.className;\n newIframe.setAttribute(\"allow\", oldIframe.getAttribute(\"allow\"));\n newIframe.setAttribute(\"frameborder\", \"0\");\n newIframe.setAttribute(\"allowfullscreen\", \"true\");\n newIframe.setAttribute(\"allow\", \"autoplay; encrypted-media\");\n oldIframe.parentNode.replaceChild(newIframe, oldIframe);\n\n // Reset state\n iframe = newIframe;\n player = null;\n currentVideoID = null;\n lightbox.setAttribute(\"data-vimeo-playing\", \"false\");\n }\n\n // Update placeholder image attributes\n if (placeholderBtn) {\n [\"src\", \"srcset\", \"sizes\", \"alt\", \"width\"].forEach((attr) => {\n const val = placeholderBtn.getAttribute(attr);\n if (val != null) {\n placeholder.setAttribute(attr, val);\n } else {\n placeholder.removeAttribute(attr);\n }\n });\n }\n\n // Build a brand-new player if needed\n if (!player) {\n iframe.src =\n `https://player.vimeo.com/video/${id}?api=1&background=1&autoplay=0&loop=0&muted=0`;\n player = new Vimeo.Player(iframe);\n setupPlayerEvents();\n currentVideoID = id;\n await runSizing();\n }\n\n // Now sizing is ready — show lightbox\n lightbox.setAttribute(\"data-vimeo-activated\", \"true\");\n\n // Autoplay logic\n if (!isTouch) {\n player.setVolume(globalMuted ? 0 : 1).then(() => {\n lightbox.setAttribute(\"data-vimeo-playing\", \"true\");\n setTimeout(() => player.play(), 50);\n });\n } else {\n // Sur mobile (isTouch), on lance la vidéo au premier clic\n if (!playedOnce.has(currentVideoID)) {\n // Pour que le navigateur accepte l'autoplay sur mobile, on doit souvent forcer le mute au lancement\n player.setVolume(0).then(() => {\n lightbox.setAttribute(\"data-vimeo-playing\", \"true\");\n player.play();\n // On remet le son après un court instant si ce n'était pas muet globalement\n if (!globalMuted) {\n setTimeout(() => {\n player.setVolume(1);\n lightbox.setAttribute(\"data-vimeo-muted\", \"false\");\n }, 100);\n }\n playedOnce.add(currentVideoID);\n });\n } else {\n player.setVolume(globalMuted ? 0 : 1).then(() => {\n lightbox.setAttribute(\"data-vimeo-playing\", \"true\");\n player.play();\n });\n }\n }\n }\n\n // Internal controls\n lightbox.querySelector('[data-vimeo-control=\"play\"]').addEventListener(\n \"click\",\n () => {\n if (isTouch) {\n if (!playedOnce.has(currentVideoID)) {\n player.setVolume(0).then(() => {\n lightbox.setAttribute(\"data-vimeo-playing\", \"true\");\n player.play();\n if (!globalMuted) {\n setTimeout(() => {\n player.setVolume(1);\n lightbox.setAttribute(\"data-vimeo-muted\", \"false\");\n }, 100);\n }\n playedOnce.add(currentVideoID);\n });\n } else {\n player.setVolume(globalMuted ? 0 : 1).then(() => {\n lightbox.setAttribute(\"data-vimeo-playing\", \"true\");\n player.play();\n });\n }\n } else {\n player.setVolume(globalMuted ? 0 : 1).then(() => {\n lightbox.setAttribute(\"data-vimeo-playing\", \"true\");\n setTimeout(() => player.play(), 50);\n });\n }\n },\n );\n\n lightbox.querySelector('[data-vimeo-control=\"pause\"]').addEventListener(\n \"click\",\n () => {\n player.pause();\n },\n );\n\n lightbox.querySelector('[data-vimeo-control=\"mute\"]').addEventListener(\n \"click\",\n () => {\n globalMuted = !globalMuted;\n player.setVolume(globalMuted ? 0 : 1).then(() =>\n lightbox.setAttribute(\n \"data-vimeo-muted\",\n globalMuted ? \"true\" : \"false\",\n )\n );\n },\n );\n\n // Wire up open buttons\n openButtons.forEach((btn) => {\n btn.addEventListener(\"click\", () => {\n const vid = btn.getAttribute(\"data-vimeo-lightbox-id\");\n const img = btn.querySelector(\"[data-vimeo-lightbox-placeholder]\");\n console.log(\"--- Vimeo Lightbox Clicked ---\");\n console.log(\"Video ID found:\", vid);\n console.log(\"Thumbnail (img) found:\", img);\n openLightbox(vid, img);\n });\n });\n}\n\n/* ---------- Parallax Effect ---------- */\nfunction initParallaxLayers() {\n document.querySelectorAll(\"[data-parallax-layers]\").forEach(\n (triggerElement) => {\n let tl = gsap.timeline({\n scrollTrigger: {\n trigger: triggerElement,\n start: \"top bottom\",\n end: \"bottom top\",\n scrub: 1,\n },\n });\n const isMobile = window.innerWidth < 768;\n const layers = [\n { layer: \"1\", yPercentFrom: 0, yPercent: isMobile ? -12 : -20 },\n { layer: \"2\", yPercentFrom: 0, yPercent: isMobile ? -15 : -25 },\n ];\n layers.forEach((layerObj, idx) => {\n tl.fromTo(\n triggerElement.querySelectorAll(\n `[data-parallax-layer=\"${layerObj.layer}\"]`,\n ),\n {\n yPercent: layerObj\n .yPercentFrom,\n },\n { yPercent: layerObj.yPercent, ease: \"none\" },\n idx === 0 ? undefined : \"<\",\n );\n });\n },\n );\n}\n\n/* =========================\n ✅ MAP RENCONTRER CITY ROTATOR\n ========================= */\nwindow.initMapRotator = initMapRotator;\nfunction initMapRotator() {\n const DELAY_BETWEEN_CITIES = 200;\n const VISIBLE_DURATION = 500;\n const FADE_DURATION = 500;\n const MIN_GROUP_SIZE = 1;\n const MAX_GROUP_SIZE = 3;\n\n const cityRotator = document.querySelector(\"[data-city-rotator]\");\n if (!cityRotator) return;\n\n const cityElements = cityRotator.querySelectorAll(\"[data-city]\");\n if (cityElements.length === 0) return;\n\n function showCityElement(el) {\n el.style.opacity = \"1\";\n el.style.transform = \"translateY(0)\";\n }\n\n function hideCityElement(el) {\n el.style.opacity = \"0\";\n el.style.transform = \"translateY(10px)\";\n }\n\n function wait(ms) {\n return new Promise((resolve) => setTimeout(resolve, ms));\n }\n\n function shuffleArray(array) {\n const shuffled = [...array];\n for (let i = shuffled.length - 1; i > 0; i--) {\n const j = Math.floor(Math.random() * (i + 1));\n [shuffled[i], shuffled[j]] = [shuffled[j], shuffled[i]];\n }\n return shuffled;\n }\n\n function randomInt(min, max) {\n return Math.floor(Math.random() * (max - min + 1)) + min;\n }\n\n function getExclusions(el) {\n const raw = el.dataset.cityExclude;\n if (!raw) return [];\n return raw.split(\",\").map((s) => s.trim());\n }\n\n function isCompatible(el, group) {\n const elCity = el.dataset.city;\n const elExclusions = getExclusions(el);\n return group.every((groupEl) => {\n const groupCity = groupEl.dataset.city;\n const groupExclusions = getExclusions(groupEl);\n return !elExclusions.includes(groupCity) &&\n !groupExclusions.includes(elCity);\n });\n }\n\n async function startLoop() {\n while (true) {\n const shuffled = shuffleArray([...cityElements]);\n let i = 0;\n while (i < shuffled.length) {\n const groupSize = Math.min(\n randomInt(MIN_GROUP_SIZE, MAX_GROUP_SIZE),\n shuffled.length - i,\n );\n const group = [shuffled[i]];\n for (let j = i + 1; j < i + groupSize; j++) {\n if (isCompatible(shuffled[j], group)) {\n group.push(shuffled[j]);\n }\n }\n i += groupSize;\n group.forEach((el, index) => {\n setTimeout(() => showCityElement(el), index * DELAY_BETWEEN_CITIES);\n });\n await wait(FADE_DURATION + VISIBLE_DURATION);\n group.forEach((el, index) => {\n setTimeout(() => hideCityElement(el), index * DELAY_BETWEEN_CITIES);\n });\n await wait(DELAY_BETWEEN_CITIES);\n }\n }\n }\n\n startLoop();\n}\n\n/* =========================\n ✅ CSS HowTo Progress Tabs\n ========================= */\n\n(function () {\n const tabs = document.querySelectorAll(\"[auto-tab]\");\n const images = document.querySelectorAll(\"[auto-tab-image]\");\n const media = document.querySelector(\"[auto-tabs-media]\");\n\n // On lance le script uniquement si des tabs existent sur la page\n if (!tabs.length) return;\n\n const DURATION = 6000; // Durée par tab en ms\n\n let currentIndex = 0;\n let startTime = null;\n let animFrame = null;\n\n /* ----------------------------------------------------------\n Injection des styles CSS au runtime\n → Invisible en édition Webflow, actif uniquement en live\n ---------------------------------------------------------- */\n\n function injectStyles() {\n const style = document.createElement(\"style\");\n style.textContent = `\n [auto-tab] { opacity: 0.4; transition: opacity 0.4s ease; cursor: pointer; }\n [auto-tab][active] { opacity: 1; }\n [auto-tab-body] { opacity: 0; transition: opacity 0.4s ease; }\n [auto-tab-progress] { height: 2px !important; overflow: hidden; background: rgba(0, 9, 74, 0.1); }\n [auto-tab-bar] { height: 2px !important; display: block; background: #FF4920; }\n [auto-tabs-media] { position: relative; }\n [auto-tab-image] { position: absolute; inset: 0; opacity: 0; transition: opacity 0.4s ease; pointer-events: none; }\n [auto-tab-image][active]{ opacity: 1; pointer-events: auto; }\n `;\n document.head.appendChild(style);\n }\n\n /* ----------------------------------------------------------\n Calcul de la hauteur du wrapper d'images\n → Les images sont en position absolute, donc le wrapper\n perd sa hauteur naturelle — on la force en JS\n ---------------------------------------------------------- */\n\n function setMediaHeight() {\n if (!media || !images.length) return;\n\n // Affichage temporaire de toutes les images pour pouvoir les mesurer\n images.forEach(function (img) {\n img.style.display = \"block\";\n });\n const height = images[0].offsetHeight;\n images.forEach(function (img) {\n img.style.display = \"\";\n });\n\n if (height > 0) media.style.height = height + \"px\";\n }\n\n /* ----------------------------------------------------------\n Activation d'une tab\n → Reset de tout, puis activation de la tab ciblée\n ---------------------------------------------------------- */\n\n function setActive(index) {\n // Reset de toutes les tabs\n tabs.forEach(function (tab) {\n tab.removeAttribute(\"active\");\n\n const bar = tab.querySelector(\"[auto-tab-bar]\");\n const body = tab.querySelector(\"[auto-tab-body]\");\n const number = tab.querySelector(\"[auto-tab-number]\");\n\n if (bar) bar.style.width = \"0%\";\n if (body) {\n body.style.display = \"none\";\n body.style.opacity = \"0\";\n }\n if (number) number.style.color = \"\";\n });\n\n // Reset de toutes les images\n images.forEach(function (img) {\n img.removeAttribute(\"active\");\n });\n\n // Activation de la tab et de l'image ciblées\n const activeTab = document.querySelector(\n '[auto-tab][tab-index=\"' + index + '\"]',\n );\n const activeImg = document.querySelector(\n '[auto-tab-image][tab-index=\"' + index + '\"]',\n );\n\n if (activeTab) {\n activeTab.setAttribute(\"active\", \"\");\n\n const body = activeTab.querySelector(\"[auto-tab-body]\");\n const number = activeTab.querySelector(\"[auto-tab-number]\");\n\n if (number) number.style.color = \"#FF4920\";\n if (body) {\n body.style.display = \"block\";\n // rAF nécessaire pour que la transition CSS se déclenche après le display:block\n requestAnimationFrame(function () {\n body.style.opacity = \"1\";\n });\n }\n }\n\n if (activeImg) activeImg.setAttribute(\"active\", \"\");\n\n // Réinitialisation de l'animation\n currentIndex = index;\n startTime = null;\n cancelAnimationFrame(animFrame);\n animFrame = requestAnimationFrame(animate);\n }\n\n /* ----------------------------------------------------------\n Animation de la barre de progression\n → Appelée ~60x/s par le navigateur via requestAnimationFrame\n ---------------------------------------------------------- */\n\n function animate(timestamp) {\n if (!startTime) startTime = timestamp;\n\n const elapsed = timestamp - startTime;\n const percentage = Math.min((elapsed / DURATION) * 100, 100);\n\n const activeTab = document.querySelector(\n '[auto-tab][tab-index=\"' + currentIndex + '\"]',\n );\n if (activeTab) {\n const bar = activeTab.querySelector(\"[auto-tab-bar]\");\n if (bar) bar.style.width = percentage + \"%\";\n }\n\n if (percentage < 100) {\n animFrame = requestAnimationFrame(animate);\n } else {\n // % toutesLesTabs.length permet de revenir à 0 après la dernière tab\n setActive((currentIndex + 1) % tabs.length);\n }\n }\n\n /* ----------------------------------------------------------\n Clic manuel sur une tab\n ---------------------------------------------------------- */\n\n tabs.forEach(function (tab) {\n tab.addEventListener(\"click\", function () {\n cancelAnimationFrame(animFrame);\n setActive(parseInt(tab.getAttribute(\"tab-index\")));\n });\n });\n\n /* ----------------------------------------------------------\n Init\n ---------------------------------------------------------- */\n\n injectStyles();\n setMediaHeight();\n window.addEventListener(\"resize\", setMediaHeight);\n setActive(0);\n})();\n\n/* ----------------------------------------------------------\n Init Page Scripts\n ---------------------------------------------------------- */\n\nfunction initPageScripts() {\n document.querySelector(\"[data-magnetic-wrapper]\") && initMagneticEffect();\n document.querySelector(\"[data-vimeo-lightbox-id]\") &&\n initVimeoLightboxAdvanced();\n document.querySelector(\"[data-parallax-layers]\") && initParallaxLayers();\n document.querySelector(\"[data-city-rotator]\") && initMapRotator();\n document.querySelector(\"[data-tag-rotator]\") && initTagsAnimateOnMap();\n}\ninitPageScripts();",[156],"7c073498-2c45-11f1-acaf-42dde27851f2","ARCHIVES","784ea9f8-2c45-11f1-a013-42dde27851f2",495,true,["D",1774881236903],1,"directory",[164],"pulls","branches","forks","envVars",{"_179":60,"_181":60},"connections",{"_179":60,"_180":60},"count","unfilledCount","emptyCount",{"_43":163,"_32":164,"_30":165,"_132":-5,"_41":42,"_40":166,"_134":167,"_38":206,"_13":169,"_34":170,"_36":-5,"_24":25,"_138":-5,"_189":207,"_27":208},{"_43":201,"_32":33,"_30":31,"_132":165,"_41":42,"_40":14,"_134":167,"_38":202,"_13":203,"_34":35,"_36":37,"_24":25,"_138":-5,"_189":204,"_27":205},{"_43":155,"_32":156,"_30":157,"_132":-5,"_41":42,"_40":158,"_134":25,"_38":198,"_13":160,"_34":35,"_36":161,"_24":25,"_138":-5,"_189":199,"_27":200},{"_43":148,"_32":149,"_30":150,"_132":-5,"_41":42,"_40":151,"_134":25,"_38":195,"_13":153,"_34":35,"_36":146,"_24":25,"_138":-5,"_189":196,"_27":197},{"_43":140,"_32":141,"_30":142,"_132":-5,"_41":42,"_40":143,"_134":25,"_38":192,"_13":145,"_34":35,"_36":146,"_24":25,"_138":-5,"_189":193,"_27":194},{"_43":129,"_32":130,"_30":131,"_132":-5,"_41":42,"_40":133,"_134":25,"_38":188,"_13":136,"_34":35,"_36":137,"_24":25,"_138":-5,"_189":190,"_27":191},["D",1773848824427],"children",[],[130],["D",1774619370746],[],[141],["D",1774619415020],[],[149],["D",1774619403257],[],[156],"8ec3bf66-2c45-11f1-9eed-42dde27851f2",["D",1774881268449],8,[],[164,33],["D",1774881236903],[183],[164],["D",1770652578242],{"_94":93,"_101":97},{"_94":93,"_95":-5,"_96":97,"_18":54,"_98":99,"_100":25},{"_13":83,"_32":84,"_43":42,"_85":44,"_86":-5,"_87":-5,"_88":-5,"_89":-5,"_90":-5,"_91":45,"_92":93},"ctx",{"_76":-5,"_121":246,"_247":248,"_249":250,"_251":25,"_252":25,"_253":25,"_254":167,"_255":-5,"_256":-7,"_257":-7,"_258":60,"_259":25,"_260":25,"_261":-5,"_262":25,"_263":25,"_264":25,"_265":-5},"ENV",{"_217":218,"_219":220,"_221":84,"_222":223,"_224":225,"_226":227,"_228":229,"_230":231,"_232":233,"_234":235,"_236":237,"_238":239,"_240":241,"_242":243,"_244":245},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Diff · v496