.front-page {
  background: var(--background);
}

@media (max-width: 1090px) {
  .front-page .hero-advantages {
    display: block;
  }
}

@media (max-width: 768px) {
  .front-page .hero-advantages {
    grid-template-columns: 1fr;
    grid-template-areas:
      "hero-content"
      "hero-visual"
      "advantages";
  }
}