/*
 * Separa el contenido principal de la barra lateral en todo el blog:
 * portada, busquedas, archivos y entradas individuales.
 */
.blog-wrapper .large-9.col {
	box-sizing: border-box;
	padding-right: clamp(38px, 3.4vw, 64px) !important;
}

.blog-wrapper .post-sidebar.col {
	box-sizing: border-box;
	padding-left: clamp(28px, 2.4vw, 44px) !important;
}

/*
 * Da aire a las imagenes dentro de las entradas sin tocar miniaturas,
 * iconos, avatares, cabecera, barra lateral ni pie de pagina.
 * Cubre el editor clasico, Gutenberg y las filas creadas con WPBakery.
 */
.single-post .blog-wrapper .entry-content .wpb_single_image,
.single-post .blog-wrapper .entry-content figure.wp-block-image,
.single-post .blog-wrapper .entry-content .gallery,
.single-post .blog-wrapper .entry-content .wp-caption,
.single-post .blog-wrapper .entry-content p > img:only-child,
.single-post .blog-wrapper .entry-content p > a:only-child > img {
	margin-top: 24px !important;
	margin-bottom: 24px !important;
}

/*
 * En navegadores actuales, asigna el espacio a la fila completa. Asi una fila
 * con dos o mas columnas conserva un unico gap de 24 px arriba y abajo.
 */
@supports selector(.vc_row:has(.wpb_single_image)) {
	.single-post .blog-wrapper .entry-content .vc_row:has(.wpb_single_image) {
		margin-top: 24px !important;
		margin-bottom: 24px !important;
	}

	.single-post .blog-wrapper .entry-content .vc_row:has(.wpb_single_image) .wpb_single_image {
		margin-top: 0 !important;
		margin-bottom: 0 !important;
	}
}

/* En tablet y movil la barra baja: cada bloque conserva aire propio. */
@media only screen and (max-width: 849px) {
	.blog-wrapper .large-9.col,
	.blog-wrapper .post-sidebar.col {
		padding-right: 20px !important;
		padding-left: 20px !important;
	}
}