:root{
  --ink:#0e2349;--muted:#58677f;--line:#dfe5ef;--soft:#f5f7fb;--paper:#fff;
  --primary:#2448d8;--primary-dark:#1738b5;--primary-soft:#eef1ff;
  --teal:#0b9e9b;--teal-soft:#e7f8f5;--coral:#e65353;--amber:#e77c17;
  --shadow:0 16px 46px rgba(35,55,95,.12);--radius:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:#fff;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang TC","Noto Sans TC",sans-serif;font-size:17px;line-height:1.65}
a{color:inherit;text-decoration:none}
button,input{font:inherit}
.site-header{height:76px;display:flex;align-items:center;gap:42px;max-width:1400px;margin:auto;padding:0 32px;background:rgba(255,255,255,.94);position:relative;z-index:10}
.brand{display:inline-flex;align-items:center;gap:10px;font-size:24px;font-weight:850;letter-spacing:-.6px}
.brand-mark{width:35px;height:35px;display:grid;place-items:center;border:2px solid var(--primary);border-radius:50%;color:var(--primary);font-size:25px;transform:rotate(-20deg)}
.site-header nav{display:flex;gap:30px;margin:auto;font-size:15px;font-weight:650}
.site-header nav a:hover,.text-link:hover{color:var(--primary)}
.header-actions{display:flex;align-items:center;gap:20px;font-size:15px;font-weight:650}
.button{display:inline-flex;align-items:center;justify-content:center;gap:24px;border:1px solid var(--primary);background:var(--primary);color:#fff;padding:13px 22px;border-radius:10px;font-weight:750;box-shadow:0 8px 22px rgba(36,72,216,.18);transition:.18s}
.button:hover{background:var(--primary-dark);transform:translateY(-1px)}
.button.small{padding:9px 15px;border-radius:8px;box-shadow:none}
.button.secondary{background:#fff;color:var(--ink);border-color:#aab5c8;box-shadow:none}
.hero{max-width:1400px;margin:auto;padding:76px 32px 82px;display:grid;grid-template-columns:minmax(510px,.9fr) minmax(540px,1.1fr);gap:36px;align-items:center;min-height:720px}
.hero h1{font-size:clamp(44px,3.8vw,60px);line-height:1.15;letter-spacing:-2px;margin:0 0 24px;font-weight:880}
.hero-copy>p{font-size:20px;color:var(--muted);max-width:620px;margin:0}
.hero-actions{display:flex;gap:14px;margin:34px 0}
.route-illustration{display:flex;align-items:center;margin-top:46px;color:var(--primary)}
.route-node{width:46px;height:46px;border:1px solid #a9b9e8;border-radius:14px;display:grid;place-items:center;font-size:14px;font-weight:800;background:#fff}
.route-node.success{color:var(--teal);border-color:#88d9d3}.route-illustration i{width:34px;border-top:2px dotted var(--primary)}
.route-illustration .compass{width:76px;height:76px;border:4px solid var(--primary);border-radius:50%;display:grid;place-items:center;font-size:38px;background:var(--primary-soft)}
.product-preview{background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);display:grid;grid-template-columns:150px 1fr;min-height:510px;overflow:hidden;transform:perspective(1200px) rotateY(-1.2deg)}
.product-preview aside{padding:18px 12px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:4px;font-size:11px;color:#61708a}
.mini-brand{font-size:14px;font-weight:850;color:var(--ink);margin:0 7px 14px}.mini-brand span{color:var(--primary)}
.product-preview aside>span,.product-preview aside>b{padding:8px 9px;border-radius:7px;font-weight:650}.product-preview aside>b{background:var(--primary-soft);color:var(--primary)}
.product-preview aside em{font-style:normal;background:var(--coral);color:#fff;border-radius:9px;padding:0 5px;float:right}
.preview-main{padding:22px;background:#fbfcfe}
.preview-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.preview-head strong{font-size:19px;display:block}.preview-head small{color:var(--muted)}.preview-head>span{font-size:10px;color:#087e67;background:#e7f7ef;border:1px solid #8fd5bd;border-radius:15px;padding:5px 9px}
.preview-main section{background:#fff;border:1px solid var(--line);border-radius:10px;margin-bottom:12px;padding:12px}
.preview-main h3{font-size:12px;margin:0 0 8px}.preview-focus>div{display:grid;grid-template-columns:58px 1fr auto;gap:8px;align-items:center;border-top:1px solid #edf0f5;padding:8px 0;font-size:10px}.preview-focus b{color:var(--coral);background:#fff0f0;border-radius:5px;padding:2px 5px;text-align:center}.preview-focus b.warn{color:var(--amber);background:#fff3e7}.preview-focus b.info{color:var(--primary);background:var(--primary-soft)}.preview-focus small{color:var(--muted)}
.preview-flow>div{display:flex;align-items:center;justify-content:space-between;font-size:9px}.preview-flow span{text-align:center}.preview-flow b{display:block;font-size:16px;color:var(--primary)}.preview-flow i{color:#9aa7ba}
.preview-columns{display:grid;grid-template-columns:1.3fr 1fr;gap:12px}.preview-columns section{margin:0}.preview-columns p{font-size:9px;margin:7px 0;border-top:1px solid #edf0f5;padding-top:6px}.preview-columns p b{float:right;color:var(--teal)}
.workflow{background:var(--soft);border-block:1px solid var(--line);padding:76px 32px}
.section-heading{text-align:center;margin-bottom:42px}.section-heading h2,.feature-copy h2,.security h2,.final-cta h2{font-size:38px;line-height:1.28;letter-spacing:-1px;margin:0 0 12px}.section-heading p,.feature-copy>p,.security p{color:var(--muted);margin:0}
.workflow-rail{max-width:1160px;margin:auto;display:grid;grid-template-columns:repeat(5,1fr);position:relative}
.workflow-rail:before{content:"";position:absolute;left:10%;right:10%;top:25px;border-top:2px dotted #9bb0ec}
.workflow-rail article{text-align:center;padding:0 16px;position:relative}.workflow-rail article>b{width:50px;height:50px;border-radius:50%;display:grid;place-items:center;background:#fff;border:2px solid var(--primary);color:var(--primary);margin:auto;font-size:14px}.workflow-rail h3{font-size:18px;margin:16px 0 3px}.workflow-rail p{font-size:14px;color:var(--muted);margin:0}
.feature-split{max-width:1240px;margin:auto;padding:100px 32px;display:grid;grid-template-columns:1.08fr .92fr;gap:92px;align-items:center}.feature-split.reverse{grid-template-columns:.88fr 1.12fr}
.feature-copy ul,.security ul{padding:0;margin:26px 0 0;list-style:none}.feature-copy li,.security li{margin:11px 0;color:#30425e}.feature-copy li:before,.security li:before{content:"✓";color:var(--teal);font-weight:900;margin-right:10px}
.capture-demo,.file-demo{background:var(--soft);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);padding:20px;display:grid;gap:16px}
.capture-demo{grid-template-columns:1.05fr .95fr}.capture-tabs{grid-column:1/-1;display:flex;gap:24px;border-bottom:1px solid var(--line);font-size:14px}.capture-tabs b{color:var(--primary);border-bottom:2px solid var(--primary);padding-bottom:9px}.capture-body,.structured{background:#fff;border:1px solid var(--line);border-radius:12px;padding:24px;min-height:240px}.capture-body{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:15px}.capture-body small{color:var(--muted)}.wave{height:48px;display:flex;align-items:center;gap:4px}.wave i{width:4px;background:var(--primary);border-radius:4px;height:var(--h,20px)}.wave i:nth-child(2),.wave i:nth-child(6){--h:38px}.wave i:nth-child(3),.wave i:nth-child(5){--h:27px}.wave i:nth-child(4){--h:46px}.structured small{color:var(--primary)}.structured h3{margin:9px 0 18px}.structured p{font-size:14px;color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:8px}.structured button{width:100%;border:0;border-radius:8px;background:var(--primary);color:#fff;padding:10px;font-weight:700}
.file-demo{grid-template-columns:.7fr 1.3fr}.tree,.files{background:#fff;border:1px solid var(--line);border-radius:12px;padding:20px}.tree span{display:block;font-size:14px;margin-top:16px;color:#5c6c85}.files p{font-size:14px;border-bottom:1px solid var(--line);padding:10px 0;margin:0}.files small{float:right;color:var(--muted)}.history{font-size:13px;color:var(--teal);background:var(--teal-soft);padding:10px;border-radius:8px;margin-top:18px}
.security{padding:88px max(32px,calc((100vw - 1120px)/2));background:var(--soft);border-block:1px solid var(--line);display:grid;grid-template-columns:.7fr 1.3fr;gap:100px;align-items:center}.shield{width:220px;height:230px;margin:auto;background:var(--teal-soft);border:5px solid var(--teal);clip-path:polygon(50% 0,92% 18%,86% 72%,50% 100%,14% 72%,8% 18%);display:grid;place-items:center}.shield span{width:80px;height:80px;border-radius:50%;background:#fff;color:var(--teal);display:grid;place-items:center;font-size:46px;font-weight:900}
.final-cta{text-align:center;padding:82px 24px}.final-cta .button{margin-top:20px}
footer{border-top:1px solid var(--line);max-width:1400px;margin:auto;padding:28px 32px;display:flex;align-items:center;gap:30px;color:var(--muted)}footer .brand{color:var(--ink);font-size:19px}footer .brand-mark{width:28px;height:28px;font-size:18px}footer small{margin-left:auto}
.login-page{min-height:100vh;background:var(--soft)}.login-brand{position:absolute;left:36px;top:26px;z-index:2}.login-layout{min-height:100vh;display:grid;grid-template-columns:1fr 1fr}.login-story{background:#fff;padding:140px max(60px,12vw) 80px;display:flex;flex-direction:column;justify-content:center}.compass-large{width:110px;height:110px;border:4px solid var(--primary);border-radius:50%;display:grid;place-items:center;color:var(--primary);font-size:62px;background:var(--primary-soft);margin-bottom:35px}.login-story h1{font-size:56px;line-height:1.1;margin:0 0 22px;letter-spacing:-2px}.login-story>p{color:var(--muted);max-width:520px;font-size:19px}.login-route{display:flex;align-items:center;margin-top:50px;font-size:14px;font-weight:700;color:var(--primary)}.login-route span{padding:8px 12px;background:var(--primary-soft);border-radius:8px}.login-route i{width:32px;border-top:2px dotted var(--primary)}.login-panel{display:grid;place-items:center;padding:80px}.login-panel form{width:min(430px,100%);background:#fff;border:1px solid var(--line);border-radius:18px;padding:40px;box-shadow:var(--shadow)}.login-label{font-size:13px;color:var(--primary);font-weight:800;margin:0 0 6px}.login-panel h2{font-size:34px;margin:0 0 30px}.login-panel label{font-size:14px;font-weight:700;display:block;margin-bottom:8px}.password-wrap{display:flex;border:1px solid #b7c1d0;border-radius:9px;overflow:hidden;background:#fff}.password-wrap:focus-within{outline:3px solid #dce3ff;border-color:var(--primary)}.password-wrap input{border:0;outline:0;padding:13px 14px;min-width:0;flex:1}.password-wrap button{border:0;background:#fff;color:var(--primary);padding:0 14px;font-size:13px;font-weight:700}.login-submit{width:100%;margin-top:18px}.login-submit:disabled{opacity:.65}.login-error{min-height:26px;color:var(--coral);font-size:14px;margin:10px 0 0}.login-note{font-size:12px;color:var(--muted);border-top:1px solid var(--line);padding-top:18px;margin-top:8px}
@media(max-width:980px){.site-header nav{display:none}.hero{grid-template-columns:1fr;padding-top:48px}.product-preview{transform:none}.feature-split,.feature-split.reverse,.security{grid-template-columns:1fr;gap:45px}.login-layout{grid-template-columns:1fr}.login-story{display:none}.login-panel{padding:100px 24px 40px}.login-brand{left:24px}}
@media(max-width:660px){body{font-size:16px}.site-header{height:68px;padding:0 18px}.header-actions .text-link{display:none}.brand{font-size:20px}.brand-mark{width:30px;height:30px}.hero{padding:44px 18px 62px;min-height:auto}.hero h1{font-size:40px;letter-spacing:-1.4px}.hero-copy>p{font-size:17px}.hero-actions{flex-direction:column}.hero-actions .button{width:100%}.route-illustration{justify-content:center}.route-illustration i{width:18px}.product-preview{display:none}.workflow{padding:60px 18px}.workflow-rail{grid-template-columns:1fr;text-align:left;gap:18px}.workflow-rail:before{left:24px;top:20px;bottom:20px;right:auto;border-top:0;border-left:2px dotted #9bb0ec}.workflow-rail article{display:grid;grid-template-columns:50px 1fr;text-align:left;gap:0 16px}.workflow-rail article>b{grid-row:1/3}.workflow-rail h3{margin:2px 0}.feature-split{padding:70px 18px}.section-heading h2,.feature-copy h2,.security h2,.final-cta h2{font-size:30px}.capture-demo,.file-demo{grid-template-columns:1fr}.capture-tabs{overflow:auto}.security{padding:70px 18px;gap:28px}.shield{width:160px;height:170px}.final-cta{padding:65px 18px}footer{padding:24px 18px;flex-wrap:wrap}footer small{margin-left:0;width:100%}.login-panel form{padding:28px}}
