/**
 * List component style.
 */
.list--number .list__title, .list--bullet .list__title, .list--icon .list__title {
  display: flex;
  align-items: center;
}

.list {
  max-width: 38.75rem;
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.list__title {
  margin-bottom: 0.5555em;
  font-size: var(--text-large);
  font-weight: bold;
  line-height: 1.56;
}
@media (min-width: 600px) {
  .list__title {
    margin-bottom: 0.7777em;
  }
}

.list__text {
  margin-left: 0;
}
.list__text:not(:last-child) {
  margin-bottom: 2rem;
}
@media (min-width: 600px) {
  .list__text:not(:last-child) {
    margin-bottom: 1.5625rem;
  }
}

.list__icon {
  flex-shrink: 0;
  margin-right: 0.5rem;
  font-size: 1.3125rem;
  color: var(--color-primary);
}

/**
 * List icon variant.
 */
/**
 * List bullet variant.
 */
.list--bullet .list__title:before {
  display: block;
  flex-shrink: 0;
  width: 1em;
  height: 1em;
  margin-right: 2.7em;
  font-size: 8px;
  content: "";
  background-color: var(--color-primary);
  border-radius: 1em;
}

/**
 * List number variant.
 */
.list--number {
  counter-reset: list;
}
.list--number .list__title:before {
  display: block;
  flex-shrink: 0;
  width: 1.6666em;
  font-size: 1.125rem;
  font-weight: bold;
  line-height: 1.56;
  color: var(--color-primary);
  content: counter(list) ".";
  counter-increment: list;
}