/***** banner : texte + photos *****/
.banner_txt_img 								{ position: relative; overflow: hidden; padding: 140px 0 40px 0;}	
.banner_txt_img .container						{ display: grid; grid-template-columns: 1fr 65%; grid-gap: 80px; align-items: center;}
.banner_txt_img .img   							{ position: relative; z-index: 5;}
.banner_txt_img:before 							{ width: 100%; height: 100%; position: absolute; left: 50%; bottom: 15%; background-color: #012255; z-index: -1; transition: none; content: "";}

.banner_txt_img .img picture 					{ position: relative; display: block;}
.banner_txt_img .img img  						{ width: 100%; height: auto; object-fit: cover; position: relative; display: block; border-radius: var(--allImgBR); aspect-ratio: 3/2;}
.banner_txt_img .txt 							{ position: relative; text-align: right;}
.banner_txt_img .txt .wrap  					{ max-width: none; text-align: left;}
.banner_txt_img .txt .wrap>:first-child			{ margin-bottom: 5px;}

@media (max-width:1500px) {
.banner_txt_img:before                          { left: 45%;}
.macaron										{ transform: scale(0.80);}
}
@media (max-width:1366px) {
.macaron										{ transform: scale(0.70);}
.banner_txt_img .txt .wrap>:first-child			{ margin-bottom: 0;}
}


@media (max-width:1200px) {
.banner_txt_img 								{ padding-top: 140px;}
.banner_txt_img .container						{ grid-gap: 40px;}


}
@media (max-width:1000px) {
.banner_txt_img .container						{ grid-template-columns: 1fr;}
.banner_txt_img .img   							{ grid-area: 1;}
.banner_txt_img .img img                        { height: 60vh;}
.banner_txt_img .txt .wrap   					{ text-align: center;}
.banner_txt_img:before 							{ left:0; bottom: 50%;}
.banner_txt_img .txt .wrap>:first-child			{ position: absolute; top: -200px; left: 30px; z-index: 500; border-radius: 10px; border: 10px solid #fff; background: #fff;}

}
@media (max-width:700px) {
.banner_txt_img 								{ padding-top: 100px;}
.banner_txt_img  a								{ width:100%}
.banner_txt_img .container						{ grid-gap: 30px;}
.banner_txt_img .txt .wrap   					{ text-align: center;}
}





/***** Services *****/
.services 											{ position: relative; margin: var(--marginTB);}
.services:before									{ position: absolute; left: 20px; right: 60%; top: 25%; bottom: 0; background: var(--bgColorDark); border-radius: 0; visibility: hidden; transition: none; content: "";}
.services .container	                        	{ display: grid; grid-template-columns: 50% 1fr; grid-gap: 0 80px; align-items: center; position: relative;}
.services .container>.item							{ position: relative;}
.services .container>.item :last-child 				{ margin-bottom: 0;}
.services .container .txt .wrap						{ display: inline-block; text-align: left; max-width: 520px;}
.services .container img 							{ width: 100%; height: auto; object-fit: cover; display: block; position: relative; z-index: 10; border-radius: var(--allImgBR);}
.services .container p               				{ margin-bottom: 15px;}
.services .container .link							{ margin-top: 10px;}
.services .container .multi_links					{ display: grid; grid-template-columns: 140px 140px; grid-gap: 10px; margin-top: 25px;}
.services .container .multi_links .link				{ margin: 0; text-align: center; padding: 0;}

.services.reverse:before							{ left: 60%; right: 20px; top: 25%; bottom: -10%; background: var(--bgColorDark); border-radius: 0; visibility: visible; content: "";}
.services.reverse .container 						{ grid-template-columns: 1fr 50%;}
.services.reverse .container>.item:last-child		{ grid-area: 1 / 1;}
.services.reverse .container>.item:first-child      { grid-area: 1 / 2;}
.services.reverse .container .txt					{ text-align: right;}
.services.align_top .container                		{ align-items: start;}

@media (max-width:1200px) { 
.services .container	                        	{ grid-gap: 0 60px;}
}
@media (max-width:1000px) { 
.services .container 								{ grid-template-columns: 1fr; grid-gap: 40px;}
.services .container .txt .wrap						{ max-width: none;}

.services.reverse .container 						{ grid-template-columns: 1fr;}
.services.reverse .container>.item:last-child		{ grid-area: 2;}
.services.reverse .container>.item:first-child      { grid-area: 1;}
}
@media (max-width:700px) { 
.services .container	                        	{ grid-gap: 30px;}
.services .container p               				{ margin-bottom: 10px;}
.services .container .multi_links					{ grid-template-columns: 1fr 1fr; grid-gap: 10px; margin-top: 20px;}
}


/*** variant 2 img ***/
.services:before									{ position: absolute; left: 0; right: calc(50% + 100px); top: 15%; bottom: 15%; background: var(--bgColorDark); border-radius: 0; visibility: visible; transition: none; content: "";}
.services .container img 							{ width: 70%; height: auto; object-fit: cover; display: block; position: relative; z-index: 10; aspect-ratio: 1/1; border-radius: var(--allImgBR);}
.services .container img:first-of-type				{ margin: 0 0 0 30%;}
.services .container img:last-of-type				{ margin: -15% 30% 0 0;}
.services.reverse:before							{ right: 0; left: calc(50% + 100px);}

@media (max-width:1200px) { 
.services:before									{ position: absolute; left: 0; right: calc(50% + 100px); top: 15%; bottom: 15%; background: var(--bgColorDark); border-radius: 0; visibility: visible; transition: none; content: "";}

}

@media (max-width:1000px) { 
.services:before									{ right: 90%; height: calc(60vh + 40px); top: -20px;}
.services .container img 							{ width: 100%; height: 60vh; aspect-ratio: 3 / 2;}
.services .container img:first-of-type				{ margin: 0;}
.services .container img:last-of-type				{display: none}
}

@media (max-width:700px) { 
.services .container .img 							{ width: 100%;}
}


/*** add list links ***/
.services .container .list_links					{ margin-top: 30px; border-top: 1px solid #ccc;}
.services .container .list_links a					{ display: block; padding: 20px 60px 20px 0; border-bottom: 1px solid #ccc;}
.services .container .list_links a:after 			{ width: 20px; height: 100%; background: url("../images/arrow_link.svg") 100% 50% no-repeat; filter: invert(1); position: absolute; right: 0; top: 0; content: "";}

@media (min-width:1201px) { 
.services .container .list_links a:hover 			{ padding-left: 15px;}
.services .container .list_links a:hover:after 		{ right: 15px;}
}


/***** assets v1 *****/
.assets_v1 									{ text-align: center; position: relative; padding: clamp(20px, 8vw, 80px) 0; margin: var(--marginTB);}
.assets_v1:before 							{ position: absolute; left: 0; right: 0; top: 0; bottom: 0; background-color:#f4f4f4; z-index: -1; content: "";}
.assets_v1 .container 						{ display: grid; grid-gap: 20px; position: relative; width: auto;}
.assets_v1.col_5 .container 				{ grid-template-columns: repeat(5, 1fr);}
.assets_v1 .item  							{ background-color: #fff; border-radius: 5px; display: grid; align-items: center; height: 100px}
.assets_v1 .item img 						{ display: block; line-height: 0; margin: 0 auto; width: 60%}



@media (max-width: 1200px){
.assets_v1.col_5 .container					{ grid-template-columns: repeat(3, 1fr);}


}


@media (max-width: 700px){
.assets_v1 									{ text-align: center; position: relative; padding: 20px; margin:0;}
.assets_v1 .container 						{ display: grid; grid-gap: 10px; position: relative;}
.assets_v1.col_5 .container					{ grid-template-columns: repeat(2, 1fr);}
.assets_v1 .item 							{ width:100%; justify-items: center;}
.assets_v1 .item img 						{ display: block; margin: 0; }
}









