/**
 * Colabora — Base
 * Estilos globales mínimos y clases de tipografía que replican los text styles del Figma.
 * Los estilos de cada sección van en su propio CSS (assets/css/sections/<pagina>/<seccion>.css).
 */

body {
	font-family: var(--font-sans);
	font-weight: var(--fw-regular);
	color: var(--color-navy);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.colabora-section *,
.colabora-section *::before,
.colabora-section *::after {
	box-sizing: border-box;
}

.colabora-section img {
	display: block;
	max-width: 100%;
	height: auto;
}

/* ----------------------------------------------------------------------
 * Tipografía — mismo nombre que los text styles del Figma
 * ---------------------------------------------------------------------- */
.t-h1,
.t-h1-2,
.t-h3,
.t-h4,
.t-h5,
.t-display,
.t-display-2 {
	margin: 0;
	font-family: var(--font-sans);
	font-weight: var(--fw-regular);
}

.t-h1        { font-size: var(--fs-h1);        line-height: var(--lh-h1); }
.t-h1-2      { font-size: var(--fs-h1-2);      line-height: var(--lh-h1-2); }
.t-h3        { font-size: var(--fs-h3);        line-height: var(--lh-h3); }
.t-h4        { font-size: var(--fs-h4);        line-height: var(--lh-h4); }
.t-h5        { font-size: var(--fs-h5);        line-height: var(--lh-h5); }
.t-display   { font-size: var(--fs-display);   line-height: var(--lh-display); }
.t-display-2 { font-size: var(--fs-display-2); line-height: var(--lh-display-2); }

.t-body-l { font-size: var(--fs-body-l); line-height: var(--lh-body-l); }
.t-body-m { font-size: var(--fs-body-m); line-height: var(--lh-body-m); }
.t-body-s { font-size: var(--fs-body-s); line-height: var(--lh-body-s); letter-spacing: var(--ls-body-s); }

.t-body-l-marion {
	font-family: var(--font-serif);
	font-size: var(--fs-body-l-marion);
	line-height: var(--lh-body-l-marion);
}

.t-stat {
	font-family: var(--font-serif);
	font-size: var(--fs-stat);
	line-height: var(--lh-stat);
}

/* Modificadores de peso: Heading/H5 Medium, Body/L Medium, Body/M Medium, Body/L/Light */
.t-light  { font-weight: var(--fw-light); }
.t-medium { font-weight: var(--fw-medium); }