@charset "UTF-8";
/* =============================================================================
   NEXUS — nexus-ux.css
   Systeme d'ergonomie, de rythme et d'interactivite du site.
   Charge par le mu-plugin nexus-ux.php (version = filemtime).

   Sommaire
     1.  Tokens de marque
     2.  Polices et base typographique
     3.  Colonne de contenu et echelle des titres
     4.  Confort de lecture et centrage des blocs
     5.  Rythme vertical (echelle 56 / 96 / 140)
     6.  Systeme d'images unique (ratio 1.3, radius 12, cover)
     7.  En-tete collant + logo + ancres
     8.  Liens, boutons, :focus-visible
     9.  Accordeons <details>/<summary>
     10. Etat de base des revelations
     11. Barre de progression de lecture
     12. Mobile (<= 980 / <= 640 / <= 400)
     13. prefers-reduced-motion
     14. Impression
     15. Reprise des blocs <style> des pages et du CSS additionnel
     16. Animations (titre H1 a l'ouverture, ombre des images, rideau des
         images, cartes, swing-in des H2, H3, texte courant au defilement)
     17. Socle typographique et classes de contenu

   Convention de specificite : le contenu des pages porte de nombreux styles
   INLINE (margin, font-size, color, text-align). Un style inline bat toute
   regle de feuille sans !important : chaque fois qu'une regle d'ici doit
   corriger une geometrie posee en inline, elle porte donc !important, et elle
   est cadree au plus juste. A l'inverse, le socle de la section 17 est ecrit
   SANS !important : il est fait pour s'appliquer une fois les styles inline
   retires du contenu.
   ========================================================================== */


/* -- 1. TOKENS DE MARQUE --------------------------------------------------- */
:root{
  --nx-blue:#02356b;
  --nx-blue-deep:#1a3a5c;
  --nx-ink:#1d1e20;
  --nx-accent:#dd6917;
  --nx-accent-dark:#b5560f;
  --nx-sky:#9cc8e5;
  --nx-bg:#f5f6f8;
  --nx-line:rgba(2,53,107,.12);

  --nx-serif:'Playfair Display',Georgia,'Times New Roman',serif;
  --nx-sans:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;

  /* echelle d'espacement unique : 56 / 96 / 140 */
  --nx-space-s:56px;
  --nx-space-m:96px;
  --nx-space-l:140px;
  --nx-section-y:var(--nx-space-m);
  --nx-hero-top:var(--nx-space-l);
  --nx-hero-bottom:var(--nx-space-m);

  /* largeurs */
  --nx-row-max:1224px;

  /* systeme d'images */
  --nx-img-ratio:1.3;
  --nx-img-radius:12px;

  --nx-ease:cubic-bezier(.2,.6,.2,1);

  /* Chrome REELLEMENT fixe en haut de fenetre : #top-header (33px) +
     #main-header (90px) = 123px au-dessus de 980px de large. C'est la seule
     valeur dont depend scroll-padding-top. Le JS la reajuste par mesure, mais
     la valeur statique doit etre juste : au chargement a froid sur une ancre,
     le navigateur saute au fragment AVANT l'execution du JS, en ne disposant
     que de la feuille de style (bloquante). */
  --nx-sticky-h:123px;
  /* Hauteur du seul #main-header, tenue a jour par le JS. Distincte de
     --nx-sticky-h : #main-header n'est pas toujours fixe, et il n'est pas
     seul a l'etre. Ne pas confondre les deux. */
  --nx-header-h:90px;
}


/* -- 2. POLICES ET BASE TYPOGRAPHIQUE -------------------------------------- */
html body,
html body p,
html body li,
html body dd,
html body dt,
html body td,
html body th,
html body input,
html body select,
html body textarea,
html body button,
html body a:not(.et_pb_button),
html body #et-top-navigation,
html body #top-menu li a,
html body .et_mobile_menu li a{
  font-family:var(--nx-sans) !important;
}

html body h1, html body h2, html body h3, html body h4, html body h5, html body h6,
html body .entry-title,
html body #page-container .et_pb_section h1,
html body #page-container .et_pb_section h2,
html body #page-container .et_pb_section h3,
html body #page-container .et_pb_section h4,
html body #page-container .et_pb_module h1,
html body #page-container .et_pb_module h2,
html body #page-container .et_pb_module h3,
html body #page-container .et_pb_module h4{
  font-family:var(--nx-serif) !important;
  letter-spacing:-.01em;
}

html body{ color:var(--nx-ink); -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
html body strong, html body b{ font-weight:700; }


/* -- 3. COLONNE DE CONTENU ET ECHELLE DES TITRES --------------------------- */
/* Aligne sur nexus-thinktank.fr : 1224px / 90%. */
html body #main-content .et_pb_row{
  max-width:var(--nx-row-max) !important;
  width:90% !important;
}

html body #main-content h1,
html body #left-area h1,
html body .entry-title{ font-size:40px !important; line-height:1.2 !important; }
html body #main-content h2,
html body #left-area h2{ font-size:36px !important; line-height:1.25 !important; }
html body #main-content h3,
html body #left-area h3{ font-size:26px !important; line-height:1.3 !important; }
html body #main-content h4,
html body #left-area h4{ font-size:20px !important; line-height:1.35 !important; }


/* -- 4. CONFORT DE LECTURE ------------------------------------------------- */
/* 18px / 1.65 sur le corps de texte reel : uniquement les paragraphes et
   listes qui sont enfants DIRECTS d'un module de texte Divi, et qui ne
   portent pas une classe utilitaire .nx-*. */
html body #main-content .et_pb_text_inner > p:not([class*="nx-"]),
html body #main-content .et_pb_text_inner > ul > li,
html body #main-content .et_pb_text_inner > ol > li,
html body #left-area .entry-content > p:not([class*="nx-"]),
html body #left-area .entry-content > ul > li,
html body #left-area .entry-content > ol > li{
  font-size:18px !important;
  line-height:1.65 !important;
}

/* Colonnes etroites : on redescend a 16px, 18px y serait a l'etroit. */
html body #main-content .et_pb_column_1_3 .et_pb_text_inner > p:not([class*="nx-"]),
html body #main-content .et_pb_column_1_4 .et_pb_text_inner > p:not([class*="nx-"]),
html body #main-content .et_pb_column_1_5 .et_pb_text_inner > p:not([class*="nx-"]),
html body #main-content .et_pb_column_1_6 .et_pb_text_inner > p:not([class*="nx-"]),
html body #main-content .et_pb_column_3_8 .et_pb_text_inner > p:not([class*="nx-"]),
html body #main-content .et_pb_column_1_3 .et_pb_text_inner > ul > li,
html body #main-content .et_pb_column_1_4 .et_pb_text_inner > ul > li{
  font-size:16px !important;
  line-height:1.6 !important;
}

/* PAS de colonne de lecture : un paragraphe occupe toute sa colonne.
   Mesure sur nexus-thinktank.fr (11/09) : aucun paragraphe n'y porte de
   max-width, sur AUCUNE page — la longueur de ligne est pilotee par la
   largeur de la colonne, pas par un plafond sur le texte. */

/* Un bloc centre doit etre centre DANS sa colonne, pas seulement en interne.
   Deux signaux de centrage coexistent dans le contenu, il faut les deux :
     - la classe de module Divi .et_pb_text_align_center ;
     - un text-align:center pose en style INLINE sur l'element lui-meme.
   Le !important est indispensable : ces elements portent presque tous un
   `margin:` inline, qui bat une regle sans !important. */
html body #main-content .et_pb_text_align_center .et_pb_text_inner > p,
html body #main-content .et_pb_text_align_center .et_pb_text_inner > ul,
html body #main-content .et_pb_text_align_center .et_pb_text_inner > ol,
html body #main-content .et_pb_text_align_center .et_pb_text_inner > blockquote,
html body #main-content .et_pb_text_align_center .et_pb_text_inner > h1,
html body #main-content .et_pb_text_align_center .et_pb_text_inner > h2,
html body #main-content .et_pb_text_align_center .et_pb_text_inner > h3,
html body #main-content .et_pb_text_align_center .et_pb_text_inner > h4,
html body #main-content .et_pb_text_inner > [style*="text-align:center"],
html body #main-content .et_pb_text_inner > [style*="text-align: center"],
html body #left-area .entry-content > [style*="text-align:center"],
html body #left-area .entry-content > [style*="text-align: center"]{
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Espacement interne du texte long. 24px reprend exactement la valeur des
   styles en ligne du contenu (motif dominant : margin:0 0 24px). */
html body #main-content .et_pb_text_inner > p:not([class*="nx-"]){ margin-bottom:24px; }
html body #main-content .et_pb_text_inner li{ margin-bottom:.4em; }


/* -- 5. RYTHME VERTICAL (56 / 96 / 140) ------------------------------------ */
html body #main-content .et_pb_section{
  padding-top:var(--nx-section-y) !important;
  padding-bottom:var(--nx-section-y) !important;
}
/* Premiere section = section qui n'est precedee d'aucune autre section. */
html body #main-content .et_pb_section:not(.et_pb_section ~ .et_pb_section){
  padding-top:var(--nx-hero-top) !important;
  padding-bottom:var(--nx-hero-bottom) !important;
}
html body #main-content .et_pb_fullwidth_section,
html body #main-content .et_pb_section.nx-flush{
  padding-top:0 !important;
  padding-bottom:0 !important;
}
html body #main-content .et_pb_section + .et_pb_section.nx-tight{
  padding-top:var(--nx-space-s) !important;
}
html body #main-content .et_pb_row{ padding-top:0; padding-bottom:0; }


/* -- 6. SYSTEME D'IMAGES UNIQUE -------------------------------------------- */
html body #main-content .et_pb_image .et_pb_image_wrap,
html body #main-content .et_pb_blurb_image .et_pb_image_wrap,
html body #left-area .et_pb_image .et_pb_image_wrap,
html body .et_pb_post .entry-featured-image-url,
html body .et_pb_blog_grid .et_pb_image_container{
  display:block;
  position:relative;
  overflow:hidden;
  border-radius:var(--nx-img-radius);
  aspect-ratio:var(--nx-img-ratio);
  background:var(--nx-bg);
  line-height:0;
}
html body #main-content .et_pb_image .et_pb_image_wrap > img,
html body #main-content .et_pb_blurb_image .et_pb_image_wrap > img,
html body #left-area .et_pb_image .et_pb_image_wrap > img,
html body .et_pb_post .entry-featured-image-url > img,
html body .et_pb_blog_grid .et_pb_image_container img{
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  object-fit:cover !important;
  border-radius:0 !important;
  display:block;
}
/* Les images ne portent plus d'interdiction d'ombre : l'ombre est desormais
   animee a l'apparition (section 16.1). */
html body #main-content .et_pb_image img,
html body #left-area .et_pb_image img,
html body .et_pb_post .entry-featured-image-url img{
  filter:none !important;
}
/* Echappatoires : logos, pictos, SVG et opt-out explicite gardent leur forme. */
html body #main-content .et_pb_image.nx-img-free .et_pb_image_wrap,
html body #main-content .nx-img-free .et_pb_image_wrap{
  aspect-ratio:auto; border-radius:0; background:none;
}
html body #main-content .et_pb_image.nx-img-free .et_pb_image_wrap > img,
html body #main-content .nx-img-free .et_pb_image_wrap > img{
  height:auto !important; width:auto !important; max-width:100% !important; object-fit:contain !important;
}
html body #main-content .et_pb_image_wrap > img[src$=".svg"],
html body #main-content .et_pb_image_wrap > img[src*=".svg?"]{
  object-fit:contain !important;
}

/* Compatibilite : legende en surimpression codee en dur dans le contenu. */
html body #main-content .et_pb_image:has(+ .et_pb_text .et_pb_text_inner > p[style*="margin-top:-"]){
  margin-bottom:0 !important;
}
html body #main-content .et_pb_image + .et_pb_text:has(> .et_pb_text_inner > p[style*="margin-top:-"]){
  height:0 !important;
  margin-top:0 !important;
  padding-top:0 !important;
  overflow:visible;
}
html body #main-content .et_pb_image + .et_pb_text .et_pb_text_inner > p[style*="margin-top:-"]{
  margin-top:0 !important;
  transform:translateY(calc(-100% - 20px));
}

html body #main-content img, html body #left-area img{ max-width:100%; height:auto; }


/* -- 7. EN-TETE COLLANT + LOGO + ANCRES ------------------------------------ */
/* Une ancre doit se poser SOUS le chrome fixe, avec 24px de respiration.
   Voir --nx-sticky-h en section 1 : c'est la somme des barres reellement
   fixes, pas la hauteur du seul #main-header. */
html{ scroll-padding-top:calc(var(--nx-sticky-h) + 24px); }
html body #page-container #main-header{
  transition:box-shadow .25s var(--nx-ease), background-color .25s var(--nx-ease);
}
html body #page-container #main-header.et-fixed-header,
html body #page-container #main-header.nx-scrolled{
  box-shadow:0 1px 0 var(--nx-line), 0 10px 30px rgba(2,53,107,.07) !important;
}
html body #page-container #main-header .logo_container{
  background-image:none !important;
  align-items:center !important;
}
html body #page-container #main-header .logo_container #logo{
  opacity:1 !important;
  width:auto !important;
  height:auto !important;
  max-height:48px !important;
  max-width:260px !important;
}
html body #page-container #main-header.et-fixed-header .logo_container #logo{
  max-height:40px !important;
}
html body #main-header #et-top-navigation #top-menu li.current-menu-item > a,
html body #main-header #et-top-navigation #top-menu li.current_page_item > a,
html body #main-header #et-top-navigation #top-menu li.current-menu-ancestor > a{
  color:var(--nx-accent) !important;
  box-shadow:inset 0 -2px 0 0 var(--nx-accent);
  padding-bottom:6px;
}


/* -- 8. LIENS, BOUTONS, FOCUS ---------------------------------------------- */
html body #main-content .et_pb_text_inner a:not(.et_pb_button):not(.nx-card-link),
html body #left-area .entry-content a:not(.et_pb_button):not(.nx-card-link){
  color:var(--nx-blue);
  text-decoration:underline;
  text-underline-offset:3px;
  text-decoration-thickness:1px;
  text-decoration-color:rgba(2,53,107,.35);
  transition:color .18s var(--nx-ease), text-decoration-color .18s var(--nx-ease);
}
html body #main-content .et_pb_text_inner a:not(.et_pb_button):not(.nx-card-link):hover,
html body #left-area .entry-content a:not(.et_pb_button):not(.nx-card-link):hover{
  color:var(--nx-accent);
  text-decoration-color:var(--nx-accent);
}

html body #top-menu > li > a{ padding-top:6px; padding-bottom:6px; }

html body a:focus-visible,
html body button:focus-visible,
html body input:focus-visible,
html body select:focus-visible,
html body textarea:focus-visible,
html body summary:focus-visible,
html body [tabindex]:focus-visible,
html body .et_pb_button:focus-visible{
  outline:3px solid var(--nx-accent) !important;
  outline-offset:3px !important;
  border-radius:4px;
}
html body :focus:not(:focus-visible){ outline:none; }


/* -- 9. ACCORDEONS <details>/<summary> ------------------------------------- */
html body #main-content details,
html body #left-area details{
  border:1px solid var(--nx-line);
  border-radius:10px;
  background:#fff;
  margin:0 0 12px;
  overflow:hidden;
}
html body #main-content details + details,
html body #left-area details + details{ margin-top:0; }
html body #main-content details > summary,
html body #left-area details > summary{
  cursor:pointer;
  list-style:none;
  display:block;
  position:relative;
  padding:18px 54px 18px 22px;
  font-family:var(--nx-sans) !important;
  font-size:17px;
  font-weight:600;
  line-height:1.4;
  color:var(--nx-blue);
  transition:background-color .18s var(--nx-ease);
}
html body details > summary::-webkit-details-marker{ display:none; }
html body details > summary::marker{ content:""; }
html body #main-content details > summary:hover,
html body #left-area details > summary:hover{ background:var(--nx-bg); }
html body #main-content details > summary::after,
html body #left-area details > summary::after{
  content:"";
  position:absolute;
  right:24px; top:calc(50% - 6px);
  width:9px; height:9px;
  border-right:2px solid var(--nx-accent);
  border-bottom:2px solid var(--nx-accent);
  transform:rotate(45deg);
  transition:transform .25s var(--nx-ease);
}
html body #main-content details[open] > summary::after,
html body #left-area details[open] > summary::after{
  transform:rotate(-135deg); top:calc(50% - 2px);
}
html body #main-content details[open] > summary,
html body #left-area details[open] > summary{ border-bottom:1px solid var(--nx-line); }
html body .nx-acc-body{ padding:18px 22px 22px; }
html body #main-content details > *:not(summary):not(.nx-acc-body),
html body #left-area details > *:not(summary):not(.nx-acc-body){ margin-left:22px; margin-right:22px; }
html body #main-content details > *:not(summary):not(.nx-acc-body):last-child,
html body #left-area details > *:not(summary):not(.nx-acc-body):last-child{ margin-bottom:20px; }
html body .nx-acc-body > *:last-child{ margin-bottom:0; }
html body .nx-acc-body p{ font-size:17px; line-height:1.65; }
html body #main-content .et_pb_toggle{
  border:1px solid var(--nx-line) !important;
  border-radius:10px !important;
  background:#fff !important;
}
html body #main-content .et_pb_toggle_title{ font-family:var(--nx-sans) !important; color:var(--nx-blue) !important; }


/* -- 10. ETAT DE BASE DES REVELATIONS -------------------------------------- */
/* Bloc generique : fondu + montee de 24px. Les etats particuliers (rideau des
   images .nx-clip, cartes .nx-lift, H3 .nx-fade-up) sont en section 16. */
html.nx-js .nx-reveal{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .65s var(--nx-ease), transform .65s var(--nx-ease);
}
html.nx-js .nx-reveal.nx-in{ opacity:1; transform:none; }


/* -- 11. BARRE DE PROGRESSION DE LECTURE ----------------------------------- */
.nx-progress{
  position:fixed; inset:0 0 auto 0;
  height:3px;
  z-index:100000;
  background:transparent;
  pointer-events:none;
}
.nx-progress > span{
  display:block; height:100%; width:0;
  background:linear-gradient(90deg,var(--nx-blue) 0%,var(--nx-accent) 100%);
  transition:width .08s linear;
}


/* -- 12. MOBILE ------------------------------------------------------------ */
@media (max-width:980px){
  :root{
    --nx-section-y:var(--nx-space-s);
    --nx-hero-top:var(--nx-space-m);
    --nx-hero-bottom:var(--nx-space-s);
    /* Sous 980px Divi cesse de fixer les deux barres : verifie au DOM, a
       980px #top-header et #main-header repassent en position:absolute et
       defilent avec la page. Il n'y a donc plus AUCUN chrome collant, et
       scroll-padding-top retombe aux seuls 24px de respiration. */
    --nx-sticky-h:0px;
    --nx-header-h:90px;
  }
  html body #main-content h1, html body #left-area h1, html body .entry-title{ font-size:34px !important; line-height:1.18 !important; }
  html body #main-content h2, html body #left-area h2{ font-size:28px !important; }
  html body #main-content h3, html body #left-area h3{ font-size:22px !important; }
  html body #main-content .et_pb_row{ width:90% !important; }
  html body #main-content [style*="display:grid"],
  html body #main-content [style*="display: grid"],
  html body #left-area [style*="display:grid"],
  html body #left-area [style*="display: grid"]{
    grid-template-columns:1fr !important;
  }
}
@media (max-width:640px){
  html body #main-content h1, html body #left-area h1, html body .entry-title{ font-size:29px !important; }
  html body #main-content h2, html body #left-area h2{ font-size:24px !important; }
  html body #main-content h4, html body #left-area h4{ font-size:19px !important; }
  html body #main-content .et_pb_text_inner > p:not([class*="nx-"]),
  html body #left-area .entry-content > p:not([class*="nx-"]){ font-size:17px !important; line-height:1.65 !important; }
  html body #main-content details > summary,
  html body #left-area details > summary{ font-size:16px; padding:16px 46px 16px 18px; }
  html body .nx-acc-body{ padding:16px 18px 18px; }
  .nx-quote{ font-size:19px; padding-left:16px; }
  .nx-numero{ font-size:48px; margin-right:14px; }
  html body #main-content .et_pb_text_inner > h2{ margin:36px 0 18px; }
  html body #main-content .et_pb_text_inner > h3,
  html body #main-content .et_pb_text_inner > h4{ margin:28px 0 14px; }
}
@media (max-width:400px){
  html, html body{ overflow-x:hidden; }
  html body #main-content .et_pb_row{
    width:auto !important;
    max-width:100% !important;
    margin-left:16px !important;
    margin-right:16px !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }
  html body #main-content h1, html body #left-area h1, html body .entry-title{ font-size:27px !important; }
  html body #main-content h2, html body #left-area h2{ font-size:22px !important; }
  html body #main-content .et_pb_column{ margin-bottom:24px !important; }
  html body #main-content table, html body #left-area table{ display:block; overflow-x:auto; max-width:100%; }
  html body .nx-progress{ height:2px; }
}


/* -- 13. PREFERS-REDUCED-MOTION -------------------------------------------- */
@media (prefers-reduced-motion: reduce){
  html.nx-js .nx-reveal,
  html.nx-js .nx-scale,
  html.nx-js .nx-swing,
  html.nx-js .nx-lift,
  html.nx-js .nx-fade-up,
  html.nx-js .nx-text,
  html.nx-js #main-content h1,
  html.nx-js #left-area h1,
  html.nx-js .entry-title,
  html.nx-js #main-content .et_pb_text_inner > h1 ~ *,
  html.nx-js #main-content .nx-hero-cta{
    opacity:1 !important; transform:none !important;
    transition:none !important; animation:none !important;
  }
  html.nx-js .nx-clip .et_pb_image_wrap{ clip-path:none !important; transition:none !important; }
  /* l'ombre portee des images est neutralisee elle aussi */
  html body #main-content .et_pb_image::after,
  html body #left-area .et_pb_image::after{ opacity:0 !important; transition:none !important; }
  /* le zoom continu est neutralise : le JS ne pose rien, ceci est le filet */
  html body img.nx-zoom{ transform:none !important; will-change:auto !important; }
  html body *, html body *::before, html body *::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    animation-delay:0s !important;
    transition-duration:.001ms !important;
    transition-delay:0s !important;
    scroll-behavior:auto !important;
  }
}


/* -- 15. REPRISE DES BLOCS <style> ET DU CSS ADDITIONNEL -------------------- */
/* Regles qui n'existaient que dans le bloc <style> des 11 pages, le CSS
   additionnel du Customizer et le widget HTML du Pied de page #1. */

/* 15.1 Classes utilitaires posees dans le contenu des pages ---------------- */
.nx-accent{ color:var(--nx-accent) !important; }
.nx-serif{ font-family:var(--nx-serif) !important; }
.nx-uppercase{ text-transform:uppercase; letter-spacing:3px; font-size:13px; font-weight:500; }
html body .nx-pill{
  display:inline-block;
  background:var(--nx-accent);
  color:#fff !important;
  padding:14px 32px;
  border-radius:30px;
  font-weight:600;
  text-decoration:none;
  transition:background .2s;
  font-family:var(--nx-sans) !important;
  font-size:16px;
}
html body .nx-pill:hover{ background:var(--nx-accent-dark); color:#fff; }
.nx-card-valeur{
  background:#fff;
  border-left:3px solid var(--nx-accent);
  padding:14px 18px;
  font-family:var(--nx-sans);
  color:var(--nx-ink);
  font-size:15px;
  box-shadow:0 1px 3px rgba(0,0,0,.04);
}
.nx-quote-box{
  background:var(--nx-blue-deep);
  color:#fff;
  padding:28px 32px;
  border-radius:4px;
  margin-top:24px;
}
.nx-quote-box p.q{
  font-family:var(--nx-serif) !important;
  font-style:italic;
  font-size:22px;
  color:#fff;
  margin:0 0 12px;
  line-height:1.4;
}
.nx-quote-box p.src{
  font-family:var(--nx-sans) !important;
  font-size:11px;
  letter-spacing:2px;
  color:var(--nx-accent);
  text-transform:uppercase;
  margin:0;
  font-weight:500;
}
.nx-partner-card{
  background:#fff;
  padding:28px 16px;
  text-align:center;
  color:var(--nx-ink);
  font-family:var(--nx-sans);
  font-size:13px;
  letter-spacing:1px;
  box-shadow:0 1px 4px rgba(0,0,0,.05);
  border-radius:2px;
}

/* 15.2 Bouton Divi orange -------------------------------------------------- */
html body .et_pb_button.nx-orange-btn,
html body a.et_pb_button.nx-orange-btn{
  background:var(--nx-accent) !important;
  color:#fff !important;
  border:none !important;
  border-radius:30px !important;
  padding:14px 32px !important;
  font-family:var(--nx-sans) !important;
  font-weight:600 !important;
}
html body .et_pb_button.nx-orange-btn:after,
html body a.et_pb_button.nx-orange-btn:after{ display:none !important; }
html body .et_pb_button.nx-orange-btn:hover{ background:var(--nx-accent-dark) !important; padding:14px 32px !important; }

/* 15.3 Carrousel de partenaires -------------------------------------------- */
.nx-banderole-track{ overflow:hidden; width:100%; }
.nx-banderole{ display:flex; gap:60px; align-items:center; animation:nx-scroll 30s linear infinite; width:max-content; }
.nx-logo-partenaire{ display:flex; flex-direction:column; align-items:center; gap:8px; min-width:200px; padding:16px; }
.nx-logo-partenaire img{ max-height:60px; width:auto; opacity:.65; filter:grayscale(100%); transition:opacity .3s, filter .3s; }
.nx-logo-partenaire:hover img{ opacity:1; filter:grayscale(0); }
.nx-logo-partenaire .nx-logo-nom{ font-family:var(--nx-sans); font-size:11px; letter-spacing:1px; text-transform:uppercase; color:#1a2638; opacity:.7; }
@keyframes nx-scroll{ 0%{ transform:translateX(0); } 100%{ transform:translateX(-50%); } }

/* 15.4 Pied de page --------------------------------------------------------- */
#main-footer .container{ max-width:var(--nx-row-max) !important; width:90% !important; }
#footer-bottom{ display:none !important; }
#footer-widgets{ padding:60px 0 60px !important; }
#footer-widgets .footer-widget{ padding:24px 16px; }
#main-footer{ background-color:#162d4d !important; }
#main-footer .footer-widget a{ color:#fff !important; }
.footer-widget h4.title{ display:none !important; }

/* 15.5 Article seul : pas de barre laterale, pas de meta ------------------- */
body.single-post .et_post_meta_wrapper{ display:none !important; }
body.single-post #left-area{ padding-top:0 !important; width:100% !important; max-width:100% !important; float:none !important; }
body.single-post #sidebar{ display:none !important; }

/* 15.6 Cadrage du portrait du president ------------------------------------ */
html body #main-content .et_pb_image_wrap > img[src*="accueil-president-candotti"],
html body #main-content .et_pb_image_wrap > img[src*="apropos-fondateur"],
html body #left-area .et_pb_image_wrap > img[src*="accueil-president-candotti"],
html body #left-area .et_pb_image_wrap > img[src*="apropos-fondateur"]{
  object-position:center 18% !important;
}

/* 15.7 Garde-fous globaux --------------------------------------------------- */
*{ box-sizing:border-box; }
html, body{ overflow-x:hidden; max-width:100vw; }
.et_pb_row, .et_pb_section{ max-width:100%; }

/* 15.8 En-tete : conteneur de menu et hauteur de barre --------------------- */
#main-header .container.et_menu_container{ max-width:1320px; }
#main-header{ min-height:90px; }


/* -- 16. ANIMATIONS -------------------------------------------------------- */
/* Toutes pilotees par une classe posee par nexus-ux.js. Sans JS, aucune classe
   n'est posee : rien n'est masque, rien n'est anime.
   Seules `opacity` et `transform` sont animees. */

/* 16.0 Titre H1 a l'ouverture de la page : montee + resserrement de
   l'interlettrage (tracking-in), puis le chapeau et le bouton du hero avec un
   seul leger decalage. Pure CSS, declenche au premier rendu : la classe
   .nx-js est posee dans <head> par nexus-ux-head.php, donc aucun eclair. */
@keyframes nx-title-in{
  0%{   opacity:0; transform:translateY(28px); letter-spacing:.06em; }
  100%{ opacity:1; transform:none;             letter-spacing:-.01em; }
}
@keyframes nx-sub-in{
  0%{   opacity:0; transform:translateY(20px); }
  100%{ opacity:1; transform:none; }
}
html.nx-js #main-content h1,
html.nx-js #left-area h1,
html.nx-js .entry-title{
  animation:nx-title-in .9s var(--nx-ease) both;
}
/* ce qui suit le H1 dans le meme module de texte (chapeau, liste) */
html.nx-js #main-content .et_pb_text_inner > h1 ~ *,
html.nx-js #left-area .entry-content > h1 ~ *{
  animation:nx-sub-in .7s var(--nx-ease) .18s both;
}
/* bouton du hero : premier module bouton de la premiere section */
html.nx-js #main-content .et_pb_section:not(.et_pb_section ~ .et_pb_section) .et_pb_button_module_wrapper,
html.nx-js #main-content .nx-hero-cta{
  animation:nx-sub-in .7s var(--nx-ease) .32s both;
}

/* 16.1 Ombre des images. Deux niveaux : une ombre de repos, toujours la,
   qui assoit l'image dans la page ; et une ombre portee plus profonde au
   defilement vers le bas (classe .nx-shadow posee par le JS selon le sens),
   qui se retire en remontant. Le ::after porte l'ombre pour ne jamais
   toucher le cadre (overflow:hidden + ratio fixe). */
html body #main-content .et_pb_image,
html body #left-area .et_pb_image{ position:relative; }
html body #main-content .et_pb_image::after,
html body #left-area .et_pb_image::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:var(--nx-img-radius);
  box-shadow:0 12px 28px -10px rgba(2,53,107,.30), 0 3px 8px -2px rgba(2,53,107,.12);
  opacity:1;
  transition:opacity .45s var(--nx-ease), box-shadow .45s var(--nx-ease);
  pointer-events:none;
}
html body #main-content .et_pb_image.nx-shadow::after,
html body #left-area .et_pb_image.nx-shadow::after{
  box-shadow:0 30px 48px -16px rgba(2,53,107,.55), 0 10px 20px -8px rgba(2,53,107,.28);
}
/* pas d'ombre tant que le rideau (16.4) n'est pas leve */
html.nx-js #main-content .et_pb_image.nx-clip:not(.nx-in)::after,
html.nx-js #left-area .et_pb_image.nx-clip:not(.nx-in)::after{ opacity:0; }
/* logos, pictos et opt-out : jamais d'ombre */
html body #main-content .et_pb_image.nx-img-free::after,
html body #main-content .et_pb_image:has(> .et_pb_image_wrap > img[src$=".svg"])::after{ display:none; }

/* 16.1bis Zoom continu des images (pilote image par image en JS, section 3ter).
   Pas de transition : la valeur est reecrite a chaque trame. */
html.nx-js #main-content .et_pb_image_wrap > img.nx-zoom,
html.nx-js #left-area .et_pb_image_wrap > img.nx-zoom,
html.nx-js .nx-media > img.nx-zoom{
  transform-origin:center center;
}

/* 16.2 scale-up-center discret (3 %) : conserve pour compatibilite. */
html.nx-js .nx-scale{
  opacity:0;
  transform:scale(.97);
  transition:opacity .5s var(--nx-ease), transform .5s var(--nx-ease);
}
html.nx-js .nx-scale.nx-in{ opacity:1; transform:none; }

/* 16.4 Rideau des images : le cadre se devoile de bas en haut, pendant que le
   zoom continu (16.1bis) travaille l'image a l'interieur. */
html.nx-js .nx-clip .et_pb_image_wrap{
  clip-path:inset(0 0 100% 0 round var(--nx-img-radius));
  transition:clip-path .9s var(--nx-ease);
}
html.nx-js .nx-clip.nx-in .et_pb_image_wrap{
  clip-path:inset(0 0 0 0 round var(--nx-img-radius));
}

/* 16.5 Cartes et encarts (cartes-liens, cartes valeurs, partenaires,
   blurbs, encadres, citations) : montee + leger scale, et l'ombre de la carte
   n'apparait qu'a l'arrivee, ce qui la fait "se poser" sur la page. */
html.nx-js .nx-lift{
  opacity:0;
  transform:translateY(26px) scale(.985);
  transition:opacity .7s var(--nx-ease), transform .7s var(--nx-ease);
}
html.nx-js .nx-lift.nx-in{ opacity:1; transform:none; }
html.nx-js .nx-lift .nx-card-link,
html.nx-js .nx-lift .nx-card-valeur,
html.nx-js .nx-lift .nx-partner-card{
  box-shadow:0 0 0 rgba(2,53,107,0);
  transition:box-shadow .8s var(--nx-ease) .15s, transform .25s var(--nx-ease);
}
html.nx-js .nx-lift.nx-in .nx-card-link,
html.nx-js .nx-lift.nx-in .nx-card-valeur,
html.nx-js .nx-lift.nx-in .nx-partner-card{
  transition:box-shadow .4s var(--nx-ease), transform .25s var(--nx-ease);
}
html.nx-js .nx-lift.nx-in .nx-card-link{ box-shadow:0 6px 18px -4px rgba(2,53,107,.16), 0 1px 3px rgba(0,0,0,.06); }
html.nx-js .nx-lift.nx-in .nx-card-valeur{ box-shadow:0 8px 20px -10px rgba(2,53,107,.22), 0 1px 3px rgba(0,0,0,.05); }
html.nx-js .nx-lift.nx-in .nx-partner-card{ box-shadow:0 6px 16px -8px rgba(2,53,107,.18), 0 1px 4px rgba(0,0,0,.05); }
/* survol des cartes-liens : un peu plus marque qu'avant (17.6) */
.nx-card-link:hover,
html.nx-js .nx-lift.nx-in .nx-card-link:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 36px -10px rgba(2,53,107,.24), 0 4px 10px -4px rgba(2,53,107,.12);
}
.nx-quote-box, .nx-callout{ box-shadow:0 14px 32px -16px rgba(2,53,107,.32); }
/* cartes ecrites en ligne dans le contenu (grille inline > a / div) : meme
   survol sur les cartes-liens. Leur ombre est en style inline, d'ou le
   !important au survol. */
html.nx-js .nx-lift .et_pb_text_inner > [style*="grid"] > a,
html.nx-js .nx-lift .et_pb_text_inner > [style*="grid"] > div{ transition:box-shadow .3s var(--nx-ease), transform .25s var(--nx-ease); }
html.nx-js .nx-lift .et_pb_text_inner > [style*="grid"] > a:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 36px -10px rgba(2,53,107,.24), 0 4px 10px -4px rgba(2,53,107,.12) !important;
}

/* 16.6 H3 : fondu + montee courte, en complement de la revelation du module. */
html.nx-js .nx-fade-up{
  opacity:0;
  transform:translateY(14px);
  transition:opacity .5s var(--nx-ease) .08s, transform .5s var(--nx-ease) .08s;
}
html.nx-js .nx-fade-up.nx-in{ opacity:1; transform:none; }

/* 16.7 Texte courant (paragraphes, items de liste, citations) : chaque bloc
   apparait en entrant dans la zone de lecture et s'estompe en sortant par le
   haut (sous l'en-tete), puis reapparait si l'on remonte. Le JS pose .nx-text
   et bascule .nx-in / .nx-out (section 3quater). Les modules de texte ne
   prennent donc plus de revelation globale : le rythme vient du defilement. */
html.nx-js .nx-text{
  opacity:0;
  transform:translateY(10px);
  transition:opacity .6s var(--nx-ease), transform .6s var(--nx-ease);
}
html.nx-js .nx-text.nx-in{ opacity:1; transform:none; }
html.nx-js .nx-text.nx-out{ opacity:.22; transform:translateY(-4px); transition-duration:.45s; }

/* 16.3 swing-in-left-fwd sur les H2, fondu d'opacite explicitement associe. */
@keyframes nx-swing-in-left-fwd{
  0%{   transform:perspective(800px) rotateY(100deg); opacity:0; }
  100%{ transform:perspective(800px) rotateY(0deg);   opacity:1; }
}
html.nx-js .nx-swing{
  opacity:0;
  transform-origin:left center;
  backface-visibility:hidden;
}
html.nx-js .nx-swing.nx-in{
  animation:nx-swing-in-left-fwd .6s cubic-bezier(.175,.885,.32,1.275) both;
}


/* -- 17. SOCLE TYPOGRAPHIQUE ET CLASSES DE CONTENU ------------------------- */
/* Objectif : rendre redondants les ~1 500 styles en ligne du contenu.
     - un <p>, <li>, <h2>, <h3> nu prend automatiquement la bonne forme ;
     - tout ce qui a une forme PARTICULIERE passe par une classe .nx-* ;
     - la COULEUR n'est pas sure globalement sur fond sombre : Divi marque
       TOUTES les sections `et_pb_bg_layout_light`, y compris celles a fond
       sombre. Un bloc pose sur fond sombre doit recevoir .nx-on-dark dans la
       meme passe, sinon il deviendrait illisible. */

/* 17.1 Corps de texte par defaut ------------------------------------------- */
html body #main-content .et_pb_text_inner > p:not([class*="nx-"]){
  color:var(--nx-ink);
}
html body #main-content .et_pb_text_inner > ul:not([class*="nx-"]),
html body #main-content .et_pb_text_inner > ol:not([class*="nx-"]){
  color:var(--nx-ink);
  margin:0 0 24px 28px;
  padding:0;
}
html body #main-content .et_pb_text_inner > h2{
  color:var(--nx-blue);
  font-weight:600;
  margin:48px 0 24px;
}
html body #main-content .et_pb_text_inner > h3,
html body #main-content .et_pb_text_inner > h4{
  color:var(--nx-blue);
  font-weight:600;
  margin:36px 0 16px;
}
html body #main-content .et_pb_text_inner > h2:first-child,
html body #main-content .et_pb_text_inner > h3:first-child,
html body #main-content .et_pb_text_inner > h4:first-child{ margin-top:0; }

/* 17.2 Bloc pose sur fond sombre ------------------------------------------- */
html body #main-content .nx-on-dark,
html body #main-content .nx-on-dark li,
html body #main-content .nx-on-dark h1,
html body #main-content .nx-on-dark h2,
html body #main-content .nx-on-dark h3,
html body #main-content .nx-on-dark h4{ color:#fff; }
html body #main-content .nx-on-dark p{ color:rgba(255,255,255,.9); }
html body #main-content .nx-on-dark a:not(.et_pb_button){ color:#fff; text-decoration-color:rgba(255,255,255,.5); }

/* 17.3 Citation ------------------------------------------------------------ */
.nx-quote{
  font-family:var(--nx-serif) !important;
  font-style:italic;
  color:var(--nx-blue);
  font-size:21px;
  line-height:1.5;
  margin:0 0 24px;
  border-left:3px solid var(--nx-accent);
  padding-left:20px;
}
.nx-quote-lg{ font-size:24px; }
.nx-on-dark .nx-quote{ color:rgba(255,255,255,.92); }

/* 17.4 Surtitre / etiquette orange ----------------------------------------- */
.nx-kicker{
  font-family:var(--nx-sans) !important;
  color:var(--nx-accent);
  text-transform:uppercase;
  letter-spacing:3px;
  font-size:13px;
  font-weight:600;
  margin:0 0 16px;
}
.nx-kicker-sm{
  font-family:var(--nx-sans) !important;
  color:var(--nx-accent);
  text-transform:uppercase;
  letter-spacing:2px;
  font-size:13px;
  font-weight:700;
  margin:24px 0 8px;
}

/* 17.5 Encadres ------------------------------------------------------------ */
.nx-note{
  background:#cfdae8;
  padding:14px 18px;
  border-radius:4px;
  margin:16px 0;
  font-family:var(--nx-sans);
  font-size:13px;
  color:#162d4d;
  font-weight:600;
}
.nx-callout{
  background:var(--nx-bg);
  border-left:4px solid var(--nx-accent);
  padding:32px 36px;
  border-radius:4px;
  margin:48px 0;
}

/* 17.6 Carte-lien (grilles de rapports, d'articles) ------------------------ */
.nx-card-link{
  display:block;
  background:#fff;
  border-radius:12px;
  overflow:hidden;
  text-decoration:none !important;
  color:inherit;
  box-shadow:0 2px 8px rgba(0,0,0,.08);
  transition:transform .25s var(--nx-ease), box-shadow .25s var(--nx-ease);
}
.nx-card-link:hover{ transform:translateY(-3px); box-shadow:0 10px 24px rgba(2,53,107,.14); }
.nx-card-body{ display:block; padding:20px 22px; }
.nx-card-title{
  display:block;
  font-family:var(--nx-serif);
  color:var(--nx-blue);
  font-size:19px;
  font-weight:600;
  line-height:1.3;
  margin:0 0 10px;
}
.nx-card-meta{
  display:block;
  font-family:var(--nx-sans);
  color:var(--nx-accent);
  font-size:13px;
  font-weight:600;
}

/* 17.7 Cadre d'image ecrit en ligne dans le contenu ------------------------ */
.nx-media{
  display:block;
  position:relative;
  overflow:hidden;
  border-radius:var(--nx-img-radius);
  aspect-ratio:var(--nx-img-ratio);
  background:var(--nx-bg);
  line-height:0;
}
.nx-media > img{
  width:100%; height:100%;
  object-fit:cover;
  display:block;
  border-radius:0;
}

/* 17.8 Divers -------------------------------------------------------------- */
.nx-link{ color:var(--nx-blue); font-weight:600; }
.nx-link-accent{ color:var(--nx-accent); font-weight:600; }
.nx-muted{ font-family:var(--nx-sans); color:#6b6f76; font-size:13px; line-height:1.7; }
.nx-legende{ font-family:var(--nx-sans); color:#666; font-size:13px; font-style:italic; margin:0 0 24px; }
.nx-mark{ background:#fff3cd; color:#7a4300; padding:2px 6px; border-radius:3px; font-weight:600; }
.nx-numero{
  font-family:var(--nx-serif);
  color:var(--nx-accent);
  font-size:64px;
  font-weight:600;
  line-height:1;
  margin-right:20px;
}
.nx-numero-row{ display:flex; align-items:baseline; margin:48px 0 24px; }
.nx-center{ text-align:center; }


/* -- 14. IMPRESSION -------------------------------------------------------- */
@media print{
  .nx-progress, #main-header, #main-footer{ display:none !important; }
  html.nx-js .nx-reveal, html.nx-js .nx-scale, html.nx-js .nx-swing, html.nx-js .nx-lift, html.nx-js .nx-fade-up, html.nx-js .nx-text,
  html.nx-js #main-content h1, html.nx-js #left-area h1, html.nx-js .entry-title,
  html.nx-js #main-content .et_pb_text_inner > h1 ~ *, html.nx-js #main-content .et_pb_button_module_wrapper{ opacity:1 !important; transform:none !important; animation:none !important; }
  html.nx-js .nx-clip .et_pb_image_wrap{ clip-path:none !important; }
  html body #main-content .et_pb_image::after{ display:none !important; }
  html body #main-content .et_pb_section{ padding:16px 0 !important; }
  html body #main-content details{ border:none; }
  html body #main-content details > *:not(summary){ display:block !important; }
}