.block-textwithimage {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
    align-items: center;
}

.block-textwithimage--left {
    direction: rtl;
}

.block-textwithimage--left > * {
    direction: ltr;
}

.block-textwithimage-img {
    position: relative;
}

.block-textwithimage-img img {
    width: 100%;
    display: block;
    border-radius: var(--nm-radius);
}

.block-textwithimage-img .img-circle {
    border-radius: 50%;
    aspect-ratio: 1/1;
    object-fit: cover;
}

.block-textwithimage-graphic {
    position: absolute;
    inset: -12%;
    z-index: -1;
    opacity: 0.5;
    pointer-events: none;
}

.block-textwithimage--small-image .block-textwithimage-img {
    margin-inline: auto;
}

@media (max-width: 860px) {
    .block-textwithimage--small-image .block-textwithimage-img {
        max-width: 320px;
    }
}

@media (min-width: 861px) {
    .block-textwithimage--small-image {
        grid-template-columns: 3fr 1fr;
    }

    .block-textwithimage--small-image .block-textwithimage-img {
        max-width: none;
    }
}

.block-textwithimage--expand-image .block-textwithimage-img img {
    width: 100%;
}

.block-textwithimage-cta {
    margin-top: 1.5rem;
}

.block-textwithimage-logo {
    margin-top: 1.5rem;
    max-width: 140px;
}

.block-textwithimage-logo img {
    display: block;
    max-width: 100%;
}

@media (max-width: 860px) {
    .block-textwithimage {
        grid-template-columns: 1fr;
    }

    .block-textwithimage--left,
    .block-textwithimage--left > * {
        direction: ltr;
    }
}

/* No image (or video) chosen: the text takes the full width.
   Shared by the text with inset image and text with inset video blocks. */
.block-textwithimage.block-textwithimage--text-only {
    grid-template-columns: minmax(0, 1fr);
}