/*
 * Las entradas del blog con el formato nuevo (shoppex-blog.php): portada azul
 * con foto, la lectura a la izquierda y el índice y el botón de precios a la
 * derecha. Adrian lo eligió el 11-oct-2026 entre dos modelos.
 *
 * Reglas del sitio que se respetan: el contenido mide hasta 1190 px y nunca
 * queda a menos de 20 px del borde (sitio-un-solo-borde); Kurdis solo en el
 * título; Alexandria Regular para el texto y Semibold para títulos y botones;
 * ningún recuadro con barra de color a la izquierda y ningún enlace con
 * flecha (Adrian, 4-oct-2026).
 *
 * Los selectores llevan dos clases: el kit de Elementor pinta h2, p y enlaces
 * con «.elementor-kit-N h2», y con una sola clase gana él.
 */

.shx-art {
	--navy: #0F2167;
	--azul: #008DDA;
	--cian: #41C9E2;
	--enlace: #006FB0;
	--texto: #3D4A6B;
	--oscuro: #26315A;
	--suave: #6B7896;
	--borde: #E3E8F2;
	--fondo-suave: #F2F6F9;
	--fondo-azul: #EAF4FB;
	display: block;
	background: #fff;
	color: var(--texto);
	font-family: Alexandria, system-ui, -apple-system, "Segoe UI", sans-serif;
	font-size: 16px;
	line-height: 1.6;
}

.shx-art * {
	box-sizing: border-box;
}

.shx-art .shx-art-caja {
	max-width: 1230px;
	margin: 0 auto;
	padding: 0 20px;
}

.shx-art a:focus-visible,
.shx-art summary:focus-visible {
	outline: 2px solid var(--azul);
	outline-offset: 3px;
	border-radius: 4px;
}

/* La portada: antetítulo, título, entradilla y firma */
.shx-art .shx-art-antetitulo {
	margin: 0 0 16px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--azul);
}

.shx-art .shx-art-antetitulo a {
	color: inherit;
	text-decoration: none;
}

.shx-art .shx-art-antetitulo span {
	margin: 0 8px;
	opacity: .6;
}

.shx-art .shx-art-h1 {
	margin: 0 0 20px;
	max-width: 900px;
	font-family: kurdis, Alexandria, sans-serif;
	font-size: clamp(30px, 4.3vw, 52px);
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: .01em;
	text-transform: none;
	text-wrap: balance;
	color: var(--navy);
}

.shx-art .shx-art-entradilla {
	margin: 0 0 30px;
	max-width: 660px;
	font-size: clamp(17px, 1.6vw, 20px);
	font-weight: 300;
	line-height: 1.6;
	color: var(--texto);
}

.shx-art .shx-art-firma {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 15px;
	color: var(--suave);
}

.shx-art .shx-art-avatar {
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 0 0 1px var(--borde);
}

.shx-art .shx-art-avatar svg {
	display: block;
	width: 44%;
	height: auto;
}

.shx-art .shx-art-datos {
	display: flex;
	flex-wrap: wrap;
	gap: 2px 14px;
	min-width: 0;
}

.shx-art .shx-art-datos strong {
	font-weight: 600;
	color: var(--navy);
}

/* La portada azul con foto, debajo del encabezado transparente */
.shx-art .shx-art-portada {
	position: relative;
	overflow: hidden;
	background: var(--navy);
}

.shx-art .shx-art-portada .shx-art-foto {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: center 35%;
}

.shx-art .shx-art-velo {
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(15, 33, 103, .97) 0%, rgba(15, 33, 103, .9) 48%, rgba(15, 33, 103, .55) 100%);
}

.shx-art .shx-art-portada .shx-art-caja {
	position: relative;
	padding-top: 64px;
	padding-bottom: 60px;
}

.shx-art .shx-art-portada .shx-art-antetitulo {
	color: var(--cian);
}

.shx-art .shx-art-portada .shx-art-h1 {
	color: #fff;
}

.shx-art .shx-art-portada .shx-art-entradilla {
	color: rgba(255, 255, 255, .92);
}

.shx-art .shx-art-portada .shx-art-firma {
	color: rgba(255, 255, 255, .85);
}

.shx-art .shx-art-portada .shx-art-avatar {
	box-shadow: none;
}

.shx-art .shx-art-portada .shx-art-datos strong {
	color: #fff;
}

/* La lectura a la izquierda, en el borde del logo; el índice y el botón a la derecha */
.shx-art .shx-art-cuerpo {
	display: grid;
	grid-template-columns: minmax(0, 720px) 300px;
	justify-content: space-between;
	gap: 64px;
	padding-top: 60px;
	padding-bottom: 16px;
}

.shx-art .shx-art-lateral {
	min-width: 0;
}

.shx-art .shx-art-fijo {
	position: sticky;
	top: 24px;
	display: grid;
	gap: 22px;
}

.admin-bar .shx-art .shx-art-fijo {
	top: 56px;
}

.shx-art .shx-art-indice {
	padding: 22px 20px;
	border: 1px solid var(--borde);
	border-radius: 16px;
}

.shx-art .shx-art-indice-titulo {
	margin: 0 0 12px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--suave);
}

.shx-art .shx-art-indice ol {
	display: grid;
	gap: 2px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.shx-art .shx-art-indice a {
	display: block;
	padding: 7px 10px;
	border-radius: 8px;
	color: var(--texto);
	font-size: 14.5px;
	line-height: 1.4;
	text-decoration: none;
	transition: background .15s, color .15s;
}

.shx-art .shx-art-indice a:hover {
	background: var(--fondo-suave);
	color: var(--navy);
}

.shx-art .shx-art-indice a.activo {
	background: var(--fondo-azul);
	color: var(--navy);
	font-weight: 600;
}

.shx-art .shx-art-mini {
	padding: 24px 22px;
	border-radius: 16px;
	background: var(--fondo-suave);
}

.shx-art .shx-art-mini p {
	margin: 0 0 18px;
	font-size: 15px;
	line-height: 1.6;
	color: var(--texto);
}

.shx-art .shx-art-mini .shx-art-mini-titulo {
	margin: 0 0 8px;
	font-size: 19px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--navy);
}

.shx-art .shx-art-mini .shx-precios {
	display: block;
	max-width: none;
	margin: 0;
}

.shx-art .shx-art-boton {
	display: flex;
	justify-content: center;
	padding: 13px 18px;
	border-radius: 10px;
	background: var(--azul);
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	text-decoration: none;
	transition: background .2s, color .2s;
}

.shx-art .shx-art-boton:hover,
.shx-art .shx-art-boton:focus-visible {
	background: var(--cian);
	color: var(--navy);
}

/* El índice en el teléfono */
.shx-art .shx-art-indice-movil {
	display: none;
	margin: 28px 0 0;
	border: 1px solid var(--borde);
	border-radius: 14px;
}

.shx-art .shx-art-indice-movil summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 20px;
	font-size: 15px;
	font-weight: 600;
	color: var(--navy);
	list-style: none;
	cursor: pointer;
}

.shx-art .shx-art-indice-movil summary::-webkit-details-marker {
	display: none;
}

.shx-art .shx-art-indice-movil summary::after {
	content: "+";
	font-size: 22px;
	font-weight: 400;
	color: var(--azul);
}

.shx-art .shx-art-indice-movil[open] summary::after {
	content: "\2212";
}

.shx-art .shx-art-indice-movil ol {
	display: grid;
	gap: 8px;
	margin: 0;
	padding: 0 20px 18px 40px;
	font-size: 15px;
}

.shx-art .shx-art-indice-movil a {
	color: var(--texto);
	text-decoration: none;
}

.shx-art .shx-art-indice-movil a:hover {
	color: var(--enlace);
	text-decoration: underline;
}

/* El desplegable del índice dentro del texto (en el teléfono): con la letra del índice, no la del texto */
.shx-art .shx-art-texto .shx-art-indice-titulo {
	margin: 0 0 12px;
	font-size: 13px;
	line-height: 1.3;
	color: var(--suave);
}

.shx-art .shx-art-texto .shx-art-indice-movil li {
	font-size: 15px;
	line-height: 1.5;
}

.shx-art .shx-art-texto .shx-art-indice-movil a {
	color: var(--texto);
	text-decoration: none;
}

.shx-art .shx-art-texto .shx-art-indice-movil a:hover {
	color: var(--enlace);
	text-decoration: underline;
}

/* El texto */
.shx-art .shx-art-texto {
	min-width: 0;
	counter-reset: shx-paso;
}

.shx-art .shx-art-texto p,
.shx-art .shx-art-texto li {
	font-size: 18px;
	line-height: 1.75;
	color: var(--texto);
}

.shx-art .shx-art-texto p {
	margin: 0 0 20px;
}

/*
 * El texto corrido va justificado. Adrian, 11-oct-2026, sobre la entrada del
 * Buen Fin: «Que los párrafos queden con el texto justificado para que se vea
 * más cuadrado y uniforme». Los títulos, las fichas y las cifras (columnas
 * angostas), las píldoras de .shx-chips y el cierre siguen alineados a la
 * izquierda: en una línea corta, el justificado abre huecos entre las
 * palabras. En el teléfono se parten las palabras al final de la línea (ver el
 * final de la hoja).
 */
.shx-art .shx-art-texto > p,
.shx-art .shx-art-texto > ul.wp-block-list:not(.shx-chips) li,
.shx-art .shx-art-texto > ol.wp-block-list li,
.shx-art .shx-art-texto .shx-esencial li,
.shx-art .shx-art-texto .shx-nota p,
.shx-art .shx-art-texto .shx-preguntas details p {
	text-align: justify;
}

.shx-art .shx-art-texto a {
	color: var(--enlace);
	text-decoration: underline;
	text-underline-offset: 2px;
}

/*
 * El kit de Elementor les pone a todos los enlaces el tamaño de su texto
 * general (15 px), y en un párrafo de 18 px el enlace se veía más chico. Dentro
 * de un párrafo o de una lista, el enlace es del tamaño del texto que lo rodea.
 */
.shx-art .shx-art-texto p a,
.shx-art .shx-art-texto li a {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
}

.shx-art .shx-art-texto a:hover {
	color: var(--navy);
}

.shx-art .shx-art-texto strong {
	color: var(--navy);
	font-weight: 600;
}

.shx-art .shx-art-texto .shx-entrada {
	font-size: 21px;
	font-weight: 300;
	line-height: 1.65;
	color: var(--oscuro);
}

.shx-art .shx-art-texto h2 {
	margin: 64px 0 18px;
	scroll-margin-top: 24px;
	font-family: Alexandria, sans-serif;
	font-size: clamp(25px, 2.6vw, 31px);
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: 0;
	text-transform: none;
	text-wrap: balance;
	color: var(--navy);
}

.shx-art .shx-art-texto .shx-paso + h2 {
	margin-top: 0;
}

.shx-art .shx-art-texto h3 {
	margin: 0 0 8px;
	font-family: Alexandria, sans-serif;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.35;
	text-transform: none;
	color: var(--navy);
}

.shx-art .shx-art-texto .shx-paso {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 64px 0 12px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .12em;
	line-height: 1.3;
	text-transform: uppercase;
	color: var(--azul);
	counter-increment: shx-paso;
}

.shx-art .shx-art-texto .shx-paso::before {
	content: counter(shx-paso);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: var(--navy);
	color: #fff;
	font-size: 14px;
	letter-spacing: 0;
}

/* Lo esencial */
.shx-art .shx-art-texto .shx-esencial {
	margin: 36px 0 0;
	padding: 26px 28px;
	border-radius: 16px;
	background: var(--fondo-suave);
}

.shx-art .shx-art-texto .shx-esencial > * {
	margin-top: 0;
}

.shx-art .shx-art-texto .shx-esencial-titulo {
	margin: 0 0 12px;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .14em;
	line-height: 1.3;
	text-transform: uppercase;
	color: var(--azul);
}

.shx-art .shx-art-texto .shx-esencial ul {
	display: grid;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.shx-art .shx-art-texto .shx-esencial li {
	position: relative;
	padding-left: 30px;
	font-size: 16px;
	line-height: 1.6;
	color: var(--oscuro);
}

.shx-art .shx-art-texto .shx-esencial li::before {
	content: "";
	position: absolute;
	top: 4px;
	left: 0;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: var(--azul) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 12px no-repeat;
}

/* Listas sueltas del texto (las de «lo esencial» y las de las fichas tienen su propio estilo) */
.shx-art .shx-art-texto > ul.wp-block-list:not(.shx-chips),
.shx-art .shx-art-texto > ol.wp-block-list:not(.shx-numerada) {
	margin: 0 0 24px;
	padding-left: 24px;
}

.shx-art .shx-art-texto > ul.wp-block-list:not(.shx-chips) li,
.shx-art .shx-art-texto > ol.wp-block-list:not(.shx-numerada) li {
	margin: 0 0 8px;
}

.shx-art .shx-art-texto .shx-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 4px 0 24px;
	padding: 0;
	list-style: none;
}

.shx-art .shx-art-texto .shx-chips li {
	margin: 0;
	padding: 7px 13px;
	border-radius: 999px;
	background: var(--fondo-suave);
	color: var(--navy);
	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
}

.shx-art .shx-art-texto .shx-numerada {
	display: grid;
	gap: 16px;
	margin: 22px 0 24px;
	padding: 0;
	list-style: none;
	counter-reset: shx-n;
}

.shx-art .shx-art-texto .shx-numerada li {
	position: relative;
	margin: 0;
	padding-left: 50px;
	counter-increment: shx-n;
}

.shx-art .shx-art-texto .shx-numerada li::before {
	content: counter(shx-n);
	position: absolute;
	top: 2px;
	left: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: var(--fondo-azul);
	color: var(--navy);
	font-size: 15px;
	font-weight: 700;
}

/* Fichas de dos o tres, con su ícono */
.shx-art .shx-art-texto .shx-fichas {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	gap: 16px;
	margin: 26px 0 28px;
}

.shx-art .shx-art-texto .shx-fichas > * {
	margin: 0;
}

.shx-art .shx-art-texto .shx-ficha {
	padding: 22px 22px 20px;
	border: 1px solid var(--borde);
	border-radius: 16px;
	background: #fff;
}

.shx-art .shx-art-texto .shx-ficha::before {
	content: "";
	display: block;
	width: 42px;
	height: 42px;
	margin-bottom: 14px;
	border-radius: 12px;
	background-color: var(--fondo-azul);
	background-image: var(--icono, none);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 22px;
}

.shx-art .shx-art-texto .shx-ficha p {
	margin: 0;
	font-size: 15.5px;
	line-height: 1.6;
}

.shx-art .shx-art-texto .shx-ficha .shx-ficha-dato {
	margin-top: 12px;
	font-size: 14px;
	font-weight: 600;
	color: var(--navy);
}

/* Los íconos, en el azul de la marca (#008DDA), con trazo como los del resto del sitio */
.shx-ic-tienda { --icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008DDA' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21V9l8-5 8 5v12'/%3E%3Cpath d='M9 21v-6h6v6'/%3E%3C/svg%3E"); }
.shx-ic-mundo { --icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008DDA' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3a14 14 0 0 1 0 18M12 3a14 14 0 0 0 0 18'/%3E%3C/svg%3E"); }
.shx-ic-rayo { --icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008DDA' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 2 4 14h7l-1 8 9-12h-7z'/%3E%3C/svg%3E"); }
.shx-ic-caja { --icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008DDA' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 8 12 3 3 8v8l9 5 9-5z'/%3E%3Cpath d='M3 8l9 5 9-5M12 13v8'/%3E%3C/svg%3E"); }
.shx-ic-ubicacion { --icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008DDA' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6.3-7-11.5A7 7 0 0 1 19 9.5C19 14.7 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E"); }
.shx-ic-avion { --icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008DDA' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 13 3 11l1.5-1.5 7 .5 4-4.5a2 2 0 0 1 3 3l-4.5 4 .5 7L13 21l-2-7'/%3E%3C/svg%3E"); }
.shx-ic-camion { --icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008DDA' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 7h11v9H3zM14 10h4l3 3v3h-7z'/%3E%3Ccircle cx='7' cy='17.5' r='1.5'/%3E%3Ccircle cx='17' cy='17.5' r='1.5'/%3E%3C/svg%3E"); }
.shx-ic-documento { --icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008DDA' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H6v18h12V7z'/%3E%3Cpath d='M14 3v4h4M9 12h6M9 16h6'/%3E%3C/svg%3E"); }
.shx-ic-dinero { --icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008DDA' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='18' height='12' rx='2'/%3E%3Ccircle cx='12' cy='12' r='2.5'/%3E%3C/svg%3E"); }
.shx-ic-reloj { --icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008DDA' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E"); }
.shx-ic-escudo { --icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008DDA' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 5 6v6c0 4.5 3 7.5 7 9 4-1.5 7-4.5 7-9V6z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E"); }
.shx-ic-grafica { --icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008DDA' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20V10M10 20V4M16 20v-7M22 20H2'/%3E%3C/svg%3E"); }
.shx-ic-perfume { --icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008DDA' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='9' width='12' height='12' rx='3'/%3E%3Cpath d='M10 9V6h4v3M9 3h6'/%3E%3C/svg%3E"); }
.shx-ic-persona { --icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008DDA' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c1.5-4 4.5-6 8-6s6.5 2 8 6'/%3E%3C/svg%3E"); }

/* Cifras: niveles de precio, datos del sector */
.shx-art .shx-art-texto .shx-cifras {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
	gap: 14px;
	margin: 26px 0 28px;
}

.shx-art .shx-art-texto .shx-cifras > * {
	margin: 0;
}

.shx-art .shx-art-texto .shx-cifra {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 22px 20px;
	border: 1px solid var(--borde);
	border-radius: 16px;
}

.shx-art .shx-art-texto .shx-cifra p {
	margin: 0;
	font-size: 15px;
	line-height: 1.55;
}

.shx-art .shx-art-texto .shx-cifra .shx-cifra-antes {
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--suave);
}

.shx-art .shx-art-texto .shx-cifra .shx-cifra-valor {
	font-size: 30px;
	font-weight: 700;
	line-height: 1.05;
	color: var(--navy);
	font-variant-numeric: tabular-nums;
}

.shx-art .shx-art-texto .shx-cifra-destacada {
	border-color: var(--navy);
	background: var(--navy);
}

.shx-art .shx-art-texto .shx-cifra-destacada p,
.shx-art .shx-art-texto .shx-cifra-destacada .shx-cifra-valor {
	color: #fff;
}

.shx-art .shx-art-texto .shx-cifra-destacada .shx-cifra-antes {
	color: var(--cian);
}

/* Bueno saberlo */
.shx-art .shx-art-texto .shx-nota {
	position: relative;
	margin: 26px 0 28px;
	padding: 20px 22px 20px 58px;
	border-radius: 16px;
	background: var(--fondo-azul);
}

.shx-art .shx-art-texto .shx-nota::before {
	content: "";
	position: absolute;
	top: 22px;
	left: 22px;
	width: 22px;
	height: 22px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008DDA' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v5M12 8h.01'/%3E%3C/svg%3E") center / 22px no-repeat;
}

.shx-art .shx-art-texto .shx-nota p {
	margin: 0;
	font-size: 16px;
	line-height: 1.65;
	color: var(--oscuro);
}

/* Fotos */
.shx-art .shx-art-texto .wp-block-image {
	margin: 30px 0 32px;
}

/* Las fotos del texto, siempre horizontales: varias de la biblioteca son verticales y ocupaban más de una pantalla */
.shx-art .shx-art-texto .wp-block-image img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	object-position: center 30%;
	border-radius: 16px;
	box-shadow: 0 18px 40px rgba(15, 33, 103, .14);
}

.shx-art .shx-art-texto .wp-block-image figcaption {
	margin: 12px 0 0;
	font-size: 14px;
	line-height: 1.5;
	text-align: left;
	color: var(--suave);
}

/* Preguntas frecuentes */
.shx-art .shx-art-texto .shx-preguntas {
	margin: 22px 0 0;
	border-top: 1px solid var(--borde);
}

.shx-art .shx-art-texto .shx-preguntas > * {
	margin: 0;
}

.shx-art .shx-art-texto .shx-preguntas details {
	border-bottom: 1px solid var(--borde);
}

.shx-art .shx-art-texto .shx-preguntas summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	padding: 20px 2px;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.4;
	color: var(--navy);
	list-style: none;
	cursor: pointer;
}

.shx-art .shx-art-texto .shx-preguntas summary::-webkit-details-marker {
	display: none;
}

.shx-art .shx-art-texto .shx-preguntas summary::after {
	content: "+";
	flex: none;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--fondo-suave);
	color: var(--azul);
	font-size: 20px;
	font-weight: 400;
	line-height: 30px;
	text-align: center;
}

.shx-art .shx-art-texto .shx-preguntas details[open] summary::after {
	content: "\2212";
}

.shx-art .shx-art-texto .shx-preguntas details p {
	margin: 0 0 22px;
	padding-right: 50px;
	font-size: 17px;
	line-height: 1.7;
}

/* El cierre, con el botón de precios */
.shx-art .shx-art-texto .shx-cierre {
	margin: 72px 0 0;
	padding: 44px 44px 40px;
	border-radius: 22px;
	background: linear-gradient(135deg, #0F2167 0%, #0B1A55 100%);
}

.shx-art .shx-art-texto .shx-cierre > * {
	margin-top: 0;
}

.shx-art .shx-art-texto .shx-cierre p {
	color: rgba(255, 255, 255, .9);
}

.shx-art .shx-art-texto .shx-cierre .shx-cierre-titulo {
	margin: 0 0 12px;
	font-size: clamp(26px, 2.8vw, 34px);
	font-weight: 600;
	line-height: 1.2;
	color: #fff;
}

.shx-art .shx-art-texto .shx-cierre .shx-precios {
	align-items: flex-start;
	max-width: none;
	margin: 26px 0 0;
	text-align: left;
}

.shx-art .shx-art-texto .shx-cierre .shx-precios p {
	margin: 0;
	font-size: 14px;
	color: rgba(255, 255, 255, .8);
}

.shx-art .shx-art-texto .shx-cierre strong {
	color: #fff;
}

.shx-art .shx-art-texto .shx-cierre .shx-precios a.elementor-button {
	padding: 15px 28px;
	border-radius: 10px;
	background: var(--azul);
	color: #fff;
	font-size: 16px;
	font-weight: 600;
	text-decoration: none;
	transition: background .2s, color .2s;
}

.shx-art .shx-art-texto .shx-cierre .shx-precios a.elementor-button:hover,
.shx-art .shx-art-texto .shx-cierre .shx-precios a.elementor-button:focus-visible {
	background: var(--cian);
}

.shx-art .shx-art-texto .shx-cierre .shx-precios a.elementor-button:hover .elementor-button-text,
.shx-art .shx-art-texto .shx-cierre .shx-precios a.elementor-button:focus-visible .elementor-button-text {
	color: var(--navy);
}

/* Las relacionadas de shoppex-seo.php, en el mismo borde que el texto */
.shx-art .shx-seo-pie {
	max-width: 1230px;
	padding: 0 20px;
}

/* El autor */
.shx-art .shx-art-autor {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	margin: 44px 0 0;
	padding: 32px 0 0;
	border-top: 1px solid var(--borde);
}

.shx-art .shx-art-autor .shx-art-avatar {
	width: 52px;
	height: 52px;
	background: var(--fondo-azul);
	box-shadow: none;
}

.shx-art .shx-art-autor p {
	margin: 0;
	font-size: 15px;
	line-height: 1.6;
}

.shx-art .shx-art-autor .shx-art-autor-nombre {
	font-size: 16px;
	font-weight: 600;
	color: var(--navy);
}

/*
 * «Me gusta» y «Compartir» (13-oct-2026). Tres clases en cada regla: los kits
 * de Elementor del sitio pintan todos los <button> con fondo de color, y al
 * pasar el mouse y al enfocar, con dos clases y un elemento.
 */
.shx-art .shx-art-social {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 14px 24px;
	margin: 48px 0 0;
}

.shx-art .shx-art-social .shx-art-social-titulo {
	margin: 0;
	font-size: 17px;
	font-weight: 600;
	line-height: 1.4;
	color: var(--navy);
}

.shx-art .shx-art-social .shx-art-social-botones {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.shx-art .shx-art-social .shx-art-gusta,
.shx-art .shx-art-social .shx-art-compartir {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 10px 18px;
	border: 1px solid var(--borde);
	border-radius: 999px;
	background: #fff;
	color: var(--navy);
	font-family: inherit;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.2;
	/* El kit de las páginas en español (42911) pone los botones en mayúsculas. */
	text-transform: none;
	letter-spacing: normal;
	cursor: pointer;
	transition: background .15s, border-color .15s;
}

.shx-art .shx-art-social .shx-art-gusta:hover,
.shx-art .shx-art-social .shx-art-gusta:focus,
.shx-art .shx-art-social .shx-art-compartir:hover,
.shx-art .shx-art-social .shx-art-compartir:focus {
	border-color: #C9D3E6;
	background: var(--fondo-suave);
	color: var(--navy);
}

.shx-art .shx-art-social .shx-art-gusta[aria-pressed="true"] {
	border-color: var(--azul);
	background: var(--fondo-azul);
}

.shx-art .shx-art-social svg {
	width: 18px;
	height: 18px;
	flex: none;
}

.shx-art .shx-art-social .shx-ico-linea {
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.shx-art .shx-art-social .shx-ico-lleno {
	fill: currentColor;
}

.shx-art .shx-art-social .shx-art-gusta[aria-pressed="true"] .shx-ico-linea {
	fill: var(--azul);
	stroke: var(--azul);
}

.shx-art .shx-art-social .shx-art-gusta-n {
	color: var(--suave);
	font-variant-numeric: tabular-nums;
}

.shx-art .shx-art-social .shx-art-gusta-n[hidden],
.shx-art .shx-art-social .shx-art-redes[hidden] {
	display: none;
}

/* El menú de redes: debajo del botón y alineado a su borde derecho, para que no se salga de la página. */
.shx-art .shx-art-social .shx-art-comparte {
	position: relative;
}

.shx-art .shx-art-social .shx-art-redes {
	position: absolute;
	z-index: 30;
	top: calc(100% + 8px);
	right: 0;
	display: grid;
	min-width: 220px;
	padding: 8px;
	border: 1px solid var(--borde);
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 12px 32px rgba(15, 33, 103, .14);
}

.shx-art .shx-art-social .shx-art-redes a,
.shx-art .shx-art-social .shx-art-redes .shx-art-copiar {
	display: flex;
	align-items: center;
	gap: 12px;
	width: 100%;
	margin: 0;
	padding: 10px 12px;
	border: 0;
	border-radius: 10px;
	background: none;
	color: var(--oscuro);
	font-family: inherit;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.3;
	text-align: left;
	text-decoration: none;
	text-transform: none;
	letter-spacing: normal;
	cursor: pointer;
}

.shx-art .shx-art-social .shx-art-redes a:hover,
.shx-art .shx-art-social .shx-art-redes a:focus,
.shx-art .shx-art-social .shx-art-redes .shx-art-copiar:hover,
.shx-art .shx-art-social .shx-art-redes .shx-art-copiar:focus {
	background: var(--fondo-suave);
	color: var(--navy);
}

/* En la columna fija: la misma pareja, más chica, entre el índice y el botón de precios. */
.shx-art .shx-art-social.shx-art-social-mini {
	margin: 0;
	justify-content: flex-start;
	transition: opacity .2s, visibility .2s;
}

/* Mientras la pareja del final del texto está a la vista. */
.shx-art .shx-art-social.shx-art-social-oculta {
	opacity: 0;
	visibility: hidden;
}

.shx-art .shx-art-social-mini .shx-art-gusta,
.shx-art .shx-art-social-mini .shx-art-compartir {
	padding: 8px 14px;
	font-size: 14px;
}

/* En escritorio, la primera sección se mete debajo del encabezado transparente (100 px) */
@media (min-width: 1025px) {
	.shx-art .shx-art-portada {
		margin-top: -100px;
	}

	.shx-art .shx-art-portada .shx-art-caja {
		padding-top: 172px;
		padding-bottom: 76px;
	}
}

@media (max-width: 1100px) {
	.shx-art .shx-art-cuerpo {
		grid-template-columns: minmax(0, 1fr);
		padding-top: 44px;
	}

	.shx-art .shx-art-texto {
		max-width: 720px;
	}

	.shx-art .shx-art-lateral {
		display: none;
	}

	.shx-art .shx-art-indice-movil {
		display: block;
	}
}

@media (max-width: 700px) {
	.shx-art .shx-art-texto p,
	.shx-art .shx-art-texto li {
		font-size: 17px;
	}

	.shx-art .shx-art-texto .shx-entrada {
		font-size: 19px;
	}

	.shx-art .shx-art-texto h2,
	.shx-art .shx-art-texto .shx-paso {
		margin-top: 52px;
	}

	.shx-art .shx-art-texto .shx-cierre {
		padding: 32px 24px;
	}

	.shx-art .shx-art-texto .shx-preguntas details p {
		padding-right: 0;
	}

	/* La línea es corta: si no se parten las palabras, el justificado deja huecos grandes. */
	.shx-art .shx-art-texto > p,
	.shx-art .shx-art-texto > ul.wp-block-list:not(.shx-chips) li,
	.shx-art .shx-art-texto > ol.wp-block-list li,
	.shx-art .shx-art-texto .shx-esencial li,
	.shx-art .shx-art-texto .shx-nota p,
	.shx-art .shx-art-texto .shx-preguntas details p {
		-webkit-hyphens: auto;
		hyphens: auto;
		hyphenate-limit-chars: 7 3 3;
	}
}