/* R1 homepage review corrections: keep the desktop header quiet and the first screen compact. */
@media (min-width: 821px) {
  .mission-header .header-inner {
    grid-template-columns: auto 1fr;
    min-height: 72px;
  }

  .mission-header .mission-mobile-nav,
  .mission-header .menu-toggle {
    display: none !important;
  }

  .mission-header .header-actions {
    justify-self: end;
    align-items: center;
  }
}

@media (min-width: 1041px) {
  .mission-hero {
    padding-top: 58px;
    padding-bottom: 60px;
  }

  .mission-hero-grid {
    gap: 42px;
  }

  .mission-hero h1 {
    font-size: clamp(3rem, 4.3vw, 4.55rem);
  }

  .transform-stage {
    min-height: 330px;
  }

  .transform-art {
    height: 160px;
  }
}
/* Keep the public-home account controls legible against the cream header. */
.mission-header .header-actions .button-outline {
  color: #fff;
  background: var(--mission-green);
  border-color: var(--mission-green);
  box-shadow: 0 5px 14px rgba(41, 74, 58, .18);
}

.mission-header .header-actions .button-outline:hover,
.mission-header .header-actions .button-outline:focus-visible {
  color: #fff;
  background: var(--mission-green-dark);
  border-color: var(--mission-green-dark);
}

.mission-header .menu-toggle {
  color: var(--mission-green-dark);
  border-color: rgba(53, 95, 73, .38);
  background: rgba(255, 253, 248, .96);
}

.mission-header .menu-toggle span:not(.sr-only) {
  background: var(--mission-green-dark);
}

.mission-header .mobile-nav-account {
  color: var(--mission-green-dark);
  font-weight: 800;
}


/* Pin both responsive Login variants to the same high-contrast treatment. */
.mission-header .header-login-button,
.mission-header .mobile-nav-account {
  color: #fff !important;
  background: #355f49 !important;
  border-color: #355f49 !important;
}

.mission-header .mobile-nav-account {
  min-height: 44px;
  padding: 11px 20px !important;
  border: 1px solid #355f49 !important;
  border-radius: 999px;
  font-weight: 800;
  line-height: 1.2;
}

.mission-header .header-login-button:hover,
.mission-header .header-login-button:focus-visible,
.mission-header .mobile-nav-account:hover,
.mission-header .mobile-nav-account:focus-visible {
  color: #fff !important;
  background: #294a3a !important;
  border-color: #294a3a !important;
}