/* Blog / articles (listing + article). Extrait de articles.php (#5 maintenabilité). */
.lc-blog-shell{clear:both;width:100%;display:block;background:#f6f7f4}
.lc-blog-wrap{width:100%;max-width:1120px;margin:0 auto;padding:34px 16px 62px;box-sizing:border-box;clear:both;display:block}
.lc-blog-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:24px;padding:24px;border:1px solid #e1e6dc;border-radius:10px;background:linear-gradient(135deg,#fff,#f0f5ea);box-shadow:0 10px 28px rgba(32,47,38,.06)}
.lc-blog-head h1{font-size:36px;line-height:1.12;margin:0 0 8px;color:#173d35;border:0;padding:0;text-align:left;text-transform:none}
.lc-blog-head p{max-width:620px;margin:0;color:#59646d;font-size:16px;line-height:1.65}
.lc-blog-count{flex:0 0 auto;padding:8px 12px;border-radius:999px;background:#eaf3e3;color:#557f1f;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px}
.lc-blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.lc-blog-card{display:flex;flex-direction:column;background:#fff;border:1px solid #e1e6dc;border-radius:10px;overflow:hidden;text-decoration:none;color:inherit;min-height:100%;box-shadow:0 4px 16px rgba(32,47,38,.04);transition:transform .18s,border-color .18s,box-shadow .18s}
.lc-blog-card:hover{text-decoration:none;color:inherit;border-color:#9fbd69;box-shadow:0 12px 26px rgba(32,47,38,.1);transform:translateY(-2px)}
.lc-blog-card img{width:100%;aspect-ratio:16/9;object-fit:cover;background:#e9e6dc;display:block}
.lc-blog-card-body{padding:17px;display:flex;flex-direction:column;gap:8px;flex:1}
.lc-blog-card h2{font-size:19px;line-height:1.32;margin:0;color:#173d35;border:0;padding:0;text-align:left;text-transform:none}
.lc-blog-card time,.lc-article-meta{display:block;color:#728071;font-size:12px;margin:0;font-weight:700;text-transform:uppercase;letter-spacing:.35px}
.lc-blog-card p{font-size:14px;line-height:1.6;margin:0;color:#3f4752}
.lc-article{background:#fff;border:1px solid #e1e6dc;border-radius:10px;padding:30px;display:block;clear:both;box-shadow:0 10px 28px rgba(32,47,38,.06)}
.lc-article-hero{width:100%;max-height:460px;object-fit:cover;border-radius:6px;margin:12px 0 24px;background:#eee}
.lc-article-content{font-size:18px;line-height:1.75;text-align:left}
.lc-article-content img{max-width:100%;height:auto}
.lc-article-content h2,.lc-article-content h3{color:#173d35;margin-top:1.6em}
/* Article « plein cadre » (pages au design sur-mesure : à propos, légales…) */
.lc-blog-wrap:has(.lc-article-fullbleed){max-width:none;padding:0}
.lc-article-fullbleed{width:100%}
.lc-cats{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 18px}
.lc-cat{background:#edf4f1;color:#24594e;border-radius:999px;padding:5px 10px;font-size:12px}
.lc-back{display:inline-block;margin-bottom:18px;color:#176b5a;font-weight:700}
@media(max-width:840px){.lc-blog-head{display:block}.lc-blog-count{display:inline-block;margin-top:14px}.lc-blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.lc-blog-wrap{padding:22px 10px 46px}.lc-blog-head{padding:18px}.lc-blog-grid{grid-template-columns:1fr}.lc-article{padding:18px}.lc-article-content{font-size:16px}.lc-blog-head h1{font-size:28px}}
/* Mobile : le blog (listing + article) occupe toute la largeur — on
   neutralise l'empilement container/row/col qui rognait ~62px de chaque côté. */
@media(max-width:640px){
  .lc-blog-page .container{padding-left:0;padding-right:0;max-width:none;width:100%}
  .lc-blog-page .row{margin-left:0;margin-right:0}
  .lc-blog-page .lc-blog-shell{margin:0;padding:0;width:100%}
  .lc-blog-wrap{width:100%;max-width:none;padding:18px 12px 46px}
  .lc-article{padding:18px 14px}
}

/* ── Mode nuit (html.lc-dark) — thématise listing + article via les tokens ── */
html.lc-dark .lc-blog-shell{background:var(--lc-bg)}
html.lc-dark .lc-blog-head{
  background:linear-gradient(135deg,var(--lc-surface),var(--lc-surface-2));
  border-color:var(--lc-line);box-shadow:0 10px 28px rgba(0,0,0,.32)
}
html.lc-dark .lc-blog-head h1{color:var(--lc-ink)}
html.lc-dark .lc-blog-head p{color:var(--lc-ink-soft)}
html.lc-dark .lc-blog-count{background:var(--lc-green-tint);color:var(--lc-green)}
html.lc-dark .lc-blog-card{background:var(--lc-surface);border-color:var(--lc-line);box-shadow:0 4px 16px rgba(0,0,0,.28)}
html.lc-dark .lc-blog-card:hover{border-color:var(--lc-green)}
html.lc-dark .lc-blog-card img{background:var(--lc-surface-2)}
html.lc-dark .lc-blog-card h2{color:var(--lc-ink)}
html.lc-dark .lc-blog-card p{color:var(--lc-ink-soft)}
html.lc-dark .lc-blog-card time,
html.lc-dark .lc-article-meta{color:var(--lc-ink-faint)}
html.lc-dark .lc-article{background:var(--lc-surface);border-color:var(--lc-line);box-shadow:0 10px 28px rgba(0,0,0,.32);color:var(--lc-ink)}
html.lc-dark .lc-article-content{color:var(--lc-ink)}
html.lc-dark .lc-article-content h2,
html.lc-dark .lc-article-content h3{color:var(--lc-ink)}
html.lc-dark .lc-cat{background:var(--lc-green-tint);color:var(--lc-green)}
html.lc-dark .lc-back{color:var(--lc-green)}