:root {
  --primary: #5F2B8C;
  --secondary: #FF2B9D;
  --yellow: #f1f50b;
  --white: #fff
}
body {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
   background: linear-gradient(
    to bottom,
    #FF2B9D 0%,
    #5F2B8C 50%,
    #FF2B9D 100%
  );
}

.gradient- {
  background: linear-gradient(
    to bottom,
    #FF2B9D 0%,
    #5F2B8C 50%,
    #FF2B9D 100%
  );
}

.salsa-gradient {
  background: linear-gradient(45deg, var(--primary), var(--secondary));
}
.applist-gradient {
  background: linear-gradient(45deg,#ff2b9c55, #5f2b8c56 );
}
.btn-primary {
  background: linear-gradient(45deg, var(--primary), var(--secondary));
  transition: all 0.3s ease;
}

.btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 25px -5px rgba(99, 102, 241, 0.4);
}

.nav-item {
  position: relative;
}

.nav-item::after {
  content: "";
  position: absolute;
  bottom: -5px;
  left: 0;
  width: 0;
  height: 2px;
  background: var(--secondary);
  transition: width 0.3s ease;
}

.nav-item:hover::after {
  width: 100%;
}