*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}html[data-theme=dark]{color-scheme:dark}:root{--bg:#f8fafc;--bg-card:#fff;--bg-soft:#f1f5f9;--text:#1e293b;--text-secondary:#475569;--text-muted:#64748b;--border:#e2e8f0;--border-card:#94a3b8;--accent:#2563eb;--accent-hover:#1d4ed8;--header-bg:rgba(255,255,255,.85);--shadow:0 2px 10px rgba(0,0,0,.08);--hover-bg:#f8faff;--hover-border:#cbd5e1}html[data-theme=dark]{--bg:#0f172a;--bg-card:#1e293b;--bg-soft:#0f172a;--text:#e2e8f0;--text-secondary:#94a3b8;--text-muted:#64748b;--border:#334155;--border-card:#334155;--accent:#60a5fa;--accent-hover:#93c5fd;--header-bg:rgba(15,23,42,.85);--shadow:0 2px 10px rgba(0,0,0,.3);--hover-bg:rgba(59,130,246,.1);--hover-border:#475569}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;color:var(--text);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased}.page{max-width:1200px;margin:0 auto;padding:0 20px 60px}.header{background:var(--header-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:50}.header-inner{display:flex;justify-content:space-between;align-items:center;height:64px;max-width:1200px;margin:0 auto;padding:0 20px}.logo{font-size:18px;font-weight:800;background:linear-gradient(135deg,#2563eb,#7c3aed);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.3px;text-decoration:none}.header-right{display:flex;align-items:center;gap:8px}.btn-outline{padding:8px 20px;border:1px solid var(--border);border-radius:8px;color:var(--text-secondary);text-decoration:none;font-size:13px;font-weight:500;transition:all .15s}.btn-outline:hover{border-color:var(--accent);color:var(--accent);background:var(--hover-bg)}.theme-toggle{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border:1px solid var(--border);border-radius:8px;background:var(--bg-card);color:var(--text-secondary);font-size:13px;font-weight:500;cursor:pointer;transition:all .15s}.theme-toggle:hover{border-color:var(--accent);color:var(--accent);background:var(--hover-bg)}.hero{background:linear-gradient(135deg,#0f172a,#1e3a5f,#2d1b69);color:#fff;padding:60px 24px 50px;text-align:center;position:relative;overflow:hidden}.hero:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(ellipse at 20% 50%,rgba(59,130,246,.15) 0%,transparent 50%),radial-gradient(ellipse at 80% 50%,rgba(124,58,237,.15) 0%,transparent 50%)}.hero-inner{position:relative;z-index:1;max-width:1200px;margin:0 auto}.hero-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 16px;background:#ffffff14;border:1px solid rgba(255,255,255,.12);border-radius:20px;font-size:12px;font-weight:500;color:#fffc;margin-bottom:24px;letter-spacing:.3px}.hero h1{font-size:clamp(28px,5vw,48px);font-weight:800;line-height:1.15;letter-spacing:-1px;margin-bottom:16px}.hero h1 span{background:linear-gradient(135deg,#60a5fa,#a78bfa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero .subtitle{font-size:clamp(14px,2vw,17px);color:#ffffffb3;max-width:620px;margin:0 auto;line-height:1.7}.filters{padding:40px 0 0}.filter-row{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.filter-btn{padding:8px 20px;border:1px solid var(--border);border-radius:20px;background:var(--bg-card);color:var(--text-secondary);font-size:13px;font-weight:500;cursor:pointer;transition:all .15s}.filter-btn:hover{border-color:var(--accent);color:var(--accent);background:var(--hover-bg)}.filter-btn.active{background:var(--accent);color:#fff;border-color:var(--accent)}.filter-btn.active:hover{background:var(--accent-hover)}.products{padding:32px 0 60px}.products-grid{display:grid;grid-template-columns:1fr;gap:20px;margin-top:24px}.product-card{background:var(--bg-card);border-radius:16px;overflow:hidden;box-shadow:var(--shadow);border:1.5px solid var(--border-card);transition:all .25s;display:flex;flex-direction:column;cursor:pointer;position:relative}.product-card:hover{box-shadow:0 8px 30px #00000014;border-color:var(--hover-border)}.product-card.hidden{display:none}.product-top{padding:28px 28px 0;display:flex;align-items:flex-start;gap:16px}.product-icon{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;color:#fff;flex-shrink:0}.product-icon.ai{background:linear-gradient(135deg,#a855f7,#7c3aed)}.product-icon.warehouse{background:linear-gradient(135deg,#3b82f6,#2563eb)}.product-icon.call-center{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}.product-icon.manager{background:linear-gradient(135deg,#f97316,#ea580c)}.product-icon.marketplace,.product-icon.trade{background:linear-gradient(135deg,#22c55e,#16a34a)}.product-icon.aggregator,.product-icon.auto{background:linear-gradient(135deg,#ef4444,#dc2626)}.product-icon.survey,.product-icon.other{background:linear-gradient(135deg,#14b8a6,#0d9488)}.product-icon.edo{background:linear-gradient(135deg,#1a237e,#3949ab)}.product-info{flex:1}.product-info h3{font-size:18px;font-weight:700;color:var(--text);margin-bottom:4px;letter-spacing:-.3px}.product-info .tagline{font-size:13px;color:var(--text-muted)}.product-body{padding:16px 28px;flex:1}.product-body p{font-size:14px;color:var(--text-secondary);line-height:1.6;margin-bottom:14px}.advantages{list-style:none}.advantages li{padding:4px 0;font-size:13px;color:var(--text-secondary);display:flex;align-items:flex-start;gap:8px}.advantages li:before{content:"✓";color:#22c55e;font-weight:700;flex-shrink:0;margin-top:1px}.product-tags{padding:0 28px 16px;display:flex;flex-wrap:wrap;gap:6px}.tag{padding:4px 10px;border-radius:6px;font-size:11px;font-weight:600}.tag.purple{background:#f5f3ff;color:#7c3aed}.tag.blue{background:#eff6ff;color:#2563eb}.tag.green{background:#f0fdf4;color:#16a34a}.tag.orange{background:#fff7ed;color:#ea580c}.tag.teal{background:#f0fdfa;color:#0d9488}.tag.red{background:#fef2f2;color:#dc2626}html[data-theme=dark] .tag.purple{background:#4c1d95;color:#c4b5fd}html[data-theme=dark] .tag.blue{background:#1e3a8a;color:#93c5fd}html[data-theme=dark] .tag.green{background:#14532d;color:#4ade80}html[data-theme=dark] .tag.orange{background:#7c2d12;color:#fdba74}html[data-theme=dark] .tag.teal{background:#134e4a;color:#5eead4}html[data-theme=dark] .tag.red{background:#7f1d1d;color:#f87171}.product-bottom{padding:0 28px 28px;display:flex;flex-direction:column;gap:12px}.price-row{display:flex;justify-content:space-between;align-items:baseline;padding:12px 0;border-top:1px solid var(--bg-soft)}.price-row .install{font-size:20px;font-weight:800;color:var(--text)}.price-row .install small{font-size:12px;font-weight:500;color:var(--text-muted);display:block}.price-row .monthly{font-size:14px;color:var(--text-muted);text-align:right}.price-row .monthly strong{color:var(--text);font-size:16px}.product-btns{display:flex;gap:8px}.btn-card{flex:1;padding:12px 20px;border-radius:10px;text-align:center;text-decoration:none;font-weight:600;font-size:14px;transition:all .15s;border:none;cursor:pointer}.btn-card.primary{background:var(--accent);color:#fff}.btn-card.primary:hover{background:var(--accent-hover);transform:translateY(-1px)}.btn-card.secondary{background:var(--bg-soft);color:var(--text-secondary)}.btn-card.secondary:hover{background:var(--border);color:var(--text)}.accordion{max-height:0;overflow:hidden;transition:max-height .4s ease}.accordion.open{max-height:2500px}.accordion-inner{padding:0 28px 28px;border-top:1px solid var(--bg-soft);margin-top:0}.accordion-inner h4{font-size:14px;font-weight:700;color:var(--text);margin:20px 0 8px;display:flex;align-items:center;gap:6px}.accordion-inner h4:first-child{margin-top:16px}.accordion-inner ul{list-style:none;margin:0 0 4px}.accordion-inner li{padding:3px 0;font-size:13px;color:var(--text-secondary);display:flex;align-items:flex-start;gap:6px}.accordion-inner li:before{content:"›";color:var(--text-muted);font-weight:700;flex-shrink:0}.accordion-inner .req{background:var(--bg);border-radius:10px;padding:14px 16px;margin:12px 0;border:1px solid var(--border)}.accordion-inner .req p{font-size:13px;color:var(--text-secondary);margin:0;line-height:1.6}.accordion-inner .req strong{color:var(--text)}.accordion-inner .server-list{display:grid;grid-template-columns:1fr 1fr;gap:4px 16px}.status-demo{font-size:11px;color:var(--text-muted);margin-left:8px;font-weight:400}.loading{text-align:center;padding:60px 20px;color:var(--text-muted)}.error{text-align:center;padding:40px 20px;color:#dc2626}.cta{background:linear-gradient(135deg,#0f172a,#1e3a5f,#2d1b69);padding:48px 24px;text-align:center;color:#fff}.cta h2{font-size:24px;font-weight:800;letter-spacing:-.5px;margin-bottom:8px}.cta p{font-size:14px;color:#ffffffb3;max-width:400px;margin:0 auto 24px}.cta .btn-primary{display:inline-flex;align-items:center;gap:8px;padding:14px 32px;background:#fff;color:#0f172a;border-radius:10px;text-decoration:none;font-weight:600;font-size:15px;transition:all .2s;box-shadow:0 4px 14px #0000001a}.cta .btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 24px #00000026}.footer{background:#0f172a;color:var(--text-muted);padding:40px 0;text-align:center}.footer-links{margin-bottom:12px}.footer-links a{color:var(--text-muted);text-decoration:none;margin:0 14px;font-size:13px;transition:color .15s}.footer-links a:hover{color:#fff}.footer-copy{font-size:13px;color:var(--text-muted)}#to-top{position:fixed;right:20px;bottom:20px;width:44px;height:44px;border-radius:12px;border:none;background:#0f172a;color:#fff;font-size:18px;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(8px);transition:all .25s;box-shadow:0 6px 20px #0f172a40;z-index:60}#to-top.show{opacity:1;visibility:visible;transform:none}#to-top:hover{background:var(--accent)}.fade-enter-active{transition:opacity .3s ease}.fade-enter-from{opacity:0}.service-page{padding:40px 0}.back-link{display:inline-flex;align-items:center;gap:6px;color:var(--accent);text-decoration:none;font-size:14px;margin-bottom:24px;transition:all .15s}.back-link:hover{opacity:.8}.service-header{display:flex;align-items:flex-start;gap:20px;margin-bottom:32px}.service-icon{width:72px;height:72px;border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:700;color:#fff;flex-shrink:0}.service-header-info h1{font-size:28px;font-weight:800;color:var(--text);margin-bottom:4px}.service-header-info .tagline{font-size:15px;color:var(--text-muted)}.service-price{display:flex;gap:32px;margin-bottom:24px;padding:16px 20px;background:var(--bg-card);border-radius:12px;border:1px solid var(--border)}.service-price .price-item{display:flex;flex-direction:column}.service-price .price-item .amount{font-size:24px;font-weight:800;color:var(--text)}.service-price .price-item .label{font-size:12px;color:var(--text-muted)}.service-detail h2{font-size:18px;font-weight:700;color:var(--text);margin:24px 0 12px}.service-detail p{font-size:14px;color:var(--text-secondary);line-height:1.7}.service-detail ul{list-style:none;margin:0 0 12px}.service-detail li{padding:4px 0;font-size:14px;color:var(--text-secondary);display:flex;align-items:flex-start;gap:8px}.service-detail li:before{content:"✓";color:#22c55e;font-weight:700;flex-shrink:0;margin-top:1px}.service-req{background:var(--bg);border-radius:12px;padding:16px 20px;margin:16px 0;border:1px solid var(--border)}.service-req p{font-size:14px;color:var(--text-secondary);margin:0 0 6px}.service-req strong{color:var(--text)}.service-demo{margin-top:32px;display:flex;flex-direction:column;align-items:center;gap:16px;padding:32px;background:var(--bg-card);border-radius:16px;border:1px solid var(--border)}.service-demo h3{font-size:18px;font-weight:700;color:var(--text)}.faq{padding:0 20px 60px;max-width:800px;margin:0 auto}.faq-title{text-align:center;font-size:24px;font-weight:800;letter-spacing:-.5px;margin-bottom:24px;color:var(--text)}.faq-item{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;margin-bottom:10px;overflow:hidden}.faq-q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 20px;background:none;border:none;cursor:pointer;font-size:15px;font-weight:600;color:var(--text);text-align:left;transition:background .15s}.faq-q:hover{background:var(--hover-bg)}.faq-icon{color:var(--text-muted);transition:transform .2s;flex-shrink:0}.faq-icon.open{transform:rotate(180deg)}.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease}.faq-a.open{max-height:300px}.faq-a p{padding:0 20px 16px;font-size:14px;color:var(--text-secondary);line-height:1.7}@media (max-width:768px){.page{padding:0 12px 40px}.hero{padding:48px 16px 40px}.hero h1{font-size:24px}.hero .subtitle{font-size:13px}.service-header{flex-direction:column;gap:12px}.service-header-info h1{font-size:22px}.service-price{gap:16px;flex-wrap:wrap}.accordion-inner .server-list{grid-template-columns:1fr}.product-top{padding:16px 14px 0}.product-body{padding:10px 14px}.product-tags{padding:0 14px 10px}.product-bottom,.accordion-inner{padding:0 14px 14px}.header-inner{padding:0 12px}.logo{font-size:15px}.filter-btn{padding:6px 14px;font-size:12px}}@media (max-width:480px){.page{padding:0 8px 32px}.hero{padding:36px 12px 32px}.hero h1{font-size:20px;letter-spacing:-.3px}.hero .subtitle{font-size:12px;max-width:100%}.hero-badge{font-size:11px;padding:4px 12px;margin-bottom:16px}.product-top{padding:12px 10px 0;gap:12px}.product-icon{width:40px;height:40px;font-size:14px;border-radius:10px}.product-info h3{font-size:15px}.product-info .tagline{font-size:12px}.product-body{padding:8px 10px}.product-body p{font-size:13px}.advantages li{font-size:12px;padding:3px 0}.product-tags{padding:0 10px 8px}.tag{padding:3px 7px;font-size:10px}.price-row .install{font-size:16px}.price-row .install small{font-size:10px}.price-row .monthly{font-size:12px}.price-row .monthly strong{font-size:13px}.product-bottom{padding:0 10px 10px;gap:8px}.btn-card{padding:10px 14px;font-size:13px}.product-btns{gap:6px}.header-inner{height:52px;padding:0 10px}.logo{font-size:14px}.btn-outline,.theme-toggle{padding:6px 12px;font-size:12px}.filter-row{gap:5px}.filter-btn{padding:5px 12px;font-size:11px}.faq{padding:0 8px 40px}.faq-title{font-size:20px}.faq-q{font-size:14px;padding:12px 14px}.faq-a p{font-size:13px;padding:0 14px 12px}.service-price{flex-direction:column;gap:8px}.price-item .amount{font-size:20px}.service-page{padding:16px 0}.service-header-info h1{font-size:20px}.service-header-info .tagline{font-size:13px}.service-demo{padding:20px;margin-top:20px}.service-demo h3{font-size:16px}}
