:root {
  --site-header-surface: #ffffff;
  --site-page-surface: #fafafb;
}

html,
html body,
html body[class],
html body > main,
html body[class] > main {
  background: var(--site-page-surface) !important;
}

header.nav {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  background: var(--site-header-surface) !important;
}

/* One continuous page canvas: section wrappers no longer look like cards. */
html body main > section,
html body main > .section,
html body main > .page-hero,
html body main > .subpage-hero,
html body main > .home-case-shortcuts,
html body main > .industry-filter-bar,
html body main > .case-chapter-nav {
  background: transparent !important;
  border-color: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

:where(
  .home-case-shortcuts,
  .methodology-row,
  .parallax-case-grid,
  .industry-filter-bar,
  .industry-panel,
  .industry-transform-block,
  .industry-case-block,
  .about-statement,
  .about-story-grid,
  .delivery-timeline,
  .result-chain,
  .case-loss-story,
  .case-operating-thesis,
  .case-relation-flow,
  .case-scenario,
  .deployment-facts,
  .dispatch-exception-panel
):not(.dark):not(.is-dark):not(.tone-dark) {
  background: transparent !important;
  border-color: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

:where(
  .about-field,
  .about-proof,
  .about-platform,
  .contact-route,
  .contact-path
)::before {
  background: transparent !important;
  box-shadow: none !important;
}

@media (max-width: 900px) {
  header.nav {
    top: 0 !important;
  }
}

/* Keep the homepage story moving without a large empty pause between products and delivery. */
.home-v2 .methodology-showcase {
  padding-bottom: clamp(2.5rem, 4vw, 4.5rem) !important;
}

.home-v2 .product-showcase + .delivery-comparison {
  margin-top: 0 !important;
  padding-top: clamp(2.5rem, 4vw, 4.5rem) !important;
}

/* This file loads last on key pages; keep their canvas and light modules white. */
:root {
  --site-page-surface: #ffffff;
  --ui-canvas: #ffffff;
  --ui-panel: #ffffff;
  --ui-panel-soft: #ffffff;
  --ui-panel-muted: #ffffff;
  --ui-light-module: #ffffff;
  --ui-light-card: #ffffff;
}

html,
body,
body > main,
main {
  background-color: #ffffff !important;
  background-image: none !important;
}

.home-v2 .case-fill {
  background-color: #ffffff !important;
  background-image: none !important;
}

/* One continuous surface for the homepage delivery comparison. */
.home-v2 .delivery-comparison .compare-card .compare-fde,
.home-v2 .delivery-comparison .compare-card .compare-detail {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Keep the case shortcut directory on the continuous page canvas. */
.home-v2 main > .home-case-shortcuts {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.home-v2 .home-case-shortcuts button,
.home-v2 .home-case-shortcuts .case-see-all {
  background: #f5f7fa !important;
  color: #666e78 !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

.home-v2 .home-case-shortcuts button:hover,
.home-v2 .home-case-shortcuts button:focus-visible,
.home-v2 .home-case-shortcuts button.is-active,
.home-v2 .home-case-shortcuts .case-see-all:hover,
.home-v2 .home-case-shortcuts .case-see-all:focus-visible {
  background: #ffffff !important;
  color: #000000 !important;
  border-color: #dfe3e8 !important;
}
