/* Красивый анимированный градиент фона */
.bg-animated {
  background: radial-gradient(80vw 80vw at 10% 10%, rgba(56, 189, 248, 0.25), transparent 50%),
    radial-gradient(70vw 70vw at 90% 20%, rgba(167, 139, 250, 0.25), transparent 50%),
    radial-gradient(60vw 60vw at 50% 100%, rgba(34, 197, 94, 0.2), transparent 50%);
  position: relative;
  overflow: hidden;
}

.blob {
  position: absolute;
  inset: auto;
  width: 40rem;
  height: 40rem;
  filter: blur(80px);
  opacity: 0.25;
  background: conic-gradient(from 180deg, #22d3ee, #8b5cf6, #22d3ee);
  border-radius: 50%;
  animation: float 16s ease-in-out infinite;
}

.blob:nth-child(2) {
  animation-delay: -5s;
  left: -10rem;
  top: -8rem;
}

.blob:nth-child(3) {
  animation-delay: -10s;
  right: -12rem;
  bottom: -10rem;
}

@keyframes float {
  0%,
  100% {
    transform: translateY(0) rotate(0);
  }
  50% {
    transform: translateY(-30px) rotate(40deg);
  }
}

/* Стеклянные карточки */
.glass {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.06));
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.12);
}

/* Плавные ховеры */
.soft-hover {
  transition: transform .2s ease, box-shadow .2s ease;
}

.soft-hover:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(14, 165, 233, 0.25);
}

/* Пунктирная сетка */
.bg-grid {
  background-size: 24px 24px;
  background-image: radial-gradient(circle at 1px 1px, rgba(255, 255, 255, 0.09) 1.2px, transparent 0);
}