section.it-outstaffing {
    padding: 120px 0;
    position: relative;

    &.shine:before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        max-width: 997px;
        height: 1010px;
        background: url(../../img/it-outstaffing-shine.png) left top / contain no-repeat;
        pointer-events: none;
    }

    .container {
        position: relative;
    }

    &.background-dark {
        color: #ADADAD;

        h2 {
            font-weight: 400;
            line-height: 1.3em;
            letter-spacing: 1.5px;
            color: #FFFFFF;
            margin: 0;
        }
    }

    .item-title {
        font-size: 24px;
        font-weight: 700;
        line-height: 1.25em;
        letter-spacing: 1px;
        color: #FFFFFF;
        margin-top: 24px;
    }

    .title-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        column-gap: 40px;
        margin-bottom: 40px;

        .title {
            min-width: 586px;
        }
    }

    .description {
        p {
            letter-spacing: 0.5px;
        }
    }

    .cards .cards-row {
        display: flex;
        gap: 20px;

        .item {
            max-width: 60%;
            padding: 24px;
            border-radius: 16px;
            background: rgba(255, 255, 255, 0.06);
        }

        .item:nth-child(even) {
            max-width: 40%;
        }

        .item-image img {
            width: 100%;
            height: 100%;
            object-fit: contain;
        }

        > div.item:nth-child(2),
        > div.item:nth-child(3) {
            max-width: 40%;
        }
    }

    .cards .cards-row:not(:first-child) {
        margin-top: 20px;
    }

    .cards .cards-row:nth-child(even) {
        .item {
            max-width: 40%;
        }

        .item:nth-child(even) {
            max-width: 60%;
        }
    }
}


/* MEDIA */

@media only screen and (max-width: 991px) {
    section.it-outstaffing {
        .title-row {
            flex-wrap: wrap;

            .title {
                width: 100%;
                min-width: 0;
                max-width: 586px;
            }
        }
    }
}

/* ( < 991 ) */


@media (max-width: 567px) {
    section.it-outstaffing {
        padding: 80px 0;

        &.shine:before {
            left: auto;
            right: 0;
            max-width: 597px;
            height: 1010px;
            background: url(../../img/it-outstaffing-mobile-shine.png) right top / cover no-repeat;
        }

        .description {
            margin-top: 24px;
        }

        .item-title {
            font-size: 20px;
            margin-top: 16px;
        }

        .cards .cards-row .item {
            padding: 16px;
        }

        .cards .cards-row {
            flex-wrap: wrap;

            > div.item {
                max-width: 100% !important;
            }
        }
    }
}

/* ( < 567 ) */
