.cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(288px, 1fr));
  grid-gap: 24px;
}
.cards_autorows {
  grid-auto-rows: 1fr;
}
.cardcolrow {
  padding: 24px;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.cardcolrow:not(.cardcolrow_big) {
  min-height: 126px;
}
.cardcolrow_subtle {
  color: var(--black2);
  background-color: var(--white);
  box-shadow: 0px 16px 32px rgba(32, 34, 37, 0.12);
}
.cardcolrow__icon {
  width: 40px;
  height: 40px;
}

.cardstep {
  padding: 24px;
  border-radius: 16px;
  display: flex !important;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  background-color: var(--blue1);
  background-origin: content-box;
  background-position: right top;
  background-repeat: no-repeat;
}
.cardstep {
  min-height: 300px;
}
.cardstep__icon {
  display: none;
}
.cardstep__text {
  align-self: flex-end;
}

/* md */
@media (min-width: 700px) {
  .cardcolrow {
    flex-direction: row;
    gap: 24px;
  }
  .cardcolrow:not(.cardcolrow_big) {
    min-height: 152px;
  }
  .cardcolrow_big {
    -ms-grid-column-span: 2;
    grid-column: span 2;
  }
  .cardcolrow__icon {
    width: 52px;
    height: 52px;
  }

  .cardstep {
    justify-content: space-between;
  }
  .cardstep_big {
    min-height: 187px;
    -ms-grid-column-span: 2;
    grid-column: span 2;
  }
  .cardstep__icon {
    width: 52px;
    height: 52px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 16px;
    color: var(--white);
    background: var(--black1);
  }
}

/* lg */
@media (min-width: 992px) {
  .cardcolrow:not(.cardcolrow_big) {
    /* min-height: 126px; */
    min-height: auto;
  }
}

@media (min-width: 1200px) {
  .cardstep, .cardstep_big {
    min-height: 300px;
  }
  .cardstep_big {
    -ms-grid-column-span: 1;
    grid-column: span 1;
  }
}

/* xl */
@media (min-width: 1600px) {
}