@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@700&family=Montserrat:wght@400;600&display=swap');

 * { margin: 0; padding: 0; box-sizing: border-box; }

 body {
 font-family: 'Montserrat', sans-serif;
 background: #0a001f;
 color: #fff;
 min-height: 100vh;
 background-image: 
 linear-gradient(rgba(10, 0, 31, 0.85), rgba(10, 0, 31, 0.85)),
 url('https://static.vecteezy.com/system/resources/previews/035/315/295/non_2x/synthwave-landscape-with-grid-ray-of-light-on-the-horizon-and-stars-in-the-background-80-s-galaxy-skyline-laser-geometric-3d-graphic-90s-outrun-design-cyberpunk-vibes-futuristic-neon-layout-vector.jpg');
 background-size: cover;
 background-position: center;
 background-attachment: fixed; /* Фон фиксирован при скролле */
 position: relative;
 }
 
        .back-to-site {
            position: fixed;
            top: 30px;
            left: 30px;
            background: rgba(0, 0, 0, 0.6);
            border: 1px solid #ffd700;
            color: #ffd700;
            font-size: 18px;
            font-weight: 600;
            padding: 12px 30px;
            border-radius: 50px;
            text-decoration: none;
            box-shadow: 0 0 20px rgba(255, 215, 0, 0.3);
            transition: all 0.4s ease;
            z-index: 10;
            backdrop-filter: blur(10px);
        }

        .back-to-site:hover {
            background: rgba(255, 215, 0, 0.15);
            color: #fff;
            transform: translateY(-3px);
            box-shadow: 0 0 30px rgba(255, 215, 0, 0.6);
        }

 /* Grid эффект */
 body::before {
 content: '';
 position: fixed;
 top: 0; left: 0; right: 0; bottom: 0;
 background: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0, 255, 255, 0.05) 2px, rgba(0, 255, 255, 0.05) 4px),
 repeating-linear-gradient(90deg, transparent, transparent 2px, rgba(255, 0, 255, 0.05) 2px, rgba(255, 0, 255, 0.05) 4px);
 pointer-events: none;
 z-index: 1;
 }

 .container {
 position: relative;
 z-index: 2;
 max-width: 900px;
 margin: 40px auto;
 padding: 40px 20px;
 text-align: center;
 }

 h1 {
 font-family: 'Orbitron', sans-serif;
 font-size: 60px;
 background: linear-gradient(45deg, #ff00ff, #00ffff);
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
 text-shadow: 0 0 20px rgba(255, 0, 255, 0.8);
 animation: glitch 3s infinite;
 margin-bottom: 20px;
 }

 @keyframes glitch {
 0% { text-shadow: 2px 2px #ff00ff, -2px -2px #00ffff; }
 20% { text-shadow: -2px -2px #ff00ff, 2px 2px #00ffff; }
 40% { text-shadow: 3px 0 #ff00ff, -3px 0 #00ffff; }
 60% { text-shadow: 0 3px #ff00ff, 0 -3px #00ffff; }
 100% { text-shadow: 2px 2px #ff00ff, -2px -2px #00ffff; }
 }

 .subtitle {
 font-size: 22px;
 margin-bottom: 50px;
 color: #00ffff;
 text-shadow: 0 0 10px #00ffff;
 }

 .benefits {
 display: grid;
 grid-template-columns: 1fr 1fr 1fr;
 gap: 25px;
 margin: 50px auto;
 max-width: 900px;
 }

 .benefit-item {
 background: rgba(255, 0, 255, 0.1);
 border: 1px solid #ff00ff;
 border-radius: 15px;
 padding: 30px;
 box-shadow: 0 0 15px rgba(255, 0, 255, 0.3);
 transition: transform 0.3s ease;
 }

 .benefit-item:hover {
 transform: translateY(-15px);
 box-shadow: 0 0 35px rgba(255, 0, 255, 0.6);
 }

 .benefit-item span {
 font-size: 50px;
 display: block;
 margin-bottom: 20px;
 }

 .partner {
 background: rgba(0, 255, 255, 0.1);
 border: 2px dashed #00ffff;
 border-radius: 20px;
 padding: 40px;
 margin: 70px auto;
 max-width: 750px;
 box-shadow: 0 0 25px rgba(0, 255, 255, 0.5);
 }

 .partner h2 {
 color: #ff00ff;
 font-size: 28px;
 margin-bottom: 20px;
 text-shadow: 0 0 10px #ff00ff;
 }

 .highlight {
 color: #ffff00;
 font-size: 26px;
 font-weight: bold;
 margin-top: 15px;
 }

 .btn {
 display: inline-block;
 background: linear-gradient(45deg, #ff00ff, #00ffff);
 color: #000;
 font-size: 26px;
 font-weight: bold;
 padding: 22px 70px;
 border-radius: 50px;
 text-decoration: none;
 box-shadow: 0 0 35px rgba(255, 0, 255, 0.9);
 animation: pulse-btn 2s infinite;
 transition: all 0.4s ease;
 margin: 60px 0 40px;
 }

 .btn:hover {
 transform: scale(1.12);
 box-shadow: 0 0 60px rgba(0, 255, 255, 1);
 }

 @keyframes pulse-btn {
 0% { box-shadow: 0 0 35px rgba(255, 0, 255, 0.9); }
 50% { box-shadow: 0 0 60px rgba(0, 255, 255, 1); }
 100% { box-shadow: 0 0 35px rgba(255, 0, 255, 0.9); }
 }

 /* Частицы - падающие деньги */
 .particle {
 position: fixed;
 font-size: 30px;
 pointer-events: none;
 animation: fall linear infinite;
 opacity: 0.7;
 z-index: 0;
 }

 @keyframes fall {
 0% { transform: translateY(-100vh) rotate(0deg); }
 100% { transform: translateY(100vh) rotate(360deg); }
 }

 @media (max-width: 768px) {
.back-to-site {
    position: unset;
    margin: 20px;
    display: flex;
}
 h1 { font-size: 42px; }
 .subtitle { font-size: 19px; }
.benefits { grid-template-columns: 1fr 1fr; padding: 0; gap: 15px; }
 .benefit-item span { font-size: 40px; }
 .partner { padding: 30px; margin: 50px auto; }
 .btn { font-size: 22px; padding: 20px 50px; }
 .container { padding: 30px 15px; margin: 20px auto; }
li::marker {
 font-size: 0;
}
 }