/* :root {
    --sp-container-max-width-xxl: 1200px;
} */

.container {
    max-width: 100%;
    --bs-gutter-x: 0;
}

.row {
    --bs-gutter-x: 0.5rem;
    --bs-gutter-y: 1rem;
}

.card.large {
    aspect-ratio: 13/10;
    /* height: auto; */
    overflow: hidden;
}

.card {
    aspect-ratio: 4/1;
    /* height: auto; */
    overflow: hidden;
}

.card-title {
    font-size: calc(16px + 0.2vw);
    /* font-size: 17px; */
    line-height: 1.2;
    margin-bottom: 2px;
    letter-spacing: .6px;
    /* line-clamp: 1; */
    display: -webkit-box;
    /* -webkit-line-clamp: 1; */
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    /* overflow: hidden; */
}

.card-subtitle {
    /* font-size: calc(14px + 0.025vw); */
    font-size: calc(12px + 0.025vw);
    /* font-size: 13px; */
    line-height: 1;
    /* overflow: hidden; */
}

.card-text {
    /* font-size: calc(14px + 0.1vw); */
    font-size: 15px;
    /* font-size: 16px; */
    line-height: 1.3;
    /* line-clamp: 1; */
    display: -webkit-box;
    /* -webkit-line-clamp: 1; */
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    overflow: hidden;
    /* word-wrap: break-word; */
    font-weight: 300;
    /* word-spacing: 2px; */
    letter-spacing: .7px;
}

.card__image-icon.--top {
    margin-left: 6px;
    width: calc(32px + 1vw);
}

.card__image-icon.--play {
    height: 50%;
    top: 40%;
}

.card__image {
    width: 100%;
    height: 100%;
}

.card.large .card-title {
    /* font-size: calc(19px + 0.2vw); */
    font-size: 18px;
    line-height: 1.2;
    margin-bottom: 4px;
    letter-spacing: .8px;
}

.card.large .card-text {
    font-size: calc(14px + 0.1vw);
    /* font-size: 15px; */
    line-height: 1.3;
    font-weight: 300;
    /* word-spacing: 2px; */
    letter-spacing: .7px;
}

.card__image-wrapper.--item-latest-large {
    height: 72%;
    /* aspect-ratio: 16/9; */
    background-color: #fff;
    overflow: hidden;
    /* object-fit: cover; */
}

.card.large .card-body {
    height: 28%;
    /* flex-basis: auto;
    flex-grow: unset;
    aspect-ratio: 17/5; */
}

@media screen and (min-width: 576px) {
    .card__image-wrapper.--item-latest-large {
        height: 75%;
    }

    .card.large .card-body {
        height: 25%;
    }
}

.card__image-wrapper.--item-latest-small {
    /* aspect-ratio: 12/8; */
    width: 38%;
    background-color: #fff;
    overflow: hidden;
    /* object-fit: cover; */
}

.card-body {
    width: 62%;
}

@media screen and (min-width: 410px) {
    .card__image-wrapper.--item-latest-small {
        /* aspect-ratio: 14/9; */
        width: 32%;
    }

    .card-body {
        width: 68%;
    }

}

@media screen and (min-width: 576px) {
    .card__image-wrapper.--item-latest-small {
        /* aspect-ratio: 16/9; */
        width: 36%;

    }

    .card-body {
        width: 64%;
    }
}

@media screen and (min-width: 768px) {
    .card__image-wrapper.--item-latest-small {
        /* aspect-ratio: 16/9; */
        width: 33%;

    }

    .card-body {
        width: 67%;
    }
}

@media screen and (min-width: 992px) {
    .card__image-wrapper.--item-latest-small {
        /* aspect-ratio: 14/9; */
        width: 37%;
    }

    .card-body {
        width: 63%;
    }
}

@media screen and (min-width: 1200px) {
    .card__image-wrapper.--item-latest-small {
        /* aspect-ratio: 14/9; */
        width: 39%;
    }

    .card-body {
        width: 61%;
    }
}

@media screen and (min-width: 1400px) {
    .card__image-wrapper.--item-latest-small {
        /* aspect-ratio: 14/9; */
        width: 39%
    }

    .card-body {
        width: 61%;
    }
}

.card__image-wrapper.--item-latest-small.--category-tv {
    border-color: var(--sp-category-tv);
    border-width: 0.5px;
    border-style: solid;
}
