.wordmark{width:max-content}
.wordmark>span{display:flex;justify-content:space-between;width:calc(100% - 5px);letter-spacing:0;white-space:nowrap}
.wordmark>span>b{font-weight:400}
.wordmark:has(.brand-logo),.storefront-home .wordmark:has(.brand-logo){position:relative;display:flex;width:162px;height:48px;min-height:44px;align-items:center;gap:8px;flex:none}
.wordmark .brand-logo{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.wordmark:has(.brand-logo)::before,.wordmark:has(.brand-logo)::after{content:"";display:block;flex:none;background-image:url('./assets/logo-gold-transparent-v1.png');background-repeat:no-repeat}
.wordmark:has(.brand-logo)::before{width:30px;height:30px;background-size:43.8px 43.8px;background-position:-6.3px -4px}
.wordmark:has(.brand-logo)::after{width:124px;height:18px;background-size:136px 136px;background-position:-5.2px -106.8px}
@media(min-width:1024px){
 .storefront-home .wordmark:has(.brand-logo){width:162px;transform:none}
 .storefront-home .desktop-nav.wrap{transform:none;padding-right:0}
 .storefront-home .site-header{column-gap:clamp(12px,1.5vw,24px)}
}
@media(max-width:600px){
 .wordmark:has(.brand-logo),.storefront-home .wordmark:has(.brand-logo){width:151px;height:44px;gap:7px}
 .wordmark:has(.brand-logo)::before{width:28px;height:28px;background-size:40.9px 40.9px;background-position:-5.9px -3.7px}
 .wordmark:has(.brand-logo)::after{width:116px;height:17px;background-size:127px 127px;background-position:-4.9px -99.7px}
}
/* The decorative screens have a fixed 320px canvas, independent of page width. */
.storefront-home .mini-header .wordmark:has(.brand-logo){width:140px;height:40px;min-height:40px;gap:6px}
.mini-header .wordmark:has(.brand-logo)::before{width:26px;height:26px;background-size:38px 38px;background-position:-5.5px -3.5px}
.mini-header .wordmark:has(.brand-logo)::after{width:108px;height:16px;background-size:118px 118px;background-position:-4.5px -92.6px}