/*===========================================
*  COLORS
* ===========================================*/
:root {
  /*Colores*/

  --color-amarillo: #ffd71d;
  --color-azul: #0037ff;
  --color-blanco: #ffffff;
  --color-fucsia: #ff5aea;
  --color-menta: #61c9ba;
  --color-morado: #672482;
  --color-rosado: #db9dd2;
  --color-gradiente: radial-gradient(
    ellipse at center,
    var(--color-rosado) 0%,
    var(--color-menta) 50%
  );

  /*Dimensiones*/

  /*tamaños letras*/
}

/*===========================================
*  LOADING
* ===========================================*/
#kbb_loading {
  background: var(--color-fucsia);
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  z-index: 9999;
}

body.loaded #kbb_loading {
  animation: animationLoading 1s ease-in-out forwards;
}

@keyframes animationLoading {
  0% {
    width: 100vw;
  }
  100% {
    width: 0vw;
  }
}
/* 
@media (max-width: 769px) {
  .kvb-numero {
    position: absolute;
    top: -4%;
    left: -5%;
    z-index: 2;
  }
} */

.kvb-fondo .e-con-inner {
  position: relative !important;
}

.kvb-fondo-img-1 {
  position: absolute !important;
  top: 4%;
  left: 18%;
  z-index: 2;
}

.kvb-fondo-img-2 {
  position: absolute !important;
  top: -7%;
  right: 35%;
  z-index: 2;
}

.kvb-fondo-img-3 {
  position: absolute !important;
  top: -8%;
  right: 8%;
  z-index: 2;
}

.kvb-cont {
  position: relative !important;
  max-width: 1140px !important;
}

.kvb-circulo {
  height: auto;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background: linear-gradient(351deg, #0037ff 0%, #672482 50%, #672482 100%);
  filter: blur(5px);
  animation: float 3s ease-in-out infinite;
  position: absolute !important;
  z-index: -1;
  opacity: 0.5;
}

#kvb-circulo-1 {
  width: 30%;
  top: -44%;
  left: -18%;
}

#kvb-circulo-2 {
  width: 13%;
  top: -26%;
  right: -6%;
  animation-delay: 2s;
}

#kvb-circulo-3 {
  width: 13%;
  top: -26%;
  right: -6%;
  animation-delay: 2s;
}

#kvb-circulo-4 {
  width: 12%;
  top: 3%;
  left: 39%;
  animation-delay: 3s;
}

#kvb-circulo-5 {
  animation-delay: 4s;
  width: 36%;
  top: 7%;
  right: -15%;
}

#kvb-circulo-6 {
  width: 20%;
  top: 35%;
  right: 26%;
}

/* Animación de movimiento sutil */
@keyframes float {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
  100% {
    transform: translateY(0);
  }
}

.kvb-medios-pago img {
  position: relative;
}

/* Cursor simulado */
/* .kvb-medios-pago .elementor-widget-image::after { */
.kvb-medios-pago .elementor-widget-image::after {
  background-image: url("https://keyvisualsbrand.com/wp-content/uploads/2026/04/mouse_pointer.webp");
  background-size: contain;
  background-repeat: no-repeat;
  content: "";
  display: block;
  position: absolute;
  width: 30px;
  height: 30px;

  border-radius: 50%;
  top: 80%;
  left: 80%;
  transform: translate(-50%, -50%);
  /* opacity: 0; */
  opacity: 0;
  animation: cursorCycle 4s linear infinite;
}

/* Secuencia: cada imagen tiene un delay distinto */
.kvb-medios-pago .elementor-widget-image:nth-child(1)::after {
  animation-delay: 0s;
}
.kvb-medios-pago .elementor-widget-image:nth-child(2)::after {
  animation-delay: 1s;
}
.kvb-medios-pago .elementor-widget-image:nth-child(3)::after {
  animation-delay: 2s;
}
.kvb-medios-pago .elementor-widget-image:nth-child(4)::after {
  animation-delay: 3s;
}

/* Animación: aparece y desaparece */
@keyframes cursorCycle {
  0% {
    opacity: 0;
  }
  33% {
    opacity: 1;
  }
  66% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

.kvb-banner-filas .n2-ss-layer-row-inner {
  flex-wrap: nowrap !important;
}

p:last-of-type {
  margin-bottom: 0 !important;
}
