.features {
  background-color: #ddd;
  padding: 8rem 0;
}

.features-header {
  display: flex;
  flex-direction: column;
  gap: 1rem;

  padding: 2rem;
}

.features-header p {
  font-size: 18px;
}

.features-content {
  text-align: center;
}

.features-content > span {
  font-size: 22px;
}

.features-items {
  display: flex;
  gap: 2rem;
  list-style-type: none;
}

.features-items li {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2rem;
  flex-wrap: wrap-reverse;
  padding: 2rem 0;
}

.features-items li span {
  max-width: 400px;
  font-size: 18px;
}

.features-items li img {
  border-radius: 16px;
}

.diagonal-background {
  background: linear-gradient(135deg, #fff 50%, #4682b4 50%);
}

.feature-icon {
  display: flex;
  justify-content: center;
  align-items: center;

  width: 75px;
  height: 75px;

  border-radius: 16px;

  font-size: 48px;
  color: var(--primary-color);
  background-color: var(--white);

  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06),
              0 1px 2px rgba(0, 0, 0, 0.04);
}

@media (max-width: 991px) {
  .features-items {
    flex-wrap: wrap;
  }
}
