/**
 * Estilos de BVQ Capacitaciones.
 *
 * Se apoyan en variables CSS con valores de reserva, para que el tema pueda redefinir la
 * paleta desde su propio :root sin tocar el plugin.
 */

.bvq-cap-calendario,
.bvq-cap-agenda,
.bvq-cap-items {
	--bvq-cap-color-texto: var( --bvq-cap-texto, #1f2937 );
	--bvq-cap-color-suave: var( --bvq-cap-suave, #6b7280 );
	--bvq-cap-color-borde: var( --bvq-cap-borde, #e5e7eb );
	--bvq-cap-color-fondo: var( --bvq-cap-fondo, #ffffff );
	--bvq-cap-color-acento: var( --bvq-cap-acento, #f2b90d );
	--bvq-cap-color-inscripcion: var( --bvq-cap-inscripcion, #046b04 );
	--bvq-cap-color-agotado: var( --bvq-cap-agotado, #b32d2e );
	--bvq-cap-color-disponible: var( --bvq-cap-disponible, #2e9e5b );
	--bvq-cap-color-boton: var( --bvq-cap-boton, #16264a );
	--bvq-cap-color-boton-hover: var( --bvq-cap-boton-hover, #24406f );
	--bvq-cap-color-boton-texto: var( --bvq-cap-boton-texto, #ffffff );
	--bvq-cap-radio: var( --bvq-cap-radio-base, 8px );

	color: var( --bvq-cap-color-texto );
}

/* --- Filtros --------------------------------------------------------------- */

.bvq-cap-filtros {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	align-items: flex-end;
	margin-bottom: 1.25rem;
}

.bvq-cap-filtros__campo {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	font-size: 0.875rem;
}

.bvq-cap-filtros__campo span {
	color: var( --bvq-cap-color-suave );
}

/* --- Navegación ------------------------------------------------------------ */

.bvq-cap-calendario__nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1rem;
}

.bvq-cap-calendario__titulo {
	margin: 0;
	font-size: 1.25rem;
	text-transform: capitalize;
}

.bvq-cap-calendario__flecha {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.75rem;
	min-height: 2.75rem;
	border: 1px solid var( --bvq-cap-color-borde );
	border-radius: var( --bvq-cap-radio );
	text-decoration: none;
	font-size: 1.125rem;
	line-height: 1;
	color: inherit;
}

.bvq-cap-calendario__flecha:hover,
.bvq-cap-calendario__flecha:focus-visible {
	border-color: var( --bvq-cap-color-acento );
}

.bvq-cap-calendario__flecha.is-desactivada {
	opacity: 0.35;
	cursor: default;
}

.bvq-cap-calendario.is-cargando .bvq-cap-calendario__cuerpo {
	opacity: 0.55;
	transition: opacity 120ms ease-out;
}

/* --- Rejilla --------------------------------------------------------------- */

.bvq-cap-calendario__rejilla {
	width: 100%;
	border-collapse: collapse;
	table-layout: fixed;
}

.bvq-cap-calendario__rejilla th {
	padding: 0.5rem 0.25rem;
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var( --bvq-cap-color-suave );
	text-align: center;
	font-weight: 600;
}

.bvq-cap-calendario__rejilla th abbr {
	text-decoration: none;
	border: 0;
}

.bvq-cap-dia {
	vertical-align: top;
	height: 6.5rem;
	padding: 0.375rem;
	border: 1px solid var( --bvq-cap-color-borde );
	background: var( --bvq-cap-color-fondo );
}

.bvq-cap-dia.is-vacia {
	background: transparent;
	border-color: transparent;
}

.bvq-cap-dia.is-pasado {
	background: color-mix( in srgb, var( --bvq-cap-color-borde ) 25%, transparent );
}

.bvq-cap-dia.is-hoy {
	outline: 2px solid var( --bvq-cap-color-acento );
	outline-offset: -2px;
}

.bvq-cap-dia__numero {
	display: block;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var( --bvq-cap-color-suave );
	margin-bottom: 0.25rem;
}

.bvq-cap-pastilla {
	display: block;
	margin-bottom: 0.25rem;
	padding: 0.25rem 0.375rem;
	border-left: 3px solid var( --bvq-cap-color-acento );
	border-radius: 4px;
	background: color-mix( in srgb, var( --bvq-cap-color-acento ) 12%, transparent );
	font-size: 0.75rem;
	line-height: 1.3;
	text-decoration: none;
	color: inherit;
}

.bvq-cap-pastilla.is-inscripcion {
	border-left-color: var( --bvq-cap-color-inscripcion );
	background: color-mix( in srgb, var( --bvq-cap-color-inscripcion ) 10%, transparent );
}

.bvq-cap-pastilla.is-agotada {
	opacity: 0.6;
	border-left-color: var( --bvq-cap-color-agotado );
}

.bvq-cap-pastilla__hora {
	display: block;
	font-variant-numeric: tabular-nums;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-pastilla__titulo {
	display: block;
	font-weight: 600;
}

/* --- Listado de capacitaciones ---------------------------------------------
   Lista y cuadrícula comparten marcado: solo cambia la clase del contenedor. Por eso
   todo lo común vive en .bvq-cap-item y cada vista solo redefine la disposición. */

.bvq-cap-items {
	list-style: none;
	margin: 0;
	padding: 0;
}

.bvq-cap-item {
	color: var( --bvq-cap-color-texto );
}

.bvq-cap-item__fecha time {
	display: block;
}

.bvq-cap-item__dia {
	display: block;
	font-size: 2.25rem;
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.02em;
	font-variant-numeric: tabular-nums;
}

.bvq-cap-item__mes {
	display: block;
	margin-top: 0.375rem;
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-item__titulo {
	margin: 0;
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.35;
}

.bvq-cap-item__titulo a {
	color: inherit;
	text-decoration: none;
}

.bvq-cap-item__titulo a:hover,
.bvq-cap-item__titulo a:focus-visible {
	text-decoration: underline;
}

.bvq-cap-item__meta {
	margin: 0.25rem 0 0;
	font-size: 0.8125rem;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-item__modalidad {
	font-size: 0.9375rem;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-cupos {
	font-size: 0.8125rem;
	font-weight: 600;
	color: var( --bvq-cap-color-disponible );
}

.bvq-cap-cupos.is-agotada {
	color: var( --bvq-cap-color-agotado );
}

.bvq-cap-cupos.is-pasada {
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-item__precio {
	display: block;
	font-size: 1.375rem;
	font-weight: 800;
	line-height: 1.1;
}

.bvq-cap-item__precio.is-gratis {
	color: var( --bvq-cap-color-disponible );
}

.bvq-cap-item__precio del {
	font-size: 0.875rem;
	font-weight: 400;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-item.is-pasada {
	opacity: 0.65;
}

/* --- Botón ----------------------------------------------------------------- */

.bvq-cap-boton {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 2.75rem;
	padding: 0.625rem 1.5rem;
	border: 0;
	border-radius: 999px;
	background: var( --bvq-cap-color-boton );
	color: var( --bvq-cap-color-boton-texto );
	font: inherit;
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
}

.bvq-cap-boton:hover,
.bvq-cap-boton:focus-visible {
	background: var( --bvq-cap-color-boton-hover );
	color: var( --bvq-cap-color-boton-texto );
}

.bvq-cap-boton.is-inactivo {
	background: transparent;
	border: 1px solid var( --bvq-cap-color-borde );
	color: var( --bvq-cap-color-suave );
	cursor: default;
	font-weight: 500;
}

/* --- Vista lista ----------------------------------------------------------- */

.bvq-cap-items.is-lista .bvq-cap-item {
	display: grid;
	grid-template-columns: 5.5rem minmax( 0, 1fr ) 8rem 7rem 11rem;
	gap: 1.5rem;
	align-items: center;
	padding: 1.75rem 0;
	border-bottom: 1px solid var( --bvq-cap-color-borde );
}

.bvq-cap-items.is-lista .bvq-cap-item:first-child {
	border-top: 1px solid var( --bvq-cap-color-borde );
}

/* La miniatura solo existe en el marcado para poder cambiar a cuadrícula sin recargar. */
.bvq-cap-items.is-lista .bvq-cap-item__imagen {
	display: none;
}

.bvq-cap-items.is-lista .bvq-cap-item__accion {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.625rem;
}

/* --- Vista cuadrícula ------------------------------------------------------ */

.bvq-cap-items.is-cards {
	display: grid;
	gap: 1.25rem;
	grid-template-columns: repeat( auto-fill, minmax( 17rem, 1fr ) );
}

.bvq-cap-items.is-cards .bvq-cap-item {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	padding: 0 0 1.25rem;
	border: 1px solid var( --bvq-cap-color-borde );
	border-radius: var( --bvq-cap-radio );
	background: var( --bvq-cap-color-fondo );
	overflow: hidden;
}

.bvq-cap-items.is-cards .bvq-cap-item__imagen img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.bvq-cap-items.is-cards .bvq-cap-item > *:not( .bvq-cap-item__imagen ) {
	padding-inline: 1.25rem;
}

.bvq-cap-items.is-cards .bvq-cap-item__fecha {
	display: flex;
	align-items: baseline;
	gap: 0.5rem;
	margin-top: 1rem;
}

.bvq-cap-items.is-cards .bvq-cap-item__fecha time {
	display: flex;
	align-items: baseline;
	gap: 0.5rem;
}

.bvq-cap-items.is-cards .bvq-cap-item__dia {
	font-size: 1.5rem;
}

.bvq-cap-items.is-cards .bvq-cap-item__mes {
	margin-top: 0;
}

.bvq-cap-items.is-cards .bvq-cap-item__accion {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	margin-top: auto;
	padding-top: 0.75rem;
}

.bvq-cap-items.is-cards .bvq-cap-item__precio {
	font-size: 1.25rem;
}

/* --- Conmutador de vista --------------------------------------------------- */

.bvq-cap-agenda__cabecera {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1.25rem;
}

.bvq-cap-agenda__titulo {
	margin: 0;
}

.bvq-cap-vistas {
	display: inline-flex;
	padding: 0.1875rem;
	border: 1px solid var( --bvq-cap-color-borde );
	border-radius: 999px;
}

.bvq-cap-vistas__boton {
	padding: 0.375rem 0.875rem;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: var( --bvq-cap-color-suave );
	font: inherit;
	font-size: 0.8125rem;
	font-weight: 600;
	cursor: pointer;
}

.bvq-cap-vistas__boton.is-activa {
	background: var( --bvq-cap-color-boton );
	color: var( --bvq-cap-color-boton-texto );
}

/* --- Lista en pantallas estrechas ------------------------------------------
   Cinco columnas no caben en un móvil. En lugar de encogerlas, la fila se reordena en
   dos columnas: la fecha a la izquierda y el resto apilado. */

@media ( max-width: 60rem ) {
	.bvq-cap-items.is-lista .bvq-cap-item {
		grid-template-columns: 4.5rem minmax( 0, 1fr );
		gap: 0.5rem 1.25rem;
		align-items: start;
	}

	.bvq-cap-items.is-lista .bvq-cap-item__fecha {
		grid-row: span 4;
	}

	.bvq-cap-items.is-lista .bvq-cap-item__dia {
		font-size: 1.75rem;
	}

	.bvq-cap-items.is-lista .bvq-cap-item__accion {
		flex-direction: row;
		align-items: center;
		gap: 1rem;
		margin-top: 0.5rem;
	}
}

.bvq-cap-etiqueta {
	display: inline-block;
	padding: 0.1875rem 0.5rem;
	border-radius: 999px;
	font-size: 0.75rem;
	font-weight: 600;
	background: color-mix( in srgb, var( --bvq-cap-color-borde ) 45%, transparent );
}

.bvq-cap-etiqueta.is-inscripcion {
	color: var( --bvq-cap-color-inscripcion );
	background: color-mix( in srgb, var( --bvq-cap-color-inscripcion ) 12%, transparent );
}

.bvq-cap-etiqueta.is-agotada {
	color: var( --bvq-cap-color-agotado );
	background: color-mix( in srgb, var( --bvq-cap-color-agotado ) 12%, transparent );
}

.bvq-cap-vacio {
	margin: 1.5rem 0;
	color: var( --bvq-cap-color-suave );
	font-style: italic;
}

.bvq-cap-error {
	margin: 0 0 1rem;
	padding: 0.75rem 1rem;
	border-radius: var( --bvq-cap-radio );
	background: color-mix( in srgb, var( --bvq-cap-color-agotado ) 12%, transparent );
	color: var( --bvq-cap-color-agotado );
}

/* En pantallas estrechas la rejilla mensual no cabe: se ofrece desplazamiento lateral
   propio en lugar de dejar que la página entera se desplace en horizontal. */
@media ( max-width: 48rem ) {
	.bvq-cap-calendario__cuerpo {
		overflow-x: auto;
	}

	.bvq-cap-calendario__rejilla {
		min-width: 40rem;
	}
}

/* --- Formulario de inscripción --------------------------------------------- */

.bvq-cap-inscripcion {
	--bvq-cap-color-texto: var( --bvq-cap-texto, #1f2937 );
	--bvq-cap-color-suave: var( --bvq-cap-suave, #6b7280 );
	--bvq-cap-color-borde: var( --bvq-cap-borde, #e5e7eb );
	--bvq-cap-color-inscripcion: var( --bvq-cap-inscripcion, #046b04 );
	--bvq-cap-radio: var( --bvq-cap-radio-base, 8px );

	margin: 1.5rem 0;
	padding: 1.5rem;
	border: 1px solid var( --bvq-cap-color-borde );
	border-radius: var( --bvq-cap-radio );
}

.bvq-cap-inscripcion__titulo {
	margin: 0 0 0.5rem;
	font-size: 1.125rem;
}

.bvq-cap-inscripcion__cupos {
	margin: 0 0 1rem;
	font-size: 0.875rem;
	font-weight: 600;
	color: var( --bvq-cap-color-inscripcion );
}

.bvq-cap-inscripcion__campos {
	display: grid;
	gap: 1rem;
	grid-template-columns: repeat( auto-fit, minmax( 14rem, 1fr ) );
}

.bvq-cap-campo {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	margin: 0;
}

.bvq-cap-campo label {
	font-size: 0.875rem;
	font-weight: 600;
}

.bvq-cap-campo input,
.bvq-cap-campo select {
	width: 100%;
	padding: 0.5rem 0.625rem;
	border: 1px solid var( --bvq-cap-color-borde );
	border-radius: var( --bvq-cap-radio );
	font: inherit;
}

.bvq-cap-campo__ayuda {
	font-size: 0.75rem;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-campo--consentimiento {
	margin-top: 1rem;
	flex-direction: row;
}

.bvq-cap-campo--consentimiento label {
	font-weight: 400;
	font-size: 0.875rem;
	line-height: 1.5;
}

/* El campo trampa se saca del flujo sin display:none ni visibility:hidden, que algunos
   autómatas detectan y saltan. */
.bvq-cap-trampa {
	position: absolute !important;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.bvq-cap-inscripcion__enviar {
	margin: 1.25rem 0 0;
}

.bvq-cap-aviso {
	margin: 1rem 0;
	padding: 0.75rem 1rem;
	border-radius: var( --bvq-cap-radio-base, 8px );
	background: color-mix( in srgb, var( --bvq-cap-borde, #e5e7eb ) 45%, transparent );
}

.bvq-cap-aviso.is-ok {
	color: var( --bvq-cap-inscripcion, #046b04 );
	background: color-mix( in srgb, var( --bvq-cap-inscripcion, #046b04 ) 12%, transparent );
}

.bvq-cap-aviso.is-error {
	color: var( --bvq-cap-agotado, #b32d2e );
	background: color-mix( in srgb, var( --bvq-cap-agotado, #b32d2e ) 12%, transparent );
}

/* --- Testimonios ----------------------------------------------------------- */

.bvq-cap-testimonios,
.bvq-cap-casos,
.bvq-cap-testimonio-form {
	--bvq-cap-color-texto: var( --bvq-cap-texto, #1f2937 );
	--bvq-cap-color-suave: var( --bvq-cap-suave, #6b7280 );
	--bvq-cap-color-borde: var( --bvq-cap-borde, #e5e7eb );
	--bvq-cap-color-fondo: var( --bvq-cap-fondo, #ffffff );
	--bvq-cap-color-acento: var( --bvq-cap-acento, #f2b90d );
	--bvq-cap-color-inscripcion: var( --bvq-cap-inscripcion, #046b04 );
	--bvq-cap-radio: var( --bvq-cap-radio-base, 8px );

	color: var( --bvq-cap-color-texto );
}

.bvq-cap-testimonios__lista {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 1.25rem;
	grid-template-columns: repeat( auto-fill, minmax( 18rem, 1fr ) );
}

.bvq-cap-testimonio {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	padding: 1.5rem;
	border: 1px solid var( --bvq-cap-color-borde );
	border-radius: var( --bvq-cap-radio );
	background: var( --bvq-cap-color-fondo );
}

.bvq-cap-testimonio__estrellas {
	margin: 0;
	color: var( --bvq-cap-color-acento );
	letter-spacing: 0.1em;
}

.bvq-cap-testimonio__texto {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 1rem;
	line-height: 1.6;
}

.bvq-cap-testimonio__texto p:last-child {
	margin-bottom: 0;
}

.bvq-cap-testimonio__firma {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin-top: auto;
	padding-top: 0.75rem;
	border-top: 1px solid var( --bvq-cap-color-borde );
}

.bvq-cap-testimonio__foto img {
	width: 3rem;
	height: 3rem;
	border-radius: 50%;
	object-fit: cover;
}

.bvq-cap-testimonio__persona {
	display: flex;
	flex-direction: column;
	gap: 0.125rem;
	font-size: 0.875rem;
}

.bvq-cap-testimonio__cargo,
.bvq-cap-testimonio__curso {
	color: var( --bvq-cap-color-suave );
	font-size: 0.8125rem;
}

.bvq-cap-testimonio__verificado {
	align-self: flex-start;
	margin-top: 0.25rem;
	padding: 0.0625rem 0.5rem;
	border-radius: 999px;
	font-size: 0.6875rem;
	font-weight: 600;
	color: var( --bvq-cap-color-inscripcion );
	background: color-mix( in srgb, var( --bvq-cap-color-inscripcion ) 12%, transparent );
}

/* --- Casos de éxito -------------------------------------------------------- */

.bvq-cap-caso {
	display: grid;
	gap: 1.5rem;
	grid-template-columns: minmax( 0, 15rem ) minmax( 0, 1fr );
	align-items: start;
	padding: 1.75rem 0;
	border-bottom: 1px solid var( --bvq-cap-color-borde );
}

.bvq-cap-caso:last-child {
	border-bottom: 0;
}

.bvq-cap-caso__foto img {
	width: 100%;
	height: auto;
	border-radius: var( --bvq-cap-radio );
	object-fit: cover;
}

.bvq-cap-caso__nombre {
	margin: 0 0 0.25rem;
	font-size: 1.25rem;
}

.bvq-cap-caso__cargo {
	margin: 0 0 0.75rem;
	color: var( --bvq-cap-color-suave );
	font-size: 0.875rem;
}

.bvq-cap-caso__resultado {
	margin: 0 0 1rem;
	padding-left: 0.875rem;
	border-left: 3px solid var( --bvq-cap-color-acento );
	font-size: 1.0625rem;
	font-weight: 600;
}

.bvq-cap-caso__comparativa {
	display: grid;
	gap: 0.5rem 1rem;
	grid-template-columns: max-content minmax( 0, 1fr );
	margin: 1rem 0 0;
	padding: 1rem;
	border-radius: var( --bvq-cap-radio );
	background: color-mix( in srgb, var( --bvq-cap-color-borde ) 30%, transparent );
	font-size: 0.9375rem;
}

.bvq-cap-caso__comparativa dt {
	font-weight: 700;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-caso__comparativa dd {
	margin: 0;
}

@media ( max-width: 40rem ) {
	.bvq-cap-caso {
		grid-template-columns: minmax( 0, 1fr );
	}

	.bvq-cap-caso__comparativa {
		grid-template-columns: minmax( 0, 1fr );
	}
}

/* --- Formulario de testimonio ---------------------------------------------- */

.bvq-cap-testimonio-form {
	margin: 1.5rem 0;
	padding: 1.5rem;
	border: 1px solid var( --bvq-cap-color-borde );
	border-radius: var( --bvq-cap-radio );
}

.bvq-cap-testimonio-form__titulo {
	margin: 0 0 1rem;
	font-size: 1.125rem;
}

.bvq-cap-testimonio-form__fila {
	display: grid;
	gap: 1rem;
	grid-template-columns: repeat( auto-fit, minmax( 12rem, 1fr ) );
}

.bvq-cap-testimonio-form textarea {
	width: 100%;
	padding: 0.5rem 0.625rem;
	border: 1px solid var( --bvq-cap-color-borde );
	border-radius: var( --bvq-cap-radio );
	font: inherit;
}

.bvq-cap-testimonio-form__nota {
	font-size: 0.8125rem;
	color: var( --bvq-cap-color-suave );
}

/* --- Datos de capacitación (público) --------------------------------------- */

.bvq-cap-datos-publico {
	--bvq-cap-color-texto: var( --bvq-cap-texto, #1f2937 );
	--bvq-cap-color-suave: var( --bvq-cap-suave, #6b7280 );
	--bvq-cap-color-borde: var( --bvq-cap-borde, #e5e7eb );
	--bvq-cap-color-acento: var( --bvq-cap-acento, #f2b90d );
	--bvq-cap-radio: var( --bvq-cap-radio-base, 8px );

	margin: 2rem 0;
	color: var( --bvq-cap-color-texto );
}

.bvq-cap-datos-publico__pestanas {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-bottom: 1.25rem;
}

.bvq-cap-datos-publico__pestana {
	padding: 0.4375rem 0.875rem;
	border: 1px solid var( --bvq-cap-color-borde );
	border-radius: 999px;
	background: transparent;
	font: inherit;
	font-size: 0.875rem;
	cursor: pointer;
	color: inherit;
}

.bvq-cap-datos-publico__pestana.is-activa {
	border-color: var( --bvq-cap-color-acento );
	background: color-mix( in srgb, var( --bvq-cap-color-acento ) 18%, transparent );
	font-weight: 600;
}

.bvq-cap-cifras {
	display: grid;
	gap: 1rem;
	grid-template-columns: repeat( auto-fit, minmax( 10rem, 1fr ) );
	margin-bottom: 1.5rem;
}

.bvq-cap-cifra {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	padding: 1.25rem;
	border: 1px solid var( --bvq-cap-color-borde );
	border-radius: var( --bvq-cap-radio );
	text-align: center;
}

.bvq-cap-cifra__valor {
	font-size: 2rem;
	font-weight: 700;
	line-height: 1.1;
	font-variant-numeric: tabular-nums;
}

.bvq-cap-cifra__etiqueta {
	font-size: 0.8125rem;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-barras {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.625rem;
}

.bvq-cap-barra {
	display: grid;
	gap: 0.75rem;
	grid-template-columns: minmax( 6rem, 11rem ) minmax( 0, 1fr ) 3.5rem;
	align-items: center;
	font-size: 0.875rem;
}

.bvq-cap-barra__pista {
	height: 0.625rem;
	border-radius: 999px;
	background: color-mix( in srgb, var( --bvq-cap-color-borde ) 60%, transparent );
	overflow: hidden;
}

.bvq-cap-barra__relleno {
	display: block;
	height: 100%;
	border-radius: 999px;
	background: var( --bvq-cap-color-acento );
}

.bvq-cap-barra__valor {
	text-align: right;
	font-variant-numeric: tabular-nums;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-datos-publico__acumulado {
	margin: 1.5rem 0 0;
	font-size: 0.875rem;
	color: var( --bvq-cap-color-suave );
}

@media ( max-width: 34rem ) {
	.bvq-cap-barra {
		grid-template-columns: minmax( 0, 1fr ) 3.5rem;
	}

	.bvq-cap-barra__nombre {
		grid-column: 1 / -1;
	}
}

/* --- Mis capacitaciones ---------------------------------------------------- */

.bvq-cap-mis {
	--bvq-cap-color-texto: var( --bvq-cap-texto, #1f2937 );
	--bvq-cap-color-suave: var( --bvq-cap-suave, #6b7280 );
	--bvq-cap-color-borde: var( --bvq-cap-borde, #e5e7eb );
	--bvq-cap-radio: var( --bvq-cap-radio-base, 8px );

	display: flex;
	flex-direction: column;
	gap: 1.25rem;
}

.bvq-cap-mi-curso {
	padding: 1.5rem;
	border: 1px solid var( --bvq-cap-color-borde );
	border-radius: var( --bvq-cap-radio );
}

.bvq-cap-mi-curso__titulo {
	margin: 0 0 0.25rem;
	font-size: 1.125rem;
}

.bvq-cap-mi-curso__titulo a {
	color: inherit;
	text-decoration: none;
}

.bvq-cap-mi-curso__fecha {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
	margin: 0 0 1rem;
	font-size: 0.875rem;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-recursos {
	list-style: none;
	margin: 0 0 1rem;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.bvq-cap-recurso {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 0.75rem;
	padding: 0.625rem 0.875rem;
	border: 1px solid var( --bvq-cap-color-borde );
	border-radius: var( --bvq-cap-radio );
	font-size: 0.9375rem;
}

.bvq-cap-recurso__archivo {
	display: block;
	font-size: 0.75rem;
	font-weight: 400;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-mi-curso__certificado--pendiente,
.bvq-cap-mi-curso__vacio {
	margin: 0;
	font-size: 0.875rem;
	color: var( --bvq-cap-color-suave );
}

/* --- Buscador --------------------------------------------------------------- */

.bvq-cap-buscador,
.bvq-cap-catalogo {
	--bvq-cap-color-texto: var( --bvq-cap-texto, #1f2937 );
	--bvq-cap-color-suave: var( --bvq-cap-suave, #6b7280 );
	--bvq-cap-color-borde: var( --bvq-cap-borde, #e5e7eb );
	--bvq-cap-color-fondo: var( --bvq-cap-fondo, #ffffff );
	--bvq-cap-color-acento: var( --bvq-cap-acento, #f2b90d );
	--bvq-cap-color-agotado: var( --bvq-cap-agotado, #b32d2e );
	--bvq-cap-color-disponible: var( --bvq-cap-disponible, #2e9e5b );
	--bvq-cap-color-boton: var( --bvq-cap-boton, #16264a );
	--bvq-cap-color-boton-hover: var( --bvq-cap-boton-hover, #24406f );
	--bvq-cap-color-boton-texto: var( --bvq-cap-boton-texto, #ffffff );
	--bvq-cap-radio: var( --bvq-cap-radio-base, 8px );

	color: var( --bvq-cap-color-texto );
}

.bvq-cap-buscador {
	margin: 0 0 2rem;
	padding: var( --bvq-cap-buscador-relleno, 26px );
	border: 1px solid var( --bvq-cap-color-borde );
	border-radius: var( --bvq-cap-buscador-radio, 24px );
	background: var( --bvq-cap-color-fondo );
	box-shadow: 0 1px 3px rgba( 0, 0, 0, 0.06 ), 0 8px 24px rgba( 0, 0, 0, 0.04 );
}

.bvq-cap-buscador__titulo {
	margin: 0 0 1rem;
	font-size: 1.125rem;
}

/* La pista de columnas la calcula PHP a partir de los campos que se muestren y llega como
   --bvq-cap-buscador-columnas. Aquí no se usa repeat( auto-fit, … ): junto a una columna
   flexible invalida toda la declaración y el buscador acaba apilado. */
.bvq-cap-buscador__campos {
	display: grid;
	grid-template-columns: var( --bvq-cap-buscador-columnas, 1fr );
	gap: var( --bvq-cap-buscador-separacion, 12px );
	align-items: end;
}

.bvq-cap-buscador__campo {
	display: flex;
	flex-direction: column;
	gap: 0.4375rem;
	min-width: 0;
}

.bvq-cap-buscador__campo label {
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-buscador__campo input,
.bvq-cap-buscador__campo select {
	width: 100%;
	min-height: 2.875rem;
	padding: 0.625rem 0.875rem;
	border: 1px solid var( --bvq-cap-color-borde );
	border-radius: var( --bvq-cap-radio );
	background: var( --bvq-cap-color-fondo );
	font: inherit;
	color: inherit;
}

.bvq-cap-buscador__campo input:focus-visible,
.bvq-cap-buscador__campo select:focus-visible {
	outline: 2px solid var( --bvq-cap-color-boton );
	outline-offset: 1px;
}

.bvq-cap-buscador__enviar .bvq-cap-boton {
	width: 100%;
	min-height: 2.875rem;
	border-radius: var( --bvq-cap-radio );
}

.bvq-cap-buscador__nota {
	margin: 1rem 0 0;
	font-size: 0.8125rem;
	color: var( --bvq-cap-color-suave );
}

/* En pantalla estrecha la pista calculada no cabe: se ignora y todo pasa a una columna. */
@media ( max-width: 48rem ) {
	.bvq-cap-buscador__campos {
		grid-template-columns: minmax( 0, 1fr );
	}
}

/* --- Chips de tema --------------------------------------------------------- */

.bvq-cap-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-bottom: 1.5rem;
}

.bvq-cap-chip {
	padding: 0.4375rem 1rem;
	border: 1px solid var( --bvq-cap-color-borde );
	border-radius: 999px;
	font-size: 0.8125rem;
	font-weight: 600;
	text-decoration: none;
	color: var( --bvq-cap-color-suave );
	background: var( --bvq-cap-color-fondo );
}

.bvq-cap-chip:hover,
.bvq-cap-chip:focus-visible {
	color: var( --bvq-cap-color-texto );
	border-color: var( --bvq-cap-color-boton );
}

.bvq-cap-chip.is-activo {
	background: var( --bvq-cap-color-boton );
	border-color: var( --bvq-cap-color-boton );
	color: var( --bvq-cap-color-boton-texto );
}

/* --- Catálogo -------------------------------------------------------------- */

.bvq-cap-catalogo.is-cargando .bvq-cap-catalogo__cuerpo {
	opacity: 0.55;
	transition: opacity 120ms ease-out;
}

.bvq-cap-catalogo__resumen {
	margin: 0 0 1rem;
	font-size: 0.875rem;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-catalogo__consulta {
	font-weight: 600;
	color: var( --bvq-cap-color-texto );
}

.bvq-cap-items.is-catalogo {
	display: grid;
	gap: 1.5rem;
	grid-template-columns: repeat( auto-fill, minmax( 17rem, 1fr ) );
}

.bvq-cap-items.is-catalogo .bvq-cap-item {
	display: flex;
	flex-direction: column;
	border: 1px solid var( --bvq-cap-color-borde );
	border-radius: 1rem;
	background: var( --bvq-cap-color-fondo );
	overflow: hidden;
}

.bvq-cap-items.is-catalogo .bvq-cap-item__imagen img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 10;
	object-fit: cover;
}

.bvq-cap-items.is-catalogo .bvq-cap-item__principal {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	padding: 1.25rem 1.25rem 0;
}

.bvq-cap-item__tema {
	margin: 0;
	font-size: 0.625rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-item__extracto {
	margin: 0;
	font-size: 0.875rem;
	line-height: 1.5;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-item__etiquetas {
	display: flex;
	flex-wrap: wrap;
	gap: 0.375rem;
	list-style: none;
	margin: 0.25rem 0 0;
	padding: 0;
}

.bvq-cap-item__etiquetas li {
	padding: 0.1875rem 0.5rem;
	border-radius: 4px;
	background: color-mix( in srgb, var( --bvq-cap-color-borde ) 45%, transparent );
	font-size: 0.6875rem;
	font-weight: 600;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-items.is-catalogo .bvq-cap-item__accion {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	margin-top: auto;
	padding: 1.25rem;
}

.bvq-cap-items.is-catalogo .bvq-cap-item__precio {
	font-size: 1.375rem;
}

/* --- Paginación ------------------------------------------------------------ */

.bvq-cap-paginacion {
	display: flex;
	flex-wrap: wrap;
	gap: 0.375rem;
	justify-content: center;
	margin-top: 2rem;
}

.bvq-cap-paginacion .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.5rem;
	min-height: 2.5rem;
	padding: 0 0.75rem;
	border: 1px solid var( --bvq-cap-color-borde );
	border-radius: var( --bvq-cap-radio );
	font-size: 0.875rem;
	text-decoration: none;
	color: inherit;
}

.bvq-cap-paginacion .page-numbers.current {
	background: var( --bvq-cap-color-boton );
	border-color: var( --bvq-cap-color-boton );
	color: var( --bvq-cap-color-boton-texto );
	font-weight: 600;
}

.bvq-cap-paginacion .page-numbers.dots {
	border-color: transparent;
}

/* --- Rutas de aprendizaje --------------------------------------------------- */

.bvq-cap-rutas {
	--bvq-cap-color-texto: var( --bvq-cap-texto, #1f2937 );
	--bvq-cap-color-suave: var( --bvq-cap-suave, #6b7280 );
	--bvq-cap-color-borde: var( --bvq-cap-borde, #e5e7eb );
	--bvq-cap-color-fondo: var( --bvq-cap-fondo, #ffffff );
	--bvq-cap-color-acento: var( --bvq-cap-acento, #f2b90d );
	--bvq-cap-color-boton: var( --bvq-cap-boton, #16264a );
	--bvq-cap-color-boton-hover: var( --bvq-cap-boton-hover, #24406f );
	--bvq-cap-color-boton-texto: var( --bvq-cap-boton-texto, #ffffff );
	--bvq-cap-color-disponible: var( --bvq-cap-disponible, #2e9e5b );
	--bvq-cap-radio: var( --bvq-cap-radio-base, 8px );

	color: var( --bvq-cap-color-texto );
}

.bvq-cap-rutas.is-panel {
	display: grid;
	gap: 3rem;
	grid-template-columns: minmax( 0, 5fr ) minmax( 0, 7fr );
	align-items: start;
	margin: 2.5rem 0;
}

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

.bvq-cap-rutas__portada {
	position: relative;
	display: flex;
	align-items: flex-end;
	aspect-ratio: 1 / 1;
	border-radius: 1.25rem;
	overflow: hidden;
	background: var( --bvq-cap-ruta-color, #1e3a8a );
}

/* Rombo de fondo cuando la ruta no tiene imagen: da textura sin depender de un archivo. */
.bvq-cap-rutas__portada::after {
	content: "";
	position: absolute;
	inset: 18% -18% -32% 18%;
	background: rgba( 255, 255, 255, 0.07 );
	transform: rotate( 45deg );
	pointer-events: none;
}

.bvq-cap-rutas__portada img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0.65;
	pointer-events: none;
}

.bvq-cap-rutas__portada-pie {
	position: relative;
	z-index: 1;
	padding: 2rem;
	color: #fff;
}

.bvq-cap-rutas__cifra {
	display: block;
	font-size: 3.5rem;
	font-weight: 800;
	line-height: 1;
}

.bvq-cap-rutas__pie {
	display: block;
	margin-top: 0.5rem;
	font-size: 0.9375rem;
	opacity: 0.85;
}

/* --- Cabecera de la sección ------------------------------------------------- */

.bvq-cap-rutas__eyebrow {
	display: flex;
	align-items: center;
	gap: 0.625rem;
	margin: 0 0 1rem;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-rutas__eyebrow::before {
	content: "";
	width: 1.5rem;
	height: 0.25rem;
	border-radius: 2px;
	background: var( --bvq-cap-color-acento );
}

.bvq-cap-rutas__titulo {
	margin: 0 0 1rem;
	font-size: clamp( 1.75rem, 3.5vw, 2.5rem );
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.02em;
}

.bvq-cap-rutas__texto {
	margin: 0 0 2rem;
	font-size: 0.9375rem;
	line-height: 1.6;
	color: var( --bvq-cap-color-suave );
	max-width: 34rem;
}

/* --- Índice ----------------------------------------------------------------- */

.bvq-cap-rutas__indice {
	list-style: none;
	margin: 0;
	padding: 0;
	counter-reset: none;
}

.bvq-cap-rutas__fila {
	border-top: 1px solid var( --bvq-cap-color-borde );
}

.bvq-cap-rutas__fila:last-child {
	border-bottom: 1px solid var( --bvq-cap-color-borde );
}

.bvq-cap-rutas__enlace {
	display: grid;
	grid-template-columns: 2.5rem minmax( 0, 1fr ) 1.5rem;
	gap: 1rem;
	align-items: center;
	padding: 1.125rem 0.25rem;
	text-decoration: none;
	color: inherit;
}

.bvq-cap-rutas__enlace:hover,
.bvq-cap-rutas__enlace:focus-visible {
	color: var( --bvq-cap-color-boton );
}

.bvq-cap-rutas__num {
	font-size: 0.75rem;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-rutas__nombre {
	font-size: 1rem;
	font-weight: 700;
}

.bvq-cap-rutas__objetivo {
	display: block;
	margin-top: 0.125rem;
	font-size: 0.8125rem;
	font-weight: 400;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-rutas__flecha {
	justify-self: end;
	font-size: 1rem;
	color: var( --bvq-cap-color-suave );
	transition: transform 120ms ease-out;
}

.bvq-cap-rutas__enlace:hover .bvq-cap-rutas__flecha {
	transform: translate( 2px, -2px );
}

/* --- Panel de una ruta ------------------------------------------------------ */

.bvq-cap-ruta {
	outline: none;
}

.bvq-cap-ruta__volver {
	margin-bottom: 1.25rem;
	padding: 0;
	border: 0;
	background: none;
	font: inherit;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var( --bvq-cap-color-suave );
	cursor: pointer;
}

.bvq-cap-ruta__volver:hover,
.bvq-cap-ruta__volver:focus-visible {
	color: var( --bvq-cap-color-boton );
}

.bvq-cap-ruta__num {
	margin: 0;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-ruta__titulo {
	margin: 0.25rem 0 0.5rem;
	font-size: 1.5rem;
	font-weight: 800;
	line-height: 1.2;
}

.bvq-cap-ruta__objetivo {
	margin: 0 0 0.75rem;
	font-size: 0.9375rem;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-ruta__resumen {
	margin: 0 0 1.5rem;
	font-size: 0.9375rem;
	line-height: 1.6;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-ruta__pasos {
	list-style: none;
	margin: 0 0 1.5rem;
	padding: 0;
}

.bvq-cap-paso-ruta {
	display: grid;
	grid-template-columns: 2.5rem minmax( 0, 1fr ) auto;
	gap: 1rem;
	align-items: center;
	padding: 1rem 0.25rem;
	border-top: 1px solid var( --bvq-cap-color-borde );
}

.bvq-cap-paso-ruta:last-child {
	border-bottom: 1px solid var( --bvq-cap-color-borde );
}

.bvq-cap-paso-ruta__num {
	font-size: 0.75rem;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-paso-ruta__titulo {
	display: block;
	font-weight: 700;
	text-decoration: none;
	color: inherit;
}

.bvq-cap-paso-ruta__titulo:hover,
.bvq-cap-paso-ruta__titulo:focus-visible {
	text-decoration: underline;
}

.bvq-cap-paso-ruta__meta {
	display: block;
	margin-top: 0.125rem;
	font-size: 0.8125rem;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-paso-ruta__precio {
	font-weight: 700;
	font-size: 0.9375rem;
	white-space: nowrap;
}

/* --- Cuadrícula de rutas ---------------------------------------------------- */

.bvq-cap-rutas__tarjetas {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 1.25rem;
	grid-template-columns: repeat( auto-fill, minmax( 15rem, 1fr ) );
}

.bvq-cap-rutas__tarjeta a {
	display: flex;
	flex-direction: column;
	gap: 0.375rem;
	height: 100%;
	padding: 1.5rem;
	border-radius: 1rem;
	background: var( --bvq-cap-ruta-color, #1e3a8a );
	color: #fff;
	text-decoration: none;
}

.bvq-cap-rutas__tarjeta .bvq-cap-rutas__num,
.bvq-cap-rutas__tarjeta .bvq-cap-rutas__objetivo,
.bvq-cap-rutas__tarjeta .bvq-cap-rutas__total {
	color: rgba( 255, 255, 255, 0.75 );
}

.bvq-cap-rutas__tarjeta .bvq-cap-rutas__nombre {
	font-size: 1.125rem;
}

.bvq-cap-rutas__total {
	margin-top: auto;
	padding-top: 0.75rem;
	font-size: 0.8125rem;
}

@media ( max-width: 56rem ) {
	.bvq-cap-rutas.is-panel {
		grid-template-columns: minmax( 0, 1fr );
		gap: 2rem;
	}

	.bvq-cap-rutas__portada {
		aspect-ratio: 16 / 9;
	}
}

/* --- Capacitación destacada -------------------------------------------------
   Pensada para ir sobre un fondo oscuro de sección: por eso los colores de texto se
   heredan (color: inherit) en vez de fijarse, y solo la ficha de precio impone los suyos,
   que sí van sobre blanco. */

.bvq-cap-destacada {
	--bvq-cap-color-suave: var( --bvq-cap-suave, #6b7280 );
	--bvq-cap-color-borde: var( --bvq-cap-borde, #e5e7eb );
	--bvq-cap-color-fondo: var( --bvq-cap-fondo, #ffffff );
	--bvq-cap-color-acento: var( --bvq-cap-acento, #f2b90d );
	--bvq-cap-color-boton: var( --bvq-cap-boton, #16264a );
	--bvq-cap-color-boton-hover: var( --bvq-cap-boton-hover, #24406f );
	--bvq-cap-color-boton-texto: var( --bvq-cap-boton-texto, #ffffff );
	--bvq-cap-color-disponible: var( --bvq-cap-disponible, #2e9e5b );
	--bvq-cap-radio: var( --bvq-cap-radio-base, 8px );
	--bvq-cap-destacada-radio: var( --bvq-cap-radio-destacada, 20px );

	margin: 2.5rem 0;
}

.bvq-cap-destacada__cabecera {
	display: grid;
	gap: 1.5rem 3rem;
	grid-template-columns: minmax( 0, 6fr ) minmax( 0, 5fr );
	align-items: end;
	margin-bottom: 2rem;
}

.bvq-cap-destacada__eyebrow {
	display: flex;
	align-items: center;
	gap: 0.625rem;
	margin: 0 0 0.75rem;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.bvq-cap-destacada__eyebrow::before {
	content: "";
	width: 1.5rem;
	height: 0.25rem;
	border-radius: 2px;
	background: var( --bvq-cap-color-acento );
	flex: 0 0 auto;
}

.bvq-cap-destacada__titulo {
	margin: 0;
	font-size: clamp( 1.75rem, 3.6vw, 2.75rem );
	font-weight: 800;
	line-height: 1.12;
	letter-spacing: -0.02em;
}

.bvq-cap-destacada__texto {
	margin: 0;
	font-size: 0.9375rem;
	line-height: 1.6;
	opacity: 0.8;
}

.bvq-cap-destacada__cuerpo {
	display: grid;
	gap: 1.25rem;
	grid-template-columns: minmax( 0, 6fr ) minmax( 0, 5fr );
	align-items: stretch;
}

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

.bvq-cap-destacada__portada {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: 24rem;
	border-radius: var( --bvq-cap-destacada-radio );
	overflow: hidden;
	background: var( --bvq-cap-color-boton );
}

.bvq-cap-destacada__portada img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	pointer-events: none;
}

/* Degradado sobre la imagen: sin él, un texto blanco sobre una foto clara no se lee.
   pointer-events: none es obligatorio, no cosmético: la capa cubre la tarjeta entera, y sin
   esto se traga todos los clics de encima. En el editor de Elementor eso impide seleccionar
   la sección, y sin selección el botón de borrar no tiene sobre qué actuar. */
.bvq-cap-destacada__portada::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: linear-gradient( to top, rgba( 8, 18, 40, 0.92 ) 0%, rgba( 8, 18, 40, 0.25 ) 55%, rgba( 8, 18, 40, 0 ) 100% );
}

.bvq-cap-destacada__portada-cuerpo {
	position: relative;
	z-index: 1;
	padding: 1.75rem;
	color: #fff;
}

.bvq-cap-destacada__marca {
	margin: 0 0 0.5rem;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var( --bvq-cap-color-acento );
}

.bvq-cap-destacada__nombre {
	margin: 0 0 0.625rem;
	font-size: clamp( 1.25rem, 2.2vw, 1.75rem );
	font-weight: 800;
	line-height: 1.2;
}

.bvq-cap-destacada__nombre a {
	color: inherit;
	text-decoration: none;
}

.bvq-cap-destacada__nombre a:hover,
.bvq-cap-destacada__nombre a:focus-visible {
	text-decoration: underline;
}

.bvq-cap-destacada__resumen {
	margin: 0 0 1rem;
	font-size: 0.875rem;
	line-height: 1.55;
	opacity: 0.85;
	max-width: 34rem;
}

.bvq-cap-destacada__etiquetas {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.bvq-cap-destacada__etiquetas li {
	padding: 0.3125rem 0.875rem;
	border: 1px solid rgba( 255, 255, 255, 0.35 );
	border-radius: 999px;
	font-size: 0.75rem;
	font-weight: 600;
}

/* --- Ficha de precio -------------------------------------------------------- */

.bvq-cap-destacada__ficha {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 2rem;
	border-radius: var( --bvq-cap-destacada-radio );
	background: var( --bvq-cap-color-fondo );
	color: var( --bvq-cap-texto, #1f2937 );
}

.bvq-cap-destacada__acento {
	display: block;
	width: 1.5rem;
	height: 0.375rem;
	margin-bottom: 1.25rem;
	border-radius: 3px;
	background: var( --bvq-cap-color-acento );
}

.bvq-cap-destacada__precio {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 0 0 1.5rem;
}

.bvq-cap-destacada__valor {
	font-size: clamp( 1.75rem, 3vw, 2.25rem );
	font-weight: 800;
	line-height: 1;
}

.bvq-cap-destacada__valor.is-gratis {
	color: var( --bvq-cap-color-disponible );
}

.bvq-cap-destacada__valor del {
	font-size: 0.9375rem;
	font-weight: 400;
	opacity: 0.6;
}

.bvq-cap-destacada__nota {
	font-size: 0.875rem;
	color: var( --bvq-cap-color-suave );
}

.bvq-cap-destacada__incluye {
	list-style: none;
	margin: 0 0 1.5rem;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.625rem;
	font-size: 0.875rem;
}

.bvq-cap-destacada__incluye li {
	display: flex;
	align-items: flex-start;
	gap: 0.625rem;
}

/* La marca se dibuja con ::before para que el texto de la lista siga siendo solo texto:
   un lector de pantalla no debería leer un símbolo por cada punto. */
.bvq-cap-destacada__incluye li::before {
	content: "\2713";
	color: var( --bvq-cap-color-boton );
	font-weight: 700;
	line-height: 1.5;
}

.bvq-cap-destacada__accion {
	margin: auto 0 0;
}

.bvq-cap-destacada__accion .bvq-cap-boton {
	width: 100%;
	border-radius: var( --bvq-cap-radio );
}

@media ( max-width: 56rem ) {
	.bvq-cap-destacada__cabecera,
	.bvq-cap-destacada__cuerpo {
		grid-template-columns: minmax( 0, 1fr );
	}

	.bvq-cap-destacada__portada {
		min-height: 18rem;
	}
}

/* --- Capacitación siempre disponible ----------------------------------------
   El bloque de fecha se reutiliza, pero con dos palabras en lugar del número grande: en un
   recurso permanente la fecha de arranque no es una cita a la que haya que acudir. */

.bvq-cap-item__fecha.is-permanente {
	justify-content: center;
}

.bvq-cap-item__siempre {
	font-size: 1.125rem;
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -0.01em;
	color: var( --bvq-cap-color-disponible );
}

.bvq-cap-item__fecha.is-permanente .bvq-cap-item__mes {
	color: var( --bvq-cap-color-disponible );
}