/* Shared header/footer branding for all public pages. */
@media (max-width:820px){
  :root{--bf-header-bar:50px!important;--bf-header-bg:#080b0f}
  html::before{content:"";position:fixed;top:0;left:0;right:0;height:env(safe-area-inset-top,0px);background:var(--bf-header-bg);z-index:2147483647;pointer-events:none}
}

.site-header{
  justify-content:space-between!important;
  gap:14px!important;
}
.site-header .desktop-nav{display:none!important}
.site-header .brand{
  display:flex!important;
  align-items:center!important;
  flex:0 1 auto!important;
  min-width:0!important;
  padding:0!important;
  margin:0!important;
}
.site-header .brand-mark,
.site-header .brand-copy{display:none!important}
.site-header .brand::before{
  content:"";
  display:block;
  width:clamp(210px,31vw,390px);
  aspect-ratio:600/78;
  background:url('/media/bondgenotenfans-wordmark.webp?v=20260826-1') left center/contain no-repeat;
  filter:drop-shadow(0 5px 14px rgba(0,0,0,.38));
}
.site-header .menu-button{
  display:grid!important;
  place-items:center!important;
  margin-left:auto!important;
  flex:0 0 auto!important;
}

footer{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  gap:18px!important;
}
footer .footer-brand{
  width:min(620px,92vw)!important;
  height:auto!important;
  aspect-ratio:600/78;
  font-size:0!important;
  color:transparent!important;
  background:url('/media/bondgenotenfans-wordmark.webp?v=20260826-1') left center/contain no-repeat!important;
  filter:drop-shadow(0 8px 24px rgba(0,0,0,.4));
  position:relative!important;
  overflow:visible!important;
}
footer .footer-tagline{
  margin:0!important;
  color:#fff!important;
  font-weight:800!important;
  font-size:clamp(16px,2.6vw,22px)!important;
  line-height:1.35!important;
  max-width:720px!important;
  text-align:left!important;
}
footer p{
  margin:0!important;
  text-align:left!important;
  max-width:720px!important;
}

@media(max-width:820px){
  .site-header .brand::before{width:clamp(190px,58vw,310px)}
  .site-header .menu-button{width:36px!important;height:36px!important;padding:6px!important;border-radius:10px!important}
  footer{padding-top:34px!important;padding-bottom:38px!important}
  footer .footer-brand{width:min(520px,94vw)!important}
}
@media(max-width:420px){
  .site-header .brand::before{width:min(205px,61vw)}
  footer .footer-brand{width:100%!important}
}