.image-key-details {
    position: relative;
}

.image-key-details__inner {
    align-items: stretch;
    column-gap: clamp(2.5rem, 6vw, 7rem);
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    min-height: 1px;
}

.image-key-details__media,
.image-key-details__details {
    min-width: 0;
}

.image-key-details__media {
    display: flex;
    overflow: hidden;
}

.image-key-details__image {
    display: block;
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.image-key-details__details {
    align-items: center;
    display: flex;
}

.image-key-details__list {
    column-gap: var(--space-xl);
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0;
    padding: 0;
    row-gap: var(--space-xxl);
    width: 100%;
}

.image-key-details__item {
    align-content: start;
    display: grid;
    min-width: 0;
}

.image-key-details__icon {
    height: 2.25rem;
    margin-block-end: var(--space-s);
    width: 2.25rem;
}

.image-key-details__icon-image {
    display: block;
    height: 100%;
    object-fit: contain;
    width: 100%;
}

.image-key-details__heading,
.image-key-details__text {
    margin: 0;
}

.image-key-details__text,
.image-key-details__link {
    margin-block-start: var(--space-xs);
}

.image-key-details__link {
    justify-self: start;
}

.image-key-details--no-image .image-key-details__inner,
.image-key-details--no-details .image-key-details__inner {
    grid-template-columns: minmax(0, 1fr);
}

.image-key-details--no-image .image-key-details__details {
    padding-inline: 0;
}

@media (min-width: 782px) {
    .image-key-details--has-image .image-key-details__media {
        margin-inline-start: calc(-1 * var(--container-alignment-reference-edge));
    }

    .image-key-details--no-details .image-key-details__media {
        margin-inline-end: calc(-1 * var(--container-alignment-reference-edge));
    }
}

@media (max-width: 781px) {
    .image-key-details__inner {
        grid-template-columns: minmax(0, 1fr);
        row-gap: 2rem;
    }

    .image-key-details__details {
        padding: 0;
    }

    .image-key-details--no-details .image-key-details__media {
        margin: 0;
    }
}

@media (max-width: 640px) {
    .image-key-details__list {
        grid-template-columns: minmax(0, 1fr);
        row-gap: var(--space-l);
    }

    .image-key-details__icon--empty {
        display: none;
    }
}
