/* Shared background for HomePage (no particles) */

#home-shared-background {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  pointer-events: none;
  /* Place au-dessus du fond du body et sous le contenu */
  z-index: 0;
  /* Fond violet profond identique à BloomAI */
  background: rgba(9, 5, 24, 1);
}

/* Edge darkening vignette overlay above glows, below content */
#home-vignette-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  pointer-events: none;
  /* Place au-dessus de tout le contenu pour assombrir globalement les bords */
  z-index: 950;
  /* Stronger edge darkening with smoother falloff */
  background: radial-gradient(
    ellipse at 50% 50%,
    rgba(0,0,0,0) 48%,
    rgba(0,0,0,0.2) 65%,
    rgba(0,0,0,0.5) 80%,
    rgba(0,0,0,0.8) 100%
  );
  /* Ellipse encore plus large pour un effet plus dramatique */
  background-size: 100% 150%;
  background-position: center;
}

/* Ensure only HomePage uses this background */
body:not(.home-page) #home-shared-background {
  display: none !important;
}

/* Global page baseline for HomePage - Couleur exacte de BloomAI */
body.home-page {
  background: rgba(9, 5, 24, 1) !important;
}

/* Content layering to sit above background */
#app,
#main-content,
.home-page,
.section-content,
.hero-text-content,
.hero-image-container {
  position: relative;
  z-index: 10;
}

/* Lighter background opacity on small screens if needed */
@media (max-width: 768px) {
  #home-shared-background { opacity: 0.85; }
}