/* Render two crops of the supplied logo as a horizontal lockup. The source image is unchanged. */
.brand{
  display:inline-flex;align-items:center;gap:10px;flex:none;
  padding:6px 13px 6px 9px;background:#080808;border:1px solid #242424;border-radius:9px;
}
.brand .brand-mark,.brand .brand-wordmark,.reference-hero .mini-brand,.reference-hero .hero-emblem>b{
  position:relative;display:block;overflow:hidden;flex:none;isolation:isolate;
}
.brand .brand-mark{
  width:42px;height:42px;transform:none;border:0;border-radius:0;background:none;box-shadow:none;
}
.brand .brand-wordmark{width:108px;aspect-ratio:1026/315}
.brand-mark>img,.brand-wordmark>img,.mini-brand>img,.hero-emblem>b>img{
  position:absolute;display:block;max-width:none;height:auto;aspect-ratio:1;object-fit:contain;
  filter:url(#bijoy-logo-key);pointer-events:none;
}
.brand-mark>img,.mini-brand>img,.hero-emblem>b>img{width:187.444%;left:-43.498%;top:-21.375%}
.brand-wordmark>img{width:122.222%;left:-12.086%;top:-260.317%}
.reference-hero .mini-brand,.reference-hero .hero-emblem>b{border-radius:50%;background:#0a0a0a;border:1px solid #191919}
.reference-hero .mini-brand>img,.reference-hero .hero-emblem>b>img{
  clip-path:inset(11.4% 23.45% 35.25% 23.2%);
  transform:scale(.65);transform-origin:49.8% 38.1%;
}
.reference-hero .hero-emblem>span{background:linear-gradient(90deg,transparent,#8a8a8a)}
.brand:focus-visible{outline-offset:5px}
@media(max-width:650px){
  .brand{gap:8px;padding:5px 10px 5px 7px}
  .brand .brand-mark{width:35px;height:35px}
  .brand .brand-wordmark{width:94px}
}