.training-program {
    padding-bottom: 11.25rem
}

.training-modules {
    display: grid;
    gap: 5rem
}

.training-module {
    position: relative;
    min-height: 37rem;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    align-items: start
}

.training-module__copy {
    width: 60.125rem;
    min-height: 30rem;
    padding: 6.25rem 17.5rem 4rem 7.625rem;
    background: url(../img/pages/training/training-module-copy-background.svg) left top/100% 100% no-repeat
}

.training-module__copy h3 {
    font-size: 2.125rem;
    color: var(--purple);
    margin-bottom: 1.75rem
}

.training-module__copy p {
    font-size: 1.375rem;
    line-height: 2.4rem
}

.training-module>img {
    position: relative;
    margin-left: -11.25rem;
    margin-top: 6.9375rem;
    width: 61.3125rem;
    height: 30rem;
    object-fit: contain;
    max-width: none
}

.training-module--reverse>img {
    grid-column: 1;
    grid-row: 1;
    margin: 0;
    width: 61.25rem
}

.training-module--reverse .training-module__copy {
    grid-column: 2;
    grid-row: 1;
    margin-left: -10.1875rem;
    margin-top: 7rem;
    padding: 5.625rem 4rem 3rem 22rem;
    background-image: url(../img/pages/training/training-module--reverse-training-module-copy-background.svg)
}

@media(max-width:900px) {
    .training-module {
        display: flex;
        flex-direction: column;
        min-height: 0;
        gap: 0
    }

    .training-module__copy,
    .training-module--reverse .training-module__copy {
        width: 90%;
        min-height: 0;
        padding: 4rem 8rem 4rem 4rem;
        margin: 0;
        background: #f5f8fd;
        border-radius: 1.5rem
    }

    .training-module>img,
    .training-module--reverse>img {
        width: 70%;
        height: auto;
        margin: -2rem 0 0 auto
    }

    .training-module--reverse .training-module__copy {
        align-self: flex-end
    }

    .training-module--reverse>img {
        margin: -2rem auto 0 0
    }
}

@media(max-width:640px) {
    .training-program {
        padding-bottom: 64px
    }

    .training-modules {
        gap: 32px
    }

    .training-module {
        gap: 18px
    }

    .training-module__copy,
    .training-module--reverse .training-module__copy {
        width: 100%;
        padding: 24px;
        border-radius: 18px;
        order: 2
    }

    .training-module__copy h3 {
        font-size: 22px;
        margin-bottom: 16px
    }

    .training-module__copy p {
        font-size: 14px;
        line-height: 1.9
    }

    .training-module>img,
    .training-module--reverse>img {
        width: 100%;
        height: auto;
        margin: 0;
        order: 1
    }
}

.training-module {
    grid-template-columns: repeat(2, minmax(0, 1fr))
}

@media(max-width:900px) {
    .training-module {
        display: flex
    }
}