body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    margin: 0; 
    background-color: #788f46;
}

main {
    text-align: center;
	background-color: rgba(255, 255, 255, 0.85);
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 8px 16px rgba(0,0,0,0.1);
    margin: 20px 100px;
    flex: 1;
}

main p, span {
    text-align: justify;
}

/* Utilities: centrer du texte et centrer des blocs (images) */
.text-center {
    text-align: center;
}

.center-block {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/* Centrer un bloc de contenu avec largeur limitée (utile pour paragraphes centraux) */
.centered-content {
    max-width: 100ch; /* largeur de lecture confortable */
    margin-left: auto;
    margin-right: auto;
    text-align: justify; /* texte justifié */
    text-justify: inter-word;
}

/* Règles génériques pour éléments affichables/masquables (utilisés par toggleTexte) */
.dropdown-child { display: none; margin-top: 0.5rem; }
.dropdown-child.show { display: block; }

/* Styles génériques pour bouton toggle utilisé dans first-bdd.html */
.dropdown { text-align: left; margin: 0.5rem 0; }
.mainmenubtn {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    background: #8B5E3C;
    color: #fff;
    padding: 10px 14px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 700;
}
.mainmenubtn[aria-expanded="true"] { background: #5A381E; }
.mainmenubtn .chevron { width: 1.2rem; height: 1.2rem; transform: rotate(0deg); transition: transform 0.25s ease; }
.mainmenubtn[aria-expanded="true"] .chevron { transform: rotate(180deg); }

@media screen and (max-width: 768px) {
    main {
        margin: 20px 20px;
    }
}