/*
    font-family: 'Architects Daughter', cursive;

    font-family: 'Gluten', cursive;

    font-family: 'Lato', sans-serif;

    font-family: 'Lexend Exa', sans-serif;
*/

:root {
	--bleu: #073453;
	--texte: #092131;
	--margin: 2rem;
	--doublemargin: 3rem;
	--noir: #1B1B1B;
	--jaune: #FBB03B;
	--bleuclair: #8EB6D1;
}

html {
  height: 100%;
  font-size: 100%;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  line-height: 1.4;
}
html, body {
  position: relative;
  font-family: 'Lato', sans-serif;
  color: var(--texte);
  font-size: 16px;
  font-weight: 300;
}
body {
  overflow-x: hidden;
}
body * {
  box-sizing: border-box;
}
p, h1, h2, h3 {
  position: relative;
}
p {margin-top: 0;}

/**
 * Generic
 */
 ul.menu {
  margin-left: 1em; /* LTR */
  padding: 0;
  list-style: none outside;
  text-align: left; /* LTR */
}
[dir="rtl"] ul.menu {
  margin-right: 1em;
  margin-left: 0;
  text-align: right;
}
.menu-item--expanded {
  list-style-type: circle;
  list-style-image: url(../../../../misc/menu-expanded.png);
}
.menu-item--collapsed {
  list-style-type: disc;
  list-style-image: url(../../../../misc/menu-collapsed.png); /* LTR */
}
[dir="rtl"] .menu-item--collapsed {
  list-style-image: url(../../../../misc/menu-collapsed-rtl.png);
}
.menu-item {
  margin: 0;
  padding-top: 0.2em;
}
ul.menu a.is-active {
  color: #000;
}

a {color: #037676;text-decoration: none;transition: all 0.25s ease-in-out;-webkit-transition: all 0.25s ease-in-out;-moz-transition: all 0.25s ease-in-out;border: 0;}
button {transition: all 0.25s ease-in-out;-webkit-transition: all 0.25s ease-in-out;-moz-transition: all 0.25s ease-in-out;}
.button {display: inline-block; line-height: 1; border-radius: 50px;  color: white; padding: 1em 1.5em; border: 0; -webkit-transition: all 0.25s ease-in-out;-moz-transition: all 0.25s ease-in-out; font-weight: 700; text-transform: uppercase;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#285d91+0,021023+100 */
background: #285d91; /* Old browsers */
background: -moz-linear-gradient(top,  #285d91 0%, #021023 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #285d91 0%,#021023 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #285d91 0%,#021023 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#285d91', endColorstr='#021023',GradientType=0 ); /* IE6-9 */
position: relative;
}
.button:before {width: 100%; height: 100%; content:""; left: 0; top: 0; background: #021023; position: absolute; opacity: 0; transition: all 0.25s ease-in-out; border-radius: 50px;}
.button:hover, .button:focus {color: white;}
.button:hover:before {opacity: 1;}
.button span {position: relative;}
a:hover, a:active, a:focus {text-decoration: none; color: #484848;}
img {display: block;max-width: 100%; height: auto;}
.container, .container-interne {max-width: 1450px; margin: 0 auto; padding: 0 15px;}
.layout-sidebar-first {width: 20%; float: left;}
.layout-content {width: 100%; float: left;}
.has-sidebar-first .layout-content {width:80%;}
.has-sidebar-first.has-sidebar-second .layout-content {width:60%;}
h1, h2 {font-family: 'Lexend Exa', sans-serif; line-height: 1.1; font-weight: 400;}
i {display: inline-block;}

.slick-arrow {width: 75px; height: 65px; border: 0; background: none; overflow: hidden; text-indent: -9999px; position: absolute; top: 105%; z-index: 5; transition: all 0.25s ease-in-out;-webkit-transition: all 0.25s ease-in-out;-moz-transition: all 0.25s ease-in-out;}
.slick-arrow.slick-prev {left: 50%; transform: translateX(-700px); background: url(../images/poisson-fleche-bleu.svg) no-repeat center; background-size: 100%; transition: all 0.25s ease-in-out;}
.slick-arrow.slick-prev:after {content:""; width:14px; height: 24px; position: absolute; left: 50%; top: 46%; transform: translate(-50%, -50%); background: url(../images/fleche-gauche.svg) no-repeat center;}
.slick-arrow.slick-prev:hover {background: url(../images/poisson-fleche.svg) no-repeat center; background-size: 100%;}
.slick-arrow.slick-next {right: 50%; transform: translateX(700px); background: url(../images/poisson-fleche-droit.svg) no-repeat center; background-size: 100%; transition: all 0.25s ease-in-out;}
.slick-arrow.slick-next:after {content:""; width:14px; height: 24px; position: absolute; left: 50%; top: 46%; transform: translate(-50%, -50%) rotate(180deg); background: url(../images/fleche-gauche.svg) no-repeat center;}
.slick-arrow.slick-next:hover {background: url(../images/poisson-fleche-droit-noir.svg) no-repeat center; background-size: 100%;}
.slick-arrow:hover {border-color: #292929;}
.slick-arrow:focus, .slick-dots button:focus {outline:none;}
.slick-dots {margin: 0; padding: 0; list-style: none; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);}
.slick-dots li {float: left; margin: 0 0.25em;}
.slick-dots button {padding: 0; overflow: hidden; width: 15px; height: 15px; background: white; border: 0; border-radius: 8px; text-indent: -9999px; transition: all 0.25s ease-in-out;-webkit-transition: all 0.25s ease-in-out;-moz-transition: all 0.25s ease-in-out;}
.slick-dots .slick-active button, .slick-dots button:hover {background: #F1404B; width: 25px;}
svg {display: inline-block; height: auto; max-width: 100%;}
h2 {font-family: 'Gluten', cursive; font-size: 2.2rem; font-weight: 400;}

.path-frontpage footer {background: none;}
.path-frontpage footer:after {display: none;}

/*Cookies*/
.cookiesjsr-banner {background: #333; justify-content: space-between; padding: 0.5em 1em 0.5em 0;}
.cookiesjsr-btn, .cookiesjsr-service-group.active .cookiesjsr-service-group--content {background: #333; text-align: left;}
.cookiesjsr-links.links--row li a:hover {color: var(--violet);}
.cookiesjsr-btn {min-height: 18px; width: auto; padding: 0.25em 1em;}
.cookiesjsr-banner--action {justify-content: flex-end; width: auto;}
.cookiesjsr-banner--info {width: auto; margin: 0;}
.cookiesjsr-banner--links {margin-top: 0;}

/*Home*/
.path-frontpage {background: url(../images/bg-home.svg) no-repeat bottom center; background-size: 100%; width: 100vw; height: 100vh; overflow: hidden; position: relative;}
.path-frontpage #block-cdweb-page-title {display: none;}
.center-home-logo {width: 300px; position: fixed; left: 50vw; top: 42vh; transform: translate(-50%, -65%);}
.center-home-logo-front {background: #092131; position: absolute; top: 16%; left: 17.5%; height: 63%;  border-radius: 50%; width: 65%; text-align: center; transition: all 0.5s ease-in-out; display: flex; flex-direction: column; justify-content: center; transform-origin: left;
}
.center-home-logo:hover .center-home-logo-front {background: var(--bleuclair);}
/*.center-home-logo:hover .center-home-logo-front {transform: perspective(1200px) translateZ(0px) translateX(0px) translateY(0px) rotateY(-105deg);}
*/


@keyframes bulleh1 {
  0% {
    transform: rotate(0);
	bottom: 37%; width: 0.5rem;
  }
  50% {
    transform: rotate(180deg);
	width: 1rem;
	bottom: 73.5%;	  
  }
  100% {
    transform: rotate(360deg);
	width: 2rem;
	bottom: 110%;
  }
}


@keyframes bulleh2 {
  0% {
    transform: rotate(0);
	bottom: 37%; width: 0.5rem;
	right: 36.6%;
  }
  50% {
    transform: rotate(180deg);
	width: 1rem;
	bottom: 73.5%;
	right: 38.6%;	
  }
  100% {
    transform: rotate(360deg);
	width: 2rem;
	bottom: 110%;
	right: 40.6%;
  }
}

.bulle-2.bulle-ok {display: block; animation: bulleh2 7s infinite linear;} 




.bulle {position: absolute; width: 0.5rem; transform: rotate(0); display: none;}
.bulle.bulle-first {display: block;}

@keyframes bullehp1-1 {
  0% {
    transform: rotate(0);
	width: 0.5rem;
	right: 100%;
    bottom: 16%;
  }
  50% {
    transform: rotate(180deg);
	width: 1rem;
	bottom: 60vh;
	right: 110%;	
  }
  100% {
    transform: rotate(360deg);
	width: 2rem;
	bottom: 80vh;
	right: 90%;
  }
}


@keyframes poissonh1 {
  0% {
        right: 30.9%;
		opacity: 1;
		transform: translateY(-711%) rotate(0);	
  }
  35% {
    transform: translateY(-511%) rotate(-15deg);
  }
  45% {
    transform: translateY(-511%) rotate(10deg);
  }   
  65% {
	right: 100%;
	opacity: 1;
	transform: translateY(-851%) rotate(30deg);	
  }  
  70% {
	right: 120%;
	opacity: 1;
	transform: translateY(-951%) rotate(30deg);	
  }
  71% {
	right: 120%;
	opacity: 0;	  
	transform: translateY(-711%) rotate(0);	
  }
  72% {
	right: -10%;
	opacity: 0;	  
  } 
  73% {
	right: -10%;
	opacity: 1;  
  }    
  100% {
    right: 30.9%;
	opacity: 1;
  }
}

.poisson.poisson-1 {
    position: absolute;
    bottom: 0;
    transform: translateY(-711%);
    width: 5.5%;
	animation: poissonh1 36s infinite linear;
}
.poisson-1 .bulle {
    right: 100%;
    bottom: 16%;
}

.poisson-1 .bulle.bulle-1-1 {animation: bullehp1-1 8s infinite linear;}
.poisson-1 .bulle.bulle-1-2.bulle-ok {display: block;animation: bullehp1-1 8s infinite linear;} 
.poisson-1 .bulle.bulle-1-3.bulle-ok {display: block;animation: bullehp1-1 7s infinite linear;}
.poisson-1 .bulle.bulle-1-4.bulle-ok {display: block;animation: bullehp2-1 8.5s infinite linear;}
.poisson-1 .bulle.bulle-1-5.bulle-ok {display: block;animation: bullehp2-1 9s infinite linear;}
.poisson-1 .bulle.bulle-1-6.bulle-ok {display: block;animation: bullehp1-1 6.5s infinite linear;}
.poisson-1 .bulle.bulle-1-7.bulle-ok {display: block;animation: bullehp1-1 8s infinite linear;}
.poisson-1 .bulle.bulle-1-8.bulle-ok {display: block;animation: bullehp2-1 8.5s infinite linear;}
.poisson-1 .bulle.bulle-1-9.bulle-ok {display: block;animation: bullehp1-1 7.4s infinite linear;}
.poisson-1 .bulle.bulle-1-10.bulle-ok {display: block;animation: bullehp1-1 8.9s infinite linear;}

@keyframes poissonh2 {
  0% {
        right: 50.5%;
		opacity: 1;
		transform: translateY(-248%) rotate(0);	
  }
  49% {
	right: 110%;
	opacity: 1;
	transform: translateY(-45%) rotate(-20deg);	
  }
  50% {
	right: 110%;
	opacity: 0;
	transform: translateY(-45%) rotate(-20deg);	
  }  
  51% {
	right: -10%;
	opacity: 0;	  
	transform: translateY(-45%) rotate(20deg);	
  }
  52% {
	right: -10%;
	opacity: 1;	  
	transform: translateY(-45%) rotate(20deg);	 
  } 
  90% {
	transform: translateY(-248%) rotate(0);
  }    
  100% {
    right: 50.5%;
	opacity: 1;
	transform: translateY(-248%) rotate(0);
  }
}

.poisson.poisson-2 {
    position: absolute;
    bottom: 0;
	transform: translateY(-248%);
    width: 9.5%;
    right: 50.5%;
	animation: poissonh2 45s infinite linear;
}

@keyframes bullehp2-1 {
  0% {
    transform: rotate(0);
	width: 0.5rem;
	right: 100%;
    bottom: 16%;
  }
  
  25% {
	right: 80%;  
  }
  
  50% {
    transform: rotate(180deg);
	width: 1.8rem;
	bottom: 60vh;
	right: 60%;	
  }
  100% {
    transform: rotate(360deg);
	width: 2.8rem;
	bottom: 80vh;
	right: 70%;
  }
}

.poisson.poisson-2 .bulle {
	right: 100%;
    bottom: 8%;
}

.poisson-2 .bulle.bulle-2-1 {animation: bullehp1-1 8s infinite linear;}
.poisson-2 .bulle.bulle-2-2.bulle-ok {display: block;animation: bullehp1-1 8s infinite linear;} 
.poisson-2 .bulle.bulle-2-3.bulle-ok {display: block;animation: bullehp2-1 7s infinite linear;}
.poisson-2 .bulle.bulle-2-4.bulle-ok {display: block;animation: bullehp2-1 8.5s infinite linear;}
.poisson-2 .bulle.bulle-2-5.bulle-ok {display: block;animation: bullehp1-1 9s infinite linear;}
.poisson-2 .bulle.bulle-2-6.bulle-ok {display: block;animation: bullehp2-1 6.5s infinite linear;}
.poisson-2 .bulle.bulle-2-7.bulle-ok {display: block;animation: bullehp1-1 8s infinite linear;}
.poisson-2 .bulle.bulle-2-8.bulle-ok {display: block;animation: bullehp1-1 8.5s infinite linear;}
.poisson-2 .bulle.bulle-2-9.bulle-ok {display: block;animation: bullehp2-1 7.4s infinite linear;}
.poisson-2 .bulle.bulle-2-10.bulle-ok {display: block;animation: bullehp2-1 8.9s infinite linear;}


@keyframes poissonh3 {
  0% {
        left: 11%;
		opacity: 1;
		transform: translateY(-620%) rotate(-10deg);
		bottom: 0;	
  }
 79% {
        left: 81%;
		opacity: 1;
		transform: translateY(-620%) rotate(-10deg);
		bottom: 90%;	
  }
 80% {
        left: 81%;
		opacity: 0;
		transform: translateY(-620%) rotate(-10deg);
		bottom: 90%;	
  } 
 81% {
        left: -10%;
		opacity: 0;
		transform: translateY(-620%) rotate(-10deg);
		bottom: -10%;	
  } 
 82% {
        left: -10%;
		opacity: 1;
		transform: translateY(-620%) rotate(-10deg);
		bottom: -10%;	
  }   
  100% {
    left: 11%;
	bottom: 0;
	opacity: 1;
	transform: translateY(-620%) rotate(-10deg);	
  }
}

.poisson.poisson-3 {
    position: absolute;
    bottom: 0;
    left: 11%;
    transform: translateY(-620%);
    width: 8.5%;
	animation: poissonh3 45s infinite linear
}	


@keyframes bullehp3-1 {
  0% {
    transform: rotate(0);
	width: 0.5rem;
	left: 97%;
	bottom: 80%;
  }
  
  25% {
	left: 80%;  
  }
  
  50% {
    transform: rotate(180deg);
	width: 1.4rem;
	bottom: 60vh;
	left: 60%;	
  }
  100% {
    transform: rotate(360deg);
	width: 2.1rem;
	bottom: 80vh;
	left: 70%;
  }
}



.poisson.poisson-3 .bulle {
	left: 97%;
	bottom: 80%;
}

.poisson-3 .bulle.bulle-3-1 {animation: bullehp3-1 8s infinite linear;}
.poisson-3 .bulle.bulle-3-2.bulle-ok {display: block;animation: bullehp3-1 8s infinite linear;} 
.poisson-3 .bulle.bulle-3-3.bulle-ok {display: block;animation: bullehp3-1 7s infinite linear;}
.poisson-3 .bulle.bulle-3-4.bulle-ok {display: block;animation: bullehp3-1 8.5s infinite linear;}
.poisson-3 .bulle.bulle-3-5.bulle-ok {display: block;animation: bullehp3-1 9s infinite linear;}
.poisson-3 .bulle.bulle-3-6.bulle-ok {display: block;animation: bullehp3-1 6.5s infinite linear;}
.poisson-3 .bulle.bulle-3-7.bulle-ok {display: block;animation: bullehp3-1 8s infinite linear;}
.poisson-3 .bulle.bulle-3-8.bulle-ok {display: block;animation: bullehp3-1 8.5s infinite linear;}
.poisson-3 .bulle.bulle-3-9.bulle-ok {display: block;animation: bullehp3-1 7.4s infinite linear;}
.poisson-3 .bulle.bulle-3-10.bulle-ok {display: block;animation: bullehp3-1 8.9s infinite linear;}

.menu--main li >* {font-family: 'Architects Daughter', cursive; font-size: 1.7rem; padding: 1rem; display: inline-block; cursor: pointer;}
.path-frontpage .menu--main li >* {color: var(--bleu); position: relative; display: inline-block;}
.path-frontpage .menu--main .menu li {z-index: 2}



/*Header*/
body:not(.path-frontpage) {padding-top: 160px;}
body:not(.path-frontpage) header {position: fixed; width: 100%; height: 160px; left: 0; top: 0; background: url(../images/bg-header.svg) no-repeat bottom center; background-size: cover; z-index: 200;}
body:not(.path-frontpage) #block-cdweb-branding {position: absolute; left: 50%; top: 100%; transform: translate(-50%, -50%);}


/*Nos services*/
.page-node-5 .main-wrapper .container {max-width: 2500px; padding: 0;}
#block-cdweb-page-title {text-align: center;}
h1.page-title {font-family: 'Lexend Exa', sans-serif; font-weight: 400; font-size: 4rem; color: var(--bleu); margin: 1em 0 0.5em; padding-bottom: 0.75em; display: inline-block; position: relative;}
.page-node-5 h1.page-title:before {content:""; width: 110%; height: 5rem; position: absolute; top: 39%; left: -5%; background: url(../images/bg-titre-service.svg) no-repeat top center; background-size: 100%;}

h1.page-title span {position: relative;}
.services-top {font-size: 1.1rem; text-align: center;}
.services-top-2 {display: flex; flex-wrap: wrap; margin: var(--doublemargin) 0;}
.services-top-2-left {width: 48%; padding-right: 3rem; display: flex; flex-wrap: wrap; justify-content: center; flex-direction: column;}
.services-top-2-right {width: 52%;}
.services-middle {display: flex; flex-wrap: wrap; z-index: 2}
.services-middle-left {width: 50%;}
.services-middle-right {width: 50%; display: flex; flex-direction: column; justify-content: center; text-align: center; position: relative; z-index: 5;}
.services-middle-right-content {max-width: 700px;padding-right: 2rem;}
.wrapper-fond-sm {position: relative;}
.wrapper-fond-sm svg {width: 100%;}
.fond-sm-bottom > svg {width: 100%;}
@keyframes vague {
  0% {
	left: 0;
  }

  100% {
	left: -300vw;
  }
}
.fond-sm-top {position: absolute; width: 400vw; left: 0; transform: translateY(-26%); z-index: 5; animation: vague 60s infinite linear;}
.services-middle-left-bateau {position: relative; z-index: 5; transform: translateX(-1%);}
.services-middle-left-oiseau {margin-left: var(--margin);}
.services-middle-left-bateau > svg {width: 64%; transform: translateY(40%); position: relative; margin-top: -27%;}

.bg-sm-bottom {position: absolute; width: 100%; left: 0; bottom: 5%;}
.wrapper-fond-sm {position: relative;}
.services-bottom {position: relative; z-index: 1;}
.bg-poisson-big {position: absolute; right: -7%; top: 20%; z-index: 5; width: 60%;}
.bg-poisson-medium {position: absolute; left: 58%; top: 37%;}
.bg-poisson-small {position: absolute; left: 45%; top: 62%;}
.sous-marin-wrapper {position: absolute; top: 37%; left: 68%; width: 23%; transform: translateX(-50%); z-index: 250;}
.fond-sm-bottom {position: relative;}
.fond-sm-bottom:after {content:""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: rgba(7, 52, 83, 0.4);}
.bg-sm-bottom:after {content:""; width: 100%; height: 22%; position: absolute; left: 0; top: 98%; background: var(--noir);}

.sm-text-bloc-1 {position: absolute; width: 31%; top: 22%; left: 11%; text-align: center; color: white; min-width: 500px;}
.sm-text-bloc-2 {position: absolute; left: 40%; bottom: 13%; width: 51%; color: white; text-align: center; max-width: 780px;}

.sous-marin-wrapper {cursor: pointer;}
.sous-marin-wrapper svg {transform: rotate(0deg);transition: transform 0.25s ease-in-out;}
.sous-marin-wrapper #Tracé_946 {fill: #707070;}
.sous-marin-wrapper.toMove #Tracé_946, .sous-marin-wrapper:hover #Tracé_946 {fill: var(--jaune);}
.sous-marin-wrapper.toMove[name="bottom"] svg {transform: rotate(30deg);}
.sous-marin-wrapper.toMove[name="top"] svg {transform: rotate(-30deg);}

.dauphin-wrapper-1 {position: absolute; top: 41%; left: 60%;transition: all 3s ease-in-out; width: 18.5%;}
.dauphin-wrapper-2 {position: absolute; top: 47%; left: 67%;transition: all 2.5s ease-in-out; width: 8.5%;}
.dauphin-wrapper-3 {position: absolute; top: 48%; left: 65%;transition: all 4s ease-in-out; width: 8.5%;}

.dauphin-go .dauphin-wrapper-1 {top: 30%; left: 100%;}
.dauphin-go .dauphin-wrapper-2 {top: 58%; left: 100%;}
.dauphin-go .dauphin-wrapper-3 {top: 70%; left: -110%;}


.services-top-2-left h2 {display: inline-block; position: relative; margin-bottom: 1.5em;}

.services-middle-right-content {position: relative;}
.services-middle-right-content h2 {display: inline-block; position: relative; margin-bottom: 2em;}

.services-middle-right-content:before {content:""; width: 60%; bottom: -1rem; height: 10rem; position: absolute; left: 20%; background: url(../images/bg-graphisme.svg) no-repeat bottom left; background-size: 100%;}
h3 {font-size: 1rem; margin-bottom: 0;}
.services-middle-right-content p {margin-bottom: 1.5rem;}
.sm-text-bloc-1:before {content:""; width: 106%; position: absolute; bottom: -32%; left: -3%; height: 126%; background: url(../images/bg-dev.svg) no-repeat center; background-size: 100%; opacity: 0.5;}

.sm-text-bloc-1 h2 {display: inline-block; position: relative; margin-bottom: 3em;}
.sm-text-bloc-2 h2 {display: inline-block; position: relative; margin-bottom: 2em;}
.str-blue {color: var(--bleu);}

.view-liste-nos-tresors .views-row img {margin: 0 auto;}



@media screen and (min-width: 800px) {
	.sm-text-bloc-1 h2:before {width: 6rem; padding-top: 0.95rem; text-align:right; font-family: 'Lato', sans-serif; font-size: 1rem; font-weight: 400; content: "Vitrine"; height: 2.5rem; background: url(../images/fleche4.svg) no-repeat top left; position: absolute; right: 89%; top: 100%; transform: rotate(12deg);}
	.sm-text-bloc-1 h2:after {width: 8rem; padding-top: 0.95rem; text-align:center; font-family: 'Lato', sans-serif; font-size: 1rem; z-index: 10; font-weight: 400; content: "E-boutique"; height: 4.5rem; background: url(../images/fleche5.svg) no-repeat center bottom; position: absolute; left: 100%; bottom: 16%; transform: rotate(16deg);}
	.services-top-2-left h2:after {width: 9rem; color: var(--bleuclair); font-family: 'Lato', sans-serif; font-size: 1rem; font-weight: 400; content: "Comptez sur nous"; height: 4.5rem; background: url(../images/fleche1.svg) no-repeat bottom left; position: absolute; left: 103%; bottom: 54%; transform: rotate(8deg);}
	.sm-text-bloc-2 h2:before {width: 9.25rem; text-align:left; font-family: 'Lato', sans-serif; font-size: 1rem; font-weight: 400; content: "Une deadline ?"; height: 4.25rem; background: url(../images/fleche6.svg) no-repeat bottom right; position: absolute; right: 89%; bottom: 77%; transform: rotate(-10deg);}
	.sm-text-bloc-2 h2:after {width: 7.25rem; text-align:right; font-family: 'Lato', sans-serif; font-size: 1rem; font-weight: 400; content: "On est là ?"; height: 5.25rem; background: url(../images/fleche7.svg) no-repeat bottom left; position: absolute; left: 95%; bottom: 7%; transform: rotate(10deg);}
	.services-middle-right-content > h2:first-child:before {width: 10rem; color: var(--bleuclair); text-align:left; font-family: 'Lato', sans-serif; font-size: 1rem; font-weight: 400; content: "Print & Web"; height: 2.5rem; background: url(../images/fleche2.svg) no-repeat bottom right; position: absolute; right: 81%; top: 100%; transform: rotate(-6deg);}
	.services-middle-right-content > h2:first-child:after {width: 11.5rem; color: var(--bleuclair); font-family: 'Lato', sans-serif; font-size: 1rem; font-weight: 400; content: "Identité visuelle"; height: 5rem; background: url(../images/fleche3.svg) no-repeat bottom left; position: absolute; left: 100%; bottom: 28%; transform: rotate(8deg);}
	html[lang="es"] .sm-text-bloc-2 h2:before {content: "¿Una fecha límite?";}
	html[lang="es"] .sm-text-bloc-2 h2:after {content: "Aquí estamos";}
	html[lang="es"] .sm-text-bloc-1 h2:before { content: "Vitrina"; }
	html[lang="es"] .sm-text-bloc-1 h2:after  { content: "Tienda online"; }

	html[lang="es"] .services-middle-right-content > h2:first-child:before { content: "Impresión & Web"; }
	html[lang="es"] .services-middle-right-content > h2:first-child:after  { content: "Identidad visual"; }

	html[lang="es"] .services-top-2-left h2:after { content: "Cuenta con nosotros"; }

}


@media screen and (min-width: 1001px) {
	
		
	
	
	@keyframes bulle-sm-1 {
	  0% {
		transform: rotate(0);
		width: 0.5rem;
		left: 0;
		bottom: 0;
	  }
	  25% {
		left: 5vw;  
	  }
	  50% {
		transform: rotate(180deg);
		width: 1.4rem;
		bottom: 120vh;
		left: 8vw;	
	  }
	  100% {
		transform: rotate(360deg);
		width: 2.1rem;
		bottom: 300vh;
		left: 4vw;
	  }
	}
	@keyframes bulle-sm-2 {
	  0% {
		transform: rotate(0);
		width: 0.5rem;
		left: 0;
		bottom: 0;
	  }
	  25% {
		left: -6vw;  
	  }
	  50% {
		transform: rotate(180deg);
		width: 0.9rem;
		bottom: 120vh;
		left: -8vh;	
	  }
	  75% {
		left: -10vw;  
	  }  
	  100% {
		transform: rotate(360deg);
		width: 1.6rem;
		bottom: 300vh;
		left: -4vw;
	  }
	}
	@keyframes bulle-sm-3 {
	  0% {
		transform: rotate(0);
		width: 0.5rem;
		left: 0;
		bottom: 0;
	  }
	  25% {
		left: 10vw;  
	  }
	  50% {
		transform: rotate(180deg);
		width: 1.4rem;
		bottom: 120vh;
		left: 16vw;	
	  }
	  25% {
		left: 12vw;  
	  }  
	  100% {
		transform: rotate(360deg);
		width: 2.1rem;
		bottom: 300vh;
		left: 8vw;
	  }
	}
	@keyframes bulle-sm-4 {
	  0% {
		transform: rotate(0);
		width: 0.5rem;
		left: 0;
		bottom: 0;
	  }
	  25% {
		left: -12vw;  
	  }
	  50% {
		transform: rotate(180deg);
		width: 0.9rem;
		bottom: 120vh;
		left: -16vw;	
	  }
	  75% {
		left: -20vw;  
	  }  
	  100% {
		transform: rotate(360deg);
		width: 1.6rem;
		bottom: 300vh;
		left: -8vw;
	  }
	}


	.bulles {position: absolute; width: 0.5rem; display: none; left: 0; bottom: 0;}
	.sous-marin-bulles {width: 2rem; height: 2rem; right: 24%; top: 0; position: absolute; z-index: 220;}
	.sous-marin-bulles .bulles:first-child {display: block; animation: bulle-sm-1 22s infinite linear;}
	.sous-marin-bulles .sous-marin-bulles-2.bulle-ok {display: block; animation: bulle-sm-3 19s infinite linear;}
	.sous-marin-bulles .sous-marin-bulles-3.bulle-ok {display: block; animation: bulle-sm-1 17s infinite linear;}
	.sous-marin-bulles .sous-marin-bulles-4.bulle-ok {display: block; animation: bulle-sm-2 21s infinite linear;}
	.sous-marin-bulles .sous-marin-bulles-5.bulle-ok {display: block; animation: bulle-sm-4 22s infinite linear;}
	.sous-marin-bulles .sous-marin-bulles-6.bulle-ok {display: block; animation: bulle-sm-2 18s infinite linear;}
	.sous-marin-bulles .sous-marin-bulles-7.bulle-ok {display: block; animation: bulle-sm-1 19s infinite linear;}
	.sous-marin-bulles .sous-marin-bulles-8.bulle-ok {display: block; animation: bulle-sm-3 17s infinite linear;}
	.sous-marin-bulles .sous-marin-bulles-9.bulle-ok {display: block; animation: bulle-sm-1 20s infinite linear;}
	.sous-marin-bulles .sous-marin-bulles-10.bulle-ok {display: block; animation: bulle-sm-2 23s infinite linear;}
	.sous-marin-bulles .sous-marin-bulles-11.bulle-ok {display: block; animation: bulle-sm-4 22s infinite linear;}
	.sous-marin-bulles .sous-marin-bulles-12.bulle-ok {display: block; animation: bulle-sm-2 16s infinite linear;}
	.sous-marin-bulles .sous-marin-bulles-13.bulle-ok {display: block; animation: bulle-sm-1 15s infinite linear;}
	.sous-marin-bulles .sous-marin-bulles-14.bulle-ok {display: block; animation: bulle-sm-3 19s infinite linear;}
	.sous-marin-bulles .sous-marin-bulles-15.bulle-ok {display: block; animation: bulle-sm-1 24s infinite linear;}
	.sous-marin-bulles .sous-marin-bulles-16.bulle-ok {display: block; animation: bulle-sm-2 21s infinite linear;}
	.sous-marin-bulles .sous-marin-bulles-17.bulle-ok {display: block; animation: bulle-sm-4 19s infinite linear;}
	.sous-marin-bulles .sous-marin-bulles-18.bulle-ok {display: block; animation: bulle-sm-2 20s infinite linear;}
	.sous-marin-bulles .sous-marin-bulles-19.bulle-ok {display: block; animation: bulle-sm-1 22s infinite linear;}
	.sous-marin-bulles .sous-marin-bulles-20.bulle-ok {display: block; animation: bulle-sm-3 18s infinite linear;}


	@keyframes bulle-smb-1 {
	  0% {
		transform: rotate(0);
		width: 0.5rem;
		left: 30.3%;
		bottom: 20%;
	  }
	  25% {
		left: 25%;  
	  }
	  50% {
		transform: rotate(180deg);
		width: 0.9rem;
		left: 15%;	
	  } 
	  100% {
		transform: rotate(360deg);
		width: 1.6rem;
		bottom: 80%;
		left: 3%;
	  }
	}

	@keyframes bulle-smb-2 {
	  0% {
		transform: rotate(0);
		width: 0.5rem;
		left: 30.3%;
		bottom: 20%;
	  }
	  25% {
		left: 28%;  
	  }
	  50% {
		transform: rotate(180deg);
		width: 0.9rem;
		left: 31%;	
	  } 
	  100% {
		transform: rotate(360deg);
		width: 1.6rem;
		bottom: 80%;
		left: 20%;
	  }
	}

	@keyframes bulle-smb-3 {
	  0% {
		transform: rotate(0);
		width: 0.5rem;
		left: 30.3%;
		bottom: 20%;
	  }
	  25% {
		left: 33%;  
	  }
	  50% {
		transform: rotate(180deg);
		width: 0.9rem;
		left: 35%;	
	  } 
	  100% {
		transform: rotate(360deg);
		width: 1.6rem;
		bottom: 80%;
		left: 38%;
	  }
	}

	@keyframes bulle-smb-4 {
	  0% {
		transform: rotate(0);
		width: 0.5rem;
		left: 30.3%;
		bottom: 20%;
	  }
	  50% {
		transform: rotate(180deg);
		width: 1.2rem;
		left: 55%;	
	  } 
	  100% {
		transform: rotate(360deg);
		width: 2rem;
		bottom: 80%;
		left: 70%;
	  }
	}

	.sm-bulles-bg-1 .bulles {width: 0.5rem; height: 0.5rem; left: 30.3%; bottom: 20%;position: absolute;}
	.sm-bulles-bg-1 .sm-bulles-bg-1-1 {display: block; animation: bulle-smb-1 15s infinite linear;}
	.sm-bulles-bg-1 .sm-bulles-bg-1-2.bulle-ok {display: block; animation: bulle-smb-2 13s infinite linear;}
	.sm-bulles-bg-1 .sm-bulles-bg-1-3.bulle-ok {display: block; animation: bulle-smb-3 16s infinite linear;}
	.sm-bulles-bg-1 .sm-bulles-bg-1-4.bulle-ok {display: block; animation: bulle-smb-4 17s infinite linear;}
	.sm-bulles-bg-1 .sm-bulles-bg-1-5.bulle-ok {display: block; animation: bulle-smb-3 15s infinite linear;}
	.sm-bulles-bg-1 .sm-bulles-bg-1-6.bulle-ok {display: block; animation: bulle-smb-2 14s infinite linear;}
	.sm-bulles-bg-1 .sm-bulles-bg-1-7.bulle-ok {display: block; animation: bulle-smb-1 18s infinite linear;}
	.sm-bulles-bg-1 .sm-bulles-bg-1-8.bulle-ok {display: block; animation: bulle-smb-2 13s infinite linear;}
	.sm-bulles-bg-1 .sm-bulles-bg-1-9.bulle-ok {display: block; animation: bulle-smb-3 15s infinite linear;}
	.sm-bulles-bg-1 .sm-bulles-bg-1-10.bulle-ok {display: block; animation: bulle-smb-4 15s infinite linear;}


	@keyframes bulle-smb2-1 {
	  0% {
		transform: rotate(0);
		width: 0.5rem;
		left: 33.4%;
		bottom: 21.8%;
	  }
	  25% {
		left: 29%;  
	  }
	  50% {
		transform: rotate(180deg);
		width: 0.9rem;
		left: 19%;	
	  } 
	  100% {
		transform: rotate(360deg);
		width: 1.6rem;
		bottom: 100%;
		left: 7%;
	  }
	}

	@keyframes bulle-smb2-2 {
	  0% {
		transform: rotate(0);
		width: 0.5rem;
		left: 33.4%;
		bottom: 21.8%;
	  }
	  25% {
		left: 30%;  
	  }
	  50% {
		transform: rotate(180deg);
		width: 0.9rem;
		left: 35%;	
	  } 
	  100% {
		transform: rotate(360deg);
		width: 1.6rem;
		bottom: 100%;
		left: 24%;
	  }
	}

	@keyframes bulle-smb2-3 {
	  0% {
		transform: rotate(0);
		width: 0.5rem;
		left: 33.4%;
		bottom: 21.8%;
	  }
	  25% {
		left: 37%;  
	  }
	  50% {
		transform: rotate(180deg);
		width: 0.9rem;
		left: 40%;	
	  } 
	  100% {
		transform: rotate(360deg);
		width: 1.6rem;
		bottom: 100%;
		left: 44%;
	  }
	}

	@keyframes bulle-smb2-4 {
	  0% {
		transform: rotate(0);
		width: 0.5rem;
		left: 33.4%;
		bottom: 21.8%;
	  }
	  50% {
		transform: rotate(180deg);
		width: 1.2rem;
		left: 59%;	
	  } 
	  100% {
		transform: rotate(360deg);
		width: 1.6rem;
		bottom: 100%;
		left: 75%;
	  }
	}

	.sm-bulles-bg-2 .bulles {width: 0.5rem; height: 0.5rem; left: 33.4%; bottom: 21.8%;position: absolute;}
	.sm-bulles-bg-2 .sm-bulles-bg-2-1 {display: block; animation: bulle-smb2-1 16s infinite linear;}
	.sm-bulles-bg-2 .sm-bulles-bg-2-2.bulle-ok {display: block; animation: bulle-smb2-2 14s infinite linear;}
	.sm-bulles-bg-2 .sm-bulles-bg-2-3.bulle-ok {display: block; animation: bulle-smb2-3 13s infinite linear;}
	.sm-bulles-bg-2 .sm-bulles-bg-2-4.bulle-ok {display: block; animation: bulle-smb2-4 16s infinite linear;}
	.sm-bulles-bg-2 .sm-bulles-bg-2-5.bulle-ok {display: block; animation: bulle-smb2-3 15s infinite linear;}
	.sm-bulles-bg-2 .sm-bulles-bg-2-6.bulle-ok {display: block; animation: bulle-smb2-2 18s infinite linear;}
	.sm-bulles-bg-2 .sm-bulles-bg-2-7.bulle-ok {display: block; animation: bulle-smb2-1 14s infinite linear;}
	.sm-bulles-bg-2 .sm-bulles-bg-2-8.bulle-ok {display: block; animation: bulle-smb2-2 13s infinite linear;}
	.sm-bulles-bg-2 .sm-bulles-bg-2-9.bulle-ok {display: block; animation: bulle-smb2-3 17s infinite linear;}
	.sm-bulles-bg-2 .sm-bulles-bg-2-10.bulle-ok {display: block; animation: bulle-smb2-4 15s infinite linear;}


	@keyframes bulle-smb3-1 {
	  0% {
		transform: rotate(0);
		width: 0.5rem;
		left: 35.4%;
		bottom: 23%;
	  }
	  100% {
		transform: rotate(360deg);
		width: 1.6rem;
		bottom: 85%;
		left: 37%;
	  }
	}

	@keyframes bulle-smb3-2 {
	  0% {
		transform: rotate(0);
		width: 0.5rem;
		left: 35.4%;
		bottom: 23%;
	  }
	  50% {
		transform: rotate(180deg);
		width: 0.9rem;
		left: 42%;	
	  } 
	  100% {
		transform: rotate(360deg);
		width: 1.6rem;
		bottom: 85%;
		left: 46%;
	  }
	}

	@keyframes bulle-smb3-3 {
	  0% {
		transform: rotate(0);
		width: 0.5rem;
		left: 35.4%;
		bottom: 23%;
	  }
	  100% {
		transform: rotate(360deg);
		width: 1.6rem;
		bottom: 85%;
		left: 60%;
	  }
	}


	.sm-bulles-bg-3 .bulles {width: 0.5rem; height: 0.5rem; left: 35.4%; bottom: 23%;position: absolute;}
	.sm-bulles-bg-3 .sm-bulles-bg-3-1 {display: block; animation: bulle-smb3-1 14s infinite linear;}
	.sm-bulles-bg-3 .sm-bulles-bg-3-2.bulle-ok {display: block; animation: bulle-smb3-2 16s infinite linear;}
	.sm-bulles-bg-3 .sm-bulles-bg-3-3.bulle-ok {display: block; animation: bulle-smb3-3 13s infinite linear;}
	.sm-bulles-bg-3 .sm-bulles-bg-3-4.bulle-ok {display: block; animation: bulle-smb3-1 15s infinite linear;}
	.sm-bulles-bg-3 .sm-bulles-bg-3-4.bulle-ok {display: block; animation: bulle-smb3-2 18s infinite linear;}
	.sm-bulles-bg-3 .sm-bulles-bg-3-6.bulle-ok {display: block; animation: bulle-smb3-3 17s infinite linear;}
	.sm-bulles-bg-3 .sm-bulles-bg-3-7.bulle-ok {display: block; animation: bulle-smb3-1 13s infinite linear;}
	.sm-bulles-bg-3 .sm-bulles-bg-3-8.bulle-ok {display: block; animation: bulle-smb3-2 14s infinite linear;}
	.sm-bulles-bg-3 .sm-bulles-bg-3-9.bulle-ok {display: block; animation: bulle-smb3-3 15s infinite linear;}
	.sm-bulles-bg-3 .sm-bulles-bg-3-10.bulle-ok {display: block; animation: bulle-smb3-1 16s infinite linear;}

}

/*Nos trésors*/
.page-node-2 .main-wrapper > .container, .page-node-type-reference .main-wrapper > .container, .path-nos-realisations .main-wrapper > .container {max-width: 2500px; padding: 0;}
.real-wrapper {max-width: 1450px; margin: 0 auto; padding: 0 15px; display: flex; flex-wrap: wrap;}
.left-col {width: 43%; display: flex; flex-wrap: wrap; justify-content: center; flex-direction: column; color: var(--bleuclair); text-align: center; padding: 0 3rem;}
.right-col {width: 57%;}
.left-col .views-field-title {text-transform: uppercase; font-family: 'Lato'; font-size: 1.8rem; color: var(--bleu); margin-bottom: 2em; font-weight: 700;}
.left-col .button {margin-top: 2rem;}

#block-views-block-liste-des-realisations-block-1 {margin-top: var(--doublemargin);}
.page-node-2 main, .page-node-type-reference main, .path-nos-realisations main {display: inline-block; width: 100%; padding-top: 4rem; padding-bottom: 16rem; background: url(../images/bg-tresors.svg) no-repeat bottom center; background-size: 102%;}
.page-node-2 main {padding-top: 0;}
.page-node-type-reference .page-title, .path-nos-realisations .page-title {display: none;}

@keyframes raie {
  0% {
    transform: rotate(-45deg);
	left: 110vw;
	top: 0;
	opacity :1;
  }
  25% {
	left: 50vw;
	top: 30vh;
	opacity :1;
  }    
  50% {
    left: -10vh;	
	transform: rotate(10deg);
	opacity: 1;
	top: -5vh
  }  
  100% {
    left: -10vh;	
	transform: rotate(10deg);
	opacity: 1;
	top: -5vh
  }   
}


.animal {
    position: fixed;
    left: 101vw;

}

.animal.raie {
    position: fixed;
    left: 101vw;
	top: 0;
	animation: raie 32s infinite linear;
}

@keyframes raie2 {
  0% {
    transform: rotate(60deg);
    left: -10vw;
	top: -15vh;
	opacity :1;
  }
  50% {
    transform: rotate(60deg);
    left: -10vw;
	top: -15vh;
	opacity :1;
  } 
  75% {
	left: 35vw;
	top: 50vh;
	opacity :1;
  }   
  100% {
    left: 90vw;	
	transform: rotate(-20deg);
	opacity: 1;
	top: -10vh;
  }  
}

.animal.raie2 {
    position: fixed;
    left: -10vw;
	top: 0;
	animation: raie2 30s infinite linear;
}



/*L'équipage*/
.page-node-4 .main-wrapper > .container {max-width: 2500px; padding: 0;}
.page-node-4 h1.page-title:before {content:""; width: 110%; height: 6rem; position: absolute; top: 39%; left: -5%; background: url(../images/bg-titre-equipage.svg) no-repeat top center; background-size: 100%;}
.page-node-4 .services-top {max-width: 700px; margin: 0 auto var(--margin);}
.equipage-1-content {display: flex; flex-wrap: wrap; padding-bottom: var(--margin); position: relative;}
.equipage-1-left {width: 50%; padding-right: 5rem; text-align: right; position: relative;}
.equipage-1-right {width: 50%; padding-left: 5rem; display: flex; justify-content: center; flex-direction: column; color: var(--bleuclair);max-width: 622px;}
.equipage-1-left:after {content: ""; width: 68px; height: 68px;position: absolute; top: 50%; left: 100%; transform: translate(-50%, -50%); background: var(--bleuclair); border: 11px solid var(--bleu); border-radius: 50%;}
.equipage-1-left-img {display: inline-block; position: relative;}
.equipage-1-left:before {content: ""; width: 120px; height: 11px;position: absolute; top: 50%; left: 100%; transform: translate(-100%, -50%); background: var(--bleu);}
.rond {display: inline-block; background: var(--bleuclair); border: 11px solid var(--bleu); border-radius: 50%; width: 90px; height: 90px; position: relative; z-index: 2;}
.equipage-2 {text-align: center;}
.equipage-2-content {display: flex; flex-wrap: wrap; position: relative; margin-bottom: var(--doublemargin);}
.equipage-2-left {width: 50%; padding: 4rem 5rem 0 0; text-align: right; color: var(--bleu);}
.equipage-2-right {width: 50%;text-align: center; position: relative;}
.equipage-2-right-content {width: 100%; padding: 0 5rem; position: relative;}
.equipage-2-right img {display: inline-block; margin: 4rem 0 8rem; position: relative; z-index: 2;}
.equipage-1-content:before {content:""; width: 11px; height: 0%; position: absolute; left: 50%; top: 50%; transform: translateX(-50%); background: var(--bleu); transition: all 1s ease-in-out;}
.equipage-2-right:before {content:""; width: 0; height: 11px; position: absolute; left: 0; top: -51px; transform: translateX(-1%); background: var(--bleu); transition: all 1s ease-in-out 1s;}
.equipage-2-right:after {content:""; width: 11px; height: 0; position: absolute; left: 50%; top: -51px; transform: translateX(-50%); background: var(--bleu); transition: all 1s ease-in-out 2s;}
.equipage-2-right-content:after {content:""; width: 0; height: 11px; bottom: 41px; right: 50%; position: absolute; background: var(--bleu); transition: all 1s ease-in-out 3s;}
.trait-go .equipage-1-content:before {height: 51%;}
.trait-go .equipage-2-right:before {width: 51%;}
.trait-go .equipage-2-right:after {height: 100%;}
.trait-go .equipage-2-right-content:after {width: 50%;}
.rond.rond-3 {width: 150px; height: 150px; color: white; position: absolute; bottom: 0; left: 50%; transform: translate(-50%, 31px);}
.rond.rond-3 span {display: block; font-size: 3rem; line-height: 2.2rem;}
.equipage-2 {background: url(../images/poisson-equipage.svg) no-repeat bottom left; background-size: 50%; padding-bottom: var(--doublemargin);}
.titre-2 {font-family: 'Lexend Exa', sans-serif; font-size: 2.5rem; color: var(--bleu); line-height: 1; margin-bottom: 1rem; position: relative;}
.titre-2:after {content:""; width: 285px; height: 4px; background: var(--jaune); position: absolute; left: 0; top: 100%;}
.equipage-3 h3 {color: var(--jaune); font-family: 'Lexend Exa', sans-serif; font-weight: 400; font-size: 1.5rem; margin-bottom: 2rem;}
.equipage-3 ul {margin: 0 0 2rem; padding: 0; list-style: none;}
.equipage-3 ul li, .item-p-list {margin-bottom: 2rem; display: flex; flex-wrap: wrap;}
i.icon-check {height: 33px; width: 33px;}
.equipage-3 ul li span {padding-left: 0.5rem; display: flex; flex-direction: column; justify-content: center; width: calc(100% - 33px);}
.item-p-list > span {padding: 0.25rem 0 0 0.5rem; width: calc(100% - 33px);}
.span-jaune {color: var(--jaune);}
.span-jaune-big {color: var(--jaune); font-size: 1.5rem; margin-right: 0.2rem;}
.button-dev-wrapper {text-align: center; margin: var(--doublemargin) 2rem; position: relative; z-index: 199;}
.button-dev-content {display: inline-block; position: relative;}
.button.button-devis {font-family: 'Lexend Exa', sans-serif; font-size: 1.2rem; font-weight: 400; padding: 1.25em 2.5em;}
button.button.button-devis { border: 0; cursor: pointer; }
.button.button-devis:after {content:""; width: 100px; height: 100px; position: absolute; right: -3rem; top: -2rem; background: url(../images/etoile.svg) no-repeat center; background-size: 100%;}
.button-dev-content:before {content: ""; width: 116%; height: 3rem; position: absolute; bottom: -1rem; left: -8%; background: url(../images/bg-devis.svg) no-repeat bottom left; background-size: 100%;}

/*Nos trésors*/
.view-liste-nos-tresors .view-content {max-width: 1450px; margin: 0 auto; padding: 0 15px; display: flex; flex-wrap: wrap;}
.view-liste-nos-tresors .views-row {padding: 0 2rem; justify-content: space-between; flex-direction: column; display: flex; text-align: center;}
.views-field-field-logo {height: 157px; display: flex;justify-content: center; flex-direction: column;}
.tresor-bottom {margin-top: 1rem; font-size: 0.875rem;}
.lk-more {margin-top: 1rem;}
.page-node-2 h1.page-title:before {content:""; width: 110%; height: 5rem; position: absolute; top: 39%; left: -5%; background: url(../images/bg-titre-tresor.svg) no-repeat top center; background-size: 100%;}
#block-views-block-liste-nos-tresors-block-1 {margin-top: 8rem;}
.page-node-2 .slick-arrow {top: 45%;}
.page-node-2 .region-content {background: url(../images/bg-fish-2.svg) no-repeat top right; background-size: 60%;}

/*Contact*/
.page-node-3 main {display: inline-block; width: 100%; min-height: calc(100vh - 160px);background: #EAF7FF url(../images/bg-contact.svg) no-repeat bottom center; background-size: 100%;}
.contact-center {text-align: center; }
.contact-content a {display: flex; font-size: 1.5rem; color: var(--bleu); background: white; height: 100px; padding:2rem; border-radius: 60px; margin: 0 2rem 2rem}
.contact-content a:hover {background: var(--jaune);}
.contact-content a i {margin-right: 1rem;}
.contact-content {text-align: center; margin: 4rem auto 0; display: flex; flex-wrap: wrap; justify-content: center; max-width: 850px;}
a.button-yellow {color: white; font-family: 'Gluten', cursive; font-weight: 700; background: var(--jaune);}
a.button-yellow span {position: relative;}
a.button-yellow span:after {content: ""; width: 100%; bottom: -5px; height: 4px; background: white; position: absolute; left: 0}
.contact-content .lk-cont-wrapper:nth-child(2) i {position: relative; top: -15px;}

/*Footer*/
footer {background: var(--noir); color: white; font-family: 'Gluten', cursive; position: relative; display: inline-block; width: 100%; }
footer > .container {position: relative; padding-top: 2rem;}
footer:after {content: ""; width: 100%; height: 180px; position: absolute; left: 0; bottom: calc(100% - 2px); background: url(../images/bg-footer.svg) no-repeat bottom left; background-size: 100%;}
.page-node-5 footer:after {display: none;}
.logo-footer-wrapper {position: absolute; bottom: 88%; left: 0; z-index: 2;}
.footer-wrapper {display: flex; justify-content: space-between; flex-wrap: wrap;}
.footer-wrapper > div {width: 50%;}
.footer-col-left {display: flex; flex-wrap: wrap;}
.footer-col-left > div {padding-right: 3rem; width: 50%;}
.footer-title {font-size: 1.25rem; font-weight: 700;}
footer ul {margin: 0; padding: 0; list-style: none;}
footer ul a {font-weight: 700; padding-bottom: 0.5rem; margin-bottom: 0.5rem; border-bottom: 1px dashed var(--jaune); display: inline-block; color: var(--jaune);}
footer ul li:last-child a {border: 0}
footer ul a:hover {color: white;}
.page-node-4 footer:before {content: ""; width: 100%; height: 350px; position: absolute; left: 0; bottom: calc(100% - 2px); background: url(../images/bg-footer-2.svg) no-repeat bottom left; background-size: 100%;}
.page-node-4 footer {margin-top: 17rem;}
#block-footerbottom {width: 100%; text-align: center; font-family: 'Architects Daughter', cursive; font-size: 0.875rem; color: var(--bleuclair);}
#block-footerbottom a {color: var(--bleuclair);}

#block-accrocheaccueil h2 {font-family: 'Lexend Exa', sans-serif; position: fixed; left: 0; top: 0; width: 100%; text-align: center; color: var(--bleuclair);}

/*Devis*/
#block-blocdevis {display: none;}
.pop_wrapper {background: rgba(0, 0, 0, 0.8); position: fixed; width: 100vw; height: 100vh; left: 0; top: 0; overflow-y: auto; display: flex; flex-wrap: wrap; justify-content: center; flex-direction: column; z-index: 220;}
.pop_content {max-width: 1340px; margin: 0 auto; display: flex; background: white; color: var(--texte); font-family: 'Lato', sans-serif; position: relative;}
.pop_content > div {width: 50%;}
.pop_content .field--name-field-image svg {display: block;}
.right_pop {padding: 2rem 2rem 1.5rem; display: flex; flex-wrap: wrap; justify-content: center; flex-direction: column;}
.right_pop .field--name-body {text-align: center;}
.right_pop .field--name-body strong {color: var(--bleuclair);}
.right_pop label {display: none;}
.right_pop input:not([type="submit"]), .right_pop textarea, .right_pop select {width: 100%; border: 1px solid var(--bleuclair); border-radius: 5px; padding: 0.25rem 0.5rem; color: var(--bleuclair);}
.right_pop input::placeholder, .right_pop textarea::placeholder {color: var(--bleuclair);}
.right_pop h2 {position: relative; display: inline-block; font-family: 'Lato', sans-serif; font-size: 3rem; margin-bottom: 2em; margin-bottom: 1em;
    margin-top: 0em;}
.right_pop h2 span {position: relative;}
.right_pop h2:before {content: ""; width: 110%; height: 5rem; position: absolute; top: 65%; left: -5%; background: url(../images/bg-titre-tresor.svg) no-repeat top center; background-size: 100%;}
.pop_content > .field--name-field-bouton-fermer {position: absolute; right: 1rem; width: auto; top: 1rem;}
.field--name-field-bouton-fermer svg {fill: var(--bleu); transition: all 0.25s ease-in-out;}
.field--name-field-bouton-fermer svg:hover {fill: var(--bleuclair);}
.right_pop .button {background: var(--jaune); padding: 0.75em 1.75em;}
.right_pop .form-actions {text-align: center; margin-top: 2rem;}
a.close-pop {display: block;}
.pop-up-open footer {z-index: 210;}
.page-node-5 .left_pop {background: url(../images/phare.svg) no-repeat center; background-size: 100%;}
.main-wrapper {min-height: 60vh;}

.view-liste-des-realisations {margin-bottom: 6rem;}

@media screen and (min-width: 1001px) {
:root {
	--margin: 4rem;
	--doublemargin: 6rem;
}	
.path-frontpage .menu--main .menu li:nth-child(3) {position: absolute; left: 50%; top: 42%; transform: translate(-206%,53%);}
.path-frontpage .menu--main .menu li:nth-child(4) {position: absolute; left: 52%; top: 43%; transform: translate(-285%,-360%);}
.path-frontpage .menu--main .menu li:first-child {position: absolute; left: 50%; top: 42%; transform: translate(-65%,-529%);}
.path-frontpage .menu--main .menu li:nth-child(2) {position: absolute; left: 50%; top: 42%; transform: translate(124%,-333%);}
.path-frontpage .menu--main .menu li:nth-child(5) {position: absolute; left: 50%; top: 42%; transform: translate(235%,43%);}


.path-frontpage .menu--main  li >*:after {content:""; width: 120%; height: 5rem; position: absolute; left: -10%; top: 0;}

a.menu-link {display: none;}
body:not(.path-frontpage) ul.menu {margin: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 0.75rem;}
body:not(.path-frontpage) ul.menu li > * {color: white; position: relative; cursor: pointer;}
body:not(.path-frontpage) ul.menu li > *:before {content:""; width: 115%; height: 5rem; position: absolute; left: -7.5%; top: 0; background: url(../images/bg-hover-lk.svg) no-repeat top center; background-size: 100%; opacity: 0; transition: all 0.25s ease-in-out;}
body:not(.path-frontpage) ul.menu li > *:hover:before, body:not(.path-frontpage) ul.menu .menu-item--active-trail a:before {opacity: 1;}
body:not(.path-frontpage) .menu--main li >* {transform: rotate(-9deg); margin: 1rem;}
}
.captcha__title {display: none;}

.button-list a {
	display: inline-block;
    line-height: 1;
    border-radius: 50px;
    color: white;
    padding: 1em 1.5em;
    border: 0;
    -webkit-transition: all 0.25s 
ease-in-out;
    -moz-transition: all 0.25s ease-in-out;
    font-weight: 700;
    text-transform: uppercase;
    background: #285d91;
    background: -moz-linear-gradient(top, #285d91 0%, #021023 100%);
    background: -webkit-linear-gradient(top, #285d91 0%, #021023 100%);
    background: linear-gradient(to bottom, #285d91 0%, #021023 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#285d91', endColorstr='#021023',GradientType=0 );
}
.button-list a:hover {
	color: white;
	background: #021023;
    background: -moz-linear-gradient(top, #021023 0%, #021023 100%);
    background: -webkit-linear-gradient(top, #021023 0%, #021023 100%);
    background: linear-gradient(to bottom, #021023 0%, #021023 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#021023', endColorstr='#021023',GradientType=0 );	
}

ul.button-list {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
    list-style: none;
    gap: 1rem;
}
.region-breadcrumb {
	display: none;
}
form fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

section.contact-link {
    padding-top: 3rem;
    text-align: center;
}

button.poulpyx-chat__launcher {
    background: none;
    border: 0;
}

@media screen and (max-width: 1650px) {
	footer > .container {margin: 0 200px;}
}

@media screen and (max-width: 1650px) {
	.services-middle-left-bateau > svg {
		margin-top: -16%;
	}
}

@media screen and (max-width: 1410px) {
	#block-accrocheaccueil h2 {font-size: 2.3vw; line-height: 1;}
	.slick-arrow.slick-prev {left: 0; transform: none;}
	.slick-arrow.slick-next {right: 0; transform: none;}
}
@media screen and (max-width: 1310px) {
	.services-middle-left-bateau > svg {margin-top: -16%;}
	.services-middle-left-oiseau {width: 49%;}
	.services-middle-right-content h2:after {left: 85%; bottom: 59%;}
	.services-middle-left-bateau > svg {width: 32%;}	
	.services-middle-left {width: 100%; order: 2;}
	.services-middle-right {width: 100%; order: 1; padding: 0 15px;}
	.sm-text-bloc-1, .sm-text-bloc-2 {position: relative; width: 100%; top: 0; left: 0; color: inherit; max-width: 100%; margin-top: 2rem; min-width: 0; text-align: left;}	
	.services-middle-right-content {max-width: 100%; padding-right: 0;}	
	.sm-text-bloc-1:before {display: none;}
	.bg-sm-bottom:after {top: 96%;}
	footer {margin-top: -1rem; position: relative; z-index: 2;}
	.logo-footer-wrapper {position: relative; bottom: 0;}
	footer > .container {margin-top: 0;}
	.services-middle-right-content:before {max-width: 442px; transform: translateX(-50%); left: 50%;}
}

@media screen and (max-width: 1000px) {
	footer > .container {margin: 0 auto;}
	.center-home-logo {width: 200px;}
	.path-frontpage .menu--main a {padding: 0.75rem;}

	@keyframes bullehp1-1 {
	  0% {
		transform: rotate(0);
		width: 0.5rem;
		right: 100%;
		bottom: 16%;
	  }
	  50% {
		transform: rotate(180deg); 
		width: 0.75rem;
		bottom: 60vh;
		right: 110%;	
	  }
	  100% {
		transform: rotate(360deg);
		width: 1.2rem;
		bottom: 80vh;
		right: 90%;
	  }
	}


	@keyframes bullehp2-1 {
	  0% {
		transform: rotate(0);
		width: 0.5rem;
		right: 100%;
		bottom: 16%;
	  }
	  
	  25% {
		right: 80%;  
	  }
	  
	  50% {
		transform: rotate(180deg);
		width: 0.9rem;
		bottom: 60vh;
		right: 60%;	
	  }
	  100% {
		transform: rotate(360deg);
		width: 1.5rem;
		bottom: 80vh;
		right: 70%;
	  }
	}





	@keyframes bullehp3-1 {
	  0% {
		transform: rotate(0);
		width: 0.5rem;
		left: 97%;
		bottom: 80%;
	  }
	  
	  25% {
		left: 80%;  
	  }
	  
	  50% {
		transform: rotate(180deg);
		width: 1.2rem;
		bottom: 60vh;
		left: 60%;	
	  }
	  100% {
		transform: rotate(360deg);
		width: 1.6rem;
		bottom: 80vh;
		left: 70%;
	  }
	}
	
	.path-frontpage {background-size: 160%;}
	.path-frontpage header, body:not(.path-frontpage) header {position: fixed; width: 100%; height: 90px; left: 0; top: 0; background: url(../images/bg-header.svg) no-repeat bottom center; background-size: 1400px; z-index: 200;}
	.icon-men {width: 24px; height: 22px; position: relative; display: inline-block; margin-left: 1rem;}
	.icon-men span {position: absolute; left: 0; top: 0; display: inline-block; border-radius: 3px; background: white; width: 100%; height: 4px; transition: all 0.25s ease-in-out;-webkit-transition: all 0.25s ease-in-out;-moz-transition: all 0.25s ease-in-out; transform-origin: left; opacity: 1;}
	.icon-men span:nth-child(2) {top: 50%; transform: translateY(-50%);}
	.icon-men span:nth-child(3) {top: calc(100% - 4px);}
	.icon-menu-open .icon-men span:first-child {top: -2px; width: 130%; transform: rotate(45deg);}
	.icon-menu-open .icon-men span:nth-child(2) {opacity: 0;}
	.icon-menu-open .icon-men span:nth-child(3) {top: calc(100% - 2px); transform: rotate(-45deg); width: 130%;} 
	a.menu-link {display: inline-block; color: white; margin-top: 27px;}
	#block-cdweb-main-menu {position: fixed; left: -100%; top: 100px; background: var(--bleuclair); padding-right: 1rem; transition: all 0.25s ease-in-out; opacity: 0.95;}
	#block-cdweb-main-menu.menu-open {left: 0;}
	.path-frontpage .menu--main a {color: white;}
	.menu-title {margin-left: 1rem; position: relative; top: -5px;}
	h1.page-title {font-size: 6vw; margin-top: 0;}
	.services-top-2-left {width: 100%; padding-right: 0;}
	.services-top-2-right {width: 100%; text-align: center; margin-top: 2rem;}
	.footer-wrapper > div {width: 100%;}
	.fond-sm-top {animation: none; width: 100vw; transform: translateY(-47%);}

	.bg-poisson-big {right: 0;}
	.services-top {font-size: 1rem;}
	.menu--main a {	font-size: 1.4rem; color: white;}	
	ul.menu li > *.is-active {color: white; text-decoration: underline;}	
	body:not(.path-frontpage) #block-cdweb-branding {z-index: 2;}
	.services-middle-right-content h2 {margin-bottom: 0;}
	.dauphin-wrapper {display: none;}

	@keyframes sm-mob {
	  0% {
		left: -120vw; top: 37%;
	  }
	  
	  100% {
		left: 120vw;
	  }
	}
	.services-bottom {overflow: hidden;}
	.sous-marin-wrapper {left: -120vw; top: 37%; animation: sm-mob 12s infinite linear;}
	.equipage-2-right-content {padding: 0;}
	.equipage-1-left:after {width: 50px; height: 50px; border: 8px solid var(--bleu);}
	.equipage-1-content:before {width: 8px}
	.equipage-1-left:before {height: 8px;}
	.rond {border: 8px solid var(--bleu); width: 66px; height: 66px;}
	.equipage-2-right:before {height: 8px; top: -40px;}
	.equipage-2-right:after {width: 8px; top: -40px;}
	h2 {font-size: 1.5rem;}
	.equipage-2-left {padding-right: 3rem;}
	.titre-2 {font-size: 1.7rem;}
	.equipage-2-right-content:after {height: 8px}
	.view-liste-nos-tresors .view-content {padding: 0 35px;}
	.animal.raie, .animal.raie2 {width: 20%;}
	body:not(.path-frontpage).page-node-3 {padding-top: 80px;}
	.page-node-3 #block-cdweb-page-title {padding-top: 6rem;}
}

@media screen and (max-width: 800px) {
	.bg-sm-bottom:after {top: 93%;	}
	.equipage-2-left {padding-top: 0; padding-bottom: 5rem;}
	.equipage-2-right img {margin: 9rem 0;}
	.equipage-1-left {display: flex; justify-content: center; flex-direction: column; padding-right: 3rem;}
	.equipage-1-right {padding-left: 3rem;}
	.rond.rond-2 {position: absolute; bottom: 0; left: 50%; transform: translate(-50%, 50%);}
	.rond.rond-3 {transform: translate(-50%, 50%);}
	.trait-go .equipage-2-right:after {height: calc(100% + 1rem);}
	.equipage-2-right-content:after {bottom: 0;}
	.equipage-2-right-content {height: 100%; display: flex; justify-content: center; flex-direction: column;}
	#block-views-block-liste-nos-tresors-block-1 {margin-top: 3rem;}
	.view.view-liste-des-realisations .view-content {padding: 0 40px;}
	.path-nos-realisations .slick-arrow {top: 50%;}
	.left-col {width: 100%; padding: 0 2rem; order: 2;}
	.right-col {width: 100%; padding: 0 2rem 3rem;}
	.right-col img {max-width: 450px; margin: 0 auto;}
	.left_pop {display: none;}
	.pop_content > .right_pop {width: 100%}
	#block-accrocheaccueil h2 {position: absolute; top: 52%; left: 50%; transform: translateX(-50%); font-size: 2rem; padding: 0 2rem; color: #092131; font-family: 'Gluten', cursive;}
}


@media screen and (max-width: 550px) {
	.footer-col-left > div {
		padding-right: 0;
	}
	.sm-bulles-bg-1, .sm-bulles-bg-2, .sm-bulles-bg-3, .sous-marin-bulles {display: none;}
	.services-top-2 {margin: 1rem 0;}
	.services-top-2-left h2, .sm-text-bloc-1 h2 {margin-bottom: 1rem;}
	.footer-title {font-size: 1rem; font-weight: 400;}
	.services-middle-left-oiseau {width: 35%; margin: 2rem;}
	.services-top {font-size: 1rem;}
	.sm-text-bloc-2 h2 {margin-bottom: 1em;}
	#block-cdweb-main-menu {padding: 2rem 1rem 0 0;}
	.path-frontpage #block-cdweb-main-menu {padding-top: 0;} 
	.services-middle-right {text-align: left;}
	.rond.rond-3 {left: 25%}
	.trait-go .equipage-2-right-content:after {width: 75%;}
	.right-col img {max-width: 100%;}
	.real-wrapper {padding: 0;}
	.left-col {padding: 0;}
	.right-col {padding: 0 0 1rem;}
	.left-col .views-field-title {margin: 1em 0; font-size: 1.5rem;}
	.page-node-type-reference main, .path-nos-realisations main {padding: 1rem 0 0;}
	.page-node-2 main {padding: 0 0 7rem;}
	#block-bganimaux {display: none;}

	.equipage-1-left:after, .equipage-1-content:before, .equipage-1-left:before, .rond, .equipage-2-right:before, .equipage-2-right:after, .trait-go .equipage-2-right-content:after {display: none;}
	.equipage-1-left, .equipage-2-right {width: 100%; padding: 0 2rem;}
	.equipage-1-right, .equipage-2-left {width: 100%; padding: 0 1rem;}
	.equipage-2-right img {margin: 2rem 0;}
	.titre-2 {font-size: 1.4rem;}
	.equipage-2 {background-size: 100%;}
	.titre-2:after {width: 100%;}
	.page-node-4 footer {margin-top: 6rem;}
	.sous-marin-wrapper {animation: sm-mob 8s infinite linear;}
	.right_pop h2 {font-size: 8vw;}
	.contact-content {margin: 2rem auto 6rem;}
	.contact-content a {font-size: 1rem; height: 58px; margin-bottom: 1rem; padding: 1rem;}
	.icon-mail svg {width: 30px;}
	.icon-smart svg {width: 30px; position: relative; top: 10px; left: 4px;}
	footer:after {height: 80px;}
	.right_pop {padding: 1rem 2rem;}
	.right_pop h2 {margin: 0.5em 0 1.25em;}
	.view-liste-nos-tresors img {margin: 0 auto;}
	#block-views-block-liste-nos-tresors-block-1 {margin-top: 1rem;}
	.path-nos-realisations .slick-arrow {display: none!important;}
}

@media screen and (max-height: 760px) {
.path-frontpage .menu--main .menu li:first-child {top: 52vh;}
}

.page-node-23 h1.page-title:before, .page-node-24 h1.page-title:before, .page-node-25 h1.page-title:before, .page-node-26 h1.page-title:before, .page-node-27 h1.page-title:before, .page-node-28 h1.page-title:before, .page-node-27 h1.page-title:before, .page-node-29 h1.page-title:before {content:""; width: 110%; height: 5rem; position: absolute; top: 39%; left: -5%; background: url(../images/bg-titre-service.svg) no-repeat top center; background-size: 100%;}


.page-node-23 .main-wrapper, .page-node-24 .main-wrapper, .page-node-25 .main-wrapper, .page-node-26 .main-wrapper, .page-node-27 .main-wrapper, .page-node-28 .main-wrapper, .page-node-29 .main-wrapper {
    padding-bottom: 13rem;
    display: inline-block;
    width: 100%;
}
details[data-once="webform-details-save"] > div {
    padding: 10px 20px;
}


/* ========================================================================== */
/* Pages expertise 2026                                                       */
/* Les styles restent volontairement scopes a .cdw-page pour ne pas modifier */
/* l'accueil, le menu ou les anciennes pages.                                 */
/* ========================================================================== */

.cdw-page {
  --cdw-navy: #073453;
  --cdw-ink: #092131;
  --cdw-sky: #8eb6d1;
  --cdw-sky-soft: #eaf5fa;
  --cdw-sand: #fff8ec;
  --cdw-yellow: #fbb03b;
  --cdw-coral: #e66f61;
  --cdw-line: rgba(7, 52, 83, .14);
  --cdw-shadow: 0 18px 48px rgba(7, 52, 83, .12);
  color: var(--cdw-ink);
  font-size: 1.05rem;
  line-height: 1.7;
  margin: 0 auto;
  max-width: 1380px;
  padding: 0 0 2rem;
}

.cdw-page * { box-sizing: border-box; }
.cdw-page h2,
.cdw-page h3,
.cdw-page h4 { color: var(--cdw-navy); margin-top: 0; }
.cdw-page h2 { font-size: clamp(2rem, 3.8vw, 3.45rem); line-height: 1.08; }
.cdw-page h3 { font-family: 'Gluten', cursive; font-size: clamp(1.35rem, 2vw, 1.8rem); line-height: 1.18; }
.cdw-page h4 { font-size: 1.05rem; font-weight: 800; margin: 1.6rem 0 .45rem; }
.cdw-page p:last-child { margin-bottom: 0; }
.cdw-page a:focus-visible,
.cdw-page summary:focus-visible,
.cdw-lightbox button:focus-visible { outline: 4px solid var(--cdw-yellow); outline-offset: 4px; }

.cdw-eyebrow {
  color: var(--cdw-coral);
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .16em;
  margin: 0 0 .85rem;
  text-transform: uppercase;
}

.cdw-lead { font-size: clamp(1.08rem, 1.5vw, 1.28rem); line-height: 1.68; }

.page-node-28 h1.page-title:before {
  background-image: url(../images/bg-titre-equipage.svg);
}

.page-node-29 h1.page-title:before,
.page-node-40 h1.page-title:before,
.page-node-6 h1.page-title:before,
.page-node-30 h1.page-title:before,
.page-node-31 h1.page-title:before,
.page-node-32 h1.page-title:before,
.page-node-33 h1.page-title:before,
.page-node-34 h1.page-title:before,
.page-node-35 h1.page-title:before,
.page-node-36 h1.page-title:before,
.page-node-37 h1.page-title:before,
.page-node-38 h1.page-title:before,
.page-node-39 h1.page-title:before {
  background: url(../images/bg-titre-service.svg) no-repeat top center;
  background-size: 100%;
  content: "";
  height: 5rem;
  left: -5%;
  position: absolute;
  top: 39%;
  width: 110%;
}

.page-node-30 .main-wrapper,
.page-node-40 .main-wrapper,
.page-node-6 .main-wrapper,
.page-node-31 .main-wrapper,
.page-node-32 .main-wrapper,
.page-node-33 .main-wrapper,
.page-node-34 .main-wrapper,
.page-node-35 .main-wrapper,
.page-node-36 .main-wrapper,
.page-node-37 .main-wrapper,
.page-node-38 .main-wrapper,
.page-node-39 .main-wrapper { display: inline-block; padding-bottom: 13rem; width: 100%; }

/* Hero */
.cdw-hero {
  align-items: center;
  background: var(--cdw-navy);
  border-radius: 44px;
  color: #fff;
  display: grid;
  gap: clamp(2rem, 5vw, 5rem);
  grid-template-columns: minmax(0, 1.55fr) minmax(260px, .65fr);
  margin: 1rem 0 5rem;
  overflow: hidden;
  padding: clamp(2rem, 5vw, 5rem);
  position: relative;
}

.cdw-hero:after {
  background: radial-gradient(circle at center, rgba(255,255,255,.18) 0 3px, transparent 4px) 0 0/44px 44px;
  content: "";
  inset: 0;
  opacity: .24;
  pointer-events: none;
  position: absolute;
}

.cdw-hero__copy,
.cdw-hero__scene { position: relative; z-index: 1; }
.cdw-hero h2 { color: #fff; margin-bottom: 1.25rem; }
.cdw-hero .cdw-eyebrow { color: var(--cdw-yellow); }
.cdw-hero__scene { color: var(--cdw-navy); }
.cdw-hero__scene:before {
  background: rgba(255,255,255,.92);
  border: 8px solid rgba(142,182,209,.7);
  border-radius: 50%;
  box-shadow: 0 0 0 10px rgba(255,255,255,.15);
  content: "";
  inset: -9% -7%;
  position: absolute;
}
.cdw-hero__scene svg { display: block; overflow: visible; position: relative; width: 100%; z-index: 1; }
.cdw-hero--compact { grid-template-columns: minmax(0, 1.8fr) minmax(230px, .55fr); }
.cdw-bubble { border: 4px solid #fff; border-radius: 50%; height: 16px; opacity: .7; position: absolute; width: 16px; }
.cdw-bubble--1 { right: 12%; top: -28%; }
.cdw-bubble--2 { height: 9px; right: 2%; top: -8%; width: 9px; }
.cdw-bubble--3 { right: 20%; top: -5%; }

.cdw-certification {
  align-items: center;
  background: #fff;
  border-left: 7px solid var(--cdw-yellow);
  border-radius: 16px;
  color: var(--cdw-navy);
  display: flex;
  flex-wrap: wrap;
  gap: .7rem 1.2rem;
  margin-top: 1.7rem;
  max-width: 610px;
  padding: 1rem 1.2rem;
}
.cdw-certification img { flex: 0 0 auto; max-width: 235px; width: 46%; }
.cdw-certification small { color: #456070; flex: 1 1 250px; line-height: 1.45; }

/* Titres et sections */
.cdw-section { margin: 6rem 0; }
.cdw-page [id] { scroll-margin-top: 185px; }
.cdw-section--tinted { background: var(--cdw-sky-soft); border-radius: 40px; padding: clamp(2rem, 5vw, 4.5rem); }
.cdw-section-heading { margin-bottom: 2.5rem; max-width: 880px; }
.cdw-section-heading > p:not(.cdw-eyebrow) { font-size: 1.12rem; }

/* Navigation en cartes */
.cdw-service-nav {
  display: grid;
  gap: 1.1rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: -7rem 2rem 6rem;
  position: relative;
  z-index: 3;
}
.cdw-service-nav a {
  background: #fff;
  border: 1px solid var(--cdw-line);
  border-radius: 24px;
  box-shadow: 0 12px 30px rgba(7,52,83,.12);
  color: var(--cdw-ink);
  display: flex;
  flex-direction: column;
  min-height: 210px;
  padding: 1.25rem;
  text-align: center;
  transform: translateY(0);
}
.cdw-service-nav a:hover,
.cdw-service-nav a:focus { border-color: var(--cdw-sky); color: var(--cdw-navy); transform: translateY(-7px); }
.cdw-service-nav strong { font-size: 1.02rem; line-height: 1.25; margin: .85rem 0 .45rem; }
.cdw-service-nav small { color: #587080; font-size: .86rem; line-height: 1.45; }
.cdw-service-nav__icon {
  align-items: center;
  background: var(--cdw-sky-soft);
  border-radius: 50%;
  color: var(--cdw-navy);
  display: flex;
  height: 74px;
  justify-content: center;
  margin: 0 auto;
  width: 74px;
}
.cdw-service-nav a:nth-child(3n+2) .cdw-service-nav__icon { background: var(--cdw-sand); }
.cdw-service-nav a:nth-child(3n) .cdw-service-nav__icon { background: #fff0ee; }
.cdw-service-nav__icon svg { fill: none; height: 42px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 3.2; width: 42px; }

/* Cartes avantages */
.cdw-benefit-grid {
  display: grid;
  gap: 1.2rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.cdw-benefit-grid article {
  background: #fff;
  border: 1px solid var(--cdw-line);
  border-radius: 24px;
  padding: 1.7rem;
  position: relative;
}
.cdw-why-service .cdw-benefit-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.cdw-benefit-grid article > span,
.cdw-feature-columns article > span {
  color: var(--cdw-yellow);
  display: block;
  font-family: 'Lexend Exa', sans-serif;
  font-size: 1.45rem;
  font-weight: 700;
  margin-bottom: 1rem;
}
.cdw-benefit-grid h3 { font-size: 1.28rem; }
.cdw-benefit-grid p { color: #486171; font-size: .96rem; line-height: 1.62; }

/* Equipe */
.cdw-team-leads {
  display: grid;
  gap: 1.4rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.cdw-team-grid {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.cdw-person-card {
  background: #fff;
  border: 1px solid var(--cdw-line);
  border-radius: 30px;
  overflow: hidden;
  padding: 1.35rem;
  position: relative;
}
.cdw-person-card:after {
  background: var(--cdw-yellow);
  border-radius: 12px;
  content: "";
  height: 7px;
  left: 1.35rem;
  position: absolute;
  right: 70%;
  top: 1.25rem;
}
.cdw-person-card img { margin: 0 auto 1.2rem; max-width: 210px; width: 64%; }
.cdw-person-card--lead { box-shadow: var(--cdw-shadow); padding: 1.8rem; }
.cdw-person-card--lead img { max-width: 250px; width: 72%; }
.cdw-person-card__body h3 { font-size: 1.65rem; margin-bottom: .8rem; }
.cdw-person-card__role { color: var(--cdw-coral); font-size: .76rem; font-weight: 900; letter-spacing: .08em; margin-bottom: .35rem; text-transform: uppercase; }
.cdw-person-card__body p:not(.cdw-person-card__role) { color: #496373; font-size: .94rem; line-height: 1.62; }

/* Chiffres */
.cdw-stats {
  background: var(--cdw-navy);
  border-radius: 42px;
  color: #fff;
  display: grid;
  gap: clamp(2rem, 5vw, 4rem);
  grid-template-columns: minmax(240px, .8fr) minmax(0, 1.45fr);
  overflow: hidden;
  padding: clamp(2rem, 5vw, 4.5rem);
  position: relative;
}
.cdw-stats:after { border: 18px solid rgba(142,182,209,.18); border-radius: 50%; content: ""; height: 210px; position: absolute; right: -100px; top: -100px; width: 210px; }
.cdw-stats h2 { color: #fff; }
.cdw-stats .cdw-eyebrow { color: var(--cdw-yellow); }
.cdw-stats__grid { display: grid; gap: 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); position: relative; z-index: 1; }
.cdw-stats__grid article { background: rgba(255,255,255,.09); border: 1px solid rgba(255,255,255,.18); border-radius: 24px; display: flex; flex-direction: column; justify-content: center; min-height: 150px; padding: 1.4rem; }
.cdw-stats__grid strong { color: var(--cdw-yellow); font-family: 'Lexend Exa', sans-serif; font-size: clamp(1.8rem, 3vw, 2.75rem); line-height: 1.05; }
.cdw-stats__grid span { font-size: .94rem; line-height: 1.45; margin-top: .55rem; }
.cdw-stats__wide { grid-column: 1 / -1; }

/* Colonnes services */
.cdw-feature-columns { display: grid; gap: 1.2rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cdw-feature-columns article { background: var(--cdw-sky-soft); border-radius: 28px; padding: 2rem; }
.cdw-feature-columns article:nth-child(2n) { background: var(--cdw-sand); }
.cdw-feature-columns h3 { margin-bottom: .7rem; }

/* Cas modules */
.cdw-case-card {
  align-items: center;
  border-bottom: 1px solid var(--cdw-line);
  display: grid;
  gap: clamp(2rem, 5vw, 5rem);
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr);
  padding: 4.5rem 0;
}
.cdw-case-card:first-of-type { padding-top: 1rem; }
.cdw-case-card--reverse .cdw-case-card__content { order: 2; }
.cdw-case-card--reverse .cdw-shot-gallery { order: 1; }
.cdw-case-card__number { color: rgba(7,52,83,.11); float: right; font-family: 'Lexend Exa', sans-serif; font-size: 4rem; font-weight: 800; line-height: 1; }
.cdw-tag { color: var(--cdw-coral); font-size: .76rem; font-weight: 900; letter-spacing: .1em; margin-bottom: .6rem; text-transform: uppercase; }
.cdw-case-card__content h3 { font-size: clamp(1.8rem, 3vw, 2.65rem); }
.cdw-check-list { list-style: none; margin: 1.5rem 0; padding: 0; }
.cdw-check-list li { margin: .65rem 0; padding-left: 2rem; position: relative; }
.cdw-check-list li:before { background: var(--cdw-yellow); border: 3px solid var(--cdw-navy); border-radius: 50%; content: ""; height: 14px; left: 0; position: absolute; top: .45em; width: 14px; }
.cdw-case-card__result { background: var(--cdw-sky-soft); border-left: 6px solid var(--cdw-sky); border-radius: 0 14px 14px 0; padding: 1rem 1.2rem; }
.cdw-shot-gallery { display: grid; gap: .9rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cdw-shot-placeholder {
  align-items: center;
  aspect-ratio: 4/3;
  background: linear-gradient(145deg, #fff 0 45%, #eaf5fa 45% 100%);
  border: 2px dashed var(--cdw-sky);
  border-radius: 20px;
  color: var(--cdw-navy);
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 140px;
  padding: 1rem;
  position: relative;
  text-align: center;
}
.cdw-shot-placeholder:before { background: var(--cdw-yellow); border-radius: 50%; content: "+"; font-size: 1.4rem; font-weight: 800; height: 40px; line-height: 38px; margin-bottom: .6rem; width: 40px; }
.cdw-shot-placeholder span { font-weight: 800; }
.cdw-shot-placeholder small { color: #5e7584; }
.cdw-shot-placeholder--large { aspect-ratio: 16/10; grid-column: 1 / -1; }
.cdw-gallery-note { background: var(--cdw-sand); border: 1px solid rgba(251,176,59,.45); border-radius: 24px; margin: 2rem 0 6rem; padding: 1.5rem 2rem; }
.cdw-gallery-note strong { color: var(--cdw-navy); font-size: 1.2rem; }

/* Connecteurs */
.cdw-connector-cases { display: grid; gap: 1.4rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cdw-connector-card { background: var(--cdw-sky-soft); border: 1px solid var(--cdw-line); border-radius: 32px; padding: clamp(1.7rem, 3vw, 2.8rem); }
.cdw-connector-card--accent { background: var(--cdw-sand); }
.cdw-connector-card__top { align-items: flex-start; display: flex; gap: 1.2rem; }
.cdw-connector-card__top > span { color: rgba(7,52,83,.16); font-family: 'Lexend Exa', sans-serif; font-size: 3rem; font-weight: 800; line-height: 1; }
.cdw-connector-card h3 { font-size: 1.85rem; }
.cdw-flow { align-items: start; background: var(--cdw-navy); border-radius: 36px; color: #fff; display: grid; gap: 2rem; grid-template-columns: .55fr 1.45fr; margin: 6rem 0; padding: clamp(2rem, 5vw, 4rem); }
.cdw-flow h2 { color: #fff; }
.cdw-flow .cdw-eyebrow { color: var(--cdw-yellow); }
.cdw-flow ol { counter-reset: flow; display: grid; gap: .75rem; list-style: none; margin: 0; padding: 0; }
.cdw-flow li { align-items: center; background: rgba(255,255,255,.09); border-radius: 18px; display: grid; gap: .4rem 1rem; grid-template-columns: 120px 1fr; padding: 1rem 1.2rem; }
.cdw-flow li strong { color: var(--cdw-yellow); font-size: .85rem; letter-spacing: .08em; text-transform: uppercase; }

/* Realisations */
.cdw-project-list { display: grid; gap: 2rem; }
.cdw-project-card { align-items: start; background: var(--cdw-sky-soft); border-radius: 38px; display: grid; gap: clamp(2rem, 5vw, 4rem); grid-template-columns: minmax(240px, .55fr) minmax(0, 1.45fr); padding: clamp(2rem, 5vw, 4rem); }
.cdw-project-card--reverse { background: var(--cdw-sand); }
.cdw-project-card--reverse .cdw-project-card__logo { order: 2; }
.cdw-project-card__logo { background: #fff; border-radius: 28px; box-shadow: var(--cdw-shadow); padding: 1.3rem; }
.cdw-project-card__intro { color: var(--cdw-navy); font-size: 1.22rem; font-weight: 700; }
.cdw-project-tags { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1.3rem 0; }
.cdw-project-tags span { background: #fff; border: 1px solid var(--cdw-line); border-radius: 99px; color: var(--cdw-navy); font-size: .78rem; font-weight: 800; padding: .45rem .75rem; }
.cdw-project-highlights { display: grid; gap: .7rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cdw-project-highlights > div { background: rgba(255,255,255,.72); border-radius: 16px; padding: 1rem; }
.cdw-project-highlights strong { color: var(--cdw-coral); font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; }
.cdw-project-highlights p { font-size: .88rem; line-height: 1.5; }

/* FAQ */
.cdw-faq__list { border: 0; display: grid; gap: 1rem; }
.cdw-faq details {
  background: #fff;
  border: 0 !important;
  border-radius: 22px;
  box-shadow: 0 10px 30px rgba(7,52,83,.08);
  overflow: hidden;
  transition: box-shadow .25s ease, transform .25s ease;
}
.cdw-faq details:hover { box-shadow: 0 14px 34px rgba(7,52,83,.13); transform: translateY(-2px); }
.cdw-faq details[open] { background: var(--cdw-sky-soft); box-shadow: 0 14px 36px rgba(7,52,83,.12); }
.cdw-faq summary { color: var(--cdw-navy); cursor: pointer; font-size: 1.12rem; font-weight: 800; list-style: none; padding: 1.4rem 5rem 1.4rem 1.6rem; position: relative; }
.cdw-faq summary::-webkit-details-marker { display: none; }
.cdw-faq summary:after { align-items: center; background: var(--cdw-sky-soft); border: 2px solid rgba(7,52,83,.08); border-radius: 50%; content: "+"; display: flex; font-size: 1.45rem; height: 42px; justify-content: center; position: absolute; right: 1.35rem; top: 50%; transform: translateY(-50%); transition: .2s ease; width: 42px; }
.cdw-faq details[open] summary:after { background: var(--cdw-yellow); border-color: var(--cdw-yellow); transform: translateY(-50%) rotate(45deg); }
.cdw-faq details > div { border-top: 1px dashed rgba(7,52,83,.13); color: #496373; margin: 0 1.6rem; max-width: 960px; padding: 1.15rem 3.4rem 1.55rem 0; }

/* Cartes et repères des nouvelles pages */
.cdw-choice-grid,
.cdw-use-case-grid,
.cdw-proof-grid { display: grid; gap: 1.2rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cdw-choice-card,
.cdw-use-case-grid article,
.cdw-proof-grid article { background: #fff; border: 1px solid var(--cdw-line); border-radius: 28px; padding: 1.8rem; }
.cdw-choice-card { color: var(--cdw-ink); display: flex; flex-direction: column; min-height: 290px; position: relative; }
.cdw-choice-card:hover,
.cdw-choice-card:focus { border-color: var(--cdw-sky); box-shadow: var(--cdw-shadow); color: var(--cdw-navy); transform: translateY(-5px); }
.cdw-choice-card__icon { align-items: center; background: var(--cdw-sky-soft); border-radius: 50%; color: var(--cdw-navy); display: flex; height: 76px; justify-content: center; margin-bottom: 1.25rem; width: 76px; }
.cdw-choice-card:nth-child(2) .cdw-choice-card__icon { background: var(--cdw-sand); }
.cdw-choice-card:nth-child(3) .cdw-choice-card__icon { background: #fff0ee; }
.cdw-choice-card__icon svg { fill: none; height: 43px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 3; width: 43px; }
.cdw-choice-card h3 { margin-bottom: .55rem; }
.cdw-choice-card p { color: #557080; }
.cdw-choice-card strong:last-child { color: var(--cdw-coral); margin-top: auto; padding-top: 1rem; }
.cdw-use-case-grid article:nth-child(3n+2) { background: var(--cdw-sand); }
.cdw-use-case-grid article:nth-child(3n) { background: var(--cdw-sky-soft); }
.cdw-use-case-grid h3,
.cdw-proof-grid h3 { font-size: 1.35rem; }
.cdw-use-case-grid p,
.cdw-proof-grid p { color: #496373; font-size: .96rem; }
.cdw-promise { align-items: center; background: var(--cdw-navy); border-radius: 38px; color: #fff; display: grid; gap: clamp(2rem, 5vw, 4rem); grid-template-columns: .8fr 1.2fr; overflow: hidden; padding: clamp(2rem, 5vw, 4rem); position: relative; }
.cdw-promise h2 { color: #fff; }
.cdw-promise .cdw-eyebrow { color: var(--cdw-yellow); }
.cdw-promise__list { display: grid; gap: .8rem; list-style: none; margin: 0; padding: 0; }
.cdw-promise__list li { background: rgba(255,255,255,.09); border-radius: 17px; padding: .95rem 1.15rem .95rem 3.15rem; position: relative; }
.cdw-promise__list li:before { background: var(--cdw-yellow); border-radius: 50%; content: ""; height: 12px; left: 1.25rem; position: absolute; top: 1.35rem; width: 12px; }
.cdw-notice { background: var(--cdw-sand); border: 1px solid rgba(251,176,59,.42); border-radius: 24px; margin: 2rem 0; padding: 1.4rem 1.6rem; }
.cdw-notice strong { color: var(--cdw-navy); }

/* Produits Commerce : offres d'hebergement */
body.cdw-commerce-route h1.page-title:before {
  background: url(../images/bg-titre-service.svg) no-repeat top center;
  background-size: 100%;
  content: "";
  height: 5rem;
  left: -5%;
  position: absolute;
  top: 39%;
  width: 110%;
}
body.cdw-commerce-route .main-wrapper { display: inline-block; padding-bottom: 13rem; width: 100%; }
.cdw-hosting-product__offers { display: grid; gap: 1rem; grid-template-columns: repeat(5, minmax(0, 1fr)); margin: 4rem 0 2rem; }
.cdw-hosting-offer { background: #fff; border: 1px solid var(--cdw-line); border-radius: 24px; display: flex; flex-direction: column; min-height: 225px; padding: 1.35rem; position: relative; }
.cdw-hosting-offer:nth-child(2n) { background: var(--cdw-sand); }
.cdw-hosting-offer:last-child { background: var(--cdw-navy); color: #fff; }
.cdw-hosting-offer h3 { font-size: 1.2rem; margin-bottom: .8rem; }
.cdw-hosting-offer:last-child h3 { color: #fff; }
.cdw-hosting-offer__price { color: var(--cdw-coral); font-family: 'Lexend Exa', sans-serif; font-size: clamp(1.45rem, 2.4vw, 2.1rem); font-weight: 700; line-height: 1.1; }
.cdw-hosting-offer:last-child .cdw-hosting-offer__price { color: var(--cdw-yellow); }
.cdw-hosting-offer__price small { display: block; font-family: 'Lato', sans-serif; font-size: .72rem; font-weight: 700; margin-top: .4rem; }
.cdw-hosting-offer__poulpyx { background: var(--cdw-sky-soft); border-radius: 99px; color: var(--cdw-navy); display: inline-block; font-size: .68rem; font-weight: 900; line-height: 1.25; margin-top: auto; padding: .5rem .7rem; text-transform: uppercase; }
.cdw-hosting-offer:last-child .cdw-hosting-offer__poulpyx { background: rgba(255,255,255,.13); color: #fff; }
.cdw-hosting-product__cart { background: var(--cdw-sky-soft); border-radius: 30px; margin: 1rem 0 5rem; padding: clamp(1.5rem, 4vw, 3rem); }
.cdw-hosting-product__cart h2 { font-size: clamp(1.7rem, 3vw, 2.5rem); }
.cdw-hosting-product__cart .field--name-variations { margin-top: 1.5rem; }
.cdw-hosting-product__cart form { align-items: end; display: flex; flex-wrap: wrap; gap: 1rem; }
.cdw-hosting-product__cart form > * { margin: 0; }
.cdw-hosting-product__cart select { background: #fff; border: 1px solid var(--cdw-sky); border-radius: 12px; color: var(--cdw-navy); min-height: 50px; min-width: min(100%, 390px); padding: .7rem 2.7rem .7rem 1rem; }
.cdw-hosting-product__cart input[type="submit"] { background: var(--cdw-navy); border: 0; border-radius: 99px; color: #fff; cursor: pointer; font-weight: 800; min-height: 50px; padding: .8rem 1.4rem; }
.cdw-hosting-product__cart input[type="submit"]:hover,
.cdw-hosting-product__cart input[type="submit"]:focus { background: #021023; }
.cdw-plan-details { display: grid; gap: 1rem; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.cdw-plan-details article { background: var(--cdw-sky-soft); border-radius: 24px; padding: 1.4rem; }
.cdw-plan-details article:nth-child(2n) { background: var(--cdw-sand); }
.cdw-plan-details h3 { font-size: 1.2rem; }
.cdw-plan-details ul { font-size: .9rem; margin: 1rem 0 0; padding-left: 1.1rem; }
.cdw-plan-details li { margin: .45rem 0; }

.cdw-hosting-products__grid { display: grid; gap: 1rem; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.cdw-hosting-migration { background: #fff; border-left: 5px solid var(--cdw-yellow); border-radius: 0 18px 18px 0; color: var(--cdw-navy); margin: 1.5rem auto 0; max-width: 920px; padding: 1rem 1.2rem; }
.cdw-hosting-migration del { color: #6f7f89; font-weight: 700; }
.cdw-hosting-migration strong { color: var(--cdw-coral); font-family: 'Lexend Exa', sans-serif; font-size: .92em; }
.cdw-hosting-plan { background: #fff; border: 1px solid var(--cdw-line); border-radius: 26px; display: flex; flex-direction: column; min-width: 0; padding: 1.5rem; }
.cdw-hosting-plan:nth-child(2n) { background: var(--cdw-sand); }
.cdw-hosting-plan--custom { background: var(--cdw-navy) !important; color: #fff; }
.cdw-hosting-plan h3 { font-size: 1.25rem; min-height: 2.4em; }
.cdw-hosting-plan--custom h3,
.cdw-hosting-plan--custom .cdw-tag { color: #fff; }
.cdw-hosting-plan__price { color: var(--cdw-coral); font-family: 'Lexend Exa', sans-serif; font-size: clamp(1.5rem, 2.5vw, 2.15rem); font-weight: 700; line-height: 1.1; margin: .4rem 0 1.2rem; }
.cdw-hosting-plan--custom .cdw-hosting-plan__price { color: var(--cdw-yellow); }
.cdw-hosting-plan__price small { display: block; font-family: 'Lato', sans-serif; font-size: .72rem; margin-top: .4rem; }
.cdw-hosting-plan__description { color: #496373; font-size: .91rem; line-height: 1.55; }
.cdw-hosting-plan--custom .cdw-hosting-plan__description { color: rgba(255,255,255,.82); }
.cdw-hosting-plan__description .field__label { display: none; }
.cdw-hosting-plan__description .field__item > :last-child,
.cdw-hosting-plan__description > :last-child { margin-bottom: 0; }
.cdw-hosting-plan__description p { margin-bottom: .85rem; }
.cdw-hosting-plan__features { list-style: none; margin: 0 0 1.2rem; padding: 0; }
.cdw-hosting-plan__features li { margin: .5rem 0; padding-left: 1.25rem; position: relative; }
.cdw-hosting-plan__features li:before { background: var(--cdw-yellow); border-radius: 50%; content: ""; height: 8px; left: 0; position: absolute; top: .55em; width: 8px; }
.cdw-hosting-plan__poulpyx { background: var(--cdw-sky-soft); border-radius: 99px; color: var(--cdw-navy); display: inline-block; font-size: .66rem; font-weight: 900; line-height: 1.25; margin: auto 0 1rem; padding: .5rem .7rem; text-align: center; text-transform: uppercase; }
.cdw-hosting-plan__poulpyx strong { color: var(--cdw-coral); }
.cdw-hosting-plan--custom .cdw-hosting-plan__poulpyx { background: rgba(255,255,255,.13); color: #fff; }
.cdw-hosting-plan--custom .cdw-hosting-plan__poulpyx strong { color: var(--cdw-yellow); }
.cdw-hosting-plan__cart form { margin-top: .5rem; }
.cdw-hosting-plan__cart .field,
.cdw-hosting-plan__cart .form-actions { margin: 0; }
.cdw-hosting-plan__cart .field--name-purchased-entity,
.cdw-hosting-plan__cart .field--name-quantity { display: none; }
.cdw-hosting-plan__cart input[type="submit"],
.cdw-hosting-plan__cart .cdw-order-button { background: var(--cdw-navy); border: 0; border-radius: 99px; color: #fff; cursor: pointer; display: inline-flex; font-weight: 800; justify-content: center; min-height: 48px; padding: .75rem 1rem; width: 100%; }
.cdw-hosting-plan--custom .cdw-hosting-plan__cart input[type="submit"],
.cdw-hosting-plan--custom .cdw-hosting-plan__cart .cdw-order-button { background: var(--cdw-yellow); color: var(--cdw-navy); }
.cdw-hosting-plan__cart input[type="submit"]:hover,
.cdw-hosting-plan__cart input[type="submit"]:focus,
.cdw-hosting-plan__cart .cdw-order-button:hover,
.cdw-hosting-plan__cart .cdw-order-button:focus { background: #021023; color: #fff; }
.cdw-hosting-comparison { border-top: 1px solid var(--cdw-line); margin-top: clamp(3rem, 7vw, 6rem); padding-top: clamp(2rem, 5vw, 4rem); }
.cdw-hosting-comparison__scroll { border: 1px solid var(--cdw-line); border-radius: 24px; margin-top: 2rem; overflow: auto; position: relative; }
.cdw-hosting-comparison__scroll:focus { box-shadow: 0 0 0 4px rgba(251,176,59,.28); outline: 2px solid var(--cdw-navy); outline-offset: 2px; }
.cdw-hosting-comparison table { background: #fff; border-collapse: separate; border-spacing: 0; margin: 0; min-width: 1060px; width: 100%; }
.cdw-hosting-comparison th,
.cdw-hosting-comparison td { border-bottom: 1px solid var(--cdw-line); border-right: 1px solid var(--cdw-line); padding: .9rem .75rem; text-align: center; vertical-align: middle; }
.cdw-hosting-comparison tr:last-child th,
.cdw-hosting-comparison tr:last-child td { border-bottom: 0; }
.cdw-hosting-comparison th:last-child,
.cdw-hosting-comparison td:last-child { border-right: 0; }
.cdw-hosting-comparison thead th { background: var(--cdw-navy); color: #fff; font-family: 'Lexend Exa', sans-serif; font-size: .78rem; line-height: 1.35; }
.cdw-hosting-comparison thead th:first-child { border-radius: 23px 0 0 0; left: 0; position: sticky; z-index: 3; }
.cdw-hosting-comparison thead th:last-child { background: #123d5b; border-radius: 0 23px 0 0; }
.cdw-hosting-comparison tbody th { background: var(--cdw-sand); color: var(--cdw-navy); font-size: .84rem; left: 0; min-width: 210px; position: sticky; text-align: left; z-index: 2; }
.cdw-hosting-comparison tbody tr:nth-child(even) td { background: #f7fbfd; }
.cdw-hosting-comparison tbody td:last-child { background: #fff9e8; }
.cdw-hosting-comparison tbody tr:nth-child(even) td:last-child { background: #fff5d7; }
.cdw-hosting-comparison td small { display: block; font-size: .67rem; margin-top: .15rem; }
.cdw-comparison-yes { color: #176744; font-weight: 800; }
.cdw-comparison-yes:before { color: #31a36f; content: "✓"; margin-right: .28rem; }
.cdw-hosting-comparison__actions .button { align-items: center; display: inline-flex; font-size: .72rem; justify-content: center; margin: 0; min-height: 42px; min-width: 118px; padding: .65rem .8rem; }

/* Appel a l'action */
.cdw-cta { align-items: center; background: var(--cdw-sky-soft); border-radius: 34px; display: flex; gap: 2rem; justify-content: space-between; margin: 6rem 0 1rem; overflow: hidden; padding: clamp(1.8rem, 4vw, 3.5rem); position: relative; }
.cdw-cta:after { border: 16px solid rgba(142,182,209,.22); border-radius: 50%; content: ""; height: 150px; position: absolute; right: 22%; top: -90px; width: 150px; }
.cdw-cta > * { position: relative; z-index: 1; }
.cdw-cta h2 { font-size: clamp(1.75rem, 3vw, 2.6rem); margin-bottom: 0; max-width: 790px; }
.cdw-cta .button { flex: 0 0 auto; text-align: center; }

/* Page en attente de contenu */
.cdw-placeholder { align-items: center; background: var(--cdw-sky-soft); border-radius: 40px; display: grid; gap: 3rem; grid-template-columns: minmax(220px, .55fr) minmax(0, 1fr); margin: 1rem 0 5rem; padding: clamp(2rem, 5vw, 4rem); }
.cdw-placeholder > div:first-child { color: var(--cdw-navy); }
.cdw-placeholder svg { display: block; margin: auto; max-width: 300px; width: 100%; }

/* Visionneuse des futures captures */
.cdw-lightbox-link { cursor: zoom-in; display: block; }
.cdw-lightbox-link img { border-radius: 18px; width: 100%; }
.cdw-lightbox {
  align-items: center;
  background: rgba(3, 20, 33, .95);
  display: none;
  inset: 0;
  justify-content: center;
  padding: 4.5rem 6rem 3rem;
  position: fixed;
  z-index: 10000;
}
.cdw-lightbox.is-open { display: flex; }
.cdw-lightbox__figure { color: #fff; margin: 0; max-height: 100%; max-width: 1200px; text-align: center; }
.cdw-lightbox__figure img { max-height: calc(100vh - 9rem); max-width: 100%; object-fit: contain; }
.cdw-lightbox__caption { display: block; margin-top: .75rem; }
.cdw-lightbox button { background: #fff; border: 0; border-radius: 50%; color: var(--cdw-navy); cursor: pointer; font-size: 1.8rem; height: 48px; line-height: 1; padding: 0; position: absolute; width: 48px; }
.cdw-lightbox__close { right: 1.5rem; top: 1.5rem; }
.cdw-lightbox__prev { left: 1.5rem; top: 50%; }
.cdw-lightbox__next { right: 1.5rem; top: 50%; }
body.cdw-lightbox-open { overflow: hidden; }

@media screen and (max-width: 1180px) {
  .cdw-service-nav { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: -6.2rem; }
  .cdw-why-service .cdw-benefit-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cdw-benefit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cdw-team-leads { grid-template-columns: 1fr; }
  .cdw-person-card--lead { align-items: center; display: grid; gap: 1.5rem; grid-template-columns: 260px 1fr; }
  .cdw-person-card--lead img { margin-bottom: 0; width: 100%; }
  .cdw-hosting-product__offers,
  .cdw-plan-details,
  .cdw-hosting-products__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media screen and (max-width: 900px) {
  .cdw-page { font-size: 1rem; }
  .cdw-hero,
  .cdw-hero--compact { grid-template-columns: 1fr; }
  .cdw-hero__scene { margin: 0 auto; max-width: 300px; width: 70%; }
  .cdw-service-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: -4rem 1rem 5rem; }
  .cdw-stats { grid-template-columns: 1fr; }
  .cdw-team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cdw-case-card { grid-template-columns: 1fr; }
  .cdw-case-card--reverse .cdw-case-card__content { order: 1; }
  .cdw-case-card--reverse .cdw-shot-gallery { order: 2; }
  .cdw-connector-cases { grid-template-columns: 1fr; }
  .cdw-flow { grid-template-columns: 1fr; }
  .cdw-project-card { grid-template-columns: 1fr; }
  .cdw-project-card--reverse .cdw-project-card__logo { order: 0; }
  .cdw-project-card__logo { max-width: 430px; }
  .cdw-page [id] { scroll-margin-top: 120px; }
  .cdw-choice-grid,
  .cdw-use-case-grid,
  .cdw-proof-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cdw-promise { grid-template-columns: 1fr; }
  .cdw-hosting-product__offers,
  .cdw-plan-details,
  .cdw-hosting-products__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media screen and (max-width: 640px) {
  .cdw-page h2 { font-size: 1.9rem; }
  .cdw-hero { border-radius: 28px; margin-bottom: 3rem; padding: 1.7rem; }
  .cdw-hero__scene { width: 82%; }
  .cdw-certification { align-items: flex-start; flex-direction: column; }
  .cdw-certification img { width: 210px; }
  .cdw-section { margin: 4rem 0; }
  .cdw-section--tinted { border-radius: 26px; padding: 1.3rem; }
  .cdw-service-nav { grid-template-columns: 1fr; margin: -1rem 0 4rem; }
  .cdw-service-nav a { align-items: center; display: grid; gap: .15rem 1rem; grid-template-columns: 68px 1fr; min-height: 0; text-align: left; }
  .cdw-service-nav__icon { grid-row: 1 / 3; height: 60px; width: 60px; }
  .cdw-service-nav__icon svg { height: 34px; width: 34px; }
  .cdw-service-nav strong { margin: 0; }
  .cdw-benefit-grid,
  .cdw-why-service .cdw-benefit-grid,
  .cdw-feature-columns,
  .cdw-team-grid,
  .cdw-stats__grid { grid-template-columns: 1fr; }
  .cdw-person-card--lead { display: block; }
  .cdw-person-card--lead img { margin-bottom: 1rem; max-width: 220px; }
  .cdw-stats { border-radius: 28px; padding: 1.7rem; }
  .cdw-stats__wide { grid-column: auto; }
  .cdw-shot-gallery { grid-template-columns: 1fr; }
  .cdw-shot-placeholder--large { grid-column: auto; }
  .cdw-project-highlights { grid-template-columns: 1fr; }
  .cdw-flow li { grid-template-columns: 1fr; }
  .cdw-cta { align-items: flex-start; flex-direction: column; }
  .cdw-cta .button { width: 100%; }
  .cdw-placeholder { grid-template-columns: 1fr; }
  .cdw-lightbox { padding: 4.5rem 1rem 5rem; }
  .cdw-lightbox__prev { bottom: 1rem; left: calc(50% - 60px); top: auto; }
  .cdw-lightbox__next { bottom: 1rem; right: calc(50% - 60px); top: auto; }
  .cdw-faq summary { padding: 1.2rem 4.25rem 1.2rem 1.15rem; }
  .cdw-faq summary:after { height: 38px; right: 1rem; width: 38px; }
  .cdw-faq details > div { margin: 0 1.15rem; padding: 1rem 0 1.3rem; }
  .cdw-choice-grid,
  .cdw-use-case-grid,
  .cdw-proof-grid,
  .cdw-hosting-product__offers,
  .cdw-plan-details,
  .cdw-hosting-products__grid { grid-template-columns: 1fr; }
  .cdw-choice-card { min-height: 0; }
  .cdw-hosting-product__cart form { align-items: stretch; flex-direction: column; }
  .cdw-hosting-product__cart input[type="submit"],
  .cdw-hosting-product__cart select { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .cdw-page *,
  .cdw-page *:before,
  .cdw-page *:after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}
	
	
	
	/* Wrapper */
#block-cdweb-selecteurdelangue {
  position: relative;
      display: flex;
    justify-content: center;
    flex-direction: column;
    margin-top: 1.5rem;
}

/* Le bouton qui montre uniquement la langue active */
#block-cdweb-selecteurdelangue .lang-toggle {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .35rem .6rem;
  border: 1px solid var(--lang-border, #ddd);
  border-radius: .5rem;
  background: var(--lang-bg, #fff);
  cursor: pointer;
  line-height: 1;
}

#block-cdweb-selecteurdelangue .lang-toggle:after {
  content: "";
  width: 0; height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid currentColor;
  margin-left: .35rem;
  opacity: .7;
}

/* La liste <ul> devient le menu déroulant */
#block-cdweb-selecteurdelangue ul.links {
  position: absolute;
  left: 0;
  top: calc(50% + 14px);
  min-width: 40px;
  margin: 0;
  padding: .35rem 0;
  list-style: none;
  border: 1px solid var(--lang-border, #ddd);
  border-radius: .5rem;
  background: var(--lang-bg, #fff);
  box-shadow: 0 8px 20px rgba(0,0,0,.08);
  z-index: 1000;

  /* Fermé par défaut */
  display: none;
}

/* Ouvert */
#block-cdweb-selecteurdelangue.is-open ul.links {
  display: block;
}

/* Items */
#block-cdweb-selecteurdelangue ul.links li {
  display: block;
}

/* On masque la langue active DANS le menu pour éviter le doublon */
#block-cdweb-selecteurdelangue ul.links li.is-active {
  display: none;
}

/* Liens */
#block-cdweb-selecteurdelangue ul.links a.language-link {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .45rem .7rem;
  text-decoration: none;
  color: inherit;
}

#block-cdweb-selecteurdelangue ul.links a.language-link:hover,
#block-cdweb-selecteurdelangue ul.links a.language-link:focus {
  background: rgba(0,0,0,.04);
  outline: none;
  text-decoration: none;
}

/* Petite taille d’icône homogène */
#block-cdweb-selecteurdelangue img.language-icon {
  width: 16px;
  height: 12px;
  display: inline-block;
  border-radius: 2px;
}
body:not(.path-frontpage) .region-header {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}


.path-frontpage #block-cdweb-selecteurdelangue {
    position: absolute;
    top: 1rem;
    right: 2rem;
}

@media screen and (max-width: 1001px) {
	body:not(.path-frontpage) .region-header {
		justify-content: space-between;
	}
	.language-switcher-language-url {
		margin-top: 18px;
	}	
	.path-frontpage #block-cdweb-selecteurdelangue {
		top: 7px;
	}
}	

.page-node-17 .node__content {
    padding-bottom: 12rem;
}

/* ========================================================================== */
/* Navigation principale enrichie                                             */
/* ========================================================================== */
.menu--main ul.menu {
	list-style: none;
	list-style-image: none;
}

.menu--main > ul.menu > li {
	position: relative;
	padding: 0;
}

.menu--main > ul.menu > li.menu-item--expanded > a::after {
	content: "";
	display: inline-block;
	position: static;
	left: auto;
	top: auto;
	right: auto;
	bottom: auto;
	width: .45rem;
	height: .45rem;
	margin-left: .45rem;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-.18rem) rotate(45deg);
	background: none !important;
	background-image: none !important;
}

.menu--main .menu .menu {
	position: absolute;
	top: calc(100% - .1rem);
	left: 50%;
	z-index: 260;
	display: block;
	min-width: 250px;
	margin: 0;
	padding: .7rem;
	visibility: hidden;
	opacity: 0;
	transform: translate(-50%, .6rem);
	border: 1px solid rgba(142, 182, 209, .48);
	border-radius: 1.1rem;
	background: rgba(255, 255, 255, .98);
	box-shadow: 0 18px 38px rgba(7, 52, 83, .2);
	transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
}

.menu--main .menu .menu::before {
	content: "";
	position: absolute;
	left: 50%;
	top: -.45rem;
	width: .8rem;
	height: .8rem;
	transform: translateX(-50%) rotate(45deg);
	border-top: 1px solid rgba(142, 182, 209, .48);
	border-left: 1px solid rgba(142, 182, 209, .48);
	background: #fff;
}

.menu--main .menu li:hover > .menu,
.menu--main .menu li:focus-within > .menu {
	visibility: visible;
	opacity: 1;
	transform: translate(-50%, 0);
}

.menu--main .menu .menu li,
body:not(.path-frontpage) .menu--main .menu .menu li {
	display: block;
	width: 100%;
	padding: 0;
}

.menu--main .menu .menu li > *,
body:not(.path-frontpage) .menu--main .menu .menu li > * {
	display: block;
	width: 100%;
	margin: 0;
	padding: .65rem .8rem;
	transform: none;
	border-radius: .65rem;
	color: var(--bleu);
	font-family: 'Lato', sans-serif;
	font-size: .94rem;
	font-weight: 700;
	line-height: 1.25;
	text-align: left;
}

.menu--main .menu .menu li > *::before,
.menu--main .menu .menu li > *::after {
	display: none;
}

.menu--main .menu .menu a:hover,
.menu--main .menu .menu a:focus,
.menu--main .menu .menu a.is-active {
	background: #eaf4f8;
	color: var(--bleu);
	text-decoration: none;
}

@media screen and (min-width: 1001px) {
	header > .container {
		max-width: 1600px;
	}

	#block-cdweb-main-menu {
		width: 100%;
	}

	.menu--main > ul.menu,
	body:not(.path-frontpage) .menu--main > ul.menu {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-wrap: nowrap;
		gap: .05rem;
		width: 100%;
		margin: 0;
		padding: .45rem .7rem;
	}

	.menu--main > ul.menu > li > *,
	body:not(.path-frontpage) .menu--main > ul.menu > li > * {
		margin: 0;
		padding: .72rem .56rem;
		font-size: clamp(.76rem, .85vw, 1.04rem);
		line-height: 1;
		white-space: nowrap;
		transform: rotate(-3deg);
	}

	body:not(.path-frontpage) {
		padding-top: 170px;
	}

	body:not(.path-frontpage) header {
		height: 155px;
	}

	body:not(.path-frontpage) .region-header {
		width: 100%;
	}

	.path-frontpage header {
		position: fixed;
		left: 0;
		top: 0;
		z-index: 200;
		width: 100%;
	}

	.path-frontpage #block-cdweb-main-menu {
		position: fixed;
		left: 50%;
		top: .8rem;
		width: min(1500px, calc(100vw - 3rem));
		transform: translateX(-50%);
	}

	.path-frontpage .menu--main > ul.menu {
		border: 1px solid rgba(142, 182, 209, .55);
		border-radius: 2rem;
		background: rgba(255, 255, 255, .9);
		box-shadow: 0 12px 30px rgba(7, 52, 83, .13);
		backdrop-filter: blur(8px);
	}

	.path-frontpage .menu--main > ul.menu > li {
		position: relative;
		left: auto;
		top: auto;
		transform: none;
	}

	.path-frontpage .menu--main > ul.menu > li > * {
		color: var(--bleu);
	}

	.path-frontpage .menu--main > ul.menu > li:not(.menu-item--expanded) > *::after {
		display: none;
	}

	.path-frontpage .menu--main > ul.menu > li > *::before {
		content: "";
		position: absolute;
		left: .45rem;
		right: .45rem;
		bottom: .32rem;
		width: auto;
		height: 3px;
		top: auto;
		border-radius: 2px;
		background: var(--jaune);
		opacity: 0;
		transition: opacity .2s ease;
	}

	.path-frontpage .menu--main > ul.menu > li > *:hover::before,
	.path-frontpage .menu--main > ul.menu > li > *:focus::before,
	.path-frontpage .menu--main > ul.menu > .menu-item--active-trail > *::before {
		opacity: 1;
	}
}

@media screen and (max-width: 1000px) {
	#block-cdweb-main-menu {
		top: 90px;
		bottom: 0;
		width: min(88vw, 380px);
		max-height: calc(100vh - 90px);
		padding: 1rem;
		overflow-y: auto;
		overscroll-behavior: contain;
		box-shadow: 18px 12px 35px rgba(7, 52, 83, .2);
	}

	.menu--main > ul.menu {
		display: block;
		margin: 0;
		padding: 0;
	}

	.menu--main > ul.menu > li > *,
	body:not(.path-frontpage) .menu--main > ul.menu > li > * {
		display: block;
		width: 100%;
		margin: 0;
		padding: .72rem .8rem;
		transform: none;
		color: #fff;
		font-size: 1.22rem;
		line-height: 1.15;
	}

	.menu--main .menu .menu {
		position: static;
		display: block;
		min-width: 0;
		margin: .1rem 0 .65rem .8rem;
		padding: .25rem 0 .25rem .7rem;
		visibility: visible;
		opacity: 1;
		transform: none;
		border: 0;
		border-left: 3px solid rgba(255, 255, 255, .55);
		border-radius: 0;
		background: transparent;
		box-shadow: none;
	}

	.menu--main .menu .menu::before {
		display: none;
	}

	.menu--main .menu .menu li > *,
	body:not(.path-frontpage) .menu--main .menu .menu li > * {
		padding: .48rem .65rem;
		background: transparent;
		color: #fff;
		font-size: .95rem;
	}

	.menu--main .menu .menu a:hover,
	.menu--main .menu .menu a:focus,
	.menu--main .menu .menu a.is-active {
		background: rgba(255, 255, 255, .14);
		color: #fff;
	}
}

/* ========================================================================== */
/* Page carrefour des services et page devis                                  */
/* ========================================================================== */
.cdw-hero--services {
	background: linear-gradient(135deg, #f1f8fb 0%, #d7eaf3 100%);
	color: var(--bleu);
}

.cdw-hero--services .cdw-hero__scene {
	color: var(--bleu);
}

.cdw-hero--services h2,
.cdw-hero--quote h2 {
	color: var(--bleu);
}

.cdw-hero--services .cdw-eyebrow,
.cdw-hero--quote .cdw-eyebrow {
	color: #b65a4f;
}

.cdw-hero__actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 1rem 1.5rem;
	margin-top: 1.7rem;
}

.cdw-text-link {
	font-weight: 800;
	color: var(--bleu);
}

.cdw-services-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1.35rem;
}

.cdw-service-card {
	display: flex;
	flex-direction: column;
	min-height: 100%;
	padding: 1.55rem;
	border: 1px solid #d5e6ef;
	border-radius: 1.4rem;
	background: #fff;
	box-shadow: 0 14px 32px rgba(7, 52, 83, .09);
	transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.cdw-service-card:hover,
.cdw-service-card:focus-within {
	transform: translateY(-5px);
	border-color: #8eb6d1;
	box-shadow: 0 20px 42px rgba(7, 52, 83, .15);
}

.cdw-service-card__icon {
	display: grid;
	place-items: center;
	width: 74px;
	height: 74px;
	margin-bottom: 1rem;
	padding: .65rem;
	border-radius: 50%;
	background: #eaf4f8;
	color: var(--bleu);
}

.cdw-service-card__icon svg {
	width: 100%;
}

.cdw-service-card .cdw-tag {
	margin-bottom: .35rem;
	color: #477690;
	font-size: .73rem;
	letter-spacing: .07em;
}

.cdw-service-card h3 {
	margin: 0 0 .7rem;
	font-family: 'Gluten', cursive;
	font-size: 1.45rem;
	line-height: 1.1;
}

.cdw-service-card h3 a {
	color: var(--bleu);
}

.cdw-service-card p:not(.cdw-tag) {
	margin-bottom: 1.1rem;
}

.cdw-service-card__links {
	display: flex;
	flex-wrap: wrap;
	gap: .45rem;
	margin: auto 0 0;
	padding: 0;
	list-style: none;
}

.cdw-service-card__links a {
	display: inline-block;
	padding: .42rem .68rem;
	border-radius: 1rem;
	background: #edf6f9;
	color: var(--bleu);
	font-size: .8rem;
	font-weight: 700;
}

.cdw-service-card__links a:hover,
.cdw-service-card__links a:focus {
	background: var(--bleu);
	color: #fff;
}

.cdw-service-card__more {
	margin-top: auto;
	font-weight: 800;
	color: var(--bleu);
}

.cdw-services-method {
	position: relative;
	overflow: hidden;
}

.cdw-section--soft {
	padding: clamp(2rem, 5vw, 4rem);
	border: 1px solid #d8e8f0;
	border-radius: 2.2rem;
	background: #f3f9fb;
}

.cdw-feature-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.2rem;
}

.cdw-feature-grid article {
	padding: 1.35rem;
	border-radius: 1.1rem;
	background: #fff;
	box-shadow: 0 10px 25px rgba(7, 52, 83, .07);
}

.cdw-feature-grid h3 {
	margin-bottom: .55rem;
	font-size: 1.3rem;
}

.cdw-services-method::after {
	content: "";
	position: absolute;
	right: -2rem;
	bottom: -2.5rem;
	width: 9rem;
	height: 9rem;
	border: 1rem solid rgba(142, 182, 209, .22);
	border-radius: 50%;
}

.cdw-hero--quote {
	background: linear-gradient(135deg, #fff8e9 0%, #e2f0f6 100%);
	color: var(--bleu);
}

.cdw-quote-tags {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: .65rem;
}

.cdw-quote-tags span {
	display: inline-block;
	padding: .55rem .9rem;
	border: 1px solid #c7dee9;
	border-radius: 2rem;
	background: #fff;
	color: var(--bleu);
	font-weight: 700;
}

.cdw-quote-note {
	margin: 1.5rem auto 0;
	padding: 1rem 1.25rem;
	border-left: 4px solid var(--jaune);
	background: #f5fafc;
	text-align: center;
}

@media screen and (max-width: 1150px) {
	.cdw-services-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media screen and (max-width: 800px) {
	.cdw-feature-grid {
		grid-template-columns: 1fr;
	}
}

@media screen and (max-width: 650px) {
	.cdw-services-grid {
		grid-template-columns: 1fr;
	}

	.cdw-hero__actions {
		align-items: flex-start;
		flex-direction: column;
	}
}

/* Correctif conservé pour l’en-tête du module Poulpyx. */
header.poulpyx-chat__header {
	height: auto!important;
	position: relative!important;
	background: url(../images/bg-header.svg) no-repeat bottom center; background-size: cover;
}

/* ========================================================================== */
/* Navigation Superfish                                                       */
/* ========================================================================== */
.cdw-superfish-navigation {
	position: relative;
	z-index: 270;
width: auto;
    padding-top: 1.5rem;
}

.cdw-superfish-navigation ul.sf-menu {
	display: flex;
	align-items: center;
	justify-content: center;
	float: none;
	width: 100%;
	min-height: 3.25rem;
	margin: 0;
	padding: .45rem .7rem;
	list-style: none;
	list-style-image: none;
	background: transparent;
}

.cdw-superfish-navigation ul.sf-menu,
.cdw-superfish-navigation ul.sf-menu * {
	box-sizing: border-box;
}

.cdw-superfish-navigation ul.sf-menu > li {
	position: relative;
	float: none;
	margin: 0;
	padding: 0;
	background: transparent;
}

.cdw-superfish-navigation ul.sf-menu > li > a {
	position: relative;
	display: block;
	margin: 0;
	padding: .72rem .48rem;
	border: 0;
	background: transparent;
	color: #fff;
	font-family: 'Architects Daughter', cursive;
	font-size: clamp(1rem, 1.08vw, 1.5rem);
	line-height: 1;
	white-space: nowrap;
	transform: rotate(-3deg);
}

.cdw-superfish-navigation ul.sf-menu > li > a:hover,
.cdw-superfish-navigation ul.sf-menu > li > a:focus,
.cdw-superfish-navigation ul.sf-menu > li > a.is-active,
.cdw-superfish-navigation ul.sf-menu > li.active-trail > a {
	color: #fff;
	text-decoration: none;
}

.cdw-superfish-navigation ul.sf-menu > li > a::before {
	content: "";
	position: absolute;
	left: .4rem;
	right: .4rem;
	top: auto;
	bottom: .25rem;
	width: auto;
	height: 3px;
	border-radius: 3px;
	background: var(--jaune);
	opacity: 0;
	transition: opacity .2s ease;
}

.cdw-superfish-navigation ul.sf-menu > li > a:hover::before,
.cdw-superfish-navigation ul.sf-menu > li > a:focus::before,
.cdw-superfish-navigation ul.sf-menu > li > a.is-active::before,
.cdw-superfish-navigation ul.sf-menu > li.active-trail > a::before {
	opacity: 1;
}

.cdw-superfish-navigation .sf-sub-indicator {
	display: none;
}

.cdw-superfish-navigation ul.sf-menu > li.menuparent > a::after {
	content: "";
	display: inline-block;
	position: static;
	width: .42rem;
	height: .42rem;
	margin-left: .45rem;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	background: none;
	transform: translateY(-.18rem) rotate(45deg);
}

.cdw-superfish-navigation ul.sf-menu > li > ul {
	position: absolute !important;
	display: none;
	top: calc(100% + .12rem) !important;
	left: 50% !important;
	z-index: 280;
	min-width: 255px;
	margin: 0;
	padding: .72rem;
	border: 1px solid rgba(142, 182, 209, .5);
	border-radius: 1.1rem;
	background: rgba(255, 255, 255, .99);
	box-shadow: 0 18px 38px rgba(7, 52, 83, .2);
	transform: translateX(-50%);
}

.cdw-superfish-navigation ul.sf-menu > li > ul::before {
	content: "";
	position: absolute;
	left: 50%;
	top: -.45rem;
	width: .8rem;
	height: .8rem;
	border-top: 1px solid rgba(142, 182, 209, .5);
	border-left: 1px solid rgba(142, 182, 209, .5);
	background: #fff;
	transform: translateX(-50%) rotate(45deg);
}

.cdw-superfish-navigation ul.sf-menu > li.sfHover > ul,
.cdw-superfish-navigation ul.sf-menu > li:focus-within > ul {
	display: block !important;
}

.cdw-superfish-navigation ul.sf-menu ul li,
body:not(.path-frontpage) .cdw-superfish-navigation ul.sf-menu ul li {
	display: block;
	float: none;
	width: 100%;
	margin: 0;
	padding: 0;
	background: transparent;
}

.cdw-superfish-navigation ul.sf-menu ul a,
body:not(.path-frontpage) .cdw-superfish-navigation ul.sf-menu ul a {
	display: block;
	width: 100%;
	margin: 0;
	padding: .68rem .82rem;
	border: 0;
	border-radius: .65rem;
	background: transparent;
	color: var(--bleu);
	font-family: 'Lato', sans-serif;
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.25;
	text-align: left;
	transform: none;
}

.cdw-superfish-navigation ul.sf-menu ul a::before,
.cdw-superfish-navigation ul.sf-menu ul a::after {
	display: none;
}

.cdw-superfish-navigation ul.sf-menu ul a:hover,
.cdw-superfish-navigation ul.sf-menu ul a:focus,
.cdw-superfish-navigation ul.sf-menu ul a.is-active {
	background: #eaf4f8;
	color: var(--bleu);
	text-decoration: none;
}

.cdw-superfish-navigation a:focus-visible {
	outline: 3px solid var(--jaune);
	outline-offset: 3px;
}

@media screen and (min-width: 1001px) {
	header > .container {
		max-width: 1600px;
	}

	body:not(.path-frontpage) .region-header {
		width: 100%;
	}

	.path-frontpage .cdw-superfish-navigation {
		position: fixed;
		left: 50%;
		top: .8rem;
		width: min(1500px, calc(100vw - 3rem));
		transform: translateX(-50%);
	}

	.path-frontpage .cdw-superfish-navigation ul.sf-menu {
		border: 1px solid rgba(142, 182, 209, .55);
		border-radius: 2rem;
		background: rgba(255, 255, 255, .92);
		box-shadow: 0 12px 30px rgba(7, 52, 83, .13);
		backdrop-filter: blur(8px);
	}

	.path-frontpage .cdw-superfish-navigation ul.sf-menu > li > a {
		color: var(--bleu);
	}
}

@media screen and (max-width: 1000px) {
	body.menu-principal-ouvert {
		overflow: hidden;
	}

	.cdw-superfish-navigation {
		position: fixed;
		left: -110%;
		top: 90px;
		bottom: 0;
		z-index: 275;
		width: min(88vw, 390px);
		max-height: calc(100vh - 90px);
		padding: 1rem;
		overflow-y: auto;
		overscroll-behavior: contain;
		-webkit-overflow-scrolling: touch;
		border-radius: 0 1.4rem 0 0;
		background: rgba(35, 111, 151, .98);
		box-shadow: 18px 12px 35px rgba(7, 52, 83, .22);
		transition: left .25s ease-in-out;
	}

	.cdw-superfish-navigation.menu-open {
		left: 0;
	}

	.cdw-superfish-navigation ul.sf-menu {
		display: block !important;
		width: 100% !important;
		min-height: 0;
		margin: 0;
		padding: 0;
	}

	.cdw-superfish-navigation ul.sf-menu > li {
		display: block;
		width: 100%;
		border-bottom: 1px solid rgba(255, 255, 255, .16);
	}

	.cdw-superfish-navigation ul.sf-menu > li:last-child {
		border-bottom: 0;
	}

	.cdw-superfish-navigation ul.sf-menu > li > a,
	body:not(.path-frontpage) .cdw-superfish-navigation ul.sf-menu > li > a,
	.path-frontpage .cdw-superfish-navigation ul.sf-menu > li > a {
		display: block;
		width: 100%;
		margin: 0;
		padding: .72rem .8rem;
		color: #fff;
		font-size: 1.34rem;
		line-height: 1.15;
		transform: none;
	}

	.cdw-superfish-navigation ul.sf-menu > li.menuparent > a::after {
		float: right;
		margin-top: .28rem;
		margin-right: .2rem;
	}

	.cdw-superfish-navigation ul.sf-menu > li > ul {
		position: static !important;
		display: block !important;
		visibility: visible !important;
		opacity: 1 !important;
		left: auto !important;
		top: auto !important;
		width: auto !important;
		min-width: 0;
		height: auto !important;
		max-height: none !important;
		margin: .05rem .35rem .7rem .7rem;
		padding: .35rem .4rem .35rem .75rem;
		border: 0;
		border-left: 3px solid rgba(255, 255, 255, .55);
		border-radius: 0 .8rem .8rem 0;
		background: rgba(255, 255, 255, .08);
		box-shadow: none;
		transform: none;
	}

	.cdw-superfish-navigation ul.sf-menu > li > ul::before {
		display: none;
	}

	.cdw-superfish-navigation ul.sf-menu ul a,
	body:not(.path-frontpage) .cdw-superfish-navigation ul.sf-menu ul a {
		padding: .58rem .68rem;
		background: transparent;
		color: #fff;
		font-size: 1rem;
	}

	.cdw-superfish-navigation ul.sf-menu ul a:hover,
	.cdw-superfish-navigation ul.sf-menu ul a:focus,
	.cdw-superfish-navigation ul.sf-menu ul a.is-active {
		background: rgba(255, 255, 255, .14);
		color: #fff;
	}
}

@media (prefers-reduced-motion: reduce) {
	.cdw-superfish-navigation {
		transition: none;
	}
}

.path-cart .main-wrapper, .path-checkout .main-wrapper {margin-bottom: 15rem!important;}