@font-face{font-family:"KAIX Nav Light";font-style:normal;font-weight:300;font-display:swap;src:url('/assets/raleway-light.ttf') format('truetype')}
:root{--header-height:88px}
header.nav{background:rgba(20,28,40,.72);color:#f7f9fd;border-bottom:1px solid #ffffff24;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);transition:background .25s}
.immersiveHome header.nav{background:rgba(20,28,40,.38)}
header.nav.isScrolled{background:rgba(20,28,40,.94)}
header.nav .navin{height:var(--header-height);gap:18px}
header.nav .brand,header.nav .brand small,header.nav .navlinks a{color:#f7f9fd}
header.nav .brand .mark{background:#f1f5fc;color:#26354a}
header.nav .brand small{color:#d5deec}
header.nav .navlinks{gap:20px}
header.nav .navlinks a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;white-space:nowrap;line-height:1.4;min-height:52px}
header.nav .navlinks a small{font-family:"KAIX Nav Light","Segoe UI Light",sans-serif;font-weight:300;font-size:12px;letter-spacing:.13em;color:#B4A582;line-height:1.5}
header.nav .navlinks a:hover,header.nav .navlinks a[aria-current=page]{color:#fff;background:#ffffff0d;border-color:#B4A582}
header.nav .btn.ghost,header.nav .menuToggle{background:#ffffff0b;border:1px solid #ffffff66;color:#fff;box-shadow:none!important}
header.nav .btn.primary{background:#edf3fc;color:#22334a;border:1px solid #edf3fc}
header.nav .btn:hover{background:#d8e5f5;color:#22334a}
header.nav .menuToggle span{background:#fff}
header.nav a:focus-visible,header.nav button:focus-visible{outline:2px solid #B4A582;outline-offset:4px}
.immersiveHome main{margin-top:calc(-1 * var(--header-height) - 1px)}
.immersiveHome .hero{background:#081321}
@media(max-width:767px){header.nav .navlinks{display:none}header.nav .menuToggle{display:flex;margin-left:auto}header.nav .navlinks.menuOpen{display:flex;position:absolute;left:0;right:0;top:calc(100% + 8px);flex-direction:column;padding:12px;gap:0;max-height:calc(100dvh - var(--header-height) - 24px);overflow-y:auto;background:rgba(20,28,40,.97);border:1px solid #ffffff33;border-radius:20px;box-shadow:0 18px 48px #08132155}header.nav .navlinks.menuOpen a{align-items:flex-start;padding:12px 18px;width:100%;border-radius:12px}}
@media(max-width:950px){.immersiveHome .starHeroFrame{height:1080px}}
@media(max-width:640px){:root{--header-height:68px}.immersiveHome .starHeroFrame{height:1040px}header.nav .navin{gap:12px}}
@media(prefers-reduced-transparency:reduce){header.nav,.immersiveHome header.nav,header.nav .navlinks.menuOpen{background:#141c28;backdrop-filter:none}}
@media(prefers-reduced-motion:reduce){header.nav{transition:none}}

/* Keep every navigation destination exposed on desktop and tablet. */
@media(min-width:768px){header.nav .navlinks,header.nav .navlinks.menuOpen{display:flex;position:static;flex-direction:row;background:transparent;border-radius:0;box-shadow:none;padding:0;margin:auto;border:0;overflow:visible}header.nav .menuToggle{display:none}header.nav .navlinks a{flex-shrink:0}header.nav .navin{gap:14px}}
@media(min-width:1101px) and (max-width:1390px){header.nav .wrap{width:calc(100% - 40px)}header.nav .navlinks{gap:12px}header.nav .navlinks a small{letter-spacing:.08em}header.nav .actions .btn{padding:10px 13px}}
@media(min-width:768px) and (max-width:1100px){:root{--header-height:136px}header.nav .navin{display:grid;grid-template-columns:1fr auto;grid-template-rows:68px 68px;gap:0}header.nav .brand{grid-column:1;grid-row:1}header.nav .actions{grid-column:2;grid-row:1}header.nav .navlinks,header.nav .navlinks.menuOpen{grid-column:1/-1;grid-row:2;justify-content:space-between;gap:8px;width:100%;height:68px;border-top:1px solid #ffffff24}header.nav .navlinks a small{letter-spacing:.08em}header.nav .navlinks a{padding:6px 0}}
/* Bilingual labels share the Chinese title's width; feedback stays weightless. */
header.nav .navlinks a,header.nav .navlinks a:hover,header.nav .navlinks a[aria-current=page],header.nav .navlinks.menuOpen a[aria-current=page]{position:relative;background:transparent;border:0;box-shadow:none;border-radius:0}
header.nav .navlinks a>span{font-size:18px;font-weight:400;letter-spacing:.12em;display:block}
header.nav .navlinks a small{font-size:12px;letter-spacing:.04em;display:block;width:var(--nav-label-width,auto);max-width:var(--nav-label-width,none);text-align:center}
header.nav .navlinks a>span,header.nav .navlinks a small{transition:transform .2s ease,color .2s ease}
header.nav .navlinks a:after{content:'';position:absolute;bottom:0;left:50%;width:var(--nav-label-width,100%);height:1px;background:#B4A582;transform:translateX(-50%) scaleX(0);transform-origin:center;transition:transform .2s ease;pointer-events:none}
header.nav .navlinks a[aria-current=page]:after,header.nav .navlinks a:focus-visible:after{transform:translateX(-50%) scaleX(1)}
@media(hover:hover) and (pointer:fine){header.nav .navlinks a:hover>span,header.nav .navlinks a:hover small{transform:translateY(-2px)}header.nav .navlinks a:hover:after{transform:translateX(-50%) scaleX(1)}}
@media(max-width:767px){header.nav .navlinks.menuOpen a{align-items:center}header.nav .navlinks a:after{bottom:7px}}
@media(prefers-reduced-motion:reduce){header.nav .navlinks a>span,header.nav .navlinks a small,header.nav .navlinks a:after{transition:none}header.nav .navlinks a:hover>span,header.nav .navlinks a:hover small{transform:none}}

/* Consistent label rows prevent the short FAQ subtitle from lifting its title. */
header.nav .navlinks a{gap:5px}
header.nav .navlinks a>span{font-size:15px;letter-spacing:.08em;line-height:22px}
header.nav .navlinks a small{font-size:10px;line-height:16px;height:16px;display:flex;align-items:center;justify-content:center}
header.nav .navlinks a small .navEnglish{display:block;flex-shrink:0;white-space:nowrap;font-size:10px;line-height:16px;letter-spacing:.04em;transform:scaleX(var(--nav-english-scale,1));transform-origin:center}
@media(min-width:1101px){header.nav .navlinks{gap:30px}}
@media(min-width:768px) and (max-width:1100px){header.nav .navlinks{gap:24px}}

/* A fine gold rule tapers and fades symmetrically toward both ends. */
header.nav .navlinks a:after{height:1px;background:linear-gradient(90deg,transparent 0%,#B4A58259 14%,#B4A582 38%,#B4A582 62%,#B4A58259 86%,transparent 100%);clip-path:ellipse(50% 50% at 50% 50%)}