/* Reset de base */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}	

.background1 img {
  position: fixed;     /* reste en place même au scroll */
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  object-fit: cover;   /* couvre toute la fenêtre sans déformation */
  z-index: -1;         /* envoie l’image derrière les boutons */
}

.background {

  position: relative;
  width: 100vw;
  height: 100vh;                 /* prend toute la fenêtre */ /* chemin de ton image */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  /* centre le contenu (les boutons) */
  display: flex;
  justify-content: center;       /* centre horizontal */
  align-items: center;           /* centre vertical */
}

/* Conteneur boutons */
.container {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;               /* responsive */
}

/* Style des boutons */
.btn {
  background: white;
  color: blue;
  border: 2px solid blue;
  padding: 12px 20px;
  border-radius: 8px;
  text-decoration: none;
  font-size: 18px;
  cursor: pointer;
  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
  transition: background 0.2s, color 0.2s, transform 0.1s;
  font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif"
}

.btn:hover {
  background: blue;
  color: white;
}

.btn:active {
  transform: translateY(1px);
}

/* Version mobile */
@media (max-width: 480px) {
  .container {
    flex-direction: column;
    gap: 12px;
  }
  .btn {
    width: 100%;
    max-width: 250px;
  }
}
