/* Blog : gabarit des pages-réponses (site.css + reponses.css), plus la lecture longue. */
.footer-liens{align-items:flex-start;margin-top:28px;padding-top:24px;border-top:1px solid #e8c49530}.footer-liens>div{display:flex;flex-direction:column;gap:8px;font-size:14px;flex:1}.footer-liens .footer-titre{font-size:12px;letter-spacing:.08em;text-transform:uppercase;opacity:.7;margin:0 0 4px}.footer-liens a,.footer-liens span{display:inline-block;padding:4px 0}@media(max-width:650px){.footer-liens{align-items:center}.footer-liens>div{align-items:center}}

/* Variables de l'ancien blog encore lues par les <style> et style="" des articles */
.blog-page{--astral-blanc:#fff7e8;--astral-blanc-off:#f0e5d5;--astral-blanc-card:#fffaf2;--astral-border:#dac8af;--astral-encre:#2c1a12;--astral-encre-clair:#2c1a12;--astral-encre-70:#71573f;--astral-muted:#8a6d52;--astral-brun:#5c3d31;--astral-chataigne:#9a6139;--astral-chataigne-clair:#c89370;--radius-sm:6px;--radius-md:12px;--radius-lg:14px;--font-serif:Figtree,Arial,sans-serif;--font-sans:Figtree,Arial,sans-serif}

/* Haut de page */
.blog-hero{min-height:600px}
.blog-page .blog-hero .answer-hero-copy{padding-top:230px}
.blog-page .blog-hero h1{font-size:31px;max-width:24ch;margin-bottom:18px}
.blog-hero .article-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;font-size:13px;line-height:1.5;color:#edddc7;margin:0 0 26px;max-width:52ch}
.blog-hero .article-meta .author{color:#fff7e8;font-weight:500}
.blog-hero .article-meta .dot{width:3px;height:3px;border-radius:50%;background:currentColor;opacity:.7}
.blog-hero .article-meta time{white-space:nowrap}
.blog-index-hero{min-height:520px}
.blog-page .blog-index-hero .answer-hero-copy{padding-top:220px}

/* Colonne de lecture */
.blog-content{max-width:800px}
.blog-content .fil li:last-child{min-width:0}
.article-body{font-size:17px;line-height:1.75;color:#2c1a12;overflow-wrap:break-word}
.article-body>*:first-child{margin-top:0}
.article-body p{margin:0 0 20px}
.article-body p+p{margin-top:0}
.article-body h2{max-width:none;font-size:27px;line-height:1.15;font-weight:500;letter-spacing:-.7px;margin:48px 0 18px;padding-top:30px;border-top:1px solid #dac8af;text-wrap:balance}
.article-body h3{font-size:20px;line-height:1.25;font-weight:600;letter-spacing:-.2px;margin:32px 0 12px}
.article-body ul,.article-body ol{margin:0 0 22px;padding-left:22px}
.article-body li{margin-bottom:10px}
.article-body li::marker{color:#9a6139}
.article-body strong{font-weight:600}
.article-body a{color:#7c4a26;text-decoration:underline;text-decoration-color:#c8937099;text-underline-offset:4px}
.article-body a:hover{text-decoration-color:currentColor}
.article-body sup{line-height:0}
.article-body sup a{text-decoration:none}
.article-body svg.infographic-svg{display:block;max-width:100%;height:auto;margin:32px auto}
.article-body svg text{font-family:Figtree,Arial,sans-serif}

/* Encadrés, chiffres, mises en garde : mêmes cartes que les pages-réponses */
.article-body .highlight-box,.article-body .cta-mid,.article-body .red-flag,.article-body .auteur{margin:30px 0;padding:22px 22px 4px;background:#f0e5d5;border:1px solid #e6d7c2;border-radius:12px;font-size:16px;line-height:1.65}
.article-body .highlight-box{border-left:4px solid #9a6139}
.article-body .red-flag{border-left:4px solid #8f3b25}
.article-body .auteur{padding-bottom:22px}
.article-body .auteur p{margin:0}
.article-body .cta-mid{padding:24px 22px;text-align:center}
.article-body .cta-mid p{font-size:18px;font-weight:500;margin:0 0 16px}
.article-body .stat-grid{display:grid;gap:12px;margin:30px 0}
.article-body .stat-card{padding:20px 22px;background:#f0e5d5;border:1px solid #e6d7c2;border-radius:12px}
.article-body .stat-card .num{display:block;font-size:34px;line-height:1.1;font-weight:500;letter-spacing:-1px;color:#9a6139;margin-bottom:6px}
.article-body .stat-card .lbl{display:block;font-size:14px;line-height:1.5;color:#71573f}
.article-body .sources{margin-top:48px;padding-top:24px;border-top:1px solid #dac8af;font-size:14px;line-height:1.6;color:#71573f}
.article-body .sources h3{font-size:15px;font-weight:600;margin:0 0 12px;color:#2c1a12}
.article-body .sources li{margin-bottom:6px}
.article-body .tableau{overflow-x:auto;margin:28px 0;-webkit-overflow-scrolling:touch}
.article-body table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.5}
.article-body th,.article-body td{text-align:left;vertical-align:top;padding:10px 12px;border-bottom:1px solid #dac8af}
.article-body th{font-weight:600;background:#f0e5d5}
.article-body .legende,.article-body .avertissement{font-size:14px;color:#71573f}
.article-body .cta-inline{text-align:center;margin:32px 0}

/* Boutons des articles : ceux du site */
.blog-page .btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:14px 26px;border:0;border-radius:99px;background:#341b10;color:#fff5e8;font:700 15px/1.3 Figtree,Arial,sans-serif;text-align:center;text-decoration:none;cursor:pointer}
.blog-page .btn:hover{background:#4a2918}
.article-body a.btn{color:#fff5e8;text-decoration:none}

/* Encadré de fin : le bloc dégustation des pages-réponses */
.blog-page .cta-end{margin:48px 0 0;padding:44px 24px;background:#2c190e;color:#fff4e5;border-radius:18px;text-align:center}
.blog-page .cta-end h3{font-size:28px;line-height:1.12;font-weight:500;letter-spacing:-.8px;max-width:620px;margin:0 auto 16px;text-wrap:balance}
.blog-page .cta-end p{color:#dfc9aa;font-size:16px;line-height:1.55;max-width:560px;margin:0 auto 24px}
.blog-page .cta-end .btn{width:100%;max-width:390px;min-height:56px;background:linear-gradient(150deg,#fff0d4,#eac895);color:#291b10;box-shadow:inset 0 2px 2px #fff9eccc,0 9px 24px #09050233;font-size:14px}

/* Articles liés : la liste « Pour aller plus loin » */
.blog-page .related{margin-top:56px;padding:34px 24px 44px}
.blog-page .related h2{max-width:752px;margin:0 auto 12px;font-size:26px;line-height:1.15;font-weight:500;letter-spacing:-.6px}
.blog-page .related-grid{max-width:752px;margin:0 auto;display:grid}
.blog-page .related a.related-card{border-bottom:1px solid #d9c7ae;padding:16px 30px 16px 0}
.blog-page .related-card .cat{font-size:11px;letter-spacing:1.6px;text-transform:uppercase;color:#977453;margin-bottom:4px}
.blog-page .related-card h3{font-size:16px;line-height:1.45;font-weight:500;margin:0}

/* Index : recherche, filtres, cartes */
.blog-toolbar{display:grid;gap:16px;margin:0 0 28px}
.blog-search{width:100%;max-width:420px;min-height:50px;padding:0 20px;border:1px solid #dac8af;border-radius:99px;background:#fffaf2;color:#2c1a12;font-size:16px}
.blog-search::placeholder{color:#8a6d52}
.blog-search:focus{outline:2px solid #9a6139;outline-offset:2px}
.blog-filters{display:flex;flex-wrap:wrap;gap:8px}
.filter-chip{min-height:40px;padding:8px 16px;border:1px solid #dac8af;border-radius:99px;background:transparent;color:#5a3d27;font-size:14px;font-weight:500}
.filter-chip:hover{border-color:#9a6139}
.filter-chip.active{background:#341b10;border-color:#341b10;color:#fff5e8}
.blog-grid{display:grid;gap:18px}
.blog-card{display:flex;flex-direction:column;background:#f0e5d5;border:1px solid #e6d7c2;border-radius:14px;overflow:hidden;text-decoration:none;color:#2c1a12}
.blog-card-image{aspect-ratio:4/3;background:#2c190e;overflow:hidden}
.blog-card-image img{width:100%;height:100%;object-fit:cover}
.blog-card-body{display:flex;flex-direction:column;flex:1;padding:20px 22px 22px}
.blog-card .cat{font-size:11px;letter-spacing:1.6px;text-transform:uppercase;color:#977453;margin-bottom:10px}
.blog-card h2{max-width:none;font-size:21px;line-height:1.2;font-weight:500;letter-spacing:-.4px;margin:0 0 10px;text-wrap:balance}
.blog-card p{font-size:15px;line-height:1.55;color:#71573f;margin:0 0 18px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.blog-card-footer{margin-top:auto;display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 12px;font-size:13px;color:#71573f}
.blog-card-footer .read{color:#2c1a12;font-weight:600}
.blog-card:hover h2{text-decoration:underline;text-underline-offset:4px}
.blog-card:focus-visible{outline:3px solid #b9814b;outline-offset:3px}
.empty-state{padding:40px 0;text-align:center;color:#71573f}
.pagination{display:flex;justify-content:center;gap:8px;margin:32px 0 0}
.pagination a,.pagination span{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;border:1px solid #dac8af;border-radius:99px;font-size:14px;font-weight:600;text-decoration:none}
.pagination .current{background:#341b10;border-color:#341b10;color:#fff5e8}
.blog-index-content{padding-bottom:56px}

@media(min-width:700px){.blog-grid{grid-template-columns:1fr 1fr}.article-body .stat-grid{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}}
@media(min-width:800px){
 .blog-hero{min-height:620px}
 .blog-page .blog-hero .answer-hero-copy{padding-top:170px;padding-bottom:64px}
 .blog-page .blog-hero h1{font-size:clamp(38px,3.5vw,54px);max-width:21ch;margin-bottom:22px}
 .blog-hero .article-meta{font-size:14px;margin-bottom:32px}
 .blog-index-hero{min-height:560px}
 .blog-page .blog-index-hero .answer-hero-copy{padding-top:170px}
 .blog-content{padding-left:40px;padding-right:40px}
 .article-body{font-size:18px}
 .article-body h2{font-size:33px;letter-spacing:-.9px;margin-top:56px}
 .article-body h3{font-size:22px}
 .article-body .highlight-box,.article-body .cta-mid,.article-body .red-flag{padding:26px 30px 6px}
 .article-body .cta-mid{padding:28px 30px}
 .blog-page .cta-end{padding:60px 48px}
 .blog-page .cta-end h3{font-size:38px;letter-spacing:-1.2px}
 .blog-page .related{padding:44px 40px 56px}
 .blog-page .related h2{font-size:28px}
 .blog-page .related-grid{grid-template-columns:1fr 1fr;gap:0 32px}
 .blog-toolbar{grid-template-columns:minmax(260px,360px) 1fr;align-items:start}
}
@media(min-width:1080px){.blog-grid{grid-template-columns:repeat(3,1fr)}}
