/* ESTB Pestañas Valores v1.0.0 */
.estb-vt {
	--estb-vt-list-w: 43%;
	--estb-vt-gap: 24px;
	--estb-vt-line: #E8E9E4;
	--estb-vt-dur: 350ms;
	--estb-vt-icon-move: 4px;
	--estb-vt-dash: rgba(201, 217, 221, .35);
	--estb-vt-dash-active: #E1464E;
	--estb-vt-dash-w: 16px;
	--estb-vt-dash-w-active: 40px;
	--estb-vt-speed: 6000ms;
	display: flex;
	flex-direction: row;
	align-items: stretch;
	gap: var(--estb-vt-gap);
	color: #123A4A;
}

/* ---------- Lista ---------- */
.estb-vt__list {
	flex: var(--estb-vt-list-flex, 0 0 var(--estb-vt-list-w));
	max-width: var(--estb-vt-list-max, var(--estb-vt-list-w));
	box-sizing: border-box;
	min-width: 0;
	display: flex;
	flex-direction: column;
	border-top: 1px solid var(--estb-vt-line);
}

.estb-vt .estb-vt__tab {
	all: unset;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	gap: 18px;
	width: 100%;
	min-height: 96px;
	padding: 18px 28px 18px 24px;
	border-bottom: 1px solid var(--estb-vt-line);
	background-color: transparent;
	color: #123A4A;
	text-align: left;
	cursor: pointer;
	font-family: inherit;
	transition: background-color var(--estb-vt-dur) ease;
}
.estb-vt .estb-vt__tab:hover { background-color: rgba(201, 217, 221, .35); }
.estb-vt .estb-vt__tab.is-active { background-color: #C9D9DD; }
.estb-vt .estb-vt__tab:focus-visible { outline: 2px solid #E1464E; outline-offset: -2px; }

.estb-vt__tab-num {
	flex: 0 0 auto;
	min-width: 32px;
	font-size: 15px;
	color: #4C6670;
	font-variant-numeric: tabular-nums;
}
.estb-vt__tab-texts {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.estb-vt__tab-title {
	font-size: 26px;
	font-weight: 600;
	line-height: 1.15;
	color: #123A4A;
}
.estb-vt__tab-sub {
	font-size: 15px;
	line-height: 1.3;
	color: #2E4D59;
}
.estb-vt__tab-icon {
	flex: 0 0 auto;
	display: inline-flex;
	color: #123A4A;
	transition: transform var(--estb-vt-dur) ease;
}
.estb-vt__tab-icon svg { width: 18px; height: 18px; display: block; }
.estb-vt .estb-vt__tab:hover .estb-vt__tab-icon,
.estb-vt .estb-vt__tab.is-active .estb-vt__tab-icon { transform: translateX(var(--estb-vt-icon-move)); }

/* ---------- Panel ---------- */
.estb-vt__panel-wrap {
	position: relative;
	flex: var(--estb-vt-panel-flex, 1 1 0);
	min-width: 0;
	min-height: 440px;
	display: grid;
	background-color: #1E3A4A;
	color: #FFFFFF;
	border-radius: 4px;
	overflow: hidden;
}
/* Todos los paneles ocupan la misma celda: el alto lo marca el más largo, sin saltos al cambiar */
.estb-vt__panel {
	grid-area: 1 / 1;
	position: relative;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 32px;
	padding: 56px 60px;
	opacity: 1;
	transition: opacity var(--estb-vt-dur) ease, transform var(--estb-vt-dur) ease;
}
.estb-vt .estb-vt__panel[hidden] { display: flex !important; visibility: hidden; opacity: 0; transform: translateY(8px); pointer-events: none; }
.estb-vt__panel:focus-visible { outline: 2px solid #E1464E; outline-offset: -4px; }

.estb-vt__wm {
	position: absolute;
	top: 24px;
	right: 40px;
	font-size: 300px;
	font-weight: 800;
	line-height: .85;
	letter-spacing: -.04em;
	color: rgba(201, 217, 221, .08);
	pointer-events: none;
	user-select: none;
}

.estb-vt__dashes { position: relative; display: flex; gap: 8px; align-items: center; }
.estb-vt__dash {
	display: block;
	width: var(--estb-vt-dash-w);
	height: 4px;
	border-radius: 2px;
	background: var(--estb-vt-dash);
	transition: width var(--estb-vt-dur) ease, background-color var(--estb-vt-dur) ease;
	overflow: hidden;
	position: relative;
}
.estb-vt__dash.is-active { width: var(--estb-vt-dash-w-active); background: var(--estb-vt-dash-active); }

/* Avance automático: la raya activa se rellena como barra de progreso */
.estb-vt.is-autoplay.is-running .estb-vt__panel:not([hidden]) .estb-vt__dash.is-active { background: var(--estb-vt-dash); }
.estb-vt.is-autoplay.is-running .estb-vt__panel:not([hidden]) .estb-vt__dash.is-active::after {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--estb-vt-dash-active);
	transform-origin: left center;
	animation: estb-vt-progress var(--estb-vt-speed) linear forwards;
}
.estb-vt.is-autoplay.is-paused .estb-vt__dash.is-active::after { animation-play-state: paused; }
@keyframes estb-vt-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }

.estb-vt__p-body { position: relative; max-width: 640px; }
.estb-vt__p-title {
	margin: 0 0 12px;
	font-size: 60px;
	line-height: 1.02;
	font-weight: 700;
	letter-spacing: -.01em;
	color: #FFFFFF;
}
.estb-vt__p-kicker {
	margin: 0 0 28px;
	font-size: 22px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: #E1464E;
}
.estb-vt__p-text {
	margin: 0 0 22px;
	font-size: 28px;
	line-height: 1.45;
	color: #FFFFFF;
}
.estb-vt__p-text-en {
	margin: 0;
	font-size: 18px;
	line-height: 1.55;
	color: #C9D9DD;
}

/* ---------- Apilado (móvil por defecto) ---------- */
@media (max-width: 767px) {
	.estb-vt { flex-direction: column; }
	.estb-vt__list { flex: 0 0 auto; max-width: 100%; width: 100%; }
	.estb-vt__panel-wrap { flex: 0 0 auto; width: 100%; }
	.estb-vt .estb-vt__tab { min-height: 72px; padding: 14px 16px; }
	.estb-vt__tab-title { font-size: 20px; }
	.estb-vt__tab-sub { font-size: 13px; }
	.estb-vt__panel-wrap { min-height: 0; }
	.estb-vt__panel { padding: 32px 24px; }
	.estb-vt__wm { font-size: 160px; right: 16px; }
	.estb-vt__p-title { font-size: 36px; }
	.estb-vt__p-kicker { font-size: 15px; margin-bottom: 18px; }
	.estb-vt__p-text { font-size: 19px; }
	.estb-vt__p-text-en { font-size: 15px; }
}

@media (prefers-reduced-motion: reduce) {
	.estb-vt__panel, .estb-vt__dash, .estb-vt__tab, .estb-vt__tab-icon { transition: none !important; }
	.estb-vt.is-autoplay .estb-vt__dash.is-active::after { animation: none !important; transform: scaleX(1); }
}
