/* The site-owned demo bar on the four Exposure demo pages (R3 site audit fix 5; WS-211: the two-menu look on the phone
   "is tidied later"; WS-238 (4)). Loaded after each demo's own stylesheet, which stays the Exposure lane's text.
   Below 900px the bar is one 44px row of links (All demos, the four companies, Method), scrolled sideways when it does
   not fit, so the site's Menu is the only menu button on the page. */
@media (max-width:899px){
.xd.xd .mh.xd-bar .wrap{height:44px;gap:0}
.xd.xd .xd-bar .xd-tag,.xd.xd .xd-bar #xd-menu-btn{display:none}
.xd.xd .xd-bar .mh-right{flex:1 1 auto;min-width:0}
.xd.xd .xd-bar .nav,.xd.xd .xd-bar .nav[data-open="true"]{display:block;position:static;flex:1 1 auto;min-width:0;background:none;border:0;padding:0}
.xd.xd .xd-bar .nav > ul{display:flex;gap:16px;overflow-x:auto;scrollbar-width:none;white-space:nowrap}
.xd.xd .xd-bar .nav > ul::-webkit-scrollbar{display:none}
.xd.xd .xd-bar .nav > ul > li{border:0;flex:none}
.xd.xd .xd-bar .nav a{min-height:44px;padding:0;font-size:13.5px;border-bottom:2px solid transparent}
.xd.xd .xd-bar .nav a:focus-visible{outline:2px solid var(--white);outline-offset:-3px}
.xd.xd .xd-bar .nav a[aria-current="page"]{box-shadow:none;padding-left:0;margin-left:0;border-bottom-color:var(--white);opacity:1}
}
@media (min-width:900px){
.xd.xd .xd-bar .nav > ul{gap:22px}
}
/* No sideways scroll of the page: a full-bleed exhibit inside a demo (its map is drawn to the screen's edges) is clipped
   to the screen, never wider than it (the audit measured 376px on a 375px phone). clip, not hidden: no scroll box, so
   sticky parts inside keep working. */
.xd .xd-main{overflow-x:clip}