.landing{background:var(--bg-body);min-height:100dvh;color:var(--text-primary);overflow:hidden auto}.landing-nav{padding:var(--space-xl) var(--space-3xl);justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto;display:flex}.landing-nav-brand{font-family:var(--font-display);background:var(--brand-gradient);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.5rem;font-weight:800;text-decoration:none}.landing-nav-links{align-items:center;gap:var(--space-2xl);display:flex}.landing-nav-links a{color:var(--text-secondary);transition:color var(--transition-normal);font-size:.88rem;font-weight:500;text-decoration:none}.landing-nav-links a:hover{color:var(--text-primary);text-decoration:none}.landing-cta-sm{padding:var(--space-sm) var(--space-xl);border-radius:var(--radius-full);background:var(--brand-primary);transition:background var(--transition-normal), transform var(--transition-normal);box-shadow:var(--shadow-sm);color:var(--text-on-brand)!important;font-size:.85rem!important;font-weight:600!important;text-decoration:none!important}.landing-cta-sm:hover{background:var(--brand-primary-hover);transform:translateY(-1px)}@media (max-width:768px){.landing-nav{padding:var(--space-lg)}.landing-nav-links a:not(.landing-cta-sm){display:none}}.hero{max-width:1200px;padding:80px var(--space-3xl) 60px;grid-template-columns:1fr 1fr;align-items:center;gap:60px;margin:0 auto;display:grid}.hero-text h1{font-family:var(--font-display);letter-spacing:-.03em;margin-bottom:var(--space-xl);font-size:clamp(2.2rem,4.5vw,3.4rem);font-weight:800;line-height:1.08}.hero-text h1 .highlight{background:var(--brand-gradient);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.hero-text .subtitle{color:var(--text-secondary);margin-bottom:var(--space-3xl);max-width:460px;font-size:1.1rem;line-height:1.7}.hero-actions{align-items:center;gap:var(--space-lg);flex-wrap:wrap;display:flex}.btn-hero{border-radius:var(--radius-full);transition:all var(--transition-smooth);align-items:center;gap:var(--space-sm);padding:14px 32px;font-size:.95rem;font-weight:600;text-decoration:none;display:inline-flex}.btn-hero-primary{background:var(--brand-primary);color:var(--text-on-brand);border:none;box-shadow:0 4px 16px #5b5fe640}.btn-hero-primary:hover{background:var(--brand-primary-hover);text-decoration:none;transform:translateY(-2px);box-shadow:0 6px 24px #5b5fe64d}.btn-hero-secondary{color:var(--text-primary);border:1.5px solid var(--border-color-strong);background:0 0}.btn-hero-secondary:hover{border-color:var(--brand-primary);color:var(--brand-primary);text-decoration:none}.hero-code{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);overflow:hidden}.hero-code-header{padding:var(--space-md) var(--space-xl);border-bottom:1px solid var(--border-color);background:var(--bg-input);justify-content:space-between;align-items:center;display:flex}.hero-code-dots{gap:6px;display:flex}.hero-code-dots span{border-radius:50%;width:10px;height:10px}.hero-code-dots span:first-child{background:#ef4444}.hero-code-dots span:nth-child(2){background:#f59e0b}.hero-code-dots span:nth-child(3){background:#22c55e}.hero-code-lang{font-size:.72rem;font-family:var(--font-mono);color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.06em;font-weight:600}.hero-code-body{padding:var(--space-xl);font-family:var(--font-mono);color:var(--text-primary);min-height:380px;font-size:.78rem;line-height:1.75;overflow-x:auto}.hero-cursor{color:var(--brand-primary);font-weight:300;transition:opacity 80ms}.hero-code-controls{align-items:center;gap:var(--space-sm);display:flex}.lang-selector{position:relative}.lang-selector-trigger{align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-md);border-radius:var(--radius-sm);border:1px solid var(--border-color);color:var(--text-secondary);font-family:var(--font-mono);cursor:pointer;text-transform:uppercase;letter-spacing:.04em;transition:all var(--transition-fast);background:0 0;font-size:.72rem;font-weight:600;display:flex}.lang-selector-trigger:hover{border-color:var(--brand-primary);color:var(--brand-primary)}.lang-dropdown{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);z-index:100;min-width:120px;animation:.12s fadeIn;position:absolute;top:calc(100% + 4px);right:0;overflow:hidden}.lang-option{width:100%;padding:var(--space-sm) var(--space-lg);color:var(--text-secondary);font-family:var(--font-mono);text-align:left;cursor:pointer;transition:background var(--transition-fast);background:0 0;border:none;font-size:.78rem;font-weight:500;display:block}.lang-option:hover{background:var(--brand-primary-soft);color:var(--text-primary)}.lang-option.active{color:var(--brand-primary);background:var(--brand-primary-soft);font-weight:700}.hero-copy-btn{align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-md);border-radius:var(--radius-sm);border:1px solid var(--border-color);color:var(--text-tertiary);cursor:pointer;transition:all var(--transition-fast);background:0 0;font-size:.72rem;font-weight:600;display:flex}.hero-copy-btn:hover{border-color:var(--brand-primary);color:var(--brand-primary)}.hero-code .kw{color:var(--brand-primary)}.hero-code .str{color:var(--accent-green)}[data-theme=dark] .hero-code .str{color:#4ade80}.hero-code .cm{color:var(--text-tertiary)}.hero-code .fn{color:var(--accent-blue)}@media (max-width:900px){.hero{padding:40px var(--space-xl) 40px;grid-template-columns:1fr;gap:40px}.hero-text .subtitle{max-width:100%}}.compat-row{max-width:1200px;padding:0 var(--space-3xl) 60px;align-items:center;gap:var(--space-2xl);flex-wrap:wrap;margin:0 auto;display:flex}.compat-badge{align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-full);background:var(--bg-card);border:1px solid var(--border-color);color:var(--text-secondary);font-size:.78rem;font-weight:600;display:inline-flex}.compat-badge svg{flex-shrink:0}@media (max-width:768px){.compat-row{padding:0 var(--space-xl) 40px;gap:var(--space-md)}}.endpoints{max-width:1200px;padding:80px var(--space-3xl);margin:0 auto}.section-label{text-transform:uppercase;letter-spacing:.12em;color:var(--brand-primary);margin-bottom:var(--space-md);font-size:.72rem;font-weight:700}.endpoints h2{font-family:var(--font-display);letter-spacing:-.02em;margin-bottom:var(--space-lg);font-size:clamp(1.6rem,3vw,2.2rem);font-weight:700;line-height:1.15}.endpoints>p{color:var(--text-secondary);max-width:520px;margin-bottom:var(--space-4xl);font-size:1rem;line-height:1.65}.endpoint-grid{gap:var(--space-lg);grid-template-columns:repeat(auto-fill,minmax(220px,1fr));display:grid}.endpoint-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:var(--space-2xl);transition:all var(--transition-smooth);position:relative;overflow:hidden}.endpoint-card:before{content:"";background:var(--brand-gradient);opacity:0;height:3px;transition:opacity var(--transition-normal);position:absolute;top:0;left:0;right:0}.endpoint-card:hover{border-color:var(--brand-primary);box-shadow:var(--shadow-md);transform:translateY(-3px)}.endpoint-card:hover:before{opacity:1}.endpoint-icon{border-radius:var(--radius-md);background:var(--brand-primary-soft);width:44px;height:44px;color:var(--brand-primary);margin-bottom:var(--space-lg);justify-content:center;align-items:center;display:flex}.endpoint-card h3{margin-bottom:var(--space-sm);font-size:1.05rem;font-weight:700}.endpoint-card p{color:var(--text-tertiary);font-size:.82rem;line-height:1.55}.endpoint-tag{margin-top:var(--space-md);border-radius:var(--radius-full);font-family:var(--font-mono);background:var(--brand-primary-light);color:var(--brand-primary);padding:3px 10px;font-size:.7rem;font-weight:600;display:inline-block}@media (max-width:768px){.endpoints{padding:60px var(--space-xl)}.endpoint-grid{grid-template-columns:1fr}}.how-section{background:var(--bg-card);border-top:1px solid var(--border-color);border-bottom:1px solid var(--border-color)}.how-inner{max-width:1200px;padding:80px var(--space-3xl);margin:0 auto}.how-inner h2{font-family:var(--font-display);letter-spacing:-.02em;margin-bottom:var(--space-4xl);font-size:clamp(1.6rem,3vw,2.2rem);font-weight:700;line-height:1.15}.how-steps{gap:var(--space-3xl);counter-reset:step;grid-template-columns:repeat(3,1fr);display:grid}.how-step{counter-increment:step;position:relative}.how-step:before{content:counter(step, decimal-leading-zero);font-family:var(--font-display);color:var(--brand-primary);opacity:.15;margin-bottom:var(--space-lg);font-size:3rem;font-weight:800;line-height:1;display:block}.how-step h3{margin-bottom:var(--space-sm);font-size:1.05rem;font-weight:700}.how-step p{color:var(--text-secondary);font-size:.88rem;line-height:1.65}.how-step code{margin-top:var(--space-md);background:var(--bg-input);border-radius:var(--radius-sm);font-family:var(--font-mono);color:var(--brand-primary);border:1px solid var(--border-color);padding:4px 12px;font-size:.78rem;display:inline-block}@media (max-width:768px){.how-inner{padding:60px var(--space-xl)}.how-steps{gap:var(--space-2xl);grid-template-columns:1fr}}.wonka-section{max-width:1200px;padding:80px var(--space-3xl);margin:0 auto}.wonka-grid{grid-template-columns:1fr 1fr;align-items:center;gap:60px;display:grid}.wonka-text h2{font-family:var(--font-display);letter-spacing:-.02em;margin-bottom:var(--space-xl);font-size:clamp(1.6rem,3vw,2.2rem);font-weight:700;line-height:1.15}.wonka-text p{color:var(--text-secondary);margin-bottom:var(--space-lg);font-size:1rem;line-height:1.7}.wonka-pipeline{flex-direction:column;gap:0;display:flex}.pipeline-step{align-items:center;gap:var(--space-lg);padding:var(--space-lg) var(--space-xl);background:var(--bg-card);border:1px solid var(--border-color);display:flex;position:relative}.pipeline-step:first-child{border-radius:var(--radius-md) var(--radius-md) 0 0}.pipeline-step:last-child{border-radius:0 0 var(--radius-md) var(--radius-md)}.pipeline-step:not(:last-child){border-bottom:none}.pipeline-step-num{background:var(--brand-primary-light);width:28px;height:28px;color:var(--brand-primary);font-family:var(--font-mono);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:.72rem;font-weight:700;display:flex}.pipeline-step span{font-size:.88rem;font-weight:500}@media (max-width:768px){.wonka-section{padding:60px var(--space-xl)}.wonka-grid{gap:var(--space-3xl);grid-template-columns:1fr}}.cta-section{max-width:1200px;padding:60px var(--space-3xl) 80px;margin:0 auto}.cta-box{background:var(--brand-gradient);border-radius:var(--radius-xl);text-align:center;padding:60px;position:relative;overflow:hidden}.cta-box:before{content:"";pointer-events:none;background:radial-gradient(at 30% 0,#ffffff1f 0%,#0000 60%);position:absolute;inset:0}.cta-box h2{font-family:var(--font-display);color:#fff;margin-bottom:var(--space-lg);letter-spacing:-.02em;font-size:clamp(1.6rem,3vw,2.2rem);font-weight:700;position:relative}.cta-box p{color:#fffc;margin-bottom:var(--space-3xl);max-width:440px;margin-left:auto;margin-right:auto;font-size:1rem;line-height:1.6;position:relative}.cta-actions{justify-content:center;gap:var(--space-lg);flex-wrap:wrap;display:flex;position:relative}.btn-cta-white{border-radius:var(--radius-full);color:#5b5fe6;transition:all var(--transition-smooth);background:#fff;border:none;padding:14px 36px;font-size:.95rem;font-weight:700;text-decoration:none;box-shadow:0 4px 16px #0000001f}.btn-cta-white:hover{text-decoration:none;transform:translateY(-2px);box-shadow:0 6px 24px #0000002e}.btn-cta-outline{border-radius:var(--radius-full);color:#fff;transition:all var(--transition-smooth);background:0 0;border:1.5px solid #ffffff59;padding:14px 36px;font-size:.95rem;font-weight:600;text-decoration:none}.btn-cta-outline:hover{background:#ffffff1a;border-color:#fff;text-decoration:none}@media (max-width:768px){.cta-section{padding:40px var(--space-xl) 60px}.cta-box{padding:40px var(--space-xl)}}.landing-footer{border-top:1px solid var(--border-color);padding:var(--space-3xl);text-align:center}.landing-footer p{color:var(--text-tertiary);font-size:.78rem;line-height:1.7}.landing-footer a{color:var(--brand-primary);font-weight:500;text-decoration:none}.landing-footer a:hover{text-decoration:underline}@keyframes fadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
