/* Panneau « Zones d'interventions » du menu bureau des Épavistes — composant de la maquette validée par
   Akim le 11/09/2026 (output/maquettes-validees/02-menu-zones-bureau.html, md5 2715a5734806c6f6ac879d16c6f84e80).
   Chargé seulement à partir de 981 px (voir lep-menu-bureau.php). */

.lep-mega,.lep-voile{
  --lep-bleu:#0D57CB; --lep-nuit:#001C47; --lep-jaune:#F4C709; --lep-brume:#F2F9FE;
  --lep-gris:#5B6A82; --lep-encre:#0B1526; --lep-trait:#E3EAF3;
  --lep-titre:"LEP Outfit","Outfit",Helvetica,Arial,sans-serif;
  --lep-texte:"Plus Jakarta Sans",Helvetica,Arial,sans-serif;
  --lep-matiere:linear-gradient(160deg,rgba(13,87,203,.38) 0,rgba(0,28,71,0) 55%),
                repeating-linear-gradient(135deg,rgba(255,255,255,.03) 0 1px,transparent 1px 7px);
}
.lep-mega *,.lep-mega,.lep-voile{box-sizing:border-box}
.lep-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* le module Divi qui porte le déclencheur (voir docs/etat-site/pages/229891.divi) */
.lep-menu-bureau-hote{position:relative}

/* la liste déroulante native de Divi, sous « Zones d'interventions », s'efface : ce panneau la remplace */
.lep-decl-hote>ul.sub-menu{display:none!important}
/* Déclencheur ouvert : bleu, chevron retourné (le chevron est le glyphe ::after de Divi). La couleur de
   Divi est posée en !important par le modèle d'en-tête (0,2,3) : réponse (0,3,3) en !important. */
.et_pb_menu ul li a.lep-declencheur::after{transition:transform .18s ease}
.et_pb_menu ul li a.lep-declencheur[aria-expanded="true"]{color:var(--lep-bleu-decl,#0D57CB)!important}
.et_pb_menu ul li a.lep-declencheur[aria-expanded="true"]::after{transform:rotate(180deg)}

/* Panneau et voile : écrits en fin de page (wp_footer), placés sous la bande du menu par le script
   (--lep-mega-haut = bas de la section Divi qui porte le menu, en coordonnées du document). */
.lep-voile{position:absolute;left:0;right:0;top:var(--lep-mega-haut,166px);height:100vh;z-index:9998;background:rgba(0,28,71,.20)}
.lep-voile[hidden]{display:none}

.lep-mega{position:absolute;left:0;right:0;top:var(--lep-mega-haut,166px);z-index:9999;background:#fff;
  border-top:1px solid var(--lep-trait);box-shadow:0 30px 50px -26px rgba(0,28,71,.45);
  font-family:var(--lep-texte);font-size:16px;font-weight:400;line-height:normal;color:var(--lep-encre)}
.lep-mega[hidden]{display:none}
/* le trait jaune sous le déclencheur ouvert, posé au bas de la bande du menu (maquette : 3 px, du début du
   libellé à la fin du chevron) ; abscisse et largeur relevées par le script sur le lien Divi */
.lep-mega::before{content:"";position:absolute;top:-4px;left:var(--lep-decl-x,0);width:var(--lep-decl-l,0);height:3px;background:var(--lep-jaune)}
/* Héritages de Divi neutralisés : paragraphes à 1em de marge basse, puces à 15 px de marge basse, et
   « ul:not(.sub-menu){padding-left:30px!important} » du modèle d'en-tête sur toutes les listes. */
.lep-mega p{padding-bottom:0}
.lep-mega .lep-mega__liens{padding:0!important;list-style:none;margin:0}
.lep-mega .lep-mega__liens>li{padding:0;margin:0;line-height:normal}
.lep-mega__cadre{width:calc(100% - 60px);max-width:1170px;margin:0 auto;padding:30px 0 0;display:grid;
  grid-template-columns:minmax(280px,424px) minmax(160px,180px) minmax(200px,220px) minmax(230px,256px);
  column-gap:30px}

.lep-mega__groupe+.lep-mega__groupe{margin-top:22px}
.lep-mega__region{display:flex;align-items:center;gap:8px;margin:0 0 6px;
  font-family:var(--lep-titre);font-size:14px;font-weight:600;line-height:1.2;letter-spacing:.01em;color:var(--lep-gris);white-space:nowrap}
.lep-mega__region::before{content:"";flex:none;width:12px;height:3px;background:var(--lep-jaune)}
.lep-mega__liens{display:grid;grid-template-columns:minmax(0,1fr);column-gap:16px}
.lep-mega__liens--duo{grid-template-columns:repeat(2,minmax(0,1fr))}
.lep-mega__lien{position:relative;display:flex;align-items:center;gap:9px;min-height:44px;padding:0 24px 0 6px;
  border-bottom:1px solid var(--lep-trait);font-size:15px;font-weight:500;color:var(--lep-encre);text-decoration:none;white-space:nowrap;
  transition:background-color .15s ease,color .15s ease}
.lep-mega__lien .lep-fleche{position:absolute;right:6px;top:50%;margin-top:-7px;width:14px;height:14px;opacity:0;transform:translateX(-5px);transition:opacity .15s ease,transform .15s ease;color:var(--lep-bleu)}
.lep-mega__lien:hover{background:var(--lep-brume);color:var(--lep-bleu)}
.lep-mega__lien:hover .lep-fleche,.lep-mega__lien:focus-visible .lep-fleche{opacity:1;transform:none}
.lep-mega__lien:focus-visible{outline:2px solid var(--lep-bleu);outline-offset:-2px;background:var(--lep-brume)}
/* Plaque restreinte au panneau : la plaque du héros des pages de zone porte le même nom (lep-pages.css, .lep-plaque :
   inline-flex, 36 px, marge 16 px, ombre, font 700 15px/1) et la repeignait ici — lignes à 53 px au lieu de 44
   (ticket 49). Chaque propriété qu'elle pose est donc remise à la valeur de la maquette 02. */
.lep-mega .lep-plaque{flex:0 0 auto;display:inline-grid;place-items:center;align-items:center;min-width:28px;height:21px;margin:0;padding:0 4px;border-radius:2px;
  background:var(--lep-bleu);color:#fff;box-shadow:none;font-family:var(--lep-titre);font-size:12.5px;font-weight:700;line-height:normal;letter-spacing:.02em;
  text-transform:none;font-variant-numeric:tabular-nums}
.lep-mega__lien.est-ici{font-weight:700;box-shadow:inset 3px 0 0 var(--lep-jaune);padding-left:11px}
.lep-mega .lep-mega__lien.est-ici .lep-plaque{background:var(--lep-jaune);color:var(--lep-nuit)}

.lep-mega__bas{grid-column:1 / 4;grid-row:2;display:flex;align-items:center;margin-top:24px;min-height:62px;border-top:2px solid var(--lep-encre)}
.lep-mega__tous{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding-right:12px;
  font-family:var(--lep-titre);font-size:17px;font-weight:600;color:var(--lep-bleu);text-decoration:none}
.lep-mega__tous svg{width:16px;height:16px;transition:transform .15s ease}
.lep-mega__tous:hover{text-decoration:underline;text-underline-offset:4px}
.lep-mega__tous:hover svg{transform:translateX(3px)}
.lep-mega__tous:focus-visible{outline:2px solid var(--lep-bleu);outline-offset:2px;border-radius:2px}

.lep-mega__rail{grid-column:4;grid-row:1 / 3;align-self:start;margin-bottom:26px;display:flex;flex-direction:column;gap:12px;
  padding:24px 22px 20px;border-radius:4px;color:#fff;background-color:var(--lep-nuit);background-image:var(--lep-matiere)}
.lep-mega__rail-sur{margin:0;font-family:var(--lep-titre);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--lep-jaune)}
.lep-mega__rail-titre{margin:0;font-family:var(--lep-titre);font-size:25px;font-weight:700;line-height:1.1;letter-spacing:-.01em}
.lep-mega__rail-ligne{margin:0 0 4px;font-size:14px;line-height:1.45;color:#C3D0E4}
.lep-mega__tel{display:flex;align-items:center;gap:12px;min-height:62px;padding:9px 14px;border-radius:4px;
  background:var(--lep-jaune);color:var(--lep-nuit);text-decoration:none;transition:transform .12s ease,box-shadow .12s ease}
.lep-mega__tel svg{width:22px;height:22px;flex:none}
.lep-mega__tel span{display:flex;flex-direction:column;line-height:1.1}
.lep-mega__tel em{font-style:normal;font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.lep-mega__tel strong{font-family:var(--lep-titre);font-size:24px;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.lep-mega__tel:hover{transform:translateY(-1px);box-shadow:0 10px 20px -12px rgba(244,199,9,.9)}
.lep-mega__tel:focus-visible{outline:2px solid #fff;outline-offset:3px}
.lep-mega__mail{display:inline-flex;align-items:center;min-height:44px;font-size:14px;color:#fff;text-decoration:underline;text-underline-offset:3px}
.lep-mega__mail:focus-visible{outline:2px solid #fff;outline-offset:2px}

@media (prefers-reduced-motion:reduce){.lep-mega__lien,.lep-mega__lien .lep-fleche,.et_pb_menu ul li a.lep-declencheur::after,.lep-mega__tel,.lep-mega__tous svg{transition:none}}
