/* Shared service navigation for both pages. */
.site-header{position:fixed;inset:0 0 auto;z-index:300;display:flex;align-items:center;justify-content:flex-start;gap:clamp(14px,3vw,44px);height:78px;padding:14px clamp(18px,4.4vw,76px);background:rgba(10,10,11,.94);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.06);color:#f5f5f3;font-family:"Inter","Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;line-height:1.6}
.site-header,.site-header *{box-sizing:border-box}
.site-header a{text-decoration:none}
.site-header .site-brand{display:flex;align-items:center;gap:11px;flex-shrink:0;color:#f5f5f3}
.site-header .site-logo{width:30px;height:30px;display:block;flex-shrink:0;fill:none;stroke:#c8f31d;stroke-width:3;stroke-linecap:round}
.site-logo circle{fill:#c8f31d;stroke:none}.site-logo path:nth-of-type(2),.site-logo path:nth-of-type(4){opacity:.55}
.site-header .site-brand-text b{display:block;font-family:"Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;font-weight:900;font-size:18px;letter-spacing:.06em;line-height:1.1}
.site-header .site-brand-text span{display:block;font-size:15px;font-weight:400;letter-spacing:.2em;color:#a8a8af;line-height:1.2}
.site-header .site-nav{display:flex;align-items:center;gap:clamp(12px,2vw,30px);margin:0 0 0 auto;padding:0;order:0;flex:0 1 auto}
.site-header .site-nav a{display:block;position:relative;font-size:16px;font-weight:400;line-height:1.6;white-space:nowrap;color:#a8a8af;border:0;padding:0;transition:color .2s}
.site-header .site-nav a:hover{color:#f5f5f3}.site-header .site-nav a[aria-current="page"]{color:#c8f31d}
.site-header .site-cta{display:inline-flex;align-items:center;gap:9px;padding:10px 20px;border:1px solid #c8f31d;border-radius:999px;font-size:16px;font-weight:600;line-height:1.6;color:#c8f31d;white-space:nowrap;flex-shrink:0;transition:background .2s,color .2s}
.site-header .site-dot{width:7px;height:7px;border-radius:50%;background:currentColor;flex-shrink:0}
.site-header .site-cta:hover{background:#c8f31d;color:#0a0a0b}.site-header a:focus-visible{outline:2px solid #c8f31d;outline-offset:6px}
body[data-page="systems"]{padding-top:78px}
@media(max-width:820px){.site-header{height:120px;flex-wrap:wrap;gap:10px 12px}.site-header .site-nav{order:3;flex:0 0 100%;justify-content:center;gap:30px;margin:0;padding-top:6px}.site-header .site-nav a{font-size:15px!important}.site-header .site-cta{margin-left:auto}.site-header~#top .hero{padding-top:145px}body[data-page="systems"]{padding-top:120px}html{scroll-padding-top:135px}}
@media(max-width:420px){.site-header .site-brand{gap:7px}.site-header .site-logo{width:24px;height:24px}.site-header .site-brand-text span{font-size:11px}.site-header .site-cta{padding:9px 13px;font-size:15px}}
@media(prefers-reduced-motion:reduce){.site-header a{transition:none}}

/* Compact, single-row navigation on desktop and phones. */
.site-header{height:64px;padding:8px clamp(16px,3vw,48px);gap:24px;flex-wrap:nowrap}
.site-header .site-nav{order:0;flex:0 1 auto;width:auto;padding:0;margin-left:auto;gap:24px}
.site-header .site-nav a{min-height:44px;display:flex;align-items:center}
.site-header .site-cta{padding:8px 16px;margin-left:0}
body[data-page="systems"]{padding-top:64px}
html{scroll-padding-top:80px}
.skip{z-index:400}
@media(max-width:820px){
 .site-header{height:60px;gap:16px;padding:8px 18px}
 .site-header .site-brand-text b{font-size:16px}
 .site-header .site-brand-text span{font-size:11px}
 .site-header .site-nav{gap:20px}
 .site-header .site-cta{font-size:14px;padding:8px 12px}
 body[data-page="systems"]{padding-top:60px}
 .site-header~#top .hero{padding-top:100px}
 html{scroll-padding-top:76px}
}
@media(max-width:540px){
 .site-header{gap:10px;padding:8px 12px}
 .site-header .site-brand-text{display:none}
 .site-header .site-logo{width:26px;height:26px}
 .site-header .site-nav{gap:14px}
 .site-header .site-nav a{font-size:14px!important}
 .site-header .site-cta{font-size:13px;padding:8px 10px;gap:5px}
 .site-header .site-dot{width:5px;height:5px}
}
