body { font-family: "Inter", sans-serif; cursor: none; }
#cursor { width: 15px; height: 15px; background: #f43f5e; border-radius: 50%; position: fixed; pointer-events: none; z-index: 9999; mix-blend-mode: difference; transition: transform 0.1s ease; box-shadow: 0 0 15px #f43f5e; }

.glass-card { background: rgba(255, 255, 255, 0.03); backdrop-filter: blur(12px); border: 1px solid rgba(255, 255, 255, 0.1); transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
.dark .glass-card:hover { border-color: #f43f5e; background: rgba(255, 255, 255, 0.06); transform: translateY(-8px) scale(1.01); }
.light .glass-card { background: rgba(0, 0, 0, 0.02); border-color: rgba(0, 0, 0, 0.1); color: #18181b; }

/* Card Hover Gradients */
.card-rose:hover h3 { background: linear-gradient(135deg, #f43f5e, #fb923c); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.card-blue:hover h3 { background: linear-gradient(135deg, #3b82f6, #06b6d4); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.card-purple:hover h3 { background: linear-gradient(135deg, #a855f7, #ec4899); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.card-yellow:hover h3 { background: linear-gradient(135deg, #fbbf24, #fb923c); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }

.bg-mesh {
  background-color: #09090b;
  background-image: radial-gradient(at 0% 0%, hsla(343, 100%, 50%, 0.1) 0, transparent 50%),
                    radial-gradient(at 100% 100%, hsla(23, 100%, 50%, 0.1) 0, transparent 50%);
}
.light .bg-mesh { background-color: #fafafa; background-image: none; }

@keyframes slide-in { 0% { opacity: 0; transform: translateX(-20px); } 100% { opacity: 1; transform: translateX(0); } }
.pricing-feature { opacity: 0; animation: slide-in 0.5s ease-out forwards; }
.pricing-feature:nth-child(1) { animation-delay: 0.1s; }
.pricing-feature:nth-child(2) { animation-delay: 0.2s; }
.pricing-feature:nth-child(3) { animation-delay: 0.3s; }
.pricing-feature:nth-child(4) { animation-delay: 0.4s; }
.pricing-feature:nth-child(5) { animation-delay: 0.5s; }

.ripple { position: relative; overflow: hidden; }
.ripple::after { content: ""; position: absolute; top: 50%; left: 50%; width: 0; height: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.3); transform: translate(-50%, -50%); transition: width 0.6s, height 0.6s; }
.ripple:hover::after { width: 400px; height: 400px; }

.gradient-text { background: linear-gradient(90deg, #fff, #f43f5e, #fb923c, #fbbf24, #f43f5e, #fff); background-size: 300% auto; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: gradient 6s linear infinite; }
@keyframes gradient { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
.delay-1 { animation-delay: 1s; }
.delay-2 { animation-delay: 2s; }
.delay-3 { animation-delay: 0.5s; }