.marge20 { margin-top:20px; }
 .plan {
     margin-top:20px;
     display : inline-block;
     border-style: solid;
 }

#logoACA {
    /* 2026-07-16 : position:absolute retiré (refonte simplifiée de la nav,
       .aca-navbar-brand est maintenant un flex item, plus besoin de sortir
       le logo du flux). Hauteur : nouveau fichier logoACA.png haute
       résolution (944×1124px), l'ancien logoACA.jpg n'existait même pas sur
       disque (image cassée), donc aucune taille "actuelle" à préserver —
       choisie pour s'insérer dans la navbar Bootstrap standard
       (min-height:50px). */
    height: 44px;
    width: auto;
}

/* Carrousel : contrainte STRICTE (2026-07-25, retour de Corentin après
   test réel de `cover` — rognait trop, ex. photo portrait avec mains/corps
   coupés) : ne JAMAIS rogner ni déformer une photo, quitte à l'afficher
   plus petite dans son cadre (object-fit: contain, avec un fond gris clair
   qui comble les espaces vides — pas de letterboxing "moche", un vrai
   choix de mise en page). La hauteur RÉELLE du cadre est désormais
   réglable par article (voir .aca-article-hauteur--hN, design-system.css,
   et ArticleEntity::getClasseHauteur()/getStyleHauteurMin()) plutôt que
   fixée uniformément à 420px pour tout le monde : cette règle de base
   (420px = fraction 1/4, le repli par défaut) ne s'applique QUE si
   l'article n'a rien réglé — voir le chantier "Hauteur" pour le détail.
   Scopé sur la CLASSE .carousel (pas l'ID #myCarousel du widget statique
   historique, galerie Images) : s'applique uniformément à tout carrousel
   du site, qu'il vienne du widget historique ou d'un bloc BlockNote
   inséré dans un article (id unique par instance, aca-carousel-{uuid}). */
.carousel .carousel-inner .item {
    height: 420px;
    overflow: hidden;
    background-color: #f5f5f5;
}
.carousel .carousel-inner .item img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center center;
}
/* Mode plein écran mobile "stories" (pause autoplay/swipe/pinch-zoom
   manuel, aca-carousel-mobile.js) retiré au chantier "visionneuse média",
   Lot I (2026-08-14, dernier lot) : le carrousel mobile redevient un
   carrousel normal (mêmes règles qu'en desktop, .carousel .carousel-inner
   .item ci-dessus) — cliquable vers medias.voir (Lot G), qui gère lui-même
   zoom/pinch/molette/prev-suivant sur sa propre page (aca-media-viewer.js,
   Lot B). Remplace ENTIÈREMENT l'ancien système, plus de traitement
   spécifique <768px. */

/* Retire la marge basse de 60px héritée de carousel.css (2026-07-25) :
   boilerplate de l'exemple Bootstrap d'origine (pensé pour un hero
   plein écran), jamais un choix de design propre à ce site — redondante
   avec la marge normale entre cartes (.aca-card { margin-bottom: 1.5rem })
   quand le carrousel est imbriqué dans une carte (bloc BlockNote importé
   sur une page), et créait un espace vide disgracieux sous le carrousel,
   surtout visible en bas. */
.carousel {
    margin-bottom: 0;
}

/* Paragraphes vides invisibles (2026-07-25) : quand un article contient un
   bloc de contenu qui n'est PAS du texte (ex. le carrousel), le HTML brut
   exporté par l'éditeur est un <div> imbriqué dans le <p>...</p> que les
   vues PHP ajoutent systématiquement autour de contenuSansTitre — invalide
   en HTML (un <p> ne peut pas contenir de <div>), donc le navigateur
   referme le <p> tout seul à cet endroit ET garde le <p></p> vide qui
   suivait déjà dans le contenu (paragraphe laissé par l'éditeur après
   l'insertion du bloc) — résultat, un ou deux paragraphes vides
   avant/après le bloc, chacun avec sa propre marge par défaut, d'où
   l'espace vide constaté au-dessus ET (surtout) en dessous du carrousel.
   Les masquer entièrement est sans risque : un <p> vide n'affiche jamais
   rien d'utile. */
.aca-card p:empty {
    display: none;
}

/* Indicateurs de pagination plus discrets (petits points semi-transparents). */
.carousel .carousel-indicators li {
    width: 6px;
    height: 6px;
    margin: 3px;
    background-color: rgba(255, 255, 255, 0.4);
    border-color: rgba(255, 255, 255, 0.6);
}
.carousel .carousel-indicators .active {
    width: 8px;
    height: 8px;
    margin: 2px;
    background-color: rgba(255, 255, 255, 0.85);
    border-color: rgba(255, 255, 255, 0.85);
}