/* Container: hide overflow and keep single line */
.marquee-scroll-wrap {
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  -webkit-font-smoothing: antialiased; /* nicer text on WebKit */
  -moz-osx-font-smoothing: grayscale;  /* nicer text on macOS */
}

/* Track: horizontal flow with spacing and smooth transform */
.marquee-scroll-track {
  display: inline-flex;
  align-items: center;             /* vertical centering */
  will-change: transform;          /* hint for smoother animation */
  gap: var(--ms-gap, 60px);        /* space between repeated items */
}

/* Item: no internal wrapping, consistent line height */
.marquee-scroll-item {
  display: inline-block;
  white-space: nowrap;             /* do not wrap inside item */
  padding-right: 0;                /* spacing handled by gap */
  line-height: 1.2;                /* avoid vertical jitter */
}

/* Optional: reduce motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
  .marquee-scroll-track {
    transition: none !important;
    animation: none !important;
    will-change: auto;
  }
}

/* Optional: better defaults for RTL (if direction switched dynamically) */
[dir="rtl"] .marquee-scroll-wrap {
  direction: rtl;                  /* allow natural RTL flow if needed */
}