/* ── Accent text — replaces .grad on recs page to avoid gradient-text cascade ── */
.recs-hi {
  color: #E879F9 !important;
  -webkit-text-fill-color: #E879F9 !important;
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
}

/* ── Restore sec-label — used only on recs page ── */
.sec-label {
  display:inline-flex; align-items:center; gap:0.5rem;
  background:rgba(232,121,249,0.08);
  border:1px solid rgba(232,121,249,0.22);
  color:var(--accent);
  font-size:0.7rem; font-weight:700;
  letter-spacing:0.14em; text-transform:uppercase;
  padding:0.28rem 0.8rem; border-radius:4px;
}
.sec-label .dot { width:5px; height:5px; border-radius:50%; background:var(--accent); }

/* ── Back link ── */
.back-link {
  display:inline-flex; align-items:center; gap:0.5rem;
  color:var(--accent); text-decoration:none;
  font-weight:600; font-size:0.82rem;
  padding:0.35rem 0.9rem; border-radius:6px;
  border:1px solid rgba(232,121,249,0.28);
  background:rgba(232,121,249,0.08);
  transition:background 0.2s ease, border-color 0.2s ease;
}
.back-link:hover {
  background:rgba(232,121,249,0.16);
  border-color:rgba(232,121,249,0.5);
}

/* ── Hero ── */
.recs-hero {
  padding-top:8rem;
  padding-bottom:2rem;
  text-align:center;
}
.recs-hero .sec-label { margin-bottom:1rem; }
.recs-hero h1 {
  font-family:'Space Grotesk', sans-serif;
  font-size:clamp(2.8rem, 7vw, 5rem);
  font-weight:800;
  letter-spacing:-0.04em;
  line-height:1.05;
  color:var(--text);
  margin-bottom:1rem;
}
.recs-hero p {
  color:var(--muted);
  font-size:1rem;
  line-height:1.7;
  max-width:560px;
  margin:0 auto 0.6rem;
}
.recs-hero a { color:var(--accent); font-weight:600; text-decoration:none; }
.recs-hero a:hover { opacity:0.75; }

/* ── Mini section wrappers ── */
.mini-section { margin-top:2rem; margin-bottom:2.5rem; }
.mini-section-header {
  display:flex; align-items:center; gap:1rem;
  margin-bottom:1.5rem; flex-wrap:wrap;
}
.mini-section-header .sec-label { margin-bottom:0; }
.mini-section-ps { flex-basis:100%; }
.mini-section-title {
  font-family:'Space Grotesk', sans-serif;
  font-size:1.35rem; font-weight:700;
  letter-spacing:-0.02em; color:var(--text);
}

/* ── Genre playlists ── */
.playlists { display:grid; grid-template-columns:1fr 1fr; gap:1.4rem; margin-bottom:3rem; }
.playlist-card { padding:1.25rem; }
.playlist-card iframe { border-radius:10px; width:100%; border:none; display:block; }

/* ── Responsive ── */
@media(max-width:768px) {
  .recs-hero { padding-top:6rem; }
  .back-link { font-size:0.76rem; padding:0.3rem 0.65rem; gap:0.35rem; }
  .playlists { grid-template-columns:1fr; }


}

@media(max-width:480px) {
  .playlists { grid-template-columns:1fr; }
  .song-row { padding:1rem 1.1rem; }
}
