body{
margin:0;
font-family:Arial, Helvetica, sans-serif;
background:#0f0f0f;
color:white;
}

header{
background:#000;
padding:20px;
text-align:center;
border-bottom:1px solid #222;
}

.logo img{
height:70px;
object-fit:contain;
}

nav{margin-top:15px;}

nav a{
color:white;
text-decoration:none;
margin:0 15px;
font-weight:bold;
transition:.3s;
}
nav a:hover{
color:#ff0000;
}

.hero{
min-height:70vh;
display:flex;
align-items:center;
gap:60px;
padding:40px 80px;

background:
linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.9)),
url("Mountain 1.jpeg");

background-size:cover;
background-position:center;

transition:background-image 1s ease-in-out, opacity 1s ease-in-out;
}
.hero.fade{
opacity:0;
}

.cover-img{
width:380px;
border-radius:18px;
box-shadow:0 0 25px rgba(255,0,0,.8);
transition:.3s;
}
.cover-img:hover{
transform:scale(1.05);
box-shadow:0 0 40px rgba(255,0,0,1);
}

.subtitle{
font-size:1.4rem;
color:#ff0000;
font-weight:bold;
}

.album-link{text-decoration:none;}

.tracklist ul{list-style:none;padding:0;}
.tracklist li{margin:6px 0;font-weight:bold;}
.tracklist li a{
color:white;
text-decoration:none;
transition:.2s;
}
.tracklist li a:hover{
color:#ff0000;
padding-left:8px;
}
.label{
display:block;
margin-top:15px;
color:#ff0000;
font-weight:bold;
}

.cta{text-align:center;margin:40px 0;}
.btn{
padding:14px 28px;
border-radius:30px;
background:#ff0000;
border:none;
color:white;
font-size:1rem;
cursor:pointer;
display:inline-block;
text-decoration:none;
transition:.3s;
}
.btn:hover{
transform:scale(1.08);
box-shadow:0 0 25px rgba(255,0,0,.8);
}

.section{padding:40px 80px;}
h3{color:#ff0000;}

.music-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:30px;
}
.card{
background:#111;
padding:15px;
border-radius:14px;
box-shadow:0 0 15px rgba(255,0,0,.3);
text-align:center;
transition:.3s;
}
.card:hover{
transform:translateY(-6px);
box-shadow:0 0 25px rgba(255,0,0,.7);
}
iframe{
width:100%;
height:180px;
border-radius:10px;
border:none;
}

.bottom-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:25px;
padding:40px 80px;
}
.box{
background:#111;
border-radius:16px;
box-shadow:0 0 15px rgba(255,0,0,.25);
transition:.3s;
}
.box:hover{
transform:translateY(-6px);
box-shadow:0 0 25px rgba(255,0,0,.6);
}

.social-link{
color:#fff;
text-decoration:none;
font-weight:bold;
transition:.3s;
}
.social-link:hover{color:#ff0000;}

footer{
text-align:center;
padding:25px;
border-top:1px solid #222;
background:#000;
}
.copyright{
color:#ff0000;
font-weight:bold;
}

@media(max-width:900px){
.hero{
flex-direction:column;
text-align:center;
padding:40px;
}
.cover-img{width:80%;}
.section{padding:40px;}
.bottom-grid{padding:40px;}
}

.album-title{
font-size:2.6rem;
font-family:'UnifrakturCook', cursive;
}

.album-title a{
color:#ff0000;
text-decoration:none;
display:inline-block;
transition:.3s;
}

.album-title a:hover{
transform:scale(1.08);
text-shadow:
0 0 10px #ff0000,
0 0 20px #ff0000,
0 0 40px #ff0000;
}