.text-image-section {
    display: flex;
    flex-wrap: wrap;

    .text-column {
        width: unset !important;
    }

    .image-column {
        flex: 1 1 50%;
    }

    .image-column {
        min-height: clamp(300px, 60vh, 700px);

        figure {
            height: 100%;
            margin: 0;
        }

        img {
            height: 100%;
            width: auto;
            max-width: none;
            object-fit: contain;
            display: block;
        }

        &.right figure {
            position: absolute;
            right: 0;
            top: 0;
            bottom: 0;
        }

        &.left figure {
            position: absolute;
            left: 0;
            top: 0;
            bottom: 0;
        }
    }
}

@media (max-width: 768px) {
    .text-image-section {
        flex-direction: column;

        .image-column {
            min-height: auto;

            figure {
                position: relative !important;
                height: auto;
                width: 100%;
            }

            img {
                height: auto;
                width: 100%;
                max-width: 100%;
            }

            &.left {
                /* Reverse order for mobile */
                order: 2;  /* moves image after text */
            }

            &.right {
                order: 1; /* keeps image before text */
            }
        }
    }
}