:host {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: start;
  gap: 30px;

  width: fit-content;
  min-width: 100%;

  box-sizing: border-box;
  border-bottom: oklch(0 0 0 / 20%) 2px solid;
  background-color: oklch(1 0 0 / 60%);

  backdrop-filter: blur(20px);

  contain: layout paint;
  isolation: isolate;
  z-index: 100;

  .menu-left {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: start;
    gap: 48px;
    padding: 12px;

    .brand {
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: start;
      gap: 0;

      img {
        display: inline-block;
        height: 20px;
        padding: 10px;
      }

      span {
        font-weight: 900;
        /*text-box-trim: trim-both;
        text-box-edge: cap alphabetic;*/
      }
    }

    span {
      font-size: 18px;
      line-height: 40px;
      vertical-align: middle;
      white-space: nowrap;
    }
  }
}