/* Shared top navigation for every public HK Universe page. */
.site-header.hk-unified{background:rgba(5,16,32,.96)!important;border-bottom:1px solid rgba(255,255,255,.095)!important;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);color:#edf3ff;z-index:100}
.site-header.hk-unified .container{width:min(1240px,calc(100% - 64px))}
.site-header.hk-unified .nav{height:83px;gap:22px}
.site-header.hk-unified .brand-hk{display:flex;flex-direction:row;align-items:center;gap:10px;min-width:238px;white-space:nowrap;color:#fff}
.site-header.hk-unified .brand-mark{width:46px;height:46px;flex:0 0 46px;display:grid;place-items:center;background:linear-gradient(145deg,#fff5d8,#c1ab7f);border-radius:14px;box-shadow:0 4px 22px #d9ae6633;overflow:hidden}
.site-header.hk-unified .brand-mark img{width:39px;height:39px;object-fit:contain}
.site-header.hk-unified .brand-content{display:flex;flex-direction:column;align-items:flex-start}
.site-header.hk-unified .brand-content b{font:700 14px/1.15 Georgia,serif;letter-spacing:.075em;color:#f8f0e2}
.site-header.hk-unified .brand-content small{font:700 9px/1.4 ui-sans-serif,system-ui,sans-serif;color:#d9ba80;margin-top:5px;letter-spacing:.21em}
.site-header.hk-unified .nav-links{gap:17px;font-size:12px;font-weight:650;color:#d0d9e5}
.site-header.hk-unified .nav-links a:hover,.site-header.hk-unified .nav-links a.active{color:#fff}
.site-header.hk-unified .nav-links a:after{background:#e0bb78}
.site-header.hk-unified .nav-links .lang{color:#eacb90;border-color:#3a485e}
.site-header.hk-unified .menu-btn{border:1px solid #5a6779;color:#fff;background:transparent}
.site-header.hk-unified .mobile-menu{border-color:rgba(255,255,255,.12);color:#e7eef8}
.site-header.hk-unified .mobile-menu a:hover,.site-header.hk-unified .mobile-menu a.active{color:#e0bb78}
@media(max-width:1170px){.site-header.hk-unified .nav-links{gap:11px;font-size:11px}.site-header.hk-unified .brand-hk{min-width:215px}}
@media(max-width:1080px){.site-header.hk-unified .nav-links{display:none}.site-header.hk-unified .menu-btn{display:block}}
@media(max-width:700px){.site-header.hk-unified .nav{height:73px}.site-header.hk-unified .container{width:calc(100% - 32px)}.site-header.hk-unified .brand-hk{min-width:0}.site-header.hk-unified .brand-content b{font-size:11px}.site-header.hk-unified .brand-content small{font-size:7px}}
/* Make promotional lab links consistent with the site palette. */
.hk-lgs-band{margin:30px 0 6px;padding:26px 28px;border:1px solid rgba(101,197,240,.35);border-radius:22px;display:flex;align-items:center;gap:26px;justify-content:space-between;background:linear-gradient(115deg,#123456,#0e243e 65%,#163f57);color:#f6fbff;box-shadow:0 20px 40px rgba(3,14,35,.2)}
.hk-lgs-band .hk-lgs-kicker{color:#a8e5df;font-size:10px;font-weight:900;letter-spacing:.21em;text-transform:uppercase;margin-bottom:8px;display:block}
.hk-lgs-band h3{color:#fff;font:760 clamp(22px,2.5vw,30px)/1.12 Inter,system-ui,sans-serif;margin:0 0 8px;letter-spacing:-.035em}
.hk-lgs-band p{color:#c8d9e9;line-height:1.65;font-size:13px;margin:0;max-width:690px}
.hk-lgs-band a{flex-shrink:0;display:inline-flex;padding:13px 20px;border-radius:12px;background:#e4bc7b;color:#0b1e34;font-size:12px;font-weight:900;text-decoration:none;white-space:nowrap}
.hk-lgs-band a:hover,.hk-lgs-band a:focus-visible{background:#f3d498;transform:translateY(-2px)}
@media(max-width:700px){.hk-lgs-band{flex-direction:column;align-items:stretch;gap:16px;padding:22px}.hk-lgs-band a{align-self:flex-start}}

/* Make page-level promo cards align with the standard content width. */
main > .hk-lgs-band{width:min(1180px,calc(100% - 36px));margin:30px auto 8px}
/* Match the YouTube page's first section to the other dark inner-page sections. */
.youtube-page .page-hero{background:linear-gradient(115deg,#0a0a0c,#0b1828)!important}
/* StoryWorld keeps its reading navigation, with the main-site ordering above. */
.hk-site-storynav{font-family:Inter,ui-sans-serif,system-ui,sans-serif;background:#051020;color:#d0d9e5;border-bottom:1px solid rgba(255,255,255,.095);position:relative;z-index:200}
.hk-site-storynav .hk-site-wrap{max-width:1240px;margin:auto;padding:0 26px;height:75px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.hk-site-storynav .hk-site-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:white;flex-shrink:0}
.hk-site-storynav .hk-site-brand img{width:42px;height:42px;object-fit:contain;border-radius:11px;background:linear-gradient(145deg,#fff5d8,#c1ab7f)}
.hk-site-storynav .hk-site-brand b{font:700 13px/1.15 Georgia,serif;color:#fff6e7;letter-spacing:.075em;white-space:nowrap}
.hk-site-storynav .hk-site-brand small{font:750 9px/1.3 system-ui,sans-serif;letter-spacing:.15em;color:#d9ba80;display:block;margin-top:4px}
.hk-site-storynav .hk-site-links{display:flex;align-items:center;gap:16px;font-size:12px;font-weight:650}
.hk-site-storynav .hk-site-links a{color:#d0d9e5;text-decoration:none;white-space:nowrap;position:relative}
.hk-site-storynav .hk-site-links a:hover,.hk-site-storynav .hk-site-links a.active{color:#fff}
.hk-site-storynav .hk-site-links a.active:after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:2px;background:#e0bb78}
.hk-site-storynav .hk-site-menu{display:none;color:#fff;background:transparent;border:1px solid #5a6779;padding:7px 13px;border-radius:9px;cursor:pointer}
.hk-site-storynav .hk-site-mobile{display:none;padding:12px 20px 16px;border-top:1px solid #ffffff25;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.hk-site-storynav .hk-site-mobile.open{display:grid}
.hk-site-storynav .hk-site-mobile a{color:#e5eef7;font-weight:650;text-decoration:none;font-size:12px}
@media(max-width:1180px){.hk-site-storynav .hk-site-links{gap:9px;font-size:11px}.hk-site-storynav .hk-site-brand b{font-size:11px}}
@media(max-width:1030px){.hk-site-storynav .hk-site-links{display:none}.hk-site-storynav .hk-site-menu{display:block}}
@media(max-width:700px){.hk-site-storynav .hk-site-wrap{padding:0 16px;height:70px}.hk-site-storynav .hk-site-brand b{font-size:10px}.hk-site-storynav .hk-site-brand small{font-size:7px}.hk-site-storynav .hk-site-mobile{grid-template-columns:1fr 1fr}}
