/* =========================================
   Block: Video Carousel
   ========================================= */

.vcarousel {
    padding: 88px 0;
    background: #111111;
    overflow: hidden;
}

/* --- Intro --- */
.vcarousel__intro {
    text-align: center;
    margin-bottom: 52px;
}

.vcarousel__heading {
    font-size: clamp(26px, 4vw, 52px);
    font-weight: 700;
    letter-spacing: -0.025em;
    color: #ffffff;
    line-height: 1.1;
    margin-bottom: 10px;
}

.vcarousel__sub {
    font-size: 16px;
    color: rgba(255,255,255,0.4);
    line-height: 1.6;
    margin: 0;
}

/* --- Swiper container --- */
.js-vcarousel {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    padding: 32px 0 40px;
    overflow: visible !important;
}

/* --- Карточка --- */
.vcarousel__card {
    position: relative;
    border-radius: 18px;
    overflow: hidden;
    background: #1a1a1a;
    /* 16:10 соотношение сторон */
    aspect-ratio: 16 / 10;
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.06),
        0 20px 56px rgba(0,0,0,0.65);
    transition: box-shadow 0.4s ease;
}


@supports not (aspect-ratio: 16 / 10) {
    .vcarousel__card { padding-top: 62.5%; height: 0; }
    .vcarousel__video { position: absolute; top: 0; left: 0; }
}

.vcarousel__video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Активный слайд чуть ярче */
.js-vcarousel .swiper-slide-active .vcarousel__card {
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.1),
        0 28px 72px rgba(0,0,0,0.8);
}

/* --- Кнопки --- */
.vcarousel__btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: rgba(255,255,255,0.1);
    border: 1px solid rgba(255,255,255,0.15);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.2s ease;
    flex-shrink: 0;
}

@media (hover: hover) {
    .vcarousel__btn:hover { background: rgba(255,255,255,0.2); }
}

.vcarousel__btn--prev { left: 20px; }
.vcarousel__btn--next { right: 20px; }

/* =========================================
   Адаптив
   ========================================= */

/* Планшет */
@media (max-width: 900px) {
    .vcarousel { padding: 64px 0; }
}

/* Мобиль */
@media (max-width: 600px) {
    .vcarousel { padding: 48px 0; }
    .vcarousel__intro { margin-bottom: 32px; }

    /* Кнопки меньше на мобиле */
    .vcarousel__btn { width: 36px; height: 36px; }
    .vcarousel__btn--prev { left: 8px; }
    .vcarousel__btn--next { right: 8px; }

    /* Карточки чуть выше на мобиле (9:16 → нет, оставим 4:3) */
    .vcarousel__card { aspect-ratio: 4 / 3; border-radius: 14px; }

    @supports not (aspect-ratio: 4 / 3) {
        .vcarousel__card { padding-top: 75%; }
    }
}
