/* Shared mobile header layout for pages with inline or external site styles. */
@media (max-width: 980px) {
  .topbar .row {
    justify-content: center;
    gap: 8px 16px;
  }

  .topbar .left {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 4px 16px;
  }

  .topbar .left > span {
    margin: 0;
    white-space: nowrap;
  }
}

@media (max-width: 620px) {
  .topbar {
    padding: 9px 0;
    font-size: 12px;
    line-height: 1.5;
  }

  .topbar .container.row {
    display: block;
    padding-right: 16px;
    padding-left: 16px;
  }

  .topbar .left {
    gap: 3px 14px;
  }

  .topbar .left > span:first-child {
    flex-basis: 100%;
    text-align: center;
  }

  .topbar .left i {
    display: none;
  }

  .topbar .topbar-social,
  .topbar .row > div:last-child {
    display: none;
  }

  header.site {
    padding: 10px 0;
  }

  header.site .container.row {
    gap: 16px;
    padding-right: 20px;
    padding-left: 20px;
  }

  header.site .brand img {
    height: 62px;
    width: auto;
  }

  header.site .head-cta {
    display: none;
  }
}