/* [E3595, 26/09/2026] ACCESSIBILITÉ — contrastes de TEXTE, un seul fichier pour toutes les versions (posé par la fabrique, après les feuilles du thème). * * Mesuré au navigateur réel (Lighthouse 13.5, catégorie Accessibilité, « color-contrast ») : le corail de la charte (#E56B62, #E8614D, #FF4F45) posé COMME COULEUR DE TEXTE sur fond clair * donne 2,75 à 3,25:1 (seuil AA : 4,5:1). Remède autorisé par Barbara : une teinte de texte plus foncée. ⚠ INTERDIT LITTÉRAL de Barbara : « sans changer les couleurs de marque des boutons et du logo » — * PARTIE 1 (ci-dessous, jusqu'au repère « BOUTONS ») : AUCUN bouton, AUCUN logo n'est touché ; la teinte #CA2D21 n'est jamais utilisée en fond. * PARTIE 2 (repère « BOUTONS », E3601, 26/09/2026) : décision de Barbara — « garde la teinte CORAIL et fonce-la UNIQUEMENT sur les boutons, du minimum nécessaire ; le logo ne change pas ». * ⚠ INTERDIT LITTÉRAL, en vigueur : le LOGO ne change pas (aucun sélecteur de logo dans cette feuille, `--mas-color-coral` n'est JAMAIS redéfinie sur `:root` ni sur le corps de page, seulement sur l'élément bouton lui-même). * * TEINTE : #CA2D21 — même teinte que le corail (H 4°), assombrie du minimum qui passe 4,5:1 sur le fond le PLUS DÉFAVORABLE rencontré (#EAF0F2 : 4,67:1 ; #FFFFFF : 5,37:1). * Gris de texte secondaire : #5F6B74 (4,9:1 sur blanc) à la place de rgba(29,45,59,.62) (4,19:1). * Sélecteurs préfixés `html` (le préfixe ajoute un point de spécificité : la règle l'emporte sur celle du thème) et la feuille est posée EN DERNIER dans l'en-tête. */ /* Lien du pied de page (présent sur TOUTES les pages) : corail sur crème, 3,15:1 -> 5,0:1. */ html .MoveAndStudyCore .mas-footer__cta { color: #CA2D21; } html .MoveAndStudyCore .mas-footer__cta:hover, html .MoveAndStudyCore .mas-footer__cta:focus-visible { color: #A82016; } /* Accueil : lien d'en-tête de liste (« toutes les écoles → »), corail sur blanc 3,25:1. */ html .MoveAndStudyCore.MoveAndStudyCore-home .mas-home-main-list-head a { color: #CA2D21; } /* Accueil : bloc promotions. Lien texte souligné « toutes les offres → » et texte d'économie de la pastille (variante ACCUEIL : ce sont des textes, la variante de base est un BOUTON plein et n'est pas touchée). */ html .MoveAndStudyCore.MoveAndStudyCore-home .mas-promo-highlight__actions a { color: #CA2D21; } html .MoveAndStudyCore.MoveAndStudyCore-home .mas-promo-highlight__saving { color: #CA2D21; } html .MoveAndStudyCore.MoveAndStudyCore-home .mas-promo-highlight__assurance-item span { color: #5F6B74; } /* Pages « Prix » : libellé « En bref » (texte gras corail sur fond bleuté, 2,75:1). Le filet corail à gauche (bordure) est inchangé. */ html .mas-prix-enbref strong.mas-prix-enbref__label { color: #CA2D21; } /* Cartes-passerelles (hubs junior, adultes, examens) : libellé « Découvrir → » en corail sur blanc (3,17:1). C'est un TEXTE de lien (`em` / `span` dans la carte), pas un bouton ; l'état survol/focus du thème (plus spécifique) est conservé. */ html .MoveAndStudyCore .mas-bridge-card__cta { color: #CA2D21; } /* Page du quiz : surtitre et pastilles numérotées, corail sur gris clair / rose pâle (2,79 à 2,99:1). */ html .MoveAndStudyCore.MoveAndStudyCore-quizz .mas-quizz-hero__eyebrow { color: #CA2D21; } html .MoveAndStudyCore.MoveAndStudyCore-quizz .mas-quizz-main__summary-item span { color: #CA2D21; } /* [E3601] Menu principal : LIEN de la page courante (« Accueil », « Contact »…), texte corail sur blanc 3,16-3,18:1 — vu par Lighthouse en affichage bureau (le menu est replié sur mobile). C'est un TEXTE de lien (`a`), même teinte de texte que les autres textes corail de cette feuille. Le bouton-menu de la section courante est traité dans la partie BOUTONS. */ html .MoveAndStudyCore .mas-mega-menu__link.is-current { color: #CA2D21; } /* [E3595] Liens DANS un paragraphe, sans aucun signe autre que la couleur (audit « link-in-text-block » : #236B73 sur #596874 = 1,06:1). Règle NOUVELLE, limitée aux liens SANS classe (jamais un bouton) des blocs de texte. */ html .MoveAndStudyCore .mas-prix-verif a, html .MoveAndStudyCore .mas-prix-intro a, html .MoveAndStudyCore .mas-rich-content p a:not([class]), html .MoveAndStudyCore .mas-content-card p a:not([class]), html .MoveAndStudyCore .Synergee-Web-Page-Component-Text-Container p a:not([class]) { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; } /* ==================================================================== BOUTONS (E3601, 26/09/2026) ==================================================================== * DÉCISION DE BARBARA : « Garde la teinte CORAIL de la marque et fonce-la UNIQUEMENT sur les boutons, du minimum nécessaire pour atteindre le contraste exigé avec le texte blanc (ou texte en gras si ça suffit). Le logo ne change pas. » * * GRAS SEUL : INSUFFISANT, MESURÉ. Le seuil « grand texte » (3:1) n'existe qu'à partir de 18,66 px en gras (14 pt) : nos boutons font 16 px (14,08 px pour `.mas-prix-btn`, DÉJÀ en gras et pourtant à 3,18:1). Passer en gras ne change donc rien au seuil (4,5:1) ; * il faudrait en plus grossir les boutons de 17 % (16 -> 18,66 px) à 33 % (14,08 -> 18,66 px) : c'est un changement de mise en page, plus visible qu'un corail plus profond. Non retenu. * * MÉTHODE : même TEINTE (H) et même SATURATION (S) que chaque corail d'origine (sauf les deux corails vifs en dur, voir plus bas), seule la clarté (L, HSL) baisse par pas de 0,1 point jusqu'à ce que le blanc passe 4,5:1 (calcul WCAG refait dans le test) : * #E56B62 (corail de la charte, `--mas-color-coral`) -> #DC392D (blanc dessus : 4,50:1, 3,18 avant) boutons pleins : Prix, actions primaires, conseiller adultes / examens * #E56B62 lorsqu'il sert AUSSI de TEXTE sur fond clair -> #D53023 (4,91:1 sur blanc, 4,51:1 sur la teinte pâle du bouton) : pastille de promotion, segment de recherche, liens des cartes d'école — ces boutons passent du texte corail au blanc-sur-corail au survol * #E4572E (`--mas-color-accent`, boutons « junior ») -> #D4451B (4,50:1, 3,68 avant) * #FF4F45 (bouton « Rechercher » de l'accueil, en dur) -> #DC392D (le corail de charte foncé ; 4,50:1, 3,25 avant) * #FF5B44 (boutons des pages high school, en dur) -> #DC392D (idem ; 4,50:1, 3,07 avant) * ⚠ CHOIX À JUGER À L'ŒIL : ces deux corails VIFS sont des variantes en dur du corail de charte, à saturation 100 %. Assombris à saturation constante ils donnent un ROUGE franc (#ED0D00 pour #FF4F45, #E91D00 pour #FF5B44 : 4,51:1 * et 4,53:1, le vrai minimum de leur ligne) — plus du corail. Ramenés au corail de charte foncé (#DC392D, teinte 4° : ils étaient à 3° et 7°) ils restent du corail et rejoignent les autres boutons. Retenu : #DC392D. * Si Barbara préfère garder leur éclat : remplacer `#DC392D` par `#ED0D00` (recherche) et `#E91D00` (high school) dans les deux règles « EN DUR » en bas de cette feuille — une ligne chacune. * * LE LOGO NE BOUGE PAS : le logo est une IMAGE (`.mas-site-logo img`), aucune de ces règles ne le vise, et la variable `--mas-color-coral` n'est redéfinie QUE sur l'élément bouton (un descendant de bouton hérite, rien d'autre) — jamais sur `:root`, jamais sur `.MoveAndStudyCore`. * PRINCIPE : on redéfinit la VARIABLE sur le bouton et non son fond — le fond de repos, de survol, de focus et l'ombre du thème lisent tous cette variable et suivent sans qu'on les liste. Seules les couleurs ÉCRITES EN DUR par le thème (#ff4f45, #ff5b44) sont reprises une par une * (sélecteur du thème reproduit, préfixé `html`). `--mas-color-coral-rgb` (teinte pâle, ombre) n'est PAS touchée : l'ombre et le fond pâle du survol restent ceux du thème. * NON TOUCHÉS (ce ne sont pas des boutons, Barbara : « uniquement les boutons ») : liens de navigation (page courante en corail), pastille « Offre spéciale » et pastilles numérotées (fond corail décoratif), liens texte — signalés au rapport. */ /* Boutons PLEINS blanc-sur-corail (le texte reste blanc) */ html .MoveAndStudyCore :is(.mas-prix-btn, .mas-action-link--primary, .mas-adults-bridge-action--primary, .mas-exam-hub-action--primary) { --mas-color-coral: #DC392D; --mas-color-accent: #D4451B; } /* Boutons dont le corail sert AUSSI de texte sur fond clair (repos : texte corail ; survol : plein blanc-sur-corail). `.mas-mega-menu__trigger` = le BOUTON du menu (`