/*
 * Shared desktop navigation sizing for the purple GG's House site and the
 * green-and-gold Campus site. The #primaryNav selectors intentionally outrank
 * page-level legacy styles so every public page uses one predictable header.
 */
@media (min-width: 1201px) {
  body > header.site-header {
    box-sizing: border-box;
    min-height: 80px;
    flex-wrap: nowrap;
    gap: 10px;
    padding-right: 18px;
    padding-left: 18px;
  }

  body > header.site-header > a.logo {
    display: flex;
    flex: 0 1 215px;
    min-width: 215px;
    align-items: center;
  }

  /* Prevent a source image's HTML dimensions from stretching a header. */
  body > header.site-header > a.logo > img {
    max-width: 54px;
    max-height: 54px;
    object-fit: contain;
  }

  body > header.site-header > nav#primaryNav {
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    gap: 7px;
    font-size: 14px;
    font-weight: 900;
  }

  body > header.site-header > nav#primaryNav > a {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    padding: 8px 2px;
    line-height: 1.2;
    white-space: nowrap;
  }

  body > header.site-header > nav#primaryNav > .give,
  body > header.site-header > nav#primaryNav > .campus-link,
  body > header.site-header > nav#primaryNav > .main-site-return {
    min-height: 46px;
    padding: 10px 13px;
  }

  body > header.site-header > a.persistent-give {
    min-height: 46px;
    margin-right: 0;
    margin-left: 0;
    padding: 10px 13px;
    font-size: 14px;
  }

  /* Campus headers have longer branding than the purple main site. Keep the
     mark and both text lines compact so the brand never forces a tall header. */
  body > header.site-header > a.logo[href="/campus-home"] > img {
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    max-width: 40px;
    max-height: 40px;
  }

  body > header.site-header > a.logo[href="/campus-home"] > span:last-child {
    display: block;
    min-width: 0;
  }

  body > header.site-header > a.logo[href="/campus-home"] .name {
    display: block;
    font-size: 18px;
    line-height: 1.05;
    white-space: nowrap;
  }

  body > header.site-header > a.logo[href="/campus-home"] .tag {
    display: block;
    margin-top: 3px;
    font-size: 9px;
    line-height: 1.1;
    letter-spacing: 2px;
    white-space: nowrap;
  }
}

@media (min-width: 1421px) {
  body > header.site-header {
    min-height: 84px;
    gap: clamp(14px, 1.2vw, 24px);
    padding-right: clamp(24px, 2vw, 42px);
    padding-left: clamp(24px, 2vw, 42px);
  }

  body > header.site-header > a.logo {
    flex-basis: 245px;
    min-width: 245px;
  }

  body > header.site-header > nav#primaryNav {
    gap: clamp(10px, .9vw, 18px);
    font-size: clamp(15px, .92vw, 16px);
  }

  body > header.site-header > nav#primaryNav > a {
    min-height: 46px;
    padding: 10px 4px;
  }

  body > header.site-header > nav#primaryNav > .give,
  body > header.site-header > nav#primaryNav > .campus-link,
  body > header.site-header > nav#primaryNav > .main-site-return {
    min-height: 48px;
    padding: 11px 16px;
  }

  body > header.site-header > a.persistent-give {
    min-height: 48px;
    padding: 11px 18px;
    font-size: 15px;
  }
}