.logos { padding: 5rem 0 3rem; }

.logos-title {
  margin: 0 0 2.5rem;
  max-width: 30rem;
  font-size: 1.35rem;
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 1.3;
}

.marquee {
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
}

.marquee-track {
  display: flex;
  width: max-content;
  animation: lane-slide 38s linear infinite;
}

.marquee:hover .marquee-track { animation-play-state: paused; }

.brand {
  flex: none;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-right: 4.5rem;
  color: #8e8e93;
  font-size: 1.35rem;
  white-space: nowrap;
}

.brand svg { width: 22px; height: 22px; }
.brand-a { font-weight: 600; letter-spacing: -0.04em; }
.brand-b { font-family: var(--font-mono); font-size: 1.05rem; }
.brand-c { font-weight: 400; font-style: italic; letter-spacing: -0.02em; }
.brand-d { font-weight: 600; letter-spacing: 0.12em; font-size: 1rem; }

@media (max-width: 760px) {
  .logos { padding: 3.5rem 0 2rem; }
  .logos-title { font-size: 1.15rem; }
  .brand { margin-right: 2.75rem; font-size: 1.1rem; }
}
