/* DIDO/HAZI v4 — Stable physical-left brand for every locale.
   Do not flip the masthead brand when the content's direction changes. */
html body .masthead .masthead-inner {
  direction: ltr !important;
}
html body .masthead .masthead-inner > .brand {
  direction: ltr !important;
  flex-direction: row !important;
  justify-self: start !important;
  text-align: left !important;
  white-space: nowrap;
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  min-width: 0;
}
html body .masthead .masthead-inner > .brand .brand-word,
html body .masthead .masthead-inner > .brand .brand-name {
  direction: ltr !important;
  unicode-bidi: isolate !important;
  white-space: nowrap !important;
}
/* Earlier mobile CSS hid this label below 400px. Keep it at every width. */
html body .masthead .masthead-inner > .brand .brand-divider,
html body .masthead .masthead-inner > .brand .brand-name {
  display: inline-block !important;
}
html body .masthead .masthead-inner > .brand .brand-logo {
  flex-shrink: 0 !important;
}
/* Always keep the left brand and the right language picker independent of RTL. */
html body .masthead .masthead-inner > .language,
html body .masthead .masthead-inner > .language.lang-menu-host {
  justify-self: end !important;
  direction: ltr !important;
}
/* Place the navigation below the fixed left/right header at intermediate sizes. */
@media (min-width: 641px) and (max-width: 970px) {
  html body .masthead .masthead-inner {
    grid-template-columns: minmax(0,1fr) 166px !important;
    row-gap: 8px !important;
    padding-block: 12px !important;
  }
  html body .masthead .masthead-inner > .brand { grid-column: 1 !important; grid-row: 1 !important; }
  html body .masthead .masthead-inner > .language { grid-column: 2 !important; grid-row: 1 !important; }
  html body .masthead .masthead-inner > .nav-wrap {
    grid-column: 1 / -1 !important; grid-row: 2 !important;
    justify-self: center !important;
  }
}
@media (max-width: 640px) {
  html body .masthead .masthead-inner > .brand .brand-logo { width: 35px !important; height: 35px !important; }
  html body .masthead .masthead-inner > .brand .brand-word { font-size: 20px !important; }
  html body .masthead .masthead-inner > .brand .brand-name { font-size: 12px !important; line-height: 1.3 !important; }
  html body .masthead .masthead-inner > .brand { gap: 6px !important; }
  html body .masthead .masthead-inner > .brand .brand-divider { margin-inline: 1px !important; }
}
/* Narrow phones: maintain the complete English brand without squeezing/clipping it.
   Branding on left in row 1, dropdown on right in row 2, tabs in row 3. */
@media (max-width: 430px) {
  html body .masthead .masthead-inner {
    grid-template-columns: minmax(0,1fr) auto !important;
    gap: 7px !important;
    padding-block: 10px !important;
  }
  html body .masthead .masthead-inner > .brand {
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
    justify-self: start !important;
    max-width: 100%;
  }
  html body .masthead .masthead-inner > .language,
  html body .masthead .masthead-inner > .language.lang-menu-host {
    grid-column: 2 !important;
    grid-row: 2 !important;
    justify-self: end !important;
  }
  html body .masthead .masthead-inner > .nav-wrap {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    margin-top: 1px !important;
    justify-self: stretch !important;
  }
}
/* Admin logo: left to right regardless of overall admin language. */
html body .site-head .head-inner > a.brand {
  direction: ltr !important;
  text-align: left !important;
  flex-direction: row !important;
  justify-self: start !important;
}

/* Mobile-only viewport gesture lock (keeps ordinary one-finger scrolling).
   Accessibility tradeoff: this prevents pinch enlargement for most browsers. */
@media (max-width: 1100px) and (pointer: coarse) {
  html, body { touch-action: pan-x pan-y !important; -webkit-text-size-adjust: 100%; }
  /* Prevent Safari from zooming into inputs when focused. */
  input:not([type="checkbox"]):not([type="radio"]), textarea, select {
    font-size: max(16px, 1em) !important;
  }
}