
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;500;600;700;800;900&display=swap');
:root{--ink:#122541;--navy:#0a1932;--blue:#2569c5;--sky:#57b3ed;--mist:#f1f6fc;--line:#dce6f1;--muted:#62768c;--white:#fff;--shadow:0 16px 46px rgba(31,62,112,.08);font-family:'Noto Sans TC',system-ui,-apple-system,sans-serif;color-scheme:light}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:120px}body,body.home,body.detail{background:#f7faff;color:var(--ink);font-family:'Noto Sans TC',system-ui,-apple-system,sans-serif;margin:0;line-height:1.7;overflow-x:hidden}
body:before{content:"";position:absolute;top:0;left:0;right:0;height:750px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 75% 9%,#d2e7ff 0%,transparent 46%),radial-gradient(ellipse at 5% 18%,#e0ebff 0%,transparent 43%),linear-gradient(#f8faff,#f7faff)}
a{color:var(--blue)}a:focus-visible,button:focus-visible{outline:3px solid #4c9ce9;outline-offset:3px}
header.site-header{background:rgba(255,255,255,.9)!important;position:sticky;top:0;z-index:50;box-shadow:0 1px 0 rgba(41,67,105,.1);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);padding:0 22px!important}
.header-inner{max-width:1180px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:78px}
.site-brand{display:flex;align-items:center;gap:10px;color:var(--ink)!important;text-decoration:none;min-width:0}
.brand-mini{width:48px;height:48px;border-radius:50%;object-fit:cover;background:#f8fbff;border:1px solid #dbe6f5;box-shadow:0 4px 12px #2f5f9c13}
.brand-title{font-size:16px;font-weight:900;letter-spacing:.03em;white-space:nowrap}.brand-sub{font-size:10px;letter-spacing:.21em;color:#6581a2;text-transform:uppercase;font-weight:700}
.site-nav{display:flex;align-items:center;gap:22px}.site-nav a{color:#334d70!important;text-decoration:none;font-size:13px;font-weight:700;white-space:nowrap;transition:color .2s}.site-nav a:hover{color:#1475d1!important}
.site-nav a.nav-contact{border-radius:11px;padding:10px 16px;background:#132d51;color:white!important;box-shadow:0 7px 18px #142d501c}
body.home .container{max-width:1180px;padding:20px 24px 80px;margin:auto}
.tabs{position:relative!important;top:auto!important;background:transparent!important;justify-content:flex-start!important;gap:10px!important;padding:12px 0 24px!important;max-width:1180px;margin:0 auto;z-index:2}
.tab-btn{background:white!important;border:1px solid #d9e5f2!important;border-radius:999px!important;color:#435f80!important;padding:10px 20px!important;box-shadow:0 4px 18px #192f460b;min-height:44px;transition:all .18s}
.tab-btn.active{background:#143e72!important;border-color:#143e72!important;color:white!important;box-shadow:0 8px 24px #1d569d33}
.tab-page{display:none}.tab-page.active{display:block}
.hero.hero2{position:relative;isolation:isolate;background:linear-gradient(123deg,#0b2345 0%,#173c71 54%,#2b76bd 100%)!important;border-radius:26px!important;min-height:390px;padding:50px 54px!important;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(235px,.75fr);gap:30px;align-items:center;color:#fff;text-align:left;overflow:hidden;box-shadow:0 22px 55px #173e7845}
.hero2:before{content:"";position:absolute;inset:0;z-index:-1;opacity:.4;background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.08) 53%,transparent 66%),radial-gradient(circle at 89% 15%,#76d0ff9c,transparent 32%)}
.hero2:after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(#dcecff07 1px,transparent 1px),linear-gradient(90deg,#dcecff07 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(90deg,transparent,#000)}
.eyebrow-pill{display:inline-flex;align-items:center;gap:8px;color:#dcefff;background:#ffffff18;border:1px solid #ffffff3c;padding:6px 13px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.13em}
.eyebrow-pill:before{content:"";width:7px;height:7px;border-radius:50%;background:#70e5ff;box-shadow:0 0 10px #70e5ff}
.hero2 h1{font-size:clamp(32px,4vw,52px)!important;line-height:1.35;letter-spacing:.025em;color:white;margin:24px 0 17px;font-weight:900}
.hero2 h1 em{font-style:normal;color:#9bd8ff}
.hero2 .lead{color:#dceafa;font-size:15px;line-height:1.9;max-width:560px;margin:0 0 26px}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px}
.hero-cta a{border-radius:11px;min-height:46px;text-decoration:none;font-weight:800;padding:11px 18px;font-size:14px;display:inline-flex;align-items:center;gap:8px}
.hero-cta .cta-primary{background:#fff;color:#154679;box-shadow:0 12px 24px #03182e40}.hero-cta .cta-outline{border:1px solid #bddbff7f;color:white;background:#ffffff12}
.hero-logo-shell{position:relative;display:grid;place-items:center;justify-self:center;width:min(100%,270px);aspect-ratio:1;border-radius:50%;border:1px solid #e8f3ff54;background:radial-gradient(circle,#fff 40%,#dcecff 72%,#a9c5ee 100%);box-shadow:0 0 0 16px #ffffff0c,0 0 0 36px #ffffff06,0 25px 70px #0005,inset 0 0 36px #ffffffbe}
.hero-logo-shell img{width:83%;height:83%;object-fit:contain;border-radius:50%;filter:drop-shadow(0 8px 15px #244a643d)}
.hero-mark{position:absolute;bottom:-24px;background:#eff7ff;color:#294766;border:1px solid white;font-size:11px;letter-spacing:.13em;font-weight:800;padding:8px 15px;border-radius:999px;box-shadow:0 9px 18px #0723453b;white-space:nowrap}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:46px 2px 20px}
.section-head h2{font-size:clamp(24px,3vw,31px);letter-spacing:.02em;margin:0;color:#102e54}
.section-head p{font-size:14px;color:#6d8298;margin:3px 0 0}
.overline{display:block;letter-spacing:.2em;font-weight:900;font-size:11px;color:#367fb5;margin-bottom:9px}
body.home .grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:18px!important}
body.home .card,body.home .section{border:1px solid #e1e9f4!important;border-radius:18px!important;box-shadow:var(--shadow)!important;background:white!important}
body.home .card{position:relative;display:flex;flex-direction:column;min-height:262px;padding:26px!important;overflow:hidden;transition:transform .2s,box-shadow .2s}
body.home .card:before{content:"";display:block;width:38px;height:4px;border-radius:9px;background:linear-gradient(90deg,#77c6ff,#2874c9);margin-bottom:21px}
body.home .card:hover{transform:translateY(-5px);box-shadow:0 20px 60px #254d8a23!important}
body.home .card h2{font-size:19px;line-height:1.45;margin:0 0 12px;color:#12345d}
body.home .card p{font-size:13px;color:#627891;line-height:1.9;margin:0 0 14px}
body.home .card .seo-link{font-size:12px;color:#1764ad;text-decoration:none;font-weight:800;letter-spacing:.01em}
body.home .card p:has(>.seo-link){order:10;margin-top:auto;padding-top:18px;margin-bottom:0}
body.home .price{font-size:15px!important;font-weight:900;color:#1b5c9f;margin:6px 0!important;background:#eaf4ff;padding:7px 10px;border-radius:8px;width:max-content;max-width:100%}
body.home .price.free-link{text-decoration:none!important}
body.home .download-btn{border-radius:10px!important;background:linear-gradient(115deg,#153a66,#2a77bb)!important;margin-top:auto;text-align:center;padding:13px 16px!important;font-size:13px}
.version-label{font-size:11px;color:#52799f;background:#ecf4ff;border-radius:6px;padding:3px 6px}
body.home .note{margin-top:30px!important;background:#ebf5ff!important;border:1px solid #cfe2f5!important;border-left:4px solid #2d7cbf!important;color:#34516c!important;padding:22px!important;border-radius:14px!important;line-height:2;font-size:14px}
body.home .note a{font-weight:800}
body.home .section{padding:25px!important;margin-top:22px!important}
body.home .section h2{color:#142f4d;font-size:20px}
body.home .section p{font-size:14px;color:#5c7187}
body.home .section ul{padding-left:22px;columns:2;line-height:2.3}
body.home .section ul a{font-size:14px}
.service-panel{margin-top:32px;padding:30px 34px!important;display:flex;align-items:center;justify-content:space-between;gap:24px;background:linear-gradient(120deg,#f9fcff,#e3f0ff)!important;border:1px solid #d2e4f7;border-radius:20px;box-shadow:var(--shadow)}
.service-panel h2{font-size:23px;margin:4px 0;color:#123a65}.service-panel p{font-size:14px;color:#506d87;max-width:660px}
.service-panel .service-link{white-space:nowrap;display:inline-block;background:#143c6d;border-radius:11px;color:#fff;text-decoration:none;padding:13px 19px;font-size:13px;font-weight:800}
.contact-float{position:fixed;z-index:60;right:22px;bottom:24px;background:#04bd70;color:white!important;border-radius:100px;padding:12px 17px;text-decoration:none;font-weight:900;font-size:13px;box-shadow:0 9px 30px #087a4c44;display:inline-flex;gap:9px;align-items:center}
.contact-dot{display:block;width:9px;height:9px;border-radius:50%;background:white}
.site-footer{max-width:1180px;margin:40px auto 30px;padding:22px 24px 0;border-top:1px solid #dce7f3;font-size:12px;color:#6c7f94;display:flex;justify-content:space-between;gap:14px}
.site-footer a{color:#31699c;text-decoration:none}
#download>.card{margin-top:20px}
body.detail header.site-header{background:#fffc!important}
body.detail .wrap{max-width:1120px;padding:35px 22px 80px}
body.detail nav.breadcrumb{font-size:13px;color:#69809a;margin-bottom:23px}
body.detail nav.breadcrumb a{color:#3b6ca1}
body.detail .hero{position:relative;min-height:265px;background:linear-gradient(125deg,#102a50,#2264a2)!important;color:white!important;padding:40px 43px!important;border-radius:24px!important;box-shadow:0 18px 44px #173e7835;overflow:hidden;isolation:isolate}
body.detail .hero:before{content:"";position:absolute;right:-40px;top:-110px;width:450px;height:450px;background:radial-gradient(circle,#8ac8ff55,transparent 65%);z-index:-1}
body.detail .hero h1{font-size:clamp(29px,4vw,42px)!important;line-height:1.35;font-weight:900;margin:10px 0 9px;color:white!important;max-width:740px}
body.detail .hero .eyebrow{color:#addcff!important;font-size:12px;font-weight:800;letter-spacing:.13em}
body.detail .hero .sub{color:#daebff;font-size:16px}
body.detail .hero .price{display:inline-block;background:#f8fcff;color:#194b82!important;border-radius:9px;padding:7px 13px;margin-top:18px;font-size:14px;font-weight:900}
body.detail .actions{display:flex;gap:12px;margin:24px 0 8px;flex-wrap:wrap}
body.detail .btn{background:#19487e;color:white;text-decoration:none;padding:12px 20px;border-radius:11px;display:inline-flex;align-items:center;font-size:14px;font-weight:800;min-height:46px}
body.detail .btn.alt{background:white;color:#19487e;border:1px solid #c5d9ef}
body.detail article{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:26px}
body.detail .panel{border-radius:16px;border:1px solid #e0e9f5;padding:27px;background:#fff;box-shadow:var(--shadow)}
body.detail .panel h2{font-size:20px;color:#163a67}
body.detail .panel h3{font-size:17px;color:#163a67}
body.detail .panel p{color:#586f88;font-size:14px;line-height:2}
body.detail .faq{margin-top:45px}.faq>h2{font-size:25px;color:#183b65}
body.detail footer{border-top:1px solid #d8e5f2;color:#667c91;line-height:2}
@media(max-width:930px){.site-nav{gap:12px}.site-nav a{font-size:12px}body.home .grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.hero.hero2{padding:40px!important;grid-template-columns:1fr 210px}.hero-logo-shell{width:210px}}
@media(max-width:680px){header.site-header{padding:0 15px!important}.header-inner{min-height:66px}.brand-mini{width:38px;height:38px}.brand-title{font-size:13px}.brand-sub{font-size:8px}.site-nav{gap:8px}.site-nav a:not(.nav-contact){display:none}.site-nav a.nav-contact{font-size:11px;padding:8px 11px}
body.home .container{padding:10px 15px 62px}.tabs{padding:10px 0 17px!important}.hero.hero2{grid-template-columns:1fr;gap:25px;padding:31px 25px 45px!important;min-height:auto;border-radius:19px!important}.hero2 h1{font-size:31px!important;margin:17px 0 12px}.hero2 .lead{font-size:13px}.hero-logo-shell{width:162px;order:-1}.hero-mark{font-size:9px;bottom:-17px}.hero-cta a{font-size:12px;padding:11px 14px}
.section-head{padding:34px 1px 18px}.section-head h2{font-size:24px}body.home .grid{grid-template-columns:1fr!important;gap:13px!important}body.home .card{min-height:0;padding:22px!important}body.home .card h2{font-size:18px}body.home .section ul{columns:1}.service-panel{padding:25px!important;flex-direction:column;align-items:start}.service-panel h2{font-size:20px}.contact-float{bottom:17px;right:14px;padding:10px 14px;font-size:12px}
.site-footer{padding:20px 18px 0;margin:25px auto;flex-direction:column}
body.detail .wrap{padding:20px 16px 60px}body.detail .hero{padding:32px 24px!important;min-height:auto}body.detail .hero h1{font-size:28px!important}body.detail article{grid-template-columns:1fr;gap:13px}body.detail .panel{padding:22px}.brand-sub{letter-spacing:.08em}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}


/* SEO service offering links */
.service-offerings{margin-top:12px;scroll-margin-top:86px}
.service-offerings .section-head{padding-top:26px}
.service-offerings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}
.service-offering{display:block;background:#fff;border:1px solid #dce8f6;border-radius:18px;padding:24px 26px;text-decoration:none;color:#1c3d61;box-shadow:0 12px 30px rgba(29,73,123,.07);transition:box-shadow .2s,transform .2s}
.service-offering:hover{transform:translateY(-3px);box-shadow:0 18px 38px rgba(29,73,123,.12)}
.service-offering:focus-visible{outline:3px solid #408cdb;outline-offset:3px}
.service-tag{color:#3174b2;font-size:11px;font-weight:900;letter-spacing:.1em}
.service-offering h3{font-size:20px;line-height:1.5;margin:12px 0 8px;color:#11375e}
.service-offering p{font-size:14px;line-height:1.9;color:#647990;margin:0 0 18px}
.service-offering strong{font-size:13px;color:#1b64ae}
@media(max-width:680px){.service-offerings-grid{grid-template-columns:1fr;gap:12px}.service-offering{padding:22px}.service-offering h3{font-size:18px}}
