/* ============================================================
   clients.css — Clients section
   ============================================================ */

.clients {
  background-color: var(--color-bg-primary);
}

.clients__marquee-wrapper {
  overflow: hidden;
  margin-top: var(--space-8);
  padding: var(--space-3) 0;
  /* Fade edges */
  -webkit-mask-image: linear-gradient(
    to right,
    transparent 0%,
    black 8%,
    black 92%,
    transparent 100%
  );
  mask-image: linear-gradient(
    to right,
    transparent 0%,
    black 8%,
    black 92%,
    transparent 100%
  );
}

.clients__track {
  display: flex;
  width: max-content;
  gap: var(--space-3);
  align-items: center;
}

/* ── Client chip ── */
.client-chip {
  display: inline-flex;
  align-items: center;
  padding: 10px 20px;
  background: var(--glass-bg);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-full);
  font-size: var(--text-sm);
  font-weight: 500;
  color: var(--color-text-secondary);
  white-space: nowrap;
  transition: color var(--transition-fast), border-color var(--transition-fast), background var(--transition-fast);
  backdrop-filter: var(--glass-blur);
  -webkit-backdrop-filter: var(--glass-blur);
}

.clients__track:hover .client-chip {
  /* On hover of track, don't change individual chips */
}

.client-chip:hover {
  color: var(--color-text-primary);
  border-color: rgba(79, 142, 247, 0.3);
  background: var(--glass-bg-hover);
}