/* ===================== ARTICLE ROY HABITAT ===================== */
:root{--art:#E85D2F;--art-dark:#C44A1F;--cat:#B83719;--cat2:#FF8C42;--grad-premium:linear-gradient(135deg,#E8502F 0%,#FF6B35 55%,#C44A1F 100%);--grad-orange-flow:linear-gradient(110deg,#E8502F 0%,#FF8C42 27%,#FFA45C 50%,#FF8C42 73%,#E8502F 100%)}
.art-progress{position:fixed;top:0;left:0;height:3px;width:0;z-index:1000;background:var(--grad-premium);box-shadow:0 0 10px color-mix(in srgb,var(--art) 50%,transparent);transition:width .08s linear}

/* HERO */
.art-hero{position:relative;overflow:hidden;padding:150px 0 36px;background:radial-gradient(760px 460px at 86% -14%,color-mix(in srgb,var(--cat) 16%,transparent),transparent 60%),radial-gradient(520px 400px at 4% 6%,color-mix(in srgb,var(--art) 13%,transparent),transparent 64%),linear-gradient(165deg,#FFFFFF 0%,color-mix(in srgb,var(--art) 7%,#fff) 52%,color-mix(in srgb,var(--art) 14%,#fff) 100%)}
.art-hero::before{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background-image:radial-gradient(rgba(26,20,16,.05) 1px,transparent 1.7px);background-size:26px 26px;-webkit-mask-image:radial-gradient(130% 90% at 50% 2%,#000 26%,transparent 76%);mask-image:radial-gradient(130% 90% at 50% 2%,#000 26%,transparent 76%);opacity:.5}
.art-hero-in{position:relative;z-index:2;max-width:860px}
.art-bc{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:13px;color:var(--gris-texte);margin-bottom:18px;font-weight:600}
.art-bc a:hover{color:var(--orange)}
.art-bc .crt{color:var(--texte);font-weight:700}
.art-tag{display:inline-flex;align-items:center;gap:6px;color:#fff;padding:7px 15px;border-radius:100px;font-family:'Sora',sans-serif;font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;margin-bottom:18px;background:linear-gradient(135deg,color-mix(in srgb,var(--cat2) 62%,transparent),color-mix(in srgb,var(--cat) 42%,transparent));backdrop-filter:blur(16px) saturate(1.7);-webkit-backdrop-filter:blur(16px) saturate(1.7);border:1px solid rgba(255,255,255,.45);box-shadow:0 8px 22px color-mix(in srgb,var(--cat) 28%,transparent),inset 0 1px 0 rgba(255,255,255,.5);text-shadow:0 1px 3px rgba(0,0,0,.25)}
.art-h1{font-family:'Sora',sans-serif;font-weight:800;font-size:clamp(30px,4.4vw,50px);line-height:1.08;letter-spacing:-.02em;color:var(--texte);margin:0 0 18px}
.art-lead{font-size:18px;line-height:1.65;color:var(--gris-texte);max-width:760px;margin:0 0 24px}
.art-meta{display:flex;align-items:center;flex-wrap:wrap;gap:14px;font-size:13.5px;color:var(--gris-texte);font-weight:600}
.art-author{display:flex;align-items:center;gap:10px;font-family:'Sora',sans-serif;font-weight:700;color:var(--texte)}
.art-avatar{width:40px;height:40px;border-radius:50%;overflow:hidden;box-shadow:0 4px 14px rgba(26,20,16,.22);flex:0 0 auto}
.art-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.art-meta .dot{width:3px;height:3px;border-radius:50%;background:#CFC7BD}

/* LAYOUT */
.art-main{padding:34px 0 70px;background:var(--creme)}
.art-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:46px;align-items:start}
.art-cover{position:relative;border-radius:24px;overflow:hidden;box-shadow:var(--shadow-strong);border:1px solid rgba(26,20,16,.08);margin-bottom:30px}
.art-cover img{width:100%;height:clamp(185px,27vw,300px);object-fit:cover;display:block}
.art-cover-cap{position:absolute;left:0;right:0;bottom:0;padding:30px 22px 14px;background:linear-gradient(180deg,transparent,rgba(15,8,5,.62));color:rgba(255,255,255,.92);font-size:12.5px;font-style:italic}

/* BODY */
.art-body{font-size:16.5px;line-height:1.78;color:#3A332D}
.art-body>p{margin:0 0 20px}
.art-body strong{color:var(--texte);font-weight:700}
.art-body a:not(.art-btn):not(.art-readalso):not(.art-chip){color:var(--art-dark);font-weight:600;border-bottom:1.5px solid color-mix(in srgb,var(--art) 28%,transparent);transition:all .2s}
.art-body a:not(.art-btn):not(.art-readalso):not(.art-chip):hover{color:var(--art);border-bottom-color:var(--art)}
.art-body h2{font-family:'Sora',sans-serif;font-size:clamp(23px,3vw,30px);font-weight:800;letter-spacing:-.015em;color:var(--texte);margin:46px 0 16px;padding-top:24px;border-top:1px solid rgba(26,20,16,.1);scroll-margin-top:96px}
.art-body h2:first-of-type{border-top:0;padding-top:0;margin-top:8px}
.art-body h2 .h2num{font-family:'Sora',sans-serif;font-size:14px;font-weight:800;color:var(--art);margin-right:10px;vertical-align:middle}
.art-body h3{font-family:'Sora',sans-serif;font-size:19.5px;font-weight:800;color:var(--texte);margin:30px 0 10px;scroll-margin-top:96px}
.art-body ul,.art-body ol{margin:0 0 20px;padding-left:6px;list-style:none}
.art-body li{position:relative;padding-left:28px;margin-bottom:11px;line-height:1.7}
.art-body ul li::before{content:'';position:absolute;left:6px;top:11px;width:8px;height:8px;border-radius:50%;background:var(--grad-premium);box-shadow:0 0 0 4px color-mix(in srgb,var(--art) 12%,transparent)}
.art-body ol{counter-reset:ol}
.art-body ol li{counter-increment:ol}
.art-body ol li::before{content:counter(ol);position:absolute;left:0;top:1px;width:22px;height:22px;border-radius:7px;background:var(--art);color:#fff;font-family:'Sora',sans-serif;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center}

/* Encadré "L'essentiel" */
.art-key{position:relative;overflow:hidden;background:linear-gradient(165deg,rgba(255,255,255,.96),color-mix(in srgb,var(--art) 8%,#fff));border:1px solid color-mix(in srgb,var(--art) 20%,transparent);border-radius:20px;padding:24px 26px;margin:0 0 30px;box-shadow:var(--shadow-soft)}
.art-key-t{display:flex;align-items:center;gap:9px;font-family:'Sora',sans-serif;font-size:12px;font-weight:800;color:var(--art-dark);text-transform:uppercase;letter-spacing:.08em;margin:0 0 14px}
.art-key ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:11px}
.art-key li{position:relative;padding-left:30px;margin:0;font-size:14.8px;line-height:1.55}
.art-key li::before{content:'✓';position:absolute;left:0;top:0;width:20px;height:20px;border-radius:6px;background:var(--grad-premium);color:#fff;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;box-shadow:none}

/* Figures */
.art-fig{margin:28px 0;border-radius:20px;overflow:hidden;border:1px solid rgba(26,20,16,.08);box-shadow:var(--shadow-soft)}
.art-fig img{width:100%;display:block;aspect-ratio:16/9;object-fit:cover}
.art-fig figcaption{padding:12px 18px;font-size:13px;color:var(--gris-texte);font-style:italic;background:#fff}

/* Exemple concret */
.art-ex{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start;background:linear-gradient(135deg,color-mix(in srgb,var(--art) 8%,#fff),color-mix(in srgb,var(--art) 16%,#fff));border:1px solid color-mix(in srgb,var(--art) 28%,transparent);border-radius:18px;padding:20px 22px;margin:26px 0}
.art-ex-ic{width:42px;height:42px;border-radius:12px;background:var(--grad-premium);color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;box-shadow:0 8px 20px color-mix(in srgb,var(--art) 30%,transparent)}
.art-ex-tx strong{display:block;font-family:'Sora',sans-serif;font-size:13px;font-weight:800;color:var(--art-dark);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}
.art-ex-tx p{margin:0;font-size:14.6px;line-height:1.65;color:#5A4A40}
.art-ex-tx p+p{margin-top:8px}

/* Callouts info / warn */
.art-callout{display:grid;grid-template-columns:auto 1fr;gap:14px;padding:17px 20px;margin:26px 0;border-radius:16px;background:linear-gradient(135deg,color-mix(in srgb,var(--art) 9%,#fff),#fff 130%);border:1px solid color-mix(in srgb,var(--art) 24%,transparent)}
.art-callout-ic{width:36px;height:36px;border-radius:10px;background:var(--grad-premium);color:#fff;display:flex;align-items:center;justify-content:center;font-size:18px;flex:0 0 auto}
.art-callout p{margin:0;font-size:14.5px;line-height:1.65}
.art-callout.warn{background:linear-gradient(135deg,#FDF0E8,#fff 130%);border-color:#F5CDB4}
.art-callout.warn .art-callout-ic{background:linear-gradient(180deg,#D85020,#B9410E)}

/* Lire aussi */
.art-readalso{position:relative;display:flex;align-items:center;gap:14px;padding:14px 18px;margin:26px 0;background:#fff;border:1px solid rgba(26,20,16,.1);border-left:4px solid var(--art);border-radius:0 16px 16px 0;text-decoration:none;color:inherit;transition:all .2s}
.art-readalso:hover{background:color-mix(in srgb,var(--art) 7%,#fff);transform:translateX(3px);box-shadow:var(--shadow-soft)}
.art-readalso-ic{width:38px;height:38px;border-radius:10px;background:color-mix(in srgb,var(--art) 10%,transparent);display:flex;align-items:center;justify-content:center;font-size:18px;flex:0 0 auto}
.art-readalso-tx{display:flex;flex-direction:column;gap:1px;min-width:0}
.art-readalso-lb{font-family:'Sora',sans-serif;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:var(--art)}
.art-readalso-tx strong{font-family:'Sora',sans-serif;font-size:14.5px;font-weight:700;color:var(--texte);line-height:1.3}
.art-readalso-ar{margin-left:auto;color:var(--art);font-size:18px;font-weight:800;flex:0 0 auto}

/* Tableau */
.art-tablewrap{margin:26px 0;border-radius:16px;overflow:hidden;border:1px solid rgba(26,20,16,.1);box-shadow:var(--shadow-soft);overflow-x:auto}
.art-table{width:100%;border-collapse:collapse;font-size:14.5px;background:#fff;min-width:420px}
.art-table th{background:var(--grad-premium);color:#fff;padding:13px 16px;text-align:left;font-family:'Sora',sans-serif;font-weight:800;font-size:11.5px;text-transform:uppercase;letter-spacing:.04em}
.art-table td{padding:12px 16px;border-top:1px solid rgba(26,20,16,.08);vertical-align:top}
.art-table tr:nth-child(even) td{background:#FBF6F1}
.art-table td strong{color:var(--art-dark)}

/* Simulateur COP interactif */
.art-calc{position:relative;overflow:hidden;background:linear-gradient(160deg,#2B1812 0%,#1B0F09 100%);border-radius:24px;padding:30px;margin:32px 0;color:#fff;box-shadow:var(--shadow-strong)}
.art-calc::before{content:'';position:absolute;top:-80px;right:-60px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--art) 40%,transparent),transparent 70%);filter:blur(10px);pointer-events:none}
.art-calc>*{position:relative;z-index:1}
.art-calc-badge{display:inline-flex;align-items:center;gap:6px;background:var(--grad-premium);color:#fff;font-family:'Sora',sans-serif;font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;padding:6px 13px;border-radius:100px;margin-bottom:14px;box-shadow:0 8px 20px color-mix(in srgb,var(--art) 40%,transparent)}
.art-calc h3{font-family:'Sora',sans-serif;font-size:21px;font-weight:800;color:#fff;margin:0 0 8px;line-height:1.25}
.art-calc-head p{font-size:14px;color:rgba(255,255,255,.62);margin:0 0 22px;line-height:1.6}
.art-calc-tval{display:flex;align-items:baseline;gap:8px;margin-bottom:6px}
.art-calc-tval span{font-family:'Sora',sans-serif;font-size:34px;font-weight:800;color:#FFB088;line-height:1}
.art-calc-tval small{font-size:13px;color:rgba(255,255,255,.6);font-weight:600}
.art-calc input[type=range]{width:100%;-webkit-appearance:none;appearance:none;height:8px;border-radius:100px;background:linear-gradient(90deg,#3E85C0,#E0A21A,var(--art));outline:none;margin:8px 0 6px}
.art-calc input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;border-radius:50%;background:#fff;border:3px solid var(--art);cursor:pointer;box-shadow:0 4px 12px rgba(0,0,0,.4)}
.art-calc input[type=range]::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:#fff;border:3px solid var(--art);cursor:pointer}
.art-calc-scale{display:flex;justify-content:space-between;font-size:11px;color:rgba(255,255,255,.45);font-weight:600;margin-bottom:22px}
.art-calc-out{display:grid;gap:18px}
.art-calc-cop{text-align:center;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:18px}
.art-calc-cop .lbl{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:rgba(255,255,255,.55);font-weight:700;margin-bottom:4px}
.art-calc-cop strong{display:block;font-family:'Sora',sans-serif;font-size:48px;font-weight:800;background:var(--grad-orange-flow);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;line-height:1;animation:blogFlow 6s ease infinite}
.art-calc-cop .unit{display:block;font-size:13px;color:rgba(255,255,255,.7);margin-top:8px}
.art-calc-cop .unit b{color:#FFB088}
.art-calc-bars{display:flex;flex-direction:column;gap:12px}
.art-calc-bar{display:grid;grid-template-columns:108px 1fr auto;align-items:center;gap:12px}
.art-calc-bar .bl{font-size:12.5px;color:rgba(255,255,255,.72);font-weight:600}
.art-calc-bar .track{height:14px;border-radius:100px;background:rgba(255,255,255,.1);overflow:hidden}
.art-calc-bar .fill{height:100%;border-radius:100px;transition:width .25s ease}
.art-calc-bar .fill.elec{background:rgba(255,255,255,.3)}
.art-calc-bar .fill.pac{background:var(--grad-premium)}
.art-calc-bar .bv{font-family:'Sora',sans-serif;font-size:13px;font-weight:800;color:#fff;white-space:nowrap}
.art-calc-note{font-size:11.5px;color:rgba(255,255,255,.5);line-height:1.5;margin:4px 0 0}
.art-calc-note strong{color:rgba(255,255,255,.78)}
@keyframes blogFlow{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}

/* CTA inline */
.art-cta{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;background:var(--grad-premium);border-radius:20px;padding:24px 28px;margin:30px 0;box-shadow:0 18px 44px color-mix(in srgb,var(--art) 30%,transparent)}
.art-cta::before{content:'';position:absolute;top:-70px;right:-50px;width:200px;height:200px;border-radius:50%;background:rgba(255,255,255,.16);pointer-events:none}
.art-cta-tx{position:relative;z-index:1;min-width:0}
.art-cta-tx strong{display:block;font-family:'Sora',sans-serif;font-size:18px;font-weight:800;color:#fff;margin-bottom:4px}
.art-cta-tx span{font-size:14px;color:rgba(255,255,255,.9);line-height:1.5}
.art-btn{position:relative;z-index:1;display:inline-flex;align-items:center;gap:8px;flex:0 0 auto;font-family:'Sora',sans-serif;font-weight:700;font-size:14.5px;text-decoration:none;padding:13px 24px;border-radius:12px;background:#fff;color:var(--art-dark);box-shadow:0 8px 20px rgba(0,0,0,.18);transition:transform .2s,box-shadow .2s}
.art-btn:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(0,0,0,.24)}

/* FAQ */
.art-faq{margin:24px 0 8px;display:flex;flex-direction:column;gap:11px}
.art-faq details{background:#fff;border:1px solid rgba(26,20,16,.1);border-radius:14px;overflow:hidden;transition:border-color .2s,box-shadow .2s}
.art-faq details[open]{border-color:color-mix(in srgb,var(--art) 40%,transparent);box-shadow:var(--shadow-soft)}
.art-faq summary{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 20px;cursor:pointer;font-family:'Sora',sans-serif;font-weight:700;font-size:15px;color:var(--texte);list-style:none}
.art-faq summary::-webkit-details-marker{display:none}
.art-faq summary::after{content:'+';font-size:22px;font-weight:400;color:var(--art);transition:transform .25s;flex:0 0 auto}
.art-faq details[open] summary::after{transform:rotate(45deg)}
.art-faq summary:hover{color:var(--art)}
.art-faq-a{padding:0 20px 18px;font-size:14.5px;line-height:1.7;color:#4A413A}
.art-faq-a p{margin:0}

/* Auteur */
.art-authorbox{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid rgba(26,20,16,.1);border-radius:20px;padding:20px 22px;margin:32px 0}
.art-authorbox .av{width:60px;height:60px;border-radius:50%;overflow:hidden;flex:0 0 auto;box-shadow:var(--shadow-soft)}
.art-authorbox .av img{width:100%;height:100%;object-fit:cover}
.art-authorbox .nm{font-family:'Sora',sans-serif;font-weight:800;font-size:16px;color:var(--texte)}
.art-authorbox .ro{font-size:13px;color:var(--art);font-weight:700;margin:1px 0 5px}
.art-authorbox .bi{font-size:13.5px;color:var(--gris-texte);line-height:1.55;margin:0}

/* Partage */
.art-share{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:28px 0;padding:18px 0;border-top:1px solid rgba(26,20,16,.1);border-bottom:1px solid rgba(26,20,16,.1)}
.art-share-lb{font-family:'Sora',sans-serif;font-weight:800;font-size:13px;color:var(--texte);margin-right:4px}
.art-share a,.art-share button{display:inline-flex;align-items:center;gap:7px;border:1px solid rgba(26,20,16,.12);background:#fff;color:var(--texte);font-family:'Manrope',sans-serif;font-weight:600;font-size:13px;padding:9px 15px;border-radius:100px;cursor:pointer;text-decoration:none;transition:all .2s}
.art-share a:hover,.art-share button:hover{border-color:var(--art);color:var(--art);transform:translateY(-1px)}
.art-share svg{width:15px;height:15px}
.art-share .copied{border-color:#4F8A1E;color:#4F8A1E}

.art-credit{font-size:12.5px;color:var(--gris-texte);font-style:italic;margin-top:24px}

/* SIDEBAR */
.art-side{position:sticky;top:96px;display:flex;flex-direction:column;gap:18px}
.art-toc{background:#fff;border:1px solid rgba(26,20,16,.1);border-radius:18px;padding:20px}
.art-toc-t{font-family:'Sora',sans-serif;font-size:11px;font-weight:800;color:var(--gris-texte);text-transform:uppercase;letter-spacing:.09em;margin:0 0 12px;display:flex;align-items:center;gap:8px}
.art-toc ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px;counter-reset:toc}
.art-toc li{counter-increment:toc}
.art-toc a{display:flex;gap:10px;align-items:baseline;padding:8px 10px;border-radius:9px;font-size:13px;font-weight:600;color:var(--gris-texte);text-decoration:none;line-height:1.4;transition:all .18s}
.art-toc a::before{content:counter(toc,decimal-leading-zero);font-family:'Sora',sans-serif;font-size:10px;font-weight:800;color:var(--art);flex:0 0 auto}
.art-toc a:hover{background:color-mix(in srgb,var(--art) 7%,#fff);color:var(--art-dark)}
.art-toc a.active{background:var(--grad-premium);color:#fff}
.art-toc a.active::before{color:rgba(255,255,255,.85)}
.art-sidecta{position:relative;overflow:hidden;background:linear-gradient(160deg,#2B1812,#1B0F09);border-radius:18px;padding:22px;color:#fff}
.art-sidecta::before{content:'';position:absolute;top:-50px;right:-40px;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--art) 40%,transparent),transparent 70%);filter:blur(8px)}
.art-sidecta>*{position:relative;z-index:1}
.art-sidecta strong{display:block;font-family:'Sora',sans-serif;font-size:16px;font-weight:800;margin-bottom:7px;line-height:1.3}
.art-sidecta p{font-size:13px;color:rgba(255,255,255,.66);line-height:1.6;margin:0 0 16px}
.art-sidecta-b{display:flex;flex-direction:column;gap:8px}
.art-sidecta-b a{display:flex;align-items:center;justify-content:center;gap:8px;font-family:'Sora',sans-serif;font-weight:700;font-size:13.5px;padding:12px 16px;border-radius:11px;text-decoration:none;transition:transform .2s}
.art-sidecta-b a.p{background:var(--grad-premium);color:#fff;box-shadow:0 8px 20px color-mix(in srgb,var(--art) 34%,transparent)}
.art-sidecta-b a.s{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.2)}
.art-sidecta-b a:hover{transform:translateY(-2px)}
.art-next{background:#fff;border:1px solid rgba(26,20,16,.1);border-radius:18px;padding:18px 20px}
.art-next-t{font-family:'Sora',sans-serif;font-size:11px;font-weight:800;color:var(--gris-texte);text-transform:uppercase;letter-spacing:.09em;margin:0 0 12px}
.art-next a{display:flex;gap:12px;align-items:center;padding:9px 0;text-decoration:none;color:inherit;border-top:1px solid rgba(26,20,16,.07)}
.art-next a:first-of-type{border-top:0;padding-top:2px}
.art-next-th{width:42px;height:42px;border-radius:11px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;font-size:18px;background:color-mix(in srgb,var(--cat) 10%,transparent)}
.art-next-th.pv{background:rgba(79,138,30,.12)}
.art-next-tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.art-next-tx strong{font-family:'Sora',sans-serif;font-size:13px;font-weight:700;color:var(--texte);line-height:1.3}
.art-next a:hover .art-next-tx strong{color:var(--art)}
.art-next-tx span{font-size:11px;color:var(--gris-texte);font-weight:600}

/* Articles liés */
.art-rel{padding:60px 0 76px;background:#fff;border-top:1px solid rgba(26,20,16,.06)}
.art-rel-h{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:28px}
.art-rel-h h2{font-family:'Sora',sans-serif;font-size:clamp(24px,3.2vw,32px);font-weight:800;color:var(--texte);margin:0;letter-spacing:-.01em}
.art-rel-h h2 em{font-style:normal;background:var(--grad-orange-flow);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:blogFlow 6s ease infinite}
.art-rel-all{font-family:'Sora',sans-serif;font-weight:700;font-size:14px;color:var(--art);text-decoration:none;white-space:nowrap}
.art-rel-all:hover{color:var(--art-dark)}
.art-rel-g{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.art-relcard{--a:var(--cat);display:flex;flex-direction:column;background:#fff;border:1px solid rgba(26,20,16,.08);border-radius:22px;overflow:hidden;text-decoration:none;color:inherit;box-shadow:0 2px 10px rgba(26,20,16,.05);transition:transform .35s,box-shadow .35s,border-color .35s}
.art-relcard[data-cat=pv]{--a:#4F8A1E}.art-relcard[data-cat=elec]{--a:#B47C06}.art-relcard[data-cat=plomb]{--a:#2C6FA6}
.art-relcard:hover{transform:translateY(-6px);box-shadow:var(--shadow-strong);border-color:color-mix(in srgb,var(--a) 35%,transparent)}
.art-relcard-img{position:relative;aspect-ratio:16/10;overflow:hidden;background:#241812}
.art-relcard-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.22,1,.36,1)}
.art-relcard:hover .art-relcard-img img{transform:scale(1.07)}
.art-relcard .tg{position:absolute;top:13px;left:13px;display:inline-flex;align-items:center;gap:6px;color:#fff;padding:6px 13px;border-radius:100px;font-family:'Sora',sans-serif;font-size:10.5px;font-weight:800;letter-spacing:.04em;backdrop-filter:blur(16px) saturate(1.7);-webkit-backdrop-filter:blur(16px) saturate(1.7);border:1px solid rgba(255,255,255,.42);box-shadow:0 6px 20px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.5);text-shadow:0 1px 3px rgba(0,0,0,.32);background:linear-gradient(135deg,color-mix(in srgb,var(--a) 62%,transparent),color-mix(in srgb,var(--a) 40%,transparent))}
.art-relcard-bd{display:flex;flex-direction:column;gap:9px;padding:20px 22px 22px;flex-grow:1}
.art-relcard-meta{font-size:11px;color:#A89F95;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.art-relcard h3{font-family:'Sora',sans-serif;font-size:17px;font-weight:800;line-height:1.32;color:var(--texte);margin:0;letter-spacing:-.01em;transition:color .25s}
.art-relcard:hover h3{color:var(--a)}
.art-relcard-ft{margin-top:auto;padding-top:14px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid rgba(26,20,16,.07);font-family:'Sora',sans-serif;font-size:12.5px;font-weight:800;color:var(--a)}
.art-relcard-ar{width:30px;height:30px;border-radius:9px;background:var(--a);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:13px;transition:transform .25s}
.art-relcard:hover .art-relcard-ar{transform:translateX(4px)}

/* Retour en haut */
.art-totop{position:fixed;right:26px;bottom:26px;z-index:90;width:48px;height:48px;border-radius:50%;border:none;cursor:pointer;background:var(--grad-premium);color:#fff;font-size:20px;box-shadow:0 12px 30px color-mix(in srgb,var(--art) 40%,transparent);opacity:0;visibility:hidden;transform:translateY(12px);transition:all .3s}
.art-totop.show{opacity:1;visibility:visible;transform:none}
.art-totop:hover{transform:translateY(-3px)}

@media(max-width:1024px){
  .art-grid{grid-template-columns:minmax(0,1fr);gap:30px}
  .art-side{position:relative;top:0;flex-direction:column}
  .art-toc{order:-1}
  .art-rel-g{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
  .art-hero{padding:124px 0 30px}
  .art-lead{font-size:16px}
  .art-main{padding:26px 0 56px}
  .art-cta{flex-direction:column;align-items:flex-start}
  .art-calc{padding:22px}
  .art-calc-bar{grid-template-columns:88px 1fr auto;gap:8px}
  .art-rel-g{grid-template-columns:1fr}
  .art-totop{right:16px;bottom:16px}
}
@media(prefers-reduced-motion:reduce){
  .art-rel-h h2 em,.art-calc-cop strong{animation:none}
  html{scroll-behavior:auto}
}
html{scroll-behavior:smooth}
/* ===== Header compact en lecture d'article (normal en haut, se reduit au scroll) ===== */
body.single-post .logo-img{transition:height .3s ease}
body.single-post #header .btn-contact{transition:padding .3s ease,font-size .3s ease}
body.single-post #header.scrolled{padding:6px 0}
body.single-post #header.scrolled .logo-img{height:24px}
body.single-post #header.scrolled .nav-link{font-size:13.5px;padding:8px 13px}
body.single-post #header.scrolled .nav-link .nav-chev{transform:scale(.88)}
body.single-post #header.scrolled .btn-contact{padding:9px 17px;font-size:13.5px}
body.single-post #header.scrolled .btn-contact svg{width:15px;height:15px}


/* ===== Palette métier appliquée au body (header + article uniformes) ===== */
body.metier-pv      {--art:#4F8A1E;--art-dark:#3A6815;--cat:#4F8A1E;--cat2:#A6CE5A;--grad-premium:linear-gradient(135deg,#A6CE5A 0%,#4F8A1E 60%,#3A6815 100%);--grad-orange-flow:linear-gradient(110deg,#4F8A1E 0%,#A6CE5A 50%,#4F8A1E 100%)}
body.metier-chauf   {--art:#E85D2F;--art-dark:#C44A1F;--cat:#B83719;--cat2:#FF8C42;--grad-premium:linear-gradient(135deg,#E8502F 0%,#FF6B35 55%,#C44A1F 100%);--grad-orange-flow:linear-gradient(110deg,#E8502F 0%,#FF8C42 27%,#FFA45C 50%,#FF8C42 73%,#E8502F 100%)}
body.metier-elec    {--art:#B47C06;--art-dark:#8A5E04;--cat:#B47C06;--cat2:#F4B92A;--grad-premium:linear-gradient(135deg,#F4B92A 0%,#B47C06 60%,#8A5E04 100%);--grad-orange-flow:linear-gradient(110deg,#B47C06 0%,#F4B92A 50%,#B47C06 100%)}
body.metier-plomb   {--art:#2C6FA6;--art-dark:#1F5180;--cat:#2C6FA6;--cat2:#5BD0F0;--grad-premium:linear-gradient(135deg,#5BD0F0 0%,#2C6FA6 60%,#0E7BA3 100%);--grad-orange-flow:linear-gradient(110deg,#0E7BA3 0%,#1E9CC9 27%,#5BD0F0 50%,#1E9CC9 73%,#0E7BA3 100%)}
body.metier-aides   {--art:#6D4FA8;--art-dark:#4A3578;--cat:#6D4FA8;--cat2:#C4B0E8;--grad-premium:linear-gradient(135deg,#C4B0E8 0%,#6D4FA8 60%,#4A3578 100%);--grad-orange-flow:linear-gradient(110deg,#6D4FA8 0%,#C4B0E8 50%,#6D4FA8 100%)}
body.metier-stockage{--art:#2F4C82;--art-dark:#1E3358;--cat:#2F4C82;--cat2:#8AA6D8;--grad-premium:linear-gradient(135deg,#8AA6D8 0%,#2F4C82 60%,#1E3358 100%);--grad-orange-flow:linear-gradient(110deg,#2F4C82 0%,#8AA6D8 50%,#2F4C82 100%)}
body.metier-conseil {--art:#E85D2F;--art-dark:#C44A1F;--cat:#B83719;--cat2:#FF8C42;--grad-premium:linear-gradient(135deg,#E8502F 0%,#FF6B35 55%,#C44A1F 100%);--grad-orange-flow:linear-gradient(110deg,#E8502F 0%,#FF8C42 27%,#FFA45C 50%,#FF8C42 73%,#E8502F 100%)}

/* Menu : survol générique aux couleurs du métier de l'article (lit --art posé sur le body) */
.nav-link:hover{background:color-mix(in srgb,var(--art) 14%,#fff);color:var(--art-dark)}
.nav-link:hover .nav-chev{color:var(--art-dark)}

/* ===== Header : masquage directionnel (scroll bas = logo seul ; scroll haut = menu complet) ===== */
body.single-post .nav-links-desktop,
body.single-post .nav-bar .btn-contact,
body.single-post .nav-burger{transition:opacity .22s ease,max-width .42s cubic-bezier(.22,1,.36,1),margin .32s ease,padding .32s ease,transform .25s ease}
body.single-post #header.nav-collapsed .nav-links-desktop,
body.single-post #header.nav-collapsed .nav-bar .btn-contact,
body.single-post #header.nav-collapsed .nav-burger{opacity:0;max-width:0;margin-left:0 !important;margin-right:0 !important;padding-left:0;padding-right:0;transform:translateY(-4px);pointer-events:none;overflow:hidden;white-space:nowrap}
/* Etat replié : pill "logo seul" ancré en haut à gauche, bien intégré dans le verre */
body.single-post #header.nav-collapsed .header-inner{justify-content:flex-start;max-width:none;padding-left:24px;padding-right:24px}
body.single-post #header.nav-collapsed .nav-bar{gap:0;padding:8px 14px;border-radius:16px;background:rgba(255,255,255,.58);backdrop-filter:blur(26px) saturate(180%);-webkit-backdrop-filter:blur(26px) saturate(180%);border:1px solid rgba(255,255,255,.85);box-shadow:0 10px 28px rgba(26,20,16,.16),inset 0 1px 0 rgba(255,255,255,.75)}
body.single-post #header.nav-collapsed .logo{margin:0}
body.single-post #header.nav-collapsed .logo-img{height:26px}