/* Style 2 « Mercerie » — vert sauge + jaune moutarde, Nunito */
:root{--sauge:#5f7f6a;--sauge-fonce:#47624f;--sauge-clair:#f2f6f3;--moutarde:#f2c14e;--creme:#fdf3d8;--texte:#26332b;--gris:#6f7f75;--bord:#e1e8e3;--plus:#3f7d55;--moins:#c0543c}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#fff;color:var(--texte);font-family:'Nunito',system-ui,-apple-system,'Segoe UI',sans-serif;font-size:18px;line-height:1.65}
a{color:var(--sauge-fonce)}
img{max-width:100%;height:auto}
.wrap{max-width:780px;margin:0 auto;padding:0 16px}
/* En-tête */
.hdr{background:var(--sauge);color:#fff}
.hdr .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;padding-top:12px;padding-bottom:12px}
.logo{font-weight:800;font-size:22px;color:#fff;text-decoration:none;margin-right:auto}
.logo b{color:var(--moutarde)}
.nav{display:flex;gap:6px;flex-wrap:wrap}
.nav a{color:#fff;text-decoration:none;background:rgba(255,255,255,.14);padding:4px 11px;border-radius:20px;font-size:15px}
.nav a:hover,.nav a[aria-current]{background:var(--moutarde);color:var(--texte)}
/* Fil d'Ariane */
.crumb{font-size:14px;color:var(--gris);margin:14px 0 0}
.crumb a{color:var(--gris)}
.crumb ol{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap}
.crumb li+li:before{content:"›";margin:0 6px}
/* Contenu */
h1{font-size:30px;line-height:1.2;font-weight:800;margin:10px 0 6px}
h2{font-size:24px;line-height:1.25;font-weight:800;margin:34px 0 10px}
h3{font-size:20px;margin:22px 0 6px}
.meta{font-size:14px;color:var(--gris);margin-bottom:18px}
.answer{background:var(--creme);border-radius:14px;padding:16px 18px;margin:0 0 22px}
.answer strong:first-child{display:block;font-size:19px;margin-bottom:4px}
.btn{display:inline-block;background:var(--moutarde);color:var(--texte);font-weight:800;text-decoration:none;padding:10px 20px;border-radius:30px;margin-top:8px}
.btn:hover{background:#e6b23a}
.toc{background:var(--sauge-clair);border-radius:14px;padding:12px 18px;margin:0 0 24px;font-size:16px}
.toc strong{display:block;margin-bottom:4px}
.toc ol{margin:0;padding-left:20px}
/* Encadré produit */
.produit{background:var(--sauge-clair);border-radius:14px;padding:16px 18px;margin:18px 0}
.produit h3{margin:0 0 2px}
.produit .pour{font-size:16px;color:var(--gris);margin:0 0 8px}
.produit ul{list-style:none;padding:0;margin:6px 0}
.produit li{padding-left:22px;position:relative;margin:3px 0}
.produit li.p:before{content:"+";color:var(--plus);font-weight:800;position:absolute;left:4px}
.produit li.m:before{content:"–";color:var(--moins);font-weight:800;position:absolute;left:4px}
/* Tableau */
.tbl{overflow-x:auto;margin:18px 0}
table{border-collapse:collapse;width:100%;font-size:16px}
th{background:var(--sauge);color:#fff;text-align:left;padding:9px 10px}
td{padding:9px 10px;border-bottom:1px solid var(--bord)}
tr.best td{background:var(--creme);font-weight:700}
/* FAQ, à lire aussi */
.faq details{border-bottom:1px solid var(--bord);padding:10px 0}
.faq summary{font-weight:700;cursor:pointer}
.related{background:var(--sauge-clair);border-radius:14px;padding:14px 18px;margin:34px 0}
.related strong{display:block;margin-bottom:6px}
.related ul{margin:0;padding-left:20px}
.cards{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.cards li{background:var(--sauge-clair);border-radius:14px;padding:14px}
.cards a{font-weight:700;text-decoration:none}
/* Pied */
.foot{background:var(--sauge-clair);color:#4b5b51;font-size:15px;margin-top:40px;padding:20px 0}
.foot .disclo{font-weight:700;margin:0 0 8px}
.foot nav a{color:#4b5b51;margin-right:14px}
@media (max-width:520px){body{font-size:17px}h1{font-size:26px}h2{font-size:22px}
 table{font-size:14px}th,td{padding:7px 5px}.nav a{font-size:14px;padding:3px 9px}}
/* Images */
.hero{margin:0 0 20px}.hero img{width:100%;height:auto;border-radius:14px;display:block}
figure{margin:20px 0}figcaption{font-size:14px;color:var(--gris);margin-top:6px;text-align:center}
.schema img,.schema svg{width:100%;height:auto;display:block;background:#fff;border:1px solid var(--bord);border-radius:14px}
.produit .pimg{float:right;margin:0 0 8px 14px}.produit .pimg img{width:140px;height:140px;object-fit:contain;background:#fff;border-radius:10px;padding:6px}
.produit:after{content:"";display:block;clear:both}
.timg img{width:44px;height:44px;object-fit:contain;vertical-align:middle;margin-right:8px;background:#fff;border-radius:6px}
@media (max-width:520px){.produit .pimg{float:none;display:block;margin:0 0 10px}.produit .pimg img{width:120px;height:120px}.timg{display:none}}
