/* Locked navy, white and Connection Blue rhythm for Home, Services, About and Contact */

:root {
  --valence-pale-blue-section: #F8FBFC;
  --valence-pale-blue-card: #FBFDFE;
}

/* Use Support Blue for small text on light surfaces while retaining the lighter blue treatment in navy heroes. */
.homepage-preview .eyebrow,
.services-page .eyebrow,
.about-page .eyebrow,
.contact-page .eyebrow,
.not-found-page .eyebrow {
  color: var(--support-blue);
}

.homepage-preview .preview-hero .eyebrow,
.services-page .services-hero .eyebrow,
.about-page .about-hero .eyebrow,
.contact-page .contact-hero .eyebrow,
.not-found-page .not-found-hero .eyebrow {
  color: #A9CCD6;
}

/* Seamless header and hero treatment across the approved public pages. */
.homepage-preview .site-header:not(.is-scrolled),
.services-page .site-header:not(.is-scrolled),
.about-page .site-header:not(.is-scrolled),
.contact-page .site-header:not(.is-scrolled),
.not-found-page .site-header:not(.is-scrolled) {
  background: transparent;
  border-bottom-color: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.homepage-preview .preview-hero,
.services-page .services-hero,
.about-page .about-hero,
.contact-page .contact-hero,
.not-found-page .not-found-hero {
  background:
    radial-gradient(circle at 84% 20%, rgba(86,157,179,.18), transparent 28rem),
    linear-gradient(135deg,var(--deep-navy),var(--navy) 76%,var(--support-blue));
}

/* Homepage visual rhythm. */
.homepage-preview .homepage-services {
  background: var(--valence-pale-blue-section);
}

.homepage-preview .homepage-services .service-card,
.homepage-preview .homepage-services .service-card-icon {
  background: var(--white);
}

@media (min-width: 761px) {
  .homepage-preview .method-flow {
    grid-template-columns: repeat(4,minmax(0,1fr));
  }

  .homepage-preview .method-flow::before {
    left: 12.5%;
    right: 12.5%;
  }
}

/* Approved alternating Services-page sequence. */
.services-page #information-and-systems-foundations,
.services-page #process-design-and-delivery-optimisation,
.services-page .implementation-support {
  background: var(--valence-pale-blue-section);
}

.services-page #asset-health-risk-and-investment-modelling,
.services-page #project-and-infrastructure-assurance {
  background: var(--white);
}

/* Pale-blue sections use white content surfaces. */
.services-page #information-and-systems-foundations .service-area-icon,
.services-page #information-and-systems-foundations .service-information-card,
.services-page #information-and-systems-foundations .service-outcome,
.services-page #process-design-and-delivery-optimisation .service-area-icon,
.services-page #process-design-and-delivery-optimisation .service-information-card,
.services-page #process-design-and-delivery-optimisation .service-outcome {
  background: var(--white);
}

/* White sections use the lighter Connection Blue card tint. */
.services-page #asset-health-risk-and-investment-modelling .service-area-icon,
.services-page #asset-health-risk-and-investment-modelling .service-information-card,
.services-page #asset-health-risk-and-investment-modelling .service-outcome,
.services-page #project-and-infrastructure-assurance .service-area-icon,
.services-page #project-and-infrastructure-assurance .service-information-card,
.services-page #project-and-infrastructure-assurance .service-outcome {
  background: var(--valence-pale-blue-card);
}

/* Identical restrained outcome callouts across all four services. */
.services-page .service-outcome {
  min-height: 58px;
  margin: 28px 0 0;
  padding: 14px 18px;
  border: 1px solid rgba(86,157,179,.24);
  border-left: 3px solid var(--connection-blue);
  border-radius: 10px;
  color: var(--navy);
  font-size: 16.5px;
  font-weight: 500;
  line-height: 1.58;
}

.services-page .service-outcome strong {
  margin-right: .32em;
  color: var(--navy);
  font-weight: 730;
}

/* Implementation and Change Support follows the same rhythm, but stays compact. */
.services-page .implementation-support {
  padding: 50px 0 54px;
  border-top: 1px solid rgba(16,40,67,.12);
  border-bottom: 1px solid rgba(16,40,67,.12);
  background: var(--valence-pale-blue-section);
}

.services-page .implementation-support h2 {
  margin-top: 0;
}

/* Continuous navy contact and footer areas. */
.homepage-preview .contact-compact,
.services-page .contact-compact,
.about-page .contact-compact,
.contact-page .contact-compact {
  border-bottom: 0;
  background: var(--deep-navy);
}

.homepage-preview .site-footer .footer-inner,
.services-page .site-footer .footer-inner,
.about-page .site-footer .footer-inner,
.contact-page .site-footer .footer-inner,
.not-found-page .site-footer .footer-inner {
  border-top: 0;
}

@media (max-width: 760px) {
  .services-page .service-outcome {
    min-height: 0;
    padding: 13px 15px;
  }

  .services-page .implementation-support {
    padding: 44px 0 47px;
  }
}