/* Easy Solutions — navigation unifiée v34
   Source de vérité commune aux 72 pages FR / EN / DE. */
:root{
  --es-nav-desktop:1380px;
  --es-navy:#16243f;
  --es-navy-deep:#0f1b31;
  --es-red:#c41e2a;
  --es-line:#dfe4ec;
  --es-header-h:82px;
}

#header{
  position:sticky!important;
  top:0;
  z-index:1200!important;
  background:#fff!important;
  border-bottom:1px solid var(--es-line)!important;
  isolation:isolate;
}
#header .wrap{position:relative;min-width:0}
#header .logo,#header .es-language-switcher,#header .header-cta,#header .burger{flex:none}
#header .logo{min-width:0}
#header .nav{min-width:0}
#header .nav > li{position:static!important}
#header .nav-link{white-space:nowrap}

/* Le mega-menu reste entièrement dans la fenêtre, y compris sur Safari. */
#header .mega{
  position:absolute!important;
  top:100%!important;
  left:50%!important;
  right:auto!important;
  width:min(1080px,calc(100vw - 40px))!important;
  max-height:calc(100vh - 142px)!important;
  max-height:calc(100dvh - 142px)!important;
  overflow:auto!important;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  transform:translate3d(-50%,10px,0)!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
  padding:22px!important;
  border-radius:0 0 18px 18px!important;
  box-shadow:0 26px 65px rgba(16,31,56,.20)!important;
  z-index:1300!important;
}
#header .nav > li:hover .mega,#header .nav > li:focus-within .mega,#header .nav > li.is-open .mega{
  opacity:1!important;
  visibility:visible!important;
  transform:translate3d(-50%,0,0)!important;
}
#header .mega .mega-item{min-width:0!important;min-height:166px!important;overflow:hidden!important}
#header .mega .mega-item img{display:block!important;width:78px!important;height:72px!important;object-fit:contain!important}
#header .mega .mega-item svg{display:block!important;flex:none!important}
#header .mega .mega-item[href$="/encaissement"]::before,
#header .mega .mega-item[href$="/maintenance"]::before{
  content:"";
  position:absolute;
  right:10px;
  top:8px;
  width:78px;
  height:72px;
  background-position:center;
  background-repeat:no-repeat;
  background-size:contain;
  filter:drop-shadow(0 8px 12px rgba(22,36,63,.15));
}
#header .mega .mega-item[href$="/encaissement"]::before{background-image:url('/assets/images/img-b00054b4362417e165fb.jpg')}
#header .mega .mega-item[href$="/maintenance"]::before{background-image:url('/assets/images/img-3ca9e142bca4c182ecad.jpg')}
#header .mega .mega-item[href$="/encaissement"] > svg,
#header .mega .mega-item[href$="/maintenance"] > svg{display:none!important}

/* Sous-menu des trois profils : même comportement clavier / souris. */
#header .audience-menu{top:calc(100% + 1px)!important;z-index:1300!important}
#header .audience-nav:hover .audience-menu,#header .audience-nav:focus-within .audience-menu,#header .audience-nav.is-open .audience-menu{
  opacity:1!important;
  visibility:visible!important;
  transform:translateX(-50%) translateY(0)!important;
}

/* Le menu responsive conserve exactement l'identité du mega-menu complet. */
.mobile-menu{
  position:fixed!important;
  inset:0!important;
  z-index:9999!important;
  display:block!important;
  padding:0!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  background:linear-gradient(145deg,var(--es-navy-deep),#172a4a 58%,#122039)!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translate3d(100%,0,0)!important;
  transition:transform .32s cubic-bezier(.4,0,.2,1),opacity .2s ease,visibility 0s linear .32s!important;
}
.mobile-menu.open{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:translate3d(0,0,0)!important;
  transition:transform .32s cubic-bezier(.4,0,.2,1),opacity .2s ease!important;
}
.mobile-shell{
  width:min(1180px,100%)!important;
  min-height:100vh!important;
  min-height:100dvh!important;
  margin:0 auto!important;
  padding:calc(24px + env(safe-area-inset-top)) max(28px,env(safe-area-inset-right)) calc(32px + env(safe-area-inset-bottom)) max(28px,env(safe-area-inset-left))!important;
}
.mobile-top{
  position:sticky;
  top:0;
  z-index:5;
  padding:8px 0 18px!important;
  background:linear-gradient(180deg,var(--es-navy-deep) 0%,rgba(15,27,49,.96) 78%,rgba(15,27,49,0) 100%);
}
#closeMenu{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:44px!important;
  height:44px!important;
  flex:none!important;
  border:1px solid rgba(255,255,255,.18)!important;
  border-radius:12px!important;
  color:#fff!important;
}
.mobile-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;align-items:start!important}
.mobile-panel,.v26-intent a{min-width:0!important}
.mobile-panel{
  overflow:hidden!important;
  background:rgba(255,255,255,.055)!important;
  border-color:rgba(255,255,255,.13)!important;
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
}
.mobile-menu .mobile-link,.mobile-menu .v26-intent a{min-width:0!important;text-decoration:none!important}
.mobile-link svg,.v26-intent svg{
  display:block!important;
  width:22px!important;
  height:22px!important;
  min-width:22px!important;
  flex:0 0 22px!important;
  overflow:visible!important;
}
.mobile-link span{min-width:0!important}
.mobile-link small{white-space:normal!important}
.mobile-footer-row{padding-bottom:env(safe-area-inset-bottom)}

body.es-menu-open{overflow:hidden!important;touch-action:none}
html.js body.es-reveal-recovery .reveal{opacity:1!important;transform:none!important}

/* Desktop large : mega-menu complet. Le seuil reprend celui des pages historiques
   afin d'eviter la zone hybride 1181–1380 px (burger visible + panneau masque). */
@media (min-width:1381px){
  #header .wrap{width:min(1540px,calc(100% - 32px))!important;gap:clamp(6px,1vw,18px)!important}
  #header .nav{display:flex!important;gap:0!important;margin-left:auto!important}
  #header .nav-link{padding:12px clamp(5px,.55vw,11px)!important;font-size:clamp(.62rem,.56vw,.76rem)!important;letter-spacing:.04em!important}
  #header .header-cta{display:inline-flex!important;margin-left:4px!important;padding:14px clamp(12px,1.05vw,22px)!important;font-size:clamp(.65rem,.57vw,.79rem)!important}
  #header .es-language-switcher{display:flex!important;margin-left:0!important}
  #header.header .burger#burger{display:none!important;visibility:hidden!important;opacity:0!important}
  .mobile-menu{display:none!important}
}

@media (min-width:1381px) and (max-width:1480px){
  #header .logo-mark{width:34px!important;height:34px!important}
  #header .logo-text small,#header .es-language-code{display:none!important}
  #header .es-language-link{min-width:30px!important;padding:5px!important}
}

/* Tablette et mobile : même contenu, présenté en panneau responsive. */
@media (max-width:1380px){
  #header .wrap{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    width:min(100% - 32px,1380px)!important;
    height:var(--es-header-h)!important;
    gap:12px!important;
  }
  #header .nav,#header .header-cta{display:none!important}
  #header .burger#burger{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    order:4!important;
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    border:1px solid var(--es-line)!important;
    border-radius:12px!important;
    color:var(--es-navy)!important;
    visibility:visible!important;
    opacity:1!important;
  }
  #header .burger#burger svg{display:block!important;width:25px!important;height:25px!important}
  #header .es-language-switcher{display:flex!important;margin-left:auto!important;flex:none!important}
  .mobile-menu{display:block!important}
  .mobile-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .v26-intent{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media (max-width:700px){
  :root{--es-header-h:70px}
  #header .wrap{width:calc(100% - 20px)!important;gap:8px!important}
  #header .logo-text small{display:none!important}
  #header .logo-mark{width:34px!important;height:34px!important}
  #header .logo-text b{font-size:.92rem!important}
  #header .es-language-code{display:none!important}
  #header .es-language-link{min-width:31px!important;padding:5px!important}
  #header .burger#burger{width:42px!important;height:42px!important;min-width:42px!important}
  .mobile-shell{padding:calc(14px + env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left))!important}
  .mobile-grid,.v26-intent{grid-template-columns:1fr!important}
  .mobile-panel:first-child{grid-column:auto!important}
  .mobile-panel{padding:14px!important}
  .mobile-quick{grid-template-columns:1fr!important}
  .mobile-menu .mobile-link{padding:12px 8px!important;font-size:.9rem!important}
  .mobile-link small{display:block!important}
  .v26-intent a:nth-child(n){display:flex!important}
  .mobile-footer-row{align-items:stretch!important;flex-direction:column!important}
  .mobile-menu .mobile-cta{width:100%!important;justify-content:center!important}
}

@media (max-width:420px){
  #header .logo{gap:7px!important}
  #header .logo-text b{font-size:.79rem!important}
  #header .es-language-switcher{gap:1px!important}
  #header .es-language-link{min-width:28px!important;padding:4px!important}
  #header .es-language-flag{font-size:.92rem!important}
  .mobile-brand-sub{font-size:.52rem!important;letter-spacing:.12em!important}
}

@media (prefers-reduced-motion:reduce){.mobile-menu,#header .mega,#header .audience-menu{transition:none!important}}

/* ========================================================================== 
   V34 — LE MENU DE RÉFÉRENCE EST LE MENU UNIQUE, SUR TOUTES LES INTERFACES
   ========================================================================== */

/* Le bandeau horizontal ne concurrence plus le menu de référence. */
#header.header .nav,
#header.header .header-cta{
  display:none!important;
}
#header.header .wrap{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  width:min(1540px,calc(100% - 32px))!important;
  height:var(--es-header-h)!important;
  min-height:var(--es-header-h)!important;
  padding-right:0!important;
  gap:14px!important;
  overflow:visible!important;
}
#header.header .logo{
  order:1!important;
  margin-right:auto!important;
  min-width:0!important;
}
#header.header .es-language-switcher{
  position:static!important;
  inset:auto!important;
  order:3!important;
  display:flex!important;
  margin:0!important;
  flex:0 0 auto!important;
  transform:none!important;
}
#header.header .burger#burger{
  position:static!important;
  inset:auto!important;
  order:4!important;
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  transform:none!important;
  align-items:center!important;
  justify-content:center!important;
  width:46px!important;
  height:46px!important;
  min-width:46px!important;
  flex:0 0 46px!important;
  color:var(--es-navy)!important;
  border:1px solid rgba(22,36,63,.16)!important;
  border-radius:12px!important;
  background:#fff!important;
  z-index:auto!important;
  touch-action:manipulation!important;
  -webkit-tap-highlight-color:transparent!important;
}
#header.header .burger#burger svg{
  display:block!important;
  width:25px!important;
  height:25px!important;
  overflow:visible!important;
}

/* Le panneau bleu marine reste le même composant sur PC, tablette et mobile. */
html body #mobileMenu.mobile-menu{
  position:fixed!important;
  inset:0!important;
  z-index:2147483200!important;
  display:block!important;
  width:100%!important;
  height:100vh!important;
  height:100dvh!important;
  padding:0!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
  background:linear-gradient(145deg,#0f1b31 0%,#172b4c 58%,#122039 100%)!important;
  color:#fff!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translate3d(100%,0,0)!important;
  transition:transform .32s cubic-bezier(.4,0,.2,1),opacity .2s ease,visibility 0s linear .32s!important;
  -webkit-transform:translate3d(100%,0,0)!important;
  -webkit-transition:-webkit-transform .32s cubic-bezier(.4,0,.2,1),opacity .2s ease,visibility 0s linear .32s!important;
}
html body #mobileMenu.mobile-menu.open{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:translate3d(0,0,0)!important;
  -webkit-transform:translate3d(0,0,0)!important;
  transition:transform .32s cubic-bezier(.4,0,.2,1),opacity .2s ease!important;
  -webkit-transition:-webkit-transform .32s cubic-bezier(.4,0,.2,1),opacity .2s ease!important;
}
html body #mobileMenu .mobile-shell{
  width:min(1320px,100%)!important;
  min-height:100vh!important;
  min-height:100dvh!important;
  margin:0 auto!important;
  padding:calc(22px + env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) calc(34px + env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left))!important;
}
html body #mobileMenu .mobile-top{
  position:sticky!important;
  top:0!important;
  z-index:5!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  min-height:76px!important;
  margin:0 0 20px!important;
  padding:8px 0 18px!important;
  border-bottom:1px solid rgba(255,255,255,.12)!important;
  background:linear-gradient(180deg,#0f1b31 0%,rgba(15,27,49,.98) 82%,rgba(15,27,49,0) 100%)!important;
}
html body #mobileMenu .mobile-brand-sub{
  display:block!important;
  margin-top:8px!important;
  color:rgba(255,255,255,.58)!important;
  font-family:var(--font-mono),monospace!important;
  font-size:.64rem!important;
  letter-spacing:.18em!important;
  line-height:1.4!important;
  text-transform:uppercase!important;
}
html body #mobileMenu #closeMenu{
  position:static!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:54px!important;
  height:54px!important;
  min-width:54px!important;
  padding:0!important;
  border:1px solid rgba(255,255,255,.20)!important;
  border-radius:15px!important;
  background:rgba(255,255,255,.025)!important;
  color:#fff!important;
  touch-action:manipulation!important;
  -webkit-tap-highlight-color:transparent!important;
}
html body #mobileMenu #closeMenu svg{
  display:block!important;
  width:28px!important;
  height:28px!important;
  overflow:visible!important;
}

/* Accès rapides identiques à la capture, avec adaptation de la grille seulement. */
html body #mobileMenu .v26-intent{
  grid-column:1/-1!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:14px!important;
  width:100%!important;
  margin:0 0 28px!important;
}
html body #mobileMenu .v26-intent a{
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  min-height:74px!important;
  padding:16px 20px!important;
  border:1px solid rgba(255,255,255,.16)!important;
  border-radius:13px!important;
  background:rgba(255,255,255,.035)!important;
  color:#fff!important;
  font-family:var(--font-body),sans-serif!important;
  font-size:.92rem!important;
  font-weight:700!important;
  line-height:1.25!important;
  letter-spacing:0!important;
  text-transform:none!important;
}
html body #mobileMenu .v26-intent svg,
html body #mobileMenu .mobile-link svg{
  display:block!important;
  width:24px!important;
  height:24px!important;
  min-width:24px!important;
  flex:0 0 24px!important;
  overflow:visible!important;
  color:#ef4752!important;
}

html body #mobileMenu .mobile-grid{
  display:grid!important;
  grid-template-columns:2fr 1fr 1fr!important;
  gap:18px!important;
  align-items:start!important;
}
html body #mobileMenu .mobile-panel{
  min-width:0!important;
  padding:24px!important;
  overflow:hidden!important;
  border:1px solid rgba(255,255,255,.16)!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.055)!important;
  -webkit-backdrop-filter:blur(10px)!important;
  backdrop-filter:blur(10px)!important;
}
html body #mobileMenu .mobile-panel-title{
  display:block!important;
  margin:0!important;
  padding:0 0 18px!important;
  border:0!important;
  color:#ff6a73!important;
  font-family:var(--font-mono),monospace!important;
  font-size:.68rem!important;
  font-weight:600!important;
  letter-spacing:.18em!important;
  line-height:1.2!important;
  text-transform:uppercase!important;
}
html body #mobileMenu .mobile-link{
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  min-width:0!important;
  padding:13px 10px!important;
  border:0!important;
  border-radius:10px!important;
  background:transparent!important;
  color:#fff!important;
  font-family:var(--font-body),sans-serif!important;
  font-size:.94rem!important;
  font-weight:700!important;
  line-height:1.25!important;
  letter-spacing:0!important;
  text-transform:none!important;
  text-decoration:none!important;
}
html body #mobileMenu .mobile-link:hover,
html body #mobileMenu .mobile-link:focus-visible{
  background:rgba(255,255,255,.075)!important;
  outline:none!important;
}
html body #mobileMenu .mobile-link span{min-width:0!important}
html body #mobileMenu .mobile-link small{
  display:block!important;
  margin-top:4px!important;
  color:rgba(255,255,255,.52)!important;
  font-family:var(--font-body),sans-serif!important;
  font-size:.76rem!important;
  font-weight:400!important;
  line-height:1.35!important;
  letter-spacing:0!important;
  text-transform:none!important;
  white-space:normal!important;
}
html body #mobileMenu .mobile-quick{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:8px!important;
}
html body #mobileMenu .mobile-footer-row{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:20px!important;
  margin-top:24px!important;
  padding:24px 0 env(safe-area-inset-bottom)!important;
  border-top:1px solid rgba(255,255,255,.12)!important;
}
html body #mobileMenu .mobile-contact{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px 18px!important;
  margin:0!important;
  padding:0!important;
}
html body #mobileMenu .mobile-contact a{
  padding:0!important;
  border:0!important;
  color:rgba(255,255,255,.68)!important;
  font-family:var(--font-body),sans-serif!important;
  font-size:.78rem!important;
  font-weight:500!important;
  letter-spacing:0!important;
  text-transform:none!important;
}

body.es-menu-open{
  overflow:hidden!important;
  touch-action:none!important;
}
body.es-menu-open .es-consent-manage{
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}

/* Repère clavier commun aux 72 pages. */
.es-skip-link{
  position:fixed!important;
  top:max(8px,env(safe-area-inset-top))!important;
  left:max(8px,env(safe-area-inset-left))!important;
  z-index:2147483646!important;
  padding:11px 16px!important;
  border-radius:8px!important;
  background:#fff!important;
  color:#16243f!important;
  font-family:var(--font-body),sans-serif!important;
  font-weight:800!important;
  box-shadow:0 8px 26px rgba(0,0,0,.22)!important;
  transform:translate3d(0,-180%,0)!important;
  transition:transform .18s ease!important;
}
.es-skip-link:focus{
  transform:translate3d(0,0,0)!important;
  outline:3px solid #c41e2a!important;
  outline-offset:2px!important;
}

@media (max-width:1024px){
  html body #mobileMenu .v26-intent{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  html body #mobileMenu .mobile-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  html body #mobileMenu .mobile-grid > .mobile-panel:first-of-type{grid-column:1/-1!important}
}

@media (max-width:700px){
  :root{--es-header-h:70px}
  #header.header .wrap{width:calc(100% - 20px)!important;gap:8px!important}
  #header.header .logo-text small{display:none!important}
  #header.header .logo-mark{width:34px!important;height:34px!important}
  #header.header .logo-text b{font-size:.88rem!important}
  #header.header .es-language-code{display:none!important}
  #header.header .es-language-link{min-width:30px!important;padding:5px!important}
  #header.header .burger#burger{width:42px!important;height:42px!important;min-width:42px!important;flex-basis:42px!important}
  html body #mobileMenu .mobile-shell{padding:calc(14px + env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left))!important}
  html body #mobileMenu .mobile-top{min-height:72px!important;margin-bottom:16px!important}
  html body #mobileMenu #closeMenu{width:50px!important;height:50px!important;min-width:50px!important;border-radius:14px!important}
  html body #mobileMenu .v26-intent{grid-template-columns:1fr!important;gap:10px!important;margin-bottom:20px!important}
  html body #mobileMenu .v26-intent a{min-height:70px!important;padding:15px 18px!important}
  html body #mobileMenu .mobile-grid{grid-template-columns:1fr!important;gap:14px!important}
  html body #mobileMenu .mobile-grid > .mobile-panel:first-of-type{grid-column:auto!important}
  html body #mobileMenu .mobile-panel{padding:18px!important}
  html body #mobileMenu .mobile-link{padding:13px 8px!important;font-size:.96rem!important}
  html body #mobileMenu .mobile-link small{font-size:.78rem!important}
  html body #mobileMenu .mobile-footer-row{align-items:stretch!important;flex-direction:column!important}
  html body #mobileMenu .mobile-menu .mobile-cta,
  html body #mobileMenu .mobile-cta{width:100%!important;justify-content:center!important}
}

@media (max-width:430px){
  #header.header .logo-text b{font-size:.78rem!important}
  #header.header .es-language-switcher{gap:1px!important;padding:2px!important}
  #header.header .es-language-link{min-width:27px!important;padding:4px!important}
  #header.header .es-language-flag{font-size:.9rem!important}
  html body #mobileMenu .mobile-brand-sub{font-size:.5rem!important;letter-spacing:.12em!important}
}

@media (max-width:340px){
  #header.header .wrap{gap:6px!important}
  #header.header .logo-mark{display:none!important}
  #header.header .logo-text b{font-size:.72rem!important}
  #header.header .es-language-link{min-width:25px!important;padding:3px!important}
  #header.header .burger#burger{width:40px!important;height:40px!important;min-width:40px!important;flex-basis:40px!important}
}

@media (prefers-reduced-motion:reduce){
  html body #mobileMenu.mobile-menu{transition:none!important;-webkit-transition:none!important}
}
