.intro-text-and-image {
    overflow: hidden;
    margin-top: -90px;

    @media screen and (max-width: 991px) {
        margin-top: 0;
    }
    .row {
        @media screen and (max-width: 991px) {
            flex-direction: column-reverse;
        }
    }
    .left-col {
        padding-top: 90px;
        padding-left: 100px;

        @media screen and (max-width: 1200px) {
            padding-left: 80px;
        }
        @media screen and (max-width: 991px) {
            padding-top: 0;
            padding-left: calc(var(--bs-gutter-x) * .5);
        }
        .heading {
            text-wrap: pretty;

            h2 {
                font-family: var(--font-secondary);
                line-height: 1.3;
                font-weight: normal;
                font-style: italic;
                margin-bottom: 0;

                @media screen and (max-width: 991px) {
                    font-size: var(--font-size-md);
                }
            }
        }
        .text {
            margin-top: var(--spacing-lg);
            margin-bottom: -3rem;

            @media screen and (max-width: 991px) {
                margin-top: var(--spacing-md);
            }
            + .callout-box {
                margin-top: calc(var(--spacing-lg) + 3rem);
            }
        }
        .callout-box {
            background: linear-gradient(135deg, rgba(128, 128, 128, .25) 60%, rgba(var(--color-white-rgb), .07) 100%);
            outline: 2px solid rgba(var(--color-white-rgb), .15);
            border-radius: 30px;
            padding: 50px;
            margin-top: var(--spacing-lg);

            @media screen and (max-width: 1200px) {
                padding: 40px;
            }
            @media screen and (max-width: 991px) {
                margin-top: var(--spacing-md);
            }
            @media screen and (max-width: 576px) {
                padding: 30px;
            }
            .callout-preheading {
                font-family: var(--font-secondary);
                font-size: 1.8rem;
                font-weight: 700;
                font-style: italic;
                letter-spacing: .45px;
                color: var(--color-primary);
                margin-bottom: 0;
            }
            .callout-heading {
                font-size: 1.6rem;
                font-weight: 800;
                text-transform: uppercase;
                letter-spacing: 1.28px;

                @media screen and (max-width: 768px) {
                    margin-bottom: 2rem;
                }
            }
            .callout-text {
                font-size: 1.6rem;
                line-height: 1.45;
                margin-bottom: 0;
            }
        }
    }
    .right-col {
        padding-top: 90px;

        @media screen and (max-width: 991px) {
            padding-top: 0;
        }
        .intro-image {
            position: relative;

            img {
                width: 100%;
                border-radius: 12px;
            }
            .human-iq-mark {
                position: absolute;
                background-image: url('../../../assets/svg/human-iq-mark.svg');
                background-size: cover;
                background-repeat: no-repeat;
                top: -90px;
                right: -112px;
                width: 227px;
                height: 228px;

                @media screen and (max-width: 1460px) {
                    top: -6.164vw;
                    right: -7.671vw;
                    width: 15.548vw;
                    height: 15.616vw;
                }
                @media screen and (max-width: 991px) {
                    top: 5vw;
                }
            }
        }
    }
}