:root {
  --color-icon-feature: yellowgreen;
}

:root.theme-light {
  --color-icon-feature: gray;
}

.features {
  display: grid;
  grid-auto-columns: 1fr;
  grid-auto-flow: column;
  text-align: center;
  margin-top: .4em;
}

.feature {
  overflow: hidden;
  text-overflow: ellipsis;
}

.feature_icon {
  width: 32px;
  margin: auto;
  /* transition: 1s ease-in-out; */
}

.feature_text {
  overflow: hidden;
  text-overflow: ellipsis;
}

.feature {
  display: none;
}

@media not ((min-width: 320px) and (max-width: 480px)) {
  .feature:nth-child(-n + 5) {
    display: block;
  }
}

@media (min-width: 320px) and (max-width: 480px) {
  .feature:nth-child(-n + 4) {
    display: block;
  }
  .feature_text {
    font-size: .8em;
  }
}

.feature_icon > svg {
  fill: var(--color-icon-feature);
}
.feature_icon > svg:hover {
  fill: var(--menu-color-hover);
}
