/**
 * Simó Lorenzo Kit — Decisiones.
 *
 * Tarjetas de opción con un círculo entre ellas. La dirección (fila / apiladas)
 * llega por dispositivo en --slk-dec-dir; las tarjetas miden lo mismo.
 */

.slk-dec {
	--slk-dec-dir: row;
	--slk-dec-gap: 20px;
	--slk-dec-sep-size: 48px;

	display: flex;
	flex-direction: var(--slk-dec-dir);
	align-items: stretch;
	gap: var(--slk-dec-gap);
}

.slk-dec__card {
	display: flex;
	flex: 1 1 0;
	flex-direction: column;
	justify-content: flex-start;
	box-sizing: border-box;
	min-width: 0;
	padding: 40px 36px;
	border-radius: 34px;
	background: #fff;
}

.slk-dec__title {
	margin: 0 0 16px;
	padding: 0;
	line-height: 1.1;
	text-wrap: balance;
}

.slk-dec__highlight {
	font-style: italic;
}

.slk-dec__desc {
	margin: 0;
	text-wrap: pretty;
}

.slk-dec__title:last-child {
	margin-bottom: 0;
}

/* Círculo entre opciones: centrado entre las tarjetas, en fila o apiladas. */
.slk-dec__sep {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	align-self: center;
	box-sizing: border-box;
	width: var(--slk-dec-sep-size);
	height: var(--slk-dec-sep-size);
	border: 1.5px solid currentColor;
	border-radius: 50%;
	font-size: calc(var(--slk-dec-sep-size) * 0.32);
	font-style: italic;
	font-weight: 800;
	line-height: 1;
	white-space: nowrap;
}
