/*
 * Texto por Pasos: solo el paso activo muestra su texto; los vecinos muestran una
 * etiqueta (Siguiente/Anterior) con flecha y el resto su título atenuado.
 * El JS (text-stepper.js) agrega las clases is-active / is-near / is-prev / is-next / is-far.
 */
.rb_text_stepper {
	display: flex;
	flex-direction: column;
}

.rb_text_step {
	display: block;
}

/* Botón de navegación de cada paso. */
.rb_text_step__nav {
	display: flex;
	align-items: center;
	gap: 0.4em;
	width: 100%;
	margin: 0;
	padding: 0.25em 0;
	border: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	color: inherit;
	font: inherit;
	text-align: left;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
	opacity: 1;
	transition: opacity 0.3s ease;
}

.rb_text_step__label {
	font-size: clamp(1.6rem, 2.6vw, 2.6rem);
	font-weight: 700;
	line-height: 1.1;
	text-transform: uppercase;
}

.rb_text_step__arrow {
	display: none;
	flex: 0 0 auto;
	width: 1.1em;
	height: 1.1em;
	font-size: clamp(1.6rem, 2.6vw, 2.6rem);
	color: #8b90c6;
}

.rb_text_step__relative {
	display: none;
}

/* Panel con el texto: se despliega animando la altura (0fr → 1fr). */
.rb_text_step__panel {
	display: grid;
	grid-template-rows: 0fr;
	visibility: hidden;
	opacity: 0;
	transition: grid-template-rows 0.45s ease, opacity 0.35s ease, visibility 0s linear 0.45s;
}

.rb_text_step__inner {
	min-height: 0;
	overflow: hidden;
	padding: 0;
	border: 0 solid #8b90c6;
	transition: padding 0.45s ease, border-width 0.45s ease;
}

.rb_text_step__content {
	font-size: 1.05rem;
	line-height: 1.45;
}

.rb_text_step__content > :first-child {
	margin-top: 0;
}

.rb_text_step__content > :last-child {
	margin-bottom: 0;
}

/* Paso activo (antes de que cargue el JS se asume el primero). */
.rb_text_step.is-active > .rb_text_step__panel,
.rb_text_stepper:not(.is-ready):not(.rb_text_stepper--builder) > .rb_text_step:first-child > .rb_text_step__panel {
	grid-template-rows: 1fr;
	visibility: visible;
	opacity: 1;
	transition-delay: 0s;
}

.rb_text_step.is-active > .rb_text_step__nav,
.rb_text_stepper:not(.is-ready):not(.rb_text_stepper--builder) > .rb_text_step:first-child > .rb_text_step__nav {
	display: none;
}

.rb_text_step.is-active:not(:first-child) > .rb_text_step__panel > .rb_text_step__inner {
	padding-top: 1.1em;
	border-top-width: 3px;
}

.rb_text_step.is-active:not(:last-child) > .rb_text_step__panel > .rb_text_step__inner,
.rb_text_stepper:not(.is-ready):not(.rb_text_stepper--builder) > .rb_text_step:first-child:not(:last-child) > .rb_text_step__panel > .rb_text_step__inner {
	padding-bottom: 1.1em;
	border-bottom-width: 3px;
}

/* Pasos vecinos y lejanos. */
.rb_text_step.is-near > .rb_text_step__nav {
	opacity: 0.6;
}

.rb_text_step.is-far > .rb_text_step__nav,
.rb_text_stepper:not(.is-ready):not(.rb_text_stepper--builder) > .rb_text_step:not(:first-child) > .rb_text_step__nav {
	opacity: 0.28;
}

.rb_text_step > .rb_text_step__nav:hover,
.rb_text_step > .rb_text_step__nav:focus-visible {
	opacity: 1;
}

.rb_text_step.is-near > .rb_text_step__nav > .rb_text_step__arrow {
	display: block;
}

.rb_text_step.is-prev > .rb_text_step__nav > .rb_text_step__arrow {
	transform: rotate(180deg);
}

.rb_text_step.has-relative > .rb_text_step__nav .rb_text_step__title {
	display: none;
}

.rb_text_step.has-relative > .rb_text_step__nav .rb_text_step__relative {
	display: inline;
}

/* Visual Builder: todos los pasos abiertos para poder editarlos. */
.rb_text_stepper--builder .rb_text_step__panel {
	grid-template-rows: 1fr;
	visibility: visible;
	opacity: 1;
}

.rb_text_stepper--builder .rb_text_step__nav {
	display: flex;
	opacity: 1;
	cursor: default;
}

.rb_text_stepper--builder .rb_text_step__arrow {
	display: none;
}

.rb_text_stepper--builder .rb_text_step__inner {
	padding: 0 0 1em;
	border-width: 0;
}

@media (prefers-reduced-motion: reduce) {
	.rb_text_step__nav,
	.rb_text_step__panel,
	.rb_text_step__inner {
		transition: none;
	}
}
