/* Arrière-plans par page : placez vos images dans images/ avec les noms ci-dessous (ou modifiez les url). */
body.page-accueil {
  --page-bg-image: url("../images/bg-accueil.jpg");
}

body.page-a-propos {
  --page-bg-image: url("../images/bg-a-propos.jpg");
}

body.page-cours {
  --page-bg-image: url("../images/bg-cours.jpg");
}

body.page-galerie {
  --page-bg-image: url("../images/bg-galerie.jpg");
}

body.page-contact {
  --page-bg-image: url("../images/bg-contact.jpg");
}

/* Fond : dégradé lisible par-dessus la photo (ajustez l’opacité si besoin) */
body.page-bg {
  background-color: var(--blue-soft);
  background-image:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.94) 0%,
      rgba(232, 241, 251, 0.88) 40%,
      rgba(255, 255, 255, 0.96) 100%
    ),
    var(--page-bg-image);
  background-size: cover, cover;
  background-position: center top, center center;
  background-attachment: fixed, fixed;
  background-repeat: no-repeat, no-repeat;
}

@media (prefers-reduced-motion: reduce) {
  body.page-bg {
    background-attachment: scroll, scroll;
  }
}