/* ============================================================
   03-trust — scoped under .sec-03-trust
   Chip marquee, tilted -2deg on desktop, straightens ≤820px.
   ============================================================ */

.sec-03-trust {
  background: var(--bone);
  padding-block: clamp(2.25rem, 1.6rem + 2vw, 3.25rem);
  border-top: 1px solid var(--line-bone);
  border-bottom: 1px solid var(--line-bone);
  overflow: hidden;
  position: relative;
}

.sec-03-trust__inner {
  width: 100%;
}

.sec-03-trust__marquee {
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, black 8%, black 92%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0%, black 8%, black 92%, transparent 100%);
}

.sec-03-trust__track {
  --marquee-dur: 34s;
  gap: 0.85rem;
  /* Base .marquee__track has a 3rem trailing padding-right (base.css) sized for the
     16-comebacks marquee's wider gap. Here the inter-chip gap is 0.85rem, so the
     untouched 3rem padding read as an oversized gap at the loop seam (last chip of
     one track to the first chip of the next). Override both the padding and the
     matching translateX offset so the seam gap equals the inter-chip gap. */
  padding-right: 0.85rem;
  animation-name: sec-03-trust-marquee-scroll;
}

@keyframes sec-03-trust-marquee-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(calc(-100% - 0.85rem)); }
}

/* --- Pill chips --- */
.sec-03-trust__chip {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  white-space: nowrap;
  background: var(--white);
  border: 1px solid var(--line-bone);
  border-radius: var(--radius-pill);
  box-shadow: var(--shadow-soft);
  padding: 0.55rem 1.1rem;
}

.sec-03-trust__chip--logo {
  /* This was a faux wordmark (display font, 700, larger, small-caps) sitting among
     body-font badge chips, which reads as a font-loading glitch rather than a logo. */
  font-family: var(--font-body);
  font-variant-caps: normal;
  font-weight: 600;
  font-size: 0.85rem;
  letter-spacing: 0.02em;
  color: var(--text-on-bone);
}

.sec-03-trust__chip--badge {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 0.85rem;
  color: var(--text-on-bone);
}

.sec-03-trust__icon {
  width: 15px;
  height: 15px;
  fill: var(--accent);
  flex-shrink: 0;
}
.sec-03-trust__icon--star {
  fill: var(--ember);
}

/* --- Accent star-cluster flourish between chips --- */
.sec-03-trust__stars {
  font-size: 0.75rem;
  letter-spacing: 0.12em;
  color: var(--ember);
  padding-inline: 0.15rem;
}

@media (max-width: 820px) {
  .sec-03-trust__marquee {
    transform: none;
  }
}

@media (max-width: 640px) {
  .sec-03-trust__chip--logo {
    font-size: 0.92rem;
  }
  .sec-03-trust__chip--badge {
    font-size: 0.85rem;
  }
  .sec-03-trust__chip {
    padding: 0.5rem 0.9rem;
  }
}
