/**
 * Sommaire à languette (mobile), maquette validée par Akim le 11/09/2026 :
 * output/maquettes-validees/03-sommaire-mobile.html (md5 23d249cb543a09ae0b49dbf0b08d6d4a).
 * Absent en bureau (règle 3 de la maquette) : la feuille ne charge que sous 981 px
 * (rupture mobile de Divi), comme lep-menu-mobile et la barre d'appel de lep-pied-de-page.
 */
:root{
  --lep-bleu:#0D57CB; --lep-nuit:#001C47; --lep-jaune:#F4C709; --lep-brume:#F2F9FE;
  --lep-encre:#0B1526; --lep-trait:#E3EAF3;
  --lep-titre:"Outfit",Helvetica,Arial,sans-serif;
  --lep-texte:"Plus Jakarta Sans",Helvetica,Arial,sans-serif;
  --lep-matiere:linear-gradient(180deg,rgba(13,87,203,.30) 0,rgba(0,28,71,0) 70%),
                repeating-linear-gradient(135deg,rgba(255,255,255,.03) 0 1px,transparent 1px 7px);
}

/* Polices du composant : Outfit et Plus Jakarta Sans sont des fichiers VARIABLES que le site déclare en graisses
   fixes (400/700) ; une graisse 500 ou 600 y tombe sur une autre face. La maquette déclare la plage entière :
   mêmes fichiers, aucun téléchargement de plus, déclarations globales intactes. Contrôle DA ticket 38, 11/09/2026. */
@font-face{font-family:"LEP Outfit";font-style:normal;font-weight:100 900;font-display:swap;src:url(polices/fonts/outfit-400-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:"LEP Outfit";font-style:normal;font-weight:100 900;font-display:swap;src:url(polices/fonts/outfit-400-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:"LEP Jakarta";font-style:normal;font-weight:200 800;font-display:swap;src:url(polices/fonts/plus-jakarta-sans-400-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:"LEP Jakarta";font-style:normal;font-weight:200 800;font-display:swap;src:url(polices/fonts/plus-jakarta-sans-400-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}
.lep-som-languette,.lep-som-voile,.lep-som-panneau{--lep-titre:"LEP Outfit","Outfit",Helvetica,Arial,sans-serif;--lep-texte:"LEP Jakarta","Plus Jakarta Sans",Helvetica,Arial,sans-serif;
  /* Ticket 50 : lep-pages.css (--lep-encre #0F1E33) et lep-menu-mobile.css (--lep-matiere à 40 %) redéfinissent ces
     jetons sur :root après cette feuille ; le composant garde les valeurs de la maquette 03 sur ses propres racines. */
  --lep-bleu:#0D57CB;--lep-nuit:#001C47;--lep-jaune:#F4C709;--lep-brume:#F2F9FE;--lep-encre:#0B1526;--lep-trait:#E3EAF3;
  --lep-matiere:linear-gradient(180deg,rgba(13,87,203,.30) 0,rgba(0,28,71,0) 70%),
                repeating-linear-gradient(135deg,rgba(255,255,255,.03) 0 1px,transparent 1px 7px)}

.lep-som-languette{position:fixed;right:0;top:50%;z-index:8000;width:36px;height:132px;padding:12px 0 0 7px;
  display:flex;flex-direction:column;align-items:center;gap:10px;border:0;border-radius:10px 0 0 10px;cursor:pointer;
  color:#fff;background-color:var(--lep-nuit);background-image:var(--lep-matiere);
  box-shadow:-8px 0 20px -10px rgba(0,28,71,.6);
  transform:translate(0,-50%);transition:transform .25s ease,opacity .2s ease;-webkit-tap-highlight-color:transparent}
.lep-som-languette::before{content:"";position:absolute;top:0;bottom:0;right:0;left:-8px}
.lep-som-languette[data-visible="0"]{transform:translate(110%,-50%);opacity:0;pointer-events:none}
.lep-som-languette:focus-visible{outline:2px solid var(--lep-jaune);outline-offset:2px}
.lep-som-compteur{font-family:var(--lep-titre);font-size:12.5px;font-weight:700;line-height:1;color:var(--lep-jaune);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.lep-som-mot{writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--lep-titre);font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;line-height:1}
.lep-som-jauge{position:absolute;left:5px;top:12px;bottom:12px;width:3px;border-radius:2px;background:rgba(255,255,255,.16);overflow:hidden}
.lep-som-jauge i{position:absolute;left:0;right:0;top:0;height:var(--lep-som-p,0%);background:var(--lep-jaune);transition:height .15s linear}

.lep-som-voile{position:fixed;inset:0;z-index:9500;background:rgba(0,28,71,.52);opacity:0;visibility:hidden;transition:opacity .2s ease,visibility 0s .2s}
.lep-som-panneau{position:fixed;top:0;right:0;bottom:0;z-index:9600;width:min(86vw,340px);display:flex;flex-direction:column;
  font-family:var(--lep-texte);font-size:16px;font-weight:400;line-height:normal;color:var(--lep-encre);
  background:#fff;box-shadow:-24px 0 40px -24px rgba(0,28,71,.6);transform:translateX(102%);visibility:hidden;
  transition:transform .26s cubic-bezier(.2,.8,.2,1),visibility 0s .26s;padding-bottom:env(safe-area-inset-bottom,0px)}
html[data-som-ouvert="1"] .lep-som-voile{opacity:1;visibility:visible;transition-delay:0s}
html[data-som-ouvert="1"] .lep-som-panneau{transform:none;visibility:visible;transition-delay:0s}
html[data-som-ouvert="1"] .lep-som-languette{transform:translate(110%,-50%);opacity:0}

.lep-som-tete{position:relative;padding:18px 60px 16px 20px;color:#fff;background-color:var(--lep-nuit);background-image:var(--lep-matiere)}
.lep-som-sur{margin:0 0 3px;font-family:var(--lep-titre);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--lep-jaune)}
/* Divi ajoute 1em sous chaque paragraphe (+12 px sous « Sommaire ») : la maquette n'en porte pas. */
.lep-som-tete .lep-som-sur,.lep-som-tete .lep-som-titre{padding-bottom:0}
.lep-som-titre{margin:0;font-family:var(--lep-titre);font-size:21px;font-weight:700;line-height:1.15}
.lep-som-fermer{position:absolute;right:8px;top:50%;width:44px;height:44px;margin-top:-22px;padding:0;border:0;border-radius:6px;background:transparent;color:#fff;cursor:pointer}
.lep-som-fermer::before,.lep-som-fermer::after{content:"";position:absolute;left:12px;top:21px;width:20px;height:2px;border-radius:1px;background:currentColor}
.lep-som-fermer::before{transform:rotate(45deg)}
.lep-som-fermer::after{transform:rotate(-45deg)}
.lep-som-fermer:focus-visible{outline:2px solid var(--lep-jaune);outline-offset:-2px}

.lep-som-liste{list-style:none;margin:0;padding:0;flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain}
.lep-som-lien{position:relative;display:grid;grid-template-columns:26px minmax(0,1fr);column-gap:8px;align-items:baseline;min-height:52px;
  padding:13px 18px 13px 20px;border-bottom:1px solid var(--lep-trait);
  font-size:15px;font-weight:500;line-height:1.35;color:var(--lep-encre);text-decoration:none;-webkit-tap-highlight-color:transparent}
.lep-som-lien b{font-family:var(--lep-titre);font-size:14px;font-weight:700;color:var(--lep-bleu);font-variant-numeric:tabular-nums}
.lep-som-lien:active{background:var(--lep-brume)}
.lep-som-lien:focus-visible{outline:2px solid var(--lep-bleu);outline-offset:-3px}
.lep-som-lien[aria-current="location"]{background:var(--lep-brume);font-weight:700;box-shadow:inset 4px 0 0 var(--lep-jaune)}
.lep-som-lien[aria-current="location"] b{color:var(--lep-nuit)}
.lep-som-haut{display:flex;align-items:center;gap:8px;min-height:52px;padding:0 20px;border-top:1px solid var(--lep-trait);
  font-family:var(--lep-titre);font-size:15px;font-weight:600;color:var(--lep-bleu);text-decoration:none}
.lep-som-haut svg{width:16px;height:16px}
.lep-som-haut:focus-visible{outline:2px solid var(--lep-bleu);outline-offset:-3px}

@media (prefers-reduced-motion:reduce){.lep-som-languette,.lep-som-panneau,.lep-som-voile,.lep-som-jauge i{transition:none}}
@media print{.lep-som-languette,.lep-som-panneau,.lep-som-voile{display:none}}
/* absent en bureau (règle 3 de la maquette) : le composant existe dans le HTML de toute
   page qui utilise le modèle footer-2, cette règle est ce qui le cache au-delà de 980 px. */
@media (min-width:981px){.lep-som-languette,.lep-som-panneau,.lep-som-voile{display:none}}

/* =================== Sommaire de bureau (≥ 981 px) et bouton d'appel épinglé ===================
   Maquette validée par Akim le 12/09/2026 : output/maquettes-validees/refonte/14-sommaire-bureau-v4.html
   (bloc <style>, lignes 18-108). Valeurs transcrites telles quelles, relevé dans
   output/design-qc/sommaire-bureau-releve.md. Le composant mobile .lep-som-* n'est pas touché. */
.lep-som-b{display:none}
@media (min-width:981px){
.lep-som-b{display:block;
  /* jetons portés par le composant, jamais sur :root : lep-pages.css et lep-menu-mobile.css les
     repeignent après cette feuille (ticket 50). Valeurs de refonte/commun-v3.css. */
  --lep-bleu:#0D57CB;--lep-nuit:#001C47;--lep-jaune:#F4C709;--lep-encre:#0F1E33;--lep-corps:#3B4B60;
  --lep-ligne:#E4EAF3;--lep-teinte:#F5F9FF;
  --lep-ombre:0 10px 30px -12px rgba(13,50,110,.16);
  --lep-trame:repeating-linear-gradient(135deg,rgba(255,255,255,.028) 0 1px,transparent 1px 7px);
  --lep-titre:"LEP Outfit","Outfit",Helvetica,Arial,sans-serif;
  --lep-texte:"LEP Jakarta","Plus Jakarta Sans",Helvetica,Arial,sans-serif;
  /* ce que le composant hérite du corps de la maquette (commun-v3.css body : 17px/400/1.7, --lep-corps) ;
     Divi sert 18px/500/1,7 et une encre noire, qui remontaient la tête du panneau de 9 px, la surtitre de
     10 px et le numéro du pied de 1 px (mesure du 12/09/2026, output/design-qc/sommaire-bureau-releve.md). */
  font-family:var(--lep-texte);font-size:17px;font-weight:400;line-height:1.7;color:var(--lep-corps)}
.lep-som-b *,.lep-som-b *::before,.lep-som-b *::after{box-sizing:border-box}

/* la languette, collée au bord droit, à mi-hauteur — hauteur sur le contenu, pas figée */
.lep-som-b-languette{display:flex;position:fixed;right:0;top:50%;z-index:8000;width:46px;height:auto;min-height:150px;padding:16px 0;
  flex-direction:column;align-items:center;gap:12px;border:0;border-radius:14px 0 0 14px;cursor:pointer;
  color:#fff;background-color:var(--lep-nuit);background-image:var(--lep-trame);
  box-shadow:-10px 0 24px -12px rgba(0,28,71,.55);
  transform:translate(0,-50%);transition:transform .25s ease,opacity .2s ease,box-shadow .2s ease}
.lep-som-b-languette:hover{box-shadow:-14px 0 28px -10px rgba(0,28,71,.7)}
.lep-som-b-languette[data-visible="0"]{transform:translate(110%,-50%);opacity:0;pointer-events:none}
.lep-som-b-languette:focus-visible{outline:2px solid var(--lep-jaune);outline-offset:2px}

/* le bouton d'appel — même bord, juste au-dessus de la languette, TOUJOURS visible (Akim, 12/09/2026).
   CSS seul : aucun script, il s'ouvre au survol et au clavier. */
.lep-tel-b{display:flex;position:fixed;right:0;top:calc(50% - 151px);z-index:8001;width:46px;height:auto;
  align-items:center;justify-content:flex-end;border-radius:14px 0 0 14px;text-decoration:none;overflow:hidden;
  color:var(--lep-nuit);background:var(--lep-jaune);
  box-shadow:-10px 0 24px -12px rgba(0,28,71,.55);
  transition:width .2s ease,box-shadow .2s ease}
.lep-tel-b-col{display:flex;width:46px;flex:0 0 46px;align-items:center;justify-content:center;padding:14px 0}
.lep-tel-b-col svg{width:22px;height:22px;flex:0 0 auto}
.lep-tel-b-num{flex:0 0 auto;padding-left:16px;font-family:var(--lep-titre);font-size:17px;font-weight:700;white-space:nowrap;
  opacity:0;transition:opacity .18s ease}
.lep-tel-b:hover,.lep-tel-b:focus-visible,.lep-tel-b:focus-within{width:214px;box-shadow:-14px 0 28px -10px rgba(0,28,71,.7)}
.lep-tel-b:hover,.lep-tel-b:focus-visible,.lep-tel-b:focus-within,.lep-tel-b:visited{color:var(--lep-nuit)}
.lep-tel-b:hover .lep-tel-b-num,.lep-tel-b:focus-visible .lep-tel-b-num{opacity:1}
.lep-tel-b:focus-visible{outline:2px solid var(--lep-nuit);outline-offset:2px}
[data-som-b-ouvert="1"] .lep-tel-b{transform:translateX(110%);opacity:0;pointer-events:none}

.lep-som-b-compteur{font-family:var(--lep-titre);font-size:14px;font-weight:700;line-height:1;color:var(--lep-jaune);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.lep-som-b-mot{writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--lep-titre);font-size:12.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;line-height:1}
.lep-som-b-jauge{position:relative;width:3px;flex:1 1 auto;min-height:30px;border-radius:2px;background:rgba(255,255,255,.18);overflow:hidden}
.lep-som-b-jauge i{position:absolute;left:0;right:0;top:0;height:var(--lep-som-p,0%);background:var(--lep-jaune);transition:height .15s linear}

/* l'infobulle : la section en cours, lisible sans ouvrir le panneau */
.lep-som-b-bulle{position:fixed;right:58px;top:50%;z-index:7999;max-width:260px;padding:10px 14px;border-radius:8px;
  transform:translateY(-50%) translateX(6px);background:#fff;color:var(--lep-encre);font-family:var(--lep-texte);font-size:14px;font-weight:600;line-height:1.35;
  box-shadow:var(--lep-ombre);opacity:0;visibility:hidden;transition:opacity .15s ease,transform .15s ease,visibility 0s .15s;pointer-events:none}
.lep-som-b-bulle::after{content:"";position:absolute;right:-6px;top:50%;width:12px;height:12px;margin-top:-6px;background:#fff;transform:rotate(45deg)}
.lep-som-b-languette:hover+.lep-som-b-bulle,.lep-som-b-languette:focus-visible+.lep-som-b-bulle{opacity:1;visibility:visible;transform:translateY(-50%) translateX(0);transition-delay:0s}
[data-som-b-ouvert="1"] .lep-som-b-bulle{opacity:0!important;visibility:hidden!important}

/* le panneau : glisse depuis le bord, un voile léger derrière */
.lep-som-b-voile{position:fixed;inset:0;z-index:9500;background:rgba(0,28,71,.34);opacity:0;visibility:hidden;transition:opacity .2s ease,visibility 0s .2s}
.lep-som-b-panneau{position:fixed;top:0;right:0;bottom:0;z-index:9600;width:min(24vw,380px);min-width:320px;display:flex;flex-direction:column;
  font-family:var(--lep-texte);background:#fff;box-shadow:-28px 0 48px -26px rgba(0,28,71,.5);transform:translateX(102%);visibility:hidden;
  transition:transform .28s cubic-bezier(.2,.8,.2,1),visibility 0s .28s}
[data-som-b-ouvert="1"] .lep-som-b-voile{opacity:1;visibility:visible;transition-delay:0s}
[data-som-b-ouvert="1"] .lep-som-b-panneau{transform:none;visibility:visible;transition-delay:0s}
[data-som-b-ouvert="1"] .lep-som-b-languette{transform:translate(110%,-50%);opacity:0}

.lep-som-b-tete{position:relative;padding:26px 56px 22px 30px;color:#fff;background-color:var(--lep-nuit);background-image:var(--lep-trame)}
.lep-som-b-sur{margin:0 0 4px;padding:0;font-family:var(--lep-titre);font-size:12.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--lep-jaune)}
.lep-som-b-titre{margin:0;padding:0;font-family:var(--lep-titre);font-size:23px;font-weight:700;line-height:1.15;color:#fff}
.lep-som-b-fermer{position:absolute;right:14px;top:26px;width:36px;height:36px;padding:0;border:0;border-radius:6px;background:transparent;color:#fff;cursor:pointer}
.lep-som-b-fermer:hover{background:rgba(255,255,255,.12)}
.lep-som-b-fermer::before,.lep-som-b-fermer::after{content:"";position:absolute;left:10px;top:17px;width:16px;height:2px;border-radius:1px;background:currentColor}
.lep-som-b-fermer::before{transform:rotate(45deg)}
.lep-som-b-fermer::after{transform:rotate(-45deg)}
.lep-som-b-fermer:focus-visible{outline:2px solid var(--lep-jaune);outline-offset:-2px}

.lep-som-b-liste{list-style:none;margin:0;padding:10px 0;flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain}
.lep-som-b-liste li{margin:0;padding:0;list-style:none}
.lep-som-b-lien{position:relative;display:grid;grid-template-columns:28px minmax(0,1fr);column-gap:10px;align-items:baseline;
  padding:12px 24px 12px 30px;font-size:15px;font-weight:500;line-height:1.4;color:var(--lep-corps);text-decoration:none}
.lep-som-b-lien b{font-family:var(--lep-titre);font-size:13px;font-weight:700;color:var(--lep-bleu);font-variant-numeric:tabular-nums}
.lep-som-b-lien:hover{background:var(--lep-teinte);color:var(--lep-encre)}
.lep-som-b-lien:focus-visible{outline:2px solid var(--lep-bleu);outline-offset:-3px}
.lep-som-b-lien[aria-current="location"]{background:var(--lep-teinte);color:var(--lep-encre);font-weight:700;box-shadow:inset 4px 0 0 var(--lep-jaune)}
.lep-som-b-lien[aria-current="location"] b{color:var(--lep-nuit)}

/* le numéro au pied du panneau (Akim, 12/09/2026) */
.lep-som-b-tel{display:flex;align-items:center;gap:10px;min-height:60px;padding:0 30px;text-decoration:none;border-top:1px solid var(--lep-ligne);color:var(--lep-nuit);background:var(--lep-jaune)}
.lep-som-b-tel:hover,.lep-som-b-tel:focus-visible,.lep-som-b-tel:visited{color:var(--lep-nuit)}
.lep-som-b-tel svg{width:20px;height:20px;flex:0 0 auto}
.lep-som-b-tel span{font-family:var(--lep-titre);font-size:19px;font-weight:700;letter-spacing:.01em}
.lep-som-b-tel:hover span{text-decoration:underline}
.lep-som-b-tel:focus-visible{outline:2px solid var(--lep-nuit);outline-offset:-3px}
.lep-som-b-haut{display:flex;align-items:center;gap:8px;min-height:52px;padding:0 30px;border-top:1px solid var(--lep-ligne);
  font-family:var(--lep-titre);font-size:15px;font-weight:600;color:var(--lep-bleu);text-decoration:none}
.lep-som-b-haut:hover{background:var(--lep-teinte)}
.lep-som-b-haut svg{width:16px;height:16px}
.lep-som-b-haut:focus-visible{outline:2px solid var(--lep-bleu);outline-offset:-3px}

@media (prefers-reduced-motion:reduce){.lep-som-b-languette,.lep-som-b-panneau,.lep-som-b-voile,.lep-som-b-bulle,.lep-som-b-jauge i{transition:none}}
@media print{.lep-som-b{display:none}}
}
