@font-face{font-family:Inter;font-style:normal;font-weight:400 800;font-display:swap;src:url('../fonts/inter-variable.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Kalam;font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/kalam-400.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--font-sans:'Inter','Inter Fallback',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;--font-hand:'Kalam',cursive;--c-slate-50:#f8fafc;--c-slate-100:#f1f5f9;--c-slate-200:#e2e8f0;--c-slate-300:#cbd5e1;--c-slate-400:#94a3b8;--c-slate-500:#64748b;--c-slate-600:#475569;--c-slate-700:#334155;--c-slate-800:#1e293b;--c-slate-900:#0f172a;--c-slate-950:#020617;--c-blue-200:#bfdbfe;--c-blue-300:#93c5fd;--c-blue-400:#60a5fa;--c-blue-500:#3b82f6;--c-blue-600:#2563eb;--c-blue-700:#1d4ed8;--c-blue-800:#1e40af;--c-yellow-50:rgba(254, 252, 232, 0.5);--c-yellow-100:#fef9c3;--c-yellow-200:#fef08a;--c-yellow-300:#fde047;--c-yellow-400:#facc15;--c-yellow-500:#eab308;--c-yellow-600:#ca8a04;--c-yellow-700:#a16207;--c-yellow-800:#854d0e;--c-yellow-900:#713f12;--color-bg:#ffffff;--color-bg-secondary:var(--c-slate-50);--color-bg-tertiary:var(--c-slate-100);--color-text:var(--c-slate-900);--color-text-secondary:var(--c-slate-600);--color-text-muted:var(--c-slate-500);--color-border:var(--c-slate-200);--color-border-light:var(--c-slate-100);--navbar-bg:rgba(255, 255, 255, 0.95);--navbar-bg-scrolled:rgba(255, 255, 255, 0.98);--card-bg:#ffffff;--card-border:var(--c-slate-100);--shadow-sm:0 1px 2px 0 rgb(0 0 0 / 0.05);--shadow-md:0 4px 6px -1px rgb(0 0 0 / 0.1);--shadow-lg:0 10px 15px -3px rgb(0 0 0 / 0.1);--shadow-xl:0 20px 25px -5px rgb(0 0 0 / 0.1);--shadow-2xl:0 25px 50px -12px rgb(0 0 0 / 0.25);--shadow-yellow-lg:0 4px 12px rgba(234, 179, 8, 0.4);--radius-sm:0.25rem;--radius-md:0.375rem;--radius-lg:0.5rem;--radius-xl:0.75rem;--radius-2xl:1rem;--radius-full:9999px;--transition:0.2s ease}[data-theme=dark]{--color-bg:var(--c-slate-950);--color-bg-secondary:var(--c-slate-900);--color-bg-tertiary:var(--c-slate-800);--color-text:var(--c-slate-100);--color-text-secondary:var(--c-slate-300);--color-text-muted:var(--c-slate-400);--color-border:var(--c-slate-700);--color-border-light:var(--c-slate-800);--navbar-bg:rgba(2, 6, 23, 0.95);--navbar-bg-scrolled:rgba(2, 6, 23, 0.98);--card-bg:var(--c-slate-900);--card-border:var(--c-slate-800);--shadow-sm:0 1px 2px 0 rgb(0 0 0 / 0.3);--shadow-md:0 4px 6px -1px rgb(0 0 0 / 0.4);--shadow-lg:0 10px 15px -3px rgb(0 0 0 / 0.4);--shadow-xl:0 20px 25px -5px rgb(0 0 0 / 0.4);--shadow-2xl:0 25px 50px -12px rgb(0 0 0 / 0.5)}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--color-bg:var(--c-slate-950);--color-bg-secondary:var(--c-slate-900);--color-bg-tertiary:var(--c-slate-800);--color-text:var(--c-slate-100);--color-text-secondary:var(--c-slate-300);--color-text-muted:var(--c-slate-400);--color-border:var(--c-slate-700);--color-border-light:var(--c-slate-800);--navbar-bg:rgba(2, 6, 23, 0.95);--navbar-bg-scrolled:rgba(2, 6, 23, 0.98);--card-bg:var(--c-slate-900);--card-border:var(--c-slate-800);--shadow-sm:0 1px 2px 0 rgb(0 0 0 / 0.3);--shadow-md:0 4px 6px -1px rgb(0 0 0 / 0.4);--shadow-lg:0 10px 15px -3px rgb(0 0 0 / 0.4);--shadow-xl:0 20px 25px -5px rgb(0 0 0 / 0.4);--shadow-2xl:0 25px 50px -12px rgb(0 0 0 / 0.5)}:root:not([data-theme=light]) .text-subtle{color:var(--c-slate-400)}}.skip-link{position:absolute;top:-40px;left:0;padding:8px 16px;background:var(--c-yellow-400);color:var(--c-slate-900);font-weight:600;z-index:100;text-decoration:none;border-radius:var(--radius-md)}.skip-link:focus{top:8px;left:8px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}:focus-visible{outline:2px solid var(--c-blue-500);outline-offset:2px}.btn:focus-visible{outline:2px solid var(--c-blue-500);outline-offset:2px;box-shadow:0 0 0 4px rgba(59,130,246,.3)}.nav-link:focus-visible{outline:2px solid var(--c-blue-500);outline-offset:4px;border-radius:var(--radius-sm)}@font-face{font-family:'Inter Fallback';src:local('BlinkMacSystemFont'),local('Segoe UI'),local('Roboto'),local('Helvetica Neue'),local('Arial');ascent-override:90%;descent-override:22%;line-gap-override:0%;size-adjust:107%}*,::after,::before{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,::after,::before{animation-duration:0s!important;animation-iteration-count:1!important;transition-duration:0s!important}}body{font-family:var(--font-sans);color:var(--color-text);background-color:var(--color-bg);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transition:background-color .3s,color .3s}::selection{background-color:var(--c-yellow-200)}a{text-decoration:none;color:inherit}a[target="_blank"]:not(.btn)::after{content:"";display:inline-block;width:.75rem;height:.75rem;margin-left:.25rem;background-color:currentColor;mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' y1='14' x2='21' y2='3'/%3E%3C/svg%3E");mask-repeat:no-repeat;mask-size:contain;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' y1='14' x2='21' y2='3'/%3E%3C/svg%3E");-webkit-mask-repeat:no-repeat;-webkit-mask-size:contain;vertical-align:middle;opacity:.6}button{border:none;background:0 0;cursor:pointer;font-family:inherit}img{max-width:100%;height:auto}.container{width:100%;max-width:1280px;margin:0 auto;padding:0 1.5rem}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-8{gap:2rem}.hidden{display:none!important}.relative{position:relative}.text-center{text-align:center}.w-full{width:100%}.mb-8{margin-bottom:2rem}.mr-4{margin-right:1rem}.p-2{padding:.5rem}.opacity-50{opacity:.5}.text-lg{font-size:1.125rem}.h1-hero{font-size:3rem;line-height:1.1;font-weight:800;letter-spacing:-.025em;margin-bottom:1.5rem}@media (min-width:1024px){.h1-hero{font-size:3.75rem}}.h2-title{font-size:1.875rem;font-weight:700;margin-bottom:1rem}@media (min-width:768px){.h2-title{font-size:2.25rem}}.text-subtle{color:var(--c-slate-600)}[data-theme=dark] .text-subtle{color:var(--c-slate-400)}.text-body{color:var(--color-text-secondary)}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.75rem 1.5rem;border-radius:var(--radius-lg);font-weight:600;transition:all var(--transition)}.btn-primary{background-color:var(--c-slate-900);color:#fff;box-shadow:var(--shadow-lg)}.btn-primary:hover{background-color:var(--c-slate-800);transform:translateY(-2px);box-shadow:var(--shadow-xl)}.btn-secondary{background-color:var(--c-slate-100);color:var(--c-slate-700)}.btn-secondary:hover{background-color:var(--c-slate-200)}.btn-cta{background-color:var(--c-yellow-400);color:var(--c-slate-900);font-size:1.25rem;padding:1.25rem 2.5rem;border-radius:var(--radius-xl);box-shadow:0 0 20px rgba(250,204,21,.3)}.btn-cta:hover{background-color:var(--c-yellow-300);transform:translateY(-2px)}.btn-lg{padding:1rem 2rem;font-size:1.125rem}.btn-block{display:flex;width:100%}.navbar{position:fixed;top:0;width:100%;z-index:50;padding:1.5rem 0;transition:.3s;background-color:var(--navbar-bg);backdrop-filter:blur(12px)}.navbar.scrolled{background-color:var(--navbar-bg-scrolled);box-shadow:var(--shadow-md);padding:1rem 0}.nav-logo-box{background-color:var(--c-yellow-400);padding:.375rem;border-radius:var(--radius-lg);border:2px solid var(--c-slate-900);box-shadow:2px 2px 0 0 var(--c-slate-900);display:flex;align-items:center;justify-content:center}.logo-text{font-weight:700;font-size:1.25rem;letter-spacing:-.025em;line-height:1.5}.nav-link{color:var(--color-text-secondary);font-weight:500;transition:color var(--transition);min-height:24px;display:inline-flex;align-items:center}.nav-link:hover{color:var(--color-text)}.theme-toggle{display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border-radius:var(--radius-lg);background:var(--color-bg-tertiary);color:var(--color-text-secondary);transition:all var(--transition);border:1px solid var(--color-border-light)}.theme-toggle:hover{background:var(--color-border);color:var(--color-text)}.theme-toggle:focus-visible{outline:2px solid var(--c-blue-500);outline-offset:2px;outline:2px solid var(--c-blue-500);outline-offset:2px;box-shadow:0 0 0 4px rgba(59,130,246,.3)}.theme-toggle svg{width:1.25rem;height:1.25rem}.theme-toggle .icon-sun{display:none}.theme-toggle .icon-moon,[data-theme=dark] .theme-toggle .icon-sun{display:block}[data-theme=dark] .theme-toggle .icon-moon{display:none}.mobile-menu-btn{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:10px}.mobile-theme-toggle{display:flex;min-width:44px;min-height:44px}.desktop-menu{display:none;min-height:44px;align-items:center}@media (min-width:768px){.mobile-menu-btn,.mobile-theme-toggle{display:none}.desktop-menu{display:flex}.mobile-dropdown{display:none!important}}.mobile-dropdown{position:absolute;top:100%;left:0;width:100%;background:var(--color-bg);border-bottom:1px solid var(--color-border-light);padding:1.5rem;box-shadow:var(--shadow-xl);flex-direction:column;gap:1rem}.card{padding:2rem;background:var(--color-bg-secondary);border:1px solid var(--color-border-light);border-radius:var(--radius-2xl);transition:.3s}.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-xl)}.card--accent-blue:hover{border-color:var(--c-blue-200)}.card--accent-slate:hover{border-color:var(--c-slate-300)}.card--accent-yellow:hover{border-color:var(--c-yellow-400)}[data-theme=dark] .card--accent-blue:hover{border-color:var(--c-blue-800)}[data-theme=dark] .card--accent-slate:hover{border-color:var(--c-slate-600)}[data-theme=dark] .card--accent-yellow:hover{border-color:var(--c-yellow-600)}.card-icon{display:flex;align-items:center;justify-content:center;width:3rem;height:3rem;margin-bottom:1.5rem;background:var(--color-bg-tertiary);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);transition:transform .3s;border:1px solid var(--color-border-light)}.card:hover .card-icon{transform:scale(1.1)}.card-icon svg{width:1.5rem;height:1.5rem}.card-icon--blue{color:var(--c-blue-500)}.card-icon--slate{color:var(--c-slate-500)}.card-icon--yellow{background:var(--c-yellow-100);color:var(--c-yellow-700)}[data-theme=dark] .card-icon--yellow{background:var(--c-yellow-900);color:var(--c-yellow-300)}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .theme-toggle .icon-sun{display:block}:root:not([data-theme=light]) .theme-toggle .icon-moon{display:none}:root:not([data-theme=light]) .card--accent-blue:hover{border-color:var(--c-blue-800)}:root:not([data-theme=light]) .card--accent-slate:hover{border-color:var(--c-slate-600)}:root:not([data-theme=light]) .card--accent-yellow:hover{border-color:var(--c-yellow-600)}:root:not([data-theme=light]) .card-icon--yellow{background:var(--c-yellow-900);color:var(--c-yellow-300)}}.card-icon span{font-size:1rem;font-weight:700}.card h3{font-size:1.25rem;font-weight:700;margin-bottom:.75rem;color:var(--color-text)}.card p{color:var(--color-text-secondary);line-height:1.5}.card .btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.5rem;font-weight:600}.card .btn+.btn{margin-top:.5rem}.card .btn-secondary{background-color:var(--c-slate-100);color:var(--c-slate-700);border:1px solid var(--color-border-light)}.card .btn-secondary:hover{background-color:var(--c-slate-200)}[data-theme=dark] .card .btn-secondary{background-color:var(--c-slate-700);color:var(--c-slate-100);border-color:var(--c-slate-600)}[data-theme=dark] .card .btn-secondary:hover{background-color:var(--c-slate-600)}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .card .btn-secondary{background-color:var(--c-slate-700);color:var(--c-slate-100);border-color:var(--c-slate-600)}:root:not([data-theme=light]) .card .btn-secondary:hover{background-color:var(--c-slate-600)}:root:not([data-theme=light]) .text-highlight{color:var(--c-yellow-400)}}.footer{background:var(--color-bg-secondary);padding:3rem 0;border-top:1px solid var(--color-border)}.footer-grid{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:3rem;margin-bottom:3rem}@media (max-width:768px){.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:span 2}}@media (max-width:480px){.footer-grid{grid-template-columns:1fr}.footer-brand{grid-column:span 1}}.footer-brand p{color:var(--color-text-muted);font-size:.875rem;margin-top:1rem;max-width:220px}.footer-links h3{color:var(--color-text);font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;margin-bottom:1rem;font-weight:600}.footer-links a{display:block;padding:.25rem 0;color:var(--color-text-muted);font-size:.875rem;transition:color var(--transition)}.footer-links a:hover{color:var(--color-text)}.hero-section{padding-top:10rem;padding-bottom:6rem;overflow:hidden;position:relative;background-color:var(--color-bg)}.hero-bg-shape{position:absolute;top:0;right:0;width:50%;height:100%;background-color:var(--c-yellow-50);border-bottom-left-radius:100px;z-index:-1}.hero-grid{display:grid;gap:3rem}@media (min-width:1024px){.hero-grid{grid-template-columns:1fr 1fr;align-items:center}}.hero-content{max-width:36rem}.hero-buttons{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem}@media (min-width:640px){.hero-buttons{flex-direction:row;flex-wrap:wrap;align-items:center}}.hero-glow{position:absolute;width:18rem;height:18rem;border-radius:50%;filter:blur(40px);z-index:-1}.hero-glow-blue{top:-2.5rem;right:-2.5rem;background:rgba(96,165,250,.1)}.hero-glow-yellow{bottom:-2.5rem;left:-2.5rem;background:rgba(250,204,21,.1)}.text-highlight{position:relative;display:inline-block;color:var(--c-yellow-800)}[data-theme=dark] .text-highlight{color:var(--c-yellow-400)}.highlight-svg{position:absolute;width:100%;height:.75rem;bottom:-.25rem;left:0;color:var(--c-yellow-300);z-index:-1}.browser-window{background:var(--card-bg);border-radius:var(--radius-2xl);box-shadow:var(--shadow-2xl);border:1px solid var(--color-border);overflow:hidden;transform:rotate(1deg);transition:transform .5s,background-color .3s}.browser-window:hover{transform:rotate(0)}.browser-header{background:var(--color-bg-secondary);border-bottom:1px solid var(--color-border);padding:.75rem;display:flex;align-items:center;gap:.75rem}.dot{width:.75rem;height:.75rem;border-radius:50%}.dot-r{background:#f87171}.dot-y{background:#facc15}.dot-g{background:#4ade80}.browser-title{font-size:.75rem;color:#64748b;font-family:monospace}.url-bar{background:var(--color-bg);padding:.375rem 1rem;border-radius:var(--radius-md);font-size:.75rem;color:var(--color-text-muted);flex:1;text-align:center;border:1px solid var(--color-border-light)}.browser-content{padding:2rem;background:rgba(248,250,252,.5);min-height:400px;position:relative}.skeleton-hero{height:8rem;background:#4f46e5;border-radius:var(--radius-xl);margin-bottom:1.5rem;display:flex;align-items:center;justify-content:center;color:#e0e7ff;font-weight:500}.grid-split{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;position:relative}.skeleton-line{height:1rem;background:var(--c-slate-200);border-radius:var(--radius-sm);margin-bottom:.75rem}.skeleton-line.w-50{width:50%}.skeleton-line.w-66{width:66%}.skeleton-line.w-75{width:75%}.skeleton-line.w-100{width:100%}.skeleton-box{height:5rem;background:var(--c-slate-100);border-radius:var(--radius-lg)}.static-note-real{position:absolute;top:9rem;left:1rem;width:12rem;background:linear-gradient(180deg,#fef3c7 0,#fde68a 50%,#fcd34d 100%);border-radius:var(--radius-lg);box-shadow:0 4px 20px rgba(0,0,0,.15),0 0 0 1px rgba(217,119,6,.1);transform:rotate(-1deg);overflow:hidden;animation:.5s ease-out notePop;font-size:.75rem;z-index:10}.note-toolbar{display:flex;justify-content:space-between;align-items:center;padding:.375rem .5rem;background:rgba(251,191,36,.3);border-bottom:1px solid rgba(217,119,6,.15);color:#92400e}.note-toolbar-left,.note-toolbar-right{display:flex;align-items:center;gap:.375rem}.note-toolbar svg{opacity:.6;cursor:pointer}.note-editor-toolbar{display:flex;align-items:center;gap:.25rem;padding:.375rem .5rem;background:rgba(255,255,255,.5);border-bottom:1px solid rgba(217,119,6,.1)}.editor-btn{display:flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;border-radius:.25rem;color:#78350f;font-size:.7rem;cursor:pointer}.editor-btn:hover{background:rgba(217,119,6,.1)}svg.editor-btn{width:1rem;height:1rem;padding:.125rem}.toolbar-divider{width:1px;height:1rem;background:rgba(217,119,6,.2);margin:0 .25rem}.note-content{padding:.5rem;min-height:3rem}.note-text{font-family:var(--font-sans);color:#78350f;font-size:.75rem}.note-comments-toggle{display:flex;align-items:center;gap:.375rem;padding:.375rem .5rem;border-top:1px solid rgba(217,119,6,.1);color:#92400e;font-size:.625rem;cursor:pointer}.note-comments-toggle .chevron{margin-left:auto}.note-footer{padding:.25rem .5rem;border-top:1px solid rgba(217,119,6,.1);color:#92400e;font-size:.625rem;opacity:.7}.section-dark{background-color:var(--c-slate-900);color:#fff;padding:5rem 0;overflow:hidden}[data-theme=dark] .section-dark{background-color:var(--c-slate-800)}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .section-dark{background-color:var(--c-slate-800)}:root:not([data-theme=light]) .comparison-table .highlight-col{background:rgba(250,204,21,.12);color:var(--c-yellow-200)}:root:not([data-theme=light]) .comparison-table th.highlight-col{background:var(--c-yellow-600);color:var(--c-slate-900)}}.demo-header{text-align:center;margin-bottom:4rem}.demo-subtitle{max-width:42rem;margin:0 auto;color:#94a3b8}.demo-container{max-width:56rem;margin:0 auto;background:var(--c-slate-950);border-radius:var(--radius-xl);border:1px solid var(--c-slate-800);padding:.5rem;box-shadow:var(--shadow-2xl)}.demo-toolbar{background:var(--c-slate-900);padding:.75rem;border-top-left-radius:var(--radius-lg);border-top-right-radius:var(--radius-lg);border-bottom:1px solid var(--c-slate-800);margin-bottom:1rem;display:flex;justify-content:space-between;align-items:center}.btn-demo-toggle{padding:.5rem 1rem;border-radius:var(--radius-lg);font-size:.875rem;font-weight:700;display:flex;align-items:center;gap:.5rem;transition:all var(--transition);background:var(--c-slate-800);color:var(--c-slate-300)}.btn-demo-toggle:hover{background:var(--c-slate-700)}.btn-demo-toggle.active{background:var(--c-blue-600);color:#fff;box-shadow:0 0 15px rgba(37,99,235,.5)}.btn-demo-toggle:focus-visible{outline:2px solid var(--c-yellow-400);outline-offset:2px;box-shadow:0 0 0 4px rgba(250,204,21,.3)}.demo-canvas{padding:2rem;display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;position:relative;min-height:400px}.demo-target{position:relative;transition:all var(--transition)}.demo-target:focus-visible{outline:2px solid var(--c-blue-500);outline-offset:2px;box-shadow:0 0 0 4px rgba(59,130,246,.3)}.selection-mode .demo-target:focus-visible{outline:2px solid var(--c-yellow-400);box-shadow:0 0 0 4px rgba(250,204,21,.3)}.selection-mode .demo-target:hover{box-shadow:0 0 0 4px var(--c-blue-500);background-color:rgba(30,41,59,.9)!important;cursor:crosshair}.target-label{opacity:0;position:absolute;top:.5rem;left:.5rem;font-size:10px;color:var(--c-slate-500);font-family:monospace;background:rgba(0,0,0,.5);padding:0 .25rem;border-radius:var(--radius-sm);transition:opacity var(--transition);pointer-events:none}.selection-mode .demo-target:hover .target-label{opacity:1}.demo-box-1{grid-column:span 1;grid-row:span 2;background:var(--c-slate-700);border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;color:var(--c-slate-500)}.demo-box-2{grid-column:span 2;height:4rem;background:var(--c-slate-800);border-radius:var(--radius-lg);display:flex;align-items:center;padding:0 1rem;font-weight:700;font-size:1.25rem}.demo-box-3{grid-column:span 2;height:6rem;background:var(--c-slate-800);border-radius:var(--radius-lg);padding:1rem;font-size:.875rem;color:var(--c-slate-400)}.demo-box-4{grid-column:span 1;height:3rem;background:var(--c-blue-600);border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;font-weight:700}.empty-state{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}.empty-msg{background:rgba(15,23,42,.8);backdrop-filter:blur(4px);color:#fff;padding:.75rem 1.5rem;border-radius:var(--radius-full);display:flex;align-items:center;gap:.75rem;animation:2s infinite pulse}.sticky-note{position:absolute;top:-1rem;right:-1rem;width:12rem;background:var(--c-yellow-300);border-radius:var(--radius-md);box-shadow:var(--shadow-xl);z-index:20;border-top:1px solid var(--c-yellow-100);transform-origin:bottom left;animation:.3s ease-out forwards notePop}.note-header{background:rgba(250,204,21,.5);padding:.25rem;display:flex;justify-content:space-between;align-items:center;cursor:move}.note-user{font-size:10px;color:var(--c-yellow-800);font-weight:700;padding:0 .25rem}.note-close{color:var(--c-yellow-800);padding:2px;border-radius:4px;display:flex;align-items:center;justify-content:center}.note-close:hover{background:rgba(234,179,8,.5)}.note-textarea{width:100%;background:0 0;border:none;padding:.5rem;color:var(--c-slate-800);font-size:.875rem;font-family:var(--font-hand);resize:none;outline:0;height:5rem}.note-textarea::placeholder{color:rgba(133,77,14,.5)}.pain-points{padding:5rem 0;background:var(--color-bg-secondary)}.pain-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem;margin-top:3rem}.section-light{padding:6rem 0;background:var(--color-bg)}.section-header{text-align:center;max-width:768px;margin:0 auto 4rem}.features-grid{display:grid;grid-template-columns:1fr;gap:2rem}@media (min-width:768px){.features-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width:1024px){.features-grid{grid-template-columns:repeat(3,1fr)}}.section-steps{padding:5rem 0;background:var(--color-bg-secondary);border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border)}.steps-grid{display:grid;grid-template-columns:1fr;gap:2rem;position:relative}.steps-grid .card{position:relative}.steps-grid .card:not(:last-child)::after{content:'';position:absolute;left:50%;bottom:-2rem;transform:translateX(-50%);width:2px;height:2rem;background:linear-gradient(to bottom,var(--c-yellow-400),var(--c-yellow-200))}.steps-grid .card:not(:last-child)::before{content:'';position:absolute;left:50%;bottom:-2rem;transform:translateX(-50%);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:8px solid var(--c-yellow-200)}@media (min-width:768px){.steps-grid{grid-template-columns:repeat(3,1fr);gap:3rem}.steps-grid .card:not(:last-child)::after{left:auto;bottom:auto;right:-1.5rem;top:50%;transform:translateY(-50%);width:3rem;height:2px;background:linear-gradient(to right,var(--c-yellow-400),var(--c-yellow-200))}.steps-grid .card:not(:last-child)::before{left:auto;bottom:auto;right:-1.5rem;top:50%;transform:translateY(-50%);border-left:8px solid var(--c-yellow-200);border-top:6px solid transparent;border-bottom:6px solid transparent;border-right:none}}.section-comparison{padding:5rem 0;background:var(--color-bg);border-top:1px solid var(--color-border)}.comparison-table-wrapper{overflow-x:auto;margin-top:3rem;-webkit-overflow-scrolling:touch}.comparison-table{width:100%;border-collapse:collapse;font-size:.875rem;background:var(--card-bg);border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-sm);min-width:600px}@media (max-width:768px){.comparison-table{min-width:500px}.comparison-table td:first-child,.comparison-table th:first-child{position:sticky;left:0;z-index:1;background:var(--card-bg);box-shadow:2px 0 4px rgba(0,0,0,.05)}.comparison-table tbody tr:nth-child(2n) td:first-child,.comparison-table th:first-child{background:var(--color-bg-secondary)}[data-theme=dark] .comparison-table tbody tr:nth-child(2n) td:first-child{background:var(--c-slate-800)}}.comparison-table tbody tr:nth-child(2n){background-color:var(--color-bg-secondary)}[data-theme=dark] .comparison-table tbody tr:nth-child(2n){background-color:var(--c-slate-800)}.comparison-table td,.comparison-table th{padding:1.25rem 1.75rem;text-align:left;border-bottom:1px solid var(--color-border-light);color:var(--color-text)}.comparison-table th{font-weight:600;color:var(--color-text-secondary);background:var(--color-bg-secondary)}.comparison-table td:first-child{font-weight:500}.comparison-table .highlight-col{background:rgba(250,204,21,.15);color:var(--c-yellow-900);font-weight:600}.comparison-table th.highlight-col{background:var(--c-yellow-400);color:var(--c-yellow-900)}[data-theme=dark] .comparison-table .highlight-col{background:rgba(250,204,21,.12);color:var(--c-yellow-200)}[data-theme=dark] .comparison-table th.highlight-col{background:var(--c-yellow-600);color:var(--c-slate-900)}.icon-no,.icon-partial,.icon-yes{display:inline-flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;border-radius:50%;margin-right:.375rem;vertical-align:middle}.icon-yes{color:#16a34a}.icon-no{color:#dc2626}.icon-partial{color:#d97706}.icon-no svg,.icon-partial svg,.icon-yes svg{width:1rem;height:1rem}[data-theme=dark] .icon-yes{color:#22c55e}[data-theme=dark] .icon-no{color:#ef4444}[data-theme=dark] .icon-partial{color:#f59e0b}.section-pricing{padding:5rem 0;background:var(--color-bg-secondary)}.pricing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;max-width:900px;margin:0 auto}.pricing-card{position:relative;padding:2rem;background:var(--card-bg);border-radius:var(--radius-2xl);box-shadow:var(--shadow-sm);transition:all var(--transition);border:1px solid var(--card-border)}.pricing-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}[data-theme=dark] .pricing-card.featured{background:linear-gradient(180deg,var(--card-bg) 0,rgba(234,179,8,.1) 100%)}.pricing-badge{position:absolute;top:-14px;left:50%;transform:translateX(-50%);padding:.375rem 1rem;font-size:.75rem;font-weight:600;color:var(--c-yellow-900);background:var(--c-yellow-400);border-radius:var(--radius-full);white-space:nowrap;z-index:1}.pricing-card.featured{padding-top:2.5rem}.pricing-header{text-align:center;padding-bottom:1.5rem;margin-bottom:1.5rem;border-bottom:1px solid var(--color-border-light)}.pricing-header h3{margin-bottom:.5rem;font-size:1.25rem;color:var(--color-text)}.price{font-size:2.5rem;font-weight:700;color:var(--color-text)}.price span{font-size:1rem;font-weight:500;color:var(--color-text-muted)}.price-note{font-size:.75rem;color:var(--color-text-muted);margin-top:.25rem}.pricing-features{list-style:none;margin-bottom:1.5rem}.pricing-features li{padding:.5rem 0;color:var(--color-text-secondary);font-size:.875rem}.pricing-features li.muted{color:var(--color-text-muted)}.section-cta{padding:6rem 0;background:var(--c-slate-900);color:#fff;position:relative;overflow:hidden}.section-cta .container{position:relative;z-index:10}.section-cta h2{color:#fff}.section-cta p{color:var(--c-slate-300)}.cta-title{font-size:2.5rem;margin-bottom:2rem}.cta-text{margin-bottom:2.5rem;max-width:42rem;margin-left:auto;margin-right:auto}.cta-bg{position:absolute;top:0;left:0;width:100%;height:100%;opacity:.2;pointer-events:none}.cta-glow-1,.cta-glow-2{position:absolute;width:16rem;height:16rem;border-radius:50%;filter:blur(100px)}.cta-glow-1{top:2.5rem;left:2.5rem;background:var(--c-blue-600)}.cta-glow-2{bottom:2.5rem;right:2.5rem;background:#9333ea}.section-faq{padding:5rem 0;background:var(--color-bg-secondary)}.faq-list{display:flex;flex-direction:column;gap:1rem;margin-top:3rem;max-width:800px;margin-right:auto;margin-left:auto}.faq-item{background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--radius-xl);overflow:hidden;transition:border-color var(--transition)}.faq-item:hover{border-color:var(--c-yellow-400)}.faq-question{width:100%;padding:1.25rem 1.5rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;font-weight:600;font-size:1rem;color:var(--color-text);background:0 0;border:none;cursor:pointer;text-align:left;transition:background-color var(--transition)}.faq-question:hover{background:var(--color-bg-tertiary)}.faq-question:focus-visible{outline:2px solid var(--c-blue-500);outline-offset:-2px}.faq-question span{flex:1}.faq-chevron{flex-shrink:0;color:var(--c-yellow-600);transition:transform .3s}[data-theme=dark] .faq-chevron{color:var(--c-yellow-400)}.faq-question[aria-expanded=true] .faq-chevron{transform:rotate(180deg)}.faq-answer{overflow:hidden;transition:max-height .3s,padding .3s}.faq-answer:not([hidden]){padding:0 1.5rem 1.25rem}.faq-answer[hidden]{display:block;max-height:0;padding:0 1.5rem}.faq-answer p{color:var(--color-text-secondary);line-height:1.7;margin:0}@media (max-width:768px){.hero-section{padding-top:7rem}.hero-bg-shape{display:none}.browser-window{transform:none}.static-note-real{right:0;width:11rem}.demo-canvas{grid-template-columns:1fr}.demo-box-1,.demo-box-2,.demo-box-3,.demo-box-4{grid-column:span 1}.demo-box-1{grid-row:span 1;min-height:8rem}}@media (max-width:640px){.h1-hero{font-size:2.25rem}.h2-title{font-size:1.5rem}.pain-points,.section-comparison,.section-cta,.section-dark,.section-faq,.section-light,.section-pricing,.section-steps,.section-testimonials{padding:3rem 0}.demo-canvas{padding:1rem}.sticky-note{width:6rem;font-size:.5rem}.cta-title{font-size:1.75rem}}@media (max-width:480px){#preview,.demo-link{display:none}}.legal-page{padding:8rem 0 4rem;min-height:calc(100vh - 200px);background:var(--color-bg)}.legal-page h1{font-size:2.5rem;font-weight:800;margin-bottom:.5rem;color:var(--color-text)}.legal-page .last-updated{color:var(--color-text-muted);font-size:.875rem;margin-bottom:3rem}.legal-page section{margin-bottom:2.5rem}.legal-page h2{font-size:1.5rem;font-weight:700;margin-bottom:1rem;color:var(--color-text)}.legal-page h3{font-size:1.125rem;font-weight:600;margin:1.5rem 0 .75rem;color:var(--color-text)}.legal-page p{color:var(--color-text-secondary);line-height:1.7;margin-bottom:1rem}.legal-page ul{list-style:disc;margin-left:1.5rem;margin-bottom:1rem}.legal-page li{color:var(--color-text-secondary);line-height:1.7;margin-bottom:.5rem}.legal-page a{color:var(--c-blue-600);text-decoration:underline}.legal-page a.btn{text-decoration:none}.legal-page a:hover{color:var(--c-blue-700)}[data-theme=dark] .legal-page a{color:var(--c-blue-400)}[data-theme=dark] .legal-page a:hover{color:var(--c-blue-300)}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .icon-yes{color:#22c55e}:root:not([data-theme=light]) .icon-no{color:#ef4444}:root:not([data-theme=light]) .icon-partial{color:#f59e0b}:root:not([data-theme=light]) .faq-chevron{color:var(--c-yellow-400)}:root:not([data-theme=light]) .legal-page a{color:var(--c-blue-400)}:root:not([data-theme=light]) .legal-page a:hover{color:var(--c-blue-300)}}.contact-methods{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin-top:1.5rem}.contact-methods .card .btn{width:100%}.contact-methods .card p{margin-bottom:1.5rem}@keyframes notePop{0%{opacity:0;transform:scale(.9) rotate(0)}100%{opacity:1;transform:scale(1)}}@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}