.landing-root{min-height:100vh;background-color:var(--wb-surface);color:var(--wb-on-surface);overflow-x:hidden;-webkit-user-select:none;-moz-user-select:none;user-select:none}.landing-nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(1.5rem,5vw,5rem);height:60px;background:var(--wb-glass-bg);backdrop-filter:var(--wb-glass-blur);-webkit-backdrop-filter:var(--wb-glass-blur);border-bottom:1px solid var(--wb-ghost-border)}.nav-logo{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--font-manrope,"Manrope",sans-serif);font-weight:800;font-size:1.0625rem;color:var(--wb-on-surface);text-decoration:none;letter-spacing:-.02em}.nav-logo-dot{width:8px;height:8px;border-radius:9999px;background:var(--wb-gradient-primary);flex-shrink:0}.nav-links{display:none;align-items:center;gap:.25rem}@media (min-width:640px){.nav-links{display:flex}}.nav-link{font-size:.875rem;font-weight:500;color:var(--wb-on-surface-variant);text-decoration:none;padding:.375rem .75rem;border-radius:var(--wb-radius-md);transition:background .15s,color .15s}.nav-link:hover{background:var(--wb-surface-container-low);color:var(--wb-on-surface)}.nav-actions{display:flex;align-items:center;gap:.625rem}.nav-cta{font-size:.875rem;font-weight:600;color:var(--wb-on-primary-solid);text-decoration:none;padding:.5rem 1.125rem;border-radius:var(--wb-radius-md);background:var(--wb-gradient-primary);box-shadow:var(--wb-primary-shadow-sm);transition:opacity .15s,transform .15s}.nav-cta:hover{opacity:.88;transform:translateY(-1px)}.hero-section{position:relative;min-height:100vh;display:grid;grid-template-columns:minmax(auto,520px) 1fr;align-items:center;gap:3rem;padding:9rem clamp(1.5rem,5vw,6rem) 5rem;overflow:hidden}@media (max-width:880px){.hero-section{grid-template-columns:1fr;padding-top:7.5rem;text-align:center}.hero-actions,.hero-social-proof{justify-content:center}.hero-illustration-col{display:none}}.hero-bg-blob{position:absolute;width:700px;height:700px;border-radius:9999px;background:radial-gradient(ellipse,var(--wb-primary-alpha-10) 0,transparent 65%);top:-200px;right:-200px;pointer-events:none}.hero-eyebrow{display:inline-flex;align-items:center;gap:.4rem;font-size:.8rem;font-weight:600;color:var(--wb-primary);letter-spacing:.07em;text-transform:uppercase;margin-bottom:1.25rem;padding:.375rem .875rem;background:var(--wb-primary-alpha-10);border-radius:var(--wb-radius-full);width:-moz-fit-content;width:fit-content;animation:fadeUp .5s ease both}.hero-heading{font-family:var(--font-manrope,"Manrope",sans-serif);font-weight:800;font-size:clamp(2.75rem,6.5vw,5rem);line-height:1.03;letter-spacing:-.035em;color:var(--wb-on-surface);margin:0 0 1.5rem;animation:fadeUp .5s ease .07s both}.hero-heading-gradient{background:var(--wb-gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-tagline{font-size:clamp(1rem,2.2vw,1.1875rem);line-height:1.7;color:var(--wb-on-surface-variant);max-width:44ch;margin:0 0 2.5rem;animation:fadeUp .5s ease .14s both}.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:.875rem;animation:fadeUp .5s ease .21s both}.btn-primary{display:inline-flex;align-items:center;gap:.5rem;font-size:1rem;font-weight:600;color:var(--wb-on-primary-solid);text-decoration:none;padding:.875rem 1.875rem;border-radius:var(--wb-radius-md);background:var(--wb-gradient-primary);box-shadow:var(--wb-primary-shadow-md);transition:transform .2s ease,box-shadow .2s ease}.btn-primary:hover{transform:translateY(-2px);box-shadow:var(--wb-primary-shadow-lg)}.btn-ghost{display:inline-flex;align-items:center;gap:.5rem;font-size:1rem;font-weight:600;color:var(--wb-on-surface-variant);text-decoration:none;padding:.875rem 1.625rem;border-radius:var(--wb-radius-md);background:var(--wb-surface-container-low);transition:background .15s,color .15s,transform .15s}.btn-ghost:hover{background:var(--wb-surface-container);color:var(--wb-on-surface);transform:translateY(-1px)}.hero-social-proof{display:flex;align-items:center;gap:.75rem;margin-top:2.25rem;font-size:.8125rem;color:var(--wb-on-surface-variant);animation:fadeUp .5s ease .28s both}.avatar-stack{display:flex}.avatar-chip{width:26px;height:26px;border-radius:9999px;border:2px solid var(--wb-surface);margin-left:-7px;display:flex;align-items:center;justify-content:center;font-size:.6rem;font-weight:700;color:var(--wb-on-primary-solid)}.avatar-chip:first-child{margin-left:0}.hero-illustration-col{position:relative;display:flex;justify-content:center;align-items:center;animation:fadeIn .8s ease .3s both}.hero-illustration{position:relative;height:500px;max-width:100%;width:100%;border-radius:var(--wb-radius-xl);overflow:hidden;background:var(--wb-surface-container-lowest);box-shadow:var(--wb-shadow-ambient),0 0 0 1px var(--wb-ghost-border)}.canvas-grid{position:absolute;inset:0;width:100%;height:100%}.sketch-note{position:absolute;padding:.625rem .875rem;border-radius:3px;font-size:.8125rem;font-weight:600;box-shadow:0 2px 4px var(--wb-surface-shadow-alpha-14),2px 3px 0 var(--wb-surface-shadow-alpha-05)}.note-orange{top:6%;left:5%;background:var(--wb-tertiary-container);color:var(--wb-on-tertiary-container);transform:rotate(-2.5deg);animation:floatIn .7s ease .4s both}.userflow-group{position:absolute;top:5%;right:8%;animation:floatIn .7s ease .5s both}.frame-label{position:relative;font-size:.75rem;font-weight:700;color:var(--wb-primary);letter-spacing:.04em;margin-bottom:4px}.sketch-frame{position:relative;display:block}.mini-box{position:absolute;width:28px;height:16px;border-radius:3px;border:1.5px solid var(--wb-primary);opacity:.4}.mini-box-1{top:32px;left:20px}.mini-box-2{top:32px;left:80px}.mini-box-3{top:60px;left:50px}.mini-connector{position:absolute;top:28px;left:18px}.mini-connector path{stroke-dasharray:120;stroke-dashoffset:120;animation:drawLine 1s ease .8s forwards}.flow-node{position:absolute;padding:.5rem 1rem;border-radius:var(--wb-radius-md);font-size:.8125rem;font-weight:600;white-space:nowrap;box-shadow:0 2px 4px var(--wb-surface-shadow-alpha-14)}.flow-idea{top:36%;left:6%;background:var(--wb-primary-alpha-20);color:var(--wb-on-primary-container);border:1px solid var(--wb-primary-alpha-30);animation:floatIn .7s ease .6s both}.flow-design{top:46%;left:22%;animation:floatIn .7s ease .75s both}.flow-build,.flow-design{background:var(--wb-surface-container-low);color:var(--wb-on-surface);border:1px solid var(--wb-ghost-border)}.flow-build{top:56%;left:40%;animation:floatIn .7s ease .9s both}.flow-ship{top:66%;left:52%;background:var(--wb-tertiary-container);color:var(--wb-on-tertiary-container);border:none;font-weight:700;animation:floatIn .7s ease 1.05s both}.flow-arrow{position:absolute}.flow-arrow-1{top:39%;left:16%;animation:floatIn .5s ease .65s both}.flow-arrow-2{top:49%;left:34%;animation:floatIn .5s ease .8s both}.flow-arrow-3{top:59%;left:48%;animation:floatIn .5s ease .95s both}.flow-arrow path{stroke-dasharray:60;stroke-dashoffset:60;animation:drawLine .6s ease forwards}.flow-arrow-1 path{animation-delay:.7s}.flow-arrow-2 path{animation-delay:.85s}.flow-arrow-3 path{animation-delay:1s}.sketch-scribble{position:absolute;bottom:10%;left:5%;animation:floatIn .7s ease 1.2s both}.sketch-scribble path{stroke-dasharray:200;stroke-dashoffset:200;animation:drawLine 1.2s ease 1.3s forwards}.note-checklist{bottom:6%;right:5%;left:auto;background:var(--wb-sticky-green-bg);color:var(--wb-sticky-green-text);font-size:.75rem;line-height:1.6;transform:rotate(1.5deg);animation:floatIn .7s ease 1.1s both}.cursor-presence{position:absolute;display:flex;align-items:flex-end;gap:4px}.cursor-a{top:14%;right:12%;animation:floatIn .7s ease 1.3s both,cursorWork 5s ease-in-out 2s infinite}.cursor-b{bottom:22%;right:8%;left:auto;animation:floatIn .7s ease 1.5s both,cursorWork 6s ease-in-out 2.5s infinite}.cursor-dot{width:9px;height:9px;border-radius:9999px;flex-shrink:0}.cursor-label{font-size:.6875rem;font-weight:600;color:var(--wb-on-primary-solid);padding:2px 7px;border-radius:9999px;white-space:nowrap}.glow-blob{position:absolute;border-radius:9999px;filter:blur(60px);pointer-events:none}.glow-primary{width:280px;height:280px;top:-60px;right:-60px;background:var(--wb-primary-alpha-18-container)}.glow-secondary{width:180px;height:180px;bottom:-50px;left:-50px;background:var(--wb-tertiary-alpha-14)}.features-section{padding:6rem clamp(1.5rem,5vw,6rem);background:var(--wb-surface-container-lowest)}.section-label{font-size:.8rem;font-weight:600;color:var(--wb-primary);letter-spacing:.07em;text-transform:uppercase;margin-bottom:.75rem}.section-heading{font-family:var(--font-manrope,"Manrope",sans-serif);font-weight:800;font-size:clamp(1.75rem,4vw,2.875rem);letter-spacing:-.027em;color:var(--wb-on-surface);margin:0 0 .875rem}.section-subheading{font-size:1.0625rem;line-height:1.65;color:var(--wb-on-surface-variant);max-width:52ch;margin:0 0 3.25rem}.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.125rem}@media (max-width:900px){.features-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:560px){.features-grid{grid-template-columns:1fr}}.feature-card{padding:1.75rem;border-radius:var(--wb-radius-lg);background:var(--wb-glass-bg);backdrop-filter:var(--wb-glass-blur);-webkit-backdrop-filter:var(--wb-glass-blur);box-shadow:var(--wb-shadow-ambient);border:1px solid var(--wb-ghost-border);transition:transform .2s ease,box-shadow .2s ease;animation:fadeUp .5s ease both}.feature-card:hover{transform:translateY(-4px);box-shadow:0 20px 48px -8px var(--wb-surface-shadow-alpha-13),0 0 0 1px var(--wb-primary-alpha-18-container)}.feature-icon-wrap{width:42px;height:42px;border-radius:var(--wb-radius-md);background:var(--wb-primary-alpha-12);display:flex;align-items:center;justify-content:center;color:var(--wb-primary);margin-bottom:1.125rem}.feature-title{font-family:var(--font-manrope,"Manrope",sans-serif);font-weight:700;font-size:1rem;color:var(--wb-on-surface);margin:0 0 .5rem}.feature-desc{font-size:.9375rem;line-height:1.62;color:var(--wb-on-surface-variant);margin:0}.tech-section{padding:6rem clamp(1.5rem,5vw,6rem);background:var(--wb-surface)}.tech-content{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:start}@media (max-width:860px){.tech-content{grid-template-columns:1fr;gap:3rem}}.tech-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;margin-top:2rem}.tech-badge{padding:1rem 1.125rem;border-radius:var(--wb-radius-lg);background:var(--wb-surface-container-lowest);box-shadow:var(--wb-shadow-ambient);border:1px solid var(--wb-ghost-border);display:flex;flex-direction:column;gap:.25rem;transition:transform .2s ease}.tech-badge:hover{transform:translateY(-2px)}.tech-badge--accent{background:var(--wb-primary-alpha-07);border-color:var(--wb-primary-alpha-20)}.tech-badge-name{font-family:var(--font-manrope,"Manrope",sans-serif);font-weight:700;font-size:.9375rem;color:var(--wb-on-surface)}.tech-badge-role{font-size:.8125rem;color:var(--wb-on-surface-variant);line-height:1.4}.arch-diagram{padding:1.75rem;border-radius:var(--wb-radius-lg);background:var(--wb-surface-container-lowest);box-shadow:var(--wb-shadow-ambient);border:1px solid var(--wb-ghost-border)}.arch-diagram-title{font-family:var(--font-manrope,"Manrope",sans-serif);font-weight:700;font-size:.9375rem;color:var(--wb-on-surface);margin:0 0 1.25rem}.arch-flow{display:flex;flex-direction:column;gap:.625rem}.arch-row{display:flex;align-items:center;gap:.5rem;font-size:.8125rem;flex-wrap:wrap}.arch-node{padding:.3125rem .75rem;border-radius:var(--wb-radius-md);font-weight:600;white-space:nowrap;font-size:.8125rem}.arch-node--primary{background:var(--wb-primary-alpha-14);color:var(--wb-on-primary-container)}.arch-node--surface{background:var(--wb-surface-container-low);color:var(--wb-on-surface-variant)}.arch-node--accent{background:var(--wb-tertiary-alpha-14);color:var(--wb-tertiary)}.arch-arrow{color:var(--wb-outline-variant);font-size:.875rem;flex-shrink:0}.arch-label{color:var(--wb-on-surface-variant);font-size:.75rem;line-height:1.4}.arch-divider{height:1px;background:var(--wb-ghost-border);margin:.375rem 0}.arch-footer-note{font-size:.75rem;font-weight:600;color:var(--wb-primary)}.cta-section{padding:7rem clamp(1.5rem,5vw,6rem);background:var(--wb-surface-container-lowest);text-align:center;position:relative;overflow:hidden}.cta-bg-glow{position:absolute;width:640px;height:640px;border-radius:9999px;background:radial-gradient(ellipse,var(--wb-primary-alpha-12) 0,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none}.cta-heading{font-family:var(--font-manrope,"Manrope",sans-serif);font-weight:800;font-size:clamp(2.125rem,5vw,3.375rem);letter-spacing:-.028em;color:var(--wb-on-surface);margin:0 0 1rem;position:relative}.cta-sub{font-size:1.0625rem;color:var(--wb-on-surface-variant);margin:0 0 2.5rem;position:relative}.cta-actions{display:flex;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap;position:relative}.btn-github{display:inline-flex;align-items:center;gap:.5rem;font-size:.9375rem;font-weight:600;color:var(--wb-on-surface-variant);text-decoration:none;padding:.875rem 1.5rem;border-radius:var(--wb-radius-md);background:var(--wb-surface-container-low);transition:background .15s,color .15s}.btn-github:hover{background:var(--wb-surface-container);color:var(--wb-on-surface)}.site-footer{padding:1.75rem clamp(1.5rem,5vw,6rem);background:var(--wb-surface);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;border-top:1px solid var(--wb-ghost-border)}.footer-brand{font-family:var(--font-manrope,"Manrope",sans-serif);font-weight:700;font-size:.875rem;color:var(--wb-on-surface-variant)}.footer-links{display:flex;gap:1.5rem;flex-wrap:wrap}.footer-link{font-size:.875rem;color:var(--wb-on-surface-variant);text-decoration:none;transition:color .15s}.footer-link:hover{color:var(--wb-on-surface)}@keyframes fadeUp{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes floatIn{0%{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes cursorWork{0%,to{transform:translate(0)}20%{transform:translate(-6px,3px)}40%{transform:translate(4px,-2px)}60%{transform:translate(-3px,-4px)}80%{transform:translate(5px,2px)}}@keyframes drawLine{to{stroke-dashoffset:0}}@keyframes drawIn{0%{stroke-dashoffset:var(--dash-length);opacity:.3}to{stroke-dashoffset:0;opacity:1}}