/* Shared logo treatment for the static design release. */
.nav .brand {
  width: 178px;
  min-width: 178px;
  height: 46px;
  margin-right: 8px;
}

.nav .brand > img,
.nav .brand > div {
  display: none !important;
}

.nav .brand::before {
  display: block;
  width: 172px;
  height: 46px;
  background: url("/assets/sesdom-header-logo-transparent.png") center / contain no-repeat;
  content: "";
}

.nav .language-switcher {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  margin-left: 0;
  padding: 3px;
  border: 1px solid rgba(159, 216, 255, .28);
  border-radius: 999px;
  background: rgba(255, 255, 255, .05);
  color: rgba(223, 241, 255, .72);
  font-family: "Figtree", "Noto Sans TC", sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
}

.nav .language-switcher button {
  min-width: 30px;
  height: 28px;
  padding: 0 7px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: inherit;
  cursor: default;
  font: inherit;
}

.nav .language-switcher button[aria-current="true"] {
  background: rgba(159, 216, 255, .22);
  color: #fff;
}

.nav .language-switcher button:disabled {
  opacity: .56;
}

@media (max-width: 760px) {
  .nav .brand {
    width: 142px;
    min-width: 142px;
    height: 40px;
    margin-right: 0;
  }

  .nav .brand::before {
    width: 138px;
    height: 40px;
  }
}

@media (max-width: 960px) {
  .nav .language-switcher {
    margin-left: auto;
  }
}

@media (max-width: 700px) {
  .nav .brand {
    width: 108px;
    min-width: 108px;
    height: 34px;
  }

  .nav .brand::before {
    width: 104px;
    height: 34px;
  }

  .nav .language-switcher {
    padding: 2px;
    font-size: 11px;
  }

  .nav .language-switcher button {
    min-width: 27px;
    height: 26px;
    padding: 0 5px;
  }
}