@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:2px;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:9px}}
@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:1px}
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%)}

/* 2026-10-06 — floating glass capsule header, preserving all existing nav content/behavior */
:root{--header-height:96px}
header.nav,.immersiveHome header.nav,header.nav.isScrolled{background:transparent;border-bottom:0;backdrop-filter:none;-webkit-backdrop-filter:none;padding:14px 0}
header.nav .navin{
  width:min(1480px,calc(100% - 32px));height:68px;min-height:68px;margin:0 auto;padding:0 14px;
  border:1px solid rgba(255,255,255,.38);border-radius:999px;
  background:linear-gradient(180deg,rgba(56,75,91,.58),rgba(24,37,51,.50));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 12px 36px rgba(8,19,33,.18);
  backdrop-filter:blur(22px) saturate(1.16);-webkit-backdrop-filter:blur(22px) saturate(1.16);
  transition:background .25s ease,border-color .25s ease,box-shadow .25s ease;
}
header.nav.isScrolled .navin{
  background:linear-gradient(180deg,rgba(45,61,76,.84),rgba(17,28,40,.82));
  border-color:rgba(255,255,255,.32);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 14px 38px rgba(8,19,33,.24)
}
header.nav .brand{padding-left:2px}
header.nav .brand .mark{width:36px;height:36px}
header.nav .actions{align-items:center}
header.nav .actions .btn{min-height:40px;padding:8px 16px}
header.nav .btn.ghost{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.48)}
header.nav .btn.primary{background:#f8fbff;color:#22334a;border-color:#f8fbff;box-shadow:0 4px 14px rgba(8,19,33,.12)}
header.nav .navlinks.menuOpen{backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}

@media(min-width:768px) and (max-width:1100px){
  :root{--header-height:142px}
  header.nav{padding:10px 0}
  header.nav .navin{width:calc(100% - 24px);height:122px;min-height:122px;padding:0 16px;border-radius:28px;grid-template-rows:60px 60px}
  header.nav .navlinks,header.nav .navlinks.menuOpen{height:60px}
}
@media(max-width:767px){
  :root{--header-height:80px}
  header.nav{padding:10px 0}
  header.nav .navin{width:calc(100% - 20px);height:60px;min-height:60px;padding:0 10px 0 12px;border-radius:999px}
  header.nav .brand .mark{width:34px;height:34px}
  header.nav .navlinks.menuOpen{
    top:calc(100% + 10px);left:0;right:0;padding:12px;border-radius:24px;
    background:rgba(20,31,44,.94);border:1px solid rgba(255,255,255,.30);
    box-shadow:0 18px 48px rgba(8,19,33,.28)
  }
}
@media(prefers-reduced-transparency:reduce){
  header.nav,.immersiveHome header.nav,header.nav.isScrolled{background:transparent}
  header.nav .navin{background:#243344;backdrop-filter:none;-webkit-backdrop-filter:none}
}

/* Seven destinations retain breathing room in the desktop capsule. */
@media(min-width:1101px){header.nav .navlinks{gap:clamp(10px,1.4vw,22px)}}
