.brand-switcher{height:56px;position:sticky;top:0;z-index:60;background:#153f2b;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px max(5vw,20px);font:600 13px/1.25 'DM Sans',Arial,sans-serif;box-sizing:border-box}.brand-switcher a{color:inherit;text-decoration:none}.brands-home{display:inline-flex;align-items:center;gap:9px;padding:6px 0;white-space:nowrap}.brands-home svg{width:19px;height:19px}.brand-switcher-links{display:flex;gap:4px;padding:3px;border:1px solid #ffffff40;border-radius:999px}.brand-switcher-links a{display:flex;align-items:center;justify-content:center;border-radius:999px;padding:7px 18px;min-height:30px;font-size:13px;font-weight:650}.brand-switcher-links a[aria-current]{background:#fffaf0;color:#153f2b}.brand-switcher-links a:not([aria-current]):hover{background:#ffffff19}.brand-switcher a:focus-visible{outline:3px solid #f4bf39;outline-offset:3px}.has-brand-switcher>header{top:56px}html:has(.has-brand-switcher){scroll-padding-top:170px}
/* Keep both brands in the same compact mobile header layout. */
@media(max-width:800px){
  .brand-switcher{height:64px;padding:6px 16px;gap:12px}
  .brands-home{width:40px;height:44px;flex:0 0 40px;justify-content:center;padding:0;border:1px solid #ffffff40;border-radius:14px}
  .brands-home span{display:none}
  .brand-switcher-links{flex:1;max-width:300px;gap:2px;padding:3px;min-width:0}
  .brand-switcher-links a{flex:1;min-width:0;min-height:44px;padding:8px 10px;font-size:12px;line-height:1.2;transition:background-color .2s,color .2s}
  .has-brand-switcher>.topline{display:none}
  .has-brand-switcher>header{top:64px;height:76px;padding:10px 16px;gap:12px}
  .has-brand-switcher>header .menu-toggle{display:block;flex-shrink:0;min-height:44px;padding:9px 13px;border:1px solid #ccd8c8;border-radius:999px;background:transparent;color:#275431;font:650 14px/1.3 'DM Sans',Arial,sans-serif}
  .has-brand-switcher>header #navigation{display:none;position:absolute;top:100%;left:0;right:0;width:auto;max-height:calc(100dvh - 140px);overflow-y:auto;background:#fff;padding:14px 16px 20px;border-bottom:1px solid #dce3d6;box-shadow:0 12px 20px #12300d10;gap:4px}
  .has-brand-switcher>header #navigation.open{display:flex;flex-direction:column;align-items:stretch}
  .has-brand-switcher>header #navigation a{padding:12px;font-size:15px}
  .has-brand-switcher>header .brand img{max-height:56px}
  html:has(.has-brand-switcher){scroll-padding-top:156px}
}
@media(prefers-reduced-motion:reduce){.brand-switcher-links a{transition:none}}

/* Shared geometry prevents either brand's navigation from jumping. */
.brand-switcher-links{width:264px;flex-shrink:0}
.brand-switcher-links a{flex:1;min-width:0;padding-left:10px;padding-right:10px}
@media(min-width:801px){
  .has-brand-switcher>.topline{height:38px;box-sizing:border-box;display:flex;align-items:center;justify-content:center}
  .has-brand-switcher>.topline:has(a){justify-content:space-between}
  .has-brand-switcher>header{height:98px;box-sizing:border-box}
}
@media(max-width:800px){.brand-switcher-links{width:auto;flex-shrink:1}}

/* The browser holds the old page until the new page is ready, then blends
   the two views. Ordinary links and browser Back keep working normally. */
@view-transition{navigation:auto}
.brand-switcher{view-transition-name:brand-navigation}
.brand-switcher-links a[aria-current]{view-transition-name:brand-selection}
.has-brand-switcher>header{view-transition-name:brand-header}
::view-transition-group(*){animation-duration:260ms;animation-timing-function:cubic-bezier(.22,.61,.36,1)}
::view-transition-old(root){animation:brand-fade-out 220ms ease both}
::view-transition-new(root){animation:brand-fade-in 260ms ease both}
::view-transition-old(brand-header){animation:brand-fade-out 180ms ease both}
::view-transition-new(brand-header){animation:brand-fade-in 260ms ease both}
::view-transition-group(brand-navigation){z-index:2}
::view-transition-group(brand-selection){z-index:3}
::view-transition-old(brand-navigation),::view-transition-new(brand-navigation){mix-blend-mode:normal}
@keyframes brand-fade-out{to{opacity:0}}
@keyframes brand-fade-in{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){
  @view-transition{navigation:none}
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
}
/* Move only the selected pill; keep both labels anchored in place. */
.brand-switcher-links{position:relative;gap:4px;isolation:isolate}
.brand-switcher-links::before{content:"";position:absolute;left:3px;top:3px;bottom:3px;width:calc((100% - 10px)/2);border-radius:999px;background:#fffaf0;pointer-events:none;view-transition-name:brand-selection}
.brand-switcher-links:has(a:last-child[aria-current])::before{transform:translateX(calc(100% + 4px))}
.brand-switcher-links a{position:relative;z-index:1}
.brand-switcher-links a[aria-current]{background:transparent}
.brand-switcher-links a:first-child{view-transition-name:conventional-label}
.brand-switcher-links a:last-child{view-transition-name:organic-label}
::view-transition-group(conventional-label),::view-transition-group(organic-label){z-index:4}
::view-transition-old(conventional-label),::view-transition-new(conventional-label),::view-transition-old(organic-label),::view-transition-new(organic-label){mix-blend-mode:normal}
/* A brief fade through cream avoids overlapping text from the two brands. */
::view-transition{background:#fffaf0}
::view-transition-old(root),::view-transition-old(brand-header){animation:brand-fade-out 110ms ease-out both}
::view-transition-new(root),::view-transition-new(brand-header){animation:brand-fade-in 150ms ease-in 110ms both}