/* NIK-A enhance: reveal-анимации, hover-полировка, empty-states. Поверх main.css. */

/* --- плавное появление при скролле (класс вешает reveal.js) --- */
@media (prefers-reduced-motion: no-preference) {
  .reveal-init {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity .55s ease, transform .55s cubic-bezier(.22, .61, .36, 1);
    will-change: opacity, transform;
  }

  .reveal-in {
    opacity: 1;
    transform: none;
  }
}

/* --- hover: лёгкий lift + свечение в акценте бренда --- */
@media (hover: hover) {

  .bento__card,
  .cards__grid .card {
    transition: transform .3s ease, box-shadow .3s ease;
  }

  .bento__card:hover,
  .cards__grid .card:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 44px rgba(157, 149, 255, .14);
  }
}

/* --- empty-state для ненаполненных разделов --- */
.empty-state {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  text-align: center;
  padding: 72px 24px;
  background: #1B1B1D;
  border: 1px solid rgba(255, 255, 255, .06);
  border-radius: 24px;
}

.empty-state__label {
  color: #AFA6FF;
}

.empty-state p {
  max-width: 46ch;
  opacity: .75;
}

.empty-state__btn {
  margin-top: 10px;
  padding: 13px 30px;
  border-radius: 12px;
  background: #AFA6FF;
  color: #101014;
  transition: background .3s ease, transform .3s ease;
}

.empty-state__btn:hover {
  background: #C4BDFF;
  transform: translateY(-2px);
}