.at-introImage {
    max-width: 520px;
    transform: translateY(var(--introPaddingBottom, var(--marginLarge)));
}

.--homepage .at-introImage {
    transform: none;
}

.at-introImage__image {
    max-width: min(50vw, 300px);
}

@media (min-width: 1024px) {
    .at-introImage,
    .--homepage .at-introImage {
        position: absolute;
        grid-column: 2;
        bottom: calc(var(--introPaddingBottom, var(--marginLarge)) * -1);
        transform: translateY(4rem);
    }

    .at-introImage__image {
        max-width: 100%;
    }

    /**
     * Position at the bottom of the container, without overlapping
     */
    .at-introImage.--contain {
        bottom: 0;
        margin-bottom: calc(-1 * var(--introPaddingBottom, var(--marginLarge)));
        transform: none;
    }

    .at-introImage.--contain .g-container__inner {
        height: 100%;
    }

    .at-introImage.--contain .at-introImage__image {
        height: 100%;
        object-fit: contain;
        object-position: bottom;
    }
}