.column-image-bg-component {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 20px;
}

.column-image-bg-section {
    display: grid;
    grid-template-columns: 2fr 2fr;
    align-items: center;
    margin-bottom: 3rem;
    margin-top: 3rem;
    gap: 80px;
    text-align: left;
}

.column-image-bg-section.reverse {
    grid-template-columns: 3fr 2fr;
}

.column-image-bg-content,
.column-image-bg-image {
    min-width: 300px;
    direction: ltr;
}

.column-image-bg-heading {
    color: #101B4D;
    margin-bottom: 15px;
    font: normal normal 500 34px/36px "Space Grotesk", sans-serif;
}

.column-image-bg-text {
    color: #101B4D;
    font: normal normal 400 14px/23px "Space Grotesk", sans-serif;
}

.column-image-bg-image img {
    width: 100%;
    /* max-width: 130%; */
    height: auto;
    display: block;
}

/* Green accents for column-image-bg theme */
.column-image-bg-image {
    position: relative;
}
.white-background {
    background-color: white;
}
.gray-background {
    background-color: #F5F6F8;
}
.swap_columns {
    direction: rtl;
}

@media (max-width: 768px) {
    .column-image-bg-component {
        padding: 36px;
    }

    .column-image-bg-section,
    .column-image-bg-section.reverse {
        grid-template-columns: 1fr;
        gap: 22px;
        margin-bottom: 22px;
    }
    .two-cols-intro {
        max-width: fit-content;
        text-align: center;
    }
    .column-image-bg-content {
        order: 1;
    }
    .column-image-bg-heading {
        font: normal normal 500 31px/38px "Space Grotesk", sans-serif;
    }
    .column-image-bg-text {
        font: normal normal 400 14px/21px "Space Grotesk", sans-serif;
    }
    .column-image-bg-image {
        order: 2;
    }
    .column-image-bg-section  {
        text-align: center;
        display: flex;
        flex-direction: column-reverse;
    }
}