/* Эффекты главной страницы: горизонтальная лента преимуществ на мобильных и плавное появление секций */

@media (max-width: 768px) {
  #features .cards--grid-4 {
    display: flex;
    gap: 14px;
    margin: 0 -16px;
    padding: 4px 16px 20px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding-left: 16px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  #features .cards--grid-4::-webkit-scrollbar {
    display: none;
  }

  #features .cards--grid-4 > .card {
    flex: 0 0 76%;
    max-width: 320px;
    scroll-snap-align: start;
  }
}

/* Плавное появление при скролле (включается скриптом, класс reveal-on) */
.reveal-on .reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.7s ease-out, transform 0.7s ease-out;
}

.reveal-on .reveal.reveal--visible {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .reveal-on .reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
}