[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_255":256,"_257":258},"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",658,"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/backup2703.ts","latestPath","fileId","dcf9c4be-29e3-11f1-ac38-42dde27851f2","name","backup2703.ts","fileType","script","content","/* =========================\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 {\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();","createdAt",["D",1780041000998],"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":251,"_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":252,"_78":253,"_80":254,"_82":25},"tree",[191,196,197,198,199,200],"files",[191,192,193,194,195,196,197,198,199,200],"counts",{"_181":60,"_182":154,"_183":60,"_184":185,"_186":187},"contents",[124,125,126,127,128,129],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_43":173,"_32":174,"_30":175,"_133":-5,"_41":42,"_40":176,"_135":177,"_38":178,"_13":154,"_34":179,"_36":-5,"_24":25,"_139":-5,"_27":180},{"_43":165,"_32":166,"_30":167,"_133":-5,"_41":42,"_40":168,"_135":25,"_38":169,"_13":170,"_34":35,"_36":171,"_24":25,"_139":-5,"_27":172},{"_43":157,"_32":158,"_30":159,"_133":-5,"_41":42,"_40":160,"_135":25,"_38":161,"_13":162,"_34":35,"_36":163,"_24":25,"_139":-5,"_27":164},{"_43":149,"_32":150,"_30":151,"_133":-5,"_41":42,"_40":152,"_135":25,"_38":153,"_13":154,"_34":35,"_36":155,"_24":25,"_139":-5,"_27":156},{"_43":141,"_32":142,"_30":143,"_133":-5,"_41":42,"_40":144,"_135":25,"_38":145,"_13":146,"_34":35,"_36":147,"_24":25,"_139":-5,"_27":148},{"_43":130,"_32":131,"_30":132,"_133":-5,"_41":42,"_40":134,"_135":25,"_38":136,"_13":137,"_34":35,"_36":138,"_24":25,"_139":-5,"_27":140},"9b3ec19a-3803-11f1-84fd-42b51c65c3df","swipers.js","deb4d098-1d34-11f1-92f9-42dde27851f2","parentId",553,"latest",["D",1776172356552],20,"/* =========================\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 centeredSlides: !isDesktop,\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",[131],"fdbc9ede-59d5-11f1-ba52-ee650bb23af1","main.js","df00279a-05cf-11f1-9b96-42dde27851f2",656,["D",1779891104493],574,"/* =========================\n 📆 UPDATE 27-05-2026_16:11\n ========================= */\n\n/* =========================\n ✅ GESTION TYPEFORM (laisser en haut)\n ========================= */\n(function TypeformManager() {\n /* =========================\n CONFIG\n ========================= */\n const CONFIG = {\n iframeSelector: \".tf-v1-iframe-wrapper iframe\",\n iframeDelayMs: 400,\n };\n\n /* =========================\n HELPERS\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 const currentSrc = iframe.getAttribute(\"src\");\n let newSrc = currentSrc;\n if (params.email) {\n const sep = currentSrc.includes(\"?\") ? \"&\" : \"?\";\n newSrc = `${currentSrc}${sep}email=${params.email}`;\n }\n iframe.setAttribute(\"src\", newSrc);\n console.log(\"Updated iframe src:\", iframe.src);\n }\n\n /**\n * Ouvre le Typeform correspondant au rôle demandé.\n * Fallback sur le premier trigger trouvé si aucun rôle ne correspond.\n *\n * @param {string} role - data-tf-role du trigger (ex: \"default\", \"special\")\n * @param {string} email - email pré-rempli (optionnel)\n */\n function openTf({ role = \"\", email = \"\" } = {}) {\n const trigger =\n document.querySelector(`[OpenTf=\"trigger\"][data-tf-role=\"${role}\"]`) ??\n document.querySelectorAll('[OpenTf=\"trigger\"]')[0];\n\n if (!trigger) {\n console.warn(\n `Typeform trigger not found${role ? ` for role: ${role}` : \"\"}`,\n );\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(() => updateIframeParams({ email }), CONFIG.iframeDelayMs);\n }\n }\n\n /* =========================\n LISTENERS\n ========================= */\n\n // submit formulaire → récupère email + role depuis data-tf-role\n document.querySelectorAll('[OpenTf=\"form\"]').forEach((form) => {\n form.addEventListener(\"submit\", function (event) {\n event.preventDefault();\n const email = getEmailFromElement(form);\n const role = form.dataset.tfRole || \"\";\n openTf({ role, email });\n });\n });\n\n // clic simple → ouvre le form lié via data-tf-role\n document.querySelectorAll('[OpenTf=\"btn\"]').forEach((el) => {\n el.addEventListener(\"click\", function (event) {\n event.preventDefault();\n const role = el.dataset.tfRole || \"\";\n openTf({ role });\n });\n });\n // Exposition globale pour debug console\n window.TypeformManager = { openTf };\n})();\n\n/* =========================\n ✅ NAVBAR\n ========================= */\n\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 const slideMenu = document.querySelector(\".slide-menu\");\n\n function openMenu() {\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 mainWrapper.style.filter = \"blur(4px)\";\n mainWrapper.style.transition =\n \"filter 0.5s cubic-bezier(.165, .84, .44, 1)\";\n document.body.style.overflow = \"hidden\";\n }\n\n function closeMenu() {\n navbarMenus.forEach((menu) => {\n menu.style.display = \"none\";\n });\n backgroundNavbar.style.display = \"none\";\n backgroundNavbar.style.transform = \"translateY(-100%)\";\n mainWrapper.style.filter = \"blur(0px)\";\n document.body.style.overflow = \"\";\n }\n\n if (menuButton) {\n menuButton.addEventListener(\"click\", () => {\n setTimeout(() => {\n const atLeastOneMenuOpen = Array.from(navbarMenus).some((menu) => {\n return window.getComputedStyle(menu).display === \"flex\";\n });\n atLeastOneMenuOpen ? openMenu() : closeMenu();\n }, 50);\n });\n }\n\n if (slideMenu) {\n slideMenu.addEventListener(\"click\", (e) => {\n if (e.target === slideMenu) {\n closeMenu();\n // Simuler le clic sur menuButton pour que Webflow remette l'icône burger\n setTimeout(() => menuButton.click(), 10);\n }\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\n// Cache DOM au premier appel, évite les querySelectorAll répétés\nlet toggles = null;\nfunction getToggles() {\n if (!toggles) {\n toggles = [...document.querySelectorAll('[card-blur-tabs=\"toggle\"]')];\n }\n return toggles;\n}\n\n// Ouvre/ferme une liste via data-attribute (évite getComputedStyle)\nfunction setListOpen(list, open) {\n if (open) {\n list.style.setProperty(\"height\", \"auto\", \"important\");\n list.style.setProperty(\"overflow\", \"visible\", \"important\");\n list.style.setProperty(\"display\", \"flex\", \"important\");\n list.dataset.cbOpen = \"1\";\n } else {\n list.style.setProperty(\"height\", \"0px\", \"important\");\n list.style.setProperty(\"overflow\", \"hidden\", \"important\");\n list.style.setProperty(\"display\", \"none\", \"important\");\n delete list.dataset.cbOpen;\n }\n}\n\nfunction isListOpen(list) {\n return list.dataset.cbOpen === \"1\";\n}\n\n// Met à jour le style d'un toggle en fonction de l'état (sans setTimeout ni rAF imbriqué)\nfunction applyToggleStyle(toggle, open) {\n const dropdown = toggle.querySelector('[card-blur-tabs=\"dropdown\"]');\n const dropdownDark = toggle.querySelector('[card-blur-tabs=\"dropdown-dark\"]');\n\n // dropdown-close color\n toggle.querySelectorAll(\"[dropdown-close]\").forEach((el) => {\n const closeColor = el.getAttribute(\"dropdown-close\");\n if (!closeColor) return;\n el.style.setProperty(\"color\", open ? \"white\" : closeColor, \"important\");\n });\n\n if (dropdown) {\n const child = dropdown.children[0];\n if (child) {\n child.style.setProperty(\n \"transform\",\n open ? \"rotate(0deg)\" : \"rotate(180deg)\",\n \"important\",\n );\n }\n dropdown.style.setProperty(\"color\", open ? \"white\" : \"\", \"important\");\n dropdown.style.setProperty(\n \"background-image\",\n open ? \"none\" : \"\",\n \"important\",\n );\n }\n\n if (dropdownDark) {\n const child = dropdownDark.children[0];\n if (child) {\n child.style.setProperty(\n \"transform\",\n open ? \"rotate(0deg)\" : \"rotate(180deg)\",\n \"important\",\n );\n }\n dropdownDark.style.setProperty(\n \"background-color\",\n open ? \"#00094A\" : \"\",\n \"important\",\n );\n dropdownDark.style.setProperty(\"color\", open ? \"white\" : \"\", \"important\");\n dropdownDark.style.setProperty(\"border\", open ? \"none\" : \"\", \"important\");\n }\n}\n\nfunction resetToggleStyle(toggle) {\n const dropdown = toggle.querySelector('[card-blur-tabs=\"dropdown\"]');\n const dropdownDark = toggle.querySelector('[card-blur-tabs=\"dropdown-dark\"]');\n\n toggle.querySelectorAll(\"[dropdown-close]\").forEach((el) => {\n el.style.color = \"\";\n });\n if (dropdown) {\n const child = dropdown.children[0];\n if (child) child.style.transform = \"\";\n dropdown.style.color = \"\";\n dropdown.style.backgroundImage = \"\";\n }\n if (dropdownDark) {\n const child = dropdownDark.children[0];\n if (child) child.style.transform = \"\";\n dropdownDark.style.backgroundColor = \"\";\n dropdownDark.style.color = \"\";\n dropdownDark.style.border = \"\";\n }\n}\n\nfunction initCardBlurTabs() {\n if (!mediaQuery.matches) {\n // Desktop : reset tout\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) => {\n list.style.height = \"\";\n list.style.overflow = \"\";\n list.style.display = \"\";\n delete list.dataset.cbOpen;\n });\n getToggles().forEach(resetToggleStyle);\n return;\n }\n\n // Mobile/tablet : init état initial\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) => {\n const isFirst = list.getAttribute(\"card-blur-tabs-load\") === \"first\";\n setListOpen(list, isFirst);\n });\n\n // Sync les styles des toggles sur l'état initial\n getToggles().forEach((toggle) => {\n const lists = [\n ...toggle.parentElement.querySelectorAll('[card-blur-tabs=\"list\"]'),\n ];\n const open = lists.some(isListOpen);\n applyToggleStyle(toggle, open);\n });\n}\n\nfunction handleCardBlurTabsClick() {\n getToggles().forEach((toggle) => {\n toggle.addEventListener(\"click\", () => {\n if (!mediaQuery.matches) return;\n\n const siblingLists = [\n ...toggle.parentElement.querySelectorAll('[card-blur-tabs=\"list\"]'),\n ];\n const wasOpen = siblingLists.some(isListOpen);\n\n // Ferme tout\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) =>\n setListOpen(list, false)\n );\n // Reset les styles de tous les toggles\n getToggles().forEach((t) => applyToggleStyle(t, false));\n\n if (!wasOpen) {\n // Ouvre les listes du toggle cliqué\n siblingLists.forEach((list) => setListOpen(list, true));\n applyToggleStyle(toggle, true);\n }\n });\n });\n}\n\nmediaQuery.addEventListener(\"change\", initCardBlurTabs);\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; // délai entre chaque batch\n var FADE = 1200; // durée du fondu\n var STAGGER = 1200; // écart entre slots dans un même batch\n var BATCH = 2; // nb de slots changés par batch (fixe, plus prévisible)\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 var slotObserver = new IntersectionObserver(function (entries) {\n entries.forEach(function (entry) {\n if (entry.isIntersecting) visibleSlots.add(entry.target);\n else visibleSlots.delete(entry.target);\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 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 slotObserver.observe(slot);\n });\n\n // ── File d'attente tournante ──\n // Garantit que chaque slot visible est rafraîchi avant qu'un autre\n // repasse, puis on mélange la prochaine tournée pour varier l'ordre.\n var queue = [];\n function pickFromQueue(n) {\n var visible = Array.from(visibleSlots);\n if (visible.length === 0) return [];\n\n // Retire de la queue les slots devenus invisibles\n queue = queue.filter(function (s) {\n return visibleSlots.has(s);\n });\n\n // Complète / recharge la queue si elle est trop courte\n if (queue.length < n) {\n // Tous les slots visibles ont déjà été vus → on prépare un nouveau tour\n var remaining = visible.filter(function (s) {\n return !queue.includes(s);\n });\n queue = queue.concat(shuffle(remaining));\n }\n\n return queue.splice(0, Math.min(n, queue.length));\n }\n\n // ── Cycle batch ──\n function runBatch() {\n var picked = pickFromQueue(BATCH);\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; // force reflow\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 if (document.querySelector(\"[data-tabs-wrap]\")) {\n AutoRotateFakeTabs();\n }\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\", (e) => {\n const vid = btn.getAttribute(\"data-vimeo-lightbox-id\");\n\n // Si pas d'ID de vidéo (ex: CMS vide), on ne fait rien\n if (!vid || vid.trim() === \"\") {\n e.preventDefault();\n console.warn(\n \"⚠️ [Vimeo Lightbox] Clic ignoré : aucun ID de vidéo trouvé pour cet item CMS.\",\n );\n return;\n }\n\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 ✅ TOOLTIP MOBILE\n ========================= */\nfunction initMobileTooltips() {\n let activeTooltip = null;\n let originalParent = null;\n\n const closeActiveTooltip = () => {\n if (!activeTooltip) return;\n\n const tooltipToClose = activeTooltip;\n const parentToReturn = originalParent;\n\n console.log(\"🕒 [Tooltip] Fermeture :\", tooltipToClose);\n\n tooltipToClose.classList.remove(\"is-active\");\n document.body.style.overflow = \"\";\n\n setTimeout(() => {\n if (!tooltipToClose.classList.contains(\"is-active\")) {\n tooltipToClose.classList.remove(\"tooltip-moving\");\n // On remet la tooltip à sa place d'origine (dans le trigger ou après)\n if (parentToReturn) {\n console.log(\"♻️ [Tooltip] Retour au DOM d'origine.\");\n parentToReturn.appendChild(tooltipToClose);\n }\n }\n }, 400);\n\n activeTooltip = null;\n originalParent = null;\n };\n\n const openTooltipMobile = (tooltip, trigger) => {\n console.log(\"✨ [Tooltip] Ouverture demandée.\");\n\n if (activeTooltip) {\n closeActiveTooltip();\n }\n\n activeTooltip = tooltip;\n // On stocke le parent direct pour savoir où la remettre plus tard\n originalParent = tooltip.parentElement;\n\n document.body.style.overflow = \"hidden\";\n activeTooltip.classList.add(\"tooltip-moving\");\n document.body.appendChild(activeTooltip);\n\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n activeTooltip.classList.add(\"is-active\");\n console.log(\"🚀 [Tooltip] Animation lancée (is-active).\");\n });\n });\n };\n\n document.addEventListener(\"click\", (e) => {\n // On ne s'active que sur mobile/tablette\n if (window.innerWidth >= 768) return;\n\n const trigger = e.target.closest(\"[data-css-tooltip-hover]\");\n const clickedInsideTooltip = e.target.closest(\n \"[data-css-tooltip].is-active\",\n );\n\n // CAS 1 : Clic dans la bulle ouverte -> On ferme\n if (clickedInsideTooltip) {\n console.log(\"🖱️ [Click] Intérieur bulle -> Fermeture.\");\n closeActiveTooltip();\n return;\n }\n\n // CAS 2 : Clic sur un déclencheur\n if (trigger) {\n // Stratégie hybride pour trouver la tooltip :\n // 1. On cherche dedans (cas Pricing)\n // 2. Si rien, on cherche l'élément frère suivant (cas Décacornes)\n let tooltip = trigger.querySelector(\"[data-css-tooltip]\");\n\n if (!tooltip) {\n tooltip = trigger.nextElementSibling;\n }\n\n // Vérification finale de l'attribut\n if (!tooltip || !tooltip.hasAttribute(\"data-css-tooltip\")) {\n console.warn(\n \"⚠️ [Tooltip] Trigger détecté mais aucune bulle associée trouvée.\",\n trigger,\n );\n return;\n }\n\n console.log(\"✅ [Tooltip] Correspondance trouvée !\");\n\n if (activeTooltip === tooltip) {\n closeActiveTooltip();\n return;\n }\n\n openTooltipMobile(tooltip, trigger);\n e.preventDefault();\n return;\n }\n\n // CAS 3 : Clic n'importe où ailleurs\n if (activeTooltip) {\n console.log(\"🖱️ [Click] Extérieur -> Fermeture.\");\n closeActiveTooltip();\n }\n });\n\n console.log(\"🛠️ [System] Tooltips initialisées (Mode Hybride Activé).\");\n}\n\n// Lancement au chargement du DOM\ndocument.addEventListener(\"DOMContentLoaded\", initMobileTooltips);\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 {\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 ✅ HowTo : variant progress bar et variant opacity\n ---------------------------------------------------------- */\n\n// auto-tabs — variant 1 (progress bar)\n// Attribut déclencheur sur le wrapper : auto-tabs-wrapper-progress=\"\"\n\nfunction autoTabsProgress() {\n const wrapper = document.querySelector(\"[auto-tabs-wrapper-progress]\");\n if (!wrapper) return;\n\n const tabs = wrapper.querySelectorAll(\"[auto-tab]\");\n const images = wrapper.querySelectorAll(\"[auto-tab-image]\");\n const media = wrapper.querySelector(\"[auto-tabs-media]\");\n\n if (!tabs.length) return;\n\n const DURATION = 6000;\n\n let currentIndex = 0;\n let startTime = null;\n let animFrame = null;\n\n function injectStyles() {\n const style = document.createElement(\"style\");\n style.textContent = `\n [auto-tabs-wrapper-progress] [auto-tab] { opacity: 0.4; transition: opacity 0.4s ease; cursor: pointer; }\n [auto-tabs-wrapper-progress] [auto-tab][active] { opacity: 1; }\n [auto-tabs-wrapper-progress] [auto-tab-body] { opacity: 0; transition: opacity 0.4s ease; }\n [auto-tabs-wrapper-progress] [auto-tab-progress] { height: 2px !important; overflow: hidden; background: rgba(0, 9, 74, 0.1); }\n [auto-tabs-wrapper-progress] [auto-tab-bar] { height: 2px !important; display: block; background: #FF4920; }\n [auto-tabs-wrapper-progress] [auto-tabs-media] { position: relative; }\n [auto-tabs-wrapper-progress] [auto-tab-image] { position: absolute; inset: 0; opacity: 0; transition: opacity 0.4s ease; pointer-events: none; }\n [auto-tabs-wrapper-progress] [auto-tab-image][active] { opacity: 1; pointer-events: auto; }\n `;\n document.head.appendChild(style);\n }\n\n function setMediaHeight() {\n if (!media || !images.length) return;\n\n const firstImg = images[0];\n\n function applyHeight() {\n images.forEach(function (img) { img.style.display = \"block\"; });\n const height = images[0].offsetHeight;\n images.forEach(function (img) { img.style.display = \"\"; });\n if (height > 0) media.style.height = height + \"px\";\n }\n\n if (firstImg.complete && firstImg.naturalHeight > 0) {\n applyHeight();\n } else {\n firstImg.addEventListener(\"load\", applyHeight, { once: true });\n }\n }\n\n function setActive(index) {\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) { body.style.display = \"none\"; body.style.opacity = \"0\"; }\n if (number) number.style.color = \"\";\n });\n\n images.forEach(function (img) { img.removeAttribute(\"active\"); });\n\n const activeTab = wrapper.querySelector('[auto-tab][tab-index=\"' + index + '\"]');\n const activeImg = wrapper.querySelector('[auto-tab-image][tab-index=\"' + index + '\"]');\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 requestAnimationFrame(function () { body.style.opacity = \"1\"; });\n }\n }\n\n if (activeImg) activeImg.setAttribute(\"active\", \"\");\n\n currentIndex = index;\n startTime = null;\n cancelAnimationFrame(animFrame);\n animFrame = requestAnimationFrame(animate);\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 = wrapper.querySelector('[auto-tab][tab-index=\"' + currentIndex + '\"]');\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 setActive((currentIndex + 1) % tabs.length);\n }\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 injectStyles();\n setMediaHeight();\n window.addEventListener(\"resize\", setMediaHeight);\n setActive(0);\n}\n\nautoTabsProgress();\n// auto-tabs — variant 2 (opacity only)\n// Attribut déclencheur sur le wrapper : auto-tabs-wrapper-opacity=\"\"\n\nfunction autoTabsOpacity() {\n const wrapper = document.querySelector(\"[auto-tabs-wrapper-opacity]\");\n if (!wrapper) return;\n\n const tabs = wrapper.querySelectorAll(\"[auto-tab]\");\n const images = wrapper.querySelectorAll(\"[auto-tab-image]\");\n const media = wrapper.querySelector(\"[auto-tabs-media]\");\n\n if (!tabs.length) return;\n\n const DURATION = 6000;\n\n let currentIndex = 0;\n let timer = null;\n\n function injectStyles() {\n const style = document.createElement(\"style\");\n style.textContent = `\n [auto-tabs-wrapper-opacity] [auto-tab] { opacity: 0.3; transition: opacity 0.4s ease; cursor: pointer; }\n [auto-tabs-wrapper-opacity] [auto-tab][active] { opacity: 1; }\n [auto-tabs-wrapper-opacity] [auto-tab-body] { opacity: 1 !important; display: block !important; }\n [auto-tabs-wrapper-opacity] [auto-tabs-media] { position: relative; }\n [auto-tabs-wrapper-opacity] [auto-tab-image] { position: absolute; inset: 0; opacity: 0; transition: opacity 0.4s ease; pointer-events: none; }\n [auto-tabs-wrapper-opacity] [auto-tab-image][active] { opacity: 1; pointer-events: auto; }\n `;\n document.head.appendChild(style);\n }\n\n function setMediaHeight() {\n if (!media || !images.length) return;\n\n const firstImg = images[0];\n\n function applyHeight() {\n images.forEach(function (img) { img.style.display = \"block\"; });\n const height = images[0].offsetHeight;\n images.forEach(function (img) { img.style.display = \"\"; });\n if (height > 0) media.style.height = height + \"px\";\n }\n\n if (firstImg.complete && firstImg.naturalHeight > 0) {\n applyHeight();\n } else {\n firstImg.addEventListener(\"load\", applyHeight, { once: true });\n }\n }\n\n function setActive(index) {\n tabs.forEach(function (tab) {\n tab.removeAttribute(\"active\");\n const number = tab.querySelector(\"[auto-tab-number]\");\n if (number) number.style.color = \"\";\n });\n\n images.forEach(function (img) { img.removeAttribute(\"active\"); });\n\n const activeTab = wrapper.querySelector('[auto-tab][tab-index=\"' + index + '\"]');\n const activeImg = wrapper.querySelector('[auto-tab-image][tab-index=\"' + index + '\"]');\n\n if (activeTab) {\n activeTab.setAttribute(\"active\", \"\");\n const number = activeTab.querySelector(\"[auto-tab-number]\");\n if (number) number.style.color = \"#FF4920\";\n }\n\n if (activeImg) activeImg.setAttribute(\"active\", \"\");\n\n currentIndex = index;\n clearTimeout(timer);\n timer = setTimeout(function () {\n setActive((currentIndex + 1) % tabs.length);\n }, DURATION);\n }\n\n tabs.forEach(function (tab) {\n tab.addEventListener(\"click\", function () {\n clearTimeout(timer);\n setActive(parseInt(tab.getAttribute(\"tab-index\")));\n });\n });\n\n injectStyles();\n setMediaHeight();\n window.addEventListener(\"resize\", setMediaHeight);\n setActive(0);\n}\n\nautoTabsOpacity();\n\n // ════════════════════════════════════════════════════════════════════════════\n // MODALE LEVÉES TABLE\n // ════════════════════════════════════════════════════════════════════════════\n\nwindow.raisesIndex = {};\nwindow.modal;\n\n\n// ════════════════════════════════════════════════════════════════════════════\n// UTILITAIRES\n// ════════════════════════════════════════════════════════════════════════════\n\n/**\n * Lit la valeur d'un attribut data sur un élément ou son enfant.\n * Ordre de priorité :\n * 1. Valeur de l'attribut non vide sur root lui-même\n * 2. Valeur de l'attribut non vide sur un descendant\n * 3. src si IMG | textContent si badge | objet tooltip | textContent simple\n *\n * Note : ne pas utiliser pour data-raise-operation — utiliser readOperationAttr.\n */\nfunction readAttr(root, attr) {\n if (root.hasAttribute(attr)) {\n var rootVal = root.getAttribute(attr);\n if (rootVal) return rootVal;\n }\n\n var child = root.querySelector('[' + attr + ']');\n if (!child) return '';\n\n var attrVal = child.getAttribute(attr);\n if (attrVal) return attrVal;\n\n if (child.tagName === 'IMG') return child.src || '';\n\n var badgeWrapper = child.closest('.perf-badge-wrapper');\n if (badgeWrapper) return child.textContent.trim();\n\n // Le .css-tooltip-text est dans le parentNode du [data-css-tooltip-hover]\n var tooltipTrigger = child.closest('[data-css-tooltip-hover]');\n if (tooltipTrigger) {\n var bubbleText = tooltipTrigger.parentNode.querySelector('.css-tooltip-text');\n return {\n isTooltip: true,\n label: child.textContent.trim(),\n bubble: bubbleText ? bubbleText.textContent.trim() : ''\n };\n }\n\n return child.textContent.trim();\n}\n\n/**\n * Lit data-raise-operation et normalise toujours vers { isTooltip, label, bubble }.\n * Couvre les deux structures :\n * — Tableau 1 : valeur dans textContent, [data-css-tooltip-hover] sans valeur d'attribut\n * → readAttr retourne un objet isTooltip avec le bubble\n * — Tableau 2 : valeur dans l'attribut lui-même (data-raise-operation=\"PSFP\")\n * → readAttr retourne une string ; on cherche le bubble via parentNode\n */\nfunction readOperationAttr(root) {\n var raw = readAttr(root, 'data-raise-operation');\n\n if (raw && typeof raw === 'object' && raw.isTooltip) return raw;\n\n var label = raw || '';\n var tooltipEl = root.querySelector('[data-css-tooltip-hover]');\n var bubble = '';\n if (tooltipEl) {\n var bubbleEl = tooltipEl.parentNode.querySelector('.css-tooltip-text');\n if (bubbleEl) bubble = bubbleEl.textContent.trim();\n }\n return { isTooltip: true, label: label, bubble: bubble };\n}\n\n/**\n * Parse un montant formaté vers des millions (Float) + détecte la devise.\n * Formats acceptés : \"22,1M€\" | \"500K€\" | \"1,2Md€\" | \"4,3M$\" | \"500K$\"\n * Retourne { value: Float, currency: '€' | '$' | '' }\n */\nfunction parseAmount(str) {\n if (!str || typeof str !== 'string') return { value: 0, currency: '' };\n var s = str.trim().replace(',', '.');\n var currency = s.indexOf('$') !== -1 ? '$' : s.indexOf('€') !== -1 ? '€' : '';\n var num = parseFloat(s.replace(/[^0-9.]/g, ''));\n if (isNaN(num)) return { value: 0, currency: currency };\n var value = s.indexOf('Md') !== -1 ? num * 1000\n : s.indexOf('K') !== -1 ? num / 1000\n : num;\n return { value: value, currency: currency };\n}\n\n/**\n * Formate un total en millions vers la meilleure unité lisible.\n * Devise toujours en suffixe : 4,3M€ | 4,3M$\n * < 1M → K | 1-999M → M | >= 1000M → Md\n */\nfunction formatAmount(totalM, currency) {\n var c = currency || '€';\n var num;\n if (totalM >= 1000) num = (totalM / 1000).toFixed(1).replace('.', ',').replace(',0', '') + 'Md';\n else if (totalM >= 1) num = totalM.toFixed(1).replace('.', ',').replace(',0', '') + 'M';\n else num = Math.round(totalM * 1000) + 'K';\n return num + c;\n}\n\n\n// ════════════════════════════════════════════════════════════════════════════\n// INDEX DES LEVÉES\n// ════════════════════════════════════════════════════════════════════════════\n\n/**\n * Parcourt tous les [data-modal-open] et construit\n * un index { companySlug: [{ slug, serie, operation, date, amount, img }, ...] }.\n *\n * Guard hasData : ignore les items dont tous les champs sont vides.\n * Cause : Finsweet injecte le contenu CMS après le load initial — les\n * [data-slug] existent dans le DOM mais sont vides au premier passage.\n */\nfunction buildRaisesIndex() {\n var index = {};\n document.querySelectorAll('[data-modal-open]').forEach(function(trigger) {\n var company = (trigger.getAttribute('data-company') || '').trim().toLowerCase();\n if (!company) return;\n\n var triggerSlug = trigger.getAttribute('data-slug') || '';\n var isNested = !triggerSlug;\n\n var items = isNested\n ? Array.from(trigger.querySelectorAll('[data-slug]'))\n : [trigger];\n\n items.forEach(function(item) {\n var slug = (item.getAttribute('data-slug') || triggerSlug).trim().toLowerCase();\n if (!slug) return;\n\n var raise = {\n slug: slug,\n serie: readAttr(item, 'data-raise-serie'),\n operation: readOperationAttr(item),\n date: readAttr(item, 'data-raise-date'),\n amount: readAttr(item, 'data-raise-amount'),\n img: readAttr(item, 'data-raise-img')\n };\n\n var hasData = raise.serie || raise.date || raise.amount || raise.img\n || (raise.operation && raise.operation.label);\n if (!hasData) return;\n\n index[company] = index[company] || [];\n var existingIdx = index[company].findIndex(function(r) { return r.slug === slug; });\n if (existingIdx === -1) {\n index[company].push(raise);\n } else {\n index[company][existingIdx] = raise;\n }\n });\n });\n return index;\n}\n\n/**\n * Fusionne un nouvel index partiel dans raisesIndex.\n * Remplace une entrée existante si la nouvelle a des données.\n */\nfunction mergeIntoIndex(fresh) {\n Object.keys(fresh).forEach(function(company) {\n fresh[company].forEach(function(raise) {\n window.raisesIndex[company] = window.raisesIndex[company] || [];\n var existingIdx = window.raisesIndex[company].findIndex(function(r) {\n return r.slug === raise.slug;\n });\n if (existingIdx === -1) {\n window.raisesIndex[company].push(raise);\n } else {\n window.raisesIndex[company][existingIdx] = raise;\n }\n });\n });\n}\n\n/**\n * Pour les items [combine-startup=\"true\"] :\n * — Garde visible uniquement le premier [data-slug] du company (tous triggers confondus)\n * — Masque tous les suivants\n *\n * CORRECTIF load more : utilise un WeakSet pour mémoriser les triggers déjà traités.\n * Avant de traiter les nouveaux triggers, on détecte quels company ont déjà\n * un slug visible dans les triggers existants et on les marque dans `seen`.\n * Les nouveaux triggers Finsweet pour ces company ont donc tous leurs slugs masqués.\n */\nvar knownTriggers = new WeakSet();\n\nfunction applyCombineStartup() {\n var firstSlugPerCompany = {};\n\n document.querySelectorAll('[data-modal-open][combine-startup=\"true\"]').forEach(function(trigger) {\n var company = (trigger.getAttribute('data-company') || '').trim().toLowerCase();\n if (!company) return;\n\n trigger.querySelectorAll('[data-slug]').forEach(function(child) {\n var slug = child.getAttribute('data-slug');\n if (!firstSlugPerCompany[company]) {\n firstSlugPerCompany[company] = slug;\n child.style.removeProperty('display');\n } else {\n child.style.setProperty('display', 'none', 'important');\n }\n });\n });\n}\n\n/**\n * Charge toutes les pages suivantes en arrière-plan via fetch\n * pour compléter raisesIndex avec les items hors page courante.\n */\nfunction preloadAllPages() {\n var nextLink = document.querySelector('.w-pagination-next');\n if (!nextLink) return;\n\n function fetchPage(url) {\n fetch(url).then(function(r) { return r.text(); }).then(function(html) {\n var doc = new DOMParser().parseFromString(html, 'text/html');\n var fresh = {};\n doc.querySelectorAll('[data-modal-open]').forEach(function(trigger) {\n var company = (trigger.getAttribute('data-company') || '').trim().toLowerCase();\n if (!company) return;\n var triggerSlug = trigger.getAttribute('data-slug') || '';\n var isNested = !triggerSlug;\n\n var items = isNested\n ? Array.from(trigger.querySelectorAll('[data-slug]'))\n : [trigger];\n\n items.forEach(function(item) {\n var slug = (item.getAttribute('data-slug') || triggerSlug).trim().toLowerCase();\n if (!slug) return;\n\n var raise = {\n slug: slug,\n serie: readAttr(item, 'data-raise-serie'),\n operation: readOperationAttr(item),\n date: readAttr(item, 'data-raise-date'),\n amount: readAttr(item, 'data-raise-amount'),\n img: readAttr(item, 'data-raise-img')\n };\n\n var hasData = raise.serie || raise.date || raise.amount || raise.img\n || (raise.operation && raise.operation.label);\n if (!hasData) return;\n\n fresh[company] = fresh[company] || [];\n var existingIdx = fresh[company].findIndex(function(r) { return r.slug === slug; });\n if (existingIdx === -1) {\n fresh[company].push(raise);\n } else {\n fresh[company][existingIdx] = raise;\n }\n });\n });\n mergeIntoIndex(fresh);\n var next = doc.querySelector('.w-pagination-next');\n if (next) fetchPage(next.href);\n });\n }\n\n fetchPage(nextLink.href);\n}\n\n\n// ════════════════════════════════════════════════════════════════════════════\n// INJECTION DANS LA MODAL\n// ════════════════════════════════════════════════════════════════════════════\n\n/**\n * Clone le template [data-raise-template] pour chaque levée et injecte les données.\n */\nfunction injectRaises(modalItem, raises) {\n var template = modalItem.querySelector('[data-raise-template]');\n if (!template || !raises) return;\n\n var parent = template.parentNode;\n modalItem.querySelectorAll('[data-raise-clone]').forEach(function(el) { el.remove(); });\n\n raises.forEach(function(raise) {\n var row = template.cloneNode(true);\n row.removeAttribute('data-raise-template');\n row.setAttribute('data-raise-clone', '');\n row.style.display = '';\n\n var dataRow = row.querySelector('.data-raise-row:not([data-raises-header])');\n\n var simpleFields = {\n 'data-raise-serie': raise.serie,\n 'data-raise-date': raise.date,\n 'data-raise-amount': raise.amount,\n 'data-raise-img': raise.img\n };\n\n Object.keys(simpleFields).forEach(function(attr) {\n var cell = dataRow ? dataRow.querySelector('[' + attr + ']') : row.querySelector('[' + attr + ']');\n if (!cell) return;\n if (cell.tagName === 'IMG') {\n cell.src = simpleFields[attr] || '';\n } else {\n cell.textContent = simpleFields[attr] || '';\n }\n });\n\n // Injection operation — toujours { isTooltip, label, bubble }\n var opCell = dataRow\n ? dataRow.querySelector('[data-raise-operation]')\n : row.querySelector('[data-raise-operation]');\n if (opCell && raise.operation) {\n opCell.textContent = raise.operation.label || '';\n var tooltipTrigger = opCell.closest('[data-css-tooltip-hover]');\n if (tooltipTrigger) {\n var bubbleEl = tooltipTrigger.parentNode.querySelector('.css-tooltip-text');\n if (bubbleEl) bubbleEl.textContent = raise.operation.bubble || '';\n }\n }\n\n parent.appendChild(row);\n });\n}\n\n/**\n * Calcule la somme des montants des clones injectés dans la modal,\n * par devise, et met à jour [data-raises-total].\n * Retourne la valeur formatée.\n */\nfunction injectTotal(target) {\n var totals = {};\n target.querySelectorAll('[data-raise-clone] [data-raise-amount]').forEach(function(el) {\n var parsed = parseAmount(el.textContent);\n if (!parsed.currency || !parsed.value) return;\n totals[parsed.currency] = (totals[parsed.currency] || 0) + parsed.value;\n });\n var formatted = Object.keys(totals).map(function(c) {\n return formatAmount(totals[c], c);\n }).join(' + ') || '0';\n var totalEl = target.querySelector('[data-raises-total]');\n if (totalEl) totalEl.textContent = formatted;\n return formatted;\n}\n\n/**\n * Injecte les totaux dans les [data-raises-total] du tableau source,\n * calculés depuis raisesIndex dès que Finsweet a chargé les données.\n * À appeler après chaque mergeIntoIndex.\n */\nfunction injectTableTotals() {\n document.querySelectorAll('[data-modal-open]').forEach(function(trigger) {\n var company = (trigger.getAttribute('data-company') || '').trim().toLowerCase();\n if (!company || !window.raisesIndex[company]) return;\n\n var totalEl = trigger.querySelector('[data-raises-total]');\n if (!totalEl) return;\n\n var totals = {};\n window.raisesIndex[company].forEach(function(raise) {\n var parsed = parseAmount(raise.amount);\n if (!parsed.currency || !parsed.value) return;\n totals[parsed.currency] = (totals[parsed.currency] || 0) + parsed.value;\n });\n totalEl.textContent = Object.keys(totals).map(function(c) {\n return formatAmount(totals[c], c);\n }).join(' + ') || '0';\n });\n}\n\n\n// ════════════════════════════════════════════════════════════════════════════\n// MODAL — OUVRIR / FERMER\n// ════════════════════════════════════════════════════════════════════════════\n\n/**\n * Gère l'ouverture de la modal au clic sur [data-modal-open].\n */\nfunction handleModalOpen(e) {\n var trigger = e.target.closest('[data-modal-open]');\n if (!trigger) return;\n if (trigger.getAttribute('data-modal-open') === 'kol') return;\n\n var company = (trigger.getAttribute('data-company') || '').trim().toLowerCase();\n var triggerSlug = trigger.getAttribute('data-slug') || '';\n var isNested = !triggerSlug;\n\n var slug;\n if (isNested) {\n var slugEl = e.target.closest('[data-slug]');\n slug = (slugEl && slugEl !== trigger ? slugEl.getAttribute('data-slug') : '').trim().toLowerCase();\n } else {\n slug = triggerSlug.trim().toLowerCase();\n }\n\n if (!slug) return;\n\n document.querySelectorAll('[data-modal]:not([data-modal=\"kol\"]) [data-company]').forEach(function(item) {\n item.setAttribute('data-modal-hidden', '');\n });\n\n var target = document.querySelector('[data-modal-item=\"' + slug + '\"]');\n if (target) {\n var companyParent = target.closest('[data-company]');\n if (companyParent) {\n companyParent.removeAttribute('data-modal-hidden');\n companyParent.querySelectorAll('[data-modal-item]').forEach(function(item) {\n item.style.setProperty('display', 'none', 'important');\n });\n }\n target.style.setProperty('display', 'block', 'important');\n\n var count = companyParent\n ? companyParent.querySelectorAll('[data-modal-item]').length\n : 1;\n target.setAttribute('data-raises-count', count === 1 ? 'single' : 'multiple');\n\n var isCombined = trigger.getAttribute('combine-startup') === 'true';\n var raises = isCombined\n ? window.raisesIndex[company]\n : (window.raisesIndex[company] || []).filter(function(r) { return r.slug === slug; });\n\n injectRaises(target, raises);\n injectTotal(target);\n }\n\n window.modal.classList.add('is-open');\n document.body.style.overflow = 'hidden';\n}\n\n/**\n * Ferme la modal et restaure le scroll de la page.\n */\nfunction closeModal() {\n window.modal.classList.remove('is-open');\n document.body.style.overflow = '';\n}\n\n/**\n * Branche tous les listeners de la modal.\n */\nfunction initModalListeners() {\n document.addEventListener('click', handleModalOpen);\n\n window.modal.addEventListener('click', function(e) {\n if (e.target === window.modal || e.target === window.modal.querySelector('[data-modal-container]')) closeModal();\n });\n\n window.modal.querySelectorAll('[data-modal-close]').forEach(function(btn) {\n btn.addEventListener('click', closeModal);\n });\n\n document.addEventListener('keydown', function(e) {\n if (e.key === 'Escape' && window.modal.classList.contains('is-open')) closeModal();\n });\n}\n\n/**\n * Écoute l'event Finsweet fs-list-load pour fusionner\n * les nouveaux items chargés sans écraser les pages déjà fetchées.\n */\nfunction initFinsweetListener() {\n var observer = new MutationObserver(function(mutations) {\n var hasNewTriggers = mutations.some(function(mutation) {\n return Array.from(mutation.addedNodes).some(function(node) {\n return node.nodeType === 1 && (\n node.hasAttribute('data-modal-open') ||\n node.querySelector('[data-modal-open]')\n );\n });\n });\n\n if (!hasNewTriggers) return;\n\n clearTimeout(window._combineDebounce);\n window._combineDebounce = setTimeout(function() {\n mergeIntoIndex(buildRaisesIndex());\n applyCombineStartup();\n injectTableTotals();\n }, 10);\n });\n\n // Observe document.body pour couvrir toutes les listes Finsweet\n observer.observe(document.body, { childList: true, subtree: true });\n\n window.addEventListener('fs-list-load', function() {\n mergeIntoIndex(buildRaisesIndex());\n applyCombineStartup();\n injectTableTotals();\n });\n}\n\n\n// ════════════════════════════════════════════════════════════════════════════\n// INIT\n// ════════════════════════════════════════════════════════════════════════════\n\n/**\n * Point d'entrée principal.\n * Guard : on ne charge rien si [data-modal-open] absent de la page.\n */\nfunction initModal() {\n if (!document.querySelector('[data-modal-open]')) return;\n window.modal = document.querySelector('[data-modal]:not([data-modal=\"kol\"])');\n if (!window.modal) return;\n window.raisesIndex = buildRaisesIndex();\n applyCombineStartup();\n injectTableTotals();\n preloadAllPages();\n initFinsweetListener();\n initModalListeners();\n}\n\nwindow.addEventListener('load', initModal);\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 document.querySelector(\"[data-css-tooltip-hover]\") &&\n initMobileTooltips();\n}\ninitPageScripts();",[142],"484c801e-5908-11f1-89ce-ee650bb23af1","backup26mai.js","428fa50c-5908-11f1-a1c3-ee650bb23af1",638,["D",1779802753254],1,"/* =========================\n 📆 UPDATE 21-05-2026_15:33\n ========================= */\n\n/* =========================\n ✅ GESTION TYPEFORM (laisser en haut)\n ========================= */\n(function TypeformManager() {\n /* =========================\n CONFIG\n ========================= */\n const CONFIG = {\n iframeSelector: \".tf-v1-iframe-wrapper iframe\",\n iframeDelayMs: 400,\n };\n\n /* =========================\n HELPERS\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 const currentSrc = iframe.getAttribute(\"src\");\n let newSrc = currentSrc;\n if (params.email) {\n const sep = currentSrc.includes(\"?\") ? \"&\" : \"?\";\n newSrc = `${currentSrc}${sep}email=${params.email}`;\n }\n iframe.setAttribute(\"src\", newSrc);\n console.log(\"Updated iframe src:\", iframe.src);\n }\n\n /**\n * Ouvre le Typeform correspondant au rôle demandé.\n * Fallback sur le premier trigger trouvé si aucun rôle ne correspond.\n *\n * @param {string} role - data-tf-role du trigger (ex: \"default\", \"special\")\n * @param {string} email - email pré-rempli (optionnel)\n */\n function openTf({ role = \"\", email = \"\" } = {}) {\n const trigger =\n document.querySelector(`[OpenTf=\"trigger\"][data-tf-role=\"${role}\"]`) ??\n document.querySelectorAll('[OpenTf=\"trigger\"]')[0];\n\n if (!trigger) {\n console.warn(\n `Typeform trigger not found${role ? ` for role: ${role}` : \"\"}`,\n );\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(() => updateIframeParams({ email }), CONFIG.iframeDelayMs);\n }\n }\n\n /* =========================\n LISTENERS\n ========================= */\n\n // submit formulaire → récupère email + role depuis data-tf-role\n document.querySelectorAll('[OpenTf=\"form\"]').forEach((form) => {\n form.addEventListener(\"submit\", function (event) {\n event.preventDefault();\n const email = getEmailFromElement(form);\n const role = form.dataset.tfRole || \"\";\n openTf({ role, email });\n });\n });\n\n // clic simple → ouvre le form lié via data-tf-role\n document.querySelectorAll('[OpenTf=\"btn\"]').forEach((el) => {\n el.addEventListener(\"click\", function (event) {\n event.preventDefault();\n const role = el.dataset.tfRole || \"\";\n openTf({ role });\n });\n });\n // Exposition globale pour debug console\n window.TypeformManager = { openTf };\n})();\n\n/* =========================\n ✅ NAVBAR\n ========================= */\n\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 const slideMenu = document.querySelector(\".slide-menu\");\n\n function openMenu() {\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 mainWrapper.style.filter = \"blur(4px)\";\n mainWrapper.style.transition =\n \"filter 0.5s cubic-bezier(.165, .84, .44, 1)\";\n document.body.style.overflow = \"hidden\";\n }\n\n function closeMenu() {\n navbarMenus.forEach((menu) => {\n menu.style.display = \"none\";\n });\n backgroundNavbar.style.display = \"none\";\n backgroundNavbar.style.transform = \"translateY(-100%)\";\n mainWrapper.style.filter = \"blur(0px)\";\n document.body.style.overflow = \"\";\n }\n\n if (menuButton) {\n menuButton.addEventListener(\"click\", () => {\n setTimeout(() => {\n const atLeastOneMenuOpen = Array.from(navbarMenus).some((menu) => {\n return window.getComputedStyle(menu).display === \"flex\";\n });\n atLeastOneMenuOpen ? openMenu() : closeMenu();\n }, 50);\n });\n }\n\n if (slideMenu) {\n slideMenu.addEventListener(\"click\", (e) => {\n if (e.target === slideMenu) {\n closeMenu();\n // Simuler le clic sur menuButton pour que Webflow remette l'icône burger\n setTimeout(() => menuButton.click(), 10);\n }\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\n// Cache DOM au premier appel, évite les querySelectorAll répétés\nlet toggles = null;\nfunction getToggles() {\n if (!toggles) {\n toggles = [...document.querySelectorAll('[card-blur-tabs=\"toggle\"]')];\n }\n return toggles;\n}\n\n// Ouvre/ferme une liste via data-attribute (évite getComputedStyle)\nfunction setListOpen(list, open) {\n if (open) {\n list.style.setProperty(\"height\", \"auto\", \"important\");\n list.style.setProperty(\"overflow\", \"visible\", \"important\");\n list.style.setProperty(\"display\", \"flex\", \"important\");\n list.dataset.cbOpen = \"1\";\n } else {\n list.style.setProperty(\"height\", \"0px\", \"important\");\n list.style.setProperty(\"overflow\", \"hidden\", \"important\");\n list.style.setProperty(\"display\", \"none\", \"important\");\n delete list.dataset.cbOpen;\n }\n}\n\nfunction isListOpen(list) {\n return list.dataset.cbOpen === \"1\";\n}\n\n// Met à jour le style d'un toggle en fonction de l'état (sans setTimeout ni rAF imbriqué)\nfunction applyToggleStyle(toggle, open) {\n const dropdown = toggle.querySelector('[card-blur-tabs=\"dropdown\"]');\n const dropdownDark = toggle.querySelector('[card-blur-tabs=\"dropdown-dark\"]');\n\n // dropdown-close color\n toggle.querySelectorAll(\"[dropdown-close]\").forEach((el) => {\n const closeColor = el.getAttribute(\"dropdown-close\");\n if (!closeColor) return;\n el.style.setProperty(\"color\", open ? \"white\" : closeColor, \"important\");\n });\n\n if (dropdown) {\n const child = dropdown.children[0];\n if (child) {\n child.style.setProperty(\n \"transform\",\n open ? \"rotate(0deg)\" : \"rotate(180deg)\",\n \"important\",\n );\n }\n dropdown.style.setProperty(\"color\", open ? \"white\" : \"\", \"important\");\n dropdown.style.setProperty(\n \"background-image\",\n open ? \"none\" : \"\",\n \"important\",\n );\n }\n\n if (dropdownDark) {\n const child = dropdownDark.children[0];\n if (child) {\n child.style.setProperty(\n \"transform\",\n open ? \"rotate(0deg)\" : \"rotate(180deg)\",\n \"important\",\n );\n }\n dropdownDark.style.setProperty(\n \"background-color\",\n open ? \"#00094A\" : \"\",\n \"important\",\n );\n dropdownDark.style.setProperty(\"color\", open ? \"white\" : \"\", \"important\");\n dropdownDark.style.setProperty(\"border\", open ? \"none\" : \"\", \"important\");\n }\n}\n\nfunction resetToggleStyle(toggle) {\n const dropdown = toggle.querySelector('[card-blur-tabs=\"dropdown\"]');\n const dropdownDark = toggle.querySelector('[card-blur-tabs=\"dropdown-dark\"]');\n\n toggle.querySelectorAll(\"[dropdown-close]\").forEach((el) => {\n el.style.color = \"\";\n });\n if (dropdown) {\n const child = dropdown.children[0];\n if (child) child.style.transform = \"\";\n dropdown.style.color = \"\";\n dropdown.style.backgroundImage = \"\";\n }\n if (dropdownDark) {\n const child = dropdownDark.children[0];\n if (child) child.style.transform = \"\";\n dropdownDark.style.backgroundColor = \"\";\n dropdownDark.style.color = \"\";\n dropdownDark.style.border = \"\";\n }\n}\n\nfunction initCardBlurTabs() {\n if (!mediaQuery.matches) {\n // Desktop : reset tout\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) => {\n list.style.height = \"\";\n list.style.overflow = \"\";\n list.style.display = \"\";\n delete list.dataset.cbOpen;\n });\n getToggles().forEach(resetToggleStyle);\n return;\n }\n\n // Mobile/tablet : init état initial\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) => {\n const isFirst = list.getAttribute(\"card-blur-tabs-load\") === \"first\";\n setListOpen(list, isFirst);\n });\n\n // Sync les styles des toggles sur l'état initial\n getToggles().forEach((toggle) => {\n const lists = [\n ...toggle.parentElement.querySelectorAll('[card-blur-tabs=\"list\"]'),\n ];\n const open = lists.some(isListOpen);\n applyToggleStyle(toggle, open);\n });\n}\n\nfunction handleCardBlurTabsClick() {\n getToggles().forEach((toggle) => {\n toggle.addEventListener(\"click\", () => {\n if (!mediaQuery.matches) return;\n\n const siblingLists = [\n ...toggle.parentElement.querySelectorAll('[card-blur-tabs=\"list\"]'),\n ];\n const wasOpen = siblingLists.some(isListOpen);\n\n // Ferme tout\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) =>\n setListOpen(list, false)\n );\n // Reset les styles de tous les toggles\n getToggles().forEach((t) => applyToggleStyle(t, false));\n\n if (!wasOpen) {\n // Ouvre les listes du toggle cliqué\n siblingLists.forEach((list) => setListOpen(list, true));\n applyToggleStyle(toggle, true);\n }\n });\n });\n}\n\nmediaQuery.addEventListener(\"change\", initCardBlurTabs);\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; // délai entre chaque batch\n var FADE = 1200; // durée du fondu\n var STAGGER = 1200; // écart entre slots dans un même batch\n var BATCH = 2; // nb de slots changés par batch (fixe, plus prévisible)\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 var slotObserver = new IntersectionObserver(function (entries) {\n entries.forEach(function (entry) {\n if (entry.isIntersecting) visibleSlots.add(entry.target);\n else visibleSlots.delete(entry.target);\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 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 slotObserver.observe(slot);\n });\n\n // ── File d'attente tournante ──\n // Garantit que chaque slot visible est rafraîchi avant qu'un autre\n // repasse, puis on mélange la prochaine tournée pour varier l'ordre.\n var queue = [];\n function pickFromQueue(n) {\n var visible = Array.from(visibleSlots);\n if (visible.length === 0) return [];\n\n // Retire de la queue les slots devenus invisibles\n queue = queue.filter(function (s) {\n return visibleSlots.has(s);\n });\n\n // Complète / recharge la queue si elle est trop courte\n if (queue.length < n) {\n // Tous les slots visibles ont déjà été vus → on prépare un nouveau tour\n var remaining = visible.filter(function (s) {\n return !queue.includes(s);\n });\n queue = queue.concat(shuffle(remaining));\n }\n\n return queue.splice(0, Math.min(n, queue.length));\n }\n\n // ── Cycle batch ──\n function runBatch() {\n var picked = pickFromQueue(BATCH);\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; // force reflow\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 if (document.querySelector(\"[data-tabs-wrap]\")) {\n AutoRotateFakeTabs();\n }\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\", (e) => {\n const vid = btn.getAttribute(\"data-vimeo-lightbox-id\");\n\n // Si pas d'ID de vidéo (ex: CMS vide), on ne fait rien\n if (!vid || vid.trim() === \"\") {\n e.preventDefault();\n console.warn(\n \"⚠️ [Vimeo Lightbox] Clic ignoré : aucun ID de vidéo trouvé pour cet item CMS.\",\n );\n return;\n }\n\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 ✅ TOOLTIP MOBILE\n ========================= */\nfunction initMobileTooltips() {\n let activeTooltip = null;\n let originalParent = null;\n\n const closeActiveTooltip = () => {\n if (!activeTooltip) return;\n\n const tooltipToClose = activeTooltip;\n const parentToReturn = originalParent;\n\n console.log(\"🕒 [Tooltip] Fermeture :\", tooltipToClose);\n\n tooltipToClose.classList.remove(\"is-active\");\n document.body.style.overflow = \"\";\n\n setTimeout(() => {\n if (!tooltipToClose.classList.contains(\"is-active\")) {\n tooltipToClose.classList.remove(\"tooltip-moving\");\n // On remet la tooltip à sa place d'origine (dans le trigger ou après)\n if (parentToReturn) {\n console.log(\"♻️ [Tooltip] Retour au DOM d'origine.\");\n parentToReturn.appendChild(tooltipToClose);\n }\n }\n }, 400);\n\n activeTooltip = null;\n originalParent = null;\n };\n\n const openTooltipMobile = (tooltip, trigger) => {\n console.log(\"✨ [Tooltip] Ouverture demandée.\");\n\n if (activeTooltip) {\n closeActiveTooltip();\n }\n\n activeTooltip = tooltip;\n // On stocke le parent direct pour savoir où la remettre plus tard\n originalParent = tooltip.parentElement;\n\n document.body.style.overflow = \"hidden\";\n activeTooltip.classList.add(\"tooltip-moving\");\n document.body.appendChild(activeTooltip);\n\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n activeTooltip.classList.add(\"is-active\");\n console.log(\"🚀 [Tooltip] Animation lancée (is-active).\");\n });\n });\n };\n\n document.addEventListener(\"click\", (e) => {\n // On ne s'active que sur mobile/tablette\n if (window.innerWidth >= 768) return;\n\n const trigger = e.target.closest(\"[data-css-tooltip-hover]\");\n const clickedInsideTooltip = e.target.closest(\n \"[data-css-tooltip].is-active\",\n );\n\n // CAS 1 : Clic dans la bulle ouverte -> On ferme\n if (clickedInsideTooltip) {\n console.log(\"🖱️ [Click] Intérieur bulle -> Fermeture.\");\n closeActiveTooltip();\n return;\n }\n\n // CAS 2 : Clic sur un déclencheur\n if (trigger) {\n // Stratégie hybride pour trouver la tooltip :\n // 1. On cherche dedans (cas Pricing)\n // 2. Si rien, on cherche l'élément frère suivant (cas Décacornes)\n let tooltip = trigger.querySelector(\"[data-css-tooltip]\");\n\n if (!tooltip) {\n tooltip = trigger.nextElementSibling;\n }\n\n // Vérification finale de l'attribut\n if (!tooltip || !tooltip.hasAttribute(\"data-css-tooltip\")) {\n console.warn(\n \"⚠️ [Tooltip] Trigger détecté mais aucune bulle associée trouvée.\",\n trigger,\n );\n return;\n }\n\n console.log(\"✅ [Tooltip] Correspondance trouvée !\");\n\n if (activeTooltip === tooltip) {\n closeActiveTooltip();\n return;\n }\n\n openTooltipMobile(tooltip, trigger);\n e.preventDefault();\n return;\n }\n\n // CAS 3 : Clic n'importe où ailleurs\n if (activeTooltip) {\n console.log(\"🖱️ [Click] Extérieur -> Fermeture.\");\n closeActiveTooltip();\n }\n });\n\n console.log(\"🛠️ [System] Tooltips initialisées (Mode Hybride Activé).\");\n}\n\n// Lancement au chargement du DOM\ndocument.addEventListener(\"DOMContentLoaded\", initMobileTooltips);\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 {\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 ✅ HowTo : variant progress bar et variant opacity\n ---------------------------------------------------------- */\n\n// auto-tabs — variant 1 (progress bar)\n// Attribut déclencheur sur le wrapper : auto-tabs-wrapper-progress=\"\"\n\nfunction autoTabsProgress() {\n const wrapper = document.querySelector(\"[auto-tabs-wrapper-progress]\");\n if (!wrapper) return;\n\n const tabs = wrapper.querySelectorAll(\"[auto-tab]\");\n const images = wrapper.querySelectorAll(\"[auto-tab-image]\");\n const media = wrapper.querySelector(\"[auto-tabs-media]\");\n\n if (!tabs.length) return;\n\n const DURATION = 6000;\n\n let currentIndex = 0;\n let startTime = null;\n let animFrame = null;\n\n function injectStyles() {\n const style = document.createElement(\"style\");\n style.textContent = `\n [auto-tabs-wrapper-progress] [auto-tab] { opacity: 0.4; transition: opacity 0.4s ease; cursor: pointer; }\n [auto-tabs-wrapper-progress] [auto-tab][active] { opacity: 1; }\n [auto-tabs-wrapper-progress] [auto-tab-body] { opacity: 0; transition: opacity 0.4s ease; }\n [auto-tabs-wrapper-progress] [auto-tab-progress] { height: 2px !important; overflow: hidden; background: rgba(0, 9, 74, 0.1); }\n [auto-tabs-wrapper-progress] [auto-tab-bar] { height: 2px !important; display: block; background: #FF4920; }\n [auto-tabs-wrapper-progress] [auto-tabs-media] { position: relative; }\n [auto-tabs-wrapper-progress] [auto-tab-image] { position: absolute; inset: 0; opacity: 0; transition: opacity 0.4s ease; pointer-events: none; }\n [auto-tabs-wrapper-progress] [auto-tab-image][active] { opacity: 1; pointer-events: auto; }\n `;\n document.head.appendChild(style);\n }\n\n function setMediaHeight() {\n if (!media || !images.length) return;\n\n const firstImg = images[0];\n\n function applyHeight() {\n images.forEach(function (img) { img.style.display = \"block\"; });\n const height = images[0].offsetHeight;\n images.forEach(function (img) { img.style.display = \"\"; });\n if (height > 0) media.style.height = height + \"px\";\n }\n\n if (firstImg.complete && firstImg.naturalHeight > 0) {\n applyHeight();\n } else {\n firstImg.addEventListener(\"load\", applyHeight, { once: true });\n }\n }\n\n function setActive(index) {\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) { body.style.display = \"none\"; body.style.opacity = \"0\"; }\n if (number) number.style.color = \"\";\n });\n\n images.forEach(function (img) { img.removeAttribute(\"active\"); });\n\n const activeTab = wrapper.querySelector('[auto-tab][tab-index=\"' + index + '\"]');\n const activeImg = wrapper.querySelector('[auto-tab-image][tab-index=\"' + index + '\"]');\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 requestAnimationFrame(function () { body.style.opacity = \"1\"; });\n }\n }\n\n if (activeImg) activeImg.setAttribute(\"active\", \"\");\n\n currentIndex = index;\n startTime = null;\n cancelAnimationFrame(animFrame);\n animFrame = requestAnimationFrame(animate);\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 = wrapper.querySelector('[auto-tab][tab-index=\"' + currentIndex + '\"]');\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 setActive((currentIndex + 1) % tabs.length);\n }\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 injectStyles();\n setMediaHeight();\n window.addEventListener(\"resize\", setMediaHeight);\n setActive(0);\n}\n\nautoTabsProgress();\n// auto-tabs — variant 2 (opacity only)\n// Attribut déclencheur sur le wrapper : auto-tabs-wrapper-opacity=\"\"\n\nfunction autoTabsOpacity() {\n const wrapper = document.querySelector(\"[auto-tabs-wrapper-opacity]\");\n if (!wrapper) return;\n\n const tabs = wrapper.querySelectorAll(\"[auto-tab]\");\n const images = wrapper.querySelectorAll(\"[auto-tab-image]\");\n const media = wrapper.querySelector(\"[auto-tabs-media]\");\n\n if (!tabs.length) return;\n\n const DURATION = 6000;\n\n let currentIndex = 0;\n let timer = null;\n\n function injectStyles() {\n const style = document.createElement(\"style\");\n style.textContent = `\n [auto-tabs-wrapper-opacity] [auto-tab] { opacity: 0.3; transition: opacity 0.4s ease; cursor: pointer; }\n [auto-tabs-wrapper-opacity] [auto-tab][active] { opacity: 1; }\n [auto-tabs-wrapper-opacity] [auto-tab-body] { opacity: 1 !important; display: block !important; }\n [auto-tabs-wrapper-opacity] [auto-tabs-media] { position: relative; }\n [auto-tabs-wrapper-opacity] [auto-tab-image] { position: absolute; inset: 0; opacity: 0; transition: opacity 0.4s ease; pointer-events: none; }\n [auto-tabs-wrapper-opacity] [auto-tab-image][active] { opacity: 1; pointer-events: auto; }\n `;\n document.head.appendChild(style);\n }\n\n function setMediaHeight() {\n if (!media || !images.length) return;\n\n const firstImg = images[0];\n\n function applyHeight() {\n images.forEach(function (img) { img.style.display = \"block\"; });\n const height = images[0].offsetHeight;\n images.forEach(function (img) { img.style.display = \"\"; });\n if (height > 0) media.style.height = height + \"px\";\n }\n\n if (firstImg.complete && firstImg.naturalHeight > 0) {\n applyHeight();\n } else {\n firstImg.addEventListener(\"load\", applyHeight, { once: true });\n }\n }\n\n function setActive(index) {\n tabs.forEach(function (tab) {\n tab.removeAttribute(\"active\");\n const number = tab.querySelector(\"[auto-tab-number]\");\n if (number) number.style.color = \"\";\n });\n\n images.forEach(function (img) { img.removeAttribute(\"active\"); });\n\n const activeTab = wrapper.querySelector('[auto-tab][tab-index=\"' + index + '\"]');\n const activeImg = wrapper.querySelector('[auto-tab-image][tab-index=\"' + index + '\"]');\n\n if (activeTab) {\n activeTab.setAttribute(\"active\", \"\");\n const number = activeTab.querySelector(\"[auto-tab-number]\");\n if (number) number.style.color = \"#FF4920\";\n }\n\n if (activeImg) activeImg.setAttribute(\"active\", \"\");\n\n currentIndex = index;\n clearTimeout(timer);\n timer = setTimeout(function () {\n setActive((currentIndex + 1) % tabs.length);\n }, DURATION);\n }\n\n tabs.forEach(function (tab) {\n tab.addEventListener(\"click\", function () {\n clearTimeout(timer);\n setActive(parseInt(tab.getAttribute(\"tab-index\")));\n });\n });\n\n injectStyles();\n setMediaHeight();\n window.addEventListener(\"resize\", setMediaHeight);\n setActive(0);\n}\n\nautoTabsOpacity();\n\n // ════════════════════════════════════════════════════════════════════════════\n // MODALE LEVÉES TABLE\n // ════════════════════════════════════════════════════════════════════════════\n\nwindow.raisesIndex = {};\nwindow.modal;\n\n\n// ════════════════════════════════════════════════════════════════════════════\n// UTILITAIRES\n// ════════════════════════════════════════════════════════════════════════════\n\n/**\n * Lit la valeur d'un attribut data sur un élément ou son enfant.\n * Ordre de priorité :\n * 1. Valeur de l'attribut non vide sur root lui-même\n * 2. Valeur de l'attribut non vide sur un descendant\n * 3. src si IMG | textContent si badge | objet tooltip | textContent simple\n *\n * Note : ne pas utiliser pour data-raise-operation — utiliser readOperationAttr.\n */\nfunction readAttr(root, attr) {\n if (root.hasAttribute(attr)) {\n var rootVal = root.getAttribute(attr);\n if (rootVal) return rootVal;\n }\n\n var child = root.querySelector('[' + attr + ']');\n if (!child) return '';\n\n var attrVal = child.getAttribute(attr);\n if (attrVal) return attrVal;\n\n if (child.tagName === 'IMG') return child.src || '';\n\n var badgeWrapper = child.closest('.perf-badge-wrapper');\n if (badgeWrapper) return child.textContent.trim();\n\n // Le .css-tooltip-text est dans le parentNode du [data-css-tooltip-hover]\n var tooltipTrigger = child.closest('[data-css-tooltip-hover]');\n if (tooltipTrigger) {\n var bubbleText = tooltipTrigger.parentNode.querySelector('.css-tooltip-text');\n return {\n isTooltip: true,\n label: child.textContent.trim(),\n bubble: bubbleText ? bubbleText.textContent.trim() : ''\n };\n }\n\n return child.textContent.trim();\n}\n\n/**\n * Lit data-raise-operation et normalise toujours vers { isTooltip, label, bubble }.\n * Couvre les deux structures :\n * — Tableau 1 : valeur dans textContent, [data-css-tooltip-hover] sans valeur d'attribut\n * → readAttr retourne un objet isTooltip avec le bubble\n * — Tableau 2 : valeur dans l'attribut lui-même (data-raise-operation=\"PSFP\")\n * → readAttr retourne une string ; on cherche le bubble via parentNode\n */\nfunction readOperationAttr(root) {\n var raw = readAttr(root, 'data-raise-operation');\n\n if (raw && typeof raw === 'object' && raw.isTooltip) return raw;\n\n var label = raw || '';\n var tooltipEl = root.querySelector('[data-css-tooltip-hover]');\n var bubble = '';\n if (tooltipEl) {\n var bubbleEl = tooltipEl.parentNode.querySelector('.css-tooltip-text');\n if (bubbleEl) bubble = bubbleEl.textContent.trim();\n }\n return { isTooltip: true, label: label, bubble: bubble };\n}\n\n/**\n * Parse un montant formaté vers des millions (Float) + détecte la devise.\n * Formats acceptés : \"22,1M€\" | \"500K€\" | \"1,2Md€\" | \"$4,3M\" | \"$500K\"\n * Retourne { value: Float, currency: '€' | '$' | '' }\n */\nfunction parseAmount(str) {\n if (!str || typeof str !== 'string') return { value: 0, currency: '' };\n var s = str.trim().replace(',', '.');\n var currency = s.indexOf('$') !== -1 ? '$' : s.indexOf('€') !== -1 ? '€' : '';\n var num = parseFloat(s.replace(/[^0-9.]/g, ''));\n if (isNaN(num)) return { value: 0, currency: currency };\n var value = s.indexOf('Md') !== -1 ? num * 1000\n : s.indexOf('K') !== -1 ? num / 1000\n : num;\n return { value: value, currency: currency };\n}\n\n/**\n * Formate un total en millions vers la meilleure unité lisible.\n * Préfixe $ ou suffixe € selon la devise.\n * < 1M → K | 1-999M → M | >= 1000M → Md\n */\nfunction formatAmount(totalM, currency) {\n var c = currency || '€';\n var num;\n if (totalM >= 1000) num = (totalM / 1000).toFixed(1).replace('.', ',').replace(',0', '') + 'Md';\n else if (totalM >= 1) num = totalM.toFixed(1).replace('.', ',').replace(',0', '') + 'M';\n else num = Math.round(totalM * 1000) + 'K';\n return num + c;\n}\n\n/**\n * Calcule les totaux par devise depuis un tableau de levées\n * et retourne la chaîne formatée (ex: \"4,3M€ + 2M$\").\n */\nfunction computeTotals(raises) {\n var totals = {};\n raises.forEach(function(raise) {\n var parsed = parseAmount(raise.amount || raise.textContent || '');\n if (!parsed.currency || !parsed.value) return;\n totals[parsed.currency] = (totals[parsed.currency] || 0) + parsed.value;\n });\n return Object.keys(totals).map(function(c) {\n return formatAmount(totals[c], c);\n }).join(' + ') || '0';\n}\n\n\n// ════════════════════════════════════════════════════════════════════════════\n// INDEX DES LEVÉES\n// ════════════════════════════════════════════════════════════════════════════\n\n/**\n * Parcourt tous les [data-modal-open] et construit\n * un index { companySlug: [{ slug, serie, operation, date, amount, img }, ...] }.\n *\n * Guard hasData : ignore les items dont tous les champs sont vides.\n * Cause : Finsweet injecte le contenu CMS après le load initial — les\n * [data-slug] existent dans le DOM mais sont vides au premier passage.\n */\nfunction buildRaisesIndex() {\n var index = {};\n document.querySelectorAll('[data-modal-open]').forEach(function(trigger) {\n var company = (trigger.getAttribute('data-company') || '').trim().toLowerCase();\n if (!company) return;\n\n var triggerSlug = trigger.getAttribute('data-slug') || '';\n var isNested = !triggerSlug;\n\n var items = isNested\n ? Array.from(trigger.querySelectorAll('[data-slug]'))\n : [trigger];\n\n items.forEach(function(item) {\n var slug = (item.getAttribute('data-slug') || triggerSlug).trim().toLowerCase();\n if (!slug) return;\n\n var raise = {\n slug: slug,\n serie: readAttr(item, 'data-raise-serie'),\n operation: readOperationAttr(item),\n date: readAttr(item, 'data-raise-date'),\n amount: readAttr(item, 'data-raise-amount'),\n img: readAttr(item, 'data-raise-img')\n };\n\n var hasData = raise.serie || raise.date || raise.amount || raise.img\n || (raise.operation && raise.operation.label);\n if (!hasData) return;\n\n index[company] = index[company] || [];\n var existingIdx = index[company].findIndex(function(r) { return r.slug === slug; });\n if (existingIdx === -1) {\n index[company].push(raise);\n } else {\n index[company][existingIdx] = raise;\n }\n });\n });\n return index;\n}\n\n/**\n * Fusionne un nouvel index partiel dans raisesIndex.\n * Remplace une entrée existante si la nouvelle a des données.\n */\nfunction mergeIntoIndex(fresh) {\n Object.keys(fresh).forEach(function(company) {\n fresh[company].forEach(function(raise) {\n window.raisesIndex[company] = window.raisesIndex[company] || [];\n var existingIdx = window.raisesIndex[company].findIndex(function(r) {\n return r.slug === raise.slug;\n });\n if (existingIdx === -1) {\n window.raisesIndex[company].push(raise);\n } else {\n window.raisesIndex[company][existingIdx] = raise;\n }\n });\n });\n}\n\n/**\n * Pour les items [combine-startup=\"true\"] :\n * — Garde visible uniquement le premier [data-slug] descendant\n * — Masque les suivants (mais ils restent dans l'index pour la modal)\n */\nfunction applyCombineStartup() {\n var seen = {};\n document.querySelectorAll('[data-modal-open][combine-startup=\"true\"]').forEach(function(trigger) {\n var company = (trigger.getAttribute('data-company') || '').trim().toLowerCase();\n if (!company) return;\n var slugItems = trigger.querySelectorAll('[data-slug]');\n slugItems.forEach(function(child) {\n if (!seen[company]) {\n // Premier slug de ce company tous triggers confondus — visible\n seen[company] = true;\n child.style.removeProperty('display');\n } else {\n // Tous les suivants — masqués\n child.style.setProperty('display', 'none', 'important');\n }\n });\n });\n}\n\n/**\n * Charge toutes les pages suivantes en arrière-plan via fetch\n * pour compléter raisesIndex avec les items hors page courante.\n */\nfunction preloadAllPages() {\n var nextLink = document.querySelector('.w-pagination-next');\n if (!nextLink) return;\n\n function fetchPage(url) {\n fetch(url).then(function(r) { return r.text(); }).then(function(html) {\n var doc = new DOMParser().parseFromString(html, 'text/html');\n var fresh = {};\n doc.querySelectorAll('[data-modal-open]').forEach(function(trigger) {\n var company = (trigger.getAttribute('data-company') || '').trim().toLowerCase();\n if (!company) return;\n var triggerSlug = trigger.getAttribute('data-slug') || '';\n var isNested = !triggerSlug;\n\n var items = isNested\n ? Array.from(trigger.querySelectorAll('[data-slug]'))\n : [trigger];\n\n items.forEach(function(item) {\n var slug = (item.getAttribute('data-slug') || triggerSlug).trim().toLowerCase();\n if (!slug) return;\n\n var raise = {\n slug: slug,\n serie: readAttr(item, 'data-raise-serie'),\n operation: readOperationAttr(item),\n date: readAttr(item, 'data-raise-date'),\n amount: readAttr(item, 'data-raise-amount'),\n img: readAttr(item, 'data-raise-img')\n };\n\n var hasData = raise.serie || raise.date || raise.amount || raise.img\n || (raise.operation && raise.operation.label);\n if (!hasData) return;\n\n fresh[company] = fresh[company] || [];\n var existingIdx = fresh[company].findIndex(function(r) { return r.slug === slug; });\n if (existingIdx === -1) {\n fresh[company].push(raise);\n } else {\n fresh[company][existingIdx] = raise;\n }\n });\n });\n mergeIntoIndex(fresh);\n var next = doc.querySelector('.w-pagination-next');\n if (next) fetchPage(next.href);\n });\n }\n\n fetchPage(nextLink.href);\n}\n\n\n// ════════════════════════════════════════════════════════════════════════════\n// INJECTION DANS LA MODAL\n// ════════════════════════════════════════════════════════════════════════════\n\n/**\n * Clone le template [data-raise-template] pour chaque levée et injecte les données.\n */\nfunction injectRaises(modalItem, raises) {\n var template = modalItem.querySelector('[data-raise-template]');\n if (!template || !raises) return;\n\n var parent = template.parentNode;\n modalItem.querySelectorAll('[data-raise-clone]').forEach(function(el) { el.remove(); });\n\n raises.forEach(function(raise) {\n var row = template.cloneNode(true);\n row.removeAttribute('data-raise-template');\n row.setAttribute('data-raise-clone', '');\n row.style.display = '';\n\n var dataRow = row.querySelector('.data-raise-row:not([data-raises-header])');\n\n var simpleFields = {\n 'data-raise-serie': raise.serie,\n 'data-raise-date': raise.date,\n 'data-raise-amount': raise.amount,\n 'data-raise-img': raise.img\n };\n\n Object.keys(simpleFields).forEach(function(attr) {\n var cell = dataRow ? dataRow.querySelector('[' + attr + ']') : row.querySelector('[' + attr + ']');\n if (!cell) return;\n if (cell.tagName === 'IMG') {\n cell.src = simpleFields[attr] || '';\n } else {\n cell.textContent = simpleFields[attr] || '';\n }\n });\n\n // Injection operation — toujours { isTooltip, label, bubble }\n var opCell = dataRow\n ? dataRow.querySelector('[data-raise-operation]')\n : row.querySelector('[data-raise-operation]');\n if (opCell && raise.operation) {\n opCell.textContent = raise.operation.label || '';\n var tooltipTrigger = opCell.closest('[data-css-tooltip-hover]');\n if (tooltipTrigger) {\n var bubbleEl = tooltipTrigger.parentNode.querySelector('.css-tooltip-text');\n if (bubbleEl) bubbleEl.textContent = raise.operation.bubble || '';\n }\n }\n\n parent.appendChild(row);\n });\n}\n\n/**\n * Calcule la somme des montants des clones injectés dans la modal,\n * par devise, et met à jour [data-raises-total].\n * Retourne la valeur formatée.\n */\nfunction injectTotal(target) {\n var totals = {};\n target.querySelectorAll('[data-raise-clone] [data-raise-amount]').forEach(function(el) {\n var parsed = parseAmount(el.textContent);\n if (!parsed.currency || !parsed.value) return;\n totals[parsed.currency] = (totals[parsed.currency] || 0) + parsed.value;\n });\n var formatted = Object.keys(totals).map(function(c) {\n return formatAmount(totals[c], c);\n }).join(' + ') || '0';\n var totalEl = target.querySelector('[data-raises-total]');\n if (totalEl) totalEl.textContent = formatted;\n return formatted;\n}\n\n/**\n * Injecte les totaux dans les [data-raises-total] du tableau source,\n * calculés depuis raisesIndex dès que Finsweet a chargé les données.\n * À appeler après chaque mergeIntoIndex.\n */\nfunction injectTableTotals() {\n document.querySelectorAll('[data-modal-open]').forEach(function(trigger) {\n var company = (trigger.getAttribute('data-company') || '').trim().toLowerCase();\n if (!company || !window.raisesIndex[company]) return;\n\n var totalEl = trigger.querySelector('[data-raises-total]');\n if (!totalEl) return;\n\n var totals = {};\n window.raisesIndex[company].forEach(function(raise) {\n var parsed = parseAmount(raise.amount);\n if (!parsed.currency || !parsed.value) return;\n totals[parsed.currency] = (totals[parsed.currency] || 0) + parsed.value;\n });\n totalEl.textContent = Object.keys(totals).map(function(c) {\n return formatAmount(totals[c], c);\n }).join(' + ') || '0';\n });\n}\n\n\n// ════════════════════════════════════════════════════════════════════════════\n// MODAL — OUVRIR / FERMER\n// ════════════════════════════════════════════════════════════════════════════\n\n/**\n * Gère l'ouverture de la modal au clic sur [data-modal-open].\n */\nfunction handleModalOpen(e) {\n var trigger = e.target.closest('[data-modal-open]');\n if (!trigger) return;\n // Guard : ignorer les triggers de kol\n if (trigger.getAttribute('data-modal-open') === 'kol') return;\n\n var company = (trigger.getAttribute('data-company') || '').trim().toLowerCase();\n var triggerSlug = trigger.getAttribute('data-slug') || '';\n var isNested = !triggerSlug;\n\n var slug;\n if (isNested) {\n var slugEl = e.target.closest('[data-slug]');\n slug = (slugEl && slugEl !== trigger ? slugEl.getAttribute('data-slug') : '').trim().toLowerCase();\n } else {\n slug = triggerSlug.trim().toLowerCase();\n }\n\n if (!slug) return;\n\n document.querySelectorAll('[data-modal]:not([data-modal=\"kol\"]) [data-company]').forEach(function(item) {\n item.setAttribute('data-modal-hidden', '');\n });\n\n var target = document.querySelector('[data-modal-item=\"' + slug + '\"]');\n if (target) {\n var companyParent = target.closest('[data-company]');\n if (companyParent) {\n companyParent.removeAttribute('data-modal-hidden');\n companyParent.querySelectorAll('[data-modal-item]').forEach(function(item) {\n item.style.setProperty('display', 'none', 'important');\n });\n }\n target.style.setProperty('display', 'block', 'important');\n\n var count = companyParent\n ? companyParent.querySelectorAll('[data-modal-item]').length\n : 1;\n target.setAttribute('data-raises-count', count === 1 ? 'single' : 'multiple');\n\n var isCombined = trigger.getAttribute('combine-startup') === 'true';\n var raises = isCombined\n ? window.raisesIndex[company]\n : (window.raisesIndex[company] || []).filter(function(r) { return r.slug === slug; });\n\n injectRaises(target, raises);\n injectTotal(target);\n }\n\n window.modal.classList.add('is-open');\n document.body.style.overflow = 'hidden';\n}\n\n/**\n * Ferme la modal et restaure le scroll de la page.\n */\nfunction closeModal() {\n window.modal.classList.remove('is-open');\n document.body.style.overflow = '';\n}\n\n/**\n * Branche tous les listeners de la modal.\n */\nfunction initModalListeners() {\n document.addEventListener('click', handleModalOpen);\n\n window.modal.addEventListener('click', function(e) {\n if (e.target === window.modal || e.target === window.modal.querySelector('[data-modal-container]')) closeModal();\n });\n\n window.modal.querySelectorAll('[data-modal-close]').forEach(function(btn) {\n btn.addEventListener('click', closeModal);\n });\n\n document.addEventListener('keydown', function(e) {\n if (e.key === 'Escape' && window.modal.classList.contains('is-open')) closeModal();\n });\n}\n\n/**\n * Écoute l'event Finsweet fs-list-load pour fusionner\n * les nouveaux items chargés sans écraser les pages déjà fetchées.\n */\nfunction initFinsweetListener() {\n window.addEventListener('fs-list-load', function() {\n mergeIntoIndex(buildRaisesIndex());\n applyCombineStartup();\n injectTableTotals();\n });\n}\n\n\n// ════════════════════════════════════════════════════════════════════════════\n// INIT MODALE\n// ════════════════════════════════════════════════════════════════════════════\n\n/**\n * Point d'entrée principal.\n * Guard : on ne charge rien si [data-modal-open] absent de la page.\n */\nfunction initModal() {\n if (!document.querySelector('[data-modal-open]')) return;\n window.modal = document.querySelector('[data-modal]:not([data-modal=\"kol\"])');\n if (!window.modal) return;\n window.raisesIndex = buildRaisesIndex();\n applyCombineStartup();\n injectTableTotals();\n preloadAllPages();\n initFinsweetListener();\n initModalListeners();\n}\n\nwindow.addEventListener('load', initModal);\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 document.querySelector(\"[data-css-tooltip-hover]\") &&\n initMobileTooltips();\n}\ninitPageScripts();",[150],"4082cb88-55aa-11f1-8cec-ee650bb23af1","backup-3avril.js","a714f900-2f55-11f1-90ee-42dde27851f2",566,["D",1779432513993],2,"/* =========================\n 📆 UPDATE 21-05-2026_15:33\n ========================= */\n\n/* =========================\n ✅ GESTION TYPEFORM (laisser en haut)\n ========================= */\n(function TypeformManager() {\n /* =========================\n CONFIG\n ========================= */\n const CONFIG = {\n iframeSelector: \".tf-v1-iframe-wrapper iframe\",\n iframeDelayMs: 400,\n };\n\n /* =========================\n HELPERS\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 const currentSrc = iframe.getAttribute(\"src\");\n let newSrc = currentSrc;\n if (params.email) {\n const sep = currentSrc.includes(\"?\") ? \"&\" : \"?\";\n newSrc = `${currentSrc}${sep}email=${params.email}`;\n }\n iframe.setAttribute(\"src\", newSrc);\n console.log(\"Updated iframe src:\", iframe.src);\n }\n\n /**\n * Ouvre le Typeform correspondant au rôle demandé.\n * Fallback sur le premier trigger trouvé si aucun rôle ne correspond.\n *\n * @param {string} role - data-tf-role du trigger (ex: \"default\", \"special\")\n * @param {string} email - email pré-rempli (optionnel)\n */\n function openTf({ role = \"\", email = \"\" } = {}) {\n const trigger =\n document.querySelector(`[OpenTf=\"trigger\"][data-tf-role=\"${role}\"]`) ??\n document.querySelectorAll('[OpenTf=\"trigger\"]')[0];\n\n if (!trigger) {\n console.warn(\n `Typeform trigger not found${role ? ` for role: ${role}` : \"\"}`,\n );\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(() => updateIframeParams({ email }), CONFIG.iframeDelayMs);\n }\n }\n\n /* =========================\n LISTENERS\n ========================= */\n\n // submit formulaire → récupère email + role depuis data-tf-role\n document.querySelectorAll('[OpenTf=\"form\"]').forEach((form) => {\n form.addEventListener(\"submit\", function (event) {\n event.preventDefault();\n const email = getEmailFromElement(form);\n const role = form.dataset.tfRole || \"\";\n openTf({ role, email });\n });\n });\n\n // clic simple → ouvre le form lié via data-tf-role\n document.querySelectorAll('[OpenTf=\"btn\"]').forEach((el) => {\n el.addEventListener(\"click\", function (event) {\n event.preventDefault();\n const role = el.dataset.tfRole || \"\";\n openTf({ role });\n });\n });\n // Exposition globale pour debug console\n window.TypeformManager = { openTf };\n})();\n\n/* =========================\n ✅ NAVBAR\n ========================= */\n\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 const slideMenu = document.querySelector(\".slide-menu\");\n\n function openMenu() {\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 mainWrapper.style.filter = \"blur(4px)\";\n mainWrapper.style.transition =\n \"filter 0.5s cubic-bezier(.165, .84, .44, 1)\";\n document.body.style.overflow = \"hidden\";\n }\n\n function closeMenu() {\n navbarMenus.forEach((menu) => {\n menu.style.display = \"none\";\n });\n backgroundNavbar.style.display = \"none\";\n backgroundNavbar.style.transform = \"translateY(-100%)\";\n mainWrapper.style.filter = \"blur(0px)\";\n document.body.style.overflow = \"\";\n }\n\n if (menuButton) {\n menuButton.addEventListener(\"click\", () => {\n setTimeout(() => {\n const atLeastOneMenuOpen = Array.from(navbarMenus).some((menu) => {\n return window.getComputedStyle(menu).display === \"flex\";\n });\n atLeastOneMenuOpen ? openMenu() : closeMenu();\n }, 50);\n });\n }\n\n if (slideMenu) {\n slideMenu.addEventListener(\"click\", (e) => {\n if (e.target === slideMenu) {\n closeMenu();\n // Simuler le clic sur menuButton pour que Webflow remette l'icône burger\n setTimeout(() => menuButton.click(), 10);\n }\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\n// Cache DOM au premier appel, évite les querySelectorAll répétés\nlet toggles = null;\nfunction getToggles() {\n if (!toggles) {\n toggles = [...document.querySelectorAll('[card-blur-tabs=\"toggle\"]')];\n }\n return toggles;\n}\n\n// Ouvre/ferme une liste via data-attribute (évite getComputedStyle)\nfunction setListOpen(list, open) {\n if (open) {\n list.style.setProperty(\"height\", \"auto\", \"important\");\n list.style.setProperty(\"overflow\", \"visible\", \"important\");\n list.style.setProperty(\"display\", \"flex\", \"important\");\n list.dataset.cbOpen = \"1\";\n } else {\n list.style.setProperty(\"height\", \"0px\", \"important\");\n list.style.setProperty(\"overflow\", \"hidden\", \"important\");\n list.style.setProperty(\"display\", \"none\", \"important\");\n delete list.dataset.cbOpen;\n }\n}\n\nfunction isListOpen(list) {\n return list.dataset.cbOpen === \"1\";\n}\n\n// Met à jour le style d'un toggle en fonction de l'état (sans setTimeout ni rAF imbriqué)\nfunction applyToggleStyle(toggle, open) {\n const dropdown = toggle.querySelector('[card-blur-tabs=\"dropdown\"]');\n const dropdownDark = toggle.querySelector('[card-blur-tabs=\"dropdown-dark\"]');\n\n // dropdown-close color\n toggle.querySelectorAll(\"[dropdown-close]\").forEach((el) => {\n const closeColor = el.getAttribute(\"dropdown-close\");\n if (!closeColor) return;\n el.style.setProperty(\"color\", open ? \"white\" : closeColor, \"important\");\n });\n\n if (dropdown) {\n const child = dropdown.children[0];\n if (child) {\n child.style.setProperty(\n \"transform\",\n open ? \"rotate(0deg)\" : \"rotate(180deg)\",\n \"important\",\n );\n }\n dropdown.style.setProperty(\"color\", open ? \"white\" : \"\", \"important\");\n dropdown.style.setProperty(\n \"background-image\",\n open ? \"none\" : \"\",\n \"important\",\n );\n }\n\n if (dropdownDark) {\n const child = dropdownDark.children[0];\n if (child) {\n child.style.setProperty(\n \"transform\",\n open ? \"rotate(0deg)\" : \"rotate(180deg)\",\n \"important\",\n );\n }\n dropdownDark.style.setProperty(\n \"background-color\",\n open ? \"#00094A\" : \"\",\n \"important\",\n );\n dropdownDark.style.setProperty(\"color\", open ? \"white\" : \"\", \"important\");\n dropdownDark.style.setProperty(\"border\", open ? \"none\" : \"\", \"important\");\n }\n}\n\nfunction resetToggleStyle(toggle) {\n const dropdown = toggle.querySelector('[card-blur-tabs=\"dropdown\"]');\n const dropdownDark = toggle.querySelector('[card-blur-tabs=\"dropdown-dark\"]');\n\n toggle.querySelectorAll(\"[dropdown-close]\").forEach((el) => {\n el.style.color = \"\";\n });\n if (dropdown) {\n const child = dropdown.children[0];\n if (child) child.style.transform = \"\";\n dropdown.style.color = \"\";\n dropdown.style.backgroundImage = \"\";\n }\n if (dropdownDark) {\n const child = dropdownDark.children[0];\n if (child) child.style.transform = \"\";\n dropdownDark.style.backgroundColor = \"\";\n dropdownDark.style.color = \"\";\n dropdownDark.style.border = \"\";\n }\n}\n\nfunction initCardBlurTabs() {\n if (!mediaQuery.matches) {\n // Desktop : reset tout\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) => {\n list.style.height = \"\";\n list.style.overflow = \"\";\n list.style.display = \"\";\n delete list.dataset.cbOpen;\n });\n getToggles().forEach(resetToggleStyle);\n return;\n }\n\n // Mobile/tablet : init état initial\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) => {\n const isFirst = list.getAttribute(\"card-blur-tabs-load\") === \"first\";\n setListOpen(list, isFirst);\n });\n\n // Sync les styles des toggles sur l'état initial\n getToggles().forEach((toggle) => {\n const lists = [\n ...toggle.parentElement.querySelectorAll('[card-blur-tabs=\"list\"]'),\n ];\n const open = lists.some(isListOpen);\n applyToggleStyle(toggle, open);\n });\n}\n\nfunction handleCardBlurTabsClick() {\n getToggles().forEach((toggle) => {\n toggle.addEventListener(\"click\", () => {\n if (!mediaQuery.matches) return;\n\n const siblingLists = [\n ...toggle.parentElement.querySelectorAll('[card-blur-tabs=\"list\"]'),\n ];\n const wasOpen = siblingLists.some(isListOpen);\n\n // Ferme tout\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) =>\n setListOpen(list, false)\n );\n // Reset les styles de tous les toggles\n getToggles().forEach((t) => applyToggleStyle(t, false));\n\n if (!wasOpen) {\n // Ouvre les listes du toggle cliqué\n siblingLists.forEach((list) => setListOpen(list, true));\n applyToggleStyle(toggle, true);\n }\n });\n });\n}\n\nmediaQuery.addEventListener(\"change\", initCardBlurTabs);\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; // délai entre chaque batch\n var FADE = 1200; // durée du fondu\n var STAGGER = 1200; // écart entre slots dans un même batch\n var BATCH = 2; // nb de slots changés par batch (fixe, plus prévisible)\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 var slotObserver = new IntersectionObserver(function (entries) {\n entries.forEach(function (entry) {\n if (entry.isIntersecting) visibleSlots.add(entry.target);\n else visibleSlots.delete(entry.target);\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 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 slotObserver.observe(slot);\n });\n\n // ── File d'attente tournante ──\n // Garantit que chaque slot visible est rafraîchi avant qu'un autre\n // repasse, puis on mélange la prochaine tournée pour varier l'ordre.\n var queue = [];\n function pickFromQueue(n) {\n var visible = Array.from(visibleSlots);\n if (visible.length === 0) return [];\n\n // Retire de la queue les slots devenus invisibles\n queue = queue.filter(function (s) {\n return visibleSlots.has(s);\n });\n\n // Complète / recharge la queue si elle est trop courte\n if (queue.length < n) {\n // Tous les slots visibles ont déjà été vus → on prépare un nouveau tour\n var remaining = visible.filter(function (s) {\n return !queue.includes(s);\n });\n queue = queue.concat(shuffle(remaining));\n }\n\n return queue.splice(0, Math.min(n, queue.length));\n }\n\n // ── Cycle batch ──\n function runBatch() {\n var picked = pickFromQueue(BATCH);\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; // force reflow\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 if (document.querySelector(\"[data-tabs-wrap]\")) {\n AutoRotateFakeTabs();\n }\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\", (e) => {\n const vid = btn.getAttribute(\"data-vimeo-lightbox-id\");\n\n // Si pas d'ID de vidéo (ex: CMS vide), on ne fait rien\n if (!vid || vid.trim() === \"\") {\n e.preventDefault();\n console.warn(\n \"⚠️ [Vimeo Lightbox] Clic ignoré : aucun ID de vidéo trouvé pour cet item CMS.\",\n );\n return;\n }\n\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 ✅ TOOLTIP MOBILE\n ========================= */\nfunction initMobileTooltips() {\n let activeTooltip = null;\n let originalParent = null;\n\n const closeActiveTooltip = () => {\n if (!activeTooltip) return;\n\n const tooltipToClose = activeTooltip;\n const parentToReturn = originalParent;\n\n console.log(\"🕒 [Tooltip] Fermeture :\", tooltipToClose);\n\n tooltipToClose.classList.remove(\"is-active\");\n document.body.style.overflow = \"\";\n\n setTimeout(() => {\n if (!tooltipToClose.classList.contains(\"is-active\")) {\n tooltipToClose.classList.remove(\"tooltip-moving\");\n // On remet la tooltip à sa place d'origine (dans le trigger ou après)\n if (parentToReturn) {\n console.log(\"♻️ [Tooltip] Retour au DOM d'origine.\");\n parentToReturn.appendChild(tooltipToClose);\n }\n }\n }, 400);\n\n activeTooltip = null;\n originalParent = null;\n };\n\n const openTooltipMobile = (tooltip, trigger) => {\n console.log(\"✨ [Tooltip] Ouverture demandée.\");\n\n if (activeTooltip) {\n closeActiveTooltip();\n }\n\n activeTooltip = tooltip;\n // On stocke le parent direct pour savoir où la remettre plus tard\n originalParent = tooltip.parentElement;\n\n document.body.style.overflow = \"hidden\";\n activeTooltip.classList.add(\"tooltip-moving\");\n document.body.appendChild(activeTooltip);\n\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n activeTooltip.classList.add(\"is-active\");\n console.log(\"🚀 [Tooltip] Animation lancée (is-active).\");\n });\n });\n };\n\n document.addEventListener(\"click\", (e) => {\n // On ne s'active que sur mobile/tablette\n if (window.innerWidth >= 768) return;\n\n const trigger = e.target.closest(\"[data-css-tooltip-hover]\");\n const clickedInsideTooltip = e.target.closest(\n \"[data-css-tooltip].is-active\",\n );\n\n // CAS 1 : Clic dans la bulle ouverte -> On ferme\n if (clickedInsideTooltip) {\n console.log(\"🖱️ [Click] Intérieur bulle -> Fermeture.\");\n closeActiveTooltip();\n return;\n }\n\n // CAS 2 : Clic sur un déclencheur\n if (trigger) {\n // Stratégie hybride pour trouver la tooltip :\n // 1. On cherche dedans (cas Pricing)\n // 2. Si rien, on cherche l'élément frère suivant (cas Décacornes)\n let tooltip = trigger.querySelector(\"[data-css-tooltip]\");\n\n if (!tooltip) {\n tooltip = trigger.nextElementSibling;\n }\n\n // Vérification finale de l'attribut\n if (!tooltip || !tooltip.hasAttribute(\"data-css-tooltip\")) {\n console.warn(\n \"⚠️ [Tooltip] Trigger détecté mais aucune bulle associée trouvée.\",\n trigger,\n );\n return;\n }\n\n console.log(\"✅ [Tooltip] Correspondance trouvée !\");\n\n if (activeTooltip === tooltip) {\n closeActiveTooltip();\n return;\n }\n\n openTooltipMobile(tooltip, trigger);\n e.preventDefault();\n return;\n }\n\n // CAS 3 : Clic n'importe où ailleurs\n if (activeTooltip) {\n console.log(\"🖱️ [Click] Extérieur -> Fermeture.\");\n closeActiveTooltip();\n }\n });\n\n console.log(\"🛠️ [System] Tooltips initialisées (Mode Hybride Activé).\");\n}\n\n// Lancement au chargement du DOM\ndocument.addEventListener(\"DOMContentLoaded\", initMobileTooltips);\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 {\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 ✅ HowTo : variant progress bar et variant opacity\n ---------------------------------------------------------- */\n\n// auto-tabs — variant 1 (progress bar)\n// Attribut déclencheur sur le wrapper : auto-tabs-wrapper-progress=\"\"\n\nfunction autoTabsProgress() {\n const wrapper = document.querySelector(\"[auto-tabs-wrapper-progress]\");\n if (!wrapper) return;\n\n const tabs = wrapper.querySelectorAll(\"[auto-tab]\");\n const images = wrapper.querySelectorAll(\"[auto-tab-image]\");\n const media = wrapper.querySelector(\"[auto-tabs-media]\");\n\n if (!tabs.length) return;\n\n const DURATION = 6000;\n\n let currentIndex = 0;\n let startTime = null;\n let animFrame = null;\n\n function injectStyles() {\n const style = document.createElement(\"style\");\n style.textContent = `\n [auto-tabs-wrapper-progress] [auto-tab] { opacity: 0.4; transition: opacity 0.4s ease; cursor: pointer; }\n [auto-tabs-wrapper-progress] [auto-tab][active] { opacity: 1; }\n [auto-tabs-wrapper-progress] [auto-tab-body] { opacity: 0; transition: opacity 0.4s ease; }\n [auto-tabs-wrapper-progress] [auto-tab-progress] { height: 2px !important; overflow: hidden; background: rgba(0, 9, 74, 0.1); }\n [auto-tabs-wrapper-progress] [auto-tab-bar] { height: 2px !important; display: block; background: #FF4920; }\n [auto-tabs-wrapper-progress] [auto-tabs-media] { position: relative; }\n [auto-tabs-wrapper-progress] [auto-tab-image] { position: absolute; inset: 0; opacity: 0; transition: opacity 0.4s ease; pointer-events: none; }\n [auto-tabs-wrapper-progress] [auto-tab-image][active] { opacity: 1; pointer-events: auto; }\n `;\n document.head.appendChild(style);\n }\n\n function setMediaHeight() {\n if (!media || !images.length) return;\n\n const firstImg = images[0];\n\n function applyHeight() {\n images.forEach(function (img) { img.style.display = \"block\"; });\n const height = images[0].offsetHeight;\n images.forEach(function (img) { img.style.display = \"\"; });\n if (height > 0) media.style.height = height + \"px\";\n }\n\n if (firstImg.complete && firstImg.naturalHeight > 0) {\n applyHeight();\n } else {\n firstImg.addEventListener(\"load\", applyHeight, { once: true });\n }\n }\n\n function setActive(index) {\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) { body.style.display = \"none\"; body.style.opacity = \"0\"; }\n if (number) number.style.color = \"\";\n });\n\n images.forEach(function (img) { img.removeAttribute(\"active\"); });\n\n const activeTab = wrapper.querySelector('[auto-tab][tab-index=\"' + index + '\"]');\n const activeImg = wrapper.querySelector('[auto-tab-image][tab-index=\"' + index + '\"]');\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 requestAnimationFrame(function () { body.style.opacity = \"1\"; });\n }\n }\n\n if (activeImg) activeImg.setAttribute(\"active\", \"\");\n\n currentIndex = index;\n startTime = null;\n cancelAnimationFrame(animFrame);\n animFrame = requestAnimationFrame(animate);\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 = wrapper.querySelector('[auto-tab][tab-index=\"' + currentIndex + '\"]');\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 setActive((currentIndex + 1) % tabs.length);\n }\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 injectStyles();\n setMediaHeight();\n window.addEventListener(\"resize\", setMediaHeight);\n setActive(0);\n}\n\nautoTabsProgress();\n// auto-tabs — variant 2 (opacity only)\n// Attribut déclencheur sur le wrapper : auto-tabs-wrapper-opacity=\"\"\n\nfunction autoTabsOpacity() {\n const wrapper = document.querySelector(\"[auto-tabs-wrapper-opacity]\");\n if (!wrapper) return;\n\n const tabs = wrapper.querySelectorAll(\"[auto-tab]\");\n const images = wrapper.querySelectorAll(\"[auto-tab-image]\");\n const media = wrapper.querySelector(\"[auto-tabs-media]\");\n\n if (!tabs.length) return;\n\n const DURATION = 6000;\n\n let currentIndex = 0;\n let timer = null;\n\n function injectStyles() {\n const style = document.createElement(\"style\");\n style.textContent = `\n [auto-tabs-wrapper-opacity] [auto-tab] { opacity: 0.3; transition: opacity 0.4s ease; cursor: pointer; }\n [auto-tabs-wrapper-opacity] [auto-tab][active] { opacity: 1; }\n [auto-tabs-wrapper-opacity] [auto-tab-body] { opacity: 1 !important; display: block !important; }\n [auto-tabs-wrapper-opacity] [auto-tabs-media] { position: relative; }\n [auto-tabs-wrapper-opacity] [auto-tab-image] { position: absolute; inset: 0; opacity: 0; transition: opacity 0.4s ease; pointer-events: none; }\n [auto-tabs-wrapper-opacity] [auto-tab-image][active] { opacity: 1; pointer-events: auto; }\n `;\n document.head.appendChild(style);\n }\n\n function setMediaHeight() {\n if (!media || !images.length) return;\n\n const firstImg = images[0];\n\n function applyHeight() {\n images.forEach(function (img) { img.style.display = \"block\"; });\n const height = images[0].offsetHeight;\n images.forEach(function (img) { img.style.display = \"\"; });\n if (height > 0) media.style.height = height + \"px\";\n }\n\n if (firstImg.complete && firstImg.naturalHeight > 0) {\n applyHeight();\n } else {\n firstImg.addEventListener(\"load\", applyHeight, { once: true });\n }\n }\n\n function setActive(index) {\n tabs.forEach(function (tab) {\n tab.removeAttribute(\"active\");\n const number = tab.querySelector(\"[auto-tab-number]\");\n if (number) number.style.color = \"\";\n });\n\n images.forEach(function (img) { img.removeAttribute(\"active\"); });\n\n const activeTab = wrapper.querySelector('[auto-tab][tab-index=\"' + index + '\"]');\n const activeImg = wrapper.querySelector('[auto-tab-image][tab-index=\"' + index + '\"]');\n\n if (activeTab) {\n activeTab.setAttribute(\"active\", \"\");\n const number = activeTab.querySelector(\"[auto-tab-number]\");\n if (number) number.style.color = \"#FF4920\";\n }\n\n if (activeImg) activeImg.setAttribute(\"active\", \"\");\n\n currentIndex = index;\n clearTimeout(timer);\n timer = setTimeout(function () {\n setActive((currentIndex + 1) % tabs.length);\n }, DURATION);\n }\n\n tabs.forEach(function (tab) {\n tab.addEventListener(\"click\", function () {\n clearTimeout(timer);\n setActive(parseInt(tab.getAttribute(\"tab-index\")));\n });\n });\n\n injectStyles();\n setMediaHeight();\n window.addEventListener(\"resize\", setMediaHeight);\n setActive(0);\n}\n\nautoTabsOpacity();\n\n/* =========================\n TABLE DES LEVÉES MODAL\n ========================= */\n// ── Index global des levées { companySlug: [raise, ...] } ──────────────────\n var raisesIndex = {};\n\n // ── Référence globale à la modal ───────────────────────────────────────────\n var modal;\n\n\n // ════════════════════════════════════════════════════════════════════════════\n // UTILITAIRES\n // ════════════════════════════════════════════════════════════════════════════\n\n /**\n * Lit la valeur d'un attribut data sur un élément ou son enfant.\n * — Cas badge (.perf-badge-wrapper) : retourne le texte visible uniquement\n * — Cas tooltip ([data-css-tooltip-hover]) : retourne { isHtml, content }\n * pour préserver le markup du tooltip lors de l'injection\n * — Cas texte simple : retourne textContent\n */\n function readAttr(root, attr) {\n if (root.hasAttribute(attr)) return root.getAttribute(attr) || '';\n var child = root.querySelector('[' + attr + ']');\n if (!child) return '';\n\n // Cas image — on retourne le src\n if (child.tagName === 'IMG') return child.src || '';\n\n // Cas badge série — texte visible uniquement\n var badgeWrapper = child.closest('.perf-badge-wrapper');\n if (badgeWrapper) return child.textContent.trim();\n\n // Cas tooltip (ex: data-raise-operation)\n var tooltipWrapper = child.closest('[data-css-tooltip-hover]');\n if (tooltipWrapper) return { isHtml: true, content: tooltipWrapper.outerHTML };\n\n return child.textContent.trim();\n }\n\n /**\n * Parse un montant formaté vers des millions (Float).\n * Formats acceptés : \"22,1M€\" | \"500K€\" | \"1,2Md€\"\n */\n function parseAmount(str) {\n if (!str || typeof str !== 'string') return 0;\n var s = str.trim().replace(',', '.');\n var num = parseFloat(s.replace(/[^0-9.]/g, ''));\n if (isNaN(num)) return 0;\n if (s.indexOf('Md') !== -1) return num * 1000;\n if (s.indexOf('K') !== -1) return num / 1000;\n return num;\n }\n\n /**\n * Formate un total en millions vers la meilleure unité lisible.\n * < 1M → K€ | 1–999M → M€ | ≥ 1000M → Md€\n */\n function formatAmount(totalM) {\n if (totalM >= 1000) return (totalM / 1000).toFixed(1).replace('.', ',').replace(',0', '') + 'Md€';\n if (totalM >= 1) return totalM.toFixed(1).replace('.', ',').replace(',0', '') + 'M€';\n return Math.round(totalM * 1000) + 'K€';\n }\n\n\n // ════════════════════════════════════════════════════════════════════════════\n // INDEX DES LEVÉES\n // ════════════════════════════════════════════════════════════════════════════\n\n /**\n * Parcourt tous les [data-modal-open] du DOM visible et construit\n * un index { companySlug: [{ serie, operation, amount, ... }, ...] }.\n * Appelé au chargement puis fusionné à chaque batch Finsweet.\n */\n function buildRaisesIndex() {\n var index = {};\n document.querySelectorAll('[data-modal-open]').forEach(function (trigger) {\n var company = (trigger.getAttribute('data-company') || '').trim().toLowerCase();\n if (!company) return;\n index[company] = index[company] || [];\n index[company].push({\n serie: readAttr(trigger, 'data-raise-serie'),\n operation: readAttr(trigger, 'data-raise-operation'),\n date: readAttr(trigger, 'data-raise-date'),\n amount: readAttr(trigger, 'data-raise-amount'),\n img: readAttr(trigger, 'data-raise-img'),\n // wcountry: readAttr(trigger, 'data-raise-wcountry') // désactivé — client\n });\n });\n // console.log('[buildRaisesIndex] index construit:', Object.keys(index).length, 'startups');\n return index;\n }\n\n /**\n * Fusionne un nouvel index partiel dans raisesIndex sans créer de doublons.\n * Comparaison par amount.\n */\n function mergeIntoIndex(fresh) {\n Object.keys(fresh).forEach(function (company) {\n fresh[company].forEach(function (raise) {\n var existing = raisesIndex[company] || [];\n var isDupe = existing.some(function (r) {\n var rAmount = (typeof r.amount === 'object') ? r.amount.content : r.amount;\n var raiseAmount = (typeof raise.amount === 'object') ? raise.amount.content : raise.amount;\n return rAmount === raiseAmount;\n });\n if (!isDupe) {\n raisesIndex[company] = raisesIndex[company] || [];\n raisesIndex[company].push(raise);\n // console.log('[mergeIntoIndex] ajout:', company, raise.amount);\n }\n });\n });\n }\n\n /**\n * Charge toutes les pages suivantes en arrière-plan via fetch\n * pour compléter raisesIndex avec les items hors page courante.\n * Ne modifie pas l'affichage — uniquement l'index.\n */\n function preloadAllPages() {\n var nextLink = document.querySelector('.w-pagination-next');\n if (!nextLink) return;\n\n function fetchPage(url) {\n // console.log('[preloadAllPages] fetch:', url);\n fetch(url).then(function (r) { return r.text(); }).then(function (html) {\n var doc = new DOMParser().parseFromString(html, 'text/html');\n var fresh = {};\n doc.querySelectorAll('[data-modal-open]').forEach(function (trigger) {\n var company = (trigger.getAttribute('data-company') || '').trim().toLowerCase();\n if (!company) return;\n fresh[company] = fresh[company] || [];\n fresh[company].push({\n serie: readAttr(trigger, 'data-raise-serie'),\n operation: readAttr(trigger, 'data-raise-operation'),\n date: readAttr(trigger, 'data-raise-date'),\n amount: readAttr(trigger, 'data-raise-amount'),\n img: readAttr(trigger, 'data-raise-img'),\n // wcountry: readAttr(trigger, 'data-raise-wcountry')\n });\n });\n mergeIntoIndex(fresh);\n // console.log('[preloadAllPages] page chargée, index:', Object.keys(raisesIndex).length, 'startups');\n var next = doc.querySelector('.w-pagination-next');\n if (next) fetchPage(next.href);\n });\n }\n\n fetchPage(nextLink.href);\n }\n\n\n // ════════════════════════════════════════════════════════════════════════════\n // INJECTION DANS LA MODAL\n // ════════════════════════════════════════════════════════════════════════════\n\n /**\n * Clone le template [data-raise-template] pour chaque levée et injecte les données.\n * — Champs HTML (operation/tooltip) : on collecte les refs AVANT de modifier le DOM,\n * puis on injecte via innerHTML dans la cellule (sans toucher aux voisines)\n * — Champs texte (serie, amount) : textContent\n * Les clones précédents sont supprimés avant chaque injection.\n */\n function injectRaises(modalItem, raises) {\n var template = modalItem.querySelector('[data-raise-template]');\n if (!template || !raises) return;\n\n var parent = template.parentNode;\n modalItem.querySelectorAll('[data-raise-clone]').forEach(function (el) { el.remove(); });\n\n raises.forEach(function (raise) {\n var row = template.cloneNode(true);\n row.removeAttribute('data-raise-template');\n row.setAttribute('data-raise-clone', '');\n row.style.display = '';\n\n var dataRow = row.querySelector('.data-raise-row:not([data-raises-header])');\n\n var fields = {\n 'data-raise-serie': raise.serie,\n 'data-raise-operation': raise.operation,\n 'data-raise-date': raise.date,\n 'data-raise-amount': raise.amount,\n 'data-raise-img': raise.img,\n // 'data-raise-wcountry': raise.wcountry // désactivé — client\n };\n\n // Collecte toutes les refs de cellules AVANT de modifier le DOM\n var substitutions = [];\n Object.keys(fields).forEach(function (attr) {\n var cell = dataRow ? dataRow.querySelector('[' + attr + ']') : row.querySelector('[' + attr + ']');\n if (!cell) return;\n substitutions.push({ cell: cell, data: fields[attr] });\n });\n\n // Applique les substitutions\n substitutions.forEach(function (sub) {\n var data = sub.data;\n if (data && typeof data === 'object' && data.isHtml) {\n sub.cell.innerHTML = data.content;\n } else if (sub.cell.tagName === 'IMG') {\n // Cas image — on met à jour le src\n sub.cell.src = data || '';\n } else {\n sub.cell.textContent = data || '';\n }\n });\n\n parent.appendChild(row);\n });\n\n // console.log('[injectRaises] injecté', raises.length, 'levée(s)');\n }\n\n /**\n * Calcule la somme des montants des clones injectés\n * et met à jour [data-raises-total] avec le montant formaté.\n */\n function injectTotal(target) {\n var totalM = 0;\n target.querySelectorAll('[data-raise-clone] [data-raise-amount]').forEach(function (el) {\n totalM += parseAmount(el.textContent);\n });\n var totalEl = target.querySelector('[data-raises-total]');\n if (totalEl) totalEl.textContent = formatAmount(totalM);\n // console.log('[injectTotal] total:', formatAmount(totalM));\n }\n\n\n // ════════════════════════════════════════════════════════════════════════════\n // MODAL — OUVRIR / FERMER\n // ════════════════════════════════════════════════════════════════════════════\n\n /**\n * Gère l'ouverture de la modal au clic sur [data-modal-open].\n * 1. Masque tous les modal-items\n * 2. Affiche le bon modal-item via data-slug\n * 3. Injecte les levées regroupées par data-company\n * 4. Applique data-raises-count=\"single|multiple\" pour le CSS conditionnel\n * 5. Calcule et affiche le total des levées\n */\n function handleModalOpen(e) {\n var trigger = e.target.closest('[data-modal-open]');\n if (!trigger) return;\n\n var slug = (trigger.getAttribute('data-slug') || '').trim().toLowerCase();\n var company = (trigger.getAttribute('data-company') || '').trim().toLowerCase();\n\n // console.log('[handleModalOpen] slug:', slug, '| company:', company);\n // console.log('[handleModalOpen] levées connues:', raisesIndex[company]);\n\n document.querySelectorAll('[data-modal-item]').forEach(function (item) {\n item.style.setProperty('display', 'none', 'important');\n });\n\n var target = document.querySelector('[data-modal-item=\"' + slug + '\"]');\n if (target) {\n target.parentNode.insertBefore(target, target.parentNode.firstChild);\n target.style.setProperty('display', 'block', 'important');\n\n var count = document.querySelectorAll('[data-modal-item][data-company=\"' + company + '\"]').length;\n target.setAttribute('data-raises-count', count === 1 ? 'single' : 'multiple');\n // console.log('[handleModalOpen] count modal-items:', count);\n\n injectRaises(target, raisesIndex[company]);\n injectTotal(target);\n }\n\n modal.classList.add('is-open');\n document.body.style.overflow = 'hidden';\n }\n\n /**\n * Ferme la modal et restaure le scroll de la page.\n */\n function closeModal() {\n modal.classList.remove('is-open');\n document.body.style.overflow = '';\n // console.log('[closeModal] modal fermée');\n }\n\n /**\n * Branche tous les listeners de la modal :\n * — Clic délégué sur [data-modal-open] → ouvre\n * — Clic sur overlay ou container → ferme\n * — Clic sur [data-modal-close] → ferme\n * — Touche Escape → ferme\n */\n function initModalListeners() {\n document.addEventListener('click', handleModalOpen);\n\n modal.addEventListener('click', function (e) {\n if (e.target === modal || e.target === modal.querySelector('[data-modal-container]')) closeModal();\n });\n\n document.querySelectorAll('[data-modal-close]').forEach(function (btn) {\n btn.addEventListener('click', closeModal);\n });\n\n document.addEventListener('keydown', function (e) {\n if (e.key === 'Escape') closeModal();\n });\n }\n\n /**\n * Écoute l'event Finsweet fs-list-load pour fusionner\n * les nouveaux items chargés sans écraser les pages déjà fetchées.\n */\n function initFinsweetListener() {\n window.addEventListener('fs-list-load', function () {\n mergeIntoIndex(buildRaisesIndex());\n // console.log('[fs-list-load] index mis à jour');\n });\n }\n\n\n // ════════════════════════════════════════════════════════════════════════════\n // INIT\n // ════════════════════════════════════════════════════════════════════════════\n\n /**\n * Point d'entrée principal.\n * 1. Récupère la modal\n * 2. Construit l'index initial depuis le DOM\n * 3. Lance le preload silencieux des pages suivantes\n * 4. Branche les listeners Finsweet et modal\n */\n function init() {\n modal = document.querySelector('[data-modal]');\n if (!modal) return;\n raisesIndex = buildRaisesIndex();\n preloadAllPages();\n initFinsweetListener();\n initModalListeners();\n // console.log('[init] script modal initialisé');\n }\n\n window.addEventListener('load', init);\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 document.querySelector(\"[data-css-tooltip-hover]\") &&\n initMobileTooltips();\n}\ninitPageScripts();",[158],"3309dfac-55d5-11f1-8e30-ee650bb23af1","backup-22mai.js","fa5607d2-55b9-11f1-9ae8-ee650bb23af1",594,["D",1779450959761],3,"/* =========================\n 📆 UPDATE 21-05-2026_15:33\n ========================= */\n\n/* =========================\n ✅ GESTION TYPEFORM (laisser en haut)\n ========================= */\n(function TypeformManager() {\n /* =========================\n CONFIG\n ========================= */\n const CONFIG = {\n iframeSelector: \".tf-v1-iframe-wrapper iframe\",\n iframeDelayMs: 400,\n };\n\n /* =========================\n HELPERS\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 const currentSrc = iframe.getAttribute(\"src\");\n let newSrc = currentSrc;\n if (params.email) {\n const sep = currentSrc.includes(\"?\") ? \"&\" : \"?\";\n newSrc = `${currentSrc}${sep}email=${params.email}`;\n }\n iframe.setAttribute(\"src\", newSrc);\n console.log(\"Updated iframe src:\", iframe.src);\n }\n\n /**\n * Ouvre le Typeform correspondant au rôle demandé.\n * Fallback sur le premier trigger trouvé si aucun rôle ne correspond.\n *\n * @param {string} role - data-tf-role du trigger (ex: \"default\", \"special\")\n * @param {string} email - email pré-rempli (optionnel)\n */\n function openTf({ role = \"\", email = \"\" } = {}) {\n const trigger =\n document.querySelector(`[OpenTf=\"trigger\"][data-tf-role=\"${role}\"]`) ??\n document.querySelectorAll('[OpenTf=\"trigger\"]')[0];\n\n if (!trigger) {\n console.warn(\n `Typeform trigger not found${role ? ` for role: ${role}` : \"\"}`,\n );\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(() => updateIframeParams({ email }), CONFIG.iframeDelayMs);\n }\n }\n\n /* =========================\n LISTENERS\n ========================= */\n\n // submit formulaire → récupère email + role depuis data-tf-role\n document.querySelectorAll('[OpenTf=\"form\"]').forEach((form) => {\n form.addEventListener(\"submit\", function (event) {\n event.preventDefault();\n const email = getEmailFromElement(form);\n const role = form.dataset.tfRole || \"\";\n openTf({ role, email });\n });\n });\n\n // clic simple → ouvre le form lié via data-tf-role\n document.querySelectorAll('[OpenTf=\"btn\"]').forEach((el) => {\n el.addEventListener(\"click\", function (event) {\n event.preventDefault();\n const role = el.dataset.tfRole || \"\";\n openTf({ role });\n });\n });\n // Exposition globale pour debug console\n window.TypeformManager = { openTf };\n})();\n\n/* =========================\n ✅ NAVBAR\n ========================= */\n\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 const slideMenu = document.querySelector(\".slide-menu\");\n\n function openMenu() {\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 mainWrapper.style.filter = \"blur(4px)\";\n mainWrapper.style.transition =\n \"filter 0.5s cubic-bezier(.165, .84, .44, 1)\";\n document.body.style.overflow = \"hidden\";\n }\n\n function closeMenu() {\n navbarMenus.forEach((menu) => {\n menu.style.display = \"none\";\n });\n backgroundNavbar.style.display = \"none\";\n backgroundNavbar.style.transform = \"translateY(-100%)\";\n mainWrapper.style.filter = \"blur(0px)\";\n document.body.style.overflow = \"\";\n }\n\n if (menuButton) {\n menuButton.addEventListener(\"click\", () => {\n setTimeout(() => {\n const atLeastOneMenuOpen = Array.from(navbarMenus).some((menu) => {\n return window.getComputedStyle(menu).display === \"flex\";\n });\n atLeastOneMenuOpen ? openMenu() : closeMenu();\n }, 50);\n });\n }\n\n if (slideMenu) {\n slideMenu.addEventListener(\"click\", (e) => {\n if (e.target === slideMenu) {\n closeMenu();\n // Simuler le clic sur menuButton pour que Webflow remette l'icône burger\n setTimeout(() => menuButton.click(), 10);\n }\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\n// Cache DOM au premier appel, évite les querySelectorAll répétés\nlet toggles = null;\nfunction getToggles() {\n if (!toggles) {\n toggles = [...document.querySelectorAll('[card-blur-tabs=\"toggle\"]')];\n }\n return toggles;\n}\n\n// Ouvre/ferme une liste via data-attribute (évite getComputedStyle)\nfunction setListOpen(list, open) {\n if (open) {\n list.style.setProperty(\"height\", \"auto\", \"important\");\n list.style.setProperty(\"overflow\", \"visible\", \"important\");\n list.style.setProperty(\"display\", \"flex\", \"important\");\n list.dataset.cbOpen = \"1\";\n } else {\n list.style.setProperty(\"height\", \"0px\", \"important\");\n list.style.setProperty(\"overflow\", \"hidden\", \"important\");\n list.style.setProperty(\"display\", \"none\", \"important\");\n delete list.dataset.cbOpen;\n }\n}\n\nfunction isListOpen(list) {\n return list.dataset.cbOpen === \"1\";\n}\n\n// Met à jour le style d'un toggle en fonction de l'état (sans setTimeout ni rAF imbriqué)\nfunction applyToggleStyle(toggle, open) {\n const dropdown = toggle.querySelector('[card-blur-tabs=\"dropdown\"]');\n const dropdownDark = toggle.querySelector('[card-blur-tabs=\"dropdown-dark\"]');\n\n // dropdown-close color\n toggle.querySelectorAll(\"[dropdown-close]\").forEach((el) => {\n const closeColor = el.getAttribute(\"dropdown-close\");\n if (!closeColor) return;\n el.style.setProperty(\"color\", open ? \"white\" : closeColor, \"important\");\n });\n\n if (dropdown) {\n const child = dropdown.children[0];\n if (child) {\n child.style.setProperty(\n \"transform\",\n open ? \"rotate(0deg)\" : \"rotate(180deg)\",\n \"important\",\n );\n }\n dropdown.style.setProperty(\"color\", open ? \"white\" : \"\", \"important\");\n dropdown.style.setProperty(\n \"background-image\",\n open ? \"none\" : \"\",\n \"important\",\n );\n }\n\n if (dropdownDark) {\n const child = dropdownDark.children[0];\n if (child) {\n child.style.setProperty(\n \"transform\",\n open ? \"rotate(0deg)\" : \"rotate(180deg)\",\n \"important\",\n );\n }\n dropdownDark.style.setProperty(\n \"background-color\",\n open ? \"#00094A\" : \"\",\n \"important\",\n );\n dropdownDark.style.setProperty(\"color\", open ? \"white\" : \"\", \"important\");\n dropdownDark.style.setProperty(\"border\", open ? \"none\" : \"\", \"important\");\n }\n}\n\nfunction resetToggleStyle(toggle) {\n const dropdown = toggle.querySelector('[card-blur-tabs=\"dropdown\"]');\n const dropdownDark = toggle.querySelector('[card-blur-tabs=\"dropdown-dark\"]');\n\n toggle.querySelectorAll(\"[dropdown-close]\").forEach((el) => {\n el.style.color = \"\";\n });\n if (dropdown) {\n const child = dropdown.children[0];\n if (child) child.style.transform = \"\";\n dropdown.style.color = \"\";\n dropdown.style.backgroundImage = \"\";\n }\n if (dropdownDark) {\n const child = dropdownDark.children[0];\n if (child) child.style.transform = \"\";\n dropdownDark.style.backgroundColor = \"\";\n dropdownDark.style.color = \"\";\n dropdownDark.style.border = \"\";\n }\n}\n\nfunction initCardBlurTabs() {\n if (!mediaQuery.matches) {\n // Desktop : reset tout\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) => {\n list.style.height = \"\";\n list.style.overflow = \"\";\n list.style.display = \"\";\n delete list.dataset.cbOpen;\n });\n getToggles().forEach(resetToggleStyle);\n return;\n }\n\n // Mobile/tablet : init état initial\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) => {\n const isFirst = list.getAttribute(\"card-blur-tabs-load\") === \"first\";\n setListOpen(list, isFirst);\n });\n\n // Sync les styles des toggles sur l'état initial\n getToggles().forEach((toggle) => {\n const lists = [\n ...toggle.parentElement.querySelectorAll('[card-blur-tabs=\"list\"]'),\n ];\n const open = lists.some(isListOpen);\n applyToggleStyle(toggle, open);\n });\n}\n\nfunction handleCardBlurTabsClick() {\n getToggles().forEach((toggle) => {\n toggle.addEventListener(\"click\", () => {\n if (!mediaQuery.matches) return;\n\n const siblingLists = [\n ...toggle.parentElement.querySelectorAll('[card-blur-tabs=\"list\"]'),\n ];\n const wasOpen = siblingLists.some(isListOpen);\n\n // Ferme tout\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) =>\n setListOpen(list, false)\n );\n // Reset les styles de tous les toggles\n getToggles().forEach((t) => applyToggleStyle(t, false));\n\n if (!wasOpen) {\n // Ouvre les listes du toggle cliqué\n siblingLists.forEach((list) => setListOpen(list, true));\n applyToggleStyle(toggle, true);\n }\n });\n });\n}\n\nmediaQuery.addEventListener(\"change\", initCardBlurTabs);\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; // délai entre chaque batch\n var FADE = 1200; // durée du fondu\n var STAGGER = 1200; // écart entre slots dans un même batch\n var BATCH = 2; // nb de slots changés par batch (fixe, plus prévisible)\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 var slotObserver = new IntersectionObserver(function (entries) {\n entries.forEach(function (entry) {\n if (entry.isIntersecting) visibleSlots.add(entry.target);\n else visibleSlots.delete(entry.target);\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 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 slotObserver.observe(slot);\n });\n\n // ── File d'attente tournante ──\n // Garantit que chaque slot visible est rafraîchi avant qu'un autre\n // repasse, puis on mélange la prochaine tournée pour varier l'ordre.\n var queue = [];\n function pickFromQueue(n) {\n var visible = Array.from(visibleSlots);\n if (visible.length === 0) return [];\n\n // Retire de la queue les slots devenus invisibles\n queue = queue.filter(function (s) {\n return visibleSlots.has(s);\n });\n\n // Complète / recharge la queue si elle est trop courte\n if (queue.length < n) {\n // Tous les slots visibles ont déjà été vus → on prépare un nouveau tour\n var remaining = visible.filter(function (s) {\n return !queue.includes(s);\n });\n queue = queue.concat(shuffle(remaining));\n }\n\n return queue.splice(0, Math.min(n, queue.length));\n }\n\n // ── Cycle batch ──\n function runBatch() {\n var picked = pickFromQueue(BATCH);\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; // force reflow\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 if (document.querySelector(\"[data-tabs-wrap]\")) {\n AutoRotateFakeTabs();\n }\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\", (e) => {\n const vid = btn.getAttribute(\"data-vimeo-lightbox-id\");\n\n // Si pas d'ID de vidéo (ex: CMS vide), on ne fait rien\n if (!vid || vid.trim() === \"\") {\n e.preventDefault();\n console.warn(\n \"⚠️ [Vimeo Lightbox] Clic ignoré : aucun ID de vidéo trouvé pour cet item CMS.\",\n );\n return;\n }\n\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 ✅ TOOLTIP MOBILE\n ========================= */\nfunction initMobileTooltips() {\n let activeTooltip = null;\n let originalParent = null;\n\n const closeActiveTooltip = () => {\n if (!activeTooltip) return;\n\n const tooltipToClose = activeTooltip;\n const parentToReturn = originalParent;\n\n console.log(\"🕒 [Tooltip] Fermeture :\", tooltipToClose);\n\n tooltipToClose.classList.remove(\"is-active\");\n document.body.style.overflow = \"\";\n\n setTimeout(() => {\n if (!tooltipToClose.classList.contains(\"is-active\")) {\n tooltipToClose.classList.remove(\"tooltip-moving\");\n // On remet la tooltip à sa place d'origine (dans le trigger ou après)\n if (parentToReturn) {\n console.log(\"♻️ [Tooltip] Retour au DOM d'origine.\");\n parentToReturn.appendChild(tooltipToClose);\n }\n }\n }, 400);\n\n activeTooltip = null;\n originalParent = null;\n };\n\n const openTooltipMobile = (tooltip, trigger) => {\n console.log(\"✨ [Tooltip] Ouverture demandée.\");\n\n if (activeTooltip) {\n closeActiveTooltip();\n }\n\n activeTooltip = tooltip;\n // On stocke le parent direct pour savoir où la remettre plus tard\n originalParent = tooltip.parentElement;\n\n document.body.style.overflow = \"hidden\";\n activeTooltip.classList.add(\"tooltip-moving\");\n document.body.appendChild(activeTooltip);\n\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n activeTooltip.classList.add(\"is-active\");\n console.log(\"🚀 [Tooltip] Animation lancée (is-active).\");\n });\n });\n };\n\n document.addEventListener(\"click\", (e) => {\n // On ne s'active que sur mobile/tablette\n if (window.innerWidth >= 768) return;\n\n const trigger = e.target.closest(\"[data-css-tooltip-hover]\");\n const clickedInsideTooltip = e.target.closest(\n \"[data-css-tooltip].is-active\",\n );\n\n // CAS 1 : Clic dans la bulle ouverte -> On ferme\n if (clickedInsideTooltip) {\n console.log(\"🖱️ [Click] Intérieur bulle -> Fermeture.\");\n closeActiveTooltip();\n return;\n }\n\n // CAS 2 : Clic sur un déclencheur\n if (trigger) {\n // Stratégie hybride pour trouver la tooltip :\n // 1. On cherche dedans (cas Pricing)\n // 2. Si rien, on cherche l'élément frère suivant (cas Décacornes)\n let tooltip = trigger.querySelector(\"[data-css-tooltip]\");\n\n if (!tooltip) {\n tooltip = trigger.nextElementSibling;\n }\n\n // Vérification finale de l'attribut\n if (!tooltip || !tooltip.hasAttribute(\"data-css-tooltip\")) {\n console.warn(\n \"⚠️ [Tooltip] Trigger détecté mais aucune bulle associée trouvée.\",\n trigger,\n );\n return;\n }\n\n console.log(\"✅ [Tooltip] Correspondance trouvée !\");\n\n if (activeTooltip === tooltip) {\n closeActiveTooltip();\n return;\n }\n\n openTooltipMobile(tooltip, trigger);\n e.preventDefault();\n return;\n }\n\n // CAS 3 : Clic n'importe où ailleurs\n if (activeTooltip) {\n console.log(\"🖱️ [Click] Extérieur -> Fermeture.\");\n closeActiveTooltip();\n }\n });\n\n console.log(\"🛠️ [System] Tooltips initialisées (Mode Hybride Activé).\");\n}\n\n// Lancement au chargement du DOM\ndocument.addEventListener(\"DOMContentLoaded\", initMobileTooltips);\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 {\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 ✅ HowTo : variant progress bar et variant opacity\n ---------------------------------------------------------- */\n\n// auto-tabs — variant 1 (progress bar)\n// Attribut déclencheur sur le wrapper : auto-tabs-wrapper-progress=\"\"\n\nfunction autoTabsProgress() {\n const wrapper = document.querySelector(\"[auto-tabs-wrapper-progress]\");\n if (!wrapper) return;\n\n const tabs = wrapper.querySelectorAll(\"[auto-tab]\");\n const images = wrapper.querySelectorAll(\"[auto-tab-image]\");\n const media = wrapper.querySelector(\"[auto-tabs-media]\");\n\n if (!tabs.length) return;\n\n const DURATION = 6000;\n\n let currentIndex = 0;\n let startTime = null;\n let animFrame = null;\n\n function injectStyles() {\n const style = document.createElement(\"style\");\n style.textContent = `\n [auto-tabs-wrapper-progress] [auto-tab] { opacity: 0.4; transition: opacity 0.4s ease; cursor: pointer; }\n [auto-tabs-wrapper-progress] [auto-tab][active] { opacity: 1; }\n [auto-tabs-wrapper-progress] [auto-tab-body] { opacity: 0; transition: opacity 0.4s ease; }\n [auto-tabs-wrapper-progress] [auto-tab-progress] { height: 2px !important; overflow: hidden; background: rgba(0, 9, 74, 0.1); }\n [auto-tabs-wrapper-progress] [auto-tab-bar] { height: 2px !important; display: block; background: #FF4920; }\n [auto-tabs-wrapper-progress] [auto-tabs-media] { position: relative; }\n [auto-tabs-wrapper-progress] [auto-tab-image] { position: absolute; inset: 0; opacity: 0; transition: opacity 0.4s ease; pointer-events: none; }\n [auto-tabs-wrapper-progress] [auto-tab-image][active] { opacity: 1; pointer-events: auto; }\n `;\n document.head.appendChild(style);\n }\n\n function setMediaHeight() {\n if (!media || !images.length) return;\n\n const firstImg = images[0];\n\n function applyHeight() {\n images.forEach(function (img) { img.style.display = \"block\"; });\n const height = images[0].offsetHeight;\n images.forEach(function (img) { img.style.display = \"\"; });\n if (height > 0) media.style.height = height + \"px\";\n }\n\n if (firstImg.complete && firstImg.naturalHeight > 0) {\n applyHeight();\n } else {\n firstImg.addEventListener(\"load\", applyHeight, { once: true });\n }\n }\n\n function setActive(index) {\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) { body.style.display = \"none\"; body.style.opacity = \"0\"; }\n if (number) number.style.color = \"\";\n });\n\n images.forEach(function (img) { img.removeAttribute(\"active\"); });\n\n const activeTab = wrapper.querySelector('[auto-tab][tab-index=\"' + index + '\"]');\n const activeImg = wrapper.querySelector('[auto-tab-image][tab-index=\"' + index + '\"]');\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 requestAnimationFrame(function () { body.style.opacity = \"1\"; });\n }\n }\n\n if (activeImg) activeImg.setAttribute(\"active\", \"\");\n\n currentIndex = index;\n startTime = null;\n cancelAnimationFrame(animFrame);\n animFrame = requestAnimationFrame(animate);\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 = wrapper.querySelector('[auto-tab][tab-index=\"' + currentIndex + '\"]');\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 setActive((currentIndex + 1) % tabs.length);\n }\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 injectStyles();\n setMediaHeight();\n window.addEventListener(\"resize\", setMediaHeight);\n setActive(0);\n}\n\nautoTabsProgress();\n// auto-tabs — variant 2 (opacity only)\n// Attribut déclencheur sur le wrapper : auto-tabs-wrapper-opacity=\"\"\n\nfunction autoTabsOpacity() {\n const wrapper = document.querySelector(\"[auto-tabs-wrapper-opacity]\");\n if (!wrapper) return;\n\n const tabs = wrapper.querySelectorAll(\"[auto-tab]\");\n const images = wrapper.querySelectorAll(\"[auto-tab-image]\");\n const media = wrapper.querySelector(\"[auto-tabs-media]\");\n\n if (!tabs.length) return;\n\n const DURATION = 6000;\n\n let currentIndex = 0;\n let timer = null;\n\n function injectStyles() {\n const style = document.createElement(\"style\");\n style.textContent = `\n [auto-tabs-wrapper-opacity] [auto-tab] { opacity: 0.3; transition: opacity 0.4s ease; cursor: pointer; }\n [auto-tabs-wrapper-opacity] [auto-tab][active] { opacity: 1; }\n [auto-tabs-wrapper-opacity] [auto-tab-body] { opacity: 1 !important; display: block !important; }\n [auto-tabs-wrapper-opacity] [auto-tabs-media] { position: relative; }\n [auto-tabs-wrapper-opacity] [auto-tab-image] { position: absolute; inset: 0; opacity: 0; transition: opacity 0.4s ease; pointer-events: none; }\n [auto-tabs-wrapper-opacity] [auto-tab-image][active] { opacity: 1; pointer-events: auto; }\n `;\n document.head.appendChild(style);\n }\n\n function setMediaHeight() {\n if (!media || !images.length) return;\n\n const firstImg = images[0];\n\n function applyHeight() {\n images.forEach(function (img) { img.style.display = \"block\"; });\n const height = images[0].offsetHeight;\n images.forEach(function (img) { img.style.display = \"\"; });\n if (height > 0) media.style.height = height + \"px\";\n }\n\n if (firstImg.complete && firstImg.naturalHeight > 0) {\n applyHeight();\n } else {\n firstImg.addEventListener(\"load\", applyHeight, { once: true });\n }\n }\n\n function setActive(index) {\n tabs.forEach(function (tab) {\n tab.removeAttribute(\"active\");\n const number = tab.querySelector(\"[auto-tab-number]\");\n if (number) number.style.color = \"\";\n });\n\n images.forEach(function (img) { img.removeAttribute(\"active\"); });\n\n const activeTab = wrapper.querySelector('[auto-tab][tab-index=\"' + index + '\"]');\n const activeImg = wrapper.querySelector('[auto-tab-image][tab-index=\"' + index + '\"]');\n\n if (activeTab) {\n activeTab.setAttribute(\"active\", \"\");\n const number = activeTab.querySelector(\"[auto-tab-number]\");\n if (number) number.style.color = \"#FF4920\";\n }\n\n if (activeImg) activeImg.setAttribute(\"active\", \"\");\n\n currentIndex = index;\n clearTimeout(timer);\n timer = setTimeout(function () {\n setActive((currentIndex + 1) % tabs.length);\n }, DURATION);\n }\n\n tabs.forEach(function (tab) {\n tab.addEventListener(\"click\", function () {\n clearTimeout(timer);\n setActive(parseInt(tab.getAttribute(\"tab-index\")));\n });\n });\n\n injectStyles();\n setMediaHeight();\n window.addEventListener(\"resize\", setMediaHeight);\n setActive(0);\n}\n\nautoTabsOpacity();\n\n // ════════════════════════════════════════════════════════════════════════════\n // MODALE LEVÉES TABLE\n // ════════════════════════════════════════════════════════════════════════════\n\n window.raisesIndex = {};\n window.modal;\n\n\n // ════════════════════════════════════════════════════════════════════════════\n // UTILITAIRES\n // ════════════════════════════════════════════════════════════════════════════\n\n /**\n * Lit la valeur d'un attribut data sur un élément ou son enfant.\n * — Cas image (IMG) : retourne le src\n * — Cas badge (.perf-badge-wrapper) : retourne le texte visible\n * — Cas tooltip ([data-css-tooltip-hover]) : retourne { isTooltip, label, bubble }\n * — Cas texte simple : retourne textContent\n */\n function readAttr(root, attr) {\n if (root.hasAttribute(attr)) return root.getAttribute(attr) || '';\n var child = root.querySelector('[' + attr + ']');\n if (!child) return '';\n\n if (child.tagName === 'IMG') return child.src || '';\n\n var badgeWrapper = child.closest('.perf-badge-wrapper');\n if (badgeWrapper) return child.textContent.trim();\n\n var tooltipTrigger = child.closest('[data-css-tooltip-hover]');\n if (tooltipTrigger) {\n var bubbleText = tooltipTrigger.parentNode.querySelector('.css-tooltip-text');\n return {\n isTooltip: true,\n label: child.textContent.trim(),\n bubble: bubbleText ? bubbleText.textContent.trim() : ''\n };\n }\n\n return child.textContent.trim();\n }\n\n /**\n * Parse un montant formaté vers des millions (Float).\n * Formats acceptés : \"22,1M€\" | \"500K€\" | \"1,2Md€\"\n */\n function parseAmount(str) {\n if (!str || typeof str !== 'string') return 0;\n var s = str.trim().replace(',', '.');\n var num = parseFloat(s.replace(/[^0-9.]/g, ''));\n if (isNaN(num)) return 0;\n if (s.indexOf('Md') !== -1) return num * 1000;\n if (s.indexOf('K') !== -1) return num / 1000;\n return num;\n }\n\n /**\n * Formate un total en millions vers la meilleure unité lisible.\n * < 1M → K€ | 1-999M → M€ | >= 1000M → Md€\n */\n function formatAmount(totalM) {\n if (totalM >= 1000) return (totalM / 1000).toFixed(1).replace('.', ',').replace(',0', '') + 'Md€';\n if (totalM >= 1) return totalM.toFixed(1).replace('.', ',').replace(',0', '') + 'M€';\n return Math.round(totalM * 1000) + 'K€';\n }\n\n\n // ════════════════════════════════════════════════════════════════════════════\n // INDEX DES LEVÉES\n // ════════════════════════════════════════════════════════════════════════════\n\n /**\n * Parcourt tous les [data-modal-open] et construit\n * un index { companySlug: [{ slug, serie, operation, date, amount, img }, ...] }.\n * Tableau 1 : levée directement sur le trigger.\n * Tableau 2 : levées sur les enfants directs de .w-dyn-items imbriquée.\n */\n function buildRaisesIndex() {\n var index = {};\n document.querySelectorAll('[data-modal-open]').forEach(function(trigger) {\n var company = (trigger.getAttribute('data-company') || '').trim().toLowerCase();\n if (!company) return;\n\n var nestedList = trigger.querySelector('.w-dyn-items');\n var items = nestedList ? Array.from(nestedList.children) : [trigger];\n\n items.forEach(function(item) {\n var slug = (item.getAttribute('data-slug') || trigger.getAttribute('data-slug') || '').trim().toLowerCase();\n if (!slug) return;\n index[company] = index[company] || [];\n index[company].push({\n slug: slug,\n serie: readAttr(item, 'data-raise-serie'),\n operation: readAttr(item, 'data-raise-operation'),\n date: readAttr(item, 'data-raise-date'),\n amount: readAttr(item, 'data-raise-amount'),\n img: readAttr(item, 'data-raise-img')\n // wcountry: readAttr(item, 'data-raise-wcountry')\n });\n });\n });\n return index;\n }\n\n /**\n * Fusionne un nouvel index partiel dans raisesIndex sans créer de doublons.\n * Comparaison par amount.\n */\n function mergeIntoIndex(fresh) {\n Object.keys(fresh).forEach(function(company) {\n fresh[company].forEach(function(raise) {\n var existing = window.raisesIndex[company] || [];\n var isDupe = existing.some(function(r) {\n var rAmount = (typeof r.amount === 'object') ? r.amount.content : r.amount;\n var raiseAmount = (typeof raise.amount === 'object') ? raise.amount.content : raise.amount;\n return rAmount === raiseAmount;\n });\n if (!isDupe) {\n window.raisesIndex[company] = window.raisesIndex[company] || [];\n window.raisesIndex[company].push(raise);\n }\n });\n });\n }\n\n /**\n * Pour les items [combine-startup=\"true\"], dans le tableau :\n * — Garde visible uniquement le premier enfant [data-slug]\n * — Masque les suivants (mais ils restent dans l'index pour la modal)\n * N'affecte pas les items [combine-startup=\"false\"] ni la modal.\n */\n function applyCombineStartup() {\n document.querySelectorAll('[data-modal-open][combine-startup=\"true\"]').forEach(function(trigger) {\n var nestedList = trigger.querySelector('.w-dyn-items');\n if (!nestedList) return;\n var children = Array.from(nestedList.children);\n children.forEach(function(child, index) {\n if (index === 0) {\n child.style.removeProperty('display');\n } else {\n child.style.setProperty('display', 'none', 'important');\n }\n });\n });\n }\n\n /**\n * Charge toutes les pages suivantes en arrière-plan via fetch\n * pour compléter raisesIndex avec les items hors page courante.\n * Ne modifie pas l'affichage — uniquement l'index.\n */\n function preloadAllPages() {\n var nextLink = document.querySelector('.w-pagination-next');\n if (!nextLink) return;\n\n function fetchPage(url) {\n fetch(url).then(function(r) { return r.text(); }).then(function(html) {\n var doc = new DOMParser().parseFromString(html, 'text/html');\n var fresh = {};\n doc.querySelectorAll('[data-modal-open]').forEach(function(trigger) {\n var company = (trigger.getAttribute('data-company') || '').trim().toLowerCase();\n if (!company) return;\n var nestedList = trigger.querySelector('.w-dyn-items');\n var items = nestedList ? Array.from(nestedList.children) : [trigger];\n items.forEach(function(item) {\n var slug = (item.getAttribute('data-slug') || trigger.getAttribute('data-slug') || '').trim().toLowerCase();\n if (!slug) return;\n fresh[company] = fresh[company] || [];\n fresh[company].push({\n slug: slug,\n serie: readAttr(item, 'data-raise-serie'),\n operation: readAttr(item, 'data-raise-operation'),\n date: readAttr(item, 'data-raise-date'),\n amount: readAttr(item, 'data-raise-amount'),\n img: readAttr(item, 'data-raise-img')\n // wcountry: readAttr(item, 'data-raise-wcountry')\n });\n });\n });\n mergeIntoIndex(fresh);\n var next = doc.querySelector('.w-pagination-next');\n if (next) fetchPage(next.href);\n });\n }\n\n fetchPage(nextLink.href);\n }\n\n\n // ════════════════════════════════════════════════════════════════════════════\n // INJECTION DANS LA MODAL\n // ════════════════════════════════════════════════════════════════════════════\n\n /**\n * Clone le template [data-raise-template] pour chaque levée et injecte les données.\n * Tooltip : met à jour label + texte bulle sans toucher à la structure.\n * Image : met à jour le src.\n * Texte : textContent.\n */\n function injectRaises(modalItem, raises) {\n var template = modalItem.querySelector('[data-raise-template]');\n if (!template || !raises) return;\n\n var parent = template.parentNode;\n modalItem.querySelectorAll('[data-raise-clone]').forEach(function(el) { el.remove(); });\n\n raises.forEach(function(raise) {\n var row = template.cloneNode(true);\n row.removeAttribute('data-raise-template');\n row.setAttribute('data-raise-clone', '');\n row.style.display = '';\n\n var dataRow = row.querySelector('.data-raise-row:not([data-raises-header])');\n\n var fields = {\n 'data-raise-serie': raise.serie,\n 'data-raise-operation': raise.operation,\n 'data-raise-date': raise.date,\n 'data-raise-amount': raise.amount,\n 'data-raise-img': raise.img\n // 'data-raise-wcountry': raise.wcountry\n };\n\n var substitutions = [];\n Object.keys(fields).forEach(function(attr) {\n var cell = dataRow ? dataRow.querySelector('[' + attr + ']') : row.querySelector('[' + attr + ']');\n if (!cell) return;\n substitutions.push({ cell: cell, data: fields[attr] });\n });\n\n substitutions.forEach(function(sub) {\n var data = sub.data;\n if (data && typeof data === 'object' && data.isTooltip) {\n sub.cell.textContent = data.label;\n var bubbleText = sub.cell.closest('[data-css-tooltip-hover]').querySelector('.css-tooltip-text');\n if (bubbleText) bubbleText.textContent = data.bubble;\n } else if (sub.cell.tagName === 'IMG') {\n sub.cell.src = data || '';\n } else {\n sub.cell.textContent = data || '';\n }\n });\n\n parent.appendChild(row);\n });\n }\n\n /**\n * Calcule la somme des montants des clones injectés\n * et met à jour [data-raises-total] avec le montant formaté.\n */\n function injectTotal(target) {\n var totalM = 0;\n target.querySelectorAll('[data-raise-clone] [data-raise-amount]').forEach(function(el) {\n totalM += parseAmount(el.textContent);\n });\n var totalEl = target.querySelector('[data-raises-total]');\n if (totalEl) totalEl.textContent = formatAmount(totalM);\n }\n\n\n // ════════════════════════════════════════════════════════════════════════════\n // MODAL — OUVRIR / FERMER\n // ════════════════════════════════════════════════════════════════════════════\n\n /**\n * Gère l'ouverture de la modal au clic sur [data-modal-open].\n */\n function handleModalOpen(e) {\n var trigger = e.target.closest('[data-modal-open]');\n if (!trigger) return;\n\n var slugEl = e.target.closest('[data-slug]');\n var slug = (slugEl && slugEl !== trigger\n ? slugEl.getAttribute('data-slug')\n : trigger.getAttribute('data-slug') || ''\n ).trim().toLowerCase();\n\n var company = (trigger.getAttribute('data-company') || '').trim().toLowerCase();\n\n document.querySelectorAll('[data-modal-item]').forEach(function(item) {\n item.style.setProperty('display', 'none', 'important');\n });\n\n var target = document.querySelector('[data-modal-item=\"' + slug + '\"]');\n if (target) {\n target.parentNode.insertBefore(target, target.parentNode.firstChild);\n target.style.setProperty('display', 'block', 'important');\n\n var count = document.querySelectorAll('[data-modal-item][data-company=\"' + company + '\"]').length;\n target.setAttribute('data-raises-count', count === 1 ? 'single' : 'multiple');\n\n injectRaises(target, window.raisesIndex[company]);\n injectTotal(target);\n }\n\n window.modal.classList.add('is-open');\n document.body.style.overflow = 'hidden';\n }\n\n /**\n * Ferme la modal et restaure le scroll de la page.\n */\n function closeModal() {\n window.modal.classList.remove('is-open');\n document.body.style.overflow = '';\n }\n\n /**\n * Branche tous les listeners de la modal.\n */\n function initModalListeners() {\n document.addEventListener('click', handleModalOpen);\n\n window.modal.addEventListener('click', function(e) {\n if (e.target === window.modal || e.target === window.modal.querySelector('[data-modal-container]')) closeModal();\n });\n\n document.querySelectorAll('[data-modal-close]').forEach(function(btn) {\n btn.addEventListener('click', closeModal);\n });\n\n document.addEventListener('keydown', function(e) {\n if (e.key === 'Escape') closeModal();\n });\n }\n\n /**\n * Écoute l'event Finsweet fs-list-load pour fusionner\n * les nouveaux items chargés sans écraser les pages déjà fetchées.\n */\n function initFinsweetListener() {\n window.addEventListener('fs-list-load', function() {\n mergeIntoIndex(buildRaisesIndex());\n applyCombineStartup();\n });\n }\n\n\n // ════════════════════════════════════════════════════════════════════════════\n // INIT MODALE\n // ════════════════════════════════════════════════════════════════════════════\n\n /**\n * Point d'entrée principal.\n * Guard : on ne charge rien si [data-modal-open] absent de la page.\n */\n function initModal() {\n if (!document.querySelector('[data-modal-open]')) return;\n window.modal = document.querySelector('[data-modal]');\n if (!window.modal) return;\n window.raisesIndex = buildRaisesIndex();\n applyCombineStartup();\n preloadAllPages();\n initFinsweetListener();\n initModalListeners();\n }\n\n window.addEventListener('load', initModal);\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 document.querySelector(\"[data-css-tooltip-hover]\") &&\n initMobileTooltips();\n}\ninitPageScripts();",[166],"7c073498-2c45-11f1-acaf-42dde27851f2","ARCHIVES","784ea9f8-2c45-11f1-a013-42dde27851f2",495,true,["D",1774881236903],"directory",[174],"pulls","branches","forks","envVars",{"_188":60,"_190":60},"connections",{"_188":60,"_189":60},"count","unfilledCount","emptyCount",{"_43":173,"_32":174,"_30":175,"_133":-5,"_41":42,"_40":176,"_135":177,"_38":248,"_13":154,"_34":179,"_36":-5,"_24":25,"_139":-5,"_202":249,"_27":250},{"_43":239,"_32":240,"_30":241,"_133":175,"_41":42,"_40":242,"_135":177,"_38":243,"_13":244,"_34":35,"_36":245,"_24":25,"_139":-5,"_202":246,"_27":247},{"_43":230,"_32":231,"_30":232,"_133":175,"_41":42,"_40":233,"_135":177,"_38":234,"_13":235,"_34":35,"_36":236,"_24":25,"_139":-5,"_202":237,"_27":238},{"_43":222,"_32":223,"_30":224,"_133":175,"_41":42,"_40":225,"_135":177,"_38":226,"_13":162,"_34":35,"_36":227,"_24":25,"_139":-5,"_202":228,"_27":229},{"_43":217,"_32":33,"_30":31,"_133":175,"_41":42,"_40":14,"_135":177,"_38":218,"_13":219,"_34":35,"_36":37,"_24":25,"_139":-5,"_202":220,"_27":221},{"_43":165,"_32":166,"_30":167,"_133":-5,"_41":42,"_40":168,"_135":25,"_38":214,"_13":170,"_34":35,"_36":171,"_24":25,"_139":-5,"_202":215,"_27":216},{"_43":157,"_32":158,"_30":159,"_133":-5,"_41":42,"_40":160,"_135":25,"_38":211,"_13":162,"_34":35,"_36":163,"_24":25,"_139":-5,"_202":212,"_27":213},{"_43":149,"_32":150,"_30":151,"_133":-5,"_41":42,"_40":152,"_135":25,"_38":208,"_13":154,"_34":35,"_36":155,"_24":25,"_139":-5,"_202":209,"_27":210},{"_43":141,"_32":142,"_30":143,"_133":-5,"_41":42,"_40":144,"_135":25,"_38":205,"_13":146,"_34":35,"_36":147,"_24":25,"_139":-5,"_202":206,"_27":207},{"_43":130,"_32":131,"_30":132,"_133":-5,"_41":42,"_40":134,"_135":25,"_38":201,"_13":137,"_34":35,"_36":138,"_24":25,"_139":-5,"_202":203,"_27":204},["D",1776172356552],"children",[],[131],["D",1779891104493],[],[142],["D",1779802753254],[],[150],["D",1779432513993],[],[158],["D",1779450959761],[],[166],"ff05e12a-5b32-11f1-a444-ee650bb23af1",["D",1780041000998],4,[],[174,33],"fdd51960-5b32-11f1-889a-ee650bb23af1","backup-22mai-table2.js","849ec67e-55c7-11f1-85ed-ee650bb23af1",657,["D",1780040999009],"/* =========================\n 📆 UPDATE 21-05-2026_15:33\n ========================= */\n\n/* =========================\n ✅ GESTION TYPEFORM (laisser en haut)\n ========================= */\n(function TypeformManager() {\n /* =========================\n CONFIG\n ========================= */\n const CONFIG = {\n iframeSelector: \".tf-v1-iframe-wrapper iframe\",\n iframeDelayMs: 400,\n };\n\n /* =========================\n HELPERS\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 const currentSrc = iframe.getAttribute(\"src\");\n let newSrc = currentSrc;\n if (params.email) {\n const sep = currentSrc.includes(\"?\") ? \"&\" : \"?\";\n newSrc = `${currentSrc}${sep}email=${params.email}`;\n }\n iframe.setAttribute(\"src\", newSrc);\n console.log(\"Updated iframe src:\", iframe.src);\n }\n\n /**\n * Ouvre le Typeform correspondant au rôle demandé.\n * Fallback sur le premier trigger trouvé si aucun rôle ne correspond.\n *\n * @param {string} role - data-tf-role du trigger (ex: \"default\", \"special\")\n * @param {string} email - email pré-rempli (optionnel)\n */\n function openTf({ role = \"\", email = \"\" } = {}) {\n const trigger =\n document.querySelector(`[OpenTf=\"trigger\"][data-tf-role=\"${role}\"]`) ??\n document.querySelectorAll('[OpenTf=\"trigger\"]')[0];\n\n if (!trigger) {\n console.warn(\n `Typeform trigger not found${role ? ` for role: ${role}` : \"\"}`,\n );\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(() => updateIframeParams({ email }), CONFIG.iframeDelayMs);\n }\n }\n\n /* =========================\n LISTENERS\n ========================= */\n\n // submit formulaire → récupère email + role depuis data-tf-role\n document.querySelectorAll('[OpenTf=\"form\"]').forEach((form) => {\n form.addEventListener(\"submit\", function (event) {\n event.preventDefault();\n const email = getEmailFromElement(form);\n const role = form.dataset.tfRole || \"\";\n openTf({ role, email });\n });\n });\n\n // clic simple → ouvre le form lié via data-tf-role\n document.querySelectorAll('[OpenTf=\"btn\"]').forEach((el) => {\n el.addEventListener(\"click\", function (event) {\n event.preventDefault();\n const role = el.dataset.tfRole || \"\";\n openTf({ role });\n });\n });\n // Exposition globale pour debug console\n window.TypeformManager = { openTf };\n})();\n\n/* =========================\n ✅ NAVBAR\n ========================= */\n\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 const slideMenu = document.querySelector(\".slide-menu\");\n\n function openMenu() {\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 mainWrapper.style.filter = \"blur(4px)\";\n mainWrapper.style.transition =\n \"filter 0.5s cubic-bezier(.165, .84, .44, 1)\";\n document.body.style.overflow = \"hidden\";\n }\n\n function closeMenu() {\n navbarMenus.forEach((menu) => {\n menu.style.display = \"none\";\n });\n backgroundNavbar.style.display = \"none\";\n backgroundNavbar.style.transform = \"translateY(-100%)\";\n mainWrapper.style.filter = \"blur(0px)\";\n document.body.style.overflow = \"\";\n }\n\n if (menuButton) {\n menuButton.addEventListener(\"click\", () => {\n setTimeout(() => {\n const atLeastOneMenuOpen = Array.from(navbarMenus).some((menu) => {\n return window.getComputedStyle(menu).display === \"flex\";\n });\n atLeastOneMenuOpen ? openMenu() : closeMenu();\n }, 50);\n });\n }\n\n if (slideMenu) {\n slideMenu.addEventListener(\"click\", (e) => {\n if (e.target === slideMenu) {\n closeMenu();\n // Simuler le clic sur menuButton pour que Webflow remette l'icône burger\n setTimeout(() => menuButton.click(), 10);\n }\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\n// Cache DOM au premier appel, évite les querySelectorAll répétés\nlet toggles = null;\nfunction getToggles() {\n if (!toggles) {\n toggles = [...document.querySelectorAll('[card-blur-tabs=\"toggle\"]')];\n }\n return toggles;\n}\n\n// Ouvre/ferme une liste via data-attribute (évite getComputedStyle)\nfunction setListOpen(list, open) {\n if (open) {\n list.style.setProperty(\"height\", \"auto\", \"important\");\n list.style.setProperty(\"overflow\", \"visible\", \"important\");\n list.style.setProperty(\"display\", \"flex\", \"important\");\n list.dataset.cbOpen = \"1\";\n } else {\n list.style.setProperty(\"height\", \"0px\", \"important\");\n list.style.setProperty(\"overflow\", \"hidden\", \"important\");\n list.style.setProperty(\"display\", \"none\", \"important\");\n delete list.dataset.cbOpen;\n }\n}\n\nfunction isListOpen(list) {\n return list.dataset.cbOpen === \"1\";\n}\n\n// Met à jour le style d'un toggle en fonction de l'état (sans setTimeout ni rAF imbriqué)\nfunction applyToggleStyle(toggle, open) {\n const dropdown = toggle.querySelector('[card-blur-tabs=\"dropdown\"]');\n const dropdownDark = toggle.querySelector('[card-blur-tabs=\"dropdown-dark\"]');\n\n // dropdown-close color\n toggle.querySelectorAll(\"[dropdown-close]\").forEach((el) => {\n const closeColor = el.getAttribute(\"dropdown-close\");\n if (!closeColor) return;\n el.style.setProperty(\"color\", open ? \"white\" : closeColor, \"important\");\n });\n\n if (dropdown) {\n const child = dropdown.children[0];\n if (child) {\n child.style.setProperty(\n \"transform\",\n open ? \"rotate(0deg)\" : \"rotate(180deg)\",\n \"important\",\n );\n }\n dropdown.style.setProperty(\"color\", open ? \"white\" : \"\", \"important\");\n dropdown.style.setProperty(\n \"background-image\",\n open ? \"none\" : \"\",\n \"important\",\n );\n }\n\n if (dropdownDark) {\n const child = dropdownDark.children[0];\n if (child) {\n child.style.setProperty(\n \"transform\",\n open ? \"rotate(0deg)\" : \"rotate(180deg)\",\n \"important\",\n );\n }\n dropdownDark.style.setProperty(\n \"background-color\",\n open ? \"#00094A\" : \"\",\n \"important\",\n );\n dropdownDark.style.setProperty(\"color\", open ? \"white\" : \"\", \"important\");\n dropdownDark.style.setProperty(\"border\", open ? \"none\" : \"\", \"important\");\n }\n}\n\nfunction resetToggleStyle(toggle) {\n const dropdown = toggle.querySelector('[card-blur-tabs=\"dropdown\"]');\n const dropdownDark = toggle.querySelector('[card-blur-tabs=\"dropdown-dark\"]');\n\n toggle.querySelectorAll(\"[dropdown-close]\").forEach((el) => {\n el.style.color = \"\";\n });\n if (dropdown) {\n const child = dropdown.children[0];\n if (child) child.style.transform = \"\";\n dropdown.style.color = \"\";\n dropdown.style.backgroundImage = \"\";\n }\n if (dropdownDark) {\n const child = dropdownDark.children[0];\n if (child) child.style.transform = \"\";\n dropdownDark.style.backgroundColor = \"\";\n dropdownDark.style.color = \"\";\n dropdownDark.style.border = \"\";\n }\n}\n\nfunction initCardBlurTabs() {\n if (!mediaQuery.matches) {\n // Desktop : reset tout\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) => {\n list.style.height = \"\";\n list.style.overflow = \"\";\n list.style.display = \"\";\n delete list.dataset.cbOpen;\n });\n getToggles().forEach(resetToggleStyle);\n return;\n }\n\n // Mobile/tablet : init état initial\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) => {\n const isFirst = list.getAttribute(\"card-blur-tabs-load\") === \"first\";\n setListOpen(list, isFirst);\n });\n\n // Sync les styles des toggles sur l'état initial\n getToggles().forEach((toggle) => {\n const lists = [\n ...toggle.parentElement.querySelectorAll('[card-blur-tabs=\"list\"]'),\n ];\n const open = lists.some(isListOpen);\n applyToggleStyle(toggle, open);\n });\n}\n\nfunction handleCardBlurTabsClick() {\n getToggles().forEach((toggle) => {\n toggle.addEventListener(\"click\", () => {\n if (!mediaQuery.matches) return;\n\n const siblingLists = [\n ...toggle.parentElement.querySelectorAll('[card-blur-tabs=\"list\"]'),\n ];\n const wasOpen = siblingLists.some(isListOpen);\n\n // Ferme tout\n document.querySelectorAll('[card-blur-tabs=\"list\"]').forEach((list) =>\n setListOpen(list, false)\n );\n // Reset les styles de tous les toggles\n getToggles().forEach((t) => applyToggleStyle(t, false));\n\n if (!wasOpen) {\n // Ouvre les listes du toggle cliqué\n siblingLists.forEach((list) => setListOpen(list, true));\n applyToggleStyle(toggle, true);\n }\n });\n });\n}\n\nmediaQuery.addEventListener(\"change\", initCardBlurTabs);\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; // délai entre chaque batch\n var FADE = 1200; // durée du fondu\n var STAGGER = 1200; // écart entre slots dans un même batch\n var BATCH = 2; // nb de slots changés par batch (fixe, plus prévisible)\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 var slotObserver = new IntersectionObserver(function (entries) {\n entries.forEach(function (entry) {\n if (entry.isIntersecting) visibleSlots.add(entry.target);\n else visibleSlots.delete(entry.target);\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 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 slotObserver.observe(slot);\n });\n\n // ── File d'attente tournante ──\n // Garantit que chaque slot visible est rafraîchi avant qu'un autre\n // repasse, puis on mélange la prochaine tournée pour varier l'ordre.\n var queue = [];\n function pickFromQueue(n) {\n var visible = Array.from(visibleSlots);\n if (visible.length === 0) return [];\n\n // Retire de la queue les slots devenus invisibles\n queue = queue.filter(function (s) {\n return visibleSlots.has(s);\n });\n\n // Complète / recharge la queue si elle est trop courte\n if (queue.length < n) {\n // Tous les slots visibles ont déjà été vus → on prépare un nouveau tour\n var remaining = visible.filter(function (s) {\n return !queue.includes(s);\n });\n queue = queue.concat(shuffle(remaining));\n }\n\n return queue.splice(0, Math.min(n, queue.length));\n }\n\n // ── Cycle batch ──\n function runBatch() {\n var picked = pickFromQueue(BATCH);\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; // force reflow\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 if (document.querySelector(\"[data-tabs-wrap]\")) {\n AutoRotateFakeTabs();\n }\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\", (e) => {\n const vid = btn.getAttribute(\"data-vimeo-lightbox-id\");\n\n // Si pas d'ID de vidéo (ex: CMS vide), on ne fait rien\n if (!vid || vid.trim() === \"\") {\n e.preventDefault();\n console.warn(\n \"⚠️ [Vimeo Lightbox] Clic ignoré : aucun ID de vidéo trouvé pour cet item CMS.\",\n );\n return;\n }\n\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 ✅ TOOLTIP MOBILE\n ========================= */\nfunction initMobileTooltips() {\n let activeTooltip = null;\n let originalParent = null;\n\n const closeActiveTooltip = () => {\n if (!activeTooltip) return;\n\n const tooltipToClose = activeTooltip;\n const parentToReturn = originalParent;\n\n console.log(\"🕒 [Tooltip] Fermeture :\", tooltipToClose);\n\n tooltipToClose.classList.remove(\"is-active\");\n document.body.style.overflow = \"\";\n\n setTimeout(() => {\n if (!tooltipToClose.classList.contains(\"is-active\")) {\n tooltipToClose.classList.remove(\"tooltip-moving\");\n // On remet la tooltip à sa place d'origine (dans le trigger ou après)\n if (parentToReturn) {\n console.log(\"♻️ [Tooltip] Retour au DOM d'origine.\");\n parentToReturn.appendChild(tooltipToClose);\n }\n }\n }, 400);\n\n activeTooltip = null;\n originalParent = null;\n };\n\n const openTooltipMobile = (tooltip, trigger) => {\n console.log(\"✨ [Tooltip] Ouverture demandée.\");\n\n if (activeTooltip) {\n closeActiveTooltip();\n }\n\n activeTooltip = tooltip;\n // On stocke le parent direct pour savoir où la remettre plus tard\n originalParent = tooltip.parentElement;\n\n document.body.style.overflow = \"hidden\";\n activeTooltip.classList.add(\"tooltip-moving\");\n document.body.appendChild(activeTooltip);\n\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n activeTooltip.classList.add(\"is-active\");\n console.log(\"🚀 [Tooltip] Animation lancée (is-active).\");\n });\n });\n };\n\n document.addEventListener(\"click\", (e) => {\n // On ne s'active que sur mobile/tablette\n if (window.innerWidth >= 768) return;\n\n const trigger = e.target.closest(\"[data-css-tooltip-hover]\");\n const clickedInsideTooltip = e.target.closest(\n \"[data-css-tooltip].is-active\",\n );\n\n // CAS 1 : Clic dans la bulle ouverte -> On ferme\n if (clickedInsideTooltip) {\n console.log(\"🖱️ [Click] Intérieur bulle -> Fermeture.\");\n closeActiveTooltip();\n return;\n }\n\n // CAS 2 : Clic sur un déclencheur\n if (trigger) {\n // Stratégie hybride pour trouver la tooltip :\n // 1. On cherche dedans (cas Pricing)\n // 2. Si rien, on cherche l'élément frère suivant (cas Décacornes)\n let tooltip = trigger.querySelector(\"[data-css-tooltip]\");\n\n if (!tooltip) {\n tooltip = trigger.nextElementSibling;\n }\n\n // Vérification finale de l'attribut\n if (!tooltip || !tooltip.hasAttribute(\"data-css-tooltip\")) {\n console.warn(\n \"⚠️ [Tooltip] Trigger détecté mais aucune bulle associée trouvée.\",\n trigger,\n );\n return;\n }\n\n console.log(\"✅ [Tooltip] Correspondance trouvée !\");\n\n if (activeTooltip === tooltip) {\n closeActiveTooltip();\n return;\n }\n\n openTooltipMobile(tooltip, trigger);\n e.preventDefault();\n return;\n }\n\n // CAS 3 : Clic n'importe où ailleurs\n if (activeTooltip) {\n console.log(\"🖱️ [Click] Extérieur -> Fermeture.\");\n closeActiveTooltip();\n }\n });\n\n console.log(\"🛠️ [System] Tooltips initialisées (Mode Hybride Activé).\");\n}\n\n// Lancement au chargement du DOM\ndocument.addEventListener(\"DOMContentLoaded\", initMobileTooltips);\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 {\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 ✅ HowTo : variant progress bar et variant opacity\n ---------------------------------------------------------- */\n\n// auto-tabs — variant 1 (progress bar)\n// Attribut déclencheur sur le wrapper : auto-tabs-wrapper-progress=\"\"\n\nfunction autoTabsProgress() {\n const wrapper = document.querySelector(\"[auto-tabs-wrapper-progress]\");\n if (!wrapper) return;\n\n const tabs = wrapper.querySelectorAll(\"[auto-tab]\");\n const images = wrapper.querySelectorAll(\"[auto-tab-image]\");\n const media = wrapper.querySelector(\"[auto-tabs-media]\");\n\n if (!tabs.length) return;\n\n const DURATION = 6000;\n\n let currentIndex = 0;\n let startTime = null;\n let animFrame = null;\n\n function injectStyles() {\n const style = document.createElement(\"style\");\n style.textContent = `\n [auto-tabs-wrapper-progress] [auto-tab] { opacity: 0.4; transition: opacity 0.4s ease; cursor: pointer; }\n [auto-tabs-wrapper-progress] [auto-tab][active] { opacity: 1; }\n [auto-tabs-wrapper-progress] [auto-tab-body] { opacity: 0; transition: opacity 0.4s ease; }\n [auto-tabs-wrapper-progress] [auto-tab-progress] { height: 2px !important; overflow: hidden; background: rgba(0, 9, 74, 0.1); }\n [auto-tabs-wrapper-progress] [auto-tab-bar] { height: 2px !important; display: block; background: #FF4920; }\n [auto-tabs-wrapper-progress] [auto-tabs-media] { position: relative; }\n [auto-tabs-wrapper-progress] [auto-tab-image] { position: absolute; inset: 0; opacity: 0; transition: opacity 0.4s ease; pointer-events: none; }\n [auto-tabs-wrapper-progress] [auto-tab-image][active] { opacity: 1; pointer-events: auto; }\n `;\n document.head.appendChild(style);\n }\n\n function setMediaHeight() {\n if (!media || !images.length) return;\n\n const firstImg = images[0];\n\n function applyHeight() {\n images.forEach(function (img) { img.style.display = \"block\"; });\n const height = images[0].offsetHeight;\n images.forEach(function (img) { img.style.display = \"\"; });\n if (height > 0) media.style.height = height + \"px\";\n }\n\n if (firstImg.complete && firstImg.naturalHeight > 0) {\n applyHeight();\n } else {\n firstImg.addEventListener(\"load\", applyHeight, { once: true });\n }\n }\n\n function setActive(index) {\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) { body.style.display = \"none\"; body.style.opacity = \"0\"; }\n if (number) number.style.color = \"\";\n });\n\n images.forEach(function (img) { img.removeAttribute(\"active\"); });\n\n const activeTab = wrapper.querySelector('[auto-tab][tab-index=\"' + index + '\"]');\n const activeImg = wrapper.querySelector('[auto-tab-image][tab-index=\"' + index + '\"]');\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 requestAnimationFrame(function () { body.style.opacity = \"1\"; });\n }\n }\n\n if (activeImg) activeImg.setAttribute(\"active\", \"\");\n\n currentIndex = index;\n startTime = null;\n cancelAnimationFrame(animFrame);\n animFrame = requestAnimationFrame(animate);\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 = wrapper.querySelector('[auto-tab][tab-index=\"' + currentIndex + '\"]');\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 setActive((currentIndex + 1) % tabs.length);\n }\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 injectStyles();\n setMediaHeight();\n window.addEventListener(\"resize\", setMediaHeight);\n setActive(0);\n}\n\nautoTabsProgress();\n// auto-tabs — variant 2 (opacity only)\n// Attribut déclencheur sur le wrapper : auto-tabs-wrapper-opacity=\"\"\n\nfunction autoTabsOpacity() {\n const wrapper = document.querySelector(\"[auto-tabs-wrapper-opacity]\");\n if (!wrapper) return;\n\n const tabs = wrapper.querySelectorAll(\"[auto-tab]\");\n const images = wrapper.querySelectorAll(\"[auto-tab-image]\");\n const media = wrapper.querySelector(\"[auto-tabs-media]\");\n\n if (!tabs.length) return;\n\n const DURATION = 6000;\n\n let currentIndex = 0;\n let timer = null;\n\n function injectStyles() {\n const style = document.createElement(\"style\");\n style.textContent = `\n [auto-tabs-wrapper-opacity] [auto-tab] { opacity: 0.3; transition: opacity 0.4s ease; cursor: pointer; }\n [auto-tabs-wrapper-opacity] [auto-tab][active] { opacity: 1; }\n [auto-tabs-wrapper-opacity] [auto-tab-body] { opacity: 1 !important; display: block !important; }\n [auto-tabs-wrapper-opacity] [auto-tabs-media] { position: relative; }\n [auto-tabs-wrapper-opacity] [auto-tab-image] { position: absolute; inset: 0; opacity: 0; transition: opacity 0.4s ease; pointer-events: none; }\n [auto-tabs-wrapper-opacity] [auto-tab-image][active] { opacity: 1; pointer-events: auto; }\n `;\n document.head.appendChild(style);\n }\n\n function setMediaHeight() {\n if (!media || !images.length) return;\n\n const firstImg = images[0];\n\n function applyHeight() {\n images.forEach(function (img) { img.style.display = \"block\"; });\n const height = images[0].offsetHeight;\n images.forEach(function (img) { img.style.display = \"\"; });\n if (height > 0) media.style.height = height + \"px\";\n }\n\n if (firstImg.complete && firstImg.naturalHeight > 0) {\n applyHeight();\n } else {\n firstImg.addEventListener(\"load\", applyHeight, { once: true });\n }\n }\n\n function setActive(index) {\n tabs.forEach(function (tab) {\n tab.removeAttribute(\"active\");\n const number = tab.querySelector(\"[auto-tab-number]\");\n if (number) number.style.color = \"\";\n });\n\n images.forEach(function (img) { img.removeAttribute(\"active\"); });\n\n const activeTab = wrapper.querySelector('[auto-tab][tab-index=\"' + index + '\"]');\n const activeImg = wrapper.querySelector('[auto-tab-image][tab-index=\"' + index + '\"]');\n\n if (activeTab) {\n activeTab.setAttribute(\"active\", \"\");\n const number = activeTab.querySelector(\"[auto-tab-number]\");\n if (number) number.style.color = \"#FF4920\";\n }\n\n if (activeImg) activeImg.setAttribute(\"active\", \"\");\n\n currentIndex = index;\n clearTimeout(timer);\n timer = setTimeout(function () {\n setActive((currentIndex + 1) % tabs.length);\n }, DURATION);\n }\n\n tabs.forEach(function (tab) {\n tab.addEventListener(\"click\", function () {\n clearTimeout(timer);\n setActive(parseInt(tab.getAttribute(\"tab-index\")));\n });\n });\n\n injectStyles();\n setMediaHeight();\n window.addEventListener(\"resize\", setMediaHeight);\n setActive(0);\n}\n\nautoTabsOpacity();\n\n // ════════════════════════════════════════════════════════════════════════════\n // MODALE LEVÉES TABLE\n // ════════════════════════════════════════════════════════════════════════════\n\n // ── Globals accessibles depuis la console ──────────────────────────────────\n window.raisesIndex = {};\n window.modal;\n\n\n // ════════════════════════════════════════════════════════════════════════════\n // UTILITAIRES\n // ════════════════════════════════════════════════════════════════════════════\n\n /**\n * Lit la valeur d'un attribut data sur un élément ou son enfant.\n * — Cas image (IMG) : retourne le src\n * — Cas badge (.perf-badge-wrapper) : retourne le texte visible\n * — Cas tooltip ([data-css-tooltip-hover]) : retourne { isTooltip, label, bubble }\n * La bulle est cherchée dans le parentNode du trigger (structure .tooltip-wrapper)\n * — Cas texte simple : retourne textContent\n */\n function readAttr(root, attr) {\n if (root.hasAttribute(attr)) return root.getAttribute(attr) || '';\n var child = root.querySelector('[' + attr + ']');\n if (!child) return '';\n\n // Cas image\n if (child.tagName === 'IMG') return child.src || '';\n\n // Cas badge série\n var badgeWrapper = child.closest('.perf-badge-wrapper');\n if (badgeWrapper) return child.textContent.trim();\n\n // Cas tooltip — bulle cherchée dans le parentNode du trigger\n var tooltipTrigger = child.closest('[data-css-tooltip-hover]');\n if (tooltipTrigger) {\n var bubbleText = tooltipTrigger.parentNode.querySelector('.css-tooltip-text');\n return {\n isTooltip: true,\n label: child.textContent.trim(),\n bubble: bubbleText ? bubbleText.textContent.trim() : ''\n };\n }\n\n return child.textContent.trim();\n }\n\n /**\n * Parse un montant formaté vers des millions (Float).\n * Formats acceptés : \"22,1M€\" | \"500K€\" | \"1,2Md€\"\n */\n function parseAmount(str) {\n if (!str || typeof str !== 'string') return 0;\n var s = str.trim().replace(',', '.');\n var num = parseFloat(s.replace(/[^0-9.]/g, ''));\n if (isNaN(num)) return 0;\n if (s.indexOf('Md') !== -1) return num * 1000;\n if (s.indexOf('K') !== -1) return num / 1000;\n return num;\n }\n\n /**\n * Formate un total en millions vers la meilleure unité lisible.\n * < 1M → K€ | 1–999M → M€ | ≥ 1000M → Md€\n */\n function formatAmount(totalM) {\n if (totalM >= 1000) return (totalM / 1000).toFixed(1).replace('.', ',').replace(',0', '') + 'Md€';\n if (totalM >= 1) return totalM.toFixed(1).replace('.', ',').replace(',0', '') + 'M€';\n return Math.round(totalM * 1000) + 'K€';\n }\n\n\n // ════════════════════════════════════════════════════════════════════════════\n // INDEX DES LEVÉES\n // ════════════════════════════════════════════════════════════════════════════\n\n /**\n * Parcourt tous les [data-modal-open] du DOM visible et construit\n * un index { companySlug: [{ serie, operation, date, amount, img }, ...] }.\n */\n function buildRaisesIndex() {\n var index = {};\n document.querySelectorAll('[data-modal-open]').forEach(function (trigger) {\n var company = (trigger.getAttribute('data-company') || '').trim().toLowerCase();\n if (!company) return;\n index[company] = index[company] || [];\n index[company].push({\n serie: readAttr(trigger, 'data-raise-serie'),\n operation: readAttr(trigger, 'data-raise-operation'),\n date: readAttr(trigger, 'data-raise-date'),\n amount: readAttr(trigger, 'data-raise-amount'),\n img: readAttr(trigger, 'data-raise-img'),\n // wcountry: readAttr(trigger, 'data-raise-wcountry') // désactivé — client\n });\n });\n return index;\n }\n\n /**\n * Fusionne un nouvel index partiel dans raisesIndex sans créer de doublons.\n * Comparaison par amount.\n */\n function mergeIntoIndex(fresh) {\n Object.keys(fresh).forEach(function (company) {\n fresh[company].forEach(function (raise) {\n var existing = window.raisesIndex[company] || [];\n var isDupe = existing.some(function (r) {\n var rAmount = (typeof r.amount === 'object') ? r.amount.content : r.amount;\n var raiseAmount = (typeof raise.amount === 'object') ? raise.amount.content : raise.amount;\n return rAmount === raiseAmount;\n });\n if (!isDupe) {\n window.raisesIndex[company] = window.raisesIndex[company] || [];\n window.raisesIndex[company].push(raise);\n }\n });\n });\n }\n\n /**\n * Charge toutes les pages suivantes en arrière-plan via fetch\n * pour compléter raisesIndex avec les items hors page courante.\n * Ne modifie pas l'affichage — uniquement l'index.\n */\n function preloadAllPages() {\n var nextLink = document.querySelector('.w-pagination-next');\n if (!nextLink) return;\n\n function fetchPage(url) {\n fetch(url).then(function (r) { return r.text(); }).then(function (html) {\n var doc = new DOMParser().parseFromString(html, 'text/html');\n var fresh = {};\n doc.querySelectorAll('[data-modal-open]').forEach(function (trigger) {\n var company = (trigger.getAttribute('data-company') || '').trim().toLowerCase();\n if (!company) return;\n fresh[company] = fresh[company] || [];\n fresh[company].push({\n serie: readAttr(trigger, 'data-raise-serie'),\n operation: readAttr(trigger, 'data-raise-operation'),\n date: readAttr(trigger, 'data-raise-date'),\n amount: readAttr(trigger, 'data-raise-amount'),\n img: readAttr(trigger, 'data-raise-img'),\n // wcountry: readAttr(trigger, 'data-raise-wcountry')\n });\n });\n mergeIntoIndex(fresh);\n var next = doc.querySelector('.w-pagination-next');\n if (next) fetchPage(next.href);\n });\n }\n\n fetchPage(nextLink.href);\n }\n\n\n // ════════════════════════════════════════════════════════════════════════════\n // INJECTION DANS LA MODAL\n // ════════════════════════════════════════════════════════════════════════════\n\n /**\n * Clone le template [data-raise-template] pour chaque levée et injecte les données.\n * — Tooltip : met à jour label + texte bulle sans toucher à la structure\n * — Image : met à jour le src\n * — Texte : textContent\n * Les clones précédents sont supprimés avant chaque injection.\n */\n function injectRaises(modalItem, raises) {\n var template = modalItem.querySelector('[data-raise-template]');\n if (!template || !raises) return;\n\n var parent = template.parentNode;\n modalItem.querySelectorAll('[data-raise-clone]').forEach(function (el) { el.remove(); });\n\n raises.forEach(function (raise) {\n var row = template.cloneNode(true);\n row.removeAttribute('data-raise-template');\n row.setAttribute('data-raise-clone', '');\n row.style.display = '';\n\n var dataRow = row.querySelector('.data-raise-row:not([data-raises-header])');\n\n var fields = {\n 'data-raise-serie': raise.serie,\n 'data-raise-operation': raise.operation,\n 'data-raise-date': raise.date,\n 'data-raise-amount': raise.amount,\n 'data-raise-img': raise.img,\n // 'data-raise-wcountry': raise.wcountry // désactivé — client\n };\n\n // Collecte toutes les refs de cellules AVANT de modifier le DOM\n var substitutions = [];\n Object.keys(fields).forEach(function (attr) {\n var cell = dataRow ? dataRow.querySelector('[' + attr + ']') : row.querySelector('[' + attr + ']');\n if (!cell) return;\n substitutions.push({ cell: cell, data: fields[attr] });\n });\n\n // Applique les substitutions\n substitutions.forEach(function (sub) {\n var data = sub.data;\n if (data && typeof data === 'object' && data.isTooltip) {\n // Tooltip : met à jour le label et le texte de la bulle\n sub.cell.textContent = data.label;\n var bubbleText = sub.cell.closest('[data-css-tooltip-hover]').querySelector('.css-tooltip-text');\n if (bubbleText) bubbleText.textContent = data.bubble;\n } else if (sub.cell.tagName === 'IMG') {\n sub.cell.src = data || '';\n } else {\n sub.cell.textContent = data || '';\n }\n });\n\n parent.appendChild(row);\n });\n }\n\n /**\n * Calcule la somme des montants des clones injectés\n * et met à jour [data-raises-total] avec le montant formaté.\n */\n function injectTotal(target) {\n var totalM = 0;\n target.querySelectorAll('[data-raise-clone] [data-raise-amount]').forEach(function (el) {\n totalM += parseAmount(el.textContent);\n });\n var totalEl = target.querySelector('[data-raises-total]');\n if (totalEl) totalEl.textContent = formatAmount(totalM);\n }\n\n\n // ════════════════════════════════════════════════════════════════════════════\n // MODAL — OUVRIR / FERMER\n // ════════════════════════════════════════════════════════════════════════════\n\n /**\n * Gère l'ouverture de la modal au clic sur [data-modal-open].\n * 1. Masque tous les modal-items\n * 2. Affiche le bon modal-item via data-slug\n * 3. Injecte les levées regroupées par data-company\n * 4. Applique data-raises-count=\"single|multiple\" pour le CSS conditionnel\n * 5. Calcule et affiche le total des levées\n */\n function handleModalOpen(e) {\n var trigger = e.target.closest('[data-modal-open]');\n if (!trigger) return;\n\n //var slug = (trigger.getAttribute('data-slug') || '').trim().toLowerCase();\n //var company = (trigger.getAttribute('data-company') || '').trim().toLowerCase();\n\n var slug = (trigger.getAttribute('data-slug') || trigger.querySelector('[data-slug]') && trigger.querySelector('[data-slug]').getAttribute('data-slug') || '').trim().toLowerCase();\nvar company = (trigger.getAttribute('data-company') || trigger.querySelector('[data-company]') && trigger.querySelector('[data-company]').getAttribute('data-company') || '').trim().toLowerCase();\n\n document.querySelectorAll('[data-modal-item]').forEach(function (item) {\n item.style.setProperty('display', 'none', 'important');\n });\n\n var target = document.querySelector('[data-modal-item=\"' + slug + '\"]');\n if (target) {\n target.parentNode.insertBefore(target, target.parentNode.firstChild);\n target.style.setProperty('display', 'block', 'important');\n\n var count = document.querySelectorAll('[data-modal-item][data-company=\"' + company + '\"]').length;\n target.setAttribute('data-raises-count', count === 1 ? 'single' : 'multiple');\n\n injectRaises(target, window.raisesIndex[company]);\n injectTotal(target);\n }\n\n window.modal.classList.add('is-open');\n document.body.style.overflow = 'hidden';\n }\n\n /**\n * Ferme la modal et restaure le scroll de la page.\n */\n function closeModal() {\n window.modal.classList.remove('is-open');\n document.body.style.overflow = '';\n }\n\n /**\n * Branche tous les listeners de la modal :\n * — Clic délégué sur [data-modal-open] → ouvre\n * — Clic sur overlay ou container → ferme\n * — Clic sur [data-modal-close] → ferme\n * — Touche Escape → ferme\n */\n function initModalListeners() {\n document.addEventListener('click', handleModalOpen);\n\n window.modal.addEventListener('click', function (e) {\n if (e.target === window.modal || e.target === window.modal.querySelector('[data-modal-container]')) closeModal();\n });\n\n document.querySelectorAll('[data-modal-close]').forEach(function (btn) {\n btn.addEventListener('click', closeModal);\n });\n\n document.addEventListener('keydown', function (e) {\n if (e.key === 'Escape') closeModal();\n });\n }\n\n /**\n * Écoute l'event Finsweet fs-list-load pour fusionner\n * les nouveaux items chargés sans écraser les pages déjà fetchées.\n */\n function initFinsweetListener() {\n window.addEventListener('fs-list-load', function () {\n mergeIntoIndex(buildRaisesIndex());\n });\n }\n\n\n // ════════════════════════════════════════════════════════════════════════════\n // INIT\n // ════════════════════════════════════════════════════════════════════════════\n\n /**\n * Point d'entrée principal.\n * Guard : on ne charge rien si [data-modal-open] absent de la page.\n */\n function initModal() {\n if (!document.querySelector('[data-modal-open]')) return;\n window.modal = document.querySelector('[data-modal]');\n if (!window.modal) return;\n window.raisesIndex = buildRaisesIndex();\n preloadAllPages();\n initFinsweetListener();\n initModalListeners();\n }\n\n window.addEventListener('load', initModal);\n\n\n // ════════════════════════════════════════════════════════════════════════════\n // INIT\n // ════════════════════════════════════════════════════════════════════════════\n\n /**\n * Point d'entrée principal.\n * 1. Récupère la modal\n * 2. Construit l'index initial depuis le DOM\n * 3. Lance le preload silencieux des pages suivantes\n * 4. Branche les listeners Finsweet et modal\n */\n function init() {\n modal = document.querySelector('[data-modal]');\n if (!modal) return;\n raisesIndex = buildRaisesIndex();\n preloadAllPages();\n initFinsweetListener();\n initModalListeners();\n // console.log('[init] script modal initialisé');\n }\n\n window.addEventListener('load', init);\n\n } // fin du guard [data-modal-open]\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 document.querySelector(\"[data-css-tooltip-hover]\") &&\n initMobileTooltips();\n}\ninitPageScripts();",[],[174,223],"90f12512-2c45-11f1-a92f-42dde27851f2","backup-1803.js","3b7dd95a-1961-11f1-bfcb-42dde27851f2",497,["D",1774881272107],18,"/* =========================\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 {\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();",[],[174,231],"8ec3bf66-2c45-11f1-9eed-42dde27851f2","10-03-2026_12-29.js","7fb47db6-1c6f-11f1-b62b-42dde27851f2",496,["D",1774881268449],8,"/* =========================\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 {\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();",[],[174,240],["D",1774881236903],[192,193,194,195],[174],["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":288,"_289":290,"_291":292,"_293":25,"_294":25,"_295":25,"_296":177,"_297":-5,"_298":-7,"_299":-7,"_300":60,"_301":25,"_302":25,"_303":-5,"_304":25,"_305":25,"_306":25,"_307":-5},"ENV",{"_259":260,"_261":262,"_263":84,"_264":265,"_266":267,"_268":269,"_270":271,"_272":273,"_274":275,"_276":277,"_278":279,"_280":281,"_282":283,"_284":285,"_286":287},"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 · v658