.pageRecrutement{
    padding-top: 60px;
}

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

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

.pageRecrutement .section1 .container{
  display: flex;
  align-items: center;
  gap: 20px 110px;
}

.pageRecrutement .section1 .container .left{
    width: 60%;
    position: relative;
}

.pageRecrutement .section1 .container .left img{
    aspect-ratio: 730/750;
    border-radius: 24px;
    width: 100%;
}

.pageRecrutement .section1 .container .left::before,
.pageRecrutement .section1 .container .left::after{
    content: "";
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    z-index: 2;
}

.pageRecrutement .section1 .container .left::before{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='726.973' height='74.123' viewBox='0 0 726.973 74.123'%3E%3Cpath id='Tracé_52995' data-name='Tracé 52995' d='M24.362-40.094h4.932q7.25,0,10.7-2.417t3.452-7.595q0-5.129-3.526-7.3T29-59.574H24.362Zm0,12.428V0H9.074V-72.1H30.083q14.7,0,21.749,5.351T58.884-50.5a19.13,19.13,0,0,1-3.5,11.318,23.168,23.168,0,0,1-9.913,7.767Q61.744-7.1,66.676,0H49.711L32.5-27.667ZM117.274,0H75.75V-72.1h41.524v12.526H91.038v15.831H115.45v12.526H91.038v18.592h26.236Zm45.667-60.413q-8.63,0-13.365,6.485t-4.734,18.074q0,24.116,18.1,24.116,7.595,0,18.4-3.8V-2.712a51.085,51.085,0,0,1-19.825,3.7q-15.732,0-24.066-9.543t-8.334-27.4a44.735,44.735,0,0,1,4.093-19.7,29.584,29.584,0,0,1,11.762-12.97,34.8,34.8,0,0,1,17.976-4.512,48.516,48.516,0,0,1,21.107,5.08l-4.932,12.428a81.634,81.634,0,0,0-8.137-3.354A24.275,24.275,0,0,0,162.941-60.413Zm49.021,20.318h4.932q7.25,0,10.7-2.417t3.452-7.595q0-5.129-3.526-7.3T216.6-59.574h-4.636Zm0,12.428V0H196.674V-72.1h21.009q14.7,0,21.749,5.351t7.052,16.25a19.13,19.13,0,0,1-3.5,11.318,23.168,23.168,0,0,1-9.913,7.767Q249.344-7.1,254.275,0H237.311L220.1-27.667ZM322.036-72.1v46.653a26.9,26.9,0,0,1-3.575,14.006,23.269,23.269,0,0,1-10.332,9.222A36.949,36.949,0,0,1,292.15.986q-13.907,0-21.6-7.126t-7.693-19.5V-72.1H278.1v44.138q0,8.334,3.354,12.23t11.1,3.9q7.5,0,10.874-3.921t3.378-12.3V-72.1ZM367.506,0H352.218V-59.377H332.639V-72.1h54.445v12.724H367.506Zm72.2,0H398.181V-72.1h41.524v12.526H413.469v15.831H437.88v12.526H413.469v18.592h26.236Zm45.568,0L467.914-56.566h-.444q.937,17.261.937,23.031V0H454.747V-72.1h20.812l17.063,55.136h.3l18.1-55.136h20.812V0H517.576V-34.127q0-2.417.074-5.573t.666-16.768h-.444L499.279,0ZM591.5,0H549.977V-72.1H591.5v12.526H565.265v15.831h24.412v12.526H565.265v18.592H591.5Zm79,0H651.075L619.71-54.544h-.444q.937,14.45.937,20.614V0H606.542V-72.1h19.283l31.316,54h.345q-.74-14.055-.74-19.875V-72.1h13.759Zm45.963,0H701.181V-59.377H681.6V-72.1h54.445v12.724H716.469Z' transform='translate(-9.074 73.136)' fill='%23fff' opacity='0.742'/%3E%3C/svg%3E%0A");
    bottom: -30px;
    left: 0;
    width: 100%;
    height: auto;
    aspect-ratio: 739/138;
}

.pageRecrutement .section1 .container .left::after{
    background-image: url("/wp-content/themes/fornel/img/plusPresPlusFraisVertical.svg");
    top: 0px;
    left: 15px;
    height: 45%;
    width: auto;
    aspect-ratio: 50 / 330;
    transform: translateX(-100%);
}

.pageRecrutement .section1 .container .right{
    width: 40%;
}

.pageRecrutement .section1 .container .right h1{
    font-size: 52px;
    line-height: 60px;
    margin-bottom: 16px;
    font-weight: bold;
    color: var(--primary);
    text-transform: uppercase;
}

.pageRecrutement .section1 .container .right .btnArrowContainer{
    margin-top: 70px;
}

@media (max-width: 1600px) {
    .pageRecrutement .section1 .container .right h1{
        font-size: 42px;
        line-height: 50px;
    }
    .pageRecrutement .section1 .container .right .btnArrowContainer{
        margin-top: 40px;
    }
    .pageRecrutement .section1 .container{
        gap: 20px 80px;
    }
}

@media (max-width: 1300px) {
    .pageRecrutement .section1 .container .left,
    .pageRecrutement .section1 .container .right{
        width: 50%; 
    }
    .pageRecrutement .section1 .container .left::before{
        bottom: -18px;
    }
}

@media (max-width: 992px) {
    .pageRecrutement .section1 .container .right{
        width: 100%; 
    }
    .pageRecrutement .section1 .container .left{
        width: 92%;
        margin-left: auto;
    }
    .pageRecrutement .section1 .container{
        flex-direction: column;
    }
    .pageRecrutement .section1 .container .right .btnArrowContainer{
        display: none;
    }
    .pageRecrutement .section1 .container .right h1{
        font-size: 30px;
        line-height: 35px;
    }
    .pageRecrutement .section1 .container .left::after{
        height: auto;
        width: 10%;
        left: 3%;
    }
    .pageRecrutement .section1 .container .left::before{
        bottom: -30px;
    }
    .pageRecrutement .section1 .container .left img{
        border-radius: 12px;
    }
}

@media (max-width: 600px) {
    .pageRecrutement .section1 .container .left::before{
        bottom: -10px;
    }
}

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

.pageRecrutement .section4{
    padding-bottom: 150px;
}

.pageRecrutement .section4 figure{
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-template-rows: 1fr;
    align-items: center;
}

.pageRecrutement .section4 figure > img{
    border-radius: 24px;
    width: 100%;
    height: auto;
    aspect-ratio: 875/730;
    grid-column: 5/13;
    grid-row: 1;
    grid-column: 1/8;
}

.pageRecrutement .section4 figure figcaption{
    background-color: #fff;
    grid-row: 1;
    height: fit-content;
    margin-top: -1px;
    grid-column: 6/13;
    border-radius: 24px;
    padding: 60px 70px;
}

.pageRecrutement .section4 figure figcaption .titre{
    font-size: 43px;
    line-height: 50px;
    font-weight: bold;
    color: var(--primary);
    text-transform: uppercase;
    margin-bottom: 16px;
}

.pageRecrutement .section4 figure figcaption .btn{
    margin-top: 30px;
}

@media (max-width: 1600px) {
    .pageRecrutement .section4 figure figcaption .titre{
        font-size: 38px;
        line-height: 45px;
    }
    .pageRecrutement .section4 figure figcaption{
        padding: 70px 60px;
    }
}

@media (max-width: 1200px) {
    .pageRecrutement .section4 figure figcaption .titre{
        font-size: 33px;
        line-height: 40px;
    }
    .pageRecrutement .section4 figure figcaption .btn{
        margin-top: 24px;
    }
}

@media (max-width: 992px) {
    .pageRecrutement .section4 figure figcaption .titre{
        font-size: 30px;
        line-height: 35px;
    }
    .pageRecrutement .section4 figure figcaption{
        padding: 0px !important;
        border-radius: 0px !important;
        grid-column: 1/13 !important;
    }
    .pageRecrutement .section4 figure > img{
        border-radius: 12px !important;
        grid-column: 1/13 !important;
        grid-row: 2 !important;
    }
    .pageRecrutement .section4 figure{
        gap: 24px 0px;
    }
}