.bento-card{background:var(--bg-card);border:1px solid var(--border-primary);border-radius:1.25rem}.step-bar-fill{background:linear-gradient(90deg, var(--accent), var(--accent-end));width:0%;box-shadow:0 0 12px color-mix(in srgb, var(--accent) 40%, transparent);animation:9s infinite barFillLoop;animation-delay:calc(var(--i) * 2s)}@keyframes barFillLoop{0%{opacity:0;width:0%}5%{opacity:1}25%{opacity:1;width:100%}50%{opacity:1;width:100%}70%{opacity:0;width:100%}71%{opacity:0;width:0%}to{opacity:0;width:0%}}.step-bar-fill-v{background:linear-gradient(to bottom, var(--accent), var(--accent-end));height:0%;box-shadow:0 0 12px color-mix(in srgb, var(--accent) 40%, transparent);animation:9s infinite barFillLoopV;animation-delay:calc(var(--i) * 2s)}@keyframes barFillLoopV{0%{opacity:0;height:0%}5%{opacity:1}25%{opacity:1;height:100%}50%{opacity:1;height:100%}70%{opacity:0;height:100%}71%{opacity:0;height:0%}to{opacity:0;height:0%}}.landing-mesh{pointer-events:none;position:absolute;inset:0}.landing-mesh:before{content:"";background:radial-gradient(circle, var(--accent) 0%, transparent 60%);opacity:1;filter:blur(50px);pointer-events:none;border-radius:50%;width:90vw;max-width:1100px;height:90vw;max-height:1100px;position:absolute;top:-15%;right:-5%}.landing-mesh:after{content:"";background:radial-gradient(circle, var(--accent-end) 0%, transparent 55%);opacity:.9;filter:blur(50px);pointer-events:none;border-radius:50%;width:80vw;max-width:900px;height:80vw;max-height:900px;position:absolute;bottom:-10%;left:-5%}.dark .landing-mesh:before{opacity:.55}.dark .landing-mesh:after{opacity:.45}.landing-mesh-blob{pointer-events:none;border-radius:50%;position:absolute}.landing-mesh-blob-1{opacity:.55;filter:blur(60px);background:radial-gradient(circle,#22d3ee 0%,#0000 60%);width:55vw;max-width:700px;height:55vw;max-height:700px;top:20%;left:30%}.landing-mesh-blob-2{opacity:.45;filter:blur(60px);background:radial-gradient(circle,#a78bfa 0%,#0000 60%);width:45vw;max-width:550px;height:45vw;max-height:550px;bottom:15%;right:20%}.dark .landing-mesh-blob-1{opacity:.28}.dark .landing-mesh-blob-2{opacity:.22}.gradient-border{background:var(--bg-card);border-radius:1.25rem;position:relative}.gradient-border:before{content:"";border-radius:inherit;background:linear-gradient(135deg, color-mix(in srgb, var(--accent) 50%, transparent), color-mix(in srgb, var(--accent-end) 30%, transparent), transparent 60%);-webkit-mask-composite:xor;opacity:.5;padding:1px;transition:opacity .3s;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.gradient-border:hover:before{opacity:1}.card-glow{position:relative}.card-glow:after{content:"";border-radius:inherit;background:radial-gradient(ellipse at center, color-mix(in srgb, var(--accent) 20%, transparent) 0%, transparent 70%);filter:blur(30px);opacity:0;z-index:-1;pointer-events:none;transition:opacity .4s;position:absolute;inset:-10px}.card-glow:hover:after{opacity:1}.dark .card-glow:hover:after{opacity:.6}.phone-frame{width:340px;height:700px;box-shadow:0 0 0 2px #333, 0 25px 80px #00000040, 0 0 60px color-mix(in srgb, var(--accent) 8%, transparent);border:6px solid #1a1a1a;border-radius:48px;position:relative;overflow:hidden}.dark .phone-frame{box-shadow:0 0 0 2px #444, 0 25px 80px #00000080, 0 0 60px color-mix(in srgb, var(--accent) 5%, transparent);border-color:#333}.phone-frame:before{content:"";z-index:10;background:#1a1a1a;border-radius:0 0 16px 16px;width:130px;height:32px;position:absolute;top:0;left:50%;transform:translate(-50%)}.dark .phone-frame:before{background:#333}@keyframes targetPing{0%{opacity:0;transform:scale(4)}30%{opacity:.7;transform:scale(1)}35%{opacity:0}to{opacity:0}}.target-ping{animation:4s cubic-bezier(.4,0,1,1) infinite targetPing}@keyframes heartbeat{0%,to{transform:scale(1)}15%{transform:scale(1.04)}30%{transform:scale(1)}45%{transform:scale(1.02)}60%{transform:scale(1)}}.landing-heartbeat{animation:1.2s ease-in-out 2 heartbeat}@keyframes scrollReveal{0%{opacity:0;transform:translateY(50px)}to{opacity:1;transform:translateY(0)}}.scroll-reveal{animation:linear both scrollReveal;animation-timeline:view();animation-range:entry entry 35%}.scroll-reveal-delay-1{animation-range:entry 5% entry 40%}.scroll-reveal-delay-2{animation-range:entry 10% entry 45%}@keyframes heroFadeIn{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.hero-animate{animation:.8s both heroFadeIn}.hero-animate-delay-1{animation-delay:.15s}.hero-animate-delay-2{animation-delay:.3s}.hero-animate-delay-3{animation-delay:.45s}.feature-frame{border-radius:1rem;position:relative;overflow:hidden}.feature-frame:before{content:"";border-radius:inherit;background:linear-gradient(160deg, color-mix(in srgb, var(--accent) 40%, transparent), color-mix(in srgb, var(--accent-end) 20%, transparent), transparent 50%);-webkit-mask-composite:xor;z-index:1;padding:1px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.feature-frame:after{content:"";background:radial-gradient(ellipse at 30% 50%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 60%);filter:blur(30px);z-index:-1;pointer-events:none;position:absolute;inset:-20px}.cta-glow{position:relative}.cta-glow:before{content:"";background:radial-gradient(circle, color-mix(in srgb, var(--accent) 15%, transparent), transparent 70%);filter:blur(60px);pointer-events:none;width:60%;height:60%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.dark .cta-glow:before{background:radial-gradient(circle, color-mix(in srgb, var(--accent) 8%, transparent), transparent 70%)}
