/* French Communiqué styling — mirrors /communique/communique.css (mobile-ready)
   This file focuses on fluid layout for content that originates from Markdown. */
.comm-wrap{ box-sizing:border-box; width:100%; max-width:860px; margin:20px auto; padding:0 15px; }
.comm-wrap .readMore{ display:inline-block; margin-bottom:12px; color:#2a5db0; text-decoration:none; }
.comm-wrap h1{ font-size:1.6em; margin:8px 0; }
.comm-date{ color:#666; font-size:0.95em; margin-bottom:12px; }
#comm-body{ font-size:16px; line-height:1.6; color:#333; word-wrap:break-word; overflow-wrap:anywhere; }

/* Images/media scale to container */
#comm-body img, #comm-body iframe, #comm-body video { max-width:100%; height:auto; display:block; margin:1rem 0; }

/* Tables become fluid and readable on small screens */
#comm-body table{ width:100%; max-width:100%; border-collapse:collapse; }
#comm-body th, #comm-body td{ word-break:break-word; padding:0.45rem; }
#comm-body pre{ white-space:pre-wrap; overflow:auto; }

@media screen and (max-width:768px){
  .comm-wrap{ padding:0 12px; margin:16px 10px; }
  .comm-wrap h1{ font-size:1.4em; }
  #comm-body{ font-size:15px; }
}

@media screen and (max-width:480px){
  .comm-wrap{ padding:0 10px; margin:12px 8px; }
  .comm-wrap h1{ font-size:1.2em; }
  #comm-body{ font-size:15px; line-height:1.4; }
}