/* =========================================================
   HÉ-SITE PAS — FEATURES / Mega menu (.mega-menu-reu)
   ========================================================= */
.mega-menu-reu{--hsp-mm-accent:var(--hsp-violet);--hsp-mm-border:var(--hsp-border);--hsp-mm-muted:var(--hsp-muted)}
.mega-menu-reu .menu{display:block!important;margin:0!important;padding:0!important}
.mega-menu-reu .menu>li{margin:0!important;padding:0!important;border-bottom:1px solid var(--hsp-mm-border)}
.mega-menu-reu .menu>li:last-child{border-bottom:0}
.mega-menu-reu .menu>li>a{position:relative;display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;text-align:left!important;gap:4px;min-height:76px;padding:10px 50px 10px 64px!important;color:var(--hsp-text,#f6f3ff)!important;text-decoration:none!important;border-radius:12px;transition:background .25s ease}
.mega-menu-reu .mega-menu-label{display:block!important;width:100%;text-align:left!important;color:var(--hsp-text,#f6f3ff);font-size:16px;font-weight:600;line-height:1.2;transition:transform .25s ease,color .25s ease}
.mega-menu-reu .mega-menu-desc{display:block!important;width:100%;text-align:left!important;white-space:normal!important;max-width:calc(100% - 12px);color:var(--hsp-mm-muted);font-size:12.5px;font-weight:400;line-height:1.4;transition:transform .25s ease,color .25s ease}
.mega-menu-reu .menu>li>a:hover,.mega-menu-reu .current-menu-item>a{background:linear-gradient(90deg,rgba(199,164,255,.11),rgba(199,164,255,.025) 75%,transparent)}
.mega-menu-reu .menu>li>a:hover .mega-menu-label,.mega-menu-reu .menu>li>a:hover .mega-menu-desc{transform:translateX(2px)}
.mega-menu-reu .menu>li>a:hover .mega-menu-desc{color:var(--hsp-text-soft)}



/*
 * Compatibilité anciennes versions : les anciens pictos étaient placés sur a::before.
 * On les neutralise explicitement afin qu'ils ne puissent pas se superposer aux nouveaux SVG.
 */
.mega-menu-reu .menu>li>a::before{
  content:none!important;
  display:none!important;
  width:0!important;
  height:0!important;
  background:none!important;
  background-image:none!important;
  -webkit-mask:none!important;
  mask:none!important;
}

/* Navigation interne : chevron compact, cohérent avec le logo < > */
.mega-menu-reu .menu>li>a::after{
  content:"\f054";
  position:absolute;
  right:16px;
  top:50%;
  transform:translateY(-50%);
  color:var(--hsp-subtle);
  font-family:fontawesome;
  font-size:11px;
  font-weight:400;
  line-height:1;
  opacity:.82;
  transition:color .25s ease,transform .25s ease,opacity .25s ease;
}
.mega-menu-reu .menu>li>a:hover::after{
  color:var(--hsp-mm-accent);
  transform:translate(3px,-50%);
  opacity:1;
}







.mega-menu-reu .mega-menu-icon{
  position:absolute;
  left:8px;
  top:50%;
  transform:translateY(-50%);
  display:grid;
  place-items:center;
  width:40px;
  height:40px;
  border:1px solid var(--hsp-mm-border);
  border-radius:11px;
  background:rgba(255,255,255,.04);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  transition:transform .25s ease,background-color .25s ease,border-color .25s ease;
}
.mega-menu-reu .mega-menu-icon::before{
  content:"";
  display:block;
  width:22px;
  height:22px;
  background:var(--hsp-mm-accent);
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-position:center;
  mask-position:center;
  -webkit-mask-size:contain;
  mask-size:contain;
  transition:background-color .25s ease,transform .25s ease;
}
.mega-menu-reu .menu>li>a:hover .mega-menu-icon{
  transform:translateY(-50%) scale(1.05);
  background:rgba(177,138,233,.11);
  border-color:color-mix(in srgb,var(--hsp-mm-accent) 28%,transparent);
}
.mega-menu-reu .menu>li>a:hover .mega-menu-icon::before{
  background:var(--hsp-lilac);
  transform:scale(1.03);
}

/* Les 3 premiers reprennent les pictos utilisés sur la homepage */
.mega-menu-reu .menu>li:nth-child(1) .mega-menu-icon::before{
  -webkit-mask-image:url("../icons/menu-showcase.svg");
  mask-image:url("../icons/menu-showcase.svg");
}
.mega-menu-reu .menu>li:nth-child(2) .mega-menu-icon::before{
  -webkit-mask-image:url("../icons/menu-ecommerce.svg");
  mask-image:url("../icons/menu-ecommerce.svg");
}
.mega-menu-reu .menu>li:nth-child(3) .mega-menu-icon::before{
  -webkit-mask-image:url("../icons/menu-elearning.svg");
  mask-image:url("../icons/menu-elearning.svg");
}
.mega-menu-reu .menu>li:nth-child(4) .mega-menu-icon::before{
  -webkit-mask-image:url("../icons/menu-ai.svg");
  mask-image:url("../icons/menu-ai.svg");
}
.mega-menu-reu .menu>li:nth-child(5) .mega-menu-icon::before{
  -webkit-mask-image:url("../icons/menu-code.svg");
  mask-image:url("../icons/menu-code.svg");
}
.mega-menu-reu .menu>li:nth-child(6) .mega-menu-icon::before{
  -webkit-mask-image:url("../icons/menu-maintenance.svg");
  mask-image:url("../icons/menu-maintenance.svg");
}

@media(max-width:900px){.mega-menu-reu .menu>li>a{min-height:68px;padding-right:44px!important}.mega-menu-reu .mega-menu-desc{font-size:12px}}


/* Les pictos issus de la homepage sont un peu plus détaillés :
   on les agrandit très légèrement pour garder la même présence visuelle
   que IA / Développement / Maintenance. */
.mega-menu-reu .menu>li:nth-child(-n+3) .mega-menu-icon::before{
  width:23px;
  height:23px;
}


/* =========================================================
   v2.0.11 — CHEVRONS MEGA MENU
   Override final volontairement spécifique pour neutraliser
   les anciennes flèches longues encore présentes ailleurs.
   ========================================================= */
.services-meg .mega-menu-reu .menu > li > a::after{
  content:"\f054" !important;
  font-family:FontAwesome !important;
  font-weight:400 !important;
  font-style:normal !important;
  font-size:10px !important;
  line-height:1 !important;

  position:absolute !important;
  right:16px !important;
  top:50% !important;

  width:auto !important;
  height:auto !important;

  color:var(--hsp-subtle,#81798c) !important;
  opacity:.85 !important;

  transform:translateY(-50%) !important;
  transition:
    color .25s ease,
    transform .25s ease,
    opacity .25s ease !important;
}

.services-meg .mega-menu-reu .menu > li > a:hover::after{
  color:var(--hsp-violet,#b18ae9) !important;
  opacity:1 !important;
  transform:translate(3px,-50%) !important;
}
