/*
 * Design system ZePartner
 * Jetons repris du modèle validé par le client (zepartner.ai) et alignés sur le
 * kit Elementor 7860 : les couleurs y sont aussi disponibles comme couleurs globales.
 * Une seule source de vérité par valeur ; les composants ne font que les décliner.
 *
 * Portée (19 septembre 2026) : la feuille est chargée sur tout le site, l'en-tête et
 * le pied de page s'en servant partout. Les jetons vivent donc sur :root, mais la
 * typographie de base reste limitée aux blocs du design system — les pages héritées,
 * encore en Montserrat/Manrope, ne doivent pas bouger.
 */

:root {
	--zp-navy: #12314C;
	--zp-navy-2: #1D4569;
	--zp-navy-3: #0F2B43;
	--zp-blue: #2E73AC;
	--zp-blue-soft: #E8F0F6;
	--zp-green: #4C8B45;
	--zp-green-soft: #E9F2E6;
	--zp-amber: #E0982E;
	--zp-amber-soft: #FBF1DF;
	--zp-paper: #F6F8FA;
	--zp-white: #FFFFFF;
	--zp-ink: #16232F;
	--zp-ink-soft: #4A5B6A;
	--zp-line: #DCE4EC;

	--zp-shadow-sm: 0 1px 3px rgba(18, 49, 76, .06), 0 8px 24px rgba(18, 49, 76, .05);
	--zp-shadow-md: 0 4px 12px rgba(18, 49, 76, .08), 0 20px 48px rgba(18, 49, 76, .10);

	--zp-r: 16px;
	--zp-r-sm: 10px;
	--zp-ease: cubic-bezier(.16, .84, .44, 1);

	--zp-titre: 'Bricolage Grotesque', system-ui, sans-serif;
	--zp-texte: 'Inter', system-ui, sans-serif;
}

.zp-fiche,
.zp-catalogue,
.zp-accueil,
.zp-entete,
.zp-pied {
	font-family: var(--zp-texte);
	color: var(--zp-ink);
	line-height: 1.6;
}

.zp-fiche h1,
.zp-fiche h2,
.zp-fiche h3,
.zp-fiche h4,
.zp-catalogue h3,
.zp-accueil h1,
.zp-accueil h2,
.zp-accueil h3,
.zp-accueil h4 {
	font-family: var(--zp-titre);
	line-height: 1.05;
	letter-spacing: -.02em;
	font-weight: 700;
	color: var(--zp-navy);
}

/* ---------------------------------------------------------------- Surtitre */

.zp-eyebrow {
	font-weight: 600;
	font-size: .78rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--zp-blue);
	display: inline-flex;
	align-items: center;
	gap: .6em;
}

.zp-eyebrow::before {
	content: "";
	width: 26px;
	height: 2px;
	background: var(--zp-amber);
	display: inline-block;
}

/* ----------------------------------------------------------------- Boutons */

/*
 * Trois classes (.elementor-widget.zp-btn--x .elementor-button) : depuis que cette
 * feuille est chargée avant celle d'Elementor, sa règle `.elementor-button:visited
 * { color: #fff }` gagnait à égalité sur tout lien déjà visité — texte blanc sur
 * fond blanc (19 septembre 2026).
 *
 * Elementor pose les classes personnalisées sur le conteneur du widget, jamais sur
 * le <a>. Les règles visent donc le bouton descendant ; « a.zp-btn » couvre l'usage
 * hors Elementor (widgets maison, contenu libre).
 */
.elementor-widget.zp-btn .elementor-button,
a.zp-btn {
	display: inline-flex;
	align-items: center;
	gap: .5em;
	font-family: var(--zp-texte);
	font-weight: 600;
	font-size: .95rem;
	padding: .72em 1.4em;
	border-radius: 100px;
	border: 0;
	cursor: pointer;
	text-decoration: none;
	white-space: nowrap;
	transition: transform .25s var(--zp-ease), box-shadow .25s, background .25s, border-color .25s;
}

/* Le conteneur du widget ne porte aucun décor : il ne doit pas doubler la pilule. */
.zp-btn.elementor-widget-button {
	background: none;
	padding: 0;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

.elementor-widget.zp-btn--primaire .elementor-button,
a.zp-btn--primaire {
	background: var(--zp-amber);
	color: #3A2708;
	box-shadow: 0 4px 14px rgba(224, 152, 46, .35);
}

.elementor-widget.zp-btn--primaire .elementor-button:hover,
.elementor-widget.zp-btn--primaire .elementor-button:focus-visible,
a.zp-btn--primaire:hover,
a.zp-btn--primaire:focus-visible {
	transform: translateY(-2px);
	box-shadow: 0 8px 22px rgba(224, 152, 46, .45);
	color: #3A2708;
}

.elementor-widget.zp-btn--fantome .elementor-button,
a.zp-btn--fantome {
	background: transparent;
	color: var(--zp-navy);
	border: 1.5px solid var(--zp-line);
}

.elementor-widget.zp-btn--fantome .elementor-button:hover,
.elementor-widget.zp-btn--fantome .elementor-button:focus-visible,
a.zp-btn--fantome:hover,
a.zp-btn--fantome:focus-visible {
	border-color: var(--zp-navy);
	background: var(--zp-white);
	color: var(--zp-navy);
}

.zp-eyebrow .elementor-heading-title {
	color: inherit;
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	letter-spacing: inherit;
	text-transform: inherit;
	line-height: inherit;
}

/* ------------------------------------------------------- Titre de section */

.zp-sec-head {
	max-width: 720px;
	margin-bottom: clamp(38px, 5vw, 60px);
}

.zp-sec-head h2 {
	font-size: clamp(1.9rem, 4vw, 3rem);
	margin: .7rem 0 .8rem;
	letter-spacing: -.03em;
}

.zp-sec-head p {
	font-size: 1.1rem;
	color: var(--zp-ink-soft);
}

/* ------------------------------------------------- Grilles et cartes base */

.zp-grille {
	display: grid;
	gap: 1.25rem;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.zp-carte {
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
	padding: 1.7rem 1.6rem;
	transition: transform .3s var(--zp-ease), box-shadow .3s, border-color .3s;
}

.zp-carte:hover {
	transform: translateY(-5px);
	box-shadow: var(--zp-shadow-md);
}

/* ------------------------------------------------------- Module de programme */

.zp-module {
	display: flex;
	flex-direction: column;
}

.zp-module__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 1rem;
	gap: 1rem;
}

.zp-module__num {
	font-family: var(--zp-titre);
	font-weight: 800;
	font-size: 2.4rem;
	color: var(--zp-blue-soft);
	line-height: 1;
	letter-spacing: -.04em;
}

.zp-module__duree {
	font-size: .74rem;
	font-weight: 600;
	letter-spacing: .05em;
	color: var(--zp-blue);
	background: var(--zp-blue-soft);
	padding: .4em .8em;
	border-radius: 100px;
	white-space: nowrap;
}

.zp-module h3 {
	font-size: 1.14rem;
	margin-bottom: .6rem;
}

.zp-module p {
	font-size: .92rem;
	color: var(--zp-ink-soft);
	flex: 1;
}

.zp-module__atelier {
	margin-top: 1rem;
	padding-top: .9rem;
	border-top: 1px dashed var(--zp-line);
	font-size: .86rem;
	color: var(--zp-green);
	font-weight: 600;
	display: flex;
	align-items: center;
	gap: .5em;
}

/* --------------------------------------------------- Caractéristique (pilier) */

.zp-pilier {
	position: relative;
	overflow: hidden;
	padding: 2rem 1.6rem;
}

.zp-pilier::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	height: 4px;
	width: 100%;
	background: var(--zp-teinte, var(--zp-blue));
}

.zp-pilier__ico {
	width: 52px;
	height: 52px;
	border-radius: 14px;
	display: grid;
	place-items: center;
	margin-bottom: 1.2rem;
	background: var(--zp-teinte-douce, var(--zp-blue-soft));
	color: var(--zp-teinte, var(--zp-blue));
}

.zp-pilier h3 {
	font-size: 1.16rem;
	margin-bottom: .5rem;
}

.zp-pilier p {
	font-size: .94rem;
	color: var(--zp-ink-soft);
	white-space: pre-line;
}

/* Déclinaisons de teinte, dans l'ordre du modèle. */
.zp-pilier:nth-child(4n+1) { --zp-teinte: var(--zp-blue);  --zp-teinte-douce: var(--zp-blue-soft); }
.zp-pilier:nth-child(4n+2) { --zp-teinte: var(--zp-green); --zp-teinte-douce: var(--zp-green-soft); }
.zp-pilier:nth-child(4n+3) { --zp-teinte: var(--zp-amber); --zp-teinte-douce: var(--zp-amber-soft); }
.zp-pilier:nth-child(4n)   { --zp-teinte: var(--zp-navy);  --zp-teinte-douce: var(--zp-blue-soft); }

/* ------------------------------------------------------------ Étiquettes */

.zp-tag {
	font-size: .84rem;
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: 100px;
	padding: .4em .9em;
	color: var(--zp-ink-soft);
	font-weight: 500;
	display: inline-block;
}

.zp-pill {
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r-sm);
	padding: .7rem 1rem;
	flex: 1;
	min-width: 120px;
	background: var(--zp-white);
}

.zp-pill b {
	display: block;
	font-family: var(--zp-titre);
	color: var(--zp-navy);
	font-size: 1.05rem;
}

.zp-pill span {
	font-size: .8rem;
	color: var(--zp-ink-soft);
}

/* ------------------------------------------------------------- Objectifs */

.zp-liste {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: .7rem;
}

.zp-liste li {
	position: relative;
	padding-left: 1.9rem;
	color: var(--zp-ink-soft);
}

.zp-liste li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .45em;
	width: 10px;
	height: 10px;
	border-radius: 3px;
	background: var(--zp-green);
}

/* ------------------------------------------------------------ Indicateurs */

.zp-stats {
	display: grid;
	gap: 1rem;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.zp-stat {
	background: var(--zp-navy);
	border-radius: var(--zp-r);
	padding: 1.4rem 1.3rem;
	color: #EAF1F7;
}

.zp-stat b {
	display: block;
	font-family: var(--zp-titre);
	font-size: 2.4rem;
	font-weight: 800;
	line-height: 1;
	letter-spacing: -.03em;
	color: var(--zp-amber);
	margin-bottom: .35rem;
}

.zp-stat span {
	font-size: .86rem;
}

/* ---------------------------------------------------------------- Sessions */

.zp-sessions {
	width: 100%;
	border-collapse: collapse;
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
	overflow: hidden;
}

.zp-sessions th,
.zp-sessions td {
	text-align: left;
	padding: .85rem 1.1rem;
	border-bottom: 1px solid var(--zp-line);
	font-size: .93rem;
}

.zp-sessions th {
	font-family: var(--zp-titre);
	font-weight: 700;
	color: var(--zp-navy);
	background: var(--zp-paper);
	font-size: .8rem;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.zp-sessions tr:last-child td {
	border-bottom: 0;
}

/* ------------------------------------------------------------- Mention légale */

.zp-mention {
	margin-top: 1.1rem;
	font-size: .84rem;
	color: var(--zp-ink-soft);
	border-left: 3px solid var(--zp-amber);
	padding-left: .9rem;
	white-space: pre-line;
}

@media (prefers-reduced-motion: reduce) {
	:is(.zp-fiche, .zp-accueil, .zp-entete) * {
		transition: none !important;
	}
}

/* ---------------------------------------------------------- Fond sombre */

/*
 * Sur fond navy, les titres héritent de la couleur globale « primary » du kit,
 * elle-même navy : illisible. La spécificité est portée à trois classes pour
 * repasser devant la règle du widget Elementor (.elementor-widget-heading
 * .elementor-heading-title), sans recourir à !important.
 */
:is(.zp-fiche, .zp-accueil).zp-inverse .elementor-heading-title,
:is(.zp-fiche, .zp-accueil).zp-inverse h1,
:is(.zp-fiche, .zp-accueil).zp-inverse h2,
:is(.zp-fiche, .zp-accueil).zp-inverse h3 {
	color: var(--zp-white);
}

:is(.zp-fiche, .zp-accueil).zp-inverse,
:is(.zp-fiche, .zp-accueil).zp-inverse p {
	color: #EAF1F7;
}

:is(.zp-fiche, .zp-accueil).zp-inverse .zp-eyebrow {
	color: var(--zp-amber);
}

/* ------------------------------------------------------------------ Tarif */

.zp-tarif .elementor-heading-title,
.zp-tarif {
	font-family: var(--zp-titre);
	font-weight: 800;
	font-size: clamp(2rem, 4vw, 2.8rem);
	line-height: 1;
	letter-spacing: -.03em;
	color: var(--zp-navy);
}

/* --------------------------------------------------------- Bandeau d'en-tête */

/*
 * Le grand aplat bleu du modèle : un dégradé linéaire plus deux halos radiaux
 * (bleu en haut à droite, vert en bas à gauche). Il est porté par la feuille et
 * non par un réglage Elementor, parce qu'un fond de container ne sait pas
 * empiler plusieurs dégradés.
 */
.zp-bandeau {
	background:
		radial-gradient(1200px 600px at 78% -8%, rgba(46, 115, 172, .20), transparent 60%),
		radial-gradient(900px 500px at 10% 110%, rgba(76, 139, 69, .16), transparent 55%),
		linear-gradient(160deg, #0F2B43 0%, #12314C 46%, #163B5C 100%);
	position: relative;
	overflow: hidden;
}

.zp-bandeau h1 {
	font-size: clamp(2.15rem, 5.4vw, 4.35rem);
	font-weight: 800;
	letter-spacing: -.035em;
}

/* Cartes en verre dépoli : le liseré coloré du pilier reste le seul aplat vif. */
.zp-inverse .zp-carte,
.zp-inverse .zp-pilier {
	background: rgba(255, 255, 255, .06);
	border-color: rgba(255, 255, 255, .14);
	backdrop-filter: blur(6px);
}

.zp-inverse .zp-carte:hover,
.zp-inverse .zp-pilier:hover {
	background: rgba(255, 255, 255, .10);
	border-color: rgba(255, 255, 255, .22);
	box-shadow: 0 18px 40px rgba(0, 0, 0, .18);
}

.zp-inverse .zp-pilier h3 {
	color: var(--zp-white);
}

.zp-inverse .zp-pilier p,
.zp-inverse .zp-liste li {
	color: #B3C8DB;
}

/* Le bouton fantôme doit se détacher du bleu, pas du blanc. */
.zp-inverse .elementor-widget.zp-btn--fantome .elementor-button,
.zp-inverse a.zp-btn--fantome {
	color: var(--zp-white);
	border-color: rgba(255, 255, 255, .28);
}

.zp-inverse .elementor-widget.zp-btn--fantome .elementor-button:hover,
.zp-inverse .elementor-widget.zp-btn--fantome .elementor-button:focus-visible,
.zp-inverse a.zp-btn--fantome:hover {
	background: rgba(255, 255, 255, .08);
	border-color: var(--zp-white);
	color: var(--zp-white);
}

/* Respiration entre l'accroche du haut et le sous-titre « L'essentiel ». */
.zp-bandeau .zp-sec-head {
	margin-top: clamp(48px, 6vw, 82px);
}

/* ------------------------------------------------------------- Deux colonnes */

/*
 * La disposition en deux colonnes est portée par le gabarit Elementor
 * (flex_direction / width), pas par cette feuille : le CSS généré par Elementor
 * a trois classes de spécificité et gagnerait sur toute règle posée ici.
 * Ne restent donc que l'habillage et le comportement.
 */

/* Une carte qui contient un formulaire ne doit pas bouger sous le curseur. */
.zp-fiche .zp-colonne:hover {
	transform: none;
	box-shadow: var(--zp-shadow-sm);
}

.zp-colonne h3 {
	font-size: 1.3rem;
	margin-bottom: .8rem;
}

.zp-colonne p {
	font-size: .95rem;
	color: var(--zp-ink-soft);
}

.zp-tags {
	display: flex;
	flex-wrap: wrap;
	gap: .45rem;
	margin-top: .9rem;
}

/* ------------------------------------------------------------- Formulaires */

.zp-form .elementor-field-group > label {
	font-size: .8rem;
	font-weight: 600;
	color: var(--zp-ink-soft);
	margin-bottom: .35rem;
}

.zp-form .elementor-field-textual {
	font-family: var(--zp-texte);
	font-size: .95rem;
	line-height: 1.5;
	color: var(--zp-ink);
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r-sm);
	padding: .68em .9em;
	transition: border-color .2s, box-shadow .2s;
}

.zp-form .elementor-field-textual:focus {
	border-color: var(--zp-blue);
	box-shadow: 0 0 0 3px rgba(46, 115, 172, .16);
	outline: 0;
}

.zp-form .elementor-field-textual::placeholder {
	color: #9AA9B6;
}

/* Le bouton d'envoi reprend le bouton primaire du design system. */
.zp-form .elementor-button[type="submit"] {
	font-family: var(--zp-texte);
	font-weight: 600;
	font-size: .95rem;
	padding: .72em 1.4em;
	border-radius: 100px;
	border: 0;
	background: var(--zp-amber);
	color: #3A2708;
	box-shadow: 0 4px 14px rgba(224, 152, 46, .35);
	transition: transform .25s var(--zp-ease), box-shadow .25s;
}

.zp-form .elementor-button[type="submit"]:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 22px rgba(224, 152, 46, .45);
}

.zp-form .elementor-message {
	font-size: .9rem;
	margin-top: .6rem;
}

.zp-form .elementor-message.elementor-message-success {
	color: var(--zp-green);
}

/* ------------------------------------------------------- Formulaire déroulant */

/*
 * Le panneau est créé par fiche.js, hors de l'arborescence de containers
 * Elementor : sa disposition est donc entièrement maîtrisée ici. La transition
 * sur grid-template-rows permet d'animer vers la hauteur réelle du contenu,
 * ce qu'une max-height chiffrée ne sait pas faire.
 */
.zp-repli {
	display: grid;
	grid-template-rows: 0fr;
	opacity: 0;
	transition: grid-template-rows .38s var(--zp-ease), opacity .28s var(--zp-ease);
}

.zp-repli__interieur {
	overflow: hidden;
	min-height: 0;
}

.zp-colonne.est-ouvert .zp-repli {
	grid-template-rows: 1fr;
	opacity: 1;
}

/*
 * Les deux colonnes ont la même hauteur mais pas le même contenu : sans cette
 * marge, un bouton flotterait plus haut que l'autre.
 */
.zp-colonne .zp-declencheur {
	margin-top: auto;
}

/* Le bouton occupe toute la largeur : il fait office de barre d'accordéon. */
.elementor-widget.zp-declencheur .elementor-button {
	width: 100%;
	justify-content: center;
	margin-top: .4rem;
}

.elementor-widget.zp-declencheur .elementor-button::after {
	content: "";
	width: .5em;
	height: .5em;
	margin-left: .1em;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-.15em) rotate(45deg);
	transition: transform .3s var(--zp-ease);
}

.zp-colonne.est-ouvert .elementor-widget.zp-declencheur .elementor-button::after {
	transform: translateY(.1em) rotate(-135deg);
}

@media (prefers-reduced-motion: reduce) {
	.zp-repli {
		transition: none;
	}
}

/* ------------------------------------------------------- Contact Form 7 */

/*
 * Contact Form 7 n'impose presque aucun style : tout l'habillage est ici, aligné
 * sur les champs du design system.
 */
.zp-cf7__ligne {
	margin-bottom: .9rem;
}

.zp-cf7__ligne--double {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .9rem;
}

.zp-cf7__champ {
	display: block;
	font-size: .8rem;
	font-weight: 600;
	color: var(--zp-ink-soft);
}

/* CF7 enveloppe chaque champ dans un span inline : le passer en bloc évite que
   la largeur de l'input dépende d'un contexte inline. */
.zp-form .wpcf7-form-control-wrap {
	display: block;
	margin-top: .35rem;
}

.zp-form .wpcf7-form-control:not(.wpcf7-submit):not(.wpcf7-acceptance) {
	display: block;
	width: 100%;
	font-family: var(--zp-texte);
	font-size: .95rem;
	font-weight: 400;
	line-height: 1.5;
	color: var(--zp-ink);
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r-sm);
	padding: .68em .9em;
	transition: border-color .2s, box-shadow .2s;
}

.zp-form .wpcf7-form-control:focus {
	border-color: var(--zp-blue);
	box-shadow: 0 0 0 3px rgba(46, 115, 172, .16);
	outline: 0;
}

.zp-form .wpcf7-form-control::placeholder {
	color: #9AA9B6;
	font-weight: 400;
}

.zp-form textarea.wpcf7-form-control {
	resize: vertical;
	min-height: 5.5em;
}

.zp-cf7__envoi {
	margin-top: 1.1rem;
}

.zp-form .wpcf7-submit {
	width: 100%;
	font-family: var(--zp-texte);
	font-weight: 600;
	font-size: .95rem;
	padding: .72em 1.4em;
	border-radius: 100px;
	border: 0;
	cursor: pointer;
	background: var(--zp-amber);
	color: #3A2708;
	box-shadow: 0 4px 14px rgba(224, 152, 46, .35);
	transition: transform .25s var(--zp-ease), box-shadow .25s;
}

.zp-form .wpcf7-submit:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 22px rgba(224, 152, 46, .45);
}

/* Messages de validation. */
.zp-form .wpcf7-not-valid-tip {
	font-size: .8rem;
	font-weight: 500;
	color: #B32D2E;
	margin-top: .3rem;
}

.zp-form .wpcf7-form-control.wpcf7-not-valid {
	border-color: #B32D2E;
}

.zp-form .wpcf7-response-output {
	margin: 1rem 0 0;
	padding: .8rem 1rem;
	font-size: .9rem;
	border-radius: var(--zp-r-sm);
	border: 1px solid var(--zp-line);
	background: var(--zp-paper);
}

.zp-form .wpcf7-form.sent .wpcf7-response-output {
	border-color: var(--zp-green);
	background: var(--zp-green-soft);
	color: #2F5C2A;
}

.zp-form .wpcf7-form.invalid .wpcf7-response-output,
.zp-form .wpcf7-form.failed .wpcf7-response-output {
	border-color: var(--zp-amber);
	background: var(--zp-amber-soft);
	color: #6B4A12;
}

.zp-form .wpcf7-spinner {
	margin: .6rem auto 0;
	display: block;
}

@media (max-width: 767px) {
	.zp-cf7__ligne--double {
		grid-template-columns: 1fr;
	}
}

/* --------------------------------------------------- Autres formations */

/*
 * Cartes sans image : aucune formation n'a de vignette, et le modèle n'en
 * utilise pas non plus. La hiérarchie repose donc sur la typographie et sur
 * le liseré coloré, comme les cartes « pilier ».
 */
.zp-autre {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: .55rem;
	text-decoration: none;
	position: relative;
	overflow: hidden;
	padding-top: 1.9rem;
}

.zp-autre::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	height: 4px;
	width: 100%;
	background: var(--zp-teinte, var(--zp-blue));
}

.zp-autres .zp-autre:nth-child(3n+1) { --zp-teinte: var(--zp-blue); }
.zp-autres .zp-autre:nth-child(3n+2) { --zp-teinte: var(--zp-green); }
.zp-autres .zp-autre:nth-child(3n)   { --zp-teinte: var(--zp-amber); }

.zp-autre h3 {
	font-size: 1.14rem;
	margin: 0;
}

.zp-autre p {
	font-size: .92rem;
	color: var(--zp-ink-soft);
	margin: 0;
	flex: 1;
}

.zp-autre__lien {
	margin-top: .5rem;
	font-size: .88rem;
	font-weight: 600;
	color: var(--zp-blue);
	display: inline-flex;
	align-items: center;
	gap: .4em;
}

.zp-autre__lien::after {
	content: "→";
	transition: transform .25s var(--zp-ease);
}

.zp-autre:hover .zp-autre__lien::after {
	transform: translateX(3px);
}

/* ------------------------------------------------- En-tête sur deux colonnes */

/*
 * Aucune largeur n'est fixée côté Elementor pour ces deux colonnes : dès qu'un
 * « width » y est réglé, Elementor émet une règle à trois classes qui gagnerait
 * sur celles-ci. En la laissant libre, la répartition se pilote ici — et la
 * colonne image, quand la formation n'a pas de vignette, se réduit à rien : le
 * titre reprend alors toute la largeur, sans cas particulier à gérer.
 */
.zp-illustration {
	margin: 0;
	width: 100%;
	border-radius: var(--zp-r);
	overflow: hidden;
	box-shadow: 0 20px 50px rgba(0, 0, 0, .28);
	line-height: 0;
}

.zp-illustration__img {
	width: 100%;
	height: auto;
	display: block;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

@media (max-width: 1024px) {
	.zp-illustration {
		width: 100%;
		max-width: 480px;
	}
}

/* ------------------------------------------------------------- Catalogue */

/*
 * Page catalogue : barre de filtres, recherche et cartes de formation.
 * La barre est rendue masquée et révélée par catalogue.js — sans script, les
 * cartes restent toutes visibles plutôt que d'offrir des commandes inertes.
 */

.zp-catalogue__barre {
	display: flex;
	flex-direction: column;
	gap: 1.1rem;
	padding: 1.4rem 1.5rem;
	background: var(--zp-paper);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
	margin-bottom: 1.6rem;
}

.zp-recherche__champ {
	width: 100%;
	font-family: var(--zp-texte);
	font-size: 1rem;
	color: var(--zp-ink);
	background: var(--zp-white);
	border: 1.5px solid var(--zp-line);
	border-radius: 100px;
	padding: .8em 1.2em;
	transition: border-color .25s var(--zp-ease), box-shadow .25s;
}

.zp-recherche__champ:focus {
	outline: none;
	border-color: var(--zp-blue);
	box-shadow: 0 0 0 3px var(--zp-blue-soft);
}

.zp-filtres {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: .5rem .9rem;
}

.zp-filtres__titre {
	font-weight: 600;
	font-size: .74rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--zp-ink-soft);
	flex: 0 0 8.5rem;
}

.zp-filtres__valeurs {
	display: flex;
	flex-wrap: wrap;
	gap: .45rem;
	flex: 1;
}

/*
 * Trois classes, sans !important : le reset d'Elementor cible `[type="button"]`,
 * donc la même spécificité que `.zp-filtre`, et il est chargé après — il gagnait
 * le départage et peignait les pastilles en #CC3366. Même piège que zp-inverse.
 */
.zp-catalogue .zp-filtres .zp-filtre {
	display: inline-flex;
	align-items: center;
	gap: .45em;
	font-family: var(--zp-texte);
	font-size: .88rem;
	font-weight: 500;
	color: var(--zp-ink);
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: 100px;
	padding: .42em .95em;
	cursor: pointer;
	transition: border-color .2s, background .2s, color .2s;
}

.zp-catalogue .zp-filtres .zp-filtre:hover {
	border-color: var(--zp-blue);
	color: var(--zp-blue);
}

.zp-catalogue .zp-filtres .zp-filtre:focus-visible {
	outline: 2px solid var(--zp-blue);
	outline-offset: 2px;
}

.zp-catalogue .zp-filtres .zp-filtre[aria-pressed="true"] {
	background: var(--zp-navy);
	border-color: var(--zp-navy);
	color: var(--zp-white);
}

.zp-catalogue .zp-filtres .zp-filtre__n {
	font-size: .74rem;
	opacity: .65;
}

.zp-catalogue__compte {
	font-size: .88rem;
	color: var(--zp-ink-soft);
	margin: 0 0 1rem;
}

.zp-catalogue__grille {
	grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
	align-items: stretch;
}

/* ------------------------------------------------- Carte de formation */

.zp-formation-carte {
	display: flex;
	flex-direction: column;
	padding: 0;
	overflow: hidden;
	text-decoration: none;
	height: 100%;
}

.zp-formation-carte--masquee {
	display: none;
}

.zp-formation-carte__media {
	margin: 0;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--zp-blue-soft);
}

.zp-formation-carte__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .5s var(--zp-ease);
}

.zp-formation-carte:hover .zp-formation-carte__img {
	transform: scale(1.04);
}

.zp-formation-carte__corps {
	display: flex;
	flex-direction: column;
	gap: .55rem;
	padding: 1.3rem 1.4rem 1.5rem;
	flex: 1;
}

.zp-formation-carte__corps .zp-tags {
	margin-top: 0;
}

.zp-formation-carte h3 {
	font-size: 1.16rem;
	margin: 0;
}

.zp-formation-carte__accroche {
	font-size: .92rem;
	color: var(--zp-ink-soft);
	margin: 0;
	flex: 1;
}

.zp-formation-carte__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: .4rem .9rem;
	padding-top: .8rem;
	border-top: 1px solid var(--zp-line);
}

.zp-formation-carte__duree {
	font-size: .86rem;
	color: var(--zp-ink-soft);
}

.zp-formation-carte__tarif {
	font-family: var(--zp-titre);
	font-weight: 700;
	color: var(--zp-navy);
	font-size: 1rem;
}

.zp-formation-carte .zp-autre__lien {
	margin-top: .2rem;
}

/* --------------------------------------------------------- État vide */

.zp-catalogue__vide {
	text-align: center;
	color: var(--zp-ink-soft);
	background: var(--zp-paper);
	border: 1px dashed var(--zp-line);
	border-radius: var(--zp-r);
	padding: 2.5rem 1.5rem;
}

.zp-catalogue .zp-catalogue__vide .zp-catalogue__reset {
	font-family: var(--zp-texte);
	font-size: .9rem;
	font-weight: 600;
	color: var(--zp-blue);
	background: none;
	border: 0;
	padding: 0;
	cursor: pointer;
	text-decoration: underline;
}

@media (max-width: 640px) {
	.zp-filtres__titre {
		flex: 1 0 100%;
	}

	.zp-catalogue__barre {
		padding: 1.1rem;
	}
}

/* ------------------------------------------------------ Gouttières */

/*
 * Sous la largeur de contenu d'Elementor (`min(100%, 767px)` en dessous du point
 * de rupture, 1140 px au-delà), l'inner du container « boxed » occupe tout le
 * viewport : le contenu touche les bords de l'écran.
 *
 * La gouttière se pose donc sur l'INNER, jamais sur la section — le fond est
 * peint sur la section et doit continuer d'aller d'un bord à l'autre. Un padding
 * appliqué à la section produirait le même retrait du contenu, mais rognerait
 * aussi le bandeau et les aplats de section, ce qui n'est pas voulu.
 *
 * Trois classes : le reset d'Elementor pose déjà `.e-con > .e-con-inner`, à
 * spécificité égale et chargé après.
 */
@media (max-width: 1139px) {
	:is(.zp-fiche, .zp-accueil, .zp-entete, .zp-pied).e-con > .e-con-inner {
		padding-inline: 1.25rem;
	}

	/* Section en pleine largeur, sans inner : le padding va sur elle, il reste
	   à l'intérieur de la boîte de fond et ne rogne donc pas l'aplat. */
	:is(.zp-fiche, .zp-accueil, .zp-entete, .zp-pied).e-con-full {
		padding-inline: 1.25rem;
	}
}

@media (max-width: 400px) {
	:is(.zp-fiche, .zp-accueil, .zp-entete, .zp-pied).e-con > .e-con-inner,
	:is(.zp-fiche, .zp-accueil, .zp-entete, .zp-pied).e-con-full {
		padding-inline: 1rem;
	}
}

/* =========================================================================
 * Accueil, en-tête et pied de page — 19 septembre 2026
 *
 * Même règle que pour les fiches : la disposition (colonnes, largeurs, sens
 * des flex) est réglée dans Elementor, cette feuille ne fait que l'habillage.
 * Spécificité à trois classes par défaut pour passer devant les règles
 * générées par Elementor sans !important.
 * ====================================================================== */

/* Les ancres du menu (#financement, #entreprises…) ne doivent pas finir sous
   l'en-tête collant. */
.zp-accueil[id] {
	scroll-margin-top: 88px;
}

.zp-accueil .zp-sec-head.e-con,
.zp-accueil .zp-sec-head {
	max-width: 720px;
}

.zp-accueil .zp-centre {
	text-align: center;
	margin-inline: auto;
}

.zp-accueil .zp-centre .zp-eyebrow {
	justify-content: center;
}

.zp-accueil .zp-chapo p,
.zp-accueil .zp-chapo {
	font-size: 1.1rem;
	color: var(--zp-ink-soft);
	margin: 0;
}

.zp-accueil.zp-inverse .zp-chapo p,
.zp-accueil.zp-inverse .zp-chapo {
	color: #C6D7E6;
}

.zp-accueil .elementor-widget-heading h2.elementor-heading-title {
	font-size: clamp(1.9rem, 4vw, 3rem);
	letter-spacing: -.03em;
	line-height: 1.08;
}

/* Bouton clair, pour les fonds sombres. */
.elementor-widget.zp-btn--clair .elementor-button,
a.zp-btn--clair {
	background: var(--zp-white);
	color: var(--zp-navy);
}

.elementor-widget.zp-btn--clair .elementor-button:hover,
.elementor-widget.zp-btn--clair .elementor-button:focus-visible,
a.zp-btn--clair:hover {
	transform: translateY(-2px);
	color: var(--zp-navy);
	box-shadow: 0 8px 22px rgba(0, 0, 0, .25);
}

/* Bouton fantôme sur fond sombre. */
.zp-inverse .elementor-widget.zp-btn--fantome .elementor-button {
	color: var(--zp-white);
	border-color: rgba(255, 255, 255, .35);
}

.zp-inverse .elementor-widget.zp-btn--fantome .elementor-button:hover,
.zp-inverse .elementor-widget.zp-btn--fantome .elementor-button:focus-visible {
	background: rgba(255, 255, 255, .08);
	border-color: var(--zp-white);
	color: var(--zp-white);
}

/* ---------------------------------------------------------------- Hero */

.zp-accueil.zp-hero h1.elementor-heading-title {
	font-size: clamp(2.15rem, 5.2vw, 4.1rem);
	font-weight: 800;
	letter-spacing: -.035em;
	line-height: 1.02;
	overflow-wrap: break-word;
}

.zp-accueil.zp-hero .zp-accent {
	color: var(--zp-amber);
}

.zp-accueil.zp-hero .zp-chapo p {
	font-size: clamp(1.05rem, 1.6vw, 1.25rem);
	color: #BCD2E5;
	max-width: 40ch;
}

.zp-badges {
	display: flex;
	flex-wrap: wrap;
	gap: .6rem 1.6rem;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: .86rem;
	color: #9DB8CF;
}

.zp-badges li {
	display: inline-flex;
	align-items: center;
	gap: .5em;
}

.zp-badges li::before {
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--zp-amber);
}

.zp-badges b {
	color: var(--zp-white);
	font-weight: 600;
}

/* Carte de chiffres clés, en verre dépoli sur le bandeau. */
.zp-accueil .zp-hero-carte.e-con {
	background: rgba(255, 255, 255, .06);
	border: 1px solid rgba(255, 255, 255, .14);
	border-radius: var(--zp-r);
	backdrop-filter: blur(6px);
}

.zp-accueil .zp-stat-cle .zp-stat__valeur .elementor-heading-title {
	font-family: var(--zp-titre);
	font-weight: 800;
	font-size: clamp(2.2rem, 4vw, 3rem);
	line-height: 1;
	letter-spacing: -.03em;
	color: var(--zp-navy);
}

.zp-accueil .zp-stat-cle .zp-stat__libelle p,
.zp-accueil .zp-stat-cle .zp-stat__libelle {
	font-size: .92rem;
	line-height: 1.45;
	color: var(--zp-ink-soft);
	margin: 0;
}

.zp-accueil.zp-inverse .zp-stat-cle .zp-stat__valeur .elementor-heading-title {
	color: var(--zp-white);
}

.zp-accueil.zp-inverse .zp-stat-cle .zp-stat__libelle p {
	color: #BCD2E5;
}

.zp-accueil .zp-hero-carte .zp-stat-cle.e-con {
	padding-bottom: 1rem;
	border-bottom: 1px solid rgba(255, 255, 255, .12);
}

.zp-accueil .zp-hero-carte .zp-stat-cle.e-con:last-child {
	border-bottom: 0;
	padding-bottom: 0;
}

/* ------------------------------------------------ Sélecteur de domaine */

.zp-selecteur {
	background: var(--zp-white);
	border-radius: var(--zp-r);
	padding: .9rem;
	box-shadow: var(--zp-shadow-md);
	max-width: 560px;
}

.zp-selecteur__libelle {
	display: block;
	font-family: var(--zp-titre);
	font-weight: 600;
	font-size: 1rem;
	color: var(--zp-navy);
	padding: .1rem .35rem .55rem;
}

.zp-selecteur__ligne {
	display: flex;
	gap: .6rem;
}

.zp-selecteur .zp-selecteur__ligne .zp-selecteur__choix {
	flex: 1 1 auto;
	min-width: 0;
	font: 500 1rem/1.3 var(--zp-texte);
	color: var(--zp-ink);
	background: var(--zp-paper);
	border: 1.5px solid var(--zp-line);
	border-radius: 100px;
	padding: .7em 1.1em;
	height: auto;
}

.zp-selecteur .zp-selecteur__ligne .zp-selecteur__choix:focus {
	outline: none;
	border-color: var(--zp-blue);
	box-shadow: 0 0 0 3px var(--zp-blue-soft);
}

/* Le reset d'Elementor colore tous les <button> : trois classes pour passer devant. */
.zp-selecteur .zp-selecteur__ligne .zp-selecteur__envoi {
	flex: 0 0 auto;
	font: 600 .95rem/1 var(--zp-texte);
	color: #3A2708;
	background: var(--zp-amber);
	border: 0;
	border-radius: 100px;
	padding: .85em 1.4em;
	cursor: pointer;
	box-shadow: 0 4px 14px rgba(224, 152, 46, .35);
	transition: transform .25s var(--zp-ease), box-shadow .25s;
}

.zp-selecteur .zp-selecteur__ligne .zp-selecteur__envoi:hover,
.zp-selecteur .zp-selecteur__ligne .zp-selecteur__envoi:focus-visible {
	transform: translateY(-2px);
	color: #3A2708;
	background: var(--zp-amber);
	box-shadow: 0 8px 22px rgba(224, 152, 46, .45);
}

@media (max-width: 480px) {
	.zp-selecteur__ligne {
		flex-direction: column;
	}
}

/* ------------------------------------------------------------ Domaines */

.zp-domaines {
	display: grid;
	gap: 1rem;
	grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
}

.zp-domaine {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: .45rem;
	padding: 1.4rem 1.4rem 1.3rem;
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
	color: var(--zp-ink);
	text-decoration: none;
	transition: transform .3s var(--zp-ease), box-shadow .3s, border-color .3s;
}

.zp-domaine:hover,
.zp-domaine:focus-visible {
	transform: translateY(-3px);
	border-color: transparent;
	box-shadow: var(--zp-shadow-md);
	color: var(--zp-ink);
}

.zp-accueil .zp-domaine h3 {
	font-size: 1.2rem;
	line-height: 1.2;
	margin: 0;
}

.zp-domaine p {
	margin: 0;
	font-size: .9rem;
	line-height: 1.5;
	color: var(--zp-ink-soft);
	flex: 1 1 auto;
}

.zp-domaine__n {
	align-self: flex-start;
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .04em;
	color: var(--zp-blue);
	background: var(--zp-blue-soft);
	border-radius: 100px;
	padding: .25em .75em;
}

.zp-domaine__lien {
	align-self: flex-end;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--zp-paper);
	display: grid;
	place-items: center;
	transition: background .3s, transform .3s var(--zp-ease);
}

.zp-domaine__lien::before {
	content: "→";
	color: var(--zp-navy);
	font-weight: 700;
}

.zp-domaine:hover .zp-domaine__lien {
	background: var(--zp-amber);
	transform: translateX(3px);
}

/* ------------------------------------------------ Formations à la une */

.zp-grille.zp-phares {
	grid-template-columns: repeat(4, minmax(0, 1fr));
	padding-left: 0;
	white-space: normal;
}

@media (max-width: 1024px) {
	.zp-grille.zp-phares {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.zp-grille.zp-phares {
		grid-template-columns: minmax(0, 1fr);
	}
}

.zp-accueil .zp-phares .zp-formation-carte h3 {
	font-size: 1.08rem;
}

/* ------------------------------------------------ Étapes d'inscription */

.zp-accueil .zp-etape.e-con {
	position: relative;
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
}

.zp-accueil .zp-etape.e-con::after {
	content: "";
	position: absolute;
	left: 1.5rem;
	right: 1.5rem;
	top: 0;
	height: 3px;
	border-radius: 0 0 3px 3px;
	background: var(--zp-amber);
}

.zp-accueil .zp-etape:nth-child(4n+2)::after { background: var(--zp-blue); }
.zp-accueil .zp-etape:nth-child(4n+3)::after { background: var(--zp-green); }
.zp-accueil .zp-etape:nth-child(4n)::after   { background: var(--zp-navy); }

.zp-accueil .zp-etape .zp-etape__num .elementor-heading-title {
	font-family: var(--zp-titre);
	font-weight: 800;
	font-size: .95rem;
	width: 2.4rem;
	height: 2.4rem;
	border-radius: 50%;
	display: grid;
	place-items: center;
	color: var(--zp-white);
	background: var(--zp-navy);
}

.zp-accueil .zp-etape h3.elementor-heading-title {
	font-size: 1.15rem;
	line-height: 1.25;
}

.zp-accueil .zp-etape .elementor-widget-text-editor {
	font-size: .95rem;
	color: var(--zp-ink-soft);
}

/* --------------------------------------------------------- Financement */

.zp-accueil .zp-financement.e-con {
	background: rgba(255, 255, 255, .06);
	border: 1px solid rgba(255, 255, 255, .14);
	border-radius: var(--zp-r);
	backdrop-filter: blur(6px);
}

.zp-accueil.zp-inverse .zp-financement h3.elementor-heading-title {
	font-size: 1.3rem;
	color: var(--zp-white);
}

.zp-accueil .zp-financement .zp-financement__qui .elementor-heading-title {
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--zp-amber);
}

.zp-accueil.zp-inverse .zp-financement .elementor-widget-text-editor,
.zp-accueil.zp-inverse .zp-financement .elementor-widget-text-editor p {
	color: #C6D7E6;
	font-size: .95rem;
}

/* ------------------------------------------------------------ Entreprises */

.zp-accueil .zp-carte-partenaire.e-con {
	background: var(--zp-paper);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
}

.zp-accueil .zp-carte-partenaire h3.elementor-heading-title {
	font-size: 1.4rem;
}

/* ------------------------------------------------------------- Preuves */

.zp-accueil .zp-chiffre.e-con {
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
}

.zp-accueil .zp-logos .swiper-slide-image {
	max-height: 64px;
	width: auto;
	object-fit: contain;
	filter: grayscale(1);
	opacity: .7;
	transition: filter .3s, opacity .3s;
}

.zp-accueil .zp-logos .swiper-slide:hover .swiper-slide-image {
	filter: none;
	opacity: 1;
}

.zp-accueil .zp-logos .swiper-slide {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 80px;
}

.zp-accueil .zp-qualiopi img {
	max-height: 70px;
	width: auto;
}

/* ------------------------------------------------------------ Formateurs */

.zp-accueil .zp-formateur.e-con {
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
	text-align: center;
}

.zp-accueil .zp-formateur img {
	width: 150px;
	height: 150px;
	object-fit: cover;
}

.zp-accueil .zp-formateur h3.elementor-heading-title {
	font-size: 1.2rem;
}

.zp-accueil .zp-formateur .zp-formateur__xp .elementor-heading-title {
	font-size: .85rem;
	font-weight: 600;
	color: var(--zp-blue);
}

.zp-accueil .elementor-widget.zp-lien .elementor-button {
	background: none;
	padding: 0;
	font: 600 .92rem/1.4 var(--zp-texte);
	color: var(--zp-blue);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.zp-accueil .elementor-widget.zp-lien .elementor-button:hover {
	color: var(--zp-navy);
}

/* ------------------------------------------------------------------ FAQ */

.zp-accueil .zp-faq .elementor-toggle-item {
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r-sm);
	margin-bottom: .7rem;
	overflow: hidden;
}

.zp-accueil .zp-faq .elementor-tab-title {
	font-family: var(--zp-titre);
	font-weight: 600;
	font-size: 1.05rem;
	color: var(--zp-navy);
	padding: 1.05rem 1.25rem;
	border: 0;
}

.zp-accueil .zp-faq .elementor-tab-title a,
.zp-accueil .zp-faq .elementor-tab-title .elementor-toggle-icon {
	color: var(--zp-navy);
}

.zp-accueil .zp-faq .elementor-tab-title.elementor-active .elementor-toggle-icon {
	color: var(--zp-amber);
}

.zp-accueil .zp-faq .elementor-tab-content {
	padding: 0 1.25rem 1.2rem;
	border: 0;
	color: var(--zp-ink-soft);
	font-size: .97rem;
	line-height: 1.65;
}

/* ------------------------------------------------------------ Appel final */

.zp-accueil.zp-appel {
	background:
		radial-gradient(800px 400px at 15% 0, rgba(224, 152, 46, .22), transparent 60%),
		radial-gradient(700px 500px at 100% 100%, rgba(76, 139, 69, .20), transparent 55%),
		linear-gradient(150deg, #0F2B43, #12314C 60%, #16375A);
	text-align: center;
	overflow: hidden;
}

.zp-accueil.zp-appel .zp-eyebrow {
	justify-content: center;
}

.zp-contacts {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: .8rem 2rem;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: .95rem;
	color: #B3C8DB;
}

.zp-contacts a {
	color: var(--zp-white);
	font-weight: 600;
	text-decoration: none;
}

.zp-contacts a:hover {
	color: var(--zp-amber);
}

/* ============================================================== En-tête */

/*
 * Barre blanche translucide du modèle. Le widget Menu d'Elementor Pro garde ses
 * propres réglages de couleur (définis dans le gabarit) ; la feuille n'ajoute
 * que ce que ces réglages ne savent pas faire.
 */
.zp-entete.e-con {
	background: rgba(255, 255, 255, .92);
	backdrop-filter: saturate(180%) blur(12px);
	border-bottom: 1px solid var(--zp-line);
}

.zp-entete .zp-entete__logo img {
	width: 132px;
	height: auto;
	display: block;
}

.zp-entete .zp-entete__tel .elementor-heading-title a,
.zp-entete .zp-entete__tel .elementor-heading-title {
	font-family: var(--zp-texte);
	font-weight: 600;
	font-size: .92rem;
	color: var(--zp-navy);
	white-space: nowrap;
	text-decoration: none;
}

.zp-entete .zp-entete__tel .elementor-heading-title a:hover {
	color: var(--zp-blue);
}

.zp-entete .elementor-nav-menu--main .elementor-item {
	font-family: var(--zp-texte);
}

.zp-entete .elementor-nav-menu--main .sub-menu {
	border-radius: var(--zp-r-sm);
	box-shadow: var(--zp-shadow-md);
	min-width: 240px;
}

/*
 * 07/10/2026 : pas d'overflow: hidden sur le sous-menu, il coupait le 2e niveau
 * (catégories sous « Toutes les formations »), qui s'ouvre hors de la boîte du 1er.
 * Les coins arrondis passent par le premier et le dernier lien.
 */
.zp-entete .elementor-nav-menu--main .sub-menu > li:first-child > a {
	border-top-left-radius: var(--zp-r-sm);
	border-top-right-radius: var(--zp-r-sm);
}

.zp-entete .elementor-nav-menu--main .sub-menu > li:last-child > a {
	border-bottom-left-radius: var(--zp-r-sm);
	border-bottom-right-radius: var(--zp-r-sm);
}

.zp-entete .elementor-nav-menu--dropdown.elementor-nav-menu__container {
	box-shadow: var(--zp-shadow-md);
	border-top: 1px solid var(--zp-line);
}

.zp-entete .elementor-widget.zp-btn .elementor-button {
	font-size: .9rem;
	padding: .65em 1.2em;
}

@media (max-width: 480px) {
	.zp-entete .zp-entete__logo img {
		width: 104px;
	}

	.zp-entete .elementor-widget.zp-btn .elementor-button {
		font-size: .82rem;
		padding: .6em .95em;
	}
}

/* ======================================================== Pied de page */

.zp-pied.e-con {
	background: #0C2135;
	color: #8FA8BD;
	font-size: .9rem;
}

.zp-pied .zp-pied__logo img {
	width: 150px;
	height: auto;
	background: var(--zp-white);
	border-radius: 12px;
	padding: 10px 14px;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .25);
}

.zp-pied.e-con .elementor-heading-title {
	font-family: var(--zp-titre);
	font-size: 1rem;
	font-weight: 600;
	color: var(--zp-white);
	letter-spacing: -.01em;
}

.zp-pied .elementor-widget-text-editor,
.zp-pied .elementor-widget-text-editor p {
	color: #8FA8BD;
	line-height: 1.65;
	margin: 0 0 .5rem;
}

.zp-pied .elementor-widget-text-editor a {
	color: #CFE0EE;
	text-decoration: none;
}

.zp-pied .elementor-widget-text-editor a:hover {
	color: var(--zp-amber);
}

.zp-pied ul.zp-pied__liens {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: .45rem;
}

.zp-pied .zp-pied__bas.e-con {
	border-top: 1px solid rgba(255, 255, 255, .1);
}

.zp-pied .zp-pied__bas .elementor-widget-text-editor,
.zp-pied .zp-pied__bas .elementor-widget-text-editor p {
	font-size: .8rem;
	color: #6F8AA2;
	margin: 0;
}

/* Liste numérotée (étapes d'un projet entreprise) : le numéro remplace la puce. */
.zp-accueil ol.zp-liste.zp-liste--num {
	counter-reset: zp-etape;
}

.zp-accueil ol.zp-liste.zp-liste--num li {
	counter-increment: zp-etape;
	padding-left: 2.4rem;
}

.zp-accueil ol.zp-liste.zp-liste--num li::before {
	content: counter(zp-etape);
	top: 0;
	width: 1.6rem;
	height: 1.6rem;
	border-radius: 50%;
	background: var(--zp-navy);
	color: var(--zp-white);
	font: 700 .8rem/1.6rem var(--zp-titre);
	text-align: center;
}

.zp-accueil .zp-liste strong {
	color: var(--zp-navy);
}

/* ================================================================ À propos */

/*
 * Page « À propos » (30 septembre 2026), générée par _import/outils/page_apropos.php.
 * Ses sections portent « zp-accueil zp-apropos » : titres, surtitres, chapôs, badges,
 * chiffres, FAQ et appel final viennent de l'accueil. Seuls les composants propres à
 * la page sont décrits ici.
 */

/* Fiche d'identité, en verre dépoli sur le bandeau. */
.zp-apropos .zp-identite.e-con,
.zp-financer .zp-identite.e-con,
.zp-portage .zp-identite.e-con,
.zp-entreprise .zp-identite.e-con,
.zp-catalogue-page .zp-identite.e-con {
	background: rgba(255, 255, 255, .06);
	border: 1px solid rgba(255, 255, 255, .14);
	border-radius: var(--zp-r);
	backdrop-filter: blur(6px);
}

.zp-identite__titre {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	font: 700 1.05rem var(--zp-titre);
	color: var(--zp-white);
	padding-bottom: 1rem;
	border-bottom: 1px solid rgba(255, 255, 255, .14);
}

/* Marque Qualiopi officielle (avec sa catégorie), sur pastille blanche. Sélecteur
   renforcé : la règle d'Elementor sur les images de l'éditeur de texte l'emporte sinon. */
.zp-apropos .zp-identite__titre img {
	flex: none;
	height: 64px;
	width: auto;
	max-width: 45%;
	object-fit: contain;
	background: var(--zp-white);
	border-radius: 8px;
	padding: 4px 6px;
}

.zp-identite__liste {
	margin: 0;
	display: grid;
}

.zp-identite__liste > div {
	display: grid;
	grid-template-columns: 9.5rem minmax(0, 1fr);
	gap: 1rem;
	padding-block: .62rem;
	border-bottom: 1px solid rgba(255, 255, 255, .08);
	font-size: .9rem;
	line-height: 1.45;
}

.zp-identite__liste > div:last-child {
	border-bottom: 0;
	padding-bottom: 0;
}

.zp-identite__liste dt {
	color: #9DB8CF;
}

.zp-identite__liste dd {
	margin: 0;
	color: var(--zp-white);
	font-weight: 500;
	font-variant-numeric: tabular-nums;
}

@media (max-width: 400px) {
	.zp-identite__liste > div {
		grid-template-columns: 1fr;
		gap: .1rem;
	}
}

/* Chapô de plusieurs paragraphes (histoire). */
.zp-apropos .zp-chapo p + p {
	margin-top: .9em;
}

/* Domaines de formation, en pastilles. */
.zp-domaines-liste {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.zp-domaines-liste li {
	font-size: .86rem;
	font-weight: 500;
	color: var(--zp-navy);
	background: var(--zp-blue-soft);
	border-radius: 100px;
	padding: .38em .95em;
}

/* Frise des dates clés. */
.zp-frise {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
	display: grid;
	gap: 2.2rem;
}

.zp-frise::before {
	content: "";
	position: absolute;
	left: 9px;
	top: 8px;
	bottom: 8px;
	width: 2px;
	background: linear-gradient(var(--zp-line), var(--zp-blue) 55%, var(--zp-amber));
}

.zp-frise li {
	position: relative;
	padding-left: 2.6rem;
	display: grid;
	gap: .3rem;
}

.zp-frise li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .35rem;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: var(--zp-white);
	border: 3px solid var(--zp-blue);
	box-sizing: border-box;
}

.zp-frise li:last-child::before {
	border-color: var(--zp-amber);
	background: var(--zp-amber);
}

.zp-frise time {
	font: 800 1.9rem/1 var(--zp-titre);
	color: var(--zp-navy);
	letter-spacing: -.03em;
}

.zp-frise strong {
	font: 700 1.1rem/1.2 var(--zp-titre);
	color: var(--zp-navy);
}

.zp-frise p {
	margin: 0;
	font-size: .95rem;
	color: var(--zp-ink-soft);
}

/* Dirigeants : bandeau marine, médaillon à cheval, corps de carte. */
.zp-apropos .zp-dirigeant.e-con {
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
	overflow: hidden;
	transition: transform .3s var(--zp-ease), box-shadow .3s;
}

.zp-apropos .zp-dirigeant.e-con:hover {
	transform: translateY(-5px);
	box-shadow: var(--zp-shadow-md);
}

.zp-apropos .zp-dirigeant__bandeau.e-con {
	position: relative;
	overflow: visible;
	background:
		radial-gradient(420px 160px at 85% 0, rgba(46, 115, 172, .35), transparent 70%),
		linear-gradient(160deg, var(--zp-navy-3), var(--zp-navy));
}

.zp-apropos .zp-dirigeant__bandeau .elementor-widget {
	position: absolute;
	left: 24px;
	bottom: -56px;
	width: auto;
	margin: 0;
}

.zp-apropos .zp-dirigeant__bandeau img,
.zp-apropos .zp-monogramme .elementor-heading-title {
	width: 116px;
	height: 116px;
	border-radius: 50%;
	border: 4px solid var(--zp-white);
	box-shadow: var(--zp-shadow-sm);
	object-fit: cover;
	display: block;
}

.zp-apropos .zp-monogramme .elementor-heading-title {
	display: grid;
	place-items: center;
	box-sizing: border-box;
	background: var(--zp-navy-2);
	font: 800 2.2rem/1 var(--zp-titre);
	letter-spacing: -.04em;
	color: var(--zp-amber);
}

.zp-apropos .zp-dirigeant h3.elementor-heading-title {
	font-size: 1.35rem;
}

.zp-apropos .zp-role .elementor-heading-title {
	display: inline-block;
	font: 600 .78rem/1.4 var(--zp-texte);
	letter-spacing: .04em;
	color: var(--zp-blue);
	background: var(--zp-blue-soft);
	border-radius: 100px;
	padding: .3em .85em;
}

.zp-apropos .zp-role--pdt .elementor-heading-title {
	color: #3A2708;
	background: var(--zp-amber-soft);
}

.zp-apropos .zp-dirigeant .elementor-widget-text-editor,
.zp-apropos .zp-dirigeant .elementor-widget-text-editor p {
	font-size: .94rem;
	line-height: 1.65;
	color: var(--zp-ink-soft);
	margin: 0;
}

.zp-apropos .zp-dirigeant .zp-ambition p {
	color: var(--zp-ink);
	border-left: 2px solid var(--zp-amber);
	padding-left: .9rem;
}

.zp-apropos .zp-dirigeant .zp-lien {
	margin-top: auto;
}

/* Collaboratrice : carte horizontale plus sobre. */
.zp-apropos .zp-collab.e-con {
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
	max-width: 860px;
}

.zp-apropos .zp-collab .zp-collab__avatar .elementor-heading-title {
	width: 84px;
	height: 84px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	background: var(--zp-green-soft);
	color: var(--zp-green);
	font: 800 2rem/1 var(--zp-titre);
}

/* 07/10/2026 : médaillon photo (Claire), même rond que l'initiale. */
.zp-apropos .zp-collab .zp-collab__avatar {
	flex-shrink: 0;
	width: auto;
}

.zp-apropos .zp-collab .zp-collab__avatar img {
	width: 84px;
	height: 84px;
	border-radius: 50%;
	object-fit: cover;
	display: block;
}

.zp-apropos .zp-collab h3.elementor-heading-title {
	font-size: 1.2rem;
}

.zp-apropos .zp-collab .zp-role .elementor-heading-title {
	color: var(--zp-green);
	background: var(--zp-green-soft);
}

.zp-apropos .zp-collab .elementor-widget-text-editor p {
	font-size: .95rem;
	color: var(--zp-ink-soft);
	margin: 0;
}

/* Formateurs : engagements et focus. */
.zp-engagements {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
}

.zp-engagements li {
	background: var(--zp-paper);
	border-radius: var(--zp-r-sm);
	padding: 1.1rem 1.2rem;
	display: grid;
	gap: .35rem;
	font-size: .88rem;
	line-height: 1.55;
	color: var(--zp-ink-soft);
}

.zp-engagements strong {
	font: 700 1rem/1.3 var(--zp-titre);
	color: var(--zp-navy);
}

@media (max-width: 560px) {
	.zp-engagements {
		grid-template-columns: 1fr;
	}
}

.zp-apropos .zp-focus.e-con {
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
	transition: transform .3s var(--zp-ease), box-shadow .3s;
}

.zp-apropos .zp-focus.e-con:hover {
	transform: translateY(-5px);
	box-shadow: var(--zp-shadow-md);
}

.zp-apropos .zp-focus__avatar .elementor-heading-title {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	background: var(--zp-navy);
	color: var(--zp-amber);
	font: 800 1.35rem/1 var(--zp-titre);
	letter-spacing: -.03em;
}

/* 07/10/2026 : médaillon photo des formateurs, même rond que les initiales. */
.zp-apropos .zp-focus .zp-focus__avatar {
	flex-shrink: 0;
	width: auto;
}

.zp-apropos .zp-focus .zp-focus__avatar img {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	object-fit: cover;
	display: block;
}

.zp-apropos .zp-focus h3.elementor-heading-title {
	font-size: 1.15rem;
}

.zp-apropos .zp-focus .zp-specialite .elementor-heading-title {
	font: 600 .85rem/1.4 var(--zp-texte);
	color: var(--zp-blue);
}

.zp-apropos .zp-focus .elementor-widget-text-editor p {
	font-size: .93rem;
	line-height: 1.6;
	color: var(--zp-ink-soft);
	margin: 0;
}

/* 07/10/2026 : biographie en plusieurs paragraphes (Tewfiq Ferahi). */
.zp-apropos .zp-focus .elementor-widget-text-editor p + p {
	margin-top: .7em;
}

/* Chiffres clés sur bandeau : filets verticaux entre les valeurs. */
.zp-apropos .zp-chiffre-bandeau.e-con {
	border-top: 1px solid rgba(255, 255, 255, .14);
}

.zp-apropos .zp-chiffre-bandeau.e-con + .zp-chiffre-bandeau.e-con {
	border-left: 1px solid rgba(255, 255, 255, .14);
}

@media (max-width: 1024px) {
	.zp-apropos .zp-chiffre-bandeau.e-con:nth-child(3) {
		border-left: 0;
	}
}

@media (max-width: 767px) {
	.zp-apropos .zp-chiffre-bandeau.e-con + .zp-chiffre-bandeau.e-con {
		border-left: 0;
	}
}

.zp-apropos .zp-source p {
	font-size: .8rem;
	color: #9DB8CF;
	margin: 0;
}

/* Financeurs : trois lignes étiquette + explication. */
.zp-financeurs {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: .8rem;
}

.zp-financeurs li {
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r-sm);
	padding: 1rem 1.2rem;
	display: grid;
	grid-template-columns: 7.6rem minmax(0, 1fr);
	gap: 1rem;
	align-items: baseline;
	font-size: .9rem;
	color: var(--zp-ink-soft);
}

.zp-financeurs strong {
	font: 800 1.05rem var(--zp-titre);
	color: var(--zp-navy);
}

@media (max-width: 400px) {
	.zp-financeurs li {
		grid-template-columns: 1fr;
		gap: .2rem;
	}
}

.zp-apropos .zp-faq-titre h3.elementor-heading-title {
	font-size: 1.3rem;
}

/* Coordonnées à côté du formulaire. */
.zp-coordonnees {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: .8rem;
	font-size: .95rem;
}

.zp-coordonnees li {
	display: grid;
	gap: .1rem;
}

.zp-coordonnees span {
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--zp-ink-soft);
}

.zp-coordonnees a,
.zp-coordonnees b {
	color: var(--zp-navy);
	font-weight: 600;
	text-decoration: none;
}

/* ===================================================== Financer sa formation */

/*
 * Page « Financer sa formation » (30 septembre 2026), générée par
 * _import/outils/page_financer.php. Sections « zp-accueil zp-financer » : titres,
 * chapôs, badges, FAQ et carte de profil (zp-identite) viennent de l'accueil et de la
 * page À propos. Seuls les composants propres à la page sont décrits ici.
 */

.zp-financer .elementor-widget-text-editor p:last-child,
.zp-portage .elementor-widget-text-editor p:last-child,
.zp-entreprise .elementor-widget-text-editor p:last-child,
.zp-catalogue-page .elementor-widget-text-editor p:last-child {
	margin-bottom: 0;
}

/* Date de mise à jour, sur le bandeau. */
/* inline-block et non inline-flex : en flex, l'espace entre « le » et la date disparaît. */
.zp-maj {
	display: inline-block;
	font-size: .82rem;
	color: #C6D7E6;
	background: rgba(255, 255, 255, .07);
	border: 1px solid rgba(255, 255, 255, .14);
	border-radius: 100px;
	padding: .35em .9em;
}

.zp-maj::before {
	content: "";
	display: inline-block;
	vertical-align: .1em;
	margin-right: .5em;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #7BC96F;
}

/* Carte « Vous êtes… » : un lien par profil. */
.zp-profils {
	display: grid;
	gap: .65rem;
	margin-top: 1rem;
}

.zp-profils a {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 1rem;
	text-decoration: none;
	color: var(--zp-white);
	background: rgba(255, 255, 255, .05);
	border: 1px solid rgba(255, 255, 255, .12);
	border-radius: var(--zp-r-sm);
	padding: .85rem 1rem;
	transition: background .25s, border-color .25s, transform .25s var(--zp-ease);
}

.zp-profils a:hover,
.zp-profils a:focus-visible {
	background: rgba(255, 255, 255, .1);
	border-color: rgba(255, 255, 255, .3);
	transform: translateX(3px);
	color: var(--zp-white);
}

.zp-profils b {
	display: block;
	font: 700 1rem/1.3 var(--zp-titre);
}

.zp-profils small {
	font-size: .82rem;
	color: #9DB8CF;
}

.zp-profils i {
	font-style: normal;
	color: var(--zp-amber);
	font-size: 1.2rem;
}

/* Tableau comparatif : défile dans son cadre sur mobile. */
.zp-tableau-zone {
	overflow-x: auto;
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
	background: var(--zp-white);
}

.zp-financer table.zp-tableau,
.zp-portage table.zp-tableau,
.zp-entreprise table.zp-tableau,
.zp-catalogue-page table.zp-tableau {
	width: 100%;
	min-width: 760px;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	font-size: .9rem;
}

.zp-financer .zp-tableau caption,
.zp-portage .zp-tableau caption,
.zp-entreprise .zp-tableau caption,
.zp-catalogue-page .zp-tableau caption {
	caption-side: bottom;
	text-align: left;
	padding: .9rem 1.2rem;
	border-top: 1px solid var(--zp-line);
	font-size: .85rem;
	color: var(--zp-ink-soft);
}

.zp-financer .zp-tableau th,
.zp-financer .zp-tableau td,
.zp-portage .zp-tableau th,
.zp-portage .zp-tableau td,
.zp-entreprise .zp-tableau th,
.zp-entreprise .zp-tableau td,
.zp-catalogue-page .zp-tableau th,
.zp-catalogue-page .zp-tableau td {
	text-align: left;
	vertical-align: top;
	padding: .95rem 1.1rem;
	border: 0;
	border-bottom: 1px solid var(--zp-line);
	background: transparent;
	line-height: 1.5;
}

.zp-financer .zp-tableau tbody > tr:nth-child(odd) > td,
.zp-financer .zp-tableau tbody > tr:nth-child(odd) > th,
.zp-financer .zp-tableau tbody tr:hover > td,
.zp-financer .zp-tableau tbody tr:hover > th,
.zp-portage .zp-tableau tbody > tr:nth-child(odd) > td,
.zp-portage .zp-tableau tbody > tr:nth-child(odd) > th,
.zp-portage .zp-tableau tbody tr:hover > td,
.zp-portage .zp-tableau tbody tr:hover > th,
.zp-entreprise .zp-tableau tbody > tr:nth-child(odd) > td,
.zp-entreprise .zp-tableau tbody > tr:nth-child(odd) > th,
.zp-entreprise .zp-tableau tbody tr:hover > td,
.zp-entreprise .zp-tableau tbody tr:hover > th,
.zp-catalogue-page .zp-tableau tbody > tr:nth-child(odd) > td,
.zp-catalogue-page .zp-tableau tbody > tr:nth-child(odd) > th,
.zp-catalogue-page .zp-tableau tbody tr:hover > td,
.zp-catalogue-page .zp-tableau tbody tr:hover > th {
	background: transparent;
}

.zp-financer .zp-tableau thead th,
.zp-portage .zp-tableau thead th,
.zp-entreprise .zp-tableau thead th,
.zp-catalogue-page .zp-tableau thead th {
	font: 600 .75rem/1.3 var(--zp-texte);
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--zp-ink-soft);
	background: var(--zp-paper);
}

.zp-financer .zp-tableau tbody th,
.zp-portage .zp-tableau tbody th,
.zp-entreprise .zp-tableau tbody th,
.zp-catalogue-page .zp-tableau tbody th {
	font: 700 1rem/1.3 var(--zp-titre);
	color: var(--zp-navy);
	white-space: nowrap;
}

.zp-financer .zp-tableau tbody th a,
.zp-portage .zp-tableau tbody th a,
.zp-entreprise .zp-tableau tbody th a,
.zp-catalogue-page .zp-tableau tbody th a {
	color: inherit;
	text-decoration: none;
	box-shadow: inset 0 -2px var(--zp-amber);
}

.zp-financer .zp-tableau tbody tr:last-child > *,
.zp-portage .zp-tableau tbody tr:last-child > *,
.zp-entreprise .zp-tableau tbody tr:last-child > *,
.zp-catalogue-page .zp-tableau tbody tr:last-child > * {
	border-bottom: 0;
}

.zp-financer .zp-tableau td,
.zp-portage .zp-tableau td,
.zp-entreprise .zp-tableau td,
.zp-catalogue-page .zp-tableau td {
	color: var(--zp-ink-soft);
}

.zp-financer .zp-tableau td strong,
.zp-portage .zp-tableau td strong,
.zp-entreprise .zp-tableau td strong,
.zp-catalogue-page .zp-tableau td strong {
	color: var(--zp-ink);
}

/* Réponse en tête de section, citable seule. */
.zp-financer .zp-reponse p,
.zp-portage .zp-reponse p,
.zp-entreprise .zp-reponse p,
.zp-catalogue-page .zp-reponse p {
	font-size: 1.08rem;
	line-height: 1.6;
	color: var(--zp-ink);
	margin: 0;
	max-width: 66ch;
}

/* Points clés : puce losange bleue. */
.zp-points {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: .7rem;
}

.zp-points li {
	position: relative;
	padding-left: 1.6rem;
	color: var(--zp-ink-soft);
	font-size: .96rem;
	line-height: 1.6;
}

.zp-points li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .55em;
	width: 8px;
	height: 8px;
	border-radius: 2px;
	background: var(--zp-blue);
	transform: rotate(45deg);
}

.zp-points strong {
	color: var(--zp-ink);
}

/* Démarches numérotées. */
.zp-etapes {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: .8rem;
	counter-reset: zp-demarche;
}

.zp-etapes li {
	counter-increment: zp-demarche;
	display: grid;
	grid-template-columns: 2rem minmax(0, 1fr);
	gap: .8rem;
	align-items: start;
	font-size: .95rem;
	line-height: 1.55;
	color: var(--zp-ink-soft);
}

.zp-etapes li::before {
	content: counter(zp-demarche);
	width: 1.8rem;
	height: 1.8rem;
	border-radius: 50%;
	display: grid;
	place-items: center;
	background: var(--zp-navy);
	color: var(--zp-white);
	font: 700 .8rem var(--zp-titre);
}

.zp-etapes strong {
	color: var(--zp-ink);
}

/* Mise en garde. */
.zp-alerte {
	border-left: 3px solid var(--zp-amber);
	background: var(--zp-amber-soft);
	border-radius: 0 var(--zp-r-sm) var(--zp-r-sm) 0;
	padding: .9rem 1.1rem;
	font-size: .93rem;
	line-height: 1.55;
	color: #5A3A08;
}

.zp-alerte strong {
	color: #3A2708;
}

/* Ligne de sources sous chaque section. */
.zp-financer .zp-src p,
.zp-src,
.zp-portage .zp-src p,
.zp-entreprise .zp-src p,
.zp-catalogue-page .zp-src p {
	font-size: .82rem;
	line-height: 1.6;
	color: var(--zp-ink-soft);
	margin: 0;
}

.zp-src a {
	color: var(--zp-blue);
	text-underline-offset: 2px;
}

/* Fiche chiffrée, collante sur grand écran. */
.zp-financer .zp-fiche.e-con,
.zp-portage .zp-fiche.e-con,
.zp-entreprise .zp-fiche.e-con,
.zp-catalogue-page .zp-fiche.e-con {
	background: var(--zp-navy);
	border-radius: var(--zp-r);
	position: sticky;
	top: 110px;
}

@media (max-width: 1024px) {
	.zp-financer .zp-fiche.e-con,
.zp-portage .zp-fiche.e-con,
.zp-entreprise .zp-fiche.e-con,
.zp-catalogue-page .zp-fiche.e-con {
		position: static;
	}
}

.zp-fiche__titre {
	font: 600 .75rem/1.3 var(--zp-texte);
	letter-spacing: .12em;
	text-transform: uppercase;
	color: #9DB8CF;
	margin-bottom: 1.1rem;
}

.zp-fiche__liste {
	margin: 0;
	display: grid;
	gap: 1rem;
}

.zp-fiche__liste > div {
	display: grid;
	gap: .15rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid rgba(255, 255, 255, .1);
}

.zp-fiche__liste > div:last-child {
	border-bottom: 0;
	padding-bottom: 0;
}

.zp-fiche__liste dt {
	font: 800 1.9rem/1 var(--zp-titre);
	letter-spacing: -.03em;
	color: var(--zp-white);
	font-variant-numeric: tabular-nums;
}

.zp-fiche__liste dt small {
	font-size: .5em;
	color: var(--zp-amber);
	letter-spacing: 0;
}

.zp-fiche__liste dd {
	margin: 0;
	font-size: .86rem;
	line-height: 1.45;
	color: #C6D7E6;
}

/* Fonds d'assurance formation des indépendants. */
.zp-faf {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
}

.zp-faf article {
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r-sm);
	padding: 1.1rem 1.2rem;
	display: grid;
	gap: .45rem;
	align-content: start;
	min-width: 0;
}

.zp-faf .zp-faf__pour {
	font-size: .8rem;
	font-weight: 600;
	color: var(--zp-blue);
}

.zp-faf h4 {
	margin: 0;
	font: 700 1.05rem/1.2 var(--zp-titre);
	color: var(--zp-navy);
}

.zp-faf .zp-faf__montant {
	font: 800 1.3rem/1.15 var(--zp-titre);
	color: var(--zp-navy);
}

.zp-faf p {
	margin: 0;
	font-size: .88rem;
	line-height: 1.5;
	color: var(--zp-ink-soft);
}

@media (max-width: 1024px) {
	.zp-faf {
		grid-template-columns: 1fr;
	}
}

/* Bandeau d'appel intermédiaire. */
.zp-financer.zp-cta-bande h2.elementor-heading-title,
.zp-portage.zp-cta-bande h2.elementor-heading-title,
.zp-entreprise.zp-cta-bande h2.elementor-heading-title,
.zp-catalogue-page.zp-cta-bande h2.elementor-heading-title {
	color: var(--zp-white);
	font-size: clamp(1.5rem, 3vw, 2.1rem);
}

.zp-financer.zp-cta-bande .zp-chapo p,
.zp-portage.zp-cta-bande .zp-chapo p,
.zp-entreprise.zp-cta-bande .zp-chapo p,
.zp-catalogue-page.zp-cta-bande .zp-chapo p {
	color: #C6D7E6;
	font-size: 1rem;
}

/* Accompagnement en quatre étapes. */
.zp-parcours {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1.2rem;
	counter-reset: zp-parcours;
}

.zp-parcours li {
	counter-increment: zp-parcours;
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
	padding: 1.4rem;
	display: grid;
	gap: .5rem;
	align-content: start;
	font-size: .9rem;
	line-height: 1.55;
	color: var(--zp-ink-soft);
}

.zp-parcours li::before {
	content: "0" counter(zp-parcours);
	font: 800 1.8rem/1 var(--zp-titre);
	color: var(--zp-amber);
	letter-spacing: -.03em;
}

.zp-parcours strong {
	font: 700 1.05rem/1.25 var(--zp-titre);
	color: var(--zp-navy);
}

@media (max-width: 1024px) {
	.zp-parcours {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.zp-parcours {
		grid-template-columns: 1fr;
	}
}

/* Liste des sources. */
/* Plus spécifique que la règle des H2 de l'accueil (.zp-accueil .elementor-widget-heading h2…). */
.zp-accueil.zp-financer .zp-sources-titre h2.elementor-heading-title,
.zp-accueil.zp-portage .zp-sources-titre h2.elementor-heading-title,
.zp-accueil.zp-entreprise .zp-sources-titre h2.elementor-heading-title,
.zp-accueil.zp-catalogue-page .zp-sources-titre h2.elementor-heading-title {
	font-size: clamp(1.3rem, 2.4vw, 1.7rem);
}

.zp-sources {
	columns: 2 320px;
	column-gap: 3rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.zp-sources li {
	break-inside: avoid;
	padding: .45rem 0;
	border-bottom: 1px solid var(--zp-line);
	font-size: .86rem;
	color: var(--zp-ink-soft);
}

.zp-sources a {
	color: var(--zp-navy);
	font-weight: 600;
	text-decoration: none;
}

.zp-sources a:hover {
	text-decoration: underline;
}

/* ========================================================== Portage Qualiopi */

/*
 * Page « Portage Qualiopi » (1er octobre 2026), générée par
 * _import/outils/page_portage.php. Sections « zp-accueil zp-portage » : elle partage
 * les composants de la page Financer (fiche chiffrée, réponse, sources, bandeau
 * d'appel, parcours). Seuls les composants propres à la page sont décrits ici.
 */

/* Schéma des trois acteurs (SVG dans un widget HTML). */
.zp-schema {
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
	padding: 1.4rem;
	margin: 0;
}

.zp-schema svg {
	display: block;
	width: 100%;
	height: auto;
	max-width: 100%;
}

/* Sur petit écran, le schéma garde une taille lisible et défile dans son cadre. */
@media (max-width: 600px) {
	.zp-schema {
		overflow-x: auto;
	}

	.zp-schema svg {
		min-width: 480px;
	}
}

.zp-schema figcaption {
	font-size: .82rem;
	color: var(--zp-ink-soft);
	margin-top: .8rem;
}

.zp-schema .sch-boite { fill: var(--zp-paper); stroke: var(--zp-line); stroke-width: 1.5; }
.zp-schema .sch-boite--zp { fill: var(--zp-navy); stroke: var(--zp-navy); }
.zp-schema .sch-titre { font: 700 15px var(--zp-titre); fill: var(--zp-navy); }
.zp-schema .sch-titre--inv { fill: #FFFFFF; }
.zp-schema .sch-sous { font: 500 11.5px var(--zp-texte); fill: var(--zp-ink-soft); }
.zp-schema .sch-sous--inv { fill: #BCD2E5; }
.zp-schema .sch-fleche { stroke: var(--zp-blue); stroke-width: 2; fill: none; }
.zp-schema .sch-fleche--or { stroke: var(--zp-amber); }
.zp-schema .sch-lien { font: 600 11px var(--zp-texte); fill: var(--zp-blue); }
.zp-schema .sch-lien--or { fill: #9A6414; }

/* « À ne pas confondre avec le portage salarial ». */
.zp-distinct {
	border: 1px solid var(--zp-line);
	border-left: 4px solid var(--zp-blue);
	background: var(--zp-blue-soft);
	border-radius: 0 var(--zp-r-sm) var(--zp-r-sm) 0;
	padding: 1rem 1.2rem;
	display: grid;
	gap: .4rem;
}

.zp-distinct strong {
	font: 700 1rem var(--zp-titre);
	color: var(--zp-navy);
}

.zp-distinct p {
	margin: 0;
	font-size: .92rem;
	line-height: 1.55;
	color: var(--zp-ink-soft);
}

/* Cartes de profils et d'avantages. */
.zp-cartes {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.1rem;
}

.zp-cartes--4 {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.zp-cartes article {
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
	padding: 1.4rem;
	display: grid;
	gap: .55rem;
	align-content: start;
	min-width: 0;
	transition: transform .3s var(--zp-ease), box-shadow .3s;
}

.zp-cartes article:hover {
	transform: translateY(-4px);
	box-shadow: var(--zp-shadow-md);
}

.zp-cartes .zp-ico {
	width: 42px;
	height: 42px;
	border-radius: 12px;
	background: var(--zp-amber-soft);
	color: #9A6414;
	display: grid;
	place-items: center;
	font: 800 1.1rem var(--zp-titre);
}

.zp-cartes h3 {
	margin: 0;
	font: 700 1.1rem/1.2 var(--zp-titre);
	color: var(--zp-navy);
}

.zp-cartes p {
	margin: 0;
	font-size: .9rem;
	line-height: 1.55;
	color: var(--zp-ink-soft);
}

@media (max-width: 1024px) {
	.zp-cartes,
	.zp-cartes--4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 600px) {
	.zp-cartes,
	.zp-cartes--4 {
		grid-template-columns: 1fr;
	}
}

/* Qui fait quoi : deux colonnes comparées. */
.zp-roles {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.2rem;
}

.zp-role {
	border-radius: var(--zp-r);
	padding: 1.5rem;
	display: grid;
	gap: 1rem;
	align-content: start;
	min-width: 0;
}

.zp-role--zp {
	background: var(--zp-navy);
}

.zp-role--fo {
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
}

.zp-role h3 {
	margin: 0;
	font: 700 1.25rem var(--zp-titre);
	color: var(--zp-navy);
}

.zp-role--zp h3 {
	color: var(--zp-white);
}

.zp-role ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: .7rem;
}

.zp-role li {
	display: grid;
	grid-template-columns: 1.4rem minmax(0, 1fr);
	gap: .6rem;
	font-size: .94rem;
	line-height: 1.5;
	color: var(--zp-ink-soft);
}

.zp-role li::before {
	content: "✓";
	font-weight: 700;
	color: var(--zp-blue);
}

.zp-role--zp li {
	color: #DCE7F1;
}

.zp-role--zp li::before {
	color: var(--zp-amber);
}

.zp-role strong {
	color: var(--zp-ink);
	font-weight: 600;
}

.zp-role--zp strong {
	color: var(--zp-white);
}

@media (max-width: 800px) {
	.zp-roles {
		grid-template-columns: 1fr;
	}
}

/* Obligations Qualiopi, datées. */
.zp-obligations {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
}

.zp-obligations li {
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r-sm);
	padding: 1.1rem 1.2rem;
	display: grid;
	gap: .35rem;
	align-content: start;
	min-width: 0;
	font-size: .9rem;
	line-height: 1.55;
	color: var(--zp-ink-soft);
}

.zp-obligations .zp-date {
	font: 600 .75rem var(--zp-texte);
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--zp-blue);
}

.zp-obligations strong {
	font: 700 1.02rem/1.3 var(--zp-titre);
	color: var(--zp-navy);
}

@media (max-width: 800px) {
	.zp-obligations {
		grid-template-columns: 1fr;
	}
}

/* ================================================================== Contact */

/*
 * Page « Contact » (1er octobre 2026), générée par _import/outils/page_contact.php.
 * Sections « zp-accueil zp-contact » ; cartes (zp-cartes) et parcours (zp-parcours)
 * viennent des pages Portage et Financer.
 */

.zp-contact .elementor-widget-text-editor p:last-child {
	margin-bottom: 0;
}

/* Bouton contour, pour les fonds clairs. */
.elementor-widget.zp-btn--contour .elementor-button,
a.zp-btn--contour {
	background: transparent;
	color: var(--zp-navy);
	border: 1px solid var(--zp-navy);
}

.elementor-widget.zp-btn--contour .elementor-button:hover,
.elementor-widget.zp-btn--contour .elementor-button:focus-visible,
a.zp-btn--contour:hover {
	background: var(--zp-navy);
	color: var(--zp-white);
}

/* Formulaire dans une carte blanche, sur le bandeau. */
.zp-contact .zp-contact-form.e-con {
	background: var(--zp-white);
	border-radius: var(--zp-r);
	box-shadow: 0 20px 60px rgba(0, 0, 0, .25);
}

/* Le formulaire est posé sur le bandeau marine : sans cela, il hérite de ses couleurs
   claires (titre et introduction blancs sur la carte blanche). */
.zp-contact .zp-contact-form.e-con {
	color: var(--zp-ink);
}

.zp-contact .zp-contact-form .zpc-title {
	color: var(--zp-navy);
}

.zp-contact .zp-contact-form .zpc-intro,
.zp-contact .zp-contact-form .zpc-progress-text {
	color: var(--zp-ink-soft);
}

/* Canaux directs, sur le bandeau. */
.zp-canaux {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: .7rem;
}

.zp-canaux li {
	display: grid;
	grid-template-columns: 2.4rem minmax(0, 1fr);
	gap: .8rem;
	align-items: center;
	background: rgba(255, 255, 255, .05);
	border: 1px solid rgba(255, 255, 255, .12);
	border-radius: var(--zp-r-sm);
	padding: .75rem .9rem;
}

.zp-canaux .zp-pic {
	width: 2.4rem;
	height: 2.4rem;
	border-radius: 50%;
	display: grid;
	place-items: center;
	background: rgba(224, 152, 46, .16);
	color: var(--zp-amber);
	font: 800 1rem var(--zp-titre);
}

.zp-canaux b {
	display: block;
	color: var(--zp-white);
	font: 700 1rem/1.25 var(--zp-titre);
}

.zp-canaux b a {
	color: var(--zp-white);
	text-decoration: none;
}

.zp-canaux small {
	font-size: .86rem;
	color: #C6D7E6;
}

.zp-canaux small a {
	color: var(--zp-white);
	text-underline-offset: 3px;
}

/* Lien en pied de carte (orientation). */
.zp-cartes .zp-suite {
	font-weight: 600;
	font-size: .9rem;
	color: var(--zp-blue);
	text-underline-offset: 3px;
	margin-top: .2rem;
}

/* Coordonnées : trois blocs. */
.zp-infos {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.2rem;
}

.zp-infos > div {
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
	padding: 1.4rem;
	display: grid;
	gap: .7rem;
	align-content: start;
	min-width: 0;
}

.zp-infos h3 {
	margin: 0;
	font: 700 1.1rem var(--zp-titre);
	color: var(--zp-navy);
}

.zp-infos p,
.zp-infos li {
	margin: 0;
	font-size: .92rem;
	line-height: 1.55;
	color: var(--zp-ink-soft);
}

.zp-infos ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: .4rem;
}

.zp-infos li b {
	color: var(--zp-ink);
	font-weight: 600;
}

.zp-infos .zp-petit {
	font-size: .82rem;
}

.zp-reseaux {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
}

.zp-reseaux a {
	font-size: .86rem;
	font-weight: 600;
	color: var(--zp-navy);
	background: var(--zp-blue-soft);
	border-radius: 100px;
	padding: .4em .95em;
	text-decoration: none;
}

.zp-reseaux a:hover,
.zp-reseaux a:focus-visible {
	background: var(--zp-navy);
	color: var(--zp-white);
}

@media (max-width: 1024px) {
	.zp-infos {
		grid-template-columns: 1fr;
	}
}

/* Parcours en trois étapes. */
.zp-parcours.zp-parcours--3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 800px) {
	.zp-parcours.zp-parcours--3 {
		grid-template-columns: 1fr;
	}
}

/* ===================================================== Formation en entreprise */

/*
 * Page « Formation en entreprise » (1er octobre 2026), générée par
 * _import/outils/page_entreprise.php. Sections « zp-accueil zp-entreprise » : elle
 * partage les composants des pages Financer et Portage.
 */

/* Domaines de formation, liés aux catégories du catalogue. */
.zp-domaines {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1rem;
}

.zp-domaines a {
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
	padding: 1.2rem 1.3rem;
	display: grid;
	gap: .45rem;
	align-content: start;
	text-decoration: none;
	min-width: 0;
	transition: transform .3s var(--zp-ease), box-shadow .3s, border-color .3s;
}

.zp-domaines a:hover,
.zp-domaines a:focus-visible {
	transform: translateY(-4px);
	box-shadow: var(--zp-shadow-md);
	border-color: var(--zp-blue);
}

.zp-domaines strong {
	font: 700 1.05rem/1.25 var(--zp-titre);
	color: var(--zp-navy);
}

.zp-domaines span {
	font-size: .86rem;
	line-height: 1.5;
	color: var(--zp-ink-soft);
}

.zp-domaines em {
	font-style: normal;
	font-size: .85rem;
	font-weight: 600;
	color: var(--zp-blue);
}

.zp-domaines a.zp-domaine--sur-mesure {
	background: var(--zp-navy);
	border-color: var(--zp-navy);
}

.zp-domaines a.zp-domaine--sur-mesure strong {
	color: var(--zp-white);
}

.zp-domaines a.zp-domaine--sur-mesure span {
	color: #C6D7E6;
}

.zp-domaines a.zp-domaine--sur-mesure em {
	color: var(--zp-amber);
}

@media (max-width: 1024px) {
	.zp-domaines {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.zp-domaines {
		grid-template-columns: 1fr;
	}
}

/* Preuves chiffrées, sur fond clair. */
.zp-preuves {
	display: grid;
	/* 1.31 (21/10/2026) : autant de colonnes que de chiffres (deux depuis le retrait du 74 % TOSA). */
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 1rem;
}

.zp-preuves > div {
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
	padding: 1.3rem 1.4rem;
	display: grid;
	gap: .3rem;
}

.zp-preuves strong {
	font: 800 2.2rem/1 var(--zp-titre);
	letter-spacing: -.03em;
	color: var(--zp-navy);
	font-variant-numeric: tabular-nums;
}

.zp-preuves span {
	font-size: .9rem;
	color: var(--zp-ink-soft);
}

@media (max-width: 800px) {
	.zp-preuves {
		grid-template-columns: 1fr;
	}
}

/* Méthode en cinq étapes. */
.zp-parcours.zp-parcours--5 {
	grid-template-columns: repeat(5, minmax(0, 1fr));
}

@media (max-width: 1100px) {
	.zp-parcours.zp-parcours--5 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 700px) {
	.zp-parcours.zp-parcours--5 {
		grid-template-columns: 1fr;
	}
}

/* Témoignages clients (section affichée seulement si des références existent). */
.zp-temoignages {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
}

.zp-temoignages figure {
	margin: 0;
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
	padding: 1.3rem;
	display: grid;
	gap: .7rem;
}

.zp-temoignages blockquote {
	margin: 0;
	font-size: .95rem;
	line-height: 1.6;
	color: var(--zp-ink-soft);
}

.zp-temoignages figcaption {
	font-size: .88rem;
	font-weight: 600;
	color: var(--zp-navy);
}

@media (max-width: 900px) {
	.zp-temoignages {
		grid-template-columns: 1fr;
	}
}

/* ================================================== Catalogue des formations */

/*
 * Page « Catalogue des formations » (/formations/), refondue le 1er octobre 2026,
 * générée par _import/outils/page_catalogue.php. Sections « zp-accueil
 * zp-catalogue-page » ; le widget zp-catalogue garde ses styles propres, habillés ici.
 */

/* Barre de recherche et de filtres : carte blanche sur le fond papier. */
.zp-catalogue-page .zp-catalogue__barre {
	background: var(--zp-white);
	box-shadow: var(--zp-shadow-sm);
}

.zp-catalogue-page .zp-recherche__champ {
	background: var(--zp-paper) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%234A5B6A' stroke-width='2'%3E%3Ccircle cx='8' cy='8' r='6'/%3E%3Cpath d='m13 13 4 4'/%3E%3C/svg%3E") no-repeat 1.1rem center;
	padding-left: 2.8rem;
}

.zp-catalogue-page .zp-catalogue .zp-filtres .zp-filtre[data-zp-terme$="eligible-cpf"] {
	border-color: #BFD9B9;
	color: var(--zp-green);
}

.zp-catalogue-page .zp-catalogue .zp-filtres .zp-filtre[data-zp-terme$="eligible-cpf"][aria-pressed="true"] {
	background: var(--zp-green);
	border-color: var(--zp-green);
	color: var(--zp-white);
}

.zp-catalogue-page .zp-catalogue__compte {
	font-weight: 600;
	color: var(--zp-navy);
}

/* Pastilles des cartes : « À la une » et CPF. */
.zp-tag.zp-tag--une {
	background: var(--zp-amber-soft);
	border-color: #F1D7A8;
	color: #9A6414;
	font-weight: 600;
}

.zp-tag.zp-tag--cpf {
	background: var(--zp-green-soft);
	border-color: #BFD9B9;
	color: var(--zp-green);
	font-weight: 600;
}

/* Chiffres du catalogue, sur le bandeau. */
.zp-chiffres-hero {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1px;
	margin-top: 1rem;
	background: rgba(255, 255, 255, .12);
	border-radius: var(--zp-r-sm);
	overflow: hidden;
}

.zp-chiffres-hero > div {
	background: #16395A;
	padding: 1.1rem 1.2rem;
	display: grid;
	gap: .25rem;
}

.zp-chiffres-hero strong {
	font: 800 2.2rem/1 var(--zp-titre);
	letter-spacing: -.03em;
	color: var(--zp-white);
	font-variant-numeric: tabular-nums;
}

.zp-chiffres-hero span {
	font-size: .85rem;
	color: #C6D7E6;
}

.zp-chiffres-hero + p {
	margin: .8rem 0 0;
	font-size: .78rem;
	color: #9DB8CF;
}

/* Domaines : titre, texte et lien filtré. */
.zp-domaines-texte {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.2rem 2.4rem;
}

.zp-domaines-texte article {
	display: grid;
	gap: .4rem;
	padding-bottom: 1.1rem;
	border-bottom: 1px solid var(--zp-line);
}

.zp-domaines-texte h3 {
	margin: 0;
	font: 700 1.15rem/1.25 var(--zp-titre);
	color: var(--zp-navy);
}

.zp-domaines-texte p {
	margin: 0;
	font-size: .93rem;
	line-height: 1.6;
	color: var(--zp-ink-soft);
}

.zp-domaines-texte a {
	font-size: .88rem;
	font-weight: 600;
	color: var(--zp-blue);
	text-underline-offset: 3px;
}

@media (max-width: 800px) {
	.zp-domaines-texte {
		grid-template-columns: 1fr;
	}
}

/* Deux cartes : entreprises et formateurs. */
.zp-catalogue-page .zp-duo-nuit.e-con {
	background: var(--zp-navy);
	border-radius: var(--zp-r);
}

.zp-catalogue-page .zp-duo-clair.e-con {
	background: var(--zp-white);
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
}

.zp-catalogue-page .zp-duo-nuit h3.elementor-heading-title {
	color: var(--zp-white);
}

.zp-catalogue-page .zp-duo-nuit .elementor-widget-text-editor p {
	color: #C6D7E6;
}

.zp-catalogue-page .zp-duo-clair .elementor-widget-text-editor p {
	color: var(--zp-ink-soft);
}

.zp-catalogue-page .zp-duo-nuit h3.elementor-heading-title,
.zp-catalogue-page .zp-duo-clair h3.elementor-heading-title {
	font-size: 1.35rem;
}

/* ======================================== Mentions légales et confidentialité */

/*
 * Page 2 (/mentions-legales/), refondue le 1er octobre 2026 par
 * _import/outils/page_mentions.php : sommaire collant + colonne de texte lisible.
 */

.zp-legal .elementor-widget-text-editor p:last-child {
	margin-bottom: 0;
}

.zp-legal .zp-sommaire.e-con {
	position: sticky;
	top: 110px;
	background: var(--zp-paper);
	border-radius: var(--zp-r);
}

.zp-sommaire-liste {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: .15rem;
	counter-reset: zp-sommaire;
}

.zp-sommaire-liste li {
	counter-increment: zp-sommaire;
}

.zp-sommaire-liste a {
	display: grid;
	grid-template-columns: 1.6rem minmax(0, 1fr);
	gap: .4rem;
	padding: .45rem .5rem;
	border-radius: var(--zp-r-sm);
	font-size: .9rem;
	line-height: 1.35;
	color: var(--zp-navy);
	text-decoration: none;
}

.zp-sommaire-liste a::before {
	content: counter(zp-sommaire) ".";
	font-weight: 700;
	color: var(--zp-amber);
}

.zp-sommaire-liste a:hover,
.zp-sommaire-liste a:focus-visible {
	background: var(--zp-white);
}

@media (max-width: 1024px) {
	.zp-legal .zp-sommaire.e-con {
		position: static;
	}
}

.zp-legal [id] {
	scroll-margin-top: 100px;
}

.zp-legal .zp-legal-bloc h2.elementor-heading-title {
	font-size: clamp(1.4rem, 2.6vw, 1.8rem);
	letter-spacing: -.02em;
}

.zp-legal-texte {
	font-size: .98rem;
	line-height: 1.7;
	color: var(--zp-ink-soft);
	max-width: 70ch;
}

.zp-legal-texte h3 {
	margin: 1.4rem 0 .5rem;
	font: 700 1.1rem/1.3 var(--zp-titre);
	color: var(--zp-navy);
}

.zp-legal-texte p {
	margin: 0 0 .9rem;
}

.zp-legal-texte ul {
	margin: 0 0 1rem;
	padding-left: 1.2rem;
	display: grid;
	gap: .35rem;
}

.zp-legal-texte strong {
	color: var(--zp-ink);
}

.zp-legal-texte a {
	color: var(--zp-blue);
	text-underline-offset: 2px;
}

.zp-legal-id {
	margin: 0;
	display: grid;
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
	overflow: hidden;
}

.zp-legal-id > div {
	display: grid;
	grid-template-columns: 13rem minmax(0, 1fr);
	gap: 1rem;
	padding: .75rem 1.1rem;
	border-bottom: 1px solid var(--zp-line);
	font-size: .93rem;
	line-height: 1.5;
}

.zp-legal-id > div:nth-child(odd) {
	background: var(--zp-paper);
}

.zp-legal-id > div:last-child {
	border-bottom: 0;
}

.zp-legal-id dt {
	font-weight: 600;
	color: var(--zp-navy);
}

.zp-legal-id dd {
	margin: 0;
	color: var(--zp-ink-soft);
}

@media (max-width: 600px) {
	.zp-legal-id > div {
		grid-template-columns: 1fr;
		gap: .15rem;
	}
}

.zp-legal-tableau {
	overflow-x: auto;
	margin: 0 0 1rem;
	border: 1px solid var(--zp-line);
	border-radius: var(--zp-r);
}

.zp-legal .zp-legal-tableau table {
	width: 100%;
	min-width: 620px;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	font-size: .88rem;
}

.zp-legal .zp-legal-tableau th,
.zp-legal .zp-legal-tableau td {
	text-align: left;
	vertical-align: top;
	padding: .75rem .9rem;
	border: 0;
	border-bottom: 1px solid var(--zp-line);
	background: transparent;
	line-height: 1.5;
}

.zp-legal .zp-legal-tableau thead th {
	background: var(--zp-paper);
	color: var(--zp-navy);
	font-weight: 600;
}

.zp-legal .zp-legal-tableau tbody > tr:nth-child(odd) > td,
.zp-legal .zp-legal-tableau tbody tr:hover > td {
	background: transparent;
}

.zp-legal .zp-legal-tableau tbody tr:last-child > td {
	border-bottom: 0;
}

/* Formulaires des fiches (01/10/2026) : légende, notes et mention d'information RGPD. */
.zp-cf7__legende,
.zp-cf7__note,
.zp-cf7__rgpd {
	margin: 0 0 1rem;
	font-size: .82rem;
	line-height: 1.55;
	color: var(--zp-ink-soft);
}

.zp-cf7__note {
	background: var(--zp-blue-soft);
	border-radius: var(--zp-r-sm);
	padding: .65rem .85rem;
	color: var(--zp-navy);
}

.zp-cf7__rgpd {
	margin: 1rem 0 0;
	font-size: .76rem;
}

.zp-cf7__note a,
.zp-cf7__rgpd a {
	color: var(--zp-blue);
	text-underline-offset: 2px;
}

/*
 * Page introuvable (gabarit 404 Theme Builder, 1er octobre 2026), générée par
 * _import/outils/gabarit_404.php. Sections « zp-accueil zp-404 » : cartes d'orientation
 * (zp-domaines) et formations à la une (zp-phares) partagées avec les autres pages.
 */
.zp-404-recherche {
	display: flex;
	gap: .6rem;
	max-width: 620px;
	margin: 0;
}

/* « input.… » : le reset du thème (input[type=search]) l'emporterait sinon. */
.zp-404-recherche input.zp-recherche__champ {
	flex: 1;
	min-width: 0;
	border: 1.5px solid transparent;
	border-radius: 100px;
	padding: .8em 1.2em;
}

.zp-404-recherche button.zp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: var(--zp-texte);
	font-weight: 600;
	font-size: .95rem;
	padding: .72em 1.4em;
	border-radius: 100px;
	border: 0;
	cursor: pointer;
	white-space: nowrap;
	background: var(--zp-amber);
	color: #3A2708;
	box-shadow: 0 4px 14px rgba(224, 152, 46, .35);
	transition: transform .25s var(--zp-ease), box-shadow .25s;
}

.zp-404-recherche button.zp-btn:hover,
.zp-404-recherche button.zp-btn:focus-visible {
	transform: translateY(-2px);
	box-shadow: 0 8px 22px rgba(224, 152, 46, .45);
}

.zp-404 .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

@media (max-width: 560px) {
	.zp-404-recherche {
		flex-direction: column;
	}
}