.asm-image-call-to-action {
    --title-text: var(--asm-ftw-extra-bold) var(--asm-fts-xl)/var(--asm-ftl-dense) var(--asm-font-family);
    --description-text: var(--asm-ftw-semi-bold) var(--asm-fts-body)/var(--asm-ftl-compact) var(--asm-font-family);

    height: 400px;
    width: 100%;
    max-width: calc(var(--width-comfortable) + var(--asm-width-page-padding) * 2);
    margin-block: 0;
    margin-inline: auto;
    padding-inline: var(--asm-width-page-padding);
}

.asm-image-call-to-action .image-details-container {
    margin-block: 0;
    margin-inline: auto;
    width: 345px;
    height: 400px;
    display: grid;
}

@media (min-width: 60em) {
    .asm-image-call-to-action .image-details-container {
        max-width: 300px;
    }
}

.asm-image-call-to-action .image-details-container::after {
    background: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 65%);
    grid-area: 1 / 1 / 2 / 2 ;
    border-radius: 12px;
    content: "";
}

.asm-image-call-to-action picture {
    grid-area: 1 / 1 / 2 / 2;
    height: 100%;
    width: 100%;
    object-fit: cover;
    border-radius: 12px;
    overflow: hidden;
}

.asm-image-call-to-action img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.asm-image-call-to-action .details {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    grid-area: 1 / 1 / 2 / 2;
    align-self: end;
    z-index: 20;
    padding: var(--space-6);
}

.asm-image-call-to-action .title {
    font: var(--title-text);
    color: var(--asm-sw-white);
}

.asm-image-call-to-action .description {
    font: var(--description-text);
    color: var(--asm-sw-white);
}

.asm-image-call-to-action .details .asm-button.button-white {
    width: 100%;
}

/* Fixes for small screens.*/
@media (max-width: 400px) {
    .asm-image-call-to-action {
        height: fit-content;
    }

    .asm-image-call-to-action .image-details-container {
        width: 100%;
        height: fit-content;
    }

    .asm-image-call-to-action img {
        height: 100%;
        object-fit: cover;
    }
}