.custom-video-card {
              position: relative;
              border-radius: 16px;
              overflow: hidden;
              background: #fff;
              flex: 0 0 280px;
              cursor: pointer;
              display: flex;
              flex-direction: column;
              transition: transform 0.3s ease;
            }
            .custom-video-card:hover {
              transform: translateY(-4px);
            }
            .custom-video-card:hover .video-cover-img {
              transform: scale(1.04);
            }
            .custom-video-card:hover .play-btn-overlay {
              transform: scale(1.1);
            }
            /* Thumbnail section */
            .video-thumbnail-wrap {
              position: relative;
              width: 100%;
              aspect-ratio: 16/9;
              overflow: hidden;
              background: #000;
              flex-shrink: 0;
            }
            .video-cover-img {
              position: absolute;
              inset: 0;
              width: 100%;
              height: 100%;
              object-fit: cover;
              transition: transform 0.5s ease;
            }
            .custom-video-card.is-playing .video-cover-img,
            .custom-video-card.is-playing .play-btn-overlay {
              opacity: 0;
              pointer-events: none;
            }
            .custom-video-card.is-playing video {
              opacity: 1 !important;
              z-index: 5 !important;
            }
            /* Info section below image */
            .video-info-wrap {
              padding: 12px 14px 14px;
              display: flex;
              flex-direction: column;
              gap: 8px;
              background: #f6f6f6;
              flex: 1;
            }
            .video-text-content {
              display: flex;
              flex-direction: column;
              gap: 3px;
            }
            .video-text-content h3 {
              font-size: 14px;
              font-weight: 700;
              margin: 0;
              line-height: 1.4;
              color: #111;
              display: -webkit-box;
              -webkit-line-clamp: 2;
              -webkit-box-orient: vertical;
              overflow: hidden;
            }
            .video-text-content p {
              font-size: 12px;
              color: #888;
              margin: 0;
            }
            .video-channel-row {
              display: flex;
              align-items: center;
              gap: 8px;
              margin-top: 2px;
            }
            .video-kol-avatar {
              width: 24px;
              height: 24px;
              border-radius: 50%;
              object-fit: cover;
              flex-shrink: 0;
            }
            .video-channel-name {
              font-size: 12px;
              color: #555;
              font-weight: 500;
              white-space: nowrap;
              overflow: hidden;
              text-overflow: ellipsis;
            }
            @media (max-width: 768px) {
              .custom-video-card {
                flex: 0 0 240px;
              }
            }