/* HJ work copy only: V2.2. Reference Menu motion is inherited, not overridden. */
@import url('assets/fonts/fontfaces.css');
@font-face{font-family:'Gelasio';font-style:normal;font-weight:400;font-display:swap;src:url('assets/fonts/gelasio-latin-400.woff2') format('woff2')}
:root{--serif:'HJ Serif HK',serif;--overlay-motion-duration:220ms;--overlay-motion-easing:ease-out;--menu-width:min(610px,39vw)}
html[lang='zh-CN']{--serif:'HJ Serif SC',serif}
html[lang='en']{--serif:'HJ Serif Latin',serif}
html{scroll-snap-type:none!important}
.story{height:var(--story-height,100svh);min-height:0;scroll-snap-align:none;overflow:hidden}
.story picture,.story-media,.hj-background-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center}
.story picture{z-index:-3}
.story-media{animation:none}
.overview,.continue,.footer{scroll-snap-align:none}
.overview{min-height:100svh;padding:120px 0 80px;scroll-snap-stop:normal}
#story-1 .media-overlay,#story-2 .media-overlay,#story-3 .media-overlay{background:#00121b}
#story-1 .media-overlay,#story-2 .media-overlay{opacity:.05}
#story-3 .media-overlay{opacity:.05}
.mobile-stat-break{display:none}
/* Official Latin subset, user-confirmed 400: preserve default proportional old-style figures. */
.metrics strong,.stat-number{font-family:'Gelasio',Georgia,'Times New Roman',serif;font-weight:400;font-variant-numeric:normal;font-feature-settings:normal}
.metrics [data-count]{font-variant-numeric:normal;font-feature-settings:normal}
.menu-panel{width:var(--menu-width);--menu-travel:var(--menu-width)}
.locale-options{display:block;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity var(--overlay-motion-duration) var(--overlay-motion-easing),transform var(--overlay-motion-duration) var(--overlay-motion-easing),visibility 0s var(--overlay-motion-duration)}
.locale-options.is-open{opacity:1;visibility:visible;transform:translateY(0);transition-delay:0s}
.locale-options[hidden]{display:none}
.hj-dialog{opacity:0;transform:translateY(4px);transition:opacity var(--overlay-motion-duration) var(--overlay-motion-easing),transform var(--overlay-motion-duration) var(--overlay-motion-easing)}
.hj-dialog.is-open{opacity:1;transform:translateY(0)}
.hj-dialog::backdrop{background:rgba(0,14,22,0);transition:background var(--overlay-motion-duration) var(--overlay-motion-easing)}
.hj-dialog.is-open::backdrop{background:rgba(0,14,22,.72)}
.field-grid .floating-field{position:relative;display:block;min-width:0;height:64px}
.floating-field > span{position:absolute;left:0;top:22px;font-size:16px;line-height:20px;pointer-events:none;transition:top 180ms ease-out,font-size 180ms ease-out}
.floating-field:focus-within > span,.floating-field.has-value > span,.floating-field:has(input:autofill) > span{top:4px;font-size:12px}
.floating-field input{height:64px!important;padding:26px 0 8px!important;font-size:16px!important;line-height:24px;border:0!important;border-bottom:1px solid rgba(255,255,255,.45)!important;border-radius:0!important;background:transparent!important;color:#fff}
.floating-field input:focus{outline:none!important;box-shadow:none!important}
.floating-field input:focus-visible,.country-field select:focus-visible{outline:none!important;box-shadow:none!important;border-bottom-color:#c3ad86!important}
.floating-field:has(input:-webkit-autofill) > span{top:4px;font-size:12px}
body:not(.keyboard-mode) input:focus,body:not(.keyboard-mode) select:focus,body:not(.keyboard-mode) textarea:focus{outline:none!important;box-shadow:none!important}
body:not(.keyboard-mode) .floating-field input:focus-visible,body:not(.keyboard-mode) .country-field select:focus-visible{border-bottom-color:rgba(255,255,255,.45)!important}
body.keyboard-mode input:focus-visible,body.keyboard-mode select:focus-visible,body.keyboard-mode textarea:focus-visible{outline:none!important;box-shadow:none!important;border-bottom-color:#c3ad86!important}
.field-grid .phone-row{height:auto;border:0;display:grid;grid-template-columns:minmax(106px,.38fr) minmax(0,1fr);gap:20px;min-width:0}
.country-field{display:flex;flex-direction:column;justify-content:space-between;min-width:0;height:64px}
.country-field > span{font-size:12px;line-height:16px}
.country-field select{width:100%;height:37px;font:16px var(--sans);color:white;background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.45);border-radius:0}
.country-field option{color:#03131c;background:white}
.country-field > span{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.country-field{position:relative;display:block;height:64px}
.country-field select{height:64px;padding:26px 20px 8px 0;line-height:24px;appearance:none;-webkit-appearance:none;cursor:pointer}
.country-field::after{content:'▾';position:absolute;right:3px;top:28px;pointer-events:none;font-size:14px}
.country-field select{color:transparent!important}
.country-value{position:absolute;top:26px;left:0;line-height:24px;font-size:16px;font-weight:400;pointer-events:none}
.site-header,.site-header.solid,.site-header[data-state='compact']{background:rgba(3,19,28,.42);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
body:not(.legal-page) .site-header,body:not(.legal-page) .site-header.solid,body:not(.legal-page) .site-header[data-state='compact']{background:rgba(3,19,28,calc(.42 * var(--header-glass-progress,0)));backdrop-filter:blur(calc(8px * var(--header-glass-progress,0)));-webkit-backdrop-filter:blur(calc(8px * var(--header-glass-progress,0)));transition:background 320ms ease-out,backdrop-filter 320ms ease-out,-webkit-backdrop-filter 320ms ease-out}
.pause i{display:none!important}
.pause svg{width:18px;height:18px;display:block;fill:currentColor}
.pause .play-glyph{display:none;transform:translateX(1.75px)}
.pause[aria-pressed='true'] .play-glyph{display:block}
.pause[aria-pressed='true'] .pause-glyph{display:none}
.hj-background-video{transition:opacity 180ms linear!important}
.hj-background-video.loop-fading{opacity:0!important}
.desktop-title{display:inline}.mobile-title{display:none}
.country-field select:focus,.search-field input:focus{outline:none!important;box-shadow:none!important}
.search-field input{border:0;border-bottom:1px solid #667884;border-radius:0;background:transparent}
.search-field input:focus-visible{outline:none!important;box-shadow:none!important;border-bottom-color:#c3ad86}
.reference-form input,.reference-form select,.search-field input{font-size:16px;transform:none;zoom:1}
.reference-form .consent input{flex-shrink:0}
.legal-hero{display:flex;align-items:center;justify-content:center;box-sizing:border-box;position:relative;height:40vh;min-height:calc(var(--header-h) + 140px);padding:calc(var(--header-h) + 12px) 24px max(36px,10vh);text-align:center;background:#03131c url('assets/legal/gold-horizon.webp') center 70%/cover no-repeat}
.legal-hero h1{width:100%;max-width:none;position:static;transform:none;margin:0;text-align:center;font-size:clamp(40px,8vh,76px)}
html:has(body.legal-page){scroll-snap-type:none}
.legal-content,.legal-page .footer{scroll-snap-align:none}
html[lang='en'] .story-copy{width:min(1000px,calc(100% - 64px))}
html[lang='en'] .story-copy > p{max-width:850px;line-height:1.45}
@media(max-width:700px){
 .story{height:max(100vh,var(--story-height,100vh));min-height:100vh}
 @supports(height:100lvh){.story{height:max(100lvh,var(--story-height,100lvh))}}
 @supports(height:100dvh){.story{min-height:100dvh}}
 .story > picture,.story > .hj-background-video{inset:-2px;width:calc(100% + 4px);height:calc(100% + 4px);max-width:none;max-height:none}
 .story > .hj-background-video{display:block;object-fit:cover;object-position:center center}
 .site-header{height:calc(var(--header-h) + env(safe-area-inset-top,0px))}
 .site-header[data-state='compact']{height:calc(64px + env(safe-area-inset-top,0px))}
 .header-inner{padding-top:env(safe-area-inset-top,0px)}
 .story-rail{bottom:calc(18px + env(safe-area-inset-bottom,0px))}
 .legal-hero{display:block;height:32vh;min-height:0;padding:0}
 .legal-hero h1{position:absolute;left:24px;top:58%;width:calc(100% - 48px);transform:translateY(-50%);font-size:42px}
 .desktop-title{display:none}.mobile-title{display:inline}
 :root{--menu-width:min(610px,max(39vw,calc(100vw - 72px)));}
 .menu-panel{width:var(--menu-width)}
 .menu-panel nav{padding:32px 24px;gap:24px}
 .mobile-stat-break{display:block}
 .metrics small{max-width:none;font-size:12px;line-height:1.65}
 .footer-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 14px}
 .footer-intro{grid-column:1/-1}
 .footer nav{font-size:13px;gap:18px;min-width:0;overflow-wrap:anywhere;line-height:1.5}
 .footer nav h3{font-size:14px}
 .footer nav a{min-width:0}
 .field-grid{gap:16px}
 .field-grid .phone-row{gap:14px}
 .story-copy,#story-1 .story-copy,#story-2 .story-copy,#story-3 .story-copy{top:27%;width:calc(100% - 48px)}
 .story h1,.story h2{font-size:40px;line-height:1.22}
 html[lang='en'] .wordmark{font-family:'HJ Serif HK',serif;font-size:21px;letter-spacing:.04em;max-width:calc(100vw - 178px)}
 html[lang='en'] .story-copy{width:calc(100% - 48px)}
 html[lang='en'] .story h1,html[lang='en'] .story h2{font-size:39px;line-height:1.15}
 html[lang='en'] .metrics small{font-size:11px;line-height:1.5}
 html[lang='en'] .story-copy > p{font-size:16px;line-height:1.45}
 html[lang='en'] #story-2 .story-copy{top:22%}
 html[lang='en'] #story-2 h2{font-size:clamp(32px,8.8vw,38px);line-height:1.16}
 html[lang='en'] #story-2 .story-copy > p{line-height:1.5}
 html[lang='en'] #story-2 .pill{margin-top:24px}
 html[lang='en'] #story-2 .metrics{margin-top:28px;align-items:start}
 html[lang='en'] #story-2 .metrics small{min-height:4.5em}
 .overview{padding:96px 0 72px}
 .overview h2{font-size:38px;line-height:1.2}
 .story .pill{max-width:100%}
 .continue-inner{width:calc(100% - 48px)}
 .continue-inner > span{font-size:14px;line-height:1.6}
}
@media(max-width:700px) and (max-height:600px){
 .story-copy,#story-1 .story-copy,#story-2 .story-copy,#story-3 .story-copy{top:22%}
 .story h1,.story h2{font-size:30px!important;margin-bottom:10px}
 .story-copy > p{font-size:14px!important;line-height:1.4!important}
 .story .pill{margin-top:18px;min-height:44px}
 .metrics{margin-top:18px}
}
