/**
 * Horizontal profile strip — Bumble-like social proof row
 */
.profile-strip {
  margin-top: var(--space-10);
}

.profile-strip__track {
  display: flex;
  gap: var(--space-4);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-bottom: var(--space-2);
  margin-inline: calc(var(--space-4) * -1);
  padding-inline: var(--space-4);
  scrollbar-width: thin;
}

.profile-strip__track::-webkit-scrollbar {
  height: 6px;
}

.profile-strip__track::-webkit-scrollbar-thumb {
  background: var(--color-line-strong);
  border-radius: 999px;
}

.profile-strip__track[data-carousel]::-webkit-scrollbar {
  display: none;
}

.profile-strip__track[data-carousel] {
  scrollbar-width: none;
}

#community:has(.profile-strip__track[data-carousel]) {
  cursor: ew-resize;
}

#community .profile-strip__track[data-carousel]:hover {
  cursor: default;
}

.profile-chip {
  flex: 0 0 auto;
  scroll-snap-align: start;
  width: 200px;
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--color-bg-elevated);
  border: 1px solid var(--color-line);
  transition: transform 0.3s var(--ease-out), border-color 0.3s var(--ease-out);
  /* After hydration each chip is wrapped in <a>; kill the browser-default
     underline so it never bleeds onto the name / meta inside. */
  color: inherit;
  text-decoration: none;
}

.profile-chip,
.profile-chip *,
.profile-chip:hover,
.profile-chip:hover * {
  text-decoration: none !important;
}

.profile-chip:hover {
  transform: translateY(-3px);
  border-color: var(--color-line-strong);
}

@media (prefers-reduced-motion: reduce) {
  .profile-chip:hover {
    transform: none;
  }
}

.profile-chip__photo {
  aspect-ratio: 4/5;
  object-fit: cover;
  /* Keep faces in frame: default center crop often cuts heads on portrait shots */
  object-position: center 18%;
  width: 100%;
}

.profile-chip__body {
  padding: var(--space-4) var(--space-4) var(--space-5);
  text-align: center;
}

.profile-chip__name {
  margin: 0 0 4px;
  font-family: var(--font-heading);
  font-weight: 300;
  font-style: normal;
  font-size: 1.25rem;
  line-height: 1.15;
  letter-spacing: -0.005em;
  color: var(--color-ink);
}

.profile-chip__meta {
  margin: 0;
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: 0.8125rem;
  letter-spacing: 0.02em;
  color: var(--color-ink-soft);
}
