/**
 * Home 2026 — estilos propios (el chrome vive en chrome-2026.css).
 *
 * Reunión de gerencia 18-09-2026: hero a sangre (referencia Cadence), más aire entre
 * secciones (112px en escritorio, 60px en móvil), sin "///", y secciones nuevas:
 * combos por objetivo, por deporte y tiendas en tarjetas.
 */

.mpsh-b { font-weight: 800; }
.mpsh-l { font-weight: 300; }
.mpsh-l em, .mpsh-b em { color: #C73D2C; font-style: normal; }

/* El tema viejo inyecta align-items:center a <section> y flex-direction:column a sus
   hijos: cada contenedor flex declara dirección y alineación explícitas. */
.mpsh-vendidos, .mpsh-testimonios, .mpsh-combos, .mpsh-deportes, .mpsh-estandar, .mpsh-tiendas, .mpsh-atletas { align-items: stretch; }
.mpsh-sec-head { display: flex; flex-direction: row; align-items: flex-end; justify-content: space-between; gap: 24px; width: 100%; }
.mpsh-sec-nota { margin: 0; font-size: 14px; line-height: 1.6; color: #8A8782; max-width: 400px; text-align: right; }
.mpsh-grid4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
.mpsh-grid3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
@media (max-width: 980px) { .mpsh-grid4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .mpsh-grid3 { grid-template-columns: minmax(0, 1fr); } }
.mpsh-estrellas { color: #C73D2C; font-size: 13px; letter-spacing: 3px; }

/* ---- Barra de promo (sticky sobre el nav; apagada por defecto) ---- */

.mpsh-promo {
	position: sticky; top: 0; z-index: 101;
	display: flex; flex-direction: row; width: 100%; align-items: center; justify-content: center; gap: 16px;
	background: #C73D2C; color: #FFFFFF; text-decoration: none; padding: 12px 20px; transition: background-color .15s ease;
}
.mpsh-promo:hover { background: #B23425; color: #FFFFFF; }
.mpsh-promo-fuerte { font-size: 13.5px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em; }
.mpsh-promo-detalle { font-size: 12.5px; font-weight: 500; color: #FFD9D3; }
.mpsh-promo-cta { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; text-decoration: underline; }
body.admin-bar .mpsh-promo { top: 32px; }
.mpsh-promo ~ .mpsc-sticky { top: 44px; }
body.admin-bar .mpsh-promo ~ .mpsc-sticky { top: 76px; }

/* ======================================================================
 * HERO — foto a sangre, texto abajo a la izquierda, prueba social arriba del titular.
 * Por defecto: slideshow de atletas (fotos verticales) a la derecha, fundido al negro
 * hacia el texto. Con .mpsh-hero-ancho (foto horizontal o video cargados en ACF) la
 * imagen ocupa todo el ancho, como la referencia.
 * ==================================================================== */

.mpsh-hero {
	position: relative; overflow: hidden; isolation: isolate;
	display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end;
	min-height: clamp(600px, calc(100vh - 170px), 780px);
	padding: 120px max(56px, calc(50% - 664px)) 76px;
	background-color: #0B0B0B; color: #FFFFFF;
	background-image: radial-gradient(rgba(255,255,255,0.05) 1px, transparent 1.2px); background-size: 3px 3px;
}
.mpsh-hero-media {
	position: absolute; top: 0; right: 0; bottom: 0; width: 60%; z-index: -2;
	/* La foto se funde con la trama de puntos del hero (sin costura vertical donde empieza). */
	-webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 34%); mask-image: linear-gradient(90deg, transparent 0%, #000 34%);
}
.mpsh-hero-ancho .mpsh-hero-media { width: 100%; background: #0B0B0B; -webkit-mask-image: none; mask-image: none; }
.mpsh-slides { position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
.mps-2026 .mpsh-slides img, .mps-2026 .mpsh-hero-fondo img, .mps-2026 .mpsh-hero-video {
	position: absolute; top: 0; left: 0; width: 100%; height: 100%; max-width: none; margin: 0; border-radius: 0;
	object-fit: cover; object-position: center 22%; display: block; pointer-events: none;
}
.mpsh-hero-fondo { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: block; }
.mps-2026 .mpsh-hero-fondo img, .mps-2026 .mpsh-hero-video { object-position: 62% 14%; }
/* Slideshow: fundido cruzado + Ken Burns lento (la animación que se pidió conservar). */
.mps-2026 .mpsh-slides img {
	filter: contrast(1.05) saturate(0.92); opacity: 0; transform: scale(1);
	transition: opacity 1.1s ease, transform 6s linear;
}
.mps-2026 .mpsh-slides img.mpsh-slide-on { opacity: 1; transform: scale(1.07); }
/* Foto horizontal fija: el mismo Ken Burns, en bucle suave. */
.mps-2026 .mpsh-hero-fondo img { animation: mpsh-kenburns 18s ease-in-out infinite alternate; }
@keyframes mpsh-kenburns { from { transform: scale(1); } to { transform: scale(1.08); } }
/* El Ken Burns crece hacia la cara, no hacia el centro (que en pantallas anchas es el torso). */
.mps-2026 .mpsh-hero-fondo img { transform-origin: 75% 18%; }

.mpsh-hero-velo {
	position: absolute; top: 0; right: 0; bottom: 0; left: 0;
	background:
		linear-gradient(90deg, rgba(11,11,11,0.6) 0%, rgba(11,11,11,0) 55%),
		linear-gradient(180deg, rgba(11,11,11,0.35) 0%, rgba(11,11,11,0) 28%, rgba(11,11,11,0) 58%, rgba(11,11,11,0.78) 100%);
}
.mpsh-hero-ancho .mpsh-hero-velo {
	background:
		linear-gradient(90deg, rgba(11,11,11,0.86) 0%, rgba(11,11,11,0.5) 38%, rgba(11,11,11,0) 72%),
		linear-gradient(180deg, rgba(11,11,11,0.3) 0%, rgba(11,11,11,0) 30%, rgba(11,11,11,0) 55%, rgba(11,11,11,0.75) 100%);
}
/* Brillo rojo FIJO detrás del titular (21-09: ya no sigue al mouse). Trama de puntos rojos
   recortada por un círculo difuso centrado en el bloque de texto, más un halo suave. El centro se
   calcula desde el mismo margen que el texto, así acompaña al titular en cualquier ancho. */
.mpsh-hero-glow {
	--gx: calc(max(56px, 50% - 664px) + 380px); --gy: 46%; --gr: 420px;
	position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: -1; pointer-events: none;
	background-image:
		radial-gradient(rgba(199,61,44,0.82) 1px, transparent 1.35px),
		radial-gradient(var(--gr) circle at var(--gx) var(--gy), rgba(199,61,44,0.16), rgba(199,61,44,0.05) 55%, transparent 80%);
	background-size: 3px 3px, 100% 100%; background-repeat: repeat, no-repeat;
	-webkit-mask-image: radial-gradient(var(--gr) circle at var(--gx) var(--gy), #000 0%, rgba(0,0,0,0.72) 28%, rgba(0,0,0,0.32) 55%, rgba(0,0,0,0.08) 74%, transparent 88%);
	mask-image: radial-gradient(var(--gr) circle at var(--gx) var(--gy), #000 0%, rgba(0,0,0,0.72) 28%, rgba(0,0,0,0.32) 55%, rgba(0,0,0,0.08) 74%, transparent 88%);
	filter: drop-shadow(0 0 10px rgba(199,61,44,0.3));
	animation: mpsh-glow-in 1.4s ease .25s both;
}
@keyframes mpsh-glow-in { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .mpsh-hero-glow { animation: none; } }

.mpsh-hero-txt { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 22px; width: 100%; max-width: 860px; }
@media (min-width: 901px) { .mpsh-hero-txt h1 .mpsh-l { white-space: nowrap; } }
.mpsh-hero-rating { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 8px 12px; font-size: 13.5px; font-weight: 600; color: #FFFFFF; letter-spacing: 0.01em; }
.mpsh-hero-estrellas { color: #C73D2C; font-size: 17px; letter-spacing: 3px; line-height: 1; }
.mps-2026 .mpsh-hero-txt h1 {
	margin: 0; color: #FFFFFF; text-transform: uppercase; letter-spacing: -0.025em; line-height: 0.95;
	font-size: clamp(46px, 5.6vw, 86px);
}
.mpsh-hero-bajada { margin: 0; font-size: 19px; line-height: 1.5; font-weight: 400; color: #E4E2E0; max-width: 520px; }
.mps-2026 .mpsh-hero-valores { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: row; flex-wrap: wrap; gap: 8px 22px; }
.mps-2026 .mpsh-hero-valores li {
	position: relative; margin: 0; padding: 0 0 0 20px; list-style: none;
	font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: #FFFFFF;
}
.mpsh-hero-valores li::before {
	content: ""; position: absolute; left: 0; top: 50%; width: 9px; height: 5px; margin-top: -5px;
	border-left: 2px solid #C73D2C; border-bottom: 2px solid #C73D2C; transform: rotate(-45deg);
}
.mpsh-hero-ctas { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 14px; margin-top: 8px; }
.mpsh-hero-ctas .mpsc-btn { height: 58px; padding: 0 32px; font-size: 14.5px; }
.mpsh-hero-ayuda { margin-top: -6px; font-size: 13.5px; font-weight: 500; color: #D6D4D1; text-decoration: underline; text-decoration-color: rgba(255,255,255,0.35); text-underline-offset: 4px; transition: color .15s ease; }
.mpsh-hero-ayuda:hover { color: #FFFFFF; text-decoration-color: #C73D2C; }

.mpsh-hero-tag { position: absolute; right: max(56px, calc(50% - 664px)); bottom: 40px; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; z-index: 2; }

/* ---- Video del hero: SOLO escritorio (21-09) ----
   El póster es la foto de escritorio (primer cuadro del bucle); el video entra encima con un fundido
   cuando ya está reproduciendo (.mpsh-video-on la pone home-2026.js) y el Ken Burns de la foto se
   apaga para que no haya salto entre la foto y el primer cuadro. */
.mps-2026 .mpsh-hero-video { opacity: 0; transition: opacity .6s ease; }
.mpsh-video-on .mpsh-hero-video { opacity: 1; }
@media (min-width: 901px) {
	.mps-2026 .mpsh-hero-con-video .mpsh-hero-fondo img { animation: none; transform: none; }
	/* El comercial lleva sujetos y logo en x ≈ 72 % y a media altura: el recorte 62 % 14 % era para la foto
	   de José (cabeza arriba). Póster y video comparten encuadre para que no haya salto al arrancar. */
	.mps-2026 .mpsh-hero-con-video .mpsh-hero-fondo img, .mps-2026 .mpsh-hero-con-video .mpsh-hero-video { object-position: 70% 45%; }
}
/* Sin botón de pausa (Luis, 21-09). Quien tiene "reducir movimiento" en su sistema no recibe el video (lo decide el JS). */
@media (max-width: 900px) {
	.mps-2026 .mpsh-hero-video { display: none !important; }
	/* Teléfono: solo si hay versión vertical (data-src-movil). Es un recorte 608x1080 ya centrado en los sujetos. */
	.mps-2026 .mpsh-hero-video-movil .mpsh-hero-video { display: block !important; object-position: 50% 45%; }
	.mps-2026 .mpsh-hero-video-movil .mpsh-hero-fondo img { animation: none; transform: none; object-position: 50% 45%; }
}
.mpsh-hero-tag > span:first-child {
	background: rgba(11,11,11,0.72); color: #FFFFFF; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em;
	padding: 6px 10px; border-radius: 2px;
}
.mpsh-dots { display: flex; flex-direction: row; gap: 6px; }
.mps-2026 .mpsh-dots button {
	-webkit-appearance: none; appearance: none; display: block;
	width: 8px; height: 8px; min-width: 0; min-height: 0; margin: 0; padding: 0; border-radius: 999px; border: none; box-shadow: none; cursor: pointer;
	background: rgba(255,255,255,0.65); transition: width .3s ease, background-color .3s ease;
}
.mps-2026 .mpsh-dots button.mpsh-dot-on { width: 22px; background: #C73D2C; }
.mps-2026 .mpsh-dots button:focus-visible { outline: 2px solid #FFFFFF !important; outline-offset: 3px; }

/* Entrada escalonada del texto. La clase la pone un script en linea al abrir <body> (sin
   parpadeo) y la animacion es CSS puro: si el JS del home no carga, el texto igual aparece. */
.mpsh-hero-listo .mpsh-hero-txt [data-sube] { opacity: 0; transform: translateY(22px); animation: mpsh-sube .8s cubic-bezier(0,0,0.3,1) forwards; }
.mpsh-hero-listo .mpsh-hero-txt [data-sube]:nth-child(1) { animation-delay: .10s; }
.mpsh-hero-listo .mpsh-hero-txt [data-sube]:nth-child(2) { animation-delay: .20s; }
.mpsh-hero-listo .mpsh-hero-txt [data-sube]:nth-child(3) { animation-delay: .32s; }
.mpsh-hero-listo .mpsh-hero-txt [data-sube]:nth-child(4) { animation-delay: .42s; }
.mpsh-hero-listo .mpsh-hero-txt [data-sube]:nth-child(5) { animation-delay: .52s; }
.mpsh-hero-listo .mpsh-hero-txt [data-sube]:nth-child(6) { animation-delay: .62s; }
@keyframes mpsh-sube { to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
	.mpsh-hero-listo .mpsh-hero-txt [data-sube] { opacity: 1; transform: none; animation: none; }
	.mps-2026 .mpsh-slides img { transition: opacity .4s ease; transform: none !important; }
	.mps-2026 .mpsh-hero-fondo img { animation: none; }
}

/* ---- Los más vendidos ---- */

.mpsh-vendidos { padding: 112px max(56px, calc(50% - 664px)); display: flex; flex-direction: column; gap: 32px; }
.mpsh-tabs { display: flex; flex-direction: row; align-items: stretch; gap: 26px; border-bottom: 1px solid #E4E2E0; flex-wrap: wrap; width: 100%; }
.mps-2026 .mpsh-tab {
	-webkit-appearance: none; appearance: none;
	display: inline-flex; flex-direction: row; width: auto; min-width: 0; min-height: 0; flex: 0 0 auto;
	background: none; border: none; border-radius: 0; box-shadow: none; border-bottom: 2.5px solid transparent; margin: 0 0 -1px; padding: 0 2px 12px; cursor: pointer;
	font-size: 13.5px; font-weight: 600; line-height: 1.2; text-transform: uppercase; letter-spacing: 0.04em; color: #8A8782; transition: color .15s ease;
}
.mps-2026 .mpsh-tab:hover { color: #111111; background: none; }
.mps-2026 .mpsh-tab-on { border-bottom-color: #C73D2C; font-weight: 800; color: #111111; }
.mpsh-panel { display: none; width: 100%; }
.mpsh-panel-on { display: grid; }
.mpsh-nota { width: 100%; margin: 0; font-size: 12px; color: #8A8782; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; }

/* ---- Arma tu combo (lleva al test) ---- */

.mpsh-asesoria {
	/* padding 0 explícito: Automatic.css le pone 90px/60px a toda <section> (QA 21-09). */
	margin: 0 max(56px, calc(50% - 664px)) 112px; padding: 0; background: #0B0B0B; border-radius: 6px; overflow: hidden;
	/* La trama va en todo el bloque (no solo en el texto): así la foto se funde sin costura. */
	background-image: radial-gradient(rgba(255,255,255,0.05) 1px, transparent 1.2px); background-size: 3px 3px;
	display: grid; grid-template-columns: 1.35fr 1fr; align-items: stretch;
}
@media (max-width: 980px) { .mpsh-asesoria { grid-template-columns: minmax(0, 1fr); } }
.mpsh-asesoria-txt {
	padding: 72px 64px; display: flex; flex-direction: column; gap: 20px; align-items: flex-start; justify-content: center;
}
.mpsh-asesoria-txt .mpsc-eyebrow { color: #C73D2C; }
.mpsh-asesoria-titulo { font-size: 52px; line-height: 0.95; letter-spacing: -0.02em; text-transform: uppercase; color: #FFFFFF; }
.mpsh-asesoria-txt p { margin: 0; font-size: 15.5px; line-height: 1.65; color: #B5B3AF; max-width: 460px; }
/* Incentivo "en chiquito" (pizarra): una pastilla, no un titular. */
.mpsh-asesoria-etiqueta {
	display: inline-flex; flex-direction: row; align-items: center; gap: 8px;
	border: 1px solid #2A2A2A; border-radius: 999px; padding: 7px 14px;
	font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: #FFFFFF;
}
.mpsh-asesoria-etiqueta::before { content: ""; width: 7px; height: 7px; border-radius: 999px; background: #C73D2C; flex: none; }
.mpsh-asesoria-ctas { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 14px 24px; margin-top: 6px; }
.mpsh-asesoria-alt { color: #FFFFFF; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; text-decoration: underline; text-underline-offset: 4px; }
.mpsh-asesoria-alt:hover { color: #C73D2C; }
.mpsh-asesoria-foto { position: relative; min-height: 380px; overflow: hidden; }
.mps-2026 .mpsh-asesoria-foto img {
	position: absolute; top: 0; left: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: top; display: block;
	filter: contrast(1.05) saturate(0.92); transform-origin: center; will-change: transform;
}
.mpsh-asesoria-foto span { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(90deg, rgba(11,11,11,0.55) 0%, rgba(11,11,11,0) 45%); }
/* Foto del combo (QA 21-09): la pared vacía de arriba y el borde oscuro de la foto se veían como una
   franja negra entre el texto y la imagen. La foto se funde con la trama del panel (máscara a la
   izquierda), sin velo encima, y el zoom con scroll apunta a los productos. */
.mpsh-asesoria-foto:has(img[src*="combo-bascula-plan"]) span { display: none; }
.mps-2026 .mpsh-asesoria-foto img[src*="combo-bascula-plan"] {
	object-position: 58% 78%; transform-origin: 62% 80%;
	-webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 26%); mask-image: linear-gradient(90deg, transparent 0%, #000 26%);
}

/* ---- Lo que dicen los clientes ---- */

.mpsh-testimonios { background: #F5F4F2; border-top: 1px solid #E4E2E0; border-bottom: 1px solid #E4E2E0; padding: 112px max(56px, calc(50% - 664px)); display: flex; flex-direction: column; gap: 44px; }
.mpsh-social { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; font-size: 13.5px; font-weight: 600; color: #111111; text-align: right; }
.mpsh-social .mpsh-estrellas { font-size: 18px; }
.mpsh-testimonio { margin: 0; background: #FFFFFF; border: 1px solid #E4E2E0; border-radius: 6px; padding: 30px; display: flex; flex-direction: column; gap: 18px; }
.mpsh-testimonio blockquote { margin: 0; padding: 0; border: 0; font-size: 15.5px; line-height: 1.65; color: #111111; font-style: normal; }
.mpsh-testimonio figcaption { margin-top: auto; display: flex; flex-direction: column; gap: 3px; }
.mpsh-testimonio figcaption b { font-weight: 700; font-size: 14px; }
.mpsh-testimonio figcaption span { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.1em; color: #8A8782; }

/* ---- Combos por objetivo ---- */

.mpsh-combos { padding: 112px max(56px, calc(50% - 664px)); display: flex; flex-direction: column; gap: 44px; }
.mpsh-combos-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; align-items: stretch; }
@media (max-width: 1240px) { .mpsh-combos-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.mpsh-combo {
	display: flex; flex-direction: column; align-items: stretch; min-width: 0;
	background: #FFFFFF; border: 1px solid #E4E2E0; border-radius: 6px; overflow: hidden;
	transition: border-color .15s ease, box-shadow .25s ease;
}
.mpsh-combo:hover { border-color: #111111; box-shadow: 0 10px 28px rgba(17,17,17,0.08); }
.mpsh-combo-cab { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 24px 22px 20px; background: #0B0B0B; color: #FFFFFF; background-image: radial-gradient(rgba(255,255,255,0.05) 1px, transparent 1.2px); background-size: 3px 3px; }
.mpsh-combo-num { font-size: 11px; font-weight: 700; letter-spacing: 0.1em; color: #C73D2C; }
.mps-2026 .mpsh-combo-cab h3 { margin: 0; font-size: 22px; line-height: 1.05; font-weight: 800; text-transform: uppercase; letter-spacing: -0.01em; color: #FFFFFF; }
.mpsh-combo-cab p { margin: 0; font-size: 12.5px; line-height: 1.5; color: #9A9A9A; min-height: 38px; }
/* Cabecera con la foto del combo (Higgsfield): los botes quedan a la derecha, el título abajo sobre el velo. */
.mpsh-combo-con-foto .mpsh-combo-cab { position: relative; overflow: hidden; justify-content: flex-end; min-height: 340px; padding-top: 22px; background-image: none; }
.mps-2026 .mpsh-combo-foto { position: absolute; top: 0; left: 0; width: 100%; height: 62%; max-width: none; margin: 0; object-fit: cover; object-position: 80% 50%; transition: transform .6s ease; transform-origin: 70% 60%; }
.mpsh-combo:hover .mpsh-combo-foto { transform: scale(1.05); }
/* El título va sobre negro sólido, debajo de la foto: no tapa los botes. */
.mpsh-combo-velo { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(0deg, #0B0B0B 0%, #0B0B0B 38%, rgba(11,11,11,0) 58%); }
.mpsh-combo-con-foto .mpsh-combo-num, .mpsh-combo-con-foto .mpsh-combo-cab h3, .mpsh-combo-con-foto .mpsh-combo-cab p { position: relative; z-index: 1; }
.mpsh-combo-con-foto .mpsh-combo-cab p { color: #D6D4D1; }
/* Cuerpo = solo precio, ahorro y botón (las presentaciones se eligen en la ventana al agregar). */
.mpsh-combo-cuerpo { display: flex; flex-direction: column; align-items: stretch; justify-content: flex-end; gap: 14px; flex: 1; padding: 20px 22px 22px; background: #FFFFFF; }
.mps-2026 .mpsh-combo-prods { list-style: none; margin: 0; padding: 6px 22px; display: flex; flex-direction: column; align-items: stretch; flex: 1; }
.mps-2026 .mpsh-combo-prod { list-style: none; margin: 0; padding: 14px 0; display: grid; grid-template-columns: 62px minmax(0, 1fr); gap: 14px; align-items: center; border-bottom: 1px solid #F0EFED; }
.mps-2026 .mpsh-combo-prod:last-child { border-bottom: 0; }
.mpsh-combo-img { display: block; width: 62px; height: 62px; border: 1px solid #F0EFED; border-radius: 4px; background: #FFFFFF; overflow: hidden; }
.mps-2026 .mpsh-combo-img img { display: block; width: 100%; height: 100%; max-width: none; object-fit: contain; padding: 4px; }
.mpsh-combo-info { display: flex; flex-direction: column; align-items: stretch; gap: 6px; min-width: 0; }
.mpsh-combo-nombre { font-size: 13px; font-weight: 700; line-height: 1.25; text-transform: uppercase; letter-spacing: -0.005em; color: #111111; text-decoration: none; overflow-wrap: anywhere; }
.mpsh-combo-nombre:hover { color: #C73D2C; }
.mpsh-combo-unica { font-size: 12.5px; font-weight: 600; color: #8A8782; }
.mps-2026 .mpsh-combo-sel {
	-webkit-appearance: none; appearance: none; display: block; width: 100%; min-width: 0; height: 36px; margin: 0; padding: 0 30px 0 10px;
	border: 1px solid #E4E2E0; border-radius: 2px; box-shadow: none; background-color: #FFFFFF; color: #111111;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 5'%3E%3Cpath d='M0 0h8L4 5z' fill='%23111111'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-position: right 11px center; background-size: 8px 5px;
	font-size: 12.5px; font-weight: 600; line-height: normal; text-overflow: ellipsis; cursor: pointer;
}
.mps-2026 .mpsh-combo-sel:focus-visible { outline: 2px solid #C73D2C !important; outline-offset: 1px; }
.mpsh-combo-pie { display: flex; flex-direction: column; align-items: stretch; gap: 12px; padding: 18px 22px 22px; border-top: 1px solid #E4E2E0; background: #FAFAF9; }
.mpsh-combo-total { display: flex; flex-direction: row; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.mpsh-combo-total > span { width: 100%; font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: #8A8782; }
.mpsh-combo-total b { font-size: 26px; font-weight: 800; letter-spacing: -0.02em; color: #111111; line-height: 1; }
.mpsh-combo-total del { font-size: 14px; color: #8A8782; text-decoration: line-through; }
.mpsh-combo-total i { font-style: normal; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #C73D2C; }
.mpsh-combo-total [hidden] { display: none; }
.mps-2026 .mpsh-combo-btn {
	-webkit-appearance: none; appearance: none;
	display: flex; flex-direction: row; align-items: center; justify-content: center; width: 100%; min-width: 0; height: 50px; margin: 0; padding: 0 14px;
	background: #C73D2C; color: #FFFFFF; border: 0; border-radius: 2px; box-shadow: none; cursor: pointer;
	font-size: 12.5px; font-weight: 700; line-height: 1.1; text-transform: uppercase; letter-spacing: 0.04em; text-align: center;
	transition: background-color .15s ease;
}
.mps-2026 .mpsh-combo-btn:hover { background: #B23425; color: #FFFFFF; }
.mps-2026 .mpsh-combo-btn:focus-visible { outline: 2px solid #111111 !important; outline-offset: 2px; }
.mps-2026 .mpsh-combo-btn[disabled] { background: #111111; cursor: progress; }
.mps-2026 .mpsh-combo-btn.mps-combo-ok { background: #111111; }
.mpsh-combo-aviso { margin: 0; font-size: 12px; line-height: 1.45; color: #C73D2C; font-weight: 600; }
.mpsh-combo-aviso[hidden] { display: none; }
.mpsh-combo-ver { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #111111; text-decoration: none; }
.mpsh-combo-ver:hover { color: #C73D2C; }

/* ---- Por deporte ---- */

.mpsh-deportes { padding: 0 max(56px, calc(50% - 664px)) 112px; display: flex; flex-direction: column; gap: 44px; }
.mpsh-deportes-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.mpsh-deporte {
	position: relative; display: flex; flex-direction: column; align-items: stretch; justify-content: flex-end; min-width: 0;
	height: 340px; border-radius: 6px; overflow: hidden; background-color: #0B0B0B; color: #FFFFFF; text-decoration: none;
	background-image: radial-gradient(rgba(255,255,255,0.06) 1px, transparent 1.2px); background-size: 3px 3px;
}
.mpsh-deporte:hover { color: #FFFFFF; }
.mpsh-deporte-foto { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-size: cover; background-position: center 20%; opacity: 0.9; filter: contrast(1.05) saturate(0.9); transition: transform .45s ease; }
.mpsh-deporte:hover .mpsh-deporte-foto { transform: scale(1.05); }
.mpsh-deporte-velo { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(180deg, rgba(11,11,11,0.1) 0%, rgba(11,11,11,0) 35%, rgba(11,11,11,0.9) 100%); }
.mpsh-deporte-sinfoto .mpsh-deporte-velo { background: linear-gradient(135deg, rgba(199,61,44,0.16) 0%, rgba(11,11,11,0) 55%); }
.mpsh-deporte-num { position: absolute; top: 20px; left: 22px; font-size: 40px; font-weight: 300; line-height: 1; color: rgba(255,255,255,0.55); }
.mpsh-deporte-txt { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 22px; }
.mpsh-deporte-txt b { font-size: 22px; font-weight: 800; line-height: 1.05; text-transform: uppercase; letter-spacing: -0.01em; }
.mpsh-deporte-txt span { font-size: 13px; line-height: 1.5; color: #D6D4D1; }
.mpsh-deporte-txt i { font-style: normal; margin-top: 6px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: #C73D2C; transition: transform .2s ease; }
.mpsh-deporte:hover .mpsh-deporte-txt i { transform: translateX(4px); }
.mpsh-deporte:focus-visible { outline: 2px solid #C73D2C !important; outline-offset: 3px; }

/* ---- El Estándar MPS ---- */

.mpsh-estandar { background: #0B0B0B; color: #FFFFFF; padding: 112px max(56px, calc(50% - 664px)); display: flex; flex-direction: column; gap: 64px; }
.mpsh-estandar-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 80px; align-items: start; }
@media (max-width: 980px) { .mpsh-estandar-grid { grid-template-columns: minmax(0, 1fr); gap: 36px; } }
.mpsh-estandar-izq { display: flex; flex-direction: column; align-items: flex-start; gap: 28px; position: sticky; top: 130px; }
.mpsh-estandar-izq > p { margin: 0; font-size: 17px; line-height: 1.65; color: #B5B3AF; max-width: 480px; }
.mpsh-reglas { display: flex; flex-direction: column; align-items: stretch; border-top: 1px solid #1E1E1E; }
.mpsh-regla { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 16px; padding: 26px 0; border-bottom: 1px solid #1E1E1E; }
.mpsh-regla > span:first-child { font-size: 13px; font-weight: 700; color: #C73D2C; letter-spacing: 0.1em; padding-top: 5px; }
.mpsh-regla > span:last-child { display: flex; flex-direction: column; gap: 8px; }
.mpsh-regla b { font-size: 20px; font-weight: 700; text-transform: uppercase; letter-spacing: -0.01em; line-height: 1.15; }
.mpsh-regla i { font-style: normal; font-size: 14px; color: #9A9A9A; line-height: 1.6; }

/* Nuestros estándares: sellos reales en fila, divisores rojos */
.mpsh-estandares { display: flex; flex-direction: column; align-items: stretch; gap: 36px; border-top: 1px solid #1E1E1E; padding-top: 56px; }
.mpsh-estandares-fila { display: grid; grid-template-columns: repeat(var(--mpsh-cols, 3), minmax(0, 1fr)); }
@media (max-width: 980px) { .mpsh-estandares-fila { grid-template-columns: minmax(0, 1fr); gap: 40px; } }
.mpsh-estandar-item { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 14px; padding: 8px 40px; border-left: 1px solid #C73D2C; }
.mpsh-estandar-item:first-child { border-left: none; }
@media (max-width: 980px) { .mpsh-estandar-item { border-left: none; padding: 0; } }
/* Los sellos son PNG blancos sobre transparente: van directo sobre el negro, sin fondo. */
.mps-2026 .mpsh-estandar-item img { width: 132px; height: 132px; max-width: none; object-fit: contain; display: block; transition: transform .35s ease; }
.mpsh-estandar-item:hover img { transform: scale(1.06) rotate(-3deg); }
.mpsh-estandar-item b { font-size: 20px; font-weight: 800; text-transform: uppercase; letter-spacing: -0.01em; color: #C73D2C; line-height: 1.1; }
.mpsh-estandar-item p { margin: 0; font-size: 14px; line-height: 1.6; color: #FFFFFF; max-width: 340px; }
.mpsh-estandar-item i { font-style: normal; font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: #9A9A9A; }
.mpsh-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid #1E1E1E; padding-top: 56px; }
@media (max-width: 980px) { .mpsh-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 0; } }
.mpsh-stat { padding: 4px 28px 4px 22px; border-left: 1px solid #1E1E1E; display: flex; flex-direction: column; gap: 12px; }
.mpsh-stat b { font-size: 58px; font-weight: 800; letter-spacing: -0.03em; line-height: 1; }
.mpsh-stat b em { color: #C73D2C; font-style: normal; }
.mpsh-stat span { font-size: 13px; color: #9A9A9A; line-height: 1.5; max-width: 200px; }

/* ---- Nuestras tiendas (tarjetas) ---- */

.mpsh-tiendas { background: #F5F4F2; border-bottom: 1px solid #E4E2E0; padding: 112px max(56px, calc(50% - 664px)); display: flex; flex-direction: column; gap: 44px; }
.mpsh-tiendas-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; align-items: stretch; }
.mpsh-tienda { display: flex; flex-direction: column; align-items: stretch; min-width: 0; background: #FFFFFF; border: 1px solid #E4E2E0; border-radius: 6px; overflow: hidden; transition: border-color .15s ease, box-shadow .25s ease; }
.mpsh-tienda:hover { border-color: #111111; box-shadow: 0 10px 28px rgba(17,17,17,0.08); }
.mpsh-tienda-foto { position: relative; aspect-ratio: 16 / 10; background-color: #0B0B0B; overflow: hidden; background-image: radial-gradient(rgba(255,255,255,0.06) 1px, transparent 1.2px); background-size: 3px 3px; }
.mps-2026 .mpsh-tienda-foto img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; display: block; transition: transform .45s ease; }
.mpsh-tienda:hover .mpsh-tienda-foto img { transform: scale(1.04); }
.mpsh-tienda-foto > span { position: absolute; left: 20px; bottom: 18px; right: 20px; font-size: 22px; font-weight: 800; text-transform: uppercase; letter-spacing: -0.01em; color: #FFFFFF; line-height: 1.05; }
.mpsh-tienda-info { display: flex; flex-direction: column; align-items: stretch; gap: 10px; flex: 1; padding: 22px; }
.mps-2026 .mpsh-tienda-info h3 { margin: 0; font-size: 19px; font-weight: 800; line-height: 1.1; text-transform: uppercase; letter-spacing: -0.01em; color: #111111; }
.mpsh-tienda-info p { margin: 0; font-size: 13.5px; line-height: 1.55; color: #111111; }
.mpsh-tienda-info p.mpsh-tienda-hora { font-size: 12.5px; color: #8A8782; }
.mpsh-tienda-acciones { margin-top: auto; padding-top: 12px; display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.mpsh-tienda-waze {
	display: inline-flex; flex-direction: row; align-items: center; justify-content: center; height: 42px; padding: 0 18px;
	background: #111111; color: #FFFFFF; border-radius: 2px; text-decoration: none;
	font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; transition: background-color .15s ease;
}
.mpsh-tienda-waze:hover { background: #C73D2C; color: #FFFFFF; }
.mpsh-tienda-tel { font-size: 13px; font-weight: 700; color: #111111; text-decoration: none; border-bottom: 2px solid #C73D2C; padding-bottom: 2px; white-space: nowrap; }
.mpsh-tienda-tel:hover { color: #C73D2C; }

/* ---- Atletas ---- */

.mpsh-atletas { padding: 112px max(56px, calc(50% - 664px)); display: flex; flex-direction: column; gap: 44px; }
.mpsh-atleta { margin: 0; position: relative; border-radius: 6px; overflow: hidden; background: #0B0B0B; height: 460px; }
.mpsh-atleta-foto { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-size: cover; background-position: top; opacity: 0.92; transition: transform .45s ease; }
.mpsh-atleta:hover .mpsh-atleta-foto { transform: scale(1.05); }
.mpsh-atleta-sombra { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(180deg, rgba(11,11,11,0) 42%, rgba(11,11,11,0.92) 100%); }
.mpsh-atleta figcaption { position: absolute; left: 22px; right: 22px; bottom: 22px; color: #FFFFFF; display: flex; flex-direction: column; gap: 8px; }
.mpsh-atleta blockquote { margin: 0; padding: 0; border: 0; font-size: 15px; line-height: 1.55; color: #FFFFFF; font-style: normal; }
.mpsh-atleta figcaption b { font-weight: 800; font-size: 15px; text-transform: uppercase; letter-spacing: -0.01em; margin-top: 4px; }
.mpsh-atleta figcaption i { font-style: normal; font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.12em; color: #C73D2C; }

/* ---- Animación de entrada (solo cuando hay JS; sin JS todo se ve) ---- */
.mpsh-js [data-anim]:not(.mpsh-in) { opacity: 0; transform: translateY(26px); }
.mpsh-js [data-anim].mpsh-in { opacity: 1; transform: translateY(0); transition: opacity .6s cubic-bezier(0,0,0.3,1), transform .6s cubic-bezier(0,0,0.3,1); }
@media (prefers-reduced-motion: reduce) { .mpsh-js [data-anim] { opacity: 1; transform: none; } }

/* ---- Piezas que solo existen en móvil (ocultas en escritorio) ---- */
.mpsh-progreso { display: none; }

/* ---- Entre 901 y 1180px ---- */
@media (max-width: 1180px) {
	.mpsh-hero-media { width: 66%; }
	.mpsh-asesoria-txt { padding: 56px 40px; }
	.mpsh-asesoria-titulo { font-size: 44px; }
	.mpsh-deportes-grid, .mpsh-tiendas-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.mpsh-estandar-izq { position: static; }
}

/* ======================================================================
 * MÓVIL (<= 900px)
 * Mismo HTML y mismas funciones que el escritorio; cambia el lenguaje: gutter de
 * 18px, hero a sangre con el texto centrado abajo (referencia Cadence móvil),
 * carruseles con "snap" en vez de grillas y barra fija de compra.
 * ==================================================================== */
@media (max-width: 900px) {

	.mpsh-promo { height: 36px; padding: 0 14px; gap: 10px; }
	.mpsh-promo-fuerte { font-size: 12px; letter-spacing: 0.07em; }
	.mpsh-promo-detalle { display: none; }
	.mpsh-promo-cta { font-size: 11px; letter-spacing: 0.07em; }
	.mpsh-promo ~ .mpsc-sticky { top: 36px; }
	body.admin-bar .mpsh-promo ~ .mpsc-sticky { top: 68px; }

	/* ---- Hero ---- */
	/* 40px abajo: el botón no queda pegado al borde del hero (declutter 21-09). */
	.mpsh-hero { min-height: clamp(560px, calc(100vh - 150px), 680px); padding: 0 18px 40px; align-items: center; background-image: none; }
	.mpsh-hero-media, .mpsh-hero-ancho .mpsh-hero-media { width: 100%; background: #0B0B0B; -webkit-mask-image: none; mask-image: none; }
	.mps-2026 .mpsh-slides img { object-position: center 12%; }
	.mpsh-hero-velo, .mpsh-hero-ancho .mpsh-hero-velo {
		background: linear-gradient(180deg, rgba(11,11,11,0.25) 0%, rgba(11,11,11,0) 22%, rgba(11,11,11,0.55) 52%, rgba(11,11,11,0.96) 82%, #0B0B0B 100%);
	}
	/* Sin brillo en el teléfono (pedido 21-09). */
	.mpsh-hero-glow { display: none; }
	.mpsh-hero-txt { align-items: center; text-align: center; gap: 16px; max-width: none; }
	.mpsh-hero-rating { justify-content: center; gap: 6px 10px; font-size: 12.5px; }
	.mpsh-hero-estrellas { font-size: 15px; }
	.mps-2026 .mpsh-hero-txt h1 { font-size: clamp(36px, 10.6vw, 46px); line-height: 0.98; }
	.mpsh-hero-bajada { font-size: 15px; line-height: 1.55; max-width: 320px; }
	/* El hero del teléfono queda en 4 piezas: estrellas, titular, bajada y botón (declutter 21-09).
	   Los 3 checks rojos de 10px no se leían y competían con el botón. */
	.mps-2026 .mpsh-hero-valores { display: none; }
	.mpsh-hero-ctas { flex-direction: column; flex-wrap: nowrap; align-items: stretch; width: 100%; gap: 10px; margin-top: 8px; }
	.mpsh-hero-ctas .mpsc-btn { width: 100%; height: 56px; padding: 0 16px; font-size: 14px; }
	.mpsh-hero-ctas .mpsh-hero-cta2 { display: none; }
	/* «¿No sabes qué consumir?» lleva al mismo destino que el botón: en el teléfono sobra. */
	.mps-2026 .mpsh-hero-ayuda { display: none; }
	.mpsh-hero-tag { top: 14px; right: 14px; bottom: auto; gap: 8px; }
	.mpsh-hero-tag > span:first-child { font-size: 9.5px; padding: 4px 8px; }
	.mpsh-dots { gap: 5px; }
	.mps-2026 .mpsh-dots button { width: 7px; height: 7px; }
	.mps-2026 .mpsh-dots button.mpsh-dot-on { width: 18px; }

	/* ---- Encabezados de sección: título + enlace corto en la misma línea ---- */
	/* Cabecera → contenido = 32px (gap 24 de la sección + 8). Con wrap, si el enlace no cabe baja a su
	   propia línea en vez de partir el título («ATLETAS QUE / NO / SE RINDEN»). */
	.mpsh-sec-head { gap: 16px 12px; flex-wrap: wrap; margin-bottom: 8px; }
	.mpsh-sec-head .mpsc-link-linea[data-corto] { flex: none; font-size: 0; letter-spacing: 0; }
	.mpsh-sec-head .mpsc-link-linea[data-corto]::after { content: attr(data-corto); font-size: 11.5px; letter-spacing: 0.06em; }
	.mpsh-sec-nota { display: none; }

	/* ---- Carruseles con snap ---- */
	.mpsh-vendidos .mpsh-panel-on, .mpsh-testimonios .mpsh-grid3, .mpsh-atletas .mpsh-grid3,
	.mpsh-combos-grid, .mpsh-deportes-grid, .mpsh-tiendas-grid {
		display: flex; flex-direction: row; align-items: stretch; gap: 12px;
		/* 18px = gutter del título: la primera tarjeta arranca alineada con él. */
		overflow-x: auto; padding: 0 18px 6px; scroll-padding-left: 18px; scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch; scrollbar-width: none; width: 100%; box-sizing: border-box;
	}
	/* position: un absoluto dentro de un carrusel solo se recorta si su bloque contenedor está adentro
	   (si no, se ubica respecto del <body> y ensancha la página: pasó en Contacto, QA 21-09). */
	.mpsh-vendidos .mpsh-panel-on, .mpsh-testimonios .mpsh-grid3, .mpsh-atletas .mpsh-grid3,
	.mpsh-combos-grid, .mpsh-deportes-grid, .mpsh-tiendas-grid, .mpsh-tienda, .mpsh-combo { position: relative; }
	.mpsh-vendidos .mpsh-panel-on::-webkit-scrollbar, .mpsh-testimonios .mpsh-grid3::-webkit-scrollbar,
	.mpsh-atletas .mpsh-grid3::-webkit-scrollbar, .mpsh-combos-grid::-webkit-scrollbar,
	.mpsh-deportes-grid::-webkit-scrollbar, .mpsh-tiendas-grid::-webkit-scrollbar, .mpsh-tabs::-webkit-scrollbar { display: none; }
	.mpsh-vendidos .mpsh-panel-on > * { flex: none; width: 245px; scroll-snap-align: start; display: flex; flex-direction: column; }
	.mpsh-vendidos .mpsh-panel-on > * > .mpsc-card { flex: 1; }

	/* ---- Los más vendidos ---- */
	/* Ritmo único del teléfono: 72px arriba y abajo en toda sección con h2 (declutter 21-09). */
	.mpsh-vendidos { padding: 72px 0; gap: 24px; }
	.mpsh-vendidos > .mpsh-sec-head, .mpsh-vendidos > .mpsh-nota, .mpsh-vendidos > .mpsh-progreso { padding-left: 18px; padding-right: 18px; box-sizing: border-box; }
	.mpsh-tabs { flex-wrap: nowrap; gap: 8px; overflow-x: auto; border-bottom: 0; padding: 0 18px 2px; scrollbar-width: none; width: 100%; box-sizing: border-box; }
	.mps-2026 .mpsh-tab {
		/* 44px: toque mínimo, igual que los chips de la Tienda. */
		align-items: center; height: 44px; margin: 0; padding: 0 18px;
		border: 1.5px solid #E4E2E0; border-radius: 999px; background: #FFFFFF;
		font-size: 11.5px; font-weight: 700; letter-spacing: 0.06em; color: #111111; white-space: nowrap;
	}
	.mps-2026 .mpsh-tab-on { border-color: #0B0B0B; background: #0B0B0B; color: #FFFFFF; font-weight: 700; }
	.mpsh-progreso { display: flex; flex-direction: row; align-items: center; gap: 12px; width: 100%; }
	.mpsh-progreso-barras { display: flex; flex-direction: row; gap: 6px; flex: 1; }
	.mpsh-progreso-barras i { flex: 1; height: 2.5px; background: #E4E2E0; display: block; transition: background-color .2s ease; }
	.mpsh-progreso-barras i.mpsh-on { background: #111111; }
	/* El carrusel cerraba con 3 indicadores seguidos: quedan solo las barras de avance.
	   El «01 / 08» y la nota «Compra en 3 clics» (10.5px en mayúsculas) se ocultan. */
	.mpsh-progreso-pos { display: none; }
	.mps-2026 .mpsh-nota { display: none; }

	/* ---- Arma tu combo: bloque a sangre, foto debajo ---- */
	.mpsh-asesoria {
		margin: 0; border-radius: 0; grid-template-columns: minmax(0, 1fr);
		background-image: radial-gradient(rgba(255,255,255,0.05) 1px, transparent 1.2px); background-size: 3px 3px;
	}
	.mpsh-asesoria-txt { padding: 72px 18px 0; gap: 16px; align-items: stretch; background-image: none; }
	.mpsh-asesoria-txt .mpsc-eyebrow { font-size: 11px; }
	.mpsh-asesoria-titulo { font-size: 38px; }
	.mpsh-asesoria-txt p { font-size: 14.5px; line-height: 1.65; max-width: none; }
	/* Incentivo sin caja: queda el texto con su punto rojo (la píldora con borde era una capa más). */
	.mpsh-asesoria-etiqueta { align-self: flex-start; font-size: 11px; padding: 0; border: 0; border-radius: 0; color: #D6D4D1; }
	.mpsh-asesoria-txt .mpsc-btn { width: 100%; padding: 0 16px; }
	/* margin 8 + gap 16 = el botón queda a 24px del incentivo. */
	.mpsh-asesoria-ctas { flex-direction: column; align-items: stretch; gap: 16px; margin-top: 8px; }
	.mpsh-asesoria-alt { text-align: center; }
	/* Alto EXPLÍCITO (4:3 del ancho útil = 100vw − 36px), no aspect-ratio: en Safari de iPhone un ítem de grid
	   estirado (align-items: stretch) ignora aspect-ratio y, como la foto va en absoluto, la caja quedaba en
	   0px y la imagen ni se cargaba (reporte de Luis, 21-09). align-self: start para que no se estire. */
	.mpsh-asesoria-foto { min-height: 0; height: calc(75vw - 27px); aspect-ratio: auto; align-self: start; margin: 32px 18px 72px; border-radius: 6px; }
	.mpsh-asesoria-foto span { display: none; }
	/* Aquí la foto es una tarjeta aparte bajo el texto: el fundido izquierdo de escritorio se vería como un defecto. */
	.mps-2026 .mpsh-asesoria-foto img[src*="combo-bascula-plan"] { -webkit-mask-image: none; mask-image: none; object-position: 60% 72%; }

	/* ---- Clientes ---- */
	/* Aquí la cabecera va en columna: los 32px salen solo del gap (sin el margin de las demás). */
	.mpsh-testimonios { padding: 72px 0; gap: 32px; }
	.mpsh-testimonios > .mpsh-sec-head { padding: 0 18px; box-sizing: border-box; flex-direction: column; align-items: flex-start; gap: 16px; margin-bottom: 0; }
	.mpsh-social { align-items: flex-start; text-align: left; font-size: 12.5px; gap: 4px; }
	.mpsh-social .mpsh-estrellas { font-size: 15px; }
	.mpsh-testimonio { flex: none; width: 284px; scroll-snap-align: start; padding: 20px; gap: 16px; }
	.mpsh-testimonio blockquote { font-size: 14px; line-height: 1.6; }
	.mpsh-testimonio figcaption { gap: 2px; }
	.mpsh-testimonio figcaption b { font-size: 13px; }
	.mpsh-testimonio figcaption span { font-size: 10px; }

	/* ---- Combos ---- */
	.mpsh-combos { padding: 72px 0; gap: 24px; }
	.mpsh-combos > .mpsh-sec-head { padding: 0 18px; box-sizing: border-box; }
	.mpsh-combo { flex: none; width: 292px; scroll-snap-align: start; }
	.mpsh-combo-cab { padding: 20px 18px 18px; }
	.mpsh-combo-con-foto .mpsh-combo-cab { min-height: 300px; }
	.mpsh-combo-cuerpo { padding: 16px 18px 20px; }
	.mps-2026 .mpsh-combo-cab h3 { font-size: 20px; }
	.mpsh-combo-cab p { min-height: 0; }
	.mps-2026 .mpsh-combo-prods { padding: 4px 18px; }
	/* 16px: con menos, iOS hace zoom a la página al abrir el select. */
	.mps-2026 .mpsh-combo-sel { height: 42px; font-size: 16px; font-weight: 500; }
	.mpsh-combo-pie { padding: 16px 18px 20px; }
	.mps-2026 .mpsh-combo-btn { height: 52px; }
	/* Menos capas por tarjeta: sin el «01/02…» rojo sobre la foto ni el segundo CTA «Ver más para…».
	   Quedan precio, ahorro y el botón. (El banner de la Tienda usa mpst-: no se ve afectado.) */
	.mpsh-combo-num { display: none; }
	.mpsh-combo-ver { display: none; }

	/* ---- Por deporte ---- */
	.mpsh-deportes { padding: 0 0 72px; gap: 24px; }
	/* "¿CUÁL ES / TU DEPORTE?": con el interlineado 0.92 del chrome, el "¿" (baja del renglón) pisaba la T
	   de la segunda línea (Luis, 21-09). A 1.06 ya no se tocan; 1.08 deja aire. */
	.mpsh-deportes .mpsc-heading h2 { line-height: 1.08; }
	.mpsh-deportes > .mpsh-sec-head { padding: 0 18px; box-sizing: border-box; }
	.mpsh-deporte { flex: none; width: 232px; height: 330px; scroll-snap-align: start; }
	/* El «01/02» grande competía con la foto. */
	.mpsh-deporte-num { display: none; }
	/* Luis (21-09): el texto se montaba sobre el cuerpo del atleta y el velo casi no oscurecía ahí. En
	   escritorio el bloque de texto es el 30 % de la tarjeta; aquí era el 43 %. Velo que empieza a
	   oscurecer desde la mitad y llega a negro casi pleno abajo, y la foto un poco más arriba. */
	.mpsh-deporte-velo { background: linear-gradient(180deg, rgba(11,11,11,0.08) 0%, rgba(11,11,11,0) 28%, rgba(11,11,11,0.62) 56%, rgba(11,11,11,0.95) 100%); }
	.mpsh-deporte-foto { background-position: center 12%; }
	.mpsh-deporte-txt { padding: 16px 16px 18px; gap: 4px; text-shadow: 0 1px 2px rgba(0,0,0,0.45); }
	.mpsh-deporte-txt b { font-size: 18px; }
	.mpsh-deporte-txt span { font-size: 13px; }
	/* Blanco, no rojo: la tarjeta entera ya es el enlace (el rojo queda para el CTA y los precios). */
	.mpsh-deporte-txt i { color: #FFFFFF; margin-top: 8px; }

	/* ---- El Estándar MPS ---- */
	.mpsh-estandar { padding: 72px 18px; gap: 48px; }
	.mpsh-estandar-grid { gap: 32px; }
	.mpsh-estandar-izq { gap: 18px; position: static; }
	.mpsh-estandar-izq > p { font-size: 14.5px; line-height: 1.6; max-width: none; }
	/* Reglas sin la columna de números rojos 01–04: eran 4 acentos más y le quitaban 46px al texto. */
	.mpsh-regla { grid-template-columns: minmax(0, 1fr); gap: 0; padding: 20px 0; }
	.mpsh-regla > span:first-child { display: none; }
	.mpsh-regla > span:last-child { gap: 8px; }
	.mpsh-regla b { font-size: 16px; }
	.mpsh-regla i { font-size: 14px; line-height: 1.6; }

	/* Sellos reales: una fila de sellos con su nombre (antes, lista de 3 filas de ~130px). El detalle y
	   el alcance repetían la trustbar; sin divisores ni títulos rojos. --mpsh-cols viene de la plantilla. */
	.mpsh-estandares { gap: 24px; padding-top: 40px; }
	.mpsh-estandares-fila { grid-template-columns: repeat(var(--mpsh-cols, 3), minmax(0, 1fr)); gap: 12px; }
	.mpsh-estandar-item { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 12px; padding: 0; border-left: 0; border-top: 0; }
	/* Hasta 72px, pero nunca más ancho que su columna: con 4 sellos (máximo del ACF) a 320px la
	   columna mide ~62px y los sellos se montaban. */
	.mps-2026 .mpsh-estandar-item img { width: 100%; max-width: 72px; height: auto; aspect-ratio: 1; }
	.mpsh-estandar-item b { font-size: 11px; line-height: 1.3; letter-spacing: 0.06em; color: #FFFFFF; overflow-wrap: break-word; max-width: 100%; }
	.mpsh-estandar-item p, .mpsh-estandar-item i { display: none; }

	/* Cifras 2x2: la columna izquierda sin divisor y alineada al gutter; etiquetas a 13px. */
	.mpsh-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 0; padding-top: 40px; }
	.mpsh-stat { padding: 2px 10px 2px 16px; gap: 8px; }
	.mpsh-stat:nth-child(odd) { border-left: 0; padding-left: 0; }
	.mpsh-stat b { font-size: 36px; }
	.mpsh-stat span { font-size: 13px; line-height: 1.5; max-width: none; }

	/* ---- Tiendas ---- */
	.mpsh-tiendas { padding: 72px 0; gap: 24px; }
	.mpsh-tiendas > .mpsh-sec-head { padding: 0 18px; box-sizing: border-box; }
	.mpsh-tienda { flex: none; width: 286px; scroll-snap-align: start; }
	.mpsh-tienda-info { padding: 18px; gap: 8px; }
	.mps-2026 .mpsh-tienda-info h3 { font-size: 17px; }
	.mpsh-tienda-info p { font-size: 13px; }
	.mpsh-tienda-waze { height: 46px; flex: 1; }

	/* ---- Atletas ---- */
	.mpsh-atletas { padding: 72px 0; gap: 24px; }
	.mpsh-atletas > .mpsh-sec-head { padding: 0 18px; box-sizing: border-box; }
	.mpsh-atleta { flex: none; width: 280px; height: 380px; scroll-snap-align: start; }
	.mpsh-atleta figcaption { left: 16px; right: 16px; bottom: 16px; gap: 6px; }
	.mpsh-atleta blockquote { font-size: 13.5px; line-height: 1.5; }
	.mpsh-atleta figcaption b { font-size: 14px; }

	/* Sin barra fija inferior (21-09): la burbuja de WhatsApp queda en su lugar de siempre y se
	   esconde mientras el hero está a la vista (no tapa el botón principal). */
	body.mps-home-2026 .wpsr-fm-chat-wrapper { transition: opacity .25s ease; }
	html.mpsh-en-hero body.mps-home-2026 .wpsr-fm-chat-wrapper { opacity: 0 !important; pointer-events: none !important; }
}

/* La barra de admin mide 46px bajo 782px y deja de ser fija bajo 600px (mismo criterio que el chrome). */
@media (max-width: 782px) {
	body.admin-bar .mpsh-promo { top: 46px; }
	body.admin-bar .mpsh-promo ~ .mpsc-sticky { top: 82px; }
}
@media (max-width: 600px) {
	body.admin-bar .mpsh-promo { top: 0; }
	body.admin-bar .mpsh-promo ~ .mpsc-sticky { top: 36px; }
}

/* ============ Prueba social verificada (21-09) ============ */
.mpsh-social { text-decoration: none; color: #111111; }
.mpsh-social:hover { color: #111111; }
.mpsh-social-nota { font-size: 34px; font-weight: 800; letter-spacing: -0.02em; line-height: 1; color: #111111; }
.mpsh-social-nota em { font-style: normal; font-size: 16px; letter-spacing: 2px; color: #C73D2C; vertical-align: middle; margin-left: 4px; }
.mpsh-social:hover > span:last-child { text-decoration: underline; text-underline-offset: 3px; }

.mps-2026 .mpsh-cifras-redes {
	list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
	border-top: 1px solid #E4E2E0; border-bottom: 1px solid #E4E2E0;
}
.mps-2026 .mpsh-cifras-redes li { list-style: none; margin: 0; padding: 0; min-width: 0; border-left: 1px solid #E4E2E0; }
.mps-2026 .mpsh-cifras-redes li:first-child { border-left: 0; }
.mpsh-cifras-redes a {
	display: flex; flex-direction: column; align-items: flex-start; gap: 6px; height: 100%;
	padding: 24px 22px; text-decoration: none; color: #111111; transition: background-color .15s ease;
}
.mpsh-cifras-redes li:first-child a { padding-left: 0; }
.mpsh-cifras-redes a:hover { background: #FFFFFF; color: #111111; }
.mpsh-cifras-redes b { font-size: 40px; font-weight: 800; letter-spacing: -0.03em; line-height: 1; color: #111111; }
.mpsh-cifras-redes b em { font-style: normal; font-size: 18px; font-weight: 800; letter-spacing: 0; color: #C73D2C; margin-left: 4px; }
.mpsh-cifras-redes span { font-size: 13px; line-height: 1.4; font-weight: 600; color: #111111; }
.mpsh-cifras-redes i { font-style: normal; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: #8A8782; }

/* El tema viejo centra figcaption y deja las tarjetas con alturas distintas: se declara todo. */
.mps-2026 .mpsh-resenas { align-items: stretch; }
.mps-2026 .mpsh-resenas .mpsh-testimonio { height: 100%; text-align: left; }
.mps-2026 .mpsh-resenas .mpsh-testimonio figcaption { align-items: flex-start; text-align: left; margin-top: 0; }
.mps-2026 .mpsh-resenas .mpsh-testimonio figcaption b { color: #111111; }
.mps-2026 .mpsh-resenas .mpsh-testimonio blockquote { flex: 1; text-align: left; }
.mpsh-testimonio-fuente { margin-top: auto; align-self: flex-start; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #111111; text-decoration: none; border-bottom: 2px solid #C73D2C; padding-bottom: 2px; }
.mpsh-testimonio-fuente:hover { color: #C73D2C; }

.mpsh-respaldo { display: flex; flex-direction: column; align-items: stretch; gap: 10px; }
.mpsh-respaldo p { margin: 0; display: flex; flex-direction: row; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; font-size: 14px; line-height: 1.6; color: #111111; }
.mpsh-respaldo p > span { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: #8A8782; margin-right: 6px; }
.mpsh-respaldo a { color: #111111; font-weight: 700; text-decoration: none; border-bottom: 1px solid #C9C6C2; }
.mpsh-respaldo a:hover { color: #C73D2C; border-bottom-color: #C73D2C; }
.mpsh-respaldo em { font-style: normal; color: #C9C6C2; }
.mpsh-respaldo p.mpsh-respaldo-nota { font-size: 12px; color: #8A8782; }
.mpsh-respaldo-nota a { font-weight: 700; }

@media (max-width: 1180px) {
	.mpsh-cifras-redes a { padding: 22px 16px; }
	.mpsh-cifras-redes b { font-size: 34px; }
}
@media (max-width: 900px) {
	.mpsh-social-nota { font-size: 28px; }
	.mps-2026 .mpsh-cifras-redes { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0 18px; }
	.mps-2026 .mpsh-cifras-redes li, .mps-2026 .mpsh-cifras-redes li:nth-child(4) { border-left: 0; border-top: 1px solid #E4E2E0; }
	.mps-2026 .mpsh-cifras-redes li:nth-child(-n+2) { border-top: 0; }
	.mps-2026 .mpsh-cifras-redes li:nth-child(even) { border-left: 1px solid #E4E2E0; }
	.mps-2026 .mpsh-cifras-redes li:last-child:nth-child(odd) { grid-column: 1 / -1; }
	.mpsh-cifras-redes a, .mpsh-cifras-redes li:first-child a, .mpsh-cifras-redes li:nth-child(4) a { padding: 20px 12px 20px 16px; gap: 6px; }
	/* La columna izquierda arranca en el gutter de 18px, alineada con el título (antes caía a x=30). */
	.mps-2026 .mpsh-cifras-redes li:nth-child(odd) a { padding-left: 0; }
	.mpsh-cifras-redes b { font-size: 30px; }
	.mpsh-cifras-redes span { font-size: 12px; }
	/* Prueba social: la 3.ª línea de las cifras se queda. La franja .mpsh-respaldo (retailers y podcasts)
	   salió de la plantilla en v0.17.21 por pedido de Luis (escritorio y móvil): estas dos reglas quedan
	   inertes, solo por si se retoma. */
	.mpsh-respaldo { padding: 0 18px; gap: 12px; }
	.mpsh-respaldo p { font-size: 13px; gap: 4px 8px; line-height: 1.7; }
	/* Pie de la reseña: de 10px en mayúsculas partido en 2 líneas a 12px en caja normal (sigue visible:
	   es parte de la prueba verificada). */
	.mps-2026 .mpsh-resenas .mpsh-testimonio figcaption span { font-size: 12px; font-weight: 500; line-height: 1.4; text-transform: none; letter-spacing: 0; }
}

/* ====================================================================
 * Beneficios MPS (Luis, 24-09): franja de 3 celdas entre "Por deporte" y "El estándar", con
 * enlace a /beneficios-mps/. Solo se pinta si esa pieza está activa (la plantilla lo decide).
 * ==================================================================== */
.mpsh-beneficios {
	display: flex; flex-direction: column; align-items: stretch; gap: 28px; width: 100%; max-width: none; margin: 0;
	padding: 56px max(56px, calc(50% - 664px)); background: #F5F4F2; border-top: 1px solid #E4E2E0;
}
.mpsh-beneficios-lista { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin: 0; padding: 0; list-style: none; }
.mpsh-beneficios-lista li { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; margin: 0; padding: 4px 32px; border-left: 1px solid #C73D2C; min-width: 0; line-height: normal; }
.mpsh-beneficios-lista li:first-child { padding-left: 0; border-left: 0; }
.mpsh-beneficios-lista b { font-size: 18px; font-weight: 800; line-height: 1.15; text-transform: uppercase; letter-spacing: -0.01em; color: #111111; }
.mpsh-beneficios-lista span { font-size: 14px; line-height: 1.5; color: #55534F; }
.mpsh-beneficios-link { align-self: flex-start; }
/* El tema apaga el outline global con !important: el enlace del teaser recupera su foco visible. */
.mpsh-beneficios-link:focus-visible { outline: 2px solid #C73D2C !important; outline-offset: 4px; }
@media (max-width: 900px) {
	.mpsh-beneficios { padding: 40px 18px; gap: 22px; }
	.mpsh-beneficios-lista { grid-template-columns: minmax(0, 1fr); gap: 16px; }
	.mpsh-beneficios-lista li, .mpsh-beneficios-lista li:first-child { padding: 0 0 0 14px; border-left: 2px solid #C73D2C; }
	.mpsh-beneficios-lista b { font-size: 16px; }
	.mpsh-beneficios-lista span { font-size: 13px; }
}