:host{color-scheme:dark;--bg:#010b2e;--text:#f8faff;--muted:#9bb4d6;--ease:cubic-bezier(.2,.75,.25,1)}*{box-sizing:border-box}:host{margin:0;background:var(--bg);color:var(--text);font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;-webkit-font-smoothing:antialiased}button,input,textarea{font:inherit}button{cursor:pointer}button:focus-visible{outline:3px solid #91cfff;outline-offset:6px}#viewport{position:relative;overflow:hidden;min-height:100svh}.stage{width:1920px;height:1080px;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(var(--scale,1));transform-origin:center}.brand-scene{position:absolute;right:0;top:0;width:940px;height:480px;mask-image:linear-gradient(to right,transparent 0%,#000 18%,#000 94%,transparent 100%);isolation:isolate}.brand-scene:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(to bottom,transparent 78%,#010b2e 100%)}.brand-scene img{width:100%;height:100%;transition:filter .4s}.brand-scene:hover img{filter:brightness(1.03)}.intro{position:absolute;left:280px;top:128px}.eyebrow{display:flex;align-items:center;gap:12px;color:#57c2ff;font-size:20px;letter-spacing:2px}.eyebrow i{display:block;background:#00c6f2;width:33px;height:4px;border-radius:8px}.module-title{font-size:48px;font-weight:700;letter-spacing:2px;line-height:1.3;margin:12px 0 32px}.module-title span{display:block}.module-title span+span{margin-top:18px}.intro p{font-size:23px;letter-spacing:1px;line-height:1.8;margin:0}.stats{position:absolute;left:280px;top:482px;width:1360px;height:110px;border-top:1px solid #29456b;display:grid;grid-template-columns:414px 477px 469px;padding-top:27px}.stat{display:flex;align-items:center;justify-content:center;gap:29px;height:70px;position:relative;transition:transform .24s var(--ease),filter .24s}.stat+.stat:before{content:"";position:absolute;left:0;height:56px;top:14px;width:1px;background:#315586}.stat strong{font-weight:700;line-height:1;background:linear-gradient(#a9dfff,#1470ff);background-clip:text;-webkit-text-fill-color:transparent;white-space:nowrap}.stat b{font-size:80px;font-variant-numeric:tabular-nums;font-family:Arial,sans-serif;letter-spacing:1px}.stat small{font-size:42px;margin-left:4px}.stat span{font-size:23px;letter-spacing:1px}.stat:hover{transform:translateY(-3px);filter:brightness(1.2)}.card-wrap{position:absolute;left:280px;top:620px;width:1360px;height:240px}.contact-card{width:100%;height:100%;border:2px solid #0062ad;border-radius:27px;background:linear-gradient(104deg,#021433 10%,#031b4a 31%,#0344cc 75%,#04348e);padding:43px 55px;display:flex;align-items:center;justify-content:space-between;position:relative;overflow:hidden;transition:transform .28s var(--ease),border-color .28s,box-shadow .28s}.contact-card:hover{transform:translateY(-6px);border-color:#268aef;box-shadow:0 18px 45px #0004}.spotlight{position:absolute;inset:0;pointer-events:none;opacity:0;background:radial-gradient(450px circle at var(--mx,75%) var(--my,50%),#5c9dff29,transparent 75%);transition:opacity .3s}.contact-card:hover .spotlight{opacity:1}.card-copy,.card-action{position:relative}.card-copy h2{font-size:38px;letter-spacing:1px;margin:0 0 18px}.card-copy p{font-size:22px;margin:0 0 15px}.services{font-size:20px;color:#7cb3f7;letter-spacing:2px}.card-action{text-align:center}.primary{border:1px solid #7fb6ff66;border-radius:28px;color:white;background:linear-gradient(110deg,#26b9f1,#0044ff 90%);font-size:25px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:17px;height:72px;min-width:344px;position:relative;transition:transform .22s var(--ease),filter .22s,box-shadow .22s;background-size:125% 100%}.primary:hover{transform:translateY(-2px) scale(1.02);filter:brightness(1.12);box-shadow:0 8px 24px #006cff30;background-position:100% 0}.primary:active{transform:scale(.98)}.primary .arrow{transition:transform .24s;display:inline-block;font-size:29px;font-weight:400}.primary:hover .arrow{transform:translateX(5px)}.consult{width:336px;min-width:0;height:84px;background:linear-gradient(110deg,#4a9cf6,#103dff);border-radius:28px}.consult:hover .arrow{transform:translate(4px,-4px)}.card-action p{font-size:16px;margin:24px 0 0;color:#cae4ff}.contact-card:hover .consult{filter:brightness(1.08)}.reveal{opacity:0;translate:0 20px;transition:opacity .72s var(--ease),translate .72s var(--ease);transition-delay:var(--delay)}:host(.ready) .reveal{opacity:1;translate:0 0}.overlay{position:fixed;inset:0;z-index:10;display:grid;place-items:center;background:#01091d00;backdrop-filter:blur(0);opacity:0;visibility:hidden;transition:opacity .28s,background .28s,backdrop-filter .28s,visibility .28s}.overlay.open{opacity:1;visibility:visible;background:#01091db8;backdrop-filter:blur(12px)}.modal-shell{position:relative;width:1194px;height:880px;transform:translateY(20px) scale(calc(var(--modal-scale,1) * .96));transition:transform .38s var(--ease)}.open .modal-shell{transform:translateY(0) scale(var(--modal-scale,1))}.modal{position:relative;width:1194px;height:880px;background:#031638;border:2px solid #164778;border-radius:23px;box-shadow:0 35px 100px #0006;overflow:hidden}.small-brand{position:absolute;left:57px;top:37px;width:189px;height:41px}.close{position:absolute;right:30px;top:30px;width:46px;height:46px;border-radius:50%;border:1px solid #1c4f8d;background:transparent;display:grid;place-items:center;transition:background .2s;z-index:2}.close span{width:21px;height:21px;position:relative;transition:transform .25s}.close span:before,.close span:after{content:"";position:absolute;left:10px;top:0;width:1.5px;height:21px;background:#fff;transform:rotate(45deg)}.close span:after{transform:rotate(-45deg)}.close:hover{background:#14396b}.close:hover span{transform:rotate(90deg)}.left{position:absolute;left:62px;top:110px;width:405px;height:690px;border-right:1px solid #185595}.left h2{font-size:54px;margin:10px 0 16px;line-height:1.3;letter-spacing:2px}.tagline{font-size:28px;margin:0;color:#d2e3f8}.qr-wrap{width:267px;height:267px;margin:73px 0 70px;border-radius:20px;overflow:hidden;transition:transform .25s,box-shadow .25s}.qr-wrap img{display:block;width:100%;height:100%}.qr-wrap:hover{transform:translateY(-4px);box-shadow:0 15px 32px #0005}.left h3{font-size:33px;margin:0 0 15px}.qr-caption{font-size:25px;margin:0 0 20px}.muted{color:#a8bedc}.left-note{font-size:20px;letter-spacing:.3px;margin:0;white-space:nowrap}.right{position:absolute;left:527px;top:108px;width:602px;height:730px}.field{position:relative;margin-bottom:32px}.field label{display:block;font-size:20px;font-weight:500;margin-bottom:10px;transition:color .2s}.field:focus-within label{color:#70beff}input,textarea{display:block;width:100%;border:2px solid #234b79;background:#0d2346;border-radius:13px;outline:none;color:#f1f7ff;padding:18px 21px;font-size:21px;transition:border-color .2s,background .2s,box-shadow .2s}input{height:70px}textarea{height:128px;resize:none;line-height:1.6}input::placeholder,textarea::placeholder{color:#89a8cd;opacity:1}input:hover,textarea:hover{border-color:#3b6b9e}input:focus,textarea:focus{border-color:#338ffa;background:#102a52;box-shadow:0 0 0 3px #2379ed14}.field.invalid input,.field.invalid textarea{border-color:#d7868f}.error{position:absolute;left:3px;bottom:-24px;font-size:15px;color:#f3a4ac}.idea-field{margin-bottom:32px}.submit{border-radius:38px}.form-note{font-size:20px;margin:20px 0 0}.demo-note{font-size:14px;color:#718cb1;margin:10px 0 0}.primary:disabled{cursor:wait;transform:none;filter:none}.loading .arrow{font-size:0;width:21px;height:21px;border:2px solid #ffffff55;border-top-color:white;border-radius:50%;animation:spin .7s linear infinite}.success{height:100%;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;animation:successIn .4s var(--ease)}[hidden]{display:none!important}.success h3{font-size:38px;margin:18px 0}.success p{font-size:23px;line-height:1.8;color:#b7cbea;margin:0}.success .success-note{font-size:17px;color:#7d9bc2;margin:18px 0 34px}.success-tag{font-size:16px;color:#6cbbff;letter-spacing:2px;margin-top:25px}.check{width:86px;height:86px;border-radius:50%;background:#12366c;border:1px solid #337ded}.check svg{width:100%;height:100%;stroke:#7cc7ff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.check path{stroke-dasharray:60;stroke-dashoffset:60;animation:draw .5s .15s forwards}.open .left,.open .right{animation:successIn .45s .06s both}.open .right{animation-delay:.12s}@keyframes draw{to{stroke-dashoffset:0}}@keyframes spin{to{rotate:360deg}}@keyframes successIn{from{opacity:0;translate:0 10px}to{opacity:1;translate:0 0}}
/* Match the approved 1920 x 1080 artboard. Keep every modal row inside its frame. */
#viewport{background:radial-gradient(ellipse calc(600px * var(--scale,1)) calc(440px * var(--scale,1)) at calc(50% + 880px * var(--scale,1)) calc(50% - 490px * var(--scale,1)),#022885a8 0%,#00174666 58%,transparent 100%),#010b2e}
@media(min-width:761px){
.modal-shell{position:absolute;left:50%;top:50%;transform:translate(-50%,calc(-50% + 20px)) scale(calc(var(--modal-scale,1) * .96));transform-origin:center}
.open .modal-shell{transform:translate(-50%,-50%) scale(var(--modal-scale,1))}
.right{top:110px;height:730px}
#contactForm{position:relative;height:730px}
.field{position:absolute;left:0;right:0;margin:0}
.field:nth-child(1){top:0}.field:nth-child(2){top:138px}.field:nth-child(3){top:276px}.field:nth-child(4){top:419px}
.field label{height:24px;line-height:24px;margin:0 0 10px}
input,textarea{line-height:28px}
.field .error{top:108px;bottom:auto;line-height:20px}
.idea-field .error{top:166px}
.submit{position:absolute;left:0;top:610px;height:72px}
.form-note{position:absolute;left:0;top:704px;margin:0;line-height:28px;font-size:20px;white-space:nowrap}
.demo-note{position:absolute;left:366px;top:625px;width:220px;margin:0;font-size:14px;line-height:22px;color:#88a3c6}
.modal .left h2{line-height:1.3}
}
@media(max-width:760px){#viewport{min-height:auto}.stage{position:relative;left:0;top:0;transform:none;width:100%;height:auto;min-height:100svh;padding:70px 24px}.brand-scene{width:55%;height:auto;aspect-ratio:940/480;opacity:.5}.intro{position:relative;left:auto;top:auto}.eyebrow{font-size:14px}.module-title{font-size:27px;letter-spacing:0;margin-top:22px}.module-title span+span{margin-top:15px}.intro p{font-size:15px;letter-spacing:0;line-height:1.9}.intro br{display:none}.stats{position:relative;left:auto;top:auto;width:100%;height:auto;grid-template-columns:repeat(3,1fr);padding:25px 0;margin-top:35px}.stat{flex-direction:column;gap:10px;height:auto}.stat b{font-size:35px}.stat small{font-size:20px}.stat span{font-size:12px;letter-spacing:0}.stat+.stat:before{height:45px;top:5px}.card-wrap{position:relative;left:auto;top:auto;width:100%;height:auto;margin-top:24px}.contact-card{padding:28px 22px;display:block;border-radius:20px}.card-copy h2{font-size:22px}.card-copy p{font-size:15px;line-height:1.8}.services{font-size:13px;letter-spacing:0}.card-action{text-align:left;margin-top:26px}.consult{width:100%;height:58px;font-size:19px;border-radius:18px}.card-action p{font-size:12px;text-align:center;margin-top:16px}.overlay{padding:16px;overflow:auto;align-items:start}.modal-shell,.open .modal-shell{width:100%;height:auto;transform:none;margin:auto}.modal{width:100%;height:auto;overflow:visible;padding:28px 22px;border-radius:20px}.small-brand{position:static;width:150px;height:auto}.close{right:18px;top:22px;width:36px;height:36px}.left{position:relative;left:auto;top:auto;width:100%;height:auto;border:0;margin-top:26px;padding-bottom:24px}.left h2{font-size:31px;margin-top:0}.tagline{font-size:18px}.qr-wrap{width:136px;height:136px;margin:25px 0 18px;border-radius:12px}.left h3{font-size:22px}.qr-caption{font-size:17px}.left-note{font-size:13px;white-space:normal}.right{position:relative;left:auto;top:auto;width:100%;height:auto;border-top:1px solid #234b79;padding-top:26px}.field{margin-bottom:26px}.field label{font-size:16px}input,textarea{font-size:16px;padding:14px}input{height:52px}textarea{height:108px}.primary{min-width:0;width:100%;height:55px;font-size:19px}.form-note{font-size:14px;line-height:1.6}.demo-note{font-size:12px}.success{padding:30px 0}.success h3{font-size:28px}.success p{font-size:17px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;transition-delay:0ms!important;scroll-behavior:auto!important}.reveal{opacity:1;translate:none}}

:host{display:block;position:relative;--u:min(1px,.052083333333vw);font-size:16px;background:#020b25;color:#f5f8ff}section{scroll-margin-top:90px}button,a,input,textarea{touch-action:manipulation}section,article,div{box-sizing:border-box}.overlay{z-index:300}dialog::backdrop{background:#00071bc9;backdrop-filter:blur(12px)}@media(max-width:760px){:host{--u:1px}}
:host{background:#020b25}#viewport{min-height:0;height:calc(930px * var(--scale,1));background:linear-gradient(to bottom,#020b25,transparent 22%,transparent 78%,#020b25),radial-gradient(ellipse at 103% 0%,#02288577,transparent 47%),#020b25}.stage{top:0;height:930px;transform:translateX(-50%) scale(var(--scale,1));transform-origin:center top}.overlay{z-index:300}.modal{background:#031638}.brand-scene:after{background:linear-gradient(to bottom,transparent 72%,#020b25)}.brand-scene img{object-fit:contain}.modal-shell{will-change:transform}.left h2{line-height:1.3}.intro .module-title{font-size:48px;line-height:1.3;margin:12px 0 32px;font-weight:700;letter-spacing:2px}.intro .module-title>span{display:block}.intro .module-title>span+span{margin-top:18px}
/* Keep the closed dialog out of paint while the shadow stylesheet loads.
   Opening removes hidden; closing restores it after the existing fade-out. */
.overlay[hidden]{display:none!important}
/* Anchor the artwork to the viewport edge, preserving the 940:480 asset ratio.
   Two intersecting masks remove the rectangular top seam and left edge. */
.brand-scene{right:min(0px,calc((1920px - 100vw) / 2));
 -webkit-mask-image:linear-gradient(to right,transparent,#000 22%),linear-gradient(to bottom,transparent,#000 21%,#000 74%,transparent);
 mask-image:linear-gradient(to right,transparent,#000 22%),linear-gradient(to bottom,transparent,#000 21%,#000 74%,transparent);
 -webkit-mask-composite:source-in;mask-composite:intersect}
.brand-scene:after{background:linear-gradient(to bottom,transparent 62%,#020b25)}
.small-brand{height:auto;object-fit:contain}
@media(max-width:760px){#viewport{height:auto}.stage{position:relative;left:0;top:0;transform:none;width:100%;height:auto;min-height:0;padding:55px 22px 65px}.intro .module-title{font-size:27px;letter-spacing:0;margin-top:22px}.brand-scene{height:auto;right:0}.intro{position:relative;left:auto;top:auto}.stats{position:relative;left:auto;top:auto;width:100%;height:auto;grid-template-columns:repeat(3,1fr);margin-top:35px}.card-wrap{position:relative;left:auto;top:auto;width:100%;height:auto;margin-top:24px}.intro p{font-size:15px}.stat b{font-size:35px}.stat small{font-size:20px}.stat span{font-size:12px}.stat{flex-direction:column;gap:10px}.contact-card{padding:28px 22px;display:block}.card-copy h2{font-size:22px}.card-copy p{font-size:15px;line-height:1.8}.services{font-size:13px}.card-action{margin-top:26px}.consult{width:100%;height:58px;font-size:19px}.card-action p{font-size:12px}.modal-shell,.open .modal-shell{position:relative;left:auto;top:auto;transform:none}.overlay{overflow-y:auto;overscroll-behavior:contain}}

@media(min-width:761px){
 .right{top:185px;height:600px}
 #contactForm{height:auto}
 #contactForm .field{position:relative;top:auto;left:auto;right:auto;margin:0 0 34px}
 #contactForm textarea{height:220px}
 #contactForm .idea-field .error{top:auto;bottom:-24px}
 #contactForm .submit{position:relative;top:auto;left:auto}
 #contactForm .form-note{position:static;margin:20px 0 0;white-space:normal}
 #contactForm .demo-note{position:static;width:auto;margin:12px 0 0}
}