/***** banner *****/
.banner 							{ width: 100%; position: relative; z-index: 10; padding: 150px 0 0 0; background: #20386e; text-align: center; overflow: hidden;}
.banner .wrapper                    { height: 70vh; max-height: 700px;}
.banner .img 						{ width: 100%; height: 100%; position: relative; background:url(../images/banner.jpg) 50% 0 / cover no-repeat;}
.banner .texte 						{ position: absolute; top: 50px; right: 60px; text-align: right;}
.banner .triangle                   { position: absolute; width: 100%; height: 65vh; max-height: 650px;}
.banner .triangle:after             { content: ""; background: #fff; width: 100%; height: 100%; position: absolute; transform: rotate(-25deg); top: 50%; }
.banner .triangle:before             { content: ""; background: #fff; width: 100%; height: 100%; position: absolute; transform: rotate(25deg); top: 50%; left: -50%;}
@media (max-width:1200px) {
.banner 							{ padding: 90px 0 0 0; height: auto; grid-template-columns: 1fr 1fr;}
}
@media (max-width:1000px) {
.banner .wrapper                    { max-width: none; width: 100%; height: 60vh;}
.banner .triangle                   {display: none;}
}

@media (max-width:600px) {
.banner 							{ background: #fff;}
.banner .wrapper                    { height: 100%;}
.banner .img 						{ height: 350px; background-image: url(../images/banner_mobile.jpg);}
.banner .texte                      { position: relative; top: auto;right: auto; text-align: center; margin: 20px 0; }
}


/***** intro *****/
.intro 								{ margin: 80px 0 90px;}
.intro .chapo						{ padding: 0 80px; margin: 0 0 30px 0;}

@media (max-width:1000px) {
.intro 								{ margin: 70px 0;}
.intro .chapo   					{ padding: 0;}
}
@media (max-width:600px) {
.intro 								{ display: none;}
}
/***** services *****/
.services                           { position: relative;}
.bloc_home .icone img               { filter: brightness(0) invert(1); width: auto; display: block;}
.bloc_home                          { color: #fff; align-items: baseline;  margin:80px 0 180px;}
.bloc_home .texte                   { padding:0 80px; margin-top: 150px;}
.bloc_home .icone                   { margin-bottom: 20px;}
.bloc_home:after                    { position: absolute; width: 75%; height: 100%; top: 80px; content: ""; background: #20386e; z-index: -1; right: 0;}
.bloc_home.reverse                  { margin: 260px 0 100px;align-items: end}
.bloc_home.reverse .texte           { padding: 0 80px;margin:0 0 150px 0}
.bloc_home.reverse:after            { left: 0;bottom: 80px;top: auto;}
.group_link .link:not(:last-child)  { margin-right: 5px;}


/* AUTRES */
.autres                             { background: #edf1fb; padding: 100px 0 90px;}
.autres .content                    { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 70px 30px;}
.autres .card                       { top:0;position: relative;display: grid;grid-template-columns: 80px auto;align-items: center;border-radius: 5px;margin-bottom: 30px;padding: 25px 60px 25px 30px;max-height: 100px;background: #fff;gap: 10px; transition: all 400ms ease-in-out}
.autres p a                         { border-bottom: 1px solid transparent; padding-bottom: 5px}
.autres .link_plus                  { background: url(../images/plus.svg)no-repeat center right 30px;position: absolute;width: 100%;height: 100%;}
.autres .icone                      { display: grid; place-items: center; height: 50px;}
.autres .sous_titre                 { font: 500 15px/25px "Montserrat";color:#5890e5;transition:all 400ms ease-in-out;margin:0}
@media (min-width:1201px) {
.autres p a:hover                   { border-color: #5890e5}
}
@media (min-width:1200px) {
.autres .card:hover                 { top: -10px;box-shadow: 0 0 30px 0 rgb(0 0 0 / 10%);}
.autres .card:hover .sous_titre     { color:#20386e;font-weight: 500}
}
@media (max-width:1000px) {
.autres                             { padding: 80px 0 70px;}
.autres .content                    { grid-template-columns: 1fr; gap: 30px;}
.autres .content p                  { display:none}
.autres .card                       { margin-bottom: 0}
}
@media (max-width:600px) {
.autres                             { padding: 0 ; margin-top: 10px;}
.autres .content                    { grid-template-columns: 1fr; gap: 0;}
.autres .item p                     { display: none;}
.autres .link_plus                  { grid-template-columns: 100px auto;font: 500 12px/25px "Montserrat"; }
.autres .card                       { margin-bottom: 10px;min-height: 80px;align-items: center;padding: 0 30px;}
.autres .sous_titre                 { font: 500 12px/25px "Montserrat";margin: 0;color: #4585e5;}
}
@media (max-width:1200px) {
.bloc_home                          { color: #20386e; margin: 80px 0 100px;align-items: center;} 
.bloc_home:after                    { display: none;} 
.bloc_home .icone img               { filter: none;}
.bloc_home .sous_titre              { color: #20386e;}
.bloc_home .texte                   { padding:0 0 0 80px; margin-top: 0;}
.bloc_home.reverse                  { margin: 100px 0;}
.bloc_home.reverse .texte           { padding: 0 80px 0 0;}
}
@media (max-width:1000px) {
.bloc_home                          { margin: 70px 0; }
.bloc_home.reverse                  { margin: 70px 0;}
.bloc_home .texte                   { padding:0;}
.bloc_home.reverse .texte           { padding:0;}
.services .bloc_home .texte         { margin:0}
}
@media (max-width:600px) {
.services                           { background: #edf1fb; padding: 40px 0;}
.services .bloc_home                { margin: 0 0 10px; gap: 0;}
.services .bloc_home .photo         { display: none;}
.services .bloc_home .texte         { display: grid; position: relative;  grid-template-columns: 100px auto; align-items: center; border-radius: 5px; background: #fff; padding: 25px 0;}
.services .bloc_home .sous_titre    { font: 500 12px/25px "Montserrat"; margin: 0; color: #4585e5;}
.services .bloc_home .texte p       { display: none;}
.services .bloc_home .link          {  background: url(../images/plus.svg)no-repeat center right 30px;  top: 0; position: absolute; width: 100%; height: 100%; font-size: 0; margin: 0; padding: 0;}
.services .icone                    { height: 40px; margin: 0;display: grid; place-items: center;}
.services .icone img                { height: inherit;}
}

/* experience */
.experience                         { margin: 140px 0 175px;}
.experience::after                  { background: url(../images/bg_texte.svg) no-repeat right -15px top 140px #20386e;}
.experience .photo .exp             { position: absolute; top: 30px; left: 30px; z-index: 50; content: ""; background-size: contain; width: 150px;}
@media (max-width:1200px) {
.experience                         { margin: 100px 0 125px;}
}
@media (max-width:1000px) {
.experience                         { margin: 70px 0 95px;}
}
@media (max-width:600px) {
.experience                         { margin: 50px 0;}
.experience .photo .exp             { width: 120px;}
}
/* atouts */
.atout                              { margin:100px 0 135px; display: grid; place-items: center; position: relative; font: 400 18px/40px "Montserrat";}
.atout:after                        { background: #edf1fb; width: 150px; height: 150px; display: block; border-radius: 50%; content: ""; position: absolute; top: -25px; z-index: -2;} 
@media (max-width:1000px) {
.atout                              { margin: 95px 0;}
}
@media (max-width:600px) {
.atout                              { display: none;}
}

/***** bloc texte *****/
.bloc_texte							{ margin: 70px auto 100px auto; position: relative;}
.bloc_texte .sous_titre             { font-size: 18px;color: #4585e5;}   
.bloc_texte .ul_list				{ margin: -5px 0 20px 0;}
.bloc_texte .ul_list li				{ padding: 5px 0 5px 22px; position: relative;background: url(../images/list.svg) left 14px no-repeat ;}
.bloc_texte img                     { width: 100%; height: auto; display: block; line-height: 0;}
.bloc_texte p                       { margin-bottom:24px}
@media (max-width:1000px) { 
.bloc_texte							{ margin: 50px auto;}
}
@media (max-width:600px) {
.bloc_texte							{ margin: 40px auto;}
}

.table_plus                          { margin: 25px 0 0 ;}
.table_plus .item                    { position: relative;}
.table_plus .item .titre_plus        { cursor:pointer; font: 400 14px/26px "Montserrat";background:#edf1fb;padding: 17px 60px 17px 30px;position: relative; margin-bottom: 20px;}
.table_plus .item .titre_plus::after { cursor: pointer; content: ""; background: url(../images/plus.svg) no-repeat;position: absolute;top: 50%;right: 30px; width: 20px;height:20px; transform: translateY(-50%); transition: all ease-in-out 400ms;}
.table_plus .hide 					{ padding: 20px 60px 50px; display: none;}              
.table_plus .item .active::after    { transform:translateY(-50%) rotate(45deg);}
@media (max-width:600px) {
.table_plus                          { margin-bottom: 50px;}
.table_plus .item .titre_plus        { font-size: 12px; margin-bottom: 10px;}
.table_plus .hide 					 { padding: 20px 30px 30px;}   
}