*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:linear-gradient(135deg,#0a0a0f,#1a1a2e 50%,#0a0a0f);background-attachment:fixed;color:#fff;font-family:Noto Sans TC,微軟正黑體,PingFang TC,sans-serif}#app,body{min-height:100vh}#app{display:flex;flex-direction:column;font-family:inherit}.navbar{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#0a0a0af2;border-bottom:1px solid rgba(0,255,255,.1);padding:0;position:fixed;top:0;width:100%;z-index:1000}.nav-container{height:70px;justify-content:space-between;margin:0 auto;max-width:1200px;padding:0 20px}.nav-container,.nav-logo{align-items:center;display:flex}.nav-logo{gap:12px}.logo-icon{perspective:1000px}.logo-cube{animation:rotateCube 8s linear infinite;position:relative;transform-style:preserve-3d}.cube-face,.logo-cube{height:30px;width:30px}.cube-face{background:linear-gradient(135deg,#0ff,#0080ff);border:1px solid rgba(0,255,255,.3);box-shadow:0 0 10px #00ffff4d;opacity:.9;position:absolute}.cube-face:first-child{transform:translateZ(15px)}.cube-face:nth-child(2){transform:rotateY(90deg) translateZ(15px)}.cube-face:nth-child(3){transform:rotateY(180deg) translateZ(15px)}.cube-face:nth-child(4){transform:rotateY(-90deg) translateZ(15px)}.cube-face:nth-child(5){transform:rotateX(90deg) translateZ(15px)}.cube-face:nth-child(6){transform:rotateX(-90deg) translateZ(15px)}@keyframes rotateCube{0%{transform:rotateX(0) rotateY(0) rotate(0)}to{transform:rotateX(1turn) rotateY(1turn) rotate(1turn)}}.logo-text{background:linear-gradient(135deg,#0ff,#0080ff);-webkit-background-clip:text;font-size:24px;font-weight:700;-webkit-text-fill-color:transparent;background-clip:text}.nav-menu{display:flex;gap:40px;list-style:none}.nav-item,.nav-link{position:relative}.nav-link{color:#fff;font-weight:500;overflow:hidden;padding:10px 0;text-decoration:none;transition:all .3s ease}.link-text{position:relative;z-index:2}.link-underline{background:linear-gradient(90deg,#0ff,#0080ff);bottom:0;height:2px;left:0;position:absolute;transition:width .3s ease;width:0}.nav-link:hover .link-underline{width:100%}.nav-link:hover{color:#0ff}.nav-hamburger{cursor:pointer;display:none;flex-direction:column;gap:4px}.hamburger-line{background:#0ff;height:3px;transition:all .3s ease;width:25px}.hamburger-line.active:first-child{transform:rotate(45deg) translate(5px,5px)}.hamburger-line.active:nth-child(2){opacity:0}.hamburger-line.active:nth-child(3){transform:rotate(-45deg) translate(7px,-6px)}.main-content{flex:1;margin-top:70px;padding:0}.footer{background:linear-gradient(135deg,#0a0a0a,#1a1a1a);border-top:1px solid rgba(0,255,255,.5);padding:60px 0 20px}.footer-container{margin:0 auto;max-width:1200px;padding:0 20px}.footer-content{align-items:start;display:grid;gap:60px;grid-template-columns:1fr auto;margin-bottom:40px}.footer-logo{align-items:center;display:flex;gap:12px;margin-bottom:20px}.footer-logo .logo-icon{perspective:1000px}.footer-logo .logo-cube{animation:rotateCube 8s linear infinite;height:30px;position:relative;transform-style:preserve-3d;width:30px}.footer-logo .cube-face{background:linear-gradient(135deg,#0ff,#0080ff);border:1px solid rgba(0,255,255,.3);box-shadow:0 0 10px #00ffff4d;height:30px;opacity:.9;position:absolute;width:30px}.footer-logo .cube-face:first-child{transform:translateZ(15px)}.footer-logo .cube-face:nth-child(2){transform:rotateY(90deg) translateZ(15px)}.footer-logo .cube-face:nth-child(3){transform:rotateY(180deg) translateZ(15px)}.footer-logo .cube-face:nth-child(4){transform:rotateY(-90deg) translateZ(15px)}.footer-logo .cube-face:nth-child(5){transform:rotateX(90deg) translateZ(15px)}.footer-logo .cube-face:nth-child(6){transform:rotateX(-90deg) translateZ(15px)}.footer-logo .logo-text{background:linear-gradient(135deg,#0ff,#0080ff);-webkit-background-clip:text;font-size:24px;font-weight:700;-webkit-text-fill-color:transparent;background-clip:text}.footer-section h3{color:#0ff;font-size:18px;font-weight:600;margin-bottom:20px}.footer-description{color:#ccc;line-height:1.6;margin-bottom:20px}.contact-info{display:flex;flex-direction:column;gap:15px}.contact-item{align-items:center;color:#ccc;display:flex;gap:10px}.contact-icon{font-size:18px}.line-link{color:#ccc;font-weight:500;text-decoration:none;transition:all .3s ease}.line-link:hover{color:#0ff;text-shadow:0 0 5px rgba(0,255,255,.5)}.footer-divider{background:linear-gradient(90deg,transparent,rgba(0,255,255,.3),transparent);height:1px;margin-bottom:30px}.footer-bottom-content{align-items:center;display:flex;justify-content:center}.copyright{color:#888;font-size:14px}@media(max-width:1024px){.nav-container{padding:0 25px}.nav-menu{gap:25px}.footer-container{padding:0 25px}.footer-content{gap:40px}}@media(max-width:768px){.nav-container{height:65px;padding:0 20px}.nav-hamburger{display:flex}.nav-menu{align-items:center;-webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);background:#0a0a0afa;border-right:1px solid rgba(0,255,255,.1);flex-direction:column;gap:40px;height:calc(100vh - 65px);justify-content:center;left:0;position:fixed;top:65px;transform:translate(-100%);transition:transform .4s cubic-bezier(.68,-.55,.265,1.55);width:100%}.nav-menu.active{transform:translate(0)}.nav-link{font-size:18px;padding:15px 0}.main-content{margin-top:65px}.footer-content{gap:35px;grid-template-columns:1fr;text-align:center}.footer-container{padding:0 20px}.footer{padding:50px 0 20px}.contact-info{align-items:center;justify-content:center}}@media(max-width:480px){.nav-container{height:60px;padding:0 15px}.logo-text{font-size:18px}.cube-face,.logo-cube{height:25px;width:25px}.cube-face:first-child{transform:translateZ(12.5px)}.cube-face:nth-child(2){transform:rotateY(90deg) translateZ(12.5px)}.cube-face:nth-child(3){transform:rotateY(180deg) translateZ(12.5px)}.cube-face:nth-child(4){transform:rotateY(-90deg) translateZ(12.5px)}.cube-face:nth-child(5){transform:rotateX(90deg) translateZ(12.5px)}.cube-face:nth-child(6){transform:rotateX(-90deg) translateZ(12.5px)}.nav-menu{gap:35px;height:calc(100vh - 60px);top:60px}.nav-link{font-size:16px;padding:12px 0}.hamburger-line{height:2px;width:22px}.main-content{margin-top:60px}.footer{padding:40px 0 15px}.footer-container{padding:0 15px}.footer-content{gap:25px}.footer-logo .logo-text{font-size:18px}.footer-logo .cube-face,.footer-logo .logo-cube{height:25px;width:25px}.footer-logo .cube-face:first-child{transform:translateZ(12.5px)}.footer-logo .cube-face:nth-child(2){transform:rotateY(90deg) translateZ(12.5px)}.footer-logo .cube-face:nth-child(3){transform:rotateY(180deg) translateZ(12.5px)}.footer-logo .cube-face:nth-child(4){transform:rotateY(-90deg) translateZ(12.5px)}.footer-logo .cube-face:nth-child(5){transform:rotateX(90deg) translateZ(12.5px)}.footer-logo .cube-face:nth-child(6){transform:rotateX(-90deg) translateZ(12.5px)}.footer-section h3{font-size:16px}.contact-item{font-size:14px}.contact-icon{font-size:16px}.copyright{font-size:12px}}@media(max-width:360px){.nav-container{padding:0 12px}.logo-text{font-size:16px}.nav-menu{gap:30px}.nav-link{font-size:15px}.footer-container{padding:0 12px}.footer-logo .logo-text{font-size:16px}.footer-content{gap:20px}}@media(max-height:500px)and (orientation:landscape){.nav-menu{gap:20px;height:calc(100vh - 60px);padding:20px 0}.nav-link{font-size:14px;padding:8px 0}}@media(hover:none)and (pointer:coarse){.nav-link:hover{color:#fff}.nav-link:hover .link-underline{width:0}.nav-link:active{color:#0ff}.line-link:hover{color:#ccc;text-shadow:none}.line-link:active{color:#0ff}.nav-link{display:flex;justify-content:center}.contact-item,.nav-link{align-items:center;min-height:44px}}@media(min-resolution:192dpi){.hamburger-line{height:2px}.footer-divider{height:1px}}@supports (padding-top:env(safe-area-inset-top)){.navbar{padding-top:env(safe-area-inset-top)}.nav-container{height:calc(70px + env(safe-area-inset-top))}.main-content{margin-top:calc(70px + env(safe-area-inset-top))}.footer{padding-bottom:calc(20px + env(safe-area-inset-bottom))}@media(max-width:768px){.nav-container{height:calc(65px + env(safe-area-inset-top))}.nav-menu{height:calc(100vh - 65px - env(safe-area-inset-top));top:calc(65px + env(safe-area-inset-top))}.main-content{margin-top:calc(65px + env(safe-area-inset-top))}}@media(max-width:480px){.nav-container{height:calc(60px + env(safe-area-inset-top))}.nav-menu{height:calc(100vh - 60px - env(safe-area-inset-top));top:calc(60px + env(safe-area-inset-top))}.main-content{margin-top:calc(60px + env(safe-area-inset-top))}}}