.columns {
  display: block;

  @media (--screensMedium) {
    display: flex;
    margin: 0 calc(-1 * var(--spacingLarge));
  }
}

.columns__item {
  margin-bottom: 20px;

  @media (--screensMedium) {
    flexRows: 1 1;
    padding: 0 var(--spacingLarge);
    margin-bottom: 0;
  }
}

.columns__item:empty {
  padding: 0;
  margin: 0;
  flex: 0;
}

/* Following modifiers can be applied in the CMS for custom stylings. */
.columns--pricingtable {
  justify-content: center;
}

.columns--pricingtable .columns__item {
  max-width: 380px;
  border: solid 2px #000250;
  border-radius: 25px;
  padding: 0;
  margin: 0 auto;
  margin-bottom: 32px;
  box-shadow: rgba(128, 128, 128, 0.2) 0px 4px 7px 3px;

  @media (--screensMedium) {
    margin: 0;
    margin-bottom: 0;
    margin-left: 24px;
  }
}

.columns--pricingtable .columns__item:first-child {
  @media (--screensMedium) {
    margin-left: 0;
  }
}

.columns--pricingtable .columns__item h3 {
  font-size: 20px;
  padding: 26px;
  background: rgb(20, 32, 70);
  border-radius: 24px;
  color: #fff;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.columns--pricingtable .columns__item > div {
  padding: 10px 35px;
}