/* Défilement doux vers les ancres nommées */
html {
    scroll-behavior: smooth;
}

/* Respect du choix des utilisateurs qui réduisent les animations */
@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
}

/* ANDAROU PELLIKOV — HTML + CSS uniquement */
/* 1. COULEURS ET TYPOGRAPHIE */
body { background: #e5e2dc; color: #171717; font-family: 'Roboto Condensed', Arial, sans-serif; }
p { font-size: 15px; line-height: 1.55; }
h1, h2 { font-weight: 500; }
a:hover { color: #ae2927; }

/* 2. CONTENEUR CENTRAL : 1200 PX */
#container { width: 1200px; margin: 35px auto; background: #f3f0e9; }

/* 3. GRILLE : TROIS COLONNES IDENTIQUES DE 400 PX */
.colonne { width: 400px; float: left; padding: 35px; }
.ligne::after { content: ""; display: block; clear: both; }
.ligne { border-bottom: 1px solid #bcb8b0; }
.colonne + .colonne { border-left: 1px solid #bcb8b0; }
.numero { display: block; font-size: 11px; letter-spacing: 2px; margin-bottom: 30px; color: #a22d2a; }
.souligne { width: 35px; height: 2px; background: #ae2927; margin: 25px 0; }

/* 4. EN-TÊTE */
header { min-height: 200px; }
header .colonne { height: 200px; }
.logo { font-size: 72px; line-height: 1; letter-spacing: -8px; }
.logo span { color: #ae2927; }
.signature { margin-top: 14px; font-size: 11px; letter-spacing: 1.5px; }
nav a { display: block; font-size: 15px; letter-spacing: 2px; margin: 9px 0; }
.meta { font-size: 13px; letter-spacing: 2px; text-align: right; }

/* 5. BIOGRAPHIE */
#biographie .colonne { min-height: 555px; }
#biographie h1 { font-size: 51px; line-height: .98; letter-spacing: -1px; margin-bottom: 35px; }
#biographie p { max-width: 290px; margin-bottom: 18px; }
.photo-biographie { padding: 0; }
.photo-biographie img { width: 400px; height: 555px; object-fit: cover; filter: grayscale(100%); }
.citation { margin-top: 130px; font-size: 23px; line-height: 1.3; }

/* 6. ARCHIVES */
#archives .colonne { min-height: 565px; }
#archives img { width: 330px; height: 245px; object-fit: cover; filter: grayscale(100%); }
#archives h2 { font-size: 27px; margin-top: 22px; margin-bottom: 10px; }
#archives .legende { font-size: 12px; letter-spacing: 1px; }
details { margin-top: 22px; border-top: 1px solid #bcb8b0; padding-top: 15px; }
summary { cursor: pointer; font-size: 13px; letter-spacing: 1px; }
details p { margin-top: 15px; }

/* 7. CONTACT */
#contact .colonne { min-height: 355px; }
#contact h2 { font-size: 48px; }
#contact img { width: 330px; height: 245px; object-fit: cover; filter: grayscale(100%); }
#contact .colonne:last-child { padding-top: 85px; }

/* 8. PIED DE PAGE */
footer .colonne { min-height: 105px; font-size: 12px; letter-spacing: 1px; }
footer .colonne:last-child { text-align: right; }

/* Version pédagogique : mise en page desktop fixe à 1200 px. */