*{margin:0;padding:0;box-sizing:border-box;}:root{*{margin:0;padding:0;box-sizing:border-box;}body{font-family:'Arial', sans-serif;line-height:1.6;color:#333;overflow-x:hidden;}.container{max-width:1200px;margin:0 auto;padding:0 20px;}.navbar{background:linear-gradient(135deg, #667eea 0%, #764ba2 100%);padding:1rem 0;position:fixed;width:100%;top:0;z-index:1000;box-shadow:0 2px 10px rgba(0,0,0,0.1);}.nav-container{max-width:1200px;margin:0 auto;padding:0 20px;display:flex;justify-content:space-between-;align-items:center;}.logo{display:flex;align-items:center;color:white;font-size:1.5rem;}.logo i{margin-right:10px;font-size:2rem;}.nav-menu{display:flex;list-style:none;gap:2rem;}.nav-menu a{color:white;text-decoration:none;font-weight:500;transition:color 0.3s;}.nav-menu a:hover{color:#ffd700;}.hamburger{display:none;flex-direction:column;cursor:pointer;}.hamburger span{width:25px;height:3px;background:white;margin:3px 0;transition:0.3s;}.hero{background:linear-gradient(135deg, #1e3c72 0%, #2a5298 100%);height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;color:white;position:relative;margin-top:80px;}.hero-content h1{font-size:3.5rem;margin-bottom:1rem;animation:fadeInUp 1s ease;}.hero-content p{font-size:1.3rem;margin-bottom:2rem;animation:fadeInUp 1s ease 0.2s both;}.cta-button{display:inline-block;background:#ffd700;color:#333;padding:15px 40px;text-decoration:none;border-radius:50px;font-weight:bold;font-size:1.1rem;transition:transform 0.3s, box-shadow 0.3s;animation:fadeInUp 1s ease 0.4s both;}.cta-button:hover{transform:translateY(-3px);box-shadow:0 10px 30px rgba(255,215,0,0.4);}.hero-visual{position:absolute;bottom:20%;right:10%;font-size:8rem;opacity:0.3;animation:pulse 2s infinite;}.songs-section{padding:100px 0;background:#f8f9fa;}.songs-section h2{text-align:center;font-size:2.5rem;margin-bottom:3rem;color:#333;}.songs-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));gap:2rem;}.song-card{background:white;border-radius:20px;padding:2rem;box-shadow:0 10px 40px rgba(0,0,0,0.1);transition:transform 0.3s, box-shadow 0.3s;cursor:pointer;}.song-card:hover{transform:translateY(-10px);box-shadow:0 20px 60px rgba(0,0,0,0.15);}.song-card img{width:100%;height:200px;object-fit:cover;border-radius:15px;margin-bottom:1rem;}.song-info h3{font-size:1.3rem;margin-bottom:0.5rem;color:#333;}.song-info p{color:#666;margin-bottom:1rem;}.song-actions{display:flex;gap:1rem;margin-top:1rem;}.btn{padding:10px 20px;border:none;border-radius:25px;cursor:pointer;font-weight:bold;transition:all 0.3s;text-decoration:none;display:inline-flex;align-items:center;gap:8px;}.btn-primary{background:linear-gradient(135deg, #667eea 0%, #764ba2 100%);color:white;}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 5px 15px rgba(102,126,234,0.4);}.btn-download{background:linear-gradient(135deg, #f093fb 0%, #f5576c 100%);color:white;flex:1;justify-content:center;}.btn-download:hover{transform:translateY(-2px);box-shadow:0 5px 15px rgba(245,87,108,0.4);}.upload-section{padding:100px 0;background:linear-gradient(135deg, #667eea 0%, #764ba2 100%);color:white;}.upload-form-container{max-width:600px;margin:0 auto;}.upload-section h2{text-align:center;font-size:2.5rem;margin-bottom:2rem;}.form-group{margin-bottom:1.5rem;}.form-group label{display:block;margin-bottom:0.5rem;font-weight:bold;}.form-group input[type="file"]{width:100%;padding:12px;border:2px dashed #ffd700;border-radius:10px;background:rgba(255,255,255,0.1);color:white;font-size:1rem;}.form-group input[type="text"]{width:100%;padding:15px;border:none;border-radius:10px;font-size:1rem;background:rgba(255,255,255,0.9);}.upload-form button{width:100%;padding:15px;background:#ffd700;color:#333;border:none;border-radius:10px;font-size:1.1rem;font-weight:bold;cursor:pointer;transition:background 0.3s;}.upload-form button:hover{background:#ffed4e;}.modal{display:none;position:fixed;z-index:2000;left:0;top:0;width:100%;height:100%;background-color:rgba(0,0,0,0.8);}.modal-content{background:linear-gradient(135deg, #667eea 0%, #764ba2 100%);margin:5% auto;padding:30px;border-radius:20px;width:90%;max-width:500px;position:relative;color:white;}.close{position:absolute;right:20px;top:15px;font-size:2rem;cursor:pointer;}#audioPlayer{width:100%;margin-bottom:1rem;}footer{background:#333;color:white;text-align:center;padding:2rem 0;}@keyframes fadeInUp{from{opacity:0;transform:translateY(30px);}to{opacity:1;transform:translateY(0);}}@keyframes pulse{0%, 100%{transform:scale(1);}50%{transform:scale(1.1);}}@media (max-width:768px){.hamburger{display:flex;}.nav-menu{position:fixed;left:-100%;top:70px;flex-direction:column;background-color:rgba(102,126,234,0.95);width:100%;text-align:center;transition:0.3s;padding:2rem 0;}.nav-menu.active{left:0;}.hero-content h1{font-size:2.5rem;}.songs-grid{grid-template-columns:1fr;}}--primary-gradient:linear-gradient(135deg, #667eea 0%, #764ba2 100%);--secondary-gradient:linear-gradient(135deg, #f093fb 0%, #f5576c 100%);--accent-gold:#ffd700;--dark-bg:linear-gradient(135deg, #1e3c72 0%, #2a5298 100%);--glass-bg:rgba(255, 255, 255, 0.1);--glass-blur:blur(20px);--shadow-neon:0 0 30px rgba(102, 126, 234, 0.5);--shadow-glow:0 0 20px rgba(255, 215, 0, 0.4);}html{scroll-behavior:smooth;}body{font-family:'Arial', sans-serif;line-height:1.6;color:#fff;overflow-x:hidden;background:#0a0a0a;}body::before{content:'';position:fixed;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(2px 2px at 20px 30px, #ffd700, transparent),radial-gradient(2px 2px at 40px 70px, rgba(255,215,0,0.8), transparent),radial-gradient(1px 1px at 90px 40px, #667eea, transparent),radial-gradient(1px 1px at 130px 80px, #f5576c, transparent);background-repeat:repeat;background-size:200px 100px;animation:particleFloat 20s linear infinite;z-index:-2;pointer-events:none;}@keyframes particleFloat{0%{transform:translateY(0px) rotate(0deg);}100%{transform:translateY(-100px) rotate(360deg);}}.container{max-width:1400px;margin:0 auto;padding:0 20px;position:relative;z-index:1;}.navbar{background:var(--primary-gradient);padding:1.2rem 0;position:fixed;width:100%;top:0;z-index:10000;backdrop-filter:var(--glass-blur);border-bottom:1px solid rgba(255,255,255,0.2);box-shadow:var(--shadow-neon), 0 8px 32px rgba(0,0,0,0.3);}.nav-container{max-width:1400px;margin:0 auto;padding:0 20px;display:flex;justify-content:space-between--;align-items:center;}.logo{display:flex;align-items:center;font-size:1.8rem;font-weight:bold;background:var(--accent-gold);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:0 0 20px rgba(255,215,0,0.5);}.logo i{margin-right:12px;font-size:2.2rem;animation:spin 3s linear infinite;filter:drop-shadow(0 0 10px #ffd700);}@keyframes spin{0%{transform:rotate(0deg);}100%{transform:rotate(360deg);}}.nav-menu{display:flex;list-style:none;gap:2.5rem;}.nav-menu a{color:#fff;text-decoration:none;font-weight:600;font-size:1.1rem;position:relative;transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);padding:10px 0;}.nav-menu a::after{content:'';position:absolute;width:0;height:3px;bottom:0;left:50%;background:var(--accent-gold);transition:all 0.3s ease;box-shadow:0 0 10px var(--accent-gold);}.nav-menu a:hover::after{width:100%;left:0;}.nav-menu a:hover{color:var(--accent-gold);text-shadow:0 0 15px var(--accent-gold);transform:translateY(-2px);}.hamburger{display:none;flex-direction:column;cursor:pointer;gap:4px;}.hamburger span{width:30px;height:4px;background:var(--accent-gold);border-radius:2px;transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);box-shadow:0 2px 10px rgba(255,215,0,0.5);}.hamburger:hover span{box-shadow:0 4px 15px rgba(255,215,0,0.7);}.hero{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;position:relative;margin-top:90px;background:radial-gradient(circle at 20% 80%, rgba(120,119,198,0.3) 0%, transparent 50%),radial-gradient(circle at 80% 20%, rgba(255,119,198,0.3) 0%, transparent 50%),var(--dark-bg);overflow:hidden;}.hero::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:url('data:image/svg+xml,') repeat;animation:float 6s ease-in-out infinite;z-index:-1;}@keyframes float{0%, 100%{transform:translateY(0px);}50%{transform:translateY(-20px);}}.hero-content h1{font-size:clamp(3rem, 8vw, 5rem);font-weight:900;margin-bottom:1.5rem;background:linear-gradient(45deg, #fff, var(--accent-gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:0 0 40px rgba(255,255,255,0.5);animation:glowText 2s ease-in-out infinite alter--nate;}@keyframes glowText{from{filter:drop-shadow(0 0 20px #fff);}to{filter:drop-shadow(0 0 40px var(--accent-gold));}}.hero-content p{font-size:clamp(1.2rem, 3vw, 1.5rem);margin-bottom:3rem;opacity:0.9;max-width:600px;}.cta-button{display:inline-flex;align-items:center;gap:15px;background:var(--secondary-gradient);color:white;padding:20px 50px;text-decoration:none;border-radius:50px;font-weight:800;font-size:1.3rem;position:relative;overflow:hidden;box-shadow:var(--shadow-glow), inset 0 0 0 1px rgba(255,255,255,0.3);transition:all 0.4s cubic-bezier(0.23, 1, 0.320, 1);}.cta-button::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);transition:left 0.6s;}.cta-button:hover::before{left:100%;}.cta-button:hover{transform:translateY(-8px) scale(1.05);box-shadow:0 20px 40px rgba(245,87,108,0.4);}.hero-visual{position:absolute;bottom:10%;right:10%;font-size:clamp(6rem, 15vw, 12rem);opacity:0.15;filter:drop-shadow(0 0 50px #ffd700);animation:bounce 2s cubic-bezier(0.68, -0.55, 0.265, 1.55) infinite;}@keyframes bounce{0%, 100%{transform:translateY(0px) rotate(0deg);}50%{transform:translateY(-30px) rotate(180deg);}}.songs-section{padding:120px 0 100px;background:rgba(10,10,10,0.9);position:relative;}.songs-section::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg, transparent, #ffd700, transparent);box-shadow:0 0 20px #ffd700;}.songs-section h2{text-align:center;font-size:clamp(2.5rem, 6vw, 4rem);margin-bottom:4rem;background:var(--primary-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;position:relative;}.songs-section h2::after{content:'🔥';position:absolute;font-size:2rem;animation:fire 1.5s ease-in-out infinite alter--nate;}@keyframes fire{from{transform:scale(1) rotate(-5deg);}to{transform:scale(1.2) rotate(5deg);}}.songs-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(320px, 1fr));gap:2.5rem;max-width:1400px;margin:0 auto;}.song-card{background:rgba(20, 20, 40, 0.8);backdrop-filter:var(--glass-blur);border:1px solid rgba(255,255,255,0.1);border-radius:25px;padding:2.5rem 2rem;position:relative;overflow:hidden;transition:all 0.5s cubic-bezier(0.23, 1, 0.320, 1);cursor:pointer;transform-style:preserve-3d;}.song-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:var(--accent-gold);transform:scaleX(0);transition:transform 0.4s ease;}.song-card:hover::before{transform:scaleX(1);}.song-card img{width:100%;height:220px;object-fit:cover;border-radius:20px;margin-bottom:1.5rem;transition:transform 0.4s ease;filter:brightness(1.1);}.song-card:hover img{transform:scale(1.05) rotate(2deg);}.song-info h3{font-size:1.5rem;margin-bottom:0.8rem;background:linear-gradient(45deg, #fff, var(--accent-gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;}.song-info p{color:rgba(255,255,255,0.8);font-size:1.1rem;margin-bottom:2rem;}.song-actions{display:flex;gap:1rem;}.btn{flex:1;padding:15px 25px;border:none;border-radius:30px;font-weight:700;font-size:1rem;cursor:pointer;position:relative;overflow:hidden;transition:all 0.4s cubic-bezier(0.23, 1, 0.320, 1);text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:10px;backdrop-filter:var(--glass-blur);}.btn-primary{background:var(--primary-gradient);border:1px solid rgba(255,255,255,0.2);color:white;}.btn-download{background:var(--secondary-gradient);border:1px solid rgba(255,255,255,0.2);color:white;}.btn:hover{transform:translateY(-5px) scale(1.05);box-shadow:var(--shadow-neon);}.upload-section{padding:120px 0;background:radial-gradient(circle at 30% 20%, rgba(120,119,198,0.3) 0%, transparent 50%),radial-gradient(circle at 80% 80%, rgba(255,119,198,0.3) 0%, transparent 50%),var(--dark-bg);position:relative;}.upload-form-container{max-width:700px;margin:0 auto;}.upload-section h2{text-align:center;font-size:clamp(2.5rem, 6vw, 4rem);margin-bottom:3rem;position:relative;}.upload-section h2::after{content:'🎧';position:absolute;font-size:3rem;animation:float 3s ease-in-out infinite;}.upload-form{background:var(--glass-bg);backdrop-filter:var(--glass-blur);padding:3rem;border-radius:30px;border:1px solid rgba(255,255,255,0.2);box-shadow:var(--shadow-neon);}.form-group{margin-bottom:2rem;}.form-group label{display:block;margin-bottom:1rem;font-weight:700;font-size:1.1rem;color:var(--accent-gold);}.form-group input[type="text"]{width:100%;padding:20px;border:2px solid rgba(255,255,255,0.1);border-radius:15px;font-size:1.1rem;background:rgba(255,255,255,0.05);color:white;transition:all 0.3s ease;}.form-group input[type="text"]:focus{outline:none;border-color:var(--accent-gold);box-shadow:0 0 20px rgba(255,215,0,0.3);}.form-group input[type="file"]{width:100%;padding:20px;border:3px dashed var(--accent-gold);border-radius:15px;background:rgba(255,215,0,0.1);color:white;font-size:1.1rem;cursor:pointer;transition:all 0.3s ease;}.form-group input[type="file"]:hover{background:rgba(255,215,0,0.2);border-color:#ffed4e;}#fileInfo{margin-top:10px;padding:15px;background:rgba(255,215,0,0.2);border-radius:10px;border-left:4px solid var(--accent-gold);}.upload-form button{width:100%;padding:20px;background:linear-gradient(45deg, var(--accent-gold), #ffed4e);color:#333;border:none;border-radius:15px;font-size:1.3rem;font-weight:800;cursor:pointer;position:relative;overflow:hidden;transition:all 0.4s ease;text-transform:uppercase;letter-spacing:1px;}.upload-form button:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 15px 35px rgba(255,215,0,0.4);}.modal{display:none;position:fixed;z-index:20000;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,0.9);backdrop-filter:blur(10px);}.modal-content{background:rgba(20, 20, 40, 0.95);backdrop-filter:var(--glass-blur);margin:5% auto;padding:40px;border-radius:30px;width:90%;max-width:600px;position:relative;border:1px solid rgba(255,255,255,0.1);box-shadow:var(--shadow-neon);animation:modalSlide 0.4s cubic-bezier(0.23, 1, 0.320, 1);}@keyframes modalSlide{from{opacity:0;transform:translateY(-50px) scale(0.9);}to{opacity:1;transform:translateY(0) scale(1);}}.close{position:absolute;right:25px;top:20px;font-size:2.5rem;cursor:pointer;color:var(--accent-gold);transition:all 0.3s ease;width:50px;height:50px;display:flex;align-items:center;justify-content:center;border-radius:50%;backdrop-filter:blur(10px);}.close:hover{background:rgba(255,215,0,0.2);transform:rotate(90deg) scale(1.1);}#audioPlayer{width:100%;margin:2rem 0;border-radius:20px;background:rgba(0,0,0,0.5);}.track-info{text-align:center;}.track-info h3{font-size:1.8rem;margin-bottom:0.5rem;color:var(--accent-gold);text-shadow:0 0 20px rgba(255,215,0,0.5);}footer{background:rgba(0,0,0,0.8);backdrop-filter:var(--glass-blur);color:rgba(255,255,255,0.8);text-align:center;padding:3rem 0;border-top:1px solid rgba(255,255,255,0.1);}@media (max-width:768px){.hamburger{display:flex;}.nav-menu{position:fixed;left:-100%;top:90px;flex-direction:column;background:rgba(102,126,234,0.95);backdrop-filter:var(--glass-blur);width:100%;text-align:center;transition:left 0.4s cubic-bezier(0.23, 1, 0.320, 1);padding:3rem 0;box-shadow:var(--shadow-neon);}.nav-menu.active{left:0;}.hero-visual{display:none;}.songs-grid{grid-template-columns:1fr;gap:2rem;}.song-actions{flex-direction:column;}.upload-form{padding:2rem;}}@media (max-width:480px){.song-card{padding:1.5rem;}.modal-content{margin:10% auto;padding:25px;}}@keyframes fadeInUp{from{opacity:0;transform:translateY(50px);}to{opacity:1;transform:translateY(0);}}.song-card, .upload-form{animation:fadeInUp 0.8s ease forwards;}.song-card:nth-child(1){animation-delay:0.1s;}.song-card:nth-child(2){animation-delay:0.2s;}.song-card:nth-child(3){animation-delay:0.3s;}