<style>
  /* ===== BASE ===== */
  html, body { margin:0; padding:0; height:100%; }
  body {
    display:flex; flex-direction:column; min-height:100vh;
    font-family: Arial, sans-serif; font-size:14px; color:#63aeb5;
    background:#00646a url("/images/fond.jpg") center/cover no-repeat;
  }

  /* ===== STRUCTURE ===== */
  .page { display:flex; flex-direction:column; flex:1 0 auto; padding-top:50px; } /* ajuste 50px si ta bannière fixée est différente */
  .conteneur-blocs {
    flex:1 0 auto;
    max-width:700px;         /* ← largeur de lecture (mets 900/1100 selon goût) */
    margin:60px auto 0;       /* espace au-dessus */
    padding:0 20px;           /* respirations latérales */
    display:flex; flex-direction:column; gap:24px;
  }

  /* ===== BLOCS ===== */
  .bloc {
    background:#012326; border-radius:16px; padding:20px;
    box-shadow:0 0 10px #00000033; box-sizing:border-box;
  }
  .bloc h2 { margin:0 0 10px; font-size:18px; color:#bdf3f8; }
  .bloc h3 { margin:16px 0 8px; font-size:14px; color:#fff; } /* couleur des h3 */
  .bloc p  { margin:10px 0; line-height:1.55; }

  /* images responsive */
  img { max-width:100%; height:auto; }

  /* ===== FOOTER ===== */
  #menu-footer { margin-top:auto; display:block; } /* colle le footer en bas si page courte */

  /* (séparateurs éventuels non désirés) */
  hr { display:none; }
  .barre-partage { border-top:none; }
  

</style>