{"id":236,"date":"2026-03-04T15:50:32","date_gmt":"2026-03-04T15:50:32","guid":{"rendered":"https:\/\/www.cocomunication.fr\/?page_id=236"},"modified":"2026-06-15T09:40:50","modified_gmt":"2026-06-15T09:40:50","slug":"portfolio-2","status":"publish","type":"page","link":"https:\/\/www.cocomunication.fr\/","title":{"rendered":"Accueil"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"236\" class=\"elementor elementor-236\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-24358f0e e-con-full e-flex e-con e-parent\" data-id=\"24358f0e\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-a20b6f6 e-con-full gradient-demo bloc-geant e-flex e-con e-child\" data-id=\"a20b6f6\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a1cf7ae elementor-widget elementor-widget-html\" data-id=\"a1cf7ae\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"apple-dark-container\">\r\n  <ul class=\"apple-dark-menu\">\r\n    <li class=\"apple-item\">\r\n      <a href=\"https:\/\/cocomunication.fr\">\r\n        <i class=\"fas fa-home\"><\/i>\r\n        <span class=\"apple-label\">Accueil<\/span>\r\n      <\/a>\r\n    <\/li>\r\n    <li class=\"apple-item\">\r\n      <a href=\"https:\/\/www.cocomunication.fr\/?page_id=303\">\r\n        <i class=\"fas fa-th-large\"><\/i>\r\n        <span class=\"apple-label\">Portfolio<\/span>\r\n      <\/a>\r\n    <\/li>\r\n    <li class=\"apple-item\">\r\n      <a href=\"https:\/\/www.cocomunication.fr\/?page_id=397\">\r\n        <i class=\"fas fa-envelope\"><\/i>\r\n        <span class=\"apple-label\">Contact<\/span>\r\n      <\/a>\r\n    <\/li>\r\n  <\/ul>\r\n<\/div>\r\n\r\n<style>\r\n\/* 1. CENTRAGE ET FOND *\/\r\n.apple-dark-container {\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  width: 100%;\r\n  padding: 30px 0;\r\n  font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif;\r\n}\r\n\r\n\/* 2. LA BARRE (DARK GLASS) *\/\r\n.apple-dark-menu {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  list-style: none;\r\n  margin: 0;\r\n  padding: 8px;\r\n  \/* Fond sombre translucide type iOS Dark Mode *\/\r\n  background: rgba(28, 28, 30, 0.7); \r\n  backdrop-filter: blur(25px) saturate(140%);\r\n  -webkit-backdrop-filter: blur(25px) saturate(140%);\r\n  border-radius: 100px;\r\n  \/* Bordure fine pour s\u00e9parer du fond noir *\/\r\n  border: 1px solid rgba(255, 255, 255, 0.1);\r\n  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);\r\n  gap: 10px;\r\n}\r\n\r\n\/* 3. LES BOUTONS *\/\r\n.apple-item a {\r\n  display: flex;\r\n  align-items: center;\r\n  text-decoration: none;\r\n  height: 50px;\r\n  min-width: 50px;\r\n  max-width: 50px;\r\n  padding: 0 16px;\r\n  border-radius: 50px;\r\n  \/* Gris sombre discret par d\u00e9faut *\/\r\n  color: rgba(255, 255, 255, 0.4); \r\n  background: transparent;\r\n  transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);\r\n  overflow: hidden;\r\n  white-space: nowrap;\r\n}\r\n\r\n\/* 4. IC\u00d4NES *\/\r\n.apple-item i {\r\n  font-size: 18px;\r\n  min-width: 20px;\r\n  text-align: center;\r\n}\r\n\r\n\/* 5. LE TEXTE *\/\r\n.apple-label {\r\n  font-size: 14px;\r\n  font-weight: 600;\r\n  margin-left: 12px;\r\n  opacity: 0;\r\n  transition: opacity 0.3s ease;\r\n}\r\n\r\n\/* 6. EFFET AU SURVOL (INVERS\u00c9) *\/\r\n.apple-item:hover a {\r\n  max-width: 200px;\r\n  \/* Devient Blanc pur au survol *\/\r\n  color: #ffffff !important; \r\n  \/* Fond gris anthracite pour faire ressortir le bouton *\/\r\n  background: rgba(255, 255, 255, 0.12); \r\n  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.1);\r\n}\r\n\r\n.apple-item:hover .apple-label {\r\n  opacity: 1;\r\n}\r\n\r\n\/* 7. EFFET DE CLIC *\/\r\n.apple-item a:active {\r\n  transform: scale(0.94);\r\n}\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-070d7c2 elementor-widget elementor-widget-spacer\" data-id=\"070d7c2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-524fe970 elementor-widget__width-initial elementor-widget-mobile__width-initial elementor-widget elementor-widget-image\" data-id=\"524fe970\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;motion_fx_motion_fx_scrolling&quot;:&quot;yes&quot;,&quot;motion_fx_opacity_effect&quot;:&quot;yes&quot;,&quot;motion_fx_opacity_direction&quot;:&quot;in-out&quot;,&quot;motion_fx_opacity_range&quot;:{&quot;unit&quot;:&quot;%&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:{&quot;start&quot;:49,&quot;end&quot;:56}},&quot;motion_fx_blur_effect&quot;:&quot;yes&quot;,&quot;motion_fx_blur_direction&quot;:&quot;in-out&quot;,&quot;motion_fx_blur_level&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:15,&quot;sizes&quot;:[]},&quot;motion_fx_blur_range&quot;:{&quot;unit&quot;:&quot;%&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:{&quot;start&quot;:44,&quot;end&quot;:80}},&quot;motion_fx_scale_effect&quot;:&quot;yes&quot;,&quot;motion_fx_motion_fx_mouse&quot;:&quot;yes&quot;,&quot;motion_fx_opacity_level&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:10,&quot;sizes&quot;:[]},&quot;motion_fx_scale_direction&quot;:&quot;out-in&quot;,&quot;motion_fx_scale_speed&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:4,&quot;sizes&quot;:[]},&quot;motion_fx_scale_range&quot;:{&quot;unit&quot;:&quot;%&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:{&quot;start&quot;:20,&quot;end&quot;:80}},&quot;motion_fx_devices&quot;:[&quot;desktop&quot;,&quot;tablet&quot;,&quot;mobile&quot;]}\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"375\" src=\"https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/IMG_5312-1.png\" class=\"attachment-large size-large wp-image-237\" alt=\"\" srcset=\"https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/IMG_5312-1.png 845w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/IMG_5312-1-300x141.png 300w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/IMG_5312-1-768x360.png 768w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-771356fb elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"771356fb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4a71e401 elementor-widget elementor-widget-html\" data-id=\"4a71e401\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<script>\r\nfunction Marquee(selector, speed) {\r\n  const parent = document.querySelector(selector);\r\n  const clone = parent.innerHTML;\r\n  let i = 0;\r\n  parent.innerHTML += clone;\r\n\r\n  setInterval(() => {\r\n    i += speed;\r\n    if (i >= parent.children[0].clientWidth) i = 0;\r\n    parent.children[0].style.marginLeft = `-${i}px`;\r\n  }, 0);\r\n}\r\n\r\nwindow.addEventListener('load', () => Marquee('.marquee', .4));\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-732156f0 elementor-widget__width-initial marquee elementor-widget elementor-widget-heading\" data-id=\"732156f0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Cr\u00e9ation . Site internet . R\u00e9f\u00e9rencement . Strat\u00e9gie .  Cr\u00e9ation . Site internet . R\u00e9f\u00e9rencement . Strat\u00e9gie .<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5d605e48 elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"5d605e48\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5b36695e elementor-headline--style-rotate elementor-widget__width-initial elementor-widget-mobile__width-initial elementor-widget elementor-widget-animated-headline\" data-id=\"5b36695e\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;headline_style&quot;:&quot;rotate&quot;,&quot;animation_type&quot;:&quot;clip&quot;,&quot;rotating_text&quot;:&quot;Personnalis\\u00e9\\nUnique\\nPour Vous&quot;,&quot;rotate_iteration_delay&quot;:3000,&quot;loop&quot;:&quot;yes&quot;}\" data-widget_type=\"animated-headline.default\">\n\t\t\t\t\t\t\t<h3 class=\"elementor-headline elementor-headline-animation-type-clip\">\n\t\t\t\t<span class=\"elementor-headline-dynamic-wrapper elementor-headline-text-wrapper\">\n\t\t\t\t\t<span class=\"elementor-headline-dynamic-text elementor-headline-text-active\">\n\t\t\t\tPersonnalis\u00e9\t\t\t<\/span>\n\t\t\t\t\t<span class=\"elementor-headline-dynamic-text\">\n\t\t\t\tUnique\t\t\t<\/span>\n\t\t\t\t\t<span class=\"elementor-headline-dynamic-text\">\n\t\t\t\tPour&nbsp;Vous\t\t\t<\/span>\n\t\t\t\t\t\t<\/span>\n\t\t\t\t<\/h3>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-70dcbf57 e-con-full bloc-rideau animated-mesh-gradient-background e-flex e-con e-child\" data-id=\"70dcbf57\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-204d55ce elementor-position-left elementor-vertical-align-top elementor-widget elementor-widget-image-box\" data-id=\"204d55ce\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image-box.default\">\n\t\t\t\t\t<div class=\"elementor-image-box-wrapper\"><figure class=\"elementor-image-box-img\"><img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"600\" src=\"https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/Design-sans-titre-1-1024x768.png\" class=\"attachment-large size-large wp-image-238\" alt=\"\" srcset=\"https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/Design-sans-titre-1-1024x768.png 1024w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/Design-sans-titre-1-300x225.png 300w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/Design-sans-titre-1-768x576.png 768w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/Design-sans-titre-1-1536x1152.png 1536w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/Design-sans-titre-1.png 1600w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/><\/figure><div class=\"elementor-image-box-content\"><h3 class=\"elementor-image-box-title\"><br>COlin Potel<\/h3><p class=\"elementor-image-box-description\">Dans un monde satur\u00e9 d'informations, la clart\u00e9 est votre plus grand atout.<br><br>J'aide les entreprises \u00e0 sortir du bruit ambiant en concevant des strat\u00e9gies de communication coh\u00e9rentes et percutantes. <br><br>Mon approche ? <br>Allier la finesse de l'analyse \u00e0 la force du message.<\/p><\/div><\/div>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-44f69031 elementor-widget elementor-widget-html\" data-id=\"44f69031\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"cocom-wrapper\">\r\n  <a href=\"https:\/\/www.cocomunication.fr\/?page_id=397\" style=\"text-decoration: none;\">\r\n    <button class=\"btn-cocom-v3\">\r\n      <div class=\"default-layer\">Prendre un caf\u00e9 virtuel !<\/div>\r\n\r\n      <div class=\"hover-white-layer\">\r\n        <div class=\"letters-animated\" id=\"lettersCocom\"><\/div>\r\n      <\/div>\r\n    <\/button>\r\n  <\/a>\r\n<\/div>\r\n\r\n<style>\r\n\/* Votre CSS reste identique *\/\r\n.cocom-wrapper {\r\n  display: flex;\r\n  justify-content: center;\r\n  padding: 20px 0;\r\n}\r\n\r\n.btn-cocom-v3 {\r\n  background-color: #000 !important;\r\n  border: 2px solid #000;\r\n  border-radius: 999px;\r\n  cursor: pointer;\r\n  font-family: 'Poppins', sans-serif;\r\n  font-size: 16px;\r\n  font-weight: 900;\r\n  height: 65px;\r\n  min-width: 380px;\r\n  overflow: hidden;\r\n  padding: 0;\r\n  position: relative;\r\n  text-transform: uppercase;\r\n  transition: transform 0.2s ease;\r\n}\r\n\r\n.default-layer {\r\n  position: absolute;\r\n  inset: 0;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  color: #fff;\r\n  background-color: #000;\r\n  z-index: 2;\r\n  transition: transform 0.4s cubic-bezier(0.87, 0, 0.13, 1);\r\n}\r\n\r\n.btn-cocom-v3:hover .default-layer {\r\n  transform: translateY(100%);\r\n}\r\n\r\n.hover-white-layer {\r\n  position: absolute;\r\n  inset: 0;\r\n  background-color: #fff;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  z-index: 1;\r\n}\r\n\r\n.letters-animated {\r\n  display: flex;\r\n  color: #000;\r\n}\r\n\r\n.letters-animated span {\r\n  display: inline-block;\r\n  opacity: 0;\r\n  transform: translateY(-15px);\r\n  transition: transform 0.3s cubic-bezier(0.87, 0, 0.13, 1), opacity 0.3s;\r\n}\r\n\r\n.letters-animated span:nth-child(2n) {\r\n  transform: translateY(15px);\r\n}\r\n\r\n.btn-cocom-v3:hover .letters-animated span {\r\n  opacity: 1;\r\n  transform: translateY(0);\r\n}\r\n\r\n.btn-cocom-v3:not(:hover) .default-layer {\r\n  transform: translateY(0);\r\n}\r\n\r\n.btn-cocom-v3:active {\r\n  transform: scale(0.98);\r\n}\r\n<\/style>\r\n\r\n<script>\r\n(function() {\r\n  const text = \"prendre un caf\u00e9 virtuel !\";\r\n  const container = document.getElementById('lettersCocom');\r\n  \r\n  if (container && container.innerHTML === \"\") {\r\n    text.split('').forEach((char, index) => {\r\n      const span = document.createElement('span');\r\n      span.innerHTML = char === ' ' ? '&nbsp;' : char;\r\n      span.style.transitionDelay = (index * 0.03) + 's';\r\n      container.appendChild(span);\r\n    });\r\n  }\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6e0baa7 elementor-widget elementor-widget-image\" data-id=\"6e0baa7\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;sticky&quot;:&quot;top&quot;,&quot;sticky_on&quot;:[&quot;desktop&quot;,&quot;tablet&quot;,&quot;mobile&quot;],&quot;sticky_offset&quot;:0,&quot;sticky_effects_offset&quot;:0,&quot;sticky_anchor_link_offset&quot;:0}\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"450\" src=\"https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/PORTFOLIO-1024x576.png\" class=\"attachment-large size-large wp-image-259\" alt=\"\" srcset=\"https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/PORTFOLIO-1024x576.png 1024w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/PORTFOLIO-300x169.png 300w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/PORTFOLIO-768x432.png 768w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/PORTFOLIO-1536x864.png 1536w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/PORTFOLIO.png 1920w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-22c9508 elementor-widget elementor-widget-image\" data-id=\"22c9508\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;sticky&quot;:&quot;top&quot;,&quot;sticky_on&quot;:[&quot;desktop&quot;,&quot;tablet&quot;,&quot;mobile&quot;],&quot;sticky_offset&quot;:0,&quot;sticky_effects_offset&quot;:0,&quot;sticky_anchor_link_offset&quot;:0}\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"450\" src=\"https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/2-1-1024x576.jpg\" class=\"attachment-large size-large wp-image-240\" alt=\"\" srcset=\"https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/2-1-1024x576.jpg 1024w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/2-1-300x169.jpg 300w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/2-1-768x432.jpg 768w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/2-1-1536x864.jpg 1536w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/2-1.jpg 1920w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-2854f46 elementor-widget elementor-widget-image\" data-id=\"2854f46\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;sticky&quot;:&quot;top&quot;,&quot;sticky_on&quot;:[&quot;desktop&quot;,&quot;tablet&quot;,&quot;mobile&quot;],&quot;sticky_offset&quot;:0,&quot;sticky_effects_offset&quot;:0,&quot;sticky_anchor_link_offset&quot;:0}\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"450\" src=\"https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/3-1-1024x576.jpg\" class=\"attachment-large size-large wp-image-241\" alt=\"\" srcset=\"https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/3-1-1024x576.jpg 1024w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/3-1-300x169.jpg 300w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/3-1-768x432.jpg 768w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/3-1-1536x864.jpg 1536w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/3-1.jpg 1920w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-fe25a4c elementor-widget elementor-widget-image\" data-id=\"fe25a4c\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;sticky&quot;:&quot;top&quot;,&quot;sticky_on&quot;:[&quot;desktop&quot;,&quot;tablet&quot;,&quot;mobile&quot;],&quot;sticky_offset&quot;:0,&quot;sticky_effects_offset&quot;:0,&quot;sticky_anchor_link_offset&quot;:0}\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"450\" src=\"https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/4-1-1024x576.jpg\" class=\"attachment-large size-large wp-image-242\" alt=\"\" srcset=\"https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/4-1-1024x576.jpg 1024w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/4-1-300x169.jpg 300w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/4-1-768x432.jpg 768w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/4-1-1536x864.jpg 1536w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/4-1.jpg 1920w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-aebfc5a elementor-widget elementor-widget-image\" data-id=\"aebfc5a\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;sticky&quot;:&quot;top&quot;,&quot;sticky_on&quot;:[&quot;desktop&quot;,&quot;tablet&quot;,&quot;mobile&quot;],&quot;sticky_offset&quot;:0,&quot;sticky_effects_offset&quot;:0,&quot;sticky_anchor_link_offset&quot;:0}\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"450\" src=\"https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/5-1-1024x576.jpg\" class=\"attachment-large size-large wp-image-243\" alt=\"\" srcset=\"https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/5-1-1024x576.jpg 1024w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/5-1-300x169.jpg 300w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/5-1-768x432.jpg 768w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/5-1-1536x864.jpg 1536w, https:\/\/www.cocomunication.fr\/wp-content\/uploads\/2026\/03\/5-1.jpg 1920w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-560dabc elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"560dabc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-26df5542 elementor-widget elementor-widget-html\" data-id=\"26df5542\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"btn-share-container\">\r\n  <button class=\"btn-5-clean\" onclick=\"handleButtonClick(this)\">\r\n    <div class=\"state state--default\">\r\n      <div class=\"icon\">\r\n        <svg width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n          <g style=\"filter: url(#shadow-val)\">\r\n            <path d=\"M14.2199 21.63C13.0399 21.63 11.3699 20.8 10.0499 16.83L9.32988 14.67L7.16988 13.95C3.20988 12.63 2.37988 10.96 2.37988 9.78001C2.37988 8.61001 3.20988 6.93001 7.16988 5.60001L15.6599 2.77001C17.7799 2.06001 19.5499 2.27001 20.6399 3.35001C21.7299 4.43001 21.9399 6.21001 21.2299 8.33001L18.3999 16.82C17.0699 20.8 15.3999 21.63 14.2199 21.63ZM7.63988 7.03001C4.85988 7.96001 3.86988 9.06001 3.86988 9.78001C3.86988 10.5 4.85988 11.6 7.63988 12.52L10.1599 13.36C10.3799 13.43 10.5599 13.61 10.6299 13.83L11.4699 16.35C12.3899 19.13 13.4999 20.12 14.2199 20.12C14.9399 20.12 16.0399 19.13 16.9699 16.35L19.7999 7.86001C20.3099 6.32001 20.2199 5.06001 19.5699 4.41001C18.9199 3.76001 17.6599 3.68001 16.1299 4.19001L7.63988 7.03001Z\" fill=\"currentColor\"><\/path>\r\n            <path d=\"M10.11 14.4C9.92005 14.4 9.73005 14.33 9.58005 14.18C9.29005 13.89 9.29005 13.41 9.58005 13.12L13.16 9.53C13.45 9.24 13.93 9.24 14.22 9.53C14.51 9.82 14.51 10.3 14.22 10.59L10.64 14.18C10.5 14.33 10.3 14.4 10.11 14.4Z\" fill=\"currentColor\"><\/path>\r\n          <\/g>\r\n          <defs><filter id=\"shadow-val\"><feDropShadow dx=\"0\" dy=\"1\" stdDeviation=\"0.6\" flood-opacity=\"0.5\"\/><\/filter><\/defs>\r\n        <\/svg>\r\n      <\/div>\r\n      <p>\r\n        <span style=\"--i: 0\">P<\/span><span style=\"--i: 1\">a<\/span><span style=\"--i: 2\">r<\/span><span style=\"--i: 3\">t<\/span><span style=\"--i: 4\">a<\/span><span style=\"--i: 5\">g<\/span><span style=\"--i: 6\">e<\/span><span style=\"--i: 7\">r<\/span>\r\n      <\/p>\r\n    <\/div>\r\n\r\n    <div class=\"state state--sent\">\r\n      <div class=\"icon\">\r\n        <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"none\" viewBox=\"0 0 24 24\" height=\"1em\" width=\"1em\">\r\n          <path fill=\"currentColor\" d=\"M12 22.75C6.07 22.75 1.25 17.93 1.25 12C1.25 6.07 6.07 1.25 12 1.25C17.93 1.25 22.75 6.07 22.75 12C22.75 17.93 17.93 22.75 12 22.75ZM12 2.75C6.9 2.75 2.75 6.9 2.75 12C2.75 17.1 6.9 21.25 12 21.25C17.1 21.25 21.25 17.1 21.25 12C21.25 6.9 17.1 2.75 12 2.75Z\"><\/path>\r\n          <path fill=\"currentColor\" d=\"M10.5795 15.5801C10.3795 15.5801 10.1895 15.5001 10.0495 15.3601L7.21945 12.5301C7.98945 11.1801 10.5795 13.7701 15.7195 8.6301C16.7795 9.6901 11.1095 15.3601 10.5795 15.5801Z\"><\/path>\r\n        <\/svg>\r\n      <\/div>\r\n      <p>\r\n        <span style=\"--i: 9\">E<\/span><span style=\"--i: 10\">n<\/span><span style=\"--i: 11\">v<\/span><span style=\"--i: 12\">o<\/span><span style=\"--i: 13\">y<\/span><span style=\"--i: 14\">\u00e9<\/span><span style=\"--i: 15\">!<\/span>\r\n      <\/p>\r\n    <\/div>\r\n  <\/button>\r\n<\/div>\r\n\r\n<style>\r\n.btn-share-container {\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  padding: 10px;\r\n}\r\n\r\n.btn-5-clean {\r\n  --primary: #02A2F8;\r\n  --bg-dark: #181E2C;\r\n  --radius: 32px;\r\n  cursor: pointer;\r\n  border-radius: var(--radius);\r\n  border: none;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  position: relative;\r\n  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\r\n  min-width: 190px;\r\n  height: 64px;\r\n  background: var(--bg-dark); \/* Visibilit\u00e9 optimale sur fond clair *\/\r\n  color: white;\r\n  font-family: \"Poppins\", sans-serif;\r\n  font-size: 18px;\r\n  font-weight: 600;\r\n  overflow: visible;\r\n  padding: 0 20px;\r\n}\r\n\r\n\/* Centrage des \u00e9tats *\/\r\n.btn-5-clean .state {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: 10px;\r\n  z-index: 2;\r\n  width: 100%;\r\n}\r\n\r\n.btn-5-clean .icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  transition: all 0.3s ease;\r\n}\r\n\r\n.btn-5-clean p { margin: 0; display: flex; }\r\n.btn-5-clean p span { display: block; }\r\n\r\n\/* Effet au survol simple et propre *\/\r\n.btn-5-clean:hover {\r\n  transform: scale(1.03);\r\n  background: #232d42; \/* L\u00e9g\u00e8rement plus clair au survol *\/\r\n}\r\n\r\n.btn-5-clean:hover .state--default .icon {\r\n  transform: rotate(45deg) scale(1.1);\r\n}\r\n\r\n\/* Animation des lettres (Vague) *\/\r\n.btn-5-clean:hover p span {\r\n  animation: waveClean 0.5s ease forwards calc(var(--i) * 0.02s);\r\n}\r\n\r\n@keyframes waveClean {\r\n  50% { transform: translateY(-4px); color: var(--primary); }\r\n  100% { transform: translateY(0); }\r\n}\r\n\r\n\/* Animation exacte du d\u00e9collage *\/\r\n.btn-5-clean.is-animating .state--default .icon svg {\r\n  animation: takeOffExact 0.8s linear forwards;\r\n}\r\n\r\n@keyframes takeOffExact {\r\n  0% { opacity: 1; }\r\n  60% { opacity: 1; transform: translateX(70px) rotate(45deg) scale(2); }\r\n  100% { opacity: 0; transform: translateX(160px) rotate(45deg) scale(0); }\r\n}\r\n\r\n\/* \u00c9tat Final (Envoy\u00e9) *\/\r\n.btn-5-clean .state--sent { display: none !important; }\r\n\r\n.btn-5-clean.is-sent {\r\n  background: var(--primary) !important;\r\n  color: white !important;\r\n}\r\n\r\n.btn-5-clean.is-sent .state--default { display: none !important; }\r\n.btn-5-clean.is-sent .state--sent { \r\n  display: flex !important;\r\n  animation: fadeIn 0.4s ease;\r\n}\r\n\r\n@keyframes fadeIn {\r\n  from { opacity: 0; transform: translateY(5px); }\r\n  to { opacity: 1; transform: translateY(0); }\r\n}\r\n<\/style>\r\n\r\n<script>\r\nfunction handleButtonClick(btn) {\r\n  if (btn.classList.contains('is-animating') || btn.classList.contains('is-sent')) return;\r\n  \r\n  btn.classList.add('is-animating');\r\n  const url = window.location.href;\r\n\r\n  setTimeout(() => {\r\n    btn.classList.remove('is-animating');\r\n    btn.classList.add('is-sent');\r\n    \r\n    \/\/ Partage natif mobile ou copie\r\n    if (navigator.share) {\r\n      navigator.share({ title: 'Partager ce site', url: url });\r\n    } else {\r\n      navigator.clipboard.writeText(url);\r\n      alert(\"Lien copi\u00e9 dans votre presse-papier !\");\r\n    }\r\n  }, 850);\r\n}\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7a90a7b5 elementor-widget elementor-widget-html\" data-id=\"7a90a7b5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\/* 1. Nettoyage Elementor *\/\r\n.wrapper-elementor, .wrapper-elementor * {\r\n  outline: none !important;\r\n  box-shadow: none !important;\r\n  border: none !important;\r\n  -webkit-tap-highlight-color: transparent;\r\n}\r\n\r\n.wrapper-elementor {\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  width: 100%;\r\n}\r\n\r\n.cta {\r\n  position: relative;\r\n  display: inline-flex;\r\n  align-items: center;\r\n  padding: 0; \r\n  background: transparent !important;\r\n  cursor: pointer;\r\n  text-decoration: none;\r\n  font-family: \"Ubuntu\", sans-serif;\r\n  font-size: 19px;\r\n  font-weight: 700;\r\n  letter-spacing: 0.05em;\r\n  height: 52px;\r\n}\r\n\r\n\/* 2. Couche NOIRE (Base) *\/\r\n.cta .base-layer {\r\n  display: flex;\r\n  align-items: center;\r\n  color: #000 !important;\r\n  \/* On r\u00e9duit ici pour que le texte commence \"dans\" la bulle *\/\r\n  padding: 0 20px 0 18px; \r\n  white-space: nowrap;\r\n  position: relative;\r\n  top: 1px;\r\n}\r\n\r\n\/* 3. LA BULLE NOIRE *\/\r\n.cta .bubble {\r\n  position: absolute;\r\n  top: 0;\r\n  left: 0;\r\n  width: 52px; \/* Taille de d\u00e9part *\/\r\n  height: 52px;\r\n  background: #000 !important;\r\n  border-radius: 50px;\r\n  transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);\r\n  overflow: hidden; \/* Emprisonne le blanc *\/\r\n  z-index: 2;\r\n}\r\n\r\n\/* 4. Couche BLANCHE (Prisonni\u00e8re de la bulle) *\/\r\n.cta .bubble .white-layer {\r\n  display: flex;\r\n  align-items: center;\r\n  color: #fff !important;\r\n  \/* Doit avoir EXACTEMENT le m\u00eame padding que la base-layer *\/\r\n  padding: 0 20px 0 18px; \r\n  height: 100%;\r\n  white-space: nowrap;\r\n  position: absolute;\r\n  left: 0;\r\n  top: 1px;\r\n}\r\n\r\n\/* 5. Style des fl\u00e8ches *\/\r\n.cta svg {\r\n  margin-left: 12px;\r\n  stroke-width: 2;\r\n  fill: none;\r\n  transition: all 0.4s ease;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.cta .base-layer svg { stroke: #000; transform: translateX(-5px); }\r\n.cta .bubble svg { stroke: #fff; transform: translateX(-5px); }\r\n\r\n\/* --- HOVER --- *\/\r\n.cta:hover .bubble {\r\n  width: 100%; \/* La bulle s'\u00e9tend et r\u00e9v\u00e8le le reste du blanc *\/\r\n}\r\n\r\n.cta:hover svg {\r\n  transform: translateX(0);\r\n}\r\n\r\n.cta:active {\r\n  transform: scale(0.95);\r\n}\r\n<\/style>\r\n\r\n<div class=\"wrapper-elementor\">\r\n  <a href=\"https:\/\/www.cocomunication.fr\/?page_id=303\" class=\"cta\">\r\n    <div class=\"base-layer\">\r\n      D\u00e9couvrir\r\n      <svg width=\"15px\" height=\"15px\" viewBox=\"0 0 13 13\">\r\n        <path d=\"M1,5 L11,5\"><\/path>\r\n        <polyline points=\"8 1 12 5 8 9\"><\/polyline>\r\n      <\/svg>\r\n    <\/div>\r\n\r\n    <div class=\"bubble\">\r\n      <div class=\"white-layer\">\r\n        D\u00e9couvrir\r\n        <svg width=\"15px\" height=\"15px\" viewBox=\"0 0 13 13\">\r\n          <path d=\"M1,5 L11,5\"><\/path>\r\n          <polyline points=\"8 1 12 5 8 9\"><\/polyline>\r\n        <\/svg>\r\n      <\/div>\r\n    <\/div>\r\n  <\/a>\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-076c88d elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"076c88d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\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>Accueil Portfolio Contact Cr\u00e9ation . Site internet . R\u00e9f\u00e9rencement . Strat\u00e9gie . Cr\u00e9ation . Site internet . R\u00e9f\u00e9rencement . Strat\u00e9gie . Personnalis\u00e9 Unique Pour&nbsp;Vous COlin Potel Dans un monde satur\u00e9 d&rsquo;informations, la clart\u00e9 est votre plus grand atout. J&rsquo;aide les entreprises \u00e0 sortir du bruit ambiant en concevant des strat\u00e9gies de communication coh\u00e9rentes et percutantes. [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":237,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-236","page","type-page","status-publish","has-post-thumbnail","hentry"],"_links":{"self":[{"href":"https:\/\/www.cocomunication.fr\/index.php?rest_route=\/wp\/v2\/pages\/236","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.cocomunication.fr\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.cocomunication.fr\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.cocomunication.fr\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.cocomunication.fr\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=236"}],"version-history":[{"count":131,"href":"https:\/\/www.cocomunication.fr\/index.php?rest_route=\/wp\/v2\/pages\/236\/revisions"}],"predecessor-version":[{"id":704,"href":"https:\/\/www.cocomunication.fr\/index.php?rest_route=\/wp\/v2\/pages\/236\/revisions\/704"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.cocomunication.fr\/index.php?rest_route=\/wp\/v2\/media\/237"}],"wp:attachment":[{"href":"https:\/\/www.cocomunication.fr\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=236"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}