body {
  background-color: #09090b;
  color: #F3F4F6;
  font-family: 'Inter', sans-serif;
  overflow-x: hidden;
}

.glassmorphism {
  background: rgba(9, 9, 11, 0.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.hero-glow {
  background: radial-gradient(circle at 50% 30%, rgba(99, 102, 241, 0.12) 0%, rgba(9, 9, 11, 0) 70%);
}

.card-item {
  background: rgba(255, 255, 255, 0.03);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.05);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s ease, border-color 0.3s ease;
}

.card-item:hover {
  transform: translateY(-6px);
  border-color: rgba(99, 102, 241, 0.4);
  box-shadow: 0 15px 30px -10px rgba(0, 0, 0, 0.5), 0 0 15px -5px rgba(99, 102, 241, 0.3);
}

.niche-cta-box {
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.1) 0%, rgba(34, 211, 238, 0.05) 100%);
  border: 1px solid rgba(99, 102, 241, 0.2);
}

/* ========================================= */
/* 🚀 NEW LIGHTWEIGHT ANIMATIONS             */
/* ========================================= */

/* 1. Headline Gradient Shine Animation */
.animate-shine {
  animation: shine 4s linear infinite;
}

@keyframes shine {
  to {
    background-position: 200% center;
  }
}

/* 2. Floating WhatsApp Pulse Ring */
.pulse-ring {
  position: relative;
  z-index: 10;
}

.pulse-ring::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 9999px;
  background-color: rgba(16, 185, 129, 0.6); /* emerald-500 */
  z-index: -1;
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes pulse-shadow {
  0% {
    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7); /* Emerald green shadow */
  }
  70% {
    box-shadow: 0 0 0 16px rgba(16, 185, 129, 0); /* Shadow expands and fades */
  }
  100% {
    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0);
  }
}