/* Slim see-through navbar: wordmark left, centred links, pill dropdown triggers, rounded Contact button.
   Dropdown panels are dark, rounded and slightly translucent in every theme. Loaded after the theme sheets. */
:root{--jm-nav-h:68px;--jm-dd-bg:rgba(16,16,18,.86);--jm-dd-line:rgba(255,255,255,.1);--jm-dd-soft:rgba(255,255,255,.06);--jm-dd-muted:rgba(255,255,255,.62);--jm-orange:#ff751f}
@media(max-width:1190px){:root{--jm-nav-h:64px}}

/* Bar: no background at all, like todesktop.com. The header sits at the top of the page over the hero and scrolls away with it. */
html #hdr.jm-header,html #hdr.jm-header.hn-scrolled,html[data-theme] #hdr.jm-header,html[data-theme] #hdr.jm-header:is(.hn-scrolled,.bio-solid,.bio-light-bar,.hide){position:absolute!important;top:0!important;transform:none!important;background:transparent!important;border:0!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
html #hdr.jm-header::before{display:none!important}
html #hdr.jm-header nav.jm-navigation,html #hdr.jm-header.hn-scrolled nav.jm-navigation{position:relative;height:var(--jm-nav-h)!important;gap:0!important;align-items:center}
html #home.hn-home{padding-top:0!important}
/* The homepage photo runs up behind the links, with a light top fade so white text stays readable */
html #home .hn-hero{padding-top:var(--jm-nav-h)!important;box-sizing:content-box!important}
html #home .hn-hero::before{content:"";position:absolute;inset:0 0 auto;height:calc(var(--jm-nav-h) + 70px);z-index:2;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.5),rgba(0,0,0,0))}
html #hdr .jm-navlinks a:not(.jm-button),html #hdr .jm-menutrigger,html #hdr .jm-brand{text-shadow:0 1px 8px rgba(0,0,0,.35)}
html #view .pm-page{padding-top:var(--jm-nav-h)!important}
html #hdr nav.jm-mobile-menu{max-height:calc(100dvh - var(--jm-nav-h) - 24px)!important}

/* Wordmark with the motto beside it, like a product tag */
html #hdr.jm-header .jm-brand,html #hdr.jm-header.hn-scrolled .jm-brand{display:flex!important;flex-direction:row!important;align-items:center!important;gap:12px;margin:0!important;transform:none!important;font-size:26px!important;line-height:1;flex:none}
html:not([data-theme=bio]) #hdr .jm-header-motto,html:not([data-theme=bio]) #hdr.hn-scrolled .jm-brand small{display:block!important;margin:0!important;padding-left:12px;border-left:1px solid rgba(255,255,255,.18);color:rgba(255,255,255,.6)!important;font:400 12px/1.25 Roboto,Arial,sans-serif!important;max-width:150px;white-space:normal!important}
@media(max-width:520px){html:not([data-theme=bio]) #hdr .jm-header-motto,html:not([data-theme=bio]) #hdr.hn-scrolled .jm-brand small{display:none!important}html #hdr.jm-header .jm-brand{font-size:24px!important}}

/* Centred links */
@media(min-width:1191px){
 html #hdr .jm-navlinks{display:contents!important}
 html #hdr .jm-navlinks>.jm-navgroup:first-child{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex!important;align-items:center;gap:4px;margin:0!important}
 html #hdr .jm-navlinks>.jm-navgroup:last-child{margin-left:auto!important;display:flex!important;align-items:center}
}
html #hdr .jm-navlinks a:not(.jm-button),html #hdr .jm-menutrigger{display:inline-flex!important;align-items:center;gap:6px;height:36px;margin:0!important;padding:0 14px!important;border:1px solid transparent!important;border-radius:999px!important;background:transparent!important;color:rgba(255,255,255,.82)!important;font:500 14px/1 Roboto,Arial,sans-serif!important;letter-spacing:0!important;text-decoration:none!important;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
html #hdr .jm-navlinks a:not(.jm-button)::after,html #hdr .jm-menutrigger::after{display:none!important}
html #hdr .jm-navlinks a:not(.jm-button):hover,html #hdr .jm-menutrigger:hover{background:var(--jm-dd-soft)!important;color:#fff!important}
html #hdr .jm-menutrigger[aria-expanded=true]{background:rgba(255,255,255,.08)!important;border-color:rgba(255,255,255,.12)!important;color:#fff!important}
html #hdr .jm-menutrigger .jm-chevron{display:inline-block!important;width:6px!important;height:6px!important;margin:-3px 0 0 2px!important;border:solid currentColor!important;border-width:0 1.6px 1.6px 0!important;background:none!important;transform:rotate(45deg);transition:transform .2s,margin .2s}
html #hdr .jm-menutrigger .jm-chevron::before,html #hdr .jm-menutrigger .jm-chevron::after{display:none!important}
html #hdr .jm-menutrigger[aria-expanded=true] .jm-chevron{transform:rotate(-135deg);margin-top:3px!important}

/* Contact as a rounded button, theme and language as matching round controls */
html #hdr .jm-navlinks .jm-button{display:inline-flex!important;align-items:center;height:36px;min-height:0!important;padding:0 18px!important;border:1px solid rgba(255,255,255,.22)!important;border-radius:999px!important;background:rgba(255,255,255,.14)!important;color:#fff!important;font:500 14px/1 Roboto,Arial,sans-serif!important;box-shadow:none!important;transform:none!important;transition:background .15s,border-color .15s,color .15s}
html #hdr .jm-navlinks .jm-button::after{display:none!important}
html #hdr .jm-navlinks .jm-button:hover{background:var(--jm-orange)!important;border-color:var(--jm-orange)!important;color:#000!important}
html #hdr .jm-theme-toggle{width:36px;height:36px;margin:0 0 0 10px!important;border:1px solid rgba(255,255,255,.22)!important;background:rgba(255,255,255,.12)!important}
html #hdr .jm-language{margin-left:8px!important}
html #hdr .jm-language summary{height:36px;min-height:0!important;padding:0 12px!important;display:flex!important;align-items:center;gap:6px;border:1px solid rgba(255,255,255,.22)!important;border-radius:999px!important;background:rgba(255,255,255,.12)!important;color:#fff!important;font:500 13px/1 Roboto,Arial,sans-serif!important}
html #hdr :is(.jm-theme-menu,.jm-language-options){background:var(--jm-dd-bg)!important;-webkit-backdrop-filter:blur(20px) saturate(140%);backdrop-filter:blur(20px) saturate(140%);border:1px solid var(--jm-dd-line)!important;border-radius:14px!important;box-shadow:0 24px 60px rgba(0,0,0,.5)!important}
html #hdr .jm-theme-menu{top:calc(100% + 8px)!important}

/* Dropdown panel */
html #hdr .jm-menu.jm-dd{position:absolute!important;top:calc(100% + 8px)!important;left:0;right:auto!important;bottom:auto!important;transform:none!important;width:min(420px,calc(100vw - 32px))!important;min-height:0!important;max-height:none!important;height:auto!important;margin:0!important;padding:8px!important;display:block!important;background:var(--jm-dd-bg)!important;-webkit-backdrop-filter:blur(20px) saturate(140%);backdrop-filter:blur(20px) saturate(140%);border:1px solid var(--jm-dd-line)!important;border-radius:14px!important;box-shadow:0 24px 60px rgba(0,0,0,.5)!important;z-index:90;animation:jm-dd-in .16s ease-out}
html #hdr .jm-menu.jm-dd[hidden]{display:none!important}
@keyframes jm-dd-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
html #hdr .jm-dd-item{display:flex!important;align-items:flex-start;gap:12px;width:auto!important;margin:0!important;padding:10px 12px!important;border:0!important;border-radius:10px!important;background:transparent!important;color:#fff!important;text-decoration:none!important;transition:background .15s}
html #hdr .jm-dd-item::after,html #hdr .jm-dd-item::before{display:none!important}
html #hdr .jm-dd-item:hover,html #hdr .jm-dd-item:focus-visible{background:var(--jm-dd-soft)!important}
html #hdr .jm-dd-item .jm-mega-icon{flex:none;width:32px;height:32px;margin-top:1px;display:grid;place-items:center;border-radius:8px!important;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04)!important;color:#fff!important;box-shadow:none!important;transition:color .15s,border-color .15s}
html #hdr .jm-dd-item .jm-mega-icon svg{width:17px;height:17px}
html #hdr .jm-dd-item:hover .jm-mega-icon,html #hdr .jm-dd-item:focus-visible .jm-mega-icon{color:var(--jm-orange)!important;border-color:rgba(255,117,31,.45)}
html #hdr .jm-dd-item strong{display:block;color:#fff!important;font:600 14px/1.35 Roboto,Arial,sans-serif!important;letter-spacing:0!important;text-transform:none!important}
html #hdr .jm-dd-item small{display:block;margin-top:2px;color:var(--jm-dd-muted)!important;font:400 13px/1.45 Roboto,Arial,sans-serif!important}
html #hdr .jm-dd-rule{height:0;margin:6px -8px!important;border:0!important;border-top:1px solid rgba(255,255,255,.08)!important;background:none!important}
html #hdr .jm-dd-foot{align-items:center}
html #hdr .jm-dd-foot>i{margin-left:auto;color:var(--jm-orange);font:500 15px/1 Roboto,Arial,sans-serif;font-style:normal;transition:transform .15s}
html #hdr .jm-dd-foot:hover>i{transform:translateX(3px)}
@media(max-width:1190px){html #hdr .jm-menu.jm-dd{display:none!important}}

/* Mobile: round menu button and the same panel style */
@media(max-width:1190px){
 html #hdr .jm-mobile-toggle{display:grid!important;place-content:center;width:40px;height:36px;margin-left:8px!important;padding:0!important;border:1px solid rgba(255,255,255,.14)!important;border-radius:999px!important;background:rgba(255,255,255,.06)!important;color:#fff!important}
 html #hdr .jm-mobile-toggle span{width:16px!important;height:1.6px!important;margin:2px 0!important;transition:transform .2s,opacity .2s}
 html #hdr .jm-mobile-toggle[aria-expanded=true] span:first-child{transform:translateY(3.6px) rotate(45deg)!important}
 html #hdr .jm-mobile-toggle[aria-expanded=true] span:last-child{transform:translateY(-3.6px) rotate(-45deg)!important}
 html #hdr .jm-theme-toggle{margin-left:auto!important}
}
html #hdr nav.jm-mobile-menu.jm-dd-mobile{position:absolute;top:calc(100% + 8px);left:12px;right:12px;width:auto!important;max-width:460px!important;margin:0 0 0 auto!important;padding:8px!important;overflow:auto;background:var(--jm-dd-bg)!important;-webkit-backdrop-filter:blur(20px) saturate(140%);backdrop-filter:blur(20px) saturate(140%);border:1px solid var(--jm-dd-line)!important;border-radius:16px!important;box-shadow:0 24px 60px rgba(0,0,0,.55)!important;animation:jm-dd-in .16s ease-out}
html #hdr nav.jm-mobile-menu.jm-dd-mobile[hidden]{display:none!important}
html #hdr .jm-dd-mobile .jm-dd-group+.jm-dd-group{margin-top:2px;padding-top:6px;border-top:1px solid rgba(255,255,255,.08)}
html #hdr .jm-dd-label{margin:0!important;padding:10px 12px 4px!important;color:rgba(255,255,255,.5)!important;font:600 12px/1.2 Roboto,Arial,sans-serif!important;letter-spacing:.06em!important;text-transform:uppercase}
html #hdr .jm-dd-end{display:flex;align-items:center;gap:8px;margin-top:6px;padding:10px 4px 4px;border-top:1px solid rgba(255,255,255,.08)}
html #hdr .jm-dd-end a{display:inline-flex!important;align-items:center;justify-content:center;flex:1;height:42px;margin:0!important;padding:0 16px!important;border-radius:999px!important;font:500 15px/1 Roboto,Arial,sans-serif!important;text-decoration:none!important;box-shadow:none!important}
html #hdr .jm-dd-end .jm-dd-plain{border:1px solid rgba(255,255,255,.14)!important;background:rgba(255,255,255,.06)!important;color:#fff!important}
html #hdr .jm-dd-end .jm-button{border:1px solid var(--jm-orange)!important;background:var(--jm-orange)!important;color:#000!important}

/* Editorial theme keeps its transparent and light bars; controls switch to dark ink on the light bar */
html[data-theme=bio] #hdr.bio-light-bar :is(.jm-navlinks a:not(.jm-button),.jm-menutrigger){color:rgba(17,18,20,.8)!important}
html[data-theme=bio] #hdr.bio-light-bar :is(.jm-navlinks a:not(.jm-button),.jm-menutrigger):hover,html[data-theme=bio] #hdr.bio-light-bar .jm-menutrigger[aria-expanded=true]{background:rgba(0,0,0,.05)!important;border-color:rgba(0,0,0,.1)!important;color:#111214!important}
html[data-theme=bio] #hdr.bio-light-bar :is(.jm-navlinks .jm-button,.jm-theme-toggle,.jm-language summary,.jm-mobile-toggle){background:rgba(0,0,0,.04)!important;border-color:rgba(0,0,0,.14)!important;color:#111214!important}
html[data-theme=bio] #hdr.bio-light-bar .jm-navlinks .jm-button:hover{background:var(--jm-orange)!important;border-color:var(--jm-orange)!important;color:#000!important}
html[data-theme=bio] #hdr.bio-light-bar .jm-header-motto{color:rgba(17,18,20,.6)!important;border-color:rgba(0,0,0,.15)}

@media(prefers-reduced-motion:reduce){html #hdr :is(.jm-menu.jm-dd,nav.jm-mobile-menu.jm-dd-mobile){animation:none}}