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

.pageAPropos .section1 {
    margin-top: 16px;
    margin-bottom: 70px;
    width: 100%;
    min-height: 22vh;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    position: relative;
    border-radius: 32px;
    padding: 50px 20px;
}

.pageAPropos .section1::before{
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(0 0 0 / 40%);
    z-index: 1;
}

.pageAPropos .section1 h1{
    color: var(--color-white);
    text-align: center;
    max-width: 600px;
    z-index: 1;
}

.pageAPropos .section1 .background {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    position: absolute;
}

@media (max-width: 992px) {
    .pageAPropos .section1{
        min-height: 250px;
        margin-bottom: 30px;
    }
}

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

.pageAPropos .section2{
    display: flex;
    gap: 20px;
    margin-bottom: 100px;
}

.pageAPropos .section2 .columnRight{
    width: 55%;
    padding: 55px 50px;
    background-color: var(--color-tertiary);
    border-radius: 24px;
    position: relative;
    overflow: hidden;
}

.pageAPropos .section2 .columnRight h2{
    margin-bottom: 24px;
    z-index: 1;
    position: relative;
}

.pageAPropos .section2 .columnRight .paragraphe{
    z-index: 1;
    position: relative;
}

.pageAPropos .section2 .columnLeft{
    width: 45%;
    position: relative;
}

.pageAPropos .section2 .columnLeft img{
    border-radius: 24px;
    display: block;
    height: 100%;
    aspect-ratio: 1140 / 250;
}

.pageAPropos .section2 .columnLeft .btnContainer{
    position: absolute;
    bottom: 0px;
    right: 0px;
    background-color: var(--color-white);
    padding: 20px 1px 0px 1px;
    border-radius: 0;
    z-index: 1;
}

.pageAPropos .section2 .columnLeft .btnContainer::before {
    content: "";
    position: absolute;
    display: block;
    width: 24px;
    height: auto;
    aspect-ratio: 1;
    top: 0;
    right: 0;
    transform: translateY(-100%);
    background-color: var(--color-white);
    clip-path: path("M0,0H24A0,0 0,0,1 24,0V24A0,0 0,0,1 24,24H0A0,0 0,0,1 0,24V24A0,0 0,0,1 0,24H0A24,24 0,0,0 24,0V0A0,0 0,0,1 24,0");
}

.pageAPropos .section2 .columnLeft .btnContainer::after {
    content: "";
    position: absolute;
    display: block;
    width: auto;
    height: 100%;
    aspect-ratio: 90/94;
    bottom: 0;
    left: 1px;
    transform: translateX(-100%);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='94' viewBox='0 0 90 94' fill='none'%3E%3Cpath d='M90 0.0151342C89.0443 0.0151342 88.0924 0.0151342 87.1329 0.0151342C83.6006 -0.0871138 78.524 0.276435 73.3059 2.73417C64.8307 6.73321 60.855 13.9739 55.5184 24.0358C55.5184 24.0358 54.1728 26.5731 37.0276 58.6866C26.339 78.7082 21.5988 85.2786 13.3148 89.7207C8.1846 92.4701 3.32583 93.5342 0 94H90V0.0151342Z' fill='white'/%3E%3C/svg%3E");
}

@media (max-width: 1400px) {
    .pageAPropos .section2 .columnRight{
        padding: 55px 30px;
    }
}

@media (max-width: 992px) {
    .pageAPropos .section2{
        flex-direction: column;
        margin-bottom: 30px;
    }
    .pageAPropos .section2 .columnRight{
        width: 100%;
        padding: 28px 24px;
    }
    .pageAPropos .section2 .columnLeft{
        width: 100%;
    }
    .pageAPropos .section2 .columnLeft .btnContainer{
        padding: 15px 1px 0px 1px;
    }
    .pageAPropos .section2 .columnLeft img{
        aspect-ratio: 13 / 10;
    }
}

/* --------------------------- SECTION 3 --------------------------- */

.pageAPropos .section3{
    margin-bottom: 100px;
    display: flex;
    gap: 30px;
}

.pageAPropos .section3 .columnLeft{
    width: 65%;
}

.pageAPropos .section3 .columnRight{
    width: 35%;
}

.pageAPropos .section3 .columnRight img{
    width: 100%;
    height: auto;
    aspect-ratio: 367 / 256;
    object-fit: cover;
    display: block;
    border-radius: 24px;
}

.pageAPropos .section3 .columnLeft .reassurances{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 50px 30px;
}

.pageAPropos .section3 .columnLeft .reassurances .reassurance{
    display: flex;
    align-items: center;
    gap: 16px;
}

.pageAPropos .section3 .columnLeft .reassurances .reassurance img{
    width: 64px;
    min-width: 64px;
    height: auto;
    aspect-ratio: 1;
    display: block;
    object-fit: contain;
}

.pageAPropos .section3 .columnLeft .reassurances .reassurance figcaption .titre{
    font-size: 20px;
    line-height: normal;
    font-weight: 500;
    color: var(--color-primary);
    margin-bottom: 12px;
}

@media (max-width: 1500px) {
    .pageAPropos .section3 .columnLeft .reassurances .reassurance img{
        width: 48px;
        min-width: 48px;
    }
    .pageAPropos .section3 .columnLeft .reassurances .reassurance figcaption .titre{
        font-size: 18px;
        margin-bottom: 8px;
    }
}

@media (max-width: 1200px) {
    .pageAPropos .section3 .columnLeft .reassurances{
        grid-template-columns: 1fr;
        gap: 30px;
    }
}

@media (max-width: 992px) {
    .pageAPropos .section3{
        flex-direction: column;
        margin-bottom: 30px;
    }
    .pageAPropos .section3 .columnLeft,
    .pageAPropos .section3 .columnRight{
        width: 100%;
    }
    .pageAPropos .section3 .columnLeft .reassurances{
        display: flex;
        gap: 20px;
        flex-wrap: nowrap;
        width: 100vw;
        overflow-x: scroll;
        padding-inline: 20px;
        transform: translateX(-20px);
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
    .pageAPropos .section3 .columnLeft .reassurances::-webkit-scrollbar {
        display: none;
    }
    .pageAPropos .section3 .columnLeft .reassurances .reassurance img{
        width: 40px;
        min-width: 40px;
    }
    .pageAPropos .section3 .columnLeft .reassurances > li{
        min-width: 70vw;
        width: 70vw;
    }
    .pageAPropos .section3 .columnLeft .reassurances .reassurance figcaption .titre{
        margin-bottom: 5px;
    }
}

/* --------------------------- SECTION 4 --------------------------- */

.pageAPropos .section4{
    margin-bottom: 100px;
    display: grid;
    grid-template-columns: 4fr 5fr 3fr;
    align-items: end;
    gap: 30px;
}

.pageAPropos .section4 .imgContainer1{
    position: relative;
}

.pageAPropos .section4 .imgContainer1 img{
    width: 100%;
    height: auto;
    aspect-ratio: 368/492;
    display: block;
    border-radius: 24px;
    position: relative;
}

.pageAPropos .section4 .imgContainer1::after{
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 10px;
    width: 85%;
    height: auto;
    aspect-ratio: 326/408;
    background-repeat: no-repeat;
    background-position: bottom left;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg width='326' height='408' viewBox='0 0 326 408' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M66.3546 353.565C66.2251 371.389 66.484 389.148 65.9014 406.972H93.4143C93.4143 406.972 93.4143 406.907 93.479 406.842C93.5438 406.583 93.6085 406.389 93.6732 406.129C93.6732 406 93.738 405.741 93.8027 405.611C93.8027 405.417 93.8027 405.222 93.8027 405.028C93.8027 404.833 93.8027 404.639 93.8027 404.379C93.8027 404.315 93.8027 404.055 93.738 403.926C93.5438 403.083 93.738 402.435 94.0616 401.852C93.8674 385.713 94.0616 369.574 93.8674 353.5C118.661 353.305 143.391 353.694 168.185 353.305C139.442 235.667 112.706 117.509 83.6391 0C55.1552 117.639 28.0955 235.731 0 353.435C22.1398 353.435 44.2148 353.305 66.3546 353.565Z' fill='%2300C674'/%3E%3Cpath d='M260.46 376.574C260.46 386.75 260.59 396.861 260.59 407.037C267.581 407.037 274.508 407.037 281.499 407.037C281.499 396.926 281.499 386.879 281.499 376.768C296.065 376.768 310.695 376.768 325.261 376.768C308.494 305.277 292.116 233.657 274.119 162.49C258.324 234.046 240.845 305.342 224.014 376.703C236.119 376.833 248.29 376.898 260.46 376.703V376.574Z' fill='%2300C674'/%3E%3C/svg%3E%0A");
}

.pageAPropos .section4 .imgContainer2 img{
    width: 100%;
    height: auto;
    aspect-ratio: 270/240;
    display: block;
    border-radius: 24px;
}

.pageAPropos .section4 .textContainer .titre{
    margin-bottom: 24px;
}

.pageAPropos .section4 .textContainer .paragraphe ul{
    list-style: none;
    padding: 0;
}

.pageAPropos .section4 .textContainer .paragraphe ul li{
    display: flex;
    align-items: center;
    gap: 13px;
    font-weight: 600;
}

.pageAPropos .section4 .textContainer .paragraphe ul li::before{
    content: "";
    display: block;
    height: 25px;
    width: 25px;
    min-width: 25px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 26 26' fill='none'%3E%3Cmask id='mask0_6074_3109' style='mask-type:luminance' maskUnits='userSpaceOnUse' x='1' y='1' width='23' height='23'%3E%3Cpath d='M12.5856 23.0757C13.9633 23.0774 15.3278 22.8069 16.6006 22.2796C17.8734 21.7524 19.0294 20.9789 20.0024 20.0035C20.9778 19.0305 21.7513 17.8745 22.2785 16.6017C22.8058 15.3289 23.0763 13.9644 23.0746 12.5867C23.0763 11.2091 22.8058 9.84463 22.2785 8.57183C21.7513 7.29903 20.9778 6.14294 20.0024 5.17C19.0294 4.19461 17.8734 3.42108 16.6006 2.89385C15.3278 2.36662 13.9633 2.09609 12.5856 2.09779C11.208 2.09609 9.84353 2.36662 8.57073 2.89385C7.29793 3.42108 6.14185 4.19461 5.1689 5.17C4.19351 6.14294 3.41998 7.29903 2.89276 8.57183C2.36553 9.84463 2.09499 11.2091 2.09669 12.5867C2.09499 13.9644 2.36553 15.3289 2.89276 16.6017C3.41998 17.8745 4.19351 19.0305 5.1689 20.0035C6.14185 20.9789 7.29793 21.7524 8.57073 22.2796C9.84353 22.8069 11.208 23.0774 12.5856 23.0757Z' fill='white' stroke='white' stroke-width='1.79811' stroke-linejoin='round'/%3E%3Cpath d='M8.39062 12.5866L11.5373 15.7333L17.8307 9.43994' stroke='black' stroke-width='1.79811' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_6074_3109)'%3E%3Cpath d='M0 0H25.1735V25.1735H0V0Z' fill='%2300C674'/%3E%3C/g%3E%3C/svg%3E");
}

@media (max-width: 992px) {
    .pageAPropos .section4{
        margin-bottom: 30px;
        display: flex;
        flex-direction: column;
    }
}

/* --------------------------- SECTION 5 --------------------------- */

.pageAPropos .section5{
    margin-bottom: 100px;
}

.pageAPropos .section5 figure{
    display: block;
    position: relative;
    padding: 32px;
}

.pageAPropos .section5 figure img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 24px;
}

.pageAPropos .section5 figure figcaption{
    height: 100%;
    width: 100%;
    max-width: 50%;
    margin-left: auto;
    border-radius: 24px;
    background-color: var(--color-white);
    padding: 40px;
    position: relative;
}

.pageAPropos .section5 figure figcaption .titre{
    margin-bottom: 24px;
}

.pageAPropos .section5 figure figcaption .reassurances{
    margin-top: 8px;
}

.pageAPropos .section5 figure figcaption .reassurances li{
    font-size: 20px;
    font-weight: 500;
    color: var(--color-primary);
    padding-block: 24px;
    border-bottom: 1px solid var(--color-secondary);
}

@media (max-width: 992px) {
    .pageAPropos .section5{
        margin-bottom: 30px;
    }
    .pageAPropos .section5 figure{
        padding: 24px 14px;
    }
    .pageAPropos .section5 figure figcaption{
        max-width: none;
        padding: 24px;
    }
    .pageAPropos .section5 figure figcaption .titre{
        margin-bottom: 18px;
    }
    .pageAPropos .section5 figure figcaption .reassurances{
        margin-top: 6px;
    }
    .pageAPropos .section5 figure figcaption .reassurances li{
        font-size: 18px;
        padding-block: 18px;
    }
}