@keyframes lp-slide-up{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes lp-note-fall{0%{transform:translateY(0)}to{transform:translateY(460px)}}@keyframes lp-key-hit{0%,10%{background:var(--hit);box-shadow:0 0 14px var(--hit)}14%,to{background:var(--key-bg);box-shadow:none}}@keyframes lp-key-hit-long{0%,17%{background:var(--hit);box-shadow:0 0 14px var(--hit)}21%,to{background:var(--key-bg);box-shadow:none}}.landing-page{flex:1 1;overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth}.landing-section{max-width:1120px;margin:0 auto;padding:112px var(--space-lg)}.lp-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);height:56px;padding:0 var(--space-xl);border:none;border-radius:var(--radius-md);font-family:var(--font-display);font-size:1.0625rem;font-weight:600;text-decoration:none;white-space:nowrap;cursor:pointer;box-sizing:border-box;transition:background var(--transition-smooth),border-color var(--transition-smooth),color var(--transition-smooth),transform var(--transition-smooth),box-shadow var(--transition-smooth)}.lp-btn--primary{background:var(--accent-primary);color:#ffffff}.lp-btn--primary:hover{background:var(--accent-primary-dark);transform:translateY(-2px);box-shadow:0 8px 24px rgba(37,99,235,.35)}.lp-btn--primary .lp-btn-arrow{transition:transform var(--transition-smooth)}.lp-btn--primary:hover .lp-btn-arrow{transform:translateX(3px)}.lp-btn--secondary{background:transparent;border:1px solid var(--border-color);color:var(--text-primary)}.lp-btn--secondary:hover{background:var(--accent-subtle);border-color:var(--accent-primary);color:var(--accent-primary-light);transform:translateY(-2px)}.lp-btn--sm{height:48px;font-size:1rem;padding:0 var(--space-lg);width:100%}.hero-section{min-height:calc(100vh - 80px);display:flex;align-items:center;padding:64px var(--space-lg) 88px;position:relative;overflow:hidden}.hero-section:before{content:"";position:absolute;top:-30%;right:-10%;width:640px;height:640px;background:radial-gradient(circle,rgba(59,130,246,.14) 0,transparent 65%);pointer-events:none}.hero-inner{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:center;grid-gap:72px;gap:72px;width:100%;position:relative;z-index:1}.hero-content{animation:lp-slide-up .7s ease-out both}.hero-overline{margin-bottom:var(--space-lg)}.hero-title{font-family:var(--font-display);font-size:clamp(2.25rem,4.5vw,3.25rem);font-weight:700;color:var(--text-primary);margin:0 0 var(--space-lg) 0;line-height:1.25;letter-spacing:-.02em}.hero-title-accent{background:linear-gradient(120deg,var(--accent-primary-light),var(--accent-secondary));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:var(--accent-primary-light)}.hero-tagline{font-size:1.125rem;color:var(--text-secondary);margin:0 0 var(--space-xl) 0;line-height:1.8;max-width:30em}.hero-cta{display:flex;flex-direction:row;align-items:center;gap:var(--space-md);margin-bottom:var(--space-xl)}.hero-points{display:flex;flex-wrap:wrap;gap:var(--space-sm) var(--space-lg);list-style:none;padding:0;margin:0}.hero-point{display:inline-flex;align-items:center;gap:6px;font-size:.9375rem;color:var(--text-muted)}.hero-point svg{color:var(--accent-secondary);flex-shrink:0}.hero-preview{border:1px solid var(--border-color);border-radius:var(--radius-lg);background:linear-gradient(180deg,#14141c,#0e0e15);box-shadow:0 24px 64px rgba(0,0,0,.5),inset 0 0 0 1px rgba(255,255,255,.02);overflow:hidden;animation:lp-slide-up .7s ease-out .15s both}.preview-chrome{display:flex;align-items:center;gap:6px;padding:12px 16px;border-bottom:1px solid var(--border-subtle);background:rgba(255,255,255,.02)}.preview-dot{width:9px;height:9px;border-radius:50%;background:var(--border-color)}.preview-filename{margin-left:var(--space-sm);font-family:var(--font-mono);font-size:.75rem;color:var(--text-muted);letter-spacing:.04em}.preview-stage{position:relative;height:320px;overflow:hidden;background:linear-gradient(180deg,transparent 60%,rgba(59,130,246,.05)),repeating-linear-gradient(90deg,transparent 0 calc(100% / 14 - 1px),rgba(255,255,255,.025) calc(100% / 14 - 1px) calc(100% / 14))}.preview-note{position:absolute;top:-140px;border-radius:5px;animation:lp-note-fall 6s linear infinite}.preview-note--white{width:6.25%}.preview-note--black{width:4.1%;z-index:1}.preview-hitline{height:6px;background:rgba(59,130,246,.4)}.preview-hitline,.preview-hitline:after{position:absolute;bottom:0;left:0;right:0}.preview-hitline:after{content:"";height:2px;background:rgba(59,130,246,.9)}.preview-keyboard{position:relative;display:flex;height:88px;background:#0a0a10;padding-top:2px}.preview-key,.preview-key--black{background:var(--key-bg);border-radius:0 0 3px 3px;animation-duration:6s;animation-timing-function:linear;animation-iteration-count:infinite}.preview-key{--key-bg:#e8e8e8;flex:1 1;margin:0 .5px}.preview-key--black{--key-bg:var(--bg-elevated);position:absolute;top:2px;width:4.1%;height:58%;z-index:1}.features-grid{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:var(--space-lg);gap:var(--space-lg)}.feature-card{display:flex;gap:var(--space-lg);align-items:flex-start;background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:var(--space-xl);transition:border-color var(--transition-smooth),transform var(--transition-smooth)}.feature-card:hover{border-color:var(--border-color);transform:translateY(-3px)}.feature-icon{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;flex-shrink:0;border-radius:var(--radius-md);background:var(--accent-subtle);color:var(--accent-primary-light)}.feature-body h3{font-family:var(--font-display);font-size:1.125rem;font-weight:600;color:var(--text-primary);margin:0 0 var(--space-sm) 0;line-height:1.4}.feature-body p{font-size:.9375rem;color:var(--text-secondary);margin:0;line-height:1.75}.howto-patterns{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:var(--space-lg);gap:var(--space-lg);align-items:stretch}.howto-pattern{display:flex;flex-direction:column;background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:var(--space-xl)}.howto-pattern--recommended{border-color:rgba(59,130,246,.35);background:linear-gradient(180deg,rgba(59,130,246,.06) 0,var(--bg-surface) 45%)}.howto-pattern-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);margin-bottom:var(--space-xl)}.howto-pattern-head h3{font-family:var(--font-display);font-size:1.25rem;font-weight:700;color:var(--text-primary);margin:0;line-height:1.4}.howto-badge{flex-shrink:0;font-family:var(--font-mono);font-size:.6875rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-secondary);border:1px solid rgba(34,211,238,.4);border-radius:var(--radius-full);padding:4px 12px}.howto-steps{counter-reset:step;list-style:none;padding:0;margin:0 0 var(--space-xl) 0;flex:1 1}.howto-step{position:relative;padding-left:44px;padding-bottom:var(--space-lg)}.howto-step:after{content:"";position:absolute;left:13px;top:30px;bottom:2px;width:2px;background:var(--border-subtle)}.howto-step:last-child{padding-bottom:0}.howto-step:last-child:after{display:none}.howto-step:before{counter-increment:step;content:counter(step);position:absolute;left:0;top:0;width:28px;height:28px;background:var(--accent-subtle);border:1px solid rgba(59,130,246,.4);border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:.8125rem;font-weight:700;color:var(--accent-primary-light)}.howto-step h4{font-family:var(--font-display);font-size:1rem;font-weight:600;color:var(--text-primary);margin:0 0 var(--space-xs) 0;line-height:28px}.howto-step p{font-size:.9375rem;color:var(--text-secondary);margin:0;line-height:1.75}.faq-section{display:grid;grid-template-columns:280px minmax(0,1fr);grid-gap:var(--space-2xl);gap:var(--space-2xl);align-items:start}.faq-section .section-head{margin-bottom:0;position:-webkit-sticky;position:sticky;top:var(--space-xl)}.faq-list{margin:0;border-top:1px solid var(--border-color)}.faq-item{border-bottom:1px solid var(--border-color)}.faq-question{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-lg) 0;margin:0;font-family:var(--font-display);font-size:1.0625rem;font-weight:600;color:var(--text-primary);line-height:1.5;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;transition:color .2s ease}.faq-question:hover{color:var(--accent-primary-light)}.faq-question-text{flex:1 1}.faq-toggle{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;flex-shrink:0;border:1px solid var(--border-color);border-radius:var(--radius-full);color:var(--text-secondary);font-size:1.125rem;font-weight:400;line-height:1;transition:all .25s ease}.faq-item--open .faq-toggle{border-color:var(--accent-primary);color:var(--accent-primary-light);transform:rotate(180deg)}.faq-answer{display:grid;grid-template-rows:0fr;margin:0;transition:grid-template-rows .3s ease}.faq-answer-inner{overflow:hidden;min-height:0;font-size:.9375rem;color:var(--text-secondary);line-height:1.8}.faq-item--open .faq-answer{grid-template-rows:1fr}.faq-item--open .faq-answer-inner{padding-bottom:var(--space-lg)}.cta-section{text-align:center;position:relative;padding-bottom:140px}.cta-section:before{content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:min(720px,90%);height:240px;background:radial-gradient(ellipse at center bottom,rgba(59,130,246,.16) 0,transparent 70%);pointer-events:none}.cta-section h2{font-family:var(--font-display);font-size:clamp(1.625rem,3vw,2.25rem);font-weight:700;color:var(--text-primary);margin:0 0 var(--space-xl) 0;letter-spacing:-.01em}.cta-buttons{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--space-md);position:relative;z-index:1}.cta-keys{position:absolute;left:0;right:0;bottom:0;height:48px;background:repeating-linear-gradient(90deg,rgba(255,255,255,.07) 0 44px,transparent 44px 46px);-webkit-mask-image:linear-gradient(90deg,transparent,#000 20%,#000 80%,transparent);mask-image:linear-gradient(90deg,transparent,#000 20%,#000 80%,transparent);pointer-events:none}@media (max-width:980px){.hero-section{min-height:auto;padding:48px var(--space-lg) 72px}.hero-inner{grid-template-columns:1fr;gap:var(--space-2xl)}.hero-preview{max-width:560px}.preview-keyboard{height:68px}.faq-section{grid-template-columns:1fr;gap:var(--space-xl)}.faq-section .section-head{position:static}}@media (max-width:768px){.landing-section{padding:72px var(--space-md)}.hero-section{padding:40px var(--space-md) 64px}.hero-tagline{font-size:1.0625rem}.hero-cta{flex-direction:column;align-items:stretch}.hero-cta .lp-btn{width:100%}.features-grid{grid-template-columns:1fr;gap:var(--space-md)}.feature-card{padding:var(--space-lg)}.howto-patterns{grid-template-columns:1fr;gap:var(--space-md)}.howto-pattern{padding:var(--space-lg)}.faq-question{font-size:1rem}.cta-buttons{flex-direction:column}.cta-buttons .lp-btn{width:100%;max-width:320px}.cta-section{padding-bottom:120px}}@media (prefers-reduced-motion:reduce){.hero-content,.hero-preview{animation:none}.preview-note{animation-play-state:paused;transform:translateY(300px)}.preview-key,.preview-key--black{animation:none}}