/**
 * Multicines PWA — mcp-2029-descubrir.css
 *
 * v0.34.2 (Rediseño 2029, Fase 3): Cartelera y Película con el diseño nuevo.
 *
 * SOLO PRESENTACIÓN, sobre el marcado de siempre (mismos enlaces GET de día y sede, mismo
 * formulario de horarios que crea la compra, mismos datos del servicio). Se carga solo en
 * /cartelera/ y /pelicula/.
 */

/* ── Cartelera: filtro de cine y día ───────────────────────────────────────────────────────── */
.mcp-2029 .mcp-filtro-cartelera {
	gap: 12px;
	margin: 2px 0 16px;
	padding: 14px;
	border: 1px solid var(--mcp-borde);
	border-radius: var(--mcp-radio-xl);
	background: var(--mcp-superficie);
	box-shadow: var(--mcp-2029-sombra);
}
.mcp-2029 .mcp-filtro-titulo {
	margin: 0 0 6px;
	font-family: var(--mcp-fuente);
	font-size: .6875rem;
	font-weight: var(--mcp-peso-bold);
	letter-spacing: 1.3px;
	text-transform: uppercase;
	color: var(--mcp-texto-secundario);
}
.mcp-2029 .mcp-sede-unica {
	display: flex;
	align-items: center;
	gap: 8px;
	font-family: var(--mcp-2029-display);
	font-size: 1.0625rem;
	font-weight: 800;
}
.mcp-2029 .mcp-sede-unica::before {
	content: "";
	flex: none;
	width: 10px;
	height: 10px;
	border-radius: 50% 50% 50% 0;
	transform: rotate(-45deg);
	background: var(--mcp-acento);
	box-shadow: 0 0 0 3px var(--mcp-2029-acento-suave);
}
.mcp-2029 .mcp-sede-enlace { border-radius: var(--mcp-radio-pill); }
/* El día, cuando hay uno solo, usa la misma clase que el cine: sin el pin de ubicación. */
.mcp-2029 .mcp-filtro-bloque + .mcp-filtro-bloque .mcp-sede-unica { font-size: .9375rem; font-weight: 700; }
.mcp-2029 .mcp-filtro-bloque + .mcp-filtro-bloque .mcp-sede-unica::before { display: none; }
.mcp-2029 .mcp-promos-pausa { margin: 6px 2px 0; text-align: right; }
.mcp-2029 .mcp-promos-pausa button { min-height: 32px; font-size: .75rem; color: var(--mcp-texto-secundario); }

/* Días: chips que se deslizan de lado (también los usa la ficha de la película). */
.mcp-2029 .mcp-dias {
	display: flex;
	flex-wrap: nowrap;
	gap: 8px;
	margin: 0 -14px;
	padding: 2px 14px 4px;
	overflow-x: auto;
	scroll-snap-type: x proximity;
	scrollbar-width: none;
}
.mcp-2029 .mcp-dias::-webkit-scrollbar { display: none; }
.mcp-2029 .mcp-dia { flex: none; scroll-snap-align: start; }
.mcp-2029 .mcp-dia-enlace {
	display: inline-flex;
	align-items: center;
	min-height: 42px;
	padding: 0 16px;
	border: 1px solid var(--mcp-borde);
	border-radius: var(--mcp-radio-pill);
	background: var(--mcp-2029-superficie-2);
	color: var(--mcp-texto);
	font-weight: var(--mcp-peso-bold);
	font-size: .875rem;
	text-decoration: none;
	transition: transform .15s, background-color .2s;
}
.mcp-2029 .mcp-dia-enlace:active { transform: scale(.95); }
.mcp-2029 .mcp-dia.is-activo .mcp-dia-enlace {
	border-color: transparent;
	background: var(--mcp-acento);
	color: var(--mcp-sobre-acento);
	box-shadow: 0 8px 18px -10px var(--mcp-acento);
}

/* ── Cartelera: resumen, promociones y géneros ─────────────────────────────────────────────── */
.mcp-2029 .mcp-cartelera-resumen { margin: 0 2px 10px; font-weight: var(--mcp-peso-semi); }
.mcp-2029 .mcp-promos-img { border-radius: var(--mcp-radio-xl); box-shadow: var(--mcp-2029-sombra); }
/* Chips de género (los arma mcp-2029.js con las secciones que ya hay; sin JS se ven las secciones). */
.mcp-2029-generos {
	display: flex;
	gap: 8px;
	margin: 4px calc(-1 * var(--mcp-gutter)) 14px;
	padding: 2px var(--mcp-gutter) 6px;
	overflow-x: auto;
	scrollbar-width: none;
}
.mcp-2029-generos::-webkit-scrollbar { display: none; }
.mcp-2029-genero {
	flex: none;
	min-height: 40px;
	padding: 0 14px;
	border: 1px solid var(--mcp-borde);
	border-radius: var(--mcp-radio-pill);
	background: var(--mcp-superficie);
	color: var(--mcp-texto-secundario);
	font: inherit;
	font-size: .8125rem;
	font-weight: var(--mcp-peso-bold);
	cursor: pointer;
}
.mcp-2029-genero[aria-pressed="true"] { border-color: transparent; background: var(--mcp-primario); color: var(--mcp-sobre-primario); }
.mcp-2029 .mcp-cartelera-genero { margin-bottom: 26px; }
.mcp-2029 .mcp-cartelera-genero[hidden] { display: none; }
.mcp-2029 .mcp-cartelera-genero-titulo {
	display: flex;
	align-items: center;
	gap: 10px;
	font-family: var(--mcp-2029-display);
	font-size: 1.25rem;
	font-weight: 800;
}
.mcp-2029 .mcp-cartelera-genero-titulo::after { content: ""; flex: 1; height: 1px; background: var(--mcp-borde); }

/* ── Cartelera: tarjeta de película ────────────────────────────────────────────────────────── */
.mcp-2029 .mcp-cartelera-grid { gap: 14px; }
.mcp-2029 .mcp-pelicula {
	gap: 0;
	border: 1px solid var(--mcp-borde);
	border-radius: 20px;
	box-shadow: 0 14px 30px -22px rgba(60, 25, 100, .55);
	transition: transform .2s var(--mcp-2029-ease), box-shadow .2s;
	animation: mcp-2029-sube .5s var(--mcp-2029-ease) both;
}
.mcp-2029 .mcp-cartelera-item:nth-child(2) .mcp-pelicula { animation-delay: .05s; }
.mcp-2029 .mcp-cartelera-item:nth-child(3) .mcp-pelicula { animation-delay: .1s; }
.mcp-2029 .mcp-cartelera-item:nth-child(4) .mcp-pelicula { animation-delay: .15s; }
.mcp-2029 .mcp-pelicula:active { transform: scale(.97); }
.mcp-2029 .mcp-pelicula-poster .mcp-imagen,
.mcp-2029 .mcp-pelicula-poster .mcp-imagen-img { border-radius: 19px 19px 0 0; }
.mcp-2029 .mcp-pelicula-poster::after { /* sombra suave abajo del póster para que la insignia se lea */
	content: "";
	position: absolute;
	inset: auto 0 0;
	height: 34%;
	background: linear-gradient(transparent, rgba(0, 0, 0, .45));
	pointer-events: none;
}
.mcp-2029 .mcp-pelicula-clasificacion {
	z-index: 1;
	left: 10px;
	bottom: 10px;
	padding: 3px 8px;
	border-radius: 8px;
	background: rgba(20, 16, 28, .72);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	font-weight: var(--mcp-peso-bold);
	letter-spacing: .02em;
}
.mcp-2029 .mcp-pelicula-datos { gap: 6px; padding: 10px 12px 12px; }
.mcp-2029 .mcp-pelicula-titulo {
	font-family: var(--mcp-2029-display);
	font-size: .9375rem;
	font-weight: 800;
	line-height: 1.2;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.mcp-2029 .mcp-pelicula-enlace:hover { text-decoration: none; }
.mcp-2029 .mcp-pelicula-enlace::after { border-radius: 20px; }
.mcp-2029 .mcp-pelicula-detalle {
	font-size: .75rem;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Etiquetas de formato (2D, 3D, Subtitulada…) en las dos pantallas. */
.mcp-2029 .mcp-formato {
	border: 0;
	border-radius: var(--mcp-radio-pill);
	background: var(--mcp-2029-superficie-2);
	color: var(--mcp-primario-texto);
	font-size: .6875rem;
	font-weight: var(--mcp-peso-bold);
}
.mcp-2029 .mcp-formato--deducido { outline: 1px dashed var(--mcp-borde-control); outline-offset: -1px; }

/* ── Película ──────────────────────────────────────────────────────────────────────────────── */
.mcp-2029 .mcp-ficha-encabezado {
	position: relative;
	padding: 14px;
	border: 1px solid var(--mcp-borde);
	border-radius: 24px;
	background: var(--mcp-superficie);
	box-shadow: var(--mcp-2029-sombra);
}
/* Póster y sinopsis siempre lado a lado (también en 320–360 px), como en el prototipo. */
.mcp-2029 .mcp-ficha-encabezado { grid-template-columns: minmax(5.5rem, 38%) minmax(0, 1fr); gap: 14px; align-items: start; }
.mcp-2029 .mcp-ficha-afiche { max-width: none; }
@media (min-width: 37.5em) { .mcp-2029 .mcp-ficha-encabezado { grid-template-columns: minmax(0, 13rem) minmax(0, 1fr); gap: 18px; } }
.mcp-2029 .mcp-ficha-afiche .mcp-imagen,
.mcp-2029 .mcp-ficha-afiche .mcp-imagen-img { border-radius: 16px; box-shadow: 0 18px 32px -18px rgba(0, 0, 0, .7); }
.mcp-2029 .mcp-ficha-play {
	border: 3px solid rgba(255, 255, 255, .9);
	background: var(--mcp-acento);
	color: var(--mcp-sobre-acento);
	box-shadow: 0 10px 24px -8px rgba(0, 0, 0, .6);
	animation: mcp-2029-late-play 2.4s 1s ease-in-out 3;
}
@keyframes mcp-2029-late-play { 50% { transform: translate(-50%, -50%) scale(1.08); } }
.mcp-2029 .mcp-ficha-play:hover { background: var(--mcp-acento); filter: brightness(1.05); }
.mcp-2029 .mcp-ficha-sinopsis { font-size: .9375rem; }
/* "Ver más": la sinopsis larga arranca en 4 líneas (la clase la pone mcp-2029.js). */
.mcp-2029 .mcp-ficha-sinopsis.mcp-2029-corta {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.mcp-2029-ver-mas {
	margin-top: 4px;
	padding: 6px 0;
	border: 0;
	background: none;
	color: var(--mcp-primario-texto);
	font: inherit;
	font-weight: var(--mcp-peso-bold);
	font-size: .875rem;
	cursor: pointer;
}
.mcp-2029-ver-mas { align-self: flex-start; text-align: left; }
/* El título del bloque de horarios es un título de verdad; los pasos (Versión, Día, Hora) van como etiquetas. */
.mcp-2029 .mcp-funcion-selector > .mcp-ficha-subtitulo {
	margin: 0 0 12px;
	font-family: var(--mcp-2029-display);
	font-size: 1.1875rem;
	font-weight: 800;
	letter-spacing: 0;
	text-transform: none;
	color: var(--mcp-texto);
}
.mcp-2029 .mcp-funcion-dia-unico { font-size: .9375rem; }
.mcp-2029 .mcp-ficha-compartir { border-radius: var(--mcp-radio-pill); border-color: var(--mcp-borde); background: var(--mcp-2029-superficie-2); }
.mcp-2029 .mcp-ficha-datos { gap: 8px; }
.mcp-2029 .mcp-ficha-dato {
	padding: 6px 12px;
	border-radius: var(--mcp-radio-pill);
	background: var(--mcp-superficie);
	border: 1px solid var(--mcp-borde);
	font-size: .8125rem;
	font-weight: var(--mcp-peso-semi);
}
.mcp-2029 .mcp-ficha-subtitulo,
.mcp-2029 .mcp-funcion-paso-titulo {
	font-family: var(--mcp-fuente);
	font-size: .6875rem;
	font-weight: var(--mcp-peso-bold);
	letter-spacing: 1.3px;
	text-transform: uppercase;
	color: var(--mcp-texto-secundario);
}
.mcp-2029 .mcp-funcion-selector {
	padding: 16px;
	border: 1px solid var(--mcp-borde);
	border-radius: 24px;
	background: var(--mcp-superficie);
}
.mcp-2029 .mcp-version-enlace { border-radius: 16px; }
.mcp-2029 .mcp-version.is-activa .mcp-version-enlace { background: var(--mcp-primario); border-color: var(--mcp-primario); color: var(--mcp-sobre-primario); }
/* Horarios en tarjetas: la hora grande, abajo formato y sala. */
.mcp-2029 .mcp-horarios { grid-template-columns: repeat(auto-fill, minmax(6.75rem, 1fr)); gap: 10px; }
.mcp-2029 .mcp-horario-boton {
	min-height: 78px;
	border: 1.5px solid var(--mcp-borde);
	border-radius: 18px;
	background: var(--mcp-2029-superficie-2);
	transition: transform .15s, border-color .2s, box-shadow .2s;
}
.mcp-2029 .mcp-horario-boton:hover:not(.es-agotada) { border-color: var(--mcp-2029-marca-2); box-shadow: 0 0 0 4px var(--mcp-2029-acento-suave); }
.mcp-2029 .mcp-horario-boton:active:not(.es-agotada) { transform: scale(.95); }
.mcp-2029 .mcp-horario-hora { font-family: var(--mcp-2029-display); font-size: 1.125rem; font-weight: 800; color: var(--mcp-texto); }
.mcp-2029 .mcp-horario-marca--pocas {
	padding: 1px 8px;
	border-radius: var(--mcp-radio-pill);
	background: rgba(201, 52, 58, .12);
	color: var(--mcp-error);
}
.mcp-2029 .mcp-horario-marca--preestreno { padding: 1px 8px; border-radius: var(--mcp-radio-pill); background: var(--mcp-2029-acento-suave); color: var(--mcp-acento-texto); }

@media (prefers-reduced-motion: reduce) {
	.mcp-2029 .mcp-pelicula,
	.mcp-2029 .mcp-ficha-play { animation: none; }
}

/* ══ v0.34.4 · FIEL AL PROTOTIPO (pedido de Deiby) ══════════════════════════════════════════ */

/* El cine dentro del encabezado: tarjeta de vidrio con pin, "CINE" y el nombre. */
.mcp-2029 .mcp-pantalla-cartelera .mcp-header { padding-top: calc(10px + env(safe-area-inset-top)); padding-bottom: 16px; row-gap: 14px; }
.mcp-2029-sede {
	order: 11;
	flex: 0 0 100%;
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 10px 12px;
	border: 1px solid rgba(255, 255, 255, .22);
	border-radius: 16px;
	background: rgba(255, 255, 255, .12);
	color: #FFFFFF;
	font: inherit;
	text-align: left;
}
button.mcp-2029-sede { cursor: pointer; }
.mcp-2029-sede svg { flex: none; opacity: .9; }
.mcp-2029-sede-texto { flex: 1; min-width: 0; display: grid; gap: 1px; }
.mcp-2029-sede-kicker { font-size: .6875rem; font-weight: var(--mcp-peso-bold); letter-spacing: 1.3px; text-transform: uppercase; color: #E9DDF7; }
.mcp-2029-sede b { font-family: var(--mcp-2029-display); font-size: 1.0625rem; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mcp-2029-sede-chev { flex: none; font-size: 1.25rem; line-height: 1; }
/* El interruptor claro/oscuro sobre el morado. */
.mcp-2029-switch--marca { border-color: rgba(255, 255, 255, .3); background: rgba(255, 255, 255, .14); }
.mcp-2029-switch--marca .mcp-2029-switch-perilla { font-size: .8125rem; color: var(--mcp-acento); }
.mcp-2029-switch--marca[aria-checked="false"] .mcp-2029-switch-perilla { color: var(--mcp-primario); }
.mcp-2029 .mcp-header .mcp-2029-switch { flex: none; }
/* Hoja "Elija su cine". */
.mcp-2029-opciones { display: grid; gap: 8px; }
.mcp-2029-opcion {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 54px;
	padding: 0 16px;
	border: 1.5px solid var(--mcp-borde);
	border-radius: 16px;
	background: var(--mcp-superficie);
	color: var(--mcp-texto);
	font-weight: var(--mcp-peso-bold);
	text-decoration: none;
}
.mcp-2029-opcion.is-activa { border-color: var(--mcp-primario); background: var(--mcp-2029-acento-suave); }
.mcp-2029-radio { flex: none; width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--mcp-borde-control); }
.mcp-2029-opcion.is-activa .mcp-2029-radio { border: 6px solid var(--mcp-primario); }

/* Los días: chips sueltos, sin la tarjeta blanca alrededor. */
.mcp-2029 .mcp-filtro-cartelera.mcp-2029-filtro-chips { margin: 4px 0 6px; padding: 0; border: 0; background: none; box-shadow: none; }
.mcp-2029 .mcp-2029-filtro-chips .mcp-filtro-titulo { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.mcp-2029 .mcp-2029-filtro-chips .mcp-dias { margin: 0 calc(-1 * var(--mcp-gutter)); padding: 2px var(--mcp-gutter) 6px; }
.mcp-2029 .mcp-dia-enlace { gap: 6px; background: var(--mcp-superficie); }
.mcp-2029 .mcp-dia-enlace small { font-size: .75rem; font-weight: var(--mcp-peso-semi); opacity: .8; }
/* Activos en MORADO, como el prototipo (días, géneros). */
.mcp-2029 .mcp-dia.is-activo .mcp-dia-enlace { background: var(--mcp-primario); color: var(--mcp-sobre-primario); box-shadow: 0 10px 22px -12px var(--mcp-primario); }

/* "En cartelera" con la cuenta a la derecha. */
.mcp-2029-titulo-lista { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin: 18px 0 8px; }
.mcp-2029-titulo-lista h2 { margin: 0; font-size: 1.375rem; font-weight: 800; }
.mcp-2029-titulo-lista .mcp-cartelera-resumen { margin: 0; font-size: .875rem; font-weight: var(--mcp-peso-semi); color: var(--mcp-texto-secundario); text-align: right; }

/* Pósters grandes sin marco de tarjeta; título y datos debajo. */
.mcp-2029 .mcp-pelicula { border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.mcp-2029 .mcp-pelicula-poster .mcp-imagen,
.mcp-2029 .mcp-pelicula-poster .mcp-imagen-img { border-radius: 22px; }
.mcp-2029 .mcp-pelicula-poster { border-radius: 22px; box-shadow: 0 20px 36px -22px rgba(60, 25, 100, .75); }
.mcp-2029 .mcp-pelicula-poster::after { border-radius: 0 0 22px 22px; }
.mcp-2029 .mcp-pelicula-clasificacion { top: 10px; bottom: auto; }
.mcp-2029 .mcp-pelicula-datos { padding: 10px 2px 4px; }
.mcp-2029 .mcp-pelicula-enlace::after { border-radius: 22px; }

/* Teléfonos angostos (iPhone SE, 320–359 px): logo, idioma e interruptor en una sola fila. */
@media (max-width: 359px) {
	.mcp-2029 .mcp-pantalla-cartelera .mcp-header-logo { padding-left: 0; }
	.mcp-2029 .mcp-pantalla-cartelera .mcp-header-logo img { width: min(118px, 36vw); }
	.mcp-2029 .mcp-pantalla-cartelera .mcp-idioma-opcion { padding: 0 7px; }
	.mcp-2029 .mcp-pantalla-cartelera .mcp-header { column-gap: 6px; }
	.mcp-2029-switch--marca { width: 48px; height: 28px; }
	.mcp-2029-switch--marca .mcp-2029-switch-perilla { width: 20px; height: 20px; top: 3px; left: 3px; }
	.mcp-2029-switch--marca[aria-checked="false"] .mcp-2029-switch-perilla { transform: translateX(20px); }
}

/* ══ v0.34.8 · Bienvenida (los mismos pasos, la misma cookie, el mismo carrusel) ═════════════ */
.mcp-2029 .mcp-bienvenida {
	background:
		radial-gradient(circle, rgba(255, 255, 255, .22) 0 3px, transparent 3.5px) 0 10px / 20px 20px repeat-x,
		radial-gradient(circle, rgba(255, 255, 255, .22) 0 3px, transparent 3.5px) 10px calc(100% - 10px) / 20px 20px repeat-x,
		radial-gradient(120% 70% at 85% 0, rgba(242, 138, 30, .28), transparent 60%),
		linear-gradient(165deg, var(--mcp-2029-marca-2), var(--mcp-primario) 55%, #3A1666);
	color: #FFFFFF;
}
.mcp-2029.mcp-tema-oscuro .mcp-bienvenida { background-color: #1B122B; }
.mcp-2029 .mcp-bienvenida-barra { padding-top: calc(28px + env(safe-area-inset-top)); }
.mcp-2029 .mcp-bienvenida-omitir {
	padding: 8px 16px;
	border: 1px solid rgba(255, 255, 255, .3);
	border-radius: var(--mcp-radio-pill);
	background: rgba(255, 255, 255, .14);
	color: #FFFFFF;
	font-weight: var(--mcp-peso-bold);
	text-decoration: none;
}
.mcp-2029 .mcp-bienvenida-titulo { font-family: var(--mcp-2029-display); font-size: 2rem; font-weight: 800; letter-spacing: -.01em; }
.mcp-2029 .mcp-bienvenida-texto { color: rgba(255, 255, 255, .88); font-size: 1rem; }
/* La imagen en una tarjeta de vidrio que flota. */
.mcp-2029 .mcp-bienvenida-imagen,
.mcp-2029 .mcp-bienvenida-campana {
	display: grid;
	place-items: center;
	padding: 18px;
	border: 1px solid rgba(255, 255, 255, .22);
	border-radius: 36px;
	background: rgba(255, 255, 255, .1);
	box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(255, 255, 255, .25);
	animation: mcp-2029-flota 4s ease-in-out infinite;
}
.mcp-2029 .mcp-bienvenida-imagen img { width: min(58vw, 240px, 30dvh); }
@keyframes mcp-2029-flota { 50% { transform: translateY(-8px); } }
/* El botón de seguir, naranja con destello. */
.mcp-2029 .mcp-bienvenida .mcp-boton--acento {
	min-height: 48px;
	border: 0;
	border-radius: 16px;
	background:
		linear-gradient(105deg, transparent 30%, rgba(255, 255, 255, .5) 47%, rgba(255, 240, 210, .6) 50%, transparent 64%) -200% 0 / 200% 100% no-repeat,
		linear-gradient(180deg, #FFA94D, var(--mcp-acento));
	color: #1F1000;
	font-family: var(--mcp-2029-display);
	font-size: 1.0625rem;
	box-shadow: 0 16px 32px -16px rgba(242, 138, 30, .9);
	animation: mcp-2029-brillo-cta 3.6s 1s ease-in-out infinite;
}
.mcp-2029 .mcp-bienvenida .mcp-boton--contorno-acento,
.mcp-2029 .mcp-bienvenida .mcp-boton--secundario { min-height: 48px; border-radius: 16px; border-color: rgba(255, 255, 255, .5); color: #FFFFFF; }
.mcp-2029 .mcp-bienvenida-punto::after { background: rgba(255, 255, 255, .45); }
.mcp-2029 .mcp-bienvenida-punto.is-activo::after { width: 28px; background: var(--mcp-acento); }
@media (prefers-reduced-motion: reduce) {
	.mcp-2029 .mcp-bienvenida-imagen,
	.mcp-2029 .mcp-bienvenida-campana,
	.mcp-2029 .mcp-bienvenida .mcp-boton--acento { animation: none; }
}


/* v0.35.1 · Cartelera: con el botón de instalar visible (iPhone/Android) todo cabe en una fila:
   el logo cede ancho en vez de empujar el botón a una segunda línea. */
.mcp-2029 .mcp-pantalla-cartelera .mcp-header { flex-wrap: wrap; column-gap: 6px; }
.mcp-2029 .mcp-pantalla-cartelera .mcp-header-logo { flex: 1 1 0; min-width: 0; padding-left: 0; }
.mcp-2029 .mcp-pantalla-cartelera .mcp-header-logo img { width: 100%; max-width: 170px; height: auto; }
.mcp-2029 .mcp-pantalla-cartelera .mcp-idioma { margin-left: 0; }

/* v0.35.2 · Un solo día publicado: se ve como dato, no como botón, con una nota que lo explica. */
.mcp-2029 .mcp-2029-dia-unico .mcp-dia.is-activo .mcp-dia-enlace { cursor: default; background: var(--mcp-superficie); color: var(--mcp-primario-texto); border: 1.5px solid var(--mcp-borde); box-shadow: none; }
.mcp-2029 .mcp-2029-dia-unico .mcp-dia.is-activo .mcp-dia-enlace small { color: var(--mcp-texto-secundario); }
.mcp-2029-dia-nota { margin: 8px 0 0; font-size: .8125rem; color: var(--mcp-texto-secundario); }

/* ══ v0.36.4 · Encabezado de la cartelera que se encoge al bajar ═══════════════════════════════
   .mcp-2029-compacto lo pone mcp-2029.js al pasar de 120 px; se quita cerca de arriba. */
.mcp-2029 .mcp-pantalla-cartelera .mcp-header { transition: padding .35s cubic-bezier(.2, .8, .2, 1), border-radius .35s ease, box-shadow .35s ease; }
.mcp-2029 .mcp-pantalla-cartelera .mcp-header-logo img { transition: max-width .35s cubic-bezier(.2, .8, .2, 1); }
.mcp-2029 .mcp-pantalla-cartelera .mcp-2029-sede {
	max-height: 90px;
	overflow: hidden;
	transition: max-height .35s cubic-bezier(.2, .8, .2, 1), opacity .25s ease, margin .35s ease, padding .35s ease, border-width .35s ease;
}
.mcp-2029 .mcp-pantalla-cartelera .mcp-header.mcp-2029-compacto { padding-bottom: 10px; row-gap: 0; border-radius: 0 0 22px 22px; box-shadow: 0 14px 30px -16px rgba(40, 10, 70, .55); }
.mcp-2029 .mcp-pantalla-cartelera .mcp-header.mcp-2029-compacto .mcp-header-logo img { max-width: 124px; }
.mcp-2029 .mcp-pantalla-cartelera .mcp-header.mcp-2029-compacto .mcp-2029-sede {
	max-height: 0;
	margin-top: 0;
	margin-bottom: 0;
	padding-top: 0;
	padding-bottom: 0;
	border-width: 0;
	opacity: 0;
	pointer-events: none;
}
.mcp-2029 .mcp-pantalla-cartelera .mcp-header.mcp-2029-compacto .mcp-2029-luces { display: none; }
@media (prefers-reduced-motion: reduce) {
	.mcp-2029 .mcp-pantalla-cartelera .mcp-header,
	.mcp-2029 .mcp-pantalla-cartelera .mcp-header-logo img,
	.mcp-2029 .mcp-pantalla-cartelera .mcp-2029-sede { transition: none; }
}

/* ══ v0.36.4 · Pausa de las promociones: botoncito redondo ⏸ / ▶ dentro del carrusel ════════════
   Es el MISMO botón de siempre (mcp-front.js cambia su texto y aria-pressed); el texto queda para
   los lectores de pantalla y a la vista se dibuja el ícono. Sigue cumpliendo WCAG 2.2.2. */
.mcp-2029 .mcp-promos-pausa { position: absolute; bottom: 16px; right: calc(12% + 8px); z-index: 2; margin: 0; }
.mcp-2029 .mcp-promos-pausa button {
	position: relative;
	width: 30px;
	height: 30px;
	min-height: 0;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, .35);
	border-radius: 50%;
	background: rgba(20, 8, 35, .45);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	color: transparent;
	font-size: 0;
	box-shadow: 0 6px 14px -8px rgba(0, 0, 0, .6);
	cursor: pointer;
	transition: transform .3s var(--mcp-2029-spring), background-color .2s ease;
}
.mcp-2029 .mcp-promos-pausa button:hover { background: rgba(20, 8, 35, .62); }
.mcp-2029 .mcp-promos-pausa button:active { transform: scale(.9); }
/* Pausa: dos barritas. */
.mcp-2029 .mcp-promos-pausa button::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 10px;
	height: 12px;
	transform: translate(-50%, -50%);
	background: linear-gradient(90deg, #FFFFFF 0 3.5px, transparent 3.5px 6.5px, #FFFFFF 6.5px 10px);
	border-radius: 1px;
}
/* Detenido: triángulo de "seguir". */
.mcp-2029 .mcp-promos-pausa button[aria-pressed="true"]::before {
	width: 11px;
	height: 12px;
	transform: translate(-40%, -50%);
	background: #FFFFFF;
	clip-path: polygon(0 0, 100% 50%, 0 100%);
	border-radius: 0;
}

/* ══ v0.36.4 · La cinta de anuncios: al bajar, los anuncios quedan en pequeñito pasando ═════════
   Va DEBAJO del morado, en una franja neutra (gris claro; gris carbón en oscuro), como una barra
   de "también le puede interesar": el morado queda solo para la marca. */
.mcp-2029 .mcp-pantalla-cartelera .mcp-promos { transform-origin: 50% 0; will-change: transform, opacity; }
.mcp-2029-cinta {
	order: 12;
	flex: 0 0 calc(100% + 28px);
	margin: 0 -14px;
	max-height: 0;
	overflow: hidden;
	opacity: 0;
	background: rgba(246, 244, 249, .97);
	-webkit-backdrop-filter: blur(14px) saturate(1.2);
	backdrop-filter: blur(14px) saturate(1.2);
	border-top: 1px solid rgba(30, 10, 60, .06);
	border-radius: 0 0 22px 22px;
	transition: max-height .45s cubic-bezier(.2, .8, .2, 1), opacity .3s ease, margin .45s ease;
}
.mcp-2029.mcp-tema-oscuro .mcp-2029-cinta { background: rgba(22, 20, 27, .96); border-top-color: rgba(255, 255, 255, .06); }
/* Con la cinta abierta, ella cierra el encabezado por abajo (cubre el relleno morado). */
.mcp-2029 .mcp-header.mcp-2029-compacto.mcp-2029-con-cinta { padding-bottom: 0; }
.mcp-2029 .mcp-header.mcp-2029-compacto .mcp-2029-cinta { max-height: 112px; opacity: 1; margin-top: 10px; }
.mcp-2029-cinta-rotulo {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 10px 18px 6px;
	font-size: .6875rem;
	font-weight: var(--mcp-peso-bold);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--mcp-texto-secundario);
}
.mcp-2029-cinta-rotulo::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--mcp-acento); box-shadow: 0 0 0 3px var(--mcp-2029-acento-suave); }
.mcp-2029-cinta-marco {
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 16px, #000 calc(100% - 16px), transparent);
	mask-image: linear-gradient(90deg, transparent, #000 16px, #000 calc(100% - 16px), transparent);
}
.mcp-2029-cinta-marco { padding: 2px 0 12px 14px; }
/* v0.36.7 · La vuelta sin salto: sin `gap` ni relleno en la pista (el espacio va DENTRO de cada
   tarjeta, como margen derecho), así la mitad de la pista mide exactamente una vuelta y el
   reinicio de la animación cae en el mismo punto. Y tamaño fijo: la fila no cambia de largo
   cuando llegan las imágenes. */
.mcp-2029-cinta-pista {
	display: flex;
	gap: 0;
	width: max-content;
	padding: 0;
	animation: mcp-2029-cinta var(--mcp-2029-cinta-seg, 20s) linear infinite;
}
.mcp-2029-cinta:hover .mcp-2029-cinta-pista,
.mcp-2029-cinta--quieta .mcp-2029-cinta-pista,
.mcp-2029-cinta--una .mcp-2029-cinta-pista { animation-play-state: paused; }
.mcp-2029-cinta--quieta .mcp-2029-cinta-marco, .mcp-2029-cinta--una .mcp-2029-cinta-marco { overflow-x: auto; scrollbar-width: none; }
.mcp-2029-cinta--quieta .mcp-2029-cinta-marco::-webkit-scrollbar { display: none; }
@keyframes mcp-2029-cinta { from { transform: translateX(0); } to { transform: translateX(var(--mcp-2029-cinta-vuelta, -50%)); } }
.mcp-2029-cinta-item {
	flex: none;
	width: 96px;
	height: 58px;
	margin-right: 10px;
	padding: 4px;
	border: 1px solid var(--mcp-borde);
	border-radius: 14px;
	background: var(--mcp-superficie);
	box-shadow: 0 6px 14px -10px rgba(30, 10, 60, .45);
	cursor: pointer;
}
.mcp-2029.mcp-tema-oscuro .mcp-2029-cinta-item { background: #221F29; border-color: rgba(255, 255, 255, .08); box-shadow: 0 6px 14px -10px rgba(0, 0, 0, .8); }
.mcp-2029-cinta-item img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 10px; background: var(--mcp-2029-superficie-2); }
/* Al aparecer, cada miniatura llega "achicándose" desde grande, una tras otra. */
.mcp-2029 .mcp-header.mcp-2029-compacto .mcp-2029-cinta-item { animation: mcp-2029-mini-llega .5s cubic-bezier(.2, .8, .2, 1) both; animation-delay: calc(var(--i, 0) * 60ms); }
@keyframes mcp-2029-mini-llega { from { transform: scale(1.6) translateY(-18px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
	.mcp-2029-cinta-pista { animation: none; }
	.mcp-2029-cinta-marco { overflow-x: auto; scrollbar-width: none; }
	.mcp-2029-cinta { transition: none; }
	.mcp-2029 .mcp-header.mcp-2029-compacto .mcp-2029-cinta-item { animation: none; }
}

/* v0.36.11 · La salida de la Bienvenida responde al toque (se hunde y se apaga un poco mientras
   llega la Cartelera, con el loader encima). */
.mcp-2029 .mcp-bienvenida .mcp-2029-yendo { transform: scale(.95); opacity: .75; transition: transform .15s ease, opacity .15s ease; pointer-events: none; }

/* ══ v0.36.12 · Cartelera en pausa: amable, no alarma ══════════════════════════════════════════
   Claqueta que se balancea bajo una luz de proyector, con palomitas que suben. */
.mcp-2029 .mcp-cine-pausa { padding: 28px 20px 24px; gap: 10px; text-align: center; }
.mcp-cine-pausa-arte { position: relative; display: grid; place-items: center; width: 168px; height: 150px; margin: 0 auto 6px; }
.mcp-cine-pausa-luz { position: absolute; inset: 0; border-radius: 50%; background: radial-gradient(circle, var(--mcp-2029-acento-suave) 0, transparent 68%); animation: mcp-2029-luz-respira 3.2s ease-in-out infinite; }
.mcp-cine-pausa-claqueta { position: relative; display: grid; place-items: center; width: 112px; height: 112px; border-radius: 32px; background: linear-gradient(150deg, var(--mcp-2029-marca-2), var(--mcp-primario)); color: #FFFFFF; box-shadow: 0 20px 40px -18px var(--mcp-primario); transform-origin: 50% 90%; animation: mcp-2029-claqueta 2.8s ease-in-out infinite; }
.mcp-cine-pausa-claqueta svg { width: 58px; height: 58px; }
.mcp-cine-pausa-palomita { position: absolute; bottom: 18px; width: 12px; height: 12px; border-radius: 50% 45% 50% 40%; background: #FFF4DF; box-shadow: inset -2px -2px 0 rgba(242, 138, 30, .35), 0 2px 4px rgba(0, 0, 0, .12); opacity: 0; animation: mcp-2029-palomita-sube 3s ease-out infinite; }
.mcp-cine-pausa-palomita:nth-of-type(1) { left: 26px; animation-delay: .2s; }
.mcp-cine-pausa-palomita:nth-of-type(2) { right: 30px; animation-delay: 1.2s; width: 10px; height: 10px; }
.mcp-cine-pausa-palomita:nth-of-type(3) { left: 50%; animation-delay: 2.1s; width: 9px; height: 9px; }
@keyframes mcp-2029-claqueta { 0%, 100% { transform: rotate(-4deg); } 50% { transform: rotate(4deg) translateY(-4px); } }
@keyframes mcp-2029-luz-respira { 0%, 100% { transform: scale(.9); opacity: .7; } 50% { transform: scale(1.08); opacity: 1; } }
@keyframes mcp-2029-palomita-sube { 0% { transform: translateY(0) rotate(0); opacity: 0; } 15% { opacity: 1; } 100% { transform: translateY(-110px) rotate(200deg); opacity: 0; } }
.mcp-2029 .mcp-cine-pausa .mcp-estado-titulo { margin: 4px 0 0; font-family: var(--mcp-2029-display); font-size: 1.375rem; font-weight: 800; color: var(--mcp-texto); }
.mcp-2029 .mcp-cine-pausa .mcp-estado-texto { max-width: 30ch; margin: 0 auto; color: var(--mcp-texto-secundario); line-height: 1.5; }
.mcp-2029 .mcp-cine-pausa .mcp-estado-acciones { margin-top: 10px; }
.mcp-cine-pausa-auto { margin: 4px 0 0; font-size: .8125rem; font-weight: var(--mcp-peso-semi); color: var(--mcp-primario-texto); font-variant-numeric: tabular-nums; }
.mcp-2029 .mcp-cine-pausa-ref { margin-top: 14px; font-size: .6875rem; color: var(--mcp-texto-secundario); opacity: .75; }
@media (prefers-reduced-motion: reduce) {
	.mcp-cine-pausa-luz, .mcp-cine-pausa-claqueta, .mcp-cine-pausa-palomita { animation: none; }
}