/* Container */
    .video-row {
      display: flex;
      gap: 16px;
      overflow-x: auto;
      scroll-snap-type: x mandatory;
      padding: 8px;
      scrollbar-width: none;
    }
    .video-row::-webkit-scrollbar { display: none; }

    /* Card 9:16 */
    .video-card {
      flex: 0 0 calc(25% - 12px); /* 4 per row desktop */
      aspect-ratio: 9 / 16;
      border-radius: 16px;
      overflow: hidden;
      position: relative;
      cursor: pointer;
      scroll-snap-align: start;
      background: #000;
    }
    .video-card img,
    .video-card video {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
    .video-overlay {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      padding: 12px;
      background: linear-gradient(to top, rgba(0,0,0,0.7), transparent);
      color: #fff;
      font-size: 0.9rem;
      font-weight: 600;
      pointer-events: none;
    }

    @media (max-width: 768px) {
      .video-card { flex: 0 0 calc(50% - 12px); } /* 2 per row mobile */
    }

    /* Arrows */
    .carousel-controls { position: relative; }
    .scroll-btn {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      background: rgba(0,0,0,0.6);
      border: none;
      border-radius: 50%;
      padding: 12px;
      cursor: pointer;
      z-index: 10;
    }
    .scroll-btn svg {
      width: 20px;
      height: 20px;
      fill: white;
    }
    .scroll-btn.left { left: -10px; }
    .scroll-btn.right { right: -10px; }