/* Opt-in only: no content edits and no effects on product/article/detail pages. */
html.yx-hero-nav-active .yx-hero-nav-page {
    --yx-nav-height: var(--nav--height, 4.5rem);
    --yx-nav-admin-offset: 0px;
}
@media (min-width: 1024px) {
    html.yx-hero-nav-active .yx-hero-nav-page { --yx-nav-height: var(--nav--height-lg, 5.25rem); }
}
html.yx-hero-nav-active .yx-hero-nav-page.admin-bar { --yx-nav-admin-offset: 32px; }
@media (max-width: 782px) {
    html.yx-hero-nav-active .yx-hero-nav-page.admin-bar { --yx-nav-admin-offset: 46px; }
}
html.yx-hero-nav-active .yx-hero-nav-page .custom-nav-module {
    position: fixed;
    inset: var(--yx-nav-admin-offset) 0 auto;
    width: 100%;
    margin: 0;
    background: var(--nav--bg, #fff);
    border-bottom-color: var(--nav--border, #eee);
    transition: background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}
html.yx-hero-nav-active:not(.yx-hero-nav-scrolled) .yx-hero-nav-page:not(.nav-mobile-open) .custom-nav-module {
    background: transparent;
    border-bottom-color: transparent;
    box-shadow: none;
}
html.yx-hero-nav-active:not(.yx-hero-nav-scrolled) .yx-hero-nav-page:not(.nav-mobile-open) .nav-desktop .nav-links > li:not(.nav-menu-item--cta):not(.menu-item-contact) > a,
html.yx-hero-nav-active:not(.yx-hero-nav-scrolled) .yx-hero-nav-page:not(.nav-mobile-open) .nav-right > .nav-search > .search-toggle,
html.yx-hero-nav-active:not(.yx-hero-nav-scrolled) .yx-hero-nav-page:not(.nav-mobile-open) .nav-right > .nav-lang-switcher,
html.yx-hero-nav-active:not(.yx-hero-nav-scrolled) .yx-hero-nav-page:not(.nav-mobile-open) .nav-right > .nav-lang-switcher .nav-lang-switcher__icon,
html.yx-hero-nav-active:not(.yx-hero-nav-scrolled) .yx-hero-nav-page:not(.nav-mobile-open) .nav-right > .nav-lang-switcher .nav-lang-switcher__link,
html.yx-hero-nav-active:not(.yx-hero-nav-scrolled) .yx-hero-nav-page:not(.nav-mobile-open) .menu-toggle {
    color: #fff;
    text-shadow: 0 1px 5px rgba(0,0,0,.5);
}
html.yx-hero-nav-active:not(.yx-hero-nav-scrolled) .yx-hero-nav-page:not(.nav-mobile-open) .nav-right > .nav-lang-switcher .nav-lang-switcher__sep { color: rgba(255,255,255,.65); }
html.yx-hero-nav-active:not(.yx-hero-nav-scrolled) .yx-hero-nav-page:not(.nav-mobile-open) .menu-toggle { background: transparent; }
html.yx-hero-nav-active:not(.yx-hero-nav-scrolled) .yx-hero-nav-page:not(.home):not(.nav-mobile-open) .nav-logo img {
    filter: brightness(0) invert(1) drop-shadow(0 1px 3px rgba(0,0,0,.25));
}
/* Popovers retain their original opaque background and dark text. */
html.yx-hero-nav-active .yx-hero-nav-page .nav-desktop .sub-menu { background: var(--nav--dropdown-bg, #fff); }
html.yx-hero-nav-active .yx-hero-nav-page .nav-mobile,
html.yx-hero-nav-active .yx-hero-nav-page .search-form--expandable { background: var(--nav--bg, #fff); }
/* Reserve space inside the hero, not above it; backgrounds extend behind the bar. */
html.yx-hero-nav-active .yx-hero-nav-page .bc-banner__overlay {
    padding-top: calc(var(--yx-nav-height) + 1rem);
}
html.yx-hero-nav-active .yx-hero-nav-page .about-blue .about-hero-inner {
    padding-top: max(6rem, calc(var(--yx-nav-height) + 2rem));
}
@media (min-width: 1024px) {
    html.yx-hero-nav-active .yx-hero-nav-page .about-blue .about-hero-inner {
        padding-top: max(9rem, calc(var(--yx-nav-height) + 2rem));
    }
}
html.yx-hero-nav-active .yx-hero-nav-page .industry-hero.wp-block-cover,
html.yx-hero-nav-active .yx-hero-nav-page .case-archive-hero.wp-block-cover,
html.yx-hero-nav-active .yx-hero-nav-page .blog-archive-hero.wp-block-cover {
    box-sizing: border-box;
    padding-top: calc(var(--yx-nav-height) + 1rem) !important;
}
html.yx-hero-nav-active .yx-hero-nav-page .yx-chem-hero-simple--full-image {
    padding-top: max(78px, calc(var(--yx-nav-height) + 2rem));
}
@media (prefers-reduced-motion: reduce) {
    html.yx-hero-nav-active .yx-hero-nav-page .custom-nav-module { transition: none; }
}

/* 2026-10-23: full first viewport on EN/ZH home; retain original brand assets. */
html.yx-hero-nav-active .yx-hero-nav-page .nav-right > .nav-search > .search-toggle:hover,
html.yx-hero-nav-active .yx-hero-nav-page .nav-right > .nav-search > .search-toggle:focus-visible {
    background: var(--nav--brand, #163e96) !important;
    color: #fff !important;
    text-shadow: none;
}

html.yx-hero-nav-active .home.yx-hero-nav-page .bc-banner__viewport,
html.yx-hero-nav-active .home.yx-hero-nav-page .bc-banner__track,
html.yx-hero-nav-active .home.yx-hero-nav-page .bc-banner__slide {
    height: calc(100vh - var(--yx-nav-admin-offset, 0px));
    min-height: calc(100vh - var(--yx-nav-admin-offset, 0px));
    height: calc(100svh - var(--yx-nav-admin-offset, 0px));
    min-height: calc(100svh - var(--yx-nav-admin-offset, 0px));
}
html.yx-hero-nav-active .home.yx-hero-nav-page .bc-banner__viewport {
    aspect-ratio: auto;
}

/* About and chemical catalog EN/ZH: first viewport, including overlay navigation. */
html.yx-hero-nav-active body:is(.page-id-39, .page-id-766) .about-blue .about-hero,
html.yx-hero-nav-active body:is(.page-id-1143, .page-id-1158) .yx-chem-hero-simple.yx-chem-hero-simple--full-image {
    box-sizing: border-box;
    min-height: calc(100vh - var(--yx-nav-admin-offset, 0px));
    min-height: calc(100svh - var(--yx-nav-admin-offset, 0px));
}
html.yx-hero-nav-active body:is(.page-id-39, .page-id-766) .about-blue .about-hero {
    display: flex;
    align-items: center;
}
html.yx-hero-nav-active body:is(.page-id-39, .page-id-766) .about-blue .about-hero > .about-container {
    width: 100%;
}
html.yx-hero-nav-active body:is(.page-id-39, .page-id-766) .about-blue .about-hero-inner {
    padding-top: calc(var(--yx-nav-height, 84px) + 2rem) !important;
    padding-bottom: 3rem !important;
}
/* min-height, not a fixed height: long mobile content remains fully accessible. */