:root{
    /* База ≈1680 */
    --slide-w: 40vw;
    --track-gap: clamp(76px, 6.2vw, 140px);  /* ≈118px для 1680 */
    --card-scale: 1.30;
    --text-nudge-x: -0.1rem;
    --edge-pad: clamp(40px, 4.5vw, 84px);
  }

  .swiper{ overflow: visible; padding-inline: var(--edge-pad); }
  .swiper-wrapper{ gap: var(--track-gap); }

  .swiper-slide{
    flex:0 0 auto;
    width:var(--slide-w);
    position:relative;
    z-index:1;
    overflow:visible;
  }

  .video-card-wrapper{
    display:flex;
    flex-direction:column;
    gap:10px;
    transform-origin:center;
    transition:transform .45s ease, z-index .45s ease;
    will-change:transform;
  }
  .swiper-slide-active{ z-index:5; }
  .swiper-slide-active .video-card-wrapper{ transform:scale(var(--card-scale)); }

 /* Контейнер медиа */
.video-media{
  position: relative;
  z-index: 1;
}

/* Только пока медиа не загрузилось */
.video-media.is-loading{
  min-height: 200px;      /* резерв высоты */
  background: transparent;/* без чёрной подложки */
}

/* Медиа внутри */
.video-media img,
.video-media video{
  display: block;
  width: 100%;
  height: auto;           /* не тянем по высоте, без письма */
  object-fit: cover;      /* можно оставить; не мешает при height:auto */
}

  /* подписи — стабильный размер 16px + компенсация масштаба у активной */
  .video-text{
    position:relative;
    z-index:10;
    font-size:16px;
    line-height:1.4;
  }
  .swiper-slide-active .video-text{
    transform: translateX(var(--text-nudge-x)) scale(calc(1 / var(--card-scale)));
    transform-origin:left top;
  }

  .video-card-wrapper, .video-media, .video-text{ backface-visibility:hidden; }

  /* ===== БРЕЙКПОИНТЫ ПО ТВОИМ ПОЖЕЛАНИЯМ ===== */

  /* 1920+: ~136px */
  @media (min-width: 1880px){
    :root{
      --track-gap: clamp(84px, 7vw, 136px);
      --edge-pad: clamp(48px, 5vw, 96px);
    }
  }
  
    /* 1680–1919 → ~118px */
  @media (min-width: 1680px) and (max-width: 1919.98px){
    :root{
      --track-gap: clamp(32px, 7vw, 118px);  /* 1680×7.0% ≈ 117.6 */
      --edge-pad: clamp(36px, 3.6vw, 68px);
    }
  }

  /* 1440–1679: ~104px */
  @media (max-width: 1679px){
    :root{
      --track-gap: clamp(72px, 6.8vw, 104px);
      --edge-pad: clamp(36px, 4.8vw, 88px);
    }
  }

  /* 1280–1439: ~92px */
  @media (max-width: 1439px){
    :root{
      --track-gap: clamp(32px, 7.6vw, 98px);
      --edge-pad: clamp(30px, 4.2vw, 76px);
    }
  }

  /* 1024–1279: ~58px */
  @media (max-width: 1279px){
    :root{
      --track-gap: clamp(28px, 6.5vw, 64px);
      --edge-pad: clamp(24px, 5vw, 64px);
    }
  }

  /* ≤768: ~78px + увеличиваем активную карточку, ширина карточки побольше */
  @media (max-width: 768px){
    :root{
      --slide-w: 82vw;
      --card-scale: 1.2;                      /* центральная больше */
      --track-gap: clamp(48px, 8vw, 78px);     /* ≈78px на 768 */
      --edge-pad: clamp(16px, 6vw, 36px);
    }
  }

  /* ≤412: фиксированный gap ~62px и ещё чуть масштаб активной */
  @media (max-width: 412px){
    :root{
      --slide-w: 64vw;
      --card-scale: 1.36;
      --track-gap: 56px;
      --edge-pad: clamp(12px, 8vw, 32px);
    }
  }
