@charset "utf-8";
/* CSS Document */
*,
*::before,
*::after {
	margin: 0;
    padding: 0;
	box-sizing: border-box;
}
:root {
	--vertFond: #30443a;
	--vertTexte: #3C6851;
	--vertTexte-rgb: 60, 104, 81;
	--vertC: #27FA6B;
	--vertC-rgb: 39, 250, 107;
}
img { max-width: 100%; height: auto; display: block; }
body { overflow-x: hidden; background:#fff; }
html,
body {
	max-width: 100%;
    overflow-x: hidden;
	scroll-behavior: smooth;
}
@font-face {
	font-family: "tropiline";
	src: url("/font/Tropiline-SemiBold.otf") format("opentype");
  	font-weight: normal;
  	font-style: normal;
}
.josefin-slab {
  font-family: "Josefin Slab", serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
}
.lato-thin {
  font-family: "Lato", sans-serif;
  font-weight: 100;
  font-style: normal;
}
.lato-light {
  font-family: "Lato", sans-serif;
  font-weight: 300;
  font-style: normal;
}
.lato-regular {
  font-family: "Lato", sans-serif;
  font-weight: 400;
  font-style: normal;
}
.lato-bold {
  font-family: "Lato", sans-serif;
  font-weight: 700;
  font-style: normal;
}
.lato-black {
  font-family: "Lato", sans-serif;
  font-weight: 900;
  font-style: normal;
}
h1 {
	font-family: 'tropiline', sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: clamp(30px, 4vw, 50px);
	margin: 0;
	color: var(--vertTexte);
}
h2 {
	font-family: "Josefin Slab", serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-style: normal;
	font-size: clamp(25px, 3vw, 40px);
	margin-bottom: 20px;
	color: var(--vertTexte);
}
h3 {
	font-optical-sizing: auto;
	font-family: "Lato", sans-serif;
	font-weight: 300;
	font-style: normal;
	font-variant-caps: small-caps;
	font-size: clamp(15px, 2vw, 25px);
	letter-spacing: 2px;
	margin-bottom: 50px;
	color: var(--vertTexte);
	z-index: 2;
}
.h3-trait {
	position: relative;
	display: block; 
    width: fit-content;
	z-index: 2;
}
.h3-trait::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -2px;
	width: 100%;
	height: 10px;
	background-color: rgba(var(--vertC-rgb), 0.2);
	z-index: 1;
}
h4 {
	font-family: "Lato", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: clamp(13px, 1vw, 20px);
}
p {
	font-optical-sizing: auto;
	font-family: "Lato", sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: clamp(10px, 1vw, 20px);
	color: #333333;
}
.cta-vertF,
.cta-vertC {
	padding-top: clamp(5px, 1vw, 10px);
	padding-bottom: clamp(5px, 1vw, 10px);
	padding-left: clamp(20px, 4vw, 50px);
	padding-right: clamp(20px, 4vw, 50px);
	border-radius: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: 'Lato', sans-serif;
	font-weight: 900;
	font-size: clamp(10px, 2vw, 20px);
	font-variant-caps: small-caps;
	text-decoration: none;
	cursor: pointer;
	border: 1px solid transparent;
	gap: 10px;
}
.cta-vertF { background:var(--vertTexte); color:#fff; box-shadow: 5px 5px 10px 5px rgba(var(--vertC-rgb), 0.2); }
.cta-vertC { background: var(--vertC-rgb), 0.2; color: var(--vertF); box-shadow: 5px 5px 10px 5px var(--vertC-rgb); }
.cta-vertF:hover {
	border: 1px solid var(--vertTexte);
	background-color: transparent;
	color: var(--vertTexte);
}
.cta-vertC:hover { 
	border: 1px solid var(--vertC);
	background-color: transparent;
	color: var(--vertTexte);
}
#arrow1 {
	width: clamp(20px, 2vw, 30px);
	height: auto;
}
.main-content-wrapper {
	max-width: 80%;    
    margin-left: auto;   
    margin-right: auto;   
}
:focus-visible {
  outline: 3px solid var(--vertC);
  outline-offset: 3px;
  border-radius: 3px;
}
.skip-link {
  position: absolute;
  left: -9999px;
}
.skip-link:focus {
  left: 50%;
  transform: translateX(-50%);
  top: 10px;
  z-index: 9999;
  background: var(--vertTexte);
  color: #fff;
  padding: 8px 16px;
  border-radius: 4px;
  text-decoration: none;
}


/* Header */
.main-header {
  	display: flex;
  	justify-content: space-between;
  	align-items: center;
  	padding: 20px 0;
}
.header-left {
  	flex-shrink: 0;
  	min-width: 100px;
}
.header-center {
  	flex: 1;
  	display: flex;
  	justify-content: center;
  	align-items: center;
	min-height: 40px;
}
.burger-toggle {
	display: none;
}
.burgerButton {
	display: none;
	flex-direction: column;
	justify-content: space-between;
	width: 30px;
	height: 21px;
	background: transparent;
	border: none;
	cursor: pointer;
	padding: 0;
	z-index: 1000;
}
.burgerBar {
	display: block;
	width: 100%;
	height: 3px;
	background-color: var(--vertFond);
	transition: all 0.3s ease;
}
.burgerMenu {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 50vh;
	background-color: var(--vertFond);
	transform: translateY(-100%);
	transition: transform 0.3s ease;
	z-index: 999;
	padding: 80px 20px 20px;
	box-sizing: border-box;
}
.burger-toggle:checked ~ .burgerMenu {
	transform: translateY(0);
}
.burger-toggle:checked ~ .burgerButton .burgerBar:nth-child(1) {
  	transform: translateY(9px) rotate(45deg);
}
.burger-toggle:checked ~ .burgerButton .burgerBar:nth-child(2) {
 	opacity: 0;
}
.burger-toggle:checked ~ .burgerButton .burgerBar:nth-child(3) {
  	transform: translateY(-9px) rotate(-45deg);
}
.burger-toggle:checked ~ .burgerButton .burgerBar {
	background-color: white;
}
.main-menu {
  	list-style: none;
  	display: flex;
  	padding: 0;
  	margin: 0;
  	justify-content: center;
  	gap: 100px;
}
.main-menu li a {
  	text-decoration: none;
	font-family: "Lato", sans-serif;
	font-weight: 300;
  	font-size: 20px;
  	color: #333333;
}
.main-menu li a::after {
	content:'';
	display: block;
	width: 0;
	height: 5px;
	background-color: var(--vertC);
	transition: width 0.2s ease-in-out;
}
.main-menu li a:hover::after {
	width: 100%;
}
.burgerMenu .decoMobile {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 50px;
  padding: 0;
  margin: 0;
  align-items: flex-start;
}
.burgerMenu .decoMobile li a {
  font-size: 30px;
  color: white;
  font-weight: 700;
  text-decoration: none;
}
.btnContact a {
	display: block;
	background-color: #fff;
	width: 25vh;
	height: 5vh;
	color: var(--vertF);
	border-radius: 100px;
	text-align: center;
	align-content: center;
	text-decoration: none;
}
.btnContact a:visited,
.btnContact a:active,
.btnContact a:focus {
	color: var(--vertTexte);
}
.burgerMenu .decoMobile .btnContact a {
  color: var(--vertTexte);
}
.header-right .button_1 {
	display: flex;
	align-items:center;
	padding: 5px 20px;
	background-color: transparent;
	gap: 5px;
}
.button_1 {
	font-variant-caps: small-caps;
	font-family: "Lato", sans-serif;
 	font-weight: 900;
  	font-style: normal;
	border: 1px solid #333333;
	border-radius: 30px;
	text-decoration: none;
}
.button_1:link,
.button_1:visited {
	color: #333;
}
.button_1:hover {
	color: #fff;
	border: 1px solid transparent;
	background-color: var(--vertTexte);
}
.button_1:active {
	color: #fff;
}
#arrow2 {
	width: 20px;
	padding-top:2px;
}
#arrow2:hover{
	color:#fff;
}


/* Home-page - Section 1 */
.homepage-section1 {
	width: 100%;
	height: auto;
    position: relative;
}
.hp-s1-columns {
	display: grid;
	grid-template-columns: 40% 60%;
	grid-auto-rows: auto;
	gap: 50px;
}
.hp-s1-photo {
	display: block;
    position: relative;
	align-items: center;
    width: 100%;
    height: auto;
	transform: rotate(-2deg);
	border-radius: 30px;
    z-index: 1;
}
.hp-s1-text {
    position: relative;
    z-index: 2;
	padding-bottom: clamp(30px, 4vw, 50px);
	align-content: center;
}
.hp-s1-h1 {
	margin-bottom: clamp(25px, 4vw, 50px);
	line-height: 1;
}
.style-special {
	font-family: "tropiline", sans-serif;
	text-transform: uppercase;
	color: var(--vertTexte);
	font-size: clamp(20px, 2vw, 35px);
}
.style-special-2 { 
	font-family: "tropiline", sans-serif;
	color: var(--vertTexte);
	font-size: clamp(15px, 3vw, 40px);
}
.hp-s1-p {
	margin-top: 25px;
}
#hp-s1-btn {
	margin-top: clamp(25px, 4vw, 50px);
	justify-self: start;
}


/*Home-page - Section 3 - partie 1*/
.homepage-section3-partie1 {
	margin-top: clamp(50px, 7vw, 100px);
}
.hp-s3-rect-gris1,
.hp-s3-rect-gris2 {
	width: 100%;
	height: auto;
	background-color: #f4f4f4;
}
.hp-s3-rect-gris1 {padding-top: clamp(25px, 4vw, 50px);}
.hp-s3-rect-gris2 {padding-bottom: clamp(25px, 4vw, 50px);}
.hp-s3-conteneurTitre {
	align-items: center;
	text-align: center;
}
.hp-s3-h2 {
	font-size: clamp(25px, 3vw, 40px);
}
.hp-s3-p {
	margin-top: 25px;
	display: flex;
	text-align: start;
}
.hp-s3-h3 {
	display: flex;
	justify-content: start;
	margin-top: clamp(10px, 4vw, 50px);
}
.hp-s3-h3P2 {
	display: flex;
	justify-content: start;
	padding-top: clamp(10px, 4vw, 50px);
}
.hp-s3-conteneurCasier {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 50px;
	justify-items: center;
	text-align: center;
}
.hp-s3-casier {
	width: 100%;
	max-width: 500px;
	height: auto;
	padding: 20px;
	border-radius: 20px;
	background-color: var(--vertFond);
	box-shadow: 10px 10px 20px rgba(51, 51, 51, 0.20);
}
.hp-s3-conteneurImgTitre {
	display: flex;
	align-items: center;
	text-align: start;
	gap: 10px;
}
.casier-i {
	width: auto;
	height: 40px;
	margin-bottom: 15px;
}
.hp-s3-p1 {
	font-family: "Lato", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 23px;
	font-variant-caps: small-caps;
	margin-bottom: 20px;
	color: #fff;
}
.hp-s3-p2 {
	font-family: "Lato", sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 13px;
	text-align: start;
	color: #fff;
}


/*Home-page - Section 3 - partie 2*/
.hp-s3-h3P2 {
	display: flex;
	justify-content: start;
}


/* Home-page - Section 2 - partie 1 */
.homepage-section2-p1 {
	margin-top: clamp(50px, 7vw, 100px);
}
.hp-s2-titre {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}
.hp-s2-colums {
	display: grid;
  	grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
	justify-content: center; 
  	gap: clamp(20px, 4vw, 50px);
}
.hp-s2-content1,
.hp-s2-content2 {
    position: relative;
	display: flex;
    flex-direction: column;
	align-items: center;
	text-align: center;
}
.icone-electricite,
.icone-poids-page {
	position: relative;
	width: clamp(150px, 18vw, 150px);
	height: clamp(150px, 18vw, 150px);
	margin-bottom: clamp(20px, 3vw, 40px);
	display: flex;
	justify-content: center;
	align-content: center;
	background-color: var(--vertFond);
	border-radius: 50%;
	box-shadow: 0 0 20px 10px rgba(var(--vertC-rgb), 0.3);
}
.iconeelectricite,
.iconepoidspage {
	width: clamp(100px, 7vw, 100px);
	height: auto;	
}


/*Home-page - Section 2 - partie 2*/
.homepage-section2-p2 {
	margin-top: clamp(50px, 7vw, 100px);
	width: 100%;
	height: auto;
	padding: clamp(25px, 4vw, 50px);
	background-color: var(--vertFond);
}
.hp-s2-content3 {
	display: flex;
	flex-direction: column;
	justify-content: center;
	position: relative;
	box-sizing: border-box;
}
.hp-s2-p {
	margin-bottom: 50px;
	display: inline;
	text-align: center;
}
.hp-s2-p1 {
	color:#fff;
}
.icones-section2 {
  display: flex;
  align-items: center;
  width: 100%;
  height: clamp(150px, 21vw, 300px);
  gap: clamp(25px, 4vw, 50px);
  overflow-x: auto;
  overflow-y: visible;
  padding-left: clamp(25px, 4vw, 50px);
  padding-right: clamp(25px, 4vw, 50px);
}
.icones-section2::-webkit-scrollbar {
  height: 6px;
}
.icones-section2::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.3);
  border-radius: 3px;
}
.hp-s2-p2 {
	color: #fff;
	text-align: center;
	margin: 0;
	font-size: clamp(15px, 2vw, 25px);
	margin-bottom: clamp(15px, 4vw, 50px);
}
.hp-s2-p2-carrIcones {
  	display: grid;
  	justify-items: center;
  	width: clamp(120px, 21vw, 280px);
  	height: auto;  
  	gap: clamp(10px, 1vw, 15px);
  	padding: 20px;
  	border-radius: 10px;
  	transition: all 0.3s ease-in-out;
	flex-shrink: 0;
}
.hp-s2-p2-carrIcones:hover {
  	transform: scale(1.05);
  	background-color: rgba(var(--vertC-rgb), 0.1);
  	border-radius: 10px;
}
.hp-s2-p2-h3 {
	color: #fff;
	text-align: center;
	font-size: clamp(10px, 2vw, 25px);
	margin-bottom: 0;
}
.hp-s2-p2-icones {
  	width: clamp(50px, 7vw, 100px);
  	height: auto;
  	transition: all 0.3s ease-in-out;
}


/* Home-page - Section 4*/
.homepage-section4 {
	margin-top: clamp(50px, 7vw, 100px);
}
.hp-s4-t {
	text-align: center;
}
.hp-s4-h3 {
	justify-content: center;
	text-align: center;
}
.hp-s4-p {
	text-align: start;
	margin-bottom: 25px;
}
.hp-s4-conteneurCartes {
	display: grid;
	grid-template-columns: repeat(auto-fit, 400px);
	gap: clamp(25px, 7vw, 100px);
	width: 100%;
	justify-content: center;
	margin-bottom: 50px;
}
.hp-s4-cartes {
	border-radius: 30px;
	width: 100%;
	height: auto;
	padding: 30px;
	background-color: var(--vertFond);
}
.hp-s4-cartesTitre {
	display: flex;
	align-items: center;
	gap: 10px;
}
.hp-s4-h4 {
	text-align: center;
	font-family: "Lato", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-variant-caps: small-caps;
	font-size: 30px;
	color: #fff;
}
.hp-s4-p1 {
	font-size: 20px;
	color: #fff;
	font-family: "Lato", sans-serif;
  	font-weight: 400;
  	font-style: normal;
	font-variant-caps: small-caps;
	margin-top: 25px;
}
.hp-s4-p2 {
	margin-top: 20px;
	text-align: left;
	color: #fff;
	font-size: 16px;
}
.hp-s4-icon-bottom-right {
    width: 50px; 
    height: 50px;
}
.button-s4 {
	display: flex;
	justify-content: center;
	margin-bottom: clamp(50px, 7vw, 100px);
}



/* Home-page - Section 5*/
.homepage-section5 {
	margin-top: clamp(50px, 7vw, 100px);
}
.hp-s5-h2 {
	display: flex;
	justify-content: center;
}
.hp-s5-h3 {
	margin-bottom: 70px;
	display: flex;
	justify-content: center;
	font-family: "Lato", sans-serif;
	font-weight: 300;
	font-style: normal;
	font-size: 30px;
	font-variant-caps: small-caps;
}
.hp-s5-content {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	justify-items: center;
	gap: 50px;
	position: relative;
}
.ecoute,
.audit,
.reco,
.accompagnement {
	width: 230px;
	display: flex;
	flex-direction: column;
	gap: 0;
	z-index: 2;
}
.s5-h3 { 
	margin: 0;
}
.hp-s5-titre {
	display: flex;
	gap: 15px;
	align-items: last baseline;
}
.s5-chiffres {
	font-family: "Lato", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 50px;
	color: rgba(var(--vertC-rgb), 0.2);
}
.hp-s5-h4 {
	margin: 0;
	color: #333
}
.hp-s5-p {
	margin-top: 20px;
	font-size: 15px;
	color: #333;
}
.button-s5 {
	margin-top: 50px;
	margin-bottom: 0;
	display: flex;
	justify-content: flex-end;
}


/* Home-page - Section contact */
.homepage_section6 {
	margin-top: clamp(50px, 7vw, 100px);
}
.hp_form_contact {
	display: flex;
	border-radius: 30px;
	width: 100%;
	height: auto;
	overflow: hidden;
	background-color: rgba(94, 170, 0, 0.3);
	align-items: stretch;
}
.hp_side_left {
	width: 80%;
	min-height: 400px;
	background-image: url("/images/homepage/contact.webp");
	background-size: cover;
	background-position: center;
}
.hp_side_right {
	width: 100%;
	padding: 30px;
}
.hp_form {
	width: 100%;
}
.hp_s6_titre {
	display: flex;
	justify-content: center;
}
.hp_form input[type="text"],
.hp_form input[type="email"],
.hp_form textarea {
	width: 100%;
	height: 50px;
	background-color: #f4f4f4;
	border-radius: 10px;
	border: none;
	padding: 10px;
}
.hp_case-ligne {
	display: flex;
	gap: 30px;
}
.hp_case-ligne div {
	flex: 1;
}
.hp_form_cases{
	display: flex;
	flex-direction: column;
	gap: 30px;
}
::placeholder {
	color: #333;
	font-size: 15px;
	font-family: "Lato", sans-serif;
	font-weight: 400;
	font-style: normal;
}
.button-s6{
	display: flex;
	justify-content: end;
}


/* Apropos - Section 1 - Partie 1 */
.ap-s1-partie1 {
	display: grid;
	grid-template-columns: 60% 40%;
	grid-auto-rows: auto;
	align-items: center;
	gap: 50px;
}
.ap-s1-p1-contentLeft {
	position: relative;
	width: 100%;
	height: auto;
	align-content: center;
}
.ap-s1-photo1 {
	display: block;
    position: relative;
    width: 100%;
    height: auto;
	transform: rotate(2deg);
	border-radius: 30px;
    z-index: 1;
}
.ap-s1-h1 {
	margin-top: 0;
	margin-bottom: clamp(25px, 4vw, 50px);
	font-family: 'tropiline', sans-serif;
}
.ap-s1-p {
	font-size: clamp(20px, 2vw, 25px);
	margin-top: clamp(25px, 4vw, 50px);
	margin-bottom: clamp(25px, 4vw, 50px);
}
#cta-ap-section1 {
	width: 330px;
}


/* Apropos - Section 1 - Partie 2 */
.ap-s1-partie2 {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	margin-top: clamp(25px, 7vw, 100px);
}
.ap-s1-p2-contentLeft {
	width: 100%;
	height: auto;
}
.ap-s1-p2-h2 {
	text-align: center;
	margin-bottom: 25px;
}
.ap-s1-p2-h3 {
	margin-bottom: 25px;
}
.ap-s1-p2-p {
	margin-bottom: 15px;
	font-size: 18px;
}


/* Apropos - Section 1 - Partie 3 */
.ap-s1-partie3 {
	display: flex;
	margin-top: clamp(10px, 4vw, 50px);
}
.ap-s1-p3-contentRight {
	width: 100%;
	height: auto;
	align-items: center;
}
.ap-s1-p3-h3 {
	margin-bottom: 25px;
}
.ap-s1-p3-p {
	margin-bottom: 15px;
	font-size: 18px;
}


/* Apropos - Section 1 - Partie 4 */
.aPropos-section1-partie4 {
	width: 100%;
	height: auto;
	margin-top: clamp(25px, 4vw, 50px);
	padding: 25px 0 25px 0;
	background-color: #f4f4f4;
}
.ap-s1-p4-h3 {
	display: flex;
	justify-content: center;
	margin-left: auto;
    margin-right: auto;
    text-align: center;
	margin-bottom: 25px;
}
.ap-s1-p4-h3p {
	width: 100%;
	height: auto;
	display: flex;
	justify-content: center;
	text-align: center;
}
.ap-s1-p4-contentIcone {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	justify-items: center;
	margin: clamp(20px, 4vw, 50px);
}
.ap-s1-p4-icone {
	display: flex;
	flex-direction: column;
	gap: 20px;
	align-items: center;
	text-align: center;
}
.ap-s1-p4-icarr {
	display: flex;
	justify-content: center;
	align-content: center;
	width: 120px;
	height: 120px;
	background-color: #f4f4f4;
	box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
	border-radius: 20px;
}
.iconeTransparence,
.iconeInclusion,
.iconeEnvironnement {
	width: 90px;
	height: auto;
}

.ap-s1-p4-contentPg {
	display: flex;
	justify-content: center;
	text-align: center;
}


/* Apropos - Section 2 */
.aPropos-section2 {
	margin-top: clamp(50px, 7vw, 100px);
}
.ap-s2-h2 {
	margin-bottom: 50px;
}
.ap-s2-contentBox1 {
	display: flex;
	justify-content: center;
	gap: 100px;
	margin-bottom: 50px;
}
.ap-s2-box {
	padding: 30px;
	width: 550px;
	height: auto;
	background-color: var(--vertFond);
	border-radius: 30px;
	border: 2px solid transparent;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.ap-s2-h3 { 
	color: #fff;
	margin-bottom: clamp(20px, 4vw, 50px);
}
.ap-s2-icone {
	width: 100px;
	height: 100px;
	background-color: var(--vertFond);
	box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
	border-radius: 20px;
	flex-shrink: 0;
	display: flex;
	justify-content: center;
	align-content: center;
	margin-bottom: clamp(20px, 4vw, 50px);
}
.ap-s2-icone1 {
	width: 80px;
	height: auto;
}
.ap-s2-p {
	color: #fff;
}
.ap-s2-contentBox2 {
	display: flex;
	justify-content: center;
}
.ap-s2-rectVert {
	width: 1200px;
	height: auto;
	background-color: var(--vertFond);
	border-radius: 30px;
	padding: 50px;
}
.ap-s2-h3 {
	display: flex;
	justify-content: center;
	color: #fff;
}
.ap-s2-echelle {
	display: flex;
	justify-content: center;
	gap: 20px;
	color: #fff;
	margin-bottom: 50px;
}
.iconeS2 {
	width: 10px;
	height: auto;
}
.ap-s2-h4 {
	font-size: 25px;
}


/* Apropos - Section 3 partie 1 */
.aPropos-section3 {
	margin-top: clamp(50px, 7vw, 100px);
}
.ap-s3-contentRond {
	position: relative;
	margin-left: 40px;
}
.ap-s3-rond1,
.ap-s3-rond2,
.ap-s3-rond3 {
	display: flex;
	gap: 25px;
}
.ap-s3-rond1 {
	margin-left: 150px;
}
.ap-s3-rond2 {
	transform: translateY(-120px);
	margin-left: 200px;
}
.ap-s3-rond3 {
	margin-left: 400px;
	transform: translateY(-80px);
}
.rondIcone {
	width: 250px;
	height: 250px;
	background-color: #f4f4f4;
	box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.2);
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 150px;
	z-index: 2;
}
.ap-s3-icone {
	width: 150px;
	height: auto;
}
.ap-s3-h4 {
	margin-bottom: 10px;
	letter-spacing: 1px;
}
#ap-s3-text1 {
	position: relative;
}
#ap-s3-text1::before {
	position: absolute;
	content: '';
	left: 0;
	background-color: var(--vertC);
	width: 3px;
	height: 55px;
	transform: translateX(-10px);
	z-index: 1;
}
#ap-s3-text1::after {
	position: absolute;
	content: '';
	left: -60px;
	top: 30px;
	background-color: var(--vertC);
	width: 50px;
	height: 3px;
	transform: skewY(-15deg);
	z-index: 1;
}
#ap-s3-text2 {
	display: flex;
	flex-direction: column;
	text-align: end;
	justify-content:  flex-end;
	position: relative;
}
#ap-s3-text2::before {
	position: absolute;
	content: '';
	right: 0;
	background-color: var(--vertC);
	width: 3px;
	height: 55px;
	transform: translateX(10px);
	z-index: 1;
}
#ap-s3-text2::after {
	position: absolute;
	content: '';
	right: -57px;
	bottom: 30px;
	background-color: var(--vertC);
	width: 50px;
	height: 3px;
	transform: skewY(-15deg);
	z-index: 1;
}
#ap-s3-text3 {
	display: flex;
	flex-direction: column;
	justify-content:  flex-end;
	margin-bottom: 30px;
	margin-left: 20px;
	position: relative;
}
#ap-s3-text3::before {
	position: absolute;
	content:'';
	left: 0;
	transform: translateX(-10px);
	width: 3px;
	height: 55px;
	background-color: var(--vertC);
	z-index: 1;
}
#ap-s3-text3::after {
	position: absolute;
	content: '';
	left: -60px;
	bottom: 30px;
	background-color: var(--vertC);
	width: 50px;
	height: 3px;
	transform: skewY(15deg);
	z-index: 1;
}


/* Apropos - Section 3 partie 2 */
.ap-s3-partie2 {
	width: 100%;
	height: auto;
	
	background-color: var(--vertFond);
	padding-top: clamp(25px, 4vw, 50px);
	padding-bottom: clamp(25px, 4vw, 50px);
}
.ap-s3-p2-h3 {
	color: #fff;
}
.ap-s3-p2-iconeText {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	justify-content: center;
	gap: clamp(50px, 11vw, 150px);
	margin-bottom: 50px;
}
.ap-s3-p2-casier1,
.ap-s3-p2-casier2,
.ap-s3-p2-casier3 {
	display: flex;
	flex-direction: column;
	align-content: center;
	align-items: center;
}
.ap-s3-p2-carr {
	width: 80px;
	height: 80px;
	background-color: var(--vertFond);
	box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
	border-radius: 20px;
	flex-shrink: 0;
	display: flex;
	justify-content: center;
	align-items: center;
}
.ap-s3-p2-icone {
	width: 50px;
	height: auto;
}
.ap-s3-p2-iconep {
	color: #fff;
	text-align: center;
	font-size: 18px;
	margin-top: 25px;
}
.ap-s3-p2-p {
	margin-top: 50px;
}
.ap-s3-p2-p2 {
	color: #fff;
}


/* A propos - Section 4 */
.aPropos-section4 {
	margin-top: clamp(50px, 7vw, 100px);
}
.ap_form_contact {
	display: flex;
	border-radius: 30px;
	width: 100%;
	height: auto;
	overflow: hidden;
	background-color: rgba(94, 170, 0, 0.3);
	align-items: stretch;
}
.ap_side_left {
	width: 80%;
	min-height: 400px;
	background-image: url("/images/a_propos/contact.webp");
	background-size: cover;
	background-position: center;
}
.ap_side_right {
	width: 100%;
	padding: 30px;
}
.ap_form {
	width: 100%;
}
.ap_s6_titre {
	display: flex;
	justify-content: center;
}
.ap_form input[type="text"],
.ap_form input[type="email"],
.ap_form input[type="tel"],
.ap_form textarea {
	width: 100%;
	height: 50px;
	background-color: #f4f4f4;
	border-radius: 10px;
	border: none;
	padding: 10px;
}
.ap_case-ligne {
	display: flex;
	gap: 30px;
}
.ap_case-ligne div {
	flex: 1;
}
.ap_form_cases{
	display: flex;
	flex-direction: column;
	gap: 30px;
}
::placeholder {
	color: #333;
	font-size: 15px;
	font-family: "Lato", sans-serif;
	font-weight: 400;
	font-style: normal;
}
.ap-button-s4{
	display: flex;
	justify-content: end;
}


/* Mes services - Section 1*/
.mesServices-section1 {
	background-image: url('/images/mes_services/Fichier-9.webp');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	margin-top: -200px;
	padding-top: 200px;
	width: 100%;
	height: 800px;
}
.ms-s1-content {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	margin-right: 0;
}
.ms-h1 {
	margin-bottom: 20px;
}
.ms-s1-texte {
	margin-top: 200px;
}
#ms-s1-btn {
	width: 200px;
	margin-top: 20px;
}
.ms-s1-p {
	width: 700px;
}


/*Mes services - Section 2*/
.mesServices-section2 {
	margin-top: clamp(50px, 7vw, 100px);
}
.ms-s2-h2 {
	display: flex;
	justify-content: center;
}
.ms-s2-carte1 {
	background-color: #fff;
	border: 3px solid var(--vertFond);
	border-radius: 30px;
	position: relative;
	padding: 30px;
}
.carrGratuit {
	position: absolute;
	width: 170px;
	height: 40px;
	border-radius: 5px;
	background-color: var(--vertFond);
	display: flex;
	justify-content: center;
	align-items: center;
	left: 50%;                   
  	bottom: 0;                   
  	transform: translate(-50%, 50%);
}
.ms-s2-grat {
	font-family: "Lato", sans-serif;
  	font-weight: 900;
  	font-style: normal;
	color: #fff;
	font-size: 20px;
}
.ms-s2-services {
	display: grid;
  	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  	gap: 2.5rem;
	width: 100%;
	margin: 0 auto;
	padding: 0 4rem;
}
.ms-s2-carte2 {
	background-color: var(--vertFond);
	border-radius: 30px;
	box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
	padding: 30px;
	color: #fff;
}
.ms-s2-img {
	display: flex;
	justify-content: center;
	margin: 30px;
}
.ms-s2-icone {
	width: 100px;
	height: auto;
}
.ms-s2-h31 {
	font-family: "Lato", sans-serif;
  	font-weight: 900;
  	font-style: normal;
	font-size: 26px;
	margin-bottom: 25px;
}
.ms-s2-h3 {
	color: #fff;
	font-family: "Lato", sans-serif;
  	font-weight: 900;
  	font-style: normal;
	font-size: 26px;
	margin-bottom: 25px;
}
ul.ms-s2-ul {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
li.ms-s2-puces {
	list-style: none;
	font-family: "Lato", sans-serif;
  	font-weight: 400;
  	font-style: normal;
}
li.ms-s2-puces::before {
	content: "";
	display: inline-block;
	width: 15px;
	height: 15px;
	background-image: url('/images/mes_services/puce.svg');
	background-size: contain;
  	background-repeat: no-repeat;
	margin-right: 10px;
}
.ms-s2-btn {
	display: flex;
	justify-content: center;
	margin-top: 50px;
}


/* Mes services - Section 3*/
.mesServices-section3 {
	margin-top: clamp(50px, 7vw, 100px);
	background-color: #f4f4f4;
	width: 100%;
	height: auto;
	padding-top: clamp(25px, 4vw, 50px);
	padding-bottom: clamp(25px, 4vw, 50px);
	z-index: 1;
}
.ms-s3-h2 {
	display: flex;
	justify-content: center;
	margin-bottom: 25px;
}
.ms-s3-cercleExpert {
	display: flex;
	justify-content: center;
}
.imgExpertises {
	width: 800px;
	height: auto;
}
.ms-s3-carteExpert {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 30px;
	justify-items: center;
}
.ms-s3-card {
	width: 100%;
	max-width: 450px;
	height: auto;
	background-color: #fff;
	box-shadow: 0 0 10px 2px rgba(var(--vertC-rgb), 0.3);
	padding: 30px;
	border-radius: 30px;
	z-index: 2;
}
.titreCarte {
	display: flex;
	justify-content: center;
}
.ms-s3-h3 {
	text-align: center;
	margin-bottom: 20px;
}
.carteP1 {
	text-align: center;
	margin-bottom: 20px;
}
.ms-s3-problematique {
	margin-bottom: 20px;
	z-index: 4;
}
.ms-s3-prob {
	font-family: "Lato", sans-serif;
	font-weight: 900;
	font-style: normal;
	letter-spacing: 1px;
}
.ms-s3-p2{
	font-size: 16px;
}


/* mesService - Section 4 */
.mesServices-section4 {
	background-color: var(--vertFond);
	width: 100%;
	padding: 50px;
	margin-top: clamp(50px, 7vw, 100px);
}
.illuContact {
	position: absolute;
	left: 0;
	width: 600px;
	height: auto;
	pointer-events: none;
}
.ms-s4-content {
	display: flex;
	flex-direction: column;
	align-items: end;
}
.contentTexte {
	width: 800px;
	height: auto;
	display: flex;
	flex-direction: column;
}
.ms-s4-h2,
.ms-s4-h3 {
	color: #fff;
}
.contentBas {
	width: 100%;
	height: auto;
	padding: 0 100px;
}
.contentBas input[type="text"],
.contentBas input[type="email"],
.contentBas input[type="tel"],
.contentBas textarea {
	width: 100%;
	height: 50px;
	background-color: #f4f4f4;
	border-radius: 100px;
	border: none;
	padding-left: 20px;
}
.ms-s4-caseLigne {
	display: flex;
	gap: 50px;
}
.ms-s4-caseLigne div {
	flex: 1;
}
.ms-s4-caseSolo textarea {
	height: 100px;
	border-radius: 30px;
}
.ms-s4-formCases {
	display: flex;
	flex-direction: column;
	gap: 30px;
}
::placeholder {
	color: #333;
	font-size: 15px;
	font-family: "Lato", sans-serif;
	font-weight: 400;
	font-style: normal;
}
.ms-s4-button {
	display: flex;
	justify-content: end;
}
#cta-s4-button {
	box-shadow: none;
}
.sr-only {
  	position: absolute;
  	width: 1px;
  	height: 1px;
  	padding: 0;
  	margin: -1px;
  	overflow: hidden;
  	clip: rect(0, 0, 0, 0);
  	white-space: nowrap;
  	border-width: 0;
}


/* Contact - Section 1 */
.mesServices-section4 {
	margin-top: clamp(50px, 7vw, 100px);
}
.co-rectangleGris {
	width: 100%;
	height: auto;
	background-color: #f4f4f4;
	border-radius: 50px;
}
.co-s1-titre {
	display: flex;
	justify-content: center;
}
.co-s1-h2 {
	padding: 0 50px;
	margin-top: 50px;
}
.co-s1-formContact {
	padding: 0 50px;
}
.co-caseLigne1,
.co-caseLigne2 {
	display: flex;
	gap: 50px;
}
.co-caseLigne1 > div,
.co-caseLigne2 > div {
	flex: 1;
}
.co-cases input[type="text"],
.co-cases input[type="email"],
.co-cases textarea {
	width: 100%;
	height: 50px;
	border-radius: 10px;
	background-color: #fff;
	border: none;
	padding-left: 20px;
}
.co-cases {
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.co-caseSolo textarea {
	width: 100%;
	height: 200px;
}
.co-button-s1 {
	display: flex;
	justify-content: center;
	margin-bottom: 50px;
}
.co-s1-infoPro {
	width: 100%;
	height: auto;
	margin-top: -20px;
}
.co-s1-casiers {
	width: 100%;
	display: flex;
	justify-content: space-around;
	top: -25px;
	transform: translateY(-25px);
}
.coMail,
.coTel,
.coSocial {
	display: flex;
	flex-direction: column;
	align-items: center; /* pictos et titre centrés */
	padding-top: 20px;
	gap: 20px;
	width: 300px;
	height: 230px;
	border-radius: 20px;
	background-color: var(--vertFond); /* changer pour chaque bloc */
}

.coPicto {
	width: 50px;
	height: 50px;
	border-radius: 50px;
	background-color: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
}
.coTelephone {
	width: 25px;
	height: auto;
}
.coEmail {
	width: 25px;
	height: auto;
}
.coRSociaux {
	width: 25px;
	height: auto;
}
.co-s1-h3 {
	display: flex;
	justify-content: center;
	text-align: center;
	width: 100%;
}
.co-s1-h3t {
	color: #fff;
	font-size: 22px;
	margin: 0;
	line-height: 1.2;
}
.co-s1-p {
	width: 100%;         
}
.co-s1-pp {
	text-align: left;     
	margin: 0;
	margin-left: 30px;         
	color: #fff;
	font-size: 15px;
}
#messageBox {
  color: var(--vertC);
  font-family: 'lato', sans-serif;
  font-weight: 900;
  font-size: 1rem;

  margin-top: 20px;   
  text-align: center; 
  display: block;      
}


/*Mentions Légales*/
.ml-h1 {
	display: flex;
	justify-content: center;
}
.ml-h2 {
	padding-left: clamp(25px, 4vw, 50px);
	margin-top: 40px;
	font-size: 30px;
}
.ml-list {
	list-style: circle;
	font-optical-sizing: auto;
	font-family: "Lato", sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: clamp(10px, 1vw, 20px);
	color: #333333;
}


/*Politique de confidentialité*/
.pc-h1 {
	display: flex;
	justify-content: center;
}
.pc-h2 {
	padding-left: clamp(25px, 4vw, 50px);
	margin-top: 40px;
}


/*CGV*/
.cgv-h1 {
	display: flex;
	justify-content: center;
	text-align: center;
}
.cgv-h2 {
	padding-left: clamp(25px, 4vw, 50px);
	margin-top: 40px;
}
.cgv-list {
	list-style: circle;
	font-optical-sizing: auto;
	font-family: "Lato", sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: clamp(10px, 1vw, 20px);
	color: #333333;
}
.cgv-h3 {
	margin-bottom: 10px;
	margin-top: 20px;
}


/*404*/
.error-section {
	text-align: center;
	padding: 100px 20px;
}
.error-h1 {
	font-size: 4rem;
}
.error-p {
	margin: 30px 0;
}
.error-btn {
	display: flex;
	justify-content: center;
	gap: 20px;
}


/* footer */
.main-footer {
	margin-top: clamp(50px, 7vw, 100px);
	width: 100%;
	height: auto;
	padding-top: 100px;
	padding-bottom: 10px;
	background-color: #333333;
	position: relative;
}
.contenu-f {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.logo-cb-blanc {
	width: 150px;
	height: auto;
}
.f-p {
	font-family: "Lato", sans-serif;
	font-weight: 300;
	font-style: normal;
	color: #fff;
	font-size: 17px;
	letter-spacing: 2px;
}
.f-menu ul {
	list-style: none;
	display: flex;
	padding: 0;
	margin: 0;
	flex-direction: column;
	gap: 6px;
}
.f-menu li a {
	cursor: pointer;
	font-family: "Lato", sans-serif;
  	font-weight: 300;
  	font-style: normal;
	font-size: 17px;
	color: #fff;
	text-decoration: none;
	transition: color 0.3s ease;
}
.f-menu li a:hover {
  color: var(--vertC); 
}
.f-menu li a:hover::after {
  width: 100%;
}
.f-menu2 {
	margin-top: 20px;
	cursor: pointer;
	font-family: "Lato", sans-serif;
  	font-weight: 300;
  	font-style: normal;
	font-size: 17px;
	color: #fff;
	text-decoration: none;
}
.f-liens {
	color: #fff;
	cursor: pointer;
	text-decoration: none;
	transition: color 0.3s ease;
}
.f-menu:hover {
	color: var(--vertC);
}
.footer-bottom {
	text-align: center;
	color: #fff;
	margin-top: 79px;
	font-size: 12px;
}
#phraseFin {
	color: #fff;
	font-size: 12px;
}


/* Tablette */
@media (min-width: 481px) and (max-width: 900px) {
	.main-content-wrapper {
		width: 80%;
		height: auto;
	}

	
/*Header*/
	.header-right {
    	display: none;
  	}
	.burgerButton {
		display: flex;
	}
	.main-header {
    	flex-wrap: wrap;
    	padding: 10px 20px;
  	}
  	.header-center {
    	display: flex;
    	justify-content: flex-end; /* 🔥 pousse à droite */
    	align-items: center;
  	}
	.main-menu {
		margin-top: 20px;
		flex-direction: column;
		gap: 50px;
	}
	.btnContact {
		display: block;
	}
	.desktop-menu {
    	display: none;
  	}
	.header-right {
    	display: none;
  	}
	.hp-s2-p2-carrIcones {
		transition: none;
	}
	.hp-s2-p2-carrIcones:hover {
		transform: none;
		background-color: transparent;
  		border-radius: 0;
	}
	.hp-s2-p2-icones {
		transition: none;
	}
	.ap-s2-contentBox2 {
		width: 100%;
		height: auto;
	}
	.ap-s2-rectVert {
		border-radius: 10px;
	}
	.ap-s2-echelle {
		display: flex;
		align-items: center;
		flex-direction: column;
	}
	.iconeS2 {
		transform: rotate(90deg);
	}
	.aPropos-section3 {
		margin-top: clamp(50px, 7vw, 100px); 
	}
	.ap-s3-contentRond,
	.ap-s3-rond1,
	.ap-s3-rond2,
	.ap-s3-rond3 {
		margin: 0;
	}
	.ap-s3-contentRond {
		width: 100%;
		height: auto;
	}
	.ap-s3-icone {
		width: 80px;
		height: 80px;
	}
	.rondIcone {
		width: 160px;
		height: 160px;
	}
	.ap-s3-rond2 {
		margin-top: 130px;
	}
	#ap-s3-text2 {
		width: 400px;
	}

	
/*Homepage - Footer*/
	.main-footer {
		margin-top: 50px;
		padding: 0;
	}
	.contenu-f {
		width: 100%;
		height: auto;
		display: flex;
		flex-direction: column;
		padding: 0;
	}
	.logo-cb-blanc {
		width: 100px;
		height: auto;
		display: flex;
		justify-content: center;
		margin-top: 25px;
	}
	.slogan {
		width: 100%;
		height: auto;
		text-align: center;
		margin-bottom: 50px;
	}
	.f-p {
		font-size: 12px;
	}
	.f-menu {
		align-items: flex-start;
		margin-right: auto;
	}
	.footer-bottom {
		margin-top: 50px;
	}


/*Messervices-partie 1*/
	.mesServices-section1 {
		height: 550px;
  		background-position: left;
  		background-repeat: no-repeat;
  		background-size: cover;
  		display: flex;
	}
	.ms-s1-content {
		width: 60%;
		height: auto;
		background-color: rgba(255, 255, 255, 0.8);
		border-radius: 10px;
		margin-left: auto;
		padding: 20px;
		display: flex;
  		flex-direction: column;
  		justify-content: space-between;
  		height: auto;
		box-sizing: border-box;
	}
	.ms-s1-texte {
		margin: 0;
		width: 100%;
		height: auto;
		box-sizing: border-box;
	}
	.ms-s1-p {
  		overflow-wrap: break-word; 
  		word-break: break-word; 
  		max-width: 100%;
	}
	#ms-s1-btn {
		width: 100%;
	}


/*Mes services section 4*/
	.mesServices-section4 {
		margin: 50px 0;
		padding: 0;
	}
	.backgroundBleu {
		padding: 25px 0;
		width: 100%;
		height: auto;
	}
	.contentHaut {
		display: flex;
		flex-direction: column;
	}
	.illuContact {
		margin-left: 0px;
		width: 100%;
	}
	.contentTexte {
		margin: 25px 0;
	}
	.ms-s4-h3 {
		margin-bottom: 0;
	}
	.contentBas {
		padding: 0;
	}


/*Page contact*/
	.co-rectangleGris {
		border-radius: 20px;
	}
	.co-s1-casiers {
		margin-top: 50px;
		display: flex;
		flex-direction: column;
		gap: 50px;
		align-items: center;
		top: 0;
		transform: translateY(0);
	}
}


/* Mobile */
@media (max-width: 480px) {
	.main-content-wrapper {
		width: 90%;
		height: auto;
	}


	/*HEADER*/
	.header-right {
    	display: none;
  	}
	.burgerButton {
		display: flex;
	}
	.main-header {
    	flex-wrap: wrap;
    	padding: 10px 20px;
  	}
  	.header-center {
    	display: flex;
    	justify-content: flex-end; /* 🔥 pousse à droite */
    	align-items: center;
  	}
	.main-menu {
		margin-top: 20px;
		flex-direction: column;
		gap: 50px;
	}
	.btnContact {
		display: block;
	}
	.desktop-menu {
    	display: none;
  	}
	.header-right {
    	display: none;
  	}


	/* Homepage - Section1 */
	.hp-s1-photo {
		display: none;
	}
	.hp-s1-h1 {
		text-align: center;
		line-height: 0.8;
	}
	.hp-s1-rectGris {
		margin-left: none;
		margin-right: none;
	}
	.hp-s1-columns {
		grid-template-columns: 1fr;
	}

	/* Homepage - Section 2 */
	.hp-s2-p2-carrIcones {
		transition: none;
	}
	.hp-s2-p2-carrIcones:hover {
		transform: none;
		background-color: transparent;
  		border-radius: 0;
	}
	.hp-s2-p2-icones {
		transition: none;
	}


	/*Homepage - Section 3*/

	.rondgris {
		transition: none;
	}
	.rondgris:hover {
		transform: none;
	}
	.hp-s3-icone {
		transition: none;
	}
	.hp-s3-icone:hover {
		transform: none;
	}


/*Homepage - Section 4*/
	.hp-s4-t {
		margin-top: 50px;
	}
	.hp-s4-conteneurCartes {
		width: 100%;
		height: auto;
		display: flex;
		flex-direction: column;
		gap: 25px;
		margin-bottom: 25px;
	}
	.hp-s4-flip-card {
		height: 50%;
		perspective: none;
		overflow: visible;
		box-shadow: none;
	}
	.hp-s4-flip-card-inner {
		transform: none;
		transition: none;
	}
	.hp-s4-flip-card:hover .hp-s4-flip-card-inner {
    	transform: none;
  	}
	.hp-s4-flip-card-front, 
	.hp-s4-flip-card-back {
    	position: relative;
    	transform: none;
    	backface-visibility: visible;
  	}
	.hp-s4-flip-card-front {
		border-radius: 10px;
	}
	.hp-s4-flip-card-back {
		padding-top: 50px;
		height: auto;
		border-top-left-radius: 0;
		border-top-right-radius: 0;
		border-bottom-left-radius: 10px;
		border-bottom-right-radius: 10px;
		top: -25px;
		z-index: -1;
	}
	.hp-s4-icon-bottom-right {
		width: 0;
		height: auto;
	}


/*Homepage - Section 5*/
	.hp-s5-h2,
	.hp-s5-h3 {
		text-align: center;
	}
	.hp-s5-h3 {
		margin-bottom: 25px;
	}
	.hp-s5-conteneur {
		width: 100%;
		padding: 30px;
	}
	.hp-s5-content {
		display: flex;
		flex-direction: column;
		gap: 30px;
		width: 80%;
	}
	.hp-s5-content::before {
		width: 1px;
		height: 410px;
		top: 0;
	}
	.ecoute,
	.audit,
	.reco,
	.accompagnement {
		margin-left: 10px;
	}
	.hp-s5-chifH4 {
		display: flex;
		margin-bottom: 10px;
	}
	.hp-s5-h4 {
		font-size: 20px;
		margin: 0;
		padding-left: 15px;
	}
	.button-s5 {
		display: flex;
		justify-content: center;
	}


	/*Homepage - Section 6*/
	.hp_form_contact {
		margin-top: 50px;
		display: flex;
		flex-direction: column;
	}
	.hp_side_left {
		width: 100%;
		min-height: 200px;
	}
	.button-s6 {
		display: flex;
		justify-content: center;
	}


	/*MesServices - Section 1*/
	.mesServices-section1 {
		height: 550px;
  		background-position: left;
  		background-repeat: no-repeat;
  		background-size: cover;
  		display: flex;
	}
	.ms-s1-content {
		width: 60%;
		height: auto;
		background-color: rgba(255, 255, 255, 0.8);
		border-radius: 10px;
		margin-left: auto;
		padding: 20px;
		display: flex;
  		flex-direction: column;
  		justify-content: space-between;
  		height: auto;
		box-sizing: border-box;
	}
	.ms-s1-texte {
		margin: 0;
		width: 100%;
		height: auto;
		box-sizing: border-box;
	}
	.ms-s1-p {
  		overflow-wrap: break-word; 
  		word-break: break-word; 
  		max-width: 100%;
	}
	#ms-s1-btn {
		width: 100%;
	}


	/*MesServices - Section 2*/
	.ms-s2-services {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
		gap: 2rem;
		width: 100%;
		padding: 0 1.5rem;
		box-sizing: border-box;
	}
	.ms-s2-btn {
		margin: 25px 0 50px 0;
	}


	/*MesServices - Section 2 - Partie 1*/
	#mesServices-mesExpertises {
		padding-top: 50px;
		width: 100%;
		height: auto;
	}
	.ms-s3-h2 {
		margin: 0 0 50px 0;
	}
	.ms-s3-h3 {
		font-size: 20px;
	}
	.iconeSC {
		width: 50px;
		height: auto;
	}
	

	/*MesServices - Section4 */
	.mesServices-section4 {
		margin: 50px 0;
		padding: 0;
	}
	.backgroundBleu {
		padding: 25px 0;
		width: 100%;
		height: auto;
	}
	.contentHaut {
		display: flex;
		flex-direction: column;
	}
	.illuContact {
		margin-left: 0px;
		width: 100%;
	}
	.contentTexte {
		margin: 25px 0;
	}
	.ms-s4-h3 {
		margin-bottom: 0;
	}
	.contentBas {
		padding: 0;
	}


	/*A_Propos - Section1 partie1 */
	.ap-s1-partie1 {
		grid-template-columns: 1fr;
		gap: 0;
	}
	.ap-s1-photo1 {
		display: none;
	}
	#cta-ap-section1 {
		width: 200px;
	}


	/* A_Propos - Section1 - partie3 */
	.ap-s1-partie3 {
		width: 100%;
		height: auto;
		display: flex;
		flex-direction: column-reverse;
	}
	.ap-s1-p3-contentLeft {
		transform: none;
	}
	.ap-s1-p3-contentLeft {
		transform: translateX(-20px);
	}
	.ap-s1-p3-contentRight {
		width: 100%;
		height: auto;
	}
	#ap-s1-p3-p1 {
		margin-bottom: 25px;
	}
	.ap-s1-photo3 {
		width: 150px;
		height: auto;
	}


	/* A_Propos - Section1 - partie 4 */
	.aPropos-section1-partie4 {
		margin: 25px 0 50px 0;
		width: 100%;
		height: auto;
		padding: 0;
	}
	.ap-s1-partie4 {
		padding: 25px 0;
	}
	.ap-s1-p4-contentTitre {
		width: 100%;
		height: auto;
	}
	.ap-s1-p4-contentIcone {
		width: 100%;
		height: auto;
		margin: 25px 0;
		display: flex;
		flex-direction: column;
		gap: 30px;
	}
	.iconeTransparence,
	.iconeSobriete,
	.iconeEnvironnement {
		margin-bottom: 15px;
	}


	/* A_Propos - Section 2 */
	.ap-s2-contentBox1 {
		display: flex;
		flex-direction: column;
		gap: 50px;
	}
	.ap-s2-h2 {
		margin-bottom: 25px;
	}
	.ap-s2-box1,
	.ap-s2-box2 {
		width: 100%;
		height: auto;
		border-radius: 10px;
	}
	.ap-s2-icone1 {
		margin-bottom: 25px;
	}
	.ap-s2-contentBox2 {
		width: 100%;
		height: auto;
	}
	.ap-s2-rectVert {
		border-radius: 10px;
	}
	.ap-s2-echelle {
		display: flex;
		align-items: center;
		flex-direction: column;
	}
	.iconeS2 {
		transform: rotate(90deg);
	}


	/* A_Propos - Section 3 */
	.aPropos-section3 {
		margin: 50px 0;
	}
	.ap-s3-contentRond,
	.ap-s3-rond1,
	.ap-s3-rond2,
	.ap-s3-rond3 {
		margin: 0;
	}
	.ap-s3-contentRond {
		width: 100%;
		height: 290px;
	}
	.ap-s3-icone {
		width: 40px;
		height: 40px;
	}
	.rondIcone {
		width: 80px;
		height: 80px;
	}
	.ap-s3-rond2 {
		margin-top: 130px;
	}
	#ap-s3-text2 {
		width: 250px;
	}


	/* A_Propos - Section 3 partie 2 */
	.ap-s3-partie2 {
		margin: 50px 0;
		padding: 25px 0;
	}
	.ap-s3-p2-iconeText {
		width: 100%;
		height: auto;
		display: flex;
		flex-direction: column;
		gap: 50px;
	}
	.ap-s3-p2-iconep {
		width: 100%;
	}
	.ap-s3-p2-casier1,
	.ap-s3-p2-casier2,
	.ap-s3-p2-casier3 {
		width: 100%;
		height: auto;
	}


	/*aPropos - contact*/
	.aPropos-section4 {
		margin-bottom: 50px;
	}
	.ap_form_contact {
		display: flex;
		flex-direction: column;
	}
	.ap_side_left {
		width: 100%;
		height: 200px;
	}


	/*Contact*/
	.co-rectangleGris {
		border-radius: 20px;
	}
	.co-s1-casiers {
		margin-top: 50px;
		display: flex;
		flex-direction: column;
		gap: 50px;
		align-items: center;
		top: 0;
		transform: translateY(0);
	}

	/*Homepage - Footer*/
	.main-footer {
		margin-top: 50px;
		padding: 0;
	}
	.contenu-f {
		width: 100%;
		height: auto;
		display: flex;
		flex-direction: column;
		padding: 0;
	}
	.logo-cb-blanc {
		width: 100px;
		height: auto;
		display: flex;
		justify-content: center;
		margin-top: 25px;
	}
	.slogan {
		width: 100%;
		height: auto;
		text-align: center;
		margin-bottom: 50px;
	}
	.f-p {
		font-size: 12px;
	}
	.f-menu {
		align-items: flex-start;
		margin-right: auto;
	}
	.footer-bottom {
		margin-top: 50px;
	}
}