.elementor-120 .elementor-element.elementor-element-32a067e0{--display:flex;}body.elementor-page-120:not(.elementor-motion-effects-element-type-background), body.elementor-page-120 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#010101;}/* Start custom CSS for html, class: .elementor-element-76aa07e */.vision-section {
  display: flex;
  align-items: center;
  justify-content: center;
}

.vision-container {
  width: 900px;
  height: 550px;
  position: relative;
  overflow: hidden;
  border-radius: 20px;
  cursor: grab;
  user-select: none;
}

/* TOP */
.vision-top {
  position: absolute;
  inset: 0;
  background: url("https://portal.thalitorres.com.br/wp-content/uploads/2026/04/img-cima002-1.jpg") center/cover no-repeat;
  z-index: 3;
  clip-path: ellipse(120% 80% at 50% 0%);
  transform-origin: top;
  will-change: transform, clip-path;
}

/* BOTTOM */
.vision-bottom {
  position: absolute;
  inset: 0;
  background: url("https://portal.thalitorres.com.br/wp-content/uploads/2026/04/img-baixo-003-1.jpg") center/cover no-repeat;
  z-index: 1;
}

/* LIGHT (CURSOR FOLLOW) */
.light {
  position: absolute;
  width: 300px;
  height: 300px;
  background: radial-gradient(
  circle at center,
  rgba(255, 196, 105, 0.75),
  rgba(255, 196, 105, 0.18),
  transparent 80%
);

  top: 0;
  left: 0;

  transform: translate(-50%, -50%);
  filter: blur(45px);

  z-index: 4;
  pointer-events: none;
  will-change: transform, opacity;
}

/* TEXT */
.bottom-text {
  position: absolute;
  width: 100%;
  top: 75%;
  text-align: center;
  font-size: 45px;
  font-weight: 600;
  color: #fff;
  opacity: 0;
  transform: translateY(40px);
  z-index: 5;
  pointer-events: none;
  font-family: 'DM Sans', sans-serif;
}

/* HINT */
.drag-hint {
  position: absolute;
  bottom: 20px;
  width: 100%;
  text-align: center;
  color: #DDDDDD;
  font-size: 14px;
  z-index: 10;
  pointer-events: none;
  font-family: 'DM Sans', sans-serif;
  will-change: transform, opacity;
}

/* SHADOW */
.fold-shadow {
  position: absolute;
  top: 0;
  left: 0;
  height: 60px;
  width: 100%;
  z-index: 4;
  pointer-events: none;
  background: linear-gradient(to bottom, rgba(0,0,0,0.6), transparent);
  opacity: 0;
}

/* HIGHLIGHT */
.fold-highlight {
  position: absolute;
  top: 0;
  left: 0;
  width: 180px;
  height: 80px;
  z-index: 6;
  pointer-events: none;

  background: radial-gradient(
    circle at center,
    rgba(255,255,255,0.35),
    transparent 70%
  );

  transform: translate(-50%, -50%);
  filter: blur(6px);
  opacity: 0;
}

@media (max-width: 768px) {

  .vision-container {
    width: 100%;
    height: 320px;
  }

  .light {
    width: 180px;
    height: 180px;
    filter: blur(30px);
  }

  .bottom-text {
    font-size: 28px;
  }

  .fold-highlight {
    width: 140px;
    height: 60px;
    filter: blur(4px);
  }

  .drag-hint {
    font-size: 12px;
  }
}/* End custom CSS */