/* ========================================================================== TIPOGRAFIA - Neue Montreal y Pinyon Script -------------------------------------------------------------------------- Tres pesos servidos, en assets/fonts/: NeueMontreal-Regular.woff2 400 23 KB NeueMontreal-Medium.woff2 500 24 KB NeueMontreal-Bold.woff2 700 23 KB Los tres se generaron a partir de los .otf originales: mismo dibujo, mismos 363 glifos, casi la mitad de peso. Incluyen la E con acento. AL FTP SOLO SUBEN LOS WOFF2. Los .otf se quedan en local, como copia maestra por si hay que regenerar. Dos motivos para no subirlos: - Lo soportan todos los navegadores desde 2016, no aportan cobertura. - Un .otf colgado en el dominio es un archivo directamente instalable: cualquiera se lo baja y se lo pone en su ordenador. La licencia de webfont cubre servir la fuente para la web, no repartirla. EN LOCAL HAY MAS PESOS QUE NO SE SIRVEN assets/fonts/ contiene tambien Light (300) y las cuatro cursivas. NO tienen woff2 a proposito: el diseno no los usa por ahora, y cada peso que se cuelga son 23 KB que el visitante puede acabar descargando. El dia que el diseno pida uno, se genera su woff2 y se anade aqui un @font-face nuevo. La conversion es una linea con fontTools. OJO: la fuente solo carga si abres la web por servidor (localhost o el dominio). Con file:// (doble clic en el html) Chrome la bloquea por origen cruzado y veras Arial. No es un fallo de la web. El MIME de woff2 ya esta declarado en el .htaccess para el hosting de OVH. ========================================================================== */ /* -------------------------------------------------------------------------- POR QUE UN @font-face POR PESO, CON SU NUMERO EXACTO Antes aqui habia un solo @font-face (el Medium) declarado como "font-weight: 400 700", un rango. Era un apano deliberado: con un unico dibujo disponible, ese rango le decia al navegador "usa este para cualquier peso que te pidan", y asi evitabamos que falsificara una negrita sintetica deformando el Medium. Ya no hace falta, y ademas seria contraproducente: teniendo los pesos reales, un rango solapado deja ambigua la eleccion del navegador. Cada peso se declara ahora con su valor exacto. -------------------------------------------------------------------------- */ @font-face { font-family: "Neue Montreal"; src: url("../fonts/NeueMontreal-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; } @font-face { font-family: "Neue Montreal"; src: url("../fonts/NeueMontreal-Medium.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: "Neue Montreal"; src: url("../fonts/NeueMontreal-Bold.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; } :root { /* Neue Montreal es una grotesca geometrica: la red de seguridad son sans-serif de proporciones parecidas, no serifs. */ --font-display: "Neue Montreal", "Helvetica Neue", Helvetica, Arial, "Segoe UI", Roboto, sans-serif; --font-text: var(--font-display); /* LA INGLESA DE LOS ROTULOS DE LA PIRAMIDE, y de nada mas (el @font-face de Pinyon Script esta al final de este fichero, con el porque de que sea esa y no la del diseno). LA RED DE SEGURIDAD SON CURSIVAS, NO UNA SANS, al reves que --font-display: si Pinyon no llega -conexion cortada, el woff2 sin subir al FTP- lo que tiene que seguir viendose en "Top, Middle, Dry-down" es letra manuscrita, porque lo que distingue al rotulo de su nota de debajo es justamente eso. Cayendo en la sans del cuerpo, los dos textos se volverian el mismo y la composicion perderia la jerarquia. El ultimo recurso es la palabra clave cursive, que todo navegador resuelve a algo escrito a mano. */ --font-script: "Pinyon Script", "Segoe Script", "Brush Script MT", cursive; /* Los tres pesos disponibles, con nombre. Usar estas variables en vez de escribir el numero suelto: si algun dia cambia el mapa de pesos, se cambia aqui y no en veinte reglas repartidas por el CSS. */ --peso-regular: 400; --peso-medium: 500; --peso-bold: 700; } @font-face { /* --------------------------------------------------------------------- Pinyon Script. La usan dos sitios y nada mas: los tres rotulos de la piramide olfativa de la ficha de producto -Top, Middle y Dry-down, y sus equivalentes en espanol- y el "Ready to take a bite?" del bloque de coleccion de la portada (29/09/2026). Es una inglesa muy cursiva y no sirve para texto corrido. EN LA PORTADA EL DISENO PIDE DOS FUENTES DISTINTAS para esa misma frase: Edwardian Script ITC en el artboard de 1920 y una italica de Financier en el de 375. Las dos caen aqui. La italica no existe en el proyecto -lo confirmo el responsable el 29/09/2026- y la Edwardian es la que se explica justo abajo. POR QUE ESTA Y NO LA DEL DISENO El diseno usa Edwardian Script ITC, que es comercial de ITC/Monotype y no es gratuita en ninguna version. El fichero que se recibio salia de una web de "fuentes gratis", o sea sin licencia de ningun tipo. Se comprobo ademas que era el mismo dibujo que la copia que viene con Microsoft Office, solo reempaquetado: misma version, mismos 244 glifos, misma huella de contornos. Servir un woff2 es PUBLICAR el fichero -cualquiera que abra la pagina puede descargarselo-, asi que en el sitio publico de una empresa eso es exposicion real, no un tecnicismo. Decision del responsable del 16/09/2026: se cambia por una de licencia abierta. Pinyon Script es inglesa formal, que es el mismo registro que Edwardian: alto contraste, trazo fino, mayusculas con floritura. No es identica y el disenador deberia validarla. Licencia: SIL Open Font License, y la fuente la declara en sus propios metadatos (openfontlicense.org). Eso es justo lo que le faltaba a la anterior: un fichero legitimo suele traer ese dato dentro. Se sirve desde nuestro dominio y no desde Google, como el resto del proyecto: una peticion menos a un tercero y nada que contarle a nadie sobre quien visita la web. Subconjunto latino (U+0000-00FF), que cubre la o acentuada de "Corazon". Comprobado que no falta ningun caracter de los seis rotulos. --------------------------------------------------------------------- */ font-family: "Pinyon Script"; src: url("../fonts/PinyonScript-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }