/*
Theme Name: SpiritSkillz
Theme URI: https://spiritskillz.com
Description: Thème enfant de Divi pour SpiritSkillz. Toutes les personnalisations vivent ici, pour survivre aux mises à jour du thème parent.
Author: SpiritSkillz
Template: Divi
Version: 1.1.0
Text Domain: spiritskillz
*/

/* ============================================================
   Design system v4 (18/09/2026) — voir DESIGN.md du projet.
   Généré par build-theme-css.py à partir de maquette/accueil-v4.html :
   ne pas éditer à la main, relancer le script.
   Composants sous .ss-design (tout le site, posé par functions.php), resets d'éléments sous body.ss-accueil (accueil) ;
   les jetons (:root) sont globaux. Polices auto-hébergées dans ./fonts (OFL).
   ============================================================ */
@font-face{ font-family:"Onest"; font-style:normal; font-weight:300 900; font-display:swap; src:url("fonts/onest-latin-ext.woff2") format("woff2"); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
  @font-face{ font-family:"Onest"; font-style:normal; font-weight:300 900; font-display:swap; src:url("fonts/onest-latin.woff2") format("woff2"); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
  @font-face{ font-family:"Public Sans"; font-style:normal; font-weight:300 800; font-display:swap; src:url("fonts/public-sans-latin-ext.woff2") format("woff2"); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
  @font-face{ font-family:"Public Sans"; font-style:normal; font-weight:300 800; font-display:swap; src:url("fonts/public-sans-latin.woff2") format("woff2"); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

  /* =========================================================
     1. Jetons — design system v4
     ========================================================= */
  :root{
    --nuit:#151A4A;
    --nuit-2:#1E2460;
    --nuit-3:#2A3178;
    --encre:#14162B;
    --encre-doux:#4A4D6E;
    --blanc:#FFFFFF;
    --fond:#F7F7FB;
    --lavande:#E6E4F9;
    --lavande-2:#D3CFF3;
    --jaune:#FFD23F;
    --jaune-2:#F2C000;
    --pervenche:#5B5BFF;
    --pervenche-clair:#B3B2FF;
    --bordure:#DCDBEA;
    --bordure-nuit:rgba(255,255,255,.14);
    --sur-nuit:#FFFFFF;
    --sur-nuit-doux:#C9C8E6;

    --accent:var(--jaune);
    --accent-2:var(--jaune-2);
    --accent-texte:#14162B;

    --r-bouton:8px;
    --r-carte:16px;
    --r-puce:6px;

    --police-titre:"Onest", "Segoe UI", Arial, sans-serif;
    --police-texte:"Public Sans", "Segoe UI", Arial, sans-serif;

    --ombre-carte:0 12px 32px -16px rgba(20,22,43,.35), 0 2px 6px -2px rgba(20,22,43,.12);
    --sortie:cubic-bezier(.16,1,.3,1);

    --barre:var(--nuit);
    --trait-section:transparent;
    --vitesse:1;
  }
  :root[data-theme="dark"]{
    --encre:#F1F1FA; --encre-doux:#B9B8D6;
    --blanc:#1A1F5C; --fond:#0B0E2E; --lavande:#1D2366; --lavande-2:#2B3380;
    --bordure:#343B7A; --pervenche:#A8A6FF; --barre:#A8A6FF; --trait-section:rgba(255,255,255,.1);
    --ombre-carte:0 12px 32px -16px rgba(0,0,0,.7), 0 2px 6px -2px rgba(0,0,0,.4);
  }

  /* =========================================================
     2. Base
     ========================================================= */
  body.ss-accueil *, body.ss-accueil *::before, body.ss-accueil *::after{ box-sizing:border-box; }
  body.ss-design{ padding-top:76px; }
  body.ss-accueil{
    margin:0; background:var(--fond); color:var(--encre);
    font-family:var(--police-texte); font-size:1.0625rem; line-height:1.55;
    -webkit-font-smoothing:antialiased;
  }
  body.ss-accueil img{ max-width:100%; height:auto; display:block; }
  body.ss-accueil p{ margin:0; padding:0; }
  body.ss-accueil h1, body.ss-accueil h2, body.ss-accueil h3{ font-family:var(--police-titre); font-weight:700; letter-spacing:-0.02em; line-height:1.08; margin:0; padding:0; color:inherit; text-wrap:balance; }
  body.ss-accueil a{ color:inherit; }
  body.ss-accueil ::selection{ background:var(--accent); color:var(--accent-texte); }
  body.ss-accueil :focus-visible{ outline:3px solid var(--accent); outline-offset:3px; border-radius:var(--r-puce); }
  body.ss-accueil ul, body.ss-accueil ol{ padding:0; margin:0; line-height:inherit; list-style:none; }
  body.ss-accueil li{ list-style:none; }
  body.ss-accueil button{ font-family:inherit; }
  /* Neutralise les réglages de Divi sur les sections qui portent le HTML */
  /* Seules les sections et les modules qui portent du HTML pleine largeur sont neutralisés.
     Une règle générale sur .et_pb_module écraserait les marges des modules Divi natifs. */
  body.ss-design .et_pb_section:has(.entete), body.ss-design .et_pb_section:has(.pied){ padding:0 !important; background:transparent !important; }
  body.ss-design .et_pb_module:has(.entete), body.ss-design .et_pb_module:has(.pied), body.ss-design .et_pb_module:has(.tri), body.ss-design .et_pb_module:has(.restitution){ margin:0 !important; padding:0 !important; }
  body.ss-design .et_pb_code_inner{ font-size:inherit; line-height:inherit; }
  body.ss-design .et_pb_code_inner br{ display:none; }
  body.ss-design .entete ul, body.ss-design .entete li, body.ss-design .pied ul, body.ss-design .pied li{ list-style:none; margin:0; padding:0; }
  body.ss-design .entete p, body.ss-design .pied p{ margin:0; padding:0; }
  /* :where() garde une specificite basse : ce reset bat le bleu de Divi sans battre les composants (.bouton-plein, .nav-principale a, .marque) */
  body.ss-design :where(.entete,.pied) a{ color:inherit; }
  body.ss-design .entete img, body.ss-design .pied img{ max-width:100%; height:auto; display:block; }
  body.ss-design .entete{ font-family:var(--police-texte); font-size:1.0625rem; line-height:1.55; }
  /* Le module Divi qui porte l'en-tête doit passer au-dessus des sections suivantes (Divi pose z-index:9 sur chaque module) */
  body.ss-design .et_pb_section:has(.entete), body.ss-design .et_pb_module:has(.entete){ z-index:60 !important; }
  body.ss-accueil #main-content, body.ss-accueil #et-main-area{ padding:0; }

  .ss-design .contenant{ max-width:1200px; margin-inline:auto; padding-inline:clamp(1rem, 4vw, 3rem); }
  .ss-design .visually-hidden{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
  .ss-design .lien-evasion{ position:fixed; left:1rem; top:-4rem; background:var(--accent); color:var(--accent-texte); padding:.7rem 1.1rem; border-radius:var(--r-bouton); text-decoration:none; font-weight:600; z-index:100; }
  .ss-design .lien-evasion:focus{ top:1rem; }

  /* Boutons */
  .ss-design .bouton{
    display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
    font-family:var(--police-titre); font-weight:600; font-size:1rem; letter-spacing:-0.005em;
    padding:.9rem 1.5rem; border-radius:var(--r-bouton); border:2px solid transparent;
    text-decoration:none; cursor:pointer; white-space:nowrap; position:relative; overflow:hidden; isolation:isolate;
    transition:color .2s var(--sortie), border-color .2s var(--sortie), transform .15s var(--sortie), box-shadow .2s var(--sortie);
  }
  .ss-design .bouton::before{ content:""; position:absolute; inset:0; z-index:-1; transform:scaleX(0); transform-origin:left; transition:transform .32s var(--sortie); }
  .ss-design .bouton:hover::before, .ss-design .bouton:focus-visible::before{ transform:scaleX(1); }
  .ss-design .bouton:active{ transform:translateY(1px); }
  .ss-design .bouton-plein{ background:var(--accent); color:var(--accent-texte); }
  .ss-design .bouton-plein::before{ background:var(--accent-2); }
  .ss-design .bouton-contour{ background:transparent; color:var(--encre); border-color:var(--encre); transition:background-color .25s var(--sortie), color .2s var(--sortie); }
  .ss-design .bouton-contour::before{ display:none; }
  .ss-design .bouton-contour:hover, .ss-design .bouton-contour:focus-visible{ background:var(--encre); color:var(--fond); }
  .ss-design .bouton-contour-nuit{ background:transparent; color:var(--sur-nuit); border-color:rgba(255,255,255,.55); }
  .ss-design .bouton-contour-nuit::before{ background:var(--sur-nuit); }
  .ss-design .bouton-contour-nuit:hover, .ss-design .bouton-contour-nuit:focus-visible{ color:var(--nuit); border-color:var(--sur-nuit); }
  .ss-design .bouton svg{ width:18px; height:18px; flex:none; transition:transform .25s var(--sortie); }
  .ss-design .bouton:hover svg{ transform:translateX(3px); }

  /* =========================================================
     3. En-tête
     ========================================================= */
  .ss-design .entete{ position:fixed; left:0; right:0; top:0; z-index:50; background:var(--nuit); color:var(--sur-nuit); }
  body.admin-bar .entete{ top:32px; }
  @media (max-width:782px){ body.admin-bar .entete{ top:46px; } }
  .ss-design .entete .contenant{ max-width:1320px; }
  .ss-design .entete-barre{ display:flex; align-items:center; gap:1.4rem; height:76px; }
  .ss-design .entete-actions .bouton{ padding:.8rem 1.2rem; font-size:.95rem; }
  .ss-design .marque{ font-family:var(--police-titre); font-weight:800; font-size:1.35rem; letter-spacing:-0.03em; text-decoration:none; color:var(--sur-nuit); white-space:nowrap; display:inline-flex; align-items:center; gap:.5rem; }
  .ss-design .marque svg{ width:14px; height:14px; flex:none; }
  .ss-design .nav-principale{ display:flex; align-items:center; gap:1.35rem; list-style:none; margin:0 auto; padding:0; }
  .ss-design .nav-principale a{ text-decoration:none; white-space:nowrap; font-size:.95rem; font-weight:500; color:var(--sur-nuit-doux); padding:.35rem 0; text-decoration:underline; text-decoration-color:transparent; text-underline-offset:.45em; text-decoration-thickness:2px; transition:color .2s, text-decoration-color .25s var(--sortie); }
  .ss-design .nav-principale a:hover{ color:var(--sur-nuit); text-decoration-color:var(--accent); }
  .ss-design .entete-actions{ display:flex; align-items:center; gap:.9rem; margin-left:auto; }

  /* Aiguillage Entreprises / Candidats */
  .ss-design .aiguillage{ display:inline-grid; grid-template-columns:1fr 1fr; position:relative; background:var(--nuit-2); border:1px solid var(--bordure-nuit); border-radius:999px; padding:4px; isolation:isolate; }
  .ss-design .aiguillage::before{ content:""; position:absolute; top:4px; bottom:4px; left:4px; width:calc(50% - 4px); border-radius:999px; background:var(--accent); z-index:-1; transition:transform .35s var(--sortie); }
  .ss-design .aiguillage[data-actif="candidat"]::before{ transform:translateX(100%); }
  .ss-design .aiguillage button{ appearance:none; background:transparent; border:0; font:inherit; font-family:var(--police-titre); font-weight:600; font-size:.9rem; color:var(--sur-nuit-doux); padding:.45rem 1rem; border-radius:999px; cursor:pointer; transition:color .25s; white-space:nowrap; }
  .ss-design .aiguillage button[aria-pressed="true"]{ color:var(--accent-texte); }
  .ss-design .bouton-menu{ display:none; flex-direction:column; justify-content:center; align-items:center; width:44px; height:44px; background:transparent; border:1px solid var(--bordure-nuit); border-radius:var(--r-bouton); cursor:pointer; padding:0; }
  .ss-design .bouton-menu span{ display:block; width:18px; height:2px; background:var(--sur-nuit); margin:2.5px 0; transition:transform .25s var(--sortie), opacity .2s; }
  .ss-design .entete[data-menu-ouvert="true"] .bouton-menu span:nth-child(1){ transform:translateY(4.5px) rotate(45deg); }
  .ss-design .entete[data-menu-ouvert="true"] .bouton-menu span:nth-child(2){ opacity:0; }
  .ss-design .entete[data-menu-ouvert="true"] .bouton-menu span:nth-child(3){ transform:translateY(-4.5px) rotate(-45deg); }
  .ss-design .nav-mobile{ display:none; flex-direction:column; position:absolute; left:0; right:0; top:100%; background:var(--nuit); border-top:1px solid var(--bordure-nuit); padding:.5rem clamp(1rem,4vw,3rem) 1.5rem; gap:0; }
  .ss-design .entete[data-menu-ouvert="true"] .nav-mobile{ display:flex; }
  .ss-design .nav-mobile a:not(.bouton){ padding:.9rem 0; text-decoration:none; color:var(--sur-nuit); border-bottom:1px solid var(--bordure-nuit); font-weight:500; }
  .ss-design .nav-mobile .aiguillage{ margin:1rem 0 .5rem; justify-self:start; }
  .ss-design .nav-mobile .bouton{ margin-top:.75rem; align-self:flex-start; }
  .ss-design .hero-accroche{ font-size:clamp(2.5rem, 4.5vw, 3.55rem); font-weight:800; margin-bottom:1.4rem; }
  .ss-design .hero-accroche span{ display:block; }
  .ss-design .hero-accroche .ligne-2{ color:var(--sur-nuit); }
  .ss-design .hero-sous-titre{ font-size:1.17rem; line-height:1.6; max-width:33rem; color:var(--sur-nuit-doux); margin-bottom:2.2rem; }
  .ss-design .hero-note{ margin-top:2.4rem; max-width:32rem; font-size:.92rem; color:var(--sur-nuit-doux); display:flex; gap:.6rem; align-items:center; }
  .ss-design .hero-note svg{ width:18px; height:18px; color:var(--accent); flex:none; }

  /* Le tri */
  .ss-design .tri{ position:relative; background:var(--nuit-2); border-radius:var(--r-carte); padding:1.4rem 1.4rem 1.2rem; box-shadow:0 30px 60px -30px rgba(0,0,0,.6); }
  .ss-design .tri-tete{ display:flex; justify-content:space-between; align-items:baseline; gap:1rem; margin-bottom:1.1rem; }
  .ss-design .tri-tete .tri-titre{ font-family:var(--police-titre); font-size:1.05rem; font-weight:600; letter-spacing:-0.01em; color:var(--sur-nuit); margin:0; text-wrap:balance; max-width:17em; }
  .ss-design .tri-tete .tri-compte{ font-size:.8rem; color:var(--sur-nuit-doux); font-variant-numeric:tabular-nums; white-space:nowrap; flex:none; }
  .ss-design .tri-entree{ height:64px; position:relative; margin-bottom:.4rem; }
  .ss-design .tri-trieur{ position:absolute; left:50%; top:50%; width:46px; height:46px; margin:-23px 0 0 -23px; border-radius:50%; background:var(--nuit-3); border:1px solid var(--bordure-nuit); display:grid; place-items:center; }
  .ss-design .tri-trieur svg{ width:22px; height:22px; color:var(--accent); transition:transform .35s var(--sortie); }
  .ss-design .tri-trieur[data-sens="gauche"] svg{ transform:rotate(-90deg); }
  .ss-design .tri-trieur[data-sens="droite"] svg{ transform:rotate(90deg); }
  .ss-design .tri-trieur[data-sens="bas"] svg{ transform:rotate(180deg); }
  .ss-design .tri-lignes{ position:absolute; inset:0; pointer-events:none; }
  .ss-design .tri-lignes line{ stroke:var(--bordure-nuit); stroke-width:1; stroke-dasharray:3 5; }
  .ss-design .tri-colonnes{ display:grid; grid-template-columns:1fr 1.12fr; gap:.85rem; align-items:start; }
  .ss-design .tri-colonnes > *{ min-width:0; }
  .ss-design .tri-col .tri-col-titre{ font-size:.85rem; font-weight:500; color:var(--sur-nuit-doux); margin:0 0 .6rem; }
  .ss-design .tri-col .tri-col-titre b{ font-family:var(--police-titre); font-weight:700; color:var(--sur-nuit); }
  .ss-design .tri-liste{ list-style:none; margin:0; padding:0; display:grid; gap:.4rem; }
  .ss-design .tache{ display:flex; align-items:center; gap:.55rem; background:var(--nuit); border:1px solid var(--bordure-nuit); border-radius:var(--r-puce); padding:.5rem .65rem; font-size:.86rem; line-height:1.35; color:var(--sur-nuit); will-change:transform; }
  .ss-design .tache .coche{ width:18px; height:18px; flex:none; border-radius:50%; background:var(--accent); display:grid; place-items:center; color:var(--accent-texte); }
  .ss-design .tache .coche svg{ width:11px; height:11px; }
  .ss-design .tache .coche path{ stroke-dasharray:14; stroke-dashoffset:0; }
  .ss-design .tri-col--auto .tache{ padding-block:.42rem; color:var(--sur-nuit-doux); }
  /* Les libellés se replient sur deux lignes si besoin : tronquer les faisait déborder
     sous la colonne voisine quand le rail rétrécit. */
  .ss-design .tri-col--auto .tache{ min-width:0; }
  .ss-design .tri-col--auto .tache .libelle{ min-width:0; line-height:1.3; }
  .ss-design .tri-col--humain .tache{ background:#FFFFFF; color:#14162B; border-color:transparent; padding:.7rem .75rem; gap:.7rem; font-size:.9rem; box-shadow:var(--ombre-carte); }
  /* Pas de white-space:nowrap ici : il empêche la colonne de rétrécir,
     ce qui déborde sous 1280 px et chevauche la colonne voisine au-dessus. */
  .ss-design .tri-col--humain .tache .libelle{ font-weight:600; }
  .ss-design .tri-col--humain .tache small{ display:block; font-weight:400; color:#4A4D6E; font-size:.8rem; margin-top:.15rem; }
  .ss-design .tri-portrait{ display:flex; align-items:center; gap:.7rem; margin-top:.75rem; padding-top:.75rem; border-top:1px dashed var(--bordure-nuit); font-size:.8rem; line-height:1.4; color:var(--sur-nuit-doux); }
  .ss-design .tri-portrait img{ width:48px; height:48px; border-radius:50%; object-fit:cover; border:2px solid var(--accent); flex:none; }
  .ss-design .tri-legende{ margin-top:1rem; font-size:.8rem; color:var(--sur-nuit-doux); display:flex; justify-content:space-between; align-items:center; gap:1rem; }
  .ss-design .tri-rejouer{ appearance:none; background:transparent; border:1px solid var(--bordure-nuit); color:var(--sur-nuit-doux); font:inherit; font-size:.78rem; padding:.35rem .65rem; border-radius:999px; cursor:pointer; display:inline-flex; gap:.35rem; align-items:center; }
  .ss-design .tri-rejouer:hover{ color:var(--sur-nuit); border-color:var(--sur-nuit-doux); }
  .ss-design .tri-rejouer svg{ width:13px; height:13px; }

  /* =========================================================
     5. Sections
     ========================================================= */
  :root{ --pad-y:clamp(3.5rem, 7vw, 6.5rem); --pad-x:clamp(1rem, 4vw, 3rem); }
  .ss-design .ss-bloc{ padding:4.5rem 2rem; padding:var(--pad-y) var(--pad-x); border-top:1px solid var(--trait-section); }
  .ss-design .ss-bloc > .contenant{ padding-inline:0; }
  @keyframes remplir{ to{ transform:scaleX(1); } }
  @supports (animation-timeline: view()){
    .ss-design .etapes::after{ animation:tracer linear both; animation-timeline:view(); animation-range:entry 40% exit 60%; }
    @keyframes tracer{ from{ transform:scaleY(0); } to{ transform:scaleY(1); } }
  }
  .ss-design .etape .numero{ width:48px; height:48px; border-radius:50%; background:var(--accent); color:var(--accent-texte); font-family:var(--police-titre); font-weight:800; font-size:1.05rem; display:grid; place-items:center; position:relative; z-index:1; box-shadow:0 0 0 6px var(--fond); }
  .ss-design .appel .contenant{ position:relative; }
  .ss-design .pied-marque .marque{ color:var(--encre); margin-bottom:.9rem; }


  /* =========================================================
     7. Responsive
     ========================================================= */
  /* L'en-tête complet demande ~1240 px : en dessous on passe au menu déroulant,
     au-dessus on resserre les espacements plutôt que de laisser déborder. */
  @media (max-width:1400px){
    .ss-design .nav-principale{ gap:1.1rem; }
    .ss-design .nav-principale a{ font-size:.92rem; }
    .ss-design .entete-actions{ gap:.6rem; }
    .ss-design .entete-actions .bouton{ padding:.75rem 1.05rem; font-size:.92rem; }
    .ss-design .aiguillage button{ padding:.45rem .8rem; font-size:.86rem; }
  }
  @media (max-width:1240px){
    .ss-design .nav-principale{ display:none; }
    .ss-design .entete-actions .aiguillage{ display:none; }
    .ss-design .bouton-menu{ display:flex; }
  }
  @media (max-width:1040px){
    .ss-design .hero-grille{ grid-template-columns:1fr; min-height:0; max-height:none; gap:2.5rem; }
    .ss-design .tri{ max-width:560px; }
    .ss-design .offres{ grid-template-columns:1fr 1fr; }
    .ss-design .methode{ grid-template-columns:1fr; }
    .ss-design .methode-intro{ position:static; }
    .ss-design .diagnostic-grille{ grid-template-columns:1fr; }
    .ss-design .restitution{ max-width:520px; }
    .ss-design .pied-grille{ grid-template-columns:1fr 1fr 1fr; }
  }
  @media (max-width:760px){
    .ss-design .entete-actions .bouton-plein{ display:none; }
    .ss-design .portes{ grid-template-columns:1fr; }
    .ss-design .porte{ border-right:0; border-bottom:1px solid var(--bordure); }
    .ss-design .porte:last-child{ border-bottom:0; }
    .ss-design .offres{ grid-template-columns:1fr; }
    .ss-design .recrutement-grille{ grid-template-columns:1fr; }
    .ss-design .recrutement-photo{ aspect-ratio:16/10; max-height:none; }
    .ss-design .pied-grille{ grid-template-columns:1fr 1fr; }
    .ss-design .tri-colonnes{ grid-template-columns:1fr 1fr; gap:.6rem; }
    .ss-design .tri{ padding:1rem; }
    .ss-design .tri-col--humain .tache{ padding:.6rem .7rem; font-size:.85rem; }
    .ss-design .article a{ grid-template-columns:1fr; }
    .ss-design .article .fleche{ display:none; }
    .ss-design .appel-photo::after{ background:rgba(21,26,74,.9); }
  }
  @media (max-width:420px){
    .ss-design .pied-grille{ grid-template-columns:1fr; }
    .ss-design .hero-actions .bouton{ width:100%; }
    .ss-design .tri-colonnes{ grid-template-columns:1fr; }
  }

  /* =========================================================
     8. Mouvement réduit
     ========================================================= */
  @media (prefers-reduced-motion: reduce){
    .ss-design *, .ss-design *::before, .ss-design *::after{ transition-duration:.01ms !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; }
    .ss-design .etapes::after{ transform:scaleY(1); }
    .ss-design .score .barre{ transform:scaleX(1); }
  }
  :root[data-mouvement="reduit"] *, :root[data-mouvement="reduit"] *::before, :root[data-mouvement="reduit"] *::after{ transition-duration:.01ms !important; animation-duration:.01ms !important; }

/* ============================================================
   Habillage des modules Divi natifs de la page d'accueil.
   Ajouté tel quel à la fin de style.css.
   Portée : .ss-design (tout le site) pour que les sections soient réutilisables ;
   la grille ne s'applique qu'aux sections marquées .ss-bloc.
   Divi passe par #page-container pour ses boutons : on fait pareil
   plutôt que d'empiler des !important.
   ============================================================ */

/* ---------- Remises à zéro locales aux sections (pour les réutiliser hors accueil) ---------- */
body.ss-design .ss-bloc,body.ss-design .ss-bloc *,body.ss-design .ss-bloc *::before,body.ss-design .ss-bloc *::after{ box-sizing:border-box; }
body.ss-design .ss-bloc{ font-family:var(--police-texte); font-size:1.0625rem; line-height:1.55; color:var(--encre); }
body.ss-design .ss-bloc:not(.ss-libre){ background-color:var(--fond); }
body.ss-design .ss-bloc h1,body.ss-design .ss-bloc h2,body.ss-design .ss-bloc h3{ font-family:var(--police-titre); font-weight:700; letter-spacing:-0.02em; line-height:1.08; margin:0; padding:0; color:inherit; text-wrap:balance; }
body.ss-design .ss-bloc p{ margin:0; padding:0; }
body.ss-design .ss-bloc ul,body.ss-design .ss-bloc ol,body.ss-design .ss-bloc li{ list-style:none; margin:0; padding:0; line-height:inherit; }
body.ss-design .ss-bloc img{ max-width:100%; height:auto; display:block; }
body.ss-design .ss-bloc a{ color:inherit; }
body.ss-design .ss-bloc .et_pb_code_inner{ font-size:inherit; line-height:inherit; }
body.ss-design .ss-bloc .et_pb_code_inner br{ display:none; }

/* ---------- Grille : sections, lignes, colonnes ---------- */
/* .ss-libre : la section gère son fond et son espacement dans Divi, le thème n'impose rien. */
body.ss-design .et_pb_section.ss-bloc:not(.ss-libre){ padding:var(--pad-y) var(--pad-x) !important; }
body.ss-design .ss-bloc .et_pb_row,body.ss-design .ss-bloc .et_pb_row_inner{ width:100%; max-width:1200px; padding:0; margin:0 auto; display:flex; flex-wrap:wrap; gap:clamp(1.25rem,3vw,2.5rem); }
body.ss-design .ss-bloc .et_pb_row + .et_pb_row{ margin-top:clamp(1.25rem,3vw,2.5rem); }
body.ss-design .ss-bloc .et_pb_column{ float:none; width:auto; margin:0 !important; display:flex; flex-direction:column; align-items:stretch; min-width:0; }
body.ss-design .ss-bloc .et_pb_row > .et_pb_column{ flex:1 1 0; min-width:0; }
body.ss-design .ss-bloc .et_pb_row > .et_pb_column_1_3{ flex:1 1 calc(33.333% - 2rem); }
body.ss-design .ss-bloc .et_pb_row > .et_pb_column_1_2{ flex:1 1 calc(50% - 1.5rem); }
body.ss-design .ss-bloc .et_pb_row > .et_pb_column_2_5{ flex:2 1 0; }
body.ss-design .ss-bloc .et_pb_row > .et_pb_column_3_5{ flex:3 1 0; }
body.ss-design .ss-bloc .ss-actions > .et_pb_column_1_2{ flex:0 0 auto; }
body.ss-design .ss-row-titre > .et_pb_column{ flex-basis:100%; }
/* Divi ajoute une marge de gouttière (.et_pb_gutters3 … .et_pb_module) plus spécifique :
   on la neutralise avec une règle d'un cran au-dessus, l'espacement vient de nos classes. */
body.ss-design .ss-bloc .et_pb_column .et_pb_module,body.ss-design .ss-bloc .et_pb_column .et_pb_row_inner{ margin-bottom:0; }
body.ss-design .ss-bloc .et_pb_row_inner{ gap:0; }
/* Rangées de boutons : colonnes à la largeur du contenu */
body.ss-design .ss-bloc .ss-actions{ gap:.85rem; align-items:center; margin-top:2.2rem; }
body.ss-design .ss-bloc .ss-actions > .et_pb_column{ flex:0 0 auto; width:auto; }
body.ss-design .ss-bloc .ss-actions .et_pb_button_module_wrapper{ margin-top:0; }

/* ---------- Typographie des modules texte ---------- */
body.ss-design .ss-bloc .et_pb_text{ color:inherit; }
body.ss-design .ss-bloc .et_pb_text_inner > * + *{ margin-top:1rem; }

/* ---------- Boutons ---------- */
body.ss-design #page-container .et_pb_section a.et_pb_button.ss-bouton,
body.ss-design #page-container .et_pb_section a.et_pb_button.ss-lien-fleche{
  font-family:var(--police-titre); font-weight:600; font-size:1rem; letter-spacing:-0.005em;
  border-radius:var(--r-bouton); border:2px solid transparent; text-decoration:none; cursor:pointer;
  display:inline-flex; align-items:center; gap:.55rem; line-height:1.2;
  transition:color .2s var(--sortie), background-color .25s var(--sortie), border-color .2s var(--sortie), transform .15s var(--sortie);
}
body.ss-design #page-container .et_pb_section a.et_pb_button.ss-bouton{ padding:.9rem 1.5rem; }
body.ss-design #page-container .et_pb_section a.et_pb_button.ss-bouton::after,
body.ss-design #page-container .et_pb_section a.et_pb_button.ss-lien-fleche::after{ display:none; content:none; }
body.ss-design #page-container .et_pb_section a.et_pb_button.ss-bouton::before{
  content:""; width:18px; height:18px; flex:none; order:2; opacity:0;
  background:currentColor; -webkit-mask:var(--fleche) center/contain no-repeat; mask:var(--fleche) center/contain no-repeat;
  transition:opacity .2s, transform .25s var(--sortie); display:none;
}
body.ss-design #page-container .et_pb_section a.et_pb_button.ss-bouton-plein{ background:var(--accent); color:var(--accent-texte); }
body.ss-design #page-container .et_pb_section a.et_pb_button.ss-bouton-plein:hover{ background:var(--accent-2); color:var(--accent-texte); }
body.ss-design #page-container .et_pb_section a.et_pb_button.ss-bouton-contour{ background:transparent; color:var(--encre); border-color:var(--encre); }
body.ss-design #page-container .et_pb_section a.et_pb_button.ss-bouton-contour:hover{ background:var(--encre); color:var(--fond); }
body.ss-design #page-container .et_pb_section a.et_pb_button.ss-bouton-contour-nuit{ background:transparent; color:var(--sur-nuit); border-color:rgba(255,255,255,.55); }
body.ss-design #page-container .et_pb_section a.et_pb_button.ss-bouton-contour-nuit:hover{ background:var(--sur-nuit); color:var(--nuit); border-color:var(--sur-nuit); }
body.ss-design #page-container .et_pb_section a.et_pb_button.ss-bouton:active{ transform:translateY(1px); }
body.ss-design .ss-bloc .et_pb_button_module_wrapper{ margin-top:1.5rem; }

/* Lien fléché (Voir l'offre, Lire tous les articles) */
body.ss-design #page-container .et_pb_section a.et_pb_button.ss-lien-fleche{
  padding:0; border:0; background:transparent; color:var(--pervenche);
  text-decoration:underline; text-decoration-color:transparent; text-decoration-thickness:2px; text-underline-offset:.3em;
}
body.ss-design #page-container .et_pb_section a.et_pb_button.ss-lien-fleche:hover{ background:transparent; text-decoration-color:currentColor; }
body.ss-design .ss-offre .et_pb_button_module_wrapper{ margin-top:1rem; }

/* ---------- Hero ---------- */
body.ss-design .ss-hero{ color:var(--sur-nuit); border-top:0; }
/* La hauteur du hero vient de l'espacement réglé dans Divi, pas d'un min-height figé. */
body.ss-design .ss-hero .ss-hero-row{ align-items:center; gap:clamp(2rem,4vw,3rem); }
/* Le rail a besoin d'environ 520 px pour afficher ses deux colonnes sans repli. */
body.ss-design .ss-bloc .ss-hero-row > .et_pb_column_3_5{ flex:55 1 0; }
body.ss-design .ss-bloc .ss-hero-row > .et_pb_column_2_5{ flex:45 1 0; }
body.ss-design .ss-hero h1,body.ss-design .ss-hero h2,body.ss-design .ss-hero h3{ color:var(--sur-nuit); }
body.ss-design .ss-hero-texte{ color:var(--sur-nuit-doux); }
body.ss-design .ss-hero-texte .hero-accroche{ font-size:clamp(2.5rem,4.5vw,3.55rem); font-weight:800; margin:0 0 1.4rem; }
body.ss-design .ss-hero-texte .hero-accroche span{ display:block; }
body.ss-design .ss-hero-texte .hero-sous-titre{ font-size:1.17rem; line-height:1.6; max-width:33rem; color:var(--sur-nuit-doux); margin:0; }
body.ss-design .ss-hero-note{ margin-top:2.4rem; }
body.ss-design .ss-hero-note .hero-note{ display:flex; gap:.6rem; align-items:flex-start; max-width:32rem; font-size:.92rem; color:var(--sur-nuit-doux); }
body.ss-design .ss-hero-note .hero-note svg{ width:18px; height:18px; color:var(--accent); flex:none; margin-top:.15rem; }
body.ss-design .ss-hero-col-tri{ align-items:stretch; }
body.ss-design .ss-tri,body.ss-design .ss-tri .et_pb_code_inner{ width:100%; }
body.ss-design .ss-porte{ width:100%; padding:2rem 1.75rem 1.9rem; position:relative; transition:background-color .25s var(--sortie); }
body.ss-design .ss-porte:hover{ background:var(--fond); }
body.ss-design .ss-porte .et_pb_module_header{ font-family:var(--police-titre); font-weight:700; font-size:1.45rem; line-height:1.08; letter-spacing:-0.02em; padding:0 2.4rem 0 0; margin:0 0 .7rem; }
body.ss-design .ss-porte .et_pb_module_header a{ color:var(--encre); text-decoration:none; }
body.ss-design .ss-porte .et_pb_blurb_description{ color:var(--encre-doux); font-size:.98rem; line-height:1.55; }
body.ss-design .ss-porte::after{
  content:""; position:absolute; top:1.9rem; right:1.6rem; width:34px; height:34px; border-radius:50%;
  border:1.5px solid var(--bordure); background:var(--fleche-diag) center/16px no-repeat;
  transition:background-color .25s var(--sortie), border-color .25s var(--sortie), transform .3s var(--sortie);
}
body.ss-design .ss-porte:hover::after{ background-color:var(--accent); border-color:var(--accent); transform:translate(3px,-3px); }
body.ss-design .ss-offre-image .et_pb_image_wrap{ display:block; border-radius:var(--r-carte); overflow:hidden; }

/* ---------- Diagnostic ---------- */
body.ss-design .ss-diagnostic{ background:var(--nuit) !important; color:var(--sur-nuit); }
body.ss-design .ss-diagnostic .ss-diag-texte h2,body.ss-design .ss-diagnostic .ss-diag-texte h3{ color:var(--sur-nuit); }
body.ss-design .ss-restitution,body.ss-design .ss-restitution .et_pb_code_inner{ width:100%; }
body.ss-design .ss-etape .et_pb_text_inner{ display:contents; }
body.ss-design .ss-etape .et_pb_text_inner > * + *{ margin-top:0; }
body.ss-design .ss-etape .numero{
  grid-column:1; grid-row:1 / span 2; width:48px; height:48px; border-radius:50%;
  background:var(--accent); color:var(--accent-texte); font-family:var(--police-titre); font-weight:800; font-size:1.05rem;
  display:grid; place-items:center; position:relative; z-index:1; box-shadow:0 0 0 6px var(--fond);
}
body.ss-design .ss-publications .ss-col-titre .et_pb_button_module_wrapper{ margin-top:0; }
body.ss-design .ss-article .et_pb_blurb_content{ max-width:none; }
body.ss-design .ss-article .et_pb_blurb_container{ padding:1.35rem 4rem 1.35rem 1rem; }
body.ss-design .ss-article .et_pb_module_header{ font-family:var(--police-titre); font-weight:600; font-size:1.18rem; letter-spacing:-0.01em; line-height:1.35; margin:0; transition:transform .3s var(--sortie); }
body.ss-design .ss-article .et_pb_module_header a{ color:var(--encre); text-decoration:none; }
body.ss-design .ss-article .et_pb_blurb_description{ font-size:.85rem; color:var(--encre-doux); margin-top:.3rem; transition:transform .3s var(--sortie); }
body.ss-design .ss-article:hover .et_pb_module_header,body.ss-design .ss-article:hover .et_pb_blurb_description{ transform:translateX(.35rem); }
body.ss-design .ss-recrutement-photo .et_pb_image_wrap{ display:block; border-radius:var(--r-carte); overflow:hidden; }
body.ss-design .ss-recrutement-bloc{ width:100%; background:var(--blanc); border:1px solid var(--bordure); border-radius:var(--r-carte); padding:1.75rem; transition:border-color .3s var(--sortie), box-shadow .3s var(--sortie); }
body.ss-design .ss-recrutement-bloc h3{ font-size:1.4rem; margin:0 0 .7rem; }
body.ss-design .ss-recrutement-bloc p{ color:var(--encre-doux); line-height:1.6; }
body.ss-design .ss-recrutement-bloc[data-actif="true"]{ border-color:var(--accent); box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 35%, transparent); }

/* ---------- Appel final ---------- */
body.ss-design .ss-appel{ position:relative; color:var(--sur-nuit); background-color:var(--nuit) !important; background-size:cover !important; background-position:center 40% !important; }
body.ss-design .ss-appel::before{ content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(21,26,74,.96) 0%, rgba(21,26,74,.86) 55%, rgba(21,26,74,.55) 100%); }
body.ss-design .ss-appel > .et_pb_row{ position:relative; }
body.ss-design .ss-appel h2{ color:var(--sur-nuit); font-size:clamp(2rem,4vw,3rem); }
body.ss-design .ss-appel-detail .ss-detail{ font-size:.92rem; color:var(--sur-nuit-doux); }

/* ---------- Icônes en masque (pas de glyphes Divi) ---------- */
:root{
  --fleche-droite:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%2314162B" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14M13 6l6 6-6 6"/></svg>');
  --fleche-diag:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%2314162B" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><path d="M7 17L17 7M9 7h8v8"/></svg>');
  --coche:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6L9 17l-5-5"/></svg>');
}

/* ---------- Responsive ---------- */
@media (max-width:1040px){
  body.ss-design .ss-hero-row{ flex-direction:column; min-height:0; }
  /* En colonne, flex-basis porte sur la hauteur : il faut 0 0 auto, sinon les colonnes s'écrasent. */
  body.ss-design .ss-bloc .ss-hero-row > .et_pb_column{ flex:0 0 auto; width:100%; }
  body.ss-design .ss-tri{ max-width:560px; }
  body.ss-design .ss-diag-row,body.ss-design .ss-methode-row{ flex-direction:column; }
  body.ss-design .ss-bloc .ss-diag-row > .et_pb_column,body.ss-design .ss-bloc .ss-methode-row > .et_pb_column{ flex:0 0 auto; width:100%; }
  body.ss-design .ss-restitution{ max-width:520px; }
}
@media (max-width:760px){
  body.ss-design .ss-bloc .et_pb_row,body.ss-design .ss-bloc .et_pb_row_inner{ flex-direction:column; gap:1.5rem; }
  body.ss-design .ss-bloc .et_pb_row > .et_pb_column{ flex:0 0 auto !important; width:100%; }
  body.ss-design .ss-portes-row{ flex-direction:column; }
  body.ss-design .ss-porte-col{ border-right:0; border-bottom:1px solid var(--bordure); }
  body.ss-design .ss-porte-col:last-child{ border-bottom:0; }
  body.ss-design .ss-recrutement-photo img{ aspect-ratio:16/10; max-height:none; }
  body.ss-design .ss-article::after{ display:none; }
  body.ss-design .ss-article .et_pb_blurb_container{ padding-right:1rem; }
  body.ss-design .ss-appel::before{ background:rgba(21,26,74,.9); }
  body.ss-design .ss-bloc .ss-actions > .et_pb_column{ width:100%; }
  body.ss-design #page-container .et_pb_section a.et_pb_button.ss-bouton{ width:100%; justify-content:center; }
}

/* ============================================================
   Diagnostic de maturité IA — le questionnaire est un module Code,
   aucun module Divi ne sait calculer un score.
   ============================================================ */
body.ss-design .ss-quiz{ font-family:var(--police-texte); }
body.ss-design .ss-quiz-barre{ height:4px; border-radius:999px; background:var(--lavande); overflow:hidden; margin-bottom:1.2rem; }
body.ss-design .ss-quiz-progres{ display:block; height:100%; width:100%; background:var(--accent); border-radius:999px;
  transform:scaleX(0); transform-origin:left center; transition:transform .35s var(--sortie); }
body.ss-design .ss-quiz-compteur{ font-size:.85rem; color:var(--encre-doux); margin:0 0 1.2rem; }
body.ss-design .ss-quiz-axe{ font-family:var(--police-titre); font-weight:600; font-size:.85rem; color:var(--pervenche); margin:0 0 .35rem; }
body.ss-design .ss-quiz-question{ font-family:var(--police-titre); font-weight:700; font-size:1.55rem; line-height:1.2; letter-spacing:-0.02em; color:var(--encre); margin:0 0 1.4rem; }
body.ss-design .ss-quiz-reponses{ display:grid; gap:.6rem; }
body.ss-design .ss-quiz-reponse{ appearance:none; text-align:left; font:inherit; font-size:1rem; color:var(--encre); background:var(--fond); border:1px solid var(--bordure); border-radius:10px; padding:.95rem 1.1rem; cursor:pointer; transition:border-color .2s var(--sortie), background-color .2s var(--sortie); }
body.ss-design .ss-quiz-reponse:hover{ border-color:var(--accent); background:var(--blanc); }
body.ss-design .ss-quiz-reponse[aria-pressed="true"]{ border-color:var(--accent); box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 40%, transparent); }
body.ss-design .ss-quiz-retour{ appearance:none; background:transparent; border:0; font:inherit; font-size:.9rem; color:var(--encre-doux); cursor:pointer; padding:1rem 0 0; text-decoration:underline; text-underline-offset:.25em; }
body.ss-design .ss-quiz-scores{ display:grid; gap:1rem; margin-bottom:2rem; }
body.ss-design .ss-quiz-score{ display:grid; grid-template-columns:1fr auto; gap:.3rem .8rem; align-items:baseline; }
body.ss-design .ss-quiz-score-nom{ font-weight:600; color:var(--encre); }
body.ss-design .ss-quiz-score-valeur{ font-family:var(--police-titre); font-weight:800; font-size:1.5rem; color:var(--encre); }
body.ss-design .ss-quiz-score-valeur small{ font-size:.85rem; font-weight:500; color:var(--encre-doux); }
body.ss-design .ss-quiz-piste{ grid-column:1 / -1; height:10px; border-radius:999px; background:var(--lavande); overflow:hidden; }
body.ss-design .ss-quiz-remplissage{ display:block; height:100%; background:var(--accent); border-radius:999px; }
body.ss-design .ss-quiz-recos{ display:grid; gap:.8rem; }
body.ss-design .ss-quiz-reco{ display:grid; grid-template-columns:7.5rem 1fr; gap:1rem; align-items:start; padding:1rem 0; border-top:1px solid var(--bordure); }
body.ss-design .ss-quiz-reco b{ font-family:var(--police-titre); font-size:.85rem; color:var(--pervenche); }
body.ss-design .ss-quiz-reco strong{ display:block; font-family:var(--police-titre); font-size:1.05rem; color:var(--encre); margin-bottom:.25rem; }
body.ss-design .ss-quiz-reco span{ color:var(--encre-doux); font-size:.97rem; line-height:1.55; }
body.ss-design .ss-quiz-note{ font-size:.85rem; color:var(--encre-doux); margin:1.4rem 0 0; }
body.ss-design .ss-quiz-actions{ display:flex; flex-wrap:wrap; gap:.8rem; align-items:center; margin-top:1.6rem; }
body.ss-design .ss-quiz-bouton{ display:inline-flex; align-items:center; font-family:var(--police-titre); font-weight:600; background:var(--accent); color:var(--accent-texte); border-radius:8px; padding:.9rem 1.4rem; text-decoration:none; }
body.ss-design .ss-quiz-bouton:hover{ background:var(--accent-2); color:var(--accent-texte); }
body.ss-design .ss-quiz-recommencer{ appearance:none; background:transparent; border:0; font:inherit; font-size:.92rem; color:var(--encre-doux); cursor:pointer; text-decoration:underline; text-underline-offset:.25em; }
@media (max-width:560px){
  body.ss-design .ss-quiz-reco{ grid-template-columns:1fr; gap:.3rem; }
  body.ss-design .ss-quiz-question{ font-size:1.3rem; }
}

/* ============================================================
   Rangées de boutons (.ss-actions) : Divi ne propose pas de colonne
   « à la largeur du contenu », ses colonnes font toujours 1/2 ou 1/3.
   Une règle suffit pour que deux boutons se suivent au lieu de s'écarter.
   ============================================================ */
body.ss-design .ss-actions{ display:flex; flex-wrap:wrap; gap:.85rem; align-items:center; }
body.ss-design .ss-actions > .et_pb_column{ width:auto !important; margin:0 !important; float:none; }
body.ss-design .ss-actions .et_pb_button_module_wrapper{ margin:0; }
@media (max-width:560px){
  body.ss-design .ss-actions{ display:block; }
  body.ss-design .ss-actions > .et_pb_column{ width:100% !important; }
  body.ss-design .ss-actions > .et_pb_column + .et_pb_column{ margin-top:.85rem !important; }
}

/* Pied de page natif : seuls la marque et les listes de liens demandent un réglage
   que Divi n'expose pas (puces, graisse de la marque). */
body.ss-design .ss-pied ul{ list-style:none; margin:0; padding:0; }
body.ss-design .ss-pied li{ margin:0; }
body.ss-design .ss-pied a{ color:var(--encre-doux); text-decoration:none; }
body.ss-design .ss-pied a:hover{ color:var(--pervenche); }
body.ss-design .ss-pied .ss-pied-marque{ font-family:var(--police-titre); font-weight:800; font-size:1.3rem; letter-spacing:-0.03em; margin-bottom:.8rem; }
body.ss-design .ss-pied .ss-pied-marque a{ color:var(--encre); }
body.ss-design .ss-pied .ss-pied-marque a::before{ content:""; display:inline-block; width:12px; height:12px; border-radius:3px; background:var(--accent); transform:rotate(45deg); margin-right:.55rem; vertical-align:baseline; }

/* Les colonnes Divi flottent. Sur les mises en page du Theme Builder, la ligne ne les
   contient pas toujours : la section s'effondre et le pied de page remonte dans le texte.
   Une règle de confinement suffit, et elle est sans effet quand la ligne est déjà en flex. */
body.ss-design .et_pb_row::after,body.ss-design .et_pb_row_inner::after{ content:""; display:block; clear:both; }

/* Divi impose 'Open Sans' aux contrôles de formulaire par une règle de sa feuille
   principale, chargée après celle du thème enfant. Le réglage « police par défaut »
   des options du thème ne couvre pas ces sélecteurs : une règle est nécessaire ici. */
body.ss-design input, body.ss-design select, body.ss-design textarea,
body.ss-design label, body.ss-design button, body.ss-design .et_pb_contact_right{
  font-family: var(--police-texte);
}

/* ============================================================
   En-tête en modules Divi natifs (21/09/2026)
   Marque : module Texte. Liens : module Menu de Divi alimenté par le menu
   WordPress « Menu principal ». Appel à l'action : module Bouton.
   Le design reste ici ; le constructeur ne sert qu'aux textes et aux liens.
   ============================================================ */
body.ss-design .ss-entete{ position:fixed; left:0; right:0; top:0; z-index:60; }
/* La remise a zero des listes de l'accueil ne vaut que sur l'accueil : sans cette
   regle, les entrees du menu portent une puce sur toutes les autres pages. */
body.ss-design .ss-entete ul,body.ss-design .ss-entete li{ list-style:none; margin:0; padding:0; }
body.ss-design .ss-entete p{ margin:0; padding:0; }
body.admin-bar.ss-design .ss-entete{ top:32px; }
@media (max-width:782px){ body.admin-bar.ss-design .ss-entete{ top:46px; } }

/* La barre tient sur une seule ligne à toutes les largeurs. Sans cela Divi
   empilerait ses trois colonnes sous 980 px et l'en-tête ferait 200 px de haut. */
body.ss-design .ss-entete .ss-entete-barre{ display:flex; align-items:center; gap:1.4rem; }
body.ss-design .ss-entete .ss-entete-barre::after{ display:none; }
body.ss-design .ss-entete .ss-entete-barre > .et_pb_column{
  width:auto!important; margin:0!important; float:none; display:flex; align-items:center; min-height:76px; }
body.ss-design .ss-entete .ss-entete-barre > .ss-entete-col-marque,
body.ss-design .ss-entete .ss-entete-barre > .ss-entete-col-action{ flex:0 0 auto; }
body.ss-design .ss-entete .ss-entete-barre > .ss-entete-col-menu{ flex:1 1 auto; min-width:0; justify-content:center; }
body.ss-design .ss-entete .ss-entete-barre > .ss-entete-col-action{ margin-left:auto!important; }
body.ss-design .ss-entete .ss-entete-barre .et_pb_module{ margin:0!important; }

/* La marque : même losange que le pied, en blanc sur nuit. */
body.ss-design .ss-entete-marque{ font-family:var(--police-titre); font-weight:800; font-size:1.35rem;
  letter-spacing:-0.03em; line-height:1; margin:0; white-space:nowrap; }
body.ss-design .ss-entete-marque a{ color:var(--sur-nuit); text-decoration:none;
  display:inline-flex; align-items:center; gap:.5rem; }
body.ss-design .ss-entete-marque a::before{ content:""; width:14px; height:14px; border-radius:3px;
  background:var(--accent); transform:rotate(45deg); flex:none; }

/* Le module Menu : fond retiré, liens repris du design system.
   Divi pose opacity:.7 au survol de ses liens de menu ; on le neutralise. */
body.ss-design .ss-entete .et_pb_menu{ background-color:transparent!important; padding:0; }
body.ss-design .ss-entete .et_pb_menu_inner_container{ width:100%; }
body.ss-design .ss-entete .et_pb_menu__wrap{ justify-content:center; }
body.ss-design .ss-entete .et-menu-nav,body.ss-design .ss-entete .et-menu-nav > ul{ float:none; }
body.ss-design .ss-entete .et-menu{ display:flex; align-items:center; gap:1.35rem; margin:0; padding:0; }
body.ss-design .ss-entete .et-menu > li{ margin:0; padding:0; }
body.ss-design .ss-entete .et-menu > li > a{ font-size:.95rem; font-weight:500; color:var(--sur-nuit-doux);
  padding:.35rem 0; white-space:nowrap; text-decoration:underline; text-decoration-color:transparent;
  text-underline-offset:.45em; text-decoration-thickness:2px;
  transition:color .2s, text-decoration-color .25s var(--sortie); }
body.ss-design .ss-entete .et-menu > li > a:hover{ color:var(--sur-nuit); opacity:1;
  text-decoration-color:var(--accent); }
body.ss-design .ss-entete .et-menu > li.current-menu-item > a,
body.ss-design .ss-entete .et-menu > li.current-menu-ancestor > a{ color:var(--sur-nuit);
  text-decoration-color:var(--accent); }

/* Sous-menus déroulants : disponibles dès que le client imbrique une entrée
   dans Apparence → Menus, sans rien changer ici. */
body.ss-design .ss-entete .et-menu li ul.sub-menu{ background:var(--nuit-2); border:1px solid var(--bordure-nuit);
  border-top:2px solid var(--accent); border-radius:0 0 var(--r-bouton) var(--r-bouton);
  padding:.4rem 0; box-shadow:0 24px 48px -24px rgba(0,0,0,.65); width:15rem; }
body.ss-design .ss-entete .et-menu li li{ padding:0; }
body.ss-design .ss-entete .et-menu li li a{ display:block; width:auto; padding:.6rem 1.1rem;
  color:var(--sur-nuit-doux); font-size:.92rem; text-decoration:none; }
body.ss-design .ss-entete .et-menu li li a:hover{ color:var(--accent); background:transparent; opacity:1; }

/* Bascule au menu déroulant : l'en-tête complet demande ~1240 px, pas les 980 px
   de Divi. Voir README, « Largeurs intermédiaires ». */
@media (min-width:1241px){
  body.ss-design .ss-entete .et_mobile_nav_menu{ display:none!important; }
}
@media (max-width:1240px){
  body.ss-design .ss-entete .et_pb_menu__menu{ display:none!important; }
  body.ss-design .ss-entete .et_mobile_nav_menu{ display:block!important; margin:0; }
  /* Le burger passe a droite, apres le bouton : l'ordre de l'ancien en-tete. */
  body.ss-design .ss-entete .ss-entete-barre > .ss-entete-col-menu{ flex:0 0 auto; order:3; }
  body.ss-design .ss-entete .ss-entete-barre > .ss-entete-col-action{ order:2; }
}
/* Le pictogramme du burger est dessine ici : la regle `.mobile_menu_bar:before`
   de Divi (police ETmodules) est absente du CSS dynamique servi, l'icone
   n'apparaissait pas. Trois barres, comme l'ancien en-tete en code. */
body.ss-design .ss-entete .et_mobile_nav_menu{ float:none; margin:0; width:44px; height:44px; flex:none; }
body.ss-design .ss-entete .mobile_nav{ width:44px; height:44px; display:flex; align-items:center;
  justify-content:center; background:transparent; border:1px solid var(--bordure-nuit);
  border-radius:var(--r-bouton); cursor:pointer; padding:0; }
body.ss-design .ss-entete .mobile_menu_bar{ display:block; position:relative; width:18px; height:2px;
  background:var(--sur-nuit); font-size:0; line-height:0; }
body.ss-design .ss-entete .mobile_menu_bar:before,
body.ss-design .ss-entete .mobile_menu_bar:after{ content:""!important; position:absolute; left:0; top:auto;
  width:18px; height:2px; background:var(--sur-nuit); font-size:0;
  transition:transform .25s var(--sortie), top .25s var(--sortie); }
body.ss-design .ss-entete .mobile_menu_bar:before{ top:-6px; }
body.ss-design .ss-entete .mobile_menu_bar:after{ top:6px; }
/* Divi remplace la classe `closed` par `opened` au clic. */
body.ss-design .ss-entete .mobile_nav.opened .mobile_menu_bar{ background:transparent; }
body.ss-design .ss-entete .mobile_nav.opened .mobile_menu_bar:before{ top:0; transform:rotate(45deg); }
body.ss-design .ss-entete .mobile_nav.opened .mobile_menu_bar:after{ top:0; transform:rotate(-45deg); }

/* Le panneau deroulant : pleine largeur sous la barre, fond nuit. */
body.ss-design .ss-entete .et_mobile_menu{ display:none; position:absolute; left:0; right:0; top:76px; width:auto;
  background:var(--nuit)!important; border:0; border-top:1px solid var(--bordure-nuit);
  padding:.2rem clamp(1rem,4vw,3rem) 1rem; box-shadow:0 30px 60px -30px rgba(0,0,0,.7); }
body.ss-design .ss-entete .et_mobile_menu.ss-ouvert{ display:block; }
body.ss-design .ss-entete .et_mobile_menu li{ margin:0; padding:0; list-style:none; }
body.ss-design .ss-entete .et_mobile_menu ul.sub-menu{ position:static; width:auto; background:transparent;
  border:0; box-shadow:none; padding:0 0 0 1rem; }
body.ss-design .ss-entete .et_mobile_menu li a{ display:block; color:var(--sur-nuit); font-size:1rem;
  font-weight:500; padding:.95rem 0; border-bottom:1px solid var(--bordure-nuit); text-decoration:none; }
body.ss-design .ss-entete .et_mobile_menu li:last-child > a{ border-bottom:0; }
body.ss-design .ss-entete .et_mobile_menu li a:hover{ color:var(--accent); background:transparent; opacity:1; }

/* Le bouton : Divi pose module_class sur le <a> lui-meme, pas sur un conteneur. */
body.ss-design .ss-entete .et_pb_button_module_wrapper{ margin:0!important; }
body.ss-design a.et_pb_button.ss-entete-bouton{ white-space:nowrap; }
@media (max-width:560px){
  body.ss-design .ss-entete .ss-entete-barre{ gap:.6rem; }
  body.ss-design .ss-entete-marque{ font-size:1.12rem; }
  body.ss-design a.et_pb_button.ss-entete-bouton{ font-size:14px!important; padding:11px 13px!important; }
}

/* Dans le constructeur visuel (body.et-fb), une barre en `position:fixed` flotte
   au-dessus du canevas et se laisse mal sélectionner : elle redevient statique
   pour l'édition, et le décalage de 76 px du corps n'a plus lieu d'être. */
body.et-fb .ss-entete{ position:relative!important; top:auto!important; }
body.et-fb.ss-design{ padding-top:0!important; }