@media (min-width:834px){#globalnav .globalnav-item-menu .globalnav-link-text{position:static;clip:auto;clip-path:none;overflow:visible;width:auto;height:100%;padding:0;border:0;display:flex;align-items:center;white-space:nowrap;font-family:"BB Text",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;}}#globalnav .globalnav-bag:not(.with-badge) .globalnav-bag-badge,#globalnav .globalnav-bag-badge[hidden]{display:none !important;}#globalnav .globalnav-search .globalnav-searchresults-current [data-bb-search-quicklinks="true"] .globalnav-searchresults-header,#globalnav .globalnav-search .globalnav-searchresults-current [data-bb-search-quicklinks="true"] .globalnav-searchresults-list-item{animation-name:none !important;opacity:0;transform:translateY(calc(var(--r-globalnav-search-shift-vertical,4px) * -1));will-change:opacity,transform;}#globalnav .globalnav-search.globalnav-item-flyout-open .globalnav-searchresults-current [data-bb-search-quicklinks="true"] .globalnav-searchresults-header,#globalnav .globalnav-search.globalnav-item-flyout-open .globalnav-searchresults-current [data-bb-search-quicklinks="true"] .globalnav-searchresults-list-item,#globalnav #globalnav-menubutton-link-search[aria-expanded="true"] + #globalnav-submenu-search .globalnav-searchresults-current [data-bb-search-quicklinks="true"] .globalnav-searchresults-header,#globalnav #globalnav-menubutton-link-search[aria-expanded="true"] + #globalnav-submenu-search .globalnav-searchresults-current [data-bb-search-quicklinks="true"] .globalnav-searchresults-list-item{animation-delay:calc(.2s + 20ms * var(--r-globalnav-flyout-item-number) + 40ms * var(--r-globalnav-flyout-group-number,0) + var(--bb-quicklinks-resume-offset,0ms)) !important;animation-direction:normal !important;animation-duration:.32s !important;animation-fill-mode:both !important;animation-name:globalnav-search-fade-and-slide !important;animation-timing-function:cubic-bezier(.4,0,.6,1) !important;}#globalnav.globalnav-with-flyout-closing:not(.globalnav-with-menu-open,.globalnav-with-submenu-open) .globalnav-search .globalnav-searchresults-current [data-bb-search-quicklinks="true"] .globalnav-searchresults-header,#globalnav.globalnav-with-flyout-closing:not(.globalnav-with-menu-open,.globalnav-with-submenu-open) .globalnav-search .globalnav-searchresults-current [data-bb-search-quicklinks="true"] .globalnav-searchresults-list-item{opacity:1;animation-delay:0s !important;animation-direction:reverse !important;animation-duration:min(calc(.16s + (var(--r-globalnav-flyout-item-total,6) - var(--r-globalnav-flyout-item-number)) * 20ms),.24s) !important;animation-fill-mode:both !important;animation-name:globalnav-search-fade-and-slide-to-close !important;animation-timing-function:cubic-bezier(.4,0,.6,1) !important;}#globalnav .globalnav-searchresults-current .globalnav-searchresults-container[data-analytics-region="defaultlinks search"]:not([data-bb-search-quicklinks="true"]){visibility:hidden !important;opacity:0 !important;}#globalnav .globalnav-searchresults-current [data-bb-search-quicklinks="true"][data-bb-search-quicklinks-no-replay="true"] .globalnav-searchresults-header,#globalnav .globalnav-searchresults-current [data-bb-search-quicklinks="true"][data-bb-search-quicklinks-no-replay="true"] .globalnav-searchresults-list-item{animation:none !important;opacity:1 !important;transform:none !important;will-change:auto !important;}#globalnav .globalnav-searchresults-current [data-bb-search-quicklinks="true"] .globalnav-searchresults-list-link{transition:color 20ms cubic-bezier(.4,0,.6,1),background-color 20ms cubic-bezier(.4,0,.6,1),fill 20ms cubic-bezier(.4,0,.6,1);}#globalnav .globalnav-searchresults-previous .globalnav-searchresults-container[data-analytics-region="defaultlinks search"],#globalnav .globalnav-searchresults-previous [data-bb-search-quicklinks="true"]{display:none !important;}@media (prefers-reduced-motion:reduce){#globalnav .globalnav-search .globalnav-searchresults-current [data-bb-search-quicklinks="true"] .globalnav-searchresults-header,#globalnav .globalnav-search .globalnav-searchresults-current [data-bb-search-quicklinks="true"] .globalnav-searchresults-list-item{animation:none !important;opacity:1 !important;transform:none !important;will-change:auto;}}#globalnav [data-bb-search-live="true"] .globalnav-searchresults-list-item{animation-duration:.32s;animation-fill-mode:both;animation-name:globalnav-search-fade-and-slide;animation-timing-function:cubic-bezier(.4,0,.6,1);animation-delay:calc(40ms + 20ms * var(--r-globalnav-flyout-item-number));}#globalnav [data-bb-search-live="true"] .bb-wp-search-product-item{margin-top:2px;}#globalnav [data-bb-search-live="true"] .bb-wp-search-product-item:first-child{margin-top:4px;}#globalnav [data-bb-search-live="true"] .bb-wp-search-product-link{box-sizing:border-box;width:100%;min-height:58px;display:flex;align-items:center;justify-content:flex-start;gap:12px;padding:6px 10px 6px 6px;border-radius:12px;overflow:hidden;background:transparent;}#globalnav [data-bb-search-live="true"] .bb-wp-search-product-image-wrap{width:42px;height:42px;flex:0 0 42px;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:9px;background:rgba(0,0,0,.035);}#globalnav [data-bb-search-live="true"] .bb-wp-search-product-image{display:block;width:100%;height:100%;object-fit:contain;border:0;}#globalnav [data-bb-search-live="true"] .bb-wp-search-product-copy{min-width:0;flex:1 1 auto;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:1px;overflow:hidden;}#globalnav [data-bb-search-live="true"] .bb-wp-search-product-name,#globalnav [data-bb-search-live="true"] .bb-wp-search-product-price{display:block;max-width:100%;font-size:17px;line-height:1.2353641176;letter-spacing:-.022em;font-family:"BB Text",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;}#globalnav [data-bb-search-live="true"] .bb-wp-search-product-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;color:var(--r-globalnav-search-list-item-searchterm-color);}#globalnav [data-bb-search-live="true"] .bb-wp-search-product-price{white-space:nowrap;font-weight:400;color:var(--r-globalnav-search-list-item-nonsearchterm-color);font-variant-numeric:tabular-nums;}#globalnav [data-bb-search-live="true"] .bb-wp-search-product-link:hover,#globalnav [data-bb-search-live="true"] .bb-wp-search-product-link:focus-visible,#globalnav [data-bb-search-live="true"] .bb-wp-search-product-link.globalnav-searchresults-hover{background-color:var(--r-globalnav-search-list-item-hover-background);color:var(--r-globalnav-search-list-item-hover-color);text-decoration:none;}#globalnav [data-bb-search-live="true"] .bb-wp-search-product-link:hover .bb-wp-search-product-name,#globalnav [data-bb-search-live="true"] .bb-wp-search-product-link:hover .bb-wp-search-product-price,#globalnav [data-bb-search-live="true"] .bb-wp-search-product-link:focus-visible .bb-wp-search-product-name,#globalnav [data-bb-search-live="true"] .bb-wp-search-product-link:focus-visible .bb-wp-search-product-price,#globalnav [data-bb-search-live="true"] .bb-wp-search-product-link.globalnav-searchresults-hover .bb-wp-search-product-name,#globalnav [data-bb-search-live="true"] .bb-wp-search-product-link.globalnav-searchresults-hover .bb-wp-search-product-price{color:var(--r-globalnav-search-list-item-hover-color);}#globalnav [data-bb-search-live="true"] .bb-wp-search-product-link:hover .bb-wp-search-product-image-wrap,#globalnav [data-bb-search-live="true"] .bb-wp-search-product-link:focus-visible .bb-wp-search-product-image-wrap,#globalnav [data-bb-search-live="true"] .bb-wp-search-product-link.globalnav-searchresults-hover .bb-wp-search-product-image-wrap{background:rgba(0,0,0,.055);}.theme-dark #globalnav [data-bb-search-live="true"] .bb-wp-search-product-image-wrap,.globalheader-dark #globalnav [data-bb-search-live="true"] .bb-wp-search-product-image-wrap,#globalnav.globalnav-dark [data-bb-search-live="true"] .bb-wp-search-product-image-wrap{background:rgba(255,255,255,.07);}.theme-dark #globalnav [data-bb-search-live="true"] .bb-wp-search-product-link:hover .bb-wp-search-product-image-wrap,.globalheader-dark #globalnav [data-bb-search-live="true"] .bb-wp-search-product-link:hover .bb-wp-search-product-image-wrap,#globalnav.globalnav-dark [data-bb-search-live="true"] .bb-wp-search-product-link:hover .bb-wp-search-product-image-wrap{background:rgba(255,255,255,.1);}#globalnav .bb-wp-search-status.globalnav-searchresults-list-link{cursor:default;color:var(--r-globalnav-search-list-item-nonsearchterm-color);background:transparent;pointer-events:none;}#globalnav .bb-wp-search-status.globalnav-searchresults-list-link:hover{color:var(--r-globalnav-search-list-item-nonsearchterm-color);background:transparent;}@media (max-width:833px){#globalnav [data-bb-search-live="true"] .bb-wp-search-product-item{margin-top:3px;}#globalnav [data-bb-search-live="true"] .bb-wp-search-product-item:first-child{margin-top:5px;}#globalnav [data-bb-search-live="true"] .bb-wp-search-product-link{min-height:60px;gap:11px;padding:6px 12px 6px 7px;border-radius:13px;line-height:normal;}#globalnav [data-bb-search-live="true"] .bb-wp-search-product-image-wrap{width:48px;height:48px;flex-basis:48px;border-radius:10px;}#globalnav [data-bb-search-live="true"] .bb-wp-search-product-name,#globalnav [data-bb-search-live="true"] .bb-wp-search-product-price{font-size:14px;line-height:1.2857142857;letter-spacing:-.016em;}}@media (prefers-reduced-motion:reduce){#globalnav [data-bb-search-live="true"] .globalnav-searchresults-list-item{animation:none;opacity:1;transform:none;}}#globalheader[data-bb-nav-critical-mount="1"]{display:block;position:relative;box-sizing:border-box;width:100%;min-width:320px;min-height:var(--r-globalnav-height,44px);}@media (max-width:833px){#globalheader[data-bb-nav-critical-mount="1"]{min-height:48px;}}.bb-nav-source-anchor{display:none;width:0;height:0;margin:0;padding:0}.elementor-widget-shortcode:has(.bb-nav-source-anchor),.wp-block-shortcode:has(.bb-nav-source-anchor){display:none;margin:0;padding:0;min-height:0}body.bb-nav-section-dark #globalnav{--r-globalnav-color:rgba(255,255,255,.8);--r-globalnav-color-secondary:#E8E8ED;--r-globalnav-color-hover:#FFFFFF;}body.bb-nav-section-dark #globalnav.globalnav-scrim{--globalnav-background:rgba(22,22,25,.8);}@supports (backdrop-filter:initial){body.bb-nav-section-dark #globalnav.globalnav-scrim{--globalnav-background:rgba(22,22,25,.8);}}body.bb-nav-section-dark #globalnav .globalnav-menutrigger-button{color:#fff;}body.bb-nav-section-light #globalnav{--r-globalnav-color:rgba(0,0,0,.8);--r-globalnav-color-secondary:#333336;--r-globalnav-color-hover:#000;}body.bb-nav-section-light #globalnav{--r-globalnav-color:rgba(0,0,0,.8);--r-globalnav-color-secondary:#333336;--r-globalnav-color-hover:#000;}body.bb-nav-section-light #globalnav.globalnav-scrim{--globalnav-background:rgba(250,250,252,.92);}@supports (backdrop-filter:initial){body.bb-nav-section-light #globalnav.globalnav-scrim{--globalnav-background:rgba(250,250,252,.8);}}body.bb-nav-section-light #globalnav .globalnav-menutrigger-button{color:#000;}body.bb-nav-fixed-header-page #globalheader[data-bb-nav-critical-mount="1"],body.bb-nav-fixed-header-page #globalheader{position:fixed;top:0;left:0;right:0;width:100%;z-index:9999;}body.admin-bar.bb-nav-fixed-header-page #globalheader[data-bb-nav-critical-mount="1"],body.admin-bar.bb-nav-fixed-header-page #globalheader{top:32px;}@media (max-width:782px){body.admin-bar.bb-nav-fixed-header-page #globalheader[data-bb-nav-critical-mount="1"],body.admin-bar.bb-nav-fixed-header-page #globalheader{top:46px;}}body.bb-nav-transparent-start-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){transition:background-color 160ms cubic-bezier(.4,0,.6,1),background 160ms cubic-bezier(.4,0,.6,1),backdrop-filter 160ms cubic-bezier(.4,0,.6,1),-webkit-backdrop-filter 160ms cubic-bezier(.4,0,.6,1);}body.bb-nav-transparent-start-page:not(.bb-nav-has-scrolled) #globalnav{--globalnav-background:rgba(250,250,252,0);--globalnav-backdrop-filter:none;-webkit-backdrop-filter:none;backdrop-filter:none;}body.bb-nav-transparent-start-page:not(.bb-nav-has-scrolled) #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content{-webkit-backdrop-filter:none;backdrop-filter:none;}body.bb-nav-transparent-start-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-dark,body.bb-nav-transparent-start-page:not(.bb-nav-has-scrolled) #globalnav.globalheader-dark{--globalnav-background:rgba(22,22,25,0);}body.bb-nav-transparent-start-page.bb-nav-has-scrolled #globalnav.globalnav-light,body.bb-nav-transparent-start-page.bb-nav-has-scrolled #globalnav.globalheader-light{--globalnav-background:rgba(250,250,252,.92);}body.bb-nav-transparent-start-page.bb-nav-has-scrolled #globalnav.globalnav-dark,body.bb-nav-transparent-start-page.bb-nav-has-scrolled #globalnav.globalheader-dark{--globalnav-background:rgba(22,22,25,.8);}@supports ((-webkit-backdrop-filter:initial) or (backdrop-filter:initial)){body.bb-nav-transparent-start-page.bb-nav-has-scrolled #globalnav{--globalnav-backdrop-filter:saturate(180%) blur(20px);}body.bb-nav-transparent-start-page.bb-nav-has-scrolled #globalnav.globalnav-light,body.bb-nav-transparent-start-page.bb-nav-has-scrolled #globalnav.globalheader-light{--globalnav-background:rgba(250,250,252,.8);}body.bb-nav-transparent-start-page.bb-nav-has-scrolled #globalnav.globalnav-dark,body.bb-nav-transparent-start-page.bb-nav-has-scrolled #globalnav.globalheader-dark{--globalnav-background:rgba(22,22,25,.8);}}@media (prefers-reduced-motion:reduce){body.bb-nav-transparent-start-page #globalnav,body.bb-nav-transparent-start-page #globalnav .globalnav-content{transition-duration:.01ms;transition-delay:0s;}}body.bb-nav-transparent-start-page.bb-nav-has-scrolled #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open),body.bb-nav-transparent-start-page.bb-nav-has-scrolled #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content{-webkit-transition-delay:0ms,0ms,0ms,0ms;transition-delay:0ms,0ms,0ms,0ms;}body.bb-nav-transparent-start-page:not(.bb-nav-has-scrolled) #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open),body.bb-nav-transparent-start-page:not(.bb-nav-has-scrolled) #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content{-webkit-transition-delay:0ms,0ms,0ms,0ms;transition-delay:0ms,0ms,0ms,0ms;}body.bb-nav-transparent-start-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){--globalnav-background:transparent;--globalnav-backdrop-filter:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;}body.bb-nav-transparent-start-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;}body[data-bb-nav-section-mode="base"] #globalnav,body:not([data-bb-nav-section-mode]) #globalnav{--r-globalnav-color:color-mix(in srgb,var(--hecu-text,#1d1d1f) 80%,transparent);--r-globalnav-color-secondary:var(--hecu-text-muted,#333336);--r-globalnav-color-hover:var(--hecu-text,#000);--bb-nav-surface-color:var(--section-bg,var(--hecu-section-bg,var(--hecu-bg,#f5f5f7)));--r-globalnav-background-opened:var(--bb-nav-surface-color);--r-globalnav-background-opened-dark:var(--bb-nav-surface-color);--globalnav-background:color-mix(in srgb,var(--bb-nav-surface-color) 80%,transparent);}body[data-bb-nav-section-mode="base"] #globalnav .globalnav-submenu-header,body:not([data-bb-nav-section-mode]) #globalnav .globalnav-submenu-header{color:var(--hecu-text-muted,#6e6e73);}body[data-bb-nav-section-mode="base"] #globalnav:focus-visible,body:not([data-bb-nav-section-mode]) #globalnav:focus-visible{--sk-focus-color:var(--hecu-focus,#0071e3);}body.bb-nav-has-localnav #globalheader{background:transparent;}body.bb-nav-has-localnav #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){--globalnav-background:transparent;--globalnav-backdrop-filter:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;}body.bb-nav-has-localnav #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;}@media (max-width:833px){body.bb-nav-has-localnav #globalnav.globalnav-animating,body.bb-nav-has-localnav #globalnav.globalnav-with-flyout-open,body.bb-nav-has-localnav #globalnav.globalnav-with-flyout-closing{}}@media (max-width:833px){#globalnav.globalnav-with-flyout-open .globalnav-content{height:calc(100vh - var(--globalnav-preceding-element-height,0px));overflow-x:hidden;overflow-y:scroll;transition-delay:0ms;}@supports (height:100dvh){#globalnav.globalnav-with-flyout-open .globalnav-content{height:calc(100dvh - var(--globalnav-preceding-element-height,0px));}}#globalnav.globalnav-with-flyout-open.globalnav-dark .globalnav-content,#globalnav.globalnav-with-flyout-open.globalheader-dark .globalnav-content,.globalheader-dark #globalnav.globalnav-with-flyout-open .globalnav-content,.theme-dark #globalnav.globalnav-with-flyout-open:not(.globalnav-light):not(.globalheader-light) .globalnav-content{background:#161617;}#globalnav.globalnav-with-flyout-open.globalnav-light .globalnav-content,#globalnav.globalnav-with-flyout-open.globalheader-light .globalnav-content,.globalheader-dark #globalnav.globalnav-with-flyout-open.globalnav-light .globalnav-content,.theme-dark #globalnav.globalnav-with-flyout-open.globalnav-light .globalnav-content,.globalheader-dark #globalnav.globalnav-with-flyout-open.globalheader-light .globalnav-content,.theme-dark #globalnav.globalnav-with-flyout-open.globalheader-light .globalnav-content,.globalheader-light #globalnav.globalnav-with-flyout-open .globalnav-content,.theme-light #globalnav.globalnav-with-flyout-open .globalnav-content{background:#fafafc;}#globalnav.globalnav-with-flyout-open.globalnav-animating:not(.globalnav-with-flyout-closing) .globalnav-content,#globalnav.globalnav-with-flyout-closing:not(.globalnav-with-menu-open,.globalnav-with-submenu-open) .globalnav-content{-webkit-backdrop-filter:var(--globalnav-backdrop-filter);backdrop-filter:var(--globalnav-backdrop-filter);}}@media (max-width:833px){body.bb-nav-has-localnav #globalnav.globalnav-with-flyout-closing .globalnav-content{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;-webkit-transition:height var(--r-globalnav-flyout-rate) cubic-bezier(.4,0,.6,1) 80ms,background 480ms cubic-bezier(.4,0,.6,1) 80ms,-webkit-backdrop-filter 480ms cubic-bezier(.4,0,.6,1) 80ms;transition:height var(--r-globalnav-flyout-rate) cubic-bezier(.4,0,.6,1) 80ms,background 480ms cubic-bezier(.4,0,.6,1) 80ms,backdrop-filter 480ms cubic-bezier(.4,0,.6,1) 80ms;}}@media (max-width:833px){#globalnav .globalnav-link-apple,#globalnav #globalnav-menubutton-link-search,#globalnav #globalnav-menubutton-link-bag{transition:opacity .24s cubic-bezier(.4,0,.6,1) 80ms,visibility .24s step-start 80ms,color .32s cubic-bezier(.4,0,.6,1);}#globalnav.globalnav-with-flyout-open .globalnav-link-apple,#globalnav.globalnav-with-flyout-open #globalnav-menubutton-link-search,#globalnav.globalnav-with-flyout-open #globalnav-menubutton-link-bag{transition:opacity .24s cubic-bezier(.4,0,.6,1),visibility .24s step-end,color .32s cubic-bezier(.4,0,.6,1);}#globalnav .globalnav-link-apple svg,#globalnav #globalnav-menubutton-link-search svg,#globalnav #globalnav-menubutton-link-bag svg{fill:currentColor;}}body.bb-nav-transparent-after-scroll-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open),body.bb-nav-transparent-after-scroll-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content{transition:background-color .5s cubic-bezier(.4,0,.6,1) .5s,background .5s cubic-bezier(.4,0,.6,1) .5s,backdrop-filter .5s cubic-bezier(.4,0,.6,1) .5s,-webkit-backdrop-filter .5s cubic-bezier(.4,0,.6,1) .5s;}body.bb-nav-transparent-after-scroll-page.bb-nav-has-scrolled #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open),body.bb-nav-transparent-after-scroll-page.bb-nav-has-scrolled #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content{transition:none;}body.bb-nav-transparent-after-scroll-page.bb-nav-has-scrolled #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){--globalnav-background:transparent;--globalnav-backdrop-filter:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;}@media (max-width:833px){body.bb-nav-transparent-after-scroll-page.bb-nav-has-scrolled #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;}}@media (prefers-reduced-motion:reduce){body.bb-nav-transparent-after-scroll-page #globalnav,body.bb-nav-transparent-after-scroll-page #globalnav .globalnav-content{transition-duration:.01ms;transition-delay:0s;}}body.bb-nav-always-transparent-header-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open),body.bb-nav-always-transparent-header-page #globalnav.globalnav-light:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open),body.bb-nav-always-transparent-header-page #globalnav.globalnav-dark:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open),body.bb-nav-always-transparent-header-page #globalnav.globalheader-light:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open),body.bb-nav-always-transparent-header-page #globalnav.globalheader-dark:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){--globalnav-background:transparent;--globalnav-backdrop-filter:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;}@media (max-width:833px){body.bb-nav-always-transparent-header-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;}}@media (max-width:833px){#globalnav .globalnav-item-menu .globalnav-link{color:#1d1d1f;width:auto;}#globalnav.globalnav-dark .globalnav-item-menu .globalnav-link,.globalheader-dark #globalnav .globalnav-item-menu .globalnav-link,.theme-dark #globalnav .globalnav-item-menu .globalnav-link{color:#f5f5f7;}#globalnav.globalnav-light .globalnav-item-menu .globalnav-link,.globalheader-light #globalnav .globalnav-item-menu .globalnav-link,.theme-light #globalnav .globalnav-item-menu .globalnav-link{color:#1d1d1f;}}@media (max-width:833px){#globalnav .globalnav-item-menu .globalnav-link:hover{color:#000;}#globalnav.globalnav-dark .globalnav-item-menu .globalnav-link:hover,.globalheader-dark #globalnav .globalnav-item-menu .globalnav-link:hover,.theme-dark #globalnav .globalnav-item-menu .globalnav-link:hover{color:#fff;}#globalnav.globalnav-light .globalnav-item-menu .globalnav-link:hover,.globalheader-light #globalnav .globalnav-item-menu .globalnav-link:hover,.theme-light #globalnav .globalnav-item-menu .globalnav-link:hover{color:#000;}}@media (max-width:833px){#globalnav .globalnav-menutrigger-button{color:var(--r-globalnav-color);}#globalnav .globalnav-menutrigger-button:hover,#globalnav .globalnav-menutrigger-button:focus-visible{color:var(--r-globalnav-color-hover);}}body.bb-nav-always-transparent-header-page #globalheader,body.bb-nav-always-transparent-header-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open),body.bb-nav-always-transparent-header-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content{--globalnav-background:transparent;--globalnav-backdrop-filter:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;}body.bb-nav-always-transparent-header-page.bb-nav-has-localnav #ac-localnav{--localnav-background:transparent;--localnav-background-stuck:transparent;}body.bb-nav-always-transparent-header-page.bb-nav-has-localnav #ac-localnav .ac-ln-background{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;}body[data-bb-nav-section-mode]:not([data-bb-nav-section-mode="base"]).bb-nav-section-dark #globalheader,body[data-bb-nav-section-mode]:not([data-bb-nav-section-mode="base"]).bb-nav-section-light #globalheader{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;}body.bb-nav-has-localnav[data-bb-nav-section-mode]:not([data-bb-nav-section-mode="base"]) #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){--globalnav-background:transparent;--globalnav-backdrop-filter:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;}body.bb-nav-has-localnav[data-bb-nav-section-mode]:not([data-bb-nav-section-mode="base"]) #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;}body.bb-nav-has-localnav[data-bb-nav-section-mode]:not([data-bb-nav-section-mode="base"]).bb-nav-section-dark #ac-localnav{--localnav-background:rgba(22,22,25,.8);--localnav-background-stuck:rgba(22,22,25,.8);}body.bb-nav-has-localnav[data-bb-nav-section-mode]:not([data-bb-nav-section-mode="base"]).bb-nav-section-light #ac-localnav{--localnav-background:rgba(250,250,252,.8);--localnav-background-stuck:rgba(250,250,252,.8);}body.bb-nav-has-localnav[data-bb-nav-section-mode]:not([data-bb-nav-section-mode="base"]) #ac-localnav .ac-ln-background{margin-top:calc(-1 * var(--r-globalnav-height,0px));padding-top:var(--r-globalnav-height,0px);background:var(--localnav-background);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);transition:background 160ms cubic-bezier(.4,0,.6,1),backdrop-filter 160ms cubic-bezier(.4,0,.6,1),-webkit-backdrop-filter 160ms cubic-bezier(.4,0,.6,1);}body.bb-nav-always-transparent-header-page #globalnav:not(.globalnav-with-flyout-open):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){--globalnav-background:transparent;--globalnav-backdrop-filter:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;}body.bb-nav-always-transparent-header-page.bb-nav-has-localnav #ac-localnav{--localnav-background:transparent;--localnav-background-stuck:transparent;}body.bb-nav-always-transparent-header-page.bb-nav-has-localnav #ac-localnav .ac-ln-background{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;}body #globalnav.globalnav-light,body #globalnav.globalheader-light{--r-globalnav-color:rgba(0,0,0,.8);--r-globalnav-color-secondary:#333336;--r-globalnav-color-hover:#000;--r-globalnav-background-opened:#fafafc;--r-globalnav-background-opened-dark:#fafafc;--bb-nav-surface-color:#fafafc;}body #globalnav.globalnav-dark,body #globalnav.globalheader-dark{--r-globalnav-color:rgba(255,255,255,.8);--r-globalnav-color-secondary:#e8e8ed;--r-globalnav-color-hover:#fff;--r-globalnav-background-opened:#161617;--r-globalnav-background-opened-dark:#161617;--bb-nav-surface-color:rgba(22,22,25,.8);}body #globalnav.globalnav-light .globalnav-submenu-header,body #globalnav.globalheader-light .globalnav-submenu-header{color:#6e6e73;}body #globalnav.globalnav-dark .globalnav-submenu-header,body #globalnav.globalheader-dark .globalnav-submenu-header{color:#a1a1a6;}body #globalnav.globalnav-light.globalnav-with-flyout-open .globalnav-content,body #globalnav.globalheader-light.globalnav-with-flyout-open .globalnav-content,body #globalnav.globalnav-light.globalnav-with-menu-open .globalnav-content,body #globalnav.globalheader-light.globalnav-with-menu-open .globalnav-content{background:#fafafc;}body #globalnav.globalnav-dark.globalnav-with-flyout-open .globalnav-content,body #globalnav.globalheader-dark.globalnav-with-flyout-open .globalnav-content,body #globalnav.globalnav-dark.globalnav-with-menu-open .globalnav-content,body #globalnav.globalheader-dark.globalnav-with-menu-open .globalnav-content{background:#161617;}body #globalnav.globalnav-dark,body #globalnav.globalheader-dark{--bb-nav-surface-color:rgba(22,22,25,.8);}body.bb-nav-transparent-start-page.bb-nav-has-scrolled #globalnav.globalnav-dark:not(.globalnav-with-flyout-open):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open),body.bb-nav-transparent-start-page.bb-nav-has-scrolled #globalnav.globalheader-dark:not(.globalnav-with-flyout-open):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){--globalnav-background:var(--bb-nav-surface-color);background:var(--bb-nav-surface-color);}body.bb-nav-transparent-start-page.bb-nav-has-scrolled #globalnav.globalnav-dark:not(.globalnav-with-flyout-open):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open),body.bb-nav-transparent-start-page.bb-nav-has-scrolled #globalnav.globalheader-dark:not(.globalnav-with-flyout-open):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open),body.page-bb.bb-nav-transparent-start-page.bb-nav-has-scrolled #globalnav.globalnav-dark:not(.globalnav-with-flyout-open):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){--globalnav-background:rgba(22,22,25,.8);background:rgba(22,22,25,.8);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);}body.bb-nav-transparent-start-page.bb-nav-has-scrolled #globalnav.globalnav-light:not(.globalnav-with-flyout-open):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open),body.bb-nav-transparent-start-page.bb-nav-has-scrolled #globalnav.globalheader-light:not(.globalnav-with-flyout-open):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){--globalnav-background:rgba(250,250,252,.8);background:rgba(250,250,252,.8);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);}body.bb-nav-has-localnav #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){--globalnav-background:transparent;--globalnav-backdrop-filter:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;}@media (max-width:833px){body.bb-nav-has-localnav #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;}}body.bb-nav-global-only-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){background:var(--globalnav-background);-webkit-backdrop-filter:var(--globalnav-backdrop-filter);backdrop-filter:var(--globalnav-backdrop-filter);}body.bb-nav-global-only-page[data-bb-nav-section-mode="base"] #globalnav,body.bb-nav-global-only-page:not([data-bb-nav-section-mode]) #globalnav{--bb-nav-surface-color:var(--section-bg,var(--hecu-section-bg,var(--hecu-bg,#f5f5f7)));--globalnav-background:color-mix(in srgb,var(--bb-nav-surface-color) 92%,transparent);}@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){body.bb-nav-global-only-page #globalnav{--globalnav-backdrop-filter:saturate(180%) blur(20px);}body.bb-nav-global-only-page[data-bb-nav-section-mode="base"] #globalnav,body.bb-nav-global-only-page:not([data-bb-nav-section-mode]) #globalnav{--globalnav-background:color-mix(in srgb,var(--bb-nav-surface-color) 80%,transparent);}}@media (max-width:833px){body.bb-nav-global-only-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){background:none;-webkit-backdrop-filter:var(--globalnav-backdrop-filter);backdrop-filter:var(--globalnav-backdrop-filter);}body.bb-nav-global-only-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content{background:var(--globalnav-background);-webkit-backdrop-filter:none;backdrop-filter:none;}}@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){@media (max-width:833px){body.bb-nav-tp-page.bb-nav-global-only-page:not(.bb-nav-has-scrolled)[data-bb-nav-section-mode="base"] #globalnav,body.bb-nav-tp-page.bb-nav-global-only-page:not(.bb-nav-has-scrolled):not([data-bb-nav-section-mode]) #globalnav{--globalnav-background:color-mix(in srgb,#8b0 80%,transparent);}}}@media (prefers-reduced-motion:reduce){body.bb-nav-global-only-page #globalnav .globalnav-content{transition-duration:.01ms;transition-delay:0s;}}body.bb-nav-about-transition-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open),body.bb-nav-bb-transition-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open),body.bb-nav-reverse-transition-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){transition:background-color 480ms cubic-bezier(.4,0,.6,1) 80ms,background 480ms cubic-bezier(.4,0,.6,1) 80ms,backdrop-filter 480ms cubic-bezier(.4,0,.6,1) 80ms,-webkit-backdrop-filter 480ms cubic-bezier(.4,0,.6,1) 80ms;}body.bb-nav-about-transition-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content,body.bb-nav-bb-transition-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content,body.bb-nav-reverse-transition-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content{transition:background-color 480ms cubic-bezier(.4,0,.6,1) 80ms,background 480ms cubic-bezier(.4,0,.6,1) 80ms,backdrop-filter 480ms cubic-bezier(.4,0,.6,1) 80ms,-webkit-backdrop-filter 480ms cubic-bezier(.4,0,.6,1) 80ms;}body.bb-nav-about-transition-page.bb-nav-has-localnav #ac-localnav .ac-ln-background,body.bb-nav-bb-transition-page.bb-nav-has-localnav #ac-localnav .ac-ln-background,body.bb-nav-reverse-transition-page.bb-nav-has-localnav #ac-localnav .ac-ln-background{-webkit-transition:background 480ms cubic-bezier(.4,0,.6,1) 80ms,-webkit-backdrop-filter 480ms cubic-bezier(.4,0,.6,1) 80ms;transition:background 480ms cubic-bezier(.4,0,.6,1) 80ms,backdrop-filter 480ms cubic-bezier(.4,0,.6,1) 80ms,-webkit-backdrop-filter 480ms cubic-bezier(.4,0,.6,1) 80ms;}@media (prefers-reduced-motion:reduce){body.bb-nav-about-transition-page #globalnav,body.bb-nav-about-transition-page #globalnav .globalnav-content,body.bb-nav-about-transition-page.bb-nav-has-localnav #ac-localnav .ac-ln-background,body.bb-nav-bb-transition-page #globalnav,body.bb-nav-bb-transition-page #globalnav .globalnav-content,body.bb-nav-bb-transition-page.bb-nav-has-localnav #ac-localnav .ac-ln-background,body.bb-nav-reverse-transition-page #globalnav,body.bb-nav-reverse-transition-page #globalnav .globalnav-content,body.bb-nav-reverse-transition-page.bb-nav-has-localnav #ac-localnav .ac-ln-background{transition-duration:.01ms;transition-delay:0s;}}body.bb-nav-always-transparent-header-page #globalheader,body.bb-nav-always-transparent-header-page #globalnav,body.bb-nav-always-transparent-header-page #globalnav .globalnav-content{--globalnav-background:transparent;--globalnav-background-opened:transparent;--globalnav-background-opened-dark:transparent;--globalnav-backdrop-filter:none;background:transparent;background-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;}body.bb-nav-always-transparent-header-page.bb-nav-has-localnav #ac-localnav{--localnav-background:transparent;--localnav-background-stuck:transparent;}body.bb-nav-always-transparent-header-page.bb-nav-has-localnav #ac-localnav .ac-ln-background,body.bb-nav-always-transparent-header-page.bb-nav-has-localnav #ac-localnav.ac-localnav-scrim .ac-ln-background,body.bb-nav-always-transparent-header-page.bb-nav-has-localnav #ac-localnav.ac-ln-sticking .ac-ln-background{background:transparent;background-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;}@media (max-width:833px){html[data-hecu-resolved="dark"] #globalnav #globalnav-menutrigger-button,body[data-hecu-resolved="dark"] #globalnav #globalnav-menutrigger-button{color:#fff;}html[data-hecu-resolved="light"] #globalnav #globalnav-menutrigger-button,body[data-hecu-resolved="light"] #globalnav #globalnav-menutrigger-button{color:#000;}#globalnav #globalnav-menutrigger-button{transition:opacity .32s cubic-bezier(.4,0,.6,1);}body.bb-nav-theme-ready #globalnav #globalnav-menutrigger-button{transition:opacity .32s cubic-bezier(.4,0,.6,1),color .32s cubic-bezier(.4,0,.6,1);}}body.bb-nav-force-dark-header-page #globalheader,body.bb-nav-force-dark-header-page #globalnav,body.bb-nav-force-dark-header-page #globalnav.globalnav-light,body.bb-nav-force-dark-header-page #globalnav.globalheader-light,body.bb-nav-force-dark-header-page #globalnav.globalnav-dark,body.bb-nav-force-dark-header-page #globalnav.globalheader-dark{--r-globalnav-color:rgba(255,255,255,.8);--r-globalnav-color-secondary:#e8e8ed;--r-globalnav-color-hover:#fff;--r-globalnav-background-opened:#161617;--r-globalnav-background-opened-dark:#161617;--bb-nav-surface-color:rgba(22,22,25,.8);--globalnav-background:rgba(22,22,25,.8);--globalnav-backdrop-filter:saturate(180%) blur(20px);color-scheme:dark;}body.bb-nav-force-dark-header-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){background:rgba(22,22,25,.8);background-color:rgba(22,22,25,.8);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);}body.bb-nav-force-dark-header-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content{background:transparent;background-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;}body.bb-nav-force-dark-header-page #globalnav .globalnav-menutrigger-button{color:#fff;}body.bb-nav-force-dark-header-page #globalnav.globalnav-with-flyout-open .globalnav-content,body.bb-nav-force-dark-header-page #globalnav.globalnav-with-menu-open .globalnav-content,body.bb-nav-force-dark-header-page #globalnav.globalnav-with-submenu-open .globalnav-content{background:#161617;background-color:#161617;-webkit-backdrop-filter:none;backdrop-filter:none;}body.bb-nav-photography-reverse-surface-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){background:rgba(22,22,25,.8);background-color:rgba(22,22,25,.8);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);-webkit-transition:background .5s cubic-bezier(.4,0,.6,1) .5s,background-color .5s cubic-bezier(.4,0,.6,1) .5s,-webkit-backdrop-filter .5s cubic-bezier(.4,0,.6,1) .5s;transition:background .5s cubic-bezier(.4,0,.6,1) .5s,background-color .5s cubic-bezier(.4,0,.6,1) .5s,backdrop-filter .5s cubic-bezier(.4,0,.6,1) .5s;}body.bb-nav-photography-reverse-surface-page.bb-nav-has-scrolled #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){background:transparent;background-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;-webkit-transition:none;transition:none;}body.bb-nav-photography-reverse-surface-page #globalnav .globalnav-content{background:transparent;background-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;}body.bb-nav-has-localnav.bb-nav-transparent-start-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-flyout-closing:not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){--globalnav-background:transparent;--globalnav-backdrop-filter:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;transition:background-color 480ms cubic-bezier(.4,0,.6,1) 80ms,background 480ms cubic-bezier(.4,0,.6,1) 80ms,-webkit-backdrop-filter 480ms cubic-bezier(.4,0,.6,1) 80ms,backdrop-filter 480ms cubic-bezier(.4,0,.6,1) 80ms;}body.bb-nav-has-localnav.bb-nav-transparent-start-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-flyout-closing:not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content{background:transparent;background-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;transition:background-color 480ms cubic-bezier(.4,0,.6,1) 80ms,background 480ms cubic-bezier(.4,0,.6,1) 80ms,-webkit-backdrop-filter 480ms cubic-bezier(.4,0,.6,1) 80ms,backdrop-filter 480ms cubic-bezier(.4,0,.6,1) 80ms;}@media (max-width:833px){body.bb-nav-has-localnav.bb-nav-transparent-start-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-flyout-closing:not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content{transition:height var(--r-globalnav-flyout-rate) cubic-bezier(.4,0,.6,1) 80ms,background-color 480ms cubic-bezier(.4,0,.6,1) 80ms,background 480ms cubic-bezier(.4,0,.6,1) 80ms,-webkit-backdrop-filter 480ms cubic-bezier(.4,0,.6,1) 80ms,backdrop-filter 480ms cubic-bezier(.4,0,.6,1) 80ms;}}
html.bb-nav-safari-bag-lock #globalnav .globalnav-link-bag{-webkit-transform:none!important;transform:none!important;-webkit-transition:none!important;transition:none!important;}html.bb-nav-safari-bag-lock #globalnav .globalnav-bag.with-badge{padding-inline-start:0!important;-webkit-transition:none!important;transition:none!important;}html.bb-nav-safari-bag-lock #globalnav .globalnav-bag-badge{opacity:0!important;visibility:hidden!important;-webkit-transition:none!important;transition:none!important;}

/* BB Global Header first-paint state styles (merged from bbc/css/global-header.css). */
/* BB Global Header state / first-paint styles.
 * Moved from inline PHP to a cacheable linked stylesheet.
 */

html.bb-nav-store-first-paint-dark body.bb-nav-profile-store.bb-nav-has-localnav #ac-localnav,
	html.bb-nav-store-first-paint-dark body.bb-nav-profile-store.bb-nav-has-localnav #ac-localnav.ac-localnav-light,
	html.bb-nav-store-first-paint-dark body.bb-nav-profile-store.bb-nav-has-localnav #ac-localnav.ac-localnav-dark {
		--localnav-background: var(--r-globalnav-background-opened-dark, #161617);
		--localnav-background-stuck: var(--r-globalnav-background-opened-dark, #161617);
		--localnav-keyline-color: rgba(255,255,255,.24);
		--localnav-focus-color-alt: #fff;
		color-scheme: dark;
	}
	html.bb-nav-store-first-paint-dark body.bb-nav-profile-store.bb-nav-has-localnav #ac-localnav .ac-ln-background {
		background: var(--r-globalnav-background-opened-dark, #161617);
		background-color: var(--r-globalnav-background-opened-dark, #161617);
	}
	html.bb-nav-store-first-paint-light body.bb-nav-profile-store.bb-nav-has-localnav #ac-localnav,
	html.bb-nav-store-first-paint-light body.bb-nav-profile-store.bb-nav-has-localnav #ac-localnav.ac-localnav-light,
	html.bb-nav-store-first-paint-light body.bb-nav-profile-store.bb-nav-has-localnav #ac-localnav.ac-localnav-dark {
		--localnav-background: var(--r-globalnav-background-opened, #fafafc);
		--localnav-background-stuck: var(--r-globalnav-background-opened, #fafafc);
		color-scheme: light;
	}
	html.bb-nav-store-first-paint-light body.bb-nav-profile-store.bb-nav-has-localnav #ac-localnav .ac-ln-background {
		background: var(--r-globalnav-background-opened, #fafafc);
		background-color: var(--r-globalnav-background-opened, #fafafc);
	}

html.bb-nav-force-dark-first-paint #globalheader,
	html.bb-nav-force-dark-first-paint #globalnav,
	html.bb-nav-force-dark-first-paint #globalnav .globalnav-content {
		--r-globalnav-color: rgba(255,255,255,.8);
		--r-globalnav-color-secondary: #e8e8ed;
		--r-globalnav-color-hover: #fff;
		--r-globalnav-background-opened: #161617;
		--r-globalnav-background-opened-dark: #161617;
		--bb-nav-surface-color: rgba(22,22,25,.8);
		--globalnav-background: rgba(22,22,25,.8);
		--globalnav-backdrop-filter: saturate(180%) blur(20px);
		color-scheme: dark;
	}
	html.bb-nav-force-dark-first-paint #globalnav:not(.globalnav-with-flyout-open):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) {
		background: var(--r-globalnav-background-opened-dark, #161617);
		background-color: var(--r-globalnav-background-opened-dark, #161617);
		-webkit-backdrop-filter: saturate(180%) blur(20px);
		backdrop-filter: saturate(180%) blur(20px);
	}
	html.bb-nav-force-dark-first-paint #globalnav:not(.globalnav-with-flyout-open):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content {
		background: transparent;
		background-color: transparent;
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
	}
	html.bb-nav-force-dark-first-paint #globalnav .globalnav-menutrigger-button { color:#fff; }
	html.bb-nav-force-dark-first-paint #ac-localnav,
	html.bb-nav-force-dark-first-paint #ac-localnav.ac-localnav-light,
	html.bb-nav-force-dark-first-paint #ac-localnav.ac-localnav-dark {
		--bb-nav-surface-color: rgba(22,22,25,.8);
		--localnav-background: var(--r-globalnav-background-opened-dark, #161617);
		--localnav-background-stuck: var(--r-globalnav-background-opened-dark, #161617);
		--localnav-keyline-color: rgba(255,255,255,.24);
		--localnav-focus-color-alt: #fff;
		color-scheme: dark;
	}
	html.bb-nav-force-dark-first-paint #ac-localnav .ac-ln-background {
		background: var(--r-globalnav-background-opened-dark, #161617);
		background-color: var(--r-globalnav-background-opened-dark, #161617);
		-webkit-backdrop-filter: saturate(180%) blur(20px);
		backdrop-filter: saturate(180%) blur(20px);
	}

body.bb-nav-aa-page.bb-nav-global-only-page:not(.bb-nav-has-scrolled) #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){background:var(--globalnav-background-bb,#8b0);}
body.bb-nav-test-page.bb-nav-global-only-page:not(.bb-nav-has-scrolled) #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){background:var(--globalnav-background-bb,#8b0);}
body.bb-nav-test-page #globalnav{--r-globalnav-color:rgba(255,255,255,.8) !important;}
body.bb-nav-test-page .globalnav-bag-badge{--globalnav-badge-background:rgb(255,255,255);--globalnav-badge-text-color:rgb(0,0,0);}
body.bb-nav-test-page #globalnav #globalnav-menutrigger-button,
html[data-hecu-resolved="light"] body.bb-nav-test-page #globalnav #globalnav-menutrigger-button,
body.bb-nav-test-page[data-hecu-resolved="light"] #globalnav #globalnav-menutrigger-button{color:#fff;}
body.bb-nav-tp-page.bb-nav-global-only-page:not(.bb-nav-has-scrolled) #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){
    background:var(--globalnav-background-bb,#8b0);
}
body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav{
    --r-globalnav-color:rgba(255,255,255,.8) !important;
    --r-globalnav-color-hover:#fff !important;
}
body.bb-nav-tp-page:not(.bb-nav-has-scrolled) .globalnav-bag-badge{
    --globalnav-badge-background:rgb(255,255,255);
    --globalnav-badge-text-color:rgb(0,0,0);
}
body.bb-nav-tp-page.bb-nav-has-scrolled .globalnav-bag-badge{
    --globalnav-badge-background:rgb(0,0,0);
    --globalnav-badge-text-color:rgb(255,255,255);
}
body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav #globalnav-menutrigger-button,
html[data-hecu-resolved="light"] body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav #globalnav-menutrigger-button,
body.bb-nav-tp-page[data-hecu-resolved="light"]:not(.bb-nav-has-scrolled) #globalnav #globalnav-menutrigger-button{color:#fff;}

/* /tp/: menu trigger follows flyout/menu open state independently of scroll + hover. */
body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav #globalnav-menutrigger-button{
    transition:color 480ms cubic-bezier(.4,0,.6,1) 0ms !important;
}
body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-flyout-open #globalnav-menutrigger-button,
body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-menu-open #globalnav-menutrigger-button,
body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-submenu-open #globalnav-menutrigger-button,
html[data-hecu-resolved="light"] body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-flyout-open #globalnav-menutrigger-button,
html[data-hecu-resolved="light"] body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-menu-open #globalnav-menutrigger-button,
html[data-hecu-resolved="light"] body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-submenu-open #globalnav-menutrigger-button,
body.bb-nav-tp-page[data-hecu-resolved="light"]:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-flyout-open #globalnav-menutrigger-button,
body.bb-nav-tp-page[data-hecu-resolved="light"]:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-menu-open #globalnav-menutrigger-button,
body.bb-nav-tp-page[data-hecu-resolved="light"]:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-submenu-open #globalnav-menutrigger-button{
    color:#000 !important;
    transition:color 480ms cubic-bezier(.4,0,.6,1) 0ms !important;
}

/* /tp/: scroll-color animation is isolated from hover animation by JS classes. */
body.bb-nav-tp-page #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){
    transition:background-color 480ms cubic-bezier(.4,0,.6,1),
               background 480ms cubic-bezier(.4,0,.6,1),
               backdrop-filter 480ms cubic-bezier(.4,0,.6,1),
               -webkit-backdrop-filter 480ms cubic-bezier(.4,0,.6,1);
}
body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav:not(.globalnav-animating):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){
    transition-delay:80ms;
}

/* Foreground gets the long transition only while JS is changing scroll state. */
body.bb-nav-tp-page.bb-nav-tp-scroll-transition #globalnav .globalnav-link,
body.bb-nav-tp-page.bb-nav-tp-scroll-transition #globalnav .globalnav-link-apple,
body.bb-nav-tp-page.bb-nav-tp-scroll-transition #globalnav #globalnav-menubutton-link-search,
body.bb-nav-tp-page.bb-nav-tp-scroll-transition #globalnav #globalnav-menubutton-link-bag,
body.bb-nav-tp-page.bb-nav-tp-scroll-transition #globalnav #globalnav-menutrigger-button{
    transition-property:color !important;
    transition-duration:480ms !important;
    transition-timing-function:cubic-bezier(.4,0,.6,1) !important;
    transition-delay:0ms !important;
}
body.bb-nav-tp-page.bb-nav-tp-scroll-transition.bb-nav-tp-returning-top #globalnav .globalnav-link,
body.bb-nav-tp-page.bb-nav-tp-scroll-transition.bb-nav-tp-returning-top #globalnav .globalnav-link-apple,
body.bb-nav-tp-page.bb-nav-tp-scroll-transition.bb-nav-tp-returning-top #globalnav #globalnav-menubutton-link-search,
body.bb-nav-tp-page.bb-nav-tp-scroll-transition.bb-nav-tp-returning-top #globalnav #globalnav-menubutton-link-bag,
body.bb-nav-tp-page.bb-nav-tp-scroll-transition.bb-nav-tp-returning-top #globalnav #globalnav-menutrigger-button{
    transition-delay:80ms !important;
}

/* Hover is always independent and fast, even during a scroll-color animation. */
body.bb-nav-tp-page #globalnav .globalnav-link:hover,
body.bb-nav-tp-page #globalnav .globalnav-link-apple:hover,
body.bb-nav-tp-page #globalnav #globalnav-menubutton-link-search:hover,
body.bb-nav-tp-page #globalnav #globalnav-menubutton-link-bag:hover,
body.bb-nav-tp-page #globalnav #globalnav-menutrigger-button:hover{
    transition:color 20ms cubic-bezier(.4,0,.6,1) 0ms !important;
}

/* Badge reverses with the same scroll timing, including its visible pill layers. */
body.bb-nav-tp-page.bb-nav-tp-scroll-transition .globalnav-bag-badge{
    transition:color 480ms cubic-bezier(.4,0,.6,1) 0ms !important;
}
body.bb-nav-tp-page.bb-nav-tp-scroll-transition .globalnav-bag-badge::before,
body.bb-nav-tp-page.bb-nav-tp-scroll-transition .globalnav-bag-badge::after,
body.bb-nav-tp-page.bb-nav-tp-scroll-transition .globalnav-bag-badge-separator{
    transition-property:background-color !important;
    transition-duration:480ms !important;
    transition-timing-function:cubic-bezier(.4,0,.6,1) !important;
    transition-delay:0ms !important;
}
body.bb-nav-tp-page.bb-nav-tp-scroll-transition.bb-nav-tp-returning-top .globalnav-bag-badge{
    transition-delay:80ms !important;
}
body.bb-nav-tp-page.bb-nav-tp-scroll-transition.bb-nav-tp-returning-top .globalnav-bag-badge::before,
body.bb-nav-tp-page.bb-nav-tp-scroll-transition.bb-nav-tp-returning-top .globalnav-bag-badge::after,
body.bb-nav-tp-page.bb-nav-tp-scroll-transition.bb-nav-tp-returning-top .globalnav-bag-badge-separator{
    transition-delay:80ms !important;
}

@media (prefers-reduced-motion: reduce){
    body.bb-nav-tp-page #globalnav,
    body.bb-nav-tp-page #globalnav .globalnav-link,
    body.bb-nav-tp-page #globalnav .globalnav-link-apple,
    body.bb-nav-tp-page #globalnav #globalnav-menubutton-link-search,
    body.bb-nav-tp-page #globalnav #globalnav-menubutton-link-bag,
    body.bb-nav-tp-page #globalnav #globalnav-menutrigger-button,
    body.bb-nav-tp-page .globalnav-bag-badge,
    body.bb-nav-tp-page .globalnav-bag-badge::before,
    body.bb-nav-tp-page .globalnav-bag-badge::after,
    body.bb-nav-tp-page .globalnav-bag-badge-separator{
        transition-duration:.01ms !important;
        transition-delay:0s !important;
    }
}



/* /tp/: flyout surface uses one color channel only, preventing shorthand/background conflicts. */
@media (min-width:834px){
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav{
        --r-globalnav-background-opened:#fafafc;
    }

    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-submenu{
        background-image:none !important;
        background-color:#8b0 !important;
        transition-property:height,visibility,background-color !important;
        transition-duration:var(--r-globalnav-flyout-rate),var(--r-globalnav-flyout-rate),480ms !important;
        transition-timing-function:cubic-bezier(.4,0,.6,1),step-end,cubic-bezier(.4,0,.6,1) !important;
        transition-delay:120ms,120ms,0ms !important;
    }

    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-item.globalnav-item-flyout-open .globalnav-submenu,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-item.globalnav-item-flyout-change-next .globalnav-submenu,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-item.globalnav-item-flyout-change-previous .globalnav-submenu{
        background-image:none !important;
        background-color:#fafafc !important;
        transition-property:height,visibility,background-color !important;
        transition-duration:var(--r-globalnav-flyout-rate),var(--r-globalnav-flyout-rate),480ms !important;
        transition-timing-function:cubic-bezier(.4,0,.6,1),step-start,cubic-bezier(.4,0,.6,1) !important;
        transition-delay:0ms !important;
    }
}

@media (max-width:833px){
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav{
        --r-globalnav-background-opened:#fafafc;
    }

    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-content{
        background-image:none !important;
        background-color:#8b0 !important;
        transition-property:height,background-color !important;
        transition-duration:var(--r-globalnav-flyout-rate),480ms !important;
        transition-timing-function:cubic-bezier(.4,0,.6,1),cubic-bezier(.4,0,.6,1) !important;
        transition-delay:80ms,0ms !important;
    }

    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-flyout-open .globalnav-content,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-menu-open .globalnav-content,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-submenu-open .globalnav-content{
        background-image:none !important;
        background-color:#fafafc !important;
        transition-delay:0ms !important;
    }
}

/* /tp/: desktop flyout + menubutton state transitions, isolated from hover timing. */
@media (min-width:834px){
    /* Keep one authoritative surface transition for the full desktop flyout lifecycle. */
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-submenu,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-animating .globalnav-submenu,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav:not(.globalnav-animating) .globalnav-submenu{
        background-image:none !important;
        background-color:#8b0 !important;
        transition-property:height,visibility,background-color !important;
        transition-duration:var(--r-globalnav-flyout-rate),var(--r-globalnav-flyout-rate),480ms !important;
        transition-timing-function:cubic-bezier(.4,0,.6,1),step-end,cubic-bezier(.4,0,.6,1) !important;
        transition-delay:120ms,120ms,0ms !important;
        will-change:height,background-color;
    }

    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-item.globalnav-item-flyout-open .globalnav-submenu,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav:not(.globalnav-animating) .globalnav-item.globalnav-item-flyout-open .globalnav-submenu,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-item.globalnav-item-flyout-change-next .globalnav-submenu,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-item.globalnav-item-flyout-change-previous .globalnav-submenu{
        background-image:none !important;
        background-color:#fafafc !important;
        transition-property:height,visibility,background-color !important;
        transition-duration:var(--r-globalnav-flyout-rate),var(--r-globalnav-flyout-rate),480ms !important;
        transition-timing-function:cubic-bezier(.4,0,.6,1),step-start,cubic-bezier(.4,0,.6,1) !important;
        transition-delay:0ms !important;
    }

    /* Inner flyout layers stay transparent so they cannot cover the interpolating surface. */
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-flyout,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-flyout-scroll-container,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-submenu-content{
        background-color:transparent !important;
        background-image:none !important;
    }

    /* Search/bag controls use state animation, while ordinary hover remains fast. */
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav #globalnav-menubutton-link-search,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav #globalnav-menubutton-link-bag{
        transition:color 480ms cubic-bezier(.4,0,.6,1) 0ms !important;
    }

    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav #globalnav-menubutton-link-search[aria-expanded="true"],
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-search.globalnav-item-flyout-open #globalnav-menubutton-link-search,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav #globalnav-menubutton-link-bag[aria-expanded="true"],
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-bag.globalnav-item-flyout-open #globalnav-menubutton-link-bag{
        color:#000 !important;
        transition:color 480ms cubic-bezier(.4,0,.6,1) 0ms !important;
    }

    /* Do not let :hover shorten an active open/close state transition. */
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav #globalnav-menubutton-link-search[aria-expanded="true"]:hover,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav #globalnav-menubutton-link-bag[aria-expanded="true"]:hover{
        color:#000 !important;
        transition:color 480ms cubic-bezier(.4,0,.6,1) 0ms !important;
    }
}

/* Keyboard focus for the compact menu trigger: exactly match .globalnav-link focus geometry/color. */
#globalnav #globalnav-menutrigger-button:focus{
    outline:none;
}
#globalnav #globalnav-menutrigger-button:focus-visible,
#globalnav #globalnav-menutrigger-button[data-focus-method=key]{
    --sk-focus-offset:-7px;
    outline:2px solid var(--sk-focus-color,#0071e3) !important;
    outline-offset:var(--sk-focus-offset,1px) !important;
    border-radius:0 !important;
    box-shadow:none !important;
}
#globalnav #globalnav-menutrigger-button[data-focus-method=touch],
#globalnav #globalnav-menutrigger-button[data-focus-method=mouse]{
    outline:none !important;
    box-shadow:none !important;
}

@media (prefers-reduced-motion:reduce){
    @media (min-width:834px){
        body.bb-nav-tp-page #globalnav .globalnav-submenu,
        body.bb-nav-tp-page #globalnav #globalnav-menubutton-link-search,
        body.bb-nav-tp-page #globalnav #globalnav-menubutton-link-bag{
            transition-duration:.01ms !important;
            transition-delay:0ms !important;
        }
    }
}

/* /tp/: deterministic desktop globalnav surface across the full flyout lifecycle.
   The nav itself always owns a color, so the core white shorthand can never flash
   between open/closing/closed class changes. */
@media (min-width:834px){
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav{
        background-image:none !important;
        background-color:#8b0 !important;
        transition-property:background-color !important;
        transition-duration:480ms !important;
        transition-timing-function:cubic-bezier(.4,0,.6,1) !important;
        transition-delay:0ms !important;
        will-change:background-color;
    }

    /* Opening/open: interpolate green -> flyout surface. */
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-flyout-open,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-menu-open,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-submenu-open,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav:has(#globalnav-menubutton-link-search[aria-expanded="true"]),
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav:has(#globalnav-menubutton-link-bag[aria-expanded="true"]){
        background-color:#fafafc !important;
    }

    /* Closing: never expose the core white background; interpolate white -> green. */
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-flyout-closing:not(.globalnav-with-flyout-open):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open){
        background-color:#8b0 !important;
    }

    /* Preserve the requested return-to-top delay for scroll transitions only. */
    body.bb-nav-tp-page.bb-nav-tp-scroll-transition.bb-nav-tp-returning-top:not(.bb-nav-has-scrolled) #globalnav{
        transition-delay:80ms !important;
    }
}

@media (prefers-reduced-motion:reduce) and (min-width:834px){
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav{
        transition-duration:.01ms !important;
        transition-delay:0ms !important;
    }
}

/* /tp/ desktop: authoritative JS-owned flyout state.
   This final block intentionally overrides earlier TP desktop experiments so
   Search/Bag open-close animations cannot race native globalnav classes. */
@media (min-width:834px){
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav{
        --r-globalnav-color:rgba(255,255,255,.8) !important;
        --r-globalnav-color-hover:#fff !important;
        background:#8b0 !important;
        background-color:#8b0 !important;
        transition:background-color 480ms cubic-bezier(.4,0,.6,1) 0ms !important;
    }

    body.bb-nav-tp-page:not(.bb-nav-has-scrolled).bb-nav-tp-flyout-active #globalnav{
        --r-globalnav-color:rgba(0,0,0,.8) !important;
        --r-globalnav-color-hover:#000 !important;
        background:#fafafc !important;
        background-color:#fafafc !important;
    }

    /* Native inner header layer must never flash its own white/green shorthand. */
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-content{
        background:transparent !important;
        background-color:transparent !important;
    }

    /* The expanding desktop flyout gets the exact same state/timing as the header. */
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-submenu{
        background:#8b0 !important;
        background-color:#8b0 !important;
        transition-property:height,visibility,background-color !important;
        transition-duration:var(--r-globalnav-flyout-rate),var(--r-globalnav-flyout-rate),480ms !important;
        transition-timing-function:cubic-bezier(.4,0,.6,1),step-end,cubic-bezier(.4,0,.6,1) !important;
        transition-delay:0ms,0ms,0ms !important;
    }
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled).bb-nav-tp-flyout-active #globalnav .globalnav-submenu{
        background:#fafafc !important;
        background-color:#fafafc !important;
        transition-timing-function:cubic-bezier(.4,0,.6,1),step-start,cubic-bezier(.4,0,.6,1) !important;
    }

    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-flyout,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-flyout-scroll-container,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-submenu-content{
        background:transparent !important;
        background-color:transparent !important;
    }

    /* All desktop foreground controls follow only the JS flyout state. */
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-link,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-link-apple,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav #globalnav-menubutton-link-search,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav #globalnav-menubutton-link-bag{
        color:rgba(255,255,255,.8) !important;
        transition:color 480ms cubic-bezier(.4,0,.6,1) 0ms !important;
    }
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-link:hover,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-link-apple:hover,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav #globalnav-menubutton-link-search:hover,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav #globalnav-menubutton-link-bag:hover{
        color:#fff !important;
        transition:color 20ms cubic-bezier(.4,0,.6,1) 0ms !important;
    }

    body.bb-nav-tp-page:not(.bb-nav-has-scrolled).bb-nav-tp-flyout-active #globalnav .globalnav-link,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled).bb-nav-tp-flyout-active #globalnav .globalnav-link-apple,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled).bb-nav-tp-flyout-active #globalnav #globalnav-menubutton-link-search,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled).bb-nav-tp-flyout-active #globalnav #globalnav-menubutton-link-bag{
        color:rgba(0,0,0,.8) !important;
        transition:color 480ms cubic-bezier(.4,0,.6,1) 0ms !important;
    }
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled).bb-nav-tp-flyout-active #globalnav .globalnav-link:hover,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled).bb-nav-tp-flyout-active #globalnav .globalnav-link-apple:hover,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled).bb-nav-tp-flyout-active #globalnav #globalnav-menubutton-link-search:hover,
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled).bb-nav-tp-flyout-active #globalnav #globalnav-menubutton-link-bag:hover{
        color:#000 !important;
        transition:color 20ms cubic-bezier(.4,0,.6,1) 0ms !important;
    }

    /* Badge follows the open flyout's dark foreground family too. */
    body.bb-nav-tp-page:not(.bb-nav-has-scrolled).bb-nav-tp-flyout-active .globalnav-bag-badge{
        --globalnav-badge-background:rgb(0,0,0) !important;
        --globalnav-badge-text-color:rgb(255,255,255) !important;
    }

    @media (prefers-reduced-motion:reduce){
        body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav,
        body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-submenu,
        body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-link,
        body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav .globalnav-link-apple,
        body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav #globalnav-menubutton-link-search,
        body.bb-nav-tp-page:not(.bb-nav-has-scrolled) #globalnav #globalnav-menubutton-link-bag{
            transition-duration:.01ms !important;
            transition-delay:0ms !important;
        }
    }
}

/* Homepage/front-page global navigation: green top state, theme surface after scroll. */
body.bb-nav-front-page.bb-nav-global-only-page {
    --bb-front-nav-transition-duration: 480ms;
    --bb-front-nav-foreground-duration: .32s;
    --bb-front-nav-transition-easing: cubic-bezier(.4,0,.6,1);
    --bb-front-top-surface: #88bb00;
    --bb-front-flyout-surface: #fafafc;
}

/* Desktop uses the same 480ms surface rhythm as mobile. Keeping one shared
   variable means the header, Search and Bag always complete together. */

/* Requested homepage top surface. */
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)[data-bb-nav-section-mode="base"] #globalnav,
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not([data-bb-nav-section-mode]) #globalnav {
    --bb-nav-surface-color: var(--bb-front-top-surface) !important;
    --globalnav-background: color-mix(in srgb, var(--bb-nav-surface-color) 92%, transparent) !important;
}

@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))) {
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)[data-bb-nav-section-mode="base"] #globalnav,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not([data-bb-nav-section-mode]) #globalnav {
        --globalnav-background: color-mix(in srgb, var(--bb-nav-surface-color) 100%, transparent) !important;
    }
}

/* Keep the existing homepage color cadence on compact layouts only.
   Desktop inherits the same native/global foreground timing as the reference,
   so logo, text, Search and Bag cannot trail the desktop surface transition. */
@media (max-width:833px) {
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-link,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-link-apple,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menubutton-link-search,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menubutton-link-bag,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-menuback-button,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-submenu-link {
        transition-property: color !important;
        transition-duration: var(--bb-front-nav-transition-duration) !important;
        transition-timing-function: var(--bb-front-nav-transition-easing) !important;
        transition-delay: 0ms !important;
    }

    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-link-bag {
        transition: color var(--bb-front-nav-transition-duration) var(--bb-front-nav-transition-easing) 0ms,
                    transform .3s cubic-bezier(.25,.1,.3,1) !important;
    }

    body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menutrigger-button {
        transition: opacity .32s cubic-bezier(.4,0,.6,1),
                    color var(--bb-front-nav-transition-duration) var(--bb-front-nav-transition-easing) 0ms !important;
    }
}

/* Mobile homepage: keep homepage color VALUES, but use the exact native/global
   transition timing for menu text, submenu text and the back button. Motion is
   still entirely owned by globalnav-core.css (including the 240ms forward/back
   submenu slide and the translateY(-8px) final-close outro). */
@media (max-width:833px) {
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-link,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-link-apple,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-submenu-link,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-menuback-button {
        transition-property: color !important;
        transition-duration: .32s !important;
        transition-timing-function: cubic-bezier(.4,0,.6,1) !important;
        transition-delay: 0ms !important;
    }
}

/* Green top state always starts with white foreground, in both light and dark themes. */
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav {
    --r-globalnav-color: rgb(255 255 255 / 80%) !important;
    --r-globalnav-color-secondary: #fff !important;
    --r-globalnav-color-hover: #fff !important;
}

body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav #globalnav-menutrigger-button,
html[data-hecu-resolved="light"] body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav #globalnav-menutrigger-button,
body.bb-nav-front-page.bb-nav-global-only-page[data-hecu-resolved="light"]:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav #globalnav-menutrigger-button,
html[data-hecu-resolved="dark"] body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav #globalnav-menutrigger-button,
body.bb-nav-front-page.bb-nav-global-only-page[data-hecu-resolved="dark"]:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav #globalnav-menutrigger-button {
    color: #fff !important;
}

/* Top badge is reversed for the green header. */
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) .globalnav-bag-badge {
    --globalnav-badge-background: rgb(255,255,255) !important;
    --globalnav-badge-text-color: rgb(0,0,0) !important;
}

/* Preserve native count/shape movement while synchronizing badge colors. */
body.bb-nav-front-page.bb-nav-global-only-page .globalnav-bag-badge {
    transition: width .3s cubic-bezier(.25,.1,.3,1),
                opacity .24s ease,
                visibility .24s step-start,
                color var(--bb-front-nav-foreground-duration,.32s) var(--bb-front-nav-transition-easing) 0ms !important;
}
body.bb-nav-front-page.bb-nav-global-only-page .globalnav-bag-badge::before {
    transition: transform .3s cubic-bezier(.25,.1,.3,1),
                background-color var(--bb-front-nav-foreground-duration,.32s) var(--bb-front-nav-transition-easing) 0ms !important;
}
body.bb-nav-front-page.bb-nav-global-only-page .globalnav-bag-badge::after {
    transition: background-color var(--bb-front-nav-foreground-duration,.32s) var(--bb-front-nav-transition-easing) 0ms !important;
}
body.bb-nav-front-page.bb-nav-global-only-page .globalnav-bag-badge-separator {
    transition: transform .3s cubic-bezier(.25,.1,.3,1),
                background-color var(--bb-front-nav-foreground-duration,.32s) var(--bb-front-nav-transition-easing) 0ms !important;
}

/* Resolve the flyout surface from the active theme. */
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav {
    --bb-front-flyout-surface: #fafafc;
    --r-globalnav-background-opened: #fafafc !important;
    --r-globalnav-background-opened-dark: #fafafc !important;
    --r-globalnav-color: rgb(0 0 0 / 80%) !important;
    --r-globalnav-color-secondary: #333336 !important;
    --r-globalnav-color-hover: #000 !important;
}

body.theme-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav,
body.globalheader-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav,
body[data-hecu-resolved="dark"].bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav,
html[data-hecu-resolved="dark"] body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav,
html.theme-dark body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav,
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav.globalnav-dark,
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav.globalheader-dark,
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active .globalheader-dark #globalnav {
    --bb-front-flyout-surface: #161617;
    --r-globalnav-background-opened: #161617 !important;
    --r-globalnav-background-opened-dark: #161617 !important;
    --r-globalnav-color: rgb(255 255 255 / 80%) !important;
    --r-globalnav-color-secondary: #e8e8ed !important;
    --r-globalnav-color-hover: #fff !important;
}

/* Desktop: one persistent paint channel for the homepage surface.
   Search keeps its .globalnav-item-flyout-open class after the nav-level open
   class can change, so both native signals are included. Only the surface
   color is overridden; height, scrolling, and the native visibility lifecycle
   stay intact. */
@media (min-width:834px) {
    /* The destination state must keep this transition too. Otherwise adding
       bb-nav-front-has-scrolled removes it and the header snaps. */
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav:not(.globalnav-block-transitions) {
        transition: background-color var(--bb-front-nav-transition-duration) var(--bb-front-nav-transition-easing) 0ms !important;
        will-change: background-color;
    }

    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav {
        --bb-front-desktop-surface: var(--bb-front-top-surface);
        background: none !important;
        background-color: var(--bb-front-desktop-surface) !important;
    }

    /* Keep every inner layer transparent. The header and its expanding
       submenu are the only elements allowed to paint a desktop flyout surface. */
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav .globalnav-content,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav .globalnav-flyout,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav .globalnav-flyout-scroll-container,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav .globalnav-submenu-content {
        background: transparent !important;
        background-color: transparent !important;
    }

    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav .globalnav-submenu {
        background-image: none !important;
        background-color: var(--bb-front-desktop-surface) !important;
        /* Height, visibility, delay and the 120ms menu-to-menu animation are
           owned by globalnav-core.css. Do not replace those transitions here. */
    }

    /* During a native desktop handoff the outgoing panel stays as the painted
       surface while the incoming panel is transparent until its 120ms content
       fade completes. This prevents an opaque incoming panel from covering the
       outgoing content for a frame (the visible white/dark flash). */
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-open.globalnav-with-flyout-closing .globalnav-item-flyout-change-previous .globalnav-submenu {
        background-image: none !important;
        background-color: var(--bb-front-flyout-surface) !important;
    }

    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-open.globalnav-with-flyout-closing .globalnav-item-flyout-change-next .globalnav-submenu {
        background: transparent !important;
        background-color: transparent !important;
    }

    /* The intent class covers the click frame. Native nav, trigger and item
       states keep the same color through the final Search animation frame. */
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-open,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-menu-open,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-submenu-open,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav:has(.globalnav-item-flyout-open),
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav:has(#globalnav-menubutton-link-search[aria-expanded="true"]),
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav:has(#globalnav-menubutton-link-bag[aria-expanded="true"]) {
        --bb-front-desktop-surface: var(--bb-front-flyout-surface);
    }

    /* Close owns the return color even while a native item keeps its open class
       for the height/contents outro. */
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-closing #globalnav,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-closing:not(.globalnav-with-flyout-open) {
        --bb-front-desktop-surface: var(--bb-front-top-surface);
    }

    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav:has(.globalnav-item-flyout-open) {
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }
}

/* Mobile: the opened flyout gets the theme surface, but the TOP BAR keeps
   logo/search/bag white. Only the menu trigger changes to black in light mode. */
@media (max-width:833px) {
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-content {
        transition: height var(--r-globalnav-flyout-rate) cubic-bezier(.4,0,.6,1) 80ms,
                    background-color var(--bb-front-nav-transition-duration) var(--bb-front-nav-transition-easing) 0ms !important;
    }

    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active)[data-bb-nav-section-mode="base"] #globalnav .globalnav-content,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active):not([data-bb-nav-section-mode]) #globalnav .globalnav-content {
        background-image: none !important;
        background-color: var(--globalnav-background) !important;
    }

    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav .globalnav-content {
        background-image: none !important;
        background-color: var(--bb-front-flyout-surface) !important;
    }

    /* Mobile-only exception requested: these top-bar controls stay white. */
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav .globalnav-link-apple,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav #globalnav-menubutton-link-search,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav #globalnav-menubutton-link-bag {
        color: rgb(255 255 255 / 80%) !important;
    }

    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav .globalnav-link-apple:hover,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav #globalnav-menubutton-link-search:hover,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav #globalnav-menubutton-link-bag:hover {
        color: #fff !important;
    }

    /* Light mobile flyout: trigger alone transitions white -> black. */
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav #globalnav-menutrigger-button,
    html[data-hecu-resolved="light"] body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav #globalnav-menutrigger-button,
    body.bb-nav-front-page.bb-nav-global-only-page[data-hecu-resolved="light"]:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav #globalnav-menutrigger-button {
        color: #000 !important;
    }

    /* Dark mobile flyout: trigger remains white. */
    body.theme-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav #globalnav-menutrigger-button,
    body.globalheader-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav #globalnav-menutrigger-button,
    body[data-hecu-resolved="dark"].bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav #globalnav-menutrigger-button,
    html[data-hecu-resolved="dark"] body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav #globalnav-menutrigger-button,
    html.theme-dark body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav #globalnav-menutrigger-button,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav.globalnav-dark #globalnav-menutrigger-button,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav.globalheader-dark #globalnav-menutrigger-button {
        color: #fff !important;
    }
}

/* Active flyout badge follows the resolved theme. */
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active .globalnav-bag-badge {
    --globalnav-badge-background: rgb(0,0,0) !important;
    --globalnav-badge-text-color: rgb(255,255,255) !important;
}
body.theme-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active .globalnav-bag-badge,
body.globalheader-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active .globalnav-bag-badge,
body[data-hecu-resolved="dark"].bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active .globalnav-bag-badge,
html[data-hecu-resolved="dark"] body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active .globalnav-bag-badge,
html.theme-dark body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active .globalnav-bag-badge,
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav.globalnav-dark .globalnav-bag-badge,
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav.globalheader-dark .globalnav-bag-badge {
    --globalnav-badge-background: rgb(255,255,255) !important;
    --globalnav-badge-text-color: rgb(0,0,0) !important;
}

/* Mobile top-state bag badge is intentionally fixed to the light badge
   treatment. Do not let active/closing flyout or dark-theme selectors swap its
   variables while the mobile navigation lifecycle is changing classes. */
@media (max-width:833px) {
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) .globalnav-bag-badge {
        --globalnav-badge-background: rgb(255,255,255) !important;
        --globalnav-badge-text-color: rgb(0,0,0) !important;
        color: rgb(0,0,0) !important;
    }

    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) .globalnav-bag-badge::before,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) .globalnav-bag-badge::after,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) .globalnav-bag-badge-separator {
        background-color: rgb(255,255,255) !important;
    }

    /* The badge has no color change on mobile, so retain only its native
       count/shape/visibility motion and remove color interpolation entirely. */
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) .globalnav-bag-badge {
        transition: width .3s cubic-bezier(.25,.1,.3,1),
                    opacity .24s ease,
                    visibility .24s step-start !important;
    }

    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) .globalnav-bag-badge::before {
        transition: transform .3s cubic-bezier(.25,.1,.3,1) !important;
    }

    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) .globalnav-bag-badge::after {
        transition: none !important;
    }

    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) .globalnav-bag-badge-separator {
        transition: transform .3s cubic-bezier(.25,.1,.3,1) !important;
    }
}


/* Homepage flyout closing: as soon as the native close lifecycle begins,
   transition the visible surface back to the green top state. This explicit
   state intentionally wins over the still-present/open classes during Apple's
   closing animation, preventing the surface from staying white/dark until the
   flyout has already disappeared. */
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-closing #globalnav,
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-closing {
    --bb-nav-surface-color: var(--bb-front-top-surface) !important;
    --globalnav-background: color-mix(in srgb, var(--bb-nav-surface-color) 92%, transparent) !important;
    --r-globalnav-color: rgb(255 255 255 / 80%) !important;
    --r-globalnav-color-secondary: #fff !important;
    --r-globalnav-color-hover: #fff !important;
}

@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))) {
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-closing #globalnav,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-closing {
        --globalnav-background: color-mix(in srgb, var(--bb-nav-surface-color) 100%, transparent) !important;
    }
}

@media (min-width:834px) {
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-closing #globalnav,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-closing,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-closing #globalnav .globalnav-submenu,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-closing .globalnav-submenu {
        background-image: none !important;
        background-color: var(--globalnav-background) !important;
    }
}

@media (max-width:833px) {
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-closing #globalnav .globalnav-content,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-closing .globalnav-content {
        background-image: none !important;
        background-color: var(--globalnav-background) !important;
    }

    /* On mobile the trigger returns black -> white during close; logo/search/bag
       already remain white throughout the open state. */
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-closing #globalnav #globalnav-menutrigger-button,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-closing #globalnav-menutrigger-button,
    html[data-hecu-resolved="light"] body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-closing #globalnav #globalnav-menutrigger-button,
    html[data-hecu-resolved="light"] body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-closing #globalnav-menutrigger-button,
    body.bb-nav-front-page.bb-nav-global-only-page[data-hecu-resolved="light"]:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-closing #globalnav-menutrigger-button,
    html[data-hecu-resolved="dark"] body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-closing #globalnav-menutrigger-button,
    body.bb-nav-front-page.bb-nav-global-only-page[data-hecu-resolved="dark"]:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-closing #globalnav-menutrigger-button {
        color: #fff !important;
    }
}

body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-closing .globalnav-bag-badge,
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):has(#globalnav.globalnav-with-flyout-closing) .globalnav-bag-badge {
    --globalnav-badge-background: rgb(255,255,255) !important;
    --globalnav-badge-text-color: rgb(0,0,0) !important;
}

/* Unscrolled desktop final-close synchronization. The native submenu waits
   120ms, then collapses for its calculated 240-480ms rate. Only the top-level
   foreground and header surface use this total close duration; ordinary hover
   and submenu content keep the native GlobalNav timings. */
@media (min-width:834px) {
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-closing #globalnav:not(.globalnav-with-flyout-open),
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-closing:not(.globalnav-with-flyout-open) {
        transition-duration: var(--bb-front-nav-close-duration, 360ms) !important;
        transition-delay: 0ms !important;
    }

    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-closing #globalnav:not(.globalnav-with-flyout-open) .globalnav-link,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-closing:not(.globalnav-with-flyout-open) .globalnav-link,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-closing #globalnav:not(.globalnav-with-flyout-open) #globalnav-menubutton-link-search,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-closing #globalnav:not(.globalnav-with-flyout-open) #globalnav-menubutton-link-bag,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-closing:not(.globalnav-with-flyout-open) #globalnav-menubutton-link-search,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-closing:not(.globalnav-with-flyout-open) #globalnav-menubutton-link-bag {
        transition-property: color !important;
        transition-duration: var(--bb-front-nav-close-duration, 360ms) !important;
        transition-timing-function: var(--bb-front-nav-transition-easing) !important;
        transition-delay: 0ms !important;
    }

    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-closing #globalnav:not(.globalnav-with-flyout-open) .globalnav-link-bag,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-closing:not(.globalnav-with-flyout-open) .globalnav-link-bag {
        transition: color var(--bb-front-nav-close-duration, 360ms) var(--bb-front-nav-transition-easing) 0ms,
                    transform .3s cubic-bezier(.25,.1,.3,1) !important;
    }
}

/* A desktop/mobile breakpoint change is a layout change, not a nav animation.
   Suppress transitions for that frame so colors/background cannot flash through
   an intermediate media-query state. */
body.bb-nav-front-page.bb-nav-global-only-page.bb-nav-front-resizing #globalnav,
body.bb-nav-front-page.bb-nav-global-only-page.bb-nav-front-resizing #globalnav .globalnav-content,
body.bb-nav-front-page.bb-nav-global-only-page.bb-nav-front-resizing #globalnav .globalnav-submenu,
body.bb-nav-front-page.bb-nav-global-only-page.bb-nav-front-resizing #globalnav .globalnav-link,
body.bb-nav-front-page.bb-nav-global-only-page.bb-nav-front-resizing #globalnav .globalnav-link-apple,
body.bb-nav-front-page.bb-nav-global-only-page.bb-nav-front-resizing #globalnav #globalnav-menubutton-link-search,
body.bb-nav-front-page.bb-nav-global-only-page.bb-nav-front-resizing #globalnav #globalnav-menubutton-link-bag,
body.bb-nav-front-page.bb-nav-global-only-page.bb-nav-front-resizing #globalnav #globalnav-menubutton-link-account,
body.bb-nav-front-page.bb-nav-global-only-page.bb-nav-front-resizing #globalnav #globalnav-menutrigger-button,
body.bb-nav-front-page.bb-nav-global-only-page.bb-nav-front-resizing .globalnav-bag-badge,
body.bb-nav-front-page.bb-nav-global-only-page.bb-nav-front-resizing .globalnav-bag-badge::before,
body.bb-nav-front-page.bb-nav-global-only-page.bb-nav-front-resizing .globalnav-bag-badge::after,
body.bb-nav-front-page.bb-nav-global-only-page.bb-nav-front-resizing .globalnav-bag-badge-separator {
    transition: none !important;
}

@media (prefers-reduced-motion:reduce) {
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-content,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-submenu,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-link,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-link-apple,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menubutton-link-search,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menubutton-link-bag,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menubutton-link-account,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menutrigger-button,
    body.bb-nav-front-page.bb-nav-global-only-page .globalnav-bag-badge,
    body.bb-nav-front-page.bb-nav-global-only-page .globalnav-bag-badge::before,
    body.bb-nav-front-page.bb-nav-global-only-page .globalnav-bag-badge::after,
    body.bb-nav-front-page.bb-nav-global-only-page .globalnav-bag-badge-separator {
        transition-duration: .01ms !important;
        transition-delay: 0ms !important;
    }
}

/* Persistent document scrollbar for GlobalNav, all widths.
   The native GlobalNav applies overflow:hidden to both html and body while a
   flyout is open. That removes the actual browser scrollbar. Keep the document
   in normal flow instead so the real root scrollbar remains present; JS below
   freezes the scroll position while the native lock class is active. */
html {
    overflow-y: scroll !important;
}

html.globalnav-noscroll,
html.globalnav-noscroll.globalnav-noscroll-y,
html.globalnav-noscroll.globalnav-noscroll-long,
html.globalnav-noscroll.globalnav-noscroll-long.globalnav-noscroll-y,
html.bb-globalnav-scrollbar-lock {
    overflow-y: scroll !important;
    height: auto !important;
    position: static !important;
    padding-inline-end: 0 !important;
    scrollbar-gutter: auto !important;
}

html.globalnav-noscroll body,
html.globalnav-noscroll.globalnav-noscroll-y body,
html.globalnav-noscroll.globalnav-noscroll-long body,
html.globalnav-noscroll.globalnav-noscroll-long.globalnav-noscroll-y body,
html.bb-globalnav-scrollbar-lock body {
    overflow: visible !important;
    height: auto !important;
    position: static !important;
}

/* Final homepage surface state machine. The native section-mode attribute can
   change during flyout teardown, so closed/closing green must not depend on it.
   This prevents the one-frame surface flash after the flyout finishes closing. */
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav {
    --bb-nav-surface-color: var(--bb-front-top-surface) !important;
    --globalnav-background: color-mix(in srgb, var(--bb-nav-surface-color) 92%, transparent) !important;
    --r-globalnav-color: rgb(255 255 255 / 80%) !important;
    --r-globalnav-color-secondary: #fff !important;
    --r-globalnav-color-hover: #fff !important;
}

@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))) {
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav {
        --globalnav-background: color-mix(in srgb, var(--bb-nav-surface-color) 100%, transparent) !important;
    }
}

@media (min-width:834px) {
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav .globalnav-submenu {
        background-image: none !important;
        background-color: var(--globalnav-background) !important;
    }
}

@media (max-width:833px) {
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav .globalnav-content {
        background-image: none !important;
        background-color: var(--globalnav-background) !important;
    }
}


/* =========================================================
   HOMEPAGE MOBILE FLYOUT - SAME NATIVE STATE FLOW AS /tp/
   Closed/closing = green. Native open classes = flyout surface.
   The painted surface no longer depends on the custom body flyout timing.
   ========================================================= */
@media (max-width:833px) {
    /* Resolve the mobile flyout surface without requiring the custom
       bb-nav-front-flyout-active class, so the native state owns the paint. */
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav {
        --bb-front-mobile-flyout-surface: #fafafc;
        --r-globalnav-background-opened: #fafafc;
        --r-globalnav-background-opened-dark: #fafafc;
    }

    body.theme-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav,
    body.globalheader-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav,
    body[data-hecu-resolved="dark"].bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav,
    html[data-hecu-resolved="dark"] body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav,
    html.theme-dark body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-dark,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalheader-dark,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) .globalheader-dark #globalnav {
        --bb-front-mobile-flyout-surface: #161617;
        --r-globalnav-background-opened: #161617;
        --r-globalnav-background-opened-dark: #161617;
    }

    /* Same structure/timing as /tp/: the compact header itself starts green. */
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav .globalnav-content {
        background-image: none !important;
        background-color: #88bb00 !important;
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
        transition-property: height, background-color !important;
        transition-duration: var(--r-globalnav-flyout-rate), 480ms !important;
        transition-timing-function: cubic-bezier(.4,0,.6,1), cubic-bezier(.4,0,.6,1) !important;
        transition-delay: 80ms, 0ms !important;
        will-change: height, background-color;
    }

    /* Exactly like /tp/: only the native OPEN classes paint the flyout surface.
       When those classes fall away during close, this naturally interpolates
       back to green and cannot bounce through a custom JS/body state. */
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-open .globalnav-content,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-menu-open .globalnav-content,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-submenu-open .globalnav-content {
        background-image: none !important;
        background-color: var(--bb-front-mobile-flyout-surface) !important;
        transition-delay: 0ms !important;
    }

    /* If the custom body flag lags behind native close by a frame, do not let
       its earlier rule repaint the compact header. Native closed state wins. */
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled).bb-nav-front-flyout-active #globalnav:not(.globalnav-with-flyout-open):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-closing:not(.globalnav-with-flyout-open):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open) .globalnav-content {
        background-image: none !important;
        background-color: #88bb00 !important;
    }

    /* Mobile submenu handoff only: native compact navigation briefly swaps its
       open classes while change-previous/change-next stays active. Keep the
       already-open flyout surface through that class gap so the homepage green
       can never flash between the main menu and a submenu. Paint only; native
       forward/back motion and all timing remain untouched. */
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav:has(.globalnav-item-flyout-change-previous, .globalnav-item-flyout-change-next) .globalnav-content {
        background-image: none !important;
        background-color: var(--bb-front-mobile-flyout-surface) !important;
    }
}

/* =========================================================
   HOMEPAGE MOBILE TOP-BAR ICON SYNC
   Restore the native compact-nav opacity/visibility timing that the homepage
   color override would otherwise replace. Opening fades the logo/search/bag
   out together; closing fades them back together immediately with no return
   delay. The menu trigger keeps its native 240ms morph and changes color on
   the same native open/close state instead of the earlier body intent flag.
   ========================================================= */
@media (max-width:833px) {
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav {
        --bb-front-mobile-icon-duration: 240ms;
        --bb-front-mobile-icon-easing: cubic-bezier(.4,0,.6,1);
        --bb-front-mobile-icon-return-delay: 0ms;
    }

    /* Closed/closing: logo + search return together immediately. Keep color in the same transition so
       no foreground channel can snap while opacity is interpolating. */
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-list > .globalnav-item:not(.globalnav-menu) .globalnav-link {
        opacity: 1;
        visibility: visible;
        transition: opacity var(--bb-front-mobile-icon-duration) var(--bb-front-mobile-icon-easing) var(--bb-front-mobile-icon-return-delay),
                    visibility var(--bb-front-mobile-icon-duration) step-start var(--bb-front-mobile-icon-return-delay),
                    color var(--bb-front-mobile-icon-duration) var(--bb-front-mobile-icon-easing) var(--bb-front-mobile-icon-return-delay) !important;
        will-change: opacity, color;
    }

    /* Opening/open: fade immediately instead of being hidden by the homepage's
       color-only transition override. */
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-flyout-open .globalnav-list > .globalnav-item:not(.globalnav-menu) .globalnav-link,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-menu-open .globalnav-list > .globalnav-item:not(.globalnav-menu) .globalnav-link,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-submenu-open .globalnav-list > .globalnav-item:not(.globalnav-menu) .globalnav-link {
        opacity: 0;
        visibility: hidden;
        transition: opacity var(--bb-front-mobile-icon-duration) var(--bb-front-mobile-icon-easing) 0ms,
                    visibility var(--bb-front-mobile-icon-duration) step-end 0ms,
                    color var(--bb-front-mobile-icon-duration) var(--bb-front-mobile-icon-easing) 0ms !important;
    }

    /* Bag visibility is owned by its wrapper in the native compact nav. Keep it
       on exactly the same fade timing as logo/search. */
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-bag-wrapper {
        opacity: 1;
        visibility: visible;
        transition: opacity var(--bb-front-mobile-icon-duration) var(--bb-front-mobile-icon-easing) var(--bb-front-mobile-icon-return-delay),
                    visibility var(--bb-front-mobile-icon-duration) step-start var(--bb-front-mobile-icon-return-delay) !important;
        will-change: opacity;
    }

    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-flyout-open .globalnav-bag-wrapper,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-menu-open .globalnav-bag-wrapper,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-submenu-open .globalnav-bag-wrapper {
        opacity: 0;
        visibility: hidden;
        transition: opacity var(--bb-front-mobile-icon-duration) var(--bb-front-mobile-icon-easing) 0ms,
                    visibility var(--bb-front-mobile-icon-duration) step-end 0ms !important;
    }

    /* The bag link itself stays opaque inside the fading wrapper, matching the
       native implementation and avoiding a doubled opacity fade. */
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-flyout-open .globalnav-list > .globalnav-item:not(.globalnav-menu) .globalnav-link-bag,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-menu-open .globalnav-list > .globalnav-item:not(.globalnav-menu) .globalnav-link-bag,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-submenu-open .globalnav-list > .globalnav-item:not(.globalnav-menu) .globalnav-link-bag {
        opacity: 1 !important;
    }

    /* Menu trigger: the compact trigger is an SVG made from two polylines
       (top/bottom bread), not CSS ::before/::after. Keep the button currentColor
       and the actual SVG stroke synchronized at the requested native 240ms
       cadence. No close delay: black -> white starts immediately on close. */
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav #globalnav-menutrigger-button {
        color: #fff !important;
        transition: opacity .32s cubic-bezier(.4,0,.6,1),
                    color 240ms cubic-bezier(.4,0,.6,1) 0ms !important;
        will-change: color;
    }

    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav .globalnav-menutrigger-bread {
        stroke: #fff !important;
        transition: stroke 240ms cubic-bezier(.4,0,.6,1) 0ms !important;
        will-change: stroke;
    }

    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-open #globalnav-menutrigger-button,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-menu-open #globalnav-menutrigger-button,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-submenu-open #globalnav-menutrigger-button {
        color: #000 !important;
        transition: opacity .32s cubic-bezier(.4,0,.6,1),
                    color 240ms cubic-bezier(.4,0,.6,1) 0ms !important;
    }

    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-open .globalnav-menutrigger-bread,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-menu-open .globalnav-menutrigger-bread,
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-submenu-open .globalnav-menutrigger-bread {
        stroke: #000 !important;
        transition: stroke 240ms cubic-bezier(.4,0,.6,1) 0ms !important;
    }

    /* Dark flyout keeps both the button currentColor and the actual SVG lines
       white, so neither the SMIL shape morph nor theme resolution can repaint
       one of the two bars during close. */
    body.theme-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-open #globalnav-menutrigger-button,
    body.theme-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-menu-open #globalnav-menutrigger-button,
    body.theme-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-submenu-open #globalnav-menutrigger-button,
    body.globalheader-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-open #globalnav-menutrigger-button,
    body.globalheader-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-menu-open #globalnav-menutrigger-button,
    body.globalheader-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-submenu-open #globalnav-menutrigger-button,
    body[data-hecu-resolved="dark"].bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-open #globalnav-menutrigger-button,
    body[data-hecu-resolved="dark"].bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-menu-open #globalnav-menutrigger-button,
    body[data-hecu-resolved="dark"].bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-submenu-open #globalnav-menutrigger-button,
    html[data-hecu-resolved="dark"] body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-open #globalnav-menutrigger-button,
    html[data-hecu-resolved="dark"] body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-menu-open #globalnav-menutrigger-button,
    html[data-hecu-resolved="dark"] body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-submenu-open #globalnav-menutrigger-button {
        color: #fff !important;
    }

    body.theme-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-open .globalnav-menutrigger-bread,
    body.theme-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-menu-open .globalnav-menutrigger-bread,
    body.theme-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-submenu-open .globalnav-menutrigger-bread,
    body.globalheader-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-open .globalnav-menutrigger-bread,
    body.globalheader-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-menu-open .globalnav-menutrigger-bread,
    body.globalheader-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-submenu-open .globalnav-menutrigger-bread,
    body[data-hecu-resolved="dark"].bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-open .globalnav-menutrigger-bread,
    body[data-hecu-resolved="dark"].bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-menu-open .globalnav-menutrigger-bread,
    body[data-hecu-resolved="dark"].bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-submenu-open .globalnav-menutrigger-bread,
    html[data-hecu-resolved="dark"] body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-open .globalnav-menutrigger-bread,
    html[data-hecu-resolved="dark"] body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-menu-open .globalnav-menutrigger-bread,
    html[data-hecu-resolved="dark"] body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-submenu-open .globalnav-menutrigger-bread {
        stroke: #fff !important;
    }
}

@media (prefers-reduced-motion:reduce) and (max-width:833px) {
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-list > .globalnav-item:not(.globalnav-menu) .globalnav-link,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-bag-wrapper,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menutrigger-button,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-menutrigger-bread {
        transition-duration: .01ms !important;
        transition-delay: 0ms !important;
    }
}

/* =========================================================
   HOMEPAGE MOBILE LOGO / SEARCH / BAG - IDENTICAL CLOSE FADE
   Use the same link-owned opacity/visibility transition for all three controls.
   The bag wrapper stays stable so it cannot add a second, out-of-sync fade.
   ========================================================= */
@media (max-width:833px) {
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-link-apple,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menubutton-link-search,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menubutton-link-bag,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menubutton-link-account {
        opacity: 1 !important;
        visibility: visible !important;
        transition: opacity var(--bb-front-mobile-icon-duration) var(--bb-front-mobile-icon-easing) var(--bb-front-mobile-icon-return-delay),
                    visibility var(--bb-front-mobile-icon-duration) step-start var(--bb-front-mobile-icon-return-delay),
                    color var(--bb-front-mobile-icon-duration) var(--bb-front-mobile-icon-easing) var(--bb-front-mobile-icon-return-delay) !important;
        will-change: opacity, color;
    }

    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-flyout-open .globalnav-link-apple,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-menu-open .globalnav-link-apple,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-submenu-open .globalnav-link-apple,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-flyout-open #globalnav-menubutton-link-search,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-menu-open #globalnav-menubutton-link-search,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-submenu-open #globalnav-menubutton-link-search,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-flyout-open #globalnav-menubutton-link-bag,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-menu-open #globalnav-menubutton-link-bag,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-submenu-open #globalnav-menubutton-link-bag,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-flyout-open #globalnav-menubutton-link-account,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-menu-open #globalnav-menubutton-link-account,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-submenu-open #globalnav-menubutton-link-account {
        opacity: 0 !important;
        visibility: hidden !important;
        transition: opacity var(--bb-front-mobile-icon-duration) var(--bb-front-mobile-icon-easing) 0ms,
                    visibility var(--bb-front-mobile-icon-duration) step-end 0ms,
                    color var(--bb-front-mobile-icon-duration) var(--bb-front-mobile-icon-easing) 0ms !important;
    }

    /* Do not fade the bag twice. Its link now owns the same animation as logo/search. */
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-bag-wrapper,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-flyout-open .globalnav-bag-wrapper,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-menu-open .globalnav-bag-wrapper,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-submenu-open .globalnav-bag-wrapper {
        opacity: 1 !important;
        visibility: visible !important;
        transition: none !important;
        will-change: auto;
    }
}


@media (prefers-reduced-motion:reduce) and (max-width:833px) {
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-link-apple,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menubutton-link-search,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menubutton-link-bag,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menubutton-link-account {
        transition-duration: .01ms !important;
        transition-delay: 0ms !important;
    }
}

/* =========================================================
   HOMEPAGE MOBILE ICON COLOR CADENCE - LOGO IS THE REFERENCE
   One timing for logo, search, bag and menu trigger on both flyout close and
   page scroll. No return delay. The trigger's SVG bread follows currentColor,
   so its visible stroke cannot run on a separate timing from the button color.
   ========================================================= */
@media (max-width:833px) {
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav {
        --bb-front-mobile-icon-duration: 240ms;
        --bb-front-mobile-icon-easing: cubic-bezier(.4,0,.6,1);
        --bb-front-mobile-icon-return-delay: 0ms;
    }

    /* Logo is the timing reference. Search and bag use the exact same cadence. */
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-link-apple,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menubutton-link-search,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menubutton-link-bag,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menubutton-link-account {
        transition: opacity 240ms cubic-bezier(.4,0,.6,1) 0ms,
                    visibility 240ms step-start 0ms,
                    color 240ms cubic-bezier(.4,0,.6,1) 0ms !important;
    }

    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-flyout-open .globalnav-link-apple,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-menu-open .globalnav-link-apple,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-submenu-open .globalnav-link-apple,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-flyout-open #globalnav-menubutton-link-search,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-menu-open #globalnav-menubutton-link-search,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-submenu-open #globalnav-menubutton-link-search,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-flyout-open #globalnav-menubutton-link-bag,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-menu-open #globalnav-menubutton-link-bag,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-submenu-open #globalnav-menubutton-link-bag,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-flyout-open #globalnav-menubutton-link-account,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-menu-open #globalnav-menubutton-link-account,
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav.globalnav-with-submenu-open #globalnav-menubutton-link-account {
        transition: opacity 240ms cubic-bezier(.4,0,.6,1) 0ms,
                    visibility 240ms step-end 0ms,
                    color 240ms cubic-bezier(.4,0,.6,1) 0ms !important;
    }

    /* Trigger uses the same 240ms color cadence in every mobile state,
       including when bb-nav-front-has-scrolled is added/removed. */
    body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menutrigger-button {
        transition: opacity 240ms cubic-bezier(.4,0,.6,1) 0ms,
                    color 240ms cubic-bezier(.4,0,.6,1) 0ms !important;
        will-change: color;
    }

    body.bb-nav-front-page.bb-nav-global-only-page #globalnav .globalnav-menutrigger-bread {
        transition: stroke 240ms cubic-bezier(.4,0,.6,1) 0ms !important;
        will-change: stroke;
    }

    /* Once the page is scrolled, let the SVG use the trigger's currentColor;
       this preserves the same interpolated color instead of starting a second
       independent stroke-color path. */
    body.bb-nav-front-page.bb-nav-global-only-page.bb-nav-front-has-scrolled #globalnav .globalnav-menutrigger-bread {
        stroke: currentColor !important;
    }
}

/* Desktop GlobalNav paint ownership.
   .globalnav-content is intentionally capped at 1024px for link layout. It
   must never paint a flyout/header surface on desktop, otherwise transparent
   pages reveal a centered rectangular background when a link is hovered. The
   full-width #globalnav/.globalnav-submenu pair owns that surface instead. */
@media (min-width:834px) {
    body #globalnav.globalnav-with-flyout-open .globalnav-content,
    body #globalnav.globalnav-with-menu-open .globalnav-content,
    body #globalnav.globalnav-with-submenu-open .globalnav-content,
    body #globalnav.globalnav-with-flyout-closing .globalnav-content {
        background: transparent !important;
        background-color: transparent !important;
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }

    /* The core removes .globalnav-item-flyout-open at close start. Preserve
       only that outgoing plane's visibility until its native height/content
       outro has completed; no other submenu becomes visible and layout is
       unchanged. */
    body #globalnav.globalnav-with-flyout-closing .globalnav-item.globalnav-item-flyout-closing .globalnav-submenu {
        visibility: visible !important;
    }
}

/* Mobile homepage/frontpage: preserve the exact current document scroll position
   while native GlobalNav is open. The existing globalnav-integrations.js
   controller already snapshots scrollY and restores it; these rules prevent
   iPhone Safari's native html/body overflow lock from first jumping the page. */
@media (max-width:833px) {
    html.globalnav-noscroll:has(body.bb-nav-front-page),
    html.globalnav-noscroll.globalnav-noscroll-y:has(body.bb-nav-front-page),
    html.globalnav-noscroll.globalnav-noscroll-long:has(body.bb-nav-front-page),
    html.globalnav-noscroll.globalnav-noscroll-long.globalnav-noscroll-y:has(body.bb-nav-front-page),
    html.bb-globalnav-scrollbar-lock:has(body.bb-nav-front-page) {
        overflow-y: scroll !important;
        height: auto !important;
        position: static !important;
        padding-inline-end: 0 !important;
        scrollbar-gutter: auto !important;
    }

    html.globalnav-noscroll:has(body.bb-nav-front-page) body,
    html.globalnav-noscroll.globalnav-noscroll-y:has(body.bb-nav-front-page) body,
    html.globalnav-noscroll.globalnav-noscroll-long:has(body.bb-nav-front-page) body,
    html.globalnav-noscroll.globalnav-noscroll-long.globalnav-noscroll-y:has(body.bb-nav-front-page) body,
    html.bb-globalnav-scrollbar-lock:has(body.bb-nav-front-page) body {
        overflow: visible !important;
        height: auto !important;
        position: static !important;
    }
}

/* =========================================================
   HOMEPAGE MOBILE @ TOP: FOREGROUND CONTINUITY DURING SUBMENU HANDOFF
   The homepage body flyout helper can briefly swap during native compact
   menu <-> submenu transitions. Do not let that transient body state return
   the foreground to the green-header white values while the flyout itself is
   still open. This changes foreground variables only; background/surface
   ownership and all native forward/back motion remain untouched.
   ========================================================= */
@media (max-width:833px) {
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav:is(.globalnav-with-flyout-open,.globalnav-with-menu-open,.globalnav-with-submenu-open),
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav:has(.globalnav-item-flyout-open,.globalnav-item-flyout-change-previous,.globalnav-item-flyout-change-next) {
        --r-globalnav-color: rgb(0 0 0 / 80%) !important;
        --r-globalnav-color-secondary: #333336 !important;
        --r-globalnav-color-hover: #000 !important;
    }

    body.theme-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav:is(.globalnav-with-flyout-open,.globalnav-with-menu-open,.globalnav-with-submenu-open),
    body.globalheader-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav:is(.globalnav-with-flyout-open,.globalnav-with-menu-open,.globalnav-with-submenu-open),
    body[data-hecu-resolved="dark"].bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav:is(.globalnav-with-flyout-open,.globalnav-with-menu-open,.globalnav-with-submenu-open),
    html[data-hecu-resolved="dark"] body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav:is(.globalnav-with-flyout-open,.globalnav-with-menu-open,.globalnav-with-submenu-open),
    html.theme-dark body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav:is(.globalnav-with-flyout-open,.globalnav-with-menu-open,.globalnav-with-submenu-open),
    body.theme-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav:has(.globalnav-item-flyout-open,.globalnav-item-flyout-change-previous,.globalnav-item-flyout-change-next),
    body.globalheader-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav:has(.globalnav-item-flyout-open,.globalnav-item-flyout-change-previous,.globalnav-item-flyout-change-next),
    body[data-hecu-resolved="dark"].bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav:has(.globalnav-item-flyout-open,.globalnav-item-flyout-change-previous,.globalnav-item-flyout-change-next),
    html[data-hecu-resolved="dark"] body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav:has(.globalnav-item-flyout-open,.globalnav-item-flyout-change-previous,.globalnav-item-flyout-change-next),
    html.theme-dark body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav:has(.globalnav-item-flyout-open,.globalnav-item-flyout-change-previous,.globalnav-item-flyout-change-next),
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav.globalnav-dark:has(.globalnav-item-flyout-open,.globalnav-item-flyout-change-previous,.globalnav-item-flyout-change-next),
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav.globalheader-dark:has(.globalnav-item-flyout-open,.globalnav-item-flyout-change-previous,.globalnav-item-flyout-change-next) {
        --r-globalnav-color: rgb(255 255 255 / 80%) !important;
        --r-globalnav-color-secondary: #e8e8ed !important;
        --r-globalnav-color-hover: #fff !important;
    }
}
/* Desktop homepage handoff continuity: preserve the open flyout surface and
   foreground during native menu-to-menu change states. Mobile is intentionally
   excluded so its established no-flicker state machine remains untouched. */
@media (min-width:834px) {
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav.globalnav-with-flyout-open.globalnav-with-flyout-closing:has(.globalnav-item-flyout-change-previous, .globalnav-item-flyout-change-next) {
        --bb-front-desktop-surface: var(--bb-front-flyout-surface);
        --bb-nav-surface-color: var(--bb-front-flyout-surface) !important;
        --globalnav-background: var(--bb-front-flyout-surface) !important;
    }

    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav.globalnav-with-flyout-open.globalnav-with-flyout-closing:has(.globalnav-item-flyout-change-previous, .globalnav-item-flyout-change-next):not(.globalnav-dark):not(.globalheader-dark) {
        --r-globalnav-color: rgb(0 0 0 / 80%) !important;
        --r-globalnav-color-secondary: #333336 !important;
        --r-globalnav-color-hover: #000 !important;
    }

    body.theme-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav.globalnav-with-flyout-open.globalnav-with-flyout-closing:has(.globalnav-item-flyout-change-previous, .globalnav-item-flyout-change-next),
    body.globalheader-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav.globalnav-with-flyout-open.globalnav-with-flyout-closing:has(.globalnav-item-flyout-change-previous, .globalnav-item-flyout-change-next),
    body[data-hecu-resolved="dark"].bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav.globalnav-with-flyout-open.globalnav-with-flyout-closing:has(.globalnav-item-flyout-change-previous, .globalnav-item-flyout-change-next),
    html[data-hecu-resolved="dark"] body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav.globalnav-with-flyout-open.globalnav-with-flyout-closing:has(.globalnav-item-flyout-change-previous, .globalnav-item-flyout-change-next),
    html.theme-dark body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav.globalnav-with-flyout-open.globalnav-with-flyout-closing:has(.globalnav-item-flyout-change-previous, .globalnav-item-flyout-change-next),
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav.globalnav-dark.globalnav-with-flyout-open.globalnav-with-flyout-closing:has(.globalnav-item-flyout-change-previous, .globalnav-item-flyout-change-next),
    body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled)
    #globalnav.globalheader-dark.globalnav-with-flyout-open.globalnav-with-flyout-closing:has(.globalnav-item-flyout-change-previous, .globalnav-item-flyout-change-next) {
        --bb-front-desktop-surface: #161617;
        --bb-nav-surface-color: #161617 !important;
        --globalnav-background: #161617 !important;
        --r-globalnav-color: rgb(255 255 255 / 80%) !important;
        --r-globalnav-color-secondary: #e8e8ed !important;
        --r-globalnav-color-hover: #fff !important;
    }
}


/* Armed by the homepage scroll script only; flyout states keep native timing. */
@media (min-width:834px) and (prefers-reduced-motion:no-preference) {
    body.bb-nav-front-page.bb-nav-global-only-page.bb-nav-front-desktop-scroll-transition:not(.bb-nav-front-flyout-active):not(.bb-nav-front-flyout-closing)
    #globalnav:not(.globalnav-animating):not(.globalnav-block-transitions):not(.globalnav-with-flyout-open):not(.globalnav-with-flyout-closing):not(.globalnav-with-menu-open):not(.globalnav-with-submenu-open):not(:has(.globalnav-item-flyout-open, .globalnav-item-flyout-change-previous, .globalnav-item-flyout-change-next, [aria-expanded="true"])) {
        transition: background-color 480ms cubic-bezier(.4,0,.6,1) 0ms !important;
    }
}


#globalnav .globalnav-link-apple:focus-visible,
#globalnav .globalnav-submenu-trigger-button:focus-visible,
#globalnav .globalnav-menutrigger-button:focus-visible,
#globalnav .globalnav-menuback-button:focus-visible {
    outline: 2px solid var(--sk-focus-color, #0071e3);
    outline-offset: -7px;
}
#globalnav .globalnav-link-apple:focus:not(:focus-visible),
#globalnav .globalnav-submenu-trigger-button:focus:not(:focus-visible),
#globalnav .globalnav-menutrigger-button:focus:not(:focus-visible),
#globalnav .globalnav-menuback-button:focus:not(:focus-visible) {
    outline: none;
}
#globalnav .globalnav-link-apple:focus-visible {
    overflow: visible;
}



/* Bag badge color interpolation on every header state. */
#globalnav .globalnav-bag-badge { transition:width .3s cubic-bezier(.25,.1,.3,1),opacity .24s ease,visibility .24s step-start,color .32s cubic-bezier(.4,0,.6,1); }
#globalnav .globalnav-bag-badge::before,#globalnav .globalnav-bag-badge::after,#globalnav .globalnav-bag-badge-separator { transition:background-color .32s cubic-bezier(.4,0,.6,1),transform .3s cubic-bezier(.25,.1,.3,1); }
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) .globalnav-bag-badge { --globalnav-badge-background:#1d1d1f; --globalnav-badge-text-color:#690; color:#690; }
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) .globalnav-bag-badge::before,
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) .globalnav-bag-badge::after,
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) .globalnav-bag-badge-separator { background-color:#1d1d1f; }


/* BB final utility/profile placement and badge transitions */
#globalnav .globalnav-bag.with-badge .globalnav-bag-badge {
    transition: width .3s cubic-bezier(.25,.1,.3,1), opacity .24s ease, visibility .24s step-start, color .32s cubic-bezier(.4,0,.6,1), background-color .32s cubic-bezier(.4,0,.6,1) !important;
}
#globalnav .globalnav-bag.with-badge .globalnav-bag-badge::before,
#globalnav .globalnav-bag.with-badge .globalnav-bag-badge::after,
#globalnav .globalnav-bag.with-badge .globalnav-bag-badge-separator {
    transition: background-color .32s cubic-bezier(.4,0,.6,1), transform .3s cubic-bezier(.25,.1,.3,1) !important;
}
#globalnav .globalnav-bag.with-badge .globalnav-bag-badge-number,
#globalnav .globalnav-bag.with-badge .globalnav-bag-badge-unit {
    transition: color .32s cubic-bezier(.4,0,.6,1), opacity .24s ease !important;
}


/* BB bag state interpolation: keep icon + badge synchronized through scroll/flyout state changes. */
#globalnav #globalnav-menubutton-link-bag {
    transition: color .32s cubic-bezier(.4,0,.6,1);
}
#globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge {
    color: var(--globalnav-badge-text-color);
    transition: width .3s cubic-bezier(.25,.1,.3,1), opacity .24s ease, visibility .24s step-start, color .32s cubic-bezier(.4,0,.6,1), background-color .32s cubic-bezier(.4,0,.6,1) !important;
}
#globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge::before,
#globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge::after,
#globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge-separator {
    background-color: var(--globalnav-badge-background);
    transition: background-color .32s cubic-bezier(.4,0,.6,1), transform .3s cubic-bezier(.25,.1,.3,1) !important;
}
#globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge-number,
#globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge-unit {
    color: var(--globalnav-badge-text-color);
    transition: color .32s cubic-bezier(.4,0,.6,1), opacity .24s ease !important;
}
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge {
    --globalnav-badge-background:#1d1d1f;
    --globalnav-badge-text-color:#690;
}


/* BB final frontpage bag badge states: top = white/#690, scrolled = black/white. */
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge {
    --globalnav-badge-background:#fff;
    --globalnav-badge-text-color:#690;
    color:#690;
}
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge::before,
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge::after,
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge-separator {
    background-color:#fff;
}
body.bb-nav-front-page.bb-nav-global-only-page.bb-nav-front-has-scrolled #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge {
    --globalnav-badge-background:#1d1d1f;
    --globalnav-badge-text-color:#fff;
    color:#fff;
}
body.bb-nav-front-page.bb-nav-global-only-page.bb-nav-front-has-scrolled #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge::before,
body.bb-nav-front-page.bb-nav-global-only-page.bb-nav-front-has-scrolled #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge::after,
body.bb-nav-front-page.bb-nav-global-only-page.bb-nav-front-has-scrolled #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge-separator {
    background-color:#1d1d1f;
}

/* Account utility uses the same top-level GlobalNav geometry as Search/Bag. */
#globalnav #globalnav-account .globalnav-account-wrapper{
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
}
#globalnav #globalnav-account.authenticated .globalnav-link-account{
    color:var(--r-globalnav-color);
    text-decoration:none;
}
#globalnav #globalnav-account.authenticated .globalnav-link-account:hover,
#globalnav #globalnav-account.authenticated .globalnav-link-account:focus-visible{color:var(--r-globalnav-color-hover)}
#globalnav #globalnav-account.authenticated .bb-globalnav-account-image{
    display:flex;
    align-items:center;
    justify-content:center;
    width:20px;
    height:20px;
    flex:0 0 20px;
}
#globalnav #globalnav-account.authenticated .bb-globalnav-user-avatar{
    display:block;
    width:20px;
    height:20px;
    object-fit:cover;
    border-radius:50%;
}
#globalnav #globalnav-account.authenticated .bb-globalnav-user-fallback{
    display:block;
    width:18px;
    height:18px;
    fill:currentColor;
    color:currentColor;
}
#globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button{
    width:auto;
    min-width:0;
    height:44px;
    padding-inline:8px;
    padding-block:0;
    color:var(--r-globalnav-color);
    text-decoration:none;
    white-space:nowrap;
}
#globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-pill{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    box-sizing:border-box;
    min-width:30px;
    padding:5px 10px;
    border:0;
    border-radius:980px;
    background:#0071e3;
    color:#fff;
    font-family:"BB Text",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
    font-size:14px;
    font-weight:400;
    letter-spacing:-.016em;
    transition:background-color .32s cubic-bezier(.4,0,.6,1),
               color .32s cubic-bezier(.4,0,.6,1),
               opacity .32s cubic-bezier(.4,0,.6,1);
}
#globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:hover .bb-globalnav-signin-pill,
#globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:focus-visible .bb-globalnav-signin-pill{
    background:#0077ed;
    color:#fff;
}
#globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:active .bb-globalnav-signin-pill{
    background:#006edb;
}
body.bb-nav-front-page:not(.bb-nav-front-has-scrolled) #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-pill,
body.bb-nav-tt-page:not(.bb-nav-has-scrolled) #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-pill{
    background:#fff;
    color:rgba(85,119,0,.8);
}
body.bb-nav-front-page:not(.bb-nav-front-has-scrolled) #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:hover .bb-globalnav-signin-pill,
body.bb-nav-front-page:not(.bb-nav-front-has-scrolled) #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:focus-visible .bb-globalnav-signin-pill,
body.bb-nav-tt-page:not(.bb-nav-has-scrolled) #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:hover .bb-globalnav-signin-pill,
body.bb-nav-tt-page:not(.bb-nav-has-scrolled) #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:focus-visible .bb-globalnav-signin-pill{
    background:#fff;
    color:#557700;
}

/* Scrolled Sign in hover uses the brighter requested blue. */
body.bb-nav-front-page.bb-nav-front-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:hover .bb-globalnav-signin-pill,
body.bb-nav-front-page.bb-nav-front-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:focus-visible .bb-globalnav-signin-pill,
body.bb-nav-tt-page.bb-nav-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:hover .bb-globalnav-signin-pill,
body.bb-nav-tt-page.bb-nav-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:focus-visible .bb-globalnav-signin-pill{
    background:#08f;
    color:#fff;
}

/* Dark scrolled header: #08f resting, #09f hover/focus. */
body.theme-dark.bb-nav-front-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-pill,
html.theme-dark body.bb-nav-front-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-pill,
body[data-bb-nav-theme="dark"].bb-nav-front-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-pill,
body.theme-dark.bb-nav-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-pill,
html.theme-dark body.bb-nav-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-pill,
body[data-bb-nav-theme="dark"].bb-nav-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-pill{
    background:#08f;
    color:#fff;
}
body.theme-dark.bb-nav-front-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:hover .bb-globalnav-signin-pill,
body.theme-dark.bb-nav-front-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:focus-visible .bb-globalnav-signin-pill,
html.theme-dark body.bb-nav-front-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:hover .bb-globalnav-signin-pill,
html.theme-dark body.bb-nav-front-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:focus-visible .bb-globalnav-signin-pill,
body[data-bb-nav-theme="dark"].bb-nav-front-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:hover .bb-globalnav-signin-pill,
body[data-bb-nav-theme="dark"].bb-nav-front-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:focus-visible .bb-globalnav-signin-pill,
body.theme-dark.bb-nav-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:hover .bb-globalnav-signin-pill,
body.theme-dark.bb-nav-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:focus-visible .bb-globalnav-signin-pill,
html.theme-dark body.bb-nav-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:hover .bb-globalnav-signin-pill,
html.theme-dark body.bb-nav-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:focus-visible .bb-globalnav-signin-pill,
body[data-bb-nav-theme="dark"].bb-nav-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:hover .bb-globalnav-signin-pill,
body[data-bb-nav-theme="dark"].bb-nav-has-scrolled #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:focus-visible .bb-globalnav-signin-pill{
    background:#09f;
    color:#fff;
}
@media (max-width:833px){
    #globalnav #globalnav-account .globalnav-account-wrapper{
        height:48px;
    }
    #globalnav #globalnav-account.authenticated .bb-globalnav-account-image{
        width:22px;
        height:22px;
        flex-basis:22px;
    }
    #globalnav #globalnav-account.authenticated .bb-globalnav-user-avatar{width:22px;height:22px}
    #globalnav #globalnav-account.authenticated .bb-globalnav-user-fallback{width:18px;height:18px}
    #globalnav #globalnav-account.unauthenticated{
        width:auto;
        flex:0 0 auto;
    }
    #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button{
        width:auto;
        min-width:max-content;
        height:48px;
        margin:0;
        padding-inline:8px;
    }
}

/* The original /account/ menu entry remains intact for the hamburger menu. Desktop hides only its trigger row. */
@media (min-width:834px){
    #globalnav .globalnav-menu-list > .globalnav-item-bb-account{
        position:absolute;
        width:1px;
        height:1px;
        margin:0;
        padding:0;
        overflow:visible;
        white-space:nowrap;
    }
    #globalnav .globalnav-menu-list > .globalnav-item-bb-account > .globalnav-submenu-trigger-group{
        width:1px;
        height:1px;
        overflow:hidden;
    }
    #globalnav .globalnav-menu-list > .globalnav-item-bb-account > .globalnav-flyout{clip-path:none;overflow:initial}
}

@media (max-width:833px){
    #globalnav .globalnav-menu-list > .globalnav-item-bb-account{position:static;width:auto;height:auto;overflow:visible;white-space:normal}
    #globalnav .globalnav-menu-list > .globalnav-item-bb-account > .globalnav-submenu-trigger-group{width:auto;height:auto;overflow:visible}
}

/* The top-level Account flyout deliberately reuses native GlobalNav flyout/submenu classes and animations. */
#globalnav #globalnav-account .bb-globalnav-account-flyout .globalnav-flyout-content{box-sizing:border-box}

/* Final frontpage Bag badge timing and resolved light/dark theme state. */
body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge {
    transition: width .3s cubic-bezier(.25,.1,.3,1),
                opacity .24s ease,
                visibility .24s step-start,
                color var(--bb-front-nav-foreground-duration,.32s) var(--bb-front-nav-transition-easing,cubic-bezier(.4,0,.6,1)) 0ms,
                background-color var(--bb-front-nav-foreground-duration,.32s) var(--bb-front-nav-transition-easing,cubic-bezier(.4,0,.6,1)) 0ms !important;
}
body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge::before,
body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge::after,
body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge-separator {
    transition: background-color var(--bb-front-nav-foreground-duration,.32s) var(--bb-front-nav-transition-easing,cubic-bezier(.4,0,.6,1)) 0ms,
                transform .3s cubic-bezier(.25,.1,.3,1) !important;
}
body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge-number,
body.bb-nav-front-page.bb-nav-global-only-page #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge-unit {
    transition: color var(--bb-front-nav-foreground-duration,.32s) var(--bb-front-nav-transition-easing,cubic-bezier(.4,0,.6,1)) 0ms,
                opacity .24s ease !important;
}

body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge,
body.theme-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge,
body.globalheader-dark.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge,
html.theme-dark body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge,
html[data-hecu-resolved="dark"] body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge {
    --globalnav-badge-background:#fff;
    --globalnav-badge-text-color:#690;
    color:#690;
}
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge::before,
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge::after,
body.bb-nav-front-page.bb-nav-global-only-page:not(.bb-nav-front-has-scrolled):not(.bb-nav-front-flyout-active) #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge-separator {
    background-color:#fff;
}

/* Scrolled/flyout Bag badge follows the same resolved GlobalNav theme as the
   Bag icon. Foreground/badge timing is native 320ms; only the header surface
   keeps the independent 480ms scroll transition. */
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) #globalnav:not(.globalnav-dark):not(.globalheader-dark) #globalnav-menubutton-link-bag .globalnav-bag-badge,
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) #globalnav.globalnav-light #globalnav-menubutton-link-bag .globalnav-bag-badge,
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) #globalnav.globalheader-light #globalnav-menubutton-link-bag .globalnav-bag-badge {
    --globalnav-badge-background:#1d1d1f;
    --globalnav-badge-text-color:#fff;
    color:#fff;
}
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) #globalnav:not(.globalnav-dark):not(.globalheader-dark) #globalnav-menubutton-link-bag .globalnav-bag-badge::before,
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) #globalnav:not(.globalnav-dark):not(.globalheader-dark) #globalnav-menubutton-link-bag .globalnav-bag-badge::after,
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) #globalnav:not(.globalnav-dark):not(.globalheader-dark) #globalnav-menubutton-link-bag .globalnav-bag-badge-separator,
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) #globalnav.globalnav-light #globalnav-menubutton-link-bag .globalnav-bag-badge::before,
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) #globalnav.globalnav-light #globalnav-menubutton-link-bag .globalnav-bag-badge::after,
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) #globalnav.globalnav-light #globalnav-menubutton-link-bag .globalnav-bag-badge-separator,
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) #globalnav.globalheader-light #globalnav-menubutton-link-bag .globalnav-bag-badge::before,
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) #globalnav.globalheader-light #globalnav-menubutton-link-bag .globalnav-bag-badge::after,
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) #globalnav.globalheader-light #globalnav-menubutton-link-bag .globalnav-bag-badge-separator {
    background-color:#1d1d1f;
}

body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) #globalnav.globalnav-dark #globalnav-menubutton-link-bag .globalnav-bag-badge,
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) #globalnav.globalheader-dark #globalnav-menubutton-link-bag .globalnav-bag-badge,
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) .globalheader-dark #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge {
    --globalnav-badge-background:#fff;
    --globalnav-badge-text-color:#1d1d1f;
    color:#1d1d1f;
}
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) #globalnav.globalnav-dark #globalnav-menubutton-link-bag .globalnav-bag-badge::before,
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) #globalnav.globalnav-dark #globalnav-menubutton-link-bag .globalnav-bag-badge::after,
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) #globalnav.globalnav-dark #globalnav-menubutton-link-bag .globalnav-bag-badge-separator,
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) #globalnav.globalheader-dark #globalnav-menubutton-link-bag .globalnav-bag-badge::before,
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) #globalnav.globalheader-dark #globalnav-menubutton-link-bag .globalnav-bag-badge::after,
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) #globalnav.globalheader-dark #globalnav-menubutton-link-bag .globalnav-bag-badge-separator,
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) .globalheader-dark #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge::before,
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) .globalheader-dark #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge::after,
body.bb-nav-front-page.bb-nav-global-only-page:is(.bb-nav-front-has-scrolled,.bb-nav-front-flyout-active) .globalheader-dark #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge-separator {
    background-color:#fff;
}


/* Account Options surface sits behind both headers. Keep GlobalNav/LocalNav chrome transparent while it is active. */
body.bb-account-options-surface-open #globalheader,
body.bb-account-options-surface-closing #globalheader,
body.bb-account-options-surface-open #globalnav,
body.bb-account-options-surface-closing #globalnav,
body.bb-account-options-surface-open #globalnav .globalnav-content,
body.bb-account-options-surface-closing #globalnav .globalnav-content{
    background:transparent !important;
    background-color:transparent !important;
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
}

/* Keep the exact supplied bag SVG geometry; sizing is CSS-only so the SVG viewBox/path remain untouched. */
#globalnav #globalnav-bag .globalnav-image-regular svg{display:block;width:14px;height:48px}
#globalnav #globalnav-bag .globalnav-image-compact svg{display:block;width:17px;height:48px}




/* Profile/avatar loading indicator. Uses current nav foreground so color follows the header state. */
.bb-avatar-loader{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:var(--bb-avatar-size,20px);
    height:var(--bb-avatar-size,20px);
    flex:0 0 var(--bb-avatar-size,20px);
    vertical-align:middle;
}
.loadingSpinner{
    position:absolute;
    inset:50% auto auto 50%;
    width:16px;
    height:16px;
    margin:0;
    display:flex;
    align-items:center;
    justify-content:center;
    transform:translate(-50%,-50%);
    opacity:1;
    visibility:visible;
    color:inherit;
    transition:opacity .18s cubic-bezier(.4,0,.6,1),visibility .18s step-start,color .32s cubic-bezier(.4,0,.6,1);
}
.loadingSpinnerContainer{
    position:relative;
    width:16px;
    height:16px;
}
.loadingSpinnerBar{
    position:absolute;
    width:5px;
    height:2px;
    top:7px;
    left:7px;
    transform-origin:1px 1px;
    transform:rotate(calc(var(--i) * 45deg)) translateX(4px);
}
.loadingSpinnerBar:before{
    content:"";
    display:block;
    width:100%;
    height:100%;
    background:currentColor;
    border-radius:25% / 50%;
    animation:loadingSpinnerFade .8s linear infinite;
    animation-delay:calc(var(--i) * .1s - .8s);
    transition:background-color .32s cubic-bezier(.4,0,.6,1);
}
@keyframes loadingSpinnerFade{
    0%,1%,100%{opacity:.55}
    95%{opacity:.08}
}
.loadingSpinnerText{
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip-path:inset(50%);
}
.bb-avatar-loader>img{
    position:absolute;
    inset:0;
    width:100% !important;
    height:100% !important;
    object-fit:cover;
    opacity:0;
    visibility:hidden;
    transition:opacity .18s cubic-bezier(.4,0,.6,1),visibility .18s step-end;
}
.bb-avatar-loader.bb-avatar-loaded>img{
    opacity:1;
    visibility:visible;
    transition:opacity .18s cubic-bezier(.4,0,.6,1),visibility .18s step-start;
}
.bb-avatar-loader.bb-avatar-loaded>.loadingSpinner,
.bb-avatar-loader.bb-avatar-error>.loadingSpinner{
    opacity:0;
    visibility:hidden;
    transition:opacity .18s cubic-bezier(.4,0,.6,1),visibility .18s step-end,color .32s cubic-bezier(.4,0,.6,1);
}
#globalnav .bb-avatar-loader{
    color:var(--r-globalnav-color,#000);
    transition:color var(--bb-front-nav-transition-duration,320ms) var(--bb-front-nav-transition-easing,cubic-bezier(.4,0,.6,1)) 0ms;
}
#globalnav .loadingSpinnerBar:before{
    transition:background-color var(--bb-front-nav-transition-duration,320ms) var(--bb-front-nav-transition-easing,cubic-bezier(.4,0,.6,1)) 0ms;
}
#ac-localnav .bb-avatar-loader{
    color:var(--r-localnav-menu-link-color,#1d1d1f);
    transition:color .24s cubic-bezier(.28,.11,.32,1);
}
#ac-localnav .loadingSpinnerBar:before{
    transition:background-color .24s cubic-bezier(.28,.11,.32,1);
}
@media (prefers-reduced-motion:reduce){
    .loadingSpinnerBar:before{animation-duration:.01ms}
    .loadingSpinner,.bb-avatar-loader>img,#globalnav .bb-avatar-loader,#globalnav .loadingSpinnerBar:before,#ac-localnav .bb-avatar-loader,#ac-localnav .loadingSpinnerBar:before{transition-duration:.01ms;transition-delay:0ms}
}
@media (max-width:833px){
    #globalnav #globalnav-account.authenticated .bb-globalnav-account-image>.bb-avatar-loader{
        width:22px;
        height:22px;
        flex-basis:22px;
    }
}


/* Profile flyout: reference-header menu icons and native submenu motion. */
#globalnav #globalnav-account .bb-globalnav-account-flyout .globalnav-submenu-link {
    display:inline-flex;
    align-items:center;
    gap:10px;
}
#globalnav #globalnav-account .bb-globalnav-account-flyout .bb-user-icon {
    display:block;
    width:18px;
    height:18px;
    min-width:18px;
    flex:0 0 18px;
}
#globalnav #globalnav-account .bb-globalnav-account-flyout .globalnav-submenu-list-item-elevated .globalnav-submenu-link {
    display:inline-block;
}

/* Profile flyout uses the same Apple GlobalNav item animation on every open.
   The explicit account selectors protect the dynamically cloned flyout from
   page/theme integration rules without changing any other submenu motion. */
#globalnav #globalnav-account .bb-globalnav-account-flyout .globalnav-flyout-item{
    opacity:0;
    transform:translateY(-4px);
    transition:opacity .32s cubic-bezier(.4,0,.6,1) calc(var(--r-globalnav-flyout-item-number,0) * 20ms + (var(--r-globalnav-flyout-group-number,0) + 1) * 80ms),
               transform .32s cubic-bezier(.4,0,.6,1) calc(var(--r-globalnav-flyout-item-number,0) * 20ms + (var(--r-globalnav-flyout-group-number,0) + 1) * 80ms);
}
#globalnav #globalnav-account.globalnav-item-flyout-open .bb-globalnav-account-flyout .globalnav-flyout-item{
    opacity:1;
    transform:translateY(0);
}
#globalnav.globalnav-with-flyout-closing #globalnav-account.globalnav-item-flyout-closing .bb-globalnav-account-flyout .globalnav-flyout-item{
    opacity:0;
    transform:translateY(-4px);
    transition-delay:0s;
    transition-duration:min(.16s + calc(var(--r-globalnav-flyout-item-total,1) - var(--r-globalnav-flyout-item-number,0)) * 20ms,.24s);
}

@media (max-width:833px){
    #globalnav #globalnav-account .bb-globalnav-account-flyout .globalnav-flyout-item{
        transform:translateY(-8px);
    }
    #globalnav #globalnav-account.globalnav-item-flyout-open .bb-globalnav-account-flyout .globalnav-flyout-item{
        transform:translateY(0);
    }
    #globalnav.globalnav-with-flyout-closing #globalnav-account.globalnav-item-flyout-closing > .bb-globalnav-account-flyout{
        display:block;
        visibility:visible;
        opacity:1;
        height:100dvh;
        overflow:hidden;
        pointer-events:none;
    }
    #globalnav.globalnav-with-flyout-closing #globalnav-account.globalnav-item-flyout-closing .bb-globalnav-account-flyout .globalnav-flyout-item{
        opacity:0;
        transform:translateY(-8px);
        transition-delay:0s;
        transition-duration:min(.16s + calc(var(--r-globalnav-flyout-item-total,1) - var(--r-globalnav-flyout-item-number,0)) * 20ms,.24s);
    }
}

/* Desktop Search: remove mouse-hover/browser chrome, restore keyboard focus. */
@media (min-width:834px){
    #globalnav .globalnav-searchfield-input,
    #globalnav .globalnav-searchfield-input:hover,
    #globalnav .globalnav-searchfield-input:active{
        border:0;
        box-shadow:none;
        -webkit-appearance:none;
        appearance:none;
    }
    #globalnav .globalnav-searchfield-input:focus,
    #globalnav .globalnav-searchfield-input:hover:not([data-focus-method="key"]){outline:none}
    #globalnav .globalnav-searchfield-input[data-focus-method="key"]{
        --sk-focus-offset:-7px;
        outline:2px solid var(--sk-focus-color,#0071e3);
        outline-offset:var(--sk-focus-offset,-7px);
        box-shadow:none;
        border-radius:0;
    }
}

/* Search, Bag and Profile top utilities share the same keyboard focus ring. */
#globalnav #globalnav-menubutton-link-search:focus-visible,
#globalnav #globalnav-menubutton-link-bag:focus-visible,
#globalnav #globalnav-menubutton-link-account:focus-visible{
    --sk-focus-offset:-7px;
    outline:2px solid var(--sk-focus-color,#0071e3);
    outline-offset:var(--sk-focus-offset,-7px);
    box-shadow:none;
    border-radius:0;
}
#globalnav #globalnav-menubutton-link-search[data-focus-method="mouse"],
#globalnav #globalnav-menubutton-link-search[data-focus-method="touch"],
#globalnav #globalnav-menubutton-link-bag[data-focus-method="mouse"],
#globalnav #globalnav-menubutton-link-bag[data-focus-method="touch"],
#globalnav #globalnav-menubutton-link-account[data-focus-method="mouse"],
#globalnav #globalnav-menubutton-link-account[data-focus-method="touch"]{
    outline:none;
    box-shadow:none;
}
#globalnav-bag .ac-bag-flyout-container .ac-gn-bagview-button:focus-visible{
    --sk-focus-offset:-7px;
    outline:2px solid var(--sk-focus-color,#0071e3);
    outline-offset:var(--sk-focus-offset,-7px);
    box-shadow:none;
}


/* Sign in follows the same foreground as the other desktop nav items while a flyout owns the top surface. */
@media (min-width:834px){
    body.bb-nav-front-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-open #globalnav-account.unauthenticated .bb-globalnav-signin-pill,
    body.bb-nav-tt-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-flyout-open #globalnav-account.unauthenticated .bb-globalnav-signin-pill{
        background:transparent;
        color:var(--r-globalnav-color);
    }
    body.bb-nav-front-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-open #globalnav-account.unauthenticated .bb-globalnav-signin-button:hover .bb-globalnav-signin-pill,
    body.bb-nav-front-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-open #globalnav-account.unauthenticated .bb-globalnav-signin-button:focus-visible .bb-globalnav-signin-pill,
    body.bb-nav-tt-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-flyout-open #globalnav-account.unauthenticated .bb-globalnav-signin-button:hover .bb-globalnav-signin-pill,
    body.bb-nav-tt-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-flyout-open #globalnav-account.unauthenticated .bb-globalnav-signin-button:focus-visible .bb-globalnav-signin-pill{
        background:transparent;
        color:var(--r-globalnav-color-hover);
    }
}


/* Dark-mode Sign in: requested #08f resting / #09f hover. The unscrolled
   green front/TT states keep their existing white/green treatment. */
body.theme-dark:not(.bb-nav-front-page):not(.bb-nav-tt-page) #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-pill,
html.theme-dark body:not(.bb-nav-front-page):not(.bb-nav-tt-page) #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-pill,
body[data-bb-nav-theme="dark"]:not(.bb-nav-front-page):not(.bb-nav-tt-page) #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-pill,
body[data-hecu-resolved="dark"]:not(.bb-nav-front-page):not(.bb-nav-tt-page) #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-pill{
    background:#08f;
    color:#fff;
}
body.theme-dark:not(.bb-nav-front-page):not(.bb-nav-tt-page) #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:hover .bb-globalnav-signin-pill,
body.theme-dark:not(.bb-nav-front-page):not(.bb-nav-tt-page) #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:focus-visible .bb-globalnav-signin-pill,
html.theme-dark body:not(.bb-nav-front-page):not(.bb-nav-tt-page) #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:hover .bb-globalnav-signin-pill,
html.theme-dark body:not(.bb-nav-front-page):not(.bb-nav-tt-page) #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:focus-visible .bb-globalnav-signin-pill,
body[data-bb-nav-theme="dark"]:not(.bb-nav-front-page):not(.bb-nav-tt-page) #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:hover .bb-globalnav-signin-pill,
body[data-bb-nav-theme="dark"]:not(.bb-nav-front-page):not(.bb-nav-tt-page) #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:focus-visible .bb-globalnav-signin-pill,
body[data-hecu-resolved="dark"]:not(.bb-nav-front-page):not(.bb-nav-tt-page) #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:hover .bb-globalnav-signin-pill,
body[data-hecu-resolved="dark"]:not(.bb-nav-front-page):not(.bb-nav-tt-page) #globalnav #globalnav-account.unauthenticated .bb-globalnav-signin-button:focus-visible .bb-globalnav-signin-pill{
    background:#09f;
    color:#fff;
}


/* Mobile Account visibility is intentionally owned by the native GlobalNav
   .globalnav-link lifecycle, exactly like Logo/Search/Bag. */

/* Re-arm the native desktop submenu entrance on every hover-to-hover handoff.
   This matches the stable reference build: reset the incoming submenu while it
   is the next flyout, then let the native open state replay its stagger. */
@media (min-width:834px){
    #globalnav .globalnav-item-flyout-change-next .globalnav-submenu .globalnav-submenu-header,
    #globalnav .globalnav-item-flyout-change-next .globalnav-submenu .globalnav-submenu-list-item,
    #globalnav .globalnav-item-flyout-change-next .globalnav-submenu .globalnav-submenu-list-item-elevated{
        opacity:0;
        transform:translateY(-4px);
        transition:none;
    }
}


/* Final desktop Bag foreground synchronization. Badge colors use exactly the
   same 320ms GlobalNav foreground clock as the Bag icon/nav links. */
@media (min-width:834px){
  #globalnav #globalnav-menubutton-link-bag{
    transition:color .32s cubic-bezier(.4,0,.6,1) 0ms !important;
  }
  #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge{
    transition:width .3s cubic-bezier(.25,.1,.3,1),opacity .24s ease,visibility .24s step-start,color .32s cubic-bezier(.4,0,.6,1) 0ms,background-color .32s cubic-bezier(.4,0,.6,1) 0ms !important;
  }
  #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge::before,
  #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge::after,
  #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge-separator{
    transition:background-color .32s cubic-bezier(.4,0,.6,1) 0ms,transform .3s cubic-bezier(.25,.1,.3,1) !important;
  }
  #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge-number,
  #globalnav #globalnav-menubutton-link-bag .globalnav-bag-badge-unit{
    transition:color .32s cubic-bezier(.4,0,.6,1) 0ms,opacity .24s ease !important;
  }
}

/* Closing begins the Sign in foreground/pill return immediately, even while
   GlobalNav temporarily retains its flyout-open class during the outro. */
@media (min-width:834px){
  body.bb-nav-front-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-closing #globalnav-account.unauthenticated .bb-globalnav-signin-pill,
  body.bb-nav-tt-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-flyout-closing #globalnav-account.unauthenticated .bb-globalnav-signin-pill{
    background:#fff;
    color:rgba(85,119,0,.8);
    transition:background-color .32s cubic-bezier(.4,0,.6,1),color .32s cubic-bezier(.4,0,.6,1),opacity .32s cubic-bezier(.4,0,.6,1);
  }
  body.bb-nav-front-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-closing #globalnav-account.unauthenticated .bb-globalnav-signin-button:hover .bb-globalnav-signin-pill,
  body.bb-nav-front-page:not(.bb-nav-front-has-scrolled) #globalnav.globalnav-with-flyout-closing #globalnav-account.unauthenticated .bb-globalnav-signin-button:focus-visible .bb-globalnav-signin-pill,
  body.bb-nav-tt-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-flyout-closing #globalnav-account.unauthenticated .bb-globalnav-signin-button:hover .bb-globalnav-signin-pill,
  body.bb-nav-tt-page:not(.bb-nav-has-scrolled) #globalnav.globalnav-with-flyout-closing #globalnav-account.unauthenticated .bb-globalnav-signin-button:focus-visible .bb-globalnav-signin-pill{
    background:#fff;
    color:#557700;
  }
}

/* Desktop flyout top plane: Bag/Profile/Search use the same persistent GlobalNav
   link plane as ordinary menu flyouts.  Only compact/mobile GlobalNav fades the
   top utilities when a flyout owns the surface. */
@media (min-width:834px){
  #globalnav:is(.globalnav-with-flyout-open,.globalnav-with-flyout-closing) #globalnav-list,
  #globalnav:is(.globalnav-with-flyout-open,.globalnav-with-flyout-closing) .globalnav-menu,
  #globalnav:is(.globalnav-with-flyout-open,.globalnav-with-flyout-closing) .globalnav-menu-list{
    opacity:1 !important;
    visibility:visible !important;
  }
  #globalnav:is(.globalnav-with-flyout-open,.globalnav-with-flyout-closing) .globalnav-link-apple,
  #globalnav:is(.globalnav-with-flyout-open,.globalnav-with-flyout-closing) .globalnav-menu .globalnav-submenu-trigger-link,
  #globalnav:is(.globalnav-with-flyout-open,.globalnav-with-flyout-closing) #globalnav-menubutton-link-search,
  #globalnav:is(.globalnav-with-flyout-open,.globalnav-with-flyout-closing) #globalnav-menubutton-link-bag,
  #globalnav:is(.globalnav-with-flyout-open,.globalnav-with-flyout-closing) #globalnav-menubutton-link-account,
  #globalnav:is(.globalnav-with-flyout-open,.globalnav-with-flyout-closing) .globalnav-bag-wrapper{
    opacity:1 !important;
    visibility:visible !important;
  }

  /* While a desktop flyout is actually open, Sign in becomes a normal nav
     foreground treatment.  Close-only state deliberately falls through to the
     resting pill rules immediately, so its background starts returning at close. */
  #globalnav.globalnav-with-flyout-open:not(.globalnav-with-flyout-closing)
  #globalnav-account.unauthenticated .bb-globalnav-signin-pill,
  #globalnav.globalnav-with-flyout-open.globalnav-with-flyout-closing:has(.globalnav-item-flyout-change-next)
  #globalnav-account.unauthenticated .bb-globalnav-signin-pill{
    background:transparent !important;
    color:var(--r-globalnav-color) !important;
  }
  #globalnav.globalnav-with-flyout-open:not(.globalnav-with-flyout-closing)
  #globalnav-account.unauthenticated .bb-globalnav-signin-button:hover .bb-globalnav-signin-pill,
  #globalnav.globalnav-with-flyout-open:not(.globalnav-with-flyout-closing)
  #globalnav-account.unauthenticated .bb-globalnav-signin-button:focus-visible .bb-globalnav-signin-pill,
  #globalnav.globalnav-with-flyout-open.globalnav-with-flyout-closing:has(.globalnav-item-flyout-change-next)
  #globalnav-account.unauthenticated .bb-globalnav-signin-button:hover .bb-globalnav-signin-pill,
  #globalnav.globalnav-with-flyout-open.globalnav-with-flyout-closing:has(.globalnav-item-flyout-change-next)
  #globalnav-account.unauthenticated .bb-globalnav-signin-button:focus-visible .bb-globalnav-signin-pill{
    background:transparent !important;
    color:var(--r-globalnav-color-hover) !important;
  }
}



/* Desktop top-navigation plane is invariant while any flyout opens, changes or
   closes. Native flyout content/height animations remain untouched; only the
   44px trigger plane is prevented from participating in opacity/visibility
   churn caused by fixed-page/header state overrides. */
@media (min-width:834px){
  #globalnav #globalnav-list,
  #globalnav #globalnav-list>.globalnav-item-apple,
  #globalnav #globalnav-list>.globalnav-menu,
  #globalnav .globalnav-menu-list,
  #globalnav .globalnav-menu-list>.globalnav-item:not(.globalnav-item-bb-account),
  #globalnav .globalnav-search,
  #globalnav .globalnav-bag,
  #globalnav #globalnav-account,
  #globalnav .globalnav-bag-wrapper{
    opacity:1 !important;
    visibility:visible !important;
  }
  #globalnav .globalnav-link-apple,
  #globalnav .globalnav-menu-list>.globalnav-item:not(.globalnav-item-bb-account)>.globalnav-submenu-trigger-group>.globalnav-submenu-trigger-item>.globalnav-submenu-trigger-link,
  #globalnav #globalnav-menubutton-link-search,
  #globalnav #globalnav-menubutton-link-bag,
  #globalnav #globalnav-menubutton-link-account{
    opacity:1 !important;
    visibility:visible !important;
  }
  #globalnav:is(.globalnav-animating,.globalnav-with-flyout-open,.globalnav-with-flyout-closing):not(.globalnav-block-transitions) .globalnav-link-apple,
  #globalnav:is(.globalnav-animating,.globalnav-with-flyout-open,.globalnav-with-flyout-closing):not(.globalnav-block-transitions) .globalnav-menu-list>.globalnav-item:not(.globalnav-item-bb-account)>.globalnav-submenu-trigger-group>.globalnav-submenu-trigger-item>.globalnav-submenu-trigger-link,
  #globalnav:is(.globalnav-animating,.globalnav-with-flyout-open,.globalnav-with-flyout-closing):not(.globalnav-block-transitions) #globalnav-menubutton-link-search,
  #globalnav:is(.globalnav-animating,.globalnav-with-flyout-open,.globalnav-with-flyout-closing):not(.globalnav-block-transitions) #globalnav-menubutton-link-bag,
  #globalnav:is(.globalnav-animating,.globalnav-with-flyout-open,.globalnav-with-flyout-closing):not(.globalnav-block-transitions) #globalnav-menubutton-link-account{
    transition-property:color !important;
    transition-duration:.32s !important;
    transition-timing-function:cubic-bezier(.4,0,.6,1) !important;
  }

  /* Resolve flyout foreground from the stable native light/dark state so a
     fixed/front-page section watcher cannot make the links visually vanish. */
  #globalnav.globalnav-with-flyout-open:not(.globalnav-dark):not(.globalheader-dark){
    --r-globalnav-color:rgba(0,0,0,.8);
    --r-globalnav-color-secondary:#333336;
    --r-globalnav-color-hover:#000;
  }
  #globalnav.globalnav-with-flyout-open:is(.globalnav-dark,.globalheader-dark){
    --r-globalnav-color:rgba(255,255,255,.8);
    --r-globalnav-color-secondary:#e8e8ed;
    --r-globalnav-color-hover:#fff;
  }
}