.bdt-lightbox{background-color:var( --e-global-color-uicore_secondary );}.bdt-lightbox .bdt-close.bdt-icon{border-style:none;}.elementor-widget .tippy-tooltip .tippy-content{text-align:center;}/* Start custom CSS */.ro-demo-stage {
  position: relative;
  width: 100%;
  max-width: 860px;
  min-height: 540px;
  border-radius: 24px;
  overflow: hidden;
}

.ro-demo-panel {
  position: absolute;
  inset: 0;
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 0.35s ease, transform 0.35s ease;
  pointer-events: none;
}

.ro-demo-panel.is-active {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
  z-index: 2;
}

.ro-hero-section {
  position: relative;
  overflow: visible;
  z-index: 1;
}

.ro-hero-section::before,
.ro-hero-section::after {
  content: "";
  position: absolute;
  left: -20vw;
  width: 145vw;
  pointer-events: none;
  z-index: 0;
  border-radius: 999px;
  transform: rotate(-9deg);
  will-change: transform, opacity;
}

.ro-hero-section::before {
  height: 150px;
  bottom: -20px;
  background: linear-gradient(
    90deg,
    rgba(76, 217, 217, 0.98) 0%,
    rgba(92, 132, 255, 0.98) 48%,
    rgba(151, 71, 255, 0.98) 100%
  );
  filter: blur(18px);
  opacity: 0.95;
  animation: roHeroRibbonMain 3.2s ease-in-out infinite alternate;
}

.ro-hero-section::after {
  height: 95px;
  bottom: -35px;
  background: linear-gradient(
    90deg,
    rgba(76, 217, 217, 0.62) 0%,
    rgba(92, 132, 255, 0.7) 50%,
    rgba(151, 71, 255, 0.76) 100%
  );
  filter: blur(26px);
  opacity: 0.62;
  animation: roHeroRibbonGlow 2.6s ease-in-out infinite alternate;
}

@keyframes roHeroRibbonMain {
  0% {
    transform: translateX(0) translateY(0) rotate(-9deg) scaleX(1);
  }
  100% {
    transform: translateX(85px) translateY(-18px) rotate(-6deg) scaleX(1.04);
  }
}

@keyframes roHeroRibbonGlow {
  0% {
    transform: translateX(0) translateY(0) rotate(-9deg) scaleX(1);
  }
  100% {
    transform: translateX(-70px) translateY(16px) rotate(-12deg) scaleX(1.03);
  }
}

/* hero content erboven */
.ro-hero-section > * {
  position: relative;
  z-index: 2;
}



.ro-sticky-right-col {
  padding-bottom: 20px !important;
}

.ro-sticky-right-col .ro-demo-sticky {
  margin-bottom: 0 !important;
}

.ro-floating-bg {
  position: relative;
  overflow: visible;
  background: transparent;
}

.ro-floating-bg::before,
.ro-floating-bg::after {
  content: "";
  position: absolute;
  border-radius: 999px;
  pointer-events: none;
  filter: blur(70px);
  opacity: 0.55;
  z-index: 0;
  will-change: transform, opacity;
}

.ro-floating-bg::before {
  width: 420px;
  height: 420px;
  left: -120px;
  top: 120px;
  background: radial-gradient(
    circle,
    rgba(88, 185, 220, 0.18) 0%,
    rgba(88, 185, 220, 0.08) 35%,
    rgba(88, 185, 220, 0) 72%
  );
  animation: roBubbleFloatOne 16s ease-in-out infinite alternate;
}

.ro-floating-bg::after {
  width: 460px;
  height: 460px;
  right: -140px;
  top: 40px;
  background: radial-gradient(
    circle,
    rgba(99, 91, 255, 0.16) 0%,
    rgba(99, 91, 255, 0.07) 38%,
    rgba(99, 91, 255, 0) 74%
  );
  animation: roBubbleFloatTwo 18s ease-in-out infinite alternate;
}

.ro-floating-bg > * {
  position: relative;
  z-index: 1;
}

@keyframes roBubbleFloatOne {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
    opacity: 0.48;
  }
  100% {
    transform: translate3d(90px, -30px, 0) scale(1.08);
    opacity: 0.62;
  }
}

@keyframes roBubbleFloatTwo {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
    opacity: 0.44;
  }
  100% {
    transform: translate3d(-70px, 45px, 0) scale(1.06);
    opacity: 0.58;
  }
}/* End custom CSS */