*,:after,:before{box-sizing:border-box;margin:0;padding:0}:root{--primary:#4f46e5;--primary-dark:#3730a3;--primary-light:#818cf8;--accent:#06b6d4;--text:#111827;--text-secondary:#6b7280;--bg:#fff;--bg-secondary:#f9fafb;--border:#e5e7eb;--radius:12px;--shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);--shadow-lg:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04)}html{scroll-behavior:smooth}body{background:var(--color-body-bg);color:var(--color-text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,PingFang SC,Microsoft YaHei,sans-serif;line-height:1.6;transition:background .3s,color .3s}.container{margin:0 auto;max-width:1200px;padding:0 24px}a{color:inherit;text-decoration:none}.navbar{background:transparent;left:0;padding:20px 0;position:fixed;right:0;top:0;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:100}.navbar-container{padding:0 32px;width:100%}.navbar.scrolled{-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%);background:var(--color-navbar-scrolled-bg);border-bottom:1px solid var(--color-navbar-scrolled-border);box-shadow:0 4px 30px var(--color-navbar-scrolled-shadow);padding:16px 0}.navbar-inner{align-items:center;display:flex;gap:0;width:100%}.nav-links{display:flex;gap:36px;padding:0 0 0 40px}.logo{align-items:center;color:var(--color-logo);display:flex;font-size:22px;font-weight:800;gap:10px;transition:all .3s}.logo:hover{transform:scale(1.05)}.logo-icon{filter:drop-shadow(0 0 8px rgba(79,70,229,.6));font-size:28px}.nav-links a{color:var(--color-nav-link);font-size:15px;font-weight:500;position:relative;transition:color .3s}.nav-links a:after{background:linear-gradient(90deg,#4f46e5,#06b6d4);bottom:-4px;content:"";height:2px;left:0;position:absolute;transition:width .3s;width:0}.nav-links a:hover{color:var(--color-nav-link-hover)}.nav-links a:hover:after{width:100%}.nav-actions{align-items:center;display:flex;gap:12px;margin-left:auto}.btn-ghost{border:1px solid transparent;border-radius:10px;color:var(--color-btn-ghost-text);font-size:15px;font-weight:500;padding:10px 20px;transition:all .3s}.btn-ghost:hover{background:var(--color-btn-ghost-hover-bg);border-color:var(--color-btn-ghost-hover-border)}.btn-primary{background:linear-gradient(135deg,#4f46e5,#6366f1);border-radius:10px;box-shadow:0 4px 12px #4f46e566;color:#fff;font-size:15px;font-weight:600;padding:10px 24px;transition:all .3s}.btn-primary:hover{box-shadow:0 6px 20px #4f46e599;transform:translateY(-2px)}.mobile-menu-btn{background:none;border:none;border-radius:8px;cursor:pointer;display:none;flex-direction:column;gap:5px;margin-left:auto;padding:8px;transition:background .3s}.mobile-menu-btn:hover{background:#ffffff0d}.mobile-menu-btn span{background:var(--color-mobile-btn-bar);border-radius:2px;display:block;height:2px;transition:all .3s;width:24px}.mobile-menu{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:var(--color-mobile-menu-bg);border-radius:16px;border-top:1px solid var(--color-mobile-menu-border);display:none;flex-direction:column;gap:16px;margin-top:20px;padding:20px}.mobile-menu.open{display:flex}.mobile-menu a{border-radius:8px;color:var(--color-mobile-link);font-size:16px;font-weight:500;padding:12px 16px;transition:all .3s}.mobile-menu a:hover{background:var(--color-mobile-link-hover-bg);color:var(--color-mobile-link-hover)}.btn-ghost-mobile,.btn-primary-mobile{border-radius:10px;display:inline-block;font-weight:600;padding:12px 20px;text-align:center;transition:all .3s}.btn-ghost-mobile{border:1px solid hsla(0,0%,100%,.2);color:#e2e8f0}.btn-ghost-mobile:hover{background:#ffffff0d;border-color:#fff6}.btn-primary-mobile{background:linear-gradient(135deg,#4f46e5,#6366f1);box-shadow:0 4px 12px #4f46e566;color:#fff}.footer{background:linear-gradient(180deg,var(--color-footer-bg-start) 0,var(--color-footer-bg-end) 100%);border-top:1px solid var(--color-footer-border);color:var(--color-footer-text);margin-top:0;padding:80px 0 40px}.footer-grid{display:grid;gap:60px;grid-template-columns:2fr 1fr 1fr 1fr;margin-bottom:60px}.footer-brand .logo{color:#fff;margin-bottom:20px}.footer-brand p{color:#64748b;font-size:15px;line-height:1.8;max-width:320px}.footer-links h4{color:var(--color-footer-heading);font-size:15px;font-weight:700;margin-bottom:20px}.footer-links{display:flex;flex-direction:column;gap:12px}.footer-links a{color:var(--color-footer-link);font-size:14px;padding:4px 0;transition:all .3s}.footer-links a:hover{color:#fff;padding-left:4px}.footer-bottom{border-top:1px solid var(--color-footer-border);color:var(--color-footer-link);font-size:14px;padding-top:40px;text-align:center}@media(max-width:768px){.nav-actions,.nav-links{display:none}.mobile-menu-btn{display:flex}.footer-grid{gap:40px;grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}}.theme-toggle{align-items:center;background:var(--color-theme-toggle-bg);border:1px solid var(--color-theme-toggle-border);border-radius:8px;cursor:pointer;display:flex;font-size:16px;height:36px;justify-content:center;line-height:1;transition:all .2s;width:36px}.theme-toggle:hover{background:var(--color-theme-toggle-hover-bg);transform:scale(1.05)}