/**
 * Estilos del texto escrito con el editor de WordPress.
 *
 * Aquí va el aspecto de ese texto: párrafos, títulos, enlaces, listas, citas e
 * imágenes intercaladas.
 *
 * Escala de títulos: el título de la página lo pone la plantilla (Montserrat Bold
 * 24/32). Dentro del texto, Encabezado 2 = apartado y Encabezado 3 = subapartado, al
 * tamaño del cuerpo y sin línea: THE TIAS no anota títulos dentro del texto, así que se
 * usan su fuente de títulos y la negrita del cuerpo, ya anotadas. Solo en la caja de
 * referencias del episodio los dos niveles son los rótulos del PDF: Encabezado 2 =
 * «REFERENCIAS:» y Encabezado 3 = «Artículos:» con su línea. Del 4 al 6 no están
 * definidos y no se ofrecen en el editor. Las listas van con el mismo texto que el
 * cuerpo.
 *
 * No se usa Elementor → Ajustes del sitio → Tipografía porque allí los valores
 * son los del SITIO entero (su «Cuerpo» ya apunta a la Variable rj-body-large) y
 * el texto de las páginas tiene su propio tamaño. Estas reglas valen para
 * cualquier página o entrada que muestre texto del editor, sin tocar nada de lo
 * construido con elementos de Elementor.
 *
 * El texto del editor no son elementos de Elementor, así que no puede llevar
 * Clases globales: se le da estilo por etiqueta, acotado a las tres zonas donde
 * ese texto aparece.
 *
 * Valores: THE TIAS, «RJ_Episodios_Capitulo_1440px_ITC_ScrollCompleto.pdf» y su
 * versión de 360px (textos) y los PDF de instrucciones de medidas. Colores,
 * fuentes y espacios salen de las Variables del Kit.
 *
 * Un único corte: por encima de 1024px manda el diseño de 1440; de 1024 hacia
 * abajo, el de 360.
 *
 * @package Radiojaputa
 */

/* Zonas: el widget «Contenido de la entrada» de Elementor, el texto de los campos
   de ACF que la plantilla del episodio imprime con «Editor de texto» (Clase CSS
   `rj-contenido` en Avanzado), la plantilla del tema cuando Elementor no
   interviene, y el cuerpo del editor de WordPress. */

/* --- Párrafos ------------------------------------------------------------ */

.elementor-widget-theme-post-content,
.rj-contenido,
.entry-content,
.mce-content-body {
	color: var(--rj-contrast);
	font-family: var(--rj-font-body), sans-serif;
	font-weight: 300;
	font-size: 22px;
	line-height: 32px;
}

.elementor-widget-theme-post-content p,
.rj-contenido p,
.entry-content p,
.mce-content-body p {
	margin-block: 0 var(--rj-space-12);
}

.elementor-widget-theme-post-content p:last-child,
.rj-contenido p:last-child,
.entry-content p:last-child,
.mce-content-body p:last-child {
	margin-block-end: 0;
}

.elementor-widget-theme-post-content :is(strong, b),
.rj-contenido :is(strong, b),
.entry-content :is(strong, b),
.mce-content-body :is(strong, b) {
	font-weight: 700;
}

/* --- Títulos ------------------------------------------------------------- */

.elementor-widget-theme-post-content :is(h2, h3),
.rj-contenido :is(h2, h3),
.entry-content :is(h2, h3),
.mce-content-body :is(h2, h3) {
	color: var(--rj-contrast);
}

/* Encabezado 2 = apartado: fuente de títulos (Montserrat Semibold) al tamaño del cuerpo. */
.elementor-widget-theme-post-content h2,
.rj-contenido h2,
.entry-content h2,
.mce-content-body h2 {
	font-family: var(--rj-font-heading), sans-serif;
	font-weight: 600;
	font-size: 22px;
	line-height: 32px;
}

/* Encabezado 3 = subapartado: la negrita del cuerpo (Switzer Bold 22/32). */
.elementor-widget-theme-post-content h3,
.rj-contenido h3,
.entry-content h3,
.mce-content-body h3 {
	font-family: var(--rj-font-body), sans-serif;
	font-weight: 700;
	font-size: 22px;
	line-height: 32px;
}

/* Caja de referencias del episodio: los dos niveles son los rótulos del PDF.
   Encabezado 2 = «REFERENCIAS:» (Switzer Semibold 20px); Encabezado 3 = «Artículos:»
   (Switzer Semibold 18px) con su línea de 0,5px debajo. */
.rj-referencias .rj-contenido h2 {
	font-family: var(--rj-font-body), sans-serif;
	font-weight: 600;
	font-size: 20px;
	line-height: 26px;
}

.rj-referencias .rj-contenido h3 {
	font-family: var(--rj-font-body), sans-serif;
	font-weight: 600;
	font-size: 18px;
	line-height: 23px;
	padding-block-end: var(--rj-space-10);
	border-block-end: var(--rj-line-thin) solid var(--rj-contrast);
}

/* Texto de los apartados que abren un Encabezado 2 o 3: 18px, como en «REFERENCIAS». */
.elementor-widget-theme-post-content .rj-body-small,
.rj-contenido .rj-body-small,
.entry-content .rj-body-small,
.mce-content-body .rj-body-small {
	font-size: 18px;
	line-height: 23px;
	letter-spacing: normal;
}

.elementor-widget-theme-post-content :is(h2, h3),
.rj-contenido :is(h2, h3),
.entry-content :is(h2, h3),
.mce-content-body :is(h2, h3) {
	margin-block: var(--rj-space-60) var(--rj-space-20);
}

/* El subapartado va más pegado a su texto que el apartado. */
.elementor-widget-theme-post-content h3,
.rj-contenido h3,
.entry-content h3,
.mce-content-body h3 {
	margin-block: var(--rj-space-40) var(--rj-space-12);
}

.rj-referencias .rj-contenido h3 {
	margin-block: var(--rj-space-60) var(--rj-space-20);
}

.elementor-widget-theme-post-content :is(h2, h3):first-child,
.rj-contenido :is(h2, h3):first-child,
.entry-content :is(h2, h3):first-child,
.mce-content-body :is(h2, h3):first-child {
	margin-block-start: 0;
}

/* --- Enlaces dentro del texto -------------------------------------------- */

/* El panel no tiene control para el grosor del subrayado; THE TIAS anota 0,75px. */
.elementor-widget-theme-post-content a,
.rj-contenido a,
.entry-content a,
.mce-content-body a {
	color: inherit;
	text-decoration-line: underline;
	text-decoration-thickness: 0.75px;
}

/* --- Listas -------------------------------------------------------------- */

.elementor-widget-theme-post-content :is(ul, ol),
.rj-contenido :is(ul, ol),
.entry-content :is(ul, ol),
.mce-content-body :is(ul, ol) {
	margin-block: var(--rj-space-20);
	padding-inline-start: 22px;
}

.elementor-widget-theme-post-content ul,
.rj-contenido ul,
.entry-content ul,
.mce-content-body ul {
	list-style: disc;
}

.elementor-widget-theme-post-content ol,
.rj-contenido ol,
.entry-content ol,
.mce-content-body ol {
	list-style: decimal;
}

.elementor-widget-theme-post-content li,
.rj-contenido li,
.entry-content li,
.mce-content-body li {
	margin-block-end: var(--rj-space-8);
}

.elementor-widget-theme-post-content li:last-child,
.rj-contenido li:last-child,
.entry-content li:last-child,
.mce-content-body li:last-child {
	margin-block-end: 0;
}

/* Una lista dentro de otra continúa con la misma letra y una sangría más. */
.elementor-widget-theme-post-content :is(ul, ol) :is(ul, ol),
.rj-contenido :is(ul, ol) :is(ul, ol),
.entry-content :is(ul, ol) :is(ul, ol),
.mce-content-body :is(ul, ol) :is(ul, ol) {
	margin-block: var(--rj-space-8);
}

/* --- Citas --------------------------------------------------------------- */

.elementor-widget-theme-post-content blockquote,
.rj-contenido blockquote,
.entry-content blockquote,
.mce-content-body blockquote {
	max-width: 450px;
	margin-block: var(--rj-space-60);
	margin-inline: 0;
	padding-block: var(--rj-space-20) 23px;
	padding-inline: 0;
	border-block: 3px solid var(--rj-contrast);
	font-family: var(--rj-font-heading), sans-serif;
	font-weight: 600;
	font-size: 24px;
	line-height: 35px;
	color: var(--rj-contrast);
}

.elementor-widget-theme-post-content blockquote p,
.rj-contenido blockquote p,
.entry-content blockquote p,
.mce-content-body blockquote p {
	margin-block: 0;
	font: inherit;
	color: inherit;
}

/* --- Imágenes intercaladas ----------------------------------------------- */

.elementor-widget-theme-post-content :is(img, figure),
.rj-contenido :is(img, figure),
.entry-content :is(img, figure),
.mce-content-body :is(img, figure) {
	display: block;
	max-width: min(100%, 660px);
	height: auto;
	margin-block: var(--rj-space-40);
	margin-inline: 0;
}

/* --- Móvil: de 1024px hacia abajo manda el diseño de 360px ---------------- */

@media (max-width: 1024px) {

	.elementor-widget-theme-post-content,
	.rj-contenido,
	.entry-content {
		font-size: 20px;
		line-height: 24px;
		letter-spacing: -0.01em;
	}

	.elementor-widget-theme-post-content p,
	.rj-contenido p,
	.entry-content p {
		margin-block-end: var(--rj-space-20);
	}

	.elementor-widget-theme-post-content :is(strong, b),
	.rj-contenido :is(strong, b),
	.entry-content :is(strong, b) {
		font-weight: 600;
	}

	.elementor-widget-theme-post-content :is(h2, h3),
	.rj-contenido :is(h2, h3),
	.entry-content :is(h2, h3) {
		margin-block: var(--rj-space-30) var(--rj-space-20);
	}

	/* Apartado y subapartado: al tamaño del cuerpo de móvil (20/24). */
	.elementor-widget-theme-post-content :is(h2, h3),
	.rj-contenido :is(h2, h3),
	.entry-content :is(h2, h3) {
		font-size: 20px;
		line-height: 24px;
		letter-spacing: -0.01em;
	}

	.elementor-widget-theme-post-content h3,
	.rj-contenido h3,
	.entry-content h3 {
		margin-block: var(--rj-space-20) var(--rj-space-12);
		font-weight: 600;
	}

	.rj-referencias .rj-contenido h2 {
		font-size: 18px;
		line-height: 23px;
		letter-spacing: normal;
	}

	.rj-referencias .rj-contenido h3 {
		margin-block: var(--rj-space-30) var(--rj-space-20);
		font-size: 15px;
		line-height: 18px;
		letter-spacing: normal;
	}

	.elementor-widget-theme-post-content .rj-body-small,
	.rj-contenido .rj-body-small,
	.entry-content .rj-body-small {
		font-size: 15px;
		line-height: 18px;
	}

	.elementor-widget-theme-post-content :is(ul, ol),
	.rj-contenido :is(ul, ol),
	.entry-content :is(ul, ol) {
		margin-block: var(--rj-space-20);
	}

	/* La cita deja de ser un bloque entre líneas y pasa a franja de color a todo
	   el ancho: sale de los 15px de margen lateral del móvil. */
	.elementor-widget-theme-post-content blockquote,
	.rj-contenido blockquote,
	.entry-content blockquote {
		max-width: none;
		margin-block: var(--rj-space-30);
		margin-inline: calc(var(--rj-space-15) * -1);
		padding: var(--rj-space-30);
		border: 0;
		background-color: var(--rj-accent);
		font-size: 20px;
		line-height: 26px;
		letter-spacing: -0.01em;
	}

	.elementor-widget-theme-post-content :is(img, figure),
	.rj-contenido :is(img, figure),
	.entry-content :is(img, figure) {
		max-width: none;
		width: calc(100% + var(--rj-space-15) * 2);
		margin-block: 22px; /* medido en el wireframe de móvil: no hay anotación */
		margin-inline: calc(var(--rj-space-15) * -1);
	}
}

/* --- Caja de referencias del episodio --------------------------------------
   Dentro de la caja el texto baja a 18/23 (lista: Switzer Medium Italic + Light).
   ITC 1440 y 360 del episodio; en móvil, 15/18 y 15 entre elementos de la lista. */

.rj-referencias .rj-contenido {
	font-size: 18px;
	line-height: 23px;
}

.rj-referencias .rj-contenido > :first-child {
	margin-block-start: 0;
}

@media (max-width: 1024px) {

	.rj-referencias .rj-contenido {
		font-size: 15px;
		line-height: 18px;
	}

	.rj-referencias .rj-contenido li {
		margin-block-end: var(--rj-space-15);
	}
}
