.separation-contenu {
    margin-top : 7rem;
}

.separation-contenu-legere {
    margin-top : 2rem;
}

.marge-pages {
    padding-left: var(--padding-marges-page);
    padding-right: var(--padding-marges-page);
}

.effecte-escura {
    border-radius: var(--force-bordures);
    overflow: hidden;
    box-shadow: var(--ombre-carte);
}

#presentation p {
    display: none;
}

/* Scroll-reveal : etat initial cache, declenche par animations.js */
[data-scroll-reveal] {
    opacity: 0;
    transform: translateY(2.5rem);
    transition:
        opacity 0.65s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
}

[data-scroll-reveal].visible {
    opacity: 1;
    transform: translateY(0);
}

/* Un element qui recoit le focus clavier doit etre visible sans attendre son animation
   d'apparition (cartes bento, cartes serveur...). */
[data-scroll-reveal]:focus-within,
[data-scroll-reveal]:focus-within :focus-within {
    opacity: 1;
    transform: none;
    transition: none;
}

@media (prefers-reduced-motion: reduce) {
    [data-scroll-reveal] {
        opacity: 1;
        transform: none;
        transition: none;
    }
}