/***** bloc grid *****/
.bloc_grid	                        { display: grid; grid-template-columns:repeat(2,1fr); align-items: center; position: relative; margin: var(--marginBloc); grid-gap: 0 80px;}
.bloc_grid :last-child				{ margin-bottom: 0;}
.bloc_grid::after                   { content: "";position: absolute; top: 0; right: 100%; margin: 0 30px 0 0; width: 200vw; height:100%;background: #cdeaec;z-index: -1; border-top-right-radius: 30px; border-bottom-right-radius: 30px;}

.bloc_blue .bloc_grid::after        { content:none;} 

.bloc_grid.align_top                { align-items: start;}

.bloc_grid .photo                   { position: relative; line-height: 0;}
.bloc_grid .photo img			    { width: 100%; height: auto; display: block; position: relative; border-radius: 30px;}
.bloc_grid .texte					{ position: relative;}
.bloc_grid .texte p               	{ margin-bottom: 20px;}
.bloc_grid .texte p:last-child      { margin-bottom: 0;}

.bloc_grid.reverse::after           { left: 100%;  margin: 0 0 0 30px; border-top-left-radius: 30px; border-bottom-left-radius: 30px; }
.bloc_grid.reverse .texte			{ grid-area: 1 / 1; }
.bloc_grid.reverse .photo        	{ grid-area: 1 / 2;}

.bloc_grid.first                    { background: #ffffff; box-shadow: 0px 0px 30px 0px rgba(3, 50, 99, 0.1); position: relative; border-radius: 20px; z-index: 10; margin-top: -230px;}
.bloc_grid.first .texte             { padding-right: 60px;}
.bloc_grid.first .photo img         { border-bottom-left-radius: 20px; border-top-left-radius: 20px; border-bottom-right-radius: 0; border-top-right-radius: 0;}
.bloc_grid.first::after             { content: none;}              


@media (max-width:1366px) {
    .bloc_grid	                    { grid-gap: 0 50px;}
}

@media (max-width:1200px) {
    .bloc_grid.first 	            { grid-template-columns:40% 60%; grid-gap: 0 40px;}
}

@media (max-width:1000px) { 
    .bloc_grid	                        { grid-template-columns: 1fr; grid-gap: 35px;}
    .bloc_grid.reverse .texte			{ grid-area: 2;}
    .bloc_grid.reverse .photo        	{ grid-area: 1;}
    .bloc_grid .texte,
    .bloc_grid.reverse .texte           { padding: 0;}
    .bloc_grid::after,
    .bloc_grid.reverse::after           { content: none;}
    .bloc_grid .photo img,
    .bloc_grid.reverse .photo img       { height: 55vw; box-shadow:none; width: 100%; object-fit: cover; border-radius: 20px;}
    .bloc_grid.first                    { box-shadow: none;}
}

@media (max-width:800px) {
    .grid-bloc-3                    { grid-template-columns:1fr; grid-gap: 30px 0;}
    .grid-bloc-3 .item:nth-child(3) { grid-column:inherit;}
    .bloc_grid.first .photo img     { border-radius: 20px;}
}





