:root{--violet-600: #7c3aed;--violet-500: #8b5cf6;--violet-100: #ede9fe;--violet-50: #f5f3ff;--pink-500: #ec4899;--pink-300: #f9a8d4;--amber-500: #f59e0b;--amber-300: #fcd34d;--slate-900: #0f172a;--slate-600: #475569;--slate-500: #64748b;--slate-200: #e2e8f0;--slate-50: #f8fafc;--white: #ffffff;--primary: var(--violet-500);--primary-hover: var(--violet-600);--text-primary: var(--slate-900);--text-secondary: var(--slate-600);--text-muted: var(--slate-500);--bg-primary: var(--white);--bg-secondary: var(--slate-50);--border-color: var(--slate-200);--error: #ef4444;--success: #10b981;--space-xs: 8px;--space-sm: 16px;--space-md: 32px;--space-lg: 64px;--text-sm: 14px;--text-base: 16px;--text-lg: 24px;--text-xl: 40px;--text-2xl: clamp(40px, 6vw, 72px);--text-hero: clamp(64px, 12vw, 140px);--text-step-num: clamp(72px, 10vw, 120px);--border-bold: 4px solid var(--slate-900);--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--radius-sm: 8px;--radius-md: 16px;--radius-full: 9999px;--height-sm: 32px;--height-md: 40px;--height-lg: 48px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-play: 0 4px 0 rgba(15, 23, 42, 1);--container-max: 1200px;--container-padding: var(--space-sm)}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;font-size:var(--text-base);overflow-x:hidden}body{font-family:var(--font-family);line-height:1.6;color:var(--text-primary);background-color:var(--bg-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}img{max-width:100%;height:auto;display:block}a{color:var(--primary);text-decoration:none;transition:color .2s ease}a:hover{color:var(--primary-hover)}h1{font-size:var(--text-xl);font-weight:900;line-height:1.1;letter-spacing:-.03em;color:var(--text-primary)}h2,h3,h4,h5,h6{font-size:var(--text-lg);font-weight:800;line-height:1.2;letter-spacing:-.02em;color:var(--text-primary)}p{font-size:var(--text-base);color:var(--text-secondary);line-height:1.6}.text-sm{font-size:var(--text-sm)}.text-muted{color:var(--text-muted)}.container{width:100%;max-width:var(--container-max);margin:0 auto;padding:0 var(--container-padding)}main{margin-top:80px}section{padding:var(--space-lg) 0}.site-header{position:fixed;top:0;left:0;right:0;height:80px;background:var(--white);border-bottom:4px solid var(--text-primary);z-index:1000}.navbar-container{display:flex;height:100%;align-items:center;justify-content:space-between;max-width:none;padding:0 24px}.nav-brand{display:flex;align-items:center;gap:var(--space-xs);text-decoration:none}.logo-icon{flex-shrink:0}.logo-text{font-size:20px;font-weight:700;color:var(--text-primary);letter-spacing:.01em}.nav-link{color:var(--text-muted);font-weight:600;font-size:var(--text-sm);text-decoration:none;transition:color .2s ease}.nav-link:hover{color:var(--primary)}.nav-actions{display:none;align-items:center;gap:var(--space-sm)}.nav-toggle{display:flex;flex-direction:column;background:none;border:none;cursor:pointer;padding:var(--space-xs);gap:4px}.nav-toggle span{width:24px;height:2px;background-color:var(--text-secondary);border-radius:2px;transition:all .3s ease}.mobile-menu{border-top:1px solid var(--border-color);background:var(--bg-secondary);padding:var(--space-sm);position:absolute;width:100%;box-shadow:var(--shadow-sm);border-radius:0 0 var(--radius-md) var(--radius-md)}.mobile-nav{display:flex;flex-direction:column;gap:var(--space-sm)}.mobile-link{font-size:var(--text-base);font-weight:500;color:var(--text-secondary);text-decoration:none;padding:var(--space-xs);border-radius:var(--radius-sm);transition:all .2s ease}.mobile-link:hover{color:var(--primary);background:var(--violet-50)}.mobile-divider{margin:var(--space-xs) 0;border:none;border-top:1px solid var(--border-color)}@media(min-width:768px){.nav-actions{display:flex}.nav-toggle{display:none}.mobile-menu{display:none!important}}.section-overline{display:block;color:var(--primary);font-weight:700;text-transform:uppercase;font-size:var(--text-sm);letter-spacing:.1em;margin-bottom:var(--space-xs)}.site-footer{border-top:4px solid var(--text-primary);background:var(--white);padding:0}.footer-inner{padding:20px 24px;display:flex;align-items:center;justify-content:space-between}.footer-brand{font-size:var(--text-sm);font-weight:900;color:var(--text-primary);letter-spacing:.05em;text-transform:uppercase}.footer-links{display:flex;align-items:center;gap:12px}.footer-links a{font-size:12px;font-weight:900;color:var(--text-primary);text-decoration:none;letter-spacing:.05em;text-transform:uppercase;opacity:.5}.footer-links a:hover{opacity:1;color:var(--primary)}.footer-sep{font-size:12px;font-weight:900;color:var(--text-primary);opacity:.2;user-select:none}@media(max-width:768px){.footer-inner{flex-direction:column;gap:12px;text-align:center;padding:16px}}.notebook-dots{background-image:radial-gradient(circle,rgba(148,163,184,.4) 1px,transparent 1px);background-size:var(--space-sm) var(--space-sm);background-attachment:fixed}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-xs);white-space:nowrap;border-radius:var(--radius-sm);font-size:var(--text-sm);font-weight:600;text-decoration:none;cursor:pointer;transition:all .2s ease;border:2px solid transparent;height:var(--height-md);padding:0 var(--space-sm)}.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-play)}.btn:active{transform:translateY(0);box-shadow:none}.btn-primary{background:var(--primary);color:var(--white);border-color:var(--primary)}.btn-primary:hover{background:var(--primary);border-color:var(--text-primary);color:var(--white)}.btn-outline{background:var(--white);color:var(--text-primary);border-color:var(--border-color)}.btn-outline:hover{background:var(--white);border-color:var(--text-primary);color:var(--text-primary)}.btn-outline-light{background:transparent;color:var(--white);border-color:#ffffff80}.btn-outline-light:hover{background:#ffffff1a;border-color:var(--white);color:var(--white)}.btn-ghost{background:transparent;color:var(--text-primary);border-color:transparent}.btn-ghost:hover{background:transparent;border-color:var(--border-color);box-shadow:none;transform:none}.btn-sm{height:var(--height-sm);padding:0 var(--space-xs);font-size:var(--text-sm)}.btn-large{height:var(--height-lg);padding:0 var(--space-md);font-size:var(--text-base)}.btn-full{width:100%}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none;pointer-events:none}