Probeta técnica: parte del objetivo es evitar problemas de CORS sirviendo la página y los archivos de fuente bajo el mismo origen (o con cabeceras que autoricen el recurso), para que el navegador aplique @font-face sin bloqueos. En cada estilo, arriba hay texto en vivo (WOFF2 vía @font-face); abajo, raster desde otf/ para cotejar contorno en pantalla. Solo referencia de navegador; en correo real el soporte de webfonts suele ser otro.
HTML: <!DOCTYPE html> (HTML5, WHATWG Living Standard), codificación UTF-8, lang="es", meta viewport (width=device-width, initial-scale=1), X-UA-Compatible, híbrido correo con xmlns XHTML y VML/Office (xmlns:v, xmlns:o) para clientes tipo Outlook, tablas role="presentation".
