body { overflow-x:  hidden;}

.sous_titre_small { font: 500 20px / 30px "Onest"; display: block; margin-bottom: 20px;}
@media (max-width:700px) { 
    .sous_titre_small { font-size: 18px;}
}


/***** top page *****/
.top_page                   { position: relative; padding-top: 100px;}
.top_page .titre            { font-size: 14px; color: #ffffff; margin-bottom: 0; line-height: 20px;}
.top_page .titre_main       { font-size: clamp(28px, 3vw, 42px);line-height: 140%; color: var(--mainColor1); font-weight: 600;}

.wrapper.content            { z-index: 10;}
.chapo                      { margin-bottom: 0;}

.sous_titre                 { margin-bottom: 20px; }


@media (max-width:1200px) { 
.top_page                   { padding-top: 60px;}
}

@media (max-width:800px) { 
.top_page                   { padding-top: 140px;}
}

@media (max-width:700px) { 
.top_page                   { padding-top: 100px;}
}

/***** breadcrumb *****/
.breadcrumb							            { margin:80px 0 60px 0; line-height: 0; position: relative; z-index: 10;}
.breadcrumb li 						            { display: inline-block; font-size: 12px; line-height: 20px; margin-right: 30px; letter-spacing: 0.6px; position: relative;}
.breadcrumb li a						        { color: #111;}
.breadcrumb li:after				            { width: 1px; height: 10px; position: absolute; right: -16px; top: 6px; background: #111; content: "";}
.breadcrumb li:last-child:after 	            { display: none;}
.breadcrumb li a.active 			            { color: var(--mainColor1);}
.breadcrumb li:last-child a 		            { color: var(--mainColor1);}

@media (min-width:1201px) {
.breadcrumb a:hover                             { color: var(--mainColor2);}
}

@media (max-width:800px) { 
.breadcrumb							            { display: none;}
}



/***** bloc grid *****/
.bloc-grid                              { width: 90vw; max-width: var(--maxWidthWrapper); margin: var(--marginTB); display: grid; grid-template-columns: repeat(2, 1fr); align-items: center; grid-gap: 40px 80px; position: relative;}
.bloc-grid .photo,
.bloc-grid .texte                       { position: relative;}
.bloc-grid.full                         { width: 90vw; max-width: var(--maxWidthWrapperLarge); }
.bloc-grid.full .texte                  { padding-right: 100px; padding-left: 0;}
.bloc-grid.full .photo img              { max-width: 100%; height: auto; border-radius: var(--allImgBR);}
.bloc-grid.reverse .texte               { order: 1; padding-left: 100px; padding-right: 0;}
.bloc-grid.reverse .photo               { order: 2;}
.bloc-grid .texte :last-child           { margin-bottom: 0;}
.bloc-grid .photo.col-2                 { display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 0 40px;  }
.bloc-grid .photo.col-2 img             { width: 100%; height: auto; }

.bloc-info { width: 90vw; max-width: var(--maxWidthWrapperSmall); margin: var(--marginTB); display: block; background: #08224d; color: #ffd532; font: 400 22px / 30px "Onest"; padding: 60px; text-align: center; letter-spacing: 3px; border-radius: var(--allImgBR); position: relative;}
.bloc-info :last-child { margin-bottom: 0;}

.bloc-info.bee .bee 		{ position: absolute; top: -120px; left: -120px; width: 250px; height: 250px; z-index: 200; }

.bloc-texte { width: 90vw; max-width: var(--maxWidthWrapper); margin: var(--marginTB); display: block; } 

@media (max-width:1366px) {
.bloc-grid { align-items: start;}
}

@media (max-width:1200px) {
.bloc-grid                              { grid-gap: 40px 40px;}
.bloc-grid.full .texte,
.bloc-grid.reverse .texte               { padding-right: 0; padding-left: 0;}
.bloc-info                              { font: 400 18px / 26px "Onest";}
}
@media (max-width:1000px) {
.bloc-grid                              { grid-template-columns:1fr; }   
.bloc-grid.reverse .texte               { order: 2;}
.bloc-grid.reverse .photo               { order: 1;} 
.bloc-grid.first .texte                 { order: 1;}
.bloc-grid.first .photo                 { order: 2;} 
.bloc-grid.full .photo img              { height: 50vw; object-fit: cover;}
.bloc-grid .photo.col-2                 { grid-gap: 0 20px;}
.bloc-info.bee .bee 		            { top: -80px; left: -90px; width: 200px; height: 200px; }
}

@media (max-width:700px) {
.bloc-info.bee .bee 		            { top: -40px; left: -40px; width: 150px; height: 150px; }    
}


/***** card item : img + txt */
.card_item_v1								{ border-radius: var(--imgRadius); overflow: hidden; position: relative;}
.card_item_v1 .wrap							{ padding: 40px;}
.card_item_v1 img 							{ display: inline-block;}
.card_item_v1 img:not(.icon)				{ width: 100%; height: auto; aspect-ratio: 5/3; object-fit: cover; margin-bottom: -15px;}
.card_item_v1 .sous_titre 					{ margin: 10px 0 10px 0; font-size: 22px; line-height: 30px;}
.card_item_v1 p								{ margin-bottom: 20px;}
.card_item_v1 .link.fullw 					{ width: 100%; padding: 0; text-align: center;}

@media (max-width:1200px) {
.card_item_v1								{ box-shadow: none;}
.card_item_v1 .wrap							{ padding: 30px;}
.card_item_v1 .sous_titre 					{ font-size: 20px;}
}
@media (max-width:700px) {
.card_item_v1 .wrap							{ padding: 20px;}
.card_item_v1 .sous_titre 					{ font-size: 16px; line-height: 22px;}
}







/***** grid bloc *****/
.grid_bloc	 								{ position: relative; margin: var(--marginTB);}
/*
.grid_bloc:before							{ width: auto; height: auto; position: absolute; left: 20px; right: 20px; top: 0; bottom: 0; background: var(--bgColorLight); border-radius: 40px; transition: none; z-index: -1; content: "";}
*/
.grid_bloc .container						{ display: grid; grid-gap: clamp(10px, 5vw, 20px); text-align: center;}

@media (max-width:1200px) {
.grid_bloc:before							{ left: 0; right: 0; top: 0; bottom: 0; border-radius: 0;}
}
@media (max-width:700px) {
.grid_bloc .container						{ text-align: left;}
}


/* custom colums */
.grid_bloc.col_2 .container					{ grid-template-columns: repeat(2, 1fr);}
.grid_bloc.col_3 .container					{ grid-template-columns: repeat(3, 1fr);}
.grid_bloc.col_4 .container					{ grid-template-columns: repeat(4, 1fr);}

@media (max-width:1200px) {
.grid_bloc.col_4 .container					{ grid-template-columns: 1fr 1fr;}
}
@media (max-width:1000px) {
.grid_bloc.col_3 .container					{ grid-template-columns: 1fr;}
}
@media (max-width:700px) {
.grid_bloc.col_2 .container,	
.grid_bloc.col_3 .container,					
.grid_bloc.col_4 .container					{ grid-template-columns: 1fr;}
}





/**** slider ****/
.wrapnav                            { display: flex; width: 100%; position: absolute; z-index: 10; justify-content: space-between; top: 50%; transform: translateY(-50%); max-width: 800px;}
.wrapnav .arrownav                  { width: 60px; height: 60px; background-position: center; background-color: transparent; background-repeat: no-repeat; cursor: pointer; transition: all ease-in-out 400ms;}
.wrapnav .arrownav_prev             { background-image: url(../images/arrow_prev.svg); }
.wrapnav .arrownav_next             { background-image: url(../images/arrow_next.svg);}


.bloc_bg_blue                       { background: var(--bgColorLight); border-radius: 30px;}

.top_page:before        { position: absolute; left: -10%; right:50%; top: 150px; background: url("../images/pattern.svg"); background-repeat: no-repeat; z-index: -80; transition: none; content: ""; height: 800px; width: 110vw;}

.footer:before         { position: absolute; right: -150px; bottom: 100%; left:10%; background: url("../images/pattern.svg"); background-repeat: no-repeat; z-index: -20; transition: none; content: ""; height: 800px; transform: scaleX(-1); width: 100%;}


@media (max-width:800px) {
.footer:before          { width: 120vw; left: -10px;}
}


/***** services *****/
.grid_bloc_mixed 							{ position: relative;}
.grid_bloc_mixed .container					{ display: grid; grid-template-columns: 1fr 1fr 1fr; margin: 60px auto; text-align: center; max-width: 1200px; }
.grid_bloc_mixed .item 						{ margin: -3% -11%; grid-row-end: span 2; height: 500px; position: relative;}
.grid_bloc_mixed .item:nth-child(1)			{ grid-column-start: 1; grid-row-start: 1;}
.grid_bloc_mixed .item:nth-child(2)			{ grid-column-start: 2; grid-row-start: 2;}
.grid_bloc_mixed .item:nth-child(3)			{ grid-column-start: auto; grid-row-start: auto;}


@media (max-width:1200px) {
.grid_bloc_mixed .container					{  grid-template-columns: 1fr 1fr; max-width: 800px; }    
}

@media (max-width:1000px) {
.grid_bloc_mixed .container					{ max-width: 700px; }    
.grid_bloc_mixed .item 						{ height: 400px;}
}


@media (max-width:800px) {
.grid_bloc_mixed .container					{ display: block; text-align: center;}
.grid_bloc_mixed .item:nth-child(1)		    { grid-column-start: auto; grid-row-start: auto;}
.grid_bloc_mixed .item:nth-child(2)			{ grid-column-start: auto; grid-row-start: auto;}
.grid_bloc_mixed .item:nth-child(3)			{ grid-column-start: auto; grid-row-start: auto;}
.grid_bloc_mixed .item 						{ margin: 20px auto; padding: 0; height: auto; background: #08224d; border-radius: 10px;}
}


.card_item_v2                               { clip-path: polygon(72.38% 4%,72.38% 4%,72.938% 4.034%,73.483% 4.133%,74.012% 4.296%,74.521% 4.519%,75.007% 4.8%,75.464% 5.136%,75.889% 5.525%,76.279% 5.964%,76.63% 6.449%,76.937% 6.98%,99.299% 44.48%,99.299% 44.48%,99.555% 45.05%,99.753% 45.642%,99.895% 46.249%,99.98% 46.867%,100.009% 47.49%,99.98% 48.113%,99.895% 48.731%,99.753% 49.338%,99.555% 49.93%,99.299% 50.5%,76.937% 90%,76.937% 90%,76.63% 90.535%,76.279% 91.024%,75.889% 91.464%,75.464% 91.852%,75.007% 92.188%,74.521% 92.467%,74.012% 92.688%,73.483% 92.849%,72.938% 92.947%,72.38% 92.98%,27.62% 92.98%,27.62% 92.98%,27.062% 92.946%,26.517% 92.847%,25.988% 92.684%,25.479% 92.461%,24.993% 92.18%,24.536% 91.844%,24.111% 91.455%,23.721% 91.016%,23.37% 90.531%,23.063% 90%,0.701% 50.5%,0.701% 50.5%,0.445% 49.93%,0.247% 49.338%,0.105% 48.731%,0.02% 48.113%,-0.009% 47.49%,0.02% 46.867%,0.105% 46.249%,0.247% 45.642%,0.445% 45.05%,0.701% 44.48%,23.063% 6.98%,23.063% 6.98%,23.37% 6.449%,23.721% 5.964%,24.111% 5.525%,24.536% 5.136%,24.993% 4.8%,25.479% 4.519%,25.988% 4.296%,26.517% 4.133%,27.062% 4.034%,27.62% 4%,72.38% 4%);}
.card_item_v2 img							{ width: 100%; height: auto; display: block; aspect-ratio: 1/1; object-fit: cover; filter: brightness(0.90);}
.card_item_v2:before				        { position: absolute;  left: 0; right: 0; top: 0;  bottom: 0; background: #08224d; transition: none; z-index: 1; content: ""; z-index: 1;}
.card_item_v2 .wrap							{ width: 80%; z-index: 5; padding: 0; font-size: 25px; line-height: 30px; color: #fff; margin:0; position: absolute; top:50%; left: 50%; transform: translate(-50%, -50%)}
.card_item_v2 .wrap.full                    { width: 120%; }    
.card_item_v2 .wrap	.sous_titre             { color: #ffd532;}
.card_item_v2 .wrap p                       { font-size: 18px; margin-bottom: 0;}


@media (max-width:1200px) {
.card_item_v2 .sous_titre 					{ font-size: 20px;}
}

@media (max-width:800px) {
.card_item_v2:before                        { content: none;}   
.card_item_v2                               { clip-path: none;}
.card_item_v2 .wrap							{ padding: 20px; position: relative; top: inherit; left: inherit; transform: none; width: inherit; text-align: left;}
.card_item_v2 .wrap p                       { font-size: 16px;}
.card_item_v2 .wrap.full                    { padding: 0; width: 100%;}
.card_item_v2 img							{ height: 50vw; max-width: 100%; object-fit: cover; object-fit: cover; aspect-ratio: initial; border-radius: var(--allImgBR);}

.grid_bloc_mixed .item:has(img)             { background: none;}

} 







/**** Dynamique ****/
.dynamique                          { margin: var(--marginTB);}
.dynamique h2, 		 
.dynamique h3,			 
.dynamique h4,
.dynamique h5,
.dynamique h6                       { font: 400 30px / 40px "Onest"; letter-spacing: 0.4pt; position: relative; color: var(--mainColor1); margin-bottom: 15px;}

.dynamique ul                       { margin: clamp(10px, 2vw, 15px);}
.dynamique ul li                    { position: relative; padding-left: 30px; line-height: 25px; margin-bottom: 12px;}
.dynamique ul li:before             { width: 19px; height: 14px; position: absolute; left: 0; top: 4px; background: url("../images/checklist.svg") 0 0 / contain no-repeat; content: "";}
.dynamique ul li:last-child         { margin-bottom: 0;}

.dynamique p>img                    { margin: 60px auto; border-radius: var(--allImgBR); display: block; max-width: 100%; height: auto;}

@media (max-width: 1200px){
.dynamique      { margin: 80px auto;}    
}

@media (max-width: 1000px){
.dynamique      { margin: 60px auto;}    
}

@media (max-width: 800px){
.dynamique      { margin: 40px auto;}    
.dynamique h2, 		 
.dynamique h3,			 
.dynamique h4,
.dynamique h5,
.dynamique h6   { font: 400 25px / 30px "Onest"; letter-spacing: 0.4pt; position: relative; color: var(--mainColor1); margin-bottom: 15px;}
}