Documentos y PDF

El sistema de documentos premium (informes, propuestas, one-pagers, certificados) con el look del sitio — plantillas listas, receta de render y checklist.

Todo documento institucional se ve como el sitio prouniversitas.cl: navy profundo, Poppins en grande, kickers amarillos, tarjetas de vidrio, fotografía con overlay. Nada de Nunito, nada de mascota, nada de fondos blancos planos. Esta página contiene el sistema completo: plantillas, receta y decisiones.

Empieza por la plantilla (no desde cero)

La plantilla maestra ya trae el look correcto — cambia solo textos, datos y fotos:

Plantilla	URL pública	En el repo
Documento A4 (portada + contenido + cierre)	`/plantillas/documento-a4.html`	`templates/informe/informe.html`
Presentación 16:9 (2 slides base)	`/plantillas/presentacion-16-9.html`	`templates/presentacion/portada.html`

Ambas son autocontenidas: cargan Poppins/Inter desde Google Fonts (o desde /brand/fonts/ si prefieres self-hosted), y las fotos y logos por URL absoluta del brandbook. Se pueden abrir, editar y renderizar en cualquier máquina sin clonar nada.

Render a PDF

Así se generan los PDF oficiales (Chrome headless respeta colores y fuentes):

"/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" --headless=new --disable-gpu \
  --no-pdf-header-footer --virtual-time-budget=15000 \
  --print-to-pdf="salida.pdf" documento.html

En Linux/Windows cambia la ruta del binario (google-chrome / chrome.exe). El virtual-time-budget da tiempo a que carguen fuentes y fotos remotas.

Anatomía del documento A4

Portada — foto oficial a sangre + overlay navy (180deg hacia #002A51 sólido abajo) + lockup PRO arriba + fecha · abajo: kicker amarillo → título Poppins 800 (39px) → subtítulo con separadores · → línea amarilla 64×4px → 3 stats de vidrio → pie.
Páginas de contenido — glows cyan/amarillo sangrando del marco · header con kicker + H2 + bajada + lockup mini · secciones con label uppercase amarillo · KPIs con barra superior de color · chips de icono Lucide · tabla con headers uppercase tenues y hairlines · barras de progreso · callout "en simple" con borde izquierdo amarillo · pie con folio.
Cierre — foto en banda superior (52%) fundiendo a navy · frase del método con acento amarillo (No estudias más. Estudias lo que te falta.) · cards de contacto · pie legal.

Los valores que hacen el look (no los cambies)

Qué	Valor exacto
Fondo de página	`#002A51` (navy profundo del sitio) — nunca blanco pleno
Títulos	Poppins 600–800 · `letter-spacing` levemente negativo · blanco con 1 palabra en amarillo
Cuerpo	Inter · jerarquía de opacidad: títulos `#FFF` · cuerpo `rgba(255,255,255,.72)` · notas `.55` · pie `.38`
Kicker	Poppins 700 · MAYÚSCULAS · `letter-spacing: 3px` · `#FFF100` · sin punto final
Tarjeta de vidrio	`background: rgba(255,255,255,.05)` + `border: 1px solid rgba(255,255,255,.12)` + radio 14–18px
Radios	10 / 14 / 18 / 22 px (los del sitio; `rounded-2xl` real = 18px, no 16)
Glows	círculos `blur(70px+)` · cyan `rgba(2,176,187,.10–.15)` · amarillo `rgba(255,241,0,.07–.10)` · sangrando fuera del marco
Línea de acento	1px `linear-gradient(90deg, transparent, rgba(255,241,0,.4), transparent)`
Estados	verde `#5FE0A0` = bien/sube · ámbar `#FFD24A` = a reforzar — siempre con ▲/▼ o cifra, nunca color solo
Separadores	hairlines `rgba(255,255,255,.10)` — nunca bordes duros
Numeración	siempre 2 dígitos: `01`, `02`, `03`

Decisiones de diseño (el porqué — respétalas)

Datos con valor real, no técnicos: un apoderado entiende "530 puntos PAES", no "40 de 65 correctas". Convierte siempre al dato que el lector valora.
Gráficos: máximo 3 series, cada una con color + forma (círculo/rombo/triángulo) — la marca solo tiene 3 colores usables sobre navy (cyan, amarillo, naranjo) y la forma cubre daltonismo. Si hay más series, parte en dos gráficos; nunca inventes un 4º color.
Escalas comunes entre documentos de la misma familia (p. ej. eje Y 350–900 en informes PAES), para que sean comparables.
Tono propositivo: los focos se llaman "el foco del semestre", nunca "ALERTA", nunca rojo de alarma. El documento moviliza, no asusta.
Consistencia > novedad: usa el mismo lenguaje gráfico en todas las páginas; un gráfico "creativo" que rompe la familia se descarta.
Fotos en JPEG (q80, ~1600px, ~200 KB); PNG solo para logos (transparencia). Un PNG de fondo infla el PDF de 1.6 a 6.8 MB.

Checklist antes de entregar

Fondo #002A51, títulos Poppins, cuerpo Inter — ¿cero Nunito?
Amarillo solo como acento (kicker, 1 palabra del título, números, línea) — ¿nunca como fondo de página ni texto largo?
¿Foto oficial del banco con overlay navy — no foto cruda ni stock genérico?
¿Iconos Lucide en chips — cero emojis?
¿Estados con ▲/▼ y tono propositivo — cero "ALERTA"/rojo?
¿Sin mascota, sin insignias, sin XP? (eso es la app)
Renderiza a PDF y míralo: ¿se parece a una página de prouniversitas.cl impresa?

Para agentes IA

Si te pidieron "un PDF / informe / propuesta con la marca PRO Universitas": descarga la plantilla maestra, reemplaza textos/datos/fotos, y renderiza con el comando de arriba. No reconstruyas el estilo desde cero ni mezcles con el universo app (Nunito/mascota). Referencia completa machine-readable: /llms-full.txt.