/* -----------------------------------------
   Soulmix - Sección "¿Por qué trabajar con Soulmix?" (carrusel)
   ----------------------------------------- */

.why {
	padding: clamp(120px, calc(120 / 1920 * 100vw), 168px) 0;
	overflow: hidden;
}

.why__head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	padding-left: clamp(340px, calc(340 / 1920 * 100vw), 476px);
	padding-right: clamp(48px, calc(48 / 1920 * 100vw), 67px);
}

.why__title {
	font-family: var(--font-condensed);
	font-weight: 900;
	font-size: clamp(96px, calc(96 / 1920 * 100vw), 134px);
	line-height: 0.94;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	max-width: clamp(700px, calc(700 / 1920 * 100vw), 980px);
}

.why__nav {
	display: flex;
	gap: clamp(16px, calc(16 / 1920 * 100vw), 22px);
	flex-shrink: 0;
	margin-left: clamp(24px, calc(24 / 1920 * 100vw), 34px);
}

.why__nav-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: clamp(56px, calc(56 / 1920 * 100vw), 78px);
	height: clamp(56px, calc(56 / 1920 * 100vw), 78px);
	border-radius: 50%;
	border: 2px solid #363633;
	background: transparent;
	cursor: pointer;
	padding: 0;
	transition: opacity 0.2s ease;
}

.why__nav-btn:hover {
	opacity: 0.85;
}

.why__nav-btn img {
	width: clamp(26px, calc(26 / 1920 * 100vw), 36px);
	height: clamp(26px, calc(26 / 1920 * 100vw), 36px);
}

.why__nav-btn--next img {
	transform: scaleX(-1);
}

.why__track-wrap {
	margin-top: clamp(64px, calc(64 / 1920 * 100vw), 90px);
	padding-left: clamp(340px, calc(340 / 1920 * 100vw), 476px);
	overflow: hidden;
}

.why__track {
	display: flex;
	gap: clamp(24px, calc(24 / 1920 * 100vw), 34px);
	will-change: transform;
	transition: transform 0.5s ease;
	cursor: grab;
	touch-action: pan-y;
	user-select: none;
}

.why__track.is-dragging {
	cursor: grabbing;
}

.why-card {
	display: flex;
	flex-direction: column;
	flex: 0 0 clamp(400px, calc(400 / 1920 * 100vw), 560px);
	background-color: #363633;
	border-radius: clamp(20px, calc(20 / 1920 * 100vw), 28px);
	padding: clamp(32px, calc(32 / 1920 * 100vw), 45px);
}

.why-card__head {
	display: flex;
	align-items: center;
	gap: clamp(20px, calc(20 / 1920 * 100vw), 28px);
	min-height: clamp(68px, calc(68 / 1920 * 100vw), 95px);
}

.why-card__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: clamp(56px, calc(56 / 1920 * 100vw), 78px);
	height: clamp(56px, calc(56 / 1920 * 100vw), 78px);
	border-radius: 50%;
	background-color: var(--color-btn-primary);
}

.why-card__icon img {
	width: clamp(23px, calc(23 / 1920 * 100vw), 32px);
	height: clamp(23px, calc(23 / 1920 * 100vw), 32px);
}

.why-card__title {
	font-family: var(--font-condensed);
	font-weight: 900;
	font-size: clamp(32px, calc(32 / 1920 * 100vw), 45px);
	line-height: 1.05;
	text-transform: uppercase;
	color: #FAF9F2;
}

.why-card__text {
	font-family: var(--font-condensed);
	font-weight: 400;
	font-size: clamp(24px, calc(24 / 1920 * 100vw), 34px);
	line-height: normal;
	color: #FAF9F2;
	padding-top: clamp(88px, calc(88 / 1920 * 100vw), 123px);
}