/* ===== Rubrique Articles onlee — sobre, dans la charte du site ===== */

.wrap-narrow{ max-width:720px; margin:0 auto; padding:0 var(--gutter); }

/* En-tête de rubrique */
.blog-hero{ padding:clamp(54px,8vw,104px) 0 clamp(20px,3vw,34px); }
.eyebrow{ font-size:11.5px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); margin-bottom:16px; }
.blog-hero h1{ font-family:var(--serif); font-weight:500; letter-spacing:-.02em; font-size:clamp(2.4rem,6vw,4rem); line-height:1.04; }
.blog-hero .lede{ margin-top:22px; max-width:620px; color:var(--muted); font-size:clamp(16.5px,1.5vw,19px); line-height:1.6; }

/* Liste des articles */
.blog-list{ padding-bottom:clamp(40px,7vw,96px); }
.post{ display:block; padding:30px 0; border-top:1px solid var(--line); transition:transform .3s var(--ease); }
.post:last-child{ border-bottom:1px solid var(--line); }
.post:hover{ transform:translateX(4px); }
.post-date{ font-size:13px; letter-spacing:.04em; color:var(--muted); text-transform:lowercase; }
.post-title{ font-family:var(--serif); font-weight:500; letter-spacing:-.015em; font-size:clamp(1.5rem,3vw,2.1rem); line-height:1.12; margin:10px 0 0; color:var(--ink); }
.post:hover .post-title{ color:var(--gold); }
.post-excerpt{ margin-top:12px; max-width:640px; color:var(--muted); font-size:16px; line-height:1.6; }
.post-more{ display:inline-block; margin-top:16px; font-size:14px; font-weight:600; color:var(--gold); }
.post-soon{ opacity:.5; pointer-events:none; }
.post-soon .post-more{ color:var(--muted); }

/* Fil d'Ariane */
.crumb{ padding-top:26px; font-size:13px; color:var(--muted); }
.crumb a{ color:var(--muted); }
.crumb a:hover{ color:var(--ink); }

/* En-tête d'article */
.art-head{ padding:clamp(22px,4vw,40px) 0 clamp(18px,3vw,30px); border-bottom:1px solid var(--line); }
.art-head h1{ font-family:var(--serif); font-weight:500; letter-spacing:-.02em; font-size:clamp(2rem,5vw,3.3rem); line-height:1.07; margin-top:14px; }
.art-meta{ margin-top:20px; font-size:13.5px; letter-spacing:.03em; color:var(--muted); }

/* Corps d'article — lecture longue */
.prose{ padding:clamp(30px,5vw,52px) var(--gutter) clamp(50px,8vw,96px); }
.prose > *{ max-width:720px; margin-left:auto; margin-right:auto; }
.prose .standfirst{ font-size:clamp(18px,1.8vw,21px); line-height:1.6; color:var(--ink); font-weight:500; }
.prose p{ margin-top:22px; font-size:17.5px; line-height:1.72; color:#20262F; }
.prose h2{ font-family:var(--serif); font-weight:500; letter-spacing:-.015em; font-size:clamp(1.5rem,3vw,2rem); line-height:1.15; margin-top:52px; }
.prose h3{ font-family:var(--sans); font-weight:600; font-size:1.18rem; margin-top:34px; color:var(--ink); }
.prose ul,.prose ol{ margin-top:18px; padding-left:22px; }
.prose li{ margin-top:10px; font-size:17.5px; line-height:1.66; color:#20262F; }
.prose li::marker{ color:var(--gold); }
.prose a{ color:var(--gold); text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px; }
.prose a:hover{ text-decoration-thickness:2px; }
.prose strong{ font-weight:600; color:var(--ink); }

/* Encadré « à retenir » */
.callout{ margin-top:38px; padding:24px 26px; background:var(--paper-2); border-left:3px solid var(--gold); border-radius:4px; }
.callout p{ margin-top:0; font-size:16.5px; line-height:1.62; color:var(--ink); }
.callout p + p{ margin-top:12px; }
.callout .callout-lab{ display:block; font-size:11px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--gold); margin-bottom:10px; }

/* Tableau comparatif sobre */
.cmp{ margin-top:30px; overflow-x:auto; }
.cmp table{ width:100%; border-collapse:collapse; font-size:16px; }
.cmp th,.cmp td{ text-align:left; padding:13px 16px; border-bottom:1px solid var(--line); vertical-align:top; line-height:1.5; }
.cmp th{ font-family:var(--sans); font-weight:600; color:var(--ink); background:var(--paper-2); }
.cmp td{ color:#20262F; }

/* FAQ */
.faq{ margin-top:22px; }
.faq details{ border-bottom:1px solid var(--line); }
.faq summary{ list-style:none; cursor:pointer; padding:18px 0; font-weight:600; font-size:17px; color:var(--ink); display:flex; justify-content:space-between; gap:16px; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; color:var(--gold); font-weight:400; font-size:22px; line-height:1; }
.faq details[open] summary::after{ content:"\2013"; }
.faq details p{ margin-top:0; padding-bottom:20px; max-width:none; font-size:16.5px; line-height:1.66; color:#20262F; }

/* Appel à l'action en fin d'article */
.cta{ margin-top:56px; padding:clamp(28px,4vw,42px); background:var(--ink); color:#fff; border-radius:10px; }
.cta h2{ color:#fff; margin-top:0; font-size:clamp(1.5rem,3vw,2rem); }
.cta p{ color:rgba(255,255,255,.72); margin-top:14px; max-width:none; }
.cta .cta-row{ margin-top:24px; display:flex; flex-wrap:wrap; gap:14px; align-items:center; }
.cta .price{ font-family:var(--serif); font-size:1.5rem; color:#fff; }
.cta .pill-solid{ background:var(--gold); color:#fff; }
.cta .pill-solid:hover{ background:var(--gold-hi); }

/* Liens vers les logiciels / services en fin d'article */
.more-links{ margin-top:48px; padding-top:30px; border-top:1px solid var(--line); }
.more-links .lab{ font-size:11.5px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); }
.more-links .ml-grid{ margin-top:18px; display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:14px; }
.more-links a{ display:block; padding:18px 20px; border:1px solid var(--line); border-radius:8px; transition:border-color .25s var(--ease), transform .25s var(--ease); }
.more-links a:hover{ border-color:var(--ink); transform:translateY(-2px); }
.more-links a b{ display:block; font-family:var(--serif); font-weight:500; font-size:1.15rem; color:var(--ink); }
.more-links a span{ display:block; margin-top:5px; font-size:14px; color:var(--muted); line-height:1.45; }