*{box-sizing:border-box;margin:0;padding:0}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:#fff;--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 #7c3aed4d;--focus-ring-accent:0 0 0 3px #06b6d44d}body{color:var(--text);background:var(--bg);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;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);z-index:100;backdrop-filter:blur(10px);background:#fffffff2;padding:16px 0;position:sticky;top:0}header .container{justify-content:space-between;align-items:center;display:flex}.header-content{color:inherit;align-items:center;gap:16px;text-decoration:none;display:flex}.logo-icon{object-fit:contain;width:auto;height:64px}.logo-text{flex-direction:column;gap:2px;display:flex}.logo{color:var(--primary);margin:0;font-size:24px;font-weight:700;line-height:1}.subtitle{color:var(--primary-pink);font-size:15px;font-weight:700;line-height:1}header nav{gap:32px;display:flex}header nav a{color:var(--primary-dark);font-weight:700;text-decoration:none;transition:color .2s}header nav a:hover{color:var(--primary-light)}header nav a:focus{box-shadow:var(--focus-ring);border-radius:4px;outline:none}.github-icon,.slack-icon{justify-content:center;align-items:center;display:inline-flex}.github-icon svg,.slack-icon svg{width:24px;height:24px}.menu-toggle{cursor:pointer;color:var(--primary-dark);background:0 0;border:none;padding:8px;display:none}.menu-toggle .close-icon,.menu-toggle[aria-expanded=true] .menu-icon{display:none}.menu-toggle[aria-expanded=true] .close-icon{display:block}.hero{text-align:center;background:linear-gradient(135deg, var(--bg-subtle) 0%, var(--bg) 50%, var(--primary-ultra-light) 100%);padding:100px 0 80px;position:relative}.hero:before{content:"";pointer-events:none;background:radial-gradient(circle at 20%,#7c3aed08 0%,#0000 50%),radial-gradient(circle at 80%,#06b6d408 0%,#0000 50%);position:absolute;inset:0}.hero .container{z-index:1;position:relative}.hero-logo{justify-content:center;margin-bottom:32px;animation:.8s ease-out fadeInDown;display:flex}.hero-logo img{object-fit:contain;filter:drop-shadow(0 4px 12px #7c3aed33);width:auto;height:120px}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.hero h2{color:var(--primary-dark);margin-bottom:24px;font-size:56px;font-weight:800;line-height:1.2}.hero h2 .trademark{vertical-align:super;font-size:.7em}.hero-subtitle{color:var(--text-muted);max-width:900px;margin:0 auto 60px;font-size:20px}.hero-subtitle strong{color:var(--primary-dark);align-items:center;gap:0;display:inline-flex}.tetrate-logo-inline{object-fit:contain;vertical-align:middle;width:auto;height:28px;margin-left:-5px;transform:translateY(-2px)}.install-section{max-width:700px;margin:0 auto}.install-section h3{color:var(--primary-dark);text-align:left;margin-bottom:16px;font-size:18px;font-weight:600}.install-section .code-block{font-size:17px}.code-block{background:var(--bg-code);color:#e0e0e0;border-radius:12px;justify-content:space-between;align-items:center;margin-bottom:16px;padding:20px 24px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:14px;display:flex;position:relative}.code-block code{flex:1}.code-block pre.shiki{flex:1;margin:0;padding:0;overflow-x:auto;background:0 0!important}.code-block pre.shiki code{color:inherit;font-family:inherit;font-size:inherit;background:0 0;border:none;padding:0}.copy-btn{color:#e0e0e0;cursor:pointer;background:#ffffff1a;border:none;border-radius:6px;padding:8px 12px;transition:background .2s}.copy-btn:hover{background:#fff3}.copy-btn:focus{background:#ffffff40;outline:none;box-shadow:0 0 0 2px #ffffff80}.install-note{text-align:left;color:var(--text-muted);margin-bottom:12px;font-size:14px}.features{background:var(--bg-subtle);padding:80px 0}.feature-grid{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:32px;display:grid}.feature-card{background:var(--bg);border:1px solid var(--border-muted);border-radius:16px;padding:32px;transition:all .3s;position:relative;overflow:hidden}.feature-card:before{content:"";background:linear-gradient(90deg, var(--primary) 0%, var(--accent) 100%);opacity:0;height:3px;transition:opacity .3s;position:absolute;top:0;left:0;right:0}.feature-card:hover{border-color:var(--primary-light);box-shadow:0 4px 20px #7c3aed1a}.feature-card:hover:before{opacity:1}.feature-icon{color:var(--primary);margin-bottom:16px;font-size:32px}.feature-card h3{color:var(--primary-dark);margin-bottom:12px;font-size:24px}.feature-card>p{color:var(--text-muted);margin-bottom:20px}.code-example{background:var(--bg-code);color:#e0e0e0;border-radius:8px;margin-bottom:12px;padding:12px 16px;font-family:Monaco,Menlo,monospace;font-size:13px}.code-output{background:var(--bg-subtle);color:var(--text);border-radius:8px;padding:12px 16px;font-family:Monaco,Menlo,monospace;font-size:12px;line-height:1.8}.output-success{color:var(--success)}.output-info{color:var(--info)}.output-link{color:var(--primary)}.output-muted{color:var(--text-muted);white-space:pre}.video-showcase{background:var(--bg-subtle);padding:80px 0}.video-showcase h2{text-align:center;color:var(--primary-dark);margin-bottom:12px;font-size:40px}.video-carousel{align-items:center;gap:16px;max-width:900px;margin:0 auto;display:flex}.video-carousel-viewport{border-radius:16px;flex:1;overflow:hidden}.video-carousel-track{transition:transform .4s;display:flex}.video-carousel-slide{flex:0 0 100%}.video-carousel-header{text-align:center;box-sizing:border-box;max-width:900px;margin:0 auto 20px;padding:0 52px}.video-slide-title{color:var(--primary-dark);margin-bottom:8px;font-size:20px;font-weight:600}.video-caption{color:var(--text-muted);margin:0;font-size:16px}.video-carousel-dots{justify-content:center;gap:8px;margin-top:20px;display:flex}.video-carousel-dot{background:var(--border-muted);cursor:pointer;border:none;border-radius:50%;width:10px;height:10px;padding:0;transition:background .2s}.video-carousel-dot.active{background:var(--primary-dark)}.video-wrapper{border-radius:16px;height:0;padding-bottom:56.25%;position:relative;overflow:hidden;box-shadow:0 8px 30px #7c3aed26}.video-wrapper iframe,.video-wrapper video{width:100%;height:100%;position:absolute;top:0;left:0}.extensions{padding:80px 0}.extensions h2{text-align:center;color:var(--primary-dark);margin-bottom:12px;font-size:40px}.section-subtitle{text-align:center;color:var(--text-muted);margin-bottom:48px;font-size:18px}.extensions-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;margin-bottom:48px;display:grid}.extension-card{background:var(--bg);border:1px solid var(--border-muted);border-radius:12px;flex-direction:column;padding:24px;transition:transform .2s,box-shadow .2s;display:flex;position:relative}.extension-card:hover{border-color:var(--primary-light);transform:translateY(-4px);box-shadow:0 8px 24px #7c3aed26,0 4px 12px #06b6d41a}.extension-header{justify-content:space-between;align-items:flex-start;margin-bottom:12px;display:flex}.extension-card h3{color:var(--primary-dark);font-family:Monaco,Menlo,monospace;font-size:18px}.extension-parent{color:var(--text-light);margin-top:2px;font-family:Monaco,Menlo,monospace;font-size:12px;display:block}.extension-card-primary-link{color:inherit;text-decoration:none}.extension-card-primary-link:after{content:"";z-index:1;border-radius:12px;position:absolute;inset:0}.extension-parent-link{z-index:2;color:var(--text-light);width:fit-content;text-decoration:none;position:relative}.extension-parent-link:hover{color:var(--primary);text-decoration:underline}.extension-card:has(.extension-card-primary-link:focus-visible){box-shadow:var(--focus-ring), 0 8px 24px #7c3aed26, 0 4px 12px #06b6d41a;border-color:var(--primary-light)}.extension-badges{flex-wrap:wrap;justify-content:flex-end;gap:4px;display:flex}.extension-badge{color:#fff;text-transform:uppercase;background:var(--primary);white-space:nowrap;border-radius:4px;padding:4px 8px;font-size:11px;font-weight:600}.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:#975185}.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);margin-bottom:16px;font-size:14px}.extension-tags{flex-wrap:wrap;gap:6px;display:flex}.extension-tag{background:var(--bg-muted);color:var(--text-muted);border-radius:4px;padding:3px 8px;font-size:11px;font-weight:500}.browse-all{text-align:center}.cli-features{background:var(--bg-muted);padding:80px 0}.cli-features h2{text-align:center;color:var(--primary-dark);margin-bottom:48px;font-size:40px}.cli-section{background:var(--bg);border:1px solid var(--border-muted);border-radius:16px;grid-template-columns:auto 1fr;align-items:center;gap:32px;margin-bottom:32px;padding:32px;display:grid}.cli-section:last-child{margin-bottom:0}.cli-section-title{color:var(--primary-dark);text-align:center;border-right:2px solid var(--primary-light);margin:0;padding-right:24px;font-size:18px;font-weight:600;line-height:1.4}.cli-grid{grid-template-columns:repeat(3,1fr);justify-items:center;gap:32px;display:grid}.cli-item{text-align:center}.cli-item h4{color:var(--text);margin-bottom:12px;font-size:18px}.cli-item code{background:var(--bg-code);color:#e0e0e0;border-radius:8px;margin-bottom:8px;padding:10px 16px;font-size:13px;display:inline-block}.cli-item p{color:var(--text-muted);font-size:14px}.testimonials{background:var(--bg-subtle);padding:60px 0}.testimonials h2{text-align:center;color:var(--primary-dark);margin-bottom:32px;font-size:36px}.testimonials-carousel{align-items:center;gap:12px;display:flex;position:relative}.testimonials-track{scroll-snap-type:x mandatory;gap:24px;display:flex;overflow-x:hidden}.testimonial-card{border-left:1px solid var(--border);scroll-snap-align:start;flex-shrink:0;align-items:flex-start;gap:12px;min-width:calc(33.3333% - 16px);max-width:calc(33.3333% - 16px);padding-left:24px;display:flex}.testimonial-card:first-child,.testimonial-card:nth-child(3n+1){border-left:none;padding-left:0}.carousel-arrow{border:1px solid var(--primary-dark);background:var(--bg-white);width:36px;min-width:36px;height:36px;color:var(--primary-dark);cursor:pointer;z-index:1;border-radius:50%;justify-content:center;align-items:center;transition:all .2s;display:flex}.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{color:var(--text-gray);margin-bottom:6px;font-size:15px;font-style:italic;line-height:1.6}.quote-icon{width:24px;min-width:24px;height:24px;color:var(--primary-ultra-light);margin-top:2px}.testimonial-author{flex-direction:column;align-items:flex-start;gap:2px;display:flex}.author-name{color:var(--primary-dark);font-size:14px;font-weight:600}.author-role{color:var(--text-muted);font-size:12px}.cta{text-align:center;background:linear-gradient(135deg, var(--primary-ultra-light) 0%, var(--bg-subtle) 100%);padding:80px 0;position:relative}.cta:before{content:"";pointer-events:none;background:radial-gradient(circle,#7c3aed0d 0%,#0000 70%);position:absolute;inset:0}.cta .container{z-index:1;position:relative}.cta h2{color:var(--primary-dark);margin-bottom:32px;font-size:40px}.cta-buttons{justify-content:center;gap:16px;display:flex}.btn-primary,.btn-secondary{border-radius:8px;padding:16px 32px;font-size:16px;font-weight:600;text-decoration:none;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{color:var(--primary);border:2px solid var(--primary);background:0 0}.btn-secondary:hover{background:var(--primary);color:#fff}.btn-primary:focus,.btn-secondary:focus{box-shadow:var(--focus-ring);outline:none}.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{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:32px;margin-bottom:32px;display:grid}.footer-section h4{color:#fff;margin-bottom:12px;font-size:16px}.footer-section p{color:#e0e0e0;font-size:14px}.footer-built-by{align-items:center;gap:8px;display:flex}.tetrate-logo{object-fit:contain;vertical-align:middle;width:auto;height:20px;transform:translateY(-2px)}.footer-section a{color:#e0e0e0;margin-bottom:8px;font-size:14px;text-decoration:none;transition:color .2s;display:block}.footer-section a:hover{color:#a78bfa}.footer-section a:focus{box-shadow:var(--focus-ring-accent);color:#a78bfa;border-radius:4px;outline:none}.external-link{align-items:center;gap:6px;display:inline-flex}.external-link-icon:empty{display:none}.external-arrow{opacity:.7;vertical-align:middle;width:10px;height:10px;display:inline-block}.external-link:hover .external-arrow{opacity:1}.social-links{align-items:center;gap:20px;margin-top:12px;display:flex}.social-icon{color:#e0e0e0;align-items:center;margin-bottom:0;transition:all .2s;display:inline-flex}.social-icon:hover{color:var(--accent);transform:translateY(-2px)}.social-icon:focus{box-shadow:var(--focus-ring-accent);color:var(--accent);border-radius:4px;outline:none}.social-icon svg{width:24px;height:24px}.footer-bottom{text-align:center;border-top:1px solid #ffffff1a;padding-top:24px}.footer-bottom p{color:#e0e0e0;font-size:14px}@media (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 (width<=768px){.logo-icon{height:44px}.logo{font-size:20px}.subtitle{font-size:12px}.menu-toggle{justify-content:center;align-items:center;display:flex}header .container{position:relative}header nav{backdrop-filter:blur(10px);border-top:1px solid var(--border);z-index:100;background:#fffffffa;flex-direction:column;gap:0;padding:8px 0;display:none;position:absolute;top:100%;left:0;right:0;box-shadow:0 4px 12px #0000001a}header nav.open{display:flex}header nav a{border-bottom:1px solid var(--border);padding:12px 24px;font-size:16px}header nav a:last-child{border-bottom:none}header nav .github-icon,header nav .slack-icon{justify-content:flex-start;padding:12px 24px}.hero{padding:60px 0 48px}.hero-logo img{height:80px}.hero h2{font-size:32px}.hero-subtitle{margin-bottom:36px;font-size:16px}.tetrate-logo-inline{height:22px}.install-section .code-block{font-size:14px}.code-block{padding:16px;font-size:13px}.code-block code{word-break:break-all;overflow-x:auto}.features{padding:48px 0}.feature-grid,.extensions-grid,.cli-grid{grid-template-columns:1fr}.cli-features{padding:48px 0}.cli-features h2{margin-bottom:32px;font-size:32px}.cli-section{grid-template-columns:1fr;gap:20px;padding:24px}.cli-section-title{border-right:none;border-bottom:2px solid var(--primary-light);padding-bottom:16px;padding-right:0}.video-showcase{padding:48px 0}.video-showcase h2{font-size:32px}.extensions{padding:48px 0}.extensions h2{font-size:32px}.section-subtitle{margin-bottom:32px}.testimonials{padding:36px 0}.testimonials h2{margin-bottom:24px;font-size:28px}.testimonials-carousel{gap:8px}.testimonials-track{scroll-snap-type:none;flex-direction:column;overflow-x:visible}.testimonial-card{border-left:none;border-top:1px solid var(--border);min-width:100%;max-width:100%;padding-top:24px;padding-left:0}.testimonial-card:first-child,.testimonial-card:nth-child(3n+1){border-top:none;padding-top:0}.testimonial-card:nth-child(n+2){border-top:1px solid var(--border);padding-top:24px}.testimonial-card:first-child{border-top:none;padding-top:0}.carousel-arrow{display:none}.cta{padding:48px 0}.cta h2{margin-bottom:24px;font-size:28px}.cta-buttons{flex-direction:column;align-items:center}.footer-content{grid-template-columns:1fr}}