/* KGH-WHITE-THEME (2026-09-24): light-grey minimal header (same grey as page section backgrounds).
   bg #F6F9FC + 1px #E5E7EB bottom rule (soft shadow once scrolled), nav #1F2937 -> hover brand red,
   light-grey (#F3F4F6) rounded search, CTA keeps brand red. Logo: dark-text version (see filter note). */
#kgh{--kg-ink:#1F2937;--kg-red-dark:#C00818;--kg-soft:#F3F4F6;--kg-line:#E5E7EB;--kg-shadow:0 10px 30px rgba(17,24,39,.10)}
#kgh .header,#kgh .header.is-floating{background:#f6f9fc!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border:0!important;border-bottom:1px solid #E5E7EB!important;box-shadow:none!important}
#kgh .header.is-floating{box-shadow:0 4px 16px rgba(17,24,39,.08)!important}
#kgh .header::before,#kgh .header::after{content:none!important;display:none!important}
#kgh .nav .menu>li>a{color:#1F2937!important}
#kgh .nav .menu>li>a:hover,#kgh .nav .menu>li:hover>a,#kgh .nav .menu>li:focus-within>a{color:#C00818!important}
#kgh .nav .menu>li:has(>ul)>a::after{filter:none!important}
#kgh .nav .menu li ul{background:#fff!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border:1px solid #E5E7EB!important;box-shadow:0 12px 32px rgba(17,24,39,.12)!important}
#kgh .nav .menu li ul li a{color:#1F2937!important}
#kgh .nav .menu li ul li a:hover{background:#F3F4F6!important;color:#C00818!important}
#kgh .menu-toggle{color:#1F2937!important}
#kgh .kgh-search-toggle{background:#fff!important;border:1px solid #E5E7EB!important;border-radius:7px!important;color:#374151!important}
#kgh .kgh-search-toggle:hover{background:#e6edf5!important}
#kgh .kgh-search-toggle svg{fill:#374151!important}
#kgh .kgh-search-panel{background:#fff!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border:1px solid #E5E7EB!important;box-shadow:0 12px 32px rgba(17,24,39,.12)!important}

#kgh .kgh-search-go{background:#c30d23!important;border-radius:7px!important}
#kgh .kgh-search-go svg{fill:#fff!important}
@media(max-width:680px){
  #kgh .header,#kgh .header.is-floating{background:#f6f9fc!important;box-shadow:none!important}
  #kgh .nav.open{background:#f6f9fc!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border-top:1px solid #E5E7EB!important;box-shadow:0 16px 32px rgba(17,24,39,.12)!important}
  #kgh .nav.open .menu>li{border-bottom:1px solid #E5E7EB!important}
  #kgh .nav.open .menu li ul{background:#F9FAFB!important;border:0!important;box-shadow:none!important}
}
/* Hover intent: a dropdown opens only after the pointer rests ~140ms on its item and lingers ~160ms after it leaves,
   so brushing across a neighbouring item (e.g. Our Product) while moving inside another dropdown no longer swaps menus. */
@media(min-width:681px){
  #kgh .nav .menu li ul{transition:opacity .16s ease,transform .16s ease,visibility 0s linear .16s!important}
  #kgh .nav .menu li:hover > ul{transition:opacity .22s ease .14s,transform .22s ease .14s,visibility 0s linear .14s!important}
}
/* Mobile drawer: sub-menu links were light grey (#e8e8ea) for the old dark drawer; make them dark on the light drawer. */
@media(max-width:680px){
  #kgh .nav.open .menu li ul li a,
  #kgh .nav.open .menu li.open > ul.kgh-mega ul li a { color:#1F2937!important }
  #kgh .nav.open .menu li ul li a:hover,
  #kgh .nav.open .menu li.open > ul.kgh-mega ul li a:hover { color:#C00818!important }
}
/* Type: expanded sub-menu links are 14px (same as breadcrumb and spec labels). */
#kgh .nav .menu li ul li a,
#kgh .nav .menu li ul.kgh-mega > li.kgh-mega-col > a,
#kgh .nav .menu li ul.kgh-mega ul li a,
#kgh .nav.open .menu li ul li a,
#kgh .nav.open .menu li.open > ul.kgh-mega ul li a { font-size:14px!important }
/* Our Product mega menu: columns are wide enough for their longest label, so category titles never overlap and links stay on one line (>=1200px);
   narrower desktops keep the 880px panel and let long labels wrap inside their column. */
@media(min-width:1200px){
  #kgh .nav .menu li ul.kgh-mega{width:1080px!important;max-width:1080px!important;margin-left:-540px!important;column-gap:24px!important}
  #kgh .nav .menu li ul.kgh-mega > li.kgh-mega-col > a{white-space:nowrap!important}
  #kgh .nav .menu li ul.kgh-mega ul li a{white-space:nowrap!important}
}
@media(min-width:681px) and (max-width:1199px){
  #kgh .nav .menu li ul.kgh-mega > li.kgh-mega-col > a{white-space:normal!important}
}
/* === kgh-lang CSS (globe switcher) === */
#kgh .kgh-lang{position:relative;display:flex;align-items:center}
#kgh .kgh-lang-toggle{display:flex;align-items:center;justify-content:center;width:42px;height:42px;padding:0;background:#fff!important;border:1px solid #E5E7EB!important;border-radius:7px!important;color:#374151!important;cursor:pointer;transition:background-color .2s ease,color .2s ease}
#kgh .kgh-lang-toggle:hover,#kgh .kgh-lang.open .kgh-lang-toggle{background:#e6edf5!important;color:#c30d23!important}
#kgh .kgh-lang-toggle svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
#kgh .kgh-lang-panel{position:absolute;top:calc(100% + 20px);right:0;min-width:168px;padding:6px;background:#fff;border:1px solid #E5E7EB;border-radius:7px;box-shadow:0 18px 40px -18px rgba(17,24,39,.35);display:none;z-index:9005}
#kgh .kgh-lang.open .kgh-lang-panel{display:block}
#kgh .kgh-lang-panel a{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:9px 12px;border-radius:7px;color:#111827!important;text-decoration:none;font-size:14px;font-weight:500;line-height:1.2;white-space:nowrap}
#kgh .kgh-lang-panel a:hover{background:#F3F4F6;color:#c30d23!important}
#kgh .kgh-lang-panel a[aria-current="true"]{color:#c30d23!important;font-weight:600}
#kgh .kgh-lang-panel .kgh-tick{opacity:0;font-size:12px;line-height:1}
#kgh .kgh-lang-panel a[aria-current="true"] .kgh-tick{opacity:1}
@media(max-width:680px){
  #kgh .kgh-lang-toggle{width:38px;height:38px}
  #kgh .kgh-lang-panel{min-width:150px;top:calc(100% + 18px)}
}
/* === kgh-lang CSS end === */
