/* Shared compact navigation and rounded panels used by the reference-style pages. */
:root { --blue:#0077d9; --blue-dark:#0066bb; --teal:#39a6aa; --content:1200px; --radius:24px; }
body { color:#20262d; background:#f5f7fa; font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Noto Sans HK','PingFang HK','Microsoft JhengHei',Arial,sans-serif; }
body,button,input,select,textarea { font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Noto Sans HK','PingFang HK','Microsoft JhengHei',Arial,sans-serif; }
body .container { width:min(calc(100% - 64px),var(--content)); }
body .site-header { box-shadow:0 2px 10px #1423320b; border-color:#e7e9ed; }
body .header-inner { width:calc(100% - 96px); max-width:none; margin-inline:auto; min-height:68px; padding-block:8px; gap:24px; display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; }
body .brand-wrap { justify-self:start; min-width:0; max-width:100%; }
body .header-actions { display:flex; align-items:center; gap:14px; justify-self:end; }
body .brand { color:var(--teal); font-size:22px; letter-spacing:-.045em; font-weight:750; }
body .brand>span:last-child { text-transform:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
body .brand-icon { flex-shrink:0; }
body .brand-wrap .custom-logo { max-width:100%; }
body .brand-sub { display:none; }
body .brand-icon { transform:skewY(-15deg) scale(.7); margin-right:-5px; }
body .brand-icon i { background:var(--teal); }
body .primary-navigation { gap:clamp(20px,2vw,40px); font-size:16px; justify-self:center; }
body .primary-navigation>a:not(.button),body .nav-more>summary { font-size:16px; font-weight:700; color:#252a32; }
body .header-actions .button,body .primary-navigation .button { min-height:40px; padding:8px 16px; border-radius:999px; font-size:14px; white-space:nowrap; }
body .language-switch { position:relative; display:block; white-space:nowrap; font-size:13px; margin:0; padding:0; }
body .header-language>summary { display:flex; align-items:center; gap:8px; min-height:40px; padding:7px 12px; border:1px solid #dfe3e9; border-radius:999px; background:white; list-style:none; cursor:pointer; color:#252a32; font-size:13px; font-weight:500; }
body .header-language>summary::-webkit-details-marker { display:none; }
body .language-flag { font-size:19px; line-height:1; }
body .language-chevron { color:#747d86; margin-left:2px; }
body .language-options { position:absolute; top:calc(100% + 10px); right:0; width:190px; padding:6px; border:1px solid #dfe3e9; border-radius:14px; background:white; box-shadow:0 12px 28px #26364814; }
body .language-options a { display:block; min-height:44px; padding:10px 12px; border-radius:9px; color:#252a32; font-size:14px; }
body .language-options a:hover,body .language-options a[aria-current] { background:#f0f6fc; color:var(--blue); }
body .header-language>summary:focus-visible,body .nav-more>summary:focus-visible { outline:3px solid var(--blue); outline-offset:3px; }
body .primary-navigation .nav-partner-mobile { display:none; }
body .nav-more>summary { min-height:44px; }
body .nav-products>summary { gap:8px; }
body .nav-chevron { display:block; width:14px; height:14px; flex:none; transition:transform .16s ease; }
body .nav-products[open]>summary .nav-chevron { transform:rotate(180deg); }
@media(prefers-reduced-motion:reduce) { body .nav-chevron { transition:none; } }
body .nav-dropdown { border-radius:16px; }
body .menu-toggle { font-size:16px; }
html:not(.js) body .menu-toggle { display:none; }
body .button { border-radius:999px; }
body .page-heading-wrap { background:#f5f7fa; }
body .page-heading { padding-block:20px 42px; }
body .page-heading h1 { font-size:clamp(32px,3.5vw,46px); letter-spacing:-.035em; }
body .page-intro { font-size:17px; max-width:860px; margin-top:18px; }
body .breadcrumbs { padding-block:22px 8px; }
body .page-body { background:white; border-radius:24px; padding:36px; margin-bottom:40px; }
body .page-body .editorial-content { max-width:none; }
body .form-layout { padding:0; background:transparent; }
body .form-main { background:white; padding:28px; border:1px solid var(--line); border-radius:24px; }
body .inquiry-aside { border-radius:24px; }
body .ld-inquiry { border-radius:18px; }
body .cta-panel { border-radius:24px; background:#0878d1; }
body .site-footer { background:#f0f2f5; color:#25303a; padding-top:48px; border-top:1px solid #e0e5eb; }
body .site-footer p { color:#566370; }
body .footer-links h2 { color:#232c35; font-size:16px; font-weight:750; }
body .footer-links a,body .footer-bottom a,body .footer-contact { color:#46525e; font-size:15px; }
body .footer-links a:hover,body .footer-contact:hover { color:var(--blue); }
body .footer-bottom { border-color:#dbe1e7; }
body .footer-bottom p { font-size:14px; }
body .footer-brand>p { font-size:15px; line-height:1.8; }
body .footer-office { margin-top:18px; font-size:15px; }
body .footer-office p { margin-top:6px; font-size:14px; }
body .footer-contact-lines { display:grid; gap:6px; margin-top:18px; font-size:15px; overflow-wrap:anywhere; }
body .contact-rail { box-shadow:0 8px 28px #26364814; }
@media(min-width:1400px) { body { padding-right:0; } }
@media(min-width:1100px) and (max-width:1399px) { body .site-header { margin-right:-104px; } }
@media(min-width:1200px) {
  body .menu-toggle { display:none; }
  .js body .menu-toggle { display:none; }
  .js body .primary-navigation:not(.is-open) { display:flex; }
  body .primary-navigation { position:static; display:flex; flex-direction:row; align-items:center; padding:0; max-height:none; overflow:visible; box-shadow:none; border:0; background:transparent; flex-basis:auto; }
  html:not(.js) body .header-inner { flex-wrap:nowrap; padding-block:8px; }
  html:not(.js) body .primary-navigation { flex-basis:auto; }
  body .nav-more { position:relative; width:auto; }
  body .nav-dropdown { position:absolute; top:calc(100% + 8px); left:0; right:auto; width:250px; padding:12px; border:1px solid var(--line); box-shadow:0 12px 28px #26364814; background:white; grid-template-columns:1fr; max-height:calc(100svh - 150px); overflow:auto; }
  body .custom-nav { display:flex; flex-wrap:wrap; justify-content:center; gap:8px 24px; max-width:min(560px,45vw); }
  body .custom-nav .sub-menu { position:absolute; display:none; border:1px solid var(--line); box-shadow:var(--shadow); padding:12px; }
  body .custom-nav li:hover>.sub-menu,body .custom-nav li:focus-within>.sub-menu { display:block; }
}
@media(max-width:1199px) {
  body .header-inner { width:calc(100% - 48px); grid-template-columns:minmax(0,1fr) auto auto; gap:16px; }
  body .brand-wrap { grid-column:1; grid-row:1; }
  body .header-actions { grid-column:2; grid-row:1; }
  body .header-actions .button,body .header-language>summary { min-height:44px; }
  body .menu-toggle { display:inline-flex; }
  body .menu-toggle { grid-column:3; grid-row:1; }
  body .primary-navigation { display:none; position:absolute; top:100%; left:0; right:0; padding:18px 32px; background:white; flex-direction:column; align-items:stretch; gap:6px; box-shadow:0 12px 22px #26364814; max-height:var(--navigation-height,70vh); overflow:auto; }
  body .primary-navigation.is-open { display:flex; }
  body .nav-more { width:100%; }
  body .nav-dropdown { position:static; box-shadow:none; border:0; padding:4px 10px; width:100%; }
  html:not(.js) body .primary-navigation { display:flex; position:static; grid-column:1/-1; grid-row:2; justify-self:stretch; max-height:none; }
  html:not(.js) body .header-inner { padding-block:8px; }
}
@media(max-width:767px) {
  body .container { width:calc(100% - 32px); }
  body .header-inner { width:calc(100% - 32px); min-height:64px; gap:10px; }
  body .header-actions { gap:0; }
  body .header-actions .header-partner { display:none; }
  body .menu-toggle { justify-content:center; width:44px; min-width:44px; padding:10px; }
  body .menu-toggle>span:last-child { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
  body .primary-navigation .nav-partner-mobile { display:inline-flex; align-self:flex-start; margin-top:12px; }
  body .header-language>summary { min-height:44px; padding-inline:10px; }
  body .primary-navigation { padding-inline:20px; }
  body .page-heading { padding-block:18px 30px; }
  body .page-body { padding:24px 20px; border-radius:20px; margin-bottom:28px; }
  body .form-layout { padding:0; }
  body .form-main { padding:18px 14px; }
  body .form-layout .inquiry-aside { padding:24px; }
  body .footer-top { gap:28px 20px; }
}
@media print { body { background:white; } body .page-body { padding:0; border:0; } }