body {
  background:
    radial-gradient(circle at top, rgba(140,90,255,0.18), transparent 40%),
    radial-gradient(circle at bottom, rgba(0,0,0,0.9), transparent 55%),
    radial-gradient(circle at center, rgba(20,10,40,0.6), transparent 60%),
    #03040a;

  overflow-x: hidden;
  color: white;
}

    .glass {
      background: rgba(255,255,255,0.04);
      backdrop-filter: blur(14px);
      border: 1px solid rgba(255,255,255,0.08);
      box-shadow: 0 0 30px rgba(124,58,237,0.12);
    }

    .purple-glow {
      box-shadow:
        0 0 30px rgba(139,92,246,.45),
        0 0 80px rgba(139,92,246,.15);
    }

    .card-hover {
      transition: .25s ease;
    }

    .card-hover:hover {
      transform: translateY(-5px);
      border-color: rgba(168,85,247,.4);
      box-shadow: 0 0 35px rgba(168,85,247,.15);
    }

    .hero-glow {
      position: absolute;
      width: 700px;
      height: 700px;
      background: radial-gradient(circle, rgba(139,92,246,.35), transparent 70%);
      top: -200px;
      right: -200px;
      z-index: 0;
      filter: blur(40px);
    }


    @keyframes breathe {
  0%, 100% {
    transform: scale(1);
    opacity: .6;
  }

  50% {
    transform: scale(1.4);
    opacity: 1;
  }
}


.particle-breathe {
  animation: breathe 6s ease-in-out infinite;
}
  


/* ============================================================
   MOBILE
   ============================================================ */

/* Декоративные свечения шире экрана не должны давать горизонтальную прокрутку */
body {
    overflow-x: hidden;
    overflow-x: clip;
}

/* Без задержки двойного тапа и без серой подсветки при касании */
button,
a {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

@media (max-width: 767px) {
    /* Свечение в пределах экрана, а не 700px вправо за край */
    .hero-glow {
        width: 100vw;
        height: 460px;
        top: -140px;
        right: 0;
    }
}

@media (max-width: 767px) {
    /* Блок с роботом обрезан по краям, но края плавно растворяются */
    .hero-visual {
        -webkit-mask-image: linear-gradient(
            to bottom,
            transparent 0,
            #000 14%,
            #000 80%,
            transparent 100%
        );
        mask-image: linear-gradient(
            to bottom,
            transparent 0,
            #000 14%,
            #000 80%,
            transparent 100%
        );
    }
}

/* Горизонтальная строка с прокруткой без полосы прокрутки */
.scroll-row {
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}

.scroll-row::-webkit-scrollbar {
    display: none;
}