.music-hero{min-height:500px;background:#171717;padding-bottom:72px}
.music-hero h2{margin-top:0;font-size:clamp(30px,3.1vw,46px);letter-spacing:-1px}
.music-hero .hero-description{max-width:370px;color:#bcbcbc}
.music-hero .hero-bottom{padding-top:24px}
.music-scene{position:absolute;right:clamp(48px,8%,100px);bottom:60px;width:350px;height:240px;pointer-events:none;transform-origin:bottom right}
.music-halo{position:absolute;inset:-65px;background:radial-gradient(ellipse,#e7193433,transparent 65%);animation:music-glow 7s ease-in-out infinite}
.music-spectrum{position:absolute;inset:5px -27px 12px;display:flex;align-items:center;justify-content:space-between;gap:7px;transform:rotate(-8deg);mask-image:linear-gradient(transparent,#000 20%,#000 80%,transparent)}
.music-spectrum i{flex:1;height:160px;border-radius:10px;background:linear-gradient(#ff778b77,#ed16374d,#ff778b22);transform:scaleY(.3);animation:music-spectrum 2s ease-in-out infinite alternate;animation-delay:calc(var(--n)*-.19s)}
.music-app{position:absolute;left:68px;top:-16px;width:219px;height:263px;padding:13px 17px;border:1px solid #ffffff40;border-radius:19px;background:linear-gradient(140deg,#41424b,#24252c 50%,#1e1f25);box-shadow:0 23px 40px #0008,inset 0 1px #ffffff25;transform:rotate(-6deg);animation:music-app-float 8s ease-in-out infinite}
.music-app-top{display:flex;justify-content:space-between;align-items:center;color:#c7c9d3;font:5px/1 Onest,sans-serif;letter-spacing:1.6px;margin-bottom:11px}.music-app-top>span:last-child{font-size:9px;letter-spacing:2px}
.music-artwork{position:relative;height:115px;overflow:hidden;border:1px solid #ffffff24;border-radius:9px;background:linear-gradient(135deg,#820622,#f21e49 60%,#ff715a);isolation:isolate}
.music-ribbon{position:absolute;width:210px;height:75px;left:-35px;top:10px;border:14px solid #ffb0bba0;border-radius:50%;transform:rotate(-36deg);box-shadow:inset 0 0 16px #71002555,0 8px 16px #60002033;animation:music-ribbon 8s ease-in-out infinite}
.music-ribbon-two{left:37px;top:62px;border-color:#630e3677;animation-delay:-2s}.music-ribbon-three{left:62px;top:-62px;border-color:#ffecdb88;animation-delay:-4s}
.music-artwork>span{position:absolute;left:13px;top:27px;color:white;font:21px/.98 'Russo One',sans-serif;letter-spacing:-.7px;text-shadow:0 2px 12px #71002255}.music-artwork>small{position:absolute;left:14px;bottom:10px;color:#ffe4e9;font:4px/1 Onest,sans-serif;letter-spacing:1.5px}
.music-track{display:flex;align-items:center;justify-content:space-between;margin-top:11px}.music-track strong{display:block;font:10px/1.3 Onest,sans-serif;color:#f6f5fa}.music-track small{display:block;margin-top:3px;font:6px/1.3 Onest,sans-serif;color:#a6a9b7}.music-track>span{color:#f9617d;font-size:19px}
.music-timeline{height:2px;margin-top:12px;border-radius:2px;background:#ffffff24;overflow:hidden}.music-timeline i{display:block;width:100%;height:100%;background:#fa617c;transform-origin:left;animation:music-timeline 18s linear infinite}.music-time{display:flex;justify-content:space-between;margin-top:4px;color:#979ba9;font:5px/1 Onest,sans-serif}
.music-controls{display:flex;align-items:center;justify-content:space-between;margin-top:8px;color:#b9bdca}.music-controls>span{font-size:14px}.music-controls svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round}.music-controls b{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#f2f1f7;color:#252630;box-shadow:0 3px 12px #0003}.music-controls b svg{stroke-width:3}
.music-mood{position:absolute;left:0;bottom:5px;display:flex;align-items:center;gap:9px;padding:12px 14px;background:linear-gradient(120deg,#4e303d,#29252d);border:1px solid #ffb0c03b;border-radius:10px;box-shadow:0 12px 25px #0005;transform:rotate(4deg);animation:music-mood-float 8s ease-in-out infinite}.music-mood>span{width:6px;height:6px;border-radius:50%;background:#ff607f;box-shadow:0 0 12px #ff305c;animation:music-glow 3s ease-in-out infinite}.music-mood b{display:block;color:#f3e9ef;font:8px/1.3 Onest,sans-serif}.music-mood small{display:block;color:#bca8b3;margin-top:3px;font:5px/1.3 Onest,sans-serif}
@keyframes music-app-float{50%{transform:translateY(-5px) rotate(-3deg)}}
@keyframes music-mood-float{50%{transform:translateY(4px) rotate(1deg)}}
@keyframes music-spectrum{to{transform:scaleY(1)}}
@keyframes music-ribbon{50%{transform:translate(13px,-8px) rotate(-18deg) scale(1.12)}}
@keyframes music-timeline{from{transform:scaleX(.15)}to{transform:scaleX(.95)}}
@keyframes music-glow{50%{opacity:.45;transform:scale(.95)}}
.music-hero[aria-hidden="true"] .music-scene *{animation-play-state:paused}
@media(min-width:1600px){.music-hero{min-height:525px}}
@media(max-width:1100px){.music-hero{min-height:480px}.music-hero h2{font-size:34px}.music-scene{transform:scale(.78);bottom:72px}}
@media(max-width:980px) and (min-width:761px){.music-hero h2{font-size:30px}.music-scene{transform:scale(.65);bottom:86px}.music-hero .hero-description{max-width:285px}}
@media(max-width:760px){.music-hero{min-height:460px;padding:27px 25px 64px}.music-hero h2{font-size:clamp(27px,6.2vw,38px);line-height:1.16}.music-hero .hero-description{max-width:300px;font-size:11px}.music-hero .hero-description br{display:none}.music-scene{transform:scale(.70);bottom:108px;right:calc(50% - 122.5px)}.music-hero .hero-guide{font-size:11px}}
@media(max-width:389px){.music-hero{padding:24px 21px 64px}.music-hero h2{font-size:26px}.music-scene{transform:scale(.61);right:calc(50% - 106.75px)}}
@media(prefers-reduced-motion:reduce){.music-scene *{animation:none!important}}

.music-spectrum i:nth-child(3n){height:210px}.music-spectrum i:nth-child(3n + 1){height:110px}