/* 1440 × 224: 112px track at top 24, button at left 48 / top 168. */
.tc-case.tc-case-marquee {
  overflow: hidden;
  padding: calc(24 * var(--u)) 0 calc(23 * var(--u));
  background: var(--tangerine-cream, #fff9f5);
}

.tc-case-marquee .tc-case-marquee__track {
  display: flex;
  width: max-content;
  margin: 0;
  font-size: calc(112 * var(--u));
  line-height: 1.1;
  letter-spacing: -0.06em;
  text-transform: uppercase;
  white-space: pre;
  animation: tc-case-drift var(--tc-marquee-speed, 45s) linear infinite;
  will-change: transform;
}

.tc-case-marquee .tc-case-marquee__track::before,
.tc-case-marquee .tc-case-marquee__track::after {
  content: attr(data-text);
  display: block;
  flex-shrink: 0;
}

.tc-case-marquee--right .tc-case-marquee__track {
  animation-direction: reverse;
}

.tc-case-marquee--pause:hover .tc-case-marquee__track {
  animation-play-state: paused;
}

.tc-case-marquee .tc-case-marquee__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(16 * var(--u));
  margin-top: calc(20.8 * var(--u));
  padding: 0 var(--tc-m);
}

.tc-case-marquee .tc-case-marquee__next:only-child {
  margin-left: auto;
}

@keyframes tc-case-drift {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

@media (max-width: 1024px) {
  .tc-case.tc-case-marquee {
    padding: 24px 0;
  }

  .tc-case-marquee .tc-case-marquee__track {
    font-size: 72px;
  }

  .tc-case-marquee .tc-case-marquee__actions {
    margin-top: 16px;
  }
}

@media (max-width: 767px) {
  .tc-case-marquee .tc-case-marquee__track {
    font-size: 48px;
  }

  /* A tap leaves :hover on. Keep the resting mobile button. */
  body .elementor-widget-tc-case-marquee .tc-case-marquee a.tc-case-btn:is(:hover, :focus-visible, :active) {
    color: var(--tc-btn-color-m, var(--tc-btn-color-def));
  }

  body .elementor-widget-tc-case-marquee .tc-case-marquee a.tc-case-btn:is(:hover, :focus-visible, :active) .tc-case-btn__bg {
    border-color: var(--tc-btn-border-m, var(--tc-btn-border-def));
    background-color: var(--tc-btn-bg-m, var(--tc-btn-bg-def));
    transform: none;
  }

  body .elementor-widget-tc-case-marquee .tc-case-marquee a.tc-case-btn:is(:hover, :focus-visible, :active) .tc-case-btn__icon {
    color: var(--tc-btn-icon-m, currentColor);
  }
}

@media (prefers-reduced-motion: reduce) {
  .tc-case-marquee .tc-case-marquee__track {
    animation: none;
  }
}