/* Site title stays next to the logo on desktop. On mobile, the main
   top bar shows just the logo; the title appears in the slide-out navigation. */
.header-row > .brand-with-title {
  gap:2px;
  min-width:0;
  letter-spacing:normal;
  flex-shrink:0;
}
.header-row > .brand-with-title .brand-site-title {
  margin:0;
  color:#20352c;
  font-size:18px;
  font-weight:700;
  line-height:1.45;
  letter-spacing:0;
  white-space:nowrap;
}
.header-row > .brand-with-title .brand-logo {
  max-width:105px;
  max-height:42px;
  object-fit:contain;
  flex-shrink:0;
}
.header-row > .brand-with-title .brand-symbol {flex-shrink:0}

@media (min-width:801px) {
  /* In RTL, margin-inline-start moves the first (home) link left. */
  .site-header .header-row .desktop-nav {margin-inline-start:12px}
}
@media (min-width:801px) and (max-width:1100px) {
  .header-row > .brand-with-title .brand-site-title {font-size:15px}
  .header-row > .brand-with-title .brand-logo {max-width:86px}
  .site-header .header-row .desktop-nav {margin-inline-start:8px}
}
@media (max-width:800px) {
  /* Keep logo centered in the single 64px navbar row. No site-title strip. */
  .header-row > .brand-with-title {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    max-width:105px;
    gap:0;
    overflow:hidden;
  }
  .header-row > .brand-with-title .brand-site-title {display:none}
  .header-row > .brand-with-title .brand-logo {
    max-width:100px;
    max-height:36px;
    width:auto;
    height:auto;
  }
  .mobile-drawer .mobile-drawer-title {
    font-size:17px;
    line-height:1.45;
    margin:0;
    font-weight:700;
  }
}
@media (max-width:360px) {
  .header-row > .brand-with-title {max-width:90px}
  .header-row > .brand-with-title .brand-logo {max-width:85px;max-height:33px}
}