body { margin: 0; font-family: 'Arial', sans-serif; background: linear-gradient(135deg, #0f0c29, #302b63, #24243e); color: #fff; overflow-x: hidden; } .container { max-width: 1200px; margin: 0 auto; padding: 20px; } header { text-align: center; padding: 50px 0; } .kinetic-title { font-size: 4rem; font-weight: bold; animation: pulse 2s infinite; text-transform: uppercase; background: -webkit-linear-gradient(#00ffcc, #ff007a); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } @keyframes pulse { 0% { transform: scale(1); } 50% { transform: scale(1.05); } 100% { transform: scale(1); } } .subtitle { font-size: 1.5rem; opacity: 0.8; } .hero { display: flex; align-items: center; justify-content: space-between; min-height: 60vh; } .product-image { width: 50%; height: 400px; background: url('cream.png') no-repeat center/cover; /* Замените на реальное изображение */ filter: drop-shadow(0 0 20px rgba(0, 255, 204, 0.5)); transform: rotateY(20deg); transition: transform 0.5s ease; } .product-image:hover { transform: rotateY(0deg); } .hero-text { width: 45%; } .hero-text h2 { font-size: 2.5rem; margin-bottom: 20px; } .cta-button { padding: 15px 30px; font-size: 1.2rem; border: none; background: #00ffcc; color: #0f0c29; border-radius: 50px; cursor: pointer; transition: transform 0.3s, box-shadow 0.3s; } .cta-button:hover { transform: scale(1.1); box-shadow: 0 0 20px #00ffcc; } .features { display: flex; justify-content: space-around; padding: 50px 0; } .feature-card { width: 30%; padding: 20px; background: rgba(255, 255, 255, 0.1); border-radius: 15px; text-align: center; transition: transform 0.3s ease, background 0.3s ease; } .feature-card:hover { transform: translateY(-10px); background: rgba(0, 255, 204, 0.2); } .feature-card h3 { font-size: 1.5rem; margin-bottom: 10px; }