/* ampeco/tw-people-carousel — residual CSS only.
   Everything static (layout, dimensions, colour, typography, responsive) now lives
   as Tailwind utilities in render.php (DS values via theme-generated `var(--…)`
   custom props). What's left here can't be a utility: JS-toggled state selectors
   and the pinned-mode variant. All values are theme-generated custom props. */

/* JS-toggled drag state (view.js adds .is-dragging during a pointer drag). */
.tw-people__track.is-dragging {
	cursor: grabbing;
	transition: none;
}

/* JS-toggled active dot (view.js moves .is-active as slides change). */
.tw-people__dot.is-active {
	background: var(--color-bg-brand);
}

/* Pinned (static) mode — no carousel chrome; cards wrap, centred. */
.tw-people--pinned .tw-people__track {
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--spacing-7xl) var(--spacing-5xl);
	padding: 0 var(--spacing-5xl);
	transition: none;
	cursor: default;
}