.service-card {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-areas: "number price" "title title" "description description";
  align-content: start;
  column-gap: 16px;
  padding: 28px;
  border: 1px solid #e6ebe7;
  border-radius: 16px;
  background: #eef3ef;
  counter-increment: service;
}
.service-card:hover .service-card__price {
  color: #f5a41f;
}
.service-card::before {
  content: counter(service, decimal-leading-zero);
  grid-area: number;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 10px;
  color: #fff;
  background: #123f38;
  font-weight: 700;
}
.service-card__price {
  grid-area: price;
  justify-self: end;
  align-self: center;
  margin: 0;
  color: #809894;
  font-size: 0.8rem;
  font-weight: 600;
}
.service-card__title {
  grid-area: title;
  margin: 28px 0 8px;
  color: #123f38;
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.3;
}
.service-card__description {
  grid-area: description;
  color: #6a8782;
  font-size: 0.9rem;
  line-height: 1.6;
}
.service-card__description > :first-child {
  margin-top: 0;
}
.service-card__description > :last-child {
  margin-bottom: 0;
}

/*# sourceMappingURL=service-card.css.map */