.banner {
  height: calc(100dvh - 84px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  background-color: #fdfdfd;
  background: linear-gradient(280.2deg, #fdfdfd 20.6%, #eef4fa 100.2%);
}

.banner h1 {
  margin-bottom: 50px;
  width: 65%;
  color: #1e1d1d;
  font-size: 45px;
  font-weight: 700;
}

.banner p {
  color: #444;
  margin-bottom: 45px;
}

.banner .btn-home,
.banner .btn-home:focus-visible,
.banner .btn-home:hover {
  padding: 10px 20px;
  color: #f4edf8;
  background-color: #053fff;
  background: linear-gradient(90deg, #053fff 0, #005eff 100%);
}

/*  */
.fullcontainer {
  padding: 130px 0;
}
.sectionrow {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.sectioncol {
  width: 45%;
}
.sectioncol span {
  display: block;
  color: #636363;
  margin-bottom: 10px;
}
.sectioncol h2 {
  color: #1e1d1d;
  font-size: 28px;
  margin-bottom: 24px;
}
.sectioncol p {
  font-size: 14px;
  color: #404040;
  line-height: 1.5;
}

.section--1 {
  background-color: #fffefb;
}
.section--2 {
  background-color: #fff5df;
  background: linear-gradient(
    278.47deg,
    #fff5df 1.88%,
    rgba(255, 244, 250, 0.43) 82.77%
  );
}
.enterprise--saas .section--2 {
  background-color: #f7ebff;
}
.fullcontainer ul {
  padding: 0;
  list-style: none;
}
.fullcontainer ul li {
  margin-bottom: 10px;
  display: flex;
  gap: 10px;
  font-size: 14px;
}
.fullcontainer ul li img {
  position: relative;
  top: 2px;
}
.section--3 {
  /* background-color: #fffefb; */
}
.section--3 .btn {
  padding: 5px 10px;
  margin-top: 10px;
  margin-left: auto;
  width: fit-content;
  display: flex;
  gap: 6px;
  color: #fff;
  background: linear-gradient(3.78deg, #02126b 2.82%, #3c0471 96.63%);
}
.section--3 .btn span {
  margin-bottom: 0;
  color: #fff;
}
.section--4 {
  background-color: #f5f2ff;
  background: linear-gradient(278.79deg, #f5f2ff 0.76%, #f7ffff 99.54%);
}
.enterprise--saas .section--4 {
  padding-bottom: 0;
  background-color: #e3fffe;
  background: linear-gradient(270deg, #e3fffe 0%, #f2fffe 100%);
}
main:not(.enterprise--saas) .section--5 {
  padding-bottom: 0;
}
.section--6 {
  background: linear-gradient(97.73deg, #fcffff 19.05%, #e9edff 85.7%);
}
/* .section--7 {
  padding-bottom: 60px;
  background: linear-gradient(180deg, #ffffff 0%, #e7efff 100%);
} */
.section--8 {
  padding-bottom: 0;
  background: linear-gradient(97.73deg, #fcffff 19.05%, #e9edff 85.7%);
}
.section--9 {
  padding-bottom: 0;
}

.section--5 .sectionrow,
.section--9 .sectionrow {
  align-items: end;
}
.section--5 .sectionrow .sectioncol:last-child,
.section--9 .sectionrow .sectioncol:last-child {
  padding-bottom: 50px;
}
.section--10 {
  padding: 0 !important;
  height: 15px;
  background: linear-gradient(90deg, #202263 0%, #0f2eb8 100%);
}

.videogroup {
  display: flex;
  gap: 20px;
}
.videogroup img {
  width: 150px;
  height: auto;
}
.scroller {
  position: sticky;
  top: 0;
  z-index: 100;
  margin-top: 16px;
  padding: 16px 0;
  background: #fff;
}
.scroller ul {
  padding: 0;
  margin-bottom: 0;
  display: flex;
  list-style: none;
  gap: 40px;
  overflow-x: scroll;
  overflow-y: hidden;
}
.scroller ul li {
}

.slick-list {
  overflow: unset !important;
}
.scroller .targetItem {
  padding: 10px 16px;
  color: #2e2e32;
  font-size: 14px;
  text-decoration: none;
  text-wrap: nowrap;
}
.scroller .targetItem.active {
  background: #0159ff;
  color: #fff;
  border-radius: 40px;
}
.targetItem::selection {
  background-color: transparent;
}
.scroller > div {
  margin-left: 12.1vw;
}
.scroller ul li:last-child {
  margin-right: 12.1vw;
}
.scroll-container {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  white-space: nowrap;
  padding-bottom: 10px;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  cursor: pointer;
}

.scroll-container::-webkit-scrollbar {
  display: none;
}

@media (max-width: 756px) {
  .banner {
    height: 60vh;
  }
  .banner h1 {
    width: 90%;
    font-size: 24px;
  }

  .fullcontainer {
    padding: 60px 0;
  }
  .sectionrow {
    width: 100%;
    flex-direction: column;
  }
  .sectioncol {
    margin-bottom: 16px;
    width: 100%;
  }
  .section--8,
  .section--6 {
    padding-bottom: 0;
  }
  .section--8 .sectionrow .sectioncol:last-child,
  .section--6 .sectionrow .sectioncol:last-child {
    margin-bottom: 0;
  }
  .sectioncol span {
    font-size: 14px;
  }
  .sectioncol h2 {
    font-size: 20px;
  }
  .scroller > div {
    margin-left: -0.4rem;
  }
  .scroller ul {
    gap: 10px;
  }
  .scroller ul li:last-child {
    margin-right: -0.4rem;
  }
}
