
@import "./fonts.css";
@import "./vars.css";
@import "./commom.css";

/* -------------------------------------------------------------------------- */
    /* INDEX */
/* -------------------------------------------------------------------------- */
.blocTopHome {height: 100vh;position: relative;overflow: hidden;padding: 0;}
.videoTop {height: 100%;width: 100%;background: var(--white);-o-object-fit:cover;object-fit:cover;background-size:100% 100%;background-position:center center;background-image: url('https://www.red-agency.fr/uploads/images/pageHome/RED_FORMES.webp');background-repeat:no-repeat;}
.btnToSuite{position: absolute;bottom:4rem;right: 7%;transition: all ease-in-out .5s;height:122px;width:122px;}
.btnToSuiteMob{width: 86%;height: 58px;text-align: center;padding: 1rem 0;border: 2px solid var(--white);text-transform: uppercase;font-weight: 600;font-size:var(--font24);position: absolute;bottom: 2rem;line-height: 1;}
.btnToSuiteMob::after{position:absolute;content:'';width:15px;height:15px;background-image:url(../img/croix-white.svg);right:1rem;top: 1.25rem;}
.blocIntro{background: var(--red);color:var(--white);padding:9rem 7%;}
.blocIntro h1{font-size:var(--font135);font-weight:600;color:var(--white);line-height: 1;padding-bottom: 1.5rem;}
.blocIntro p{font-size:var(--font72);font-weight:600;color:var(--white);}
.blocRefUne{padding:0;}
.blocRefUne ul {list-style:none;padding: 0;}
.blocRefUne ul li {position:relative;aspect-ratio: 16 / 9;width:100%;min-height: 650px;}
.blocRefUne ul li img{object-fit:cover;-o-object-fit:cover;width:100%;height:100%;}
.blocRefUne ul li .refInfos img.logoExpertise {height: 100% !important; margin-right: 1rem;  width: auto !important;object-fit: cover;-o-object-fit:cover;}
.blocRefUne .refInfos {position:absolute;bottom: 4rem;left: 7%;display: flex;height: 45px;}
.blocRefUne .refInfos .picto{height:45px;margin-right:1.5rem;}
.blocRefUne .refInfos .picto.conseil{width:36px;background-size:36px 45px;}
.blocRefUne .refInfos .picto.branding{width:45px;background-size:45px 45px;}
.blocRefUne .refInfos .picto.digital{width:23px;background-size:23px 45px;}
.blocRefUne .refInfos .picto.media{width:29px;background-size:29px 45px;}
.blocRefUne .nomClient{position:absolute;top: 4rem;left: 7%;color:var(--white);font-size:var(--font40);;line-height:30px;text-transform: uppercase;font-weight:700;}
.blocLien{padding:9rem 7% 9rem ;background: var(--white);}
.blocLien .lienFleche{position:relative;color:var(--red);font-size:var(--font45);font-weight:600;line-height:1;padding: 2rem 75px 2rem 0;background-image:url('https://www.red-agency.fr/template/site/img/redArrowRight.png'); background-repeat:no-repeat;background-position:center right; background-size:64px 63px;}
/*.blocLien .lienFleche::after{content:url(../img/redArrowRight.png);top: -2px;position: absolute;right: -81px;}*/

/* -------------------------------------------------------------------------- */
    /* PAGES */
/* -------------------------------------------------------------------------- */

.blocHero { height: calc(100vh - 218px);margin-top:218px;padding: 0 7% 0;position: relative;z-index:1;}
.blocHero.white{background:var(--red);color:var(--white);}
.blocHero img.logoatelier{max-width:900px;width:55%;margin-bottom:2rem;}
.blocHero h1{font-size:var(--font91);font-weight:600;line-height:0.9;margin-bottom:3rem;}
.blocHero p.medium{font-size:var(--font39);;font-weight:500;line-height:1.05;}

.blocTitle{padding:0 7% 1rem ;margin-top:218px;position: relative;z-index:1;}
.blocTitle.red{background:var(--white);color:var(--red);}
.blocTitle.white{background:var(--red);color:var(--white);}
.blocTitle h1, .blocTitle p.categorie{font-size:var(--font72);font-weight:600;margin-bottom: 0;}

.blocAccroche{padding:2rem 7%;background:var(--white);color:var(--red);position: relative;z-index:1;}
.blocAccroche.white{background:var(--red);color:var(--white);}
.blocAccroche p{font-size:var(--font135);font-weight:600;line-height:0.9;}
.blocAccroche p.big{font-size:var(--font135);padding-bottom:2rem;}
.blocAccroche p.semiBold{font-size:var(--font72);padding-bottom:2rem;}
.blocAccroche p.medium{font-size:var(--font39);;font-weight:500;line-height:1.1;padding-bottom: 1rem;width: 80%;}
.blocAccroche h2{font-size:var(--font135);font-weight:600;padding-bottom: 3rem;line-height: 1;letter-spacing: -0.25rem;height:315px;}
.blocAccroche h2.special{height:auto;}
.blocAccroche h2.second{font-size:var(--font72);font-weight:600;padding-bottom: 3rem;padding-top: 3rem;letter-spacing:unset;height:auto;}
.blocAccroche .dots{display:block;align-content: center; padding: 6rem;}

.blocAccroche .splideValeurs li{height: fit-content !important;}

.blocVideo {padding:2rem 0;aspect-ratio: 16 / 9;width:100%;position: relative;z-index:1;}
.blocVideo .divIframe{aspect-ratio: 16 / 9;}
.blocVideo iframe{width:100%;height:100%;}

.blocImage{padding:4rem 7%;width:100%;position: relative;z-index:1;}
.blocImage img.alaUne{width:100%;aspect-ratio: 16 / 9;}

.blocTextCol{padding:6rem 7%;color:var(--red);background: var(--white);position: relative;z-index:1;}
.blocTextCol .borderTop{border-top:1px solid var(--red);padding-top: 2rem;padding-bottom:5rem;}
.blocTextCol h2{font-size:var(--font72);font-weight: 600;}
.blocTextCol h3{font-size:var(--font72);font-weight: 600;}
.blocTextCol p{font-size:var(--font39);;font-weight:500;line-height:1.1;}
.blocTextCol p:nth-child(2){font-size:var(--font25);;font-weight:400;line-height:1.1;color:var(--black);margin-top:5rem;}
.blocTextCol .sousTitre{font-size:var(--font72);font-weight:300;text-transform:uppercase}
.blocTextCol a.linkProjet{font-size:var(--font39);;font-weight:600;color:var(--red);padding: 1rem 80px 1rem 0;background-image:url('https://www.red-agency.fr/template/site/img/redArrowRight.png'); background-repeat:no-repeat;background-position:center right;background-size:49px 49px;}

.blocTextCol h3 .picto{display: inline-block;height: 55px;width: 55px;margin-right: 1rem;}
.blocTextCol h3 .picto img{margin-bottom:1rem;height:54px;}
.blocContactBottom {padding: 3rem 7%;/*background:var(--grey);background: linear-gradient(180deg, var(--white) 28%, var(--grey) 28%)*/;border-top: 1px solid var(--red);position: relative;z-index:1;}
.blocContactBottom.noBorder{border:unset;}
.blocContactBottom .blocPresContact img.photoContact{width:100%;object-fit:cover;-o-object-fit:cover;}
.blocContactBottom .blocPresContact img.illustrationContact{width:100%;object-fit:cover;-o-object-fit:cover;}
.blocContactBottom .blocPresContact {position:relative;}
.blocContactBottom .blocPresContact .infosContact {position:absolute;left: 0;width: 90%;text-align: center;font-weight:400;top: 61%;}
.blocContactBottom .blocPresContact .infosContact .nom {color:var(--white);display:block;font-size:var(--font24);;}
.blocContactBottom .blocPresContact .infosContact .titre {color:var(--white);display:block;margin-bottom:1rem;font-size:var(--font22);;}
.blocContactBottom .blocPresContact .infosContact .email {color:var(--red);display:block;margin-bottom:1rem;font-size:var(--font20);;}
.blocContactBottom .colForm {/*padding-top: 12rem;*/}
.blocContactBottom .colForm h3{font-size:var(--font24);;text-transform:uppercase;color:var(--red);line-height:1}
.blocContactBottom .colForm p {font-size:var(--font39);;color:var(--red);line-height:1}
.blocContactBottom .border-left {border-left: 1px solid var(--red);}
.blocContactBottom .btn.btnRed {background: var(--red);color: var(--white);text-transform: uppercase;height: 50px;line-height: 38px;border-radius: 25px;font-weight:700;font-size:var(--font17p6);padding: 0.375rem 1.75rem;margin: 2rem 0 3rem;}
.blocContactBottom .colForm p.small {  font-size:var(--font16) !important;  font-weight: 300;}
.contentResponse h3 {  font-size:var(--font48);  font-weight: 600;letter-spacing: -0.1rem;}
.contentResponse p:first-of-type{ font-size:var(--font24);;color:var(--red);line-height:1}
.contentResponse p{max-width:580px;}
.filtreRef a.nav-link{font-size:var(--font22);;font-weight:400;padding:2px 17px;border:1px solid var(--red);color:var(--red);background:var(--white);margin-left:1rem;border-radius: 20px;}
.filtreRef a.nav-link.active{color:var(--white);background:var(--red);}
.blocListeReferences{padding: 2rem 7%;background:var(--white);}

.blocListeReferences .card{width:100%;border: none;border-radius: unset;position:relative;height: 100%;position: relative;z-index:1;}
.blocListeReferences .card:before{content:'';position:absolute;width:100%;height: calc(100% - 0.5rem);background:var(--red);top:0;bottom:0;right:0;left:0;z-index:1}
.blocListeReferences .card img{object-fit:cover;-o-object-fit:cover;height:100%;width:100%; aspect-ratio: 16/9;z-index:2;	opacity: 1;-webkit-transition: .3s ease-in-out;	transition: .3s ease-in-out;}
.blocListeReferences .card:hover img{opacity:0.5}
.blocListeReferences .card p.card-title{position:absolute;top:1rem;left:1rem;text-transform:uppercase;color:var(--white);font-size:var(--font20);;font-weight:700;z-index:10}
.blocListeReferences .card .card-cat{position:absolute;bottom: 1.5rem;left: 1rem;height: 28px;width: auto;z-index:10}
.blocListeReferences .card .card-cat img.logoExpertise{height:28px !important; width:auto !important;margin-right:0.8rem;object-fit:unset;-o-object-fit:unset;aspect-ratio:unset;}

.blocTopRef{height: 100vh;position: relative;overflow: hidden;padding: 0;background:var(--black);position: relative;z-index:1;}
.blocTopRef .pictureUne{object-fit:cover;-o-object-fit:cover;height:100%;width: 100%;opacity: 0.75;}
.blocTopRef h1{font-weight:600;font-size:var(--font160);line-height:1;position:absolute;bottom:8rem;left:7%;color:var(--white);width:80%}

.blocDetailsRef{padding: 6rem 7% 0;background:var(--white);position: relative;z-index:1;}

.blocDetailsRef hr{opacity: 1;background:var(--red);margin-bottom: 2rem;}
.blocDetailsRef .client p{font-size:var(--font64);font-weight:600;color:var(--red);line-height:1}
.blocDetailsRef .features p{font-size:var(--font24);;font-weight:400;color:var(--red);line-height: 1.1;width: 75%;}
.blocDetailsRef .features p strong{font-weight:700;}
.blocDetailsRef .desc h2{line-height:1.1;}
.blocDetailsRef .desc p, .blocDetailsRef .desc ul {font-size:var(--font22);;font-weight:400;line-height:1.4;margin-bottom: 1rem;}

.blocDetailsRef img.refVisuel{object-fit:cover;-o-object-fit:cover;width: 100%;}
.blocDetailsRef .col-12 img.refVisuel{aspect-ratio: 16/9;width:100%;}
.blocDetailsRef .col-6 img.refVisuel{aspect-ratio: 1;width:100%;}

.blocDetailsRef .accroche {display:inline-grid}
.blocDetailsRef .accroche p{font-weight:600;font-size:var(--font60);padding-left:4rem;color:var(--red);line-height:1;}
.blocDetailsRef .accroche p:empty{padding:0;display:none}
.blocDetailsRef .vTemoignages{position:relative;}
.blocDetailsRef .author{display:inline-block;position:absolute;right:4rem;}
.blocDetailsRef .author p{font-size:var(--font24);;font-weight:700;color:var(--red);}
.blocDetailsRef .tTemoignages p{position:relative;font-size:var(--font39);;font-weight:500;line-height:1;color:var(--red);width:70%;}
.blocDetailsRef .vTemoignages, .blocDetailsRef .tTemoignages {padding-top:5rem;padding-bottom:5rem;}
.blocDetailsRef .author .temoignageVisuel{margin-bottom: 1rem;}
.blocDetailsRef .tTemoignages p::before{position:absolute;content:url(../img/chevronOpen.png);height:40px;width:44px;top: 11px;left: -52px;}
.blocDetailsRef .tTemoignages p::after{position:absolute;content:url(../img/chevronClose.png);height:40px;width:44px;bottom: 11px;right: -52px;}

.blocAutresRef{padding: 2rem 7% 15rem;background:var(--white);position: relative;z-index:1;}
.blocAutresRef .splide__slide {padding-right:2rem;  }
.blocAutresRef .splide__slide a{position:relative;}
.blocAutresRef .splide__slide a img{object-fit:cover;-o-object-fit:cover;height:100%;width:100%;}
.blocAutresRef .splide__slide a p.titre{position:absolute;top: -13.5rem;left:1rem;color:var(--white);text-transform:uppercase;font-weight:700;}
.blocAutresRef .splide__arrows{position: absolute;top: 23rem;width: 100%;}
.blocAutresRef .splide__arrow {width:122px;height:122px;background-color: unset;}
.blocAutresRef .splide__arrow--prev {background-image:url(../img/arrowLeft.png);background-size:122px 122px;left: 0;}
.blocAutresRef .splide__arrow--next {background-image:url(../img/arrowRight.png);background-size:122px 122px;right: 0;}
.blocAutresRef .splide__arrow svg{display:none;}



.blocListeNews{padding: 2rem 7% 1rem;background:var(--white);position: relative;z-index:1;}
.blocListeNews .card{border:none;border-radius:unset;}
.blocListeNews .card .card-body{padding: 1rem 0;}
.blocListeNews .card .card-body .card-title{color:var(--red);font-size:var(--font39);;font-weight:500;line-height:1;}
.blocListeNews .card .card-body .cardDate{color:var(--red);font-size:var(--font16);font-weight:600;padding:1rem 0;line-height:1;}
.blocListeNews .card .card-body .card-text{font-size:var(--font22);;font-weight:400;line-height: 1;max-height:67px;overflow: hidden;}

.blocListeNews .borderLeftRight{border-left:1px solid var(--red);}
.blocListeNews .lgoInfraRed {max-width: 60%;}
.blocContact{padding: 1rem 7% 1rem;background:var(--white);position: relative;z-index:1;}
.blocContact .details{color:var(--red)}
.blocContact .details h2{font-size:var(--font24);;font-weight:500;line-height: 1;margin-bottom: 0;}
.blocContact .details p{font-size:var(--font39);;font-weight:500;font-weight:500;line-height:1;margin-bottom: 2.5rem;}
.blocContact .details a{color:inherit;}
.blocContact .cform h2{color:var(--red);font-size:var(--font39);;font-weight:500;line-height:1;}
.blocContact .cform p{color:var(--red);font-size:var(--font24);;font-weight:500;line-height: 1.1;margin-top: 1.5rem;}
.blocContact .cform hr{color:var(--red);opacity:1;margin-top: 0;margin-bottom: 2rem;}
  
.formContact {margin-bottom: 5rem;margin-top: 1.5rem;position: relative;z-index:1;}
.formContact .form-control::placeholder {color:var(--red);font-family: "WorkSans";font-size:var(--font24);;}
.formContact input.form-control{border:none;border-radius:unset;padding: .375rem 0rem;border-bottom:1px solid var(--red);font-family: "WorkSans";font-size:var(--font24);;margin-bottom:1rem}
.formContact textarea.form-control{border-radius:unset;border:1px solid var(--red);font-family: "WorkSans";font-size:var(--font24);;}
.formContact .form-label{color:var(--red);font-family: "WorkSans";font-weight:500;font-size:var(--font24);;}
.formContact .form-check{color:var(--red);font-weight:500;font-size:var(--font24);;margin-bottom:1rem;}
.formContact .form-check .form-check-label{color:var(--red);font-weight:500;font-size:var(--font24);;line-height: 1.1;}
.formContact .form-check .form-check-input{border:1px solid var(--red);}
.formContact .btn-red{color: var(--white);background-color: var(--red);border:1px solid var(--red);font-weight:500;font-size:var(--font24);;border-radius: 24px;padding: .375rem 1.25rem;margin:1rem 0;}
.formContact .btn-red:hover{color:var(--red) ;background-color: var(--white);}

.contentContactResponse {padding: 6rem 0;background-image: url(../img/cerf-volant.png);background-repeat: no-repeat;background-position: left bottom;background-size: 25% auto;}
.contentContactResponse h3 {text-align: center;  font-weight: 600;  font-size:var(--font72);  letter-spacing: -0.2rem;color:var(--red)}
.contentContactResponse p{text-align:center;padding-top:2rem;font-size:var(--font24);;color:var(--red);line-height:1}

.formContactBottom .form-control.alert-danger {background:var(--red) !important;color:var(--white)}
.confirmRedViewBg {background-image:url(../img/redview-newspaper.png);background-repeat:no-repeat;background-position: 65% bottom; background-size: 550px auto;}
.formContactBottom{padding-top:3rem}
.formContactBottom .form-control{background:var(--grey)}
.formContactBottom .form-control::placeholder {color:var(--red);font-family: "WorkSans";font-size:var(--font24);;}
.formContactBottom .form-control.alert-danger::placeholder{color:var(--white)}
.formContactBottom input.form-control{border:none;border-radius:unset;padding: .375rem 0rem;border-bottom:1px solid var(--red);font-family: "WorkSans";font-size:var(--font24);;margin-bottom:1rem}
.formContactBottom textarea.form-control{border-radius:unset;border:1px solid var(--red);font-family: "WorkSans";font-size:var(--font24);;}
.formContactBottom .form-label{color:var(--red);font-family: "WorkSans";font-weight:400;font-size:var(--font24);;margin-top: 4rem;}
.formContactBottom .btn-red{color: var(--white);border:1px solid var(--red);background-color: var(--red);border-color: var(--red);font-weight:400;font-size:var(--font24);;border-radius: 24px;padding: .375rem 1.25rem;margin:3rem 0;}
.formContactBottom .btn-red:hover{color: var(--red);background-color: var(--white);}

.blocEquipe{padding: 11rem 7% 3rem; color:var(--red);background: var(--white);position: relative;z-index:1;}
.blocEquipe h2.second{font-size:var(--font72);font-weight: 600;padding-bottom: 3rem;padding-top: 3rem;}
.blocEquipe p{font-size:var(--font72);font-weight: 500;line-height:1}
.blocEquipe img.visuelAgence, .blocEquipe img.visuelEquipe {object-fit: cover;-o-object-fit: cover; width: 100%;}

.blocListeLogos{padding: 2rem 7% 10rem;color:var(--red);background: var(--white);position: relative;z-index:1;}
.blocListeLogos h2.second{font-size:var(--font72);font-weight: 600;padding-bottom: 3rem;padding-top: 3rem;}
.blocListeLogos .listeLogos .oneLogo{height:200px;display: inherit;padding: 0 4rem;}
.blocListeLogos .listeLogos .oneLogo img{width:100%;object-fit:cover;-o-object-fit:cover;display: block;
  margin: auto;
  max-height: 5rem;
  max-width: 10rem;
  max-height: 13rem;
  max-width: 13rem;
  width: 100%;
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  filter: grayscale(100%);
  transition: all 0.6s;}
  .blocListeLogos .listeLogos .oneLogo:hover img{
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
    -o-filter: grayscale(0%);
    -ms-filter: grayscale(0%);
    filter: grayscale(0%);
    transition: all 0.6s;}

.blocPageClassique{padding:0 7% 3rem ;margin-top:218px;position: relative;z-index:1;}
.blocPageClassique .titre h1{color:var(--red);font-weight:600;font-size:var(--font72);width:80%;}
.blocPageClassique .contenu p{font-size:var(--font24);;font-weight:300;}

.blocPageNews{padding:0 7% 3rem ;margin-top:218px;position: relative;z-index:1;}
.blocPageNews.redview {  margin-top: 30px;}
.blocPageNews.redview h1.redview{font-weight:300;font-size:var(--font60);}

.btnInscription{font-weight:700;font-size:var(--font21);}

.mainContent .date{font-weight:600;color:var(--red);font-size:var(--font34);}
.mainContent .share{text-align:right;color:var(--red);font-size:var(--font20);;}
.mainContent .share .redRound {color: var(--white);background: var(--red);padding:0.188rem 0;margin-right: 0.5rem;width: 38px;display: inline-block;text-align: center;border:1px solid var(--red);border-radius: 50%;}
.mainContent .share .redRound:hover {color:var(--red);background:var(--white);}
.mainContent h1{font-size:var(--font72);font-weight:600;color:var(--red);}
.mainContent p.accroche {font-size:var(--font31);font-weight:500;line-height: 1.2;}
.mainContent p, .mainContent ul li {font-size:var(--font22);font-weight:300;}
.mainContent strong {font-weight:600}
.mainContent h2{font-weight:700;font-size:var(--font30);color:var(--red);padding: 1rem 0;}
.mainContent img{width:100%;height:auto;margin-bottom:1.5rem;margin-top:1.5rem;}
.mainContent .borderTop {border-top: 1px solid var(--red);padding-top: 1.5rem;margin-top: 2rem;}
.aside .border-left{border-left:1px solid var(--black);padding-left: 1.5rem;}
.aside h4{color:var(--black);font-weight:700;font-size:var(--font39);;}
.aside ul{padding:0;width:100%;list-style:none;}
.aside ul li{width:100%;position:relative;margin-top:1rem}
.aside ul li img{max-width:100%;aspect-ratio:4/3;object-fit:cover;-o-object-fit:cover;}
.aside ul li p.titre{position:absolute;color:var(--white);font-size:var(--font16);top:0.8rem;left:0.8rem;}
.aside ul li .infosCat{position:absolute;bottom:0.8rem;left:0.8rem;height:20px;}
.aside ul li .infosCat img.logoExpertise{height:100%;aspect-ratio:unset;max-width:unset;margin-right:0.5rem}

/* -------------------------------------------------------------------------- */
    /* ATELIERS */
/* -------------------------------------------------------------------------- */


.blocAtelier {padding: 1rem 8% 0;color: var(--red);background: var(--white);position: relative;z-index:1;}
.blocAtelier h2{font-size:var(--font91);}
.blocAtelier h2.underTrait::after{content:"";position:absolute;width:100px;height:4px;background:var(--red);right:calc(50% - 50px);bottom:0;}*
.c_hero {position: absolute;top: 50%;left: 8%;transform: translate(0,-50%);width: 80%;}
.libAtelier {font-size: var(--font40);margin: auto;display: inline-block;color: var(--white);background: var(--red);letter-spacing: -1.6px;}
.atelier{}
.atelier h3{font-size:var(--font39);}
.atelier strong {font-size: var(--font40);font-weight: 300;line-height: 1;letter-spacing: -1.63px;}
.atelier ul{color:var(--black);font-size:var(--font25);line-height:1.6;font-weight:500;letter-spacing:-1.05px;padding-top:2rem;padding-left:0;}
.atelier ul li{margin-bottom:2rem;list-style:none;position:relative;padding-left:45px;}
.atelier ul li::before{position:absolute;width:32px;height:32px;left:0;top:6px;content:"";background-image:url('../img/check-pink.svg');}
.atelier blockquote {font-size: var(--font25);font-style: italic;letter-spacing: -1.05px;line-height: 1.4;text-align: center;}
.atelier div:last-child{color:var(--black);font-weight:400;text-align:center;line-height:2;font-size:var(--font18);padding-bottom:2rem;text-transform:uppercase;}
.marginN12{margin-top:-1.2px;}
.coinArrondi-be{border-radius:0 0 15px 0;}
.coinArrondi-st{border-radius:15px 0 0 0;}
.coinArrondi-bs{border-radius:0 0 0 15px;}
.coinArrondi-et{border-radius:0 15px 0 0;}
.border-e{border-right:2px dotted var(--red);}
.border-s{border-left:2px dotted var(--red);}
.border-b{border-bottom:2px dotted var(--red);}
.border-t{border-top:2px dotted var(--red);}
.bordure {display: block;width: 47.5%;height: calc(100% - 72px);position: absolute;border-right: 2px dotted var(--red);}

.blocMetho {padding: 1rem 7% 3rem;color: var(--white);background: var(--red);position: relative;z-index:1;}
.blocMetho h2{font-size:var(--font91);}
.blocMetho p{font-size: var(--font39);font-style: italic;letter-spacing: -1.638px;}
.blocMetho h2.underTrait::after{content:"";position:absolute;width:100px;height:4px;background:var(--white);right:calc(50% - 50px);bottom:0;}
.metho{position:relative;}
.metho:nth-child(1)::after,.metho:nth-child(2)::after,.metho:nth-child(4)::after{content:"";position:absolute;right:0;width:1px;height:62%;border-left:1px solid var(--white);top:19%;}
.metho .c_picto{width:100%;position:relative;}
.metho .c_picto img{margin:0 auto 1rem;width:40%;object-fit:cover;aspect-ratio:1;display:block;}
.metho h4{font-size:var(--font39);letter-spacing:-1.638px;margin-bottom:1rem;line-height:1;}
.metho p{font-size:var(--font25);letter-spacing:-1.05px;font-style:normal;line-height:1.2;}

/* -------------------------------------------------------------------------- */
/*
/*                           /* MEDIA QUERIES */
/*
/* -------------------------------------------------------------------------- */


/* Écran 15', 16' et 17' */
@media screen and (min-device-width: 1200px) and (max-device-width: 1800px) and (-webkit-min-device-pixel-ratio: 1){
  .headRed{padding:2rem 7%}
  .headRed .logoBrand{width:100px;height:100px;}
  .btnMenu{width:100px;height:100px;background-size:100px 100px;}
  .blocMenu .blocLang a {font-size:var(--font12);}
  .offcanvas-body{padding-top:2rem;}
  #offcanvasMenu{padding-top:3rem}
  .offcanvas-header .logoRed img{width:90px;height:90px;}
  .offcanvas-header button{margin-bottom:0}
  .blocIntro h1{font-size:var(--font86);width: 90%;padding-bottom: 0.5rem;}
  .blocIntro p{font-size:var(--font46);}
  .blocRefUne .nomClient{font-size:var(--font32);}
  .blocRefUne .refInfos {height:30px;}
  .blocTitle {margin-top: 164px;}
  .pt-9{padding-top:9rem;}
  .filtreRef .nav-link {font-size:var(--font16) !important;padding: 0 17px !important; height: 1.6rem; }
  .blocListeReferences{padding-top: 1rem}
  .blocListeReferences .card p.card-title{font-size:0.9rem;left:0.8rem;top:0.8rem}
  .blocListeReferences .card .card-cat img.logoExpertise{height:15px !important;margin-right: 0.5rem;}
  .blocListeReferences .card .card-cat{bottom:0.8rem;left:0.8rem;}
  .blocHero{margin-top:164px;height: calc(100vh - 164px);}
  .blocHero img.logoatelier{margin-bottom:2rem;}
  .blocHero h1 {font-size:var(--font58);width:88%;margin-bottom:2rem;}
  .blocHero p.medium{font-size:var(--font24);line-height: 1.2;width:88%;}
  .blocTitle h1, .blocTitle p.categorie{font-size:var(--font56);letter-spacing: -0.1rem;font-weight:600;margin-bottom:0;}
  .blocAccroche{padding-top:1rem}
  .blocAccroche h2{font-size:var(--font80);height: 240px;width:88%;padding-bottom:1rem;}
  .blocAccroche h2.second, .blocEquipe h2.second, .blocListeLogos h2.second{font-size:var(--font56)}
  .blocAccroche p{font-size:var(--font55);}
  .blocAccroche p.medium {font-size:var(--font29);line-height: 1.2;}
  .blocAccroche p.big{font-size:var(--font96);}
  .blocAccroche p.semiBold {font-size:var(--font56); padding-bottom: 2rem; line-height: 1.05;  margin-top: 3rem;  }

  .blocEquipe h2.second {padding-bottom: 2rem;padding-top: 2.5rem;}
  .blocEquipe .medium {font-size:var(--font56); width: 90%;  }

  .blocTopRef h1 {font-size:var(--font64); width: 75%;bottom: 4rem;  }
  .blocDetailsRef .client p{font-size:var(--font48);}
  .blocDetailsRef hr{margin-bottom:1rem}
  .blocDetailsRef .features p{font-size:var(--font19);}
  .blocDetailsRef .desc h2{font-size:var(--font17p6);text-transform:uppercase;}
  .blocDetailsRef .desc p, .blocDetailsRef .desc ul {font-size:0.9rem;}
  .blocDetailsRef .accroche p{font-size:var(--font40);;padding-left:2rem}
  .blocDetailsRef .tTemoignages p{font-size:var(--font28);}

  .blocContactBottom .colForm {}
  .formContactBottom {padding-top: 1rem;}
  .formContactBottom .form-label{margin-top:0}

  .blocContactBottom .colForm p{font-size:var(--font28);}
  .blocContactBottom .colForm h3{font-size:var(--font17p6);}

  .blocContactBottom .colForm p{font-size:var(--font28);}
  .blocContactBottom .colForm h3{font-size:var(--font17p6);}

  .formContactBottom .form-control::placeholder, .formContactBottom .form-label, .formContactBottom .btn-red{font-size:var(--font17p6)}
  .blocContactBottom .blocPresContact .infosContact .titre {font-size:var(--font16);margin-top: -0.4rem;}
  .blocContactBottom .blocPresContact .infosContact .nom {font-size:var(--font17p6)}
  .formContactBottom input.form-control, .formContactBottom textarea.form-control{font-size:var(--font17p6)}

  .blocTextCol h3{font-size:var(--font48);letter-spacing: -0.15rem;}
  .blocTextCol h2{font-size:var(--font48);letter-spacing: -0.15rem;}
  .blocTextCol .sousTitre{font-size:var(--font48);}
  .blocTextCol p{font-size:var(--font24);;}
  .blocTextCol p:nth-child(2) {font-size:var(--font17p6);margin-top: 3rem;}
  .blocTextCol a.linkProjet {font-size:var(--font27);background-size: 35px 35px;padding-right:60px}
  .blocTextCol h3 .picto img{margin-bottom:0.5rem;}


  .blocAtelier h2{font-size:var(--font72);letter-spacing: -0.15rem;}

  .blocMetho h2{font-size:var(--font72);}
  .blocMetho p{font-size: var(--font32);}
  .metho h4{font-size:var(--font30);}
  .metho p{font-size:var(--font20);}

  .blocLien{padding-top: 3.5rem;padding-bottom: 3.5rem;}
  .blocLien .lienFleche{font-size:var(--font30);padding-right:65px;background-size:40px 40px;}

  .blocListeNews .card .card-body .card-title{font-size:var(--font26)}
  .blocListeNews .card .card-body .cardDate{font-size:0.7rem}
  .blocListeNews .card .card-body .card-text{font-size:0.9rem;line-height:1.2}

  .blocPageNews{margin-top: 168px;}
  .mainContent .date{font-size:var(--font30);}
  .mainContent .share{font-size:var(--font16);}
  .mainContent h1 {font-size:var(--font48);line-height: 1.1;}
  .mainContent p.accroche{font-size:var(--font24);}
  .mainContent p, .mainContent ul li{font-size:var(--font21);}
  .mainContent h2{font-size:var(--font26)}
  .aside h4 {font-size:var(--font30);line-height: 1.1;}
  .mainContent .share .redRound{width: 32px;}
  .blocListeLogos{padding-top:4rem}

  .blocContact .details p{font-size:var(--font26);}
  .blocContact .cform h2{font-size:var(--font26);}
  .blocContact .cform p{font-size:var(--font17p6);}
  .formContact .form-check .form-check-label{font-size:var(--font17p6);}
  .formContact input.form-control, .formContact .form-control::placeholder{font-size:var(--font17p6);}
  .formContact input.form-control{margin-bottom:0.5rem}
  .formContact .form-check{margin-top:1.5rem}
  .formContact .btn-red{font-size:var(--font17p6);}

  .blocPageClassique{margin-top: 168px;}
  .blocPageClassique .titre h1{font-size:var(--font48);}
  .blocPageClassique .contenu p{font-size:var(--font21);}

  footer .mainTop p, footer .mainTop a{font-size:var(--font22);}
  footer .lastFooter p, footer .lastFooter a{font-size:0.9rem;}
  footer .logoAteliers {height: 44px;width: 162px;background-size:162px 44px}
  footer .backToTop{height: 80px;width: 81px;background-size:81px 80px;}
}

@media screen and (min-device-width: 1200px) and (max-device-width: 1400px) and (-webkit-min-device-pixel-ratio: 1){
  .blocAccroche h2{font-size:var(--font72);}
}


/* Écran 13 pouces ou HDPI */
/* @media screen and (min-device-width: 992px) and (max-device-width: 1440px){ */
@media screen and (min-device-width: 992px) and (max-device-width: 1280px){
  .headRed{padding:2rem 7%}
  .headRed .logoBrand{width:100px;height:100px;}
  .btnMenu{width:100px;height:100px;background-size:100px 100px;}
  .blocMenu .blocLang a {font-size:var(--font12);}
  .offcanvas-body{padding-top:2rem;}
  .offcanvas-body .nav-link{  font-size:var(--font88);}
  #offcanvasMenu{padding-top:3rem}
  .offcanvas-header .logoRed img{width:90px;height:90px;}
  .offcanvas-header button{margin-bottom:0}

  .blocIntro h1{font-size:var(--font86);width: 88%;padding-bottom: 0.5rem;}
  .blocIntro p{font-size:var(--font46);}
  .blocTitle {margin-top: 168px;}

  .filtreRef .nav-link {font-size:var(--font16) !important;padding: 0 17px !important; height: 1.6rem; }
  .blocListeReferences{padding-top: 1rem}
  .blocListeReferences .card p.card-title{font-size:0.9rem;left:0.8rem;top:0.8rem}
  .blocListeReferences .card .card-cat img.logoExpertise{height:15px !important;margin-right: 0.5rem;}
  .blocListeReferences .card .card-cat{bottom:0.8rem;left:0.8rem;}
  .blocRefUne .nomClient{font-size:var(--font32);}
  .blocRefUne .refInfos {height:30px;}
  .blocHero{margin-top:164px;height: calc(100vh - 164px);}
  .blocHero img.logoatelier{margin-bottom:2rem;}
  .blocHero h1 {font-size:var(--font58);width:88%;margin-bottom:2rem;}
  .blocHero p.medium{font-size:var(--font24);line-height: 1.2;width:88%;}
  .blocTitle h1{font-size:var(--font48);}
  .blocAccroche{padding-top:1rem}
  .blocAccroche h2{font-size:var(--font80);height: 190px;width:88%;padding-bottom:1rem;}
  .blocAccroche p.medium{font-size:var(--font22);line-height: 1.2;}
  .blocAccroche h2.second, .blocEquipe h2.second, .blocListeLogos h2.second{font-size:var(--font56)}
  .blocAccroche p.big{font-size:var(--font80);}
  .blocAccroche p.semiBold {font-size:var(--font56); padding-bottom: 2rem; line-height: 1.05;  margin-top: 3rem;  }

  .blocEquipe h2.second {padding-bottom: 2rem;padding-top: 2.5rem;}
  .blocEquipe .medium {font-size:var(--font56); width: 90%;  }

  .blocTopRef h1 {font-size:var(--font64); width: 75%;bottom: 4rem;  }
  .blocDetailsRef .client p{font-size:var(--font40);;}
  .blocDetailsRef hr{margin-bottom:1rem}
  .blocDetailsRef .features p{font-size:var(--font19);}
  .blocDetailsRef .desc h2{font-size:var(--font17p6);text-transform:uppercase;}
  .blocDetailsRef .desc p, .blocDetailsRef .desc ul {font-size:0.9rem;}

  .blocDetailsRef .accroche p{font-size:var(--font40);;padding-left:2rem}
  .blocDetailsRef .tTemoignages p{font-size:var(--font28);}

  .blocContactBottom .colForm {}
  .formContactBottom {padding-top: 1rem;}
  .formContactBottom .form-label{margin-top:0}

  .blocContactBottom .blocPresContact .infosContact{top:50%;}
  .blocContactBottom .colForm p{font-size:var(--font28);}
  .blocContactBottom .colForm h3{font-size:var(--font17p6);}

  .formContactBottom .form-control::placeholder, .formContactBottom .form-label, .formContactBottom .btn-red{font-size:var(--font17p6)}
  .blocContactBottom .blocPresContact .infosContact .titre {font-size:var(--font16);margin-top: -0.4rem;}
    .blocContactBottom .blocPresContact .infosContact .nom {font-size:var(--font17p6)}
  .formContactBottom input.form-control, .formContactBottom textarea.form-control{font-size:var(--font17p6)}

  .blocTextCol h3{font-size:var(--font48);letter-spacing: -0.15rem;}
  .blocTextCol h2{font-size:var(--font48);letter-spacing: -0.15rem;}
  .blocTextCol .sousTitre{font-size:var(--font48);}
  .blocTextCol p{font-size:var(--font24);;}
  .blocTextCol p:nth-child(2) {font-size:var(--font17p6);margin-top: 3rem;}
  .blocTextCol a.linkProjet {font-size:var(--font27);background-size: 35px 35px;padding-right:60px}
  .blocTextCol h3 .picto img{margin-bottom:0.5rem;}

  .blocAtelier h2{font-size:var(--font72);letter-spacing: -0.15rem;}

  .blocMetho h2{font-size:var(--font72);}
  .blocMetho p{font-size: var(--font32);}
  .metho h4{font-size:var(--font30);}
  .metho p{font-size:var(--font20);}

  .blocLien{padding-top: 3.5rem;padding-bottom: 3.5rem;}
  .blocLien .lienFleche{font-size:var(--font30);padding-right:65px;background-size:40px 40px;}

  .blocListeNews .card .card-body .card-title{font-size:var(--font26)}
  .blocListeNews .card .card-body .cardDate{font-size:0.7rem}
  .blocListeNews .card .card-body .card-text{font-size:0.9rem;line-height:1.2}

  .blocPageNews{margin-top: 168px;}
  .mainContent .date{font-size:var(--font30);}
  .mainContent .share{font-size:var(--font16);}
  .mainContent h1 {font-size:var(--font48);line-height: 1.1;}
  .mainContent p.accroche{font-size:var(--font24);}
  .mainContent p, .mainContent ul li{font-size:var(--font21);}
  .mainContent h2{font-size:var(--font26)}
  .aside h4 {font-size:var(--font30);line-height: 1.1;}
  .mainContent .share .redRound{width: 32px;}

  .blocContact .details p{font-size:var(--font26);}
  .blocContact .cform h2{font-size:var(--font26);}
  .blocContact .cform p{font-size:var(--font17p6);}
  .formContact .form-check .form-check-label{font-size:var(--font17p6);}
  .formContact input.form-control, .formContact .form-control::placeholder{font-size:var(--font17p6);}
  .formContact input.form-control{margin-bottom:0.5rem}
  .formContact .form-check{margin-top:1.5rem}
  .formContact .btn-red{font-size:var(--font17p6);}

  .blocPageClassique{margin-top: 168px;}
  .blocPageClassique .titre h1{font-size:var(--font48);}
  .blocPageClassique .contenu p{font-size:var(--font21);}

  footer .mainTop p, footer .mainTop a{font-size:var(--font22);}
  footer .lastFooter p, footer .lastFooter a{font-size:0.9rem;}
  footer .logoAteliers {height: 44px;width: 162px;background-size:162px 44px}
}

/* Smartphone Portrait / Paysage & Tablette Portrait */
@media(max-width: 810px){


  .blocTitle {margin-top: 112px;}
  .blocTitle h1 {font-size:var(--font37);letter-spacing: -0.15rem;}
  .pt-9{padding-top:4rem;}
  footer{padding:50px 0}
  footer .mainTop:first-of-type p{padding-left:unset;}
  footer .mainTop p, footer .mainTop a, footer .lastFooter p, footer .lastFooter a {font-size:var(--font24);;line-height: 1.2;letter-spacing: -0.1rem;}
  footer .backToTop{width: 52px;height: 80px;background-size: 52px 52px;}
  /*footer .borderTop p, footer .borderTop a{font-size:var(--font27);}*/
  footer .logoAteliers{bottom: 20px;top: unset;right: unset;left: 4%;}
  footer .col-12:nth-child(2) hr{display: none;}
  footer .mainTop:nth-child(2){padding-bottom:70px;border-bottom:1px solid var(--white);margin-bottom: 2rem;}
  footer .lastFooter:first-of-type{padding-left:4%}

  .blocIntro {padding:3rem 7%}
  .blocIntro h1{font-size:var(--font39);;}
  .blocIntro p{font-size:var(--font37);}

  .blocRefUne ul li{min-height:unset;}
  .blocRefUne .nomClient{font-size:var(--font20);;top: 1rem;}
  .blocRefUne .refInfos{bottom:1rem;height:26px;}

  .blocLien .lienFleche{font-size:var(--font24);;background-size: 26.5px 26.5px;letter-spacing: -0.10rem;padding-right:45px;}
  .blocLien {padding-top: 3rem;padding-bottom: 3rem;}

  .blocHero {margin-top: 112px;height: calc(100vh - 112px);}
  .blocHero img.logoatelier{width:100%;}
  .blocHero h1 {font-size:var(--font46);width:100%;}
  .blocHero p.medium{font-size:var(--font26);line-height: 1.05;width:100%;}

  .blocTopRef h1{font-size:var(--font49);letter-spacing: -0.15rem;}
  .btnToSuite{height:52px;width:52px;right:2rem;bottom: 2rem;}
  .btnToSuite svg{width:52px;height:52px;}

  .blocDetailsRef{padding-top:3rem}
  .blocDetailsRef .client p{font-size:var(--font49);}
  .blocDetailsRef .features hr, .blocDetailsRef .desc hr{opacity:0}
  .blocDetailsRef .accroche p{padding-left:0;font-size:var(--font49)}
  .blocDetailsRef .col-12 img.refVisuel {aspect-ratio: 16/9;width: 100%;}
  .blocDetailsRef img.refVisuel {aspect-ratio: 16/9;width: 100%;}
  .blocDetailsRef .tTemoignages p{font-size:var(--font22);;margin-left: 3rem;}
  .blocDetailsRef .vTemoignages {min-height: 230px; }
  .blocDetailsRef .desc p, .blocDetailsRef .desc ul{letter-spacing:-0.1rem;}

  .blocListeNews .card .card-body .card-title, 
  .blocListeNews .card .card-body .cardDate, 
  .blocListeNews .card .card-body .card-text{font-size:var(--font22);;}
  .blocListeNews .borderLeftRight {border-left:none;}
  .blocContact .details p, .blocContact .details h2, .blocContact .cform h2, .blocContact .cform p{font-size:var(--font22);}
  .formContact .form-control::placeholder{font-size:var(--font22);}
  .formContact .form-label{font-size:var(--font22);}
  .formContact .form-check .form-check-label{font-size:var(--font22);}
  .formContact .btn-red{font-size:var(--font22);}

  .blocContactBottom{padding-top:2rem;padding-bottom:2rem;}
  .blocContactBottom .blocPresContact img.photoContact{aspect-ratio:16/9;min-height:255px;object-position: top;}
  .blocContactBottom .blocPresContact .infosContact{bottom: 0rem;}
  .blocContactBottom .colForm{}
  .blocContactBottom .colForm h3{font-size:var(--font17p6);}
  .formContactBottom .form-label{margin-top:0}
  .formContactBottom .form-control::placeholder, 
  .formContactBottom input.form-control {font-size:var(--font22);}
  .blocContactBottom .colForm p{font-size:var(--font22);}

  .c_hero {
    position: relative;
    top: unset;
    left: unset;
    transform: unset;
    width: auto;
  }
  .blocAtelier{padding:1rem 0 0;}
  .blocAtelier h2{font-size:var(--font37);}
  .atelier{padding:0 7%;border-bottom:2px dotted var(--red);}
  .coinArrondi-be,
  .coinArrondi-st,
  .coinArrondi-bs,
  .coinArrondi-et{border-radius:unset;}
  .border-b, .border-t{border-bottom:none;border-top:none;}
  .libAtelier {font-size:var(--font30);width:100%;margin-bottom:1.5rem;}
  .atelier h3{font-size:var(--font24);text-align:center;letter-spacing: -1.008px;}
  .atelier strong {font-size: var(--font24);letter-spacing: -1.008px;text-align:center;}
  .atelier ul{font-size:var(--font20);letter-spacing:-1.05px;}
  .atelier blockquote {font-size: var(--font20);}
  .atelier div{text-align:center;}

  .blocMetho h2{font-size:var(--font37);}
  .blocMetho p{font-size: var(--font18);}
  .metho h4{font-size:var(--font24);line-height:1.4;}
  .metho p{font-size:var(--font18);line-height:1.5;}
  .metho::after{content: "" !important;position:absolute;width:75% !important;height:1px !important;border-bottom:1px solid var(--white);bottom:0  !important;left:unset  !important;top:unset  !important;border-left:none  !important;right:unset !important;}
  .metho:last-child::after{border-bottom:none;}
  .blocAccroche{padding-top:1rem;}
  .blocAccroche p{font-size:var(--font49);}
  .blocTextCol{padding-top:1rem;padding-bottom:3rem;}
  .blocTextCol h2{font-size:var(--font24);;padding-bottom:2rem;}
  .blocTextCol p, .blocTextCol .sousTitre {font-size:var(--font22);;}
  .blocTextCol > .row{padding-left:1rem;padding-right:1rem;}
  .blocTextCol .borderTop{padding-top:1rem;padding-bottom:4rem}
  .blocTextCol a.linkProjet{font-size:var(--font24);;letter-spacing:-0.15rem;background-size: 26.5px 26.5px;padding-right: 45px;}

  .blocAccroche h2{font-size:var(--font49);height: 230px;}
  .blocAccroche p.medium{font-size:var(--font37);letter-spacing: -0.15rem;line-height: 1;}
  .blocAccroche h2.second,
  .blocEquipe h2.second,
  .blocListeLogos h2.second{font-size:var(--font37);letter-spacing: -0.15rem;padding-top:1rem;}
  .blocAccroche p.big{font-size:var(--font49);letter-spacing: -0.15rem;}
  .blocAccroche p.semiBold{font-size:var(--font37);letter-spacing: -0.15rem;}
  .blocTextCol h3{font-size:var(--font24);;}

  .blocEquipe{padding-top:1rem;}
  .blocEquipe p.medium{font-size:var(--font37);letter-spacing:-0.15rem;}
  .blocEquipe img{aspect-ratio:16/9;}

  .blocPageClassique, .blocPageNews{margin-top: 112px;}
  .blocPageClassique .titre h1{font-size:var(--font37);letter-spacing:-0.15rem;}
  .blocPageClassique .contenu p{font-size:var(--font22);}

  .mainContent .date{font-size:var(--font24);;}
  .mainContent .share{font-size:var(--font16);}
  .mainContent .share .redRound{padding: 0.375rem 0;}
  .mainContent h1{font-size:var(--font37);letter-spacing:-0.15rem;}
  .mainContent h2{font-size:var(--font24);;}
  .mainContent p.accroche {font-size:var(--font22);letter-spacing:-0.05rem;}
  .mainContent p, .mainContent ul li{font-size:var(--font22);letter-spacing:-0.05rem;}
}


@import "./fonts.css";
@import "./vars.css";
@import "./commom.css";

/* -------------------------------------------------------------------------- */
    /* INDEX */
/* -------------------------------------------------------------------------- */
.blocTopHome {height: 100vh;position: relative;overflow: hidden;padding: 0;}
.videoTop {height: 100%;width: 100%;background: var(--white);-o-object-fit:cover;object-fit:cover;background-size:100% 100%;background-position:center center;background-image: url('https://www.red-agency.fr/uploads/images/pageHome/RED_FORMES.webp');background-repeat:no-repeat;}
.btnToSuite{position: absolute;bottom:4rem;right: 7%;transition: all ease-in-out .5s;height:122px;width:122px;}
.btnToSuiteMob{width: 86%;height: 58px;text-align: center;padding: 1rem 0;border: 2px solid var(--white);text-transform: uppercase;font-weight: 600;font-size:var(--font24);position: absolute;bottom: 2rem;line-height: 1;}
.btnToSuiteMob::after{position:absolute;content:'';width:15px;height:15px;background-image:url(../img/croix-white.svg);right:1rem;top: 1.25rem;}
.blocIntro{background: var(--red);color:var(--white);padding:9rem 7%;}
.blocIntro h1{font-size:var(--font135);font-weight:600;color:var(--white);line-height: 1;padding-bottom: 1.5rem;}
.blocIntro p{font-size:var(--font72);font-weight:600;color:var(--white);}
.blocRefUne{padding:0;}
.blocRefUne ul {list-style:none;padding: 0;}
.blocRefUne ul li {position:relative;aspect-ratio: 16 / 9;width:100%;min-height: 650px;}
.blocRefUne ul li img{object-fit:cover;-o-object-fit:cover;width:100%;height:100%;}
.blocRefUne ul li .refInfos img.logoExpertise {height: 100% !important; margin-right: 1rem;  width: auto !important;object-fit: cover;-o-object-fit:cover;}
.blocRefUne .refInfos {position:absolute;bottom: 4rem;left: 7%;display: flex;height: 45px;}
.blocRefUne .refInfos .picto{height:45px;margin-right:1.5rem;}
.blocRefUne .refInfos .picto.conseil{width:36px;background-size:36px 45px;}
.blocRefUne .refInfos .picto.branding{width:45px;background-size:45px 45px;}
.blocRefUne .refInfos .picto.digital{width:23px;background-size:23px 45px;}
.blocRefUne .refInfos .picto.media{width:29px;background-size:29px 45px;}
.blocRefUne .nomClient{position:absolute;top: 4rem;left: 7%;color:var(--white);font-size:var(--font40);;line-height:30px;text-transform: uppercase;font-weight:700;}
.blocLien{padding:9rem 7% 9rem ;background: var(--white);position: relative;z-index:1;}
.blocLien .lienFleche{position:relative;color:var(--red);font-size:var(--font45);font-weight:600;line-height:1;padding: 2rem 75px 2rem 0;background-image:url('https://www.red-agency.fr/template/site/img/redArrowRight.png'); background-repeat:no-repeat;background-position:center right; background-size:64px 63px;}
/*.blocLien .lienFleche::after{content:url(../img/redArrowRight.png);top: -2px;position: absolute;right: -81px;}*/

/* -------------------------------------------------------------------------- */
    /* PAGES */
/* -------------------------------------------------------------------------- */

.blocHero { height: calc(100vh - 218px);margin-top:218px;padding: 0 7% 0;position: relative;z-index:1;}
.blocHero.white{background:var(--red);color:var(--white);}
.blocHero img.logoatelier{max-width:900px;width:55%;margin-bottom:2rem;}
.blocHero h1{font-size:var(--font91);font-weight:600;line-height:0.9;margin-bottom:3rem;}
.blocHero p.medium{font-size:var(--font39);;font-weight:500;line-height:1.05;}

.blocTitle{padding:0 7% 1rem ;margin-top:218px;position: relative;z-index:1;}
.blocTitle.red{background:var(--white);color:var(--red);}
.blocTitle.white{background:var(--red);color:var(--white);}
.blocTitle h1, .blocTitle p.categorie{font-size:var(--font72);font-weight:600;margin-bottom: 0;}

.blocAccroche{padding:2rem 7%;background:var(--white);color:var(--red);position: relative;z-index:1;}
.blocAccroche.white{background:var(--red);color:var(--white);}
.blocAccroche p{font-size:var(--font135);font-weight:600;line-height:0.9;}
.blocAccroche p.big{font-size:var(--font135);padding-bottom:2rem;}
.blocAccroche p.semiBold{font-size:var(--font72);padding-bottom:2rem;}
.blocAccroche p.medium{font-size:var(--font39);;font-weight:500;line-height:1.1;padding-bottom: 1rem;width: 80%;}
.blocAccroche h2{font-size:var(--font135);font-weight:600;padding-bottom: 3rem;line-height: 1;letter-spacing: -0.25rem;height:315px;}
.blocAccroche h2.special{height:auto;}
.blocAccroche h2.second{font-size:var(--font72);font-weight:600;padding-bottom: 3rem;padding-top: 3rem;letter-spacing:unset;height:auto;}
.blocAccroche .dots{display:block;align-content: center; padding: 6rem;}

.blocAccroche .splideValeurs li{height: fit-content !important;}

.blocVideo {padding:2rem 0;aspect-ratio: 16 / 9;width:100%;position: relative;z-index:1;}
.blocVideo .divIframe{aspect-ratio: 16 / 9;}
.blocVideo iframe{width:100%;height:100%;}

.blocImage{padding:4rem 7%;width:100%;position: relative;z-index:1;background: #FFF;}
.blocImage img.alaUne{width:100%;aspect-ratio: 16 / 9;}

.blocTextCol{padding:6rem 7%;color:var(--red);background: var(--white);position: relative;z-index:1;}
.blocTextCol .borderTop{border-top:1px solid var(--red);padding-top: 2rem;padding-bottom:5rem;}
.blocTextCol h2{font-size:var(--font72);font-weight: 600;}
.blocTextCol h3{font-size:var(--font72);font-weight: 600;}
.blocTextCol p{font-size:var(--font39);;font-weight:500;line-height:1.1;}
.blocTextCol p:nth-child(2){font-size:var(--font25);;font-weight:400;line-height:1.1;color:var(--black);margin-top:5rem;}
.blocTextCol .sousTitre{font-size:var(--font72);font-weight:300;text-transform:uppercase}
.blocTextCol a.linkProjet{font-size:var(--font39);;font-weight:600;color:var(--red);padding: 1rem 80px 1rem 0;background-image:url('https://www.red-agency.fr/template/site/img/redArrowRight.png'); background-repeat:no-repeat;background-position:center right;background-size:49px 49px;}

.blocTextCol h3 .picto{display: inline-block;height: 55px;width: 55px;margin-right: 1rem;}
.blocTextCol h3 .picto img{margin-bottom:1rem;height:54px;}
.blocContactBottom {padding: 3rem 7%;background:var(--white);/*background: linear-gradient(180deg, var(--white) 28%, var(--grey) 28%)*/;border-top: 1px solid var(--red);position: relative;z-index:1;}
.blocContactBottom.noBorder{border:unset;}
.blocContactBottom .blocPresContact img.photoContact{width:100%;object-fit:cover;-o-object-fit:cover;}
.blocContactBottom .blocPresContact img.illustrationContact{width:100%;object-fit:cover;-o-object-fit:cover;}
.blocContactBottom .blocPresContact {position:relative;}
.blocContactBottom .blocPresContact .infosContact {position:absolute;left: 0;width: 90%;text-align: center;font-weight:400;top: 61%;}
.blocContactBottom .blocPresContact .infosContact .nom {color:var(--white);display:block;font-size:var(--font24);;}
.blocContactBottom .blocPresContact .infosContact .titre {color:var(--white);display:block;margin-bottom:1rem;font-size:var(--font22);;}
.blocContactBottom .blocPresContact .infosContact .email {color:var(--red);display:block;margin-bottom:1rem;font-size:var(--font20);;}
.blocContactBottom .colForm {/*padding-top: 12rem;*/}
.blocContactBottom .colForm h3{font-size:var(--font24);;text-transform:uppercase;color:var(--red);line-height:1}
.blocContactBottom .colForm p {font-size:var(--font39);;color:var(--red);line-height:1}
.blocContactBottom .border-left {border-left: 1px solid var(--red);}
.blocContactBottom .btn.btnRed {background: var(--red);color: var(--white);text-transform: uppercase;height: 50px;line-height: 38px;border-radius: 25px;font-weight:700;font-size:var(--font17p6);padding: 0.375rem 1.75rem;margin: 2rem 0 3rem;}
.blocContactBottom .colForm p.small {  font-size:var(--font16) !important;  font-weight: 300;}
.contentResponse h3 {  font-size:var(--font48);  font-weight: 600;letter-spacing: -0.1rem;}
.contentResponse p:first-of-type{ font-size:var(--font24);;color:var(--red);line-height:1}
.contentResponse p{max-width:580px;}
.filtreRef a.nav-link{font-size:var(--font22);;font-weight:400;padding:2px 17px;border:1px solid var(--red);color:var(--red);background:var(--white);margin-left:1rem;border-radius: 20px;}
.filtreRef a.nav-link.active{color:var(--white);background:var(--red);}
.blocListeReferences{padding: 2rem 7%;background:var(--white);position: relative;z-index:1;}

.blocListeReferences .card{width:100%;border: none;border-radius: unset;position:relative;height: 100%;}
.blocListeReferences .card:before{content:'';position:absolute;width:100%;height: calc(100% - 0.5rem);background:var(--red);top:0;bottom:0;right:0;left:0;z-index:1}
.blocListeReferences .card img{object-fit:cover;-o-object-fit:cover;height:100%;width:100%; aspect-ratio: 16/9;z-index:2;	opacity: 1;-webkit-transition: .3s ease-in-out;	transition: .3s ease-in-out;}
.blocListeReferences .card:hover img{opacity:0.5}
.blocListeReferences .card p.card-title{position:absolute;top:1rem;left:1rem;text-transform:uppercase;color:var(--white);font-size:var(--font20);;font-weight:700;z-index:10}
.blocListeReferences .card .card-cat{position:absolute;bottom: 1.5rem;left: 1rem;height: 28px;width: auto;z-index:10}
.blocListeReferences .card .card-cat img.logoExpertise{height:28px !important; width:auto !important;margin-right:0.8rem;object-fit:unset;-o-object-fit:unset;aspect-ratio:unset;}

.blocTopRef{height: 100vh;overflow: hidden;padding: 0;background:var(--black);position: relative;z-index:1;}
.blocTopRef .pictureUne{object-fit:cover;-o-object-fit:cover;height:100%;width: 100%;opacity: 0.75;}
.blocTopRef h1{font-weight:600;font-size:var(--font160);line-height:1;position:absolute;bottom:8rem;left:7%;color:var(--white);width:80%}

.blocDetailsRef{padding: 6rem 7% 0;background:var(--white);position: relative;z-index:1;}

.blocDetailsRef hr{opacity: 1;background:var(--red);margin-bottom: 2rem;}
.blocDetailsRef .client p{font-size:var(--font64);font-weight:600;color:var(--red);line-height:1}
.blocDetailsRef .features p{font-size:var(--font24);;font-weight:400;color:var(--red);line-height: 1.1;width: 75%;}
.blocDetailsRef .features p strong{font-weight:700;}
.blocDetailsRef .desc h2{line-height:1.1;}
.blocDetailsRef .desc p, .blocDetailsRef .desc ul {font-size:var(--font22);;font-weight:400;line-height:1.4;margin-bottom: 1rem;}

.blocDetailsRef img.refVisuel{object-fit:cover;-o-object-fit:cover;width: 100%;}
.blocDetailsRef .col-12 img.refVisuel{aspect-ratio: 16/9;width:100%;}
.blocDetailsRef .col-6 img.refVisuel{aspect-ratio: 1;width:100%;}

.blocDetailsRef .accroche {display:inline-grid}
.blocDetailsRef .accroche p{font-weight:600;font-size:var(--font60);padding-left:4rem;color:var(--red);line-height:1;}
.blocDetailsRef .accroche p:empty{padding:0;display:none}
.blocDetailsRef .vTemoignages{position:relative;}
.blocDetailsRef .author{display:inline-block;position:absolute;right:4rem;}
.blocDetailsRef .author p{font-size:var(--font24);;font-weight:700;color:var(--red);}
.blocDetailsRef .tTemoignages p{position:relative;font-size:var(--font39);;font-weight:500;line-height:1;color:var(--red);width:70%;}
.blocDetailsRef .vTemoignages, .blocDetailsRef .tTemoignages {padding-top:5rem;padding-bottom:5rem;}
.blocDetailsRef .author .temoignageVisuel{margin-bottom: 1rem;}
.blocDetailsRef .tTemoignages p::before{position:absolute;content:url(../img/chevronOpen.png);height:40px;width:44px;top: 11px;left: -52px;}
.blocDetailsRef .tTemoignages p::after{position:absolute;content:url(../img/chevronClose.png);height:40px;width:44px;bottom: 11px;right: -52px;}

.blocAutresRef{padding: 2rem 7% 15rem;background:var(--white);position: relative;z-index:1;}
.blocAutresRef .splide__slide {padding-right:2rem;  }
.blocAutresRef .splide__slide a{position:relative;}
.blocAutresRef .splide__slide a img{object-fit:cover;-o-object-fit:cover;height:100%;width:100%;}
.blocAutresRef .splide__slide a p.titre{position:absolute;top: -13.5rem;left:1rem;color:var(--white);text-transform:uppercase;font-weight:700;}
.blocAutresRef .splide__arrows{position: absolute;top: 23rem;width: 100%;}
.blocAutresRef .splide__arrow {width:122px;height:122px;background-color: unset;}
.blocAutresRef .splide__arrow--prev {background-image:url(../img/arrowLeft.png);background-size:122px 122px;left: 0;}
.blocAutresRef .splide__arrow--next {background-image:url(../img/arrowRight.png);background-size:122px 122px;right: 0;}
.blocAutresRef .splide__arrow svg{display:none;}



.blocListeNews{padding: 2rem 7% 1rem;background:var(--white);position: relative;z-index:1;}
.blocListeNews .card{border:none;border-radius:unset;}
.blocListeNews .card .card-body{padding: 1rem 0;}
.blocListeNews .card .card-body .card-title{color:var(--red);font-size:var(--font39);;font-weight:500;line-height:1;}
.blocListeNews .card .card-body .cardDate{color:var(--red);font-size:var(--font16);font-weight:600;padding:1rem 0;line-height:1;}
.blocListeNews .card .card-body .card-text{font-size:var(--font22);;font-weight:400;line-height: 1;max-height:67px;overflow: hidden;}

.blocListeNews .borderLeftRight{border-left:1px solid var(--red);}
.blocListeNews .lgoInfraRed {max-width: 60%;}
.blocContact{padding: 1rem 7% 1rem;background:var(--white);position: relative;z-index:1;}
.blocContact .details{color:var(--red)}
.blocContact .details h2{font-size:var(--font24);;font-weight:500;line-height: 1;margin-bottom: 0;}
.blocContact .details p{font-size:var(--font39);;font-weight:500;font-weight:500;line-height:1;margin-bottom: 2.5rem;}
.blocContact .details a{color:inherit;}
.blocContact .cform h2{color:var(--red);font-size:var(--font39);;font-weight:500;line-height:1;}
.blocContact .cform p{color:var(--red);font-size:var(--font24);;font-weight:500;line-height: 1.1;margin-top: 1.5rem;}
.blocContact .cform hr{color:var(--red);opacity:1;margin-top: 0;margin-bottom: 2rem;}
  
.formContact {margin-bottom: 5rem;margin-top: 1.5rem;}
.formContact .form-control::placeholder {color:var(--red);font-family: "WorkSans";font-size:var(--font24);;}
.formContact input.form-control{border:none;border-radius:unset;padding: .375rem 0rem;border-bottom:1px solid var(--red);font-family: "WorkSans";font-size:var(--font24);;margin-bottom:1rem}
.formContact textarea.form-control{border-radius:unset;border:1px solid var(--red);font-family: "WorkSans";font-size:var(--font24);;}
.formContact .form-label{color:var(--red);font-family: "WorkSans";font-weight:500;font-size:var(--font24);;}
.formContact .form-check{color:var(--red);font-weight:500;font-size:var(--font24);;margin-bottom:1rem;}
.formContact .form-check .form-check-label{color:var(--red);font-weight:500;font-size:var(--font24);;line-height: 1.1;}
.formContact .form-check .form-check-input{border:1px solid var(--red);}
.formContact .btn-red{color: var(--white);background-color: var(--red);border:1px solid var(--red);font-weight:500;font-size:var(--font24);;border-radius: 24px;padding: .375rem 1.25rem;margin:1rem 0;}
.formContact .btn-red:hover{color:var(--red) ;background-color: var(--white);}

.contentContactResponse {padding: 6rem 0;background-image: url(../img/cerf-volant.png);background-repeat: no-repeat;background-position: left bottom;background-size: 25% auto;}
.contentContactResponse h3 {text-align: center;  font-weight: 600;  font-size:var(--font72);  letter-spacing: -0.2rem;color:var(--red)}
.contentContactResponse p{text-align:center;padding-top:2rem;font-size:var(--font24);;color:var(--red);line-height:1}

.formContactBottom .form-control.alert-danger {background:var(--red) !important;color:var(--white)}
.confirmRedViewBg {background-image:url(../img/redview-newspaper.png);background-repeat:no-repeat;background-position: 65% bottom; background-size: 550px auto;}
.formContactBottom{padding-top:3rem}
.formContactBottom .form-control{background:var(--grey)}
.formContactBottom .form-control::placeholder {color:var(--red);font-family: "WorkSans";font-size:var(--font24);;}
.formContactBottom .form-control.alert-danger::placeholder{color:var(--white)}
.formContactBottom input.form-control{border:none;border-radius:unset;padding: .375rem 0rem;border-bottom:1px solid var(--red);font-family: "WorkSans";font-size:var(--font24);;margin-bottom:1rem}
.formContactBottom textarea.form-control{border-radius:unset;border:1px solid var(--red);font-family: "WorkSans";font-size:var(--font24);;}
.formContactBottom .form-label{color:var(--red);font-family: "WorkSans";font-weight:400;font-size:var(--font24);;margin-top: 4rem;}
.formContactBottom .btn-red{color: var(--white);border:1px solid var(--red);background-color: var(--red);border-color: var(--red);font-weight:400;font-size:var(--font24);;border-radius: 24px;padding: .375rem 1.25rem;margin:3rem 0;}
.formContactBottom .btn-red:hover{color: var(--red);background-color: var(--white);}

.blocEquipe{padding: 11rem 7% 3rem; color:var(--red);background: var(--white);position: relative;z-index:1;}
.blocEquipe h2.second{font-size:var(--font72);font-weight: 600;padding-bottom: 3rem;padding-top: 3rem;}
.blocEquipe p{font-size:var(--font72);font-weight: 500;line-height:1}
.blocEquipe img.visuelAgence, .blocEquipe img.visuelEquipe {object-fit: cover;-o-object-fit: cover; width: 100%;}

.blocListeLogos{padding: 2rem 7% 10rem;color:var(--red);background: var(--white);position: relative;z-index:1;}
.blocListeLogos h2.second{font-size:var(--font72);font-weight: 600;padding-bottom: 3rem;padding-top: 3rem;}
.blocListeLogos .listeLogos .oneLogo{height:200px;display: inherit;padding: 0 4rem;}
.blocListeLogos .listeLogos .oneLogo img{width:100%;object-fit:cover;-o-object-fit:cover;display: block;
  margin: auto;
  max-height: 5rem;
  max-width: 10rem;
  max-height: 13rem;
  max-width: 13rem;
  width: 100%;
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  filter: grayscale(100%);
  transition: all 0.6s;}
  .blocListeLogos .listeLogos .oneLogo:hover img{
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
    -o-filter: grayscale(0%);
    -ms-filter: grayscale(0%);
    filter: grayscale(0%);
    transition: all 0.6s;}

.blocPageClassique{padding:0 7% 3rem ;margin-top:218px;position: relative;z-index:1;background:var(--white);}
.blocPageClassique .titre h1{color:var(--red);font-weight:600;font-size:var(--font72);width:80%;}
.blocPageClassique .contenu p{font-size:var(--font24);;font-weight:300;}

.blocPageNews{padding:0 7% 3rem ;margin-top:218px;position: relative;z-index:1;background: #FFF;}
.blocPageNews.redview {  margin-top: 30px;}
.blocPageNews.redview h1.redview{font-weight:300;font-size:var(--font60);}

.btnInscription{font-weight:700;font-size:var(--font21);}

.mainContent .date{font-weight:600;color:var(--red);font-size:var(--font34);}
.mainContent .share{text-align:right;color:var(--red);font-size:var(--font20);;}
.mainContent .share .redRound {color: var(--white);background: var(--red);padding:0.188rem 0;margin-right: 0.5rem;width: 38px;display: inline-block;text-align: center;border:1px solid var(--red);border-radius: 50%;}
.mainContent .share .redRound:hover {color:var(--red);background:var(--white);}
.mainContent h1{font-size:var(--font72);font-weight:600;color:var(--red);}
.mainContent p.accroche {font-size:var(--font31);font-weight:500;line-height: 1.2;}
.mainContent p, .mainContent ul li {font-size:var(--font22);font-weight:300;}
.mainContent strong {font-weight:600}
.mainContent h2{font-weight:700;font-size:var(--font30);color:var(--red);padding: 1rem 0;}
.mainContent img{width:100%;height:auto;margin-bottom:1.5rem;margin-top:1.5rem;}
.mainContent .borderTop {border-top: 1px solid var(--red);padding-top: 1.5rem;margin-top: 2rem;}
.aside .border-left{border-left:1px solid var(--black);padding-left: 1.5rem;}
.aside h4{color:var(--black);font-weight:700;font-size:var(--font39);;}
.aside ul{padding:0;width:100%;list-style:none;}
.aside ul li{width:100%;position:relative;margin-top:1rem}
.aside ul li img{max-width:100%;aspect-ratio:4/3;object-fit:cover;-o-object-fit:cover;}
.aside ul li p.titre{position:absolute;color:var(--white);font-size:var(--font16);top:0.8rem;left:0.8rem;}
.aside ul li .infosCat{position:absolute;bottom:0.8rem;left:0.8rem;height:20px;}
.aside ul li .infosCat img.logoExpertise{height:100%;aspect-ratio:unset;max-width:unset;margin-right:0.5rem}

/* -------------------------------------------------------------------------- */
    /* ATELIERS */
/* -------------------------------------------------------------------------- */


.blocAtelier {padding: 1rem 8% 0;color: var(--red);background: var(--white);position: relative;z-index:1;}
.blocAtelier h2{font-size:var(--font91);}
.blocAtelier h2.underTrait::after{content:"";position:absolute;width:100px;height:4px;background:var(--red);right:calc(50% - 50px);bottom:0;}*
.c_hero {position: absolute;top: 50%;left: 8%;transform: translate(0,-50%);width: 80%;}
.libAtelier {font-size: var(--font40);margin: auto;display: inline-block;color: var(--white);background: var(--red);letter-spacing: -1.6px;}
.atelier{}
.atelier h3{font-size:var(--font39);}
.atelier strong {font-size: var(--font40);font-weight: 300;line-height: 1;letter-spacing: -1.63px;}
.atelier ul{color:var(--black);font-size:var(--font25);line-height:1.6;font-weight:500;letter-spacing:-1.05px;padding-top:2rem;padding-left:0;}
.atelier ul li{margin-bottom:2rem;list-style:none;position:relative;padding-left:45px;}
.atelier ul li::before{position:absolute;width:32px;height:32px;left:0;top:6px;content:"";background-image:url('../img/check-pink.svg');}
.atelier blockquote {font-size: var(--font25);font-style: italic;letter-spacing: -1.05px;line-height: 1.4;text-align: center;}
.atelier div:last-child{color:var(--black);font-weight:400;text-align:center;line-height:2;font-size:var(--font18);padding-bottom:2rem;text-transform:uppercase;}
.marginN12{margin-top:-1.2px;}
.coinArrondi-be{border-radius:0 0 15px 0;}
.coinArrondi-st{border-radius:15px 0 0 0;}
.coinArrondi-bs{border-radius:0 0 0 15px;}
.coinArrondi-et{border-radius:0 15px 0 0;}
.border-e{border-right:2px dotted var(--red);}
.border-s{border-left:2px dotted var(--red);}
.border-b{border-bottom:2px dotted var(--red);}
.border-t{border-top:2px dotted var(--red);}
.bordure {display: block;width: 47.5%;height: calc(100% - 72px);position: absolute;border-right: 2px dotted var(--red);}

.blocMetho {padding: 1rem 7% 3rem;color: var(--white);background: var(--red);position: relative;z-index:1;}
.blocMetho h2{font-size:var(--font91);}
.blocMetho p{font-size: var(--font39);font-style: italic;letter-spacing: -1.638px;}
.blocMetho h2.underTrait::after{content:"";position:absolute;width:100px;height:4px;background:var(--white);right:calc(50% - 50px);bottom:0;}
.metho{position:relative;}
.metho:nth-child(1)::after,.metho:nth-child(2)::after,.metho:nth-child(4)::after{content:"";position:absolute;right:0;width:1px;height:62%;border-left:1px solid var(--white);top:19%;}
.metho .c_picto{width:100%;position:relative;}
.metho .c_picto img{margin:0 auto 1rem;width:40%;object-fit:cover;aspect-ratio:1;display:block;}
.metho h4{font-size:var(--font39);letter-spacing:-1.638px;margin-bottom:1rem;line-height:1;}
.metho p{font-size:var(--font25);letter-spacing:-1.05px;font-style:normal;line-height:1.2;}


/* RSE */

.blocPageRse { margin-top: 168px; }

.RseSlider { text-align: center; width: 50%; margin: auto; }

.RseSlider h2 { color: var(--red); }

.containerRse { display: flex; justify-content: center; align-items: center; height: 100vh; }

.RsePage { color: #fff; height: 100vh; position: relative;z-index:1;}

.filterRSE { background: linear-gradient(180deg, rgba(3,1,43,0) 0%, rgba(3,1,43,1) 100%); width: 100%; height: 100%; }

.RseManifeste{background:var(--white);position: relative;z-index:1;}

.RsemanifesteCarousel { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; }

.titreManifest, .introManifest { text-align: center; color: var(--red); }

.titreManifest { font-size: 72px; letter-spacing: -4.4px; line-height: 1.1; font-weight: 600; }

.introManifest { font-size: 110px; letter-spacing: -4px; line-height: 1.1; font-weight: 700; margin-top: 60px; }

.textSplideManifest { text-align: center; color: var(--red); font-size: 60px; line-height: 1.1; letter-spacing: -4px; max-width: 948px; margin: 100px auto 0 auto; border-right: 1.5px solid; padding: 0.5%; }

.splide__pagination__page { background-color: #ccc; }
.splide__pagination__page.is-active { background-color: var(--red); }

.Rsecontenu { padding: 218px 7% 0;position: relative;z-index:1; }

.Rsecontenu h1{font-size: 72px; font-weight: 600; letter-spacing: -3.168px; line-height: 1;}

.Rsecontenu p:nth-of-type(1), .Rsecontenu h1 {letter-spacing: -7.83px; margin-bottom: 80px; }

.Rsecontenu p:nth-of-type(1){font-size: 135px; line-height: 1;}

.Rsecontenu svg { float: right; cursor: pointer; }

.Rsecontenu p:nth-of-type(2) { font-size: 30px; letter-spacing: -1.638px; line-height: 42px; }

.imgRse { width: 100%; height: 100%; object-fit: cover; }

.Rsecontenu h2, .Rsecontenu p { color: #fff; }

.Rsecarousel { width: 100%; margin: auto; }

.Rsecarousel-inner { list-style: none; padding: 0; margin: 0; display: flex; overflow: hidden; }

.Rsecarousel-item { flex: 0 0 auto; width: 100%; }

.Rseservice { padding: 5rem 10%; background-color: var(--red); margin: auto; text-align: center;position: relative;z-index:1; }

.Rseservice h2 { font-size: 3rem; margin: 20px 0 32px 0; color: var(--white); }

.Rseservice div, .Rseservice ul { font-size: 1.5rem; color: var(--white); padding: 0 0 0 40px; }
.Rseservice > div {padding-bottom:75px;}

.Rseservice ul { font-weight: 400; margin-top: 30px; list-style-type: none; line-height: 40px; font-style: normal; font-size: 25px; letter-spacing: -1px; width: 90%; margin:auto; }

.Rseservice li { margin-bottom: 1rem; text-align: left; position: relative; letter-spacing: 1.05; }

.Rseservice li::before { position: absolute; width: 32px; height: 32px; left: -40px; top: 6px; content: ""; background-image: url('../img/check-white.svg'); }

.Rseservice a { margin-top: 50px; font-size: 39px; line-height: 1.9;position: absolute;  bottom: 0;  width: 100%;  text-align: center;  left: 0;}

.Rseservice svg { margin-left: 10px; }

.lineService { width: 100px; height: 2px; background-color: #fff; margin: 30px auto; }

.Rseservice h2, .Rseservice p { color: var(--white); }

.Rseservice p{font-size: 39px; font-weight: 600; line-height: 50px;}


/*  */

.RseObjectifs { width: 100%; height: 100%; padding-top: 100px;background:var(--white);position: relative;z-index:1; }

.titreObjectifs, .introObjectifs { color: var(--red); margin: auto; padding: 0 7%; }

.titreObjectifs { font-size: 135px; letter-spacing: -5.94px; font-weight: 600; line-height: 1; }

.introObjectifs { font-size: 39px; letter-spacing: -1.716px; line-height: 1.46; font-weight: 600; margin-top: 70px; }

.RseObjectifsCard{border-radius: 0; border: solid 4px var(--red); border-top:none; height: 215px;}

.card.first {border-top: 4px solid var(--red);}

.NosActionsO{font-size: 20px; color: var(--red); font-weight: 700; line-height: 30px; letter-spacing: -0.8px; margin: 0.8rem 0 1rem 0;}
.navigationO{color: var(--red);font-size: 39px;font-weight: 600;line-height: 1.9;letter-spacing: -1.716px; }
.TitreCardObjectifs{text-align: center; font-size: 15px; font-weight: 400; line-height: 20px; letter-spacing: -0.63px; height: 80px;}

.EtapeCardObjectifs {  display: flex;  align-items: center;  justify-content: center;}

.etape-circle {  margin: 0 5px;  width: 40px;  height: 40px;  margin-top: 10px;  display: flex;  align-items: center;  justify-content: center;}

.etape-line {  flex-grow: 1;  height: 2px;  background-color: #ccc;  margin-bottom: 17px;}

.EtapeTextObjectifs { text-align: center;  font-size: 12px;  font-family: 'WorkSans';  display: flex;  justify-content: space-between;  text-transform: uppercase;  font-weight: 500;  letter-spacing: -0.504px;}

.EtapeTextObjectifs p:nth-of-type(3) { margin-right: 13px;}

.EtapeTextObjectifs p:nth-of-type(2) { margin-right: 24px;}

.EtapeTextObjectifs p.inactive { color: #ccc;}


/*  */

.RseButtonPie{
  width: 100%;
  height: 100px;
}

.TitreDropdownRse{
  color: var(--white);
  font-family: 'Oswald';
  font-size: 22px;
  font-weight: 500;
  line-height: 30px;
  letter-spacing: -0.968px;
  text-transform: uppercase;
  float: left;
} 

.OrdreDropdownRse{
  font-size: 140px;
  font-weight: 500;
  line-height: 60px;
  letter-spacing: -6.16px;
  color: rgba(255, 255, 255, 0.3);
  left:0;
  font-family: 'Oswald';
}

.ImgObjectifs{
  right:65px;
}

.RseButtonPie::after{
  content: "";
  background-image: url(../img/chevron-tb.svg) !important;
  position: absolute;
  top: calc(50% - 5.5px);
  right: 2%;
  z-index: 1;
  width: 19.4px;
  height: 11px;
  transition: transform 0.3s ease-in-out;

}

.accordion-button {
  background-color: unset !important;
  box-shadow: unset !important;
}

.accordion-button:not(.collapsed) {
  background-color: unset !important;

}

.accordion-button:not(.collapsed)::after {
  transform: unset !important;
}

.RseButtonPie.rotated::after {
  transform: rotate(180deg);
  
}

.IntroPieModal{
  font-size: 40px; font-weight: 500; letter-spacing: -1.68px; line-height: 1.1;
}

.OrdreChartRse{
  font-size:92px; line-height: 60px; margin-left:55px; letter-spacing: -4.4px; color: var(--white); font-family: 'Oswald';
}

.ModalHeaderChart p{
  font-size: 50px; font-weight: 500; margin-left:55px; letter-spacing: -2.2px; line-height: 1.1; font-family: 'Oswald'; color: var(--white); text-transform: uppercase;max-width: 55%;
}

.EtapeCardObjectifs {
  display: flex;
  align-items: center;
  margin-left: 22px;
}

.ImgObjectifsChart{
  margin-left: 55px;
}

.EtapeTextObjectifs {
  margin-left: 10px; 
}

.RseObjectifsCardPie{
  border-radius: 0; border: solid 4px var(--red); border-top:none;
}

.EtapeText {
  text-transform: uppercase;
  font-family: 'WorkSans'
}

.EtapeText.inactive {
  color: #ccc;
}

.custom-close-btn {
  font-size: 2.5rem;
  color: white; 
  margin: -0.5rem -0.5rem -0.5rem auto;
  padding-right: 25px;
  cursor: pointer;
}

.TitreCardObjectifsPie{
  font-size: 15px; font-weight: 400; line-height: 20px; letter-spacing: -0.63px;
}

.modalbodyPie{
  padding:2rem;
}

.mapChartxxl
{
  width: 800px;margin: -40px auto 0 !important;
}

.ImagePieChartxxl img {
  top: 0;
}

#ImageChartxxl.opacity-adjusted {
  opacity: 0.4;
  transition: opacity 0.3s ease;
}

.ImagePieChartxxl{
  width: 800px;
}
.mapRse area:hover {
  cursor: pointer;
}

.ImagePieChartxxl img{
  cursor: pointer;
}

.ImagePieChartxxl area{
  cursor: pointer;
}

#modalObjectif4Label, #modalObjectif6Label, #modalObjectif8Label{
  font-size: 40px;
}
#modalObjectif7Label{
  font-size: 30px;
}

.EtapeCardObjectifsPie{
  display: flex;
  align-items: center;
}



/* -------------------------------------------------------------------------- */
/*
/*                           /* MEDIA QUERIES */
/*
/* -------------------------------------------------------------------------- */


/* Écran 15', 16' et 17' */
@media screen and (min-device-width: 1200px) and (max-device-width: 1800px) and (-webkit-min-device-pixel-ratio: 1){
  .headRed{padding:2rem 7%}
  .headRed .logoBrand{width:100px;height:100px;}
  .btnMenu{width:100px;height:100px;background-size:100px 100px;}
  .blocMenu .blocLang a {font-size:var(--font12);}
  .offcanvas-body{padding-top:2rem;}
  #offcanvasMenu{padding-top:3rem}
  .offcanvas-header .logoRed img{width:90px;height:90px;}
  .offcanvas-header button{margin-bottom:0}
  .blocIntro h1{font-size:var(--font86);width: 90%;padding-bottom: 0.5rem;}
  .blocIntro p{font-size:var(--font46);}
  .blocRefUne .nomClient{font-size:var(--font32);}
  .blocRefUne .refInfos {height:30px;}
  .blocTitle {margin-top: 164px;}
  .pt-9{padding-top:9rem;}
  .filtreRef .nav-link {font-size:var(--font16) !important;padding: 0 17px !important; height: 1.6rem; }
  .blocListeReferences{padding-top: 1rem}
  .blocListeReferences .card p.card-title{font-size:0.9rem;left:0.8rem;top:0.8rem}
  .blocListeReferences .card .card-cat img.logoExpertise{height:15px !important;margin-right: 0.5rem;}
  .blocListeReferences .card .card-cat{bottom:0.8rem;left:0.8rem;}
  .blocHero{margin-top:164px;height: calc(100vh - 164px);}
  .blocHero img.logoatelier{margin-bottom:2rem;}
  .blocHero h1 {font-size:var(--font58);width:88%;margin-bottom:2rem;}
  .blocHero p.medium{font-size:var(--font24);line-height: 1.2;width:88%;}
  .blocTitle h1, .blocTitle p.categorie{font-size:var(--font56);letter-spacing: -0.1rem;font-weight:600;margin-bottom:0;}
  .blocAccroche{padding-top:1rem}
  .blocAccroche h2{font-size:var(--font80);height: 240px;width:88%;padding-bottom:1rem;}
  .blocAccroche h2.second, .blocEquipe h2.second, .blocListeLogos h2.second{font-size:var(--font56)}
  .blocAccroche p{font-size:var(--font55);}
  .blocAccroche p.medium {font-size:var(--font29);line-height: 1.2;}
  .blocAccroche p.big{font-size:var(--font96);}
  .blocAccroche p.semiBold {font-size:var(--font56); padding-bottom: 2rem; line-height: 1.05;  margin-top: 3rem;  }

  .blocEquipe h2.second {padding-bottom: 2rem;padding-top: 2.5rem;}
  .blocEquipe .medium {font-size:var(--font56); width: 90%;  }

  .blocTopRef h1 {font-size:var(--font64); width: 75%;bottom: 4rem;  }
  .blocDetailsRef .client p{font-size:var(--font48);}
  .blocDetailsRef hr{margin-bottom:1rem}
  .blocDetailsRef .features p{font-size:var(--font19);}
  .blocDetailsRef .desc h2{font-size:var(--font17p6);text-transform:uppercase;}
  .blocDetailsRef .desc p, .blocDetailsRef .desc ul {font-size:0.9rem;}
  .blocDetailsRef .accroche p{font-size:var(--font40);;padding-left:2rem}
  .blocDetailsRef .tTemoignages p{font-size:var(--font28);}

  .blocContactBottom .colForm {}
  .formContactBottom {padding-top: 1rem;}
  .formContactBottom .form-label{margin-top:0}

  .blocContactBottom .colForm p{font-size:var(--font28);}
  .blocContactBottom .colForm h3{font-size:var(--font17p6);}

  .blocContactBottom .colForm p{font-size:var(--font28);}
  .blocContactBottom .colForm h3{font-size:var(--font17p6);}

  .formContactBottom .form-control::placeholder, .formContactBottom .form-label, .formContactBottom .btn-red{font-size:var(--font17p6)}
  .blocContactBottom .blocPresContact .infosContact .titre {font-size:var(--font16);margin-top: -0.4rem;}
  .blocContactBottom .blocPresContact .infosContact .nom {font-size:var(--font17p6)}
  .formContactBottom input.form-control, .formContactBottom textarea.form-control{font-size:var(--font17p6)}

  .blocTextCol h3{font-size:var(--font48);letter-spacing: -0.15rem;}
  .blocTextCol h2{font-size:var(--font48);letter-spacing: -0.15rem;}
  .blocTextCol .sousTitre{font-size:var(--font48);}
  .blocTextCol p{font-size:var(--font24);;}
  .blocTextCol p:nth-child(2) {font-size:var(--font17p6);margin-top: 3rem;}
  .blocTextCol a.linkProjet {font-size:var(--font27);background-size: 35px 35px;padding-right:60px}
  .blocTextCol h3 .picto img{margin-bottom:0.5rem;}


  .blocAtelier h2{font-size:var(--font72);letter-spacing: -0.15rem;}

  .blocMetho h2{font-size:var(--font72);}
  .blocMetho p{font-size: var(--font32);}
  .metho h4{font-size:var(--font30);}
  .metho p{font-size:var(--font20);}

  .blocLien{padding-top: 3.5rem;padding-bottom: 3.5rem;}
  .blocLien .lienFleche{font-size:var(--font30);padding-right:65px;background-size:40px 40px;}

  .blocListeNews .card .card-body .card-title{font-size:var(--font26)}
  .blocListeNews .card .card-body .cardDate{font-size:0.7rem}
  .blocListeNews .card .card-body .card-text{font-size:0.9rem;line-height:1.2}

  .blocPageNews{margin-top: 168px;}
  .mainContent .date{font-size:var(--font30);}
  .mainContent .share{font-size:var(--font16);}
  .mainContent h1 {font-size:var(--font48);line-height: 1.1;}
  .mainContent p.accroche{font-size:var(--font24);}
  .mainContent p, .mainContent ul li{font-size:var(--font21);}
  .mainContent h2{font-size:var(--font26)}
  .aside h4 {font-size:var(--font30);line-height: 1.1;}
  .mainContent .share .redRound{width: 32px;}
  .blocListeLogos{padding-top:4rem}

  .blocContact .details p{font-size:var(--font26);}
  .blocContact .cform h2{font-size:var(--font26);}
  .blocContact .cform p{font-size:var(--font17p6);}
  .formContact .form-check .form-check-label{font-size:var(--font17p6);}
  .formContact input.form-control, .formContact .form-control::placeholder{font-size:var(--font17p6);}
  .formContact input.form-control{margin-bottom:0.5rem}
  .formContact .form-check{margin-top:1.5rem}
  .formContact .btn-red{font-size:var(--font17p6);}

  .blocPageClassique{margin-top: 168px;}
  .blocPageClassique .titre h1{font-size:var(--font48);}
  .blocPageClassique .contenu p{font-size:var(--font21);}

  footer .mainTop p, footer .mainTop a{font-size:var(--font22);}
  footer .lastFooter p, footer .lastFooter a{font-size:0.9rem;}
  footer .logoAteliers {height: 44px;width: 162px;background-size:162px 44px}
  footer .backToTop{height: 80px;width: 81px;background-size:81px 80px;}

  /* RSE */
  .Rsecontenu p:nth-of-type(1){
    font-size: 86px;
  }
  .Rsecontenu p:nth-of-type(2){
    font-size: 26px;
  }

  .Rsecontenu h1{
    font-size: 56px;
    letter-spacing: -1.48px
  }

/* 2eme section */

  .titreManifest{
    font-size: 56px;
  }

  .introManifest{
    font-size: 84px;
  }

  .textSplideManifest{
    font-size: 46px;
  }

  /* 3eme section */
  .Rseservice h2{
    font-size: 36px;
  }

  .Rseservice p{
    font-size: 29px;line-height: 35px;
  }

  .Rseservice ul{
    font-size: 17.6px;
  }

  .Rseservice a{
    font-size: 29px;
  }
  .imageRseservice{
    height: 148px;
    width: 148px;}

  /* 4eme section */

  .titreObjectifs{
    font-size: 86px;
  }

  .introObjectifs{
    font-size: 29px;
  }

  .Rsecontenu{
    padding-top:164px
  }
  .splide__pagination__page.is-active {
    background-color: orange;
}
}

@media screen and (min-device-width: 1200px) and (max-device-width: 1400px) and (-webkit-min-device-pixel-ratio: 1){
  .blocAccroche h2{font-size:var(--font72);}
}


/* Écran 13 pouces ou HDPI */
/* @media screen and (min-device-width: 992px) and (max-device-width: 1440px){ */
@media screen and (min-device-width: 992px) and (max-device-width: 1280px){
  .headRed{padding:2rem 7%}
  .headRed .logoBrand{width:100px;height:100px;}
  .btnMenu{width:100px;height:100px;background-size:100px 100px;}
  .blocMenu .blocLang a {font-size:var(--font12);}
  .offcanvas-body{padding-top:2rem;}
  #offcanvasMenu{padding-top:3rem}
  .offcanvas-header .logoRed img{width:90px;height:90px;}
  .offcanvas-header button{margin-bottom:0}

  .blocIntro h1{font-size:var(--font86);width: 88%;padding-bottom: 0.5rem;}
  .blocIntro p{font-size:var(--font46);}
  .blocTitle {margin-top: 168px;}

  .filtreRef .nav-link {font-size:var(--font16) !important;padding: 0 17px !important; height: 1.6rem; }
  .blocListeReferences{padding-top: 1rem}
  .blocListeReferences .card p.card-title{font-size:0.9rem;left:0.8rem;top:0.8rem}
  .blocListeReferences .card .card-cat img.logoExpertise{height:15px !important;margin-right: 0.5rem;}
  .blocListeReferences .card .card-cat{bottom:0.8rem;left:0.8rem;}
  .blocRefUne .nomClient{font-size:var(--font32);}
  .blocRefUne .refInfos {height:30px;}
  .blocHero{margin-top:164px;height: calc(100vh - 164px);}
  .blocHero img.logoatelier{margin-bottom:2rem;}
  .blocHero h1 {font-size:var(--font58);width:88%;margin-bottom:2rem;}
  .blocHero p.medium{font-size:var(--font24);line-height: 1.2;width:88%;}
  .blocTitle h1{font-size:var(--font48);}
  .blocAccroche{padding-top:1rem}
  .blocAccroche h2{font-size:var(--font80);height: 190px;width:88%;padding-bottom:1rem;}
  .blocAccroche p.medium{font-size:var(--font22);line-height: 1.2;}
  .blocAccroche h2.second, .blocEquipe h2.second, .blocListeLogos h2.second{font-size:var(--font56)}
  .blocAccroche p.big{font-size:var(--font80);}
  .blocAccroche p.semiBold {font-size:var(--font56); padding-bottom: 2rem; line-height: 1.05;  margin-top: 3rem;  }

  .blocEquipe h2.second {padding-bottom: 2rem;padding-top: 2.5rem;}
  .blocEquipe .medium {font-size:var(--font56); width: 90%;  }

  .blocTopRef h1 {font-size:var(--font64); width: 75%;bottom: 4rem;  }
  .blocDetailsRef .client p{font-size:var(--font40);;}
  .blocDetailsRef hr{margin-bottom:1rem}
  .blocDetailsRef .features p{font-size:var(--font19);}
  .blocDetailsRef .desc h2{font-size:var(--font17p6);text-transform:uppercase;}
  .blocDetailsRef .desc p, .blocDetailsRef .desc ul {font-size:0.9rem;}

  .blocDetailsRef .accroche p{font-size:var(--font40);;padding-left:2rem}
  .blocDetailsRef .tTemoignages p{font-size:var(--font28);}

  .blocContactBottom .colForm {}
  .formContactBottom {padding-top: 1rem;}
  .formContactBottom .form-label{margin-top:0}

  .blocContactBottom .blocPresContact .infosContact{top:50%;}
  .blocContactBottom .colForm p{font-size:var(--font28);}
  .blocContactBottom .colForm h3{font-size:var(--font17p6);}

  .formContactBottom .form-control::placeholder, .formContactBottom .form-label, .formContactBottom .btn-red{font-size:var(--font17p6)}
  .blocContactBottom .blocPresContact .infosContact .titre {font-size:var(--font16);margin-top: -0.4rem;}
    .blocContactBottom .blocPresContact .infosContact .nom {font-size:var(--font17p6)}
  .formContactBottom input.form-control, .formContactBottom textarea.form-control{font-size:var(--font17p6)}

  .blocTextCol h3{font-size:var(--font48);letter-spacing: -0.15rem;}
  .blocTextCol h2{font-size:var(--font48);letter-spacing: -0.15rem;}
  .blocTextCol .sousTitre{font-size:var(--font48);}
  .blocTextCol p{font-size:var(--font24);;}
  .blocTextCol p:nth-child(2) {font-size:var(--font17p6);margin-top: 3rem;}
  .blocTextCol a.linkProjet {font-size:var(--font27);background-size: 35px 35px;padding-right:60px}
  .blocTextCol h3 .picto img{margin-bottom:0.5rem;}

  .blocAtelier h2{font-size:var(--font72);letter-spacing: -0.15rem;}

  .blocMetho h2{font-size:var(--font72);}
  .blocMetho p{font-size: var(--font32);}
  .metho h4{font-size:var(--font30);}
  .metho p{font-size:var(--font20);}

  .blocLien{padding-top: 3.5rem;padding-bottom: 3.5rem;}
  .blocLien .lienFleche{font-size:var(--font30);padding-right:65px;background-size:40px 40px;}

  .blocListeNews .card .card-body .card-title{font-size:var(--font26)}
  .blocListeNews .card .card-body .cardDate{font-size:0.7rem}
  .blocListeNews .card .card-body .card-text{font-size:0.9rem;line-height:1.2}

  .blocPageNews{margin-top: 168px;}
  .mainContent .date{font-size:var(--font30);}
  .mainContent .share{font-size:var(--font16);}
  .mainContent h1 {font-size:var(--font48);line-height: 1.1;}
  .mainContent p.accroche{font-size:var(--font24);}
  .mainContent p, .mainContent ul li{font-size:var(--font21);}
  .mainContent h2{font-size:var(--font26)}
  .aside h4 {font-size:var(--font30);line-height: 1.1;}
  .mainContent .share .redRound{width: 32px;}

  .blocContact .details p{font-size:var(--font26);}
  .blocContact .cform h2{font-size:var(--font26);}
  .blocContact .cform p{font-size:var(--font17p6);}
  .formContact .form-check .form-check-label{font-size:var(--font17p6);}
  .formContact input.form-control, .formContact .form-control::placeholder{font-size:var(--font17p6);}
  .formContact input.form-control{margin-bottom:0.5rem}
  .formContact .form-check{margin-top:1.5rem}
  .formContact .btn-red{font-size:var(--font17p6);}

  .blocPageClassique{margin-top: 168px;}
  .blocPageClassique .titre h1{font-size:var(--font48);}
  .blocPageClassique .contenu p{font-size:var(--font21);}

  footer .mainTop p, footer .mainTop a{font-size:var(--font22);}
  footer .lastFooter p, footer .lastFooter a{font-size:0.9rem;}
  footer .logoAteliers {height: 44px;width: 162px;background-size:162px 44px}
}

/* Smartphone Portrait / Paysage & Tablette Portrait */
@media(max-width: 810px){

  .blocTitle {margin-top: 112px;}
  .blocTitle h1 {font-size:var(--font37);letter-spacing: -0.15rem;}
  .pt-9{padding-top:4rem;}
  footer{padding:50px 0}
  footer .mainTop:first-of-type p{padding-left:unset;}
  footer .mainTop p, footer .mainTop a, footer .lastFooter p, footer .lastFooter a {font-size:var(--font24);;line-height: 1.2;letter-spacing: -0.1rem;}
  footer .backToTop{width: 52px;height: 80px;background-size: 52px 52px;}
  /*footer .borderTop p, footer .borderTop a{font-size:var(--font27);}*/
  footer .logoAteliers{bottom: 20px;top: unset;right: unset;left: 4%;}
  footer .col-12:nth-child(2) hr{display: none;}
  footer .mainTop:nth-child(2){padding-bottom:70px;border-bottom:1px solid var(--white);margin-bottom: 2rem;}
  footer .lastFooter:first-of-type{padding-left:4%}

  .blocIntro {padding:3rem 7%}
  .blocIntro h1{font-size:var(--font39);;}
  .blocIntro p{font-size:var(--font37);}

  .blocRefUne ul li{min-height:unset;}
  .blocRefUne .nomClient{font-size:var(--font20);;top: 1rem;}
  .blocRefUne .refInfos{bottom:1rem;height:26px;}

  .blocLien .lienFleche{font-size:var(--font24);;background-size: 26.5px 26.5px;letter-spacing: -0.10rem;padding-right:45px;}
  .blocLien {padding-top: 3rem;padding-bottom: 3rem;}

  .blocHero {margin-top: 112px;height: calc(100vh - 112px);}
  .blocHero img.logoatelier{width:100%;}
  .blocHero h1 {font-size:var(--font46);width:100%;}
  .blocHero p.medium{font-size:var(--font26);line-height: 1.05;width:100%;}

  .blocTopRef h1{font-size:var(--font49);letter-spacing: -0.15rem;}
  .btnToSuite{height:52px;width:52px;right:2rem;bottom: 2rem;}
  .btnToSuite svg{width:52px;height:52px;}

  .blocDetailsRef{padding-top:3rem}
  .blocDetailsRef .client p{font-size:var(--font49);}
  .blocDetailsRef .features hr, .blocDetailsRef .desc hr{opacity:0}
  .blocDetailsRef .accroche p{padding-left:0;font-size:var(--font49)}
  .blocDetailsRef .col-12 img.refVisuel {aspect-ratio: 16/9;width: 100%;}
  .blocDetailsRef img.refVisuel {aspect-ratio: 16/9;width: 100%;}
  .blocDetailsRef .tTemoignages p{font-size:var(--font22);;margin-left: 3rem;}
  .blocDetailsRef .vTemoignages {min-height: 230px; }
  .blocDetailsRef .desc p, .blocDetailsRef .desc ul{letter-spacing:-0.1rem;}

  .blocListeNews .card .card-body .card-title, 
  .blocListeNews .card .card-body .cardDate, 
  .blocListeNews .card .card-body .card-text{font-size:var(--font22);;}
  .blocListeNews .borderLeftRight {border-left:none;}
  .blocContact .details p, .blocContact .details h2, .blocContact .cform h2, .blocContact .cform p{font-size:var(--font22);}
  .formContact .form-control::placeholder{font-size:var(--font22);}
  .formContact .form-label{font-size:var(--font22);}
  .formContact .form-check .form-check-label{font-size:var(--font22);}
  .formContact .btn-red{font-size:var(--font22);}

  .blocContactBottom{padding-top:2rem;padding-bottom:2rem;}
  .blocContactBottom .blocPresContact img.photoContact{aspect-ratio:16/9;min-height:255px;object-position: top;}
  .blocContactBottom .blocPresContact .infosContact{bottom: 0rem;}
  .blocContactBottom .colForm{}
  .blocContactBottom .colForm h3{font-size:var(--font17p6);}
  .formContactBottom .form-label{margin-top:0}
  .formContactBottom .form-control::placeholder, 
  .formContactBottom input.form-control {font-size:var(--font22);}
  .blocContactBottom .colForm p{font-size:var(--font22);}

  .c_hero {
    position: relative;
    top: unset;
    left: unset;
    transform: unset;
    width: auto;
  }
  .blocAtelier{padding:1rem 0 0;}
  .blocAtelier h2{font-size:var(--font37);}
  .atelier{padding:0 7%;border-bottom:2px dotted var(--red);}
  .coinArrondi-be,
  .coinArrondi-st,
  .coinArrondi-bs,
  .coinArrondi-et{border-radius:unset;}
  .border-b, .border-t{border-bottom:none;border-top:none;}
  .libAtelier {font-size:var(--font30);width:100%;margin-bottom:1.5rem;}
  .atelier h3{font-size:var(--font24);text-align:center;letter-spacing: -1.008px;}
  .atelier strong {font-size: var(--font24);letter-spacing: -1.008px;text-align:center;}
  .atelier ul{font-size:var(--font20);letter-spacing:-1.05px;}
  .atelier blockquote {font-size: var(--font20);}
  .atelier div{text-align:center;}

  .blocMetho h2{font-size:var(--font37);}
  .blocMetho p{font-size: var(--font18);}
  .metho h4{font-size:var(--font24);line-height:1.4;}
  .metho p{font-size:var(--font18);line-height:1.5;}
  .metho::after{content: "" !important;position:absolute;width:75% !important;height:1px !important;border-bottom:1px solid var(--white);bottom:0  !important;left:unset  !important;top:unset  !important;border-left:none  !important;right:unset !important;}
  .metho:last-child::after{border-bottom:none;}
  .blocAccroche{padding-top:1rem;}
  .blocAccroche p{font-size:var(--font49);}
  .blocTextCol{padding-top:1rem;padding-bottom:3rem;}
  .blocTextCol h2{font-size:var(--font24);;padding-bottom:2rem;}
  .blocTextCol p, .blocTextCol .sousTitre {font-size:var(--font22);;}
  .blocTextCol > .row{padding-left:1rem;padding-right:1rem;}
  .blocTextCol .borderTop{padding-top:1rem;padding-bottom:4rem}
  .blocTextCol a.linkProjet{font-size:var(--font24);;letter-spacing:-0.15rem;background-size: 26.5px 26.5px;padding-right: 45px;}

  .blocAccroche h2{font-size:var(--font49);height: 230px;}
  .blocAccroche p.medium{font-size:var(--font37);letter-spacing: -0.15rem;line-height: 1;}
  .blocAccroche h2.second,
  .blocEquipe h2.second,
  .blocListeLogos h2.second{font-size:var(--font37);letter-spacing: -0.15rem;padding-top:1rem;}
  .blocAccroche p.big{font-size:var(--font49);letter-spacing: -0.15rem;}
  .blocAccroche p.semiBold{font-size:var(--font37);letter-spacing: -0.15rem;}
  .blocTextCol h3{font-size:var(--font24);;}

  .blocEquipe{padding-top:1rem;}
  .blocEquipe p.medium{font-size:var(--font37);letter-spacing:-0.15rem;}
  .blocEquipe img{aspect-ratio:16/9;}

  .blocPageClassique, .blocPageNews{margin-top: 112px;}
  .blocPageClassique .titre h1{font-size:var(--font37);letter-spacing:-0.15rem;}
  .blocPageClassique .contenu p{font-size:var(--font22);}

  .mainContent .date{font-size:var(--font24);;}
  .mainContent .share{font-size:var(--font16);}
  .mainContent .share .redRound{padding: 0.375rem 0;}
  .mainContent h1{font-size:var(--font37);letter-spacing:-0.15rem;}
  .mainContent h2{font-size:var(--font24);;}
  .mainContent p.accroche {font-size:var(--font22);letter-spacing:-0.05rem;}
  .mainContent p, .mainContent ul li{font-size:var(--font22);letter-spacing:-0.05rem;}

    /* RSE */
    .Rsecontenu p:nth-of-type(1){
      font-size: 50px;
      letter-spacing: -2px;
    }
    .Rsecontenu p:nth-of-type(1), .Rsecontenu h1{
      margin-bottom: 60px;
    }

    .Rsecontenu p:nth-of-type(2){
      font-size: 30px;
      line-height:  1.14;
      letter-spacing: -1.4px;
    }

    .Rsecontenu h1{
      font-size: 37px;
      letter-spacing: -1.48px;
      font-weight: 500;
    }

    .Rsecontenu svg{
      display: none;
    }

  /* 2eme section */

    .titreManifest{
      font-size: 37px;
      letter-spacing: -1.48px;
      line-height: 1.4;
    }

    .introManifest{
      font-size: 50px;
      line-height: 1.1;
      letter-spacing: -2.5px;
      font-weight: 600;
    }

    .textSplideManifest{
      font-size: 35px;
      line-height: 1.7;
      font-weight: 600;
      letter-spacing: -1.4px;
      border:none;
    }

    /* 3eme section */
    .Rseservice h2{
      font-size: 37px;
      line-height: 1.16;
      letter-spacing: -1.628px;
    }

    .Rseservice p{
      font-size: 24px;
      line-height: 1.08;
    }

    .Rseservice ul{
      font-size: 18px;
      line-height: 1.55;
      /* display: none; */
    }

    .imageRseservice{
      width: 100px;
      height: 100px;
    }

    .Rseservice a{
      font-size: 20px;
      line-height: 3.7;
      letter-spacing: -0.88px;
    }

    .Rseservice svg{
      width: 32px;
      height: 32px;
    }

    .Rseservice div:first-child{
      border-bottom: 2px dashed rgba(255, 255, 255, 0.5);
      padding-bottom: 40px;
      margin-bottom: 60px;
    }

    /* 4eme section */

    .titreObjectifs{
      font-size: 50px;
      letter-spacing: -2px;
      line-height: 1.2;
    }

    .introObjectifs{
      font-size: 24px;
      line-height: 1.4;
      letter-spacing: -0.96px;
    }

    .Rsecontenu{
      padding-top:112px
    }

    .Rseservice li::before{
      top:0;
    }
}


/* Petit Smartphone  */
@media(max-width: 430px){

  .blocHero h1 {font-size:10vw;}
  .blocHero p.medium{font-size:6vw;}

  .Rsecontenu p:nth-of-type(1){
    font-size: 10vw;
    letter-spacing: -2px;
  }
  .Rsecontenu p:nth-of-type(1), .Rsecontenu h1{
    margin-bottom: 60px;
  }

  .Rsecontenu p:nth-of-type(2){
    font-size: 6vw;
    line-height:  1.14;
    letter-spacing: -1.4px;
  }

  .Rsecontenu h1{
    font-size: 10vw;
    letter-spacing: -1.48px;
    font-weight: 500;
  }

  .Rsecontenu svg{
    display: none;
  }

/* 2eme section */

  .titreManifest{
    font-size: 10vw;
    letter-spacing: -1.48px;
    line-height: 1.4;
  }

  .introManifest{
    font-size: 10vw;
    line-height: 1.1;
    letter-spacing: -2.5px;
    font-weight: 600;
  }

  .textSplideManifest{
    font-size: 10vw;
    line-height: 1.7;
    font-weight: 600;
    letter-spacing: -1.4px;
    border:none;
  }

  /* 3eme section */
  .Rseservice h2{
    font-size: 10vw;
    line-height: 1.16;
    letter-spacing: -1.628px;
  }

  .Rseservice p{
    font-size: 6vw;
    line-height: 1.08;
  }

  .Rseservice ul{
    font-size: 6vw;
    line-height: 1.55;
    /* display: none; */
  }

  .imageRseservice{
    width: 100px;
    height: 100px;
  }

  .Rseservice a{
    font-size: 6vw;
    line-height: 3.7;
    letter-spacing: -0.88px;
  }

  .Rseservice svg{
    width: 32px;
    height: 32px;
  }

  .Rseservice div:first-child{
    border-bottom: 2px dashed rgba(255, 255, 255, 0.5);
    padding-bottom: 75px;
    margin-bottom: 60px;
  }

  /* 4eme section */

  .titreObjectifs{
    font-size: 10vw;
    letter-spacing: -2px;
    line-height: 1.2;
  }

  .introObjectifs{
    font-size: 6vw;
    line-height: 1.4;
    letter-spacing: -0.96px;
  }

  .Rsecontenu{
    padding-top:112px
  }

  .Rseservice li::before{
    top:0;
  }

}
