.elementor-10899 .elementor-element.elementor-element-37cb574{--display:flex;--padding-top:100px;--padding-bottom:100px;--padding-left:50px;--padding-right:50px;}.elementor-10899 .elementor-element.elementor-element-7bb54b2{--display:flex;--gap:20px 20px;--row-gap:20px;--column-gap:20px;}.elementor-10899 .elementor-element.elementor-element-80eff46{text-align:center;}.elementor-10899 .elementor-element.elementor-element-4ce35c0{text-align:center;}@media(max-width:767px){.elementor-10899 .elementor-element.elementor-element-bb2db78{padding:0% 0% 0% 0%;}}@media(min-width:768px){.elementor-10899 .elementor-element.elementor-element-37cb574{--content-width:1200px;}}/* Start custom CSS for html, class: .elementor-element-bb2db78 */:root {
  --cycle: 8s;
}

/* MAP BACKGROUND — aspect ratio preserved */
#location-map {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 39.71%;   /* keep this — it sets the map ratio */
  background: url(https://sprout.ai/wp-content/uploads/2025/11/map-bg-scaled.jpg) no-repeat center;
  background-size: cover;
}

.continent {
  position: absolute;
}

.mask-layer {
  opacity: 0;

  width: 100%;
  height: 100%;

  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;

  animation: fadeCycle var(--cycle) ease-in-out infinite;

}

.circle-ripple:before {
  content:'';
  position: absolute;
  top:0; left:0; right:0; bottom:0;
  margin: auto;
  background-color: #8942fe;
  width: 7.5vw;
  height: 7.5vw;
  border-radius: 50%;
  -webkit-animation: ripple 0.7s linear infinite;
          animation: ripple 0.7s linear infinite;
}

.continent.south-america .circle-ripple:before, .continent.europe .circle-ripple:before {
    width: 5vw;
    height: 5vw;
}

.continent.apac .circle-ripple:before {
    right: -50%;
    width: 12vw;
    height: 12vw;
}

/* Europe */
.continent.europe {
  width: 23.75%;
  height: 31.8%;
  top: 0%;
  left: 42.5%;
}

.continent.europe .mask-layer {
/*      background-image: url(https://sprout.ai/wp-content/uploads/2025/11/europe.png);*/
  -webkit-mask-image: url(https://sprout.ai/wp-content/uploads/2025/11/europe.png);
  mask-image: url(https://sprout.ai/wp-content/uploads/2025/11/europe.png);
}

/* North America */
.continent.north-america {
  width: 46.25%;
  height: 60.75%;
  top: 0;
  left: 0;
}

.continent.north-america .mask-layer {
/*      background-image: url(https://sprout.ai/wp-content/uploads/2025/11/north-america.png);*/
  -webkit-mask-image: url(https://sprout.ai/wp-content/uploads/2025/11/north-america.png);
  mask-image: url(https://sprout.ai/wp-content/uploads/2025/11/north-america.png);
}

/* South America */
.continent.south-america {
  width: 25%;
  height: 45.3%;
  bottom: 0;
  left: 17%;
}

.continent.south-america .mask-layer {
/*      background-image: url(https://sprout.ai/wp-content/uploads/2025/11/south-america.png);*/
  -webkit-mask-image: url(https://sprout.ai/wp-content/uploads/2025/11/south-america.png);
  mask-image: url(https://sprout.ai/wp-content/uploads/2025/11/south-america.png);
}

/* APAC */
.continent.apac {
  width: 32.15%;
  height: 73%;
  bottom: 4.2%;
  right: 0;
}

.continent.apac .mask-layer {
/*      background-image: url(https://sprout.ai/wp-content/uploads/2025/11/apac.png);*/
  -webkit-mask-image: url(https://sprout.ai/wp-content/uploads/2025/11/apac.png);
  mask-image: url(https://sprout.ai/wp-content/uploads/2025/11/apac.png);
}

/* PIN */
.pin {
  background-image: url(https://sprout.ai/wp-content/uploads/2025/11/location.png);
  background-size: cover;
  width: 20px;
  height: 36px;
  z-index: 1;
  position: absolute;
}

.pin.london {
  left: 46.5%;
  top: 10%;
}

.continent.europe .mask-layer { 
  animation-delay: 0s;
}

.continent.south-america .mask-layer { 
  animation-delay: calc(var(--cycle) * 0.25);
}

.continent.apac .mask-layer { 
  animation-delay: calc(var(--cycle) * 0.5);
}

.continent.north-america .mask-layer { 
  animation-delay: calc(var(--cycle) * 0.75);
}

/* Tooltip */
.tooltip-info {
    position: absolute;
    top: 36px;
    left: 10px;
    width: 100px;
    border-radius: 0 15px 0 15px;
    background: #00CC00;
    color: #0F0842;
    padding: 6px 12px;
    font-size: 12px;
    text-align: center;
    opacity: 0;
}

.tooltip-info .tooltip-title {
    font-weight: bold;
    display: block;
    font-size: 1.15em;
}

.pin:hover .tooltip-info {
    opacity: 1;
}

/* Animations  */

@-webkit-keyframes ripple {
  0% {
    box-shadow: 0 0 0 0 rgba(137,66,254, 0.3), 0 0 0 1em rgba(137,66,254, 0.3), 0 0 0 3em rgba(137,66,254, 0.3), 0 0 0 5em rgba(137,66,254, 0.3);
  }
  100% {
    box-shadow: 0 0 0 1em rgba(137,66,254, 0.3), 0 0 0 3em rgba(137,66,254, 0.3), 0 0 0 5em rgba(137,66,254, 0.3), 0 0 0 8em rgba(137,66,254, 0);
  }
}

@keyframes ripple {
  0% {
    box-shadow: 0 0 0 0 rgba(137,66,254, 0.3), 0 0 0 1em rgba(137,66,254, 0.3), 0 0 0 3em rgba(137,66,254, 0.3), 0 0 0 5em rgba(137,66,254, 0.3);
  }
  100% {
    box-shadow: 0 0 0 1em rgba(137,66,254, 0.3), 0 0 0 3em rgba(137,66,254, 0.3), 0 0 0 5em rgba(137,66,254, 0.3), 0 0 0 8em rgba(137,66,254, 0);
  }
}


@-webkit-keyframes fadeCycle {
  0%   { opacity: 0; }
  10%  { opacity: 1; }
  40%  { opacity: 1; }
  50%  { opacity: 0; }
  100% { opacity: 0; }
}

@keyframes fadeCycle {
  0%   { opacity: 0; }
  10%  { opacity: 1; }
  40%  { opacity: 1; }
  50%  { opacity: 0; }
  100% { opacity: 0; }
}

@media (max-width:767px) {
    .elementor-10899 .elementor-element.elementor-element-bb2db78 {
        min-height: 100px;
    }
}/* End custom CSS */