Button widger

<div class="cta-widget">
<div class="cta-buttons">

<a href="#" class="cta-btn spotify">
<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 24 24" width="20"><path d="M12 0C5.37 0 0 5.37 0 12c0 6.63 5.37 12 12 12s12-5.37 12-12C24 5.37 18.63 0 12 0zM17.3 17.5a.75.75 0 0 1-1.04.25c-2.83-1.73-6.4-2.12-10.61-1.18a.75.75 0 0 1-.32-1.46c4.57-1.02 8.47-.57 11.57 1.33.36.21.48.67.25 1.06zm1.48-3.2a.93.93 0 0 1-1.29.31c-3.24-1.98-8.18-2.55-12.02-1.42a.93.93 0 1 1-.53-1.79c4.28-1.27 9.63-.64 13.26 1.65.44.27.58.85.29 1.25zm.13-3.42C14.9 8.3 8.7 8.1 5.3 9.12a1.11 1.11 0 1 1-.64-2.13c3.8-1.14 10.64-.9 14.82 1.84.52.34.67 1.02.33 1.56-.33.55-1.02.7-1.56.33z"/></svg>
SPOTIFY
</a>

<a href="#" class="cta-btn apple">
<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 24 24" width="18"><path d="M16.36 1.64a4.63 4.63 0 0 1-1.05 3.42 4.1 4.1 0 0 1-3.1 1.5 4.8 4.8 0 0 1 1.12-3.43 4.3 4.3 0 0 1 3.03-1.49zM19.38 12.34c0-3.23 2.63-4.78 2.75-4.85a5.46 5.46 0 0 0-4.31-2.3c-1.81-.18-3.52 1.05-4.43 1.05s-2.33-1.02-3.82-.99A5.7 5.7 0 0 0 5 8.92c-2.04 3.45-.52 8.53 1.46 11.33.99 1.44 2.15 3.05 3.69 3a3.73 3.73 0 0 0 1.67-.98c.52-.49.89-1.17 1.11-1.18.23 0 .64.7 1.14 1.2a3.45 3.45 0 0 0 1.59.87c1.74.25 3.38-1.78 4.36-3.23a9.44 9.44 0 0 0 1.32-2.75c-3.53-1.34-3.96-6.06-3.96-6.06z"/></svg>
APPLE MUSIC
</a>

<a href="#" class="cta-btn tidal">
<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 24 24" width="20"><path d="M12 9.172l-3.536-3.536L12 2.1l3.536 3.536L12 9.172zm3.536 3.536L12 16.244l-3.536-3.536L12 9.172l3.536 3.536zm-7.072 0L4.928 9.172 8.464 5.64 12 9.172l-3.536 3.536zm7.072 0L19.072 9.172 15.536 5.64 12 9.172l3.536 3.536z"/></svg>
TIDAL
</a>

<a href="#" class="cta-btn amazon">
<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 24 24" width="20"><path d="M21.6 18.2c-.4 0-.7.3-.7.7 0 .1 0 .2.1.3-.9.7-2.8 1.8-4.9 1.8-3.7 0-6.8-2.7-10.6-2.7-1.9 0-4 .5-5.4 1.6-.2.1-.2.4-.1.6.1.2.4.2.6.1 1.2-.9 3.1-1.5 4.9-1.5 3.6 0 6.6 2.7 10.6 2.7 2.5 0 4.7-1.2 5.8-2.1v.1c0 .3.2.5.5.5s.5-.2.5-.5v-1c-.1-.3-.4-.6-.8-.6z"/></svg>
AMAZON MUSIC
</a>

<a href="#" class="cta-btn ytmusic">
<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 24 24" width="20"><path d="M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm-2 14.5v-9l6 4.5-6 4.5z"/></svg>
YOUTUBE MUSIC
</a>

<a href="#" class="cta-btn youtube">
<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 24 24" width="20"><path d="M19.6 3.2H4.4C2 3.2.2 5 .2 7.4v9.3c0 2.4 1.8 4.2 4.2 4.2h15.2c2.4 0 4.2-1.8 4.2-4.2V7.4c0-2.4-1.8-4.2-4.2-4.2zM9.6 16.4V7.6l7 4.4-7 4.4z"/></svg>
YOUTUBE
</a>

<a href="#" class="cta-btn itunes">
<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 24 24" width="20"><path d="M12 0C5.38 0 0 5.38 0 12s5.38 12 12 12 12-5.38 12-12S18.62 0 12 0zm1 5h4v2h-2v10.5c0 1.93-1.57 3.5-3.5 3.5S8 19.43 8 17.5 9.57 14 11.5 14c.69 0 1.33.2 1.87.54L13 5z"/></svg>
ITUNES
</a>
</div>
</div>

.cta-btn {
display: flex !important;
align-items: center !important;
justify-content: center !important;
gap: 8px !important;
background: #2a2a2a !important;
color: white !important;
font-family: 'Bebas Neue', sans-serif !important;
letter-spacing: 1px !important;
text-decoration: none !important;
padding: 10px 18px !important;
border-radius: 8px !important;
font-size: 1.1rem !important;
transition: 0.25s ease !important;
}

.cta-btn:hover {
background: #3a3a3a !important;
transform: translateY(-2px) !important;
}

@media (max-width: 600px) {
.cta-buttons {
flex-direction: column !important;
align-items: center !important;
}
.cta-btn {
width: 100% !important;
max-width: 320px !important;
}
}
</style>

Quantity:

Cart Subtotal ():

View Cart