/* ==========================================================================
   Élagueur 45 — pages complémentaires : blog, articles, FAQ
   --------------------------------------------------------------------------
   Fichier séparé de style.css : la page d'accueil n'est pas modifiée.
   Il n'ajoute que ce qui manque au thème (liste d'articles, corps d'article,
   FAQ dépliable, liens de pied de page) et reprend les couleurs du site.
   ========================================================================== */

/* --- Filet de sécurité du préchargeur -------------------------------------
   main.js retire le préchargeur à l'événement « load ». Si cet événement
   n'arrive jamais (image très lente, script bloqué), l'écran d'attente
   masquerait tout le site : au bout de 2,5 s il se retire donc tout seul. */
#loading { animation: alg-preloader-off .3s linear 2.5s forwards; }
@keyframes alg-preloader-off {
  to { opacity: 0; visibility: hidden; pointer-events: none; }
}

/* --- La bannière de consentement passe devant le bouton WhatsApp ----------
   jswhat.js pose le bouton en z-index 999999 et cookieconsent en 9999 : sans
   cette règle le bouton recouvre la bannière. Tant que le visiteur n'a pas
   répondu, la demande de consentement doit rester au premier plan.
   pages.css est chargé après cookieconsent.min.css, la règle l'emporte donc
   sans avoir besoin de !important. */
.cc-window { z-index: 1000000; }

/* --- Menu principal : page courante -------------------------------------- */
.main-menu ul li > a.current { text-decoration: underline; text-underline-offset: 4px; }

/* --- Liens du pied de page ----------------------------------------------- */
.footer__nav {
  border-bottom: 1px solid rgba(255, 255, 255, .25);
  padding-bottom: 12px;
  margin-bottom: 18px;
}
.footer__nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.footer__nav li { margin: 0 15px; }
.footer__nav a { color: #fff; font-size: 14px; font-weight: 500; }
.footer__nav a:hover { color: #fff; text-decoration: underline; }
.footer__nav a.current { text-decoration: underline; }
@media (max-width: 575px) {
  .footer__nav li { margin: 0 9px; }
}

/* --- Bandeau de page (composant .page__title du thème) ------------------- */
.page__title {
  height: auto;
  min-height: 420px;
  padding-top: 90px;
  padding-bottom: 45px;
}
.page__title-inner h1 {
  font-size: 42px;
  line-height: 1.25;
  max-width: 950px;
  margin: 0 auto 14px;
  text-transform: none;
}
@media (max-width: 767px) {
  .page__title { min-height: 330px; padding-top: 80px; }
  .page__title-inner h1 { font-size: 26px; }
}

/* --- Liste d'articles ---------------------------------------------------- */
.blog__item {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #fff;
}
.blog__thumb { flex: none; height: 235px; }
.blog__thumb img { width: 100%; height: 235px; object-fit: cover; }
.blog__content { flex: 1 1 auto; padding: 26px 30px 30px; }
.blog__content h2,
.blog__content h3 { font-size: 20px; line-height: 1.4; margin-bottom: 0; }
.blog__content h2 a:hover,
.blog__content h3 a:hover { color: #00875e; }
.blog__thumb .blog__tag {
  position: absolute;
  right: 28px;
  bottom: 0;
  z-index: 2;
}
.blog__thumb .blog__tag a {
  display: block;
  min-width: 110px;
  white-space: nowrap;
  text-align: center;
  font-size: 13px;
  padding: 4px 14px;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(to right, #00875e 0%, #006b4a 100%);
}
.blog__excerpt { font-size: 15px; line-height: 25px; margin: 12px 0 0; }
.blog__more {
  display: inline-block;
  font-size: 14px;
  font-weight: 700;
  color: #00875e;
  margin-top: 14px;
}
.blog__more:hover { color: #1e1e2a; }
.blog__more i { margin-left: 6px; }

/* --- Corps d'article ----------------------------------------------------- */
.article__meta { display: flex; flex-wrap: wrap; justify-content: center; }
.article__meta span { color: #fff; font-size: 14px; font-weight: 700; margin: 0 12px; }
.article__meta i { margin-right: 6px; }
.article__thumb { margin-bottom: 32px; }
.article__thumb img { width: 100%; height: auto; }
.article__body { font-size: 17px; line-height: 30px; color: #4a4a4a; }
.article__body > p:first-child { font-size: 18px; line-height: 31px; color: #1e1e2a; }
.article__body h2 { font-size: 30px; line-height: 1.3; margin: 36px 0 14px; }
.article__body h3 { font-size: 22px; line-height: 1.35; margin: 26px 0 12px; }
.article__body p { margin-bottom: 18px; }
.article__body ul,
.article__body ol { margin: 0 0 20px 22px; padding: 0; }
.article__body li { margin-bottom: 9px; line-height: 28px; }
.article__body a { color: #00875e; text-decoration: underline; }
.article__body strong { color: #1e1e2a; }
.article__body .article__note {
  border-left: 4px solid #00a252;
  background: #f4faf6;
  padding: 18px 22px;
  margin: 0 0 24px;
  font-size: 16px;
  line-height: 27px;
  color: #4a4a4a;
}
@media (max-width: 767px) {
  .article__body { font-size: 16px; line-height: 28px; }
  .article__body h2 { font-size: 24px; }
  .article__body h3 { font-size: 20px; }
  .article__thumb { margin-bottom: 24px; }
}

/* --- FAQ dépliable ------------------------------------------------------- */
.faq__section { margin-bottom: 42px; }
.faq__section .section__title { margin-bottom: 22px; }
.faq__section .section__title h3 { font-size: 26px; line-height: 1.3; }
.faq__item { border: 2px solid #f7f7f7; background: #fff; margin-bottom: 14px; }
.faq__item[open] { border-color: #00a252; }
.faq__item summary {
  cursor: pointer;
  list-style: none;
  position: relative;
  padding: 20px 58px 20px 24px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.45;
  color: #1e1e2a;
}
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary::after {
  content: "+";
  position: absolute;
  right: 22px;
  top: 50%;
  margin-top: -14px;
  font-size: 26px;
  line-height: 28px;
  font-weight: 400;
  color: #00a252;
}
.faq__item[open] summary { color: #00875e; }
.faq__item[open] summary::after { content: "–"; }
.faq__answer { padding: 0 24px 20px; font-size: 16px; line-height: 28px; color: #4a4a4a; }
.faq__answer p { margin-bottom: 14px; }
.faq__answer p:last-child { margin-bottom: 0; }
.faq__answer strong { color: #1e1e2a; }
@media (max-width: 767px) {
  .faq__item summary { font-size: 16px; padding: 16px 50px 16px 18px; }
  .faq__answer { padding: 0 18px 18px; font-size: 15px; line-height: 26px; }
}

/* --- Colonne latérale --------------------------------------------------- */
.sidebar__box { background: #f7f7f7; padding: 30px; margin-bottom: 30px; }
.sidebar__box h3 { font-size: 21px; margin-bottom: 14px; }
.sidebar__box p { font-size: 15px; line-height: 26px; margin-bottom: 14px; }
.sidebar__box--vert { background: #00a252; }
.sidebar__box--vert h3,
.sidebar__box--vert p { color: #fff; }
.sidebar__box .r-btn { margin-top: 6px; }
.sidebar__list { list-style: none; margin: 0; padding: 0; }
.sidebar__list li { border-bottom: 1px solid #e6e6e6; }
.sidebar__list li:last-child { border-bottom: none; }
.sidebar__list a { display: block; padding: 12px 0; font-size: 15px; line-height: 23px; font-weight: 500; }
.sidebar__list a:hover { color: #00875e; }
.sidebar__communes { font-size: 15px; line-height: 27px; margin-bottom: 0; }

/* --- Bloc « à lire aussi » ---------------------------------------------- */
.readmore__item { border: 2px solid #f7f7f7; background: #fff; height: 100%; }
.readmore__item a { display: block; padding: 22px 24px; }
.readmore__item h3 { font-size: 17px; line-height: 1.45; margin-bottom: 0; }
.readmore__item:hover { border-color: #00a252; }
.readmore__item:hover h3 { color: #00875e; }

/* --- Titres de section centrés ------------------------------------------ */
.section__title--center { text-align: center; }
.section__title--center .section__pre-title {
  display: flex;
  justify-content: center;
  align-items: center;
}
