.emplois {
    position: relative;
    overflow: hidden;
    background: var(--orange);
    color: var(--white);
    padding: 100px 20px;
    
    .label {
        color: black; 
    }
}

.emplois__bg {
    position: absolute;
    inset: -100px 0;
    z-index: 0;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url('../assets/emplois-texture.png');
    background-image: image-set(
        url('../assets/emplois-texture.webp') type('image/webp'),
        url('../assets/emplois-texture.png') type('image/png')
    );
    will-change: transform;
}

.emplois::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    background: var(--orange);
    opacity: 0.95;
    pointer-events: none;
}

.emplois__main {
    position: relative;
    z-index: 2;
    row-gap: 60px;
    display: flex;
    flex-direction: column;
}

.emplois__title {
    font-size: 37px;
    font-weight: 400;
    line-height: 42px;
  }

.emplois__button {
    margin-top: 30px;
}

@media (min-width: 1024px) {

    .emplois {
        padding: 100px 0;
    }

    .emplois__main {
        flex-direction: row;
        align-items: space-between;
        justify-content: flex-start;
        gap: 160px;
        width: 100%;
        max-width: 1920px;
        margin: 0 auto;
        padding: 0 30px;
        row-gap: 85px;
    }

    .emplois__title {
        width: 100%;
        font-size: 55px;
        font-weight: 400;
        line-height: 60px;
        letter-spacing: 0;
    } 

    .emplois__button {
        max-width: 100%;
        margin-top: 50px;
    }

    .emplois__column--intro {
        width: 35%;
    }

    .emplois__column--text {
        width: 50%;

        p {
            font-size: 28px;
            font-weight: 400;
            line-height: 34px;
            letter-spacing: 0;
        }
    }
}