/**
 * Artículo del blog.
 *
 * La medida de lectura manda: el cuerpo se limita a ~68 caracteres por línea,
 * que es donde el ojo deja de perder el renglón al saltar.
 */

.autum-contenedor--estrecho {
	max-width: 46rem;
}

.autum-articulo-single__cabecera {
	padding-block: 3.5rem 2rem;
}

.autum-migas {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 1.5rem;
	font-size: 0.8125rem;
	color: var(--texto-tenue);
}

.autum-migas a {
	color: inherit;
	text-decoration: none;
}

.autum-migas a:hover {
	color: var(--color-derco-red);
}

.autum-articulo-single__titulo {
	margin: 0;
	font-size: clamp(2rem, 1.2rem + 3vw, 3.25rem);
	font-weight: 700;
	line-height: 1.06;
	letter-spacing: -0.035em;
	color: var(--texto);
	text-wrap: balance;
}

.autum-articulo-single__bajada {
	margin: 1.25rem 0 0;
	font-size: 1.1875rem;
	line-height: 1.6;
	color: var(--texto-suave);
	text-wrap: pretty;
}

.autum-articulo-single__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
	margin-top: 1.75rem;
	font-size: 0.8125rem;
	color: var(--texto-tenue);
}

/* Separador entre datos, sin escribirlo en el HTML. */
.autum-articulo-single__meta > * + *::before {
	content: "·";
	margin-right: 0.75rem;
}

.autum-articulo-single__banner {
	margin-bottom: 3rem;
}

.autum-articulo-single__banner img {
	width: 100%;
	height: auto;
	aspect-ratio: 21 / 9;
	object-fit: cover;
	border-radius: var(--radio-lg);
}

/* --- Cuerpo --- */

.autum-articulo-single__cuerpo {
	font-size: 1.0625rem;
	line-height: 1.75;
	color: var(--texto-suave);
}

.autum-articulo-single__cuerpo > * + * {
	margin-top: 1.5rem;
}

.autum-articulo-single__cuerpo h2,
.autum-articulo-single__cuerpo h3 {
	margin-top: 3rem;
	color: var(--texto);
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.02em;
	text-wrap: balance;
}

.autum-articulo-single__cuerpo h2 {
	font-size: 1.75rem;
}

.autum-articulo-single__cuerpo h3 {
	font-size: 1.3125rem;
}

.autum-articulo-single__cuerpo a {
	color: var(--color-derco-red);
	text-decoration: underline;
	text-underline-offset: 0.15em;
	text-decoration-thickness: 1px;
}

.autum-articulo-single__cuerpo img,
.autum-articulo-single__cuerpo iframe,
.autum-articulo-single__cuerpo video {
	max-width: 100%;
	height: auto;
	border-radius: var(--radio-md);
}

.autum-articulo-single__cuerpo figure {
	margin: 2.5rem 0;
}

.autum-articulo-single__cuerpo figcaption {
	margin-top: 0.75rem;
	font-size: 0.8125rem;
	color: var(--texto-tenue);
	text-align: center;
}

.autum-articulo-single__cuerpo blockquote {
	margin: 2.5rem 0;
	padding-left: 1.5rem;
	border-left: 3px solid var(--color-derco-red);
	font-size: 1.1875rem;
	line-height: 1.55;
	color: var(--texto);
}

.autum-articulo-single__cuerpo ul,
.autum-articulo-single__cuerpo ol {
	padding-left: 1.25rem;
}

.autum-articulo-single__cuerpo li + li {
	margin-top: 0.5rem;
}

/* La galería nativa de WordPress puede salirse de la medida de lectura sin
   esto, porque trae su propio grid. */
.autum-articulo-single__cuerpo .wp-block-gallery {
	margin-block: 2.5rem;
}

/* --- Etiquetas --- */

.autum-articulo-single__etiquetas {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 3rem 0 0;
	padding: 2rem 0 0;
	border-top: 1px solid var(--borde);
	list-style: none;
}

.autum-articulo-single__etiquetas a {
	display: inline-block;
	padding: 0.375rem 0.875rem;
	background-color: var(--superficie-alt);
	border: 1px solid var(--borde);
	border-radius: 999px;
	color: var(--texto-suave);
	font-size: 0.8125rem;
	text-decoration: none;
	transition: border-color 0.15s ease, color 0.15s ease;
}

.autum-articulo-single__etiquetas a:hover {
	border-color: var(--color-derco-red);
	color: var(--color-derco-red);
}

.autum-articulo-single > .autum-contenedor--estrecho {
	padding-bottom: 4rem;
}