:root {
  --color1: #9bdc3a;
  --green-2: #3b7f26;
  --dark-color: #081d10;
}

body {
  background:
    radial-gradient(circle at 80% 0%, rgba(46, 59, 180, 0.16), transparent 32%),
    linear-gradient(180deg, #030305 0%, #070711 55%, #030305 100%);
}

.hero {
  background:
    linear-gradient(90deg, rgba(3, 5, 4, 1) 0%, rgba(3, 5, 4, 0.82) 34%, rgba(3, 5, 4, 0.18) 74%, rgba(3, 5, 4, 0.86) 100%),
    url("../../assets/blix.png") center right / cover no-repeat;
}

.tags span {
  background: rgba(155, 220, 58, 0.09);
  border: 1px solid rgba(155, 220, 58, 0.22);
  color: #dff8c4;
}

.icon {
  border: 1px solid rgba(220, 217, 58, 0.25);
  background: rgba(220, 217, 58, 0.08);
}

.icon svg, .step-icon svg {
  stroke: var(--color1);
}

#telas {
  width: 100%;
  /* margin-left: calc(50% - 50vw); */
  overflow: hidden;
  margin-bottom: 32px;
}

#telas .telas-carousel {
  width: calc(200vw + 72px);
  max-width: none;
}

#telas .telas-carousel .owl-stage-outer {
  width: 100vw;
  overflow: hidden;
}

#telas .telas-carousel .owl-item img {
  width: 100%;
  max-width: none;
  height: auto;
  object-fit: contain;
}

@media (max-width: 1024px) {
  #telas .telas-carousel {
    width: calc(200vw + 24px);
  }
}

@media (max-width: 768px) {
  #telas .telas-carousel {
    width: 100vw;
  }
}
