/* ===== Fondo y lectura general ===== */

body {
	background-color: var(--color-arena);
	color: var(--color-tinta);
	font-family: var(--fuente-textos);
}

.entry-content,
.exsa-contenido-articulo {
	max-width: var(--ancho-lectura);
	margin-inline: auto;
	font-size: 1.125rem;
	line-height: 1.7;
}

.entry-content p {
	margin-bottom: 1.4em;
}

.entry-title,
.entry-content h2,
.entry-content h3 {
	font-family: var(--fuente-titulos);
	color: var(--color-selva-noche);
	line-height: 1.2;
	font-weight: 650;
}

.entry-title {
	font-size: clamp(1.9rem, 4vw, 2.75rem);
}

.entry-content h2 {
	font-size: clamp(1.4rem, 3vw, 1.9rem);
	margin-top: 2em;
}

.entry-content h3 {
	font-size: clamp(1.15rem, 2.5vw, 1.4rem);
	margin-top: 1.6em;
}

.entry-content a {
	color: var(--color-oceano);
	text-decoration-thickness: 2px;
}

/* ===== Artículos (entradas individuales) =====
   Kadence pinta el texto con su propia paleta (un gris azulado). Estas
   reglas empiezan por "body.single-post .entry-content", más concretas que
   las de Kadence, así que ganan sin necesidad de !important. Además se
   redefine la paleta de Kadence solo dentro del artículo, para que los
   bloques que la usen hereden también los colores del tema. */

body.single-post .entry-content {
	--global-palette3: var(--color-selva-noche);
	--global-palette4: var(--color-tinta);
	--global-palette5: var(--color-tinta);
	color: var(--color-tinta);
	max-width: var(--ancho-lectura);
	margin-inline: auto;
	font-size: 1.125rem;
	line-height: 1.75;
}

body.single-post .entry-content p,
body.single-post .entry-content li,
body.single-post .entry-content td,
body.single-post .entry-content blockquote {
	color: var(--color-tinta);
}

body.single-post .entry-title,
body.single-post .entry-content h2,
body.single-post .entry-content h3,
body.single-post .entry-content h4 {
	color: var(--color-selva-noche);
	font-family: var(--fuente-titulos);
}

body.single-post .entry-content p {
	margin-top: 0;
	margin-bottom: 1.4em;
}

/* Entradilla: el primer párrafo (lo marca inc/articulos.php) */
body.single-post .entry-content p.exsa-entradilla {
	font-size: 1.3rem;
	line-height: 1.6;
	margin-bottom: 1.6em;
}

/* H2: rayita ámbar encima y aire por arriba */
body.single-post .entry-content h2:not([class*="exsa-"]) {
	position: relative;
	font-size: clamp(1.5rem, 3.2vw, 2rem);
	font-weight: 650;
	line-height: 1.2;
	margin-top: 2.8em;
	margin-bottom: 0.7em;
	padding-top: 0.9rem;
}

body.single-post .entry-content h2:not([class*="exsa-"])::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 3rem;
	height: 4px;
	border-radius: 2px;
	background: var(--color-ambar);
}

/* H3: más pequeños, sin serifa y en musgo, para distinguirlos de los H2 */
body.single-post .entry-content h3:not([class*="exsa-"]) {
	font-family: var(--fuente-textos);
	font-size: 1.2rem;
	font-weight: 700;
	line-height: 1.35;
	color: var(--color-musgo);
	margin-top: 2em;
	margin-bottom: 0.5em;
}

/* Al saltar desde el índice, que la cabecera fija no tape el título */
body.single-post .entry-content h2[id] {
	scroll-margin-top: 6rem;
}

/* Enlaces dentro del texto: musgo, subrayados al pasar el ratón */
body.single-post .entry-content :where(p, li, td, th, blockquote, figcaption, dd) a:not(.wp-block-button__link) {
	color: var(--color-musgo);
	font-weight: 500;
	text-decoration: none;
	border-bottom: 1px solid rgba(47, 107, 79, 0.35);
}

body.single-post .entry-content :where(p, li, td, th, blockquote, figcaption, dd) a:not(.wp-block-button__link):hover,
body.single-post .entry-content :where(p, li, td, th, blockquote, figcaption, dd) a:not(.wp-block-button__link):focus-visible {
	color: var(--color-musgo);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
	border-bottom-color: transparent;
}

/* Citas: barra ámbar y fondo arena oscuro */
body.single-post .entry-content blockquote {
	margin: 2em 0;
	padding: 1.1em 1.4em;
	background: #EDE6D6;
	border: 0;
	border-left: 4px solid var(--color-ambar);
	border-radius: 0 var(--radio-borde) var(--radio-borde) 0;
	font-style: normal;
}

body.single-post .entry-content blockquote p:last-child {
	margin-bottom: 0;
}

body.single-post .entry-content blockquote cite {
	display: block;
	margin-top: 0.6em;
	font-size: 0.9rem;
	font-style: normal;
	opacity: 0.8;
}

/* Listas: viñeta ámbar */
body.single-post .entry-content ul:not([class*="exsa-"]),
body.single-post .entry-content ol:not([class*="exsa-"]) {
	margin: 0 0 1.4em;
	padding-left: 1.4em;
}

body.single-post .entry-content ul:not([class*="exsa-"]) {
	list-style: none;
}

body.single-post .entry-content ul:not([class*="exsa-"]) > li {
	position: relative;
}

body.single-post .entry-content ul:not([class*="exsa-"]) > li::before {
	content: "";
	position: absolute;
	left: -1.1em;
	top: 0.68em;
	width: 0.45em;
	height: 0.45em;
	border-radius: 50%;
	background: var(--color-ambar);
}

body.single-post .entry-content ol:not([class*="exsa-"]) > li::marker {
	color: var(--color-ambar);
	font-weight: 700;
}

body.single-post .entry-content li {
	margin-bottom: 0.5em;
}

/* Imágenes y pies de foto */
body.single-post .entry-content figure {
	margin: 2em 0;
}

body.single-post .entry-content img {
	max-width: 100%;
	height: auto;
	border-radius: var(--radio-borde);
	box-shadow: var(--sombra-tarjeta);
}

body.single-post .entry-content figcaption {
	margin-top: 0.6em;
	font-size: 0.875rem;
	font-style: italic;
	line-height: 1.5;
	text-align: center;
	color: var(--color-tinta);
	opacity: 0.75;
}

/* Tablas: cabecera musgo y filas alternas. En el móvil, si no cabe,
   se desplaza de lado dentro de su caja en vez de romper la página. */
body.single-post .entry-content .wp-block-table {
	margin: 2em 0;
	overflow-x: auto;
}

body.single-post .entry-content table {
	width: 100%;
	border-collapse: collapse;
	font-size: 1rem;
	line-height: 1.5;
	background: #fff;
	box-shadow: var(--sombra-tarjeta);
}

body.single-post .entry-content > table {
	display: block;
	overflow-x: auto;
	margin: 2em 0;
}

body.single-post .entry-content th,
body.single-post .entry-content thead td {
	background: var(--color-musgo);
	color: #fff;
	font-weight: 600;
	text-align: left;
}

body.single-post .entry-content th,
body.single-post .entry-content td {
	padding: 0.7em 1em;
	border: 0;
	border-bottom: 1px solid rgba(15, 42, 29, 0.08);
	vertical-align: top;
}

body.single-post .entry-content tbody tr:nth-child(even) td {
	background: #F2EDE1;
}

/* ===== Índice "En este artículo" (lo genera inc/articulos.php) ===== */

.exsa-indice {
	margin: 0 0 2.2em;
	background: #fff;
	border: 1px solid rgba(15, 42, 29, 0.1);
	border-left: 4px solid var(--color-musgo);
	border-radius: var(--radio-borde);
	font-size: 1rem;
}

.exsa-indice__titulo {
	cursor: pointer;
	padding: 0.9em 1.2em;
	font-family: var(--fuente-titulos);
	font-weight: 650;
	font-size: 1.1rem;
	color: var(--color-selva-noche);
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}

.exsa-indice__titulo::-webkit-details-marker {
	display: none;
}

.exsa-indice__titulo::after {
	content: "+";
	font-family: var(--fuente-textos);
	font-size: 1.4rem;
	line-height: 1;
	color: var(--color-musgo);
}

.exsa-indice[open] .exsa-indice__titulo::after {
	content: "\2212";
}

.exsa-indice__titulo:focus-visible {
	outline: 2px solid var(--color-ambar);
	outline-offset: 2px;
	border-radius: var(--radio-borde);
}

body.single-post .entry-content .exsa-indice__lista {
	margin: 0;
	padding: 0 1.2em 1em 2.6em;
}

body.single-post .entry-content .exsa-indice__lista li {
	margin-bottom: 0.35em;
	line-height: 1.45;
}

body.single-post .entry-content .exsa-indice__lista li::marker {
	color: var(--color-musgo);
	font-weight: 600;
}

body.single-post .entry-content .exsa-indice__lista a {
	color: var(--color-tinta);
	text-decoration: none;
}

body.single-post .entry-content .exsa-indice__lista a:hover,
body.single-post .entry-content .exsa-indice__lista a:focus-visible {
	color: var(--color-musgo);
	text-decoration: underline;
}

/* ===== Caja de autor ===== */

.exsa-autor {
	display: flex;
	gap: 1.1rem;
	align-items: flex-start;
	margin: 3em 0 2em;
	padding: 1.4em;
	background: #fff;
	border-radius: var(--radio-borde);
	box-shadow: var(--sombra-tarjeta);
}

.exsa-autor__inicial {
	flex: 0 0 3.5rem;
	width: 3.5rem;
	height: 3.5rem;
	border-radius: 50%;
	background: var(--color-selva-noche);
	color: var(--color-ambar);
	font-family: var(--fuente-titulos);
	font-size: 1.6rem;
	font-weight: 650;
	display: flex;
	align-items: center;
	justify-content: center;
}

.exsa-autor__rotulo {
	display: block;
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--color-musgo);
	font-weight: 600;
}

body.single-post .entry-content .exsa-autor__nombre {
	display: inline-block;
	font-family: var(--fuente-titulos);
	font-size: 1.2rem;
	font-weight: 650;
	color: var(--color-selva-noche);
	text-decoration: none;
	margin-bottom: 0.3em;
}

body.single-post .entry-content .exsa-autor__nombre:hover {
	text-decoration: underline;
}

body.single-post .entry-content .exsa-autor__bio p {
	font-size: 0.975rem;
	line-height: 1.6;
	margin-bottom: 0.6em;
}

body.single-post .entry-content .exsa-autor__bio p:last-child {
	margin-bottom: 0;
}

/* ===== Entradas relacionadas ===== */

.exsa-relacionadas {
	margin: 3em 0 1em;
}

body.single-post .entry-content .exsa-relacionadas__titulo {
	font-size: 1.5rem;
	margin: 0 0 1rem;
}

.exsa-relacionadas .exsa-tarjetas-entradas {
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 1.25rem;
}

body.single-post .entry-content .exsa-tarjeta__imagen {
	border-radius: 0;
	box-shadow: none;
}

body.single-post .entry-content .exsa-tarjeta__titulo {
	font-size: 1.05rem;
	margin: 0 0 0.4em;
}

body.single-post .entry-content .exsa-tarjeta__titulo a {
	color: var(--color-selva-noche);
	text-decoration: none;
}

body.single-post .entry-content .exsa-tarjeta__extracto {
	font-size: 0.9rem;
	line-height: 1.5;
	margin-bottom: 0;
}

@media (max-width: 600px) {
	body.single-post .entry-content p.exsa-entradilla {
		font-size: 1.175rem;
	}

	.exsa-autor {
		flex-direction: column;
	}
}

/* ===== Tarjetas de entradas (listados) ===== */

.exsa-tarjetas-entradas {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 2rem;
}

.exsa-tarjeta {
	background: #fff;
	border-radius: var(--radio-borde);
	overflow: hidden;
	box-shadow: var(--sombra-tarjeta);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.exsa-tarjeta:hover {
	transform: translateY(-4px);
	box-shadow: var(--sombra-tarjeta-hover);
}

.exsa-tarjeta__imagen {
	aspect-ratio: 16 / 9;
	width: 100%;
	object-fit: cover;
	display: block;
}

.exsa-tarjeta__cuerpo {
	padding: 1.25rem;
}

.exsa-tarjeta__categoria {
	display: inline-block;
	background: var(--color-ambar);
	color: var(--color-selva-noche);
	font-size: 0.75rem;
	font-weight: 700;
	padding: 0.2em 0.6em;
	border-radius: 999px;
	margin-bottom: 0.6em;
}

.exsa-tarjeta__titulo {
	font-family: var(--fuente-titulos);
	font-size: 1.25rem;
	color: var(--color-selva-noche);
	line-height: 1.25;
	margin: 0 0 0.5em;
}

.exsa-tarjeta__extracto {
	font-size: 0.95rem;
	color: var(--color-tinta);
	opacity: 0.85;
}

/* Selectores de respaldo por si el listado se genera automáticamente
   con las clases estándar de WordPress/Kadence, sin usar las propias. */
article.type-post .entry-title {
	font-family: var(--fuente-titulos);
}

article.type-post .entry-card,
article.type-post {
	border-radius: var(--radio-borde);
	overflow: hidden;
}