/* One authoritative header: one page title on the left and the full brand on the right. */
.topbar {
  justify-content: space-between !important;
}

.topbar > .topbar-primary {
  justify-content: space-between !important;
}

.topbar #pageEyebrow {
  display: none !important;
}

.topbar #pageTitle {
  max-width: min(42vw, 440px) !important;
  text-align: left !important;
}

.toolkit-header .eyebrow,
.account-section-heading .eyebrow,
.inspiration-header .eyebrow,
.studio-heading > div > .eyebrow,
.tool-header-row .eyebrow,
.toolkit-header h1,
.account-section-heading h1,
.inspiration-header h1,
.studio-heading > div > h1,
.tool-header-row h1 {
  display: none !important;
}

@media (max-width: 680px) {
  .topbar #pageTitle {
    max-width: 48vw !important;
  }

  .mobile-brand-lockup {
    display: flex !important;
    width: min(124px, 33vw) !important;
    flex: 0 0 min(124px, 33vw) !important;
  }
}


/* Q4: Enlarge title and logo for better visual hierarchy */
.topbar #pageTitle {
  max-width: min(56vw, 560px) !important;
  text-align: left !important;
  font-size: 1.15em !important;
  font-weight: 600 !important;
}

@media (max-width: 680px) {
  .topbar #pageTitle {
    max-width: 62vw !important;
    font-size: 1.1em !important;
  }
  .mobile-brand-lockup {
    width: min(150px, 40vw) !important;
    flex: 0 0 min(150px, 40vw) !important;
  }
}

/* Enlarge desktop brand wordmark */
.brand-wordmark {
  max-height: 40px !important;
  height: auto !important;
  width: auto !important;
  max-width: 200px !important;
}

/* Enlarge intro wordmark */
.intro-wordmark {
  max-height: 60px !important;
}


/* Q4: Logo + Title enlarged 30%+ */
.topbar #pageTitle {
  max-width: min(62vw, 620px) !important;
  text-align: left !important;
  font-size: 1.6em !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
}

@media (max-width: 680px) {
  .topbar #pageTitle {
    max-width: 68vw !important;
    font-size: 1.4em !important;
  }
  .mobile-brand-lockup {
    width: min(170px, 44vw) !important;
    flex: 0 0 min(170px, 44vw) !important;
  }
}

.brand-wordmark {
  max-height: 52px !important;
  width: auto !important;
  height: auto !important;
}

.intro-wordmark {
  max-height: 78px !important;
}

.mobile-wordmark {
  max-height: 42px !important;
}