/* ═══ BLOG — Page d'accueil (liste des articles) ═══ */
.blog-hero{background:linear-gradient(135deg,var(--color-bleu-fonce) 0%,#0f6e88 100%);color:var(--color-white);padding:var(--space-4xl) 0 var(--space-3xl);text-align:center}
.blog-hero__container{max-width:var(--container-max);margin-inline:auto;padding-inline:var(--space-lg)}
.blog-hero__eyebrow{font-family:var(--font-body);font-size:var(--text-paragraph);font-weight:600;color:var(--color-jaune);text-transform:uppercase;letter-spacing:0.05em;margin:0 0 var(--space-md)}
.blog-hero__title{font-size:clamp(2rem,4vw,3rem);line-height:var(--leading-tight);color:var(--color-white);margin:0 0 var(--space-md)}
.blog-hero__subtitle{font-size:clamp(1rem,1.5vw,1.125rem);line-height:var(--leading-relaxed);max-width:720px;margin:0 auto;opacity:0.9}

.blog-list{background-color:var(--color-white);padding:var(--space-4xl) 0}
.blog-list__container{max-width:var(--container-max);margin-inline:auto;padding-inline:var(--space-lg)}
.blog-list__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:var(--space-xl);list-style:none;padding:0;margin:0}

.blog-card{background-color:var(--color-white);border:1px solid var(--color-gray-200);border-radius:var(--radius-lg);overflow:hidden;display:flex;flex-direction:column;transition:transform 0.25s ease,box-shadow 0.25s ease,border-color 0.25s ease}
.blog-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-03);border-color:var(--color-jaune)}
.blog-card__link{color:inherit;text-decoration:none;display:flex;flex-direction:column;height:100%}
.blog-card__image{width:100%;height:200px;object-fit:cover;display:block;background-color:var(--color-gray-100)}
.blog-card__body{padding:var(--space-lg);display:flex;flex-direction:column;gap:var(--space-sm);flex:1}
.blog-card__meta{display:flex;gap:var(--space-md);font-family:var(--font-body);font-size:0.85rem;color:var(--color-gray-500);text-transform:uppercase;letter-spacing:0.05em}
.blog-card__category{color:var(--color-bleu-fonce);font-weight:700}
.blog-card__title{font-family:var(--font-heading);font-size:1.25rem;line-height:var(--leading-tight);color:var(--color-bleu-fonce);margin:0}
.blog-card__excerpt{font-family:var(--font-body);font-size:var(--text-paragraph);line-height:var(--leading-relaxed);color:var(--color-gray-500);margin:0;flex:1}
.blog-card__cta{display:inline-flex;align-items:center;gap:6px;margin-top:var(--space-sm);font-family:var(--font-body);font-weight:700;color:var(--color-jaune);text-transform:uppercase;font-size:0.85rem;letter-spacing:0.05em}
.blog-card__cta svg{width:14px;height:14px;transition:transform 0.2s ease}
.blog-card:hover .blog-card__cta svg{transform:translateX(4px)}

/* ═══ BLOG — Article individuel ═══ */
.article{background-color:var(--color-white);padding:var(--space-3xl) 0 var(--space-4xl)}
.article__container{max-width:760px;margin-inline:auto;padding-inline:var(--space-lg)}
.article__back{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-body);font-weight:600;color:var(--color-bleu-fonce);text-decoration:none;margin-bottom:var(--space-xl);transition:color 0.2s ease}
.article__back:hover{color:var(--color-jaune)}
.article__back svg{width:16px;height:16px}
.article__meta{display:flex;flex-wrap:wrap;gap:var(--space-md);font-family:var(--font-body);font-size:0.9rem;color:var(--color-gray-500);text-transform:uppercase;letter-spacing:0.05em;margin-bottom:var(--space-md)}
.article__category{color:var(--color-bleu-fonce);font-weight:700}
.article__title{font-family:var(--font-heading);font-size:clamp(1.875rem,4vw,2.75rem);line-height:var(--leading-tight);color:var(--color-jaune);margin:0 0 var(--space-md)}
.article__lead{font-family:var(--font-body);font-size:1.125rem;line-height:var(--leading-relaxed);color:var(--color-gray-700);margin:0 0 var(--space-xl)}
.article__cover{width:100%;height:auto;border-radius:var(--radius-lg);margin-bottom:var(--space-2xl);display:block}

.article__body{font-family:var(--font-body);font-size:1.05rem;line-height:1.75;color:var(--color-gray-700)}
.article__body h2{font-family:var(--font-heading);font-size:1.75rem;line-height:var(--leading-tight);color:var(--color-bleu-fonce);margin:var(--space-2xl) 0 var(--space-md);border-bottom:2px solid var(--color-jaune);padding-bottom:var(--space-sm)}
.article__body h3{font-family:var(--font-heading);font-size:1.3rem;line-height:var(--leading-tight);color:var(--color-bleu-fonce);margin:var(--space-xl) 0 var(--space-sm)}
.article__body p{margin:0 0 var(--space-md)}
.article__body ul,.article__body ol{margin:0 0 var(--space-md);padding-left:var(--space-xl)}
.article__body li{margin-bottom:var(--space-sm)}
.article__body a{color:var(--color-bleu-fonce);text-decoration:underline;text-decoration-color:var(--color-jaune);text-decoration-thickness:2px;text-underline-offset:3px;transition:color 0.2s ease}
.article__body a:hover{color:var(--color-jaune)}
.article__body strong{color:var(--color-bleu-fonce);font-weight:700}
.article__body blockquote{margin:var(--space-xl) 0;padding:var(--space-lg);background-color:rgba(229,185,6,0.08);border-left:4px solid var(--color-jaune);border-radius:var(--radius-md);font-style:italic;color:var(--color-gray-700)}
.article__body blockquote p:last-child{margin-bottom:0}
.article__body img{max-width:100%;height:auto;border-radius:var(--radius-md);margin:var(--space-lg) 0;display:block}
.article__body figure{margin:var(--space-lg) 0}
.article__body figure img{margin:0}
.article__body figcaption{font-size:0.9rem;color:var(--color-gray-500);text-align:center;margin-top:var(--space-sm);font-style:italic}

.article__cta{margin-top:var(--space-3xl);padding:var(--space-xl);background:linear-gradient(135deg,var(--color-bleu-fonce) 0%,#0f6e88 100%);border-radius:var(--radius-lg);text-align:center;color:var(--color-white)}
.article__cta h3{font-family:var(--font-heading);font-size:1.5rem;color:var(--color-jaune);margin:0 0 var(--space-sm);border:none;padding:0}
.article__cta p{margin:0 0 var(--space-lg);opacity:0.9}
.article__cta .btn{display:inline-block;padding:var(--space-md) var(--space-xl);background-color:var(--color-jaune);color:var(--color-white);border-radius:var(--radius-md);font-family:var(--font-body);font-weight:700;text-decoration:none;transition:transform 0.2s ease,box-shadow 0.2s ease}
.article__cta .btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-02)}

@media (max-width:640px){
  .blog-hero{padding:var(--space-3xl) 0 var(--space-2xl)}
  .blog-list{padding:var(--space-3xl) 0}
  .blog-card__image{height:160px}
  .article{padding:var(--space-2xl) 0 var(--space-3xl)}
  .article__body{font-size:1rem;line-height:1.7}
  .article__body h2{font-size:1.5rem}
}