@font-face {
  font-family: Inter;
  src: url(../fonts/Inter_18pt-Regular.ttf);
  font-weight: 400;
}

@font-face {
  font-family: Inter;
  src: url(../fonts/);
  font-weight: 400;
}

.border-radius {
  border-radius: 1.1rem;
}
.modal__grid {
  display: grid;
  row-gap: 25px;
  padding-top: 33px;
  grid-auto-rows: 1fr auto;
}
.modal__img {
  justify-self: center;
}
.modal__block {
  background-color: #ffff;
  padding-inline: 1rem;
  padding-top: 14px;
  padding-bottom: 1.2rem;
  margin-inline: 8px;
  margin-bottom: 8px;
  display: flex;
  flex-direction: column;
  row-gap: 0.8rem;
}

.modal__title {
  font-size: 1.225rem;
  font-weight: 500;
  color: #292930;
  font-family: Inter;
  line-height: 1.1em;
}
.modal__description {
  color: #999fae;
  font-size: 0.9rem;
  font-family: Inter;
  display: block;
  flex: 1 0 auto;
}
.modal__subtitle {
  font-family: Inter;
  color: #292930;
  font-weight: 500;
  font-size: 0.8rem;
}

@media (width > 992px) {
  .modal__wrapper {
    display: grid;
    grid-template-columns: repeat(3, 18.375rem);
    column-gap: 3rem;
    justify-content: center;
  }
  .modal__block {
    height: 300px;
  }
  .modal__block {
    padding-inline: 22px;
    padding-top: 28px;
    padding-bottom: 36px;
  }
  .modal__btn {
    margin-inline: auto;
  }
}

@media (width < 992px) {
  .modal__block {
    height: 180px;
  }
  .modal__btn {
    font-size: 11px;
  }
}