/***** banner *****/
.bg_light                               { background: #f7f0e7;}

.banner                                 { padding-top: 180px; position: relative; z-index: 1;}
.banner .wrapper                        { display: grid; grid-template-columns: 1fr 1fr;}
.banner .texte                          { order: 1; padding-bottom: 95px; max-width: 600px; padding-right: 80px; margin-left: auto; padding: 55px 80px 95px 0;}
.banner .titre_main                     { font-size: 50px; line-height: 60px; margin-bottom: 30px;}
.banner .options   						{ margin-bottom: 30px;}
.banner .options li 					{ font-size: 20px; font-weight: 500; color: #000; letter-spacing: 0.4px; display: inline-block; margin-right: 30px; position: relative;}
.banner .options li:not(:last-child)::after	{ width: 6px; height: 6px; position: absolute; right: -20px; top: 14px; background: #bd302c; border-radius: 50%; content: "";}
.banner .photo picture                  { position: relative; display: block; }
.banner .photo                          { order: 2; margin-bottom: -100px;}
.banner .photo img                      { width: 100%; height: auto; display: block;}
@media (max-width:1200px) {
.banner .texte                          { padding-right: 40px;}
.banner .titre_main br                  { display: none;} 
}
@media (max-width:1000px) {
.banner                                 { padding-bottom: 70px;}
.banner .wrapper                        { grid-template-columns: 1fr; z-index: 100;}
.banner .texte                          { margin: 0; padding: 0; max-width: none;}
.banner .photo                          { order: 1; margin: 0 0 10px;}
}
@media (max-width:700px) {
.banner                                 { padding: 175px 0 170px; position: static;}
.banner .titre_main                     { font-size: 25px; line-height: 35px; font: 600 25px/35px "Barlow Condensed"; text-align: center; margin-bottom: 10px;}
.banner .options                        { text-align: center; margin-bottom: 25px;}
.banner .options li                     { font-size: 18px;}
}

/***** bloc horaire *****/
.bloc_horaire							{ position: relative; color: #000; max-width: 400px;}
.bloc_horaire p							{ background: #fff; border-radius: 10px; padding: 25px 30px; cursor: pointer; position: relative; line-height: 28px; font-weight: 500;}
.bloc_horaire p:after					{ width: 18px; height: 100%; position: absolute; right: 30px; top: 0; background: url("../images/arrow_down.svg") 50% no-repeat; content:"";}

.bloc_horaire p.active:after			{ transform:rotate(-180deg);}
.bloc_horaire ul						{ width: 100%; background: #bd302c; font-size: 14px; padding: 20px 30px; position: absolute; left: 0; top: 90%; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; border-top: 10px solid #fff; display: none;}
.bloc_horaire ul li						{ display: grid; grid-template-columns: 1fr 100px 100px; grid-gap: 30px; font-weight: 500; color: #fff;}
.bloc_horaire ul li span:last-child		{ text-align: right;}

@media (max-width:1200px) {
.bloc_horaire p							{ line-height: 18px; padding: 25px 30px;}
.bloc_horaire p:after					{ right: 30px;}
.bloc_horaire b							{ font-size: 15px; font-weight: 400;}
.bloc_horaire ul						{ padding: 20px 30px; font-size: 13px;}
}
@media (max-width:1000px) {
.bloc_horaire                           { max-width: none;}
}
@media (max-width:700px) {
.bloc_horaire                           { position: relative; z-index: 3;}
.bloc_horaire p							{ padding: 15px 25px; border-radius: 5px; border-top-left-radius: 0; font-size: 15px;}
.bloc_horaire p:after					{ right: 25px;}
.bloc_horaire b							{ font-size: 13px; line-height: 20px; margin-bottom: 5px;}
.bloc_horaire b	br						{ display: block;}
.bloc_horaire ul						{ font-size: 12px; padding: 15px 25px;}
.bloc_horaire ul li						{ grid-template-columns: 1fr 85px 85px; grid-gap: 15px;}
}
@media (max-width:400px) {
.bloc_horaire p							{ padding: 15px 25px 15px 15px; font-size: 14px;}
.bloc_horaire ul						{ font-size: 11px;}
.bloc_horaire ul li						{ grid-template-columns: 1fr 80px 80px; grid-gap: 5px;}
}

/***** intro *****/
.intro                                  { display: grid; grid-template-columns: 1fr 1fr; align-items: center; margin: 90px 0 100px;}
.intro .sous_titre                      { font-size: 30px; line-height: 40px;}
.intro .suggestion                      { display: block; color: #fff; background: url(../images/suggestion_facebook.webp) center / cover no-repeat; font-size: 20px; font-weight: 500; padding: 45px 30px; border-radius: 10px; margin-left: 90px; position: relative; overflow: hidden;}
.intro .suggestion::after               { content: ""; display: block; position: absolute; inset: 0; background: #bd302c; opacity: 0;}
.intro .suggestion span                 { display: block; padding: 0 70px; background: url(../images/arrow_white.svg) right center no-repeat, url(../images/facebook_md.svg) left center no-repeat; position: relative; z-index: 1;}
.intro .suggestion i                    { font-style: normal;}

@media (min-width:1201px) {
.intro .suggestion:hover::after         { opacity: 1;}
}
@media (max-width:1200px) {
.intro .suggestion                      { margin-left: 40px;}
}
@media (max-width:1000px) {
.intro                                  { grid-template-columns: 1fr;}
.intro .suggestion                      { margin: 30px 0 0;}
}
@media (max-width:700px) {
.intro                                  { margin: 0;}
.intro br,
.intro>*:not(.suggestion)               { display: none;}
.intro .suggestion                      { margin: -275px 0 0; font-size: 0; position: relative; z-index: 2; text-transform: uppercase; text-align: center; padding: 0 20px; border-radius: 5px;}
.intro .suggestion::after               { opacity: 1;}
.intro .suggestion span                 { background: url(../images/arrow_white.svg) right center no-repeat; line-height: 0; display: block;}
.intro .suggestion i                    { font-size: 14px; font: 700 14px/50px "Barlow Condensed"; letter-spacing: 1px;}
}

/***** bloc grid home *****/
.bloc_grid.home .photo .img_2           { position: absolute; right: 100%; top: 0; margin-right: 40px;}
.bloc_grid.home .custom                 { margin-top: 50px;}
@media (max-width:1000px) {
.bloc_grid.home .photo .img_2           { display: none;}
}
@media (max-width:1000px) {
.carte                                  { margin: 0; position: relative; z-index: 1;}
.carte .texte>*:not(.link)              { display: none;}
.carte .photo                           { display: none;}
.carte .link                            { margin: -103px 0 0;}
.bloc_grid.home .custom                 { margin-top: 40px;}
}



/***** commande *****/
.commande                               { background: #f7f0e7;}
.commande .wrapper                      { display: grid; grid-template-columns: 1fr 1fr; align-items: center; padding: 80px 0 65px;}
.commande .texte                        { padding-right: 50px;}
.commande .ul_list                      { margin-bottom: 35px;}
.commande .photo img                    { width: 100%; height: auto; display: block;}
@media (max-width:1000px) {
.commande .wrapper                      { grid-template-columns: 1fr; gap: 40px;}
.commande .texte                        { padding-right: 0;}
}
@media (max-width:700px) {
.commande                               { background: white; margin: 15px 0 50px;}
.commande .wrapper                      { padding: 0;}
.commande .photo                        { display: none;}
.commande .ul_list                      { margin-bottom: 15px;}
}



/***** atouts *****/
.atouts                                 { background: url(../images/bg_atout.webp) center / cover no-repeat; padding: 100px 0 90px;}
.atouts .wrapper                        { display: grid; grid-template-columns: repeat(4, 1fr); text-align: center; color: #fff;}
.atouts .icone                          { height: 120px; display: grid; justify-content: center; align-items: end; margin-bottom: 20px;}
.atouts .sous_titre                     { color: #fff; margin-bottom: 0;}
.atouts .item strong                    { display: block; text-transform: uppercase;}
@media (max-width: 1000px) {
.atouts .wrapper                        { grid-template-columns: 1fr 1fr;}
.atouts                                 { padding: 70px 0;}
}
@media (max-width: 700px) {
.atouts                                 { background: #161616; padding: 60px 0;}
.atouts .wrapper                        { grid-template-columns: 1fr; text-align: left; gap: 20px;}
.atouts .item                           { display: grid; grid-template-columns: 70px auto; align-items: center; gap: 10px;}
.atouts .icone                          { height: auto; margin-bottom: 0;}
.atouts .icone img                      { max-width: 100%; max-height: 55px;}
.atouts .sous_titre                     { font-size: 15px;}
.atouts .item strong                    { font-weight: 400; display: initial; text-transform: initial;}
}


/***** apropos *****/
.apropos                                { display: grid; grid-template-columns: 1fr 1fr; align-items: center; padding: 85px 0 100px;}
.apropos .texte                         { margin-right: 80px;}
.apropos .photo img                     { display: block; width: 100%; height: auto;}
.adresse                                { background: #fff; border-radius: 10px; padding: 40px; margin-top: 50px;}
.apropos .sous_titre                    { margin-bottom: 5px;}

@media (max-width:1200px) {
.apropos .texte                         { margin-right: 40px;}
}
@media (max-width:1000px) {
.apropos                                { grid-template-columns: 1fr; gap: 40px;}
.apropos .texte                         { margin-right: 0;}
}
@media (max-width:700px) {
.apropos                                { padding: 45px 0 40px;}
.apropos .texte                         { margin-right: 0;}
.apropos .photo img                     { display: none;}
.adresse                                { text-align: center; padding: 33px 20px; margin-top: 30px;}
}