body {
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    background-color: #ffffff;
    color: #030303;
    font-family: 'Jost', sans-serif;
    text-align: center;
    overflow: hidden; /* Évite les barres de défilement pendant l'animation */
}

/* On stylise le conteneur du futur SVG */
#pathAnimation {
    width: 100%;
		min-width: 600px;
    max-width: 600px;
    /* margin-top: -100px; */
}

#pathAnimation svg {
    width: 100%;
    height: auto;
}

/* --- SECTION COORDONNÉES --- */
.contact-info {
    display: flex;
    justify-content: space-between;
    align-items: center;

    position: absolute;
    bottom: 50px;
    left: 50%;
    transform: translateX(-50%);

    width: 95%;
    max-width: 1100px;

    font-size: 1.1rem;
    font-weight: 300;
    letter-spacing: 1px;
}

.contact-item {
    flex: 1;
    padding: 0 15px;
    text-align: center; /* Assure le centrage du texte à l'intérieur de chaque bloc */
}

.contact-info a {
    color: #030303;
    text-decoration: none;
    transition: color 0.3s;
}

.contact-info a:hover { color: #7e6f5b; }

/* --- RESPONSIVE MOBILE --- */
@media (max-width: 768px) {
    body {
        display: block;
        height: auto;
        overflow-y: auto;
    }

    #pathAnimation {
        width: 100%;
				min-width: unset;
				max-width: 90%;
        margin: 60px auto;
        position: static;
        transform: none;
    }

    .contact-info {
        position: static; /* Repasse dans le flux normal */
        transform: none;
        display: block; /* Force le passage en une seule colonne */
        width: 100%;
        margin-top: 50px;
        padding-bottom: 40px;
    }

    .contact-item {
        margin-bottom: 20px; /* Espace entre les lignes en mobile */
        padding: 0;
    }
}

/* --- RESPONSIVE : Passage en 1 colonne à 1080px --- */
@media (max-width: 1080px) {
    body {
        display: block;
        height: auto;
        overflow-y: auto;
    }

    #pathAnimation {
        width: 100%;
        margin: 40px auto;
        position: static;
        transform: none;
    }

    .contact-info {
        position: static;
        transform: none;
        display: flex;
        flex-direction: column; /* Aligne les éléments verticalement */
        justify-content: center;
        width: 100%;
        margin: 50px auto; /* Centre le bloc entier horizontalement */
        padding-bottom: 40px;
    }

    .contact-item {
        margin-bottom: 25px;
        padding: 0;
        width: 100%; /* Prend toute la largeur pour bien centrer */
        text-align: center; /* Correction cruciale pour le centrage mobile */
    }
}
