.revi-text-perspective-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  /* Background color removed as per request */
}

.revi-perspective-text {
  display: flex;
  margin: 0;
}

.revi-letter {
  display: inline-block;
  position: relative;
  transform-style: preserve-3d;
}

.revi-letter-inner {
  display: inline-block;
  position: relative;
  transform-style: preserve-3d;
  transform: perspective(var(--perspective, 1000px))
    rotateY(var(--rotation-start, 90deg));
  opacity: 1;
  transition:
    transform var(--anim-speed, 5s) ease-out,
    opacity var(--anim-speed, 5s) ease-out;
}

.revi-letter-text {
  display: inline-block;
  position: relative;
  z-index: 1;
  color: var(--text-color, #d1d1d1);
}

.revi-letter-gradient {
  position: absolute;
  top: 0;
  left: 0;
  width: 108%;
  height: 100%;
  background: var(
    --gradient,
    linear-gradient(
      90deg,
      transparent 0%,
      rgba(0, 0, 0, 0.5) 50%,
      rgba(0, 0, 0, 1) 100%
    )
  );
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  opacity: var(--gradient-opacity, 1);
  z-index: 2;
  transition: opacity var(--anim-speed, 5s) ease-out;
  pointer-events: none;
}

.revi-letter-noise {
  position: absolute;
  top: 0;
  left: 0;
  width: 110%;
  height: 100%;
  z-index: 3;
  background-image:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.7' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E"),
    linear-gradient(
      var(--noise-color, var(--text-color)),
      var(--noise-color, var(--text-color))
    );
  background-blend-mode: multiply;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--anim-speed, 5s) ease-out;
}

.revi-letter.active .revi-letter-inner {
  transform: perspective(var(--perspective, 1000px)) rotateY(0deg);
  opacity: 1;
}

.revi-letter.active .revi-letter-gradient {
  opacity: 0;
}

.revi-letter.active .revi-letter-noise {
  opacity: var(--noise-opacity, 0.12);
  mix-blend-mode: hard-light;
}

/* Editor preview - Show final state by default but allow animation */
body.elementor-editor-active
  .revi-text-perspective-wrapper:not(.is-animating)
  .revi-letter-inner {
  opacity: 1;
  transform: perspective(var(--perspective, 1000px)) rotateY(0deg);
}

body.elementor-editor-active
  .revi-text-perspective-wrapper:not(.is-animating)
  .revi-letter-gradient {
  opacity: 0;
}

body.elementor-editor-active
  .revi-text-perspective-wrapper:not(.is-animating)
  .revi-letter-noise {
  opacity: var(--noise-opacity, 0.12);
}