
    .block-multi-card-list .block-container {
        background-color: var(--color-primary);
        border-bottom-left-radius: 0.5rem;
        border-bottom-right-radius: 0.5rem;
    }

.block-multi-card-list .top-image-container {
        padding-inline: 0.625rem;
    }

.block-multi-card-list .picture-wrapper {
        position: relative;
        aspect-ratio: 400 / 380;
        border-radius: 0.5rem;
        overflow: hidden;
    }

.block-multi-card-list .picture-wrapper::before {
            content: "";
            position: absolute;
            inset: 0;
            z-index: 1;
            background: linear-gradient(to bottom, transparent, transparent 30%, var(--color-primary));
        }

.block-multi-card-list .picture-wrapper .picture {
            position: absolute;
            inset: 0;
            opacity: 0.3;
            overflow: hidden;
            transition: opacity 0.3s ease-in-out;
            z-index: -1;
        }

.block-multi-card-list .picture-wrapper .picture.active {
                opacity: 1;
                z-index: 0;
            }

.block-multi-card-list .main-title-container {
        padding-inline: 1.875rem;
    }

.block-multi-card-list .main-title-container .title {
            color: #fff;
        }

.block-multi-card-list .main-title-container .view-switch-wrapper {
            padding-top: 1.25rem;
            display: flex;
            justify-content: start;
            align-items: center;
        }

.block-multi-card-list .lists-container {
        padding-inline-start: 1.25rem;
    }

.block-multi-card-list .lists-container .list-contents {
            overflow: hidden;
            border-radius: 0.375rem;
            opacity: 0.3;
            height: 0;
            transition: all 0.6s ease-in-out;
        }

.block-multi-card-list .lists-container .list-contents.active {
                opacity: 1;
                height: auto;
            }

@media screen and (min-width: 48rem) {
        .block-multi-card-list .picture-wrapper {
            aspect-ratio: 2;
        }
        .block-multi-card-list .main-title-container {
            display: flex;
            align-items: center;
            justify-content: space-between;
        }
}

@media screen and (min-width: 64rem) {
    .block-multi-card-list {
        padding-inline: 0.9375rem;
    }

        .block-multi-card-list .top-image-container {
            padding-inline: 0;
        }
        .block-multi-card-list .picture-wrapper {
            aspect-ratio: 2.2;
        }
        .block-multi-card-list .main-title-container {
            padding-inline: 4.375rem;
            padding-block: 1.25rem 2.75rem;
        }
        .block-multi-card-list .lists-container {
            padding-inline-start: 4.375rem;
            padding-bottom: 3.125rem;
        }
}

@media screen and (min-width: 80rem) {
        .block-multi-card-list .picture-wrapper {
            aspect-ratio: 2.6;
        }
}

@media screen and (min-width: 96rem) {
        .block-multi-card-list .main-title-container {
            padding-top: 1.875rem;
            padding-inline: 7.8125rem;
        }
        .block-multi-card-list .lists-container {
            padding-inline-start: 7.8125rem;
        }
}
