:root{
  --green-900:#10211a;--green-800:#173026;--green-700:#1e4030;--green-600:#2c5b43;
  --gold:#c8962a;--gold-bright:#e3b552;--gold-soft:#f0e2bd;
  --paper:#f5f1e8;--paper-2:#fbf8f1;--card:#fff;
  --ink:#1a1712;--muted:#6f6a5e;--line:#e4ddcf;--red:#a8321f;--red-soft:#f6e4df;
  --prose:#3a352b;--card-2:#fffdf7;
  --sans:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;--serif:Georgia,'Iowan Old Style','Times New Roman',serif;--r:14px;--rs:10px;
}
*{box-sizing:border-box}
body{margin:0;font-family:var(--sans);background:var(--paper);color:var(--ink);line-height:1.65;-webkit-font-smoothing:antialiased}
.wkw-wrap{max-width:1120px;margin:0 auto;padding:0 22px}
h1,h2,h3,h4,.wkw-sans,.wkw-nav,button,.wkw-btn,.wkw-chip,.wkw-tag,.wkw-badge{font-family:var(--sans)}
a{color:inherit}
.wkw-foot{background:var(--foot-bg,#10211a);color:var(--foot-fg-soft,#9fb4a8);font-family:var(--sans);font-size:13px;border-top:3px solid var(--foot-accent,#c8962a);margin-top:48px}
.wkw-foot .wkw-wrap{padding:34px 22px 18px}
.wkw-foot-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1fr;gap:28px;padding-bottom:24px}
.wkw-foot-brand{display:flex;align-items:center;gap:9px;margin-bottom:12px}
.wkw-foot-ico{display:inline-flex;width:26px;height:26px}
.wkw-foot-ico svg{width:100%;height:100%;color:var(--foot-accent,#e0aa3a);fill:none;stroke:currentColor;stroke-width:1.7}
.wkw-foot-nm{font-family:var(--sans);font-weight:800;font-size:18px;color:var(--foot-fg,#fff)}
.wkw-foot-brand img{max-height:38px;width:auto}
.wkw-foot-tag{font-size:13px;color:var(--foot-fg-soft,#9fb4a8);line-height:1.6;margin:0;max-width:34ch}
.wkw-foot-h{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--foot-accent,#e0aa3a);font-weight:800;margin-bottom:12px}
.wkw-foot-links{display:flex;flex-direction:column;gap:9px}
.wkw-foot-links a,.wkw-foot-links span{color:var(--foot-fg-soft,#cfdad3);text-decoration:none;font-size:13px;line-height:1.3}
.wkw-foot-links a:hover{color:var(--foot-fg,#fff)}
.wkw-foot-disc{border-top:1px solid var(--foot-line,rgba(255,255,255,.1));padding:14px 0;font-size:12px;color:var(--foot-fg-mut,#8ba093);line-height:1.5}
.wkw-foot-bot{border-top:1px solid var(--foot-line,rgba(255,255,255,.1));padding-top:14px;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--foot-fg-mut,#7d8f86)}
.wkw-foot-sig{color:var(--foot-fg-mut,#7d8f86)}
@media(max-width:1000px){.wkw-foot-top{grid-template-columns:1fr 1fr 1fr;gap:24px}}
@media(max-width:760px){.wkw-foot-top{grid-template-columns:1fr 1fr;gap:22px}.wkw-foot-brandcol{grid-column:1 / -1}}
@media(max-width:520px){.wkw-foot-top{grid-template-columns:1fr}.wkw-foot-bot{flex-direction:column;align-items:flex-start;gap:6px}}
/* Style A - encre typographique */
.wkw-foot--a .wkw-foot-top{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:22px 34px;border-bottom:1px solid var(--foot-line);padding-bottom:16px}
.wkw-foot--a .wkw-foot-brandcol{flex:1 1 240px;margin-bottom:0}
.wkw-foot--a .wkw-foot-col:not(.wkw-foot-brandcol){flex:0 0 auto}
.wkw-foot--a .wkw-foot-nm{font-weight:500;letter-spacing:-.02em;font-size:20px}
.wkw-foot--a .wkw-foot-h{font-size:10px;letter-spacing:.12em;color:var(--foot-fg-mut)}
.wkw-foot--a .wkw-foot-disc{border-top:none;padding-top:12px}
/* Style B - aplat plein */
.wkw-foot--b{border-top:none}
.wkw-foot--b .wkw-foot-nm{font-size:22px;letter-spacing:-.02em}
.wkw-foot--b .wkw-foot-h{color:var(--foot-fg);font-weight:600}
/* Style C - cartes arrondies */
.wkw-foot--c .wkw-foot-top{align-items:stretch}
.wkw-foot--c .wkw-foot-col:not(.wkw-foot-brandcol){background:var(--foot-card);border-radius:12px;padding:16px 18px}
.wkw-foot--c .wkw-foot-brandcol{padding:14px 2px}
/* Style D - papier centre */
.wkw-foot--d .wkw-foot-centre{text-align:center}
.wkw-foot--d .wkw-foot-brand{justify-content:center;margin-bottom:8px}
.wkw-foot--d .wkw-foot-nm{font-family:var(--serif);font-weight:600;font-size:24px}
.wkw-foot--d .wkw-foot-tag{max-width:60ch;margin:0 auto 16px;text-align:center}
.wkw-foot--d .wkw-foot-inline{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 22px;padding-bottom:14px;border-bottom:1px solid var(--foot-line)}
.wkw-foot--d .wkw-foot-inline a,.wkw-foot--d .wkw-foot-inline span{color:var(--foot-fg-soft);text-decoration:none;font-size:13px}
.wkw-foot--d .wkw-foot-inline a:hover{color:var(--foot-fg)}
.wkw-foot--d .wkw-foot-disc{border-top:none;text-align:center;max-width:70ch;margin:0 auto}
.wkw-foot--d .wkw-foot-bot{justify-content:center;border-top:none}
/* Style E - colonnes claires */
.wkw-foot--e .wkw-foot-nm{font-weight:800}
.wkw-crumbs{font-family:var(--sans);font-size:12.5px;color:var(--muted);padding:16px 0 0}
.wkw-crumbs a{text-decoration:none;color:var(--green-700);font-weight:600}
.wkw-badge-conf,.wkw-badge-sra{font-family:var(--sans);font-weight:800;font-size:11px;background:var(--gold);color:var(--green-900);padding:4px 9px;border-radius:6px;display:inline-flex;gap:5px;align-items:center}
.wkw-badge-no{font-family:var(--sans);font-weight:800;font-size:11px;background:var(--red-soft);color:var(--red);padding:4px 9px;border-radius:6px}
.wkw-stars{font-family:var(--sans);font-size:12.5px;color:var(--muted);display:inline-flex;align-items:center;gap:6px}
.wkw-stars .s{color:var(--gold)}.wkw-stars b{color:var(--ink)}
.wkw-tag{font-family:var(--sans);font-size:11px;font-weight:600;background:var(--paper);border:1px solid var(--line);color:#4a453b;padding:3px 9px;border-radius:6px}
.wkw-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:var(--sans);font-weight:800;font-size:14px;padding:12px 18px;border-radius:10px;text-decoration:none;border:none;cursor:pointer}
.wkw-btn.amz{background:var(--gold);color:var(--green-900)}.wkw-btn.amz:hover{background:var(--gold-bright)}
.wkw-btn.go{background:var(--green-700);color:#fff}.wkw-btn.go:hover{background:var(--green-600)}
.wkw-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.wkw-pc{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;transition:.18s;position:relative;text-decoration:none;color:inherit}
.wkw-pc:hover{transform:translateY(-4px);border-color:var(--green-600);box-shadow:0 14px 30px -18px rgba(16,33,26,.4)}
.wkw-pc .img{aspect-ratio:1/1;background:var(--paper-2);display:flex;align-items:center;justify-content:center;position:relative;padding:14px;overflow:hidden}
.wkw-pc .img img{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain}
.wkw-pc .srab{position:absolute;bottom:9px;right:9px}
.wkw-pc .body{padding:13px 15px 16px;display:flex;flex-direction:column;flex:1}
.wkw-pc h3{font-family:var(--serif);font-weight:700;font-size:15px;line-height:1.25;margin:0}
.wkw-pc .price{margin-top:auto;padding-top:12px}
.wkw-pc .price .lab{font-family:var(--sans);font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.wkw-pc .price .val{font-family:var(--sans);font-weight:900;font-size:19px}
.wkw-pc .price.price--na .val--link{font-weight:700;font-size:13.5px;color:var(--green-700)}
.wkw-pc .cta{margin-top:11px;display:block;text-align:center;background:var(--green-700);color:#fff;font-family:var(--sans);font-weight:800;font-size:13px;padding:10px;border-radius:9px;text-decoration:none}

/* ===== #8 : bloc « Notre choix » (favori au-dessus de la grille) ===== */
.wkw-pick-flag{display:inline-flex;align-items:center;gap:8px;font-family:var(--sans);font-weight:800;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--green-900);background:var(--gold-bright);padding:7px 14px;border-radius:10px 10px 0 0;margin-left:10px}
.wkw-pick-card{display:grid;grid-template-columns:200px 1fr;gap:22px;background:var(--card);border:2px solid var(--gold);border-radius:var(--r);padding:18px;align-items:center}
.wkw-pick-img{aspect-ratio:1/1;background:var(--paper-2);border-radius:var(--rs);display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative;padding:12px;text-decoration:none}
.wkw-pick-img img{width:100%;height:100%;object-fit:contain}
.wkw-pick-badge{position:absolute;bottom:8px;right:8px}
.wkw-pick-body h3{font-family:var(--sans);font-weight:900;font-size:23px;line-height:1.15;margin:0}
.wkw-pick-body h3 a{text-decoration:none;color:var(--green-900)}
.wkw-pick-verdict{font-size:16.5px;color:#3a352b;margin:10px 0 0;max-width:60ch}
.wkw-pick-foot{display:flex;align-items:center;gap:18px;margin-top:16px;flex-wrap:wrap}
.wkw-pick-price{font-family:var(--sans);font-weight:900;font-size:20px;color:var(--green-900)}
.wkw-pick-cta{font-family:var(--sans);font-weight:800;font-size:14px;background:var(--green-700);color:#fff;padding:11px 18px;border-radius:10px;text-decoration:none}
.wkw-pick-cta:hover{background:var(--green-600)}
.wkw-acc{display:flex;flex-direction:column;gap:16px;margin:30px 0}
.wkw-acc details{background:var(--card);border:1px solid var(--line);border-left:4px solid transparent;border-radius:var(--r);overflow:hidden}
.wkw-acc details[open]{border-color:var(--gold);border-left-color:var(--gold)}
.wkw-acc summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:18px;padding:20px 22px}
.wkw-acc summary::-webkit-details-marker{display:none}
.wkw-acc details[open] summary{background:var(--paper-2);border-bottom:1px solid var(--line)}
.wkw-acc .txt b{font-family:var(--sans);font-weight:800;font-size:20px;display:block;color:var(--green-900)}
.wkw-acc .txt span{font-size:13.5px;color:var(--muted)}
.wkw-acc .body{padding:18px 22px 24px;color:#3a352b;font-size:16.5px;line-height:1.72}
.wkw-acc details:not([open]) .body{display:none}
.wkw-acc .body p{color:#3a352b;margin:0 0 12px}
.wkw-acc .body p:last-child{margin-bottom:0}
.wkw-acc .body h3{font-family:var(--sans);font-weight:800;font-size:17.5px;color:var(--green-900);letter-spacing:-.01em;margin:24px 0 6px;padding-top:18px;border-top:1px solid var(--line)}
.wkw-acc .body h3:first-child{margin-top:0;padding-top:0;border-top:0}
.wkw-acc .body h4{font-family:var(--sans);font-weight:700;font-size:15.5px;color:var(--green-700);margin:16px 0 4px}
.wkw-acc .body ul{margin:6px 0 14px;padding-left:20px}
.wkw-acc .body li{margin:0 0 6px}
.wkw-acc .body strong{color:var(--green-900);font-weight:700}
.wkw-acc .body hr{border:0;border-top:1px solid var(--line);margin:20px 0}
.wkw-acc .body a{color:var(--green-700);text-decoration:underline}
.wkw-hero{display:grid;grid-template-columns:1fr 1.05fr;gap:34px;padding:18px 0 12px;align-items:start}
.wkw-hero .main-img{aspect-ratio:1/1;background:var(--paper-2);border-radius:var(--r);display:flex;align-items:center;justify-content:center;overflow:hidden;padding:20px}
.wkw-hero .main-img img{width:100%;height:100%;object-fit:contain}
.wkw-hero h1{font-family:var(--sans);font-weight:900;font-size:34px;line-height:1.08;margin:14px 0 0}
.wkw-verdict{background:var(--paper-2);border-left:4px solid var(--gold);border-radius:0 var(--rs) var(--rs) 0;padding:14px 16px;margin-top:16px;font-size:17px}
.wkw-merchant{margin-top:20px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px}
.wkw-merchant .val{font-family:var(--sans);font-weight:900;font-size:30px}
.wkw-merchant .buys{display:flex;gap:11px;margin-top:15px}
.wkw-merchant .buys a{flex:1}
.wkw-sec{margin:40px 0}
.wkw-sec h2{font-family:var(--sans);font-weight:900;font-size:25px;margin-bottom:14px}
.wkw-specs{width:100%;border-collapse:collapse;background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;font-size:14.5px;font-family:var(--sans)}
.wkw-specs td{padding:12px 16px;border-bottom:1px solid var(--line)}
.wkw-specs tr td:first-child{font-weight:700;color:#37322a;width:42%;background:var(--paper-2)}
.wkw-specs tr:last-child td{border-bottom:none}
.wkw-pcs{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.wkw-pcs .col{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px}
.wkw-pcs .col h3{font-family:var(--sans);font-size:15px;letter-spacing:.04em;text-transform:uppercase;margin:0 0 12px}
.wkw-pcs .pro h3{color:var(--green-600)}.wkw-pcs .con h3{color:var(--red)}
.wkw-pcs li{list-style:none;padding:6px 0;font-size:15.5px}
.wkw-assur{background:var(--green-800);color:#eef5f0;border-radius:var(--r);padding:24px 26px}
.wkw-assur a{color:var(--gold-bright);font-family:var(--sans);font-weight:700;text-decoration:none}
.wkw-cats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.wkw-cat{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:24px;text-decoration:none;color:inherit;transition:.18s}
.wkw-cat:hover{transform:translateY(-4px);border-color:var(--green-600)}
.wkw-cat h3{font-family:var(--sans);font-weight:800;font-size:19px;margin:0}
.wkw-eeat{background:var(--eeat-bg);color:var(--eeat-fg);border-radius:var(--r);padding:28px;margin:42px 0;display:grid;grid-template-columns:1.3fr 1fr 1fr;grid-template-areas:"who met tra";gap:26px}
.wkw-eeat .wkw-ee-who{grid-area:who;display:flex;gap:14px;align-items:flex-start}
.wkw-eeat .wkw-ee-met{grid-area:met}
.wkw-eeat .wkw-ee-tra{grid-area:tra}
.wkw-eeat .wkw-ee-av{flex:0 0 auto}
.wkw-eeat h4{font-family:var(--sans);color:var(--eeat-accent);font-size:12px;letter-spacing:.13em;text-transform:uppercase;margin:0 0 10px}
.wkw-eeat p{font-size:13.5px;color:var(--eeat-fg-soft);line-height:1.55;margin:0}
.wkw-eeat a{color:var(--eeat-accent);font-family:var(--sans);font-weight:600;text-decoration:none;font-size:13px}
.wkw-eeat strong,.wkw-eeat .wkw-ee-name{color:var(--eeat-fg)}
.wkw-eeat .wkw-ee-name{text-decoration:none}
.wkw-sub{font-family:var(--sans);color:var(--muted);font-size:14.5px;margin:-6px 0 18px}
.wkw-corps{max-width:70ch}
.wkw-corps h3{font-family:var(--sans);font-weight:800;font-size:21px;line-height:1.25;margin:26px 0 8px;color:var(--green-900)}
.wkw-corps .corps-txt{font-size:16.5px;line-height:1.7;color:var(--ink)}
.wkw-ff{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.wkw-ff .ff-col{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px}
.wkw-ff .ff-head{font-family:var(--sans);font-weight:800;font-size:13px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:12px}
.wkw-ff .ff-pro .ff-head{color:#1a7f37}
.wkw-ff .ff-con .ff-head{color:#b32d2e}
.wkw-ff .ff-list{list-style:none;margin:0;padding:0}
.wkw-ff .ff-list li{display:flex;gap:9px;align-items:flex-start;font-size:15px;line-height:1.5;padding:5px 0}
.wkw-ff .ff-mark{font-weight:800;flex:0 0 auto;line-height:1.4}
.wkw-ff .ff-pro .ff-mark{color:#1a7f37}
.wkw-ff .ff-con .ff-mark{color:#b32d2e}
@media(max-width:880px){
  .wkw-grid{grid-template-columns:repeat(2,1fr)}
  .wkw-hero{grid-template-columns:1fr}.wkw-pcs{grid-template-columns:1fr}.wkw-ff{grid-template-columns:1fr}
  .wkw-cats{grid-template-columns:1fr}.wkw-eeat{grid-template-columns:1fr;grid-template-areas:"who" "met" "tra"}
  .wkw-pick-card{grid-template-columns:1fr;gap:16px}.wkw-pick-img{max-width:260px}
}

/* ---- Barre de catégories en rond (nav par catégorie) ---- */
.wkw-catstrip{display:flex;gap:22px;flex-wrap:wrap;justify-content:center;margin:22px 0 34px}
.wkw-catstrip-item{display:flex;flex-direction:column;align-items:center;gap:11px;text-decoration:none;width:130px}
.wkw-catstrip-img{width:118px;height:118px;border-radius:50%;overflow:hidden;background:var(--paper-2);display:flex;align-items:center;justify-content:center;border:1px solid var(--line);transition:.18s}
.wkw-catstrip-img img{width:100%;height:100%;object-fit:cover;display:block}
.wkw-catstrip-label{font-family:var(--sans);font-weight:700;color:var(--green-900);font-size:14.5px;line-height:1.25;text-align:center}
.wkw-catstrip-item:hover .wkw-catstrip-img{box-shadow:0 0 0 3px var(--gold);transform:translateY(-2px)}
@media(max-width:640px){.wkw-catstrip{gap:14px}.wkw-catstrip-item{width:96px}.wkw-catstrip-img{width:84px;height:84px}.wkw-catstrip-label{font-size:13px}}

/* ===== Comparatif : tableau -> cartes empilées sur mobile (#7) ===== */
/* DOM inchangé (contenu reste dans la page, citable). Les data-label des <td>
   réaffichent l'intitulé de colonne masqué. !important = surclasse les styles inline. */
@media(max-width:640px){
  .wkw-cmp{display:block;border:none!important;background:transparent!important;border-radius:0!important;overflow:visible!important}
  .wkw-cmp thead{display:none}
  .wkw-cmp tbody{display:block}
  .wkw-cmp tr{display:block;background:#fffdf7;border:1px solid var(--line);border-radius:12px;margin-bottom:14px;padding:4px 15px;overflow:hidden}
  .wkw-cmp td{display:flex;justify-content:space-between;align-items:baseline;gap:16px;text-align:right;padding:11px 0!important;border:none!important;border-top:1px solid var(--line)!important}
  .wkw-cmp td::before{content:attr(data-label);font-family:var(--sans);font-weight:700;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);text-align:left;flex:0 0 auto}
  .wkw-cmp td:first-child{display:block;text-align:left;border-top:none!important;padding:13px 0 4px!important;font-size:17px!important}
  .wkw-cmp td:first-child::before{display:none}
  .wkw-cmp td:first-child a{font-size:17px}
}

/* ===== Bloc EFSA (compléments) ===== */
.wkw-efsa-table{width:100%;border-collapse:collapse;font-size:14.5px;margin-top:6px}
.wkw-efsa-table th{font-family:var(--sans,'Archivo',sans-serif);font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:#6f6a5e;text-align:left;padding:0 10px 9px 0;border-bottom:2px solid var(--line,#e4ddcf)}
.wkw-efsa-table td{padding:12px 10px 12px 0;border-bottom:1px solid var(--line,#e4ddcf);vertical-align:top}
.wkw-efsa-table td:nth-child(2),.wkw-efsa-table th:nth-child(2){white-space:nowrap;color:#6f6a5e;font-family:var(--sans,'Archivo',sans-serif);font-size:13px}
.wkw-efsa-claim{display:block;font-size:13.5px;color:#332f27;margin-top:5px}
.wkw-efsa-b{font-family:var(--sans,'Archivo',sans-serif);font-weight:700;font-size:10.5px;padding:3px 8px;border-radius:6px;white-space:nowrap;display:inline-block}
.wkw-efsa-b.ok{background:var(--gold,#c8962a);color:var(--green-900,#10211a)}
.wkw-efsa-b.wait{background:#e3edf6;color:#2c5b8a}
.wkw-efsa-b.none{background:var(--paper,#f5f1e8);border:1px solid var(--line,#e4ddcf);color:#6f6a5e}
.wkw-efsa-benefits{list-style:none;margin:0;padding:0}
.wkw-efsa-benefits li{padding:11px 0;border-bottom:1px solid var(--line,#e4ddcf)}
.wkw-efsa-benefits li:last-child{border-bottom:none}
.wkw-efsa-benefits li span{display:block;font-family:var(--sans,'Archivo',sans-serif);font-weight:600;font-size:15px}
.wkw-efsa-benefits li em{font-family:var(--sans,'Archivo',sans-serif);font-style:normal;font-size:11.5px;color:#6f6a5e}
.wkw-efsa-note{font-family:var(--sans,'Archivo',sans-serif);font-size:11.5px;color:#6f6a5e;margin-top:14px;border-top:1px solid var(--line,#e4ddcf);padding-top:10px}

/* =====================================================================
   ACCUEIL À BLOCS (refonte 0.3.1) — hero, produits, catégories enrichies,
   marques, Le Mag', texte, pilier. Styles activables par bloc (réglages).
   ===================================================================== */
.wkw-sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:16px}
.wkw-sec-head h2{font-family:var(--sans);font-weight:900;font-size:28px;letter-spacing:-.02em;margin:0;color:var(--green-900)}
/* CHAPEAU DE SECTION, scopé exprès. `.wkw-sub` est déclaré trois fois dans cette feuille et
   c'est la dernière qui gagnait partout, y compris ici : la règle prévue pour l'intérieur
   d'un titre de section ne s'appliquait donc jamais. Un sélecteur à deux niveaux la met
   hors d'atteinte d'une future déclaration à plat. */
.wkw-sec-head .wkw-sub{margin:7px 0 0;max-width:58ch;font-size:14.5px;line-height:1.5}

/* BANDE ÉTAT DU MARCHÉ. Des chiffres alignés, pas des cartes : c'est un relevé, il doit
   se lire comme un relevé. `tabular-nums` pour que les chiffres s'alignent en colonne. */
/* CARTE DE TÊTE DU MAGAZINE : le pilier. Deux colonnes quand il a une image, une seule
   sinon, sans règle séparée : la colonne image n'existe pas si le HTML ne la produit pas. */
.wkw-mag-lead{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:0;
  background:var(--paper-2);border:1px solid var(--line);border-radius:16px;overflow:hidden;
  text-decoration:none;color:inherit;margin-bottom:18px}
.wkw-mag-lead:has(.ph){grid-template-columns:minmax(0,1fr) minmax(0,1.05fr)}
.wkw-mag-lead .ph{display:block;min-height:220px;background:var(--paper-2);order:2}
.wkw-mag-lead .ph img{width:100%;height:100%;object-fit:cover;display:block}
.wkw-mag-lead .body{display:block;padding:26px 28px}
.wkw-mag-lead .rub{display:block;font-family:var(--sans);font-weight:800;font-size:.74rem;
  letter-spacing:.08em;text-transform:uppercase;color:var(--green-700);margin-bottom:9px}
.wkw-mag-lead h3{font-family:var(--serif);font-weight:700;font-size:1.5rem;line-height:1.18;
  letter-spacing:-.02em;margin:0 0 10px;color:var(--green-900);text-wrap:balance}
.wkw-mag-lead p{margin:0 0 14px;color:var(--muted);font-size:.98rem;line-height:1.55;max-width:58ch}
.wkw-mag-lead .go{font-family:var(--sans);font-weight:700;color:var(--green-800);font-size:.94rem}
.wkw-mag-lead:hover .go{text-decoration:underline}
@media(max-width:760px){
  .wkw-mag-lead,.wkw-mag-lead:has(.ph){grid-template-columns:1fr}
  .wkw-mag-lead .ph{order:0;min-height:170px}
  .wkw-mag-lead .body{padding:20px}
  .wkw-mag-lead h3{font-size:1.24rem}
}

/* TUILES DE MARQUE : effectif et médiane, pas un mur de logos. */
.wkw-brandtiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:12px}
.wkw-bt{background:var(--paper-2);border:1px solid var(--line);border-radius:12px;
  padding:14px 16px;display:flex;flex-direction:column;gap:4px;min-width:0}
.wkw-bt b{font-family:var(--sans);font-weight:800;font-size:1.02rem;letter-spacing:-.01em;
  color:var(--green-900);overflow-wrap:anywhere}
.wkw-bt span{font-size:.8rem;color:var(--muted);font-variant-numeric:tabular-nums}

.wkw-mkstrip-sec{margin-top:6px}
.wkw-mkstrip{display:flex;flex-wrap:wrap;align-items:center;gap:16px 34px;
  background:var(--paper-2);border:1px solid var(--line);border-radius:14px;padding:20px 24px}
.wkw-mk-f{display:flex;flex-direction:column;gap:1px;min-width:0}
.wkw-mk-f b{font-family:var(--sans);font-weight:900;font-size:1.5rem;letter-spacing:-.02em;
  color:var(--green-900);font-variant-numeric:tabular-nums;line-height:1.15}
.wkw-mk-f span{font-size:.82rem;color:var(--muted)}
.wkw-mk-a{margin-left:auto;font-family:var(--sans);font-weight:700;font-size:.92rem;
  color:var(--green-800);text-decoration:none;white-space:nowrap}
.wkw-mk-a:hover{text-decoration:underline}
@media(max-width:700px){
  .wkw-mkstrip{gap:14px 24px;padding:16px 18px}
  .wkw-mk-f b{font-size:1.28rem}
  .wkw-mk-a{margin-left:0;flex-basis:100%}
}
.wkw-sub{font-family:var(--sans);color:var(--muted);font-size:13.5px;margin:5px 0 0}
.wkw-more{font-family:var(--sans);font-weight:700;font-size:13.5px;color:var(--green-700);text-decoration:none;white-space:nowrap}
.wkw-more:hover{color:var(--gold)}
.wkw-img-cover{width:100%;height:100%;object-fit:cover;display:block}
.wkw-imgframe{width:100%;height:100%;min-height:200px;border-radius:var(--r);overflow:hidden;background:linear-gradient(135deg,var(--green-700),var(--green-900));display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:rgba(255,255,255,.55);font-family:var(--sans);font-weight:800;font-size:12px;letter-spacing:.05em;border:1px solid rgba(255,255,255,.12)}
.wkw-imgframe svg{width:36px;height:36px;margin-bottom:8px;opacity:.6}


/* ---- PRODUITS : variantes d'affichage ---- */
.wkw-pc-rate{margin-top:7px}
.wkw-ps-btn{background:var(--green-900);color:#fff;font-family:var(--sans);font-weight:700;font-size:13px;padding:8px 15px;border-radius:9px;text-decoration:none;display:inline-block;white-space:nowrap}
.wkw-ps-btn.ghost{background:transparent;border:1px solid var(--green-900);color:var(--green-900)}
.wkw-ps-price{display:flex;flex-direction:column;align-items:flex-end}
.wkw-ps-price .lab{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.wkw-ps-price .val{font-family:var(--sans);font-weight:900;font-size:19px}

/* list — ligne comparatif */
.wkw-ps--list{display:flex;flex-direction:column;gap:14px}
.wkw-ps-row{display:flex;gap:16px;align-items:stretch;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px}
.wkw-ps-row .wkw-ps-ico{width:100px;height:100px;flex:none;border-radius:10px;background:var(--paper-2);position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}
.wkw-ps-row .wkw-ps-ico img{width:100%;height:100%;object-fit:contain;padding:10px}
.wkw-ps-row .wkw-ps-ico .b{position:absolute;bottom:5px;right:5px}
.wkw-ps-row .mid{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center}
.wkw-ps-row .mid .title{font-family:var(--sans);font-weight:700;font-size:16px;color:var(--green-900);text-decoration:none}
.wkw-ps-row .mid .verdict{font-size:13px;color:var(--muted);margin:3px 0 6px}
.wkw-ps-row .end{flex:none;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:8px;padding-left:14px;border-left:1px solid var(--line);text-align:right}

/* mag — magazine vedette */
.wkw-ps--mag{display:block}
.wkw-ps-feature{display:flex;gap:18px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px;margin-bottom:12px}
.wkw-ps-feature .ico{width:160px;height:160px;flex:none;border-radius:10px;background:var(--paper-2);display:flex;align-items:center;justify-content:center;overflow:hidden}
.wkw-ps-feature .ico img{width:100%;height:100%;object-fit:contain;padding:12px}
.wkw-ps-feature .info{flex:1;display:flex;flex-direction:column;justify-content:center}
.wkw-ps-feature .vedette{align-self:flex-start;background:var(--gold-soft);color:var(--gold-txt,#854f0b);font-size:11px;font-weight:700;padding:3px 10px;border-radius:6px;margin-bottom:8px}
.wkw-ps-feature .title{font-family:var(--sans);font-weight:800;font-size:22px;line-height:1.15;color:var(--green-900);text-decoration:none}
.wkw-ps-feature .verdict{font-size:14px;color:var(--muted);margin:7px 0 12px}
.wkw-ps-feature .row-cta{display:flex;align-items:center;gap:14px}
.wkw-ps-feature .row-cta .val{font-family:var(--sans);font-weight:900;font-size:19px}
.wkw-ps-feature .conf{margin-top:10px}
.wkw-ps-maggrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.wkw-ps-mini{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px;text-align:center;text-decoration:none;color:inherit;display:flex;flex-direction:column;align-items:center}
.wkw-ps-mini .ico{width:100%;height:70px;display:flex;align-items:center;justify-content:center}
.wkw-ps-mini .ico img{max-height:64px;width:auto;object-fit:contain}
.wkw-ps-mini .title{font-family:var(--sans);font-weight:700;font-size:13px;margin-top:6px;color:var(--green-900)}
.wkw-ps-mini .val{font-family:var(--sans);font-weight:900;font-size:13px;margin-top:4px}

/* rank — classement / podium */
.wkw-ps--rank{display:flex;flex-direction:column;gap:10px}
.wkw-ps-rk{display:flex;gap:14px;align-items:stretch;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px}
.wkw-ps-rk.first{border-left:5px solid var(--gold);padding:14px}
.wkw-ps-rk .num{flex:none;width:54px;display:flex;align-items:center;justify-content:center;font-family:var(--sans);font-weight:900;font-size:38px;line-height:1;color:#cfc7b2}
.wkw-ps-rk.first .num{font-size:44px;color:var(--gold)}
.wkw-ps-rk .ico{width:74px;height:74px;flex:none;border-radius:10px;background:var(--paper-2);display:flex;align-items:center;justify-content:center;overflow:hidden}
.wkw-ps-rk.first .ico{width:84px;height:84px}
.wkw-ps-rk .ico img{width:100%;height:100%;object-fit:contain;padding:8px}
.wkw-ps-rk .mid{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center}
.wkw-ps-rk .choice{align-self:flex-start;background:var(--green-900);color:#fff;font-size:10px;font-weight:700;padding:2px 8px;border-radius:5px;margin-bottom:5px}
.wkw-ps-rk .title{font-family:var(--sans);font-weight:700;font-size:15px;color:var(--green-900);text-decoration:none}
.wkw-ps-rk.first .title{font-weight:800;font-size:16px}
.wkw-ps-rk .sub{font-size:12px;color:var(--muted);margin-top:2px}
.wkw-ps-rk .end{flex:none;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:7px}
.wkw-ps-rk .end .val{font-family:var(--sans);font-weight:900;font-size:17px}

/* rail — carrousel scroll-snap */
.wkw-ps--rail{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px;-webkit-overflow-scrolling:touch}
.wkw-ps--rail::-webkit-scrollbar{height:6px}
.wkw-ps--rail::-webkit-scrollbar-thumb{background:#dcd6c6;border-radius:3px}
.wkw-ps-railcard{scroll-snap-align:start;flex:0 0 220px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;text-decoration:none;color:inherit;display:flex;flex-direction:column}
.wkw-ps-railcard .img{aspect-ratio:1/1;position:relative;padding:14px;display:flex;align-items:center;justify-content:center;background:var(--paper-2)}
.wkw-ps-railcard .img img{width:100%;height:100%;object-fit:contain}
.wkw-ps-railcard .img .b{position:absolute;bottom:9px;right:9px}
.wkw-ps-railcard .body{padding:12px 14px 15px;display:flex;flex-direction:column}
.wkw-ps-railcard .title{font-family:var(--sans);font-weight:700;font-size:14px;line-height:1.25;color:var(--green-900)}
.wkw-ps-railcard .rate{margin:6px 0}
.wkw-ps-railcard .val{font-family:var(--sans);font-weight:900;font-size:17px;margin-top:auto}
.wkw-ps-railhint{font-size:11px;color:#a8a496;margin:6px 0 0}

/* compact — liste dense */
.wkw-ps--compact{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.wkw-ps-crow{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:11px;padding:10px 12px;text-decoration:none;color:inherit}
.wkw-ps-crow .ico{width:48px;height:48px;flex:none;border-radius:8px;background:var(--paper-2);display:flex;align-items:center;justify-content:center;overflow:hidden}
.wkw-ps-crow .ico img{width:100%;height:100%;object-fit:contain;padding:5px}
.wkw-ps-crow .mid{flex:1;min-width:0}
.wkw-ps-crow .title{display:block;font-family:var(--sans);font-weight:700;font-size:14px;line-height:1.2;color:var(--green-900);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wkw-ps-crow .meta{display:flex;align-items:center;gap:8px;margin-top:3px}
.wkw-ps-crow .val{font-family:var(--sans);font-weight:900;font-size:15px;white-space:nowrap}

/* compare — tableau comparatif */
.wkw-ps--compare{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.wkw-ps--compare .thead,.wkw-ps--compare .trow{display:grid;grid-template-columns:2.4fr 1fr 1fr 1.1fr .9fr;align-items:center;gap:10px;padding:12px 16px}
.wkw-ps--compare .thead{background:var(--green-900);color:#fff;font-family:var(--sans);font-size:11px;text-transform:uppercase;letter-spacing:.04em}
.wkw-ps--compare .trow{border-top:1px solid var(--line)}
.wkw-ps--compare .prod{display:flex;align-items:center;gap:10px;min-width:0;text-decoration:none}
.wkw-ps--compare .prod .ico{width:44px;height:44px;flex:none;border-radius:8px;background:var(--paper-2);display:flex;align-items:center;justify-content:center;overflow:hidden}
.wkw-ps--compare .prod .ico img{width:100%;height:100%;object-fit:contain;padding:4px}
.wkw-ps--compare .prod .title{font-family:var(--sans);font-weight:700;font-size:14px;line-height:1.2;color:var(--green-900)}
.wkw-ps--compare .val{font-family:var(--sans);font-weight:900}
.wkw-ps--compare .dash{color:#a8a496}
.wkw-ps--compare .cl{display:none;font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:2px}

/* ---- CATÉGORIES enrichies (override de .wkw-cat) ---- */
.wkw-cat{padding:0;overflow:hidden;display:flex;flex-direction:column}
.wkw-cat-thumb{aspect-ratio:16/9;background:var(--card);display:block;position:relative;overflow:hidden}
/* Photos produit détourées : on les montre en entier (contain), jamais rognées.
   Les styles « split » et « overlay » gardent cover (bannières) via leur règle plus spécifique. */
.wkw-cat-thumb .wkw-img-cover,.wkw-cat-thumb>img{object-fit:contain;padding:14px}
.wkw-cats.s-rondes .wkw-cat-thumb .wkw-img-cover,.wkw-cats.s-rondes .wkw-cat-thumb>img{object-fit:cover;padding:0}
.wkw-cat-thumb .count{position:absolute;top:10px;left:10px;font-family:var(--sans);font-weight:800;font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;background:rgba(255,255,255,.92);color:var(--green-900);padding:4px 9px;border-radius:7px}
.wkw-cat-body{padding:15px 18px 17px;display:flex;flex-direction:column;flex:1}
.wkw-cat-body p{color:var(--muted);font-size:14px;margin:6px 0 0;line-height:1.5;flex:1}
.wkw-cat-go{margin-top:13px;padding-top:12px;border-top:1px solid var(--line);font-family:var(--sans);font-weight:800;font-size:12.5px;color:var(--green-700)}
.wkw-cats.s-rondes{display:flex;flex-wrap:wrap;justify-content:center;gap:26px}
.wkw-cats.s-rondes .wkw-cat{width:130px;border:none;background:transparent;align-items:center;text-align:center}
.wkw-cats.s-rondes .wkw-cat:hover{transform:translateY(-3px)}
.wkw-cats.s-rondes .wkw-cat-thumb{width:96px;height:96px;border-radius:50%;aspect-ratio:auto}
.wkw-cats.s-rondes .wkw-cat-thumb .count{display:none}
.wkw-cats.s-rondes .wkw-cat-body{padding:10px 0 0;align-items:center}
.wkw-cats.s-rondes .wkw-cat-body p,.wkw-cats.s-rondes .wkw-cat-go{display:none}
.wkw-cats.s-liste{grid-template-columns:1fr}
.wkw-cats.s-liste .wkw-cat{flex-direction:row;align-items:center}
.wkw-cats.s-liste .wkw-cat-thumb{width:150px;aspect-ratio:auto;align-self:stretch;flex:none}
.wkw-cats.s-liste .wkw-cat-body{flex-direction:row;align-items:center;gap:22px}
.wkw-cats.s-liste .wkw-cat-body p{flex:1}
.wkw-cats.s-bento{grid-template-columns:repeat(3,1fr)}
.wkw-cats.s-bento .wkw-cat:first-child{grid-column:span 2;grid-row:span 2}
.wkw-cats.s-bento .wkw-cat:first-child .wkw-cat-thumb{aspect-ratio:auto;flex:1;min-height:240px}

/* ---- MARQUES ---- */
.wkw-brands{display:flex;flex-wrap:wrap;gap:12px}
.wkw-brand{font-family:var(--sans);font-weight:800;font-size:15px;color:var(--green-900);background:var(--card);border:1px solid var(--line);padding:14px 22px;border-radius:11px}
.wkw-brands.s-ligne{gap:0;border:1px solid var(--line);border-radius:11px;overflow:hidden;background:var(--card)}
.wkw-brands.s-ligne .wkw-brand{border:none;border-radius:0;border-right:1px solid var(--line);flex:1;text-align:center}
.wkw-brands.s-vignettes{display:grid;grid-template-columns:repeat(4,1fr)}
.wkw-brands.s-vignettes .wkw-brand{text-align:center;padding:26px 16px}

/* ---- LE MAG' ---- */
.wkw-mag{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.wkw-art{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;text-decoration:none;color:inherit;transition:.18s}
.wkw-art:hover{transform:translateY(-4px);box-shadow:0 14px 30px -18px rgba(16,33,26,.4)}
.wkw-art .ph{aspect-ratio:16/9;background:linear-gradient(135deg,var(--green-800),var(--green-700));display:block;overflow:hidden}
.wkw-art .body{padding:15px 17px 17px;display:block}
.wkw-art .tag{font-family:var(--sans);font-size:10.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--gold)}
.wkw-art h3{font-family:var(--serif);font-weight:600;font-size:18px;line-height:1.25;margin:7px 0 0;color:var(--green-900)}
.wkw-art p{font-size:13.5px;color:var(--muted);margin:8px 0 0;line-height:1.5}
.wkw-mag.s-list{grid-template-columns:1fr}
.wkw-mag.s-list .wkw-art{flex-direction:row}
.wkw-mag.s-list .wkw-art .ph{width:220px;aspect-ratio:auto;flex:none}
.wkw-mag.s-list .wkw-art .body{flex:1;padding:18px 20px}
.wkw-mag.s-cover .wkw-art{position:relative;min-height:240px;justify-content:flex-end}
.wkw-mag.s-cover .wkw-art .ph{position:absolute;inset:0;aspect-ratio:auto}
.wkw-mag.s-cover .wkw-art .ph::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.8),rgba(0,0,0,.05))}
.wkw-mag.s-cover .wkw-art .body{position:relative;z-index:1}
.wkw-mag.s-cover .wkw-art h3,.wkw-mag.s-cover .wkw-art p{color:#fff}
.wkw-mag.s-cover .wkw-art p{color:rgba(255,255,255,.85)}

/* ---- TEXTE éditorial ---- */
.wkw-txt{max-width:72ch;font-size:16px;color:#3a352b}
.wkw-txt h2{font-family:var(--sans);font-weight:900;font-size:26px;letter-spacing:-.02em;color:var(--green-900);margin:0 0 14px}
.wkw-txt p{margin:0 0 14px}
.wkw-txt.s-encadre{max-width:none;background:var(--paper-2);border:1px solid var(--line);border-left:5px solid var(--gold);border-radius:var(--r);padding:28px 32px}
.wkw-txt.s-colonnes{max-width:none}
.wkw-txt.s-colonnes .wkw-txt-cols{column-count:2;column-gap:42px}
.wkw-txt.s-image{max-width:none;display:grid;grid-template-columns:1fr 320px;gap:38px;align-items:center}
.wkw-txt.s-image .wkw-txt-img{height:240px}

/* ---- PILIER ---- */
.wkw-pillar{background:var(--green-800);color:#fff;border-radius:var(--r);padding:32px 34px;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;position:relative;overflow:hidden;border:1px solid var(--green-700)}
.wkw-pillar::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--gold)}
.wkw-pillar .pe{font-family:var(--sans);font-weight:800;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-bright)}
.wkw-pillar h2{font-family:var(--sans);font-weight:900;font-size:26px;letter-spacing:-.02em;margin:7px 0 0}
.wkw-pillar p{color:#cfe0d4;margin:8px 0 0;font-size:15px;max-width:58ch}

@media(max-width:880px){
  .wkw-mag{grid-template-columns:1fr}
  .wkw-ps-maggrid{grid-template-columns:1fr}
  .wkw-ps-feature{flex-direction:column}
  .wkw-ps-feature .ico{width:100%;height:150px}
  .wkw-ps--compact{grid-template-columns:1fr}
  .wkw-ps-row .end{border-left:0;padding-left:0}
  .wkw-ps--compare{border:0;background:transparent}
  .wkw-ps--compare .thead{display:none}
  .wkw-ps--compare .trow{display:block;background:var(--card);border:1px solid var(--line);border-radius:12px;margin-bottom:10px;padding:14px}
  .wkw-ps--compare .prod{margin-bottom:10px}
  .wkw-ps--compare .trow .c{display:flex;justify-content:space-between;align-items:center;padding:5px 0;border-top:1px dashed var(--line)}
  .wkw-ps--compare .cl{display:block;margin:0}
  .wkw-ps--compare .trow .act{padding-top:10px;border-top:0}
  .wkw-ps--compare .trow .act .wkw-ps-btn{width:100%;text-align:center}
  .wkw-txt.s-image{grid-template-columns:1fr}
  .wkw-txt.s-colonnes .wkw-txt-cols{column-count:1}
  .wkw-cats.s-bento{grid-template-columns:1fr}
  .wkw-cats.s-bento .wkw-cat:first-child{grid-column:auto;grid-row:auto}
  .wkw-pillar{grid-template-columns:1fr}
}

.wkw-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.wkw-chip{font-family:var(--sans);background:var(--card);border:1px solid var(--line);border-radius:999px;padding:9px 16px;font-weight:700;font-size:13.5px;color:var(--green-900)}
.wkw-chip:hover{border-color:var(--gold);color:var(--gold)}


/* ===== SOCLE 0.5.0 — typo fluide, position du logo, icônes de catégorie ===== */
/* Échelle typographique fluide (nickel mobile -> grand écran). Les gabarits qui
   fixent une taille en inline (catégorie/fiche par défaut) restent intacts :
   le style inline l'emporte, donc rien ne change là où on n'a rien demandé. */
:root{
  --t-h1:clamp(28px, 2.2vw + 18px, 44px);
  --t-h2:clamp(20px, 1.1vw + 14px, 27px);
  --t-h3:clamp(15px, .3vw + 13px, 18px);
  --t-body:clamp(15px, .2vw + 14px, 16.5px);
}
body{font-size:var(--t-body)}
h1{font-size:var(--t-h1)}
h2{font-size:var(--t-h2)}


/* Cartes catégories en mode icône (réutilise la bibliothèque d'icônes du thème) */
.wkw-cat-ico{display:flex;align-items:center;justify-content:center;aspect-ratio:auto;min-height:132px;padding:26px 0;background:radial-gradient(120% 120% at 50% 28%,var(--gold-soft),var(--paper-2));color:var(--green-800)}
.wkw-cat-ico .wkw-cat-icosvg{width:auto;height:60px;max-width:none;max-height:60px;opacity:.92;stroke-width:1.7}
.wkw-cats.s-rondes .wkw-cat-ico{aspect-ratio:1;min-height:0;padding:0;border-radius:50%}
.wkw-cats.s-rondes .wkw-cat-ico .wkw-cat-icosvg{height:42px}
.wkw-cats.s-liste .wkw-cat-ico{min-height:0;height:100%;padding:18px 0}
.wkw-cats.s-bento .wkw-cat:first-child .wkw-cat-ico{min-height:240px}
.wkw-cats.s-bento .wkw-cat:first-child .wkw-cat-ico .wkw-cat-icosvg{height:84px;max-height:84px}
.wkw-ico{display:inline-block;vertical-align:middle}

/* =========================================================================
   BLOCS ACCUEIL (réassurance, comparatif, FAQ, citations, méthodo, capture)
   Agnostiques : couleurs via variables de palette/ambiance.
   ========================================================================= */
.wkw-sub{color:var(--muted);font-size:1.02rem;margin:-4px 0 18px;max-width:60ch}

/* Réassurance — panneau contenu */
.wkw-reassure{background:var(--green-900);color:#fff;border-radius:var(--r);padding:26px 24px}
.wkw-reassure-h{color:#fff;margin:0 0 16px;font-size:1.25rem}
.wkw-reassure-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.wkw-reassure-it{display:flex;gap:12px;align-items:flex-start}
.wkw-reassure-it svg{flex:0 0 auto;width:26px;height:26px;color:var(--gold-bright)}
.wkw-reassure-it b{display:block;font-family:var(--sans);font-size:.98rem;margin-bottom:2px}
.wkw-reassure-it span{display:block;color:rgba(255,255,255,.78);font-size:.88rem;line-height:1.4}
@media(max-width:860px){.wkw-reassure-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.wkw-reassure-grid{grid-template-columns:1fr}}

/* Comparatif express (accueil) — réutilise .wkw-cmp existant, variante claire */
.wkw-cmp-home{width:100%;border-collapse:collapse;margin-top:6px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.wkw-cmp-home th{background:var(--paper-2);text-align:left;font-family:var(--sans);font-size:.82rem;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);padding:12px 14px}
.wkw-cmp-home td{padding:13px 14px;border-top:1px solid var(--line);vertical-align:middle}
.wkw-cmp-home td.nm a{font-family:var(--sans);font-weight:600;color:var(--ink);text-decoration:none}
.wkw-cmp-home td.nm a:hover{color:var(--green-700)}
.wkw-cmp-home .b{display:inline-block;margin-left:6px;background:var(--gold-soft);color:var(--green-900);font-size:.72rem;font-weight:700;padding:2px 7px;border-radius:999px;vertical-align:middle}

/* FAQ accueil — DOM-first via <details> */
.wkw-faq details{border:1px solid var(--line);border-radius:var(--rs);margin-bottom:10px;background:var(--card);overflow:hidden}
.wkw-faq summary{cursor:pointer;list-style:none;padding:15px 18px;font-family:var(--sans);font-weight:600;color:var(--ink);position:relative}
.wkw-faq summary::-webkit-details-marker{display:none}
.wkw-faq summary::after{content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);font-size:1.3rem;color:var(--gold);font-weight:400}
.wkw-faq details[open] summary::after{content:"\2212"}
.wkw-faq .a{padding:0 18px 16px;color:var(--muted);line-height:1.6}

/* Citations / avis */
.wkw-cites{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.wkw-cite{background:var(--card);border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:var(--rs);padding:18px 18px 14px}
.wkw-cite p{margin:0 0 8px;font-style:italic;color:var(--ink);line-height:1.55}
.wkw-cite .who{font-family:var(--sans);font-size:.85rem;color:var(--muted);font-weight:600}
@media(max-width:860px){.wkw-cites{grid-template-columns:1fr}}

/* Méthodo */
.wkw-meth{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;counter-reset:meth}
.wkw-step{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:22px 20px;position:relative}
.wkw-step::before{counter-increment:meth;content:counter(meth);display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:999px;background:var(--gold-soft);color:var(--green-900);font-family:var(--sans);font-weight:700;margin-bottom:12px}
.wkw-step h3{margin:0 0 6px;font-size:1.05rem}
.wkw-step p{margin:0;color:var(--muted);line-height:1.55}
@media(max-width:860px){.wkw-meth{grid-template-columns:1fr}}

/* Capture e-mail */
.wkw-cap{background:var(--green-900);color:#fff;border-radius:var(--r);padding:30px 26px;text-align:center}
.wkw-cap h2{color:#fff;margin:0 0 8px}
.wkw-cap p{color:rgba(255,255,255,.82);margin:0 auto 18px;max-width:54ch}
.wkw-capf{display:flex;gap:10px;justify-content:center;max-width:480px;margin:0 auto;flex-wrap:wrap}
.wkw-capf input{flex:1 1 220px;min-width:0;padding:13px 15px;border:1px solid transparent;border-radius:var(--rs);font-size:1rem;font-family:var(--serif)}
.wkw-capf button{flex:0 0 auto;padding:13px 22px;border:0;border-radius:var(--rs);background:var(--gold);color:var(--green-900);font-family:var(--sans);font-weight:700;font-size:1rem;cursor:pointer}
.wkw-capf button:hover{background:var(--gold-bright)}

/* =========================================================================
   EN-TÊTE — carte arrondie contenue (topbar + barre), façon maquette validée
   7 styles : classic · centered · split · minimal · pill · edito · glass
   Couleur de la barre librement réglable (Personnaliser → En-tête)
   ========================================================================= */
.wkw-header-wrap{background:var(--paper);padding:18px 16px 0}
.wkw-header-wrap.is-sticky{position:sticky;top:0;z-index:30}
.wkw-header{position:relative;max-width:1180px;margin:0 auto;background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:0 26px 54px -38px rgba(20,40,30,.42)}

/* Topbar (strip foncé en haut de la carte) */
.wkw-topbar{display:flex;justify-content:space-between;align-items:center;gap:14px;background:var(--green-900);color:rgba(255,255,255,.85);font-family:var(--sans);font-size:12.5px;padding:7px 22px}
.wkw-topbar .stamp{color:var(--gold-bright);font-weight:700;white-space:nowrap}

/* Barre principale (blanche par défaut, recolorable) */
.wkw-bar{display:flex;align-items:center;gap:26px;padding:16px 22px}
.wkw-logo{display:flex;align-items:center;gap:10px;font-family:var(--sans);font-weight:800;font-size:1.28rem;letter-spacing:-.01em;text-transform:none;text-decoration:none;color:var(--green-900);flex:0 0 auto}
.wkw-logo span{white-space:nowrap}
.wkw-logo-img{max-height:40px;width:auto;display:block;flex:0 0 auto}
.wkw-logo svg{width:26px;height:26px;flex:0 0 auto;color:var(--gold)}
.wkw-nav{margin-left:auto}
.wkw-menu{display:flex;gap:22px;align-items:center;list-style:none;margin:0;padding:0}
.wkw-menu li{list-style:none;margin:0;padding:0}
.wkw-menu a{color:var(--ink);text-decoration:none;font-family:var(--sans);font-weight:600;font-size:.95rem;white-space:nowrap;padding:4px 0;border-bottom:2px solid transparent}
.wkw-menu a:hover{color:var(--green-700);border-color:var(--gold)}
.wkw-menu .sra{background:var(--gold);color:var(--green-900)!important;padding:9px 15px;border-radius:999px;font-weight:800;border:0}
.wkw-head-actions{display:flex;align-items:center;gap:14px;flex:0 0 auto}
.wkw-head-cta{background:var(--gold);color:var(--green-900);font-family:var(--sans);font-weight:800;text-decoration:none;padding:9px 16px;border-radius:999px;font-size:.9rem;white-space:nowrap}
.wkw-head-cta:hover{background:var(--gold-bright)}

/* Hamburger (mobile) */
.wkw-burger{display:none;flex-direction:column;justify-content:center;gap:5px;width:42px;height:42px;border:0;background:transparent;color:inherit;cursor:pointer;padding:0;margin-left:auto}
.wkw-burger span{display:block;width:24px;height:2px;background:currentColor;border-radius:2px;transition:.2s}
.wkw-header.is-open .wkw-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.wkw-header.is-open .wkw-burger span:nth-child(2){opacity:0}
.wkw-header.is-open .wkw-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Position du logo (classique) : gauche défaut | droite | centre */
.wkw-header.lg-droite .wkw-bar{flex-direction:row-reverse}
.wkw-header.lg-droite .wkw-nav{margin-left:0;margin-right:auto}
.wkw-header.lg-centre .wkw-bar{flex-wrap:wrap;justify-content:center;gap:10px}
.wkw-header.lg-centre .wkw-logo{width:100%;justify-content:center}
.wkw-header.lg-centre .wkw-nav{width:100%;margin:0}
.wkw-header.lg-centre .wkw-menu{justify-content:center;flex-wrap:wrap}

/* 2. Centré : logo au-dessus, nav centrée en dessous */
.wkw-header.hs-centered .wkw-bar{flex-wrap:wrap;justify-content:center;gap:8px;padding-bottom:14px}
.wkw-header.hs-centered .wkw-logo{width:100%;justify-content:center;font-size:1.5rem}
.wkw-header.hs-centered .wkw-nav{width:100%;margin:0}
.wkw-header.hs-centered .wkw-menu{justify-content:center;flex-wrap:wrap}
.wkw-header.hs-centered .wkw-head-actions{margin:0 auto}

/* 3. Split : nav gauche | logo centre | actions droite */
.wkw-header.hs-split .wkw-bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px}
.wkw-header.hs-split .wkw-nav{grid-column:1;justify-self:start;margin:0}
.wkw-header.hs-split .wkw-logo{grid-column:2;justify-self:center}
.wkw-header.hs-split .wkw-head-actions{grid-column:3;justify-self:end}

/* 4. Minimal : barre fine */
.wkw-header.hs-minimal .wkw-bar{padding:10px 20px}
.wkw-header.hs-minimal .wkw-logo{font-size:1.08rem}
.wkw-header.hs-minimal .wkw-logo svg{width:20px;height:20px}
.wkw-header.hs-minimal .wkw-menu{gap:18px}
.wkw-header.hs-minimal .wkw-menu a{font-size:.88rem}
.wkw-header.hs-minimal .wkw-head-cta{padding:7px 13px;font-size:.82rem}

/* 5. Pilule : nav dans une pastille blanche flottante */
.wkw-header.hs-pill .wkw-menu{background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 18px;box-shadow:0 16px 34px -24px rgba(20,40,30,.5)}

/* 6. Souligné / édito : bordure basse marquée, capitales */
.wkw-header.hs-edito .wkw-bar{border-bottom:3px solid var(--green-900)}
.wkw-header.hs-edito .wkw-logo{text-transform:uppercase;letter-spacing:.02em}
.wkw-header.hs-edito .wkw-menu a{text-transform:uppercase;letter-spacing:.03em;font-size:.82rem}

/* 7. Transparent sur image (accueil) : pas de carte, header par-dessus le hero */
body.wkw-hs-glass .wkw-header-wrap{background:transparent;padding:0;position:absolute;top:0;left:0;right:0;z-index:30}
body.wkw-hs-glass .wkw-header{max-width:none;margin:0;background:transparent;border:0;border-radius:0;box-shadow:none;overflow:visible}
body.wkw-hs-glass .wkw-bar{max-width:1120px;margin:0 auto;padding:18px 16px}
body.wkw-hs-glass .wkw-topbar{background:rgba(0,0,0,.28);color:#fff;padding-left:max(16px,calc((100% - 1120px)/2));padding-right:max(16px,calc((100% - 1120px)/2))}
body.wkw-hs-glass .wkw-logo,body.wkw-hs-glass .wkw-menu a{color:#fff}
body.wkw-hs-glass .wkw-logo svg{color:var(--gold-bright)}
body.wkw-hs-glass .wkw-fh{padding:0}
body.wkw-hs-glass .wkw-fh-stage{border-radius:0;border:0}
body.wkw-hs-glass .wkw-fh-in{padding-top:120px}

/* Responsive : hamburger + menu qui s'ouvre DANS la carte (évite le clip overflow) */
@media(max-width:880px){
  .wkw-burger{display:flex;order:2;margin-left:0}
  .wkw-head-actions{display:none}
  .wkw-bar{flex-wrap:wrap;padding:12px 18px;gap:14px}
  .wkw-header.hs-split .wkw-bar,.wkw-header.hs-centered .wkw-bar,.wkw-header.lg-centre .wkw-bar{display:flex;grid-template-columns:none;flex-wrap:wrap;justify-content:flex-start;gap:14px;padding:12px 18px}
  .wkw-logo{order:1;margin-right:auto}
  .wkw-header.hs-split .wkw-logo,.wkw-header.hs-centered .wkw-logo,.wkw-header.lg-centre .wkw-logo{width:auto;grid-column:auto;justify-self:auto;justify-content:flex-start;font-size:1.28rem}
  .wkw-header.hs-split .wkw-nav,.wkw-header.hs-centered .wkw-nav,.wkw-header.lg-centre .wkw-nav,.wkw-header.lg-droite .wkw-nav{grid-column:auto;justify-self:auto}
  .wkw-nav{display:none;order:3;flex-basis:100%;width:100%;margin:6px -18px 0;border-top:1px solid var(--line)}
  .wkw-header.is-open .wkw-nav{display:block}
  .wkw-menu{flex-direction:column;align-items:stretch;gap:0;font-size:1rem}
  .wkw-menu li{border-top:1px solid var(--line)}
  .wkw-menu li:first-child{border-top:0}
  .wkw-menu a{display:block;padding:14px 18px;border-bottom:0}
  .wkw-header.hs-pill .wkw-menu{background:transparent;border:0;border-radius:0;padding:0;box-shadow:none}
  body.wkw-hs-glass .wkw-nav{background:rgba(10,20,15,.94)}
  body.wkw-hs-glass .wkw-menu a{color:#fff}
  body.wkw-hs-glass .wkw-menu li{border-top-color:rgba(255,255,255,.14)}
}


/* =========================================================================
   CATÉGORIES — disposition « Split couleur »
   ========================================================================= */
.wkw-cats.s-split{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.wkw-cats.s-split .wkw-cat{display:flex;align-items:stretch;padding:0;overflow:hidden;box-shadow:0 8px 26px -18px rgba(16,33,26,.5)}
.wkw-cats.s-split .wkw-cat-thumb{flex:0 0 40%;margin:0;border-radius:0;min-height:140px;aspect-ratio:auto}
.wkw-cats.s-split .wkw-cat-thumb img,.wkw-cats.s-split .wkw-cat-thumb .wkw-img-cover{width:100%;height:100%;object-fit:cover}
.wkw-cats.s-split .wkw-cat-thumb.wkw-cat-ico{background:var(--green-800);display:flex;align-items:center;justify-content:center}
.wkw-cats.s-split .wkw-cat-thumb.wkw-cat-ico .wkw-cat-icosvg{color:var(--gold-bright);height:46px;max-height:46px}
.wkw-cats.s-split .wkw-cat-body{flex:1;padding:20px 24px;display:flex;flex-direction:column;justify-content:center}
.wkw-cats.s-split .wkw-cat-body h3{font-size:20px}
.wkw-cats.s-split .wkw-cat-go{border-top:0;padding-top:0;margin-top:10px;color:var(--green-600)}
@media(max-width:760px){.wkw-cats.s-split{grid-template-columns:1fr}}

/* catégories — carrousel (cartes larges, photo en haut, titre + description) */
.wkw-cats.s-rail{display:flex;grid-template-columns:none;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;-webkit-overflow-scrolling:touch}
.wkw-cats.s-rail::-webkit-scrollbar{height:8px}
.wkw-cats.s-rail::-webkit-scrollbar-thumb{background:#cfc7b2;border-radius:4px}
.wkw-cats.s-rail::-webkit-scrollbar-track{background:#ece7da;border-radius:4px}
.wkw-cats.s-rail .wkw-cat{flex:0 0 320px;scroll-snap-align:start;box-shadow:0 8px 26px -18px rgba(16,33,26,.55)}
.wkw-cats.s-rail .wkw-cat-thumb{aspect-ratio:16/10}
.wkw-cats.s-rail .wkw-cat-body{padding:16px 18px 18px}
.wkw-cats.s-rail .wkw-cat-body h3{font-size:19px}
.wkw-cats.s-rail .wkw-cat-go{display:none}

/* catégories — overlay (photo plein cadre, texte en surimpression) */
.wkw-cats.s-overlay{grid-template-columns:repeat(3,1fr)}
.wkw-cats.s-overlay .wkw-cat{position:relative;aspect-ratio:4/3;border:none}
.wkw-cats.s-overlay .wkw-cat-thumb{position:absolute;inset:0;aspect-ratio:auto;width:100%;height:100%}
.wkw-cats.s-overlay .wkw-cat-thumb img{width:100%;height:100%;object-fit:cover}
.wkw-cats.s-overlay .wkw-cat-thumb.wkw-cat-ico{background:linear-gradient(135deg,var(--green-700),var(--green-900))}
.wkw-cats.s-overlay .wkw-cat-body{position:absolute;inset:0;z-index:1;justify-content:flex-end;padding:16px;background:linear-gradient(to top,rgba(16,33,26,.9) 6%,rgba(16,33,26,.15) 58%,transparent);border:0}
.wkw-cats.s-overlay .wkw-cat-body h3{color:#fff}
.wkw-cats.s-overlay .wkw-cat-body p{color:rgba(255,255,255,.85);font-size:13px}
.wkw-cats.s-overlay .wkw-cat-go{display:none}
@media(max-width:760px){.wkw-cats.s-rail .wkw-cat{flex:0 0 78%}.wkw-cats.s-overlay{grid-template-columns:1fr 1fr}}
@media(max-width:440px){.wkw-cats.s-overlay{grid-template-columns:1fr}}

/* =========================================================================
   MARQUES — styles Monogramme + Bande tintée
   ========================================================================= */
.wkw-brands.s-mono{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.wkw-brands.s-mono .wkw-brand{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:13px 15px;box-shadow:0 16px 38px -32px rgba(20,40,30,.55)}
.wkw-brands.s-mono .wkw-brand-mono{flex:0 0 auto;width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-family:var(--sans);font-weight:800;color:#fff;background:linear-gradient(140deg,var(--gold-bright),var(--gold));box-shadow:0 6px 14px -6px rgba(201,145,42,.6)}
.wkw-brands.s-mono .wkw-brand-nm{font-family:var(--sans);font-weight:700;color:var(--ink);font-size:.98rem;line-height:1.15}
@media(max-width:760px){.wkw-brands.s-mono{grid-template-columns:repeat(2,1fr)}}

.wkw-brands.s-bande{display:flex;align-items:center;gap:22px;flex-wrap:wrap;justify-content:center;background:linear-gradient(180deg,var(--paper-2),var(--card));border:1px solid var(--line);border-radius:18px;padding:20px 24px}
.wkw-brands.s-bande .wkw-brand{font-family:var(--sans);font-weight:700;color:var(--green-800);font-size:1.06rem;display:inline-flex;align-items:center;gap:9px}
.wkw-brands.s-bande .wkw-brand-dot{width:6px;height:6px;border-radius:999px;background:var(--gold)}

/* =========================================================================
   HERO — fidèle aux maquettes : carte arrondie contenue, dimensions exactes
   ========================================================================= */
.wkw-fh{background:var(--paper);padding:26px 16px 30px}
.wkw-fh-stage{position:relative;max-width:1180px;margin:0 auto;background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:0 30px 60px -40px rgba(20,40,30,.4)}
.wkw-fh-in{padding:56px 44px 62px}
.wkw-fh-eyebrow{display:inline-block;background:var(--gold-soft);color:var(--green-900);font-family:var(--sans);font-weight:700;font-size:.74rem;letter-spacing:.04em;text-transform:uppercase;padding:5px 12px;border-radius:999px;margin-bottom:16px}
.wkw-fh h1{font-family:var(--serif);font-weight:700;font-size:clamp(2.05rem,3.7vw,2.6rem);line-height:1.06;letter-spacing:-.022em;margin:0 0 .4em;color:var(--green-900)}
.wkw-fh-lead{color:var(--muted);font-size:1.1rem;line-height:1.5;margin:0;max-width:54ch}
.wkw-fh-ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.wkw-fh-ctas .wkw-btn.ghost{background:transparent;color:var(--green-900);border:1.5px solid var(--green-900)}
.wkw-fh .wkw-chips{margin-top:18px}

/* ---- HÉROS MINIMALISTES : simple | panneau | centre | categories ---- */
/* simple + panneau : texte à gauche, image à droite */
.wkw-fh-simple .wkw-fh-stage,.wkw-fh-panneau .wkw-fh-stage{display:grid;grid-template-columns:1.05fr 1fr;align-items:stretch}
.wkw-fh-simple .wkw-fh-in,.wkw-fh-panneau .wkw-fh-in{align-self:center}
.wkw-fh-simple .wkw-fh-text,.wkw-fh-panneau .wkw-fh-text{max-width:560px}
/* panneau : fond teinté, coins ronds, sans bordure ni ombre */
.wkw-fh-panneau .wkw-fh-stage{background:var(--paper-2);border:0;border-radius:22px;box-shadow:none}
/* centre : texte centré, bandeau image dessous */
.wkw-fh-centre .wkw-fh-in{text-align:center}
.wkw-fh-centre .wkw-fh-lead{max-width:48ch;margin-left:auto;margin-right:auto}
.wkw-fh-centre .wkw-fh-ctas{justify-content:center}
.wkw-fh-band{height:260px;background:var(--paper-2) center/cover}
/* categories : texte + vignettes d'entrée par catégorie */
.wkw-fh-cats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:26px}
.wkw-fh-cat{display:block;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;text-decoration:none;color:inherit}
.wkw-fh-cat:hover{transform:translateY(-2px)}
.wkw-fh-cat-im{display:block;height:84px;background:var(--paper-2) center/cover}
.wkw-fh-cat-nm{display:block;font-family:var(--sans);font-weight:700;font-size:.92rem;padding:10px 12px 2px;color:var(--green-900)}
.wkw-fh-cat-c{display:block;font-family:var(--sans);font-size:.78rem;color:var(--muted);padding:0 12px 10px}
@media(max-width:860px){.wkw-fh-simple .wkw-fh-stage,.wkw-fh-panneau .wkw-fh-stage{grid-template-columns:1fr}.wkw-fh-cats{grid-template-columns:1fr 1fr}}

.wkw-fh-imgcol{background:var(--paper-2) center/cover;min-height:380px}


@media(max-width:820px){
  .wkw-fh-in{padding:34px 24px 38px}
  .wkw-fh h1{font-size:1.8rem}
  .wkw-fh-imgcol{min-height:200px;order:-1}
}

/* ===== Blocs accueil — styles additionnels ===== */

/* Marques : logos (grille) + pastilles */
.wkw-brands.s-logos{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.wkw-brands.s-logos .wkw-brand-logo{height:64px;display:flex;align-items:center;justify-content:center;background:var(--card);border:1px solid var(--line);border-radius:10px;font-family:var(--sans);font-weight:800;font-size:14px;color:var(--muted)}
.wkw-brands.s-pastilles{display:flex;flex-wrap:wrap;gap:10px}
.wkw-brands.s-pastilles .wkw-brand-pill{background:var(--card);border:1px solid var(--line);border-radius:999px;padding:9px 18px;font-family:var(--sans);font-weight:700;font-size:14px;color:var(--green-900)}
@media(max-width:760px){.wkw-brands.s-logos{grid-template-columns:repeat(3,1fr)}}

/* Le Mag : date + styles feat / minimal */
.wkw-art .dt{font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--gold-txt,#854f0b)}
.wkw-mag-feat{display:grid;grid-template-columns:1.5fr 1fr;gap:18px}
.wkw-mag-feat .wkw-art h3{font-size:21px}
.wkw-mag-feat .side{display:flex;flex-direction:column;gap:0}
.wkw-mag-feat .side a{text-decoration:none;border-bottom:1px solid var(--line);padding:13px 0;display:block}
.wkw-mag-feat .side a:first-child{padding-top:0}
.wkw-mag-feat .side h3{font-family:var(--sans);font-weight:700;font-size:15.5px;line-height:1.25;margin:3px 0 0;color:var(--green-900)}
.wkw-mag-min{display:flex;flex-direction:column}
.wkw-mag-min a{display:flex;align-items:baseline;gap:14px;text-decoration:none;padding:13px 0;border-bottom:1px solid var(--line)}
.wkw-mag-min .dt{white-space:nowrap}
.wkw-mag-min h3{font-family:var(--sans);font-weight:700;font-size:16px;margin:0;color:var(--green-900)}
@media(max-width:760px){.wkw-mag-feat{grid-template-columns:1fr}}

/* Comparatif : cartes / lignes / versus */
.wkw-cmp-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.wkw-cmp-cards .c{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px;text-align:center;text-decoration:none;color:inherit;display:flex;flex-direction:column;align-items:center}
.wkw-cmp-cards .c.win{border:2px solid var(--gold)}
.wkw-cmp-cards .pill{background:var(--gold-soft);color:var(--gold-txt,#854f0b);font-family:var(--sans);font-weight:700;font-size:11px;padding:2px 9px;border-radius:6px;margin-bottom:8px}
.wkw-cmp-cards .img{width:100%;height:96px;background:var(--paper-2);border-radius:10px;display:flex;align-items:center;justify-content:center;overflow:hidden;margin-bottom:10px}
.wkw-cmp-cards .img img{max-width:100%;max-height:100%;object-fit:contain}
.wkw-cmp-cards .nm{font-family:var(--sans);font-weight:700;font-size:15px;color:var(--green-900)}
.wkw-cmp-cards .rt{color:var(--gold);font-size:13px;margin:4px 0}
.wkw-cmp-cards .price{font-family:var(--sans);font-weight:900;font-size:17px}
.wkw-cmp-lines{display:flex;flex-direction:column;gap:10px}
.wkw-cmp-lines .l{display:flex;align-items:center;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:11px;padding:12px 14px;text-decoration:none;color:inherit}
.wkw-cmp-lines .l .ico{width:52px;height:52px;flex:none;border-radius:9px;background:var(--paper-2);display:flex;align-items:center;justify-content:center;overflow:hidden}
.wkw-cmp-lines .l .ico img{width:100%;height:100%;object-fit:contain;padding:6px}
.wkw-cmp-lines .l .nm{flex:1;font-family:var(--sans);font-weight:700;color:var(--green-900);min-width:0}
.wkw-cmp-lines .l .cf{flex:none}
.wkw-cmp-lines .l .price{font-family:var(--sans);font-weight:900;white-space:nowrap}
.wkw-cmp-vs{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:center}
.wkw-cmp-vs .c{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px;text-align:center;text-decoration:none;color:inherit;display:flex;flex-direction:column;align-items:center}
.wkw-cmp-vs .img{width:100%;height:104px;background:var(--paper-2);border-radius:10px;display:flex;align-items:center;justify-content:center;overflow:hidden;margin-bottom:10px}
.wkw-cmp-vs .img img{max-width:100%;max-height:100%;object-fit:contain}
.wkw-cmp-vs .nm{font-family:var(--sans);font-weight:800;font-size:16px;color:var(--green-900)}
.wkw-cmp-vs .cf{margin:6px 0}
.wkw-cmp-vs .price{font-family:var(--sans);font-weight:900;font-size:17px}
.wkw-cmp-vs .vsx{font-family:var(--sans);font-weight:900;font-size:22px;color:var(--gold)}
@media(max-width:760px){.wkw-cmp-cards{grid-template-columns:1fr 1fr}.wkw-cmp-vs{grid-template-columns:1fr}.wkw-cmp-vs .vsx{transform:rotate(90deg)}}

/* Produits récents */
.tagN{background:var(--gold);color:#1a1304;font-family:var(--sans);font-weight:800;font-size:10px;text-transform:uppercase;letter-spacing:.04em;padding:3px 8px;border-radius:6px}
.wkw-rec--grille{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.wkw-rec-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;text-decoration:none;color:inherit;display:flex;flex-direction:column}
.wkw-rec-card .img{aspect-ratio:1;position:relative;background:var(--paper-2);display:flex;align-items:center;justify-content:center;overflow:hidden;padding:14px}
.wkw-rec-card .img img{width:100%;height:100%;object-fit:contain}
.wkw-rec-card .img .tagN{position:absolute;top:9px;left:9px}
.wkw-rec-card .b{padding:12px 14px 14px;display:flex;flex-direction:column}
.wkw-rec-card .title{font-family:var(--sans);font-weight:700;font-size:14px;line-height:1.25;color:var(--green-900)}
.wkw-rec-card .price{font-family:var(--sans);font-weight:900;font-size:16px;margin-top:8px}
.wkw-rec--rail{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px;-webkit-overflow-scrolling:touch}
.wkw-rec--rail::-webkit-scrollbar{height:8px}.wkw-rec--rail::-webkit-scrollbar-thumb{background:#cfc7b2;border-radius:4px}.wkw-rec--rail::-webkit-scrollbar-track{background:#ece7da;border-radius:4px}
.wkw-rec--rail .wkw-rec-card{flex:0 0 210px;scroll-snap-align:start}
.wkw-rec--bandeau{display:flex;flex-direction:column;gap:10px}
.wkw-rec-row{display:flex;align-items:center;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:11px;padding:10px 14px;text-decoration:none;color:inherit}
.wkw-rec-row .ico{width:60px;height:60px;flex:none;border-radius:9px;background:var(--paper-2);display:flex;align-items:center;justify-content:center;overflow:hidden}
.wkw-rec-row .ico img{width:100%;height:100%;object-fit:contain;padding:6px}
.wkw-rec-row .nm{flex:1;font-family:var(--sans);font-weight:700;color:var(--green-900);min-width:0}
.wkw-rec-row .price{font-family:var(--sans);font-weight:900;white-space:nowrap}
.wkw-rec--liste{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.wkw-rec--liste a{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:9px 12px;text-decoration:none;color:inherit}
.wkw-rec--liste .ico{width:44px;height:44px;flex:none;border-radius:7px;background:var(--paper-2);display:flex;align-items:center;justify-content:center;overflow:hidden}
.wkw-rec--liste .ico img{width:100%;height:100%;object-fit:contain;padding:4px}
.wkw-rec--liste .nm{flex:1;font-family:var(--sans);font-weight:700;font-size:14px;color:var(--green-900);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wkw-rec--liste .price{font-family:var(--sans);font-weight:900;font-size:14px;white-space:nowrap}
@media(max-width:760px){.wkw-rec--grille{grid-template-columns:1fr 1fr}.wkw-rec--liste{grid-template-columns:1fr}.wkw-rec--rail .wkw-rec-card{flex:0 0 60%}}

/* ---- #5 Filtres à facettes (palette éditoriale) ---- */
.wkw-facets{background:var(--cream,#fffdf7);border:1px solid var(--line,#e7e1d4);border-radius:12px;padding:14px 16px}
.wkw-facets-head{display:flex;align-items:center;gap:12px;margin-bottom:6px}
.wkw-facets-head .ttl{font-family:var(--sans);font-weight:800;color:var(--green-900,#13342a);font-size:13px;text-transform:uppercase;letter-spacing:.05em}
.wkw-facets-count{font-family:var(--sans);font-size:13px;color:var(--muted,#6b6456)}
.wkw-facets-clear{margin-left:auto;background:none;border:0;color:var(--green-800,#1d4636);font-size:13px;cursor:pointer;text-decoration:underline;padding:0;font-family:var(--sans)}
.wkw-fgroup{margin:10px 0 0}
.wkw-fgroup .glab{font-family:var(--sans);font-size:12px;font-weight:700;color:var(--muted,#6b6456);text-transform:uppercase;letter-spacing:.04em;margin:0 0 6px}
.wkw-fgroup .pills{display:flex;flex-wrap:wrap;gap:7px}
.wkw-pill{font-family:var(--sans);border:1px solid var(--line,#e7e1d4);background:#fff;color:var(--ink,#2f2a20);border-radius:999px;padding:5px 12px;font-size:13px;cursor:pointer;display:inline-flex;gap:6px;align-items:center;transition:.12s}
.wkw-pill .n{color:var(--muted,#6b6456);font-size:11.5px}
.wkw-pill:hover{border-color:var(--gold,#c9a24b)}
.wkw-pill.on{background:var(--green-900,#13342a);border-color:var(--green-900,#13342a);color:#fff}
.wkw-pill.on .n{color:#cfe0d4}
.wkw-fprice .wkw-range,.wkw-fspec .wkw-range{display:flex;flex-direction:column;gap:6px;margin-top:4px;max-width:320px}
.wkw-fprice .wkw-range-row,.wkw-fspec .wkw-range-row{display:flex;align-items:center;gap:10px;font-family:var(--sans);font-size:12px;font-weight:700;color:var(--muted,#6b6456)}
.wkw-fprice .wkw-range-row span,.wkw-fspec .wkw-range-row span{width:30px;flex:0 0 auto}
.wkw-fprice input[type=range],.wkw-fspec input[type=range]{flex:1;width:100%;accent-color:var(--gold,#c9a24b);cursor:pointer}
.wkw-fprice .wkw-range-out,.wkw-fspec .wkw-range-out{margin-top:8px;font-family:var(--sans);font-weight:800;font-size:13.5px;color:var(--green-800,#1d4636)}

/* ==== Article (single) : layout 2 colonnes + images responsive + Discover ==== */
.wkw-post-wrap{padding:30px 22px}
.wkw-post-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:44px;align-items:start}
.wkw-post-main{min-width:0}
.wkw-post-title{font-family:var(--sans);font-weight:900;font-size:clamp(27px,4.4vw,40px);line-height:1.12;letter-spacing:-.03em;margin:4px 0 14px}
.wkw-post-byline{font-family:var(--sans);font-size:13.5px;color:var(--muted);margin-bottom:20px;display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.wkw-post-author{color:var(--green-800);font-weight:700}
.wkw-post-author a{color:inherit}
.wkw-post-sep{color:var(--line)}
/* Image à la une : cadre 16:9 stable, fichier servi en am-featured 1200×675 pour Discover. */
.wkw-post-hero{margin:0 0 26px;aspect-ratio:16/9;overflow:hidden;border-radius:var(--r);background:var(--paper-2)}
.wkw-post-hero .wkw-img-cover,.wkw-post-hero img{width:100%;height:100%;object-fit:cover;display:block}
/* Corps d'article : typographie + images qui ne débordent jamais. */
.wkw-content{font-size:18px;line-height:1.7;color:var(--prose);max-width:74ch}
.wkw-content img{max-width:100%;height:auto;display:block;border-radius:var(--rs);margin:22px auto}
.wkw-content figure{margin:24px 0;max-width:100%}
.wkw-content figure img{margin:0 auto}
.wkw-content figcaption,.wkw-content .wp-caption-text{font-family:var(--sans);font-size:13px;color:var(--muted);text-align:center;margin-top:8px;line-height:1.45}
.wkw-content .aligncenter{margin-left:auto;margin-right:auto}
.wkw-content .alignleft{float:left;margin:6px 24px 16px 0;max-width:48%}
.wkw-content .alignright{float:right;margin:6px 0 16px 24px;max-width:48%}
.wkw-content .wp-block-image{margin:22px 0}
.wkw-content p:has(img),.wkw-content .wp-caption{max-width:100%}
/* Sidebar : sticky sur PC, empilée sous l'article sur mobile. */
.wkw-side{position:sticky;top:88px;display:flex;flex-direction:column;gap:26px}
.wkw-side-block{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px}
.wkw-side-h{font-family:var(--sans);font-size:12px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--gold-txt,#854f0b);margin:0 0 12px}
.wkw-side-links{list-style:none;margin:0;padding:0}
.wkw-side-links li{border-bottom:1px solid var(--line)}
.wkw-side-links li:last-child{border-bottom:none}
.wkw-side-links a{display:block;font-family:var(--sans);font-weight:600;font-size:15px;color:var(--green-900);text-decoration:none;padding:9px 0}
.wkw-side-links a:hover{color:var(--green-600)}
.wkw-side-posts{list-style:none;margin:0;padding:0}
.wkw-side-posts li{border-bottom:1px solid var(--line)}
.wkw-side-posts li:last-child{border-bottom:none}
.wkw-side-posts a{display:block;text-decoration:none;padding:11px 0}
.wkw-side-pt{display:block;font-family:var(--sans);font-weight:700;font-size:14.5px;line-height:1.3;color:var(--green-900)}
.wkw-side-posts a:hover .wkw-side-pt{color:var(--green-600)}
.wkw-side-pd{display:block;font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-top:4px}
@media(max-width:900px){
  .wkw-post-layout{grid-template-columns:1fr;gap:36px}
  .wkw-side{position:static;top:auto;flex-direction:column}
  .wkw-content{max-width:none}
  .wkw-content .alignleft,.wkw-content .alignright{float:none;margin:22px auto;max-width:100%}
}

/* ==== Pagination (page auteur, archives) ==== */
.wkw-pagination{margin-top:32px}
.wkw-pagination .nav-links{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:center}
.wkw-pagination .page-numbers{font-family:var(--sans);font-weight:700;font-size:14px;color:var(--green-900);text-decoration:none;padding:9px 14px;border:1px solid var(--line);border-radius:10px;background:var(--card);line-height:1}
.wkw-pagination a.page-numbers:hover{border-color:var(--green-600);color:var(--green-600)}
.wkw-pagination .page-numbers.current{background:var(--green-800);border-color:var(--green-800);color:#fff}
.wkw-pagination .page-numbers.dots{border:none;background:none;padding:9px 4px}

/* ==== Squelette magazine : bloc « à la une » (accueil deux colonnes) ==== */
.wkw-alaune{display:grid;grid-template-columns:1.5fr 1fr;gap:26px;align-items:start;margin:0 0 44px}
.wkw-alaune-main{min-width:0}
.wkw-alaune-main .wkw-pc{height:100%}
.wkw-alaune-main .wkw-pc .img{aspect-ratio:16/10}
.wkw-alaune-rail{background:var(--card);border:1px solid var(--line);border-radius:var(--r,16px);padding:18px 18px 8px}
.wkw-alaune-t{font-family:var(--serif);font-size:19px;color:var(--green-900);margin:0 0 12px;line-height:1.2}
.wkw-alaune-list{list-style:none;margin:0;padding:0;counter-reset:al}
.wkw-alaune-list li{counter-increment:al;position:relative;border-top:1px solid var(--line)}
.wkw-alaune-list li:first-child{border-top:0}
.wkw-alaune-list li::before{content:counter(al);position:absolute;left:0;top:14px;width:22px;height:22px;border-radius:50%;background:var(--green-900);color:#fff;font-family:var(--sans);font-weight:700;font-size:12px;display:flex;align-items:center;justify-content:center}
.wkw-alaune-list .wkw-ps-mini{flex-direction:row;align-items:center;text-align:left;background:transparent;border:0;border-radius:0;padding:12px 0 12px 34px;gap:11px}
.wkw-alaune-list .wkw-ps-mini .ico{width:46px;height:46px;flex:none}
.wkw-alaune-list .wkw-ps-mini .ico img{max-height:44px}
.wkw-alaune-list .wkw-ps-mini .title{flex:1;margin-top:0;text-align:left}
.wkw-alaune-list .wkw-ps-mini .val{flex:none;margin-top:0;color:var(--green-800)}
@media(max-width:760px){
  .wkw-alaune{grid-template-columns:1fr;gap:18px;margin-bottom:34px}
}

/* ── Note maison : notre évaluation, distincte de la note client ──────────── */
.wkw-noteline{margin-top:12px}
.wkw-note10{display:inline-flex;align-items:baseline;gap:5px;background:var(--green-800);color:#fff;
  border-radius:var(--r);padding:8px 14px;font-family:var(--sans);line-height:1}
.wkw-note10 b{font-size:26px;font-weight:800;letter-spacing:-.02em}
.wkw-note10 i{font-style:normal;font-size:13px;opacity:.75}
.wkw-note10 em{font-style:normal;font-size:11.5px;opacity:.8;margin-left:8px;letter-spacing:.03em;
  text-transform:uppercase;align-self:center}
.wkw-notecalc{display:grid;gap:9px;max-width:640px;font-family:var(--sans)}
.wkw-notecalc .row{display:grid;grid-template-columns:1fr 130px 44px;align-items:center;gap:12px;font-size:14px}
.wkw-notecalc .lab i{font-style:normal;color:var(--muted);font-size:12.5px}
.wkw-notecalc .bar{background:var(--paper-2);border:1px solid var(--line);border-radius:99px;height:9px;overflow:hidden}
.wkw-notecalc .fill{display:block;height:100%;border-radius:99px;background:var(--green-600)}
.wkw-notecalc .fill.ok{background:var(--green-600)}
.wkw-notecalc .fill.lo{background:var(--red)}
.wkw-notecalc .val{text-align:right;font-weight:700;color:var(--green-800)}
.wkw-notemethode{font-family:var(--sans);font-size:13px;line-height:1.65;color:var(--muted);
  max-width:68ch;margin-top:16px}
@media(max-width:620px){
  .wkw-notecalc .row{grid-template-columns:1fr 70px 40px;gap:8px;font-size:13px}
}

/* ── Sous-notes dans le héros : l'argument, visible tout de suite ─────────── */
.wkw-subnotes{display:grid;grid-template-columns:1fr 1fr;gap:9px 20px;margin-top:14px;max-width:520px;
  font-family:var(--sans)}
.wkw-subnotes .sn{min-width:0}
.wkw-subnotes .t{display:flex;justify-content:space-between;align-items:baseline;gap:8px;
  font-size:12.5px;color:var(--prose);margin-bottom:4px}
.wkw-subnotes .t b{font-weight:800;color:var(--green-800);white-space:nowrap}
.wkw-subnotes .t b i{font-style:normal;font-weight:600;font-size:10.5px;color:var(--muted)}
.wkw-subnotes .b{display:block;background:var(--paper-2);border:1px solid var(--line);
  border-radius:99px;height:7px;overflow:hidden}
.wkw-subnotes .f{display:block;height:100%;border-radius:99px;background:var(--green-600)}
.wkw-subnotes .f.ok{background:var(--green-600)}
.wkw-subnotes .f.lo{background:var(--red)}
.wkw-subnotes-link{font-family:var(--sans);font-size:12px;margin:9px 0 0}
.wkw-subnotes-link a{color:var(--muted);text-decoration:underline}
.wkw-prixdate{font-family:var(--sans);font-size:11.5px;color:var(--muted);margin-top:5px}

/* ── Barre d'action collante (position:sticky, aucun JS) ──────────────────── */
/* Couleurs de la PALETTE du site : chaque site garde son identité (anti-empreinte).
   `--card` / `--ink` forment toujours un couple lisible, y compris sur les ambiances
   sombres. La règle sur `.wkw-btn` est plus spécifique que les surcharges d'ambiance,
   sinon un bouton « transparent » (ambiance mono) devient invisible sur la barre. */
/* `fixed` et non `sticky` : en sticky la barre s'arrêtait à la fin de son conteneur
   et disparaissait en bas de page, là où le lecteur est le plus proche de décider.
   Le conteneur ne capte pas les clics (pointer-events), seule la barre le fait. */
.wkw-sticky{position:fixed;left:0;right:0;bottom:0;z-index:60;margin:0;padding:0 16px 12px;
  pointer-events:none}
.wkw-sticky .in{max-width:1180px;margin:0 auto;pointer-events:auto}
/* Réserve la hauteur de la barre pour qu'elle ne masque jamais la fin du contenu. */
body.single-product{padding-bottom:96px}
.wkw-sticky .in{display:flex;align-items:center;gap:12px;background:var(--card);color:var(--ink);
  border:1px solid var(--line);border-radius:var(--r);padding:10px 14px;
  box-shadow:0 6px 24px rgba(0,0,0,.16);font-family:var(--sans)}
.wkw-sticky .in .wkw-btn,
.wkw-sticky .in .wkw-btn.amz,
.wkw-sticky .in .wkw-btn.go{background:var(--gold);color:var(--green-900);border:none}
.wkw-sticky .in .wkw-btn:hover{background:var(--gold-bright);color:var(--green-900)}
.wkw-sticky .n{flex:none;display:inline-flex;align-items:center;justify-content:center;
  min-width:38px;height:38px;border-radius:10px;background:var(--paper-2);
  color:var(--green-800);font-weight:800;font-size:15px}
.wkw-sticky .t{flex:1;min-width:0;font-size:14px;font-weight:700;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.wkw-sticky .p{flex:none;font-size:14px;font-weight:800;color:var(--green-900)}
.wkw-sticky .wkw-btn{flex:none;margin:0}
@media(max-width:760px){
  .wkw-subnotes{grid-template-columns:1fr;max-width:none}
  .wkw-sticky .t{display:none}
  .wkw-sticky .in{padding:9px 11px;gap:9px}
}



/* ── Tableau de synthèse : sobre, lisible, unités dans les cellules ───────── */
/* Tout est tiré de la PALETTE du site. Les noms de variables sont génériques
   (voir inc/design.php) : chaque domaine a son propre coloris. Figer des couleurs
   ici donnerait exactement le même tableau sur les 100 sites, donc une empreinte. */
.wkw-synth-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:var(--card)}
.wkw-synth{width:100%;border-collapse:collapse;font-family:var(--sans);font-size:14px;min-width:660px}
.wkw-synth th{background:var(--paper-2);color:var(--green-900);text-align:center;padding:11px 12px;
  font-size:12.5px;font-weight:700;vertical-align:bottom;border-bottom:1px solid var(--line)}
.wkw-synth th.mdl{text-align:left}
.wkw-synth th em{display:block;font-style:normal;font-weight:500;font-size:10px;color:var(--muted);margin-top:3px}
.wkw-synth td{padding:12px;border-top:1px solid var(--line);text-align:center;color:var(--prose);
  font-variant-numeric:tabular-nums}
.wkw-synth td .u{color:var(--muted);font-size:11.5px;margin-left:3px}
.wkw-synth td.mdl{text-align:left;font-weight:700;font-size:14.5px;white-space:normal}
.wkw-synth td.mdl .r{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;
  border-radius:5px;background:var(--paper-2);color:var(--green-800);font-size:11.5px;font-weight:800;
  margin-right:8px;vertical-align:1px}
.wkw-synth td.mdl a{color:var(--green-900);text-decoration:none}
.wkw-synth td.mdl a:hover{text-decoration:underline}
/* Le gagnant se marque par un FILET et du gras, pas par un aplat : sur les palettes
   à accent vif, `--gold-soft` reste très saturé et le tableau vire au bloc de couleur.
   `--paper-2` est toujours un ton très clair, donc discret sur toutes les palettes. */
.wkw-synth td.win{background:var(--paper-2);font-weight:800;color:var(--green-900);
  box-shadow:inset 3px 0 0 var(--gold)}
.wkw-synth td.win .u{color:var(--green-800)}
.wkw-synth td.vide{color:var(--muted);opacity:.6}
.wkw-synth td.nte b{font-size:16px;font-weight:800;color:var(--green-800)}
.wkw-synth td.nte i{font-style:normal;font-size:11px;color:var(--muted)}
.wkw-synth-note{font-family:var(--sans);font-size:12px;color:var(--muted);margin:10px 0 0;max-width:74ch}

/* Curseurs de specs typées : même mécanique que le prix, disposés en colonnes
   pour qu'une niche à 5 critères ne fasse pas une page de filtres à rallonge. */
/* Le prix suit la même colonne que les specs : sans ça il s'étalait sur toute la
   largeur au-dessus de curseurs compacts, et le bloc paraissait bancal. */
.wkw-fprice,.wkw-fspec{display:inline-block;vertical-align:top;margin-right:26px;min-width:230px}
.wkw-fspec .glab span{text-transform:none;letter-spacing:0;font-weight:600;opacity:.75}

/* ── Page catégorie : filtres en colonne, grille à droite ─────────────────── */
/* La barre reste visible pendant le défilement (sticky), donc les filtres sont
   toujours à portée sans repousser les produits sous la ligne de flottaison. */
.wkw-catlayout{display:grid;grid-template-columns:264px minmax(0,1fr);gap:32px;align-items:start}
.wkw-catside{position:sticky;top:16px;max-height:calc(100vh - 32px);overflow:auto}
.wkw-catside .wkw-facets{margin-top:40px}
.wkw-catside .wkw-fprice,.wkw-catside .wkw-fspec{display:block;margin-right:0;min-width:0;margin-top:16px}
.wkw-catmain{min-width:0}
.wkw-catlayout .wkw-grid{grid-template-columns:repeat(3,1fr)}
@media(max-width:1080px){
  /* Sous cette largeur la colonne étoufferait la grille : on réempile, comme avant. */
  .wkw-catlayout{display:block}
  .wkw-catside{position:static;max-height:none;overflow:visible}
  .wkw-catside .wkw-fprice,.wkw-catside .wkw-fspec{display:inline-block;margin-right:26px;min-width:230px}
  .wkw-catlayout .wkw-grid{grid-template-columns:repeat(4,1fr)}
}
@media(max-width:760px){
  .wkw-catlayout .wkw-grid{grid-template-columns:repeat(2,1fr)}
}

/* ── Pastille de note sur la carte : la grille se lit comme un classement ─── */
.wkw-pc-note{position:absolute;top:9px;left:9px;z-index:2;display:inline-flex;align-items:baseline;
  gap:1px;background:var(--card);border:1.5px solid var(--green-600);color:var(--green-900);
  border-radius:9px;padding:4px 8px;font-family:var(--sans);font-weight:800;font-size:15px;
  line-height:1;box-shadow:0 2px 8px rgba(0,0,0,.08)}
.wkw-pc-note i{font-style:normal;font-weight:600;font-size:10px;color:var(--muted)}

/* ── Filtres repliables sur mobile (case à cocher + étiquette, aucun JS) ──── */
.wkw-facets-tog{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.wkw-facets-lab{display:none}
@media(max-width:1080px){
  .wkw-facets-lab{display:inline-flex;align-items:center;gap:8px;margin-top:4px;cursor:pointer;
    font-family:var(--sans);font-weight:800;font-size:14px;color:var(--green-900);
    background:var(--paper-2);border:1px solid var(--line);border-radius:999px;padding:9px 18px}
  .wkw-facets-lab::before{content:"";width:14px;height:2px;background:currentColor;
    box-shadow:0 5px 0 currentColor,0 -5px 0 currentColor}
  .wkw-facets-body{display:none}
  .wkw-facets-tog:checked ~ .wkw-facets-body{display:block}
  .wkw-facets-tog:focus-visible ~ .wkw-facets-lab{outline:2px solid var(--green-600);outline-offset:2px}
}

/* Point fort chiffré, en haut à droite de l'image : le critère où ce modèle domine.
   Déduit des sous-notes, jamais choisi à la main, donc jamais un argument marketing. */
.wkw-pc-top{position:absolute;top:9px;right:9px;z-index:2;max-width:62%;
  background:var(--green-800);color:#fff;border-radius:8px;padding:5px 9px;
  font-family:var(--sans);font-weight:800;font-size:10.5px;line-height:1.2;
  letter-spacing:.02em;text-transform:uppercase;text-align:right;
  box-shadow:0 2px 8px rgba(0,0,0,.14)}

/* ── Podium du classement : trois modèles, et pourquoi chacun ─────────────── */
.wkw-podium{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:0 0 22px}
.wkw-pod{position:relative;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r);padding:16px 16px 18px;display:flex;flex-direction:column}
.wkw-pod.win{border-color:var(--green-600);box-shadow:0 0 0 1px var(--green-600) inset}
.wkw-pod .r{position:absolute;top:-11px;left:14px;width:24px;height:24px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;background:var(--green-800);
  color:#fff;font-family:var(--sans);font-weight:800;font-size:12.5px}
.wkw-pod .im{display:flex;align-items:center;justify-content:center;background:var(--paper-2);
  border-radius:10px;aspect-ratio:4/3;overflow:hidden;margin-bottom:12px}
.wkw-pod .im img{max-width:100%;max-height:100%;object-fit:contain}
.wkw-pod h3{font-family:var(--sans);font-weight:700;font-size:15px;line-height:1.25;margin:0}
.wkw-pod h3 a{color:var(--green-900);text-decoration:none}
.wkw-pod .ln{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-top:9px}
.wkw-pod .nt b{font-family:var(--sans);font-weight:900;font-size:24px;color:var(--green-800);
  letter-spacing:-.02em}
.wkw-pod .nt i{font-style:normal;font-size:12px;color:var(--muted)}
.wkw-pod .pr{font-family:var(--sans);font-weight:800;font-size:15px;color:var(--green-900)}
.wkw-pod .pf{font-family:var(--sans);font-size:12.5px;line-height:1.5;color:var(--muted);
  margin:9px 0 0;min-height:2.2em}
.wkw-pod .cta{margin-top:14px;display:block;text-align:center;background:var(--green-800);
  color:#fff;text-decoration:none;font-family:var(--sans);font-weight:700;font-size:13.5px;
  border-radius:10px;padding:11px 12px}
.wkw-pod .cta:hover{background:var(--green-700)}
@media(max-width:760px){
  .wkw-podium{grid-template-columns:1fr;gap:22px}
  .wkw-pod .pf{min-height:0}
}

/* Légende sous l'image produit : origine du visuel + renvoi vers les autres photos. */
.wkw-photo-leg{font-family:var(--sans);font-size:11px;line-height:1.5;color:var(--muted);margin:8px 2px 0;text-align:center}
.wkw-photo-leg a{color:var(--muted);text-decoration:underline;text-underline-offset:2px}
.wkw-photo-leg a:hover{color:var(--green-600)}

/* État du marché : chiffres du relevé, publiés avec leur N. Aucune couleur en dur. */
.wkw-marche{margin:34px 0}
/* Les sections sont en H2 quand la page porte son propre H1, en H3 quand le shortcode
   est inséré sous des H2 existants : les trois niveaux doivent être stylés.
   ENFANTS DIRECTS uniquement : sans le `>`, ces règles descendaient sur les titres des
   cartes produit imbriquées, qui se retrouvaient en gros serif sur quatre lignes. */
.wkw-marche > h2{margin:30px 0 10px;font-size:24px}
.wkw-marche > h3{margin:26px 0 10px;font-size:20px}
.wkw-marche > p{margin:0 0 12px;color:var(--prose)}
.wkw-marche-intro{background:var(--paper-2);border-left:4px solid var(--green-600);
  border-radius:0 var(--rs) var(--rs) 0;padding:13px 16px;color:var(--ink)}
.wkw-marche-note{font-family:var(--sans);font-size:13px;line-height:1.55;color:var(--muted)}
.wkw-marche-tbl{overflow-x:auto;margin:0 0 12px}
.wkw-marche-tbl table{width:100%;border-collapse:collapse;font-family:var(--sans);font-size:14px;min-width:460px}
.wkw-marche-tbl th,.wkw-marche-tbl td{padding:9px 12px;text-align:left;border-bottom:1px solid var(--line)}
.wkw-marche-tbl thead th{font-size:12px;letter-spacing:.04em;text-transform:uppercase;
  color:var(--muted);border-bottom:2px solid var(--line);white-space:nowrap}
.wkw-marche-tbl tbody th{font-weight:700;color:var(--ink)}
.wkw-marche-tbl tbody tr:last-child th,.wkw-marche-tbl tbody tr:last-child td{border-bottom:0}

/* Le prix replacé dans son marché, sur la fiche et en catégorie. */
.wkw-marche-situe{font-family:var(--sans);font-size:12.5px;line-height:1.55;color:var(--muted);margin:8px 0 0}
.wkw-marche-situe strong{color:var(--ink)}
.wkw-marche-situe a{color:var(--green-600);text-decoration:underline;text-underline-offset:2px;white-space:nowrap}
.wkw-marche-lien{font-family:var(--sans);font-size:14px;margin:12px 0 0}
.wkw-marche-lien a{color:var(--green-600);text-decoration:underline;text-underline-offset:3px}
.wkw-marche-vide{color:var(--muted)}
.wkw-marche > h4{margin:20px 0 8px;font-size:17px}

/* Réponse d'abord : la phrase citable, en tête de la page marché. */
.wkw-marche-rep{font-size:19px;line-height:1.6;color:var(--ink);background:var(--paper-2);
  border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;margin:0 0 16px}
.wkw-marche-rep strong{color:var(--ink)}

/* Passerelles vers les fiches : la carte produit du site, en 3 colonnes. */
.wkw-marche-grid{grid-template-columns:repeat(3,1fr);margin:0 0 18px}
@media(max-width:900px){.wkw-marche-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.wkw-marche-grid{grid-template-columns:1fr}}

/* L'essentiel en 30 secondes : le pavé de tête de fiche, calculé depuis les sous-notes. */
.wkw-r30{background:var(--paper-2);border-left:4px solid var(--green-600);
  border-radius:0 var(--r) var(--r) 0;padding:15px 18px;margin:22px 0}
.wkw-r30 .lab{display:block;font-family:var(--sans);font-weight:800;font-size:11px;
  letter-spacing:.09em;text-transform:uppercase;color:var(--green-600);margin-bottom:7px}
.wkw-r30 p{margin:0;font-size:17px;line-height:1.62;color:var(--ink)}
.wkw-r30 strong{font-weight:800}

/* Comparateur sélectif : cases sur les cartes, barre collante, confrontation. */
.wkw-pcw{display:flex;flex-direction:column;gap:7px}
.wkw-pcw > .wkw-pc{flex:1}
.wkw-cmpbox{font-family:var(--sans);font-size:12.5px;font-weight:700;color:var(--muted);
  display:flex;align-items:center;gap:7px;cursor:pointer;user-select:none}
.wkw-cmpbox input{width:16px;height:16px;accent-color:var(--green-600);cursor:pointer}
.wkw-cmpbox:hover{color:var(--green-600)}
.wkw-cmpbar{position:sticky;bottom:14px;z-index:30;display:flex;align-items:center;
  justify-content:center;gap:16px;margin-top:20px}
.wkw-cmpbar button{font-family:var(--sans);font-weight:800;font-size:14.5px;color:#fff;
  background:var(--green-700);border:0;border-radius:999px;padding:13px 26px;cursor:pointer;
  box-shadow:0 10px 26px -12px rgba(0,0,0,.5)}
.wkw-cmpbar button:hover{background:var(--green-600)}
.wkw-cmpbar a{font-family:var(--sans);font-size:13px;color:var(--muted);text-decoration:underline}
.wkw-cmpform:not(:has(.wkw-cmpbox input:checked)) .wkw-cmpbar{display:none}
.wkw-cmp{margin:26px 0}
.wkw-cmp h2{margin:0 0 12px}
.wkw-cmp-tbl{overflow-x:auto}
.wkw-cmp-tbl table{width:100%;border-collapse:collapse;font-family:var(--sans);font-size:14px;min-width:520px}
.wkw-cmp-tbl th,.wkw-cmp-tbl td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.wkw-cmp-tbl thead th{font-size:13px;border-bottom:2px solid var(--line)}
.wkw-cmp-tbl thead a{color:var(--ink);text-decoration:none}
.wkw-cmp-tbl thead a:hover{color:var(--green-600);text-decoration:underline}
.wkw-cmp-tbl tbody th{font-weight:700;color:var(--muted);font-size:13px}
.wkw-cmp-tbl td i{font-style:normal;color:var(--muted);font-size:12.5px}
.wkw-cmp-tbl td.win{background:var(--paper-2);font-weight:800;color:var(--ink)}
.wkw-cmp-tbl td.win i{color:var(--green-600)}
.wkw-cmp-verdict{font-size:16px;line-height:1.6;background:var(--paper-2);
  border-left:4px solid var(--green-600);border-radius:0 var(--rs) var(--rs) 0;padding:13px 16px;margin:12px 0 0}

/* Comparateur : en-tête avec visuels, ligne d'achat, carte sélectionnée. */
.wkw-cmp-sub{font-family:var(--sans);font-size:15px;color:var(--muted);margin:0 0 14px}
.wkw-cmp-tbl thead th{vertical-align:bottom;width:auto}
.wkw-cmp-tbl thead th a{display:block;text-align:center}
.wkw-cmp-tbl thead th img{display:block;width:100%;max-width:150px;height:110px;
  object-fit:contain;margin:0 auto 8px;background:var(--paper-2);border-radius:var(--rs);padding:8px}
.wkw-cmp-tbl thead th a span{display:block;font-size:13.5px;line-height:1.3}
.wkw-cmp-buy td{text-align:center;padding-top:16px}
.wkw-cmp-buy .wkw-btn{display:inline-flex;width:100%;justify-content:center;margin-bottom:8px}
.wkw-cmp-buy .lien{display:block;font-size:12.5px;color:var(--green-600);text-decoration:underline}
.wkw-cmp-note{font-family:var(--sans);font-size:12.5px;line-height:1.55;color:var(--muted);margin:10px 0 0}
.wkw-pcw:has(.wkw-cmpbox input:checked){outline:2px solid var(--green-600);outline-offset:3px;border-radius:var(--r)}
.wkw-pcw:has(.wkw-cmpbox input:checked) .wkw-cmpbox{color:var(--green-600)}

/* Invitation à comparer : sans elle, les cases à cocher passent inaperçues. */
.wkw-cmp-invite{font-family:var(--sans);font-size:14px;color:var(--muted);
  background:var(--paper-2);border:1px dashed var(--line);border-radius:var(--rs);
  padding:10px 14px;margin:14px 0 0}
.wkw-cmp-invite strong{color:var(--ink)}

/* Marqueur d'ADÉQUATION. Sur un critère « cible », la valeur seule ne dit rien :
   132 cm est excellent dans un salon et mauvais dans une chambre. Variables de
   palette uniquement, aucune couleur en dur (règle anti-empreinte). */
.wkw-fit{font-family:var(--sans);font-size:11.5px;font-weight:700;text-transform:uppercase;
  letter-spacing:.03em;color:var(--green-600)}
.wkw-fit.off{color:var(--red)}

/* Coupure de famille dans la grille : une note est une position dans un catalogue,
   et deux familles ne se comparent pas. Le titre traverse toute la grille. */
.wkw-famsep{grid-column:1/-1;font-family:var(--sans);font-weight:900;font-size:19px;
  letter-spacing:-.01em;color:var(--green-900);margin:22px 0 2px;padding-top:14px;
  border-top:1px solid var(--line)}
.wkw-famsep:first-child{margin-top:0;padding-top:0;border-top:0}
.wkw-famsep span{display:block;font-size:12.5px;font-weight:500;color:var(--muted)}

/* Intertitres d'analyse : l'analyse de fiche est désormais découpée en sections
   ancrées sur une mesure réelle. Variables de palette uniquement. */
.wkw-sub{font-family:var(--sans);font-weight:800;font-size:19px;letter-spacing:-.01em;
  color:var(--green-900);margin:22px 0 6px}
.wkw-sub:first-child{margin-top:0}

/* Réponse d'abord : la phrase qui nomme le gagnant, en tête de page catégorie.
   Un moteur qui cite n'extrait qu'un fragment, il doit le trouver tout de suite. */
.wkw-answer{font-family:var(--sans);font-size:19px;line-height:1.6;font-weight:600;
  color:var(--ink);background:var(--paper-2);border-left:3px solid var(--green-600);
  border-radius:var(--rs);padding:14px 16px;margin:16px 0 0;max-width:74ch}

/* Recommandeur : trois listes dans un formulaire GET, zéro JavaScript. */
.wkw-reco{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:flex-end;
  background:var(--paper-2);border:1px solid var(--line);border-radius:var(--rs);
  padding:12px 14px;margin:16px 0 0;font-family:var(--sans);font-size:14px}
.wkw-reco .lab{flex:1 0 100%;font-weight:800;color:var(--green-900)}
.wkw-reco label{display:flex;flex-direction:column;gap:3px;color:var(--muted);font-size:12.5px}
.wkw-reco select{font-family:var(--sans);font-size:14px;padding:6px 8px;border:1px solid var(--line);
  border-radius:var(--rs);background:var(--paper);color:var(--ink)}
.wkw-reco .raz{align-self:center;color:var(--muted);font-size:12.5px;text-decoration:underline}

/* Bandeau de preuve chiffrée sous le héros : ce que le site a vraiment fait,
   compté et non saisi. Variables de palette uniquement. */
.wkw-preuve{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 0}
.wkw-preuve .it{flex:1 1 160px;background:var(--paper-2);border:1px solid var(--line);
  border-radius:var(--rs);padding:12px 14px;font-family:var(--sans)}
.wkw-preuve .n{display:block;font-size:26px;font-weight:900;letter-spacing:-.02em;color:var(--green-900);line-height:1.1}
.wkw-preuve .l{display:block;font-size:12.5px;color:var(--muted);margin-top:3px}
.wkw-preuve-sec{margin-top:6px}

/* Marque au-dessus du nom sur les cartes : l'oeil trie par marque avant de lire
   le modèle. Variables de palette uniquement. */
.wkw-marque{display:block;font-family:var(--sans);font-size:11.5px;font-weight:800;
  letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}

/* Synthèse du marché en questions chiffrées. Le seul contenu qu'un concurrent ne
   peut pas recopier : il sort de nos propres relevés. Sobre volontairement, c'est
   du texte qui doit se lire et se citer. Variables de palette uniquement. */
.wkw-marche-src{font-family:var(--sans);font-size:12.5px;color:var(--muted);
  margin:0 0 18px;max-width:74ch}
.wkw-mq{margin:0 0 16px;padding-left:14px;border-left:2px solid var(--line)}
.wkw-mq h3{font-family:var(--sans);font-size:16px;font-weight:800;color:var(--green-900);
  margin:0 0 5px;letter-spacing:-.01em}
.wkw-mq p{font-size:15.5px;line-height:1.65;color:var(--prose);margin:0;max-width:74ch}
.wkw-mq a{color:var(--green-800);text-decoration:underline;text-underline-offset:2px}

/* Trier par : une liste déroulante native, à DROITE au-dessus de la grille, contre le
   classement qu'elle commande. Dans la colonne de filtres, elle ne se voyait pas. Le tri
   est client, comme les filtres, sinon un rechargement perdrait les cases cochées. */
.wkw-fsort{display:flex;align-items:center;justify-content:flex-end;gap:8px;
  margin:0 0 14px;font-family:var(--sans);font-size:13px;color:var(--muted)}
.wkw-fsort select{font-family:var(--sans);font-size:13px;color:var(--ink);background:var(--card);
  border:1px solid var(--line);border-radius:8px;padding:6px 8px}

/* Pastilles vers les pages d'angle, sous l'intro : les portes d'entrée du maillage.
   Ce sont de vrais liens vers de vraies pages, pas des filtres. */
.wkw-chips{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 0}
.wkw-chip{display:inline-block;font-family:var(--sans);font-size:13px;font-weight:600;
  color:var(--green-900);background:var(--card);border:1px solid var(--line);
  border-radius:999px;padding:6px 13px;text-decoration:none}
.wkw-chip:hover{background:var(--paper-2);border-color:var(--green-600)}

/* Face aux autres : la comparaison nommée aux voisins de classement. Sobre, c'est
   du texte chiffré qui doit se lire, pas un encart de plus. */
.wkw-versus p{font-size:17px;line-height:1.7;color:var(--prose);margin:0 0 10px;max-width:68ch}
.wkw-versus a{color:var(--green-800);text-decoration:underline;text-underline-offset:2px}
.wkw-versus-note{font-family:var(--sans);font-size:12.5px;color:var(--muted);margin-top:12px}

/* Contenu éditorial de catégorie, en onglets et sans JavaScript.
   Un texte replié n'est pas lu, et trois blocs fermés d'affilée donnent une page qui
   paraît vide ; empilés, ils font un mur où le lecteur ne voit plus qu'il y a un guide
   ET une FAQ. L'onglet garde le premier panneau ouvert et annonce le reste.
   Mécanique : boutons radio cachés + sélecteur `:checked ~`, clavier natif. */
.wkw-edito{margin-top:40px}
.wkw-edito .body{font-size:17px;line-height:1.75;color:var(--prose);max-width:72ch}
/* DANS UN PANNEAU D'ONGLET, LE TEXTE PREND TOUTE LA LARGEUR.
   Le `max-width:72ch` ci-dessus vaut pour une section libre au fil de la page, où une
   colonne courte se lit mieux. Dans la carte, il laissait la MOITIÉ DROITE VIDE : une
   grande boîte blanche avec un filet de texte à gauche. La carte borne déjà la ligne,
   c'est elle qui tient le rôle. */
.wkw-edito-tabs .wkw-tabpanel .body{max-width:none}
.wkw-edito .body h3{font-family:var(--sans);font-size:19px;font-weight:800;color:var(--green-900);
  margin:26px 0 8px;letter-spacing:-.01em}
.wkw-edito .body p{margin:0 0 14px}
.wkw-edito-sub{font-family:var(--sans);font-size:13.5px;color:var(--muted);margin:-6px 0 16px}
.wkw-edito h2{margin:0 0 6px}

/* Les radios restent dans le flux pour que `~` fonctionne : on les sort de la vue sans
   `display:none`, qui les retirerait aussi de la navigation clavier. */
.wkw-tab-r{position:absolute;width:1px;height:1px;opacity:0;margin:0;pointer-events:none}

/* Le PANNEAU est une carte, pas une simple section : c'est la présentation que Wilfried
   voulait garder du bloc replié (blanc, coins ronds, de l'air). Ce qui changeait n'était
   jamais l'habillage, seulement le fait que le texte soit caché. */
.wkw-edito-tabs{position:relative}
.wkw-tabbar{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 -1px 8px;position:relative;z-index:2}
.wkw-tab{font-family:var(--sans);font-size:14.5px;font-weight:700;color:var(--muted);
  padding:12px 20px;background:rgba(0,0,0,.035);border:1px solid var(--line);
  border-bottom-color:transparent;border-radius:14px 14px 0 0;cursor:pointer;
  white-space:nowrap;transition:color .15s,background .15s}
.wkw-tab:hover{color:var(--green-900)}
.wkw-edito-tabs .wkw-tabpanels{position:relative;z-index:1}
.wkw-edito-tabs .wkw-tabpanel{display:none;background:#fff;border:1px solid var(--line);
  border-radius:0 18px 18px 18px;padding:26px 30px 30px;
  box-shadow:0 26px 50px -40px rgba(20,40,30,.55)}
.wkw-edito-tabs .wkw-tabpanel h2{margin:0 0 14px}
@media(max-width:640px){.wkw-edito-tabs .wkw-tabpanel{padding:22px 18px 24px;border-radius:0 14px 14px 14px}}

/* Un couple de règles par onglet. Les clés sont fixes (pourquoi, guide, FAQ), donc la
   liste est close : pas de sélecteur d'attribut à rallonge. */
.wkw-edito-tabs>.wkw-r-pq:checked~.wkw-tabpanels>.wkw-panel-pq,
.wkw-edito-tabs>.wkw-r-gd:checked~.wkw-tabpanels>.wkw-panel-gd,
.wkw-edito-tabs>.wkw-r-fq:checked~.wkw-tabpanels>.wkw-panel-fq{display:block}
/* L'onglet actif se fond dans la carte : même blanc, et la bordure du bas effacée. */
.wkw-edito-tabs>.wkw-r-pq:checked~.wkw-tabbar>.wkw-tab-pq,
.wkw-edito-tabs>.wkw-r-gd:checked~.wkw-tabbar>.wkw-tab-gd,
.wkw-edito-tabs>.wkw-r-fq:checked~.wkw-tabbar>.wkw-tab-fq{color:var(--green-900);
  background:#fff;border-bottom-color:#fff}

/* Le focus clavier doit se voir sur le LABEL, puisque la radio est invisible. */
.wkw-edito-tabs>.wkw-r-pq:focus-visible~.wkw-tabbar>.wkw-tab-pq,
.wkw-edito-tabs>.wkw-r-gd:focus-visible~.wkw-tabbar>.wkw-tab-gd,
.wkw-edito-tabs>.wkw-r-fq:focus-visible~.wkw-tabbar>.wkw-tab-fq{outline:2px solid var(--green-800);outline-offset:2px}
/* ONGLETS VERTICAUX, la seconde disposition, tirée par domaine (am_edito_layout).
   La colonne de gauche se lit comme un sommaire, les libellés respirent, et le premier
   panneau commence plus haut dans la page. La HAUTEUR MINIMALE n'est pas décorative :
   sans elle, un onglet court (la FAQ) laisse la colonne de gauche flotter à côté d'un
   panneau de trois lignes. Le DOM est identique aux onglets horizontaux, seule la grille
   change, donc rien à dupliquer côté gabarit. */
.wkw-edito-v{display:grid;grid-template-columns:246px 1fr;align-items:start}
.wkw-edito-v .wkw-tabbar{flex-direction:column;gap:6px;padding:22px 0;margin:0 -1px 0 0}
.wkw-edito-v .wkw-tab{border-radius:14px 0 0 14px;border-right-color:transparent;
  border-bottom-color:var(--line);padding:14px 18px;font-size:15px;line-height:1.3;white-space:normal}
.wkw-edito-v .wkw-tabpanel{border-radius:18px;min-height:420px}
.wkw-edito-v>.wkw-r-pq:checked~.wkw-tabbar>.wkw-tab-pq,
.wkw-edito-v>.wkw-r-gd:checked~.wkw-tabbar>.wkw-tab-gd,
.wkw-edito-v>.wkw-r-fq:checked~.wkw-tabbar>.wkw-tab-fq{border-color:var(--line);border-right-color:#fff}
/* Le numéro n'existe qu'en vertical : à l'horizontale il allongerait des libellés déjà
   à l'étroit. `aria-hidden` sur le gabarit, c'est de l'ornement, pas de l'information. */
.wkw-tab-n{display:none}
.wkw-edito-v .wkw-tab-n{display:block;font-size:11.5px;font-weight:800;letter-spacing:.1em;
  color:var(--gold);margin-bottom:3px}

/* SUR MOBILE, LA BARRE DÉFILE au lieu de s'empiler, dans les DEUX dispositions.
   « Les critères à comparer » fait 23 caractères : à trois onglets sur 375 px, la barre
   passait à deux étages et l'onglet actif se retrouvait décroché de sa carte. Et une
   colonne de gauche n'a aucun sens sur un téléphone, donc le vertical redevient une
   barre. Une seule ligne, on fait glisser du doigt. Rien n'est masqué ni dupliqué. */
@media(max-width:900px){
  .wkw-edito-v{display:block}
  .wkw-edito-v .wkw-tabbar{flex-direction:row;padding:0;margin:0 0 -1px 8px}
  .wkw-edito-v .wkw-tab{border-radius:14px 14px 0 0;border-right-color:var(--line);
    border-bottom-color:transparent;white-space:nowrap;font-size:14.5px;padding:12px 18px}
  .wkw-edito-v .wkw-tab-n{display:none}
  .wkw-edito-v .wkw-tabpanel{border-radius:0 18px 18px 18px;min-height:0}
  .wkw-edito-v>.wkw-r-pq:checked~.wkw-tabbar>.wkw-tab-pq,
  .wkw-edito-v>.wkw-r-gd:checked~.wkw-tabbar>.wkw-tab-gd,
  .wkw-edito-v>.wkw-r-fq:checked~.wkw-tabbar>.wkw-tab-fq{border-right-color:var(--line);border-bottom-color:#fff}
}
@media(max-width:640px){
  .wkw-tabbar{flex-wrap:nowrap;overflow-x:auto;gap:4px;margin-left:0;
    scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .wkw-tabbar::-webkit-scrollbar{display:none}
  .wkw-tab{padding:10px 14px;font-size:13.5px;flex:0 0 auto}
  .wkw-edito-v .wkw-tab{padding:10px 14px;font-size:13.5px;flex:0 0 auto}
}

/* Menu automatique à déroulants, sans JavaScript.
   Le parent est un <button> et non un lien : il n'a pas de page à lui. `:hover` ouvre
   à la souris, `:focus-within` au clavier, ce qui couvre les deux sans un octet de JS. */
.wkw-menu-auto .wkw-mi-sub{position:relative}
.wkw-mi-b{font-family:var(--sans);font-weight:600;font-size:.95rem;color:var(--ink);
  background:none;border:0;padding:4px 0;cursor:pointer;display:inline-flex;align-items:center;
  gap:6px;white-space:nowrap;border-bottom:2px solid transparent}
.wkw-mi-b:hover,.wkw-mi-sub:focus-within>.wkw-mi-b{color:var(--green-700);border-color:var(--gold)}
.wkw-mi-c{width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;
  border-top:5px solid currentColor;opacity:.6}
.wkw-sub{position:absolute;left:0;top:100%;z-index:60;min-width:230px;margin:0;padding:8px;
  list-style:none;background:#fff;border:1px solid var(--line);border-radius:12px;
  box-shadow:0 22px 44px -26px rgba(20,40,30,.55);
  opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .14s,transform .14s}
.wkw-mi-sub:hover>.wkw-sub,.wkw-mi-sub:focus-within>.wkw-sub{opacity:1;visibility:visible;transform:none}
.wkw-sub li{margin:0}
.wkw-sub a{display:block;padding:8px 12px;border-radius:8px;border-bottom:0;font-weight:600;
  font-size:.92rem;white-space:normal}
.wkw-sub a:hover{background:var(--paper);color:var(--green-800);border-color:transparent}
/* Sous le point de bascule, l'en-tête passe en tiroir : le déroulant flottant n'a plus
   de sens, on déplie tout sur place. */
@media(max-width:900px){
  .wkw-menu-auto{flex-direction:column;align-items:flex-start;gap:10px}
  .wkw-menu-auto .wkw-mi-sub{width:100%}
  .wkw-mi-c{display:none}
  .wkw-sub{position:static;opacity:1;visibility:visible;transform:none;border:0;box-shadow:none;
    padding:4px 0 0 12px;min-width:0;background:none}
  .wkw-sub a{padding:6px 0}
}

/* Plan du site HTML. Sobre : c'est une page de service, elle doit être lisible et dense,
   pas décorée. Le compteur dit combien de modèles derrière chaque rubrique. */
.wkw-plan-s{margin:0 0 34px}
.wkw-plan-s h2{font-size:22px;margin:0 0 12px}
.wkw-plan-l{list-style:none;margin:0;padding:0}
.wkw-plan-l .wkw-plan-l{margin:6px 0 10px 18px;padding-left:12px;border-left:1px solid var(--line)}
.wkw-plan-l li{margin:0 0 6px}
.wkw-plan-l a{color:var(--green-800);text-decoration:none;font-weight:600}
.wkw-plan-l a:hover{text-decoration:underline}
.wkw-plan-n{font-family:var(--sans);font-size:12px;color:var(--muted);margin-left:6px}
.wkw-plan-fiches{columns:2;column-gap:34px}
.wkw-plan-fiches li{break-inside:avoid}
.wkw-plan-fiches a{font-weight:500}
@media(max-width:640px){.wkw-plan-fiches{columns:1}}

/* FICHE EN DEUX COLONNES. La colonne de lecture garde sa largeur lisible, la place qui
   restait blanche à droite porte désormais la note, le prix et le bouton. */
.wkw-fiche-corps.has-rail{display:grid;grid-template-columns:minmax(0,1fr) 316px;
  gap:44px;align-items:start;margin-top:8px}
.wkw-fiche-main{min-width:0}
.wkw-rail{position:sticky;top:24px}
.wkw-rail-in{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;
  box-shadow:0 26px 50px -42px rgba(20,40,30,.55)}
.wkw-rail-note{display:flex;align-items:baseline;gap:8px;margin-bottom:14px}
.wkw-rail-note .n{font-family:var(--sans);font-size:40px;font-weight:900;line-height:1;
  color:var(--green-900);letter-spacing:-.03em}
.wkw-rail-note .l{font-family:var(--sans);font-size:12px;color:var(--muted);line-height:1.35}
.wkw-rail-note .l b{color:var(--green-800);font-size:12.5px}
.wkw-rail-sn{list-style:none;margin:0 0 16px;padding:0}
.wkw-rail-sn li{display:grid;grid-template-columns:1fr 54px 30px;align-items:center;gap:8px;
  margin:0 0 7px;font-family:var(--sans);font-size:12.5px;color:var(--prose)}
.wkw-rail-sn .k{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wkw-rail-sn .b{height:5px;border-radius:3px;background:rgba(0,0,0,.08);overflow:hidden}
.wkw-rail-sn .b i{display:block;height:100%;background:var(--green-700);border-radius:3px}
.wkw-rail-sn .v{text-align:right;font-weight:800;color:var(--green-900)}
.wkw-rail-prix{border-top:1px solid var(--line);padding-top:13px;margin-bottom:13px}
.wkw-rail-prix .k{display:block;font-family:var(--sans);font-size:11px;letter-spacing:.05em;
  text-transform:uppercase;color:var(--muted)}
.wkw-rail-prix .v{font-family:var(--sans);font-size:22px;font-weight:800;color:var(--green-900)}
.wkw-rail-cta{display:block;text-align:center;width:100%}
.wkw-rail-disc{font-family:var(--sans);font-size:11px;color:var(--muted);margin:10px 0 0;line-height:1.5}

/* La barre flottante du bas et la colonne feraient double emploi : sur grand écran la
   colonne gagne, elle ne mange pas de hauteur d'écran. La barre reprend la main dès que
   la colonne disparaît.
   `:has()` parce que la barre est émise AVANT la colonne dans le HTML, donc `~` ne peut
   pas l'atteindre. Si un navigateur ne connaît pas `:has()`, la barre reste affichée :
   c'est le comportement d'aujourd'hui, jamais une page cassée. */
@media(min-width:1001px){
  body:has(.wkw-fiche-corps.has-rail) .wkw-sticky{display:none}
}
@media(max-width:1000px){
  .wkw-fiche-corps.has-rail{display:block}
  .wkw-rail{display:none}
}

/* Lien du plan HTML vers le sitemap XML : le lecteur d un côté, les robots de l autre. */
.wkw-plan-xml{font-family:var(--sans);font-size:13px;color:var(--muted);margin:28px 0 0;
  padding-top:16px;border-top:1px solid var(--line)}
.wkw-plan-xml a{color:var(--green-800);font-weight:600}

/* ================================================================
   SQUELETTE REFONTE (maquette du 09/08/2026)
   Tout est scopé sous .wkw-home--refonte : aucune règle ne peut
   atteindre les deux autres ossatures. Les couleurs viennent des
   variables de palette, donc la peau reste tirée par domaine.
================================================================ */
.wkw-home--refonte{display:block}

/* héros : deux colonnes, une promesse, un bouton */
.wkw-rf-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:38px;align-items:center;
  padding:44px 0 40px}
.wkw-rf-hero h1{font-family:var(--serif);font-weight:700;font-size:clamp(2.05rem,4vw,2.85rem);
  line-height:1.05;letter-spacing:-.024em;margin:0 0 16px;color:var(--green-900);text-wrap:balance}
.wkw-rf-lede{color:var(--muted);font-size:1.06rem;line-height:1.55;margin:0 0 24px;max-width:48ch}
.wkw-rf-proof{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:22px 0 0;
  padding-top:18px;border-top:1px solid var(--line);font-size:.88rem;color:var(--muted)}
.wkw-rf-proof b{color:var(--ink);font-variant-numeric:tabular-nums}
.wkw-rf-proof .sep{opacity:.45}
.wkw-rf-hero-i{min-height:320px;border-radius:var(--r);background:var(--paper-2) center/cover;
  border:1px solid var(--line)}

/* bandes : le découpage de la page, pas de la décoration */
.wkw-rf-band{padding:34px 0;border-top:1px solid var(--line)}
.wkw-rf-band.alt{background:var(--paper-2);border-radius:var(--r);padding:32px 26px;
  border-top:0;margin:26px 0}

/* titre de section : H2 en sans gras, chapeau dessous, lien discret à droite */
.wkw-rf-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;
  gap:10px 22px;margin:0 0 20px}
.wkw-rf-head h2{font-family:var(--sans);font-weight:900;font-size:clamp(1.32rem,2.4vw,1.72rem);
  letter-spacing:-.025em;margin:0;color:var(--green-900);line-height:1.18;max-width:24ch;text-wrap:balance}
.wkw-rf-head p{margin:7px 0 0;color:var(--muted);font-size:.92rem;line-height:1.5;max-width:58ch}
.wkw-rf-more{font-family:var(--sans);font-weight:700;font-size:.88rem;color:var(--green-800);
  text-decoration:none;white-space:nowrap}
.wkw-rf-more:hover{text-decoration:underline}

/* tuiles : sélections et marques partagent la même grille */
.wkw-rf-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(162px,1fr));gap:11px}
.wkw-rf-tile{display:flex;flex-direction:column;gap:3px;background:var(--card,#fff);
  border:1px solid var(--line);border-radius:var(--rs);padding:13px 15px;text-decoration:none;
  color:inherit;min-width:0}
.wkw-rf-tile:hover{border-color:var(--green-700)}
.wkw-rf-tile.is-flat:hover{border-color:var(--line)}
.wkw-rf-tile b{font-family:var(--sans);font-weight:800;font-size:.98rem;letter-spacing:-.012em;
  color:var(--green-900);overflow-wrap:anywhere}
.wkw-rf-tile span{font-size:.78rem;color:var(--muted);font-variant-numeric:tabular-nums}

/* cartes produit : celles du thème, dans une grille propre à la refonte */
.wkw-rf-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px}

/* magazine : la vedette est rendue par am_home_mag_lead(), puis la rangée */
.wkw-rf-arts{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px}
.wkw-rf-art{display:block;background:var(--card,#fff);border:1px solid var(--line);
  border-radius:var(--rs);overflow:hidden;text-decoration:none;color:inherit}
.wkw-rf-art .im{display:block;aspect-ratio:16/10;background:var(--paper-2)}
.wkw-rf-art .im img{width:100%;height:100%;object-fit:cover;display:block}
.wkw-rf-art .tx{display:block;padding:13px 15px 16px}
.wkw-rf-art h3{font-family:var(--serif);font-weight:700;font-size:1rem;line-height:1.28;
  margin:0;color:var(--green-900)}

/* pied éditorial : texte + colonne de pastilles qui maille */
.wkw-rf-tail{display:grid;grid-template-columns:1.4fr .6fr;gap:30px;align-items:start}
.wkw-rf-tail-t h2{font-family:var(--sans);font-weight:900;font-size:1.34rem;letter-spacing:-.022em;
  margin:0 0 12px;color:var(--green-900);max-width:26ch;line-height:1.2}
.wkw-rf-tail-t p{color:var(--muted);font-size:.95rem;line-height:1.6;margin:0 0 12px;max-width:64ch}
.wkw-rf-tags{background:var(--card,#fff);border:1px solid var(--line);border-radius:var(--rs);padding:15px}
.wkw-rf-tags b{display:block;font-size:.85rem;margin:0 0 10px;color:var(--green-900)}
.wkw-rf-tags .row{display:flex;flex-wrap:wrap;gap:6px}
.wkw-rf-tags a{font-size:.78rem;padding:5px 10px;border-radius:999px;border:1px solid var(--line);
  color:var(--muted);text-decoration:none}
.wkw-rf-tags a:hover{color:var(--green-900);border-color:var(--green-700)}

@media(max-width:860px){
  .wkw-rf-hero{grid-template-columns:1fr;gap:24px;padding:30px 0 28px}
  .wkw-rf-hero-i{min-height:190px;order:-1}
  .wkw-rf-tail{grid-template-columns:1fr}
  .wkw-rf-band.alt{padding:24px 18px}
}

/* ---- refonte : bandes PLEINE LARGEUR ----------------------------------
   `overflow-x:clip` sur html, et non `hidden` : clip ne crée pas de conteneur
   de défilement, donc les positions collantes continuent de fonctionner. Sans
   lui, `100vw` déborde de la largeur de la barre de défilement sous Windows. */
html:has(.wkw-home--refonte){overflow-x:clip}
.wkw-home--refonte .wkw-rf-band.alt{
  margin-left:50%;transform:translateX(-50%);width:100vw;max-width:100vw;
  border-radius:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:38px max(24px,calc(50vw - 560px))}

/* ---- refonte : bloc « commencez par votre usage » ---- */
.wkw-rf-pieces{display:grid;grid-template-columns:repeat(auto-fit,minmax(212px,1fr));gap:13px}
.wkw-rf-piece{display:flex;flex-direction:column;gap:10px;background:var(--card,#fff);
  border:1px solid var(--line);border-radius:var(--rs);padding:16px 17px;
  text-decoration:none;color:inherit}
.wkw-rf-piece:hover{border-color:var(--green-700)}
.wkw-rf-piece h3{font-family:var(--serif);font-weight:700;font-size:1.05rem;line-height:1.24;
  margin:0;color:var(--green-900)}
.wkw-rf-piece .pick{display:flex;align-items:center;gap:10px;margin-top:auto;padding-top:11px;
  border-top:1px solid var(--line)}
.wkw-rf-piece .mark{flex:none;font-family:var(--sans);font-weight:800;font-size:.95rem;
  font-variant-numeric:tabular-nums;color:var(--green-900);background:var(--paper-2);
  border:1px solid var(--line);border-radius:7px;padding:4px 8px}
.wkw-rf-piece .nm{font-size:.86rem;line-height:1.3;color:var(--ink);min-width:0}
.wkw-rf-piece .nm small{display:block;color:var(--muted);font-size:.74rem}

/* ---- refonte : carte produit de la maquette ---- */
.wkw-rf-card{display:flex;flex-direction:column;background:var(--card,#fff);
  border:1px solid var(--line);border-radius:var(--rs);overflow:hidden;
  text-decoration:none;color:inherit}
.wkw-rf-card:hover{border-color:var(--green-700)}
.wkw-rf-card .im{display:block;position:relative;aspect-ratio:5/4;background:var(--paper-2)}
.wkw-rf-card .im img{width:100%;height:100%;object-fit:contain;display:block}
.wkw-rf-card .im .m{position:absolute;left:9px;top:9px;background:var(--card,#fff);
  border:1px solid var(--line);border-radius:7px;padding:3px 8px;font-family:var(--sans);
  font-weight:800;font-size:.86rem;color:var(--green-900);font-variant-numeric:tabular-nums}
.wkw-rf-card .bd{display:flex;flex-direction:column;gap:5px;padding:12px 14px 14px;flex:1}
.wkw-rf-card .kd{font-size:.74rem;color:var(--muted)}
.wkw-rf-card .nm{font-family:var(--serif);font-weight:700;font-size:.98rem;line-height:1.25;
  color:var(--green-900)}
.wkw-rf-card .ft{display:flex;align-items:baseline;justify-content:space-between;gap:8px;
  margin-top:auto;padding-top:6px}
.wkw-rf-card .px{font-family:var(--sans);font-weight:800;font-variant-numeric:tabular-nums;
  color:var(--green-900)}
.wkw-rf-card .go{font-size:.8rem;font-weight:700;color:var(--green-800)}

@media(max-width:860px){
  .wkw-home--refonte .wkw-rf-band.alt{padding:26px 20px}
}
.wkw-rf-tail-s{display:flex;flex-direction:column;gap:12px}
.wkw-rf-tags.is-angles .wkw-chips{display:flex;flex-wrap:wrap;gap:6px}
.wkw-rf-tags.is-angles .wkw-chip{font-size:.78rem;padding:5px 10px;border-radius:999px;
  border:1px solid var(--line);color:var(--muted);text-decoration:none;background:transparent}
.wkw-rf-tags.is-angles .wkw-chip:hover{color:var(--green-900);border-color:var(--green-700)}