/* ============================================
   TRUST BADGES (COMPACT BAR)
   Same as trust-badges, but with the nav-
   clearance top padding stripped and the top
   indicator line removed. The section starts
   flush at the badges and ends with the bottom
   divider line so it can stack against any
   section below.
   ============================================ */

.rtbgs {
  overflow: hidden;
  /* No nav-clearance padding — this variant assumes
     it's stacking below a hero or other section that
     already establishes its own top spacing. */
  padding-top: 0;
  padding-bottom: 0;
}

.rtbgs__inner {
  /* Top border removed — the "indicator" line is gone.
     Bottom border kept as a quiet visual demarcation
     against whatever follows. */
  border-bottom: 1px solid var(--clr-border-light);
  /* Compact banner strip — tight padding so the band
     reads as a quiet horizontal strip rather than a
     full content section. */
  padding: var(--space-md) 0;
}

/* ─── Trust row — mobile is a continuous auto-scroll marquee.
   Items + a duplicated set scroll left in a seamless loop so the
   band reads as a quiet ambient element rather than a scroller
   that needs interaction. Pauses on hover/focus and disables under
   prefers-reduced-motion. Tablet+ reverts to the centered wrap. ─── */
.rtbgs__row {
  display: flex;
  overflow: hidden;
}

.rtbgs__track {
  display: flex;
  align-items: center;
  gap: var(--space-xl);
  width: max-content;
  /* Translate by 50% — the second half (clones) lands exactly where
     the first half started, producing a seamless loop. */
  animation: rtbgs-marquee 30s linear infinite;
}

.rtbgs__row:hover .rtbgs__track,
.rtbgs__row:focus-within .rtbgs__track {
  animation-play-state: paused;
}

.rtbgs__clones {
  display: flex;
  align-items: center;
  gap: var(--space-xl);
  /* Match the gap before the clones so spacing stays even */
  margin-left: var(--space-xl);
}

@keyframes rtbgs-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

.rtbgs__item {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

/* Tablet+: disable marquee, hide clones, restore wrap layout. */
@media (min-width: 768px) {
  .rtbgs__row {
    overflow: visible;
  }

  .rtbgs__track {
    animation: none;
    width: 100%;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    gap: var(--space-xl) var(--space-3xl);
  }

  .rtbgs__clones {
    display: none;
  }

  .rtbgs__item {
    align-items: flex-start;
    gap: 12px;
    flex-shrink: 1;
  }
}

/* Reduced motion: disable the marquee entirely; user can still see
   the original (non-cloned) set of items, no auto-scroll. */
@media (prefers-reduced-motion: reduce) {
  .rtbgs__track {
    animation: none;
  }
  .rtbgs__clones {
    display: none;
  }
}

.rtbgs__icon {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  /* Lighter olive — design guide §4 "mid olive secondary accent" —
     so the band reads as quiet supporting content, not headline. */
  color: var(--clr-brand-alt);
  margin-top: 1px;
}

.rtbgs__icon svg {
  width: 24px;
  height: 24px;
  display: block;
}

.rtbgs__icon-img {
  width: 24px;
  height: 24px;
  object-fit: contain;
  display: block;
}

.rtbgs__text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.rtbgs__title {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--clr-brand-alt);
  line-height: 1.35;
}

.rtbgs__subtitle {
  display: block;
  font-size: 10px;
  font-weight: 400;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  line-height: 1.5;
  color: var(--clr-text-muted);
  margin-top: 2px;
}

/* ─── Dark variant ───────────────────────────────────────── */
.rtbgs.bg-accent-dark .rtbgs__inner {
  border-color: rgba(253, 252, 250, 0.15);
}

.rtbgs.bg-accent-dark .rtbgs__title {
  color: var(--clr-text-inverse);
}

.rtbgs.bg-accent-dark .rtbgs__subtitle {
  color: var(--clr-text-inverse);
  opacity: 0.7;
}

.rtbgs.bg-accent-dark .rtbgs__icon {
  color: var(--clr-brand-accent);
}
