:root{--ink:#143a91;--muted:#5b6d90;--paper:#f3f6ff;--line:#d4dff5;--orange:#79b7ff;--green:#e4ecff}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;color:var(--ink);background:var(--paper);font:16px/1.8 "Microsoft JhengHei","Segoe UI",sans-serif}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button,a,input,textarea,select{touch-action:manipulation}button{cursor:pointer}img{max-width:100%;display:block}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--orange);outline-offset:5px}.wrap{width:min(1200px,88%);margin:auto}.skip{position:fixed;top:-100px;left:15px;z-index:99;background:white;padding:10px}.skip:focus{top:10px}header{position:sticky;top:0;z-index:20;background:#092765f5;border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}.nav{display:flex;align-items:center;justify-content:space-between;min-height:90px;gap:24px}.logo,.flogo{display:flex;align-items:center;gap:10px}.mark,.flogo img:first-child{height:42px;width:auto}.word,.flogo img:last-child{width:130px;height:auto}.menu{display:flex;gap:27px;align-items:center;font-size:14px;font-weight:600}.menu a:hover{color:#a6d5ff}.cta{padding:10px 20px;background:var(--ink);color:white;border-radius:5px}.burger{display:none;border:1px solid var(--line);background:none;border-radius:5px;padding:5px 12px}.hero{position:relative;min-height:730px;display:flex;align-items:center;overflow:hidden;border-bottom:1px solid var(--line)}.hero>.wrap>div{width:53%;padding:65px 0 100px}.badge,.tag,.no,.art-label,.art-foot,.mono{font-size:12px;letter-spacing:2px;font-weight:700}.badge{display:flex;gap:10px;align-items:center}.badge i{width:7px;height:7px;background:var(--orange);border-radius:50%}h1{font-size:clamp(42px,4.9vw,70px);letter-spacing:-3px;line-height:1.3;margin:27px 0 20px;font-weight:800}.grad{color:#8fcbff}.hero-caption{font-size:15px;letter-spacing:3px}.lead{max-width:540px;color:var(--muted);font-size:15px;line-height:2}.btns{display:flex;gap:12px;margin:30px 0}.btn{display:inline-flex;justify-content:center;align-items:center;min-height:49px;padding:10px 23px;border-radius:5px;border:1px solid var(--ink);font-weight:600;font-size:14px}.p{background:var(--ink);color:white}.p:hover,.cta:hover{background:#245de0;color:white}.o{background:transparent}.o:hover{background:var(--green)}.stats{display:flex;gap:45px;margin-top:44px}.stats>div{display:flex;flex-direction:column}.stats b{font-size:31px;line-height:1.4}.stats span{font-size:12px;color:var(--muted);letter-spacing:1px}.scroll-hint{position:absolute;bottom:25px;left:6%;font-size:12px;letter-spacing:2px}.hero-art{position:absolute;right:5%;width:37%;height:470px;top:100px;background:#244fb5;border-radius:50% 50% 8px 8px}.orbit{position:absolute;width:110%;height:80%;border:1px solid #5483e0;border-radius:50%;left:-5%;top:12%;transform:rotate(-30deg)}.art-label{position:absolute;top:35px;left:40px;font-size:10px}.art-window{position:absolute;top:90px;left:-10px;right:15px;background:var(--paper);border:1px solid var(--ink);border-radius:8px;box-shadow:15px 18px 0 #143a9115;transform:rotate(-5deg)}.window-bar{border-bottom:1px solid var(--line);padding:12px 16px;display:flex;align-items:center;gap:5px}.window-bar i{width:6px;height:6px;background:#7d9dde;border-radius:50%}.window-bar span{margin-left:auto;font:10px monospace;color:var(--muted)}.window-body{padding:28px}.window-body small{font-size:9px;letter-spacing:2px}.window-body strong{display:block;font-size:43px;line-height:1.3;margin:15px 0}.window-body strong span{float:right;font-size:65px;color:var(--orange)}.art-lines i{display:block;background:#c3d4fa;height:5px;width:65%;margin:10px 0}.art-lines i:last-child{width:45%}.art-tiles{display:flex;gap:8px;margin-top:24px}.art-tiles span{background:var(--green);padding:10px 7px;font-size:9px;letter-spacing:1px;flex:1;text-align:center}.art-stamp{position:absolute;right:-25px;bottom:60px;background:var(--orange);width:125px;height:125px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;transform:rotate(12deg);font-size:17px}.art-stamp b{font-size:10px;letter-spacing:2px}.art-foot{position:absolute;bottom:-35px;left:20px;font-size:10px;letter-spacing:1px}section{padding:95px 0}.head{margin-bottom:38px}.tag{color:#2455c9;margin-bottom:10px}h2{font-size:36px;line-height:1.4;letter-spacing:-1px;margin:0 0 12px}h3{font-size:20px;line-height:1.5;margin:10px 0}.head p{color:var(--muted);margin:0}.svc{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.panel{border:1px solid var(--line);background:#ffffff;border-radius:8px;padding:30px}.svc .panel{transition:transform .2s,border-color .2s}.svc .panel:hover{transform:translateY(-5px);border-color:#487deb}.top{display:flex;justify-content:space-between;gap:15px}.no{color:#7790c5}.ic{width:39px;height:39px;color:#3565c9}.ic svg{width:100%}.panel p,.panel li{color:var(--muted);font-size:14px}.panel ul{padding-left:20px}.svc .panel:last-child{grid-column:span 2;background:var(--ink);color:white}.svc .panel:last-child p,.svc .panel:last-child li,.svc .panel:last-child .ic{color:#dce9ff}#works{background:#eaf0ff;border-block:1px solid var(--line)}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:30px}.tabs button{border:1px solid #bccdef;background:transparent;color:var(--ink);padding:9px 19px;border-radius:30px;font-size:13px}.tabs button.on{background:var(--ink);border-color:var(--ink);color:white}.works{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.work.panel{padding:0;overflow:hidden;transition:transform .2s,box-shadow .2s}.work:hover{transform:translateY(-4px);box-shadow:0 10px 25px #143a9110}.shot{aspect-ratio:16/10;background:#dce6fc;overflow:hidden}.shot img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .4s}.work:hover img{transform:scale(1.04)}.shot.missing{display:flex;align-items:center;justify-content:center;padding:20px;color:var(--muted);font-size:14px}.wb{padding:22px}.t{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);letter-spacing:1px}.t em{font-style:normal}.url{font-size:12px;color:var(--muted)}.hide{display:none!important}.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:20px}.step{border-top:1px solid #aec4ee;padding-top:22px}.n{font-size:30px;color:#2455c9}.step h3{font-size:18px}.step p{font-size:13px;color:var(--muted)}#about{background:#e3ecff}.about{display:grid;grid-template-columns:1.1fr 1fr;gap:80px;align-items:center}.about p{font-size:15px;color:var(--muted)}.hud{background:transparent;border:0;padding:0}.hud>div{padding:20px 0;border-bottom:1px solid #b4c8f0;display:flex;align-items:center;gap:30px}.hud b{font-size:34px;min-width:95px}.hud span{font-size:14px}.mods{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.mods>span{padding:20px;border:1px solid var(--line);border-radius:5px;display:flex;gap:15px;align-items:center}.mods b{color:#7997d0;font-weight:400}.mods b:last-child{margin-left:auto}#contact{background:var(--ink);color:var(--paper)}#contact .tag{color:#9ed1ff}#contact .head p{color:#c7dbff}.contact{display:grid;grid-template-columns:1fr 1.1fr;gap:30px;align-items:start}.info{background:transparent;border-color:#476eac;padding:30px}.info>div:not(.line){display:flex;gap:20px;margin:22px 0;font-size:14px}.k{width:65px;flex-shrink:0;font-size:10px;color:#cedfff;letter-spacing:1px}.line{display:flex;gap:25px;align-items:center;border-bottom:1px solid #476eac;padding-bottom:30px;margin-bottom:30px}.line img{width:105px;border-radius:5px}.lt{display:flex;flex-direction:column;gap:7px}.lt>span{font-size:12px;color:#cedfff}.lbtn{font-size:12px;text-decoration:underline;text-underline-offset:5px}.inquiry{color:var(--ink)}.inquiry h3{margin-top:0}.inquiry>p{margin-bottom:25px}label{display:flex;flex-direction:column;font-size:13px;gap:7px;margin-bottom:18px}.two{display:grid;grid-template-columns:1fr 1fr;gap:15px}input:not([type=submit]),select,textarea{border:1px solid #c2d2f1;background:var(--paper);padding:11px;color:var(--ink);width:100%;border-radius:4px}textarea{min-height:125px;resize:vertical}.inquiry .privacy{font-size:12px}.note{font-size:13px;margin-top:12px}.note:empty{display:none}footer{padding:35px 0}footer .wrap{display:flex;align-items:center;justify-content:space-between;gap:25px;flex-wrap:wrap}footer .wrap>span:not(.flogo){font-size:11px;color:var(--muted)}.flogo img:first-child{height:30px}.flogo img:last-child{width:95px}.divider{display:none}@media(min-width:1100px){.svc .panel:nth-child(4){grid-column:span 1}}@media(max-width:1000px){.menu{gap:15px;font-size:12px}.hero-art{right:4%;width:35%;top:140px}.window-body{padding:20px}.window-body strong{font-size:34px}.art-stamp{width:100px;height:100px;right:-10px}.about{gap:40px}.works{gap:15px}.panel{padding:24px}}@media(max-width:760px){.nav{min-height:75px}.burger{display:block}.menu{display:none;position:absolute;top:75px;left:0;width:100%;padding:22px 6%;background:var(--paper);border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;gap:0;font-size:15px}.menu.open{display:flex}.menu a{padding:12px}.hero{display:block;min-height:0;padding-bottom:75px}.hero>.wrap>div{width:100%;padding:50px 0 25px}h1{font-size:47px}.hero-art{position:relative;top:auto;right:auto;width:78%;height:400px;margin:20px auto 50px}.art-window{top:65px}.window-body strong{font-size:38px}.art-stamp{bottom:30px;right:-30px}.art-label{top:25px}.hero .lead{max-width:100%}.stats{gap:40px}.svc{grid-template-columns:1fr 1fr}.svc .panel:last-child{grid-column:span 2}.works{grid-template-columns:1fr 1fr}.steps{grid-template-columns:1fr 1fr}.about,.contact{grid-template-columns:1fr;gap:35px}.mods{grid-template-columns:1fr 1fr}section{padding:65px 0}h2{font-size:29px}.head{margin-bottom:28px}.logo .word{width:115px}.badge{font-size:10px;letter-spacing:1.5px}footer .wrap{flex-direction:column;align-items:start}}@media(max-width:480px){.svc,.works,.mods,.two{grid-template-columns:1fr}.svc .panel:last-child{grid-column:auto}.hero-art{width:84%;height:390px}.art-window{right:0}.art-stamp{right:-10px}.btns{gap:8px}.btn{padding-inline:17px}.stats{justify-content:space-between;gap:15px}.stats b{font-size:28px}.panel{padding:24px}.work.panel{padding:0}.line{gap:15px}.line img{width:90px}.info>div:not(.line){gap:10px}h1{font-size:42px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
/* Royal blue brand surfaces keep the white wordmark legible. */
header{background:#092765f5;border-bottom-color:#31579c;color:#fff}
.logo .word,.flogo img:last-child{filter:brightness(0) invert(1)}
.menu a:hover{color:#b6dcff}.menu .cta{background:#fff;color:#1744ad}.menu .cta:hover{background:#dceaff;color:#092765}
.burger{color:#fff;border-color:#6c91d0}
.hero{background:radial-gradient(ellipse at 88% 30%,#2c65e4 0,transparent 55%),linear-gradient(115deg,#092765,#1745b0 70%,#215bda);color:#fff;border-bottom-color:#4268ae}
.hero .lead,.hero .stats span{color:#d0e1ff}.hero-caption,.badge{color:#dce9ff}.hero .stats b{color:#fff}.hero .grad{color:#94d4ff}
.hero .p{background:#fff;color:#1744ad;border-color:#fff}.hero .p:hover{background:#dfedff}.hero .o{color:#fff;border-color:#93b7fa}.hero .o:hover{background:#ffffff18}.scroll-hint{color:#dce9ff}
.hero-art{background:linear-gradient(155deg,#3a74ed,#1943a5);border:1px solid #ffffff26}.orbit{border-color:#92bbff70}.art-label,.art-foot{color:#e1edff}
.art-window{background:#f6f9ff;color:#143a91;border-color:#83a9f1;box-shadow:15px 18px 0 #061c5738}.art-stamp{background:#b2dbff;color:#103581;border:1px solid #d9eeff}
.svc .panel:last-child{background:linear-gradient(130deg,#1644b1,#2463de)}
#contact{background:linear-gradient(120deg,#092765,#1745ad);color:#fff}.inquiry{background:#fff;color:#143a91}
footer{background:#071e50;color:#fff;border-top:1px solid #31579c}footer .wrap>span:not(.flogo){color:#cfddf8}
@media(max-width:760px){.menu{background:#092765;border-bottom-color:#4268ae}}
.contact-map{padding:0;overflow:hidden;background:#fff;color:#143a91;border-color:#476eac}
.contact-map iframe{display:block;width:100%;height:390px;border:0;background:#dce6fc}
.map-caption{display:flex;flex-wrap:wrap;gap:10px 20px;justify-content:space-between;padding:18px 22px;font-size:12px}.map-caption a{font-weight:700;text-decoration:underline;text-underline-offset:4px}
@media(max-width:760px){.contact-map iframe{height:340px}}

.shot-brand{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;padding:24px;background:linear-gradient(135deg,#f6f9ff,#dce8ff)}
.shot-brand img{width:85%;height:auto;max-height:95px;object-fit:contain;object-position:center}.shot-brand>span{font-size:16px;font-weight:700;text-align:center;color:#143a91}
