.elementor-1833 .elementor-element.elementor-element-3c36ead{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}/* Start custom CSS for wp-widget-custom_html, class: .elementor-element-1df9da2 *//* --- CONFIGURATION GLOBALE --- */
:root {
  --brand: #388024;
  --text: rgba(255, 255, 255, .94);
  --textSoft: rgba(255, 255, 255, .82);
  --glassA: rgba(10, 14, 20, .52);
  --glassB: rgba(10, 14, 20, .32);
  --strokeA: rgba(255, 255, 255, .18);
  --strokeB: rgba(255, 255, 255, .10);
  --shadowHard: 0 26px 85px rgba(0, 0, 0, .66);
  --shadowSoft: 0 18px 55px rgba(0, 0, 0, .48);
  --ease: cubic-bezier(.2, .9, .2, 1);
}

html, body {
  width: 100%;
  height: 100%; 
  margin: 0;
  padding: 0;
  overflow: hidden; 
  background: #07101f;
  color: var(--text) !important;
  font-family: system-ui, -apple-system, sans-serif;
  filter: brightness(1);
}


.egpnIce--full {
  position: fixed; inset: 0;
  display: flex; flex-direction: column;
}

.egpnIce__bg {
  position: fixed; inset: 0;
  background-image: url("https://www.egpn.fr/salon-environnement/montpellier/wp-content/uploads/sites/2/2025/11/pic-2-e1769263030344.jpg");
  background-size: cover; background-position: center;
  filter: blur(18px) saturate(1.1); z-index: 0; transform: scale(1);
   
}



.egpnIce__veil { position: fixed; inset: 0; z-index: 1; pointer-events: none; }

/* --- HEADER FIXE --- */
.egpnIce__top {
  position: fixed; top: 0; left: 0; width: 100%; z-index: 100;
  display: flex; flex-direction: column; align-items: center;
  padding: 50px 22px 20px;
  background: linear-gradient(to bottom, rgba(7,16,31,0.95), transparent);
  pointer-events: none;
}
.topbar{
  position:fixed;
  top:18px;
  left:18px;
  pointer-events:auto;
  padding: 50px 0px 40px ;
  z-index:50;
}
.topbar, .egpnIce__menu { pointer-events: auto; }

.egpnIce__brand{ display:flex; align-items:center; gap:12px; min-width:0; }

.egpnIce__brandText{
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(255,255,255,.80);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.brand{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:15px;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.18);
  backdrop-filter:blur(10px);
}

.brand--link{
  position:absolute;
  display:inline-flex;
  width:max-content;
  align-items:center;
  gap:15px;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.18);
  backdrop-filter:blur(10px);
  text-decoration:none;
  cursor:pointer;
  pointer-events:auto;
  color:#FFFFFF
}

.brand--link:focus-visible{
  outline:2px solid rgba(255,255,255,.65);
  outline-offset:3px;
}

.brand--link:visited,
.brand--link:hover,
.brand--link:active,
.brand--link:focus{
  color:#388024;
}

.brand--link .brand__name{
  color:inherit;
}

.brand--link:hover{
  background:rgba(56,128,36,.18);
  border-color:rgba(56,128,36,.45);
}

.brand--link *{
  pointer-events:none;
}

.brand__name{
  font-weight:740;
  letter-spacing:.06em;
  text-transform:uppercase;
  font-size:12px;
}

.brand__dot{
  width:45px;
  height:45px;
  border-radius:50px;
  background-image:url("https://www.egpn.fr/salon-environnement/montpellier/wp-content/uploads/sites/2/2025/11/cropped-cropped-Logo-2.png");
  background-size:contain;
  background-position:center;
  background-repeat:no-repeat;
  border:1px solid rgba(255,255,255,.8);
  box-shadow:var(--shadow2);
}

.egpnIce__menu{
  display:flex;
  align-items:center;
  gap:20px;
  padding:17px 17px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(10px);
}

.egpnIce__link{
  text-decoration:none;
  color:rgba(255,255,255,.80);
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  padding:8px 10px;
  border-radius:999px;
}

.egpnIce__link:hover{
  background:rgba(255,255,255,.08);
  color:rgba(255,255,255,.92);
}

.egpnIce__link:focus-visible,
.egpnIce__iconBtn:focus-visible,
.egpnIce__item:focus-visible,
.egpnIce__panelBtn:focus-visible{
  outline:2px solid rgba(255,255,255,.65);
  outline-offset:3px;
}


/* --- ZONE DE SCROLL --- */
.egpnIce__layout {
  position: relative; z-index: 10; flex: 1;
  overflow-y: auto; overflow-x: hidden;
  padding: 180px 20px 150px; /* Espace pour Header/Footer */
  -webkit-overflow-scrolling: touch;
}

/* --- GLASS PANEL & TEAM STYLE --- */
.glass__panel {
   max-width: 1120px; 
  margin: 0 auto; 
  border-radius: 32px; 
  padding: 40px;
  background: linear-gradient(165deg, rgba(255,255,255,0.12) 0%, rgba(0,0,0,0.25) 100%); 
  border: 1px solid rgba(255,255,255,0.18); 
  backdrop-filter: blur(25px); 
  box-shadow: 0 30px 60px rgba(0,0,0,0.5); 
}

.teamLine__head {
    position: 
    relative;
    margin-bottom: 30px; 
    color: #FFFFFF;
}
.title { font-size: clamp(2rem, 4vw, 3rem); font-weight: 950; margin: 10px 0; color: #ffffff !important; }
.title span { color: var(--brand); }

.teamStats { display: flex; gap: 10px; margin-top: 20px; flex-wrap: wrap; }
.teamStat { 
  display: inline-flex; align-items: baseline; gap: 8px; padding: 6px 15px;
  border-radius: 999px; background: rgba(0,0,0,0.2); border: 1px solid var(--strokeB);
}

/* GROUPS & CARDS */
.teamGroup {
  margin-bottom: 25px; border-radius: 28px; border: 1px solid var(--strokeA);
  background: linear-gradient(180deg, rgba(10,14,20,.42), rgba(10,14,20,.60));
  overflow: hidden; position: relative;
}

.teamGroup::before {
  content: ""; position: absolute; left: 0; top: 0; height: 100%; width: 3px;
  background: var(--brand);
}

.teamGroup__top {
  display: flex; justify-content: space-between; align-items: center;
  padding: 15px 20px; border-bottom: 1px solid var(--strokeB);
  background: rgba(255,255,255,0.05);
}
.teamGroup__kicker {
    font-size: 14px; text-transform: uppercase; letter-spacing: 0.05em; margin: 0; color: #ffffff !important;
}

.teamGroup__title { font-size: 18px; text-transform: uppercase; letter-spacing: 0.05em; margin: 0; color: #ffffff !important; }

.teamChip {
  padding: 4px 10px; border-radius: 999px; background: rgba(0,0,0,0.3);
  border: 1px solid var(--strokeB); font-size: 10px; text-transform: uppercase; color: #ffffff !important;
}

.teamPerson {
  display: flex; gap: 20px; padding: 20px; align-items: center;
  border-bottom: 1px solid var(--strokeB); transition: 0.3s;
}

.teamPerson:last-child { border-bottom: none; }
.teamPerson:hover { background: rgba(56, 128, 36, 0.05); }

.teamPerson__avatar {
  width: 150px; height: 150px; border-radius: 18px; border: 1px solid var(--strokeB);
  background-size: cover; background-position: center; flex-shrink: 0;
}

.teamPerson__name { font-weight: 800; font-size: 18px; margin: 0; color: #ffffff !important; }
.teamPerson__role { color: var(--brand) !important; font-size: 12px; font-weight: 700; text-transform: uppercase; }
.teamPerson__bio { font-size: 14px; opacity: 0.9; margin-top: 5px; line-height: 1.5; color: #ffffff !important; }

/* --- FOOTER FINAL --- */
.pagefooter {
  position: relative !important; /* Il suit le flux du scroll */
  bottom: auto !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 20px !important;
  color: #FFFFFF;
  /* On ajoute de l'espace pour qu'il respire à la fin */
  padding: 60px 20px 80px 20px !important; 
  width: 100% !important;
  background: transparent !important; /* Plus besoin de dégradé de masquage */
  pointer-events: auto !important;
}
 .pagefooter::after {
  content: "Réalisé avec ❤️ par Jules Cadioou";
  font-size: 10px;
  opacity: 0;
  transition: opacity 5s ease; /* Il faut rester 3 secondes dessus */
}

.pagefooter:hover::after {
  opacity: 0.4;
}
/* On s'assure que le conteneur de scroll ne coupe pas le footer */
.egpnIce__layout {
  display: flex !important;
  flex-direction: column !important;
  padding-bottom: 0 !important; /* On retire la marge de sécurité du mode fixed */
}

.gchip {
  pointer-events: auto; padding: 10px 20px; border-radius: 999px;
  font-size: .7rem; letter-spacing: .12em; text-transform: uppercase;
  background: linear-gradient(180deg, rgba(0, 0, 0, .4), rgba(0, 0, 0, .2));
  border: 1px solid rgba(255, 255, 255, .14); color: #fff; text-decoration: none;
  backdrop-filter: blur(12px); transition: 0.3s var(--easeOut);
}

.gchip:hover {
  transform: translateY(-2px); border-color: var(--brand);
  background: linear-gradient(180deg, rgba(56, 128, 36, .3), rgba(0, 0, 0, .2));
  color: #FFFFFF;
}

/* --- RESPONSIVE 767px --- */
@media screen and (max-width: 767px) {
  .egpnIce__top { padding-top: 40px; }
  .egpnIce__layout { padding-top: 220px; }
  .teamPerson { flex-direction: column; text-align: center; }
  .glass__panel { padding: 25px 15px; }
  .pagefooter { flex-direction: column; align-items: center; }
}

/* =========================================
   RESTAURATION DES PHOTOS (BACKGROUND-IMAGE)
   ========================================= */
.teamPerson__avatar--a { background-image: url("https://www.egpn.fr/salon-environnement/montpellier/wp-content/uploads/sites/2/2026/01/3.jpeg"); }
.teamPerson__avatar--b { background-image: url("https://www.egpn.fr/salon-environnement/montpellier/wp-content/uploads/sites/2/2026/01/2.jpeg"); }
.teamPerson__avatar--c { background-image: url("https://www.egpn.fr/salon-environnement/montpellier/wp-content/uploads/sites/2/2026/01/9.jpeg"); }
.teamPerson__avatar--d { background-image: url("https://www.egpn.fr/salon-environnement/montpellier/wp-content/uploads/sites/2/2026/01/8.jpeg"); }
.teamPerson__avatar--e { background-image: url("https://www.egpn.fr/salon-environnement/montpellier/wp-content/uploads/sites/2/2026/01/5.jpeg"); }
.teamPerson__avatar--f { background-image: url("https://www.egpn.fr/salon-environnement/montpellier/wp-content/uploads/sites/2/2026/01/6.jpeg"); }
.teamPerson__avatar--g { background-image: url("https://www.egpn.fr/salon-environnement/montpellier/wp-content/uploads/sites/2/2026/01/9.jpeg"); }
.teamPerson__avatar--h { background-image: url("https://www.egpn.fr/salon-environnement/montpellier/wp-content/uploads/sites/2/2026/01/5.jpeg"); }
/* =========================================
   ADAPTATION MOBILE (Jusqu'à 767px)
   ========================================= */

@media screen and (max-width: 767px) {
  
  /* 1. RÉGLAGES GLOBAUX */
  html, body {
    filter: brightness(1.1); /* On calme un peu la luminosité sur petit écran */
  }

  /* 2. HEADER & NAVIGATION */
  .egpnIce__top {
   position: sticky !important;
    padding: 50px 15px 10px 15px !important; /* Marge haute pour l'encoche téléphone */
    background: linear-gradient(to bottom, 
    rgba(7, 16, 31, 0.9) 0%, 
    rgba(7, 16, 31, 0.4) 70%, 
    transparent 100%); 
  backdrop-filter: blur(2px); /* Flou léger pour tout le bandeau */
  -webkit-backdrop-filter: blur(8px);
    display: flex !important;
    flex-direction: column !important;
    background: linear-gradient(to bottom, rgba(7,16,31,0.95), transparent) !important;
    gap: 15px !important;
     z-index: 20;
  }

  .topbar {
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
    padding: 0 0 10px 0 !important;
    width: 100%;
    display: flex;
    justify-content: center;
  }

  .brand--link {
    position: relative !important;
    transform: scale(0.85);
  }

  .egpnIce__menu {
    gap: 8px !important;
    padding: 8px 12px !important;
    flex-wrap: wrap; /* Permet au menu de passer sur 2 lignes si nécessaire */
    justify-content: center;
  }

  .egpnIce__link {
    font-size: 10px !important;
    padding: 6px 10px !important;
  }

  /* 3. ZONE DE CONTENU (LAYOUT) */
  .egpnIce__layout {
    padding: 170px 12px 0 !important; /* On ajuste pour que le titre apparaisse sous le menu */
  }

  .glass__panel {
    padding: 25px 15px !important;
    border-radius: 24px !important;
  }

  .title {
    font-size: 1.8rem !important; /* Titre plus percutant et moins large */
    text-align: center;
    line-height: 1.2;
  }

  .teamStats {
    justify-content: center;
    gap: 8px !important;
  }

  .teamStat {
    font-size: 11px !important;
    padding: 5px 12px !important;
  }

  /* 4. CARTES DES MEMBRES (TEAM CARDS) */
  .teamGroup__top {
    flex-direction: column;
    align-items: flex-start !important;
    gap: 12px;
    padding: 15px !important;
  }

  .teamGroup__chips {
    justify-content: flex-start !important;
    width: 100%;
  }

  .teamPerson {
    flex-direction: column !important; /* Stack vertical : Photo au-dessus du texte */
    text-align: center;
    padding: 20px 15px !important;
    gap: 15px !important;
  }

  .teamPerson__avatar {
    width: 100px !important; /* On agrandit un peu la photo puisqu'elle est centrée */
    height: 100px !important;
    margin: 0 auto;
    border-width: 3px !important; /* On accentue le contour blanc */
  }

  .teamPerson__body {
    width: 100%;
  }

  .teamPerson__name {
    font-size: 1.2rem !important;
  }

  .teamPerson__bio {
    font-size: 13px !important;
    line-height: 1.5 !important;
    opacity: 0.95 !important;
  }

  /* 5. FOOTER */
  .pagefooter {
    flex-direction: column !important;
    gap: 12px !important;
    padding: 40px 15px 60px !important;
  }

  .gchip {
    width: 100% !important;
    max-width: 280px;
    text-align: center;
    font-size: 10px !important;
    padding: 12px !important;
  }
}









Ce site a été conçu et réalisé par votre cher serviteur @julcadrey, le président du Salon 2026/* End custom CSS */