/* Shared header alignment across platform and tool pages. */
.brand-header {
  grid-template-columns: minmax(210px, 0.8fr) minmax(320px, 1.4fr) minmax(190px, max-content) minmax(230px, max-content);
  min-height: 70px;
}

.brand-mark {
  min-width: 0;
}

.brand-nav {
  justify-self: center;
  justify-content: center;
  min-height: 46px;
}

.brand-language {
  justify-self: end;
  min-height: 46px;
}

.auth-shell {
  justify-self: end;
  min-width: 230px;
  min-height: 46px;
  white-space: nowrap;
}

@media (max-width: 1180px) {
  .brand-header {
    grid-template-columns: minmax(210px, 1fr) max-content;
  }

  .brand-nav {
    grid-column: 1 / 2;
    grid-row: 2;
    justify-self: start;
    justify-content: flex-start;
  }

  .brand-language {
    grid-column: 2;
    grid-row: 2;
  }

  .auth-shell {
    grid-column: 2;
    grid-row: 1;
  }
}

@media (max-width: 820px) {
  .brand-header {
    grid-template-columns: 1fr;
  }

  .brand-nav,
  .brand-language,
  .auth-shell {
    grid-column: auto;
    grid-row: auto;
    justify-self: start;
    justify-content: flex-start;
  }
}