.li-widgets--cta-advanced {
    padding: var(--padding-large);
    display: flex;
    border-radius: var(--radius-4);

    &.view-2-column {
        gap: var(--padding-xxl);

        .image-col {
            min-width: 325px;
            max-width: 325px;
            position: relative;
            --image-padding: 72px;

            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;

            &.padding-regular {
                --image-padding: 44px;
            }

            .image {
                width: calc(100% - var(--image-padding) * 2);
                border-radius: var(--radius-4);
                height: auto;
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);

            }

            .bg-image {
                width: 100%;
                height: 100%;
                object-fit: cover;
                border-radius: var(--radius-4);
            }
        }

        .content-col {
            display: flex;
            flex-grow: 10;
            flex-direction: column;
            justify-content: space-between;

            .content--text {
                align-self: flex-start;
                margin-block-end: var(--padding-large);
            }

            .content--footer {
                align-self: flex-end;
                display: flex;
                justify-content: space-between;
                align-items: end;
                widtH: 100%;

                .person-position {
                    color: var(--color-alpha--white_alpha_60);
                }
            }
        }

        @media(max-width: 991px) {
            gap: var(--padding-xl);

            .image-col {
                min-width: 200px;
                max-width: 200px;
                --image-padding: 36px;
            }
        }

        @media (max-width: 768px) {
            flex-direction: column;
            gap: var(--padding-large);

            .image-col {
                min-width: 0;
                max-width: 100%;
                width: 100%;
                height: 268px;

                .bg-image {
                    position: absolute;
                    top: 0;
                    left: 0;
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                }

                .image {
                    position: relative;
                    width: 180px;
                    height: 180px;
                    transform: none;
                    top: auto;
                    left: auto;
                    border-radius: var(--radius-4);
                    object-fit: cover;
                }
            }

            .content-col {
                gap: var(--padding-large);

                .content--text {
                    margin-block-end: 0;
                }

                .content--footer {
                    flex-direction: column;
                    align-items: flex-start;
                    gap: var(--padding-xl);
                }
            }
        }
    }

    &.view-3-column {
        gap: var(--padding-medium);
        --image-width: 140px;

        .image--col {
            min-width: var(--image-width);
            max-width: var(--image-width);
            border-radius: var(--radius-4);
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            overflow: hidden;

            .image {
                object-fit: cover;
                border-radius: var(--radius-4);
                width: 100%;
                height: 100%;
            }
        }

        .headline--col {
            width: calc(100% - (var(--image-width)) - var(--padding-medium) * 2);
            min-width: 380px;
            gap: var(--padding-extra-small);
            display: flex;
            flex-direction: column;
            justify-content: center;

            .subheadline {
                color: var(--color-alpha--white_alpha_60);
            }
        }

        .content--col {
            flex-grow: 10;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            gap: var(--padding-medium);

            .content--text {
                color: var(--color-alpha--white_alpha_60);
            }
        }

        @media (max-width: 991px) {
            flex-wrap: wrap;

            .content--col {
                width: 100%;
            }

            .headline--col {
                min-width: 0;
                width: calc(100% - var(--image-width) - var(--padding-medium));
            }
        }

        @media (max-width: 768px) {
            flex-direction: column;
            gap: var(--padding-medium);

            .image--col {
                min-width: 140px;
                max-width: 140px;
                width: 140px;
                height: 140px;
                align-self: flex-start;
            }

            .headline--col {
                min-width: 0;
                width: 100%;
                max-width: 100%;
                padding-right: 0;
                gap: var(--padding-extra-small);
            }

            .content--col {
                width: 100%;
                gap: var(--padding-xl);
            }
        }
    }
}