.elementor-22122 .elementor-element.elementor-element-7aa29b4{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--align-items:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:-105px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:20px;--padding-bottom:20px;--padding-left:30px;--padding-right:30px;--z-index:999;}.elementor-22122 .elementor-element.elementor-element-7aa29b4:not(.elementor-motion-effects-element-type-background), .elementor-22122 .elementor-element.elementor-element-7aa29b4 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(0deg, #02010100 17%, #00000085 92%);}.elementor-22122 .elementor-element.elementor-element-746702c{--spacer-size:50px;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );}.elementor-22122 .elementor-element.elementor-element-2c8addb img{width:100%;max-width:66px;}.elementor-22122 .elementor-element.elementor-element-a157b5f{width:var( --container-widget-width, 26% );max-width:26%;--container-widget-width:26%;--container-widget-flex-grow:0;}.elementor-widget-mega-menu > .elementor-widget-container > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title, .elementor-widget-mega-menu > .elementor-widget-container > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title > .e-n-menu-title-container, .elementor-widget-mega-menu > .elementor-widget-container > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title > .e-n-menu-title-container > span{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-mega-menu{--n-menu-title-font-size:var( --e-global-typography-accent-font-size );--n-menu-divider-color:var( --e-global-color-text );}.elementor-22122 .elementor-element.elementor-element-a849738{--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;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-22122 .elementor-element.elementor-element-c9831dc{--display:flex;--justify-content:flex-start;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:2rem;--padding-bottom:2rem;--padding-left:0rem;--padding-right:0rem;}.elementor-22122 .elementor-element.elementor-element-6415b55{--display:flex;--padding-top:2rem;--padding-bottom:2rem;--padding-left:0rem;--padding-right:0rem;}.elementor-22122 .elementor-element.elementor-element-561a9df{--display:flex;--padding-top:2rem;--padding-bottom:2rem;--padding-left:0rem;--padding-right:0rem;}.elementor-22122 .elementor-element.elementor-element-7add852{--display:flex;--padding-top:2rem;--padding-bottom:2rem;--padding-left:0rem;--padding-right:0rem;}.elementor-22122 .elementor-element.elementor-element-03c25a8{--n-menu-dropdown-content-max-width:initial;--n-menu-heading-wrap:wrap;--n-menu-heading-overflow-x:initial;--n-menu-title-distance-from-content:0px;--n-menu-toggle-icon-wrapper-animation-duration:500ms;--n-menu-title-space-between:0px;--n-menu-title-transition:300ms;--n-menu-icon-size:16px;--n-menu-dropdown-indicator-size:17px;--n-menu-dropdown-indicator-color-normal:var( --e-global-color-ae353b3 );--n-menu-dropdown-indicator-color-hover:var( --e-global-color-c5a4a3c );--n-menu-toggle-icon-size:20px;--n-menu-toggle-icon-hover-duration:500ms;--n-menu-toggle-icon-distance-from-dropdown:0px;}.elementor-22122 .elementor-element.elementor-element-67a03f9{--display:flex;}.elementor-22122 .elementor-element.elementor-element-0c4369d{--display:flex;}.elementor-22122 .elementor-element.elementor-element-b99beea{--display:flex;}.elementor-22122 .elementor-element.elementor-element-687925c{--display:flex;}.elementor-22122 .elementor-element.elementor-element-1b7b879{--display:flex;}.elementor-22122 .elementor-element.elementor-element-860407a{--n-menu-dropdown-content-max-width:initial;--n-menu-heading-justify-content:flex-end;--n-menu-title-flex-grow:initial;--n-menu-title-justify-content:initial;--n-menu-title-justify-content-mobile:flex-end;--n-menu-heading-wrap:wrap;--n-menu-heading-overflow-x:initial;--n-menu-title-distance-from-content:30px;--n-menu-open-animation-duration:500ms;--n-menu-toggle-icon-wrapper-animation-duration:500ms;--n-menu-title-color-normal:var( --e-global-color-secondary );--n-menu-title-transition:300ms;--n-menu-icon-size:16px;--n-menu-toggle-icon-size:20px;--n-menu-toggle-icon-color:var( --e-global-color-secondary );--n-menu-toggle-icon-hover-duration:500ms;--n-menu-toggle-icon-distance-from-dropdown:0px;--n-menu-title-normal-color-dropdown:var( --e-global-color-secondary );--n-menu-title-active-color-dropdown:var( --e-global-color-accent );}.elementor-22122 .elementor-element.elementor-element-860407a > .elementor-widget-container > .e-n-menu > .e-n-menu-toggle[aria-expanded="true"] > .e-n-menu-toggle-icon{background:#02010100;}.elementor-22122 .elementor-element.elementor-element-860407a > .elementor-widget-container > .e-n-menu[data-layout='dropdown'] > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title:not( .e-current ){background:#AB0C0C00;}.elementor-22122 .elementor-element.elementor-element-860407a > .elementor-widget-container > .e-n-menu[data-layout='dropdown'] > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title.e-current{background-color:var( --e-global-color-secondary );}.elementor-22122 .elementor-element.elementor-element-860407a {--n-menu-title-color-hover:var( --e-global-color-7672179 );--n-menu-title-color-active:var( --e-global-color-secondary );}:where( .elementor-22122 .elementor-element.elementor-element-860407a > .elementor-widget-container > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-content ) > .e-con{box-shadow:0px 0px 10px 0px rgba(0, 0, 0, 0.5);}@media(max-width:1024px){.elementor-widget-image .widget-image-caption{font-size:var( --e-global-typography-text-font-size );}.elementor-widget-mega-menu{--n-menu-title-font-size:var( --e-global-typography-accent-font-size );}.elementor-22122 .elementor-element.elementor-element-860407a{--n-menu-heading-justify-content:initial;--n-menu-title-flex-grow:initial;--n-menu-title-justify-content:initial;--n-menu-title-justify-content-mobile:initial;--n-menu-title-distance-from-content:0px;--n-menu-toggle-align:flex-end;--n-menu-toggle-icon-size:34px;--n-menu-toggle-icon-distance-from-dropdown:33px;}}@media(min-width:768px){.elementor-22122 .elementor-element.elementor-element-7aa29b4{--content-width:1600px;}}@media(max-width:767px){.elementor-22122 .elementor-element.elementor-element-746702c{width:var( --container-widget-width, 36px );max-width:36px;--container-widget-width:36px;--container-widget-flex-grow:0;}.elementor-widget-image .widget-image-caption{font-size:var( --e-global-typography-text-font-size );}.elementor-22122 .elementor-element.elementor-element-2c8addb img{max-width:38px;}.elementor-22122 .elementor-element.elementor-element-a157b5f{width:initial;max-width:initial;}.elementor-widget-mega-menu{--n-menu-title-font-size:var( --e-global-typography-accent-font-size );}.elementor-22122 .elementor-element.elementor-element-860407a{--n-menu-title-padding:20px 30px 20px 30px;--n-menu-dropdown-indicator-size:25px;--n-menu-dropdown-indicator-space:20px;--n-menu-toggle-icon-size:26px;--n-menu-toggle-icon-distance-from-dropdown:24px;}}/* Start custom CSS for html, class: .elementor-element-a157b5f */@media (max-width:767px){


/* ======== MOBILE NAV — OLÈ MOSAIC ======== */

:root {
  --nav-bg: #fff;
  --nav-text: #1a1a1a;
  --nav-accent: var(--e-global-color-accent);
  --nav-border: #eee;
  --header-h: 77.58px;
}


input,
textarea,
button,
select,
a {
    -webkit-tap-highlight-color: transparent;
}



/* Botón hamburguesa */
.nav-trigger {
  display: flex;
  align-items: center;
}
.nav-trigger .icon-close { display: none; }
.nav-trigger.is-open .icon-hamb { display: none; }
.nav-trigger.is-open .icon-close { display: block; }


/* === Contenedor general del offcanvas === */
#mobile-nav.menu-overlay {
  position: fixed;
  top: 100px;
  left: 50%;
  transform: translateX(-50%) translateY(-20px);
  width: 92%;
  max-width: 420px;
  height: calc(100dvh - 120px);
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 12px 45px rgba(0, 0, 0, 0.25);
  overflow: hidden;
  z-index: 999;
  opacity: 0;
  pointer-events: none;
  transition: all 0.35s ease;
  
}

/* Estado visible */
#mobile-nav.menu-overlay.is-open {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}

/* === Fondo oscuro detrás del menú === */
body.nav-open::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.65); /* controla la oscuridad aquí */
  z-index: 998; /* justo debajo del menú (#mobile-nav tiene 999) */
  transition: opacity 0.3s ease;
  opacity: 1;
}



/* === Contenido del menú === */
#mobile-nav .menu-container {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}

#mobile-nav nav {
  flex: 1;
  overflow-y: auto;
  padding-bottom: 20px;
}

#mobile-nav ul,
#mobile-nav li {
  list-style: none;
  margin: 0;
  padding: 0;
}

#mobile-nav a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-decoration: none;
  transition: background 0.2s ease, color 0.2s ease;
}

#mobile-nav a:hover {
  background: #fafafa;
}

#mobile-nav .menu-item-has-children > a .dd-caret {
  font-weight: bold;
  color: #e93a79;
  margin-left: 10px;
}

/* === Drilldown transición === */
#mobile-nav .dd-viewport {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

#mobile-nav .dd-track {
  display: flex;
  width: 100%;
  height: 100%;
  transition: transform 0.35s ease;
}

#mobile-nav .dd-panel {
  min-width: 100%;
  height: 100%;
  background: #fff;
  overflow-y: auto;
}

#mobile-nav .dd-header {
  display: none;
  align-items: center;
  gap: 6px;
  padding: 18px 20px 8px;
  font-weight: 600;
  border-bottom: 1px solid #eee;
}

#mobile-nav .dd-back {
  color: #e93a79;
  font-size: 16px;
  text-decoration: none;
  padding: 0;
}

#mobile-nav .dd-title {
  color: #1a1a1a;
  padding-left: 10px;
}

/* === Zona inferior con iconos sociales === */
#mobile-nav .menu-social {
  display: flex;
  justify-content: center;
  gap: 18px;
  padding: 18px 0;
  border-top: 1px solid #eee;
}

#mobile-nav .menu-social a {
  font-size: 18px;
  color: #1a1a1a;
  transition: color 0.2s ease;
}

#mobile-nav .menu-social a:hover {
  color: #e93a79;
}

/* === Iconos y textos secundarios === */
#mobile-nav .menu-secondary {
  padding: 12px 0;
  border-top: 1px solid #eee;
  border-bottom: 1px solid #eee;
}

#mobile-nav .menu-secondary li a {
  padding: 14px 22px;
  font-weight: 400;
  color: #111;
}

#mobile-nav .menu-secondary li a i {
  margin-right: 10px;
  width: 18px;
  text-align: center;
}



#mobile-nav ul, #mobile-nav li { list-style: none; margin: 0; padding: 0; }
#mobile-nav a { display:block; padding:14px 20px; text-decoration:none; color:#1a1a1a; }
#mobile-nav .menu-item-has-children > a { position:relative; }
#mobile-nav .dd-caret { position:absolute; right:20px; color:#e93a79; }

/* Oculta solo los submenús del panel inicial */
#mobile-nav .menu-root > li > .sub-menu {
  display: none;
}
#mobile-nav .is-active-sub {
  display: block;
}


/* === BLOQUE DE ICONOS SOCIALES (parte inferior del menú) === */
#mobile-nav .menu-social {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px; /* separación entre iconos */
  padding: 20px 0 26px;
  border-top: 1px solid #ddd;
  background: transparent; /* fondo blanco */
}

/* === Iconos individuales === */
#mobile-nav .menu-social a {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #111; /* negro visible sobre fondo blanco */
  font-size: 18px; /* tamaño similar al diseño */
  text-decoration: none;
  transition: color 0.2s ease, transform 0.2s ease;
}

/* Hover en color corporativo */
#mobile-nav .menu-social a:hover {
  color: #e93a79;
  transform: translateY(-2px);
}


/* Asegura proporción y suavidad */
#mobile-nav .menu-social i {
  display: inline-block;
  width: 22px;
  text-align: center;
  font-size: 18px;
  line-height: 1;
}

#mobile-nav .city-list{
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding: 0 20px;
  max-height: 40vh;
  overflow: scroll;
  padding-bottom: 35px;
      li {
      width: 33.333%;
      padding: 10px 0;
        }
        a{
            padding: 0px !important;
            text-decoration: underline;
        }
}

#mobile-nav .gradient-overlay{
    height: 60px;
    position: relative;
    top:-60px;
    background: linear-gradient(180deg, transparent, white);
}

#mobile-nav .sub-menu-ciudades .submenu-icons{
    position: relative;
    top:-30px;
    border-bottom: solid 1px #ccc;
    border-top: solid 1px #ccc;
    padding: 10px 0;
}

#mobile-nav .sub-menu-ciudades .submenu-icons a{
    display: flex;
    gap: 10px;
    /*flex-wrap: nowrap;*/
    justify-content: flex-start;
    align-content: center;
}

#mobile-nav .sub-menu-ciudades .submenu-cta a{
    text-align: right;
    color: var(--e-global-color-accent);
    text-decoration: underline;
}


#mobile-nav .sub-menu-productos {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding-bottom:20px;
}


#mobile-nav .sub-menu-productos a {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  text-decoration: none;
  color: #222;
  font-size: 15px;
  line-height: 1.3;
  padding: 8px 20px;
}

#mobile-nav .sub-menu-productos img {
  width: 50px;
  height: 50px;
  object-fit: contain;
  flex-shrink: 0;
  border-radius: 8px;
  border-radius: 0px;
  background: #fff;
  box-shadow: 0 0 3px rgba(0,0,0,0.05);
}


#mobile-nav .sub-menu-colecciones {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-bottom:20px;
}

#mobile-nav .sub-menu-colecciones li {
  width: 100%;
}

#mobile-nav .sub-menu-colecciones a {
  position: relative;
  display: block;
  
}

#mobile-nav .sub-menu-colecciones img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  border-radius: 14px;
  overflow: hidden;
}

#mobile-nav .sub-menu-colecciones .title {
  position: absolute;
  top: 15px;
  left: 24px;
  font-size: 16px;
  color: #222;
  z-index: 2;
  border-radius: 6px;
  padding: 4px 10px;
  backdrop-filter: blur(3px);
}


#mobile-nav .menu-bottom {
  list-style: none;
  padding: 0;
  margin: 0;
  border-top: 1px solid #e8e8e8;
  border-bottom: 1px solid #e8e8e8;
}

#mobile-nav .menu-bottom .menu-item a {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  color: #111;
  font-size: 16px;
  text-decoration: none;
}

#mobile-nav .menu-bottom .menu-item a:hover {
  color: #e0005a;
}

#mobile-nav .menu-bottom .menu-icon {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  fill: #000;
  stroke: none;
}


#mobile-nav .menu-social {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 14px;
  padding: 20px;
  border-top: 1px solid #e0e0e0;
  margin-top: auto; /* empuja hacia abajo en un contenedor flex */
}

#mobile-nav .social-icon {
  width: 20px;
  height: 20px;
  color: #111;
  flex-shrink: 0;
  transition: color 0.2s ease;
}

#mobile-nav .menu-social a {
  text-decoration: none;
  display: flex;
  align-items: center;
  padding: 0;
}

#mobile-nav .menu-social a:hover .social-icon {
  color: #e0005a; /* color hover */
}

#mobile-nav .sub-menu-productos:hover{
    background: #ebebeb;
}


/* === ICONOS SOCIALES (solo en primer nivel del drill) === */
#mobile-nav .menu-social {
  position: absolute;        /* fijamos dentro del panel principal */
  bottom: 0;                 /* anclado al fondo */
  left: 0;
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 14px;
  padding: 14px 22px;
  border-top: 1px solid #e0e0e0;
  background: #fff;          /* fondo blanco para separarlo del scroll */
  z-index: 10;
}

/* Si el menú raíz tiene scroll, deja espacio para los iconos */
#mobile-nav .dd-panel:first-child {
  padding-bottom: 65px; /* da margen inferior al scroll principal */
}

/* Iconos */
#mobile-nav .menu-social a {
  text-decoration: none;
  display: flex;
  align-items: center;
}

#mobile-nav .menu-social .social-icon {
  width: 20px;
  height: 20px;
  color: #111;
  flex-shrink: 0;
  transition: color 0.2s ease, transform 0.2s ease;
}

#mobile-nav .menu-social a:hover .social-icon {
  color: #e0005a; /* color hover */
  transform: translateY(-2px);
}



}/* End custom CSS */
/* Start custom CSS for mega-menu, class: .elementor-element-03c25a8 *//***** MENÚ VERTICAL (Nivel 2) – OLE MOSAIC *****/

#menubar-ole{
  --menu-w: 240px;
  --gap-r: 12px;
  position: relative;
  display: inline-block;
  width: var(--menu-w) !important;
  max-width: var(--menu-w) !important;
  margin: 0; padding: 20px;
  z-index: 10;
}

#menubar-ole a:hover{
    h3,span{
        text-decoration: underline;
    }
}

.elementor-22122 .elementor-element.elementor-element-03c25a8 .elementor-shortcode{
    padding-bottom: 30px;
}

/* Lista vertical */
#menubar-ole .e-n-menu-heading,
#menubar-ole .e-n-menu-items{
  display: flex; flex-direction: column; align-items: stretch;
  width: 100%; margin: 0; padding: 0; list-style: none; background: #fff;
  height: auto !important;
}

/* Cada item ocupa todo el ancho */
#menubar-ole .e-n-menu-item{
  position: static !important;
  width: 100%; box-sizing: border-box;
  border-bottom: 1px solid #f2f2f2;
  
}
#menubar-ole .e-n-menu-item:last-child{ border-bottom: 0; }



/* Título del item + icono */
#menubar-ole .e-n-menu-title{
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  width: 100%; box-sizing: border-box;
  padding: 12px 16px; cursor: pointer; line-height: 1; user-select: none;
  white-space: nowrap;
}

/* Resalta SOLO el seleccionado */
#menubar-ole .e-n-menu-item > .e-n-menu-title { background: transparent; }
#menubar-ole .e-n-menu-item.is-open > .e-n-menu-title { background:#f5f5f5; }
#menubar-ole .e-n-menu-item:not(.is-open):hover > .e-n-menu-title { background:#f7f7f7; }

/* ===== Puente hover – Mega menú Ole Mosaic ===== */
#menubar-ole::after { display: none !important; }
#menubar-ole .e-n-menu-title { position: relative; overflow: visible; z-index: 1; }

#menubar-ole .e-n-menu-title::after {
  content: "";
  position: absolute;
  left: 100%;
  top: 0;
  bottom: 0;
  width: 70px;
  height: 37px;
  pointer-events: auto;
  z-index: 5;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* PANEL DERECHO (megamenu) */
#menubar-ole .e-n-menu-content{
  position: absolute !important;
  top: 0; left: calc(var(--menu-w) + var(--gap-r)) !important;
  margin: 0 !important;
  display: none;
  width: min(980px, 75vw);
  height: auto !important;
  max-height: none;
  z-index: 9999;
  transition: all 0.0.1s !important;
}

/* Mostrar panel */
#menubar-ole .e-n-menu-item:hover > .e-n-menu-content,
#menubar-ole .e-n-menu-item:focus-within > .e-n-menu-content,
#menubar-ole .e-n-menu-item.is-open > .e-n-menu-content{ display: block; }

/* Normaliza internos de Elementor */
#menubar-ole .e-n-menu-content .e-con,
#menubar-ole .e-n-menu-content .e-con > .e-con-inner{
  min-height: 0 !important; height: auto !important;
}
#menubar-ole .e-n-menu-content img{ max-width:100%; height:auto; display:block; }

/* === Quitar padding vertical interno === */
#e-n-menu-content-1401,
#e-n-menu-content-1401 .e-con-inner {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/***** STAGGER UNIVERSAL FINAL (FUNCIONA EN TODO) *****/

/* Estado inicial */
#e-n-menu-content-1401.staggering .animatable {
  opacity: 0;
  transform: translateY(8px) scale(.985);
  will-change: opacity, transform;
}

/* Transición visible */
#e-n-menu-content-1401.staggering.is-animating .animatable {
  opacity: 1;
  transform: translateY(0) scale(1);
  transition:
    opacity .22s cubic-bezier(.22,.61,.36,1),
    transform .22s cubic-bezier(.22,.61,.36,1);
  transition-delay: var(--d, 0ms) !important;
}

/* Accesibilidad */
@media (prefers-reduced-motion: reduce) {
  #e-n-menu-content-1401.staggering .animatable {
    transform: none;
  }
  #e-n-menu-content-1401.staggering.is-animating .animatable {
    transition: opacity .2s linear;
  }
}


/* relleno inferior del mismo color que el fondo */
#e-n-menu-content-1401 { box-shadow: 0 1px 0 #fff; }

/* ===== Responsive ===== */
@media (max-width: 1024px){
  #menubar-ole{ width: 100% !important; max-width: 100% !important; }
  #menubar-ole .e-n-menu-content{
    position: static !important;
    width: 100%; display: none; margin-top: 0 !important;
  }
  #menubar-ole .e-n-menu-item.is-open > .e-n-menu-content{ display:block; }
}


/* === SOMBRA Y LÍNEA INFERIOR EN TODO EL MEGA-MENÚ === */

/* 1️⃣ El mega-menú activo (ej. e-n-menu-content-1401) */
#e-n-menu-content-1401 {
  background: #fff !important; /* color de fondo principal */
  position: relative;
  box-shadow: none !important; /* eliminamos sombras previas */
}

/* 2️⃣ Pseudo-elemento para la línea negra y sombra en todo el ancho */
#e-n-menu-content-1401::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100vw; /* ocupa todo el ancho visible de la ventana */
  height: 100%;
  background: #fff;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2);
  border-bottom: 1px solid #000;
  z-index: -1; /* detrás del contenido */
}

/* 3️⃣ Fondo transparente dentro del contenido */
#e-n-menu-content-1401 .e-con,
#e-n-menu-content-1401 .e-con-inner,
#e-n-menu-content-1401 .elementor-widget {
  background: transparent !important;
  box-shadow: none !important;
}

/* 4️⃣ Ajuste para asegurar que los paneles hijos no corten la sombra */
#menubar-ole .e-n-menu-content {
  overflow: visible !important;
}

/* 5️⃣ Opcional: sombra más suave si la prefieres */
@media (prefers-color-scheme: light) {
  #e-n-menu-content-1401::after {
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
    border-bottom: 1px solid #000;
  }
}

/* === ESPACIADO SUPERIOR E INFERIOR EN EL MEGA-MENÚ === */
#e-n-menu-content-1401{
  padding-top: 30px !important;   /* arriba */
  padding-bottom: 20px !important; /* debajo */
}/* End custom CSS */
/* Start custom CSS for mega-menu, class: .elementor-element-03c25a8 *//***** MENÚ VERTICAL (Nivel 2) – OLE MOSAIC *****/

#menubar-ole{
  --menu-w: 240px;
  --gap-r: 12px;
  position: relative;
  display: inline-block;
  width: var(--menu-w) !important;
  max-width: var(--menu-w) !important;
  margin: 0; padding: 20px;
  z-index: 10;
}

#menubar-ole a:hover{
    h3,span{
        text-decoration: underline;
    }
}

.elementor-22122 .elementor-element.elementor-element-03c25a8 .elementor-shortcode{
    padding-bottom: 30px;
}

/* Lista vertical */
#menubar-ole .e-n-menu-heading,
#menubar-ole .e-n-menu-items{
  display: flex; flex-direction: column; align-items: stretch;
  width: 100%; margin: 0; padding: 0; list-style: none; background: #fff;
  height: auto !important;
}

/* Cada item ocupa todo el ancho */
#menubar-ole .e-n-menu-item{
  position: static !important;
  width: 100%; box-sizing: border-box;
  border-bottom: 1px solid #f2f2f2;
  
}
#menubar-ole .e-n-menu-item:last-child{ border-bottom: 0; }



/* Título del item + icono */
#menubar-ole .e-n-menu-title{
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  width: 100%; box-sizing: border-box;
  padding: 12px 16px; cursor: pointer; line-height: 1; user-select: none;
  white-space: nowrap;
}

/* Resalta SOLO el seleccionado */
#menubar-ole .e-n-menu-item > .e-n-menu-title { background: transparent; }
#menubar-ole .e-n-menu-item.is-open > .e-n-menu-title { background:#f5f5f5; }
#menubar-ole .e-n-menu-item:not(.is-open):hover > .e-n-menu-title { background:#f7f7f7; }

/* ===== Puente hover – Mega menú Ole Mosaic ===== */
#menubar-ole::after { display: none !important; }
#menubar-ole .e-n-menu-title { position: relative; overflow: visible; z-index: 1; }

#menubar-ole .e-n-menu-title::after {
  content: "";
  position: absolute;
  left: 100%;
  top: 0;
  bottom: 0;
  width: 70px;
  height: 37px;
  pointer-events: auto;
  z-index: 5;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* PANEL DERECHO (megamenu) */
#menubar-ole .e-n-menu-content{
  position: absolute !important;
  top: 0; left: calc(var(--menu-w) + var(--gap-r)) !important;
  margin: 0 !important;
  display: none;
  width: min(980px, 75vw);
  height: auto !important;
  max-height: none;
  z-index: 9999;
  transition: all 0.0.1s !important;
}

/* Mostrar panel */
#menubar-ole .e-n-menu-item:hover > .e-n-menu-content,
#menubar-ole .e-n-menu-item:focus-within > .e-n-menu-content,
#menubar-ole .e-n-menu-item.is-open > .e-n-menu-content{ display: block; }

/* Normaliza internos de Elementor */
#menubar-ole .e-n-menu-content .e-con,
#menubar-ole .e-n-menu-content .e-con > .e-con-inner{
  min-height: 0 !important; height: auto !important;
}
#menubar-ole .e-n-menu-content img{ max-width:100%; height:auto; display:block; }

/* === Quitar padding vertical interno === */
#e-n-menu-content-1401,
#e-n-menu-content-1401 .e-con-inner {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/***** STAGGER UNIVERSAL FINAL (FUNCIONA EN TODO) *****/

/* Estado inicial */
#e-n-menu-content-1401.staggering .animatable {
  opacity: 0;
  transform: translateY(8px) scale(.985);
  will-change: opacity, transform;
}

/* Transición visible */
#e-n-menu-content-1401.staggering.is-animating .animatable {
  opacity: 1;
  transform: translateY(0) scale(1);
  transition:
    opacity .22s cubic-bezier(.22,.61,.36,1),
    transform .22s cubic-bezier(.22,.61,.36,1);
  transition-delay: var(--d, 0ms) !important;
}

/* Accesibilidad */
@media (prefers-reduced-motion: reduce) {
  #e-n-menu-content-1401.staggering .animatable {
    transform: none;
  }
  #e-n-menu-content-1401.staggering.is-animating .animatable {
    transition: opacity .2s linear;
  }
}


/* relleno inferior del mismo color que el fondo */
#e-n-menu-content-1401 { box-shadow: 0 1px 0 #fff; }

/* ===== Responsive ===== */
@media (max-width: 1024px){
  #menubar-ole{ width: 100% !important; max-width: 100% !important; }
  #menubar-ole .e-n-menu-content{
    position: static !important;
    width: 100%; display: none; margin-top: 0 !important;
  }
  #menubar-ole .e-n-menu-item.is-open > .e-n-menu-content{ display:block; }
}


/* === SOMBRA Y LÍNEA INFERIOR EN TODO EL MEGA-MENÚ === */

/* 1️⃣ El mega-menú activo (ej. e-n-menu-content-1401) */
#e-n-menu-content-1401 {
  background: #fff !important; /* color de fondo principal */
  position: relative;
  box-shadow: none !important; /* eliminamos sombras previas */
}

/* 2️⃣ Pseudo-elemento para la línea negra y sombra en todo el ancho */
#e-n-menu-content-1401::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100vw; /* ocupa todo el ancho visible de la ventana */
  height: 100%;
  background: #fff;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2);
  border-bottom: 1px solid #000;
  z-index: -1; /* detrás del contenido */
}

/* 3️⃣ Fondo transparente dentro del contenido */
#e-n-menu-content-1401 .e-con,
#e-n-menu-content-1401 .e-con-inner,
#e-n-menu-content-1401 .elementor-widget {
  background: transparent !important;
  box-shadow: none !important;
}

/* 4️⃣ Ajuste para asegurar que los paneles hijos no corten la sombra */
#menubar-ole .e-n-menu-content {
  overflow: visible !important;
}

/* 5️⃣ Opcional: sombra más suave si la prefieres */
@media (prefers-color-scheme: light) {
  #e-n-menu-content-1401::after {
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
    border-bottom: 1px solid #000;
  }
}

/* === ESPACIADO SUPERIOR E INFERIOR EN EL MEGA-MENÚ === */
#e-n-menu-content-1401{
  padding-top: 30px !important;   /* arriba */
  padding-bottom: 20px !important; /* debajo */
}/* End custom CSS */
/* Start custom CSS for mega-menu, class: .elementor-element-03c25a8 *//***** MENÚ VERTICAL (Nivel 2) – OLE MOSAIC *****/

#menubar-ole{
  --menu-w: 240px;
  --gap-r: 12px;
  position: relative;
  display: inline-block;
  width: var(--menu-w) !important;
  max-width: var(--menu-w) !important;
  margin: 0; padding: 20px;
  z-index: 10;
}

#menubar-ole a:hover{
    h3,span{
        text-decoration: underline;
    }
}

.elementor-22122 .elementor-element.elementor-element-03c25a8 .elementor-shortcode{
    padding-bottom: 30px;
}

/* Lista vertical */
#menubar-ole .e-n-menu-heading,
#menubar-ole .e-n-menu-items{
  display: flex; flex-direction: column; align-items: stretch;
  width: 100%; margin: 0; padding: 0; list-style: none; background: #fff;
  height: auto !important;
}

/* Cada item ocupa todo el ancho */
#menubar-ole .e-n-menu-item{
  position: static !important;
  width: 100%; box-sizing: border-box;
  border-bottom: 1px solid #f2f2f2;
  
}
#menubar-ole .e-n-menu-item:last-child{ border-bottom: 0; }



/* Título del item + icono */
#menubar-ole .e-n-menu-title{
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  width: 100%; box-sizing: border-box;
  padding: 12px 16px; cursor: pointer; line-height: 1; user-select: none;
  white-space: nowrap;
}

/* Resalta SOLO el seleccionado */
#menubar-ole .e-n-menu-item > .e-n-menu-title { background: transparent; }
#menubar-ole .e-n-menu-item.is-open > .e-n-menu-title { background:#f5f5f5; }
#menubar-ole .e-n-menu-item:not(.is-open):hover > .e-n-menu-title { background:#f7f7f7; }

/* ===== Puente hover – Mega menú Ole Mosaic ===== */
#menubar-ole::after { display: none !important; }
#menubar-ole .e-n-menu-title { position: relative; overflow: visible; z-index: 1; }

#menubar-ole .e-n-menu-title::after {
  content: "";
  position: absolute;
  left: 100%;
  top: 0;
  bottom: 0;
  width: 70px;
  height: 37px;
  pointer-events: auto;
  z-index: 5;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* PANEL DERECHO (megamenu) */
#menubar-ole .e-n-menu-content{
  position: absolute !important;
  top: 0; left: calc(var(--menu-w) + var(--gap-r)) !important;
  margin: 0 !important;
  display: none;
  width: min(980px, 75vw);
  height: auto !important;
  max-height: none;
  z-index: 9999;
  transition: all 0.0.1s !important;
}

/* Mostrar panel */
#menubar-ole .e-n-menu-item:hover > .e-n-menu-content,
#menubar-ole .e-n-menu-item:focus-within > .e-n-menu-content,
#menubar-ole .e-n-menu-item.is-open > .e-n-menu-content{ display: block; }

/* Normaliza internos de Elementor */
#menubar-ole .e-n-menu-content .e-con,
#menubar-ole .e-n-menu-content .e-con > .e-con-inner{
  min-height: 0 !important; height: auto !important;
}
#menubar-ole .e-n-menu-content img{ max-width:100%; height:auto; display:block; }

/* === Quitar padding vertical interno === */
#e-n-menu-content-1401,
#e-n-menu-content-1401 .e-con-inner {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/***** STAGGER UNIVERSAL FINAL (FUNCIONA EN TODO) *****/

/* Estado inicial */
#e-n-menu-content-1401.staggering .animatable {
  opacity: 0;
  transform: translateY(8px) scale(.985);
  will-change: opacity, transform;
}

/* Transición visible */
#e-n-menu-content-1401.staggering.is-animating .animatable {
  opacity: 1;
  transform: translateY(0) scale(1);
  transition:
    opacity .22s cubic-bezier(.22,.61,.36,1),
    transform .22s cubic-bezier(.22,.61,.36,1);
  transition-delay: var(--d, 0ms) !important;
}

/* Accesibilidad */
@media (prefers-reduced-motion: reduce) {
  #e-n-menu-content-1401.staggering .animatable {
    transform: none;
  }
  #e-n-menu-content-1401.staggering.is-animating .animatable {
    transition: opacity .2s linear;
  }
}


/* relleno inferior del mismo color que el fondo */
#e-n-menu-content-1401 { box-shadow: 0 1px 0 #fff; }

/* ===== Responsive ===== */
@media (max-width: 1024px){
  #menubar-ole{ width: 100% !important; max-width: 100% !important; }
  #menubar-ole .e-n-menu-content{
    position: static !important;
    width: 100%; display: none; margin-top: 0 !important;
  }
  #menubar-ole .e-n-menu-item.is-open > .e-n-menu-content{ display:block; }
}


/* === SOMBRA Y LÍNEA INFERIOR EN TODO EL MEGA-MENÚ === */

/* 1️⃣ El mega-menú activo (ej. e-n-menu-content-1401) */
#e-n-menu-content-1401 {
  background: #fff !important; /* color de fondo principal */
  position: relative;
  box-shadow: none !important; /* eliminamos sombras previas */
}

/* 2️⃣ Pseudo-elemento para la línea negra y sombra en todo el ancho */
#e-n-menu-content-1401::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100vw; /* ocupa todo el ancho visible de la ventana */
  height: 100%;
  background: #fff;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2);
  border-bottom: 1px solid #000;
  z-index: -1; /* detrás del contenido */
}

/* 3️⃣ Fondo transparente dentro del contenido */
#e-n-menu-content-1401 .e-con,
#e-n-menu-content-1401 .e-con-inner,
#e-n-menu-content-1401 .elementor-widget {
  background: transparent !important;
  box-shadow: none !important;
}

/* 4️⃣ Ajuste para asegurar que los paneles hijos no corten la sombra */
#menubar-ole .e-n-menu-content {
  overflow: visible !important;
}

/* 5️⃣ Opcional: sombra más suave si la prefieres */
@media (prefers-color-scheme: light) {
  #e-n-menu-content-1401::after {
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
    border-bottom: 1px solid #000;
  }
}

/* === ESPACIADO SUPERIOR E INFERIOR EN EL MEGA-MENÚ === */
#e-n-menu-content-1401{
  padding-top: 30px !important;   /* arriba */
  padding-bottom: 20px !important; /* debajo */
}/* End custom CSS */
/* Start custom CSS for mega-menu, class: .elementor-element-03c25a8 *//***** MENÚ VERTICAL (Nivel 2) – OLE MOSAIC *****/

#menubar-ole{
  --menu-w: 240px;
  --gap-r: 12px;
  position: relative;
  display: inline-block;
  width: var(--menu-w) !important;
  max-width: var(--menu-w) !important;
  margin: 0; padding: 20px;
  z-index: 10;
}

#menubar-ole a:hover{
    h3,span{
        text-decoration: underline;
    }
}

.elementor-22122 .elementor-element.elementor-element-03c25a8 .elementor-shortcode{
    padding-bottom: 30px;
}

/* Lista vertical */
#menubar-ole .e-n-menu-heading,
#menubar-ole .e-n-menu-items{
  display: flex; flex-direction: column; align-items: stretch;
  width: 100%; margin: 0; padding: 0; list-style: none; background: #fff;
  height: auto !important;
}

/* Cada item ocupa todo el ancho */
#menubar-ole .e-n-menu-item{
  position: static !important;
  width: 100%; box-sizing: border-box;
  border-bottom: 1px solid #f2f2f2;
  
}
#menubar-ole .e-n-menu-item:last-child{ border-bottom: 0; }



/* Título del item + icono */
#menubar-ole .e-n-menu-title{
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  width: 100%; box-sizing: border-box;
  padding: 12px 16px; cursor: pointer; line-height: 1; user-select: none;
  white-space: nowrap;
}

/* Resalta SOLO el seleccionado */
#menubar-ole .e-n-menu-item > .e-n-menu-title { background: transparent; }
#menubar-ole .e-n-menu-item.is-open > .e-n-menu-title { background:#f5f5f5; }
#menubar-ole .e-n-menu-item:not(.is-open):hover > .e-n-menu-title { background:#f7f7f7; }

/* ===== Puente hover – Mega menú Ole Mosaic ===== */
#menubar-ole::after { display: none !important; }
#menubar-ole .e-n-menu-title { position: relative; overflow: visible; z-index: 1; }

#menubar-ole .e-n-menu-title::after {
  content: "";
  position: absolute;
  left: 100%;
  top: 0;
  bottom: 0;
  width: 70px;
  height: 37px;
  pointer-events: auto;
  z-index: 5;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* PANEL DERECHO (megamenu) */
#menubar-ole .e-n-menu-content{
  position: absolute !important;
  top: 0; left: calc(var(--menu-w) + var(--gap-r)) !important;
  margin: 0 !important;
  display: none;
  width: min(980px, 75vw);
  height: auto !important;
  max-height: none;
  z-index: 9999;
  transition: all 0.0.1s !important;
}

/* Mostrar panel */
#menubar-ole .e-n-menu-item:hover > .e-n-menu-content,
#menubar-ole .e-n-menu-item:focus-within > .e-n-menu-content,
#menubar-ole .e-n-menu-item.is-open > .e-n-menu-content{ display: block; }

/* Normaliza internos de Elementor */
#menubar-ole .e-n-menu-content .e-con,
#menubar-ole .e-n-menu-content .e-con > .e-con-inner{
  min-height: 0 !important; height: auto !important;
}
#menubar-ole .e-n-menu-content img{ max-width:100%; height:auto; display:block; }

/* === Quitar padding vertical interno === */
#e-n-menu-content-1401,
#e-n-menu-content-1401 .e-con-inner {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/***** STAGGER UNIVERSAL FINAL (FUNCIONA EN TODO) *****/

/* Estado inicial */
#e-n-menu-content-1401.staggering .animatable {
  opacity: 0;
  transform: translateY(8px) scale(.985);
  will-change: opacity, transform;
}

/* Transición visible */
#e-n-menu-content-1401.staggering.is-animating .animatable {
  opacity: 1;
  transform: translateY(0) scale(1);
  transition:
    opacity .22s cubic-bezier(.22,.61,.36,1),
    transform .22s cubic-bezier(.22,.61,.36,1);
  transition-delay: var(--d, 0ms) !important;
}

/* Accesibilidad */
@media (prefers-reduced-motion: reduce) {
  #e-n-menu-content-1401.staggering .animatable {
    transform: none;
  }
  #e-n-menu-content-1401.staggering.is-animating .animatable {
    transition: opacity .2s linear;
  }
}


/* relleno inferior del mismo color que el fondo */
#e-n-menu-content-1401 { box-shadow: 0 1px 0 #fff; }

/* ===== Responsive ===== */
@media (max-width: 1024px){
  #menubar-ole{ width: 100% !important; max-width: 100% !important; }
  #menubar-ole .e-n-menu-content{
    position: static !important;
    width: 100%; display: none; margin-top: 0 !important;
  }
  #menubar-ole .e-n-menu-item.is-open > .e-n-menu-content{ display:block; }
}


/* === SOMBRA Y LÍNEA INFERIOR EN TODO EL MEGA-MENÚ === */

/* 1️⃣ El mega-menú activo (ej. e-n-menu-content-1401) */
#e-n-menu-content-1401 {
  background: #fff !important; /* color de fondo principal */
  position: relative;
  box-shadow: none !important; /* eliminamos sombras previas */
}

/* 2️⃣ Pseudo-elemento para la línea negra y sombra en todo el ancho */
#e-n-menu-content-1401::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100vw; /* ocupa todo el ancho visible de la ventana */
  height: 100%;
  background: #fff;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2);
  border-bottom: 1px solid #000;
  z-index: -1; /* detrás del contenido */
}

/* 3️⃣ Fondo transparente dentro del contenido */
#e-n-menu-content-1401 .e-con,
#e-n-menu-content-1401 .e-con-inner,
#e-n-menu-content-1401 .elementor-widget {
  background: transparent !important;
  box-shadow: none !important;
}

/* 4️⃣ Ajuste para asegurar que los paneles hijos no corten la sombra */
#menubar-ole .e-n-menu-content {
  overflow: visible !important;
}

/* 5️⃣ Opcional: sombra más suave si la prefieres */
@media (prefers-color-scheme: light) {
  #e-n-menu-content-1401::after {
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
    border-bottom: 1px solid #000;
  }
}

/* === ESPACIADO SUPERIOR E INFERIOR EN EL MEGA-MENÚ === */
#e-n-menu-content-1401{
  padding-top: 30px !important;   /* arriba */
  padding-bottom: 20px !important; /* debajo */
}/* End custom CSS */
/* Start custom CSS for mega-menu, class: .elementor-element-03c25a8 *//***** MENÚ VERTICAL (Nivel 2) – OLE MOSAIC *****/

#menubar-ole{
  --menu-w: 240px;
  --gap-r: 12px;
  position: relative;
  display: inline-block;
  width: var(--menu-w) !important;
  max-width: var(--menu-w) !important;
  margin: 0; padding: 20px;
  z-index: 10;
}

#menubar-ole a:hover{
    h3,span{
        text-decoration: underline;
    }
}

.elementor-22122 .elementor-element.elementor-element-03c25a8 .elementor-shortcode{
    padding-bottom: 30px;
}

/* Lista vertical */
#menubar-ole .e-n-menu-heading,
#menubar-ole .e-n-menu-items{
  display: flex; flex-direction: column; align-items: stretch;
  width: 100%; margin: 0; padding: 0; list-style: none; background: #fff;
  height: auto !important;
}

/* Cada item ocupa todo el ancho */
#menubar-ole .e-n-menu-item{
  position: static !important;
  width: 100%; box-sizing: border-box;
  border-bottom: 1px solid #f2f2f2;
  
}
#menubar-ole .e-n-menu-item:last-child{ border-bottom: 0; }



/* Título del item + icono */
#menubar-ole .e-n-menu-title{
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  width: 100%; box-sizing: border-box;
  padding: 12px 16px; cursor: pointer; line-height: 1; user-select: none;
  white-space: nowrap;
}

/* Resalta SOLO el seleccionado */
#menubar-ole .e-n-menu-item > .e-n-menu-title { background: transparent; }
#menubar-ole .e-n-menu-item.is-open > .e-n-menu-title { background:#f5f5f5; }
#menubar-ole .e-n-menu-item:not(.is-open):hover > .e-n-menu-title { background:#f7f7f7; }

/* ===== Puente hover – Mega menú Ole Mosaic ===== */
#menubar-ole::after { display: none !important; }
#menubar-ole .e-n-menu-title { position: relative; overflow: visible; z-index: 1; }

#menubar-ole .e-n-menu-title::after {
  content: "";
  position: absolute;
  left: 100%;
  top: 0;
  bottom: 0;
  width: 70px;
  height: 37px;
  pointer-events: auto;
  z-index: 5;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* PANEL DERECHO (megamenu) */
#menubar-ole .e-n-menu-content{
  position: absolute !important;
  top: 0; left: calc(var(--menu-w) + var(--gap-r)) !important;
  margin: 0 !important;
  display: none;
  width: min(980px, 75vw);
  height: auto !important;
  max-height: none;
  z-index: 9999;
  transition: all 0.0.1s !important;
}

/* Mostrar panel */
#menubar-ole .e-n-menu-item:hover > .e-n-menu-content,
#menubar-ole .e-n-menu-item:focus-within > .e-n-menu-content,
#menubar-ole .e-n-menu-item.is-open > .e-n-menu-content{ display: block; }

/* Normaliza internos de Elementor */
#menubar-ole .e-n-menu-content .e-con,
#menubar-ole .e-n-menu-content .e-con > .e-con-inner{
  min-height: 0 !important; height: auto !important;
}
#menubar-ole .e-n-menu-content img{ max-width:100%; height:auto; display:block; }

/* === Quitar padding vertical interno === */
#e-n-menu-content-1401,
#e-n-menu-content-1401 .e-con-inner {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/***** STAGGER UNIVERSAL FINAL (FUNCIONA EN TODO) *****/

/* Estado inicial */
#e-n-menu-content-1401.staggering .animatable {
  opacity: 0;
  transform: translateY(8px) scale(.985);
  will-change: opacity, transform;
}

/* Transición visible */
#e-n-menu-content-1401.staggering.is-animating .animatable {
  opacity: 1;
  transform: translateY(0) scale(1);
  transition:
    opacity .22s cubic-bezier(.22,.61,.36,1),
    transform .22s cubic-bezier(.22,.61,.36,1);
  transition-delay: var(--d, 0ms) !important;
}

/* Accesibilidad */
@media (prefers-reduced-motion: reduce) {
  #e-n-menu-content-1401.staggering .animatable {
    transform: none;
  }
  #e-n-menu-content-1401.staggering.is-animating .animatable {
    transition: opacity .2s linear;
  }
}


/* relleno inferior del mismo color que el fondo */
#e-n-menu-content-1401 { box-shadow: 0 1px 0 #fff; }

/* ===== Responsive ===== */
@media (max-width: 1024px){
  #menubar-ole{ width: 100% !important; max-width: 100% !important; }
  #menubar-ole .e-n-menu-content{
    position: static !important;
    width: 100%; display: none; margin-top: 0 !important;
  }
  #menubar-ole .e-n-menu-item.is-open > .e-n-menu-content{ display:block; }
}


/* === SOMBRA Y LÍNEA INFERIOR EN TODO EL MEGA-MENÚ === */

/* 1️⃣ El mega-menú activo (ej. e-n-menu-content-1401) */
#e-n-menu-content-1401 {
  background: #fff !important; /* color de fondo principal */
  position: relative;
  box-shadow: none !important; /* eliminamos sombras previas */
}

/* 2️⃣ Pseudo-elemento para la línea negra y sombra en todo el ancho */
#e-n-menu-content-1401::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100vw; /* ocupa todo el ancho visible de la ventana */
  height: 100%;
  background: #fff;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2);
  border-bottom: 1px solid #000;
  z-index: -1; /* detrás del contenido */
}

/* 3️⃣ Fondo transparente dentro del contenido */
#e-n-menu-content-1401 .e-con,
#e-n-menu-content-1401 .e-con-inner,
#e-n-menu-content-1401 .elementor-widget {
  background: transparent !important;
  box-shadow: none !important;
}

/* 4️⃣ Ajuste para asegurar que los paneles hijos no corten la sombra */
#menubar-ole .e-n-menu-content {
  overflow: visible !important;
}

/* 5️⃣ Opcional: sombra más suave si la prefieres */
@media (prefers-color-scheme: light) {
  #e-n-menu-content-1401::after {
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
    border-bottom: 1px solid #000;
  }
}

/* === ESPACIADO SUPERIOR E INFERIOR EN EL MEGA-MENÚ === */
#e-n-menu-content-1401{
  padding-top: 30px !important;   /* arriba */
  padding-bottom: 20px !important; /* debajo */
}/* End custom CSS */
/* Start custom CSS for mega-menu, class: .elementor-element-03c25a8 *//***** MENÚ VERTICAL (Nivel 2) – OLE MOSAIC *****/

#menubar-ole{
  --menu-w: 240px;
  --gap-r: 12px;
  position: relative;
  display: inline-block;
  width: var(--menu-w) !important;
  max-width: var(--menu-w) !important;
  margin: 0; padding: 20px;
  z-index: 10;
}

#menubar-ole a:hover{
    h3,span{
        text-decoration: underline;
    }
}

.elementor-22122 .elementor-element.elementor-element-03c25a8 .elementor-shortcode{
    padding-bottom: 30px;
}

/* Lista vertical */
#menubar-ole .e-n-menu-heading,
#menubar-ole .e-n-menu-items{
  display: flex; flex-direction: column; align-items: stretch;
  width: 100%; margin: 0; padding: 0; list-style: none; background: #fff;
  height: auto !important;
}

/* Cada item ocupa todo el ancho */
#menubar-ole .e-n-menu-item{
  position: static !important;
  width: 100%; box-sizing: border-box;
  border-bottom: 1px solid #f2f2f2;
  
}
#menubar-ole .e-n-menu-item:last-child{ border-bottom: 0; }



/* Título del item + icono */
#menubar-ole .e-n-menu-title{
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  width: 100%; box-sizing: border-box;
  padding: 12px 16px; cursor: pointer; line-height: 1; user-select: none;
  white-space: nowrap;
}

/* Resalta SOLO el seleccionado */
#menubar-ole .e-n-menu-item > .e-n-menu-title { background: transparent; }
#menubar-ole .e-n-menu-item.is-open > .e-n-menu-title { background:#f5f5f5; }
#menubar-ole .e-n-menu-item:not(.is-open):hover > .e-n-menu-title { background:#f7f7f7; }

/* ===== Puente hover – Mega menú Ole Mosaic ===== */
#menubar-ole::after { display: none !important; }
#menubar-ole .e-n-menu-title { position: relative; overflow: visible; z-index: 1; }

#menubar-ole .e-n-menu-title::after {
  content: "";
  position: absolute;
  left: 100%;
  top: 0;
  bottom: 0;
  width: 70px;
  height: 37px;
  pointer-events: auto;
  z-index: 5;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* PANEL DERECHO (megamenu) */
#menubar-ole .e-n-menu-content{
  position: absolute !important;
  top: 0; left: calc(var(--menu-w) + var(--gap-r)) !important;
  margin: 0 !important;
  display: none;
  width: min(980px, 75vw);
  height: auto !important;
  max-height: none;
  z-index: 9999;
  transition: all 0.0.1s !important;
}

/* Mostrar panel */
#menubar-ole .e-n-menu-item:hover > .e-n-menu-content,
#menubar-ole .e-n-menu-item:focus-within > .e-n-menu-content,
#menubar-ole .e-n-menu-item.is-open > .e-n-menu-content{ display: block; }

/* Normaliza internos de Elementor */
#menubar-ole .e-n-menu-content .e-con,
#menubar-ole .e-n-menu-content .e-con > .e-con-inner{
  min-height: 0 !important; height: auto !important;
}
#menubar-ole .e-n-menu-content img{ max-width:100%; height:auto; display:block; }

/* === Quitar padding vertical interno === */
#e-n-menu-content-1401,
#e-n-menu-content-1401 .e-con-inner {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/***** STAGGER UNIVERSAL FINAL (FUNCIONA EN TODO) *****/

/* Estado inicial */
#e-n-menu-content-1401.staggering .animatable {
  opacity: 0;
  transform: translateY(8px) scale(.985);
  will-change: opacity, transform;
}

/* Transición visible */
#e-n-menu-content-1401.staggering.is-animating .animatable {
  opacity: 1;
  transform: translateY(0) scale(1);
  transition:
    opacity .22s cubic-bezier(.22,.61,.36,1),
    transform .22s cubic-bezier(.22,.61,.36,1);
  transition-delay: var(--d, 0ms) !important;
}

/* Accesibilidad */
@media (prefers-reduced-motion: reduce) {
  #e-n-menu-content-1401.staggering .animatable {
    transform: none;
  }
  #e-n-menu-content-1401.staggering.is-animating .animatable {
    transition: opacity .2s linear;
  }
}


/* relleno inferior del mismo color que el fondo */
#e-n-menu-content-1401 { box-shadow: 0 1px 0 #fff; }

/* ===== Responsive ===== */
@media (max-width: 1024px){
  #menubar-ole{ width: 100% !important; max-width: 100% !important; }
  #menubar-ole .e-n-menu-content{
    position: static !important;
    width: 100%; display: none; margin-top: 0 !important;
  }
  #menubar-ole .e-n-menu-item.is-open > .e-n-menu-content{ display:block; }
}


/* === SOMBRA Y LÍNEA INFERIOR EN TODO EL MEGA-MENÚ === */

/* 1️⃣ El mega-menú activo (ej. e-n-menu-content-1401) */
#e-n-menu-content-1401 {
  background: #fff !important; /* color de fondo principal */
  position: relative;
  box-shadow: none !important; /* eliminamos sombras previas */
}

/* 2️⃣ Pseudo-elemento para la línea negra y sombra en todo el ancho */
#e-n-menu-content-1401::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100vw; /* ocupa todo el ancho visible de la ventana */
  height: 100%;
  background: #fff;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2);
  border-bottom: 1px solid #000;
  z-index: -1; /* detrás del contenido */
}

/* 3️⃣ Fondo transparente dentro del contenido */
#e-n-menu-content-1401 .e-con,
#e-n-menu-content-1401 .e-con-inner,
#e-n-menu-content-1401 .elementor-widget {
  background: transparent !important;
  box-shadow: none !important;
}

/* 4️⃣ Ajuste para asegurar que los paneles hijos no corten la sombra */
#menubar-ole .e-n-menu-content {
  overflow: visible !important;
}

/* 5️⃣ Opcional: sombra más suave si la prefieres */
@media (prefers-color-scheme: light) {
  #e-n-menu-content-1401::after {
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
    border-bottom: 1px solid #000;
  }
}

/* === ESPACIADO SUPERIOR E INFERIOR EN EL MEGA-MENÚ === */
#e-n-menu-content-1401{
  padding-top: 30px !important;   /* arriba */
  padding-bottom: 20px !important; /* debajo */
}/* End custom CSS */
/* Start custom CSS for mega-menu, class: .elementor-element-03c25a8 *//***** MENÚ VERTICAL (Nivel 2) – OLE MOSAIC *****/

#menubar-ole{
  --menu-w: 240px;
  --gap-r: 12px;
  position: relative;
  display: inline-block;
  width: var(--menu-w) !important;
  max-width: var(--menu-w) !important;
  margin: 0; padding: 20px;
  z-index: 10;
}

#menubar-ole a:hover{
    h3,span{
        text-decoration: underline;
    }
}

.elementor-22122 .elementor-element.elementor-element-03c25a8 .elementor-shortcode{
    padding-bottom: 30px;
}

/* Lista vertical */
#menubar-ole .e-n-menu-heading,
#menubar-ole .e-n-menu-items{
  display: flex; flex-direction: column; align-items: stretch;
  width: 100%; margin: 0; padding: 0; list-style: none; background: #fff;
  height: auto !important;
}

/* Cada item ocupa todo el ancho */
#menubar-ole .e-n-menu-item{
  position: static !important;
  width: 100%; box-sizing: border-box;
  border-bottom: 1px solid #f2f2f2;
  
}
#menubar-ole .e-n-menu-item:last-child{ border-bottom: 0; }



/* Título del item + icono */
#menubar-ole .e-n-menu-title{
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  width: 100%; box-sizing: border-box;
  padding: 12px 16px; cursor: pointer; line-height: 1; user-select: none;
  white-space: nowrap;
}

/* Resalta SOLO el seleccionado */
#menubar-ole .e-n-menu-item > .e-n-menu-title { background: transparent; }
#menubar-ole .e-n-menu-item.is-open > .e-n-menu-title { background:#f5f5f5; }
#menubar-ole .e-n-menu-item:not(.is-open):hover > .e-n-menu-title { background:#f7f7f7; }

/* ===== Puente hover – Mega menú Ole Mosaic ===== */
#menubar-ole::after { display: none !important; }
#menubar-ole .e-n-menu-title { position: relative; overflow: visible; z-index: 1; }

#menubar-ole .e-n-menu-title::after {
  content: "";
  position: absolute;
  left: 100%;
  top: 0;
  bottom: 0;
  width: 70px;
  height: 37px;
  pointer-events: auto;
  z-index: 5;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* PANEL DERECHO (megamenu) */
#menubar-ole .e-n-menu-content{
  position: absolute !important;
  top: 0; left: calc(var(--menu-w) + var(--gap-r)) !important;
  margin: 0 !important;
  display: none;
  width: min(980px, 75vw);
  height: auto !important;
  max-height: none;
  z-index: 9999;
  transition: all 0.0.1s !important;
}

/* Mostrar panel */
#menubar-ole .e-n-menu-item:hover > .e-n-menu-content,
#menubar-ole .e-n-menu-item:focus-within > .e-n-menu-content,
#menubar-ole .e-n-menu-item.is-open > .e-n-menu-content{ display: block; }

/* Normaliza internos de Elementor */
#menubar-ole .e-n-menu-content .e-con,
#menubar-ole .e-n-menu-content .e-con > .e-con-inner{
  min-height: 0 !important; height: auto !important;
}
#menubar-ole .e-n-menu-content img{ max-width:100%; height:auto; display:block; }

/* === Quitar padding vertical interno === */
#e-n-menu-content-1401,
#e-n-menu-content-1401 .e-con-inner {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/***** STAGGER UNIVERSAL FINAL (FUNCIONA EN TODO) *****/

/* Estado inicial */
#e-n-menu-content-1401.staggering .animatable {
  opacity: 0;
  transform: translateY(8px) scale(.985);
  will-change: opacity, transform;
}

/* Transición visible */
#e-n-menu-content-1401.staggering.is-animating .animatable {
  opacity: 1;
  transform: translateY(0) scale(1);
  transition:
    opacity .22s cubic-bezier(.22,.61,.36,1),
    transform .22s cubic-bezier(.22,.61,.36,1);
  transition-delay: var(--d, 0ms) !important;
}

/* Accesibilidad */
@media (prefers-reduced-motion: reduce) {
  #e-n-menu-content-1401.staggering .animatable {
    transform: none;
  }
  #e-n-menu-content-1401.staggering.is-animating .animatable {
    transition: opacity .2s linear;
  }
}


/* relleno inferior del mismo color que el fondo */
#e-n-menu-content-1401 { box-shadow: 0 1px 0 #fff; }

/* ===== Responsive ===== */
@media (max-width: 1024px){
  #menubar-ole{ width: 100% !important; max-width: 100% !important; }
  #menubar-ole .e-n-menu-content{
    position: static !important;
    width: 100%; display: none; margin-top: 0 !important;
  }
  #menubar-ole .e-n-menu-item.is-open > .e-n-menu-content{ display:block; }
}


/* === SOMBRA Y LÍNEA INFERIOR EN TODO EL MEGA-MENÚ === */

/* 1️⃣ El mega-menú activo (ej. e-n-menu-content-1401) */
#e-n-menu-content-1401 {
  background: #fff !important; /* color de fondo principal */
  position: relative;
  box-shadow: none !important; /* eliminamos sombras previas */
}

/* 2️⃣ Pseudo-elemento para la línea negra y sombra en todo el ancho */
#e-n-menu-content-1401::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100vw; /* ocupa todo el ancho visible de la ventana */
  height: 100%;
  background: #fff;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2);
  border-bottom: 1px solid #000;
  z-index: -1; /* detrás del contenido */
}

/* 3️⃣ Fondo transparente dentro del contenido */
#e-n-menu-content-1401 .e-con,
#e-n-menu-content-1401 .e-con-inner,
#e-n-menu-content-1401 .elementor-widget {
  background: transparent !important;
  box-shadow: none !important;
}

/* 4️⃣ Ajuste para asegurar que los paneles hijos no corten la sombra */
#menubar-ole .e-n-menu-content {
  overflow: visible !important;
}

/* 5️⃣ Opcional: sombra más suave si la prefieres */
@media (prefers-color-scheme: light) {
  #e-n-menu-content-1401::after {
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
    border-bottom: 1px solid #000;
  }
}

/* === ESPACIADO SUPERIOR E INFERIOR EN EL MEGA-MENÚ === */
#e-n-menu-content-1401{
  padding-top: 30px !important;   /* arriba */
  padding-bottom: 20px !important; /* debajo */
}/* End custom CSS */
/* Start custom CSS for mega-menu, class: .elementor-element-860407a */.elementor-22122 .elementor-element.elementor-element-860407a .e-n-menu-item{
    border-bottom: solid 3px transparent;
}

.elementor-22122 .elementor-element.elementor-element-860407a .e-n-menu-item:hover{
    border-color: var(--e-global-color-accent);
}

@media (min-width:1024px){
    
.elementor-22122 .elementor-element.elementor-element-860407a .e-n-menu-title-text:not(#menubar-ole .e-n-menu-title-text){
    -webkit-text-stroke-width: 0.2px;
  -webkit-text-stroke-color: black;
  text-shadow: 1px 1px 3px #000000CC;
}


header.elementor-sticky::before {
position: absolute;
content: "";
width: 100%;
left: 0;
top: 0;
background-color: transparent;
pointer-events: none;
z-index:-3;

}


header.elementor-sticky:has(.e-active)::before {
height: calc(100vh + 150px);
height: calc(100dvh + 150px);
background-color: #00000099;
}
}


header:has(.e-active),header:hover{
    background: #292929 !important;
}


.elementor-22122 .elementor-element.elementor-element-860407a button{
    box-shadow: none !important;
}


/* ===== Megamenu móvil a pantalla completa (Elementor New Nav Menu) ===== */
@media (max-width:1024px){

  /* El panel del dropdown (wrapper) ocupa todo el viewport visible */
  body.menu-open .e-n-menu[data-layout="dropdown"] .e-n-menu-wrapper{
    height: calc(var(--vh, 1vh) * 100) !important;
    max-height: calc(var(--vh, 1vh) * 100) !important;
    overflow: hidden;             /* el scroll va dentro */
    z-index: 9999;                /* sobre contenido */
    background: #ab0c0ce3;        /* tu fondo (opcional) */
  }

  /* El contenedor interno que debe desplazarse (items/panel) */
  body.menu-open .e-n-menu[data-layout="dropdown"] .e-n-menu-wrapper > .e-n-menu-items,
  body.menu-open .e-n-menu[data-layout="dropdown"] .e-n-menu-wrapper > .e-n-menu-content-box{
    min-height: calc((var(--vh, 1vh) * 100) - var(--dropdown-offset, 0px));
    max-height: calc((var(--vh, 1vh) * 100) - var(--dropdown-offset, 0px));
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* Asegura que submenús/paneles mega NO hereden altura forzada */
  .e-n-menu .e-sub-menu,
  .e-n-menu .e-n-menu-content{
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  /* Lock del body sin saltos (se gestiona top vía JS) */
  body.menu-open{
    position: fixed;
    width: 100%;
    overflow: hidden;
  }

  /* Asegura que el botón de cerrar quede por encima si hiciera falta */
  .e-n-menu-toggle{
    position: relative;
    z-index: 10000;
  }
}

/* Elimina reglas antiguas que rompían el alto: NO fijes los #menubar-xxx */
#menubar-369, #menubar-231, #menubar-0{ /* limpio a propósito */ }/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-7aa29b4 *//* ELEMENTOR HEADER SCROOLL CHANGE */


.elementor-22122 .elementor-element.elementor-element-7aa29b4.elementor-sticky--effects{
   backdrop-filter: blur(5px);
    background-color:#292929;
    box-shadow: 1px 1px 18px rgba(0,0,0,0.3);
}



/* Header oscuro sólo en Productos, Página 14751, Entradas y Archivos de entradas */
body.post-type-archive-product header.site-header,
body.page-id-14751 header.site-header,
body.single-post header.site-header,
body.blog header.site-header,
body.archive header.site-header {
  background-color: #292929 !important;
  margin-top: 0 !important;
  position: relative !important;
  z-index: 100;
}

.elementor-location-header {
  position: relative !important;
  top: 0 !important;
}/* End custom CSS */