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

/* Páginas completas · bajadas (wireframe v0.12: .lead de las páginas internas): 17 px (15 en celular) y 60ch de ancho, alineadas
   a la izquierda de la columna. En la cabecera van a 12 px del título y los botones a 22 px de ellas. El 404 usa la misma bajada, centrada */
:is(.emx-page-hero,.emx-page-hero ~ .emx-sec,.emx-404) > p.is-style-emx-lead{font-size:17px;line-height:1.5;max-width:60ch}
:is(.emx-page-hero,.emx-page-hero ~ .emx-sec) > p.is-style-emx-lead{margin-left:max(0px,calc((100% - var(--wp--style--global--content-size,1120px)) / 2))!important}
.emx-sec:is(.emx-page-hero,.emx-404) > p.is-style-emx-lead{margin-top:12px}
.emx-page-hero > :is(.wp-block-buttons,.emx-wa-btn){margin-top:22px}
@media (max-width:781px){:is(.emx-page-hero,.emx-page-hero ~ .emx-sec,.emx-404) > p.is-style-emx-lead{font-size:15px}}

/* Páginas completas y 404 · botones (wireframe v0.12: .bp .btn de 52 px, con línea de 24 px, borde de 2 px y 8 px entre
   el texto y la palabra DEALS). El de contorno lleva borde sólido de tinta en vez de la sombra interior. Los .btn (WhatsApp)
   van en una sola línea, salvo en teléfonos de menos de 360 px, donde pueden partirse para no salirse de la pantalla */
:is(.emx-page-hero,.emx-page-hero ~ *,.emx-404) .wp-block-button:not(.is-style-emx-link) > .wp-block-button__link{display:inline-flex;align-items:center;justify-content:center;gap:8px;line-height:1.5;border:2px solid transparent}
:is(.emx-page-hero,.emx-page-hero ~ *,.emx-404) .wp-block-button.is-style-emx-line > .wp-block-button__link{border-color:var(--ink);box-shadow:none}
:is(.emx-page-hero,.emx-page-hero ~ *) .btn{border-width:2px;line-height:1.5;white-space:nowrap}
@media (max-width:359px){:is(.emx-page-hero,.emx-page-hero ~ *) .btn{white-space:normal}}
/* Botón "Cómo llegar" con el ícono de ubicación (clase emx-btn-pin en el botón) */
.wp-block-button.emx-btn-pin > .wp-block-button__link{display:inline-flex;align-items:center;gap:8px}
.wp-block-button.emx-btn-pin > .wp-block-button__link::before{content:"";flex:none;width:18px;height:18px;background:currentColor;-webkit-mask:var(--emx-pin) center/contain no-repeat;mask:var(--emx-pin) center/contain no-repeat;
	--emx-pin:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 110.86 110.86'%3E%3Cpath d='M84.17,42.66c0-15.85-12.89-28.74-28.74-28.74s-28.74,12.89-28.74,28.74c0,5.05,1.33,10.02,3.85,14.37l22.12,38.31c.57.99,1.63,1.6,2.76,1.6s2.2-.61,2.76-1.6l22.11-38.3c2.52-4.34,3.85-9.32,3.85-14.37ZM55.43,87.36l-19.36-33.52c-1.95-3.38-2.99-7.24-2.99-11.17,0-12.32,10.03-22.35,22.35-22.35s22.35,10.03,22.35,22.35c0,3.93-1.03,7.8-2.99,11.17l-19.36,33.53Z'/%3E%3Cpath d='M55.43,30.95c-6.46,0-11.71,5.25-11.71,11.71s5.25,11.71,11.71,11.71,11.71-5.25,11.71-11.71-5.25-11.71-11.71-11.71ZM55.43,47.98c-2.94,0-5.32-2.39-5.32-5.32s2.39-5.32,5.32-5.32,5.32,2.39,5.32,5.32-2.39,5.32-5.32,5.32Z'/%3E%3C/svg%3E")}

/* Páginas completas · secciones de texto (wireframe v0.12: .bp-in). El contenido empieza 20 px bajo el título (las tarjetas de
   "Servicios" van pegadas a él); el último párrafo visible conserva 16 px abajo (88 px de aire); la lista con chulos queda a 14 px
   del párrafo siguiente y el botón a 30 px del texto */
.emx-page-hero ~ .emx-sec:not(.emx-faq):not(.emx-legal) > h2.wp-block-heading:not(.screen-reader-text) + :not(.is-style-emx-lead):not(.wp-block-columns){margin-top:20px}
.emx-page-hero ~ .emx-sec > h2.wp-block-heading + .wp-block-columns{margin-top:0}
.emx-page-hero ~ .emx-sec:not(.emx-faq):not(.emx-legal) > p:not(.emx-editor-note):not(.is-style-emx-lead):not(:has(~ :not(.emx-editor-note))){margin-bottom:16px}
.emx-page-hero ~ .emx-sec > ul.is-style-emx-check + p{margin-top:14px}
.emx-page-hero ~ .emx-sec > p + .wp-block-buttons{margin-top:30px}
/* Lista con chulos (wireframe v0.12: .bp-check): solo los 8 px de la grilla entre ítems */
ul.is-style-emx-check li{margin-bottom:0}

/* Páginas completas · tarjetas (wireframe v0.12: .bp-card): 10 px entre elementos, título con línea de 27 px y el botón abajo, a la izquierda */
.emx-card{gap:10px}
.emx-card > h3{line-height:1.5}
.emx-card > :is(.wp-block-buttons,.emx-wa-btn){padding-top:0}

/* Tienda · zonas (wireframe v0.12: .bp-zones): 4 fotos 4:3 (rayadas mientras no haya) con su nombre, 2 por fila en celular;
   "Haz el recorrido 360" a 34 px */
.emx-zones{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:16px!important}
.emx-zone{display:flex;flex-direction:column;gap:4px}
.emx-zone > *{margin:0!important}
.emx-zone-photo{aspect-ratio:4/3;border-radius:20px;overflow:hidden;background:repeating-linear-gradient(135deg,#E4E6E8 0 10px,#F6F7F8 10px 20px)}
.emx-zone-photo img{width:100%;height:100%;object-fit:cover}
.emx-zone > .emx-zone-n{margin-top:6px!important}
.emx-page-hero ~ .emx-sec > .emx-zones + .wp-block-buttons{margin-top:34px}
@media (max-width:781px){.emx-zones{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
/* Tienda · "Preguntas cortas": título de tema de 28 px (22 en celular), no el de 32 de las preguntas de fichas y listados */
.emx-page-hero ~ .emx-faq .emx-faq-side h2.wp-block-heading{font-size:28px}
@media (max-width:781px){.emx-page-hero ~ .emx-faq .emx-faq-side h2.wp-block-heading{font-size:22px}}

/* Servicio técnico · franja de promesas (wireframe v0.12: .bp-attrs y .bp-proof-4): líneas arriba y abajo, 4 columnas
   (2 en celular) con ícono de 22 px y texto de 14 px */
.wp-block-post-content > .emx-proof,.wp-block-post-content > .emx-proof + *{margin-block-start:0}
.emx-proof{padding-block:28px;border-block:1px solid var(--line)}
.emx-proof > .emx-promises.is-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 28px;margin:0;overflow:visible}
.emx-proof .emx-promises.is-row .emx-promise{gap:8px;align-items:center;font-size:14px;line-height:1.5;white-space:normal}
.emx-proof .emx-promises.is-row .emx-promise .bi{width:22px;height:22px;padding:0;margin:0;border-radius:0;background:none;color:var(--space)}
.emx-proof .emx-promises.is-row .emx-promise > span{font-size:smaller;font-weight:400;line-height:1.5;color:var(--muted)}
.emx-proof .emx-promise b{font-size:14px;font-weight:900;color:var(--ink)}
@media (max-width:781px){.emx-proof > .emx-promises.is-row{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Servicio técnico · pasos (wireframe v0.12: .bp-steps): 16 px entre pasos, número en círculo de 32 px y 760 px de ancho,
   alineados a la izquierda de la columna */
.emx-page-hero ~ .emx-sec .emx-steps{gap:16px;max-width:760px}
.emx-page-hero ~ .emx-sec > .emx-steps{margin-left:max(0px,calc((100% - var(--wp--style--global--content-size,1120px)) / 2))!important}
.emx-page-hero ~ .emx-sec .emx-steps li{padding-left:46px;line-height:1.5}
.emx-page-hero ~ .emx-sec .emx-steps li::before{top:-3px}

/* Contacto · redes (wireframe v0.12: .bp-social): ícono de 22 px con el nombre en negrita */
.emx-page-hero ~ .emx-sec .wp-block-social-links.has-visible-labels{gap:12px 24px;font-size:16px}
.emx-page-hero ~ .emx-sec .wp-block-social-links.has-visible-labels .wp-social-link a{gap:8px;padding:0;line-height:1.5;font-weight:700;color:var(--ink)}
.emx-page-hero ~ .emx-sec .wp-block-social-links.has-visible-labels .wp-social-link svg{width:22px;height:22px}
.emx-page-hero ~ .emx-sec .wp-block-social-links.has-visible-labels .wp-block-social-link-label{margin:0;font-size:16px;line-height:1.5}

/* Preguntas frecuentes · títulos de tema (wireframe v0.12: .bp-qh): 28 px/800 (22 en celular) y 36 px sobre cada uno, también el primero */
.wp-block-post-content > .emx-faq-page > h2.wp-block-heading{font-size:28px;font-weight:700;line-height:1.15;margin-top:36px}
@media (max-width:781px){.wp-block-post-content > .emx-faq-page > h2.wp-block-heading{font-size:22px}}
/* Preguntas frecuentes · enlaces "Ver las Mac DEALS →" (wireframe v0.12: .bp-go): a 10 px de las preguntas, 24 px de alto y subrayado normal */
.wp-block-post-content > .emx-faq-page > .wp-block-buttons{margin-top:10px}
.emx-faq-page .wp-block-button.is-style-emx-link > .wp-block-button__link{padding:0;line-height:1.5;text-underline-offset:auto}
/* Preguntas frecuentes y legales · columna de 780 px (wireframe v0.12: .wrap.bp-narrow, 860 px menos 40 de margen a cada lado) */
.wp-block-post-content > :is(.emx-faq-page,.emx-legal) > :not(.alignfull){max-width:780px}

/* Caja de cierre con fondo suave (Preguntas frecuentes y Servicio técnico; wireframe v0.12: .bp-bridge): sin borde, flecha ni sombra,
   32 px sobre ella y texto de 17 px en tinta */
.emx-bridge-box.is-style-emx-soft{border:0;margin-top:32px}
.emx-bridge-box.is-style-emx-soft::after{content:none}
.emx-bridge-box.is-style-emx-soft:is(:hover,:focus-within){box-shadow:none}
.emx-bridge-box.is-style-emx-soft p{font-size:17px;line-height:1.5;color:var(--ink)}

/* Cierre de las páginas completas (wireframe v0.12: .bp-end): entre el botón y el enlace de WhatsApp solo los 14 px de la columna */
.emx-page-cta .emx-wa-btn{display:flex;margin-top:0}
/* "Una empresa real" dentro de una página completa (wireframe v0.12: .trust con 40 px arriba; 28 en celular) */
.emx-page-hero ~ .emx-real .emx-trust{margin-top:40px}
@media (max-width:781px){.emx-page-hero ~ .emx-real .emx-trust{margin-top:28px}}