/* --- CONFIGURATION GÉNÉRALE --- */
html { scroll-behavior: smooth !important; }
body { 
    font-family: 'Georgia', serif; 
    background-color: #0b0b0b; 
    color: #ccc; 
    line-height: 1.8; 
    margin: 0; padding: 0; 
}

/* --- NAVIGATION --- */
nav { 
    background: rgba(0,0,0,0.95); padding: 20px 0; 
    border-bottom: 1px solid #1a1a1a; position: sticky; top: 0; z-index: 1000; 
}
.nav-container { 
    max-width: 1100px; margin: 0 auto; display: flex; 
    justify-content: space-between; align-items: center; padding: 0 20px; 
}
.site-title { color: #fff; text-transform: uppercase; letter-spacing: 4px; font-weight: bold; }
.nav-links a { 
    color: #777; margin-left: 20px; text-decoration: none; 
    text-transform: uppercase; font-size: 0.75em; letter-spacing: 2px; transition: 0.3s; 
}
.nav-links a:hover { color: #fff; }

/* --- STRUCTURE DES SECTIONS (CENTRAGE TOTAL) --- */
section { 
    max-width: 1000px; margin: 80px auto; padding: 0 20px; 
}

.content-text { 
    max-width: 800px; margin: 120px auto; 
    border-top: 1px solid #1a1a1a; padding-top: 80px;
    display: flex; flex-direction: column; align-items: center; /* Centre tout horizontalement */
    text-align: center; /* Centre le texte à l'intérieur des paragraphes */
}

h2 { 
    color: #fff; text-transform: uppercase; letter-spacing: 5px; 
    margin-bottom: 40px; font-weight: normal; width: 100%;
}

.content-text p { width: 100%; max-width: 750px; margin-bottom: 20px; }

/* --- EXCEPTIONS POUR L'INTRO --- */
.intro-section { border-top: none !important; margin-top: 50px !important; }
.intro-quote { font-style: italic; font-size: 1.4em; color: #fff; }

/* --- EXCEPTION POUR QUI JE SUIS (ALIGNE À GAUCHE) --- */
.qui-container { 
    display: flex; gap: 40px; align-items: flex-start; 
    text-align: left !important; width: 100%;
}
.qui-photo { flex: 0 0 220px; }
.qui-photo img { width: 100%; border: 1px solid #333; filter: grayscale(50%); }
.qui-text { flex: 1; text-align: left !important; }
.qui-text p { text-align: left !important; margin: 0; }

/* --- GRILLE GALERIE --- */
.grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 30px; }
.album-card { width: 280px; text-align: center; }
.album-card img { 
    width: 100%; height: 350px; object-fit: cover; 
    filter: grayscale(100%); transition: 0.6s; border: 1px solid #1a1a1a; 
}
.album-card:hover img { filter: grayscale(0%); transform: scale(1.02); }
.album-card p { color: #666; text-transform: uppercase; font-size: 0.8em; margin-top: 15px; }

/* --- FORMULAIRE --- */
.contact-form { display: flex; flex-direction: column; gap: 15px; width: 100%; max-width: 500px; margin-top: 30px; }
.contact-form input, .contact-form textarea { background: #111; border: 1px solid #222; padding: 12px; color: #fff; font-family: inherit; }
.contact-form button { background: #fff; color: #000; border: none; padding: 15px; cursor: pointer; text-transform: uppercase; }

footer { text-align: center; padding: 80px; color: #444; font-size: 0.8em; border-top: 1px solid #1a1a1a; }

/* Mobile */
@media (max-width: 768px) {
    .qui-container { flex-direction: column; align-items: center; text-align: center !important; }
    .qui-text, .qui-text p { text-align: center !important; }
    .nav-container { flex-direction: column; gap: 10px; }
}
h2 { 
    color: #fff; 
    text-transform: uppercase; 
    letter-spacing: 5px; 
    margin-bottom: 60px; 
    font-weight: normal; 
    width: 100%;          /* Prend toute la largeur */
    text-align: center;   /* Centre le texte à l'intérieur */
    display: block;       /* S'assure qu'il se comporte comme un bloc entier */
}