@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+TC:wght@400;500;600;700;900&display=swap');
:root{--bg:#071321;--cyan:#62e5e3;--white:#f4f7fa;--muted:#9aabba;--line:rgba(255,255,255,.12);--font:'DM Sans','Noto Sans TC',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--bg);color:var(--white);font-family:var(--font);line-height:1.65}.site-shell{overflow:hidden}.header{height:82px;padding:0 max(6vw,24px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:relative;z-index:10;background:rgba(7,19,33,.92)}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--white)}.brand-mark{font-size:29px;font-weight:900;letter-spacing:-3px}.brand-mark span,.brand-name b{color:var(--cyan)}.brand-name{font-size:13px;letter-spacing:2px;font-weight:700}.brand-name b{font-weight:500;margin-left:4px}.nav{display:flex;align-items:center;gap:34px}.nav a,.lang-toggle{color:#c1ccd6;text-decoration:none;font-size:12px;letter-spacing:.4px}.nav a:hover,.text-link:hover{color:var(--cyan)}.nav .nav-cta{color:var(--cyan)}.lang-toggle{border:1px solid var(--line);background:transparent;border-radius:30px;padding:8px 14px;cursor:pointer;color:var(--cyan)}.menu-toggle{display:none;background:none;border:0;color:white;font-size:24px}.hero{min-height:680px;padding:100px max(8vw,28px) 80px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:4vw;position:relative}.hero-glow,.contact-glow{position:absolute;width:560px;height:560px;border-radius:50%;background:radial-gradient(circle,rgba(41,184,190,.16),transparent 68%);pointer-events:none;top:0;right:-100px}.hero-content{position:relative;z-index:1}.eyebrow{font-size:10px;letter-spacing:2.4px;color:var(--cyan);font-weight:700;display:flex;align-items:center;gap:10px}.pulse{width:7px;height:7px;background:var(--cyan);border-radius:50%;box-shadow:0 0 14px var(--cyan)}h1{font-size:clamp(42px,5vw,68px);line-height:1.2;letter-spacing:-2.5px;margin:25px 0 22px}h1 em,h2 em{font-style:normal;color:var(--cyan)}.hero-copy{max-width:510px;color:var(--muted);font-size:15px;line-height:2}.hero-actions{display:flex;align-items:center;gap:28px;margin:35px 0 65px}.button{display:inline-flex;align-items:center;justify-content:center;gap:28px;padding:15px 22px;text-decoration:none;font-size:12px;font-weight:700;letter-spacing:.5px;border:0;cursor:pointer;transition:.2s}.button-primary{background:var(--cyan);color:#071321}.button-primary:hover{background:#a0ffff;transform:translateY(-2px)}.text-link{color:#dce7ed;text-decoration:none;font-size:12px}.text-link span{margin-left:12px;color:var(--cyan)}.hero-meta{display:flex;gap:32px;flex-wrap:wrap}.hero-meta div{display:flex;flex-direction:column;gap:5px}.hero-meta strong{font-size:10px;letter-spacing:1.4px}.hero-meta span{font-size:10px;color:#8295a6}.hero-visual{height:470px;position:relative;display:flex;align-items:center;justify-content:center}.visual-orbit{position:absolute;border:1px solid rgba(98,229,227,.16);border-radius:50%;width:450px;height:450px}.orbit-two{width:520px;height:520px;border-style:dashed;opacity:.45}.visual-card{width:min(420px,90%);height:330px;background:#e9eff0;border-radius:8px;box-shadow:0 30px 90px #0008;transform:rotate(3deg);overflow:hidden;position:relative;z-index:1}.browser-bar{height:30px;background:#d5dddf;display:flex;align-items:center;gap:5px;padding:0 12px;color:#6a7a80;font-size:8px}.browser-bar i{width:6px;height:6px;border-radius:50%;background:#87999e}.browser-bar span{margin:auto}.mock-page{height:300px;background:#142c35;color:#eff8f5;padding:24px 30px;position:relative;overflow:hidden}.mock-nav{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1px}.mock-nav b{font-size:13px}.mock-nav b span{color:var(--cyan)}.mock-nav small{font-size:7px}.mock-label{margin-top:43px;color:#8bdad3;font-size:7px;letter-spacing:2px}.mock-heading{font-size:37px;line-height:1.02;font-weight:700;letter-spacing:-2px;margin-top:12px;position:relative;z-index:2}.mock-heading span{color:#8be1d8}.mock-line{height:1px;background:#577077;width:100%;margin-top:20px}.mock-button{font-size:7px;letter-spacing:2px;margin-top:18px}.mock-button b{margin-left:12px;color:var(--cyan)}.mock-shape{position:absolute;width:170px;height:170px;border-radius:50%;background:linear-gradient(135deg,#6be4d9,#2a7782);right:-38px;bottom:-55px;box-shadow:0 0 50px #3fc5c5aa}.mock-foot{position:absolute;bottom:17px;font-size:6px;letter-spacing:2px;color:#94adb0}.float-tag{position:absolute;background:#10283a;border:1px solid #2c5965;padding:10px 15px;font-size:10px;letter-spacing:1px;z-index:2;box-shadow:0 10px 30px #0005}.tag-top{top:55px;right:0;color:var(--cyan)}.tag-bottom{bottom:38px;left:0;color:#c7d5db}.tag-bottom b{color:var(--cyan);padding:0 6px}.trust-strip{border-block:1px solid var(--line);padding:22px 8vw;display:flex;align-items:center;justify-content:space-between;gap:20px;color:#93a5b3;font-size:11px}.trust-strip div{font-size:10px;letter-spacing:1.5px;color:#d7e2e8}.trust-strip b{color:var(--cyan);margin-right:9px}.section{padding:110px max(8vw,28px)}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:48px}.section-heading h2,.process-intro h2,.contact-inner h2{font-size:clamp(32px,4vw,48px);line-height:1.25;letter-spacing:-1.5px;margin:15px 0 0}.section-heading>p{max-width:390px;color:var(--muted);font-size:13px;line-height:1.9;margin:0}.service-grid,.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.service-card{background:#0b1b2b;border:1px solid var(--line);padding:30px;min-height:290px;transition:.25s}.service-card:hover{border-color:#4bbdbd;transform:translateY(-5px)}.service-card.featured{background:linear-gradient(145deg,#10303c,#0c1d2e);border-color:rgba(98,229,227,.45)}.service-number{font-size:9px;letter-spacing:1.8px;color:#8da2b1}.service-icon{font-size:30px;color:var(--cyan);margin:24px 0 12px}.service-card h3{font-size:20px;margin:0 0 12px}.service-card p{font-size:12px;color:var(--muted);line-height:1.9;min-height:68px}.service-card>a{display:inline-block;color:var(--cyan);font-size:11px;text-decoration:none;margin-top:10px}.work{background:#0a1928}.work-card{padding:17px;border:1px solid var(--line);background:#102234}.work-light{background:#e7e9e5;color:#17262b}.work-blue{background:#123b50}.work-top{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1px;color:#91a8b5}.work-light .work-top{color:#62747a}.work-art{height:270px;margin-top:16px;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding:25px}.corporate-art{background:#1c3036}.art-grid{position:absolute;inset:0;background-image:linear-gradient(#ffffff0d 1px,transparent 1px),linear-gradient(90deg,#ffffff0d 1px,transparent 1px);background-size:25px 25px}.corporate-art>b,.portfolio-art>b,.product-art>b{font-size:36px;line-height:.98;letter-spacing:-2px;position:relative;z-index:1}.corporate-art i{font-style:normal;color:#8de0d4}.work-art small{font-size:7px;letter-spacing:1.4px;margin-top:22px;position:relative;z-index:1;color:#b3c5c4}.portfolio-art{background:#d8d6cb;color:#1c3030}.portfolio-art>b{font-size:39px}.portfolio-art i{font-style:normal;color:#b16c4e}.portfolio-art small{color:#586c67}.portfolio-circle{position:absolute;width:170px;height:170px;border-radius:50%;right:-35px;top:10px;background:linear-gradient(135deg,#c68a69,#e5c8a5)}.product-art{background:linear-gradient(135deg,#0d3548,#176178)}.product-art>b{font-size:42px}.product-art i{font-style:normal;color:#67e6df}.product-orb{position:absolute;width:190px;height:190px;border-radius:50%;right:-35px;bottom:-55px;background:radial-gradient(circle at 30% 30%,#b0ffff,#2c9eaa 45%,#12425d 70%);box-shadow:0 0 45px #51d5d5aa}.work-caption{display:flex;justify-content:space-between;align-items:center;padding:18px 2px 4px}.work-caption h3{font-size:15px;margin:0 0 4px}.work-caption p{font-size:10px;color:#9babb3;margin:0}.work-light .work-caption p{color:#687a7c}.work-caption>span{font-size:20px;color:var(--cyan)}.work-light .work-caption>span{color:#2c8c8b}.concept-note{display:flex;gap:12px;margin-top:22px;color:#8fa4b2;font-size:11px}.concept-note span:first-child{color:var(--cyan)}.process-section{background:linear-gradient(110deg,#0d2435,#081624)}.process-inner{display:grid;grid-template-columns:.8fr 1.2fr;gap:9vw}.process-intro p,.contact-inner>div>p{color:var(--muted);font-size:13px;line-height:2;max-width:360px;margin:25px 0 30px}.button-outline{border:1px solid #5acbc9;color:var(--cyan);background:transparent}.button-outline:hover{background:#143b47}.steps{border-top:1px solid var(--line)}.step{display:grid;grid-template-columns:45px 1fr 20px;gap:20px;padding:23px 0;border-bottom:1px solid var(--line)}.step>span{font-size:11px;color:var(--cyan);padding-top:4px}.step h3{font-size:16px;margin:0 0 5px}.step p{font-size:11px;color:var(--muted);margin:0;line-height:1.8}.step>b{color:#6acdc9}.contact-section{position:relative;background:#06111e}.contact-glow{right:auto;left:-150px;top:-100px}.contact-inner{display:grid;grid-template-columns:1fr 1fr;gap:10vw;position:relative}.contact-inner h2{font-size:clamp(38px,4.5vw,56px);margin-top:20px}.contact-inner>div>p{margin:25px 0}.email-link{color:var(--cyan);font-size:14px;text-decoration:none;border-bottom:1px solid #397d82;padding-bottom:8px}.contact-form{background:#0c1d2d;border:1px solid var(--line);padding:30px;display:flex;flex-direction:column;gap:17px}.contact-form label{display:flex;flex-direction:column;gap:7px}.contact-form label span{font-size:10px;color:#b7c5cf}.contact-form input,.contact-form select,.contact-form textarea{width:100%;background:#071522;border:1px solid #243b4d;color:#edf4f7;padding:12px;font:inherit;font-size:12px;outline:none;border-radius:0}.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:var(--cyan)}.contact-form textarea{resize:vertical}.contact-form select option{background:#071522}.submit-button{width:100%;justify-content:space-between}.contact-form>small{font-size:9px;color:#8094a3;line-height:1.7}.footer{padding:25px max(6vw,24px);border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px;color:#8295a5;font-size:9px}.footer>a:last-child{color:var(--cyan);text-decoration:none;letter-spacing:1px}
@media(max-width:900px){.hero{grid-template-columns:1fr;padding-top:75px}.hero-visual{height:420px}.hero-meta{gap:22px}.section-heading{align-items:start;flex-direction:column;gap:15px}.service-grid,.work-grid{grid-template-columns:1fr 1fr}.service-card:last-child,.work-card:last-child{grid-column:span 2}.process-inner{grid-template-columns:1fr;gap:55px}.contact-inner{gap:45px}.trust-strip{flex-wrap:wrap}.trust-strip>span{width:100%}}
@media(max-width:620px){.header{height:70px}.menu-toggle{display:block}.nav{display:none;position:absolute;top:69px;left:0;right:0;background:#0a1a2a;padding:20px 25px 25px;flex-direction:column;align-items:flex-start;gap:20px;border-bottom:1px solid var(--line)}.nav.open{display:flex}.hero{padding:70px 25px 55px;min-height:0}.hero h1{font-size:43px}.hero-actions{margin-bottom:45px}.hero-meta{gap:18px}.hero-meta div{min-width:40%}.hero-visual{height:350px;margin-top:5px}.visual-orbit{width:330px;height:330px}.orbit-two{width:370px;height:370px}.visual-card{height:280px}.mock-page{height:250px;padding:20px}.mock-heading{font-size:31px}.tag-top{right:-5px;top:25px}.tag-bottom{left:-8px;bottom:18px}.trust-strip{padding:20px 25px}.trust-strip div{font-size:9px}.section{padding:75px 25px}.section-heading h2,.process-intro h2{font-size:34px}.service-grid,.work-grid{grid-template-columns:1fr}.service-card:last-child,.work-card:last-child{grid-column:auto}.service-card{min-height:0}.service-card p{min-height:0}.work-art{height:250px}.contact-inner{grid-template-columns:1fr}.contact-inner h2{font-size:42px}.contact-form{padding:22px}.footer{flex-wrap:wrap}.footer>span{order:3;width:100%}}
