/* ============================================
   Commerce Up — Shared Landing Styles
   ============================================ */

/* Keyframe Animations */
@keyframes float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }
@keyframes fadeInUp { from{opacity:0;transform:translateY(30px)} to{opacity:1;transform:translateY(0)} }
@keyframes pulse-dot { 0%,100%{opacity:1} 50%{opacity:.5} }
@keyframes slideIn { from{transform:translateX(-20px);opacity:0} to{transform:translateX(0);opacity:1} }
@keyframes shimmer { 0%{background-position:-200% 0} 100%{background-position:200% 0} }
@keyframes marquee { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
@keyframes ai-pulse { 0%,100%{box-shadow:0 0 5px rgba(139,92,246,.3)} 50%{box-shadow:0 0 25px rgba(139,92,246,.6)} }
@keyframes glow { 0%,100%{opacity:.6} 50%{opacity:1} }
@keyframes counter-tick { 0%{transform:translateY(0)} 50%{transform:translateY(-2px)} 100%{transform:translateY(0)} }
@keyframes blob { 0%,100%{border-radius:60% 40% 30% 70%/60% 30% 70% 40%} 50%{border-radius:30% 60% 70% 40%/50% 60% 30% 60%} }

/* Gradient Texts */
.gradient-text { background:linear-gradient(135deg,#f43f5e,#8b5cf6,#3b82f6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.gradient-text-ai { background:linear-gradient(135deg,#8b5cf6,#06b6d4);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text; }
.ai-gradient { background:linear-gradient(135deg,#1e1b4b,#312e81,#1e1b4b); }

/* Reveal Animation */
.reveal { opacity:0; transform:translateY(30px); transition:all .7s cubic-bezier(.4,0,.2,1); }
.reveal.visible { opacity:1; transform:translateY(0); }
.reveal-delay-1 { transition-delay:.1s; }
.reveal-delay-2 { transition-delay:.2s; }
.reveal-delay-3 { transition-delay:.3s; }
.reveal-delay-4 { transition-delay:.4s; }

/* Feature Cards */
.feature-card { transition:all .3s ease; }
.feature-card:hover { transform:translateY(-6px); box-shadow:0 20px 60px rgba(0,0,0,.1); }

/* AI Cards */
.ai-card { position:relative; overflow:hidden; transition:all .4s ease; }
.ai-card::before { content:'';position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(139,92,246,.3),rgba(6,182,212,.3));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .4s; }
.ai-card:hover::before { opacity:1; }
.ai-card:hover { transform:translateY(-8px); box-shadow:0 0 40px rgba(139,92,246,.15); }

/* Pricing */
.pricing-popular { background:linear-gradient(135deg,#0f172a,#1e1b4b);border:2px solid rgba(139,92,246,.4); }
.pricing-popular:hover { border-color:rgba(139,92,246,.7);box-shadow:0 0 50px rgba(139,92,246,.15); }

/* Platform Logos */
.platform-logo { filter:grayscale(1) opacity(.5); transition:all .3s; }
.platform-logo:hover { filter:grayscale(0) opacity(1); }

/* CTA Shimmer */
.cta-shimmer { position:relative;overflow:hidden; }
.cta-shimmer::after { content:'';position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);animation:shimmer 3s infinite; }

/* Hero Patterns */
.hero-pattern { background-image:none; }
.dark-hero-pattern { background-image:none; }

/* Testimonial BG */
.testimonial-bg { background:linear-gradient(135deg,#fff7ed,#fef2f2,#faf5ff); }

/* Widget Scroll (Marquee) */
.widget-scroll { display:flex;gap:1rem;animation:marquee 30s linear infinite; }
.widget-scroll:hover { animation-play-state:paused; }

/* Notification Popup */
.notification-popup { animation:slideIn .5s ease forwards,float 3s ease-in-out infinite 1s; }

/* Counter */
.counter-value { animation:counter-tick .3s ease; }

/* Blob */
.blob-shape { animation:blob 8s ease-in-out infinite; }

/* FAQ */
.faq-answer { max-height:0;overflow:hidden;padding-bottom:0;transition:max-height .4s ease,padding-bottom .4s ease; }
.faq-answer.open { max-height:500px;padding-bottom:1.25rem; }

/* Promo Bar */
.promo-bar { background:linear-gradient(90deg,#4f46e5,#7c3aed,#8b5cf6,#7c3aed,#4f46e5);background-size:200% 100%;animation:shimmer 4s linear infinite; }