/* ============================================================ FPRO - themes.css 5 palettes et 3 duos typographiques. Le gabarit pose data-palette et data-typo sur . Aucune police distante : uniquement des piles systeme. Raison : les polices Google servies depuis leur CDN posent un probleme RGPD documente en Europe, et un site de professionnel de sante ne peut pas se le permettre. Le gain de vitesse est un bonus. Version 1 ============================================================ */ /* --- Palettes ------------------------------------------------------------- */ /* Contrastes verifies : texte principal > 12:1, texte secondaire > 5.5:1, accent sur blanc > 4.6:1, blanc sur accent > 4.6:1. */ :root, [data-palette="sauge"] { --fond: #f7f8f5; --surface: #ffffff; --encre: #1c231e; --encre-2: #566057; --trait: #e2e6df; --trait-fort: #c7cec5; --accent: #46664f; --accent-fonce: #33513c; --accent-clair: #e9f0ea; --accent-contraste:#ffffff; --alerte: #8a4b2a; } [data-palette="ardoise"] { --fond: #f6f7f9; --surface: #ffffff; --encre: #1a1f26; --encre-2: #545c68; --trait: #dfe3e9; --trait-fort: #c3cad4; --accent: #3c5673; --accent-fonce: #2b4159; --accent-clair: #e8eef4; --accent-contraste:#ffffff; --alerte: #8c4630; } [data-palette="terracotta"] { --fond: #faf7f4; --surface: #ffffff; --encre: #241d19; --encre-2: #63564e; --trait: #e9e1da; --trait-fort: #d3c5ba; --accent: #96543a; --accent-fonce: #78412b; --accent-clair: #f6ece6; --accent-contraste:#ffffff; --alerte: #8c3a3a; } [data-palette="bleu-nuit"] { --fond: #f5f7fa; --surface: #ffffff; --encre: #14192b; --encre-2: #4d566e; --trait: #dde2ec; --trait-fort: #bfc7d8; --accent: #2f4479; --accent-fonce: #22335e; --accent-clair: #e7ecf7; --accent-contraste:#ffffff; --alerte: #8a3f3f; } [data-palette="sable"] { --fond: #faf8f3; --surface: #ffffff; --encre: #23211a; --encre-2: #5f5a4c; --trait: #e8e3d7; --trait-fort: #cfc7b4; --accent: #74603a; --accent-fonce: #594926; --accent-clair: #f2ece0; --accent-contraste:#ffffff; --alerte: #86432c; } /* --- Duos typographiques -------------------------------------------------- */ :root, [data-typo="sobre"] { /* Tout en sans systeme. Neutre, tres lisible, la valeur sure. */ --police-titres: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; --police-corps: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; --titres-graisse: 650; --titres-espacement: -.022em; } [data-typo="editorial"] { /* Titres en serif systeme, corps en sans. Plus chaleureux, plus incarne. */ --police-titres: ui-serif, "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif; --police-corps: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; --titres-graisse: 600; --titres-espacement: -.012em; } [data-typo="humaniste"] { /* Tout en serif, sauf l'interface. Le plus posé, adapté aux cabinets établis. */ --police-titres: ui-serif, "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif; --police-corps: ui-serif, "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif; --titres-graisse: 600; --titres-espacement: -.008em; } [data-typo="humaniste"] .bouton, [data-typo="humaniste"] .nav, [data-typo="humaniste"] .barre-mobile, [data-typo="humaniste"] .repere__cle, [data-typo="humaniste"] .pratique dt, [data-typo="humaniste"] .accueil__sur, [data-typo="humaniste"] .champ label { font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; } [data-typo="humaniste"] body { font-size: 1.09rem; line-height: 1.68; }