.original-hero.video-hero.concept-hero{height:calc(100svh - var(--nav-height));background:#fff;position:relative;overflow:hidden;min-height:0;aspect-ratio:auto}
.concept-hand{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 20%;max-width:none}
.home-page:has(.concept-hero) .brand-dragon{width:25%;max-height:none;mask-image:url('/assets/home-opening/emblem.svg');-webkit-mask-image:url('/assets/home-opening/emblem.svg')}
.jewellery-column{position:absolute;top:-12%;left:11.8%;width:11%;height:126%;pointer-events:none}
.jewellery-drift{height:100%;animation:jewellery-drift 28s ease-in-out infinite;will-change:transform}
.floating-piece{height:calc(100% / 7);display:flex;align-items:center;justify-content:center}
.floating-piece:nth-child(6) img,.floating-piece:nth-child(7) img{width:75%}
.floating-piece img{width:100%;height:64%;object-fit:contain;filter:drop-shadow(0 4px 3px #00000009)}
@keyframes jewellery-drift{0%,100%{transform:translateY(0)}25%{transform:translateY(-8%)}75%{transform:translateY(8%)}}
@media(max-width:760px){
 .concept-hand{left:0;width:100%;height:100%;object-fit:cover;object-position:24% center}
 .jewellery-column{top:0;left:5.6%;width:14.1%;height:70%}
 .floating-piece img{height:70%}
}
@media(prefers-reduced-motion:reduce){.jewellery-drift{animation:none}}

/* white frosted navigation with compact, widely spaced labels. */
:root{--nav-height:56px;--curve-height:78px;--nav-glass:rgba(255,255,255,.82);--nav-blur:24px;--nav-font:Arial,'PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif}
.site-header,.logo-on-dark .site-header{color:#111}
.header-emblem img,.logo-on-dark .header-emblem img{filter:none}
.site-header:before{background:var(--nav-glass);backdrop-filter:blur(var(--nav-blur)) saturate(.8);-webkit-backdrop-filter:blur(var(--nav-blur)) saturate(.8)}
.site-menu,.site-menu .collections-submenu{color:#111}
.site-menu a,.site-menu .collections-toggle,.language{font-family:var(--nav-font);letter-spacing:.055em}
.site-menu a:hover,.site-menu a[aria-current],.site-menu .collections-toggle[aria-expanded=true],.site-menu .collections-submenu a:hover,.site-menu .collections-submenu a[aria-current]{color:#111;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:8px}
.site-menu :is(a,button):focus-visible{outline-color:#111}
.site-menu .collections-submenu a,html[lang=zh-CN] .site-menu .collections-submenu a{font-size:14px;font-weight:400!important;line-height:1.65;padding:12px 0;letter-spacing:.035em}
.language{font-size:12px;font-weight:500!important;letter-spacing:.08em}
@media(min-width:1101px){
 .site-menu,.site-menu[hidden]{left:50%;right:auto;transform:translateX(-50%);width:min(1160px,calc(100% - 160px));max-width:none;grid-template-columns:repeat(7,minmax(0,1fr));column-gap:0;height:var(--nav-height);color:#111}
 .site-menu>a,.site-menu>.collections-disclosure>.collections-toggle,.site-menu>.guides-disclosure>.guides-toggle,html[lang=zh-CN] .site-menu>a,html[lang=zh-CN] .site-menu .collections-toggle{font-family:var(--nav-font);font-size:14px;font-weight:600!important;line-height:20px;letter-spacing:.065em;padding:18px 0;gap:7px}
 .site-menu> :is(a,.collections-disclosure,.guides-disclosure){min-width:0;justify-self:stretch}
 .site-menu>.collections-disclosure>.collections-toggle,.site-menu>.guides-disclosure>.guides-toggle{width:100%}
 .site-menu .collections-submenu{background:var(--nav-glass);color:#111;padding:20px 28px;box-shadow:0 14px 26px #0000000a}
}
@media(max-width:1100px){
 :root{--nav-height:44px;--curve-height:70px}
 .site-header{height:var(--nav-height)}
 .menu-toggle{height:40px;gap:5px}
 .site-menu{background:var(--nav-glass);color:#111;padding:24px 28px 32px}
 .site-menu>a,.site-menu .collections-toggle,html[lang=zh-CN] .site-menu>a,html[lang=zh-CN] .site-menu .collections-toggle{font-family:var(--nav-font);font-size:15px;font-weight:600!important;letter-spacing:.07em;line-height:24px;padding:15px 0}
 .site-menu .collections-submenu{border-left-color:rgba(0,0,0,.15);padding-left:20px}
}

/* Move the existing pearl background into the introduction. */
.hero-introduction{position:relative;isolation:isolate;overflow:hidden;background:#ece9e6;color:#000}
.hero-introduction:before{content:"";position:absolute;inset:0;z-index:-1;background:url('/assets/pearl-diamond-detail.png') center 46%/cover no-repeat;transform:scale(1.4);pointer-events:none}
.hero-introduction h1,.hero-introduction p{color:#000}
.hero-introduction .hero-new-link{color:#fff;border-bottom-color:#fff}

/* Half-size floating previews, preserving the shadow and transparent background. */
.series-preview-link.is-previewing .series-thumbnail{width:120px;padding:4px}
.series-thumbnail img{height:110px}
@media(min-width:1101px){.series-preview-link.is-previewing .series-thumbnail{width:110px}}
@media(max-width:760px){.series-preview-link.is-previewing .series-thumbnail{width:50%;padding:4px}.series-thumbnail img{height:77.5px}}
