:root{--bg-color: #030712;--text-primary: #f9fafb;--text-secondary: #9ca3af;--primary-color: #3b82f6;--primary-glow: rgba(59, 130, 246, .5);--secondary-color: #06b6d4;--accent-gradient: linear-gradient(135deg, #3b82f6 0%, #06b6d4 100%);--glass-bg: rgba(255, 255, 255, .03);--glass-border: rgba(255, 255, 255, .08);--glass-hover: rgba(255, 255, 255, .08);--font-main: "Inter", system-ui, -apple-system, sans-serif}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-main);background-color:var(--bg-color);color:var(--text-primary);line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:var(--bg-color)}::-webkit-scrollbar-thumb{background:var(--glass-border);border-radius:5px;border:2px solid var(--bg-color)}::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}#app{width:100%;min-height:100vh;display:flex;flex-direction:column}.navbar{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 5%;position:fixed;top:0;width:100%;z-index:100;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#03071299;border-bottom:1px solid transparent;transition:all .3s ease}.navbar.scrolled{background:#030712e6;border-bottom:1px solid var(--glass-border);box-shadow:0 10px 30px -10px #00000080;padding-top:1rem;padding-bottom:1rem}.logo{font-weight:800;font-size:1.25rem;letter-spacing:-.02em}.logo .highlight{color:var(--primary-color)}.nav-cta{color:var(--text-primary);text-decoration:none;font-weight:500;font-size:.9rem;padding:.5rem 1rem;border:1px solid var(--glass-border);border-radius:999px;transition:all .3s ease}.nav-cta:hover{background:var(--glass-hover);border-color:var(--primary-color)}.hero{position:relative;min-height:90vh;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:4rem;padding:0 5%;overflow:hidden;max-width:1400px;margin:0 auto}.hero-background-glow{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:60vw;height:60vw;background:radial-gradient(circle,var(--primary-glow) 0%,transparent 70%);opacity:.2;filter:blur(80px);pointer-events:none;z-index:-1;animation:pulse 8s infinite alternate}.hero-content{max-width:800px;width:100%;display:flex;flex-direction:column;align-items:flex-start;z-index:1}.hero-left{width:100%;display:flex;flex-direction:column;align-items:flex-start}.cta-container{display:flex;gap:3rem;align-items:center;margin-top:2rem}.hero-right{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;z-index:1}.stats-group{display:flex;align-items:center;gap:2rem;margin-bottom:3rem}.stat-item{display:flex;flex-direction:column;gap:.25rem}.stat-number{font-size:2.5rem;font-weight:800;line-height:1}.stat-label{font-size:.875rem;color:var(--text-secondary);line-height:1.4;font-weight:500}.stat-divider{width:1px;height:40px;background-color:var(--glass-border)}.hero-visual{width:100%;display:flex;justify-content:flex-end}.code-card{background:#0f172acc;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:12px;padding:1.5rem;width:320px;position:relative;box-shadow:0 20px 50px #0000004d;transform:perspective(1000px) rotateY(-10deg) rotateX(5deg);transition:transform .5s ease}.code-card:hover{transform:perspective(1000px) rotateY(0) rotateX(0)}.code-header{display:flex;gap:8px;margin-bottom:1rem}.dot{width:10px;height:10px;border-radius:50%}.dot.red{background:#ef4444}.dot.yellow{background:#eab308}.dot.green{background:#22c55e}.code-content{font-family:Fira Code,monospace;font-size:.9rem;color:#a5b4fc}.code-line{margin-bottom:4px}.code-line.indent{margin-left:1.5rem}.purple{color:#c084fc}.blue{color:#60a5fa}.yellow{color:#fde047}.green{color:#4ade80}.card-glow{position:absolute;top:-20px;right:-20px;width:100px;height:100px;background:var(--primary-color);filter:blur(50px);opacity:.4;z-index:-1}@media(max-width:968px){.hero{grid-template-columns:1fr;text-align:center;padding-top:6rem;gap:3rem}.hero-left{max-width:100%;display:flex;flex-direction:column;align-items:center}.hero-right{align-items:center;width:100%}.hero-label-wrapper{justify-content:center}.hero .description{margin:0 auto 3rem}.cta-container{justify-content:center;gap:2rem}.stats-group{justify-content:center;width:100%}.hero-visual{justify-content:center}}@media(max-width:768px){.hero h1{font-size:2rem;line-height:1.2}.navbar{padding:1rem 1.5rem}.primary-btn{width:100%;justify-content:center}.css-illustration{transform:scale(.7)}}.primary-btn{display:inline-flex;align-items:center;gap:.5rem;background:var(--text-primary);color:var(--bg-color);text-decoration:none;padding:1rem 2.5rem;border-radius:999px;font-weight:600;font-size:1rem;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 0 20px #ffffff1a}.primary-btn:hover{transform:translateY(-2px);box-shadow:0 0 30px #fff3;background:#fff}.secondary-btn{display:inline-flex;align-items:center;gap:.5rem;color:var(--text-primary);text-decoration:none;font-weight:500;font-size:1rem;padding-bottom:2px;border-bottom:1px solid transparent;transition:all .2s ease}.secondary-btn:hover{border-bottom-color:var(--text-primary)}.arrow-icon{width:18px;height:18px;transition:transform .2s ease}.secondary-btn:hover .arrow-icon{transform:translate(4px)}.services{padding:5rem 5%;background:linear-gradient(to bottom,var(--bg-color),#0f172a)}.section-header{text-align:center;margin-bottom:4rem}.section-header h2{font-size:2.5rem;font-weight:700;margin-bottom:1rem}.section-header p{color:var(--text-secondary)}.cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;max-width:1200px;margin:0 auto}.card{background:linear-gradient(var(--glass-bg),var(--glass-bg)) padding-box,linear-gradient(var(--glass-border),var(--glass-border)) border-box;border:1px solid transparent;padding:2.5rem;border-radius:16px;transition:all .4s ease;position:relative;overflow:hidden}.card:hover{transform:translateY(-5px);background:linear-gradient(#0f172a,#0f172a) padding-box,linear-gradient(45deg,var(--primary-color),var(--secondary-color),var(--primary-color)) border-box;background-size:200% 200%;animation:borderAnimation 3s ease infinite;box-shadow:0 20px 40px #0006}@keyframes borderAnimation{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.icon-box{width:56px;height:56px;background:#3b82f61a;border-radius:12px;display:flex;align-items:center;justify-content:center;color:var(--primary-color);margin-bottom:1.5rem}.card h3{font-size:1.5rem;margin-bottom:1rem;font-weight:600}.card p{color:var(--text-secondary);font-size:.95rem;line-height:1.7}.about{padding:5rem 5%;background:var(--bg-color)}.about-content{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}.about-text h2{font-size:2.5rem;font-weight:700;margin-bottom:1.5rem}.about-text p{color:var(--text-secondary);font-size:1.1rem;line-height:1.8}.about-stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem}.stat-box{background:var(--glass-bg);border:1px solid var(--glass-border);padding:2rem;border-radius:12px}.stat-box h4{color:var(--primary-color);margin-bottom:.5rem;font-size:1.1rem}.stat-box p{color:var(--text-secondary);font-size:.95rem;line-height:1.5}.contact{padding:5rem 5%;background:linear-gradient(to top,var(--bg-color),#0f172a)}.contact-grid{display:flex;justify-content:center;max-width:1000px;margin:0 auto}.contact-card{background:#0f172a99;border:1px solid rgba(255,255,255,.1);padding:3rem 2rem;border-radius:24px;text-align:center;width:100%;max-width:500px;position:relative;overflow:hidden;-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);box-shadow:0 40px 100px -20px #00000080}.contact-card:after{content:"";position:absolute;top:0;left:0;width:100%;height:3px;background:linear-gradient(90deg,var(--primary-color),var(--secondary-color));box-shadow:0 0 20px var(--primary-color)}.contact-card h3{font-size:2rem;margin-bottom:2rem;color:#fff;font-weight:800;letter-spacing:-.03em;background:none;-webkit-background-clip:unset;background-clip:unset;text-shadow:0 10px 30px rgba(0,0,0,.5)}.contact-label{display:block;color:var(--secondary-color);font-weight:700;margin-bottom:1rem;font-size:.8rem;text-transform:uppercase;letter-spacing:.2em}.contact-card a{display:inline-block;background:var(--primary-color);color:#fff;text-decoration:none;font-size:1.1rem;font-weight:600;padding:1rem 2rem;border-radius:100px;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 10px 30px #3b82f64d;border:1px solid rgba(255,255,255,.1)}.contact-card a:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 15px 40px #3b82f680;background:#2563eb;text-shadow:none}footer{padding:3rem 5%;border-top:1px solid var(--glass-border);text-align:center;margin-top:auto}.footer-content{display:flex;flex-direction:column;gap:1rem;align-items:center}.footer-content p{color:var(--text-secondary);font-size:.9rem}.hidden-text{visibility:hidden}.typing-done:after{content:"|";animation:blink 1s step-end infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}@keyframes pulse{0%{transform:translate(-50%,-50%) scale(1);opacity:.2}to{transform:translate(-50%,-50%) scale(1.1);opacity:.3}}.animate-up{opacity:0;transform:translateY(20px);animation:fadeUp .8s cubic-bezier(.16,1,.3,1) forwards}.delay-1{animation-delay:.1s}.delay-2{animation-delay:.2s}.delay-3{animation-delay:.3s}@keyframes fadeUp{to{opacity:1;transform:translateY(0)}}.css-illustration{position:relative;width:400px;height:400px;display:flex;align-items:center;justify-content:center;perspective:1000px}.sphere-layer{position:absolute;border-radius:50%;border:1px solid rgba(59,130,246,.3);box-shadow:0 0 15px #3b82f61a}.layer-1{width:200px;height:200px;animation:rotateSphere 10s linear infinite}.layer-2{width:280px;height:280px;border-color:#06b6d433;animation:rotateSphere 15s linear infinite reverse}.layer-3{width:360px;height:360px;border-color:#3b82f61a;animation:rotateSphere 20s linear infinite}.orbit-ring{position:absolute;border-radius:50%;border:1px dashed rgba(255,255,255,.1)}.ring-1{width:450px;height:450px;animation:spin 30s linear infinite}.ring-2{width:550px;height:550px;animation:spin 40s linear infinite reverse}.core-grid{position:relative;width:100px;height:100px;display:flex;align-items:center;justify-content:center}.core-ring{position:absolute;border-radius:50%;border:2px solid var(--primary-color);opacity:.5}.r1{width:40px;height:40px;animation:pulseCore 2s ease-in-out infinite}.r2{width:60px;height:60px;border-color:var(--secondary-color);animation:pulseCore 2s ease-in-out infinite .5s}@keyframes rotateSphere{0%{transform:rotate3d(1,1,1,0)}to{transform:rotate3d(1,1,1,360deg)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pulseCore{0%,to{transform:scale(1);opacity:.5}50%{transform:scale(1.1);opacity:.8}}
