/*
 * videoteca.css — /videoteca/ (plantilla idi-videoteca.php, 2026-11-09).
 *
 * Va sobre idi.css y el tema (idit-main, idit-container). Sin colores escritos:
 * todo sale de los tokens --idi-* que deriva Paleta.php; los únicos colores
 * propios son los de cada área, que llegan en --vt-area desde la plantilla
 * (idi_theme_colores_categorias()).
 */

.idi-vt {
	--vt-radio: 1.25rem;
	--vt-sombra: 0 1px 2px rgb(var(--idi-texto-rgb, 31 41 51) / .06), 0 8px 24px -12px rgb(var(--idi-texto-rgb, 31 41 51) / .18);
	color: rgb(var(--idi-texto-rgb, 31 41 51));
}

.idi-vt-sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.idi-vt [hidden],
.idi-vt-modal [hidden] { display: none !important; }

/* ---------- Botones ---------- */

.idi-vt-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	min-height: 44px;
	padding: .625rem 1.25rem;
	border: 0;
	border-radius: 1rem;
	font: inherit;
	font-size: .9375rem;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: background-color .15s ease, box-shadow .15s ease, color .15s ease;
}

.idi-vt-btn--primary {
	background: rgb(var(--idi-cta-rgb, 244 206 70));
	color: rgb(var(--idi-sobre-cta-rgb, 31 41 51));
}

.idi-vt-btn--primary:hover { background: rgb(var(--idi-cta-hover-rgb, 205 173 59)); }

.idi-vt-btn--ghost {
	background: rgb(var(--idi-fondo-rgb, 255 255 255));
	color: rgb(var(--idi-texto-rgb, 31 41 51));
	box-shadow: inset 0 0 0 1.5px rgb(var(--idi-borde-control-rgb, 144 149 154));
}

.idi-vt-btn--ghost:hover {
	background: rgb(var(--idi-acento-tenue-rgb, 234 239 244));
	box-shadow: inset 0 0 0 1.5px rgb(var(--idi-acento-rgb, 45 91 141));
}

.idi-vt-btn--small {
	min-height: 40px;
	padding: .5rem 1rem;
	font-size: .875rem;
	border-radius: .875rem;
}

.idi-vt-btn__icon { flex: none; }

.idi-vt-btn:focus-visible,
.idi-vt-chip:focus-visible,
.idi-vt-atajo:focus-visible,
.idi-vt-link:focus-visible,
.idi-vt-modal__cerrar:focus-visible,
.idi-vt-buscar__limpiar:focus-visible {
	outline: 3px solid rgb(var(--idi-acento-rgb, 45 91 141));
	outline-offset: 2px;
}

/* ---------- Portada ---------- */

.idi-vt-hero {
	display: grid;
	gap: 2rem;
	align-items: center;
	padding-bottom: 2.5rem;
}

@media (min-width: 1024px) {
	.idi-vt-hero {
		grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
		gap: 3.5rem;
		padding-bottom: 3rem;
	}
}

.idi-vt-eyebrow {
	margin: 0 0 .75rem;
	font-size: .8125rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: rgb(var(--idi-acento-texto-rgb, 45 91 141));
}

.idi-vt-hero__title {
	margin: 0 0 1rem;
	font-size: clamp(2rem, 4.2vw, 3.25rem);
	font-weight: 800;
	line-height: 1.08;
	letter-spacing: -.02em;
	text-wrap: balance;
}

.idi-vt-hero__lead {
	margin: 0 0 1.5rem;
	max-width: 36rem;
	font-size: 1.0625rem;
	line-height: 1.6;
	color: rgb(var(--idi-texto-suave-rgb, 95 102 109));
}

.idi-vt-stats {
	display: grid;
	grid-template-columns: repeat(3, auto);
	justify-content: start;
	gap: 1rem 1.75rem;
	margin: 0 0 1.75rem;
}

@media (min-width: 640px) {
	.idi-vt-stats { gap: 1rem 2.5rem; }
}

.idi-vt-stats > div {
	display: flex;
	flex-direction: column-reverse;
}

.idi-vt-stats dd {
	margin: 0;
	font-size: clamp(1.5rem, 4vw, 1.875rem);
	font-weight: 800;
	line-height: 1.1;
	font-variant-numeric: tabular-nums;
	color: rgb(var(--idi-acento-texto-rgb, 45 91 141));
}

.idi-vt-stats dt {
	max-width: 9rem;
	font-size: .8125rem;
	line-height: 1.3;
	color: rgb(var(--idi-texto-suave-rgb, 95 102 109));
}

.idi-vt-actions {
	display: flex;
	flex-wrap: wrap;
	gap: .75rem;
}

/* La clase más reciente, grande. */
.idi-vt-destacado {
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid rgb(var(--idi-linea-rgb, 224 225 226));
	border-radius: 1.5rem;
	background: rgb(var(--idi-fondo-rgb, 255 255 255));
	box-shadow: var(--vt-sombra);
}

.idi-vt-destacado__body {
	display: flex;
	flex-direction: column;
	gap: .5rem;
	padding: 1.25rem 1.5rem 1.5rem;
}

.idi-vt-destacado__title {
	margin: 0;
	font-size: clamp(1.25rem, 2.2vw, 1.5rem);
	font-weight: 800;
	line-height: 1.25;
	text-wrap: balance;
}

/* ---------- Piezas compartidas por tarjetas y ventana ---------- */

.idi-vt-thumb {
	position: relative;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: rgb(var(--idi-texto-rgb, 31 41 51) / .08);
}

.idi-vt-thumb img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover; /* hqdefault es 4:3 con bandas: el recorte las quita. */
	transition: transform .35s ease;
}

.idi-vt-play {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 3.25rem;
	height: 3.25rem;
	border-radius: 50%;
	background: rgb(var(--idi-texto-rgb, 31 41 51) / .72);
	transform: translate(-50%, -50%);
	transition: background-color .2s ease, transform .2s ease;
}

.idi-vt-play::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 54%;
	border-style: solid;
	border-width: .55rem 0 .55rem .9rem;
	border-color: transparent transparent transparent rgb(var(--idi-fondo-rgb, 255 255 255));
	transform: translate(-50%, -50%);
}

.idi-vt-thumb--grande .idi-vt-play {
	width: 4.5rem;
	height: 4.5rem;
}

.idi-vt-thumb--grande .idi-vt-play::before {
	border-width: .75rem 0 .75rem 1.2rem;
}

/* Arriba: las miniaturas de las transmisiones traen la fecha impresa abajo a
   la derecha, donde YouTube suele poner la duración. */
.idi-vt-dur {
	position: absolute;
	top: .5rem;
	right: .5rem;
	padding: .125rem .45rem;
	border-radius: .375rem;
	background: rgb(var(--idi-texto-rgb, 31 41 51) / .85);
	color: rgb(var(--idi-fondo-rgb, 255 255 255));
	font-size: .75rem;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

.idi-vt-badge {
	position: absolute;
	top: .875rem;
	left: .875rem;
	padding: .3rem .7rem;
	border-radius: 999px;
	background: rgb(var(--idi-cta-rgb, 244 206 70));
	color: rgb(var(--idi-sobre-cta-rgb, 31 41 51));
	font-size: .75rem;
	font-weight: 800;
	letter-spacing: .02em;
}

/* Área: punto de su color (con un filete de tinta: el amarillo no se ve solo). */
.idi-vt-area {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	margin: 0;
	font-size: .8125rem;
	font-weight: 600;
	line-height: 1.3;
	color: rgb(var(--idi-texto-suave-rgb, 95 102 109));
}

.idi-vt-area::before,
.idi-vt-chip__dot {
	content: "";
	flex: none;
	width: .625rem;
	height: .625rem;
	border-radius: 50%;
	background: var(--vt-area, rgb(var(--idi-acento-rgb, 45 91 141)));
	box-shadow: 0 0 0 1px rgb(var(--idi-texto-rgb, 31 41 51) / .22);
}

.idi-vt-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .25rem .5rem;
	margin: 0;
	font-size: .8125rem;
	color: rgb(var(--idi-texto-suave-rgb, 95 102 109));
}

.idi-vt-rel {
	margin: 0;
	font-size: .875rem;
	font-weight: 600;
	line-height: 1.4;
}

.idi-vt-tipo {
	padding: .05rem .5rem;
	border-radius: 999px;
	background: rgb(var(--idi-acento-tenue-rgb, 234 239 244));
	color: rgb(var(--idi-acento-texto-rgb, 45 91 141));
	font-size: .75rem;
	font-weight: 700;
}

/* Enlace estirado: toda la tarjeta abre la clase, pero el nombre accesible del
   enlace es solo el título. */
.idi-vt-abrir {
	color: inherit;
	text-decoration: none;
}

.idi-vt-abrir::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}

.idi-vt-abrir:focus-visible { outline: none; }

.idi-vt-card:has(.idi-vt-abrir:focus-visible),
.idi-vt-destacado:has(.idi-vt-abrir:focus-visible) {
	outline: 3px solid rgb(var(--idi-acento-rgb, 45 91 141));
	outline-offset: 3px;
}

/* ---------- Próxima en vivo ---------- */

.idi-vt-envivo {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .75rem 1rem;
	margin: 0 0 2.5rem;
	padding: .875rem 1rem .875rem 1.25rem;
	border: 1px solid rgb(var(--idi-acento-linea-rgb, 182 198 215));
	border-radius: 1rem;
	background: rgb(var(--idi-fondo-rgb, 255 255 255));
}

.idi-vt-envivo__dot {
	flex: none;
	width: .625rem;
	height: .625rem;
	border-radius: 50%;
	background: rgb(var(--idi-error-rgb, 185 28 28));
	box-shadow: 0 0 0 0 rgb(var(--idi-error-rgb, 185 28 28) / .5);
	animation: idi-vt-pulso 1.8s ease-out infinite;
}

@keyframes idi-vt-pulso {
	to { box-shadow: 0 0 0 .55rem rgb(var(--idi-error-rgb, 185 28 28) / 0); }
}

.idi-vt-envivo__txt {
	flex: 1 1 18rem;
	margin: 0;
	font-size: .9375rem;
	line-height: 1.45;
}

.idi-vt-envivo__txt a {
	color: rgb(var(--idi-acento-texto-rgb, 45 91 141));
	font-weight: 700;
	text-underline-offset: .2em;
}

.idi-vt-envivo__cuando {
	display: block;
	font-size: .8125rem;
	color: rgb(var(--idi-texto-suave-rgb, 95 102 109));
}

.idi-vt-envivo__cuando::first-letter { text-transform: uppercase; }

/* ---------- Explorador ---------- */

.idi-vt-explorar { scroll-margin-top: 7rem; }

.idi-vt-explorar__head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: .25rem 1rem;
	margin-bottom: 1rem;
}

.idi-vt-h2 {
	margin: 0;
	font-size: clamp(1.5rem, 2.6vw, 1.875rem);
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -.01em;
}

.idi-vt-estado {
	margin: 0;
	font-size: .9375rem;
	color: rgb(var(--idi-texto-suave-rgb, 95 102 109));
}

.idi-vt-filtros {
	display: flex;
	flex-direction: column;
	gap: .875rem;
	padding: 1rem;
	border: 1px solid rgb(var(--idi-linea-rgb, 224 225 226));
	border-radius: var(--vt-radio);
	background: rgb(var(--idi-fondo-rgb, 255 255 255));
}

@media (min-width: 768px) {
	.idi-vt-filtros { padding: 1.25rem; }
}

.idi-vt-buscar { position: relative; }

.idi-vt-buscar__icon {
	position: absolute;
	top: 50%;
	left: 1rem;
	color: rgb(var(--idi-texto-suave-rgb, 95 102 109));
	transform: translateY(-50%);
	pointer-events: none;
}

.idi-vt-buscar__input {
	width: 100%;
	min-height: 52px;
	padding: .75rem 3rem .75rem 2.875rem;
	border: 1.5px solid rgb(var(--idi-borde-control-rgb, 144 149 154));
	border-radius: .875rem;
	background: rgb(var(--idi-fondo-rgb, 255 255 255));
	color: inherit;
	font: inherit;
	font-size: 1rem;
	-webkit-appearance: none;
	appearance: none;
}

.idi-vt-buscar__input::placeholder { color: rgb(var(--idi-texto-suave-rgb, 95 102 109)); }

.idi-vt-buscar__input::-webkit-search-cancel-button { display: none; }

.idi-vt-buscar__input:focus {
	outline: none;
	border-color: rgb(var(--idi-acento-rgb, 45 91 141));
	box-shadow: 0 0 0 3px rgb(var(--idi-acento-rgb, 45 91 141) / .22);
}

.idi-vt-buscar__limpiar {
	position: absolute;
	top: 50%;
	right: .5rem;
	width: 2.25rem;
	height: 2.25rem;
	border: 0;
	border-radius: 50%;
	background: rgb(var(--idi-superficie-rgb, 245 245 245));
	color: rgb(var(--idi-texto-rgb, 31 41 51));
	font-size: 1.375rem;
	line-height: 1;
	cursor: pointer;
	transform: translateY(-50%);
}

.idi-vt-atajos {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .375rem;
	margin: 0;
	font-size: .8125rem;
	color: rgb(var(--idi-texto-suave-rgb, 95 102 109));
}

.idi-vt-atajos > span { margin-right: .25rem; }

.idi-vt-atajo {
	padding: .35rem .8rem;
	border: 0;
	border-radius: 999px;
	background: rgb(var(--idi-superficie-rgb, 245 245 245));
	color: rgb(var(--idi-texto-rgb, 31 41 51));
	font: inherit;
	font-size: .8125rem;
	font-weight: 600;
	cursor: pointer;
	transition: background-color .15s ease, color .15s ease;
}

.idi-vt-atajo:hover,
.idi-vt-atajo[aria-pressed="true"] {
	background: rgb(var(--idi-acento-tenue-rgb, 234 239 244));
	color: rgb(var(--idi-acento-texto-rgb, 45 91 141));
}

/* Áreas: en el teléfono, una fila que se desliza; desde tablet, en varias filas. */
.idi-vt-areas {
	display: flex;
	gap: .5rem;
	margin: 0 -1rem;
	padding: .125rem 1rem .25rem;
	overflow-x: auto;
	scroll-snap-type: x proximity;
	scrollbar-width: none;
}

.idi-vt-areas::-webkit-scrollbar { display: none; }

@media (min-width: 768px) {
	.idi-vt-areas {
		flex-wrap: wrap;
		margin: 0;
		padding: 0;
		overflow: visible;
	}
}

.idi-vt-chip {
	display: inline-flex;
	flex: none;
	align-items: center;
	gap: .45rem;
	min-height: 40px;
	padding: .45rem .5rem .45rem .9rem;
	border: 1px solid rgb(var(--idi-linea-fuerte-rgb, 192 195 198));
	border-radius: 999px;
	background: rgb(var(--idi-fondo-rgb, 255 255 255));
	color: rgb(var(--idi-texto-rgb, 31 41 51));
	font: inherit;
	font-size: .875rem;
	font-weight: 600;
	white-space: nowrap;
	cursor: pointer;
	scroll-snap-align: start;
	transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

.idi-vt-chip:hover { border-color: rgb(var(--idi-acento-rgb, 45 91 141)); }

.idi-vt-chip__n {
	min-width: 1.6rem;
	padding: .05rem .45rem;
	border-radius: 999px;
	background: rgb(var(--idi-superficie-rgb, 245 245 245));
	color: rgb(var(--idi-texto-suave-rgb, 95 102 109));
	font-size: .75rem;
	font-variant-numeric: tabular-nums;
	text-align: center;
}

.idi-vt-chip[aria-pressed="true"] {
	border-color: rgb(var(--idi-acento-rgb, 45 91 141));
	background: rgb(var(--idi-acento-rgb, 45 91 141));
	color: rgb(var(--idi-sobre-acento-rgb, 255 255 255));
}

.idi-vt-chip[aria-pressed="true"] .idi-vt-chip__n {
	background: rgb(var(--idi-sobre-acento-rgb, 255 255 255) / .2);
	color: rgb(var(--idi-sobre-acento-rgb, 255 255 255));
}

.idi-vt-chip[aria-pressed="true"] .idi-vt-chip__dot {
	box-shadow: 0 0 0 2px rgb(var(--idi-sobre-acento-rgb, 255 255 255));
}

/* Años y grilla. */
.idi-vt-anio { margin-top: 2.25rem; }

.idi-vt-anio__t {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin: 0 0 1rem;
	font-size: 1.125rem;
	font-weight: 800;
	font-variant-numeric: tabular-nums;
}

.idi-vt-anio__t::after {
	content: "";
	flex: 1;
	height: 1px;
	background: rgb(var(--idi-linea-fuerte-rgb, 192 195 198));
}

.idi-vt-grid {
	display: grid;
	gap: 1.25rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 640px) {
	.idi-vt-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1024px) {
	.idi-vt-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.idi-vt-item { margin: 0; }

.idi-vt-card {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	border: 1px solid rgb(var(--idi-linea-rgb, 224 225 226));
	border-radius: var(--vt-radio);
	background: rgb(var(--idi-fondo-rgb, 255 255 255));
	transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}

.idi-vt-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: .5rem;
	padding: 1rem 1.125rem 1.125rem;
}

.idi-vt-card__title {
	margin: 0;
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.35;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}

.idi-vt-card .idi-vt-rel {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
}

.idi-vt-card__resumen {
	margin: 0;
	font-size: .875rem;
	line-height: 1.5;
	color: rgb(var(--idi-texto-suave-rgb, 95 102 109));
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}

.idi-vt-card .idi-vt-meta {
	margin-top: auto;
	padding-top: .375rem;
}

@media (hover: hover) {
	.idi-vt-card:hover,
	.idi-vt-destacado:hover {
		box-shadow: var(--vt-sombra);
	}

	.idi-vt-card:hover {
		border-color: rgb(var(--idi-linea-fuerte-rgb, 192 195 198));
		transform: translateY(-2px);
	}

	.idi-vt-card:hover .idi-vt-thumb img,
	.idi-vt-destacado:hover .idi-vt-thumb img { transform: scale(1.04); }

	.idi-vt-card:hover .idi-vt-play,
	.idi-vt-destacado:hover .idi-vt-play {
		background: rgb(var(--idi-acento-rgb, 45 91 141));
		transform: translate(-50%, -50%) scale(1.08);
	}

	.idi-vt-card:hover .idi-vt-card__title { color: rgb(var(--idi-acento-texto-rgb, 45 91 141)); }
}

.idi-vt-vacio {
	margin-top: 1.5rem;
	padding: 2.5rem 1.25rem;
	border: 1.5px dashed rgb(var(--idi-linea-fuerte-rgb, 192 195 198));
	border-radius: var(--vt-radio);
	background: rgb(var(--idi-fondo-rgb, 255 255 255));
	text-align: center;
	color: rgb(var(--idi-texto-suave-rgb, 95 102 109));
}

.idi-vt-vacio p { margin: 0 0 .5rem; }

.idi-vt-vacio__t {
	font-size: 1.125rem;
	font-weight: 700;
	color: rgb(var(--idi-texto-rgb, 31 41 51));
}

.idi-vt-vacio .idi-vt-btn { margin-top: .75rem; }

/* ---------- Cierre ---------- */

.idi-vt-cierre { margin-top: 4rem; }

.idi-vt-cierre__grid {
	display: grid;
	gap: 1rem;
	margin: 1.25rem 0 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 768px) {
	.idi-vt-cierre__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.idi-vt-cierre__item {
	display: flex;
	flex-direction: column;
	gap: .5rem;
	margin: 0;
	padding: 1.5rem;
	border: 1px solid rgb(var(--idi-linea-rgb, 224 225 226));
	border-radius: var(--vt-radio);
	background: rgb(var(--idi-fondo-rgb, 255 255 255));
}

.idi-vt-cierre__item h3 {
	margin: 0;
	font-size: 1.125rem;
	font-weight: 700;
}

.idi-vt-cierre__item p {
	margin: 0;
	font-size: .9375rem;
	line-height: 1.55;
	color: rgb(var(--idi-texto-suave-rgb, 95 102 109));
}

.idi-vt-link {
	margin-top: auto;
	padding-top: .5rem;
	font-weight: 700;
	color: rgb(var(--idi-acento-texto-rgb, 45 91 141));
	text-decoration: underline;
	text-decoration-thickness: 1.5px;
	text-underline-offset: .2em;
}

.idi-vt-link:hover { color: rgb(var(--idi-acento-hover-rgb, 38 76 118)); }

/* ---------- Ventana del reproductor ---------- */

html:has(.idi-vt-modal[open]) { overflow: hidden; }

.idi-vt-modal {
	width: min(960px, calc(100vw - 1.5rem));
	max-width: none;
	max-height: calc(100dvh - 1.5rem);
	margin: auto;
	padding: 0;
	border: 0;
	border-radius: var(--vt-radio);
	background: transparent;
	color: rgb(var(--idi-texto-rgb, 31 41 51));
	overflow: visible;
}

.idi-vt-modal::backdrop {
	background: rgb(var(--idi-texto-rgb, 31 41 51) / .78);
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
}

.idi-vt-modal__box {
	position: relative;
	max-height: calc(100dvh - 1.5rem);
	overflow-y: auto;
	overscroll-behavior: contain;
	border-radius: var(--vt-radio);
	background: rgb(var(--idi-fondo-rgb, 255 255 255));
}

.idi-vt-modal__player {
	aspect-ratio: 16 / 9;
	background: rgb(var(--idi-texto-rgb, 31 41 51));
}

.idi-vt-modal__player iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
}

/* Pantallas anchas: el vídeo a la izquierda y la ficha al lado, como en una
   sala. Apiladas, en 900 px de alto la ficha quedaba bajo el borde. */
@media (min-width: 1100px) {
	.idi-vt-modal { width: min(1240px, calc(100vw - 3rem)); }

	.idi-vt-modal__box {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 22rem;
		background: rgb(var(--idi-texto-rgb, 31 41 51));
		overflow: hidden;
	}

	.idi-vt-modal__player { align-self: center; }

	.idi-vt-modal .idi-vt-modal__info {
		max-height: calc(100dvh - 1.5rem);
		overflow-y: auto;
		padding: 3.75rem 1.75rem 1.75rem;
		background: rgb(var(--idi-fondo-rgb, 255 255 255));
	}

	.idi-vt-modal .idi-vt-modal__cerrar {
		background: rgb(var(--idi-superficie-rgb, 245 245 245));
		color: rgb(var(--idi-texto-rgb, 31 41 51));
	}

	.idi-vt-modal .idi-vt-modal__cerrar:hover { background: rgb(var(--idi-acento-tenue-rgb, 234 239 244)); }
}

.idi-vt-modal__cerrar {
	position: absolute;
	top: .625rem;
	right: .625rem;
	z-index: 2;
	width: 2.5rem;
	height: 2.5rem;
	border: 0;
	border-radius: 50%;
	background: rgb(var(--idi-texto-rgb, 31 41 51) / .78);
	color: rgb(var(--idi-fondo-rgb, 255 255 255));
	font-size: 1.625rem;
	line-height: 1;
	cursor: pointer;
}

.idi-vt-modal__cerrar:hover { background: rgb(var(--idi-acento-rgb, 45 91 141)); }

.idi-vt-modal__info {
	display: flex;
	flex-direction: column;
	gap: .5rem;
	padding: 1.25rem 1.25rem 1.5rem;
}

@media (min-width: 768px) {
	.idi-vt-modal__info { padding: 1.5rem 2rem 2rem; }
}

.idi-vt-modal__title {
	margin: 0;
	font-size: clamp(1.25rem, 2.4vw, 1.625rem);
	font-weight: 800;
	line-height: 1.25;
	text-wrap: balance;
}

.idi-vt-modal__rel {
	margin: .25rem 0 0;
	font-size: .9375rem;
}

.idi-vt-modal__rel strong { font-weight: 700; }

.idi-vt-modal__resumen {
	margin: 0;
	max-width: 46rem;
	font-size: .9375rem;
	line-height: 1.6;
	color: rgb(var(--idi-texto-suave-rgb, 95 102 109));
}

.idi-vt-modal__prog {
	display: flex;
	flex-direction: column;
	gap: .15rem;
	margin: .5rem 0 0;
	padding: .75rem 1rem;
	border-radius: .875rem;
	background: rgb(var(--idi-acento-tenue-rgb, 234 239 244));
}

.idi-vt-modal__prog span {
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: rgb(var(--idi-acento-texto-rgb, 45 91 141));
}

.idi-vt-modal__prog a {
	font-weight: 700;
	color: rgb(var(--idi-texto-rgb, 31 41 51));
	text-underline-offset: .2em;
}

.idi-vt-modal__acciones {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin-top: .75rem;
}

/* ---------- Movimiento reducido ---------- */

@media (prefers-reduced-motion: reduce) {
	.idi-vt *,
	.idi-vt *::before,
	.idi-vt *::after {
		animation: none !important;
		transition: none !important;
	}

	.idi-vt-card:hover { transform: none; }
	.idi-vt-card:hover .idi-vt-thumb img,
	.idi-vt-destacado:hover .idi-vt-thumb img { transform: none; }
}