/* ===== MUSIC FACTORY CSS - cleaned ===== */

/* Tokens (structural styles stay here; vars can also live in Porto Custom Style 1) */
:root {
  --music-primary: #4F9EF8;
  --music-accent:  #8B5CF6;
  --music-glow: rgba(79,158,248,.30);
  --music-card: #1E293B;
  --music-darker: #0F172A;
  --music-border: #334155;
  --music-text-muted: #94A3B8;
}

/* Site background – scope to home wrapper to avoid global overrides */
.music-home {
  background: linear-gradient(135deg, #0F172A 0%, #1E293B 50%, #0F172A 100%);
  background-attachment: fixed;
  color: var(--music-text-muted);
  min-height: 100vh;
}

/* Container helper */
.music-container { max-width: 1400px; margin: 0 auto; padding: 0 1.25rem; }

/* Hero (reduced min-height so product sections aren’t pushed off-screen) */
.music-hero {
  background: linear-gradient(135deg, #0F172A 0%, #1E293B 50%, #0F172A 100%);
  min-height: 56vh;
  display:flex; align-items:center; justify-content:center;
  text-align:center; position:relative; overflow:hidden;
  margin-bottom: 2.5rem; border-radius: 1.25rem; padding: 3rem 1.5rem;
}
.music-hero::before {
  content:''; position:absolute; inset:0;
  background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="dots" width="20" height="20" patternUnits="userSpaceOnUse"><circle cx="10" cy="10" r="1" fill="rgba(79,158,248,0.1)"/></pattern></defs><rect width="100" height="100" fill="url(%23dots)"/></svg>');
  animation: float 20s ease-in-out infinite;
}
.music-hero h1 {
  font-size: clamp(2.25rem, 7vw, 4.5rem);
  font-weight: 900;
  background: linear-gradient(135deg, var(--music-primary), var(--music-accent), #fff);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
  line-height: 1.1; margin-bottom: 1.25rem;
}
.music-hero p { font-size: 1.125rem; color: var(--music-text-muted); margin-bottom: 1.5rem; }

/* Cards / buttons / promos – keep your existing versions here */
/* (leave the rest of your earlier file below, just without the debug + body.class rule) */