/* ==========================================================================
   Mero Cartelera — lenguaje de la marca Mero Bar (merobar.co)
   Tomado del propio sitio (kit de Elementor + plantilla de evento):
   · Colores: Rojo #FF3E23 · Amarillo #FFC45C · Negro Mero #1C1C1C · Gris de marco #555555
     · Claro #F3F8FA (franja del botón) · Meta #A9A9A9.
   · Letra: Ruston (títulos, botones, fechas, en MAYÚSCULAS) + Inter (texto corrido).
   · Formas: marco de 3 px #555 con esquinas de 25 px, SIN sombras; botón de contorno rojo 3 px
     con esquinas de 16 px; botón sólido rojo con letra amarilla; separador amarillo de 2 px.
   · Interacción: la franja clara se vuelve negra con letra amarilla (como en la plantilla).
   Todo va anidado bajo .mc-wrap / .mc-destacada para ganarle a los estilos globales del kit.
   ========================================================================== */
.mc-wrap, .mc-destacada {
	--mc-rojo: #FF3E23;
	--mc-rojo-osc: #D22343;
	--mc-amarillo: #FFC45C;
	--mc-negro: #1C1C1C;
	--mc-marco: #555555;
	--mc-claro: #F3F8FA;
	--mc-meta: #A9A9A9;
	--mc-blanco: #FFFFFF;
	--mc-display: "Ruston", "Inter", system-ui, sans-serif;
	--mc-body: "Inter", system-ui, -apple-system, sans-serif;
	--mc-radio: 25px;
	--mc-marco-w: 3px;
}
.mc-wrap { font-family: var(--mc-body); color: var(--mc-marco); width: 100%; }
.mc-wrap *, .mc-wrap *::before, .mc-wrap *::after, .mc-destacada * { box-sizing: border-box; }
.mc-ico { flex: none; vertical-align: -2px; }

/* El kit le pone tipografía propia a todos los <a> y <p>: aquí heredan la de su contenedor. */
body .mc-wrap a, body .mc-destacada a { font-family: inherit; font-size: inherit; font-weight: inherit; letter-spacing: inherit; line-height: inherit; color: inherit; text-decoration: none; }
body .mc-wrap p, body .mc-destacada p { margin: 0; }

/* ---------- Barra: filtros (como el filtro de categorías del sitio) + vistas ---------- */
.mc-barra { display: flex; flex-wrap: wrap; gap: 14px 24px; align-items: center; justify-content: center; margin: 0 0 32px; }
.mc-filtro, .mc-vistas { display: inline-flex; flex-wrap: wrap; gap: 4px; justify-content: center; align-items: center; }
.mc-wrap .mc-filtro button {
	font-family: var(--mc-display); font-weight: 700; font-size: 1.15rem; line-height: 1; text-transform: uppercase; letter-spacing: .02em;
	padding: 9px 14px 7px; border: 0; border-radius: 8px; background: transparent; color: var(--mc-marco);
	cursor: pointer; box-shadow: none; min-height: 0; transition: color .15s ease, background .15s ease;
}
.mc-wrap .mc-filtro button:hover { background: transparent; color: var(--mc-rojo); }
.mc-wrap .mc-filtro button.is-active { background: var(--mc-rojo); color: var(--mc-blanco); }
/* Separador amarillo entre el filtro de lugar y el de categoría */
.mc-filtro--cat { padding-left: 20px; border-left: 2px solid var(--mc-amarillo); }
.mc-wrap .mc-filtro--cat button.is-active { background: var(--mc-negro); color: var(--mc-amarillo); }

.mc-vistas { margin-left: auto; gap: 8px; }
.mc-wrap .mc-vistas button {
	display: inline-flex; align-items: center; gap: 6px;
	font-family: var(--mc-display); font-weight: 700; font-size: 1.05rem; line-height: 1; text-transform: uppercase;
	padding: 8px 14px 6px; border: var(--mc-marco-w) solid var(--mc-rojo); border-radius: 16px;
	background: var(--mc-claro); color: var(--mc-rojo); cursor: pointer; box-shadow: none; min-height: 0;
}
.mc-wrap .mc-vistas button:hover { background: var(--mc-blanco); color: var(--mc-rojo-osc); }
.mc-wrap .mc-vistas button.is-active { background: var(--mc-rojo); color: var(--mc-amarillo); }
@media (max-width: 1024px) {
	.mc-vistas { margin-left: 0; }
	.mc-filtro--cat { padding-left: 0; border-left: 0; }
}
@media (max-width: 600px) {
	.mc-barra { gap: 10px; margin-bottom: 22px; }
	.mc-filtro { justify-content: center; }
	.mc-wrap .mc-filtro button { font-size: 1rem; padding: 8px 10px 6px; }
	.mc-vistas { width: 100%; display: flex; }
	.mc-wrap .mc-vistas button { flex: 1 1 0; justify-content: center; font-size: .95rem; padding: 8px 6px 6px; }
}

/* ---------- Grilla ---------- */
.mc-cartelera { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 28px 24px; align-items: stretch; }
.mc-cartelera--3:not(.is-agenda) { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 960px) { .mc-cartelera--3:not(.is-agenda) { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .mc-cartelera--3:not(.is-agenda), .mc-cartelera { grid-template-columns: 1fr; gap: 20px; } }
.mc-cartelera[hidden], .mc-cal[hidden], .mc-funcion[hidden], .mc-sin-resultados[hidden] { display: none !important; }

/* ---------- Tarjeta ---------- */
.mc-funcion {
	display: flex; flex-direction: column; overflow: hidden;
	background: var(--mc-negro); border: var(--mc-marco-w) solid var(--mc-marco); border-radius: var(--mc-radio);
	transition: border-color .2s ease;
}
.mc-funcion:hover { border-color: var(--mc-rojo); }

/* Imagen: caja 16:10 (vivenu entrega casi siempre banners 2,68:1 y a veces afiches 4:5), imagen entera, relleno con el mismo afiche
   desenfocado; abajo se funde en negro hacia el bloque del título (el degradado de la plantilla). */
.mc-funcion-media { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--mc-negro); }
.mc-funcion-media[style*="--bg"]::before {
	content: ""; position: absolute; inset: -24px; background: var(--bg) center / cover no-repeat;
	filter: blur(20px) brightness(.5); transform: scale(1.1);
}
.mc-funcion-media::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 22%; z-index: 2; pointer-events: none;
	background: linear-gradient(to bottom, rgba(28,28,28,0), var(--mc-negro));
}
.mc-wrap .mc-funcion-media img {
	position: relative; z-index: 1; width: 100% !important; height: 100% !important; max-width: none;
	object-fit: contain; display: block; transition: transform .35s ease;
}
.mc-funcion:hover .mc-funcion-media img { transform: scale(1.03); }
.mc-datechip { display: none; }
.mc-funcion-media.is-noimg { display: flex; align-items: center; justify-content: center; background: var(--mc-rojo); }
.mc-funcion-media.is-noimg .mc-datechip {
	display: flex; flex-direction: column; align-items: center; color: var(--mc-amarillo);
	font-family: var(--mc-display); font-weight: 700; text-transform: uppercase; line-height: .9; font-size: 1.6rem;
}
.mc-funcion-media.is-noimg .mc-datechip b { font-size: 4.5rem; line-height: .85; }

/* Urgencia: el botón sólido de la marca (rojo con letra amarilla). Agotado: negro, sin animar. */
.mc-cinta {
	position: absolute; top: 14px; left: 14px; z-index: 3;
	background: var(--mc-rojo); color: var(--mc-amarillo); border-radius: 8px;
	font-family: var(--mc-display); font-weight: 700; font-size: 1.05rem; text-transform: uppercase; line-height: 1; padding: 8px 12px 6px;
}
.mc-cinta--agotado { background: var(--mc-negro); color: var(--mc-blanco); border: 2px solid var(--mc-blanco); }

.mc-funcion-body {
	flex: 1; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px;
	padding: 4px 20px 20px; color: var(--mc-blanco);
}
.mc-eyebrow-card {
	font-family: var(--mc-display); font-weight: 700; font-size: .95rem; text-transform: uppercase; letter-spacing: .06em;
	color: var(--mc-amarillo); line-height: 1;
}
.mc-wrap .mc-titulo {
	margin: 0; color: var(--mc-blanco); font-family: var(--mc-display); font-weight: 600; text-transform: uppercase;
	font-size: 1.5rem; line-height: 1.15; letter-spacing: .7px; word-spacing: 3px;
}
.mc-wrap .mc-titulo a:hover { color: var(--mc-amarillo); }
.mc-wrap .mc-cuando { font-family: var(--mc-display); font-size: 1.15rem; line-height: 1.2; color: var(--mc-amarillo); }
.mc-sep { opacity: .7; }
.mc-wrap .mc-donde { font-size: .85rem; line-height: 1.4; color: var(--mc-meta); }
.mc-wrap .mc-donde .mc-ico { color: var(--mc-rojo); }
.mc-wrap .mc-donde a { text-decoration: underline; text-underline-offset: 2px; text-decoration-color: rgba(169,169,169,.5); }
.mc-wrap .mc-donde a:hover { color: var(--mc-blanco); }
.mc-precio { color: var(--mc-blanco); font-weight: 600; white-space: nowrap; }
.mc-estado { display: none; }

/* Franja de compra: la base de la tarjeta, como en la plantilla del sitio. */
.mc-wrap .mc-banda {
	display: block; width: 100%; margin-top: auto; text-align: center;
	background: var(--mc-claro); color: var(--mc-negro);
	--ff: var(--mc-display); --fw: 700; --fs: 1.6rem; --lh: 1.1; --ls: normal;
	font-family: var(--ff); font-weight: var(--fw); font-size: var(--fs); line-height: var(--lh); letter-spacing: var(--ls); text-transform: uppercase;
	padding: 15px 16px 12px; transition: background .2s ease, color .2s ease;
}
.mc-wrap a.mc-banda:hover { background: #000; color: var(--mc-amarillo); }
.mc-wrap .mc-banda--agotado { color: var(--mc-meta); cursor: default; }
.mc-funcion.is-agotado .mc-funcion-media img { filter: grayscale(.6); }

/* ---------- Vista agenda: filas con el bloque de fecha amarillo y la cifra en rojo ---------- */
.mc-cartelera.is-agenda { display: flex; flex-direction: column; gap: 12px; }
.mc-cartelera.is-agenda .mc-funcion { flex-direction: row; align-items: stretch; background: var(--mc-blanco); border-radius: 18px; }
.mc-cartelera.is-agenda .mc-funcion-media {
	flex: 0 0 104px; aspect-ratio: auto; display: flex; align-items: center; justify-content: center;
	background: var(--mc-amarillo); border-right: var(--mc-marco-w) solid var(--mc-marco);
}
.mc-cartelera.is-agenda .mc-funcion-media::before, .mc-cartelera.is-agenda .mc-funcion-media::after,
.mc-cartelera.is-agenda .mc-funcion-media img, .mc-cartelera.is-agenda .mc-cinta { display: none; }
.mc-cartelera.is-agenda .mc-datechip {
	display: flex; flex-direction: column; align-items: center; color: var(--mc-negro);
	font-family: var(--mc-display); font-weight: 700; text-transform: uppercase; line-height: .9; font-size: 1.1rem;
}
.mc-cartelera.is-agenda .mc-datechip b { color: var(--mc-rojo); font-size: 3rem; line-height: .85; }
.mc-cartelera.is-agenda .is-temporada .mc-datechip b { font-size: 1.4rem; }
.mc-cartelera.is-agenda .mc-funcion-body {
	align-items: flex-start; text-align: left; justify-content: center; gap: 4px; padding: 14px 20px; color: var(--mc-marco);
}
.mc-cartelera.is-agenda .mc-titulo { color: var(--mc-negro); font-size: 1.35rem; }
.mc-cartelera.is-agenda .mc-titulo a:hover { color: var(--mc-rojo); }
.mc-cartelera.is-agenda .mc-eyebrow-card { color: var(--mc-rojo); font-size: .85rem; }
.mc-cartelera.is-agenda .mc-cuando { color: var(--mc-marco); font-size: 1.05rem; }
.mc-cartelera.is-agenda .mc-donde { color: var(--mc-marco); }
.mc-cartelera.is-agenda .mc-donde a:hover { color: var(--mc-rojo); }
.mc-cartelera.is-agenda .mc-precio { color: var(--mc-negro); }
.mc-cartelera.is-agenda .mc-estado { display: inline-block; background: var(--mc-rojo); color: var(--mc-amarillo); border-radius: 6px; font-family: var(--mc-display); font-weight: 700; text-transform: uppercase; font-size: .9rem; padding: 4px 8px 2px; }
.mc-cartelera.is-agenda .mc-estado--agotado { background: var(--mc-negro); color: var(--mc-blanco); }
.mc-cartelera.is-agenda .mc-banda {
	width: auto; flex: 0 0 auto; margin: 0; display: flex; align-items: center;
	--fs: 1.2rem; font-size: var(--fs); padding: 12px 22px; border-left: var(--mc-marco-w) solid var(--mc-marco);
}
@media (max-width: 680px) {
	.mc-cartelera.is-agenda .mc-funcion { flex-wrap: wrap; }
	.mc-cartelera.is-agenda .mc-funcion-media { flex-basis: 78px; }
	.mc-cartelera.is-agenda .mc-funcion-body { flex: 1 1 0; min-width: 0; padding: 12px 14px; }
	.mc-cartelera.is-agenda .mc-titulo { font-size: 1.15rem; }
	.mc-cartelera.is-agenda .mc-banda { flex: 1 1 100%; justify-content: center; border-left: 0; border-top: var(--mc-marco-w) solid var(--mc-marco); padding: 10px; }
}

/* ---------- Calendario ---------- */
.mc-cal-head { display: flex; align-items: center; justify-content: center; gap: 20px; margin: 0 0 18px; }
.mc-cal-head strong { font-family: var(--mc-display); font-weight: 700; font-size: 2.2rem; line-height: 1; text-transform: uppercase; color: var(--mc-rojo); min-width: 260px; text-align: center; }
.mc-wrap .mc-cal-nav {
	width: 44px; height: 44px; padding: 0; border-radius: 50%; border: var(--mc-marco-w) solid var(--mc-rojo);
	background: var(--mc-claro); color: var(--mc-rojo); font-size: 1.5rem; font-weight: 800; line-height: 1;
	cursor: pointer; display: inline-flex; align-items: center; justify-content: center; box-shadow: none; min-height: 0;
}
.mc-wrap .mc-cal-nav:hover { background: var(--mc-rojo); color: var(--mc-amarillo); }
.mc-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.mc-cal-dow { text-align: center; font-family: var(--mc-display); font-weight: 700; font-size: 1.1rem; color: var(--mc-marco); padding: 4px 0 8px; }
.mc-cal-cell { min-height: 100px; border: 2px solid #E4E4E4; border-radius: 14px; padding: 6px; display: flex; flex-direction: column; gap: 4px; background: var(--mc-blanco); overflow: hidden; }
.mc-cal-cell.is-empty { border: 0; background: transparent; }
.mc-cal-cell.has-ev { border: var(--mc-marco-w) solid var(--mc-marco); }
.mc-cal-cell.is-today { background: #FFF4DE; border-color: var(--mc-amarillo); }
.mc-cal-num { font-family: var(--mc-display); font-weight: 700; font-size: 1.15rem; color: var(--mc-marco); }
.mc-cal-cell.has-ev .mc-cal-num { color: var(--mc-rojo); }
body .mc-wrap .mc-cal-ev {
	display: flex; align-items: center; gap: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
	--ff: var(--mc-body); --fs: .72rem; --fw: 600; --lh: 1.2; --ls: normal;
	font-family: var(--ff); font-size: var(--fs); font-weight: var(--fw); line-height: var(--lh); color: var(--mc-negro);
	background: var(--mc-claro); border-left: 4px solid var(--gc, var(--mc-rojo)); border-radius: 4px; padding: 3px 5px;
}
body .mc-wrap .mc-cal-ev:hover { background: var(--mc-negro); color: var(--mc-amarillo); }
.mc-cal-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--gc, var(--mc-rojo)); flex: none; }
@media (max-width: 720px) {
	.mc-cal-grid { gap: 3px; }
	.mc-cal-cell { min-height: 58px; padding: 3px; border-radius: 8px; }
	.mc-cal-cell.has-ev { border-width: 2px; }
	body .mc-wrap .mc-cal-ev { --fs: 0; font-size: 0; gap: 0; padding: 2px; border-left: 0; background: transparent; justify-content: center; }
	.mc-cal-dot { width: 10px; height: 10px; }
	.mc-cal-head strong { font-size: 1.5rem; min-width: 170px; }
}

.mc-sin-resultados, .mc-vacia { text-align: center; padding: 40px 16px; font-family: "Ruston", "Inter", sans-serif; font-size: 1.4rem; text-transform: uppercase; color: #555555; }

/* ---------- Destacado (banner) ---------- */
.mc-destacada {
	display: grid; grid-template-columns: 1fr 1fr; max-width: 1140px; margin: 0 auto 48px; overflow: hidden;
	background: var(--mc-negro); border: var(--mc-marco-w) solid var(--mc-marco); border-radius: var(--mc-radio);
	font-family: var(--mc-body);
}
.mc-destacada-media { position: relative; display: block; background: var(--mc-negro); min-height: 100%; }
.mc-destacada-media { overflow: hidden; aspect-ratio: 1 / 1; }
.mc-destacada-media::before { content: ""; position: absolute; inset: -30px; background: var(--bg) center / cover no-repeat; filter: blur(24px) brightness(.5); transform: scale(1.1); }
.mc-destacada .mc-destacada-media img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: contain; display: block; }
.mc-destacada-body { padding: clamp(22px, 3.5vw, 48px); display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 12px; color: var(--mc-blanco); }
.mc-destacada .mc-eyebrow { font-family: var(--mc-display); font-weight: 700; font-size: 1.15rem; text-transform: uppercase; letter-spacing: .06em; color: var(--mc-amarillo); }
.mc-destacada .mc-destacada-body h2 {
	margin: 0; color: var(--mc-blanco); font-family: var(--mc-display); font-weight: 700; text-transform: uppercase;
	font-size: clamp(2rem, 3.4vw, 3.1rem); line-height: 1; letter-spacing: -.5px;
}
.mc-divisor { display: block; width: 72px; height: 0; border-top: 2px solid var(--mc-amarillo); margin: 4px 0; }
.mc-destacada .mc-destacada-meta { font-family: var(--mc-display); font-size: 1.3rem; line-height: 1.25; color: var(--mc-amarillo); margin: 0 0 10px; }
.mc-destacada .mc-destacada-meta a { text-decoration: underline; text-underline-offset: 3px; }
.mc-destacada-cta { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
/* Botón sólido de la marca: rojo con letra amarilla. */
body .mc-destacada a.mc-btn, body .mc-destacada span.mc-btn {
	display: inline-flex; align-items: center; background: var(--mc-rojo); color: var(--mc-amarillo);
	--ff: var(--mc-display); --fw: 700; --fs: 1.5rem; --lh: 1; --ls: normal;
	font-family: var(--ff); font-weight: var(--fw); font-size: var(--fs); line-height: var(--lh); letter-spacing: var(--ls); text-transform: uppercase;
	padding: 15px 28px 12px; border-radius: 0; transition: background .2s ease, color .2s ease;
}
body .mc-destacada a.mc-btn:hover { background: #000; color: var(--mc-amarillo); }
body .mc-destacada span.mc-btn--agotado { background: transparent; color: var(--mc-meta); border: 2px dashed var(--mc-meta); }
body .mc-destacada a.mc-destacada-link { font-family: var(--mc-display); font-size: 1.2rem; text-transform: uppercase; color: var(--mc-blanco); border-bottom: 2px solid var(--mc-amarillo); padding-bottom: 2px; }
body .mc-destacada a.mc-destacada-link:hover { color: var(--mc-amarillo); }
@media (max-width: 780px) {
	.mc-destacada { grid-template-columns: 1fr; }
	.mc-destacada-media { aspect-ratio: 4 / 3; }
}

@media (prefers-reduced-motion: reduce) {
	.mc-funcion, .mc-funcion-media img, .mc-wrap .mc-banda { transition: none; }
	.mc-funcion:hover .mc-funcion-media img { transform: none; }
}
.mc-hora { white-space: nowrap; }
/* Agenda: columna de compra de ancho fijo para que todas las filas alineen (también «Agotado»). */
@media (min-width: 681px) { .mc-cartelera.is-agenda .mc-banda { flex: 0 0 190px; justify-content: center; } }

/* ==========================================================================
   BLINDAJE DEL HOVER. El kit de Elementor de cada sitio trae `.elementor-kit-N a:hover` con su
   propia tipografía (en monologossinpropina.com: Poppins 400 + subrayado). Durante el hover le
   gana a nuestras reglas y el texto cambiaba de letra; en los botones, al ser más ancha, el botón
   parecía estirarse. Aquí todo enlace de la cartelera conserva su tipografía en hover/foco: los
   que la heredan (títulos, lugar) la vuelven a heredar, y los que tienen una propia (botones,
   eventos del calendario) la toman de sus variables --ff/--fw/--fs/--lh/--ls, que el kit no toca.
   ========================================================================== */
body .mc-wrap a:is(:hover, :focus, :active), body .mc-destacada a:is(:hover, :focus, :active) {
	font-family: inherit; font-weight: inherit; font-size: inherit; line-height: inherit; letter-spacing: inherit; text-decoration: none;
}
body .mc-wrap a.mc-banda:is(:hover, :focus, :active), body .mc-wrap a.mc-cal-ev:is(:hover, :focus, :active), body .mc-destacada a.mc-btn:is(:hover, :focus, :active) {
	font-family: var(--ff); font-weight: var(--fw); font-size: var(--fs); line-height: var(--lh); letter-spacing: var(--ls);
}

/* ==========================================================================
   [mero_videos] — contenido semanal de YouTube (estructura de «Los Impredecibles · en YouTube»
   de accionimpro.com.co): texto + último capítulo grande; debajo, capítulos anteriores.
   ========================================================================== */
.mc-videos {
	--v-bg: #1C1C1C; --v-acento: #FFC45C; --v-txt: #FFFFFF; --v-sec: #BDBDBD;
	--v-display: "Ruston", "Inter", sans-serif; --v-body: "Inter", system-ui, sans-serif;
	background: var(--v-bg); color: var(--v-txt); font-family: var(--v-body);
	padding: clamp(44px, 6vw, 84px) clamp(16px, 4vw, 48px);
}
.mc-videos *, .mc-videos *::before, .mc-videos *::after { box-sizing: border-box; }
.mc-videos-in { max-width: 1160px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: clamp(28px, 4vw, 56px); align-items: center; }
body .mc-videos p { margin: 0; }
.mc-videos-eyebrow { font-family: var(--v-display); font-weight: 600; font-size: 1rem; letter-spacing: .08em; text-transform: uppercase; color: var(--v-acento); margin-bottom: 10px !important; }
body .mc-videos .mc-videos-h2 { margin: 0 0 14px; font-family: var(--v-display); font-weight: 700; font-size: clamp(2rem, 3.6vw, 3.1rem); line-height: 1.02; text-transform: uppercase; color: var(--v-txt); }
.mc-videos-p { color: var(--v-sec); font-size: 1rem; line-height: 1.6; max-width: 46ch; }
.mc-videos-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin-top: 24px; }
body .mc-videos a.mc-videos-btn, body .mc-videos a.mc-videos-btn:is(:hover, :focus, :active) {
	display: inline-flex; align-items: center; gap: 8px; padding: 13px 22px 11px; text-decoration: none;
	background: var(--v-acento); color: #000; font-family: var(--v-display); font-weight: 600; font-size: 1.15rem; line-height: 1; letter-spacing: .03em; text-transform: uppercase;
}
body .mc-videos a.mc-videos-btn:hover { background: #fff; color: #000; }
body .mc-videos a.mc-videos-link, body .mc-videos a.mc-videos-link:is(:hover, :focus, :active) {
	color: var(--v-txt); font-family: var(--v-display); font-weight: 500; font-size: 1.05rem; line-height: 1.2; letter-spacing: .03em; text-transform: uppercase;
	text-decoration: underline; text-decoration-color: var(--v-acento); text-decoration-thickness: 2px; text-underline-offset: 5px;
}
body .mc-videos a.mc-videos-link:hover { color: var(--v-acento); }

.mc-yt-frame { position: relative; aspect-ratio: 16 / 9; background: #000; overflow: hidden; }
.mc-yt-frame iframe, .mc-yt-frame .mc-yt-facade { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; }
.mc-yt-frame img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease, filter .35s ease; }
.mc-yt-facade:hover img { transform: scale(1.03); filter: brightness(.85); }
.mc-yt-play {
	position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
	width: 76px; height: 76px; border-radius: 50%; background: var(--v-acento); color: #000;
	display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 24px rgba(0,0,0,.35); transition: transform .2s ease;
}
.mc-yt-play .mc-ico { margin-left: 4px; }
.mc-yt-facade:hover .mc-yt-play { transform: translate(-50%, -50%) scale(1.08); }
.mc-yt-play--sm { width: 40px; height: 40px; box-shadow: none; }
.mc-yt-play--sm .mc-ico { margin-left: 2px; }
.mc-yt-cap { margin-top: 14px !important; display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; }
.mc-yt-cap span { background: var(--v-acento); color: #000; font-family: var(--v-display); font-weight: 600; font-size: .85rem; letter-spacing: .05em; text-transform: uppercase; padding: 3px 8px 2px; }
.mc-yt-cap b { font-weight: 600; font-size: 1.05rem; color: var(--v-txt); }
.mc-yt-cap small { color: var(--v-sec); font-size: .85rem; }

.mc-videos-prev { max-width: 1160px; margin: clamp(32px, 4vw, 48px) auto 0; }
.mc-videos-prev-h { font-family: var(--v-display); font-weight: 600; font-size: 1.1rem; letter-spacing: .06em; text-transform: uppercase; color: var(--v-txt); margin-bottom: 14px !important; padding-bottom: 8px; border-bottom: 1px solid rgba(255,255,255,.18); }
.mc-videos-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
/* Botones de capítulos: sin el estilo de botón del kit de Elementor (también en hover/foco). */
body .mc-videos button.mc-yt-mini, body .mc-videos button.mc-yt-mini:is(:hover, :focus, :active) {
	display: flex; flex-direction: column; gap: 8px; width: 100%; padding: 0; margin: 0; border: 0; border-radius: 0; box-shadow: none;
	background: transparent; color: var(--v-txt); text-align: left; cursor: pointer; white-space: normal; height: auto; min-height: 0;
	font-family: var(--v-body); font-weight: 500; font-size: .88rem; line-height: 1.35; letter-spacing: 0; text-transform: none;
}
.mc-yt-mini-img { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; background: #000; outline: 3px solid transparent; outline-offset: 0; transition: outline-color .15s ease; }
.mc-yt-mini-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
body .mc-videos button.mc-yt-mini:hover .mc-yt-mini-img, body .mc-videos button.mc-yt-mini.is-on .mc-yt-mini-img { outline-color: var(--v-acento); }
.mc-yt-mini-t { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
body .mc-videos button.mc-yt-mini:hover .mc-yt-mini-t { color: var(--v-acento); }
@media (max-width: 900px) {
	.mc-videos-in { grid-template-columns: 1fr; }
	.mc-videos-player { order: -1; }
	.mc-videos-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) { .mc-yt-frame img, .mc-yt-play { transition: none; } }
