body {
    margin: 0;
    font-family: Arial, sans-serif;
    background-color: #f5f5f5;
    color: #333;
}

/* Header */
header {
    background: linear-gradient(to right, #6a11cb, #b95cff); /* BTS purple gradient */
    color: white;
    padding: 30px 20px;
    text-align: center;
}

/* Navigation */
.navbar {
    background-color: #4b0082 !important; /* Deep Purple */
}

.navbar .nav-link {
    color: white !important;
    font-weight: bold;
    transition: color 0.3s ease-in-out;
}

.navbar .nav-link:hover {
    color: #ffd700 !important; /* Gold Hover */
}

/* Hero Section */
.hero {
    text-align: center;
    padding: 60px 20px;
    background: url("https://www.chromethemer.com/wallpapers/chromebook-wallpapers/images/960/bts-army-chromebook-wallpaper.jpg") no-repeat center center/cover;
    color: white;
    text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.7); /* Improves text visibility */
}

.hero h1 {
    font-size: 3em;
    font-weight: bold;
}

.hero p {
    font-size: 1.5em;
    margin: 20px 0;
}

.hero a {
    margin: 10px;
    padding: 12px 20px;
    font-size: 1.2em;
}

.contrast {
    background-color: rgba(0, 0, 0, 0.6); /* Dark semi-transparent background */
    color: white;
    padding: 5px 10px;
    border-radius: 5px;
}


/* Sections */
section {
    padding: 50px 20px;
    text-align: center;
}

#about {
    background: linear-gradient(to right, #8e44ad, #d0a3e6); /* Purple gradient */
    color: white;
}

#music {
    background: linear-gradient(to right, #f1c40f, #f39c12); /* Gold gradient */
    color: #333;
}

#gallery {
    background-color: white;
}

#fan-zone {
    background: linear-gradient(to right, #e74c3c, #ff7675); /* Red gradient */
    color: white;
}

#news {
    background: linear-gradient(to right, #2c3e50, #34495e); /* Dark Blue */
    color: white;
}

/* Footer */
footer {
    text-align: center;
    padding: 20px;
    background-color: #4b0082; /* Deep purple */
    color: white;
}

footer a {
    color: #dcd6f7; /* Light lavender */
    text-decoration: none;
    font-weight: bold;
}

footer a:hover {
    text-decoration: underline;
    color: #ffd700; /* Gold hover */
}