@media (max-width: 767.98px) {
  /*hide title on mobile*/
  .siteTitle{
    display: none !important;
  }
  /*place hamburger menu and log on both ends*/
  .navbar-header{
  justify-content: space-between;
  }

  .navbar-dark .navbar-toggler:focus{

    border: 0px !important;
  }

  .navbar-dark .navbar-toggler{
    border: 0px  !important;

  }
body > div.navbar-expand-xl.navbar.navbar-dark.static-top > div.container.custom-container > div.navbar-brand.navbar-header > div > div > a > h1{
  font-size: 1.3rem;
}
  /* Trim header height */
  .navbar.navbar-dark.static-top {
    min-height: 42px;
    padding-top: 4px;
    padding-bottom: 4px;
  }

  /* Put brand + hamburger on the SAME line, no wrapping */
  .custom-container {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    flex-wrap: nowrap;   /* prevent hamburger dropping below */
    width: 100%;
  }

  /* BRAND: allow it to shrink and truncate, keep icon next to text */
  .navbar-brand.navbar-header {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex: 1 1 auto;      /* can grow and shrink */
    min-width: 0;        /* CRITICAL: allows flex child to shrink */
    margin: 0;
    padding: 2.5%;
    font-size: 0.92rem;  /* slightly smaller text */
    line-height: 1.15;
    white-space: nowrap;           /* keep in one line */
    overflow: hidden;              /* enable truncation */
    text-overflow: ellipsis;       /* … when too long */
  }

  /* Icon/logo inside brand (image or font icon) */
  .navbar-brand.navbar-header img {
    height: 20px;
    width: auto;
    display: inline-block;
    flex: 0 0 auto;
  }
  .navbar-brand.navbar-header .glyphicon,
  .navbar-brand.navbar-header .fa,
  .navbar-brand.navbar-header .fa-solid,
  .navbar-brand.navbar-header .fa-regular,
  .navbar-brand.navbar-header .fa-brands {
    font-size: 1.05rem;
    line-height: 1;
    display: inline-block;
    flex: 0 0 auto;
  }

  /* HAMBURGER: fixed-size, sits right after brand */
  .navbar-toggler.custom-navbar-toggler {
    flex: 0 0 auto;          /* don’t let it shrink or grow */
    margin-left: 8px;
    padding: 4px 8px;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;      /* vertically align with brand */
  }
  .navbar-toggler .navbar-toggler-icon {
    width: 1.5rem;
    height: 1.8rem;
  }

  /* Collapsed menu area below the header */
  #navbar.navbar-collapse {
    width: 100% !important;           /* avoid min-content clipping */
    max-height: calc(100vh - 110px);  /* match reduced header */
    overflow-y: auto;
    padding-top: 6px;
    padding-bottom: 6px;
  }

  /* Optional: slightly smaller nav links for tighter mobile fit */
  .nav.navbar-nav .nav-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.95rem;
    padding: 6px 10px;
    line-height: 1.2;
    white-space: nowrap;
  }
  .nav.navbar-nav .nav-link img {
    height: 18px; width: auto;
  }
  .nav.navbar-nav .nav-link .glyphicon,
  .nav.navbar-nav .nav-link .fa,
  .nav.navbar-nav .nav-link .fa-solid,
  .nav.navbar-nav .nav-link .fa-regular,
  .nav.navbar-nav .nav-link .fa-brands {
    font-size: 1rem;
  }

  .divider-vertical { margin: 0 6px; }

  .username,
  .drop_language,
  .dropdown-menu .dropdown-item {
    /*KZ: Disabled as it looked too small compared to other menu items 
    font-size: 0.95rem;
    */
    line-height: 1.2;
  }
}