{"id":7000,"date":"2026-01-21T21:57:39","date_gmt":"2026-01-21T21:57:39","guid":{"rendered":"https:\/\/entretienlaurentides.ca\/?p=7000"},"modified":"2026-04-03T18:04:48","modified_gmt":"2026-04-03T18:04:48","slug":"patio","status":"publish","type":"post","link":"https:\/\/entretienlaurentides.ca\/?p=7000","title":{"rendered":"Patio"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"7000\" class=\"elementor elementor-7000\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9bc14d4 e-con-full e-flex e-con e-parent\" data-id=\"9bc14d4\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ff06e46 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"ff06e46\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<section id=\"hero-teinture-custom\">\n\n  <video class=\"hero-video\" autoplay muted loop playsinline>\n    <source src=\"https:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/table-de-matie\u0300re.mp4\" type=\"video\/mp4\">\n  <\/video>\n\n  <div class=\"hero-overlay\"><\/div>\n\n  <div class=\"hero-text-block\">\n    <h1>\n      <span class=\"title-main\">Teinture<\/span><br>\n      <span class=\"title-main\">et sablage<\/span>\n    <\/h1>\n\n    <p>\n      Raviver. Prot\u00e9ger.<br>\n      Peaufiner.\n    <\/p>\n\n    <div class=\"hero-cta-wrap\">\n      <a class=\"hero-cta\" href=\"https:\/\/entretienlaurentides.ca\/?page_id=18\">\n        R\u00c9SERVEZ VOTRE SOUMISSION GRATUITE\n      <\/a>\n    <\/div>\n  <\/div>\n\n<\/section>\n\n<style>\nhtml,\nbody {\n  margin: 0 !important;\n  padding: 0 !important;\n  overflow-x: hidden !important;\n}\n\n#hero-teinture-custom {\n  position: relative !important;\n  width: 100vw !important;\n  min-height: 100svh !important;\n  margin-left: calc(50% - 50vw) !important;\n  margin-right: calc(50% - 50vw) !important;\n  display: flex !important;\n  align-items: center !important;\n  justify-content: center !important;\n  overflow: hidden !important;\n  padding: 0 !important;\n  background: #111 !important;\n  isolation: isolate !important;\n}\n\n#hero-teinture-custom .hero-video {\n  position: absolute !important;\n  inset: 0 !important;\n  width: 100% !important;\n  height: 100% !important;\n  object-fit: cover !important;\n  z-index: 0 !important;\n}\n\n#hero-teinture-custom .hero-overlay {\n  position: absolute !important;\n  inset: 0 !important;\n  background: rgba(0, 0, 0, 0.34) !important;\n  z-index: 1 !important;\n}\n\n#hero-teinture-custom .hero-text-block {\n  position: relative !important;\n  z-index: 2 !important;\n  width: min(92vw, 1400px) !important;\n  max-width: 92vw !important;\n  margin: 0 auto !important;\n  padding: 12vh 2vw 16vh !important;\n  text-align: center !important;\n  transform: translateY(48px) !important;\n}\n\n#hero-teinture-custom h1 {\n  display: block !important;\n  width: 100% !important;\n  margin: 0 0 26px 0 !important;\n  color: #ffffff !important;\n  font-family: 'Montserrat', sans-serif !important;\n  font-size: clamp(4.8rem, 10vw, 9rem) !important;\n  font-weight: 200 !important;\n  line-height: 0.9 !important;\n  letter-spacing: 0.015em !important;\n  text-transform: uppercase !important;\n  text-shadow: 0 12px 40px rgba(0, 0, 0, 0.30) !important;\n  transition: transform 0.2s ease-out !important;\n}\n\n#hero-teinture-custom h1 .title-main {\n  display: inline-block !important;\n  font-weight: 200 !important;\n}\n\n#hero-teinture-custom p {\n  display: block !important;\n  width: 100% !important;\n  margin: 0 !important;\n  color: #ffffff !important;\n  opacity: 0.95 !important;\n  font-family: 'Montserrat', sans-serif !important;\n  font-size: clamp(1.5rem, 3vw, 2.8rem) !important;\n  font-weight: 200 !important;\n  line-height: 1.12 !important;\n  letter-spacing: 0.035em !important;\n  text-transform: uppercase !important;\n  transition: transform 0.2s ease-out !important;\n}\n\n#hero-teinture-custom .hero-cta-wrap {\n  margin-top: 58px !important;\n}\n\n#hero-teinture-custom .hero-cta {\n  display: inline-flex !important;\n  align-items: center !important;\n  justify-content: center !important;\n  min-height: 60px !important;\n  padding: 0 34px !important;\n  border: 1.5px solid rgba(255, 255, 255, 0.82) !important;\n  border-radius: 4px !important;\n  background: rgba(255, 255, 255, 0.06) !important;\n  backdrop-filter: blur(8px) !important;\n  -webkit-backdrop-filter: blur(8px) !important;\n  color: #ffffff !important;\n  text-decoration: none !important;\n  font-family: 'Montserrat', sans-serif !important;\n  text-transform: uppercase !important;\n  letter-spacing: 0.18em !important;\n  font-size: 0.80rem !important;\n  font-weight: 500 !important;\n  line-height: 1 !important;\n  text-align: center !important;\n  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.18) !important;\n  transition:\n    background 0.35s ease,\n    color 0.35s ease,\n    border-color 0.35s ease,\n    transform 0.35s ease,\n    box-shadow 0.35s ease !important;\n}\n\n#hero-teinture-custom .hero-cta:hover {\n  background: #ffffff !important;\n  color: #111111 !important;\n  border-color: #ffffff !important;\n  transform: translateY(-2px) !important;\n  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.24) !important;\n}\n\n#hero-teinture-custom .hero-cta:focus {\n  outline: none !important;\n  box-shadow:\n    0 0 0 4px rgba(255, 255, 255, 0.14),\n    0 20px 40px rgba(0, 0, 0, 0.24) !important;\n}\n\n@media (max-width: 1200px) {\n  #hero-teinture-custom .hero-text-block {\n    padding: 12vh 2vw 14vh !important;\n    transform: translateY(38px) !important;\n  }\n\n  #hero-teinture-custom h1 {\n    font-size: clamp(4rem, 7vw, 6.6rem) !important;\n    line-height: 0.92 !important;\n  }\n\n  #hero-teinture-custom p {\n    font-size: clamp(1.35rem, 3vw, 2.2rem) !important;\n  }\n\n  #hero-teinture-custom .hero-cta-wrap {\n    margin-top: 46px !important;\n    padding: 0 20px !important;\n  }\n\n  #hero-teinture-custom .hero-cta {\n    padding: 0 28px !important;\n    font-size: 0.76rem !important;\n    letter-spacing: 0.14em !important;\n  }\n}\n\n@media (max-width: 768px) {\n  #hero-teinture-custom {\n    min-height: 100svh !important;\n    padding: 0 16px !important;\n  }\n\n  #hero-teinture-custom .hero-text-block {\n    width: 100% !important;\n    max-width: 100% !important;\n    padding: 14vh 10px 14vh !important;\n    transform: translateY(24px) !important;\n  }\n\n  #hero-teinture-custom h1 {\n    font-size: clamp(2.8rem, 8vw, 4.6rem) !important;\n    line-height: 0.96 !important;\n    margin-bottom: 16px !important;\n    letter-spacing: 0.01em !important;\n  }\n\n  #hero-teinture-custom p {\n    font-size: clamp(1rem, 4.6vw, 1.5rem) !important;\n    line-height: 1.18 !important;\n    letter-spacing: 0.03em !important;\n  }\n\n  #hero-teinture-custom .hero-cta-wrap {\n    margin-top: 40px !important;\n    padding: 0 14px !important;\n  }\n\n  #hero-teinture-custom .hero-cta {\n    width: 100% !important;\n    max-width: 420px !important;\n    min-height: 54px !important;\n    padding: 0 18px !important;\n    border-radius: 3px !important;\n    font-size: 0.70rem !important;\n    line-height: 1.2 !important;\n    letter-spacing: 0.10em !important;\n    white-space: normal !important;\n  }\n}\n\n@media (max-width: 480px) {\n  #hero-teinture-custom .hero-text-block {\n    padding: 15vh 6px 12vh !important;\n    transform: translateY(16px) !important;\n  }\n\n  #hero-teinture-custom h1 {\n    font-size: clamp(2.35rem, 10.2vw, 3.6rem) !important;\n    line-height: 0.98 !important;\n    margin-bottom: 14px !important;\n  }\n\n  #hero-teinture-custom p {\n    font-size: clamp(0.92rem, 4.5vw, 1.18rem) !important;\n    line-height: 1.2 !important;\n  }\n\n  #hero-teinture-custom .hero-cta {\n    font-size: 0.64rem !important;\n    padding: 0 14px !important;\n    letter-spacing: 0.07em !important;\n  }\n}\n<\/style>\n\n<script>\ndocument.addEventListener(\"DOMContentLoaded\", function () {\n  const hero = document.querySelector(\"#hero-teinture-custom\");\n  const title = hero ? hero.querySelector(\"h1\") : null;\n  const subtitle = hero ? hero.querySelector(\"p\") : null;\n\n  if (!hero || !title || !subtitle) return;\n\n  hero.addEventListener(\"mousemove\", function (e) {\n    const rect = hero.getBoundingClientRect();\n    const x = e.clientX - rect.left;\n    const y = e.clientY - rect.top;\n\n    const moveX = (x - rect.width \/ 2) \/ 60;\n    const moveY = (y - rect.height \/ 2) \/ 60;\n\n    title.style.transform = \"translate(\" + moveX + \"px,\" + moveY + \"px)\";\n    subtitle.style.transform = \"translate(\" + (moveX * 0.6) + \"px,\" + (moveY * 0.6) + \"px)\";\n  });\n\n  hero.addEventListener(\"mouseleave\", function () {\n    title.style.transform = \"translate(0,0)\";\n    subtitle.style.transform = \"translate(0,0)\";\n  });\n});\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-562b88b elementor-widget elementor-widget-html\" data-id=\"562b88b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<section class=\"section-bois-premium\">\n  <canvas id=\"paintWaterCanvas\"><\/canvas>\n\n  <div class=\"bois-overlay\"><\/div>\n\n  <div class=\"bois-premium-inner\">\n    <h2 class=\"bois-title reveal-up\">\n      TERRASSES, CL\u00d4TURES, MARCHES OU<br>\n      STRUCTURES EN BOIS :\n    <\/h2>\n\n    <p class=\"bois-text reveal-up delay-1\">\n      Notre service de sablage et teinture vise \u00e0 raviver\n      l\u2019apparence du bois tout en le prot\u00e9geant contre\n      l\u2019usure, l\u2019humidit\u00e9 et les variations climatiques.\n    <\/p>\n\n    <div class=\"bois-signature reveal-up delay-2\">\n      <svg viewBox=\"0 0 620 70\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n        <path d=\"M20 48C136 36 233 36 337 31C409 28 477 23 598 20\"><\/path>\n        <path d=\"M88 53C196 51 287 47 390 43C449 41 516 38 566 34\"><\/path>\n      <\/svg>\n    <\/div>\n  <\/div>\n<\/section>\n\n<style>\nhtml, body{\n  margin:0;\n  padding:0;\n  overflow-x:hidden;\n}\n\n.section-bois-premium{\n  position:relative;\n  width:100vw;\n  margin-left:calc(50% - 50vw);\n  margin-right:calc(50% - 50vw);\n  overflow:hidden;\n  padding:clamp(90px,10vw,150px) 24px clamp(90px,9vw,130px);\n  background:#f2efea;\n  isolation:isolate;\n}\n\n#paintWaterCanvas{\n  position:absolute;\n  inset:0;\n  width:100%;\n  height:100%;\n  display:block;\n  z-index:0;\n}\n\n.bois-overlay{\n  position:absolute;\n  inset:0;\n  z-index:1;\n  background:\n    linear-gradient(180deg, rgba(255,255,255,0.035), rgba(255,255,255,0.012)),\n    rgba(255,255,255,0.018);\n  pointer-events:none;\n}\n\n.bois-premium-inner{\n  position:relative;\n  z-index:2;\n  max-width:1120px;\n  margin:0 auto;\n  text-align:center;\n}\n\n.bois-title{\n  margin:0 auto;\n  max-width:980px;\n  font-family:'Montserrat',sans-serif;\n  font-weight:400;\n  font-size:clamp(34px,4.2vw,60px);\n  line-height:1.08;\n  letter-spacing:0.015em;\n  text-transform:uppercase;\n  color:#241f1b;\n}\n\n.bois-text{\n  margin:clamp(34px,3vw,48px) auto 0;\n  max-width:1080px;\n  font-family:'Montserrat',sans-serif;\n  font-weight:400;\n  font-size:clamp(25px,3vw,38px);\n  line-height:1.22;\n  letter-spacing:-0.02em;\n  color:#241f1b;\n}\n\n.bois-signature{\n  width:min(540px,66vw);\n  margin:clamp(40px,4vw,58px) auto 0;\n}\n\n.bois-signature svg{\n  display:block;\n  width:100%;\n  height:auto;\n}\n\n.bois-signature path{\n  stroke:#8d4745;\n  stroke-width:6;\n  stroke-linecap:round;\n  stroke-linejoin:round;\n  fill:none;\n  opacity:0.95;\n  stroke-dasharray:800;\n  stroke-dashoffset:800;\n}\n\n.reveal-up{\n  opacity:0;\n  transform:translateY(38px) scale(0.985);\n  filter:blur(10px);\n  transition:\n    opacity 1.15s cubic-bezier(0.16,1,0.3,1),\n    transform 1.15s cubic-bezier(0.16,1,0.3,1),\n    filter 1.15s cubic-bezier(0.16,1,0.3,1);\n}\n\n.reveal-up.delay-1{ transition-delay:0.16s; }\n.reveal-up.delay-2{ transition-delay:0.3s; }\n\n.section-bois-premium.is-visible .reveal-up{\n  opacity:1;\n  transform:translateY(0) scale(1);\n  filter:blur(0);\n}\n\n.section-bois-premium.is-visible .bois-signature path{\n  animation:drawBrush 1.6s cubic-bezier(0.65,0,0.35,1) forwards;\n}\n\n.section-bois-premium.is-visible .bois-signature path:last-child{\n  animation-delay:0.18s;\n}\n\n@keyframes drawBrush{\n  to{ stroke-dashoffset:0; }\n}\n\n@media (max-width:900px){\n  .section-bois-premium{\n    padding:80px 20px 90px;\n  }\n\n  .bois-title{\n    font-size:clamp(28px,7vw,44px);\n    line-height:1.12;\n  }\n\n  .bois-text{\n    font-size:clamp(20px,5.2vw,28px);\n    line-height:1.28;\n    max-width:95%;\n  }\n\n  .bois-signature{\n    width:min(320px,72vw);\n    margin-top:32px;\n  }\n\n  .bois-signature path{\n    stroke-width:5;\n  }\n}\n<\/style>\n\n<script>\ndocument.addEventListener(\"DOMContentLoaded\", () => {\n  const section = document.querySelector(\".section-bois-premium\");\n  const canvas = document.getElementById(\"paintWaterCanvas\");\n  const ctx = canvas.getContext(\"2d\");\n\n  if (!section || !canvas || !ctx) return;\n\n  const dpr = Math.min(window.devicePixelRatio || 1, 2);\n  let width = 0;\n  let height = 0;\n  let time = 0;\n\n  const pointer = {\n    x: 0,\n    y: 0,\n    tx: 0,\n    ty: 0,\n    active: false,\n    radius: 150\n  };\n\n  const blobs = [\n    { x: 0.16, y: 0.22, r: 0.22, color: \"rgba(168,160,148,0.16)\", speed: 0.0009, amp: 18 },\n    { x: 0.78, y: 0.22, r: 0.20, color: \"rgba(116,121,118,0.15)\", speed: 0.0011, amp: 20 },\n    { x: 0.33, y: 0.70, r: 0.24, color: \"rgba(126,111,95,0.15)\", speed: 0.0010, amp: 16 },\n    { x: 0.74, y: 0.72, r: 0.24, color: \"rgba(92,108,102,0.14)\", speed: 0.0008, amp: 22 },\n    { x: 0.52, y: 0.48, r: 0.32, color: \"rgba(140,149,156,0.10)\", speed: 0.0007, amp: 15 },\n    { x: 0.46, y: 0.34, r: 0.18, color: \"rgba(61,53,47,0.08)\", speed: 0.0012, amp: 12 },\n    { x: 0.60, y: 0.58, r: 0.20, color: \"rgba(188,181,166,0.10)\", speed: 0.0010, amp: 14 },\n    { x: 0.24, y: 0.50, r: 0.19, color: \"rgba(87,101,122,0.09)\", speed: 0.00085, amp: 13 }\n  ];\n\n  function resizeCanvas() {\n    const rect = section.getBoundingClientRect();\n    width = Math.max(1, Math.floor(rect.width));\n    height = Math.max(1, Math.floor(rect.height));\n\n    canvas.width = Math.floor(width * dpr);\n    canvas.height = Math.floor(height * dpr);\n    canvas.style.width = width + \"px\";\n    canvas.style.height = height + \"px\";\n    ctx.setTransform(dpr, 0, 0, dpr, 0, 0);\n  }\n\n  function lerp(a, b, t) {\n    return a + (b - a) * t;\n  }\n\n  function drawBackground() {\n    const grad = ctx.createLinearGradient(0, 0, width, height);\n    grad.addColorStop(0, \"#f7f5f1\");\n    grad.addColorStop(0.25, \"#eeebe6\");\n    grad.addColorStop(0.52, \"#e5e1db\");\n    grad.addColorStop(0.78, \"#dcd9d4\");\n    grad.addColorStop(1, \"#f1eeea\");\n    ctx.fillStyle = grad;\n    ctx.fillRect(0, 0, width, height);\n  }\n\n  function drawLiquidBlob(cx, cy, radius, color, seed) {\n    ctx.beginPath();\n\n    const points = 72;\n    for (let i = 0; i <= points; i++) {\n      const angle = (Math.PI * 2 * i) \/ points;\n\n      const wave1 = Math.sin(angle * 3 + time * 0.0018 + seed) * radius * 0.075;\n      const wave2 = Math.cos(angle * 5 - time * 0.0012 + seed * 1.7) * radius * 0.045;\n\n      const dx = cx - pointer.x;\n      const dy = cy - pointer.y;\n      const dist = Math.sqrt(dx * dx + dy * dy);\n\n      let pointerInfluence = 0;\n      if (pointer.active || dist < pointer.radius * 2) {\n        const proximity = Math.max(0, 1 - dist \/ (pointer.radius * 2));\n        pointerInfluence = Math.sin(angle - Math.atan2(dy, dx)) * proximity * radius * 0.085;\n      }\n\n      const r = radius + wave1 + wave2 + pointerInfluence;\n      const x = cx + Math.cos(angle) * r;\n      const y = cy + Math.sin(angle) * r;\n\n      if (i === 0) ctx.moveTo(x, y);\n      else ctx.lineTo(x, y);\n    }\n\n    ctx.closePath();\n    ctx.fillStyle = color;\n    ctx.fill();\n  }\n\n  function drawFingerTrail() {\n    const grad = ctx.createRadialGradient(\n      pointer.x, pointer.y, 0,\n      pointer.x, pointer.y, pointer.radius\n    );\n\n    grad.addColorStop(0, \"rgba(84,78,72,0.030)\");\n    grad.addColorStop(0.35, \"rgba(103,110,106,0.022)\");\n    grad.addColorStop(0.68, \"rgba(126,131,139,0.015)\");\n    grad.addColorStop(1, \"rgba(126,131,139,0)\");\n\n    ctx.beginPath();\n    ctx.fillStyle = grad;\n    ctx.arc(pointer.x, pointer.y, pointer.radius, 0, Math.PI * 2);\n    ctx.fill();\n\n    ctx.strokeStyle = \"rgba(70,68,64,0.018)\";\n    ctx.lineWidth = 1;\n\n    for (let i = 0; i < 2; i++) {\n      const rr = pointer.radius * (0.42 + i * 0.22);\n      ctx.beginPath();\n      ctx.arc(\n        pointer.x + Math.sin(time * 0.0016 + i) * 2,\n        pointer.y + Math.cos(time * 0.0018 + i) * 2,\n        rr,\n        0,\n        Math.PI * 2\n      );\n      ctx.stroke();\n    }\n  }\n\n  function drawPaintVeil() {\n    ctx.save();\n    ctx.globalAlpha = 0.035;\n\n    for (let i = 0; i < 16; i++) {\n      const x = (i \/ 15) * width;\n      const yOffset = Math.sin(time * 0.0009 + i * 0.55) * 10;\n\n      ctx.beginPath();\n      ctx.moveTo(x, 0);\n\n      for (let y = 0; y <= height; y += 28) {\n        const xx = x + Math.sin(y * 0.018 + time * 0.0012 + i) * 7;\n        ctx.lineTo(xx, y + yOffset);\n      }\n\n      ctx.strokeStyle = \"rgba(82,52,34,0.10)\";\n      ctx.lineWidth = 1;\n      ctx.stroke();\n    }\n\n    ctx.restore();\n  }\n\n  function animate() {\n    time += 16;\n\n    pointer.x = lerp(pointer.x, pointer.tx, 0.11);\n    pointer.y = lerp(pointer.y, pointer.ty, 0.11);\n\n    drawBackground();\n\n    blobs.forEach((blob, index) => {\n      const cx =\n        blob.x * width +\n        Math.sin(time * blob.speed + index) * blob.amp +\n        (pointer.x - width * 0.5) * 0.008 * (index + 1);\n\n      const cy =\n        blob.y * height +\n        Math.cos(time * blob.speed * 1.2 + index * 1.3) * blob.amp +\n        (pointer.y - height * 0.5) * 0.007 * (index + 1);\n\n      const r =\n        Math.min(width, height) * blob.r *\n        (1 + Math.sin(time * blob.speed * 1.6 + index) * 0.035);\n\n      drawLiquidBlob(cx, cy, r, blob.color, index + 1);\n    });\n\n    drawFingerTrail();\n    drawPaintVeil();\n\n    requestAnimationFrame(animate);\n  }\n\n  section.addEventListener(\"mousemove\", (e) => {\n    const rect = section.getBoundingClientRect();\n    pointer.tx = e.clientX - rect.left;\n    pointer.ty = e.clientY - rect.top;\n    pointer.active = true;\n  });\n\n  section.addEventListener(\"mouseleave\", () => {\n    pointer.active = false;\n    pointer.tx = width * 0.5;\n    pointer.ty = height * 0.5;\n  });\n\n  const observer = new IntersectionObserver((entries, obs) => {\n    entries.forEach(entry => {\n      if (entry.isIntersecting) {\n        section.classList.add(\"is-visible\");\n        obs.unobserve(section);\n      }\n    });\n  }, { threshold: 0.22 });\n\n  observer.observe(section);\n\n  resizeCanvas();\n  pointer.x = width * 0.5;\n  pointer.y = height * 0.5;\n  pointer.tx = width * 0.5;\n  pointer.ty = height * 0.5;\n\n  window.addEventListener(\"resize\", resizeCanvas);\n  animate();\n});\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-784cd72 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"784cd72\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<section class=\"finitions-section\" id=\"finitionsSection\">\n  <div class=\"water-bg\" id=\"waterBg\">\n    <span class=\"float-bubble b1\"><\/span>\n    <span class=\"float-bubble b2\"><\/span>\n    <span class=\"float-bubble b3\"><\/span>\n    <span class=\"float-bubble b4\"><\/span>\n    <span class=\"float-bubble b5\"><\/span>\n    <span class=\"float-bubble b6\"><\/span>\n    <span class=\"float-bubble b7\"><\/span>\n    <span class=\"float-bubble b8\"><\/span>\n  <\/div>\n\n  <div class=\"cursor-glow\" id=\"cursorGlow\"><\/div>\n\n  <div class=\"finitions-grid\">\n    <article class=\"finition-card\">\n      <div class=\"finition-image\">\n        <img decoding=\"async\" src=\"https:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/image-12-e1773858549639.png\" alt=\"Protecteur \u00e0 huile\">\n      <\/div>\n      <div class=\"finition-content\">\n        <h3>Protecteur \u00e0 l'Huile<\/h3>\n        <p>Prot\u00e8ge, nourrit et rehausse la beaut\u00e9 naturelle du bois.<\/p>\n      <\/div>\n    <\/article>\n\n    <article class=\"finition-card\">\n      <div class=\"finition-image\">\n        <img decoding=\"async\" src=\"https:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/image-13.png\" alt=\"Teinture semi transparente \u00e0 huile Sansin\">\n      <\/div>\n      <div class=\"finition-content\">\n        <h3>Teinture semi transparente<br>\u00e0 huile Sansin<\/h3>\n        <p>Prot\u00e8ge le bois durablement tout en r\u00e9v\u00e9lant son aspect naturel.<\/p>\n      <\/div>\n    <\/article>\n\n    <article class=\"finition-card\">\n      <div class=\"finition-image\">\n        <img decoding=\"async\" src=\"https:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/image-14.png\" alt=\"Teinture opaque\">\n      <\/div>\n      <div class=\"finition-content\">\n        <h3>Teinture Opaque<\/h3>\n        <p>Finition Cabot renforc\u00e9e au polyur\u00e9thane.<\/p>\n      <\/div>\n    <\/article>\n  <\/div>\n<\/section>\n\n<style>\nbody{\n  margin:0;\n  overflow-x:hidden;\n}\n\n.finitions-section{\n  --mx:50%;\n  --my:50%;\n  position:relative;\n  width:100vw;\n  margin-left:calc(50% - 50vw);\n  margin-right:calc(50% - 50vw);\n  padding:100px 5vw;\n  overflow:hidden;\n  background:#f7f4ef;\n  isolation:isolate;\n}\n\n\/* BACKGROUND *\/\n.water-bg{\n  position:absolute;\n  inset:-6%;\n  z-index:0;\n  pointer-events:none;\n  overflow:hidden;\n  background:\n    radial-gradient(circle at 12% 18%, rgba(255,255,255,0.72) 0 8%, transparent 9%),\n    radial-gradient(circle at 28% 68%, rgba(226,232,228,0.50) 0 10%, transparent 11%),\n    radial-gradient(circle at 52% 26%, rgba(242,229,220,0.48) 0 11%, transparent 12%),\n    radial-gradient(circle at 76% 72%, rgba(233,220,218,0.42) 0 9%, transparent 10%),\n    radial-gradient(circle at 88% 28%, rgba(239,229,218,0.42) 0 10%, transparent 11%),\n    linear-gradient(135deg, rgba(255,255,255,0.90), rgba(246,241,234,0.82));\n  filter:blur(6px);\n  transform:translate3d(0,0,0) scale(1.02);\n  transition:transform 0.18s linear;\n}\n\n.water-bg::before{\n  content:\"\";\n  position:absolute;\n  inset:0;\n  background:\n    radial-gradient(ellipse 260px 130px at 18% 24%, rgba(248,244,238,0.72) 0 58%, transparent 62%),\n    radial-gradient(ellipse 230px 115px at 70% 38%, rgba(233,227,217,0.45) 0 56%, transparent 60%),\n    radial-gradient(ellipse 240px 120px at 58% 78%, rgba(227,233,230,0.36) 0 55%, transparent 60%),\n    radial-gradient(ellipse 180px 90px at var(--mx) var(--my), rgba(255,255,255,0.10) 0 38%, transparent 60%);\n  filter:blur(10px);\n  opacity:0.9;\n}\n\n\/* BULLES FLOTTANTES *\/\n.float-bubble{\n  position:absolute;\n  border-radius:50%;\n  pointer-events:none;\n  opacity:0.55;\n  will-change:transform;\n  background:\n    radial-gradient(circle at 30% 30%,\n      rgba(255,255,255,0.85) 0%,\n      rgba(255,255,255,0.42) 22%,\n      rgba(233,226,218,0.20) 52%,\n      rgba(220,225,222,0.08) 72%,\n      transparent 100%);\n  box-shadow:\n    inset 0 0 12px rgba(255,255,255,0.24),\n    0 0 18px rgba(255,255,255,0.10);\n  animation-timing-function:ease-in-out;\n  animation-iteration-count:infinite;\n  animation-direction:alternate;\n}\n\n.float-bubble::before{\n  content:\"\";\n  position:absolute;\n  width:22%;\n  height:22%;\n  top:18%;\n  left:22%;\n  border-radius:50%;\n  background:rgba(255,255,255,0.42);\n  filter:blur(2px);\n}\n\n.b1{ width:180px; height:180px; left:4%;   top:10%; animation:float1 11s infinite alternate ease-in-out; }\n.b2{ width:120px; height:120px; left:16%;  top:62%; animation:float2 13s infinite alternate ease-in-out; }\n.b3{ width:210px; height:210px; left:33%;  top:20%; animation:float3 15s infinite alternate ease-in-out; }\n.b4{ width:95px;  height:95px;  left:47%;  top:72%; animation:float4 10s infinite alternate ease-in-out; }\n.b5{ width:160px; height:160px; left:60%;  top:8%;  animation:float5 14s infinite alternate ease-in-out; }\n.b6{ width:135px; height:135px; left:74%;  top:58%; animation:float2 12s infinite alternate ease-in-out; }\n.b7{ width:190px; height:190px; left:82%;  top:16%; animation:float1 16s infinite alternate ease-in-out; }\n.b8{ width:105px; height:105px; left:90%;  top:74%; animation:float4 9s infinite alternate ease-in-out; }\n\n@keyframes float1{\n  0%{ transform:translate3d(0,0,0) scale(1); }\n  100%{ transform:translate3d(18px,-24px,0) scale(1.04); }\n}\n@keyframes float2{\n  0%{ transform:translate3d(0,0,0) scale(1); }\n  100%{ transform:translate3d(-14px,18px,0) scale(0.98); }\n}\n@keyframes float3{\n  0%{ transform:translate3d(0,0,0) scale(1); }\n  100%{ transform:translate3d(22px,12px,0) scale(1.03); }\n}\n@keyframes float4{\n  0%{ transform:translate3d(0,0,0) scale(1); }\n  100%{ transform:translate3d(-10px,-16px,0) scale(1.05); }\n}\n@keyframes float5{\n  0%{ transform:translate3d(0,0,0) scale(1); }\n  100%{ transform:translate3d(14px,-10px,0) scale(0.99); }\n}\n\n\/* HALO  *\/\n.cursor-glow{\n  position:absolute;\n  width:220px;\n  height:220px;\n  border-radius:50%;\n  pointer-events:none;\n  z-index:1;\n  background:radial-gradient(\n    circle,\n    rgba(255,255,255,0.18) 0%,\n    rgba(255,255,255,0.07) 35%,\n    transparent 72%\n  );\n  filter:blur(16px);\n  transform:translate(-50%, -50%);\n  opacity:0;\n  transition:opacity 0.25s ease;\n}\n\n\/* GRID *\/\n.finitions-grid{\n  position:relative;\n  z-index:2;\n  max-width:1300px;\n  margin:0 auto;\n  display:grid;\n  grid-template-columns:repeat(3, 1fr);\n  gap:20px;\n  align-items:start;\n}\n\n\/* CARD *\/\n.finition-card{\n  position:relative;\n  background:rgba(255,255,255,0.78);\n  border:1px solid rgba(255,255,255,0.72);\n  box-shadow:\n    0 8px 24px rgba(0,0,0,0.05),\n    0 1px 0 rgba(255,255,255,0.55) inset;\n  overflow:hidden;\n  transform-style:preserve-3d;\n  transition:\n    transform 0.35s ease,\n    box-shadow 0.35s ease,\n    border-color 0.3s ease;\n  will-change:transform;\n}\n\n.finition-card::before{\n  content:\"\";\n  position:absolute;\n  inset:0;\n  background:linear-gradient(\n    120deg,\n    transparent 24%,\n    rgba(255,255,255,0.08) 44%,\n    rgba(255,255,255,0.20) 50%,\n    rgba(255,255,255,0.08) 56%,\n    transparent 76%\n  );\n  transform:translateX(-140%);\n  transition:transform 0.7s ease;\n  z-index:3;\n  pointer-events:none;\n}\n\n.finition-card::after{\n  content:\"\";\n  position:absolute;\n  inset:0;\n  background:radial-gradient(circle at var(--mx) var(--my), rgba(255,255,255,0.10), transparent 42%);\n  opacity:0;\n  transition:opacity 0.25s ease;\n  pointer-events:none;\n  z-index:2;\n}\n\n.finition-card:hover{\n  transform:translateY(-6px) scale(1.015);\n  box-shadow:\n    0 18px 40px rgba(0,0,0,0.08),\n    0 3px 16px rgba(0,0,0,0.04);\n  border-color:rgba(255,255,255,0.92);\n}\n\n.finition-card:hover::before{\n  transform:translateX(120%);\n}\n\n.finition-card:hover::after{\n  opacity:1;\n}\n\n\/* IMAGE *\/\n.finition-image{\n  width:100%;\n  aspect-ratio:0.82 \/ 1.22;\n  overflow:hidden;\n  background:#ddd;\n}\n\n.finition-image img{\n  width:100%;\n  height:100%;\n  object-fit:cover;\n  display:block;\n  transform:scale(1.01);\n  transition:transform 0.7s ease, filter 0.5s ease;\n  will-change:transform;\n}\n\n.finition-card:hover .finition-image img{\n  transform:scale(1.05);\n  filter:saturate(1.02) contrast(1.01);\n}\n\n\/* TEXT *\/\n.finition-content{\n  position:relative;\n  z-index:4;\n  background:rgba(247,247,247,0.96);\n  padding:22px 20px 16px;\n}\n\n.finition-content h3{\n  margin:0 0 18px;\n  font-family:\"Montserrat\", sans-serif;\n  font-size:18px;\n  font-weight:300;\n  letter-spacing:0.18em;\n  line-height:1.45;\n  color:#4d4d4d;\n  min-height:90px;\n}\n\n.finition-content p{\n  margin:0;\n  font-family:\"Montserrat\", sans-serif;\n  font-size:13px;\n  line-height:1.45;\n  font-weight:500;\n  color:#232323;\n  max-width:95%;\n}\n\n\/* RESPONSIVE *\/\n@media (max-width:1024px){\n  .finitions-grid{\n    grid-template-columns:repeat(2, 1fr);\n  }\n}\n\n@media (max-width:767px){\n  .finitions-section{\n    padding:65px 20px;\n  }\n\n  .finitions-grid{\n    grid-template-columns:1fr;\n    gap:22px;\n  }\n\n  .cursor-glow{\n    display:none;\n  }\n\n  .water-bg{\n    transform:none !important;\n    transition:none;\n  }\n\n  .float-bubble{\n    opacity:0.34;\n    animation-duration:18s !important;\n  }\n\n  .finition-card,\n  .finition-card:hover{\n    transform:none;\n  }\n\n  .finition-content h3{\n    font-size:17px;\n    letter-spacing:0.14em;\n    min-height:auto;\n  }\n}\n<\/style>\n\n<script>\ndocument.addEventListener(\"DOMContentLoaded\", () => {\n  const section = document.getElementById(\"finitionsSection\");\n  const waterBg = document.getElementById(\"waterBg\");\n  const glow = document.getElementById(\"cursorGlow\");\n  const cards = document.querySelectorAll(\".finition-card\");\n\n  if (!section || !waterBg || !glow) return;\n\n  let currentX = 0;\n  let currentY = 0;\n  let targetX = 0;\n  let targetY = 0;\n  let rafId = null;\n  let ticking = false;\n\n  function startGlowAnimation() {\n    if (rafId) return;\n\n    const animate = () => {\n      currentX += (targetX - currentX) * 0.14;\n      currentY += (targetY - currentY) * 0.14;\n\n      glow.style.left = currentX + \"px\";\n      glow.style.top = currentY + \"px\";\n\n      rafId = requestAnimationFrame(animate);\n    };\n\n    rafId = requestAnimationFrame(animate);\n  }\n\n  function stopGlowAnimation() {\n    if (rafId) {\n      cancelAnimationFrame(rafId);\n      rafId = null;\n    }\n  }\n\n  section.addEventListener(\"mouseenter\", () => {\n    glow.style.opacity = \"1\";\n    startGlowAnimation();\n  });\n\n  section.addEventListener(\"mouseleave\", () => {\n    glow.style.opacity = \"0\";\n    waterBg.style.transform = \"translate3d(0,0,0) scale(1.02)\";\n    cards.forEach(card => {\n      card.style.transform = \"\";\n    });\n  });\n\n  section.addEventListener(\"mousemove\", (e) => {\n    const rect = section.getBoundingClientRect();\n    const x = e.clientX - rect.left;\n    const y = e.clientY - rect.top;\n\n    targetX = x;\n    targetY = y;\n\n    if (!ticking) {\n      window.requestAnimationFrame(() => {\n        const percentX = (x \/ rect.width) * 100;\n        const percentY = (y \/ rect.height) * 100;\n\n        section.style.setProperty(\"--mx\", `${percentX}%`);\n        section.style.setProperty(\"--my\", `${percentY}%`);\n\n        if (window.innerWidth > 767) {\n          const moveX = ((x \/ rect.width) - 0.5) * 8;\n          const moveY = ((y \/ rect.height) - 0.5) * 5;\n          waterBg.style.transform = `translate3d(${moveX}px, ${moveY}px, 0) scale(1.02)`;\n        }\n\n        ticking = false;\n      });\n\n      ticking = true;\n    }\n  });\n\n  cards.forEach(card => {\n    card.addEventListener(\"mousemove\", (e) => {\n      if (window.innerWidth <= 767) return;\n\n      const rect = card.getBoundingClientRect();\n      const x = e.clientX - rect.left;\n      const y = e.clientY - rect.top;\n\n      const centerX = rect.width \/ 2;\n      const centerY = rect.height \/ 2;\n\n      const rotateY = ((x - centerX) \/ centerX) * 2.5;\n      const rotateX = ((centerY - y) \/ centerY) * 2.5;\n\n      card.style.transform = `\n        translateY(-6px)\n        scale(1.015)\n        rotateX(${rotateX}deg)\n        rotateY(${rotateY}deg)\n      `;\n    });\n\n    card.addEventListener(\"mouseleave\", () => {\n      card.style.transform = \"\";\n    });\n  });\n\n  window.addEventListener(\"blur\", stopGlowAnimation);\n\n  window.addEventListener(\"focus\", () => {\n    if (document.visibilityState === \"visible\") {\n      startGlowAnimation();\n    }\n  });\n\n  document.addEventListener(\"visibilitychange\", () => {\n    if (document.visibilityState === \"hidden\") {\n      stopGlowAnimation();\n    } else {\n      startGlowAnimation();\n    }\n  });\n\n  startGlowAnimation();\n});\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-32bd5db elementor-widget elementor-widget-html\" data-id=\"32bd5db\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<section id=\"sansin-explore\">\n  <div class=\"sansin-bg\"><\/div>\n  <div class=\"sansin-overlay\"><\/div>\n\n  <div class=\"sansin-wrap\">\n    <h2 class=\"sansin-title\">EXPLOREZ NOS TEINTES.<br>IMAGINEZ LE RENDU.<\/h2>\n\n    <div class=\"sansin-grid\">\n      <div class=\"sansin-controls\">\n        <div class=\"sansin-field\">\n          <select id=\"categorySelect\" class=\"sansin-select\"><\/select>\n          <span class=\"sansin-arrow\">\n            <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\">\n              <path d=\"M6 9l6 6 6-6\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n            <\/svg>\n          <\/span>\n        <\/div>\n\n        <div class=\"sansin-field\">\n          <select id=\"colorSelect\" class=\"sansin-select\"><\/select>\n          <span class=\"sansin-arrow\">\n            <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\">\n              <path d=\"M6 9l6 6 6-6\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n            <\/svg>\n          <\/span>\n        <\/div>\n\n        <div class=\"sansin-meta\">\n          <div class=\"sansin-meta-line\"><strong>Code :<\/strong> <span id=\"colorCode\">\u2014<\/span><\/div>\n          <div class=\"sansin-meta-line\"><strong>Famille :<\/strong> <span id=\"colorFamily\">\u2014<\/span><\/div>\n        <\/div>\n\n        <div class=\"sansin-buttons\">\n          <a\n            href=\"https:\/\/www.sansin.com\/fr\/couleurs\/\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            class=\"sansin-btn sansin-btn-uniform\"\n          >\n            Voir le catalogue semi-transparent en entier\n          <\/a>\n\n          <a\n            href=\"https:\/\/icpconstruction.appdataroom.com\/download\/v\/4be659a8f5fa7ef475717a536268b3e22e35f4df328647?source=media_manager&shared=20230308150446\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            class=\"sansin-btn sansin-btn-uniform\"\n          >\n            Voir le catalogue opaque en entier\n          <\/a>\n        <\/div>\n      <\/div>\n\n      <div class=\"sansin-preview-card\">\n        <div class=\"sansin-preview-frame\">\n          <img decoding=\"async\" id=\"previewImage\" src=\"\" alt=\"Aper\u00e7u de la teinte s\u00e9lectionn\u00e9e\">\n          <div class=\"sansin-chip-left\">EN5<\/div>\n          <div class=\"sansin-chip-right\">SDF<\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<style>\n  #sansin-explore{\n    position:relative;\n    width:100vw;\n    margin-left:calc(50% - 50vw);\n    margin-right:calc(50% - 50vw);\n    overflow:hidden;\n    padding:clamp(90px, 9vw, 140px) 40px;\n    font-family:Montserrat, Arial, sans-serif;\n    isolation:isolate;\n  }\n\n  #sansin-explore .sansin-bg{\n    position:absolute;\n    inset:0;\n    background-image:url(\"https:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/table-de-matie\u0300re.jpg\");\n    background-size:cover;\n    background-position:center;\n    transform:scale(1.04);\n    filter:saturate(.9) brightness(1.03);\n    z-index:-3;\n  }\n\n  #sansin-explore .sansin-overlay{\n    position:absolute;\n    inset:0;\n    background:\n      linear-gradient(to bottom, rgba(248,245,241,0.74), rgba(248,245,241,0.84)),\n      radial-gradient(circle at 20% 20%, rgba(255,255,255,0.18), transparent 35%),\n      radial-gradient(circle at 80% 70%, rgba(255,255,255,0.14), transparent 34%);\n    z-index:-2;\n  }\n\n  #sansin-explore .sansin-wrap{\n    max-width:1700px;\n    margin:0 auto;\n  }\n\n  #sansin-explore .sansin-title{\n    margin:0 0 clamp(45px, 5vw, 80px);\n    text-align:center;\n    font-size:clamp(30px, 4vw, 66px);\n    line-height:1.08;\n    letter-spacing:.03em;\n    font-weight:300;\n    color:#1d1918;\n  }\n\n  #sansin-explore .sansin-grid{\n    display:grid;\n    grid-template-columns:minmax(320px, 430px) minmax(160px, 220px);\n    justify-content:center;\n    align-items:center;\n    gap:clamp(30px, 4vw, 120px);\n  }\n\n  #sansin-explore .sansin-controls{\n    display:flex;\n    flex-direction:column;\n    gap:16px;\n    width:100%;\n    max-width:430px;\n  }\n\n  #sansin-explore .sansin-field{\n    position:relative;\n  }\n\n  #sansin-explore .sansin-select{\n    width:100%;\n    appearance:none;\n    -webkit-appearance:none;\n    border:2px solid #161312;\n    border-radius:14px;\n    background:rgba(255,255,255,0.82);\n    color:#111;\n    min-height:62px;\n    padding:10px 66px 10px 22px;\n    font-size:clamp(15px, 1.1vw, 22px);\n    line-height:1.1;\n    font-weight:300;\n    letter-spacing:.08em;\n    outline:none;\n    cursor:pointer;\n    box-shadow:\n      0 8px 18px rgba(0,0,0,0.05),\n      inset 0 0 0 1px rgba(255,255,255,0.25);\n    transition:transform .25s ease, box-shadow .25s ease, background .25s ease;\n  }\n\n  #sansin-explore .sansin-select:hover{\n    transform:translateY(-1px);\n    background:rgba(255,255,255,0.9);\n    box-shadow:\n      0 12px 22px rgba(0,0,0,0.07),\n      inset 0 0 0 1px rgba(255,255,255,0.28);\n  }\n\n  #sansin-explore .sansin-select:focus{\n    box-shadow:\n      0 0 0 4px rgba(0,0,0,0.08),\n      0 12px 22px rgba(0,0,0,0.07);\n  }\n\n  #sansin-explore .sansin-arrow{\n    position:absolute;\n    top:50%;\n    right:12px;\n    width:36px;\n    height:36px;\n    border-radius:50%;\n    background:#000;\n    color:#fff;\n    display:grid;\n    place-items:center;\n    transform:translateY(-50%);\n    pointer-events:none;\n    box-shadow:0 6px 14px rgba(0,0,0,0.15);\n  }\n\n  #sansin-explore .sansin-arrow svg{\n    width:16px;\n    height:16px;\n  }\n\n  #sansin-explore .sansin-meta{\n    display:flex;\n    flex-direction:column;\n    gap:7px;\n    padding-left:4px;\n    color:#201c1b;\n    font-size:13px;\n    letter-spacing:.08em;\n    text-transform:uppercase;\n  }\n\n  #sansin-explore .sansin-buttons{\n    display:flex;\n    flex-wrap:wrap;\n    gap:12px;\n    margin-top:10px;\n  }\n\n  #sansin-explore .sansin-btn{\n    display:inline-flex;\n    align-items:center;\n    justify-content:center;\n    min-height:48px;\n    padding:12px 18px;\n    border-radius:14px;\n    text-decoration:none;\n    text-transform:uppercase;\n    letter-spacing:.08em;\n    font-size:11px;\n    font-weight:600;\n    transition:all .25s ease;\n    border:2px solid #161312;\n    box-shadow:0 8px 18px rgba(0,0,0,0.06);\n  }\n\n  #sansin-explore .sansin-btn-uniform{\n    background:#161312;\n    color:#fff;\n  }\n\n  #sansin-explore .sansin-btn-uniform:hover{\n    background:#2a2523;\n    color:#fff;\n    transform:translateY(-1px);\n  }\n\n  #sansin-explore .sansin-preview-card{\n    display:flex;\n    flex-direction:column;\n    align-items:center;\n    gap:10px;\n  }\n\n  #sansin-explore .sansin-preview-frame{\n    position:relative;\n    width:min(100%, 160px);\n    aspect-ratio:160 \/ 101;\n    border:1px solid rgba(0,0,0,0.12);\n    background:#fff;\n    overflow:hidden;\n    box-shadow:\n      0 8px 18px rgba(0,0,0,0.08),\n      inset 0 0 0 1px rgba(255,255,255,0.18);\n  }\n\n  #sansin-explore #previewImage{\n    width:100%;\n    height:100%;\n    object-fit:cover;\n    display:block;\n    opacity:1;\n    transform:none;\n    image-rendering:auto;\n    backface-visibility:hidden;\n    -webkit-backface-visibility:hidden;\n    transition:opacity .22s ease;\n  }\n\n  #sansin-explore .sansin-chip-left,\n  #sansin-explore .sansin-chip-right{\n    position:absolute;\n    bottom:5px;\n    font-size:10px;\n    font-weight:700;\n    letter-spacing:.02em;\n    color:#efe8d9;\n    text-shadow:0 1px 2px rgba(0,0,0,.24);\n    z-index:2;\n    line-height:1;\n  }\n\n  #sansin-explore .sansin-chip-left{ left:7px; }\n  #sansin-explore .sansin-chip-right{ right:7px; }\n\n  @media (max-width: 1100px){\n    #sansin-explore .sansin-grid{\n      grid-template-columns:1fr;\n      gap:36px;\n    }\n\n    #sansin-explore .sansin-controls{\n      max-width:430px;\n      margin:0 auto;\n    }\n\n    #sansin-explore .sansin-preview-card{\n      align-items:center;\n    }\n  }\n\n  @media (max-width: 768px){\n    #sansin-explore{\n      padding:60px 18px;\n    }\n\n    #sansin-explore .sansin-title{\n      font-size:clamp(24px, 8vw, 40px);\n    }\n\n    #sansin-explore .sansin-select{\n      min-height:56px;\n      padding:10px 58px 10px 18px;\n      font-size:clamp(15px, 4.5vw, 20px);\n      letter-spacing:.05em;\n      border-radius:12px;\n    }\n\n    #sansin-explore .sansin-arrow{\n      width:32px;\n      height:32px;\n      right:10px;\n    }\n\n    #sansin-explore .sansin-arrow svg{\n      width:14px;\n      height:14px;\n    }\n\n    #sansin-explore .sansin-buttons{\n      flex-direction:column;\n    }\n\n    #sansin-explore .sansin-btn{\n      width:100%;\n    }\n  }\n<\/style>\n\n<script>\n(function(){\n  const RAW_CATALOGUE = `Cat\u00e9gorie\tFamille\tCode\tCouleur\tSource\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t03\tBOIS DES MAR\u00c9ES\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r1_c1_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t04\tBOIS D\u00c9LAV\u00c9\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r1_c2_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t05\tPIN\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r1_c3_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t06\tSIENNA BRUT\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r1_c4_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t10\tBRUME DU SAHARA\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r2_c1_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1101\tC\u00c8DRE NATUREL\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r6_c1_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1102\tBRUN BANFF\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r6_c2_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1103\tROUGE CANYON\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r6_c3_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1104\tAMANDE GRILL\u00c9E\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r6_c4_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1105\tR\u00c9COLTE D\u2019OR\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r7_c1_processed_by_imagy-1.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1107\tBL\u00c9 D\u2019OR\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r7_c2_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1108\tINCARNAT\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r7_c3_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1109\tCUIVRE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r7_c4_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1110\tCHAMPAGNE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r8_c1_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1111\tCOCAO\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r8_c2_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1112\tJAVA\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r8_c3_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1130\tCALICO\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r8_c4_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1131\tGOLDEN GATE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r9_c1_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1132\tSUNDANCE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r9_c2_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1133\tAZTEC\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r9_c3_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1134\tCALIWOOD\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r9_c4_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1135\tGOLD RUSH\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r10_c1_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t14\tROUGE MONTEREY\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r2_c2_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t15\tMIEL DOUX\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r2_c3_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t16\tAUTOMNE D\u2019OR\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r2_c4_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t17\tESPRESSO\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r4_c1_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t19\tSU\u00c8DE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r4_c2_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2106\tHAVANA\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r10_c2_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t44\tBL\u00c9\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r4_c3_processed_by_imagy.png\nNaturelles pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t45\tCHAMEAU\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.34.51_r4_c4_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t101\tBLEU GALAXIE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r8_c4_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t103\tBLEU PETIT GAR\u00c7ON\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.47.03_r2_c1_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t105\tOCRE BR\u00dbL\u00c9\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.47.03_r2_c2_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2066\tAMARANTE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r9_c3_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2067\tAMARYLLIS\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.47.03_r2_c4_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2068\tRENONCULE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.47.03_r3_c1_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2069\tCAKE POP\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.47.03_r3_c2_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2070\tOEILLET\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.47.03_r3_c3_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2071\tFLEUR DE CERISIER\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.47.03_r3_c4_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2072\tCL\u00c9MATITE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.47.03_r4_c1_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2073\tLANTHE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.47.03_r4_c2_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2074\tBROUILLARD MAGENTA\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.47.03_r4_c3_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2075\tWILSON\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.47.03_r4_c4_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2076\tGLYCINE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.47.03_r5_c1_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2077\tANGORA\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.47.03_r5_c2_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2078\tBAVAROIS\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.47.03_r5_c3_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2079\tCR\u00c8ME DE CAMPAGNE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.47.03_r5_c4_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2080\tDENTELLE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.47.03_r6_c1_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2081\tSOUCI\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.47.03_r6_c2_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2082\tSUIF\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.47.03_r6_c3_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2083\tTIFFANY\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.47.03_r6_c4_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2084\tTYRIAN\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.47.03_r7_c1_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2085\tSIFFLEMENT\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.47.03_r7_c2_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t43\tROCAILLE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r1_c1_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t50\tGRIS CAPE COD\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r1_c2_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t51\tGRIS ARGENT\u00c9\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r1_c3_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t52\tBLANC OPAQUE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r1_c4_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t53\tBOULEAU ARGENT\u00c9\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r2_c1_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t54\tBOIS DE GRANGE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r2_c2_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t55\tFAUVE OPAQUE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r2_c3_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t56\tMARRON GRILL\u00c9\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r2_c4_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t57\tACAJOU\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r4_c1_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t58\tMOKA\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r4_c2_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t60\tGRENAT\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r4_c3_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t61\tBLEU GASP\u00c9\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r4_c4_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t62\tBLEU BALTIQUE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r5_c1_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t63\tBOIS TORR\u00c9FI\u00c9\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r5_c2_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t64\tVERT SAUGE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r5_c3_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t65\tCHAMPIGNON OPAQUE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r5_c4_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t66\tVERT MOUSSE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r6_c1_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t67\tCHESAPEAKE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r6_c2_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t68\tVERT CHASSEUR\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r6_c3_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t69\tVERT FOR\u00caT\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r6_c4_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t70\tNOYER\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r7_c1_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t71\tBLEU ADROISE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r7_c2_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t73\tCH\u00c9NE ROUGE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r7_c3_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t74\tBAIE OC\u00c9ANIQUE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r7_c4_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t75\tBLEU ATLANTIQUE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r8_c1_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t95\tBROUILLARD DU PORT\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r8_c2_processed_by_imagy.png\nSatur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t99\tNIUT \u00c9TOIL\u00c9E\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.46.48_r8_c3_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t100\tGRIS \u00c9TAIN\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.25_r8_c2_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t102\tGRIS SPINNAKER\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.25_r8_c3_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t107\tNOIR CHEVALIER\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.25_r8_c4_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t108\tBRUN WENGE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.25_r10_c1_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t109\tSP\u00c9CIAL MINUIT\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.25_r10_c2_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t110\tBARISTA\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.25_r10_c3_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t111\tP\u00c2TE MOULE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.25_r10_c4_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t112\tGRIS GANDOLPH\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.25_r11_c1_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t20\tBLANC MARIN\u00c9\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.25_r1_c1_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2037\tMERLE NOIR\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.25_r11_c2_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2038\tBRINDLE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.25_r11_c3_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2039\tCARA\u00cfBES\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.25_r11_c4_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2040\tCHAMOIS\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.40_r2_c1_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2041\tBABOUCHE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.40_r2_c2_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2042\tMOAB\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.40_r2_c3_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2043\tRAFRA\u00ceCHISSEMENT\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.40_r2_c4_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2044\tCAF\u00c9 AU LAIT\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.40_r3_c1_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2045\tBURLAP\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.40_r3_c2_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2046\tPAPILLON NOIR\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.40_r3_c3_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2047\tFOND DE CERISE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.40_r3_c4_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2048\tH\u00c9MLOCK\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.40_r4_c1_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2049\tSOUS-BOIS\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.40_r4_c2_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2050\tPALISSANDRE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.40_r4_c3_processed_by_imagy.png\nTranslucides pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t2051\tKAKI\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.43.40_r4_c4_processed_by_imagy.png\nUltra-satur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t113\tCITRON VERT\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.49.00_r4_c3_processed_by_imagy.png\nUltra-satur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t114\tTAMARIN\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.49.00_r4_c4_processed_by_imagy.png\nUltra-satur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t115\tLAURIER-ROSE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.49.00_r5_c1_processed_by_imagy.png\nUltra-satur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t116\tJAUNE EXP\u00c9DITION\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.49.00_r5_c2_processed_by_imagy.png\nUltra-satur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t117\tBORDEAUX\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.49.00_r5_c3_processed_by_imagy.png\nUltra-satur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t118\tTAUPE FONC\u00c9\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.49.00_r5_c4_processed_by_imagy.png\nUltra-satur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t119\tCUIVRE PROFOND\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.49.00_r6_c1_processed_by_imagy.png\nUltra-satur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t120\tBRONZE M\u00c9DI\u00c9VAL\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.49.00_r6_c2_processed_by_imagy.png\nUltra-satur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t121\tTOSCANE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.49.00_r6_c3_processed_by_imagy.png\nUltra-satur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t122\tCORAIL\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.49.00_r6_c4_processed_by_imagy.png\nUltra-satur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t123\tBARBE DE PAPA\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.49.00_r7_c1_processed_by_imagy.png\nUltra-satur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t124\tC\u00c9DRAT\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.49.00_r7_c2_processed_by_imagy.png\nUltra-satur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t125\tGUIMAUVE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.49.00_r7_c3_processed_by_imagy.png\nUltra-satur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t126\tOLIVE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.49.00_r7_c4_processed_by_imagy.png\nUltra-satur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t127\tPRUNE SAUVAGE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.49.00_r8_c1_processed_by_imagy.png\nUltra-satur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t128\tBRUN KHAKI\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.49.00_r8_c2_processed_by_imagy.png\nUltra-satur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t129\tPRUNE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.49.00_r8_c3_processed_by_imagy.png\nUltra-satur\u00e9es pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t130\tBETTERAVE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-17-a\u0300-14.49.00_r8_c4_processed_by_imagy.png\nOpaques pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t106\tNOIR INTENSE\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-20-a\u0300-11.18.02_r4_c1_processed_by_imagy.png\nOpaques pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1121\tCabana Tan\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-20-a\u0300-11.18.02_r5_c1_processed_by_imagy.png\nOpaques pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1122\tTaste of Honey\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-20-a\u0300-11.18.02_r5_c2_processed_by_imagy.png\nOpaques pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1123\tPastel Sand\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-20-a\u0300-11.18.02_r5_c3_processed_by_imagy.png\nOpaques pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1124\tSunset Beige\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-20-a\u0300-11.18.02_r7_c1_processed_by_imagy.png\nOpaques pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1125\tLimestone\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-20-a\u0300-11.18.02_r7_c2_processed_by_imagy.png\nOpaques pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1126\tHorse Trot\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-20-a\u0300-11.18.02_r7_c3_processed_by_imagy.png\nOpaques pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1127\tSusan&#39;s Glow\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-20-a\u0300-11.18.02_r9_c1_processed_by_imagy.png\nOpaques pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1128\tCalifornia Stucco\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-20-a\u0300-11.18.02_r9_c2_processed_by_imagy.png\nOpaques pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1129\tHollywood\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-20-a\u0300-11.18.02_r9_c3_processed_by_imagy.png\nOpaques pour l\u2019ext\u00e9rieur\tExt\u00e9rieur\t1150\tMacaron\thttps:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Capture-de\u0301cran-2026-03-20-a\u0300-11.18.02_r10_c1_processed_by_imagy.png`;\n\n  const categorySelect = document.getElementById(\"categorySelect\");\n  const colorSelect = document.getElementById(\"colorSelect\");\n  const previewImage = document.getElementById(\"previewImage\");\n  const colorCode = document.getElementById(\"colorCode\");\n  const colorFamily = document.getElementById(\"colorFamily\");\n\n  function parseCatalogue(raw){\n    const lines = raw\n      .split(\"\\n\")\n      .map(line => line.trim())\n      .filter(Boolean)\n      .filter(line => !line.startsWith(\"Cat\u00e9gorie\"));\n\n    const parsed = lines.map(line => {\n      const parts = line.split(\"\\t\");\n      if(parts.length < 5) return null;\n\n      return {\n        category: (parts[0] || \"\").trim(),\n        family: (parts[1] || \"\").trim(),\n        code: (parts[2] || \"\").trim(),\n        color: (parts[3] || \"\").trim(),\n        source: (parts[4] || \"\").trim()\n      };\n    }).filter(item =>\n      item &&\n      item.category &&\n      item.family &&\n      item.code &&\n      item.color &&\n      item.source\n    );\n\n    const seen = new Set();\n    return parsed.filter(item => {\n      const key = [\n        item.category,\n        item.family,\n        item.code,\n        item.color,\n        item.source\n      ].join(\"|||\");\n\n      if(seen.has(key)) return false;\n      seen.add(key);\n      return true;\n    });\n  }\n\n  const catalogue = parseCatalogue(RAW_CATALOGUE);\n\n  function escapeHtml(str){\n    return String(str)\n      .replaceAll(\"&\", \"&amp;\")\n      .replaceAll(\"<\", \"&lt;\")\n      .replaceAll(\">\", \"&gt;\")\n      .replaceAll('\"', \"&quot;\")\n      .replaceAll(\"'\", \"&#39;\");\n  }\n\n  function fillCategories(){\n    const categories = [...new Set(catalogue.map(item => item.category))];\n\n    categorySelect.innerHTML = `\n      <option value=\"\" disabled selected>CHOISIR UNE CAT\u00c9GORIE<\/option>\n      ${categories.map(category => `<option value=\"${escapeHtml(category)}\">${escapeHtml(category)}<\/option>`).join(\"\")}\n    `;\n  }\n\n  function fillColors(category){\n    const colors = catalogue\n      .filter(item => item.category === category)\n      .sort((a, b) => a.color.localeCompare(b.color, \"fr\", { sensitivity: \"base\" }));\n\n    colorSelect.innerHTML = `\n      <option value=\"\" disabled selected>CHOISIR UNE TEINTE<\/option>\n      ${colors.map((item, index) => `\n        <option value=\"${index}\">\n          ${escapeHtml(item.color)}\n        <\/option>\n      `).join(\"\")}\n    `;\n\n    colorSelect.dataset.category = category;\n    colorSelect.dataset.items = JSON.stringify(colors);\n    resetPreview();\n  }\n\n  function updatePreview(selectedIndex){\n    const items = JSON.parse(colorSelect.dataset.items || \"[]\");\n    const item = items[selectedIndex];\n\n    if(!item){\n      resetPreview();\n      return;\n    }\n\n    previewImage.style.opacity = \"0.35\";\n\n    const nextImage = new Image();\n    nextImage.onload = function(){\n      previewImage.src = item.source;\n      previewImage.alt = `Aper\u00e7u de la teinte ${item.color}`;\n      previewImage.style.opacity = \"1\";\n    };\n    nextImage.onerror = function(){\n      previewImage.src = item.source;\n      previewImage.alt = `Aper\u00e7u de la teinte ${item.color}`;\n      previewImage.style.opacity = \"1\";\n    };\n    nextImage.src = item.source;\n\n    colorCode.textContent = item.code;\n    colorFamily.textContent = item.family;\n  }\n\n  function resetPreview(){\n    previewImage.removeAttribute(\"src\");\n    previewImage.alt = \"Aper\u00e7u de la teinte s\u00e9lectionn\u00e9e\";\n    colorCode.textContent = \"\u2014\";\n    colorFamily.textContent = \"\u2014\";\n  }\n\n  categorySelect.addEventListener(\"change\", function(){\n    fillColors(this.value);\n  });\n\n  colorSelect.addEventListener(\"change\", function(){\n    updatePreview(Number(this.value));\n  });\n\n  fillCategories();\n  resetPreview();\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b4bd62b elementor-widget elementor-widget-html\" data-id=\"b4bd62b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Montserrat:wght@200;300;400;500;700&display=swap\" rel=\"stylesheet\">\n\n<section class=\"hero-bois-photo\" id=\"heroBoisPhoto\">\n  <div class=\"hero-bois-photo__bg\"><\/div>\n  <div class=\"hero-bois-photo__overlay\"><\/div>\n\n  <div class=\"hero-bois-photo__content\">\n    <h1 class=\"hero-bois-photo__title\">\n      Votre bois m\u00e9rite mieux qu\u2019un\n      simple entretien.\n    <\/h1>\n\n    <p class=\"hero-bois-photo__subtitle\">\n      Confiez-nous sa remise en valeur avec une approche propre,\n      <br>pr\u00e9cise et durable.\n    <\/p>\n\n    <div class=\"hero-bois-photo__cta\">\n      <a class=\"hero-btn-pave\" href=\"https:\/\/entretienlaurentides.ca\/?page_id=18\">\n        R\u00c9SERVEZ VOTRE SOUMISSION GRATUITE\n      <\/a>\n    <\/div>\n  <\/div>\n<\/section>\n\n<style>\nhtml, body {\n  margin: 0;\n  padding: 0;\n  overflow-x: hidden;\n}\n\n.hero-bois-photo {\n  position: relative;\n  width: 100vw;\n  min-height: 100svh;\n  margin-left: calc(50% - 50vw);\n  margin-right: calc(50% - 50vw);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  overflow: hidden;\n  background: #f5efea;\n  text-align: center;\n  isolation: isolate;\n}\n\n.hero-bois-photo__bg {\n  position: absolute;\n  inset: -2%;\n  background-image: url(\"https:\/\/entretienlaurentides.ca\/wp-content\/uploads\/2026\/03\/Pave\u0301-Uni-10.png\");\n  background-size: cover;\n  background-position: center center;\n  background-repeat: no-repeat;\n  opacity: 0.56;\n  transform: scale(1.025) translate3d(0,0,0);\n  will-change: transform;\n  transition: transform 0.18s ease-out;\n  z-index: 0;\n}\n\n.hero-bois-photo__overlay {\n  position: absolute;\n  inset: 0;\n  background: linear-gradient(\n    180deg,\n    rgba(255,255,255,0.47) 0%,\n    rgba(255,255,255,0.43) 45%,\n    rgba(255,255,255,0.49) 100%\n  );\n  z-index: 1;\n}\n\n.hero-bois-photo__content {\n  position: relative;\n  z-index: 2;\n  width: min(1520px, calc(100% - 38px));\n  padding: 78px 0 95px;\n}\n\n.hero-bois-photo__title {\n  margin: 0;\n  font-family: 'Montserrat', sans-serif !important;\n  font-size: clamp(4rem, 7.2vw, 8.2rem);\n  line-height: 0.95;\n  font-weight: 200 !important;\n  letter-spacing: -0.045em;\n  color: #9e3e2e;\n  font-kerning: normal;\n  font-feature-settings: \"liga\" 1;\n  text-wrap: balance;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n  text-rendering: optimizeLegibility;\n}\n\n.hero-bois-photo__title strong,\n.hero-bois-photo__title b {\n  font-weight: 200 !important;\n}\n\n.hero-bois-photo__subtitle {\n  margin: 40px auto 0;\n  max-width: 1280px;\n  font-family: 'Montserrat', sans-serif;\n  font-size: clamp(1.05rem, 2vw, 2rem);\n  line-height: 1.2;\n  font-weight: 400;\n  letter-spacing: 0.16em;\n  color: #111111;\n  -webkit-font-smoothing: antialiased;\n}\n\n.hero-bois-photo__cta {\n  margin-top: 72px;\n  display: flex;\n  justify-content: center;\n}\n\n.hero-btn-pave {\n  display: inline-block;\n  padding: 18px 56px;\n  border: 2px solid #ffffff;\n  color: #ffffff;\n  text-decoration: none;\n  font-size: 0.85rem;\n  letter-spacing: 0.2em;\n  text-transform: uppercase;\n  transition: all 0.35s ease;\n  font-family: 'Montserrat', sans-serif;\n  font-weight: 500;\n  background: #2f3641;\n  box-shadow: 0 8px 22px rgba(0,0,0,0.08);\n}\n\n.hero-btn-pave:hover {\n  background: #ffffff;\n  color: #000000;\n  border-color: #ffffff;\n}\n\n@media (max-width: 1024px) {\n  .hero-bois-photo__content {\n    width: min(100%, calc(100% - 28px));\n    padding: 64px 0 82px;\n  }\n\n  .hero-bois-photo__title {\n    font-size: clamp(3.2rem, 8.2vw, 6rem);\n    line-height: 0.97;\n  }\n\n  .hero-bois-photo__subtitle {\n    margin-top: 30px;\n    letter-spacing: 0.1em;\n  }\n\n  .hero-bois-photo__cta {\n    margin-top: 52px;\n  }\n}\n\n@media (max-width: 768px) {\n  .hero-bois-photo {\n    min-height: 88svh;\n  }\n\n  .hero-bois-photo__content {\n    width: min(100%, calc(100% - 18px));\n    padding: 44px 0 62px;\n  }\n\n  .hero-bois-photo__title {\n    font-size: clamp(2.5rem, 11.8vw, 4.4rem);\n    line-height: 0.98;\n    letter-spacing: -0.04em;\n    font-weight: 200 !important;\n  }\n\n  .hero-bois-photo__subtitle {\n    margin-top: 24px;\n    font-size: clamp(0.92rem, 4vw, 1.12rem);\n    line-height: 1.32;\n    letter-spacing: 0.07em;\n    max-width: 95%;\n  }\n\n  .hero-bois-photo__subtitle br,\n  .hero-bois-photo__title br {\n    display: none;\n  }\n\n  .hero-bois-photo__cta {\n    margin-top: 36px;\n    padding: 0 8px;\n  }\n\n  .hero-btn-pave {\n    width: 100%;\n    max-width: 430px;\n    padding: 16px 22px;\n    font-size: 0.78rem;\n    letter-spacing: 0.12em;\n    text-align: center;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .hero-bois-photo__bg {\n    transition: none !important;\n  }\n}\n<\/style>\n\n<script>\n(function () {\n  const section = document.getElementById(\"heroBoisPhoto\");\n  const bg = section ? section.querySelector(\".hero-bois-photo__bg\") : null;\n\n  if (!section || !bg) return;\n\n  let currentX = 0;\n  let currentY = 0;\n  let targetX = 0;\n  let targetY = 0;\n\n  function animate() {\n    currentX += (targetX - currentX) * 0.07;\n    currentY += (targetY - currentY) * 0.07;\n    bg.style.transform = `scale(1.025) translate3d(${currentX}px, ${currentY}px, 0)`;\n    requestAnimationFrame(animate);\n  }\n\n  section.addEventListener(\"mousemove\", function (e) {\n    const rect = section.getBoundingClientRect();\n    const relX = (e.clientX - rect.left) \/ rect.width;\n    const relY = (e.clientY - rect.top) \/ rect.height;\n\n    targetX = (relX - 0.5) * 16;\n    targetY = (relY - 0.5) * 16;\n  }, { passive: true });\n\n  section.addEventListener(\"mouseleave\", function () {\n    targetX = 0;\n    targetY = 0;\n  }, { passive: true });\n\n  animate();\n})();\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Teinture et sablage Raviver. Prot\u00e9ger. Peaufiner. R\u00c9SERVEZ VOTRE SOUMISSION GRATUITE TERRASSES, CL\u00d4TURES, MARCHES OU STRUCTURES EN BOIS : Notre service de sablage et teinture vise \u00e0 raviver l\u2019apparence du bois tout en le prot\u00e9geant contre l\u2019usure, l\u2019humidit\u00e9 et les variations climatiques. Protecteur \u00e0 l&rsquo;Huile Prot\u00e8ge, nourrit et rehausse la beaut\u00e9 naturelle du bois. Teinture semi &hellip; <\/p>\n<p class=\"link-more\"><a href=\"https:\/\/entretienlaurentides.ca\/?p=7000\" class=\"more-link\">Lire la suite de<span class=\"screen-reader-text\">\u00ab\u00a0Patio\u00a0\u00bb<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"elementor_header_footer","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-7000","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/entretienlaurentides.ca\/index.php?rest_route=\/wp\/v2\/posts\/7000","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/entretienlaurentides.ca\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/entretienlaurentides.ca\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/entretienlaurentides.ca\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/entretienlaurentides.ca\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=7000"}],"version-history":[{"count":85,"href":"https:\/\/entretienlaurentides.ca\/index.php?rest_route=\/wp\/v2\/posts\/7000\/revisions"}],"predecessor-version":[{"id":8464,"href":"https:\/\/entretienlaurentides.ca\/index.php?rest_route=\/wp\/v2\/posts\/7000\/revisions\/8464"}],"wp:attachment":[{"href":"https:\/\/entretienlaurentides.ca\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=7000"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/entretienlaurentides.ca\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=7000"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/entretienlaurentides.ca\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=7000"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}