section.stack--component {
    padding: 80px 0px;
}
.svg-stack svg{
  overflow: visible;
}
.svg-stack svg g[id^="stack-"] {
  cursor: pointer;
  transform-box: fill-box;
  transform-origin: left center;
  transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: transform;
}

/* .svg-stack svg g[id^="stack-"].active {
  transform: translateX(240px);
}
 */
#stack-1.active , #stack-2.active , #stack-3.active , #stack-4.active , #stack-5.active {
  transform: translateY(35px) translateX(165px);
}

.svg-stack svg {
  pointer-events: none;
}

.svg-stack svg g {
  pointer-events: all;
}



/*  */
.tab--stack {display: flex;gap: 2px;margin-bottom: 20px;}

.tab--stack-content {
    flex: 1 0 0;
    padding: 12px 20px;
    border-top: 1px solid #bcbcbc;
    background: #F6F6F6;
}

.tab--stack-content h4 {
    margin: 0px;
    font-size: 18px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: 0.045px;
}

.tab--stack-content img {
    margin-bottom: 10px;
}

.tab--stack-content.active {
  font-weight: 600;
}

.tab--innerWrap {
  display: none;
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  background: linear-gradient(150deg, rgba(255, 255, 255, 0.00) 37.42%, rgba(255, 255, 255, 0.70) 84.05%), rgba(251, 251, 251, 0.80);
  box-shadow: 4px 4px 15px 0 rgba(0, 0, 0, 0.15);
  padding: 25px;
  margin-left: 70px;
}

.tab--innerWrap.active {
  display: block;
}
.tab--stack-content.active {
    background: var(--text-color);
}

.tab--stack-content.active h4 {
    color: #fff;
}
.tab--innerWrap img{
  margin-bottom:10px;
}
.tab--innerWrap h4 {
    font-size: 30px;
    font-weight: 400;
    line-height: 38px;
    margin-bottom: 20px;
}

.tab--innerWrap h4 br {
    display: none;
}

.tab--innerWrap ul li {
    font-size: 18px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: 0.045px;
    list-style: disc;
}

.tab--innerWrap ul {
    padding-left: 25px;
    margin-bottom: 20px;
}

.tab--stack-content:hover {
    cursor: pointer;
}

@media(max-width:768px){
  .tab--innerWrap h4 {
      font-size: 22px;
      line-height: 30px;
  }
  .svg-stack svg {
      height: 255px;
      width: 100%;
  }

  .tab--stack {
      display: unset;
  }

  .tab--innerWrap {
      margin: 0px;
  }

  .svg-stack {
      padding: 60px 0px;
      text-align: left;
  }
}