← Back to Home
Services
Stores List
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Digital Stores - SavyCore | #1 Music Distributor </title> <link rel="icon" type="image/png" href="./logo/favicon.png">
<meta name="description" content="Get your music on Spotify, Apple Music, TikTok, YouTube, Tidal, Tencent and more.
Keep 100% ownership of your music and stay in control of your career. Unlimited Releases starting at $19/year.">
<meta name="tags" content="Music distribution,sell music online,upload music online india,savycore music distribution,free music distribution">
<meta property="og:image" content="https://savycore.com/assets/uploads/media-uploader/100479871747651783.jpg" />
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://fonts.googleapis.com/css2?family=Rubik:wght@300;400;500;700&display=swap" rel="stylesheet" />
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&display=swap"
rel="stylesheet">
<link rel="stylesheet" href="style.css" />
<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
<style>
/* Custom clip-path shape */
.clip-diagonal {
clip-path: polygon(0 0, 100% 6%, 100% 100%, 0% 94%);
}
/* Optional: animated gradient utility */
@keyframes gradient-x {
0%,
100% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
}
.animate-gradient-x {
animation: gradient-x 6s ease infinite;
}
/* .font-jost {
font-family: "Jost", sans-serif;
} */
/* Use this font */
h1 {
font-family: Rubik, sans-serif !important;
font-weight: 700;
}
.dark-overlay {
background: #000000;
background: -webkit-linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(25, 42, 80, 1) 51%, rgba(47, 61, 97, 1) 100%, rgba(3, 7, 18, 1) 100%);
background: -moz-linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(25, 42, 80, 1) 51%, rgba(47, 61, 97, 1) 100%, rgba(3, 7, 18, 1) 100%);
background: linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(25, 42, 80, 1) 51%, rgba(47, 61, 97, 1) 100%, rgba(3, 7, 18, 1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000", endColorstr="#030712", GradientType=0);
}
.group {
position: relative;
}
/* SVG underline path styles */
.underline-path {
stroke-dasharray: 270;
stroke-dashoffset: 270;
transition: stroke-dashoffset 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
/* Animate underline when the parent card (.group) is hovered */
.group:hover .underline-path {
stroke-dashoffset: 0;
}
</style>
<style>
.underline-path {
stroke-dasharray: 250;
stroke-dashoffset: 250;
transition: stroke-dashoffset 0.6s ease-in-out;
}
.card:hover .underline-path {
stroke-dashoffset: 0;
}
</style>
<script>
tailwind.config = {
theme: {
extend: {
colors: {
primary: {
50: '#f0f5ff',
100: '#e0eaff',
200: '#c7d5fe',
300: '#a5b9fc',
400: '#818cf8',
500: '#4361ee',
600: '#3948e0',
700: '#2d3a8c',
800: '#1e2a6c',
900: '#162050'
},
secondary: {
50: '#fdf4ff',
100: '#fae8ff',
200: '#f5d0fe',
300: '#e879f9',
400: '#d946ef',
500: '#c026d3',
600: '#a21caf',
700: '#86198f',
800: '#701a75',
900: '#4a044e'
},
dark: {
50: '#f8fafc',
100: '#f1f5f9',
200: '#e2e8f0',
300: '#cbd5e1',
400: '#94a3b8',
500: '#64748b',
600: '#475569',
700: '#334155',
800: '#1e293b',
900: '#0f172a',
950: '#020617'
}
},
fontFamily: {
rubik: ["Rubik", "sans-serif"],
},
animation: {
blob: "blob 7s infinite",
float: "float 3s ease-in-out infinite",
count: "count 3s ease-out forwards",
'fade-in-up': "fadeInUp 0.5s ease-out forwards",
'slide-in': "slideIn 1s ease-out forwards",
'scale-in': "scaleIn 0.5s ease-out forwards",
'gradient-x': "gradientX 10s ease infinite",
'gradient-y': "gradientY 10s ease infinite",
'pulse-slow': "pulse 4s cubic-bezier(0.4, 0, 0.6, 1) infinite",
gradient: "gradientBG 5s ease infinite",
},
keyframes: {
gradientBG: {
"0%": { backgroundPosition: "0% 50%" },
"50%": { backgroundPosition: "100% 50%" },
"100%": { backgroundPosition: "0% 50%" },
},
blob: {
"0%": {
transform: "translate(0px, 0px) scale(1)",
},
"33%": {
transform: "translate(30px, -50px) scale(1.1)",
},
"66%": {
transform: "translate(-20px, 20px) scale(0.9)",
},
"100%": {
transform: "translate(0px, 0px) scale(1)",
},
},
float: {
"0%, 100%": {
transform: "translateY(0)",
},
"50%": {
transform: "translateY(-10px)",
},
},
count: {
"0%": {
transform: "translateY(20px)",
opacity: "0",
},
"100%": {
transform: "translateY(0)",
opacity: "1",
},
},
fadeInUp: {
"0%": {
opacity: "0",
transform: "translateY(20px)",
},
"100%": {
opacity: "1",
transform: "translateY(0)",
},
},
slideIn: {
'0%': {
transform: 'translateX(-100%)',
opacity: '0',
},
'100%': {
transform: 'translateX(0)',
opacity: '1',
},
},
scaleIn: {
'0%': {
transform: 'scale(0.9)',
opacity: '0',
},
'100%': {
transform: 'scale(1)',
opacity: '1',
},
},
gradientX: {
'0%': { 'background-position': '0% 50%' },
'50%': { 'background-position': '100% 50%' },
'100%': { 'background-position': '0% 50%' },
},
gradientY: {
'0%, 100%': {
'background-size': '200% 200%',
'background-position': 'center top',
},
'50%': {
'background-size': '200% 200%',
'background-position': 'center bottom',
},
},
},
backgroundImage: {
'hero-pattern': "url('https://images.unsplash.com/photo-1470225620780-dba8ba36b745?auto=format&fit=crop&w=2070&q=80')",
'gradient-radial': 'radial-gradient(var(--tw-gradient-stops))',
'gradient-conic': 'conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))',
},
},
},
};
</script>
</head>
<body class="font-rubik overflow-x-hidden bg-[#070b14]">
<!-- Header/Navbar -->
<header id="navbar"
class="fixed top-0 left-0 w-full z-50 transition-all duration-300 ease-in-out backdrop-blur-md bg-dark-900/80">
<div class="max-w-7xl mx-auto flex items-center justify-between">
<!-- Logo -->
<div>
<a href="https://savycore.com" class="flex items-center"> <img src="./logo/logo.png" height="61px" width="200px" alt="savycore.com" /> </a>
</div>
<!-- Desktop Navigation -->
<nav class="hidden md:flex items-center space-x-10">
<a href="https://savycore.com/" class="text-white hover:text-white font-medium text-xl nav-item">Home</a>
<a href="https://savycore.com/sell-music" class="text-white hover:text-white font-medium text-xl nav-item">Sell Music</a>
<div class="relative group">
<button class="flex items-center text-white hover:text-white font-medium text-xl nav-item">
Pricing
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 ml-1" fill="none" viewBox="0 0 24 24"
stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
</svg>
</button>
<div
class="absolute left-0 mt-4 w-48 bg-white rounded-md shadow-lg opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all duration-300 z-50">
<a href="https://savycore.com/price-plan" class="block px-4 py-2 text-xl text-gray-700 hover:bg-gray-100">Pricing</a>
</div>
</div>
<a href="https://savycore.com/sell-music" class="text-white hover:text-white font-medium text-xl nav-item">About</a>
<a href="https://savycore.com/contact" class="text-white hover:text-white font-medium text-xl nav-item">Contact</a>
</nav>
<!-- CTA Button -->
<div class="hidden md:block">
<a href="https://client.savycore.com/login"
class="inline-flex items-center bg-gradient-to-r from-blue-500 to-purple-600 text-white font-medium px-6 py-2 rounded-full transition-all duration-300 hover:shadow-[0_0_20px] hover:shadow-blue-500/50 hover:brightness-110">
Login Now
<svg xmlns="http://www.w3.org/2000/svg"
class="h-5 w-5 ml-2 transform transition-transform duration-300 hover:translate-x-1"
viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd"
d="M10.293 3.293a1 1 0 011.414 0l6 6a1 1 0 010 1.414l-6 6a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-4.293-4.293a1 1 0 010-1.414z"
clip-rule="evenodd" />
</svg>
</a>
</div>
<!-- Mobile Menu Button -->
<button id="mobile-menu-button"
class="md:hidden text-white hover:text-gray-300 focus:outline-none transition-transform duration-300 ease-in-out px-5">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24"
stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
</svg>
</button>
</div>
</header>
<!-- Mobile Menu -->
<div id="mobile-menu"
class="fixed top-0 left-0 w-full h-screen bg-gray-900/95 backdrop-blur text-white hidden z-50 overflow-y-auto">
<div class="flex justify-between items-center px-6 py-4 border-b border-gray-800/50">
<img src="./logo/logo.png"
alt="Logo" class="h-12" />
<button id="close-menu"
class="text-white focus:outline-none p-2 rounded-full hover:bg-white/10 transition-colors duration-300">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24"
stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
</svg>
</button>
</div>
<nav class="px-6 py-8 space-y-6 z-100">
<a href="https://savycore.com"
class="block text-xl font-medium py-2 px-4 rounded-lg hover:bg-primary/80 transition-colors duration-300 transform hover:translate-x-2">Home</a>
<a href="https://savycore.com/sell-music"
class="block text-xl font-medium py-2 px-4 rounded-lg hover:bg-primary/80 transition-colors duration-300 transform hover:translate-x-2">Services</a>
<div class="py-2">
<button onclick="toggleDropdown('pricing-dropdown')"
class="w-full px-4 py-2 text-left flex justify-between items-center text-xl font-medium rounded-lg hover:bg-primary/20 transition-colors duration-300">
Pricing
<svg id="pricing-arrow" class="w-5 h-5 transition-transform duration-300"
xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
</svg>
</button>
<div id="pricing-dropdown" class="hidden mt-2 ml-4 space-y-1 border-l-2 border-primary/50 pl-4">
<a href="https://savycore.com/price-plan"
class="block py-2 px-4 text-lg text-gray-300 hover:text-white transition-colors duration-300">Pricing</a>
</div>
</div>
<a href="https://savycore.com/sell-music"
class="block text-xl font-medium py-2 px-4 rounded-lg hover:bg-primary/20 transition-colors duration-300 transform hover:translate-x-2">About</a>
<a href="https://savycore.com/contact"
class="block text-xl font-medium py-2 px-4 rounded-lg hover:bg-primary/20 transition-colors duration-300 transform hover:translate-x-2">Contact</a>
</nav>
<div class="px-6 py-8 mt-6 border-t border-gray-800/50">
<a href="https://client.savycore.com/login"
class="block w-full bg-gradient-to-r from-blue-500 to-purple-600 text-white text-center py-3 px-4 rounded-full text-lg font-medium hover:opacity-90 transition-opacity">Login
Now</a>
</div>
</div>
<!-- Hero Section -->
<section
class="relative w-full pt-40 pb-36 overflow-hidden bg-gradient-to-br from-[#0f172a] via-[#111827] to-[#1e293b]">
<!-- Floating Gradient Blobs -->
<div class="absolute top-0 left-0 w-96 h-96 bg-pink-500 opacity-10 rounded-full filter blur-3xl animate-float-slow z-0"></div>
<div class="absolute bottom-0 right-0 w-96 h-96 bg-purple-500 opacity-10 rounded-full filter blur-3xl animate-float-slower z-0"></div>
<div class="max-w-7xl mx-auto px-6 md:px-10 relative z-10 text-center">
<p class="text-accent-400 text-lg uppercase tracking-wide mb-4 animate-fade-in-up text-white">SavyCore</p>
<h1
class="text-5xl md:text-7xl font-extrabold leading-tight text-white mb-6 animate-fade-in-up animation-delay-200">
Global Music
<span
class="bg-gradient-to-r from-green-400 via-blue-400 via-pink-500 to-yellow-400 text-transparent bg-clip-text animate-gradient-x bg-[length:300%_300%] inline-block">
Stores
</span>
</h1>
<p class="text-gray-300 text-xl md:text-2xl max-w-3xl mx-auto animate-fade-in-up animation-delay-400">
SavyCore Music Distribution puts your music in the most popular digital stores around the world like Spotify, Apple Music, iTunes, Amazon Music, and more. In fact, we partner with over 150 digital stores. Below are just some of our top store partners.
</p>
<!-- Optional CTA -->
<div class="mt-10 animate-fade-in-up animation-delay-600">
<a href="https://client.savycore.com/login"
class="inline-block px-8 py-4 text-lg font-medium text-white bg-[#4361ee] rounded-xl hover:bg-[#364fc7] transition-all duration-300 shadow-lg hover:shadow-[0_0_20px_#4361ee88]">
Login Now
</a>
</div>
</div>
</section>
<!-- Stores Overview Section -->
<section id="stores"
class="relative py-32 px-6 lg:px-12 bg-gradient-to-b from-[#1e293b] via-[#111827] to-[#0f172a] overflow-hidden z-10"
data-aos="fade-up" data-aos-duration="1000" data-aos-easing="ease-in-out">
<!-- Floating Blobs -->
<div class="absolute top-0 left-0 w-80 h-80 bg-pink-500 opacity-10 rounded-full filter blur-3xl animate-float-slow z-0"></div>
<div class="absolute bottom-0 right-0 w-96 h-96 bg-purple-500 opacity-10 rounded-full filter blur-3xl animate-float-slower z-0"></div>
<!-- Content -->
<div class="relative z-10 max-w-7xl mx-auto">
<div class="text-center mb-16">
<span
class="inline-block px-4 py-1 mb-4 text-sm font-medium text-blue-400 bg-white/10 border border-white/10 rounded-full backdrop-blur-sm">
DISTRIBUTION PLATFORMS
</span>
<h2 class="text-3xl md:text-4xl lg:text-5xl font-bold text-white mb-4 font-jost">
Where Your Music
<span
class="bg-gradient-to-r from-green-500 via-blue-500 via-red-500 to-yellow-500 text-transparent bg-clip-text animate-gradient-x bg-[length:400%_400%] inline-block">
Will Be Available
</span>
</h2>
<p class="text-gray-300 max-w-2xl mx-auto font-rubik text-lg">
SavyCore delivers your music to all major streaming platforms and digital stores worldwide.
</p>
</div>
<!-- Store Cards Grid -->
<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
<!-- Spotify Card -->
<div class="store-card rounded-3xl overflow-hidden bg-white/5 border border-white/10 backdrop-blur-md shadow-xl transition-all duration-500 group"
data-aos="fade-up" data-aos-delay="100">
<div class="relative overflow-hidden h-48">
<img src="./Stores Logo/1707246236-spotify-logo-white.webp"
alt="Spotify" class="absolute inset-0 w-full h-full object-contain p-8 store-icon">
</div>
<div class="p-8">
<h3 class="text-2xl font-bold text-white mb-3">Spotify</h3>
<p class="text-gray-300 mb-6">
The world's most popular audio streaming platform with over 456 million users worldwide.
</p>
<div class="flex justify-between items-center">
<a href="/services.html" class="text-blue-400 hover:text-blue-300 transition-colors duration-300 flex items-center gap-2">
Learn more
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd" d="M12.293 5.293a1 1 0 011.414 0l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-2.293-2.293a1 1 0 010-1.414z" clip-rule="evenodd" />
</svg>
</a>
<a href="https://savycore.com/price-plan" class="btn-link px-4 py-2 bg-green-600 hover:bg-green-700 text-white rounded-full transition-all duration-300">
Distribute Now
</a>
</div>
</div>
</div>
<!-- Apple Music Card -->
<div class="store-card rounded-3xl overflow-hidden bg-white/5 border border-white/10 backdrop-blur-md shadow-xl transition-all duration-500 group"
data-aos="fade-up" data-aos-delay="200">
<div class="relative overflow-hidden h-48">
<img src="./Stores Logo/1707246729-apple-logo-white.svg"
alt="Apple Music" class="absolute inset-0 w-full h-full object-contain p-8 store-icon">
</div>
<div class="p-8">
<h3 class="text-2xl font-bold text-white mb-3">Apple Music</h3>
<p class="text-gray-300 mb-6">
A premium music streaming service offering over 100 million songs in lossless audio quality.
</p>
<div class="flex justify-between items-center">
<a href="/services.html" class="text-blue-400 hover:text-blue-300 transition-colors duration-300 flex items-center gap-2">
Learn more
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd" d="M12.293 5.293a1 1 0 011.414 0l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-2.293-2.293a1 1 0 010-1.414z" clip-rule="evenodd" />
</svg>
</a>
<a href="https://savycore.com/price-plan" class="btn-link px-4 py-2 bg-gradient-to-r from-pink-500 to-purple-600 hover:from-pink-600 hover:to-purple-700 text-white rounded-full transition-all duration-300">
Distribute Now
</a>
</div>
</div>
</div>
<!-- Amazon Music Card -->
<div class="store-card rounded-3xl overflow-hidden bg-white/5 border border-white/10 backdrop-blur-md shadow-xl transition-all duration-500 group"
data-aos="fade-up" data-aos-delay="300">
<div class="relative overflow-hidden h-48">
<img src="./Stores Logo/1707246774-amazon-logo-white.svg"
alt="Amazon Music" class="absolute inset-0 w-full h-full object-contain p-8 store-icon">
</div>
<div class="p-8">
<h3 class="text-2xl font-bold text-white mb-3">Amazon Music</h3>
<p class="text-gray-300 mb-6">
A music streaming platform and online music store operated by Amazon with over 90 million songs.
</p>
<div class="flex justify-between items-center">
<a href="/services.html" class="text-blue-400 hover:text-blue-300 transition-colors duration-300 flex items-center gap-2">
Learn more
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd" d="M12.293 5.293a1 1 0 011.414 0l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-2.293-2.293a1 1 0 010-1.414z" clip-rule="evenodd" />
</svg>
</a>
<a href="https://savycore.com/price-plan" class="btn-link px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-full transition-all duration-300">
Distribute Now
</a>
</div>
</div>
</div>
<!-- YouTube Music Card -->
<div class="store-card rounded-3xl overflow-hidden bg-white/5 border border-white/10 backdrop-blur-md shadow-xl transition-all duration-500 group"
data-aos="fade-up" data-aos-delay="400">
<div class="relative overflow-hidden h-48">
<img src="./Stores Logo/1707246830-youtube-logo-white.svg"
alt="YouTube Music" class="absolute inset-0 w-full h-full object-contain p-8 store-icon">
</div>
<div class="p-8">
<h3 class="text-2xl font-bold text-white mb-3">YouTube Music</h3>
<p class="text-gray-300 mb-6">
A music streaming service developed by YouTube with access to official songs, albums, and music videos.
</p>
<div class="flex justify-between items-center">
<a href="/services.html" class="text-blue-400 hover:text-blue-300 transition-colors duration-300 flex items-center gap-2">
Learn more
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd" d="M12.293 5.293a1 1 0 011.414 0l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-2.293-2.293a1 1 0 010-1.414z" clip-rule="evenodd" />
</svg>
</a>
<a href="https://savycore.com/price-plan" class="btn-link px-4 py-2 bg-red-600 hover:bg-red-700 text-white rounded-full transition-all duration-300">
Distribute Now
</a>
</div>
</div>
</div>
<!-- Deezer Card -->
<div class="store-card rounded-3xl overflow-hidden bg-white/5 border border-white/10 backdrop-blur-md shadow-xl transition-all duration-500 group"
data-aos="fade-up" data-aos-delay="500">
<div class="relative overflow-hidden h-48">
<img src="./Stores Logo/1707247183-deezer-logo-white.svg"
alt="Deezer" class="absolute inset-0 w-full h-full object-contain p-8 store-icon">
</div>
<div class="p-8">
<h3 class="text-2xl font-bold text-white mb-3">Deezer</h3>
<p class="text-gray-300 mb-6">
A French online music streaming service with over 90 million licensed tracks and 16 million monthly active users.
</p>
<div class="flex justify-between items-center">
<a href="/services.html" class="text-blue-400 hover:text-blue-300 transition-colors duration-300 flex items-center gap-2">
Learn more
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd" d="M12.293 5.293a1 1 0 011.414 0l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-2.293-2.293a1 1 0 010-1.414z" clip-rule="evenodd" />
</svg>
</a>
<a href="https://savycore.com/price-plan" class="btn-link px-4 py-2 bg-gradient-to-r from-purple-500 to-indigo-600 hover:from-purple-600 hover:to-indigo-700 text-white rounded-full transition-all duration-300">
Distribute Now
</a>
</div>
</div>
</div>
<!-- TikTok Card -->
<div class="store-card rounded-3xl overflow-hidden bg-white/5 border border-white/10 backdrop-blur-md shadow-xl transition-all duration-500 group"
data-aos="fade-up" data-aos-delay="600">
<div class="relative overflow-hidden h-48">
<img src="./Stores Logo/1707246819-tiktok-logo-white.svg"
alt="TikTok" class="absolute inset-0 w-full h-full object-contain p-8 store-icon">
</div>
<div class="p-8">
<h3 class="text-2xl font-bold text-white mb-3">TikTok / Resso</h3>
<p class="text-gray-300 mb-6">
Distribute your music to TikTok's massive platform and Resso, making it available for creators to use in their videos.
</p>
<div class="flex justify-between items-center">
<a href="/services.html" class="text-blue-400 hover:text-blue-300 transition-colors duration-300 flex items-center gap-2">
Learn more
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd" d="M12.293 5.293a1 1 0 011.414 0l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-2.293-2.293a1 1 0 010-1.414z" clip-rule="evenodd" />
</svg>
</a>
<a href="https://savycore.com/price-plan" class="btn-link px-4 py-2 bg-gradient-to-r from-pink-500 to-blue-500 hover:from-pink-600 hover:to-blue-600 text-white rounded-full transition-all duration-300">
Distribute Now
</a>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Additional Stores Section -->
<section class="relative py-24 px-6 lg:px-12 bg-gradient-to-b from-[#0f172a] via-[#111827] to-[#1e293b] overflow-hidden"
data-aos="fade-up">
<!-- Floating Blobs -->
<div class="absolute top-0 left-0 w-80 h-80 bg-pink-500 opacity-10 rounded-full filter blur-3xl animate-float-slow z-0"></div>
<div class="absolute bottom-0 right-0 w-96 h-96 bg-purple-500 opacity-10 rounded-full filter blur-3xl animate-float-slower z-0"></div>
<div class="max-w-7xl mx-auto relative z-10">
<div class="text-center mb-16">
<span
class="inline-block px-4 py-1 mb-4 text-sm font-medium text-blue-400 bg-white/10 border border-white/10 rounded-full backdrop-blur-sm">
MORE PLATFORMS
</span>
<h2 class="text-3xl md:text-4xl lg:text-5xl font-bold text-white mb-4 font-jost">
Additional
<span
class="bg-gradient-to-r from-green-500 via-blue-500 via-red-500 to-yellow-500 text-transparent bg-clip-text animate-gradient-x bg-[length:400%_400%] inline-block">
Distribution Channels
</span>
</h2>
<p class="text-gray-300 max-w-2xl mx-auto font-rubik text-lg">
We distribute to over 150+ digital stores and streaming platforms worldwide.
</p>
</div>
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6">
<!-- Additional Store 1 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="100">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1739218569-meta_lockup_negative-primary_white_rgb.webp" alt="Meta" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">Meta</h3>
</div>
<!-- Additional Store 2 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="150">
<div class="h-16 flex items-center justify-center mb-4">
<img src="https://www.datocms-assets.com/119568/1707247188-tidal-logo-white.svg" alt="Tidal" class="h-8">
</div>
<h3 class="text-white font-medium">Tidal</h3>
</div>
<!-- Additional Store 3 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="200">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1707246838-beatport-logo-white.svg" alt=BeatPort" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">BeatPort</h3>
</div>
<!-- Additional Store 4 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="250">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1708366455-brand-logo-napster-white.webp" alt="Napster" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">Napster</h3>
</div>
<!-- Additional Store 5 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="300">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1708376981-peloton.webp" alt="Peloton Music" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">Peloton Music</h3>
</div>
<!-- Additional Store 6 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="350">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1708376655-qobuz.webp" alt="Qobuz" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">Qobuz</h3>
</div>
<!-- Additional Store 7 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="400">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1708374697-2021-playnetwork-by-mood-logos-reverse.webp" alt="PlayNetwork" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">PlayNetwork</h3>
</div>
<!-- Additional Store 8 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="400">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1708372930-spinlet.webp" alt="Spinlet" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">Spinlet</h3>
</div>
<!-- Additional Store 9 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="400">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1708372555-musictime.webp" alt="MusicTime" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">MusicTime</h3>
</div>
<!-- Additional Store 10 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="400">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1707358718-pandora_wordmark_white.webp" alt="Pandora" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">Pandora</h3>
</div>
<!-- Additional Store 11 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="400">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1708366338-brand-logo-shazam-color.webp" alt="Shazam" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">Shazam</h3>
</div>
<!-- Additional Store 12 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="400">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1708364515-gp_wide_color.webp" alt="Shazam" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">VerveLife</h3>
</div>
<!-- Additional Store 13 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="400">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1708366739-ayoba-header-logo-white.webp" alt="AYOBA" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">AYOBA</h3>
</div>
<!-- Additional Store 14 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="400">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1707267857-mn_wide_color.webp" alt="MediaNet" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">MediaNet</h3>
</div>
<!-- Additional Store 15 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="400">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1708366829-logo_kuack.svg" alt="Kuack" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">Kuack</h3>
</div>
<!-- Additional Store 16 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="400">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1707266493-kkbox_logo.webp" alt="KKBOX" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">KKBOX</h3>
</div>
<!-- Additional Store 17 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="400">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1707266056-joox-logo.webp" alt="Joox" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">Joox</h3>
</div>
<!-- Additional Store 18 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="400">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1707265868-jiosaavn_logo.webp" alt="JioSaavn" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">JioSaavn</h3>
</div>
<!-- Additional Store 19 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="400">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1707265601-iheartradio_logo.webp" alt="iHeartRadio" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">iHeartRadio</h3>
</div>
<!-- Additional Store 20 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="400">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1707255930-hungama-music-logo.webp" alt="Hungama Music" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">Hungama Music</h3>
</div>
<!-- Additional Store 21 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="400">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1707255669-gracenote_new_logo.webp" alt="Gracenote" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">Gracenote</h3>
</div>
<!-- Additional Store 22 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="400">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1707255360-gaana_logo.webp" alt="Gaana" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">Gaana</h3>
</div>
<!-- Additional Store 23 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="400">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1707254708-douyin_logo.webp" alt="Douyin Streaming / Qishui Yinyue" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">Douyin Streaming / Qishui Yinyue</h3>
</div>
<!-- Additional Store 24 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="400">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1707252354-white-logo.webp" alt="Boomplay Music" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">Boomplay Music</h3>
</div>
<!-- Additional Store 25 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="400">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1707251029-anghami-white.webp" alt="Anghami" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">Anghami</h3>
</div>
<!-- Additional Store 26 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="400">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1707250479-7digital-white.webp" alt="7digital" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">7digital</h3>
</div>
<!-- Additional Store 27 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="400">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1707253180-claro-musica.webp" alt="Claromúsica" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">Claromúsica</h3>
</div>
<!-- Additional Store 29 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="450">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1707252549-capcut-logo-white.webp" alt="CapCut" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">CapCut</h3>
</div>
</div>
<!--
<div class="text-center mt-12">
<a href="#" class="inline-block px-8 py-3 bg-white/10 hover:bg-white/20 text-white rounded-full transition-all duration-300 backdrop-blur-md">
View All Platforms
</a>
</div>
-->
</div>
</section>
<!-- Additional Stores Section -->
<section class="relative py-24 px-6 lg:px-12 bg-gradient-to-b from-[#0f172a] via-[#111827] to-[#1e293b] overflow-hidden"
data-aos="fade-up">
<!-- Floating Blobs -->
<div class="absolute top-0 left-0 w-80 h-80 bg-pink-500 opacity-10 rounded-full filter blur-3xl animate-float-slow z-0"></div>
<div class="absolute bottom-0 right-0 w-96 h-96 bg-purple-500 opacity-10 rounded-full filter blur-3xl animate-float-slower z-0"></div>
<div class="max-w-7xl mx-auto relative z-10">
<div class="text-center mb-16">
<span
class="inline-block px-4 py-1 mb-4 text-sm font-medium text-blue-400 bg-white/10 border border-white/10 rounded-full backdrop-blur-sm">
SavyCore
</span>
<h2 class="text-3xl md:text-4xl lg:text-5xl font-bold text-white mb-4 font-jost">
High Quilty
<span
class="bg-gradient-to-r from-green-500 via-blue-500 via-red-500 to-yellow-500 text-transparent bg-clip-text animate-gradient-x bg-[length:400%_400%] inline-block">
Callertune Cut Here
</span>
</h2>
<p class="text-gray-300 max-w-2xl mx-auto font-rubik text-lg">
Unlimited Callertune Cut Of Your Individual Song And Album Tracks.
</p>
</div>
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6">
<!-- Additional Store 1 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="100">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./img/vi-mobile-icon.png" alt="Vi Callertune" class="h-20">
</div>
<h3 class="text-white font-medium">Vi Callertune</h3>
</div>
<!-- Additional Store 2 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="150">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./img/jio-logo-icon.png" alt="Jio CallerTune" class="h-20">
</div>
<h3 class="text-white font-medium">Jio CallerTune</h3>
</div>
<!-- Additional Store 3 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="200">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./img/bsnl-logo-icon.png" alt="BSNL CallerTune" class="h-20">
</div>
<h3 class="text-white font-medium">BSNL CallerTune</h3>
</div>
<!-- Additional Store 29 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="450">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./img/airtel-logo-icon.png" alt="Airtel CallerTune" class="h-20">
</div>
<h3 class="text-white font-medium">Airtel CallerTune</h3>
</div>
</div>
<!--
<div class="text-center mt-12">
<a href="#" class="inline-block px-8 py-3 bg-white/10 hover:bg-white/20 text-white rounded-full transition-all duration-300 backdrop-blur-md">
View All Platforms
</a>
</div>
-->
</div>
</section>
<!-- Additional Stores Section -->
<section class="relative py-24 px-6 lg:px-12 bg-gradient-to-b from-[#0f172a] via-[#111827] to-[#1e293b] overflow-hidden"
data-aos="fade-up">
<!-- Floating Blobs -->
<div class="absolute top-0 left-0 w-80 h-80 bg-pink-500 opacity-10 rounded-full filter blur-3xl animate-float-slow z-0"></div>
<div class="absolute bottom-0 right-0 w-96 h-96 bg-purple-500 opacity-10 rounded-full filter blur-3xl animate-float-slower z-0"></div>
<div class="max-w-7xl mx-auto relative z-10">
<div class="text-center mb-16">
<span
class="inline-block px-4 py-1 mb-4 text-sm font-medium text-blue-400 bg-white/10 border border-white/10 rounded-full backdrop-blur-sm">
All Video Distribution Stores
</span>
<h2 class="text-3xl md:text-4xl lg:text-5xl font-bold text-white mb-4 font-jost">
Free Video Distribution ON
<span
class="bg-gradient-to-r from-green-500 via-blue-500 via-red-500 to-yellow-500 text-transparent bg-clip-text animate-gradient-x bg-[length:400%_400%] inline-block">
VEVO
</span>
</h2>
<p class="text-gray-300 max-w-2xl mx-auto font-rubik text-lg">
Distribute Your Video Easyly On All Video Streming Platform For Free
</p>
</div>
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6">
<!-- Additional Store 1 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="100">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/logo-white.svg" alt="VEVO" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">VEVO</h3>
</div>
<!-- Additional Store 2 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="150">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1707246729-apple-logo-white.svg" alt="Apple Video<" class="h-20">
</div>
<h3 class="text-white font-medium">Apple Video</h3>
</div>
<!-- Additional Store 3 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="200">
<div class="h-16 flex items-center justify-center mb-4">
<img src="./Stores Logo/1739218569-meta_lockup_negative-primary_white_rgb.webp" alt="Meta Video" class="h-auto w-[640]">
</div>
<h3 class="text-white font-medium">Meta Video</h3>
</div>
<!-- Additional Store 29 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 text-center hover:bg-white/10 transition-all duration-300 transform hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="450">
<div class="h-16 flex items-center justify-center mb-4">
<img src="https://www.datocms-assets.com/119568/1707247188-tidal-logo-white.svg" alt="Tidal" class="h-8">
</div>
<h3 class="text-white font-medium">Tidal Video</h3>
</div>
</div>
<!--
<div class="text-center mt-12">
<a href="#" class="inline-block px-8 py-3 bg-white/10 hover:bg-white/20 text-white rounded-full transition-all duration-300 backdrop-blur-md">
View All Platforms
</a>
</div>
-->
</div>
</section>
<!-- Distribution Process Section -->
<section class="relative py-24 px-6 lg:px-12 bg-gradient-to-b from-[#1e293b] via-[#111827] to-[#0f172a] overflow-hidden"
data-aos="fade-up">
<!-- Floating Blobs -->
<div class="absolute top-0 left-0 w-80 h-80 bg-pink-500 opacity-10 rounded-full filter blur-3xl animate-float-slow z-0"></div>
<div class="absolute bottom-0 right-0 w-96 h-96 bg-purple-500 opacity-10 rounded-full filter blur-3xl animate-float-slower z-0"></div>
<div class="max-w-7xl mx-auto relative z-10">
<div class="text-center mb-16">
<span
class="inline-block px-4 py-1 mb-4 text-sm font-medium text-blue-400 bg-white/10 border border-white/10 rounded-full backdrop-blur-sm">
HOW IT WORKS
</span>
<h2 class="text-3xl md:text-4xl lg:text-5xl font-bold text-white mb-4 font-jost">
Simple
<span
class="bg-gradient-to-r from-green-500 via-blue-500 via-red-500 to-yellow-500 text-transparent bg-clip-text animate-gradient-x bg-[length:400%_400%] inline-block">
Distribution Process
</span>
</h2>
<p class="text-gray-300 max-w-2xl mx-auto font-rubik text-lg">
Get your music on all major platforms in just a few simple steps.
</p>
</div>
<div class="grid md:grid-cols-3 gap-8">
<!-- Step 1 -->
<div class="bg-white/5 backdrop-blur-md rounded-3xl p-8 border border-white/10 shadow-xl transition-all duration-500 hover:shadow-blue-500/20"
data-aos="fade-up" data-aos-delay="100">
<div class="w-16 h-16 bg-blue-500/20 rounded-full flex items-center justify-center mb-6">
<span class="text-3xl font-bold text-blue-400">1</span>
</div>
<h3 class="text-2xl font-bold text-white mb-4">Upload Your Music</h3>
<p class="text-gray-300">
Upload your tracks, album artwork, and enter all the necessary metadata like title, artist name, genre, and release date.
</p>
</div>
<!-- Step 2 -->
<div class="bg-white/5 backdrop-blur-md rounded-3xl p-8 border border-white/10 shadow-xl transition-all duration-500 hover:shadow-purple-500/20"
data-aos="fade-up" data-aos-delay="200">
<div class="w-16 h-16 bg-purple-500/20 rounded-full flex items-center justify-center mb-6">
<span class="text-3xl font-bold text-purple-400">2</span>
</div>
<h3 class="text-2xl font-bold text-white mb-4">Select Stores</h3>
<p class="text-gray-300">
Choose which digital music stores and streaming platforms you want your music to appear on. Select all or customize your distribution.
</p>
</div>
<!-- Step 3 -->
<div class="bg-white/5 backdrop-blur-md rounded-3xl p-8 border border-white/10 shadow-xl transition-all duration-500 hover:shadow-green-500/20"
data-aos="fade-up" data-aos-delay="300">
<div class="w-16 h-16 bg-green-500/20 rounded-full flex items-center justify-center mb-6">
<span class="text-3xl font-bold text-green-400">3</span>
</div>
<h3 class="text-2xl font-bold text-white mb-4">Release & Earn</h3>
<p class="text-gray-300">
We'll distribute your music to all selected platforms. Track your streams, downloads, and earnings through our dashboard.
</p>
</div>
</div>
</div>
</section>
<!-- Benefits Section -->
<section class="relative py-24 px-6 lg:px-12 bg-gradient-to-b from-[#0f172a] via-[#111827] to-[#1e293b] overflow-hidden"
data-aos="fade-up">
<!-- Floating Blobs -->
<div class="absolute top-0 left-0 w-80 h-80 bg-pink-500 opacity-10 rounded-full filter blur-3xl animate-float-slow z-0"></div>
<div class="absolute bottom-0 right-0 w-96 h-96 bg-purple-500 opacity-10 rounded-full filter blur-3xl animate-float-slower z-0"></div>
<div class="max-w-7xl mx-auto relative z-10">
<div class="text-center mb-16">
<span
class="inline-block px-4 py-1 mb-4 text-sm font-medium text-blue-400 bg-white/10 border border-white/10 rounded-full backdrop-blur-sm">
WHY CHOOSE US
</span>
<h2 class="text-3xl md:text-4xl lg:text-5xl font-bold text-white mb-4 font-jost">
Distribution
<span
class="bg-gradient-to-r from-green-500 via-blue-500 via-red-500 to-yellow-500 text-transparent bg-clip-text animate-gradient-x bg-[length:400%_400%] inline-block">
Benefits
</span>
</h2>
<p class="text-gray-300 max-w-2xl mx-auto font-rubik text-lg">
Why artists choose SavyCore for their music.
</p>
</div>
<div class="grid md:grid-cols-2 lg:grid-cols-4 gap-8">
<!-- Benefit 1 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 border border-white/10 shadow-xl transition-all duration-300 hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="100">
<div class="w-12 h-12 bg-blue-500/20 rounded-full flex items-center justify-center mb-4">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 text-blue-400" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z" />
</svg>
</div>
<h3 class="text-xl font-bold text-white mb-2">100% Rights Retained</h3>
<p class="text-gray-300">
You keep 100% ownership of your music and all your rights.
</p>
</div>
<!-- Benefit 2 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 border border-white/10 shadow-xl transition-all duration-300 hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="150">
<div class="w-12 h-12 bg-purple-500/20 rounded-full flex items-center justify-center mb-4">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 text-purple-400" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
</svg>
</div>
<h3 class="text-xl font-bold text-white mb-2">Competitive Royalties</h3>
<p class="text-gray-300">
Earn up to 100% of your royalties with our artist-friendly plans.
</p>
</div>
<!-- Benefit 3 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 border border-white/10 shadow-xl transition-all duration-300 hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="200">
<div class="w-12 h-12 bg-green-500/20 rounded-full flex items-center justify-center mb-4">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 text-green-400" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" />
</svg>
</div>
<h3 class="text-xl font-bold text-white mb-2">Detailed Analytics</h3>
<p class="text-gray-300">
Track your streams, downloads, and earnings with our comprehensive dashboard.
</p>
</div>
<!-- Benefit 4 -->
<div class="bg-white/5 backdrop-blur-md rounded-xl p-6 border border-white/10 shadow-xl transition-all duration-300 hover:-translate-y-2"
data-aos="fade-up" data-aos-delay="250">
<div class="w-12 h-12 bg-pink-500/20 rounded-full flex items-center justify-center mb-4">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 text-pink-400" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z" />
</svg>
</div>
<h3 class="text-xl font-bold text-white mb-2">Fast Distribution</h3>
<p class="text-gray-300">
Get your music on all platforms within 24-48 hours with our expedited service.
</p>
</div>
</div>
</div>
</section>
<!-- CTA Section -->
<section class="relative py-24 px-6 sm:px-12 lg:px-20 bg-gradient-to-br from-[#0f172a] to-[#121928] overflow-hidden"
data-aos="fade-up" style="background-image:
radial-gradient(circle at 1px 1px, rgba(255 255 255 / 0.05) 1px, transparent 1px),
radial-gradient(circle at 3px 3px, rgba(255 255 255 / 0.05) 1px, transparent 1px);
background-size: 6px 6px;">
<div
class="max-w-4xl mx-auto bg-white/5 backdrop-blur-lg rounded-3xl p-16 shadow-2xl border border-white/10 flex flex-col items-center text-center space-y-6">
<h2 class="text-4xl sm:text-5xl font-extrabold text-white drop-shadow-lg">
Ready to distribute your music globally?
</h2>
<p class="max-w-xl text-gray-300 text-lg sm:text-xl">
Join thousands of artists who trust SavCore to share their music with the world.
</p>
<a href="https://savycore.com/price-plan"
class="inline-block px-12 py-4 rounded-full bg-gradient-to-r from-indigo-500 via-purple-600 to-pink-500 text-white font-semibold shadow-lg shadow-pink-500/50 hover:shadow-pink-500/80 transition duration-300 transform hover:-translate-y-1 hover:scale-105">
Start Distributing Today
</a>
</div>
</section>
<!-- Footer section -->
<footer class="bg-[#141b2c] text-white relative text-center md:text-left">
<div class="absolute inset-0 w-full h-full z-10 opacity-20 pointer-events-none">
<img src="./img/dirt.gif" alt="Pattern Overlay" class="w-full h-full object-cover " />
</div>
<div class="py-16 px-4">
<div class="container mx-auto text-center">
<div class="inline-block px-4 py-1 rounded-full bg-[#162050] text-white text-sm font-medium mb-4">
We Ready 24 Hours
</div>
<h2 class="text-4xl md:text-5xl font-bold mb-8">
Have a problem in your mind?
<span
class="bg-gradient-to-r from-green-500 via-blue-500 via-red-500 to-yellow-500 text-transparent bg-clip-text animate-gradient-x bg-[length:400%_400%] inline-block">
Let's Talk
</span>
</h2>
<a href="tel:+911169312992" class="inline-flex items-center justify-center gap-2 bg-gradient-to-r from-blue-500 to-purple-600 text-white font-medium px-6 py-2 rounded-full
transition-all duration-300 hover:shadow-[0_0_20px] hover:shadow-blue-500/50 hover:brightness-110">
+91 11 693 12992
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-white scale-125" viewBox="0 0 24 24"
fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
<path
d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z">
</path>
</svg>
</a>
</div>
</div>
<div class="container mx-auto px-4 py-12 grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-10">
<div class="md:col-span-1">
<img src="./logo/logo.png" alt="Savycore" class="h-24 mb-6 mx-auto md:mx-0" />
<p class="text-gray-400 text-sm mb-6">
SavyCore is a professional music distribution
company dedicated to helping artists, labels, and creators bring
their music to global platforms. We specialize in delivering
seamless digital distribution, royalty management, and marketing
support, ensuring your music reaches audiences worldwide. Empowering
independent talent with reliable and transparent services is our
mission.
</p>
</div>
<div>
<h3 class="text-xl font-bold mb-6">Useful Links</h3>
<ul class="space-y-4">
<li>
<a href="https://savycore.com/sell-music" class="text-gray-400 hover:text-white transition-colors">About</a>
</li>
<li>
<a href="https://savycore.com/sell-music" class="text-gray-400 hover:text-white transition-colors">Services</a>
</li>
<li>
<a href="https://savycore.com/price-plan" class="text-gray-400 hover:text-white transition-colors">Pricing</a>
</li>
</ul>
</div>
<div>
<h3 class="text-xl font-bold mb-6">Support</h3>
<ul class="space-y-4">
<li>
<a href="#" class="text-gray-400 hover:text-white transition-colors">Privacy
Policy</a>
</li>
<li>
<a href="#"
class="text-gray-400 hover:text-white transition-colors">Terms &
Condition</a>
</li>
<li>
<a href="#" class="text-gray-400 hover:text-white transition-colors">Refund
Policy</a>
</li>
<li>
<a href="https://savycore.com/contact" class="text-gray-400 hover:text-white transition-colors">Contact
Us</a>
</li>
<li>
<a href="/stores-list.html" class="text-gray-400 hover:text-white transition-colors">Music
Stores</a>
</li>
</ul>
</div>
<div>
<h3 class="text-xl font-bold mb-6">Find Us</h3>
<p class="text-gray-400 mb-2">Mon - Fri : 10am - 5pm</p>
<p class="text-gray-400 mb-6">
Maple Ridge, Canada<br />
</p>
</div>
</div>
<div class="border-t border-[#1a2452] py-6">
<div class="container mx-auto px-4 flex flex-col md:flex-row justify-between items-center">
<p class="text-gray-400 text-sm mb-4 md:mb-0">
© Copyright 2025 SavyCore All rights reserved.
</p>
<div class="flex gap-4">
<a href="#"
class="h-10 w-10 rounded-full bg-[#1a2452] flex items-center justify-center text-white hover:bg-[#3040d0] transition-colors">
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 24 24" fill="none"
stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
<path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"></path>
</svg>
</a>
<a href="#"
class="h-10 w-10 rounded-full bg-[#1a2452] flex items-center justify-center text-white hover:bg-[#3040d0] transition-colors">
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 24 24" fill="none"
stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
<path
d="M22 4s-.7 2.1-2 3.4c1.6 10-9.4 17.3-18 11.6 2.2.1 4.4-.6 6-2C3 15.5.5 9.6 3 5c2.2 2.6 5.6 4.1 9 4-.9-4.2 4-6.6 7-3.8 1.1 0 3-1.2 3-1.2z">
</path>
</svg>
</a>
<a href="#"
class="h-10 w-10 rounded-full bg-[#1a2452] flex items-center justify-center text-white hover:bg-[#3040d0] transition-colors">
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 24 24" fill="none"
stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
<rect x="2" y="2" width="20" height="20" rx="5" ry="5"></rect>
<path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"></path>
<line x1="17.5" y1="6.5" x2="17.51" y2="6.5"></line>
</svg>
</a>
<a href="#"
class="h-10 w-10 rounded-full bg-[#1a2452] flex items-center justify-center text-white hover:bg-[#3040d0] transition-colors">
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 24 24" fill="none"
stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
<path
d="M22.54 6.42a2.78 2.78 0 0 0-1.94-2C18.88 4 12 4 12 4s-6.88 0-8.6.46a2.78 2.78 0 0 0-1.94 2A29 29 0 0 0 1 11.75a29 29 0 0 0 .46 5.33A2.78 2.78 0 0 0 3.4 19c1.72.46 8.6.46 8.6.46s6.88 0 8.6-.46a2.78 2.78 0 0 0 1.94-2 29 29 0 0 0 .46-5.25 29 29 0 0 0-.46-5.33z">
</path>
<polygon points="9.75 15.02 15.5 11.75 9.75 8.48 9.75 15.02"></polygon>
</svg>
</a>
<a href="#"
class="h-10 w-10 rounded-full bg-[#1a2452] flex items-center justify-center text-white hover:bg-[#3040d0] transition-colors">
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 24 24" fill="none"
stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
<path d="M12 5a7 7 0 0 0-7 7v6h5v-6a2 2 0 0 1 4 0v6h5v-6a7 7 0 0 0-7-7z"></path>
<rect x="8" y="2" width="8" height="3"></rect>
</svg>
</a>
</div>
</div>
</div>
</footer>
<script src="./script.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/particles.js/2.0.0/particles.min.js"></script>
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
<script>
AOS.init({
duration: 1000,
easing: 'ease-in-out',
once: true,
});
</script>
</body>
</html>