/* ------------- */

/* --- PERSO --- */

/* ------------- */

.cover-black{
	opacity : 0.2;
}

.cover-white{
	opacity : 0.2;
}

#myCarouselHome {
    background:#ffffff;
}

.reseau-social-barre .content-reseau-social-barre{
	height:50px !important;
}

#myCarouselHome .carousel-item {
    -webkit-transition: transform 5s ease, opacity 1.7s ease-out;
    -moz-transition: transform 5s ease, opacity 1.7s ease-out;
    -o-transition: transform 5s ease, opacity 1.7s ease-out;
    transition: transform 5s ease, opacity 1.7s ease-out;
}

#wrapper .container-fluid2 .header-wrapper .header{
	box-shadow:none;
}

.main-menu.effect4 .logo{
	opacity:1;
}

.header-wrapper.style-header1.withoutpic{
	background: #130f0c;
}
.liste-pictos .container-pictos .picto .logo-small::after {
    height: 60px;
    width: 60px;
    background: #ada1b5;
    border-radius: 50%;
    content: '';
    top: 21%;
    z-index: -1;
    left: 43%;
    display: block;
    position: absolute;
}







/* Barre et liste d’onglets au-dessus de tout, rien n’est coupé */
.header-wrapper,
.header-wrapper.style-header.maxi-header,
.main-menu{
  position: relative !important;
  z-index: 1000 !important;
  overflow: visible !important;
}

/* Chaque onglet sert d’ancre */
.main-menu > ul > li{
  position: relative !important;
  z-index: 1 !important;
}
.main-menu > ul > li > a{
  position: relative !important;
  z-index: 1002 !important;
}
.main-menu > ul > li:hover,
.main-menu > ul > li:focus-within{
  z-index: 1003 !important;
}

/* Supprime uniquement la bande grise entre menu et sous-menu */
.navbar_background{
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.navbar_background:empty{ display: none !important; }

/* ===== Dropdown vertical par onglet (pas pleine largeur) ===== */
:root{
  --nav-ease: cubic-bezier(.2,.8,.2,1);
  --nav-in: .45s;   /* ouverture plus lente */
  --nav-out: .35s;  /* fermeture douce */
}

/* Neutralise toute ancienne règle plein écran/fixed */
.header-wrapper .main-menu .submenu_mega,
.main-menu .submenu_mega{
  position: absolute !important;         /* plus de fixed */
  top: calc(100% + 6px) !important;      /* juste sous l’onglet */
  left: 0 !important;
  right: auto !important;
  width: max-content !important;         /* s’ajuste au contenu */
  min-width: 220px !important;           /* confort */
  max-width: 320px !important;           /* évite les panneaux trop larges */
  border-radius: 10px !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.12) !important;
  overflow: hidden !important;
  z-index: 1001 !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;

  /* état fermé : déroulement vertical (haut -> bas) */
  pointer-events: none;
  opacity: 0 !important;
  clip-path: inset(0 0 100% 0);
  transition:
    clip-path var(--nav-out) var(--nav-ease),
    opacity   var(--nav-out) var(--nav-ease),
    visibility 0s linear .2s;
  will-change: clip-path, opacity;
}

/* Affichage au survol/focus (remplace par ta classe JS si besoin) */
.main-menu > ul > li:hover .submenu_mega,
.main-menu > ul > li:focus-within .submenu_mega{
  pointer-events: auto;
  visibility: visible !important;
  opacity: 1 !important;
  clip-path: inset(0 0 0 0);
  transition:
    clip-path var(--nav-in) var(--nav-ease),
    opacity   var(--nav-in) var(--nav-ease),
    visibility 0s;
}

/* Contenu interne en colonne simple, vertical */
.submenu_mega .container,
.submenu_mega_item_wrapper,
.submenu_mega_item_wrapper_col,
.submenu_mega_item_wrapper_lv2,
.submenu_mega_item_lv3{
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Listes verticales propres */
.submenu_mega ul{ list-style: none; margin: 6px 0; padding: 6px 0; }
.submenu_mega li{ margin: 0; padding: 0; }

/* Liens d’items */
.submenu_mega a{
  display: block;
  padding: 10px 14px;
  font-size: 14px;
  line-height: 1.35;
  color: #1f2937;
  width: 100% !important;
  text-decoration: none;
  white-space: nowrap;
  transition: background .18s var(--nav-ease), color .18s var(--nav-ease);
  font-weight: 700 !important;
}
.submenu_mega a:hover{ background: rgba(146,20,124,0.1); }  /* 👈 ICI */

/* Fallback si clip-path non supporté (vieux navigateurs) */
@supports not (clip-path: inset(0 0 100% 0)){
  .main-menu .submenu_mega{
    max-height: 0;
    overflow: hidden;
    transition: max-height var(--nav-in) var(--nav-ease), opacity var(--nav-in) var(--nav-ease);
  }
  .main-menu > ul > li:hover .submenu_mega,
  .main-menu > ul > li:focus-within .submenu_mega{
    max-height: 80vh;
    opacity: 1 !important;
  }
}


/* 1) Pas de gap : le dropdown touche l'onglet */
.main-menu > ul > li .submenu_mega{
  top: 100% !important; /* au lieu de calc(100% + 6px) */
}

/* 2) Pont de survol invisible entre l'onglet et le sous-menu */
.main-menu > ul > li{
  position: relative !important;
}
.main-menu > ul > li::after{
  content: "";
  position: absolute;
  left: -12px;               /* élargit un peu pour être confort */
  right: -12px;
  top: 100%;
  height: 14px;              /* hauteur du pont = zone tampon */
  /* rien en background => invisible */
}

/* 3) Rester ouvert quand la souris est sur le sous-menu lui-même */
.main-menu .submenu_mega:hover{
  pointer-events: auto;
  visibility: visible !important;
  opacity: 1 !important;
  clip-path: inset(0 0 0 0);
}

/* Option: si l'ombre du panneau “mange” le pont, on le place au-dessus */
.main-menu > ul > li::after{
  z-index: 1004; /* > li (1003) et > panneau (1001) si besoin */
}

/* --- 1) Pas de transparence : on n’anime plus l’opacité --- */
.main-menu .submenu_mega{
  /* fermé = invisible uniquement via clip-path + visibility */
  opacity: 1 !important;                 /* toujours opaque */
  background: #ffffff !important;        /* fond plein */
  /* on retire l’opacité de la transition */
  transition:
    clip-path var(--nav-out) var(--nav-ease),
    visibility 0s linear .2s !important;
}
.main-menu > ul > li:hover .submenu_mega,
.main-menu > ul > li:focus-within .submenu_mega{
  transition:
    clip-path var(--nav-in) var(--nav-ease),
    visibility 0s !important;
}

/* --- 2) Les items trop longs se mettent à la ligne --- */
.submenu_mega a{
  white-space: normal !important;        /* autorise le retour à la ligne */
  overflow-wrap: anywhere !important;    /* casse où nécessaire */
  word-break: break-word !important;     /* sécurité pour très longs mots */
  line-height: 1.4 !important;
}

/* (Optionnel) un peu plus de largeur si tu veux éviter trop de retours à la ligne */
.main-menu .submenu_mega{
  max-width: 380px !important;           /* mets 360–420px selon ton goût */
}


/* ===== Style du menu principal ===== */

.main-menu.color-nav-menu.effect4.col-3.col-xl-10  {
	font-weight: 700 !important;    /* plus en gras */
}