/* v0.12 · 21-home2 — reglas nuevas de este frente (se cargan después de theme.css; al final se pegan a theme.css en este orden). */

/* Pie: empieza justo donde termina la última sección, sin el espacio entre bloques de 16 px (wireframe v0.12, todas las páginas) */
.wp-site-blocks > footer{margin-block-start:0}

/* Pie (wireframe v0.12: .foot-top, .foot-bottom).
   Datos y enlaces con 2 px entre filas; cada enlace lleva 6 px arriba y abajo (área táctil de 32-35 px).
   Escritorio: los títulos de columna bajan 10 px desde el borde superior del logo.
   La cinta de medios de pago ocupa todo el ancho de la pantalla; el texto legal conserva su ancho y su margen interno */
.emx-foot-ic{gap:2px}
.emx-foot-ic a{display:inline-block;padding-block:6px}
@media (min-width:782px){.emx-foot .emx-foot-cols > .wp-block-column > h2:first-child{margin-top:10px}}
.wp-block-group.emx-foot-bottom{padding-inline:0}
.emx-foot-bottom > .emx-pay{max-width:none}
/* Celular: las redes arrancan en el borde del texto (x=16) */
@media (max-width:781px){.emx-foot .emx-foot-soc{margin-left:0}}

/* Preguntas frecuentes (wireframe v0.12: .faq, .faq-row, .faq-ic), en todo el sitio.
   Las preguntas van pegadas, separadas solo por la línea inferior. La fila tiene 12 px de sangría y se pone blanca
   con radio 12 al pasar el puntero; la flecha es el chevron de 20 px en celeste profundo y gira al abrir.
   La respuesta lleva la misma sangría y 24 px debajo; si trae lista, el párrafo queda a 8 px y las viñetas a 20 px */
.wp-block-details.is-style-emx-faq{--emx-chev:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 110 110'%3E%3Cpath d='M85.74,38.01c1.79,1.79,1.79,4.69,0,6.48l-27.5,27.5c-1.74,1.74-4.54,1.8-6.35.13l-27.5-25.38c-1.86-1.72-1.98-4.62-.26-6.48,1.72-1.86,4.62-1.98,6.48-.26l24.26,22.4,24.39-24.39c1.79-1.79,4.69-1.79,6.48,0Z'/%3E%3C/svg%3E");margin-block-start:0;padding:0}
.wp-block-details.is-style-emx-faq summary{padding:22px 48px 22px 12px;border-radius:12px;transition:background-color .15s}
@media (hover:hover){.wp-block-details.is-style-emx-faq summary:hover{background:#fff}}
.wp-block-details.is-style-emx-faq summary::after{right:12px;width:20px;height:20px;margin:-10px 0 0;border:0;background:var(--sky-deep);transform:none;-webkit-mask:var(--emx-chev) center/contain no-repeat;mask:var(--emx-chev) center/contain no-repeat}
.wp-block-details.is-style-emx-faq[open] summary::after{margin-top:-10px;transform:rotate(180deg)}
.wp-block-details.is-style-emx-faq > :not(summary){max-width:64ch;margin:0 12px 24px;padding-bottom:0}
.wp-block-details.is-style-emx-faq > p:has(+ ul){margin-bottom:8px}
.wp-block-details.is-style-emx-faq > ul{display:grid;gap:4px;padding-left:20px}
/* Enlace de una respuesta ("Conoce DEALS →", "Escríbenos por WhatsApp →"; wireframe: .tlink): en negrita, sin subrayado
   y de 44 px de alto; si va en su propio párrafo después de una lista, queda pegado a ella */
.wp-block-details.is-style-emx-faq > ul:has(+ p){margin-bottom:0}
.wp-block-details.is-style-emx-faq > p > a:only-child{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:inherit;font-weight:700;text-decoration:none}
.wp-block-details.is-style-emx-faq > p > a:only-child:hover{text-decoration:underline}
.wp-block-details.is-style-emx-faq summary .emx-lt-black{height:1.05em;width:auto;margin:0 0 0 .05em;vertical-align:-.2em}
/* Columnas: la bajada a 10 px del título (el ancho de 360 px + 64 + resto va en los patrones).
   "Hacer otra pregunta por WhatsApp" a 20 px de la bajada (en celular, de las preguntas) y con 44 px de alto */
.emx-faq-side .is-style-emx-lead{margin-top:10px}
.emx-faq-side > .wp-block-buttons{margin-top:20px}
.emx-faq-side .is-style-emx-link .wp-block-button__link{padding-block:10px}
@media (max-width:781px){
	.wp-block-details.is-style-emx-faq summary{padding:18px 40px 18px 4px}
	.wp-block-details.is-style-emx-faq summary::after{right:4px}
	.wp-block-details.is-style-emx-faq > :not(summary){margin:0 4px 20px}
}
/* Fuera del inicio (fichas, listados, página de preguntas) el wireframe usa la escala de las subpáginas:
   título de 32 px/800, bajada de 17 px y preguntas de 18 px (24, 15 y 16 px en celular; respuestas de 15 px) */
body:not(.home) .emx-faq-side h2.wp-block-heading{font-size:32px;font-weight:700;line-height:1.15}
body:not(.home) .emx-faq-side .is-style-emx-lead{font-size:17px;line-height:1.5}
@media (min-width:782px){body:not(.home) .wp-block-details.is-style-emx-faq summary{font-size:18px;line-height:1.5}}
@media (max-width:781px){
	body:not(.home) .emx-faq-side h2.wp-block-heading{font-size:24px}
	body:not(.home) .emx-faq-side .is-style-emx-lead{font-size:15px}
	body:not(.home) .wp-block-details.is-style-emx-faq > :not(summary){font-size:15px}
}

/* Reseñas (wireframe v0.12: #rv-grid; inicio y ficha de producto nuevo): foto con radio 16; 12 px bajo las tarjetas;
   la línea de estrellas y fecha mide 18 px (12/1.5). Inicio: 32 px del título a la caja (22 en celular; la ficha lo define pdp) */
.emx-home .emx-rev-head{margin-bottom:32px}
.emx-rev-img img{border-radius:16px}
.emx-rev-box .emx-rev-body{padding-bottom:12px}
.emx-rev-by{line-height:1.5}
@media (max-width:781px){.emx-home .emx-rev-head{margin-bottom:22px}}

/* Inicio · cinta de atributos: sin líneas propias; solo el banner lleva la línea inferior (wireframe v0.12: .attrs).
   El círculo del ícono no baja 1 px: cada atributo mide 48 px */
.emx-home .emx-attrs{border-block:0}
.emx-home .emx-attrs .emx-promise > svg{margin-top:0}

/* Inicio · DEALS Black: el logo del enlace "Ver todos los DEALS Black →" ocupa 109 × 16 px, sin margen (wireframe: .bk-all .bk-logo) */
.emx-black .emx-rail-all .emx-lt-black{width:109px;height:16px;margin:0}

/* Chips que filtran las filas (escritorio): 40 px de alto y 16 px a los lados; 44 px sobre el fondo oscuro de DEALS Black.
   Inicio: las flechas de 44 px se alinean abajo con los chips y sobresalen 4 px hacia arriba (wireframe: .sec-head{align-items:end}),
   así la cabecera mide 40: 16 px de la bajada a los chips y 32 de los chips a la fila. En DEALS Black (chips de 44) no cambia */
@media (min-width:782px){
	.emx-qf-group .emx-chip{min-height:40px;padding:0 16px}
	.is-style-emx-dark .emx-qf-group .emx-chip{min-height:44px}
	.emx-home .emx-rail-head:has(.emx-qf-group){align-items:flex-end}
	.emx-home .emx-rail-head:has(.emx-qf-group) > .emx-rail-nav{margin-top:-4px}
}

/* Inicio · filas de tarjetas (wireframe v0.12: .rail). El imán no corre la fila: la primera tarjeta queda alineada con el título.
   Escritorio: 4 tarjetas con 20 px entre ellas. Celular: la fila y los videos sangran 8 px a cada lado (2,1 tarjetas visibles) */
.emx-home .is-rail .emx-rail-scroll{scroll-padding-inline:2px}
@media (min-width:1024px){.emx-home .is-rail .emx-rail{gap:20px;grid-auto-columns:calc((100% - (var(--emx-cols,4) - 1) * 20px) / var(--emx-cols,4))}}
@media (max-width:767px){
	.emx-home .is-rail .emx-rail-scroll{margin-inline:-8px;padding-inline:8px;scroll-padding-inline:8px}
	.emx-home .is-rail .emx-rail{grid-auto-columns:calc((100% - 12px) / 2.1)}
}
@media (max-width:781px){.emx-home .emx-reels{margin-inline:-8px;padding-inline:8px;scroll-padding-inline:8px}}