Tipografía

El Campus usa dos familias y nada más. No se mezclan otras fuentes.

Las dos familias

Charly's WayLato · títulos (display)

El alumno graba su audio y la tutora responde.Poppins · cuerpo y UI

Token	Familia	Uso
--font-display	Lato (fallbacks: Helvetica Neue, system-ui)	Títulos y cabeceras (h1–h4, escalas .cw-h-*), números destacados, etiquetas tipo «sticker».
--font-sans	Poppins (fallbacks: Helvetica Neue, system-ui)	Cuerpo de texto y UI general.

Se aplican globalmente: body usa var(--font-sans) y h1–h4 usan var(--font-display).

Antonio ya no se usa

La dirección tipográfica anterior era Antonio (títulos) + Lato (cuerpo). Ahora es Lato + Poppins. No se reintroduce Antonio ni ninguna otra familia.

Pesos

• Lato (títulos): 400, 700. Lato no tiene 600 — los títulos van a 700 (un font-semibold/600 sobre un título resuelve al 700 cargado).
• Poppins (cuerpo): 400, 500, 600, 700.
• El peso 900 se retiró de ambas familias. No uses font-black: resolvería a un peso fantasma.

Tamaños con token

Los tamaños definidos en globals.css como regla de componente:

Elemento	Tamaño	Familia	Peso
body	18px	Poppins	400
.cw-section-h h2	22px	Lato	700
.cw-btn	16px	Poppins	700
Item de nav (sidebar)	16px	Poppins	600
.cw-input	18px	Poppins	500
.cw-input-group label	16px	Poppins	700
.cw-input-group .hint	16px	Poppins	400
.cw-sticker	13px	Poppins	700, mayúsculas
.cw-fb-badge	12px	Poppins	700

Los h1–h4 no tienen tamaño base: cada pantalla los dimensiona con las clases de escala de abajo (o, históricamente, con utilidades de Tailwind).

Escala por público

El producto tiene dos públicos opuestos, así que la escala se divide en dos. Usa estas clases semánticas en vez de font-display text-[..] suelto.

Alumno (campus, 50-70 años) — escala grande

Título de página.cw-h-student-page · 30px

Cabecera de sección.cw-h-student-section · 24px

Título de tarjeta.cw-h-student-card · 22px

Staff (tutor / gestor / admin) — escala densa

Título de página.cw-h-page · 28px

Cabecera de sección.cw-h-section · 22px

Título de tarjeta.cw-h-card · 18px

En superficies de staff una cabecera nunca baja de 18px. El número de stat y los nombres-hero de perfil quedan fuera de la escala por ser datos, no jerarquía de lectura.

Densidad del alumno en móvil

En móvil (max-width: 767px) el campus del alumno baja un paso el texto de lectura con la clase .cw-density-student (redefine las variables --text-* de Tailwind). Es un paso más conservador que staff: el suelo del cuerpo se mantiene en 16px.

Token	Alumno móvil	Escritorio
--text-sm	13px	14px
--text-base	15px	16px
--text-lg	16px	18px
--text-xl	18px	20px
--text-2xl	22px	24px
--text-3xl	26px	30px
--text-4xl	32px	36px
Texto suelto (sin text-*)	16px	18px

Qué NO encoge: los controles fijan su tamaño con px propios, no con text-* — .cw-btn (16px), .cw-input (18px), el grabador (52px). Las áreas táctiles quedan intactas: solo baja el texto de lectura. En escritorio las variables no se redefinen.

Los text-[Npx] arbitrarios no leen la densidad

La palanca solo mueve las utilidades nombradas (text-sm, text-base, text-2xl…) y las clases .cw-h-student-*. Un text-[17px] suelto se queda fijo.

Reglas de tipografía

1. Solo Lato (títulos) y Poppins (cuerpo). Nada de otras familias.
2. Títulos a peso 700 (Lato no tiene 600). No uses font-black.
3. Usa las clases de escala (.cw-h-*) en vez de font-display text-[..] ad-hoc.
4. Texto de lectura ≥ 16px (móvil) / ≥ 18px (escritorio). El secundario no baja de 14px sin justificación (chip, eyebrow…).