/* Homepage sections meet on one surface; only background artwork fades. */
body.ai-home-page {
  --home-surface: #fafcff;
  --home-surface-clear: rgba(250, 252, 255, 0);
  --home-edge-fade: clamp(4rem, 9vw, 8rem);
  background: var(--home-surface);
}

body.ai-home-page :is(
  .ai-hero.ai-hero--editorial,
  .ai-logo-orbit,
  .ai-ecosystem.ai-ecosystem--3d,
  .ai-story,
  .ai-capability-badges,
  .site-solutions,
  .overview-trust
) {
  border-top: 0;
  border-bottom: 0;
  background: var(--home-surface);
}

body.ai-home-page #ai-demo,
body.ai-home-page #geo-product-faq.geo-faq-section {
  background: var(--home-surface);
}

/* The homepage FAQ uses the same text and divider colours as the features page FAQ. */
body.ai-home-page #geo-product-faq {
  /* The --refine-* aliases exist only on inner pages; use the root values. */
  --geo-faq-txt-300: var(--brand-ink);
  --geo-faq-txt-600: var(--brand-muted);
  --geo-faq-border: var(--brand-line);
}

/* Match the wider horizontal app fades to the shared section surface. */
body.ai-home-page .ai-logo-orbit__viewport::before,
body.ai-home-page .ai-logo-orbit__viewport::after {
  background: linear-gradient(90deg, var(--home-surface), var(--home-surface-clear));
}

/* Keep the grid in the scene, with plain background at both boundaries. */
body.ai-home-page .ai-ecosystem__stage {
  background:
    linear-gradient(to bottom,
      var(--home-surface),
      var(--home-surface-clear) var(--home-edge-fade),
      var(--home-surface-clear) calc(100% - var(--home-edge-fade)),
      var(--home-surface)),
    linear-gradient(rgba(75, 81, 208, 0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(75, 81, 208, 0.025) 1px, transparent 1px),
    radial-gradient(ellipse at 38% 52%, rgba(95, 101, 213, 0.08), transparent 62%),
    var(--home-surface);
  background-size: auto, 4.5rem 4.5rem, 4.5rem 4.5rem, auto, auto;
}

body.ai-home-page .ai-ecosystem__wash {
  background: linear-gradient(90deg,
    var(--home-surface), var(--home-surface-clear) 16%,
    var(--home-surface-clear) 84%, var(--home-surface));
}

/* Match the ID-scoped gallery rules and fade artwork before either edge. */
body.ai-home-page :is(#ai-capabilities, #solutions) {
  background:
    linear-gradient(to bottom,
      var(--home-surface),
      var(--home-surface-clear) var(--home-edge-fade),
      var(--home-surface-clear) calc(100% - var(--home-edge-fade)),
      var(--home-surface)),
    radial-gradient(ellipse at 50% 35%, rgba(113, 133, 218, 0.065), transparent 70%),
    var(--home-surface);
}