:root{--vesna-font:"Helvetica Neue LT Pro","Helvetica Neue",Helvetica,Arial,sans-serif}

.vesna-mega-menu-widget,
.vesna-mega-menu-widget *{box-sizing:border-box}
.vesna-mega-menu-widget a{color:inherit;text-decoration:none}

.vesna-mega-menu-widget{
  position:relative;
  width:100vw;
  max-width:100vw;
  margin-left:calc(50% - 50vw);
  height:479px;
  min-height:479px;
  overflow:hidden;
  color:#000000;
  background:transparent;
  font-family:var(--vesna-font);
  font-size:19px;
  font-weight:500;
  line-height:1;
}

.vesna-mm-col{
  position:absolute;
  top:38px;
  height:411px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:space-between;
  min-width:0;
}
.vesna-mm-col-1{left:1.002%;width:14.0%}
.vesna-mm-col-2{left:20.73%;width:14.2%}
.vesna-mm-col-3{left:44.83%;width:14.2%}
.vesna-mm-links{display:flex;flex-direction:column;align-items:flex-start;gap:18px;width:100%}
.vesna-mm-link,
.vesna-mm-cta{
  position:relative;
  display:block;
  width:max-content;
  max-width:100%;
  color:inherit;
  opacity:1;
  white-space:normal;
}
.vesna-mm-link.is-muted{opacity:.4;pointer-events:none}
.vesna-mm-link::after,
.vesna-mm-cta::after,
.vesna-mm-feature-title::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-4px;
  width:100%;
  height:1px;
  background:currentColor;
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .32s cubic-bezier(.22,.61,.36,1);
}
.vesna-mm-links.has-hover .vesna-mm-link:not(.is-muted){opacity:.4}
.vesna-mm-links.has-hover .vesna-mm-link.is-hovered{opacity:1}
.vesna-mm-link:hover::after,
.vesna-mm-link:focus-visible::after,
.vesna-mm-cta:hover::after,
.vesna-mm-cta:focus-visible::after{transform:scaleX(1)}

.vesna-mm-cta{display:inline-flex;align-items:center;gap:12px;margin-top:auto}
.vesna-mm-arrow{position:relative;display:inline-block;width:22px;height:10px;flex:0 0 22px}
.vesna-mm-arrow::before{content:"";position:absolute;left:0;right:0;top:5px;height:1px;background:currentColor}
.vesna-mm-arrow::after{content:"";position:absolute;right:0;top:2px;width:6px;height:6px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}

.vesna-mm-feature{
  position:absolute;
  left:68.565%;
  right:1.899%;
  top:29px;
  display:block;
  color:inherit;
}
.vesna-mm-feature-media{
  position:relative;
  display:block;
  width:100%;
  height:336px;
  overflow:hidden;
  background:rgba(127,127,127,.08);
}
.vesna-mm-feature-media img,
.vesna-mm-feature-media video{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.vesna-mm-feature-caption{display:flex;align-items:center;gap:15px;margin-top:18px;min-width:0;line-height:1}
.vesna-mm-feature-label{color:color-mix(in srgb,currentColor 40%,transparent);white-space:nowrap}
@supports not (color:color-mix(in srgb, black 40%, transparent)){
  .vesna-mm-feature-label{opacity:.4}
}
.vesna-mm-feature-title{position:relative;width:max-content;max-width:100%;white-space:normal}
.vesna-mm-feature:hover .vesna-mm-feature-title::after,
.vesna-mm-feature:focus-visible .vesna-mm-feature-title::after{transform:scaleX(1)}

/* Elementor Saved Template must remain full-width inside the header panel. */
.vesna-mega-content .elementor,
.vesna-mega-content .elementor-section-wrap,
.vesna-mega-content .elementor-section,
.vesna-mega-content .elementor-container,
.vesna-mega-content .e-con,
.vesna-mega-content .e-con-inner,
.vesna-mega-content .elementor-widget-vesna_mega_menu,
.vesna-mobile-template-host .elementor-widget-vesna_mega_menu{max-width:none!important;width:100%!important}
.vesna-mega-content .elementor-section.elementor-section-boxed>.elementor-container,
.vesna-mega-content .e-con.e-con-boxed>.e-con-inner{max-width:none!important}

@media (max-width:767px){
  .vesna-mega-menu-widget{
    width:100%;
    max-width:100%;
    margin-left:0;
    height:auto;
    min-height:0;
    overflow:visible;
    font-size:19px;
    line-height:1.18;
    display:flex;
    flex-direction:column;
    gap:42px;
  }
  .vesna-mm-col{
    position:static;
    width:100%;
    height:auto;
    display:flex;
    gap:28px;
  }
  .vesna-mm-links{gap:18px}
  .vesna-mm-col:empty{display:none}
  .vesna-mm-cta{margin-top:10px}
  .vesna-mm-feature{
    position:static;
    width:100%;
    margin-top:8px;
  }
  .vesna-mm-feature-media{height:auto;aspect-ratio:5/3}
  .vesna-mm-feature-caption{
    margin-top:16px;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:6px;
    line-height:1.15;
  }
  .vesna-mm-feature-label,
  .vesna-mm-feature-title{
    display:block;
    width:auto;
    max-width:100%;
  }
}

/* Standalone Elementor-editor preview gets the same focus behavior as the header host. */
.vesna-mm-links:hover .vesna-mm-link:not(.is-muted){opacity:.4}
.vesna-mm-links:hover .vesna-mm-link:not(.is-muted):hover{opacity:1}

/* VESNA© Mega Menu is always a full-viewport-width section, even when the Saved Template uses a boxed Elementor container. */
.elementor-widget-vesna_mega_menu,
.elementor-widget-vesna_mega_menu>.elementor-widget-container{width:100%!important;max-width:none!important;}
.vesna-mega-content .elementor-widget-vesna_mega_menu,
.vesna-mega-content .elementor-widget-vesna_mega_menu>.elementor-widget-container{margin:0!important;padding:0!important;}


.vesna-mega-content .vesna-mega-menu-widget,
.vesna-mobile-template-host .vesna-mega-menu-widget{
  color:var(--vesna-open-ink);
  background:var(--vesna-open-surface);
}


/* v1.6 mobile Saved Template clipping fix: the header drawer already owns viewport width. */
@media (max-width:767px){
  .vesna-mobile-template-host .elementor-widget-vesna_mega_menu,
  .vesna-mobile-template-host .elementor-widget-vesna_mega_menu>.elementor-widget-container,
  .vesna-mobile-template-host .vesna-mega-menu-widget{
    width:100%!important;
    max-width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
    transform:none!important;
  }
  .vesna-mobile-template-host .vesna-mm-col,
  .vesna-mobile-template-host .vesna-mm-feature{
    margin-left:0!important;
    left:auto!important;
    right:auto!important;
  }
}