:root{--primary: #4A60FE;--primary-hover: #3a4ee0;--secondary: #AE52FF;--bg-color: #F8FAFC;--surface: #FFFFFF;--text-main: #222529;--text-muted: #64748B;--border: #E2E8F0;--shadow-sm: 0 4px 6px -1px rgba(0, 0, 0, .05);--shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, .05), 0 10px 10px -5px rgba(0, 0, 0, .02);--glass-bg: rgba(255, 255, 255, .7);--glass-border: rgba(255, 255, 255, .4)}*{margin:0;padding:0;box-sizing:border-box}html{overflow-x:hidden}body{font-family:Inter,-apple-system,sans-serif;background-color:var(--bg-color);color:var(--text-main);line-height:1.6;overflow-x:hidden;position:relative}.bg-blur{position:absolute;border-radius:50%;filter:blur(100px);z-index:-1;opacity:.5;animation:float 20s ease-in-out infinite alternate}.blob-1{width:600px;height:600px;background:radial-gradient(circle,#ae52ff4d,#4a60fe1a);top:-100px;right:-100px}.blob-2{width:500px;height:500px;background:radial-gradient(circle,#4a60fe33,#ae52ff1a);bottom:20%;left:-150px;animation-delay:-5s}@keyframes float{0%{transform:translate(0) scale(1)}to{transform:translate(-50px,50px) scale(1.1)}}.text-gradient{background:linear-gradient(135deg,var(--primary) 0%,var(--secondary) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.flex-center{display:flex;justify-content:center;align-items:center}.btn-primary,.btn-secondary{display:inline-flex;align-items:center;justify-content:center;padding:.6rem 1.2rem;border-radius:8px;text-decoration:none;font-weight:500;transition:all .3s ease;border:none;cursor:pointer}.btn-primary{background:linear-gradient(135deg,var(--primary) 0%,#6879ff 100%);color:#fff;box-shadow:0 4px 12px #4a60fe4d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 16px #4a60fe66}.btn-secondary{background:var(--surface);color:var(--primary);border:1px solid var(--border)}.btn-secondary:hover{background:var(--bg-color);border-color:var(--primary)}.size-lg{padding:.8rem 1.8rem;font-size:1.1rem;border-radius:10px}.navbar{display:flex;justify-content:space-between;align-items:center;padding:1rem 4rem;background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--glass-border);position:sticky;top:0;z-index:100}.logo{display:flex;align-items:center;gap:.5rem;font-size:1.2rem;font-weight:700}.logo img{width:26px;height:26px}.nav-links{display:flex;gap:2rem}.nav-links a{text-decoration:none;color:var(--text-main);font-weight:500;transition:color .2s}.nav-links a:hover{color:var(--primary)}.hero{display:flex;align-items:center;padding:6rem 4rem;max-width:1400px;margin:0 auto;gap:4rem}.hero-content{flex:1}.badge{display:inline-block;padding:.4rem .8rem;background:#4a60fe1a;color:var(--primary);border-radius:20px;font-size:.875rem;font-weight:600;margin-bottom:1.5rem}.hero h1{font-size:3rem;line-height:1.5;margin-bottom:1.5rem;font-weight:800;letter-spacing:-1px}.hero p{font-size:1.1rem;color:var(--text-muted);margin-bottom:2.5rem;max-width:500px}.hero-actions{display:flex;gap:1rem}.hero-visual{flex:1.2}.mockup-window{background:var(--surface);border-radius:12px;box-shadow:var(--shadow-lg);border:1px solid rgba(255,255,255,.8);overflow:hidden;transform:perspective(1000px) rotateY(-5deg) rotateX(2deg);transition:transform .5s ease}.mockup-window:hover{transform:perspective(1000px) rotateY(0) rotateX(0)}.mockup-header{background:#f1f5f9;padding:.75rem 1rem;display:flex;gap:.5rem;border-bottom:1px solid var(--border)}.dot{width:10px;height:10px;border-radius:50%}.dot-r{background:#ff5f56}.dot-y{background:#ffbd2e}.dot-g{background:#27c93f}.mockup-body{display:flex;height:350px}.mock-sidebar{width:60px;border-right:1px solid var(--border);padding:1rem;display:flex;flex-direction:column;gap:.5rem}.mock-layer{height:20px;border-radius:4px;background:#e2e8f0}.mock-layer.active{background:var(--primary);opacity:.2}.mock-canvas{flex:1;background:#f8fafc;background-image:radial-gradient(#cbd5e1 1px,transparent 1px);background-size:20px 20px;position:relative}.mock-code{width:170px;border-left:1px solid var(--border);background:#0f172a;color:#e2e8f0;padding:1rem;font-family:monospace;font-size:.75rem}.indent{margin-left:1rem}.c-tag{color:#5eead4}.c-attr{color:#fcd34d}.c-str{color:#93c5fd}.c-comment{color:#64748b}.features-section{padding:6rem 4rem;max-width:1200px;margin:0 auto}.section-heading{text-align:center;margin-bottom:4rem}.section-heading h2{font-size:2.5rem;font-weight:700;margin-bottom:1rem}.section-heading p{color:var(--text-muted);font-size:1.1rem}.features-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem}.feature-card{background:var(--surface);border-radius:16px;padding:2.5rem;box-shadow:var(--shadow-sm);border:1px solid var(--border);transition:transform .3s,box-shadow .3s}.feature-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}.feature-wide{grid-column:span 2}.feature-icon{width:48px;height:48px;border-radius:12px;display:flex;justify-content:center;align-items:center;margin-bottom:1.5rem;color:#fff}.bg-blue{background:#3b82f6}.bg-purple{background:#8b5cf6}.bg-teal{background:#14b8a6}.bg-orange{background:#f97316}.bg-indigo{background:#6366f1}.feature-card h3{font-size:1.25rem;margin-bottom:1rem}.feature-card p{color:var(--text-muted);line-height:1.6}.advantages-section{padding:6rem 4rem;max-width:1100px;margin:0 auto}.advantage-row{display:flex;align-items:center;gap:4rem;margin-bottom:6rem}.advantage-row.reverse{flex-direction:row-reverse}.adv-text{flex:1}.adv-number{font-size:3rem;font-weight:800;color:#4a60fe1a;margin-bottom:-10px}.adv-text h3{font-size:1.8rem;margin-bottom:1rem}.adv-text p{color:var(--text-muted);font-size:1.1rem}.adv-visual{flex:1;min-height:250px}.glass-box{background:var(--glass-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--glass-border);border-radius:16px;box-shadow:var(--shadow-lg);padding:2rem}.browser-tabs{display:flex;gap:.5rem;border-bottom:1px solid var(--border);padding-bottom:.5rem;margin-bottom:1rem}.tab{padding:.25rem 1rem;border-radius:4px;color:var(--text-muted);font-size:.875rem}.tab.active{background:var(--primary);color:#fff}.speed-icon{font-size:2rem}.ms-text{font-size:1.5rem;font-weight:700;color:var(--primary);margin-left:1rem}.code-box{background:#0f172a;padding:1.5rem;border-radius:12px}.code-box pre{margin:0;font-family:monospace;font-size:.9rem;overflow-x:auto}.fps-meter{text-align:center}.fps-circle{width:100px;height:100px;border-radius:50%;border:4px solid var(--primary);margin:0 auto 1rem;display:flex;flex-direction:column;justify-content:center;align-items:center;color:var(--primary)}.fps-circle span{font-size:2rem;font-weight:800;line-height:1}.fps-circle small{font-size:.75rem}.shortcut-box{gap:1rem}.key{padding:1rem 1.5rem;background:var(--surface);border:1px solid var(--border);border-radius:8px;box-shadow:0 4px 0 var(--border);font-weight:700;font-size:1.25rem}.plus{font-size:2rem;color:var(--text-muted)}.tools-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.tool-item{background:#4a60fe0d;border:1px solid rgba(74,96,254,.1);padding:1rem;border-radius:8px;text-align:center;font-weight:500;color:var(--primary)}.cta-bottom{background:linear-gradient(135deg,var(--primary) 0%,var(--secondary) 100%);padding:6rem 1rem;text-align:center;color:#fff}.cta-content{max-width:600px;margin:0 auto}.cta-content h2{font-size:2rem;margin-bottom:1rem}.cta-content p{font-size:1.1rem;margin-bottom:2rem;opacity:.9}.cta-bottom .btn-primary{background:#fff;color:var(--primary);box-shadow:none}.cta-bottom .btn-primary:hover{background:#f8fafc;transform:translateY(-2px);box-shadow:0 10px 20px #0000001a}footer{padding:2rem 4rem;text-align:center;border-top:1px solid var(--border);color:var(--text-muted)}.brand{font-weight:700;color:var(--text-main);margin-bottom:.5rem}@media(max-width:768px){.hero{flex-direction:column;padding:4rem 2rem;gap:2rem;text-align:center}.hero h1{font-size:2.5rem}.hero-actions{justify-content:center}.features-grid{grid-template-columns:1fr}.feature-wide{grid-column:span 1}.advantage-row,.advantage-row.reverse{flex-direction:column;gap:2rem;text-align:center}.nav-links{display:none}.navbar{padding:1rem 2rem}}