/* Homepage atmosphere matched to the September 2026 green-theme reference.
 * Keep brand greens on controls and artwork; use cool neutral pastels for page backgrounds.
 */
body.home-page::after {
  background: #fff;
}

/* Headline accent: colour only — no marker underline */
.home-page .hero-title .highlight {
  width: auto;
  margin-inline: 0;
  padding-inline: 0;
  color: var(--color-accent);
  background: none;
}

.home-page .hero::before {
  background-image:
    radial-gradient(ellipse 48% 70% at 0% 14%, rgba(219, 239, 242, 0.72) 0%, rgba(219, 239, 242, 0) 72%),
    radial-gradient(ellipse 48% 68% at 100% 18%, rgba(240, 232, 248, 0.68) 0%, rgba(240, 232, 248, 0) 72%),
    radial-gradient(ellipse 42% 46% at 8% 96%, rgba(252, 244, 219, 0.54) 0%, rgba(252, 244, 219, 0) 72%),
    radial-gradient(ellipse 44% 48% at 94% 94%, rgba(223, 244, 242, 0.62) 0%, rgba(223, 244, 242, 0) 72%),
    linear-gradient(180deg, #fff 0%, #fbfcfc 100%);
}

.home-page .nav-shell {
  box-shadow:
    0 18px 48px rgba(65, 76, 88, 0.07),
    0 6px 18px rgba(65, 76, 88, 0.05),
    inset 0 1px rgba(255, 255, 255, 0.78);
}

.home-page .hero-image {
  box-shadow:
    0 26px 58px -28px rgba(49, 66, 73, 0.28),
    0 8px 22px rgba(74, 83, 98, 0.08);
}

.home-page .how-it-works::before {
  inset: 0;
  left: 0;
  width: auto;
  transform: none;
  background:
    radial-gradient(circle at 5% 10%, rgba(231, 240, 248, 0.72) 0%, rgba(231, 240, 248, 0) 52%),
    radial-gradient(circle at 94% 18%, rgba(226, 245, 242, 0.7) 0%, rgba(226, 245, 242, 0) 54%),
    linear-gradient(135deg, rgba(248, 249, 252, 0.98) 0%, rgba(245, 243, 250, 0.94) 58%, rgba(247, 250, 249, 0.98) 100%);
  box-shadow: none;
}

.home-page .home-value,
.home-page .use-cases,
.home-page .features,
.home-page .home-faq {
  background-color: #fff;
}

@media (max-width: 768px) {
  .home-page .hero::before {
    background-image:
      radial-gradient(ellipse 82% 48% at 0% 10%, rgba(219, 239, 242, 0.68) 0%, rgba(219, 239, 242, 0) 72%),
      radial-gradient(ellipse 78% 46% at 100% 20%, rgba(240, 232, 248, 0.62) 0%, rgba(240, 232, 248, 0) 72%),
      linear-gradient(180deg, #fff 0%, #fbfcfc 100%);
  }
}