/* -------------------------- ALL -------------------------- */

.template1{
    padding-top: 180px;
}

@media (max-width: 992px){
    .template1{
        padding-top: 110px;
    }
}

/* -------------------------- HEADER -------------------------- */

.template1 .headerPage{
    padding: 0px 13% 68px 13%;
}

.template1 .headerPage .titre{
    font-size: 119px;
    line-height: 119px;
    text-transform: uppercase;
    font-weight: 100;
    max-width: 60%;
    margin-bottom: 31px;
}

.template1 .headerPage img{
    max-width: 90%;
}

@media (max-width: 1300px){
    .template1 .headerPage{
        padding: 0px 10% 68px 10%;
    }
    .template1 .headerPage .titre{
        font-size: 100px;
        line-height: 100px;
    }
}

@media (max-width: 992px){
    .template1 .headerPage{
        padding: 0px 80px 68px 80px;
    }
    .template1 .headerPage .titre{
        font-size: 85px;
        line-height: 85px;
        max-width: none;
    }
    .template1 .headerPage img{
        width: 100%;
        max-width: 100%;
    }
}

@media (max-width: 600px){
    .template1 .headerPage{
        padding: 0px 36px 36px 36px;
    }
    .template1 .headerPage .titre{
        font-size: 46px;
        line-height: 46px;
        margin-bottom: 13px;
    }
}

/* -------------------------- SECTION 1 -------------------------- */

.template1 .section1{
    padding-left: 15%;
    padding-bottom: 150px;
}

.template1 .section1 .titre{
    padding-right: 13%;
    margin-bottom: 27px;
}

.template1 .section1 .titre,
.template1 .section1 .titre p,
.template1 .section1 .titre p strong{
    line-height: 85px;
}

.template1 .section1 > div{
    display: flex;
    justify-content: end;
    gap: 115px;
}

.template1 .section1 > div img,
.template1 .section1 > div .paragraphe{
    max-width: 50%;
}

@media (max-width: 1500px){
    .template1 .section1{
        padding-left: 10%;
    }
    .template1 .section1 .titre,
    .template1 .section1 .titre p, 
    .template1 .section1 .titre p strong{
       line-height: 65px; 
    }
}

@media (max-width: 992px){
    .template1 .section1{
        padding: 0px 0px 70px 0px;
    }
    .template1 .section1 > div{
        flex-direction: column;
        gap: 35px;
    }
    .template1 .section1 > div img,
    .template1 .section1 > div .paragraphe{
        max-width: 100%;
        width: 100%;
    }
    .template1 .section1 .titre,
    .template1 .section1 .titre p,
    .template1 .section1 .titre p strong{
        line-height: 50px;
    }
    .template1 .section1 .titre,
    .template1 .section1 > div .paragraphe{
        padding-left: 80px;
        padding-right: 80px;
    }
}

@media (max-width: 600px){
    .template1 .section1 .titre{
        margin-bottom: 12px;
    }
    .template1 .section1 .titre,
    .template1 .section1 .titre p,
    .template1 .section1 .titre p strong{
        font-size: 40px;
        line-height: 40px;
    }
    .template1 .section1{
        padding: 0px 0px 70px 0px;
    }
    .template1 .section1 .titre,
    .template1 .section1 > div .paragraphe{
        padding-left: 36px;
        padding-right: 36px;
    }
}

/* -------------------------- SECTION 2 -------------------------- */

.template1 .section2{
    display: flex;
}

.template1 .section2 > img{
    max-width: 60%;
    width: 60%;
}

.template1 .section2 > div{
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-color: var(--gold);
    padding: 8% 9%;
    transform: translateX(-40%);

    min-width: 60%;
    padding: 10% 18%;

    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='719.184' height='810.218' viewBox='0 0 719.184 810.218'%3E%3Cpath id='Tracé_19653' data-name='Tracé 19653' d='M686.256,179.067,392.018,9.191a64.842,64.842,0,0,0-64.853,0L32.925,179.067A64.848,64.848,0,0,0,.5,235.231V574.988a64.852,64.852,0,0,0,32.425,56.164L327.166,801.028a64.842,64.842,0,0,0,64.853,0L686.256,631.152a64.856,64.856,0,0,0,32.428-56.164V235.231A64.851,64.851,0,0,0,686.256,179.067Z' transform='translate(0 0)' stroke='%23000' stroke-miterlimit='10' stroke-width='1'/%3E%3C/svg%3E%0A");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='719.184' height='810.218' viewBox='0 0 719.184 810.218'%3E%3Cpath id='Tracé_19653' data-name='Tracé 19653' d='M686.256,179.067,392.018,9.191a64.842,64.842,0,0,0-64.853,0L32.925,179.067A64.848,64.848,0,0,0,.5,235.231V574.988a64.852,64.852,0,0,0,32.425,56.164L327.166,801.028a64.842,64.842,0,0,0,64.853,0L686.256,631.152a64.856,64.856,0,0,0,32.428-56.164V235.231A64.851,64.851,0,0,0,686.256,179.067Z' transform='translate(0 0)' stroke='%23000' stroke-miterlimit='10' stroke-width='1'/%3E%3C/svg%3E%0A");
}

.template1 .section2 > div > img{
    max-width: 220px;
    margin-bottom: 36px;
}

body:not(.page-118, .page-289) .template1 .section2 > div > img{
    display: none;
}

.template1 .section2 > div .paragraphe p{
    color: #fff;
}

.template1 .section2 > div > .paragraphe > p > span{
    font-size: 21px;
    font-weight: 300;
    text-transform: uppercase;
}

.template1 .section2 > div .btn-reverse{
    background-color: #fff;
    width: fit-content;
    margin-top: 30px;
}

.section2 .paragraphe p a{
    color: #fff !important;
}

@media (max-width: 1600px){
    .template1 .section2 > div{
        padding: 16% 11%;
    }
    .template1 .section2 > div img{
        max-width: 150px;
        margin-bottom: 18px;
    }
    .template1 .section2 > div .btn-reverse{
        margin-top: 12px;
        color: #000;
        padding: 6px 36px;
    }
    .template1 .section2 > img{
        max-width: 50%;
        width: 50%;
    }
}

@media (max-width: 1200px){
    .template1 .section2 > img{
        display: none;
    }
    .template1 .section2 > div{
        padding: 12% 31%;
        transform: none;
        min-height: 700px;
        -webkit-mask-size: contain;
        mask-size: contain;
    }
}

@media (max-width: 800px){
    .template1 .section2 > div{
        padding: 12% 20%;
        -webkit-mask-size: cover;
        mask-size: cover;
    }
}

@media (max-width: 800px){
    .template1 .section2 > div{
        padding: 38% 36px;
        width: 100%;
    }
}