.music { background: var(--bg); }
.music__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; margin-bottom: 3rem; }
.rel { background: var(--bg3); border: 1px solid var(--border); overflow: hidden; transition: border-color 0.3s, box-shadow 0.4s; transform-style: preserve-3d; }
.rel:hover { border-color: rgba(0,255,209,0.2); box-shadow: 0 20px 60px rgba(0,0,0,0.5), 0 0 40px rgba(0,255,209,0.05); }
.rel__art { position: relative; aspect-ratio: 1; overflow: hidden; background: #111; }
.rel__art img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s var(--ease), filter 0.4s; filter: grayscale(20%); }
.rel:hover .rel__art img { transform: scale(1.06); filter: grayscale(0%); }
.rel__art.no-art { background: linear-gradient(135deg, #0a1a16, #111); }
.rel__shine { position: absolute; inset: 0; background: linear-gradient(135deg, rgba(255,255,255,0.08) 0%, transparent 60%); pointer-events: none; }
.rel__play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(3,3,3,0.55); opacity: 0; transition: opacity 0.3s; }
.rel:hover .rel__play { opacity: 1; }
.rel__play svg { width: 56px; height: 56px; background: var(--accent); color: #000; border-radius: 50%; padding: 14px; transform: scale(0.8); transition: transform 0.3s var(--ease); }
.rel:hover .rel__play svg { transform: scale(1); }
.rel__info { padding: 1.25rem 1.5rem 1.5rem; }
.rel__lbl { font-family: var(--f-mono); font-size: 0.6rem; letter-spacing: 0.12em; color: var(--accent); text-transform: uppercase; display: block; margin-bottom: 0.4rem; }
.rel__name { font-family: var(--f-cond); font-size: 1.3rem; font-weight: 700; color: var(--white); margin-bottom: 0.25rem; }
.rel__sub { font-size: 0.8rem; color: var(--dimmer); margin-bottom: 1rem; }
.rel__cta { font-family: var(--f-mono); font-size: 0.65rem; letter-spacing: 0.08em; color: var(--accent); transition: letter-spacing 0.3s; }
.rel__cta:hover { letter-spacing: 0.14em; }
.music__sc { text-align: center; padding-top: 1rem; }
@media (max-width: 768px) { .music__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .music__grid { grid-template-columns: 1fr; } }
