/* Marquee — infinite scrolling band (KEREM marquee). */
.cc_oe6aXTYiT2_YwlhNrTymN .marquee {
  width: 100%;
  max-width: 100%;
  /* min-width:0 stops the wide inline-flex track from pushing the section past
     the viewport when it sits in a flex/grid parent (the editor does this). */
  min-width: 0;
  overflow: hidden;
  border-block: 1px solid var(--mq-border, var(--ink));
  background: var(--paper);
}

/* Inner clip layer — guarantees the wide track is cut to the section width even
   when the section sits in a flex/grid cell that ignores the outer clip. */
.cc_oe6aXTYiT2_YwlhNrTymN .marquee__viewport {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
}

.cc_oe6aXTYiT2_YwlhNrTymN .marquee__track {
  display: flex;
  width: max-content;
  align-items: center;
  white-space: nowrap;
  will-change: transform;
  animation: cc_oe6aXTYiT2_YwlhNrTymN_mq-scroll linear infinite;
}

/* aria-hidden second copy — kept identical so the -50% wrap is seamless */
.cc_oe6aXTYiT2_YwlhNrTymN .marquee__dupe {
  display: inline-flex;
  align-items: center;
}

.cc_oe6aXTYiT2_YwlhNrTymN .marquee__item {
  display: inline-flex;
  align-items: center;
  gap: 28px;
  padding: 18px 28px;
  font-family: var(--display);
  font-weight: 600;
  font-size: clamp(28px, 4vw, 56px);
  letter-spacing: -0.01em;
  line-height: 1;
  color: var(--mq-ink, var(--ink));
  text-decoration: none;
  transition: color 0.3s var(--ease);
}
/* Hover-freeze: the band stops, the phrase under the pointer takes the accent and
   leans toward the cursor, and everything else recedes — so one word owns the row.
   The lean is a CSS transition on --mq-tilt (set by JS), never a per-frame write. */
.cc_oe6aXTYiT2_YwlhNrTymN .marquee--tiltable .marquee__item {
  transform: rotate(var(--mq-tilt, 0deg));
  transform-origin: center;
  transition: color 0.3s var(--ease), opacity 0.3s var(--ease), transform 0.45s var(--ease);
}
.cc_oe6aXTYiT2_YwlhNrTymN .marquee--dimmable .marquee__viewport:hover .marquee__item {
  opacity: 0.32;
}
.cc_oe6aXTYiT2_YwlhNrTymN .marquee--dimmable .marquee__viewport:hover .marquee__item:hover {
  opacity: 1;
}
.cc_oe6aXTYiT2_YwlhNrTymN .marquee__item:hover, .cc_oe6aXTYiT2_YwlhNrTymN a.marquee__item:hover {
  color: var(--mq-hover, var(--mq-sep, var(--accent)));
}

.cc_oe6aXTYiT2_YwlhNrTymN .marquee__sep {
  color: var(--mq-sep, var(--accent));
  font-size: 0.6em;
}

@keyframes cc_oe6aXTYiT2_YwlhNrTymN_mq-scroll {
  to {
    transform: translateX(-50%);
  }
}

/* Pause on hover (opt-in) */
.cc_oe6aXTYiT2_YwlhNrTymN .marquee--pausable:hover .marquee__track {
  animation-play-state: paused;
}

/* Respect reduced-motion — hold still */
@media (prefers-reduced-motion: reduce) {
  .cc_oe6aXTYiT2_YwlhNrTymN .marquee__track {
    animation: none;
  }
  .cc_oe6aXTYiT2_YwlhNrTymN .marquee--tiltable .marquee__item {
    transform: none;
  }
}

/* --- Empty state --- */
.cc_oe6aXTYiT2_YwlhNrTymN .marquee--empty {
  display: grid;
  place-items: center;
  padding: 22px var(--gutter);
}
.cc_oe6aXTYiT2_YwlhNrTymN .marquee__empty {
  margin: 0;
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-3);
}