* { box-sizing: border-box; }
    html { background: #00422f; color-scheme: light; scroll-padding-top: 80px; scroll-behavior: smooth; }
    body { margin: 0; font-family: "PingFang HK", "PingFang TC", "Microsoft JhengHei", "Noto Sans HK", "Noto Sans TC", Arial, sans-serif; font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
    button { font: inherit; }
    button, a { -webkit-tap-highlight-color: transparent; }
    .site-header { position: sticky; top: 0; z-index: 100; background: #fff; transition: box-shadow 220ms cubic-bezier(.2,.8,.2,1); }
    .site-header.scrolled { box-shadow: 0 6px 20px rgb(35 31 32 / 7%); }
    .header-inner, .drawer-head-inner { width: calc(100% - 32px); max-width: 718px; height: 64px; margin-inline: auto; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 4px; }
    .brand, .drawer-brand { min-width: 0; display: flex; align-items: center; justify-self: start; text-decoration: none; }
    .value-partners-logo { height: 48px; display: inline-flex; align-items: center; flex: none; }
    .value-partners-logo img { display: block; width: auto; max-width: none; height: 44px; }
    .header-actions { display: flex; align-items: center; gap: 4px; }
    .icon-button { width: 44px; height: 44px; display: inline-grid; place-items: center; padding: 2px 6px; border: 1px solid transparent; border-radius: 4px; color: #231f20; background: transparent; text-decoration: none; cursor: pointer; transition: color 160ms cubic-bezier(.2,.8,.2,1), background-color 160ms cubic-bezier(.2,.8,.2,1), transform 160ms cubic-bezier(.2,.8,.2,1); }
    .header-actions .icon-button { border-radius: 50%; }
    .icon-button:active { transform: scale(.97); transition-duration: 80ms; }
    .icon { display: block; width: 20px; height: 20px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
    .icon-sm { width: 16px; height: 16px; }
    a:focus-visible, button:focus-visible { outline: 2px solid #20a06e; outline-offset: 2px; }
    .mobile-nav { position: fixed; inset: 0; width: 100%; max-width: none; height: 100%; height: 100dvh; max-height: none; margin: 0; padding: 0; border: 0; color: #231f20; background: transparent; overflow: hidden; }
    .mobile-nav::backdrop { background: rgb(35 31 32 / 34%); opacity: 0; transition: opacity 120ms cubic-bezier(.4,0,1,1); }
    .mobile-nav.is-open::backdrop { opacity: 1; transition: opacity 160ms cubic-bezier(.22,1,.36,1); }
    .drawer { width: 100%; height: 100%; display: flex; flex-direction: column; overflow: hidden; }
    .drawer-head { height: 64px; flex: 0 0 64px; background: #fff; }
    .drawer-head-inner { gap: 0; }
    .drawer-body { min-width: 0; min-height: 0; flex: 1 1 auto; display: flex; flex-direction: column; padding: 0 max(24px, calc((100% - 702px) / 2)) max(24px, env(safe-area-inset-bottom)); overflow: hidden; background: #fff; clip-path: inset(0 0 100%); transform-origin: top; transition: clip-path 220ms cubic-bezier(.4,0,1,1); }
    .mobile-nav.is-open .drawer-body { clip-path: inset(0); transition-duration: 320ms; transition-timing-function: cubic-bezier(.22,1,.36,1); }
    .drawer-brand .value-partners-logo { height: 48px; }
    .drawer-brand img { height: 44px; }
    .drawer-title { margin: 8px 0; color: #68736e; font-size: 13px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; }
    .mobile-primary { min-width: 0; min-height: 0; flex: 0 1 auto; display: grid; grid-auto-rows: max-content; align-content: start; padding: 0 4px 16px 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; touch-action: pan-y; -webkit-overflow-scrolling: touch; }
    .top-level-link { width: 100%; height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 0; color: #231f20; font-size: clamp(20px,2vw,24px); font-weight: 500; text-align: left; text-decoration: none; }
    .top-level-link svg { color: #20a06e; }
    .drawer-foot { flex: 0 0 auto; display: grid; margin-top: 12px; padding: 16px 0 0; border-top: 1px solid #dde5e1; color: #6d6e71; font-size: 15px; }
    .drawer-foot a { min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 12px; color: inherit; text-decoration: none; }
    @media (max-width: 480px) {
      .drawer-body { padding-inline: 16px; }
      .drawer-brand .value-partners-logo { height: 48px; }
      .drawer-brand img { height: 44px; }
    }
    @media (hover: hover) and (pointer: fine) {
      .icon-button:hover { color: #20a06e; background: #f2f8f5; border-color: #9fc7b7; }
      .drawer-foot a:hover { color: #20a06e; }
    }
    @media (prefers-reduced-motion: reduce) {
      html { scroll-behavior: auto; }
      *, *::before, *::after { transition-duration: .01ms !important; }
    }
/* Language controls use the dimensions and colors from origin-dev. */
.mobile-header-language { position:relative; display:inline-flex; }
.language-button { width:44px; height:44px; display:inline-grid; place-items:center; padding:0; border:1px solid transparent; border-radius:3px; color:#231f20; background:transparent; cursor:pointer; transform:scale(1); transition:color 160ms cubic-bezier(.2,.8,.2,1),border-color 160ms cubic-bezier(.2,.8,.2,1),background-color 160ms cubic-bezier(.2,.8,.2,1),transform 160ms cubic-bezier(.2,.8,.2,1); }
.language-button.is-open { color:#20a06e; border-color:#9fc7b7; background:#e4f2ee; }
.language-button:active { transform:scale(.97); transition-duration:80ms; }
.language-button__label { font-size:13px; font-weight:500; line-height:1; letter-spacing:.01em; white-space:nowrap; }
.mobile-header-language__panel { position:absolute; top:calc(100% + 8px); right:0; z-index:10; min-width:max-content; padding:8px; border:1px solid #dde5e1; border-radius:4px; background:#fff; box-shadow:0 28px 80px rgb(35 31 32 / 24%); transform-origin:top right; }
.mobile-header-language__panel[hidden] { display:none; }
.language-switcher { display:flex; align-items:center; gap:4px; }
.language-switcher a { display:inline-grid; place-items:center; min-width:32px; min-height:32px; padding:4px 8px; border:0; border-radius:3px; color:#6d6e71; background:transparent; text-decoration:none; line-height:1.6; transition:color 80ms cubic-bezier(.2,.8,.2,1),background-color 80ms cubic-bezier(.2,.8,.2,1); }
.language-switcher a[aria-current=page] { color:#231f20; background:#e4f2ee; }
.language-row { min-height:52px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.language-row > span { color:inherit; font-size:inherit; font-weight:inherit; }
.drawer-foot .language-switcher a { min-height:32px; display:inline-grid; justify-content:center; }
.top-level-link > span { min-width:0; }
.top-level-link > svg { flex:none; }
@media (max-width:768px) { .language-switcher { gap:0; } .language-switcher a { padding-inline:4px; } }
@media (hover:hover) and (pointer:fine) {
  .language-button:not(.is-open):hover { color:#20a06e; border-color:#9fc7b7; background:#f2f8f5; }
  .language-switcher a:hover { color:#231f20; background:#e4f2ee; }
}
.top-level-link > span { white-space:pre-line; }
