#landingpage .container {max-width: 1200px;}
#landingpage html { --scroll-behavior: smooth; scroll-behavior: smooth; font-family: "Gotham", sans-serif;}
#landingpage {padding-top: 0;}
#landingpage .uppercase{text-transform: uppercase;}
#landingpage p{font-size:1.4em; color: #343434; line-height: 1.5;}
#landingpage .bigger{font-size:1.8em;}
#landingpage .big{font-size:1.5em;}
#landingpage .small{font-size:0.8em;}
#landingpage .text-xxl{font-size:4em;}
#landingpage .text-center {text-align: center;}
#landingpage .text-right {text-align: right;}
#landingpage .pt-120 {padding-top: 120px;}
#landingpage .pt-80 {padding-top: 80px;}
#landingpage .pb-80 {padding-bottom: 80px;}
#landingpage .mt-80 {margin-top: 80px;}
#landingpage .mb-80 {margin-bottom: 80px;}
#landingpage .mt-100 {margin-top: 100px;}
#landingpage .mt-20 {margin-top: 20px;}
#landingpage .mt-40 {margin-top: 40px;}
#landingpage .mx-10 {margin-left: 10px; margin-right: 10px;}
#landingpage .gray {background-color:#F1F1F1;}
#landingpage .red-opacity-80 {background-color: rgba(229, 56, 69, 0.5);}
#landingpage .red-opacity-90 {background-color: rgba(229, 56, 69, 0.8);}
#landingpage .green-opacity-80 {background-color: rgba(104, 147, 46, 0.8);}
#landingpage .red {background-color:#e53845;}
#landingpage .red-opacity-80 {background-color: rgba(229, 56, 69, 0.5);}
#landingpage .black {background-color: rgba(52, 52, 52);}
#landingpage .black-opacity-80 {background-color: rgba(52, 52, 52, 0.8);}
#landingpage .width-full {width: 100%;}
#landingpage .width-90 {width: 95%;}
#landingpage .width-80 {width: 80%;}
#landingpage .max-width-300-px {width: 300px;}
#landingpage .max-width-420-px {width: 420px;}
#landingpage .bd-radius-20 {border-radius: 20px;}
#landingpage .padding-x-60 {padding-left: 60px; padding-right: 60px;}
#landingpage .padding-20 {padding: 25px;}
#landingpage .padding-10 {padding: 10px;}
#landingpage .padding-x-10 {padding-left: 10px; padding-right: 10px;}
#landingpage .padding-x-30 {padding-left: 30px; padding-right: 30px;}
#landingpage .padding-y-15 {padding-top: 15px; padding-bottom: 15px;}
#landingpage .bold {font-weight: bold;}
#landingpage .text-white {color: #ffffff !important;}
#landingpage .text-red {color: #e53845;}
#landingpage .flex {display: flex; align-items: center;}
#landingpage .flex-grow {flex-grow: 1;}
#landingpage .font-size-large {font-size: 1.2em;}
#landingpage .ms-10 {margin-left: 10px;}
#landingpage .italic {font-style: italic;}
#landingpage .underline {text-decoration: underline;text-decoration-thickness: 3px;}
#landingpage .underline-thin {text-decoration: underline;text-decoration-thickness: 1px;}
#landingpage .hidden-lg {display: none;}
#landingpage .hidden-md {display: block;}
#landingpage .absolute {position: absolute;}
#landingpage .b-0 {bottom: 0;}
#landingpage .position-centre-bas {top: -90px; left: 48%;}
#landingpage .relative { position: relative;}
#landingpage .min-height-500 { min-height: 500px;}
#landingpage .min-height-1200 { min-height: 1200px;}
#landingpage .padding-0 {padding: 0 !important;}
#landingpage .bd-red-left {border-left: 6px solid #e53845;}
#landingpage .etapes { position: relative; background: url('../img/landing2025/etapes-background.webp') no-repeat center; background-size: cover; min-height: 800px;}
#landingpage .etape-road { z-index: 10; top:0;}
#landingpage .etape-block {width: 360px; height: 140px; position: absolute; z-index: 20;}
#landingpage .etape-1 {left: 0%; top: 20px;}
#landingpage .etape-2 {left: 70%; top: 180px;}
#landingpage .etape-3 {left: -10%; top: 340px;}
#landingpage .etape-4 {left: 65%; top: 500px;}
#landingpage .etape-5 {left: 20%; top: 680px;}
#landingpage .etape-6 {left: 40%; top: 880px;}
#landingpage .etape-7 {left: -35%; top: 980px;}
#landingpage .pompes {width:400px;}
#landingpage .trust {font-size:1.6em; border-radius: 20px; border: 4px solid #e53845; margin: 40px; padding-bottom: 20px; padding-top: 20px; text-align: center; font-weight: bold;}
#landingpage .buttoncta{border-radius:3px; text-align:center; border:0; cursor:pointer; min-width:150px; font-weight:bold; display:inline-block; font-size:15px; padding:12px 18px; ;  moz-transition: all .4s ease-in-out;-o-transition: all .4s ease-in-out;-webkit-transition: all .4s ease-in-out;transition: all .4s ease-in-out; border: 2px solid transparent;}
#landingpage .buttoncta{background: linear-gradient(to bottom, #e53845, #d88087); color: #FFFFFF; border: none;}
#landingpage .buttoncta:hover {background: linear-gradient(-0.5turn, #f4f4f4, #f4f4f4); color: #e53845;}
#landingpage .buttoncta .arrow-icon {margin-right: 15px; vertical-align: middle; transition: all 0.4s ease-in-out;}
#landingpage .buttoncta:hover .arrow-icon {background-image: url('../img/landing2025/fleche-rouge.svg'); margin-right: 10px; margin-left: 5px;}
#landingpage .arrow-icon {width: 20px; height: 15px; background: url('../img/landing2025/fleche-blanche.svg') no-repeat center; background-size: contain; display: inline-block;}

#landingpage #header {margin-top: -20px;}
#landingpage #header{
    background: url('../img/landing2025/title.webp') no-repeat center;
    background-size: cover; position: relative; height: 80vh; z-index: 0; color: #ffffff; display: flex; display: -ms-flex;}
#landingpage #header .container{margin: auto;}
#landingpage #header:before{content: " "; display: block; position: absolute; top:0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.3);  mix-blend-mode: normal;  will-change: opacity; opacity: 0.8;}

/*@media (prefers-color-scheme: dark) {*/
/*   #landingpage #header:before{background-color: rgba(0, 0, 0, 0.3) !important; opacity: .8 !important;}*/
/*}*/



#landingpage #header .title1{font-weight: bold; font-size: 32px}

#landingpage #demande-rappel {padding: 100px 0; position: relative; background: url("../img/landing2025/form-background.webp") no-repeat center; background-size: cover; color: #FFFFFF;}
#landingpage #demande-rappel form label + label + label {margin-top: 20px;}
#landingpage #demande-rappel form label input, #landingpage #demande-rappel form label input fieldset{width: 100%; padding: 15px; font-size: 16px; background-color: #FFFFFF; border-radius: 3px; border:0; color: #776C60;}
#landingpage #demande-rappel .valide{position:absolute; top:50%; left:0; width:100%; text-align:center; display:none; color:#FFF; font-size: 30px; font-weight: 600;}
#landingpage #demande-rappel .buttoncta {margin-top: 40px; padding: 20px;}
#landingpage #demande-rappel .phone, #landingpage #demande-rappel .phone a {
    color: #ffffff !important;
    text-decoration: none !important;
}


#landingpage .solutions {padding: 60px 0; position: relative; padding-left: 20px;}
#landingpage .solutions ul li{display: inline-block;}
#landingpage .solutions ul li:not(:last-of-type){margin-right: 50px;}
#landingpage .solutions ul li a{position: relative; color: #ffffff; font-size: 24px; line-height: 1.3; transition: all 0.3s ease-in-out;}
#landingpage .solutions ul li a::before{content: ""; position: relative; display: inline-block; background: url('../img/landing2025/puce.svg') no-repeat center; background-size: contain; width: 20px; height: 20px; vertical-align: middle; margin-right: 10px; transition: all 0.3s ease-in-out;}
#landingpage .solutions ul li a:hover{font-weight: bold;}
#landingpage .solutions ul li a:hover::before{background: url('../img/landing2025/puce-rouge.svg') no-repeat center; background-size: contain;}
#landingpage .solutions img{max-height: 70px; max-width: 100%; margin-top: 40px;}
#landingpage .faq-item {border-bottom: 1px solid #e0e0e0;}
#landingpage .faq-item:last-child {border-bottom: none;}
#landingpage .faq-question {cursor: pointer; padding: 20px; background: #f9f9f9; color: #333;font-weight: bold; display: flex; justify-content: space-between; align-items: center; transition: background-color 0.3s ease;}
#landingpage .faq-question:hover {background-color: #eaeaea;}
#landingpage .faq-answer {max-height: 0; overflow: hidden; padding: 0 20px; background: #ffffff; color: #555; transition: max-height 0.3s ease, padding 0.3s ease;}
#landingpage .faq-answer.open {max-height: 200px; padding: 20px;}
#landingpage .faq-icon {font-size: 18px; transition: transform 0.3s ease;}
#landingpage .faq-icon.rotate {transform: rotate(45deg);}
#landingpage form.sendAjax .valide {background-color: rgba(30, 30, 30, 0.95);padding: 50px;border-radius: 16px;z-index: 4;left: 50% !important;top: 10% !important;}
#landingpage form.sendAjax a {color: #ffffff; text-decoration: underline; transition: max-height 0.3s ease, padding 0.3s ease;}
#landingpage .text-on-image {font-size:24px;}
@media (max-width: 1199px) {
    #landingpage #header .title1 {font-size:36px;}
    #landingpage #demande-rappel p {padding: 0 200px;}
}

@media (max-width: 991px) {
    #landingpage .hidden-lg {display: block;}
    #landingpage .hidden-md {display: none;}
    #landingpage .bigger{font-size:1.5em;}
    #landingpage .md-renovation { position: relative; background: url('../img/landing2025/avantages-renovation-mobile.webp') no-repeat center; background-size: cover;}
    #landingpage .md-construction { position: relative; background: url('../img/landing2025/avantages-construction-mobile.webp') no-repeat center; background-size: cover;}
    #landingpage .etape-1 {width: 100%; left:0; top:10px;}
    #landingpage .etape-2 {width: 100%; left:0; top: 20px;}
    #landingpage .etape-3 {width: 100%; left:0; top: 30px;}
    #landingpage .etape-4 {width: 100%; left:0; top: 40px;}
    #landingpage .etape-5 {width: 100%; left:0; top: 50px;}
    #landingpage .etape-6 {width: 100%; left:0; top: 60px;}
    #landingpage .etape-7 {width: 100%; left:0; top: 70px;}
    #landingpage .etape-block {position: relative;}
    #landingpage .pompes {width:70%; max-width: 500px; right:10%;}

    #landingpage .title1 {font-size: 25px; margin-bottom: 25px;}
    #landingpage #header .title1 br, #landingpage .left .box .title1 br {display: none;}
    #landingpage #demande-rappel {padding: 40px 0;}
    #landingpage #demande-rappel p {padding: 0 90px; margin-bottom: 20px;}
    #landingpage #demande-rappel form label input {padding: 10px; font-size: 14px;}
    #landingpage #demande-rappel .buttoncta {margin-top: 20px;}
    #landingpage #solutions ul li a {font-size: 18px;}
    #landingpage #solutions ul li a::before {width: 15px; height: 15px; vertical-align: unset;}
    #landingpage #solutions img {max-height: 40px; margin-top: 20px;}
}

@media (max-width: 767px) {
    #landingpage .text-on-image {font-size:14px;}
    body.page-template-template-autonomie-2021 {padding-top: 65px;}
    #landingpage #header .title1 br, #landingpage #vivreco .left .box .title1 br {display: block;}
    #landingpage #header {height: auto; min-height: 80vh; padding: 40px 0;}
    #landingpage #header .title1 {font-size: 32px;}
    #landingpage #header .mentions {margin-bottom: 40px;}
    #landingpage #demande-rappel form label + label {margin-top: 15px!important;}
    #landingpage #solutions ul li:not(:last-of-type) {margin-right: 35px;}
}

@media (max-width: 575px) {
    #landingpage .title1, #landingpage #chemin .img .filtre h4, #landingpage .row.txtCenter h2.title1 {font-size: 21px;}
    #landingpage #header .title1 {font-size: 28px;}
    #landingpage #header .title1 br, #landingpage #intro p br, #landingpage #header .mentions br {display: none;}
    #landingpage #demande-rappel p {padding: 0 20px;}
    #landingpage #solutions ul li {display: block;}
    #landingpage #solutions ul li:not(:last-of-type) {margin-right: 0; margin-bottom: 15px;}
    #landingpage.block-scrollable-carousel.carousel-arrow{display: none;}
}