*{box-sizing:border-box;margin:0;padding:0}body{color:#f3f4f6;background:#1a1a2e;min-height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow-x:hidden}header{justify-content:space-between;align-items:center;max-width:1400px;margin:0 auto;padding:20px 40px;display:flex}.logo-header{align-items:center;gap:12px;text-decoration:none;display:flex}.logo-header span{color:#f3f4f6;font-size:24px;font-weight:600}nav{align-items:center;gap:30px;display:flex}nav a{color:#9ca3af;font-size:15px;text-decoration:none;transition:color .2s}nav a:hover{color:#f3f4f6}.nav-dropdown{position:relative}.nav-dropdown-btn{color:#9ca3af;cursor:pointer;background:0 0;border:none;align-items:center;gap:4px;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:15px;transition:color .2s;display:flex}.nav-dropdown-btn:hover{color:#f3f4f6}.dropdown-arrow{font-size:10px}.nav-dropdown-menu{z-index:200;background:#252540;border:1px solid #4b4b6c;border-radius:8px;min-width:160px;margin-top:8px;padding:6px 0;display:none;position:absolute;top:100%;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #0000004d}.nav-dropdown.is-open .nav-dropdown-menu{display:block}.nav-dropdown-menu a:focus{color:#f3f4f6;background:#2d2d4d;outline:none}.nav-dropdown-menu a{color:#9ca3af;padding:8px 16px;font-size:14px;text-decoration:none;transition:all .15s;display:block}.nav-dropdown-menu a:hover{color:#f3f4f6;background:#2d2d4d}.github-link{background:#252540;border-radius:8px;align-items:center;gap:8px;padding:8px 16px;transition:background .2s;display:flex;color:#f3f4f6!important}.github-link:hover{background:#2d2d4d}.hero{text-align:center;max-width:1200px;margin:80px auto;padding:0 40px}.logo-container{justify-content:center;margin-bottom:40px;display:flex}#hero-logo{opacity:0;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent}@media (prefers-reduced-motion:reduce){#hero-logo{opacity:1}}#hero-logo:focus{outline:none}#hero-logo:focus-visible{outline-offset:6px;border-radius:12px;outline:2px solid #3b82f6}#hero-logo .blue-snake,#hero-logo .orange-snake{transform-origin:100px 100px}h1{background:linear-gradient(135deg,#60a5fa 0%,#3b82f6 50%,#f97316 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:20px;font-size:4rem;font-weight:600}.tagline{color:#9ca3af;margin-bottom:40px;font-size:1.5rem;font-weight:400}.cta-buttons{flex-wrap:wrap;justify-content:center;gap:20px;display:flex}.btn{border-radius:10px;padding:14px 32px;font-size:16px;font-weight:600;text-decoration:none;transition:all .3s;display:inline-block}.btn-primary{color:#fff;background:linear-gradient(135deg,#3b82f6,#1d4ed8)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 20px #3b82f666}.btn-secondary{color:#f3f4f6;background:#252540;border:1px solid #3b3b5c}.btn-secondary:hover{background:#2d2d4d;border-color:#4b4b6c}.features{max-width:1200px;margin:120px auto;padding:0 40px}.section-title{text-align:center;color:#f3f4f6;margin-bottom:60px;font-size:2.5rem;font-weight:600}.features-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px;display:grid}.feature-card{background:#252540;border:1px solid #3b3b5c;border-radius:16px;padding:40px;transition:all .3s}.feature-card:hover{border-color:#3b82f6;transform:translateY(-4px);box-shadow:0 8px 24px #3b82f626}.feature-icon{margin-bottom:20px;font-size:2.5rem}.feature-card h3{color:#f3f4f6;margin-bottom:12px;font-size:1.4rem}.feature-card p{color:#9ca3af;line-height:1.6}.code-section{max-width:900px;margin:120px auto;padding:0 40px}.code-container{background:#0a0a14;border:1px solid #2d2d4d;border-radius:12px;margin-top:30px;padding:30px}.code-header{gap:8px;margin-bottom:20px;display:flex}.code-dot{border-radius:50%;width:12px;height:12px}.dot-red{background:#ef4444}.dot-yellow{background:#f59e0b}.dot-green{background:#10b981}pre{margin:0;overflow-x:auto}code{color:#e5e7eb;font-family:SF Mono,Monaco,Cascadia Code,Courier New,monospace;font-size:14px;line-height:1.6}.code-comment{color:#6b7280}.code-keyword{color:#c084fc}.code-string{color:#fbbf24}.code-function{color:#60a5fa}.code-number{color:#fb923c}footer{text-align:center;color:#6b7280;border-top:1px solid #2d2d4d;max-width:1200px;margin:120px auto 40px;padding:40px 40px 20px}footer a{color:#3b82f6;text-decoration:none}footer a:hover{text-decoration:underline}@media (width<=768px){header{flex-wrap:wrap;gap:16px;padding:16px 20px}nav{flex-wrap:wrap;justify-content:center;gap:16px}nav a:not(.github-link){font-size:14px}.github-link{padding:6px 12px;font-size:14px}h1{font-size:2.5rem}.tagline{font-size:1.2rem}.hero{margin:40px auto;padding:0 20px}.features{margin:60px auto;padding:0 20px}.features-grid{grid-template-columns:1fr}.code-section{margin:60px auto;padding:0 20px}.code-container{padding:20px}pre code{font-size:12px}footer{margin:60px auto 30px;padding:30px 20px 15px}}@media (width<=480px){header{padding:12px 16px}nav{gap:12px}.logo-header span{font-size:20px}h1{font-size:2rem}.tagline{font-size:1rem}.hero,.features{padding:0 16px}.section-title{font-size:1.75rem}.feature-card{padding:24px}.code-section{padding:0 16px}.code-container{border-radius:0;margin-left:-16px;margin-right:-16px;padding:16px}footer{padding:24px 16px 15px}}
