*{

margin:0;
padding:0;
box-sizing:border-box;

}



body{

background:

radial-gradient(
ellipse at center,
#121212 0%,
#050505 50%,
#000 100%
);

color:white;

font-family:Arial,sans-serif;

min-height:100vh;

overflow-x:hidden;

}





.back-btn{

position:fixed;

top:30px;
left:40px;

color:white;

text-decoration:none;

font-size:13px;

letter-spacing:4px;

opacity:.5;

z-index:10;

transition:.3s;

}



.back-btn:hover{

opacity:1;

}





.music-page{

width:100%;

padding:100px 8vw;

}





.music-grid{

display:flex;

flex-direction:column;

gap:80px;

}





.track{

display:flex;

align-items:center;

gap:60px;

position:relative;

}





.track img{

width:320px;

height:320px;

object-fit:cover;

transition:.6s;

box-shadow:
0 30px 80px rgba(0,0,0,.8);

}





.track:hover img{

transform:scale(1.04);

}





.track-info{

max-width:600px;

}





.track-info h1{

font-size:clamp(35px,5vw,75px);

font-weight:700;

letter-spacing:-2px;

line-height:.95;

text-transform:uppercase;

font-family:
Impact,
Arial Black,
sans-serif;

}





.track-info p{

margin-top:18px;

font-size:14px;

letter-spacing:4px;

opacity:.55;

}





@media(max-width:700px){


.music-page{

padding:90px 25px;

}


.track{

flex-direction:column;

align-items:flex-start;

gap:25px;

}



.track img{

width:100%;

height:auto;

aspect-ratio:1;

}



.track-info h1{

font-size:42px;

}



}

/* MUSIC PAGE FOOTER */
.music-footer {
  position: relative;
  z-index: 1;
  padding: 24px 5% 18px;
  border-top: 1px solid rgba(255,255,255,.12);
  text-align: center;
}

.music-copyright {
  color: rgba(255,255,255,.55);
  font-size: 9px;
  letter-spacing: 1px;
  text-align: center;
}

.music-footer-logo {
  display: block;
  width: 180px;
  height: 116px;
  max-width: 100%;
  object-fit: contain;
  margin: 12px auto 0;
  opacity: .95;
}

