/* --------------------------------------------------------------------------- * Polices de la vitrine Digital Novator — auto-hébergées. * * Aucune ressource externe : les cinq fichiers woff2 sont servis par ce serveur, * depuis le dépôt. La maquette de référence les chargeait depuis un fournisseur * tiers, ce qui transmettait l'adresse IP de chaque visiteur — la frontière du * projet l'exclut. Provenance, licences et empreintes : assets/site/fonts/README.md. * * CONTRAT AVEC LE SOCLE DE RENDU * Les `url()` ci-dessous sont ABSOLUES depuis la racine du site (`/assets/fonts/…`). * C'est délibéré : cette feuille reste valide qu'elle soit servie comme fichier * ou recopiée en ligne dans le ``, et depuis n'importe quelle page * (`/`, `/mentions-legales`, …). Des URL relatives casseraient dans les deux cas. * Le socle doit donc exposer le dossier `assets/site/` sous le préfixe `/assets/` : * assets/site/fonts/space-grotesk-latin-600.woff2 -> /assets/fonts/space-grotesk-latin-600.woff2 * assets/site/logos/novawysp.svg -> /assets/logos/novawysp.svg * Si un autre préfixe est retenu, seules les cinq lignes `src:` changent. * * GRAISSES EMBARQUÉES — strictement celles que la maquette utilise réellement * (relevé fait en parcourant l'arbre HTML de la maquette, héritage CSS compris) : * Space Grotesk 500, 600, 700 * IBM Plex Sans 400 * JetBrains Mono 400 * La maquette demandait en plus IBM Plex Sans 500/600 et JetBrains Mono 500 : * aucune n'est employée, elles ne sont pas embarquées (≈ 66 Ko économisés). * * SOUS-ENSEMBLE « latin » * Chaque fichier couvre le sous-ensemble latin (≈ 230 glyphes), suffisant pour * le français : accents, ligature œ/Œ, guillemets « », apostrophe ’, tirets – —, * € et ©. Vérifié caractère par caractère contre le texte de la maquette. * `unicode-range` déclare cette couverture : hors de cette plage, le navigateur * passe directement à la police de repli sans télécharger le woff2 pour rien. * * FLÈCHES ET SYMBOLES — repli assumé, identique à la maquette * Les gabarits livrés n'emploient que quatre symboles hors alphabet latin : * → (U+2192, une occurrence, `accueil.html`), ⌘ (U+2318, deux occurrences), * ▸ (U+25B8, une) et ▾ (U+25BE, deux), ces trois derniers dans * `accroche-cockpit.html`. Aucun des quatre n'est couvert par les * `unicode-range` déclarés ci-dessous : le navigateur ne télécharge donc aucun * woff2 pour eux et les rend avec une police système, comme le faisait déjà la * maquette validée. Les replis ci-dessous doivent rester des polices * d'interface complètes. * * `font-display: swap` : passé un délai de blocage très court, laissé au * navigateur, le texte s'affiche dans la police de repli puis bascule. Le rendu * n'attend pas la fin du téléchargement d'une police. * ------------------------------------------------------------------------- */ /* --- Space Grotesk — titres, boutons, étiquettes de structure --------------- */ @font-face { font-family: 'Space Grotesk'; font-style: normal; font-weight: 500; font-display: swap; src: url('/assets/fonts/space-grotesk-latin-500.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Space Grotesk'; font-style: normal; font-weight: 600; font-display: swap; src: url('/assets/fonts/space-grotesk-latin-600.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Space Grotesk'; font-style: normal; font-weight: 700; font-display: swap; src: url('/assets/fonts/space-grotesk-latin-700.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* --- IBM Plex Sans — texte courant ----------------------------------------- */ @font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url('/assets/fonts/ibm-plex-sans-latin-400.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* --- JetBrains Mono — étiquettes techniques, chiffres, extraits de code ----- */ @font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url('/assets/fonts/jetbrains-mono-latin-400.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* --------------------------------------------------------------------------- * Les trois piles de la charte. Le reste du CSS n'écrit jamais un nom de famille * en dur : il passe par ces variables, pour qu'un changement de police n'ait * qu'un seul point d'entrée. * ------------------------------------------------------------------------- */ :root { /* Titres, boutons, étiquettes. Graisses disponibles : 500, 600, 700. */ --police-titre: 'Space Grotesk', 'Segoe UI', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif; /* Texte courant. Graisse disponible : 400 UNIQUEMENT — voir la note ci-dessous. */ --police-texte: 'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif; /* Étiquettes techniques et chiffres. Graisse disponible : 400 uniquement. */ --police-mono: 'JetBrains Mono', ui-monospace, 'Cascadia Mono', Consolas, 'SF Mono', Menlo, monospace; } /* --------------------------------------------------------------------------- * RÈGLE DE CHARTE, à l'intention des gabarits — la mise en emphase se compose en * Space Grotesk (`--police-titre`, graisse 600), pas avec un `` en texte * courant. * * Raison : seule la graisse 400 d'IBM Plex Sans est embarquée. Un `` dans * un paragraphe en `--police-texte` obtiendrait un GRAS SYNTHÉTIQUE — le navigateur * épaissit lui-même les traits, et le rendu est sensiblement plus sale que la vraie * graisse dessinée. La maquette n'a d'ailleurs aucun `` : tout ce qui y est * mis en avant est composé en Space Grotesk. * * Ce n'est volontairement PAS neutralisé en CSS (`font-synthesis-weight: none` * supprimerait l'emphase au lieu de la corriger, et un `` oublié perdrait * son sens en silence). Si un vrai besoin de gras en texte courant apparaît au * lot 2, la réponse est d'embarquer IBM Plex Sans 600 (+ 22 Ko). * ------------------------------------------------------------------------- */