/* Tipografía de las páginas de contenido — ver inc/tipografia.php
 *
 * Reglas comunes a las páginas que son texto para leer (Nosotros, FAQs). Nacieron
 * arreglando Nosotros, donde el cuerpo iba a tres tamaños distintos y las líneas
 * llegaban a 90 caracteres; se sacan aquí para que no haya que repetirlas —ni que
 * se desincronicen— en cada página nueva.
 *
 * Todo va acotado a `.main-content`: el footer es una Global Section de WPBakery
 * que vive en el mismo contenedor y usa las mismas clases de fila, así que una
 * regla de ancho suelta se lo lleva por delante.
 */

:root {
	--kub-cuerpo: 20px;
	--kub-interlineado: 1.5;
	--kub-medida: 700px;   /* ancho máximo de una línea de texto */
	--kub-teal: #00828e;
	--kub-coral: #eb6669;
}

/* ---------- respiro final ---------- */

/*
 * El contenido acababa pegado a la onda del footer: sin este aire, la última
 * pregunta de las FAQs quedaba cortada por el borde verde.
 */
.kub-contenido .main-content {
	padding-bottom: clamp(3rem, 8vw, 5.5rem);
}

/* ---------- cuerpo de texto ---------- */

.kub-contenido .main-content p,
.kub-contenido .main-content li {
	font-size: var(--kub-cuerpo);
	line-height: var(--kub-interlineado);
}

.kub-contenido .main-content p {
	max-width: var(--kub-medida);
}

/* ---------- títulos de sección ---------- */

.kub-contenido .main-content h2 {
	margin: clamp(2.5rem, 6vw, 4rem) 0 clamp(1rem, 2.5vw, 1.5rem);
	font-size: clamp(2rem, 3.4vw, 2.75rem);
	line-height: 1.15;
}

.kub-contenido .main-content h2:first-child {
	margin-top: 0;
}

.kub-contenido .main-content h3 {
	font-size: clamp(1.25rem, 2vw, 1.5rem);
	line-height: 1.3;
}

/* ---------- rótulo de cabecera ---------- */

/*
 * El título de la página, sobre el patrón de marca. Antes era una imagen con el
 * texto quemado dentro: ni Google ni un lector de pantalla lo veían, y no había
 * forma de traducirlo.
 */
.kub-rotulo {
	margin: 0;
	color: #fff;
	font-weight: 900;
	font-size: clamp(2.75rem, 7vw, 5.5rem);
	line-height: 1.05;
	letter-spacing: -0.01em;
	text-align: center;
	text-transform: uppercase;
}
