.features-grid {
  display: flex;
  flex-direction: column;
  gap: 30px;
  margin: 0 0 70px;
}
.features-grid__header {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.features-grid__title {
  max-width: 32ch;
  margin: 0 !important;
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-size: 26px;
  line-height: 32px;
  color: #111111;
  text-wrap: pretty;
}
.features-grid__description {
  max-width: 75ch;
  margin: 0 !important;
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  color: #111111;
  text-wrap: pretty;
}
.features-grid__list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 32px;
}
.features-grid__card {
  --features-grid-card-decor-width: var(--features-grid-decor-width, auto);
  --features-grid-card-decor-height: var(--features-grid-decor-height, auto);
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  gap: 16px;
  box-sizing: border-box;
  min-height: var(--features-grid-card-decor-height);
  padding: var(--features-grid-text-offset-y, 0px) 0 0 var(--features-grid-text-offset-x, 0px);
}
.features-grid__decor {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: var(--features-grid-card-decor-width);
  height: var(--features-grid-card-decor-height);
  max-width: none;
}
.features-grid__card-title {
  margin: 0 !important;
  font-family: "Roboto", sans-serif;
  font-weight: 600;
  font-size: 20px;
  line-height: 28px;
  color: #111111;
  text-wrap: balance;
}
.features-grid__card-text {
  max-width: 50ch;
  margin: 0 !important;
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  color: #737373;
  text-wrap: pretty;
}
@media (min-width: 992px) {
  .features-grid {
    gap: 52px;
    margin-bottom: 110px;
  }
  .features-grid__header {
    gap: 23px;
  }
  .features-grid__title {
    font-size: 38px;
    line-height: 50px;
  }
  .features-grid__description {
    font-size: 18px;
    line-height: 25px;
  }
  .features-grid__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 52px;
  }
  .features-grid__card {
    --features-grid-card-decor-width: var(--features-grid-decor-width-desktop, var(--features-grid-decor-width, auto));
    --features-grid-card-decor-height: var(--features-grid-decor-height-desktop, var(--features-grid-decor-height, auto));
    gap: 24px;
    padding: var(--features-grid-text-offset-y-desktop, var(--features-grid-text-offset-y, 0px)) 0 0 var(--features-grid-text-offset-x-desktop, var(--features-grid-text-offset-x, 0px));
  }
  .features-grid__card-title {
    font-size: 24px;
  }
  .features-grid__card-text {
    line-height: 25px;
  }
}