/*
 * Shared site shell.
 * Loaded after page styles so every route starts with the same navy header.
 */
.site-header,
.site-header.scrolled {
  background: #0E1B2E;
  border-bottom-color: rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(12px);
}

.site-header .header-nav a,
.site-header.scrolled .header-nav a,
.site-header .nav-link-secondary,
.site-header.scrolled .nav-link-secondary {
  color: rgba(255, 255, 255, 0.92);
}

.site-header .header-nav a:hover,
.site-header.scrolled .header-nav a:hover,
.site-header .nav-link-secondary:hover,
.site-header.scrolled .nav-link-secondary:hover {
  color: #F05001;
}

.site-header .header-nav a.nav-cta-cold,
.site-header.scrolled .header-nav a.nav-cta-cold {
  color: #FFFFFF;
  background: #F05001;
}

.site-header .header-nav a.nav-cta-cold:hover,
.site-header.scrolled .header-nav a.nav-cta-cold:hover {
  color: #FFFFFF;
  background: #D94600;
}

.site-header .mobile-menu-btn span,
.site-header.scrolled .mobile-menu-btn span,
.site-header:not(.scrolled) .mobile-menu-btn span {
  background: #FFFFFF !important;
}

/* Pages that previously opened on white or off-white. */
.about-hero,
.pl-review-hero,
.ps-hero-light,
.page-navy-intro,
.success-main {
  background: #0E1B2E !important;
  color: #FFFFFF;
}

.about-hero h1,
.about-hero .whats-included-intro,
.about-hero > .cases-inner > div > div:first-child p,
.pl-review-hero .pl-review-headline,
.pl-review-hero .pl-review-lead,
.pl-review-hero .pl-review-body,
.pl-review-hero .container-wide > div > div:first-child p,
.ps-hero-light h1,
.ps-hero-light .ps-hero-sub,
.page-navy-intro h1,
.page-navy-intro p,
.success-main h1,
.success-main p {
  color: #FFFFFF !important;
}

.about-hero .services-eyebrow,
.pl-review-hero .pl-review-eyebrow,
.page-navy-intro .services-eyebrow {
  color: #F05001 !important;
}

.about-hero .hero-cta {
  background: #F05001;
  color: #FFFFFF;
}

.about-hero .hero-cta:hover {
  background: #D94600;
}

.page-navy-intro {
  padding: 160px 64px 72px;
}

.page-navy-intro-inner {
  width: min(100%, 74rem);
  margin: 0 auto;
}

.page-navy-intro p {
  max-width: 68ch;
}

@media (max-width: 1024px) {
  .site-header,
  .site-header.scrolled {
    width: 100%;
    max-width: 100vw;
    min-width: 0;
    justify-content: center;
  }

  .site-header .header-logo {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin: 0;
  }

  .site-header .header-logo-img {
    max-width: min(64vw, 360px);
  }

  .site-header .mobile-menu-btn {
    position: absolute;
    right: 24px;
    margin: 0;
    z-index: 2;
  }

  .mobile-nav {
    align-items: center;
    text-align: center;
  }

  .mobile-nav a {
    width: 100%;
    text-align: center;
  }

  .page-navy-intro {
    padding: 140px 24px 64px;
  }
}

@media (max-width: 640px) {
  /* Avoid the double horizontal padding inherited by the hero and its grid. */
  .hero {
    width: 100%;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .hero .hero-top {
    width: 100%;
  }

  .hero .hero-two-col {
    width: 100%;
    max-width: none;
    margin: 0;
    padding-left: 20px;
    padding-right: 20px;
  }

  .hero .hero-left {
    width: 100%;
    text-align: center;
  }

  .hero .hero-left p,
  .hero .hero-left .hero-label {
    margin-left: auto;
    margin-right: auto;
  }

  .hero .hero-right {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    justify-content: center;
  }

  #review-block .cases-inner > div[style*="grid-template-columns"],
  #service-areas .cases-inner > div[style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }

  .page-navy-intro {
    padding: 128px 20px 56px;
    text-align: center;
  }

  .page-navy-intro p {
    margin-left: auto;
    margin-right: auto;
  }
}