/* --- BASE (Ordinateur) --- */

.cv-section {
    margin: 10em 15%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 5em; /* 20em était beaucoup trop grand, 5em est plus sûr */
}

p {
    text-align: justify;
}

.img-cv {
    display: flex;
    justify-content: center;
    margin-top: 2rem; 
    margin-bottom: 10rem; 
}

.cv-image {
    max-width: 50%; /* Parfait pour un écran d'ordinateur */
    height: auto;
    border-radius: 8px; 
    box-shadow: 0px 0px 20px var(--color-03); 
}


/* --- RESPONSIVE TABLETTE --- */
@media (max-width: 1024px) {
    .cv-section {
        margin: 8em 10%;
    }

    .cv-image {
        max-width: 70%; /* On agrandit un peu le CV pour compenser la taille de l'écran */
    }
}


/* --- RESPONSIVE MOBILE --- */
@media (max-width: 768px) {
    .cv-section {
        flex-direction: column; /* On empile le titre et le sous-titre */
        margin: 7em 5%;
        gap: 2rem;
        text-align: center; /* On centre le texte */
    }

    p {
        text-align: center; /* Annule le justifié pour ce sous-titre sur mobile */
    }

    .img-cv {
        margin-bottom: 5rem; /* Réduit le grand vide sous le CV */
    }

    .cv-image {
        max-width: 95%; /* Indispensable pour que ton CV reste lisible sur un smartphone ! */
    }
}