/* Shared preview height (Tailwind h-64 / md:h-80; Bootstrap has no matching rem height utilities). */
.duo-feature-cover {
  height: 16rem;
}

@media (min-width: 768px) {
  .duo-feature-cover {
    height: 20rem;
  }
}

/* Horizontal strip: flex + gap + animation (layout/motion only; no colors). */
.ticker-ribbon-shell {
  overflow: hidden;
  width: 100%;
}

.ticker-ribbon-track {
  display: flex;
  gap: 1rem;
  width: fit-content;
  animation: ticker-ribbon-flow-kf 30s linear infinite;
}

.ticker-ribbon-track:hover {
  animation-play-state: paused;
}

@keyframes ticker-ribbon-flow-kf {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

/* Tailwind min-w-[280px] max-w-[320px] — Bootstrap has no arbitrary width utilities. */
.ticker-ribbon-card {
  flex-shrink: 0;
  min-width: 280px;
  max-width: 320px;
}