/* One navigation component and stylesheet for the website and Examples. */
:root{--site-control-font:500 14px/20px "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;--site-control-height:44px;--site-control-radius:5px}
.nav{--bg:#16212f;--text:#f2f6fa;--muted:#b5c4d4;--line:#35485d;--line2:#4c637b;--accent:#4dccd6;--c1:#4dccd6;--site-nav-active:#225a83;--site-nav-active-text:#f2f6fa;--site-nav-gutter:clamp(20px,3vw,48px);font:400 16px/1.6 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;position:sticky;top:0;z-index:60;background:var(--bg);color:var(--text);border-bottom:0;backdrop-filter:none;-webkit-backdrop-filter:none;color-scheme:dark}
[data-theme=light] .nav{--bg:#f5f7f9;--text:#101820;--muted:#445869;--line:#d9e2e9;--line2:#b8c8d6;--accent:#0064b7;--c1:#0064b7;--site-nav-active:#0064b7;--site-nav-active-text:#fff;color-scheme:light}
.nav,.nav *{box-sizing:border-box}.nav>.wrap{width:100%;max-width:1440px;margin:0 auto;padding:0 var(--site-nav-gutter)}.nav .nav__in{display:flex;align-items:center;gap:36px;height:64px;justify-content:normal}.nav .nav__logo{display:block;flex-shrink:0;text-decoration:none}.nav .nav__logo img{display:block;width:auto;height:47px;margin:0;max-width:100%}.nav .only-light{display:none!important}[data-theme=light] .nav .only-light{display:block!important}[data-theme=light] .nav .only-dark{display:none!important}
.nav #primary-nav{display:block;flex:1;min-width:0}.nav .nav__links{display:flex;align-items:center;gap:4px;list-style:none;margin:0;padding:0;font:var(--site-control-font);letter-spacing:0;text-transform:none;white-space:nowrap}.nav .nav__links a{display:block;padding:10px 10px!important;border-radius:var(--site-control-radius);color:var(--muted);text-decoration:none;border:0}.nav .nav__links a:hover,.nav .nav__links a[aria-current=page]{color:var(--text)}.nav .nav__links a[aria-current=page]{box-shadow:none;background:var(--site-nav-active);color:var(--site-nav-active-text)}
.nav .wcc-language{flex:0 0 auto}.nav .nav__tools{display:flex;align-items:center;gap:12px;margin-left:auto;flex-shrink:0}.nav .iconbtn{display:inline-grid;place-items:center;width:38px;height:38px;border:1px solid var(--line2);border-radius:4px;background:transparent;color:var(--text);padding:0;cursor:pointer}.nav .iconbtn:hover{color:var(--accent);border-color:var(--accent)}.nav .iconbtn svg{display:block}.nav .menu-btn{display:none}.nav .nav__download{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:40px;height:40px;white-space:nowrap;padding:9px 14px;border:1px solid var(--c1);border-radius:var(--site-control-radius);background:var(--c1);color:#05222a;font:var(--site-control-font);text-decoration:none;flex-shrink:0}.nav .nav__download:hover{filter:brightness(1.08)}[data-theme=light] .nav .nav__download{color:#fff}.nav .nav__mobile-download{display:none}.nav :focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media(max-width:1100px){.nav .nav__in{gap:24px}.nav #primary-nav{display:none}.nav .menu-btn{display:inline-grid}.nav #primary-nav.is-open{display:block;position:absolute;inset:100% 0 auto;background:var(--bg);border-bottom:0}.nav #primary-nav.is-open .nav__links{display:flex;flex-direction:column;align-items:stretch;gap:4px;padding:8px var(--site-nav-gutter) 18px}.nav #primary-nav.is-open .nav__links a{padding:14px 12px!important;border-bottom:0;box-shadow:none}.nav #primary-nav.is-open .nav__links a[aria-current=page]{color:var(--site-nav-active-text)}}
@media(max-width:860px){.nav .nav__in{gap:14px}.nav .nav__logo img{height:44px}}
@media(max-width:600px){.nav .nav__logo img{height:38px}.nav .nav__download{display:none}.nav .nav__mobile-download{display:list-item}.nav .nav__tools{gap:8px}}
@media(prefers-reduced-motion:no-preference){.nav{transition:background-color 160ms ease,color 160ms ease}.nav .iconbtn,.nav .nav__download{transition:background-color 140ms ease,border-color 140ms ease,color 140ms ease}}