body {
    margin: 0;
    font-family: 'Orbitron', sans-serif;
    background-color: #0b0014;
    color: #f6d6ff;
    scroll-behavior: smooth;
}

header.hero {
    background-color: #0b0014;
    text-align: center;
    padding: 120px 20px 80px;
}

.logo {
    max-width: 150px;
    margin-bottom: 20px;
}

h1 {
    font-size: 2rem;
    color: #ff6ec7;
    margin: 0;
}

section {
    padding: 60px 20px;
    max-width: 900px;
    margin: 0 auto;
}

h2 {
    font-size: 1.8rem;
    color: #df92ff;
}

.artist h3 {
    font-size: 1.4rem;
    margin-top: 30px;
    color: #ffa3a3;
}

#brand-visuals {
    background: #0d0b1d;
    color: #e0d9f7;
    text-align: center;
    padding: 60px 20px;
}

#brand-visuals h2 {
    font-family: 'Orbitron', sans-serif;
    font-size: 2rem;
    margin-bottom: 40px;
    color: #ffffff;
    letter-spacing: 1px;
}

.visuals-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 40px;
    justify-items: center;
}

.artist-card {
    background-color: #1a182a;
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0 0 15px rgba(128, 90, 213, 0.15);
    transition: transform 0.3s ease;
}

.artist-card:hover {
    transform: translateY(-6px);
}

.artist-card img {
    max-width: 180px;
    height: auto;
    margin-bottom: 15px;
    border-radius: 8px;
}

.tagline {
    font-size: 0.95rem;
    font-style: italic;
    color: #bda4f0;
}

.gradient-divider {
  border: none;
  height: 1px;
  background: linear-gradient(to right, #6e00ff, #ff00aa, #ff5e5e);
  margin: 3em 0;
  width: 100%;
}

footer {
    text-align: center;
    padding: 30px 20px;
    font-size: 0.9rem;
    color: #a883c7;
}