/* valeurs par défaut modifiables dans les sections suivantes */

/* svp, ne touchez jamais aux valeurs par défaut, merci       */


section.s-overflow /*	div spéciale pour scroller en x ou y */
{
overflow-x: auto;
overflow-y: auto;
}
div.float-left 
{
float: left;
padding: 1rem;
width: 49%;
box-sizing: border-box;
}					
div.float-right
{
float: right;
padding: 1rem;
width: 49%;
box-sizing: border-box;
}
div.float-left img
, div.float-right img
{
width: 100%;
height: auto;
}
div.float-stop
{
clear: both;
}
div.float-fin::after
{
content: '';
clear: both;
}
div.grille-defaut
{
display: flex;
flex-wrap: wrap;
justify-content: center;
}
div.grille-defaut figure
{
margin: 0.5rem;	/*	margin des colonnes, donne donc 1rem MINIMUM (0.5rem + 0.5rem) entre 2 colonnes*/
text-align: center;	/* pour centrer l'image et le texte dans la colonne */
width: 140px;	/* 	la largeur minimum est de 100px mais cela dépend de l'icone ou de l'image,
					du texte à afficher, un titre simple en petit font size, va entrer dans 100px
					on fonctionne en px fixe ici, PAS DE POURCENTAGE*/
/*width: 270px;	/*	la largeur MAXIMUM pour les cellulaires est de 320px en comptant les marges
					ce qui donne donc un grand maximum de 270px par colonne (1rem = +/- 10px)
					car il faut compter les marges des conteneurs de la grille fixée au minimum à 1rem
					il est désagréable de refaire tout le style quand il ne répond pas aux limites...*/
}
div.grille-defaut img	/* 	il n'est d'usage d'utiliser une image plus grande que 270px dans le flex pour
					avoir un responsive convenable, il faut utiliser un autre modèle si nous avons
					des images plus larges que 270px, on fonctionne en px fixe ici, PAS DE POURCENTAGE*/
{

}
div.grille-defaut figcaption	/* 	figcaption hérite de son parent figure. En remettant ici le texte à gauche
						il n'y aura que l'image centrée dans la colonne
						on fonctionne en px fixe ici, PAS DE POURCENTAGE*/
{
text-align: left;
}

table.table-defaut
{
border: 1px solid black;
width: 100%;	
}
table.table-defaut th /* header, titre */
{
border-bottom: 1px solid grey;
text-align: left;
vertical-align: middle;
padding: 8px 15px;
}
table.table-defaut td /* data, cellule */
{
border-bottom: 1px solid grey;
padding: 8px 15px;
}
table.table-defaut td img	/* image dans le cellule */
{
width: 100%;
max-width: 270px;
max-height: 200px;
}
/**************************************************************************************************/

/* Dans cette section, vous avez un canevas css de base, prendre une copie et coller à la fin dans l'ordre des pages et des positions */

/* Toutes les sections de la home de m01 à m99, chaque page du menu a une centaine, le premier est m101, le deuxième est m201 etc...       */

/* nom de la page et ou de la position en tête du css */
/******************************************************/
section.m00
{
padding: 1rem;
}
section.m00 header
{

}
section.m00 header h1
{

}
section.m00 header hr
{
width:50%;
margin: 0 auto;
color: pink;
}
/******************************************************/
div.float00
{
/*border: 2px solid pink;		*/
/*background-color: pink;		*/
}
div.float00 div.float-left 
{
/*padding: 1rem;	*/
/*width: 49%;		*/
}					
div.float00 div.float-right
{
/*padding: 1rem;	*/
/*width: 49%;		*/
}

div.float00 div.float-left img
, div.float00 div.float-right img
{
/*max-width: 100%;		*/
/*max-height: 100%;		*/
}
/******************************************************/
div.grille00
{

}
div.grille00 figure
{
/*margin: 0.5rem;		*/
/*text-align: center;	*/ 
/*width: 140px;			*/ 
}
div.grille00 img
{

}
div.grille00 figcaption	
{
/*text-align: left;		*/
}
/******************************************************/
table.table00
{
/*border: 1px solid black;		*/
/*border-collapse: collapse;	*/
/*border-collapse: separate;	*/
/*border-spacing: 10px 50px;	*/
/*empty-cells: hide;			*/
/*table-layout: fixed;			*/
/*width: 100%;					*/
}
table.table00 tr /*	row, ligne 	*/
{

}
table.table00 tr:nth-child(even) /* OU odd */
{
/*background-color: yellow		*/
}
table.table00 tr:hover
{
/*background-color: green;		*/
}
table.table00 tr.ligne00 /*	si nous avons une ligne particulière que nous désirons styliser */
{
	
}
table.table00 th /* header, titre 	*/
{
/*border-bottom: 1px solid grey;	*/
/*border: 1px solid black;			*/
/*height: 50px;						*/
/*text-align: left;					*/
/*vertical-align: middle;			*/
/*padding: 8px 15px;				*/
/*background-color: blue;			*/
/*color: white;						*/
}
table.table00 td /* data, cellule */
{
/*border-bottom: 1px solid grey;	*/
/*border: 1px solid black;			*/
/*height: 30px;						*/
/*text-align: center;				*/
/*vertical-align: bottom;			*/
/*padding: 8px 15px;				*/
}
table.table00 td img	/* image dans le cellule, on ne dépasse pas 270px pour le responsive */
{
/*width: 100%;				*/
/*max-width: 270px;			*/
/*max-height: 200px;		*/
}
table.table00 td.cell00 /*	si nous avons une cellule particulière que nous désirons styliser */
{
/*padding: 0;				*/
/*width: 270px;				*/
/*max-width: 270px;			*/
}
/******************************************************/

/***********************************  mentions légales - politique de confidentialité - Conditions générales de vente *****************************/
div.legal
{
padding: 1rem;	/*	padding par défaut */
}

/*	la div h00 sert au titre si on a besoin de plusieurs balises dans la partie titre, sinon la h seule*/

div.legal h1
{
font-size: ;
line-height: ;/*	<= font-size + padding */
}
div.legal h2
{

}
div.legal hr
{
width:50%;
margin: 0 auto;
color: pink;
}
/************************************************************************************************************
			V o t r e		c o d e		v a		à	p a r t i r		d ' i c i			
Prenez une copie du modèle00 m00 float00 grille00 table00 etc... et copiez le code ici à la fin
Incrémentez le modèle m01 float01 etc... aux noms de balises de votre copie et codez
/****************************************************************************************************************/
section.m00
{
padding: 1rem;
}


/* ==============================================================
   JE SIMPLIFIE — feuille de style de la page d'accueil
   --------------------------------------------------------------
   Palette d'origine du site (jesimplifie.fr).
   Emplacement : custom.css / user.css du template Magiris,
                 ou champ « Custom CSS » des options du template.
   Portée      : tout est cantonné sous .sp-page-builder, donc
                 aucun effet sur le reste du site.
   Remplace    : toutes les versions précédentes. Ne pas cumuler.
   ============================================================== */

@import url('https://fonts.googleapis.com/css2?family=Archivo:wdth,wght@62..125,400..900&family=Courier+Prime:wght@400;700&family=Instrument+Sans:wght@400;500;600&display=swap');

/* ==============================================================
   1. JETONS — palette d'origine
   ============================================================== */
:root{
  /* bleus */
  --je-titre:#141A43;          /* titres et textes de mise en avant */
  --je-primary:#283382;        /* cadres, coches, liens           */
  --je-primary-dark:#141A43;   /* fond de la section finale       */
  --je-primary-light:#3A47A0;  /* survols, états secondaires      */
  /* chauds */
  --je-accent:#E9501E;         /* mots en valeur, filets, tampon  */
  --je-orange:#F0871E;         /* survol des boutons, emphase     */
  /* signal */
  --je-success:#2D6A4F;        /* tampon « Maintenue »            */
  /* textes */
  --je-texte:#1A1A2E;
  --je-texte-2:#4A4A5E;
  --je-texte-3:#7A7A8E;
  /* fonds */
  --je-papier:#FEFCF8;
  --je-bande:#F5F6FA;          /* teinte primary à 3 %            */
  --je-carte:#FFFFFF;
  /* typographie */
  --je-display:"Archivo",system-ui,sans-serif;
  --je-body:"Instrument Sans",system-ui,sans-serif;
  --je-mono:"Courier Prime",ui-monospace,monospace;
  /* traits */
  --je-trait:1px solid rgba(40,51,130,.22);
  --je-cadre:1.5px solid #283382;
  --je-filet:1px solid rgba(40,51,130,.14);
}

/* ==============================================================
   2. BASES
   ============================================================== */
.sp-page-builder .sppb-section,
.sp-page-builder .sppb-addon-text-block,
.sp-page-builder .sppb-addon-text-block p,
.sp-page-builder .sppb-addon-text-block li{
  font-family:var(--je-body);
  color:var(--je-texte);
}
/*.sp-page-builder .sppb-addon-text-block p{ line-height:1.6; }*/
.sp-page-builder .sppb-addon-text-block a{ color:var(--je-primary); }
.sp-page-builder .sppb-addon-text-block a:hover{ color:var(--je-accent); }

/* fonds pilotés en CSS : la section 9 est sombre, les sections 3 à 7
   forment la bande claire du bloc « le droit » */
.sp-page-builder .sppb-section:nth-of-type(1),
.sp-page-builder .sppb-section:nth-of-type(2),
.sp-page-builder .sppb-section:nth-of-type(8),
.sp-page-builder .sppb-section:nth-of-type(10){
  background-color:var(--je-papier) !important;
}
.sp-page-builder .sppb-section:nth-of-type(3),
.sp-page-builder .sppb-section:nth-of-type(4),
.sp-page-builder .sppb-section:nth-of-type(5),
.sp-page-builder .sppb-section:nth-of-type(6),
.sp-page-builder .sppb-section:nth-of-type(7){
  background-color:var(--je-bande) !important;
}
.sp-page-builder .sppb-section:nth-of-type(9){
  background-color:var(--je-primary-dark) !important;
}

/* ==============================================================
   3. TITRES
   Magiris applique un dégradé sur texte (background-clip:text +
   -webkit-text-fill-color:transparent), qui rend les titres
   invisibles. On neutralise, puis on recolore.
   ============================================================== */
.sp-page-builder h1,
.sp-page-builder h2,
.sp-page-builder h3,
.sp-page-builder h4,
.sp-page-builder h5,
.sp-page-builder h6,
.sp-page-builder .sppb-addon-title{
  font-family:var(--je-display) !important;
  font-variation-settings:"wdth" 112;
  font-weight:800;
  letter-spacing:-.02em;
  line-height:1.02;
  background:none !important;
  background-image:none !important;
  -webkit-background-clip:border-box !important;
  background-clip:border-box !important;
  -webkit-text-fill-color:currentColor !important;
  text-shadow:none !important;
  color:var(--je-titre) !important;
}
.sp-page-builder .sppb-addon-text-block strong{
  -webkit-text-fill-color:currentColor !important;
  background:none !important;
}

/* ==============================================================
   4. SÉPARATEURS DE SECTIONS
   Le bloc « le droit » occupe cinq sections (3 à 7) pour obtenir
   la grille de cinq critères : il ne doit porter qu'un seul trait,
   à la fin. Si vous réorganisez les sections, ajustez les rangs.
   ============================================================== */
.sp-page-builder .sppb-section{ border-bottom:0; }
.sp-page-builder .sppb-section:nth-of-type(1),   /* héro                  */
.sp-page-builder .sppb-section:nth-of-type(2),   /* le blocage            */
.sp-page-builder .sppb-section:nth-of-type(7),   /* fin du bloc « droit » */
.sp-page-builder .sppb-section:nth-of-type(8),   /* les médias en parlent */
.sp-page-builder .sppb-section:nth-of-type(9){   /* mobilisation          */
  border-bottom:var(--je-trait);
}

/* ==============================================================
   5. HÉRO
   ============================================================== */
/* guillemet ouvrant : une serif, car Archivo dessine des barres
   obliques illisibles à cette taille */
.sp-page-builder .je-guillemet{
  font-family:Georgia,"Iowan Old Style","Times New Roman",serif !important;
  font-weight:700;
  font-size:92px;
  line-height:.72;
  color:var(--je-accent);
  margin:0 0 4px !important;
  display:block;
  -webkit-text-fill-color:currentColor !important;
}
.sp-page-builder .je-lead{
  font-size:20px; line-height:1.5; max-width:38ch; color:var(--je-texte-2);
}
.sp-page-builder .je-vif{ color:var(--je-accent); font-weight:600; }
.sp-page-builder .je-credo{
  font-family:var(--je-display); font-weight:700;
  font-variation-settings:"wdth" 108;
  font-size:28px; line-height:1.14; letter-spacing:-.02em;
  color:var(--je-titre);
  border-left:4px solid var(--je-accent); padding-left:20px;
  margin:34px 0 0 !important;
}

/* ==============================================================
   6. TEXTES COURANTS
   ============================================================== */
.sp-page-builder .je-pull{
  font-family:var(--je-display); font-weight:700;
  font-variation-settings:"wdth" 108;
  font-size:29px; line-height:1.16; letter-spacing:-.02em;
  color:var(--je-titre);
  border-left:4px solid var(--je-accent); padding-left:20px;
  margin:30px 0 !important;
}
.sp-page-builder .je-h3{
  font-size:23px !important;
  font-variation-settings:"wdth" 108;
  margin:0 0 14px !important;
}
.sp-page-builder .je-mono{
  font-family:var(--je-mono); font-size:12px; letter-spacing:.13em;
  text-transform:uppercase; color:var(--je-texte-3);
}
.sp-page-builder .je-horschamp{
  font-size:16px; color:var(--je-texte-2); margin:0 !important;
}
.sp-page-builder .je-tags{
  display:flex; flex-wrap:wrap; gap:8px;
  margin:6px 0 20px !important; padding:0 !important; list-style:none;
}
.sp-page-builder .je-tags li{
  font-family:var(--je-mono); font-size:13px; text-transform:uppercase;
  letter-spacing:.08em; border:1.5px solid var(--je-primary);
  color:var(--je-primary); padding:5px 10px; border-radius:2px; list-style:none;
}

/* ==============================================================
   7. LES CINQ CRITÈRES
   ============================================================== */
.sp-page-builder .je-crit{
  background:var(--je-carte);
  border:var(--je-cadre); border-radius:2px;
  padding:22px 20px 26px; height:100%;
}
.sp-page-builder .je-num{
  font-family:var(--je-mono); font-size:30px;
  color:var(--je-accent); letter-spacing:.1em;
}
.sp-page-builder .je-crit-t{
  font-size:19px !important; margin:10px 0 7px !important;
  font-variation-settings:"wdth" 100;
}
.sp-page-builder .je-crit p{
  margin:0 !important; font-size:15px; line-height:1.45; color:var(--je-texte-2);
}

/* ==============================================================
   8. AUJOURD'HUI / DEMAIN
   ============================================================== */
.sp-page-builder .je-basc{
  border:var(--je-cadre); border-radius:2px; padding:26px 22px; height:100%;
}
.sp-page-builder .je-basc .je-mono{ display:block; margin-bottom:10px; }
.sp-page-builder .je-basc strong{
  font-family:var(--je-display); font-weight:800;
  font-variation-settings:"wdth" 108;
  font-size:26px; line-height:1.12; letter-spacing:-.025em; display:block;
  color:var(--je-titre);
}
.sp-page-builder .je-basc-dark{
  background:var(--je-primary-dark); border-color:var(--je-primary-dark);
}
.sp-page-builder .je-basc-dark,
.sp-page-builder .je-basc-dark strong{
  color:#FFFFFF !important;
  -webkit-text-fill-color:currentColor !important;
}
.sp-page-builder .je-basc-dark .je-mono{ color:hsla(0,0%,100%,.5) !important; }

/* ==============================================================
   9. CARROUSEL PRESSE
   ============================================================== */
.sp-page-builder .sppb-testimonial-message{
  background:var(--je-carte) !important;
  border:var(--je-cadre) !important; border-radius:3px;
  font-family:var(--je-display); font-weight:600;
  font-variation-settings:"wdth" 104;
  font-size:18px; line-height:1.34; letter-spacing:-.01em;
  color:var(--je-titre) !important;
}
.sp-page-builder .sppb-testimonial-client-name{
  font-family:var(--je-display); font-weight:800; font-size:15px;
  color:var(--je-titre) !important;
}
.sp-page-builder .sppb-testimonial-client-designation{
  font-family:var(--je-mono); font-size:12px; letter-spacing:.08em;
  color:var(--je-texte-3) !important;
}

/* ==============================================================
   10. MOBILISATION (section sombre, rang 9)
   ============================================================== */
.sp-page-builder .sppb-section:nth-of-type(9) .sppb-addon-title{
  color:#FFFFFF !important;
}
.sp-page-builder .je-clair{
  color:hsla(0,0%,100%,.8) !important;
  -webkit-text-fill-color:currentColor !important;
}
.sp-page-builder .je-claque{
  font-family:var(--je-display); font-weight:800;
  font-variation-settings:"wdth" 108;
  font-size:40px; line-height:1.08; letter-spacing:-.025em;
  margin:34px 0 0 !important;
  color:#FFFFFF !important;
  -webkit-text-fill-color:currentColor !important;
}
.sp-page-builder .je-claque b{ color:var(--je-accent) !important; }

/* ==============================================================
   11. FORMULAIRE
   ============================================================== */
/* emplacement provisoire, à supprimer en même temps que le bloc */
.sp-page-builder .je-formslot{
  background:var(--je-carte); color:var(--je-texte);
  border:2px dashed rgba(40,51,130,.35); border-radius:3px;
  padding:28px 26px;
}
.sp-page-builder .je-formslot p{ margin:10px 0 0 !important; font-size:15px; }
.sp-page-builder .je-formslot-h{
  color:var(--je-texte-2); font-size:14px; line-height:1.7;
}

/* habillage Convert Forms — actif dès l'ajout de l'addon */
.sp-page-builder .cf-form .cf-control-input,
.sp-page-builder .cf-form textarea.cf-control-input{
  background:var(--je-carte); color:var(--je-texte);
  border:var(--je-cadre); border-radius:3px;
  padding:13px 14px; font-family:var(--je-body); font-size:16px;
  box-shadow:none;
}
.sp-page-builder .cf-form .cf-control-input:focus,
.sp-page-builder .cf-form textarea.cf-control-input:focus{
  border-color:var(--je-primary-light);
  box-shadow:0 0 0 3px rgba(40,51,130,.14);
}
.sp-page-builder .cf-form textarea.cf-control-input{
  min-height:130px; line-height:1.5;
}
.sp-page-builder .cf-form .cf-label{
  font-family:var(--je-display); font-weight:700; font-size:13px;
  text-transform:uppercase; letter-spacing:.06em; color:var(--je-titre);
}
.sp-page-builder .cf-form input[type=checkbox]{ accent-color:var(--je-primary); }
.sp-page-builder .cf-form .cf-submit,
.sp-page-builder .cf-form button[type=submit]{
  font-family:var(--je-display); font-weight:700; font-size:16px;
  background:var(--je-accent); color:#FFFFFF;
  border:2px solid var(--je-accent); border-radius:3px;
  padding:15px 24px; width:100%; transition:.14s ease;
}
.sp-page-builder .cf-form .cf-submit:hover,
.sp-page-builder .cf-form button[type=submit]:hover{
  background:var(--je-orange); border-color:var(--je-orange);
  transform:translateY(-2px);
}
.sp-page-builder .cf-form .cf-checkbox-label{
  font-size:15px; line-height:1.45; color:var(--je-texte-2);
}

/* ==============================================================
   12. PIED DE PAGE DE LA MAQUETTE
   (à supprimer si vous gardez celui de Magiris)
   ============================================================== */
.sp-page-builder .je-pied{ font-size:15px; }
.sp-page-builder .je-pied nav{
  display:flex; flex-wrap:wrap; gap:10px 16px; align-items:center;
}
.sp-page-builder .je-pied a{
  color:var(--je-primary); text-decoration:none;
  border-bottom:1px solid rgba(40,51,130,.3);
}
.sp-page-builder .je-pied a:hover{
  color:var(--je-accent); border-color:var(--je-accent);
}
.sp-page-builder .je-sep{ color:var(--je-texte-3); }
.sp-page-builder .je-kairos{
  font-family:var(--je-mono); font-size:13px; color:var(--je-texte-2);
  text-transform:uppercase; letter-spacing:.1em; margin:14px 0 0 !important;
}
.sp-page-builder .je-copy{
  color:var(--je-texte-3); font-size:13px;
  border-top:var(--je-filet); padding-top:16px; margin:16px 0 0 !important;
}

/* ==============================================================
   13. FICHE D'EXAMEN — interactive, sans JavaScript
   ============================================================== */
.sp-page-builder .je-fiche{
  background:var(--je-carte);
  border:2px solid var(--je-primary); border-radius:3px;
  box-shadow:9px 9px 0 rgba(40,51,130,.10);
  overflow:hidden;
  font-family:var(--je-body); color:var(--je-texte);
}
.sp-page-builder .je-fiche .jf-mono{
  font-family:var(--je-mono); font-size:12px;
  letter-spacing:.13em; text-transform:uppercase; color:var(--je-titre);
}
.sp-page-builder .je-fiche .jf-dim{ color:var(--je-texte-3); }
.sp-page-builder .je-fiche .jf-head{
  border-bottom:1px solid rgba(40,51,130,.3); padding:13px 16px;
  display:flex; justify-content:space-between; gap:10px; align-items:baseline;
}
.sp-page-builder .je-fiche .jf-norme{
  padding:16px; border-bottom:var(--je-filet);
}
.sp-page-builder .je-fiche .jf-norme p{
  margin:6px 0 0 !important; font-size:15px; line-height:1.45;
  color:var(--je-texte-2);
}

.sp-page-builder .je-fiche .jf-checks{
  list-style:none !important; margin:0 !important; padding:6px 0 !important;
}
.sp-page-builder .je-fiche .jf-checks li{
  border-bottom:var(--je-filet); list-style:none; margin:0;
}
.sp-page-builder .je-fiche .jf-checks li:last-child{ border-bottom:0; }
.sp-page-builder .je-fiche .jf-row{
  display:flex; align-items:center; gap:13px;
  padding:11px 16px; margin:0 !important;
  cursor:pointer; font-size:15px; font-weight:400;
}
.sp-page-builder .je-fiche .jf-row:hover{ background:rgba(40,51,130,.05); }
.sp-page-builder .je-fiche .jf-in{
  position:absolute; opacity:0; width:0; height:0;
}
.sp-page-builder .je-fiche .jf-box{
  width:20px; height:20px; flex:none; position:relative;
  border:2px solid var(--je-primary); border-radius:2px;
  background:var(--je-carte);
}
/* coche dessinée géométriquement : centrage exact, sans glyphe */
.sp-page-builder .je-fiche .jf-box::after{
  content:""; position:absolute; left:50%; top:47%;
  width:10px; height:5px;
  border-left:2.6px solid var(--je-primary);
  border-bottom:2.6px solid var(--je-primary);
  transform:translate(-50%,-50%) rotate(-45deg) scale(.5);
  opacity:0; transition:opacity .14s ease, transform .14s ease;
}
.sp-page-builder .je-fiche .jf-in:checked ~ .jf-box{
  background:rgba(40,51,130,.07);
}
.sp-page-builder .je-fiche .jf-in:checked ~ .jf-box::after{
  opacity:1; transform:translate(-50%,-50%) rotate(-45deg) scale(1);
}
.sp-page-builder .je-fiche .jf-in:focus-visible ~ .jf-box{
  outline:2.5px solid var(--je-primary-light); outline-offset:3px;
}
.sp-page-builder .je-fiche .jf-lbl{ font-weight:500; color:var(--je-titre); }
.sp-page-builder .je-fiche .jf-q{
  color:var(--je-texte-3); font-size:13px; margin-left:auto; text-align:right;
}

.sp-page-builder .je-fiche .jf-verdict{
  border-top:1px solid rgba(40,51,130,.3); padding:18px 16px; min-height:92px;
  display:flex; align-items:center; justify-content:space-between; gap:14px;
}
.sp-page-builder .je-fiche .jf-txt{
  font-size:14px; color:var(--je-texte-2); max-width:22ch;
  line-height:1.35; margin:0 !important;
}
.sp-page-builder .je-fiche .jf-tampon{
  font-family:var(--je-display); font-weight:800;
  font-variation-settings:"wdth" 92;
  font-size:23px; letter-spacing:.04em; text-transform:uppercase;
  border:3px double currentColor; padding:8px 14px;
  transform:rotate(-7deg); color:var(--je-accent); white-space:nowrap;
  -webkit-text-fill-color:currentColor !important;
}
.sp-page-builder .je-fiche .jf-tampon-ok{ color:var(--je-success); }

/* bascule d'état : le tampon suit les cases cochées */
.sp-page-builder .je-fiche .jf-ok{ display:none; }
.sp-page-builder .je-fiche:not(:has(.jf-in:not(:checked))) p.jf-ok{ display:block; }
.sp-page-builder .je-fiche:not(:has(.jf-in:not(:checked))) span.jf-ok{ display:inline-block; }
.sp-page-builder .je-fiche:not(:has(.jf-in:not(:checked))) .jf-ko{ display:none; }

/* ==============================================================
   14. RESPONSIVE
   ============================================================== */
@media (max-width:991px){
  .sp-page-builder .je-lead{ font-size:18px; max-width:none; }
  .sp-page-builder .je-guillemet{ font-size:76px; }
  .sp-page-builder .je-credo{ font-size:24px; }
  .sp-page-builder .je-pull{ font-size:25px; }
  .sp-page-builder .je-claque{ font-size:32px; }
}
@media (max-width:767px){
  .sp-page-builder .je-guillemet{ font-size:64px; }
  .sp-page-builder .je-credo{ font-size:21px; }
  .sp-page-builder .je-pull{ font-size:22px; }
  .sp-page-builder .je-claque{ font-size:27px; }
  .sp-page-builder .je-basc strong{ font-size:21px; }
  .sp-page-builder .je-fiche{ box-shadow:6px 6px 0 rgba(40,51,130,.10); }
  .sp-page-builder .je-fiche .jf-q{ display:none; }
  .sp-page-builder .je-fiche .jf-verdict{
    flex-direction:column; align-items:flex-start;
  }
  .sp-page-builder .je-fiche .jf-txt{ max-width:none; }
}

/* ==============================================================
   15. PAGE MENTIONS LÉGALES
   Le contenu de l'article doit être encadré par <div class="je-legal">
   ============================================================== */
.je-legal{
  font-family:var(--je-body);
  color:var(--je-texte);
  font-size:17px;
  line-height:1.7;
  max-width:74ch;
  margin:0 auto;
  padding:clamp(24px,5vw,64px) 0;
}

/* --- titres : on neutralise le dégradé Magiris --- */
.je-legal h1,
.je-legal h2,
.je-legal h3{
  font-family:var(--je-display) !important;
  font-weight:800;
  letter-spacing:-.02em;
  background:none !important;
  background-image:none !important;
  -webkit-background-clip:border-box !important;
  background-clip:border-box !important;
  -webkit-text-fill-color:currentColor !important;
  text-shadow:none !important;
  color:var(--je-titre) !important;
}
.je-legal h1{
  font-variation-settings:"wdth" 112;
  font-size:clamp(34px,5vw,52px);
  line-height:1.04;
  margin:0 0 8px;
}
.je-legal h2{
  font-variation-settings:"wdth" 108;
  font-size:clamp(22px,3vw,29px);
  line-height:1.14;
  margin:56px 0 18px;
  padding-top:22px;
  border-top:var(--je-trait);
}
.je-legal h3{
  font-variation-settings:"wdth" 100;
  font-size:19px;
  line-height:1.3;
  margin:34px 0 10px;
}

/* --- date de mise à jour --- */
.je-legal > p:first-of-type em,
.je-legal h1 + p em{
  font-family:var(--je-mono);
  font-style:normal;
  font-size:12px;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--je-texte-3);
}

/* --- corps --- */
.je-legal p{ margin:0 0 1.15em; }
.je-legal strong{
  color:var(--je-titre);
  font-weight:600;
  -webkit-text-fill-color:currentColor !important;
  background:none !important;
}
.je-legal a{
  color:var(--je-primary);
  text-decoration:none;
  border-bottom:1px solid rgba(40,51,130,.35);
}
.je-legal a:hover{
  color:var(--je-accent);
  border-color:var(--je-accent);
}

/* --- listes --- */
.je-legal ul{
  margin:0 0 1.3em;
  padding-left:0;
  list-style:none;
}
.je-legal ul li{
  position:relative;
  padding-left:22px;
  margin-bottom:9px;
}
.je-legal ul li::before{
  content:"";
  position:absolute;
  left:2px; top:.72em;
  width:7px; height:1px;
  background:var(--je-accent);
}

/* --- tableau des données collectées --- */
.je-legal table{
  width:100%;
  border-collapse:collapse;
  margin:0 0 1.6em;
  font-size:15px;
}
.je-legal thead th{
  background:var(--je-titre);
  color:#FFFFFF;
  font-family:var(--je-display);
  font-weight:700;
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-align:left;
  padding:11px 14px;
  -webkit-text-fill-color:currentColor !important;
}
.je-legal tbody td{
  border-bottom:var(--je-filet);
  padding:13px 14px;
  vertical-align:top;
  line-height:1.5;
}
.je-legal tbody tr:nth-child(odd) td{ background:var(--je-bande); }
.je-legal tbody td:first-child{
  font-weight:600;
  color:var(--je-titre);
  white-space:nowrap;
}
.je-legal tbody td:last-child{
  color:var(--je-texte-2);
  font-size:14px;
}
/* légende visuellement masquée si vous en ajoutez une */
.je-legal table caption{
  position:absolute; width:1px; height:1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;
}

/* --- retour à l'accueil --- */
.je-legal .je-retour{
  display:inline-block;
  font-family:var(--je-display);
  font-weight:700;
  font-size:14px;
  color:var(--je-primary);
  border:0;
  margin-top:48px;
}
.je-legal .je-retour::before{ content:"← "; }

/* --- responsive --- */
@media (max-width:767px){
  .je-legal{ font-size:16px; line-height:1.65; }
  .je-legal h2{ margin-top:40px; }
  /* le tableau devient défilable plutôt qu'écrasé */
  .je-legal table{
    display:block;
    overflow-x:auto;
    white-space:nowrap;
    -webkit-overflow-scrolling:touch;
  }
  .je-legal tbody td{ white-space:normal; min-width:150px; }
}

/* --- impression : une page légale doit s'imprimer proprement --- */
@media print{
  .je-legal{ max-width:none; font-size:11pt; color:#000; }
  .je-legal h1,.je-legal h2,.je-legal h3{ color:#000 !important; }
  .je-legal h2{ page-break-after:avoid; }
  .je-legal a{ border:0; color:#000; }
  .je-legal a[href^="http"]::after{ content:" (" attr(href) ")"; font-size:9pt; }
  .je-legal thead th{ background:#EEE; color:#000; }
  .je-legal table,.je-legal tr{ page-break-inside:avoid; }
}

/* ==============================================================
   9. CARROUSEL PRESSE — défilement natif, sans JavaScript
   ============================================================== */
.sp-page-builder .je-presse-carousel{ position:relative; }

.sp-page-builder .je-presse-piste{
  display:flex;
  gap:18px;
  overflow-x:auto;
  overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  padding:2px 2px 8px;
  margin:0 -2px;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.sp-page-builder .je-presse-piste::-webkit-scrollbar{ display:none; }
.sp-page-builder .je-presse-piste:focus-visible{
  outline:2.5px solid var(--je-primary-light);
  outline-offset:4px;
}

/* --- la carte, entièrement cliquable --- */
.sp-page-builder .je-cite{
  flex:0 0 calc((100% - 54px) / 4);
  scroll-snap-align:start;
  scroll-margin-left:2px;
  background:var(--je-carte);
  border:var(--je-cadre);
  border-radius:3px;
  padding:24px 22px;
  margin:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:12px;
  text-decoration:none !important;
  color:inherit;
  transition:box-shadow .16s ease, transform .16s ease, border-color .16s ease;
}
.sp-page-builder .je-cite:hover{
  box-shadow:5px 5px 0 rgba(40,51,130,.10);
  transform:translateY(-2px);
}
.sp-page-builder .je-cite:target{ border-color:var(--je-accent); }

/* --- zone du logo : hauteur constante d'une carte à l'autre --- */
.sp-page-builder .je-cite-logo-zone{
  height:38px;
  display:flex;
  align-items:center;
}
.sp-page-builder .je-cite-logo{
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  background:none !important;
  padding:0 !important;
  margin:0 !important;
  width:auto !important;
  max-width:120px !important;
  max-height:38px !important;
  height:auto !important;
  object-fit:contain !important;
  object-position:left center;
  display:block;
}

/* --- filet de séparation --- */
.sp-page-builder .je-cite-filet{
  display:block;
  width:34px;
  height:1px;
  background:var(--je-primary);
  opacity:.3;
}

/* --- titre de l'article --- */
.sp-page-builder .je-cite-txt{
  font-family:var(--je-display) !important;
  font-weight:700;
  font-variation-settings:"wdth" 104;
  font-size:16px;
  line-height:1.28;
  letter-spacing:-.01em;
  color:var(--je-titre) !important;
  -webkit-text-fill-color:currentColor !important;
  display:block;
}

/* --- date --- */
.sp-page-builder .je-cite-date{
  font-family:var(--je-mono);
  font-size:11px;
  letter-spacing:.06em;
  text-transform:uppercase;
  line-height:1.4;
  color:var(--je-texte-3);
  display:block;
}

/* --- appel à lire --- */
.sp-page-builder .je-cite-lien{
  font-family:var(--je-display);
  font-weight:700;
  font-size:12px;
  color:var(--je-accent);
  margin-top:auto;
  padding-top:8px;
  display:inline-block;
}
.sp-page-builder .je-cite-lien::after{
  content:" ↗";
  display:inline-block;
  transition:transform .16s ease;
}
.sp-page-builder .je-cite:hover .je-cite-lien{ color:var(--je-orange); }
.sp-page-builder .je-cite:hover .je-cite-lien::after{ transform:translate(2px,-2px); }

/* --- pastilles --- */
.sp-page-builder .je-presse-dots{
  display:flex;
  gap:7px;
  margin-top:20px;
}
.sp-page-builder .je-presse-dots a{
  display:block;
  width:22px;
  height:3px;
  background:var(--je-primary);
  opacity:.25;
  border:0 !important;
  transition:opacity .14s ease, background .14s ease, width .14s ease;
}
.sp-page-builder .je-presse-dots a:hover,
.sp-page-builder .je-presse-dots a:focus-visible{
  opacity:1;
  background:var(--je-accent);
  width:30px;
}
.sp-page-builder .je-presse-dots a span{
  position:absolute; width:1px; height:1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;
}

/* --- responsive --- */
@media (max-width:1199px){
  .sp-page-builder .je-cite{ flex-basis:calc((100% - 36px) / 3); }
}
@media (max-width:991px){
  .sp-page-builder .je-cite{ flex-basis:calc((100% - 18px) / 2); }
}
@media (max-width:767px){
  .sp-page-builder .je-cite{ flex-basis:82%; padding:20px 18px; }
  .sp-page-builder .je-cite-txt{ font-size:17px; }
}
@media (prefers-reduced-motion:reduce){
  .sp-page-builder .je-presse-piste{ scroll-behavior:auto; }
  .sp-page-builder .je-cite:hover{ transform:none; }
}