/**
 * Páginas de contenido corrido (privacidad, legales, 404).
 *
 * El resto del sitio son bloques de diseño con medidas tomadas del PDF; acá, en
 * cambio, se trata de leer párrafos largos: la columna se angosta, el cuerpo es
 * más chico que el de las secciones y el interlineado, más suelto.
 */

.silo-page {
	background: var(--c-off-white);
	color: var(--c-black);
	padding-top: clamp(2rem, 4.17vw, 5rem);
}

.silo-page__entry {
	/* Poco más de 70 caracteres por renglón: el ancho de lectura cómodo. */
	max-width: 46em;
}

.silo-page .silo-section-title {
	font-size: var(--fs-claim);
	line-height: var(--lh-display);
}

.silo-page__content {
	margin-top: clamp(1.5rem, 2.5vw, 3rem);
	font-size: var(--fs-reading);
	font-weight: var(--fw-light);
	line-height: var(--lh-reading);
}

.silo-page__content > * + * {
	margin-top: 1.15em;
}

/* Los títulos intermedios se separan del párrafo anterior más de lo que se
   separan del suyo, para que se lean como principio de bloque. */
.silo-page__content h2,
.silo-page__content h3 {
	font-size: var(--fs-md);
	font-weight: var(--fw-light);
	line-height: 1.25;
	letter-spacing: -0.01em;
}

.silo-page__content h3 {
	font-size: var(--fs-base);
}

.silo-page__content > h2 + *,
.silo-page__content > h3 + * {
	margin-top: 0.6em;
}

.silo-page__content > * + h2,
.silo-page__content > * + h3 {
	margin-top: 2em;
}

/* La base quita las viñetas para los menús y las grillas; en un texto corrido
   hacen falta. */
.silo-page__content ul,
.silo-page__content ol {
	padding-left: 1.35em;
	list-style: disc;
}

.silo-page__content ol {
	list-style: decimal;
}

.silo-page__content li + li {
	margin-top: 0.6em;
}

.silo-page__content strong,
.silo-page__content b {
	font-weight: var(--fw-semibold);
}

.silo-page__content a {
	text-decoration: underline;
	text-underline-offset: 0.2em;
	text-decoration-thickness: 1px;
}

.silo-page__lead {
	margin-top: var(--s-3);
	max-width: 42em;
	font-size: var(--fs-reading);
	line-height: var(--lh-reading);
}

/* El 404 son tres piezas sueltas —título, explicación y botón—: sin ritmo
   propio quedaban una encima de la otra. */
.silo-page--404 .silo-page__lead {
	margin-top: var(--s-1);
}

.silo-page--404 .silo-page__lead + p {
	margin-top: var(--s-4);
}

.silo-page__pagination {
	margin-top: var(--s-5);
	font-size: var(--fs-sm);
}