/*

1. Add your custom Css styles below
2. Place the this code in your template:

 <link href="css/custom.css" rel="stylesheet">

*/

/* =============================================
   Blog — Améliorations UI/UX
   ============================================= */

/* Lien retour vers le blog */
.back-to-blog {
  display: inline-block;
  margin-bottom: 22px;
  color: #888;
  font-size: .88em;
  letter-spacing: .02em;
  transition: color .2s;
}
.back-to-blog:hover { color: #333; }
.back-to-blog i { margin-right: 6px; }

/* Post-meta dans les articles */
.post-meta { margin-bottom: 24px; }
.post-meta span { margin-right: 16px; font-size: .88em; color: #888; }
.post-meta span i { margin-right: 4px; }
.post-meta .post-meta-category a { color: #888; }
.post-meta .post-meta-category a:hover { color: #0055a4; }

/* Article à la une — badge secondaire sur l'image */
.post-item.be-featured .post-item-description h2 {
  font-size: 1.45em;
  font-weight: 700;
}

/* Navigation prev/next */
.post-navigation { margin-top: 40px; margin-bottom: 10px; }

/* Tags — ajout d'un label */
.post-tags { margin-top: 30px; margin-bottom: 10px; }
.post-tags a { margin: 0 4px 6px 0; }

/* Pages locales — icon-box égale hauteur, bouton aligné en bas, non étiré */
.row-cards > [class*="col-"] { display: flex; }
.row-cards .icon-box.effect.medium {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  text-align: center;
}
.row-cards .icon-box.effect.medium h3 { margin-left: 0; margin-right: 0; }
.row-cards .icon-box.effect.medium p  { margin-left: 0; margin-right: 0; }
.row-cards .icon-box.effect.medium .icon { margin: 0 auto 22px; }
.row-cards .icon-box.effect.medium .btn {
  margin-top: auto;
  align-self: center;
}

/* Section "À lire aussi" — post-item compact */
.post-item .post-item-description h5 { font-size: 1em; line-height: 1.4; margin-top: 8px; }
.post-item .post-item-description h5 a { color: #333; }
.post-item .post-item-description h5 a:hover { color: #0055a4; }