

html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    overflow: hidden; /* Empêche les barres de défilement d'apparaître */
}

.image-pc, .image-tel { /*deux class, un réglage identique*/
  width: 100vw;       /* 100% de la largeur de la fenêtre */
  height: 100vh;      /* 100% de la hauteur de la fenêtre */
  object-fit: cover;  /* L'astuce magique : l'image remplit tout sans être déformée */ 
}


/* 2. Par défaut (sur PC), on cache l'image mobile */
.image-mobile {
    display: none;
}

/* 3. L'INTERRUPTEUR : Si l'écran fait moins de 768px (taille d'une tablette/smartphone) */
@media (max-width: 768px) {
    .image-pc {
        display: none;     /* On cache l'image PC */
    }
    .image-mobile {
        display: block;    /* On affiche l'image mobile */
    }
}

