@font-face { font-family: "Barlow Condensed"; font-style: normal; font-weight: 500; font-display: swap; src: url("assets/fonts/barlow-condensed-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-style: normal; font-weight: 600; font-display: swap; src: url("assets/fonts/barlow-condensed-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Brothforge Brand Chinese"; font-style: normal; font-weight: 400; font-display: swap; src: url("assets/fonts/noto-sans-sc-display.ttf") format("truetype"); }

/* Isolated lockups inherit foreground color from their white or dark host. */
.bf-brand {
  --bf-brand-unit: 1px;
  display: inline-flex;
  align-items: center;
  flex: none;
  gap: calc(10 * var(--bf-brand-unit));
  color: inherit;
  text-align: left;
  white-space: nowrap;
  line-height: 1;
  letter-spacing: normal;
  font-style: normal;
  font-weight: 400;
  text-transform: none;
  vertical-align: middle;
}
.bf-brand .bf-brand__icon {
  display: block;
  flex: none;
  width: calc(36 * var(--bf-brand-unit));
  height: calc(42 * var(--bf-brand-unit));
  overflow: visible;
  filter: none;
}
.bf-brand .bf-brand__words { display: flex; flex-direction: column; }
.bf-brand .bf-brand__zh { font-family: "Brothforge Brand Chinese", "Microsoft YaHei", "PingFang SC", sans-serif; font-synthesis: none; }
.bf-brand .bf-brand__en { font-family: "Barlow Condensed", sans-serif; }

.bf-brand--a { gap: calc(8 * var(--bf-brand-unit)); }
.bf-brand--a .bf-brand__icon { width: calc(28 * var(--bf-brand-unit)); height: calc(31 * var(--bf-brand-unit)); }
.bf-brand--a .bf-brand__words { gap: calc(4 * var(--bf-brand-unit)); align-items: center; }
.bf-brand--a .bf-brand__zh {
  display: flex;
  align-self: stretch;
  justify-content: space-between;
  font-size: calc(10 * var(--bf-brand-unit));
  line-height: 1;
  font-weight: 400;
  letter-spacing: 0;
  margin-right: 0;
  padding: 0;
}
.bf-brand--a .bf-brand__zh > span { flex: none; }
.bf-brand--a .bf-brand__en {
  display: block;
  position: relative;
  line-height: 0;
}
.bf-brand--a .bf-brand__wordmark {
  display: block;
  width: calc(124 * var(--bf-brand-unit));
  height: auto;
  aspect-ratio: 962 / 118;
  color: inherit;
  overflow: visible;
  filter: none;
  fill: currentColor;
}
.bf-brand--a .bf-brand__wordmark path { fill: currentColor; stroke: none; }
.bf-brand--a .bf-brand__en-text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

@media (max-width: 420px) {
  .bf-brand--a { gap: calc(7 * var(--bf-brand-unit)); }
  .bf-brand--a .bf-brand__icon { width: calc(26 * var(--bf-brand-unit)); height: calc(29 * var(--bf-brand-unit)); }
  .bf-brand--a .bf-brand__wordmark { width: calc(120 * var(--bf-brand-unit)); }
}

.bf-brand--b { gap: calc(9 * var(--bf-brand-unit)); }
.bf-brand--b .bf-brand__icon { width: calc(29 * var(--bf-brand-unit)); height: calc(35 * var(--bf-brand-unit)); }
.bf-brand--b .bf-brand__words { flex-direction: row; align-items: center; gap: calc(11 * var(--bf-brand-unit)); }
.bf-brand--b .bf-brand__en {
  order: -1;
  font-size: calc(27 * var(--bf-brand-unit));
  font-weight: 600;
  letter-spacing: calc(.05 * var(--bf-brand-unit));
}
.bf-brand--b .bf-brand__zh {
  font-size: calc(10 * var(--bf-brand-unit));
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: calc(1 * var(--bf-brand-unit));
  padding-left: calc(11 * var(--bf-brand-unit));
  border-left: calc(1 * var(--bf-brand-unit)) solid currentColor;
}

.bf-brand--c { align-items: flex-start; gap: calc(8 * var(--bf-brand-unit)); }
.bf-brand--c .bf-brand__icon { width: calc(33 * var(--bf-brand-unit)); height: calc(38 * var(--bf-brand-unit)); }
.bf-brand--c .bf-brand__words { gap: calc(5 * var(--bf-brand-unit)); }
.bf-brand--c .bf-brand__zh { display: grid; gap: calc(2 * var(--bf-brand-unit)); font-size: calc(15 * var(--bf-brand-unit)); font-weight: 500; line-height: 1.15; letter-spacing: calc(1.1 * var(--bf-brand-unit)); }
.bf-brand--c .bf-brand__zh > span:first-child { letter-spacing: calc(9.15 * var(--bf-brand-unit)); margin-right: calc(-9.15 * var(--bf-brand-unit)); }
.bf-brand--c .bf-brand__en { font-size: calc(9.5 * var(--bf-brand-unit)); font-weight: 600; letter-spacing: calc(.46 * var(--bf-brand-unit)); }