/* ========= 🔥 SOCIAL CTA ========= */
.social-cta {
  margin: 20px 0 30px 0;
  display: flex;
  justify-content: center;
  width: 100%;
}

.social-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  max-width: 400px;
}

.social-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 6px;
  text-decoration: none;
  color: white;
  font-size: 14px;
  font-weight: 500;
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.social-btn .logo {
  display: inline-block;
  width: 18px;
  height: 18px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.social-btn:hover {
  transform: translateY(-2px) scale(1.05);
  opacity: 0.9;
}

/* 🎧 Spotify */
.social-btn.spotify {
  background-color: #1DB954;
}
.social-btn.spotify .logo {
  background-image: url('https://cdn.jsdelivr.net/gh/simple-icons/simple-icons/icons/spotify.svg');
  filter: invert(1);
}

/* 🍎 Apple Music */
.social-btn.apple {
  background-color: #000000;
}
.social-btn.apple .logo {
  background-image: url('https://cdn.jsdelivr.net/gh/simple-icons/simple-icons/icons/apple.svg');
  filter: invert(1);
}

/* 📸 Instagram */
.social-btn.ig {
  background: linear-gradient(45deg, #F58529, #DD2A7B, #8134AF, #515BD4);
}
.social-btn.ig .logo {
  background-image: url('https://cdn.jsdelivr.net/gh/simple-icons/simple-icons/icons/instagram.svg');
  filter: invert(1);
}

/* 📘 Facebook */
.social-btn.fb {
  background-color: #1877F2;
}
.social-btn.fb .logo {
  background-image: url('https://cdn.jsdelivr.net/gh/simple-icons/simple-icons/icons/facebook.svg');
  filter: invert(1);
}

/* 🐦 X (Twitter) */
.social-btn.x {
  background-color: #000000;
}
.social-btn.x .logo {
  background-image: url('https://cdn.jsdelivr.net/gh/simple-icons/simple-icons/icons/x.svg');
  filter: invert(1);
}

/* ▶️ YouTube */
.social-btn.yt {
  background-color: #FF0000;
}
.social-btn.yt .logo {
  background-image: url('https://cdn.jsdelivr.net/gh/simple-icons/simple-icons/icons/youtube.svg');
  filter: invert(1);
}

/* 🎵 TikTok */
.social-btn.tiktok {
  background-color: #000000;
}
.social-btn.tiktok .logo {
  background-image: url('https://cdn.jsdelivr.net/gh/simple-icons/simple-icons/icons/tiktok.svg');
  filter: invert(1);
}

/* 📱 Responsive */
@media (max-width: 480px) {
  .social-container {
    gap: 8px;
    max-width: 300px;
  }
  .social-btn {
    flex: 1 1 45%;
    font-size: 12px;
    padding: 6px 10px;
  }
  .social-btn .logo {
    width: 16px;
    height: 16px;
  }
}
