.ts4-wrap{ width:100%; padding:16px 0; font-family: "Bricolage Grotesque", sans-serif; }
.ts4-marquee{ overflow:hidden; cursor:grab; user-select:none; -webkit-user-select:none; }
.ts4-marquee.is-dragging{ cursor:grabbing; }
.ts4-track{
  display:flex;
  gap: var(--ts4-gap, 36px);
  will-change: transform;
  transform: translate3d(0,0,0);
}

/* Card */
.ts4-card{ flex:0 0 auto; width: var(--ts4-cardw, 320px); }

/* Video block */
.ts4-video{
  position:relative;
  display:block;
  height: var(--ts4-imgh, 330px);
  border-radius: var(--ts4-radius, 18px);
  overflow:hidden;
  background:#111;
}
.ts4-thumb{ width:100%; height:100%; object-fit:cover; display:block; }

/* Play icon (optional style placeholder) */
.ts4-play{
  position:absolute; inset:0;
  pointer-events:none;
}

/* Name pill */
.ts4-pill{
  position:absolute; left:14px; bottom:14px;
  background: var(--ts4-pill-bg, #fff);
  border-radius: var(--ts4-radius, 18px);
  padding:10px 12px;
  min-width:190px;
  box-shadow:0 10px 18px rgba(0,0,0,.12);
}
.ts4-name{
  font-weight: var(--ts4-name-weight, 700);
  font-size: var(--ts4-name-size, 13px);
  color: var(--ts4-text, #111);
  line-height:1.1;
}
.ts4-role{
  font-weight:500;
  font-size: var(--ts4-role-size, 12px);
  color:#6b6b6b;
  margin-top:4px;
}

/* Quote bottom */
.ts4-bottom{
  position:relative;
  margin-top:14px;
  background: var(--ts4-card-bg, #fff);
  border-radius: var(--ts4-radius, 18px);
  padding:16px 18px 16px 40px;
}
.ts4-qmark{
  position:absolute; left:16px; top:10px;
  font-size:30px; font-weight:800;
  color: var(--ts4-text, #111);
  line-height:1;
}
.ts4-quote{
  margin:0;
  font-size: var(--ts4-quote-size, 16px);
  font-weight: var(--ts4-quote-weight, 600);
  line-height:1.35;
  color: var(--ts4-text, #111);
}

/* Responsive */
@media (max-width:768px){
  .ts4-card{ width: var(--ts4-cardw-m, 280px); }
  .ts4-video{ height: var(--ts4-imgh-m, 300px); }
}
