section.feature-list {
  display: flex;
  flex-direction: column;
  gap: 100px 170px;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0 auto;
  max-width: 1000px;

  &.pair {
    flex-direction: row;
    align-items: flex-start;

    > .item {
      flex: 1 0 max(40%, 300px);
      gap: 24px;

      &:nth-child(even) {
        margin-top: 150px;
      }
    }
  }

  > .title {
    display: flex;
    flex-direction: column;
    gap: 24px;

    > h1 {
      font-size: 42px;
      line-height: 1.4;
      font-weight: 400;
    }

    &:not(.full) {
      > p {
        max-width: 450px;
      }
    }

    > .img-wrapper {
      max-width: 100%;

      > img {
        width: 100%;
        /* border-radius: 36px; */
      }

      > video {
        width: 100%;
        border-radius: 24px;
      }
    }
  }

  > .item {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 24px 100px;
    min-height: 400px;

    &.full {
      min-height: unset;
      flex-direction: column-reverse !important;
      gap: 24px;
    }

    > div {
      flex: 1 0 300px;
      border-radius: 36px;
    }

    > .img-wrapper {
      max-width: 100%;

      > img {
        width: 100%;
        /* border-radius: 36px; */
      }

      > video {
        width: 100%;
        border-radius: 24px;
      }
    }

    > .description {
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 24px;

      > h2 {
        font-size: 36px;
        font-weight: 400;

        background: linear-gradient(90deg, #8dcefe 13.71%, #c65bff 85.71%);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
      }

      > p {
        font-size: 18px;
        font-weight: 500;
      }

      > ul {
        font-size: 18px;
        font-weight: 500;
        margin: 0;
        padding-left: 1.25em;
      }
    }
  }
}

@media screen and (min-width: 600px) {
  section.feature-list > .item:nth-child(odd) {
    flex-direction: row-reverse;
  }
}

@media screen and (max-width: 600px) {
  section.feature-list > .item > .description {
    padding: 0;
  }

  section.feature-list.pair > .item:nth-child(even) {
    margin: unset;
  }
}