.Icon-Discovery {
  width: 62px;
  height: 62px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.Icon-Discovery .Discovery-1 {
  width: 100%;
  height: 75%;
  position: absolute;
  border-radius: 2px;
  border: 3px solid #fff;
  top: 0;
  z-index: 2;
  animation: pulse-animation 1s ease-in;
  animation-iteration-count: 1;
  animation-play-state: paused;
  animation-delay: 1.5s;
}
.Icon-Discovery .Discovery-2 {
  display: block;
  border-radius: 2px;
  border: 3px solid #fabc05;
  background: #fabc05;
  position: absolute;
  margin: auto;
  bottom: 10%;
  left: -50%;
  right: -50%;
  width: 40%;
  height: 50%;
  z-index: 1;
  animation: discovery 1s infinite linear;
  animation-iteration-count: 1;
  animation-play-state: paused;
}
.Icon-Discovery .Discovery-3 {
  display: block;
  border: 3px solid #fabc05;
  background: #fabc05;
  position: absolute;
  margin: auto;
  bottom: 0;
  left: -50%;
  right: -50%;
  width: 20%;
  height: 10%;
  z-index: 1;
}
.Icon-Discovery.animateDiscovery .Discovery-1 {
  animation-play-state: running;
}
.Icon-Discovery.animateDiscovery .Discovery-2 {
  animation-play-state: running;
}
@keyframes discovery {
  0% {
    width: 40%;
    height: 50%;
  }
  20% {
    width: 40%;
    height: 20%;
    background: #fabc05;
  }
  40% {
    width: 40%;
    height: 30%;
    background: #fabc05;
  }
  60% {
    width: 40%;
    height: 40%;
    background: #fabc05;
  }
  80% {
    width: 40%;
    height: 50%;
    background: #fabc05;
  }
  100% {
    width: 40%;
    height: 50%;
    background: #fabc05;
  }
}
@keyframes pulse-animation {
  0% {
    box-shadow: 0 0 10px rgba(255, 229, 158, 0.3), 0 0 80px 8px rgba(255, 188, 5, 0.3);
  }
  100% {
    box-shadow: 0 0 10px rgba(255, 229, 158, 0.3), 0 0 80px 8px rgba(255, 188, 5, 0);
  }
}
.Icon-Design {
  width: 62px;
  height: 62px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.Icon-Design .Design-1 {
  width: 64%;
  height: 64%;
  position: absolute;
  border-radius: 2px;
  border: 3px solid #fff;
  bottom: 0;
  left: 0;
  z-index: 3;
}
.Icon-Design .Design-2 {
  width: 64%;
  height: 64%;
  position: absolute;
  border-radius: 2px;
  background: #fabc05;
  bottom: 0;
  left: 0;
  z-index: 2;
  margin: auto;
}
.Icon-Design .Design-3 {
  width: 64%;
  height: 64%;
  position: absolute;
  border-radius: 2px;
  border: 3px solid #fff;
  top: 0;
  right: 0;
  z-index: 1;
}
.Icon-Design.animateDesign .Design-2 {
  bottom: 18%;
  left: 18%;
  z-index: 2;
  margin: auto;
  animation: design 1.5s infinite linear;
  animation-iteration-count: 1;
  transform: rotateZ(0);
}
.Icon-Design.animateDesign2 .Design-2 {
  animation: wiggle 2s linear infinite;
  animation-iteration-count: 1;
}
@keyframes design {
  0% {
    bottom: 0;
    left: 0;
  }
  50% {
    bottom: 18%;
    left: 18%;
  }
  100% {
    bottom: 18%;
    left: 18%;
  }
}
@keyframes wiggle {
  0%,
  7% {
    transform: rotateZ(0);
  }
  15% {
    transform: rotateZ(-15deg);
  }
  20% {
    transform: rotateZ(10deg);
  }
  25% {
    transform: rotateZ(-10deg);
  }
  30% {
    transform: rotateZ(6deg);
  }
  35% {
    transform: rotateZ(-4deg);
  }
  40%,
  100% {
    transform: rotateZ(0);
  }
}
.Icon-Scalable {
  width: 62px;
  height: 62px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.Icon-Scalable .Scalable-1 {
  width: 50%;
  height: 50%;
  position: absolute;
  border-radius: 2px;
  border: 3px solid #fff;
  bottom: 0;
  left: 0;
  z-index: 2;
}
.Icon-Scalable .Scalable-2 {
  width: 80%;
  height: 80%;
  bottom: 20%;
  left: 20%;
  position: absolute;
  border-radius: 2px;
  background: #fabc05;
  z-index: 1;
}
.Icon-Scalable.animateScalable .Scalable-2 {
  width: 80%;
  height: 80%;
  animation: Scalable 1.5s infinite linear;
  animation-iteration-count: 1;
}
@keyframes Scalable {
  0% {
    width: 20%;
    height: 20%;
  }
  60% {
    width: 90%;
    height: 90%;
  }
  100% {
    width: 80%;
    height: 80%;
  }
}
.Icon-CMS {
  width: 62px;
  height: 62px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.Icon-CMS .CMS-1 {
  width: 100%;
  height: 80%;
  position: absolute;
  border-radius: 2px;
  background: #fabc05;
  top: 0;
  left: 0;
  z-index: 1;
}
.Icon-CMS .CMS-2 {
  width: 50%;
  height: 40%;
  position: absolute;
  border-radius: 2px;
  border: 3px solid #fff;
  left: -50%;
  right: -50%;
  bottom: 0;
  margin: auto;
  z-index: 2;
}
.Icon-CMS.animateCMS .CMS-2 {
  animation: cms 2s linear infinite;
  animation-iteration-count: 1;
}
@keyframes cms {
  0%,
  7% {
    transform: rotateZ(0);
  }
  15% {
    transform: rotateZ(-15deg);
  }
  20% {
    transform: rotateZ(10deg);
  }
  25% {
    transform: rotateZ(-10deg);
  }
  30% {
    transform: rotateZ(6deg);
  }
  35% {
    transform: rotateZ(-4deg);
  }
  40%,
  100% {
    transform: rotateZ(0);
  }
}
.Page-Icon-Discovery {
  width: 62px;
  height: 62px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.Page-Icon-Discovery .Discovery-1 {
  width: 100%;
  height: 75%;
  position: absolute;
  border-radius: 2px;
  border: 3px solid #fff;
  top: 0;
  z-index: 2;
}
.Page-Icon-Discovery .Discovery-2 {
  display: block;
  border-radius: 2px;
  border: 3px solid #912afb;
  background: #912afb;
  position: absolute;
  margin: auto;
  bottom: 10%;
  left: -50%;
  right: -50%;
  width: 40%;
  height: 50%;
  z-index: 1;
}
.Page-Icon-Discovery .Discovery-3 {
  display: block;
  border: 3px solid #912afb;
  background: #912afb;
  position: absolute;
  margin: auto;
  bottom: 0;
  left: -50%;
  right: -50%;
  width: 20%;
  height: 10%;
  z-index: 1;
}
.Page-Icon-Discovery.Solution {
  width: 150px;
  height: 150px;
}
@media (max-width: 1152px) {
  .Page-Icon-Discovery.Solution {
    width: 100px;
    height: 100px;
  }
}
@media (max-width: 768px) {
  .Page-Icon-Discovery.Solution {
    width: 70px;
    height: 70px;
  }
}
.Page-Icon-Discovery.Solution .Discovery-1 {
  border-color: #974DE4;
  border-width: 5px;
}
@media (max-width: 768px) {
  .Page-Icon-Discovery.Solution .Discovery-1 {
    border-width: 3px;
  }
}
.Page-Icon-Discovery.Solution .Discovery-2,
.Page-Icon-Discovery.Solution .Discovery-3 {
  background-color: #2E0E9B;
  border: 0;
}
.Page-Icon-Design {
  width: 62px;
  height: 62px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.Page-Icon-Design .Design-1 {
  width: 64%;
  height: 64%;
  position: absolute;
  border-radius: 2px;
  border: 3px solid #fff;
  bottom: 0;
  left: 0;
  z-index: 3;
}
.Page-Icon-Design .Design-2 {
  width: 64%;
  height: 64%;
  position: absolute;
  border-radius: 2px;
  background: #912afb;
  z-index: 2;
  margin: auto;
}
.Page-Icon-Design .Design-3 {
  width: 64%;
  height: 64%;
  position: absolute;
  border-radius: 2px;
  border: 3px solid #fff;
  top: 0;
  right: 0;
  z-index: 1;
}
.Page-Icon-Design.Solution {
  width: 150px;
  height: 150px;
}
@media (max-width: 1152px) {
  .Page-Icon-Design.Solution {
    width: 100px;
    height: 100px;
  }
}
@media (max-width: 768px) {
  .Page-Icon-Design.Solution {
    width: 70px;
    height: 70px;
  }
}
.Page-Icon-Design.Solution .Design-2 {
  background-color: #2E0E9B;
}
.Page-Icon-Design.Solution .Design-1,
.Page-Icon-Design.Solution .Design-3 {
  border-color: #974DE4;
  border-width: 5px;
}
@media (max-width: 768px) {
  .Page-Icon-Design.Solution .Design-1,
  .Page-Icon-Design.Solution .Design-3 {
    border-width: 3px;
  }
}
.Page-Icon-Scalable {
  width: 62px;
  height: 62px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.Page-Icon-Scalable .Scalable-1 {
  width: 50%;
  height: 50%;
  position: absolute;
  border-radius: 2px;
  border: 3px solid #fff;
  bottom: 0;
  left: 0;
  z-index: 2;
}
.Page-Icon-Scalable .Scalable-2 {
  width: 80%;
  height: 80%;
  bottom: 20%;
  left: 20%;
  position: absolute;
  border-radius: 2px;
  background: #912afb;
  z-index: 1;
}
.Page-Icon-Scalable.Solution {
  width: 150px;
  height: 150px;
}
@media (max-width: 1152px) {
  .Page-Icon-Scalable.Solution {
    width: 100px;
    height: 100px;
  }
}
@media (max-width: 768px) {
  .Page-Icon-Scalable.Solution {
    width: 70px;
    height: 70px;
  }
}
.Page-Icon-Scalable.Solution .Scalable-1 {
  border-color: #2E0E9B;
  border-width: 5px;
}
@media (max-width: 768px) {
  .Page-Icon-Scalable.Solution .Scalable-1 {
    border-width: 3px;
  }
}
.Page-Icon-Scalable.Solution .Scalable-2 {
  background-color: #974DE4;
}
.Page-Icon-CMS {
  width: 62px;
  height: 62px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.Page-Icon-CMS .CMS-1 {
  width: 100%;
  height: 80%;
  position: absolute;
  border-radius: 2px;
  background: #912afb;
  top: 0;
  left: 0;
  z-index: 1;
}
.Page-Icon-CMS .CMS-2 {
  width: 50%;
  height: 40%;
  position: absolute;
  border-radius: 2px;
  border: 3px solid #fff;
  left: -50%;
  right: -50%;
  bottom: 0;
  margin: auto;
  z-index: 2;
}
.Page-Icon-CMS.Solution {
  width: 150px;
  height: 150px;
}
@media (max-width: 1152px) {
  .Page-Icon-CMS.Solution {
    width: 100px;
    height: 100px;
  }
}
@media (max-width: 768px) {
  .Page-Icon-CMS.Solution {
    width: 70px;
    height: 70px;
  }
}
.Page-Icon-CMS.Solution .CMS-1 {
  background-color: #974DE4;
}
.Page-Icon-CMS.Solution .CMS-2 {
  border-color: #2E0E9B;
  border-width: 5px;
}
@media (max-width: 768px) {
  .Page-Icon-CMS.Solution .CMS-2 {
    border-width: 3px;
  }
}
.Icon-Key-Differentiators {
  width: 62px;
  height: 62px;
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}
.Icon-Key-Differentiators .Key-1 {
  width: 70%;
  height: 85%;
  position: absolute;
  border-radius: 2px;
  border: 3px solid #fff;
  top: 0;
  left: 0;
  z-index: 1;
}
.Icon-Key-Differentiators .Key-2 {
  display: block;
  border-radius: 2px;
  background: #912AFB;
  position: absolute;
  margin: auto;
  bottom: 0;
  right: 0;
  width: 75%;
  height: 75%;
  z-index: 1;
}
.Icon-Uniq-Design {
  width: 62px;
  height: 62px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.Icon-Uniq-Design .Design-1 {
  width: 64%;
  height: 64%;
  position: absolute;
  border-radius: 2px;
  border: 3px solid #fff;
  bottom: 0;
  right: 0;
  z-index: 3;
}
.Icon-Uniq-Design .Design-2 {
  width: 64%;
  height: 64%;
  position: absolute;
  border-radius: 2px;
  background: #912AFB;
  z-index: 2;
  margin: auto;
}
.Icon-Uniq-Design .Design-3 {
  width: 64%;
  height: 64%;
  position: absolute;
  border-radius: 2px;
  border: 3px solid #fff;
  top: 0;
  left: 0;
  z-index: 1;
}
.Icon-Methodology {
  width: 62px;
  height: 62px;
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}
.Icon-Methodology .Methodology-1 {
  width: 80%;
  height: 80%;
  position: absolute;
  border-radius: 2px;
  border: 3px solid #fff;
  top: 0;
  left: 0;
  z-index: 1;
}
.Icon-Methodology .Methodology-2 {
  display: block;
  border-radius: 2px;
  background: #912AFB;
  position: absolute;
  margin: auto;
  bottom: 0;
  right: 0;
  width: 75%;
  height: 75%;
  z-index: 1;
  border-radius: 50%;
}
.Icon-Deliver {
  width: 62px;
  height: 62px;
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}
.Icon-Deliver .Deliver-1 {
  width: 100%;
  height: 80%;
  position: absolute;
  border-radius: 2px;
  border: 3px solid #fff;
  bottom: 0;
  left: 0;
  z-index: 1;
}
.Icon-Deliver .Deliver-2 {
  display: block;
  border-radius: 2px;
  background: #912AFB;
  position: absolute;
  left: -50%;
  right: -50%;
  margin: auto;
  top: 0;
  width: 50%;
  height: 70%;
  z-index: 1;
}
.Icon-Deliver .Deliver-2::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 0;
  border-bottom: 13px solid #1d003c;
  border-left: 16px solid transparent;
  border-right: 16px solid transparent;
}
