*{margin:0;padding:0;box-sizing:border-box}html{scroll-padding-top:110px}:root{--primary: #5b21b6;--primary-dark: #4c1d95;--primary-light: #7c3aed;--primary-pink: #c06cc9;--primary-ultra-light: #e9d5ff;--accent: #06b6d4;--text: #0f172a;--text-muted: #64748b;--text-light: #94a3b8;--bg: #ffffff;--bg-subtle: #f8fafc;--bg-muted: #f1f5f9;--bg-code: #1e293b;--border: #e2e8f0;--border-muted: #cbd5e1;--success: #10b981;--info: #3b82f6;--text-secondary: #475569;--text-gray: #6b7280;--text-gray-dark: #4b5563;--bg-secondary: #f1f5f9;--focus-ring: 0 0 0 3px rgba(124, 58, 237, .3);--focus-ring-accent: 0 0 0 3px rgba(6, 182, 212, .3)}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;color:var(--text);background:var(--bg);line-height:1.6;overflow-x:hidden}.container{max-width:1200px;margin:0 auto;padding:0 24px}header{background:var(--bg);border-bottom:1px solid var(--border);padding:16px 0;position:sticky;top:0;z-index:100;backdrop-filter:blur(10px);background:#fffffff2}header .container{display:flex;justify-content:space-between;align-items:center}.header-content{display:flex;align-items:center;gap:16px;text-decoration:none;color:inherit}.logo-icon{height:64px;width:auto;object-fit:contain}.logo-text{display:flex;flex-direction:column;gap:2px}.logo{font-size:24px;font-weight:700;color:var(--primary);line-height:1;margin:0}.subtitle{color:var(--primary-pink);font-size:15px;font-weight:700;line-height:1}header nav{display:flex;gap:32px}header nav a{color:var(--primary-dark);text-decoration:none;font-weight:700;transition:color .2s}header nav a:hover{color:var(--primary-light)}header nav a:focus{outline:none;box-shadow:var(--focus-ring);border-radius:4px}.github-icon,.slack-icon{display:inline-flex;align-items:center;justify-content:center}.github-icon svg,.slack-icon svg{width:24px;height:24px}.menu-toggle{display:none;background:none;border:none;cursor:pointer;padding:8px;color:var(--primary-dark)}.menu-toggle .close-icon,.menu-toggle[aria-expanded=true] .menu-icon{display:none}.menu-toggle[aria-expanded=true] .close-icon{display:block}.hero{padding:100px 0 80px;text-align:center;background:linear-gradient(135deg,var(--bg-subtle) 0%,var(--bg) 50%,var(--primary-ultra-light) 100%);position:relative}.hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 50%,rgba(124,58,237,.03) 0%,transparent 50%),radial-gradient(circle at 80% 50%,rgba(6,182,212,.03) 0%,transparent 50%);pointer-events:none}.hero .container{position:relative;z-index:1}.hero-logo{display:flex;justify-content:center;margin-bottom:32px;animation:fadeInDown .8s ease-out}.hero-logo img{height:120px;width:auto;object-fit:contain;filter:drop-shadow(0 4px 12px rgba(124,58,237,.2))}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.hero h2{font-size:56px;font-weight:800;margin-bottom:24px;color:var(--primary-dark);line-height:1.2}.hero h2 .trademark{font-size:.7em;vertical-align:super}.hero-subtitle{font-size:20px;color:var(--text-muted);max-width:900px;margin:0 auto 60px}.hero-subtitle strong{color:var(--primary-dark);display:inline-flex;align-items:center;gap:0}.tetrate-logo-inline{height:28px;width:auto;object-fit:contain;vertical-align:middle;margin-left:-5px;transform:translateY(-2px)}.install-section{max-width:700px;margin:0 auto}.install-section h3{font-size:18px;font-weight:600;margin-bottom:16px;color:var(--primary-dark);text-align:left}.install-section .code-block{font-size:17px}.code-block{background:var(--bg-code);color:#e0e0e0;padding:20px 24px;border-radius:12px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:14px;display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;position:relative}.code-block code{flex:1}.code-block pre.shiki{background:none!important;margin:0;padding:0;flex:1;overflow-x:auto}.code-block pre.shiki code{background:none;padding:0;border:none;color:inherit;font-family:inherit;font-size:inherit}.copy-btn{background:#ffffff1a;border:none;color:#e0e0e0;padding:8px 12px;border-radius:6px;cursor:pointer;transition:background .2s}.copy-btn:hover{background:#fff3}.copy-btn:focus{outline:none;background:#ffffff40;box-shadow:0 0 0 2px #ffffff80}.install-note{text-align:left;color:var(--text-muted);font-size:14px;margin-bottom:12px}.features{padding:80px 0;background:var(--bg-subtle)}.feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:32px}.feature-card{background:var(--bg);padding:32px;border-radius:16px;border:1px solid var(--border-muted);position:relative;overflow:hidden;transition:all .3s ease}.feature-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--primary) 0%,var(--accent) 100%);opacity:0;transition:opacity .3s ease}.feature-card:hover{border-color:var(--primary-light);box-shadow:0 4px 20px #7c3aed1a}.feature-card:hover:before{opacity:1}.feature-icon{font-size:32px;margin-bottom:16px;color:var(--primary)}.feature-card h3{font-size:24px;margin-bottom:12px;color:var(--primary-dark)}.feature-card>p{color:var(--text-muted);margin-bottom:20px}.code-example{background:var(--bg-code);color:#e0e0e0;padding:12px 16px;border-radius:8px;font-family:Monaco,Menlo,monospace;font-size:13px;margin-bottom:12px}.code-output{background:var(--bg-subtle);padding:12px 16px;border-radius:8px;font-family:Monaco,Menlo,monospace;font-size:12px;line-height:1.8;color:var(--text)}.output-success{color:var(--success)}.output-info{color:var(--info)}.output-link{color:var(--primary)}.output-muted{color:var(--text-muted);white-space:pre}.extensions{padding:80px 0}.extensions h2{font-size:40px;text-align:center;margin-bottom:12px;color:var(--primary-dark)}.section-subtitle{text-align:center;color:var(--text-muted);margin-bottom:48px;font-size:18px}.extensions-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;margin-bottom:48px}.extension-card{background:var(--bg);border:1px solid var(--border-muted);border-radius:12px;padding:24px;transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column}.extension-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px #7c3aed26,0 4px 12px #06b6d41a;border-color:var(--primary-light)}.extension-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.extension-card h3{font-size:18px;color:var(--primary-dark);font-family:Monaco,Menlo,monospace}.extension-badges{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}.extension-badge{color:#fff;font-size:11px;padding:4px 8px;border-radius:4px;font-weight:600;text-transform:uppercase;background:var(--primary);white-space:nowrap}.extension-badge--security{background:#6d28d9}.extension-badge--examples{background:#cc69db}.extension-badge--performance{background:#a855f7}.extension-badge--ai{background:#c026d3}.extension-badge--authentication{background:#660273}.extension-badge--network{background:#7c3aed}.extension-badge--observability{background:#9333ea}.extension-badge--transform{background:#d946ef}.extension-badge--traffic-control{background:#9106a7}.extension-badge--misc{background:#8b5cf6}.extension-badge--decoder{background:#d835ad}.extension-card>p{color:var(--text-muted);font-size:14px;margin-bottom:16px}.extension-tags{display:flex;flex-wrap:wrap;gap:6px}.extension-tag{background:var(--bg-muted);color:var(--text-muted);font-size:11px;padding:3px 8px;border-radius:4px;font-weight:500}.extension-card-link{text-decoration:none;color:inherit;display:block}.extension-card-link:hover .extension-card{transform:translateY(-4px);box-shadow:0 8px 24px #7c3aed26,0 4px 12px #06b6d41a;border-color:var(--primary-light)}.extension-card-link:focus{outline:none;border-radius:12px}.extension-card-link:focus .extension-card{box-shadow:var(--focus-ring),0 8px 24px #7c3aed26,0 4px 12px #06b6d41a;border-color:var(--primary-light)}.browse-all{text-align:center}.cli-features{padding:80px 0;background:var(--bg-muted)}.cli-features h2{font-size:40px;text-align:center;margin-bottom:48px;color:var(--primary-dark)}.cli-section{display:grid;grid-template-columns:auto 1fr;gap:32px;align-items:center;margin-bottom:32px;background:var(--bg);border:1px solid var(--border-muted);border-radius:16px;padding:32px}.cli-section:last-child{margin-bottom:0}.cli-section-title{font-size:18px;color:var(--primary-dark);font-weight:600;text-align:center;line-height:1.4;margin:0;padding-right:24px;border-right:2px solid var(--primary-light)}.cli-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;justify-items:center}.cli-item{text-align:center}.cli-item h4{font-size:18px;margin-bottom:12px;color:var(--text)}.cli-item code{background:var(--bg-code);color:#e0e0e0;padding:10px 16px;border-radius:8px;font-size:13px;display:inline-block;margin-bottom:8px}.cli-item p{color:var(--text-muted);font-size:14px}.testimonials{padding:60px 0;background:var(--bg-subtle)}.testimonials h2{font-size:36px;text-align:center;margin-bottom:32px;color:var(--primary-dark)}.testimonials-carousel{position:relative;display:flex;align-items:center;gap:12px}.testimonials-track{display:flex;gap:24px;overflow-x:hidden;scroll-snap-type:x mandatory}.testimonial-card{display:flex;gap:12px;align-items:flex-start;padding-left:24px;border-left:1px solid var(--border);min-width:calc((100% - 48px) / 3);max-width:calc((100% - 48px) / 3);scroll-snap-align:start;flex-shrink:0}.testimonial-card:first-child,.testimonial-card:nth-child(3n+1){padding-left:0;border-left:none}.carousel-arrow{display:flex;align-items:center;justify-content:center;width:36px;height:36px;min-width:36px;border-radius:50%;border:1px solid var(--primary-dark);background:var(--bg-white);color:var(--primary-dark);cursor:pointer;transition:all .2s;z-index:1}.carousel-arrow:hover{background:var(--primary-ultra-light);border-color:var(--primary-light)}.carousel-arrow.hidden{opacity:0;pointer-events:none}.carousel-arrow svg{width:18px;height:18px}.testimonial-quote{margin-bottom:6px;color:var(--text-gray);font-size:15px;line-height:1.6;font-style:italic}.quote-icon{width:24px;height:24px;min-width:24px;color:var(--primary-ultra-light);margin-top:2px}.testimonial-author{display:flex;flex-direction:column;align-items:flex-start;gap:2px}.author-name{font-weight:600;color:var(--primary-dark);font-size:14px}.author-role{color:var(--text-muted);font-size:12px}.cta{padding:80px 0;text-align:center;background:linear-gradient(135deg,var(--primary-ultra-light) 0%,var(--bg-subtle) 100%);position:relative}.cta:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,rgba(124,58,237,.05) 0%,transparent 70%);pointer-events:none}.cta .container{position:relative;z-index:1}.cta h2{font-size:40px;margin-bottom:32px;color:var(--primary-dark)}.cta-buttons{display:flex;gap:16px;justify-content:center}.btn-primary,.btn-secondary{padding:16px 32px;border-radius:8px;text-decoration:none;font-weight:600;font-size:16px;transition:all .2s;display:inline-block}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:0 8px 20px #7c3aed4d}.btn-secondary{background:transparent;color:var(--primary);border:2px solid var(--primary)}.btn-secondary:hover{background:var(--primary);color:#fff}.btn-primary:focus,.btn-secondary:focus{outline:none;box-shadow:var(--focus-ring)}.btn-primary:focus{box-shadow:var(--focus-ring),0 8px 20px #7c3aed4d}footer{background:var(--bg-code);color:#e0e0e0;padding:48px 0 24px}.footer-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:32px;margin-bottom:32px}.footer-section h4{color:#fff;margin-bottom:12px;font-size:16px}.footer-section p{color:#e0e0e0;font-size:14px}.footer-built-by{display:flex;align-items:center;gap:8px}.tetrate-logo{height:20px;width:auto;object-fit:contain;vertical-align:middle;transform:translateY(-2px)}.footer-section a{color:#e0e0e0;text-decoration:none;display:block;margin-bottom:8px;font-size:14px;transition:color .2s}.footer-section a:hover{color:#a78bfa}.footer-section a:focus{outline:none;box-shadow:var(--focus-ring-accent);border-radius:4px;color:#a78bfa}.external-link{display:inline-flex;align-items:center;gap:6px}.external-link-icon:empty{display:none}.external-arrow{display:inline-block;width:10px;height:10px;opacity:.7;vertical-align:middle}.external-link:hover .external-arrow{opacity:1}.social-links{display:flex;gap:20px;margin-top:12px;align-items:center}.social-icon{display:inline-flex;align-items:center;color:#e0e0e0;transition:all .2s;margin-bottom:0}.social-icon:hover{color:var(--accent);transform:translateY(-2px)}.social-icon:focus{outline:none;box-shadow:var(--focus-ring-accent);border-radius:4px;color:var(--accent)}.social-icon svg{width:24px;height:24px}.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:24px;text-align:center}.footer-bottom p{color:#e0e0e0;font-size:14px}@media(max-width:1024px){.feature-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.extensions-grid,.cli-grid{grid-template-columns:repeat(2,1fr)}.cli-grid .cli-item:nth-child(5),.cli-grid .cli-item:nth-child(6){grid-column:auto}}@media(max-width:768px){.logo-icon{height:44px}.logo{font-size:20px}.subtitle{font-size:12px}.menu-toggle{display:flex;align-items:center;justify-content:center}header .container{position:relative}header nav{display:none;position:absolute;top:100%;left:0;right:0;background:#fffffffa;backdrop-filter:blur(10px);flex-direction:column;gap:0;padding:8px 0;border-top:1px solid var(--border);box-shadow:0 4px 12px #0000001a;z-index:100}header nav.open{display:flex}header nav a{padding:12px 24px;font-size:16px;border-bottom:1px solid var(--border)}header nav a:last-child{border-bottom:none}header nav .github-icon,header nav .slack-icon{padding:12px 24px;justify-content:flex-start}.hero{padding:60px 0 48px}.hero-logo img{height:80px}.hero h2{font-size:32px}.hero-subtitle{font-size:16px;margin-bottom:36px}.tetrate-logo-inline{height:22px}.install-section .code-block{font-size:14px}.code-block{padding:16px;font-size:13px}.code-block code{overflow-x:auto;word-break:break-all}.features{padding:48px 0}.feature-grid,.extensions-grid,.cli-grid{grid-template-columns:1fr}.cli-features{padding:48px 0}.cli-features h2{font-size:32px;margin-bottom:32px}.cli-section{grid-template-columns:1fr;padding:24px;gap:20px}.cli-section-title{border-right:none;padding-right:0;padding-bottom:16px;border-bottom:2px solid var(--primary-light)}.extensions{padding:48px 0}.extensions h2{font-size:32px}.section-subtitle{margin-bottom:32px}.testimonials{padding:36px 0}.testimonials h2{font-size:28px;margin-bottom:24px}.testimonials-carousel{gap:8px}.testimonials-track{flex-direction:column;overflow-x:visible;scroll-snap-type:none}.testimonial-card{min-width:100%;max-width:100%;padding-left:0;border-left:none;padding-top:24px;border-top:1px solid var(--border)}.testimonial-card:first-child,.testimonial-card:nth-child(3n+1){padding-top:0;border-top:none}.testimonial-card:nth-child(n+2){padding-top:24px;border-top:1px solid var(--border)}.testimonial-card:first-child{padding-top:0;border-top:none}.carousel-arrow{display:none}.cta{padding:48px 0}.cta h2{font-size:28px;margin-bottom:24px}.cta-buttons{flex-direction:column;align-items:center}.footer-content{grid-template-columns:1fr}}
