/* Charte 2026, retours du 13 novembre : haut de page plus contrasté, touches de terracotta (Lucie, 9 nov.), accent rouge
   brique, et le jaune historique de Firstep (#dbdd41, celui du logo) en surbrillance : survols, éléments actifs, boutons.
   Le jaune reste en petites touches, jamais en aplat (accord de Lucie au dernier rendez-vous).
   Variante A (par défaut) : en-tête crème bordé de terracotta. Variante B (body.fs-variante-b) : en-tête bleu British.
   Chargé sur tout le site après l'en-tête et le pied de page (charte.php). */

:root {
	--fs-jaune: #dbdd41;
	--fs-jaune-pale: rgba(219, 221, 65, 0.28);
	--fs-terracotta: #c9a17e;
	--fs-brique: #a9473f;
	--fs-bleu: #273c4d;
	--fs-bleu-fonce: #1d2e3c;
	--fs-creme: #f5f0e6;
	--fs-papier: #fbf8f2;
	--fs-sauge: #98a98f;
	--fs-titre: "DM Serif Display", Georgia, "Times New Roman", serif;
}

@font-face { font-family: "DM Serif Display"; src: url("/wp-content/uploads/refonte-2026/dm-serif-display-latin.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "DM Serif Display"; src: url("/wp-content/uploads/refonte-2026/dm-serif-display-latin-italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }

/* ================================================================ En-tête (variante A) */
#main-header { border-top: 5px solid var(--fs-terracotta) !important; }
@media (min-width: 981px) {
	#main-header #top-menu > li > a:hover,
	#main-header #top-menu > li:focus-within > a,
	#main-header #top-menu > li.current-menu-item > a,
	#main-header #top-menu > li.current-menu-ancestor > a,
	#main-header #top-menu > li.current-menu-parent > a { text-decoration-color: var(--fs-jaune) !important; }
	/* « Nos centres » mène à une ancre de l'accueil : WordPress le croit actif sur l'accueil */
	#main-header #top-menu > li.menu-item-type-custom.current-menu-item:not(:hover):not(:focus-within) > a { text-decoration-color: transparent !important; }
	#top-menu li ul.sub-menu li > a:hover,
	#top-menu li ul.sub-menu .current-menu-item > a { background: var(--fs-jaune-pale) !important; }
}
.fs-contact-bouton { background: var(--fs-brique) !important; color: var(--fs-papier) !important; }
.fs-contact-bouton:hover,
.fs-contact-bouton[aria-expanded="true"] { background: var(--fs-jaune) !important; color: var(--fs-bleu) !important; }

/* ================================================================ Haut de l'accueil */
body #fs-accueil .v2-bulle-etiquette { background: var(--fs-terracotta); color: var(--fs-bleu-fonce); }
body #fs-accueil .v2-bulle-etiquette::after { border-top-color: var(--fs-terracotta); }
body #fs-accueil .v2-hero__titre em { color: #5e6e57; }
body #fs-accueil .v2-choix__puces button:hover,
body #fs-accueil .v2-choix__puces button:focus-visible { border-color: var(--fs-bleu); box-shadow: inset 0 -4px 0 var(--fs-jaune); }
body #fs-accueil .v2-choix__puces button[aria-selected="true"] { box-shadow: inset 0 -4px 0 var(--fs-jaune); }
body #fs-accueil .v2-choix__question { background: var(--fs-bleu); }

/* Boutons des pages refaites : survol jaune */
body :is(#fs-accueil, #fs-page) :is(.fs-bouton, .fs2-bouton, .v2-bouton):hover { background: var(--fs-jaune) !important; border-color: var(--fs-jaune) !important; color: var(--fs-bleu) !important; }

/* ================================================================ Variante B : en-tête bleu British */
body.fs-variante-b #main-header,
body.fs-variante-b #main-header.et-fixed-header { background-color: var(--fs-bleu) !important; border-top: 0 !important; border-bottom: 4px solid var(--fs-terracotta) !important; box-shadow: none !important; }
body.fs-variante-b #main-header #top-menu > li > a,
body.fs-variante-b #main-header #et-top-navigation a:not(.fs-contact-bouton) { color: var(--fs-papier) !important; }
body.fs-variante-b #main-header #top-menu > li.menu-item-has-children > a::after { color: var(--fs-papier) !important; }
body.fs-variante-b #main-header #top-menu li ul.sub-menu a { color: var(--fs-bleu) !important; }
body.fs-variante-b .fs-contact-bouton { background: var(--fs-jaune) !important; color: var(--fs-bleu) !important; }
body.fs-variante-b .fs-contact-bouton:hover,
body.fs-variante-b .fs-contact-bouton[aria-expanded="true"] { background: var(--fs-terracotta) !important; color: var(--fs-bleu-fonce) !important; }
body.fs-variante-b #fs-accueil .v2-bulle-etiquette { background: var(--fs-brique); color: var(--fs-papier); }
body.fs-variante-b #fs-accueil .v2-bulle-etiquette::after { border-top-color: var(--fs-brique); }
@media (max-width: 980px) {
	body.fs-variante-b #main-header { background-color: var(--fs-bleu) !important; }
	body.fs-variante-b #main-header .logo_container span + a { background-image: url("/wp-content/uploads/refonte-2026/logo-firstep-fonce.svg") !important; }
	body.fs-variante-b #main-header .mobile_nav .mobile_menu_bar::before { color: var(--fs-papier) !important; }
}

/* ================================================================ Téléphone : le vrai logo (il était recolorié) */
@media (max-width: 980px) {
	#main-header .logo_container span + a { background-image: url("/wp-content/uploads/2020/06/Logo-couleur.svg"); }
}

/* ================================================================ Pages encore construites avec Divi
   (offres Family et Business, centres, Cambridge, pages légales…) : titres, liens et boutons à la charte. */
.et_pb_section :is(h1, h2, h3, .et_pb_module_header) { font-family: var(--fs-titre) !important; font-weight: 400 !important; letter-spacing: 0 !important; color: var(--fs-bleu); }
.et_pb_section h1, .et_pb_section h2 { text-transform: none !important; }
.et_pb_section .et_pb_text a:not(.et_pb_button) { color: var(--fs-bleu); text-decoration: underline; text-decoration-color: var(--fs-terracotta); text-underline-offset: 3px; }
.et_pb_section .et_pb_text a:not(.et_pb_button):hover { text-decoration-color: var(--fs-jaune); text-decoration-thickness: 3px; }
body .et_pb_section .et_pb_button { background-color: var(--fs-bleu) !important; border: 2px solid var(--fs-bleu) !important; border-radius: 4px !important; color: var(--fs-papier) !important; }
body .et_pb_section .et_pb_button:hover { background-color: var(--fs-jaune) !important; border-color: var(--fs-jaune) !important; color: var(--fs-bleu) !important; padding: 0.3em 1em !important; }
body .et_pb_section .et_pb_button::after { display: none !important; }

/* ================================================================ Pied de page : barre du bas « · » entre les liens */
#fs-pied .fs-pied__bas li + li::before { content: "·"; margin: 0 12px 0 -12px; color: rgba(245, 240, 230, 0.55); }
#fs-pied .fs-pied__bas a:hover { color: var(--fs-jaune) !important; }

/* ================================================================ Pages intérieures refaites : même police de titres que
   l'accueil (DM Serif Display, une seule graisse : pas de faux gras) */
body #fs-page { --titre: var(--fs-titre); font-synthesis: none; }
body #fs-page :is(h1, h2, h3, h4, .fs2-titre, .fs2-entree__titre) { font-weight: 400; }

/* ================================================================ Pages passées de Divi au HTML (modifs/32) :
   offres Family et Business, Mon Compte Formation, centres de Bordeaux, Cambridge, pages légales */
body #fs-page .fs2-texte-seul > div { display: flex; flex-direction: column; gap: 16px; max-width: 880px; }
body #fs-page .fs2-texte-seul .fs2-titre { margin-bottom: 8px; }
body #fs-page .fs2-texte-seul p, body #fs-page .fs2-duo__texte p { font-size: 17px; line-height: 1.65; }
body #fs-page .fs2-legal h2 { margin-top: 1.6em; font-size: clamp(22px, 2vw, 28px); }
body #fs-page .fs2-legal { max-width: 760px; }
body #fs-page .fs2-carte-geo { overflow: hidden; box-shadow: 0 30px 60px -30px rgba(29, 46, 60, 0.35); }
body #fs-page .fs2-carte-geo .leaflet-container { width: 100% !important; }
body #fs-page .fs2-appel__grille { display: grid; grid-template-columns: minmax(0, 1.5fr) auto; gap: clamp(28px, 5vw, 80px); align-items: center; }
body #fs-page .fs2-appel p { margin-top: 12px; font-size: 17px; line-height: 1.6; color: rgba(251, 248, 242, 0.86); }
body #fs-page .fs2-appel strong { color: var(--fs-papier); }
body #fs-page .fs2-appel a:not(.fs2-bouton) { color: var(--fs-papier); text-decoration-color: var(--fs-terracotta); }
body #fs-page .fs2-apres-cartes { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: 36px; }
body #fs-page .fs2-boutons--centre { justify-content: center; margin-top: 32px; }
body #fs-page .fs2-equipe-centre .fs2-tete .fs2-titre { margin-bottom: 18px; }
body #fs-page .fs2-equipe-centre .fs2-tete p { font-size: 17px; line-height: 1.65; }
body #fs-page .fs2-equipe-avis p:first-child { font-weight: 700; color: var(--fs-bleu); }
body #fs-page .fs2-equipe-centre .fs2-equipe-avis { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 40px; margin-top: 40px; padding-top: 28px; border-top: 1px solid var(--ligne, #dcd2c1); }
body #fs-page .fs2-equipe-centre .fs2-equipe-avis p { max-width: 640px; font-size: 16px; line-height: 1.6; }
body #fs-page .fs2-equipe-centre .fs2-equipe-avis .fs2-boutons { margin-top: 0; }
body #fs-page .fs2-equipe-centre .fs2-boutons { margin-top: 32px; }
body #fs-page .fs2-duo__texte .fs2-coches,
body #fs-page .fs2-duo__texte .fs2-raisons { margin-top: 6px; }
/* Boutons dans un bloc texte + photo : la règle des liens du texte ne s'applique pas */
body #fs-page :is(.fs2-duo__texte, .fs2-checklist, .fs2-texte-seul) a.fs2-bouton { font-weight: 700; text-decoration: none; }
body #fs-page :is(.fs2-duo__texte, .fs2-checklist, .fs2-texte-seul) a.fs2-bouton--ardoise { color: var(--fs-papier); }
body #fs-page :is(.fs2-duo__texte, .fs2-checklist, .fs2-texte-seul) a.fs2-bouton--contour-ardoise { color: var(--fs-bleu); }
body #fs-page .fs2-checklist__texte { display: flex; flex-direction: column; gap: 16px; }
body #fs-page .fs2-checklist__texte p { font-size: 17px; line-height: 1.65; }
body #fs-page .fs2-checklist .fs2-coches--grand li { font-size: 17px; }
body #fs-page .fs2-duo__image img { display: block; box-shadow: 0 30px 60px -30px rgba(29, 46, 60, 0.35); }
@media (max-width: 980px) {
	body #fs-page .fs2-appel__grille { grid-template-columns: 1fr; }
}
body #fs-page .fs2-section--page { padding-top: calc(var(--fs-entete, 80px) + clamp(40px, 5vw, 72px)); }
body #fs-page .fs2-cartes--sans-lien .fs2-carte:hover { box-shadow: inset 0 0 0 1px var(--ligne, #dcd2c1); }
body #fs-page .fs2-tete .fs2-chapo { margin-top: 16px; }

/* ================================================================ Qualiopi & indicateurs (modifs/33) */
body #fs-page .fs2-methode { display: grid; gap: 18px; margin: 0; }
body #fs-page .fs2-methode div { padding: 18px 20px; background: var(--fs-papier); box-shadow: inset 0 0 0 1px var(--ligne, #dcd2c1); }
body #fs-page .fs2-methode dt { font-family: var(--fs-titre); font-size: 21px; line-height: 1.25; color: var(--fs-bleu); }
body #fs-page .fs2-methode dd { margin: 6px 0 0; font-size: 16px; line-height: 1.55; color: #4a5662; }
body #fs-page .fs2-section--page .fi-certif { margin-top: 8px; }

/* ================================================================ Ouvrir un centre : carte de France des centres (modifs/34) */
body #fs-page .fs2-carte-france { display: block; width: 100%; max-width: 560px; height: auto; margin: 0 auto; font-family: Figtree, system-ui, sans-serif; }
body #fs-page .fs2-centres-liste { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 28px; margin-top: 8px; }
body #fs-page .fs2-centres-liste li { display: flex; flex-direction: column; gap: 2px; padding-top: 10px; border-top: 2px solid var(--fs-terracotta); font-size: 17px; }
body #fs-page .fs2-centres-liste li > strong, body #fs-page .fs2-centres-liste li > a { font-family: var(--fs-titre); font-size: 22px; font-weight: 400; color: var(--fs-bleu); }
body #fs-page .fs2-centres-liste li > span { font-size: 14px; color: #4a5662; }
body #fs-page .fs2-contact-personne img { border-radius: 0; object-fit: cover; }
@media (max-width: 640px) { body #fs-page .fs2-centres-liste { grid-template-columns: 1fr 1fr; } }

/* ================================================================ Financements (modifs/35) */
body #fs-page .fs2-financer .fs2-chapo { color: rgba(251, 248, 242, 0.9); }
body #fs-page .fs2-financer .fs2-tuiles li { background: var(--fs-papier); }
body #fs-page .fs2-financer__note { margin-top: 22px; font-size: 16px; line-height: 1.55; color: rgba(251, 248, 242, 0.88); }
body #fs-page .fs2-financer__boutons { margin-top: 32px; }
body #fs-page .fs2-cpf-parcours .fs2-raisons li { font-family: inherit; font-size: 16px; font-weight: 400; line-height: 1.5; }
body #fs-page .fs2-cpf-parcours .fs2-raisons li strong { font-family: var(--fs-titre); font-size: 19px; font-weight: 400; display: block; margin-bottom: 4px; }
body #fs-page .fs2-cpf-parcours .fs2-encadre p { font-size: 16px; line-height: 1.55; }
body #fs-page .fs2-cpf-parcours .fs2-encadre p + p { margin-top: 8px; }
body #fs-page .fs2-cpf-parcours .fs2-encadre .fs2-encadre__fort { color: var(--fs-papier); }
