@charset "utf-8";
/* ===================================================== */
/* STYLE-A-PROPOS.CSS — page simone-boulanger.html        */
/* Chargé APRÈS style-actualite.css : même fond et mêmes  */
/* couleurs que le bandeau des témoignages, et apparition */
/* douce des éléments à l'ouverture de la page.           */
/* Pour revenir à l'ancien style : retirer le lien vers   */
/* ce fichier (et le script a-propos.js) dans la page.    */
/* ===================================================== */

/* Fond : dégradé vert sombre du site, fixe pendant le défilement.
   Il s'arrête sur un vert moyen (pas le vert-gris clair) pour que
   le texte blanc reste lisible sur toute la largeur. */
html, body {
    background: #22302a;
}
body {
    background: linear-gradient(120deg, #1f2b26 0%, #2f4038 45%, #4f6158 100%) fixed;
    color: #fff;
}

#s2 {
    background: transparent;
    color: #fff;
}

/* Le pied de page garde ses couleurs sombres d'origine (le texte
   blanc de cette page ne doit pas s'y propager). */
la-footer, .footer {
    color: #4a3f3f;
}

/* Titre et sous-titre */
.s2-right h2 {
    color: #fff;
}
.s2-right h3 {
    margin: -6px 0 34px 0;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.6);
}

/* Texte */
#s2 .text-desktop {
    color: rgba(255, 255, 255, 0.88);
    font-weight: 300;
}

/* Photo : légère ombre pour la détacher du fond */
img.s2-leftimg {
    box-shadow: 0 22px 50px rgba(0, 0, 0, 0.35);
}

/* Bouton « En savoir + » (s'il est réactivé) */
.s2-linknav {
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.45);
}
.s2-linknav:hover {
    background: rgba(255, 255, 255, 0.26);
}

/* =============================== */
/* APPARITION À L'OUVERTURE        */
/* (seulement si le script est     */
/* actif : sans lui, tout reste    */
/* visible normalement)            */
/* =============================== */

.ap-anime .ap-element {
    opacity: 0;
    transform: translateY(26px);
    transition: opacity 1.1s ease, transform 1.1s cubic-bezier(.2, .7, .2, 1);
}

/* La photo arrive de la gauche */
.ap-anime .ap-element.ap-photo {
    transform: translateX(-40px);
}

.ap-anime .ap-element.ap-visible {
    opacity: 1;
    transform: none;
}

@media (prefers-reduced-motion: reduce) {
    .ap-anime .ap-element {
        opacity: 1;
        transform: none;
        transition: none;
    }
}