/* Generators Rated: single stylesheet */
:root{
  --encre:#1b1f26; --texte:#30363f; --gris:#6a717c; --ligne:#e5e5e3; --fond:#ffffff; --fond2:#f6f5f2;
  --vert:#b4470a; --vert-f:#873406; --vert-c:#fdeee3; --ambre:#f5ad1b; --ambre-c:#fff5dd; --rouge:#b5452f;
  --rayon:14px; --ombre:0 1px 2px rgba(27,31,38,.06),0 6px 20px rgba(27,31,38,.06);
  --titre:"Sora",system-ui,sans-serif; --corps:"Inter",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fond);color:var(--texte);font:16px/1.65 var(--corps)}
img{max-width:100%;height:auto;display:block}
a{color:var(--vert)}
a:hover{color:var(--vert-f)}
h1,h2,h3,h4{font-family:var(--titre);color:var(--encre);line-height:1.25;letter-spacing:-.01em}
h1{font-size:clamp(1.7rem,3.6vw,2.5rem);margin:.2em 0 .4em}
h2{font-size:clamp(1.3rem,2.4vw,1.7rem);margin:1.8em 0 .6em}
h3{font-size:1.1rem;margin:1.4em 0 .4em}
.wrap{max-width:1180px;margin:0 auto;padding:0 16px}
.etroit{max-width:820px}
.muted{color:var(--gris)} .petit{font-size:.88rem}
.surtitre{display:inline-block;font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--vert);margin-bottom:.3em}

/* bandeau + en-tête */
.bandeau{background:var(--encre);color:#dadde2;font-size:.82rem;text-align:center;padding:7px 16px}
.entete{border-bottom:1px solid var(--ligne);background:#fff;position:sticky;top:0;z-index:20}
.entete .wrap{display:flex;align-items:center;gap:20px;min-height:86px;padding-top:10px;padding-bottom:10px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--encre);font:700 1.05rem/1.1 var(--titre)}
.logo small{display:block;font:500 .72rem var(--corps);color:var(--gris)}
.nav{margin-left:auto;display:flex;align-items:center;gap:2px}
.nav>a,.nav summary{padding:8px 10px;font-size:.95rem;white-space:nowrap;border-radius:9px;text-decoration:none;color:var(--encre);font-weight:500;cursor:pointer;list-style:none}
.nav summary::-webkit-details-marker{display:none}
.nav>a:hover,.nav summary:hover{background:var(--fond2)}
.menu{position:relative}
.nav summary::after{content:"";display:inline-block;margin-left:6px;border:4px solid transparent;border-top-color:currentColor;transform:translateY(2px)}
.menu[open]>summary{background:var(--fond2)}
.sous{display:none;position:absolute;left:0;top:calc(100% + 8px);min-width:250px;max-width:340px;background:#fff;border:1px solid var(--ligne);border-radius:var(--rayon);box-shadow:var(--ombre);padding:10px 14px;z-index:30}
.menu[open] .sous{display:block}
.sous.deux-col{columns:2;column-gap:22px;min-width:360px}
.menu:last-of-type .sous,.menu:nth-last-of-type(2) .sous{left:auto;right:0}
.sous b{display:block;font:600 .74rem var(--corps);text-transform:uppercase;letter-spacing:.06em;color:var(--gris);margin:8px 0 2px}
.sous b:first-child{margin-top:2px}
.sous a{display:flex;justify-content:space-between;gap:10px;padding:5px 0;text-decoration:none;color:var(--texte);font-size:.93rem;break-inside:avoid}
.sous a span{color:var(--gris);font-size:.8rem}
.sous a:hover{color:var(--vert)}
.sous a.tout{font-weight:600;color:var(--vert);border-top:1px solid var(--ligne);margin-top:4px;padding-top:8px;column-span:all}
.burger{display:none}
@media (max-width:1100px){
  .nav{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--ligne);flex-direction:column;align-items:stretch;padding:8px 16px 16px}
  .nav.ouvert{display:flex}
  .nav>a,.nav summary{padding:11px 4px;border-bottom:1px solid var(--ligne);border-radius:0}
  .sous{position:static;min-width:0;max-width:none;box-shadow:none;border:0;padding:4px 0 10px 12px}
  .sous.deux-col{min-width:0}
  .burger{display:block;margin-left:auto;background:none;border:1px solid var(--ligne);border-radius:9px;padding:8px 12px;font:600 .9rem var(--corps);color:var(--encre)}
}

/* fil d'ariane, en-têtes */
.fil{font-size:.85rem;color:var(--gris);margin:18px 0 6px}
.fil a{color:var(--gris)}
.tete-cat{padding:10px 0 18px;max-width:860px}
.tete-cat p{font-size:1.06rem}
.ancres{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.ancres a{font-size:.88rem;border:1px solid var(--ligne);border-radius:99px;padding:5px 12px;text-decoration:none;color:var(--encre)}
.ancres a:hover{border-color:var(--vert);color:var(--vert)}

/* boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--ambre);color:#1d1503;font-weight:700;border-radius:11px;padding:12px 18px;text-decoration:none;border:0;cursor:pointer;font-size:.98rem}
.btn:hover{background:#e39a08;color:#1d1503}
.btn.sec{background:var(--vert);color:#fff}
.btn.sec:hover{background:var(--vert-f);color:#fff}
.btn.ligne{background:#fff;color:var(--encre);border:1px solid var(--ligne)}

/* encadrés */
.encadre{background:var(--fond2);border-radius:var(--rayon);padding:18px 20px;margin:22px 0}
.encadre.or{background:var(--ambre-c)}
.encadre.vert{background:var(--vert-c)}
.encadre ul{margin:.4em 0 0;padding-left:1.2em}

/* podium */
.podium{display:grid;grid-template-columns:1fr 1.1fr 1fr;gap:16px;align-items:end;margin:8px 0 10px}
.marche{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;background:#fff;border:1px solid var(--ligne);border-radius:var(--rayon);padding:16px;text-decoration:none;color:var(--texte);box-shadow:var(--ombre)}
.marche.premier{border:2px solid var(--ambre);padding:22px 16px}
.marche img{height:130px;width:auto;object-fit:contain}
.marche b{color:var(--encre)}
.medaille{font-size:1.6rem}
@media (max-width:700px){.podium{grid-template-columns:1fr}.marche.premier{order:-1}}

/* notes */
.note-grande{font:700 2rem/1 var(--titre);color:var(--vert)}
.pastille{display:inline-flex;align-items:baseline;gap:2px;background:var(--vert);color:#fff;font:700 1rem/1 var(--titre);border-radius:10px;padding:8px 10px}
.pastille small{font-size:.7em;opacity:.8}
.barres{display:grid;gap:9px;margin:12px 0}
.barre{display:grid;grid-template-columns:150px 1fr 40px;gap:10px;align-items:center;font-size:.9rem}
.barre .piste{position:relative;height:9px;background:var(--fond2);border-radius:99px}
.barre .rempli{position:absolute;left:0;top:0;bottom:0;background:var(--vert);border-radius:99px}
.barre .moy{position:absolute;top:-4px;bottom:-4px;border-left:2px dashed var(--gris)}
.barre b{text-align:right;color:var(--encre)}
@media (max-width:520px){.barre{grid-template-columns:110px 1fr 36px}}

/* catalogue + filtres */
.catalogue{display:grid;grid-template-columns:250px 1fr;gap:26px;margin:26px 0}
.filtres{position:sticky;top:84px;align-self:start;max-height:calc(100vh - 100px);overflow:auto;border:1px solid var(--ligne);border-radius:var(--rayon);padding:14px 16px;font-size:.92rem}
.filtres h3{font-size:.86rem;margin:14px 0 6px;text-transform:uppercase;letter-spacing:.05em;color:var(--gris);font-family:var(--corps)}
.filtres h3:first-child{margin-top:0}
.filtres label{display:flex;align-items:center;gap:8px;padding:2px 0;cursor:pointer}
.filtres label span{margin-left:auto;color:var(--gris);font-size:.8rem}
.filtres input[type=range]{width:100%;accent-color:var(--vert)}
.valeur-range{font-size:.85rem;color:var(--gris)}
.filtres-tete{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;gap:10px;flex-wrap:wrap}
.filtres-tete select{font:inherit;padding:6px 10px;border-radius:9px;border:1px solid var(--ligne)}
.btn-filtres{display:none}
@media (max-width:900px){
  .catalogue{grid-template-columns:1fr}
  .filtres{position:static;max-height:none;display:none}
  .filtres.ouvert{display:block}
  .btn-filtres{display:inline-flex}
}
.liste{display:grid;gap:14px}
.ligne-produit{display:grid;grid-template-columns:44px 120px 1fr auto;gap:16px;align-items:center;border:1px solid var(--ligne);border-radius:var(--rayon);padding:14px 16px;text-decoration:none;color:var(--texte);background:#fff;transition:border-color .15s,box-shadow .15s}
.ligne-produit:hover{border-color:var(--vert);box-shadow:var(--ombre);color:var(--texte)}
.ligne-produit .rang{font:700 1.2rem var(--titre);color:var(--gris);text-align:center}
.ligne-produit img{width:120px;height:96px;object-fit:contain}
.ligne-produit h3{margin:0 0 4px;font-size:1.08rem}
.puces{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
.puce{font-size:.8rem;background:var(--fond2);border-radius:7px;padding:3px 8px;color:var(--encre)}
.puce.ok{background:var(--vert-c)}
.ligne-produit .droite{display:flex;flex-direction:column;align-items:flex-end;gap:8px;text-align:right}
.lien-voir{font-weight:600;color:var(--vert);font-size:.9rem}
@media (max-width:640px){
  .ligne-produit{grid-template-columns:80px 1fr;gap:10px 12px}
  .ligne-produit .rang{display:none}
  .ligne-produit img{width:80px;height:70px}
  .ligne-produit .droite{grid-column:1/-1;flex-direction:row;justify-content:space-between;align-items:center}
}
.vide{display:none;padding:30px;text-align:center;color:var(--gris)}

/* grilles de cartes */
.grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px;margin:14px 0}
.carte{display:flex;flex-direction:column;gap:6px;border:1px solid var(--ligne);border-radius:var(--rayon);padding:16px;text-decoration:none;color:var(--texte);background:#fff;transition:border-color .15s,box-shadow .15s}
.carte:hover{border-color:var(--vert);box-shadow:var(--ombre);color:var(--texte)}
.carte img{height:120px;width:100%;object-fit:contain;margin-bottom:6px}
.carte b{color:var(--encre);font-family:var(--titre)}
.carte .bas{margin-top:auto;display:flex;justify-content:space-between;align-items:center;padding-top:8px}
.tuiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.tuile{display:block;border:1px solid var(--ligne);border-radius:12px;padding:14px 16px;text-decoration:none;color:var(--encre);font-weight:600;background:#fff}
.tuile span{display:block;font-weight:400;font-size:.84rem;color:var(--gris)}
.tuile:hover{border-color:var(--vert);color:var(--vert)}

/* fiche produit */
.fiche-tete{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:32px;margin:6px 0 24px}
.fiche-photo{background:var(--fond2);border-radius:var(--rayon);display:flex;align-items:center;justify-content:center;padding:20px;min-height:280px}
.fiche-photo img{max-height:320px;width:auto}
.achat{border:1px solid var(--ligne);border-radius:var(--rayon);padding:18px;box-shadow:var(--ombre);align-self:start;position:sticky;top:84px}
.achat .btn{width:100%;margin:12px 0 6px}
.mention{font-size:.78rem;color:var(--gris)}
@media (max-width:900px){.fiche-tete{grid-template-columns:1fr}.achat{position:static}}
.retenir{border-left:4px solid var(--vert);padding:4px 0 4px 16px;margin:18px 0}
.pf{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:18px 0}
.pf>div{border-radius:var(--rayon);padding:14px 16px;background:var(--fond2)}
.pf .plus{background:var(--vert-c)} .pf .moins{background:#fbeae6}
.pf h3{margin:0 0 6px;font-size:1rem}
.pf ul{margin:0;padding-left:1.1em}
@media (max-width:800px){.pf{grid-template-columns:1fr}}
table{border-collapse:collapse;width:100%;font-size:.94rem}
th,td{text-align:left;padding:9px 12px;border-bottom:1px solid var(--ligne);vertical-align:top}
th{color:var(--gris);font-weight:500;width:45%}
.tableau-defil{overflow-x:auto}
.section-num{display:grid;grid-template-columns:44px 1fr;gap:12px}
.section-num .num{font:700 1.4rem var(--titre);color:var(--vert);padding-top:1.6em}
.autonomie{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;margin:12px 0}
.autonomie div{background:var(--fond2);border-radius:12px;padding:12px}
.autonomie b{display:block;font:700 1.15rem var(--titre);color:var(--encre)}
.incertain{font-size:.85rem;background:var(--ambre-c);border-radius:10px;padding:10px 14px;margin:12px 0}

/* comparaisons */
.duel{width:100%;table-layout:fixed}
.duel th{width:auto}
.duel td.gagne{background:var(--vert-c);font-weight:600}
.duel-tete{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:center;text-align:center;margin:10px 0 20px}
.duel-tete img{height:150px;width:auto;margin:0 auto 8px;object-fit:contain}
.vs{font:800 1.4rem var(--titre);color:var(--gris)}

/* FAQ */
.faq details{border:1px solid var(--ligne);border-radius:12px;padding:12px 16px;margin:10px 0;background:#fff}
.faq summary{cursor:pointer;font-weight:600;color:var(--encre)}
.faq details p{margin:.6em 0 0}

/* comparateur */
.comparer-choix{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:16px 0}
.comparer-choix select{width:100%;font:inherit;padding:10px;border-radius:10px;border:1px solid var(--ligne)}
@media (max-width:700px){.comparer-choix{grid-template-columns:1fr}}

/* contenu éditorial */
.contenu{max-width:820px}
.contenu h2{scroll-margin-top:90px}
.contenu table{margin:14px 0}
.sommaire{background:var(--fond2);border-radius:var(--rayon);padding:14px 20px;margin:18px 0}
.sommaire ol{margin:.3em 0 0;padding-left:1.2em}

/* pied */
.pied{background:var(--encre);color:#cfd2d8;margin-top:70px;padding:40px 0 26px;font-size:.92rem}
.pied a{color:#fff;text-decoration:none}
.pied a:hover{text-decoration:underline}
.pied .cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:26px}
.pied b{color:#fff;display:block;margin-bottom:8px;font-family:var(--titre)}
.pied ul{list-style:none;margin:0;padding:0;display:grid;gap:5px}
.pied .legal{border-top:1px solid #2f343d;margin-top:28px;padding-top:16px;font-size:.82rem;color:#a3a8b1}
@media (max-width:800px){.pied .cols{grid-template-columns:1fr 1fr}}
.section{padding:12px 0}
.hero{background:linear-gradient(180deg,var(--vert-c),#fff);padding:34px 0 18px}
.hero p.chapo{font-size:1.12rem;max-width:720px}

/* liens affiliés de la fiche */
a.fiche-photo{position:relative;text-decoration:none;cursor:pointer;transition:box-shadow .15s}
a.fiche-photo:hover{box-shadow:inset 0 0 0 2px var(--ambre)}
.photo-cta{position:absolute;right:14px;bottom:14px;background:var(--ambre);color:#1d1503;font-weight:700;font-size:.85rem;border-radius:9px;padding:7px 12px}
a.lien-affi{font-weight:600;color:var(--vert);text-decoration-color:var(--ambre);text-decoration-thickness:2px;text-underline-offset:3px}
.cta-fiche{display:grid;grid-template-columns:64px 1fr auto;gap:14px;align-items:center;border:1px solid var(--ligne);border-left:4px solid var(--ambre);border-radius:var(--rayon);padding:12px 16px;margin:20px 0;text-decoration:none;color:var(--texte);background:#fff;transition:border-color .15s,box-shadow .15s}
.cta-fiche:hover{border-color:var(--ambre);box-shadow:var(--ombre);color:var(--texte)}
.cta-fiche img{width:64px;height:52px;object-fit:contain}
.cta-fiche b{display:block;color:var(--encre)}
.cta-fiche .btn{white-space:nowrap}
@media (max-width:640px){.cta-fiche{grid-template-columns:52px 1fr}.cta-fiche img{width:52px}.cta-fiche .btn{grid-column:1/-1}}
.barre-achat{position:fixed;left:0;right:0;bottom:0;z-index:25;background:#fff;border-top:1px solid var(--ligne);box-shadow:0 -6px 20px rgba(27,31,38,.08);text-decoration:none;color:var(--texte)}
.barre-achat[hidden]{display:none}
.barre-achat .wrap{display:flex;align-items:center;gap:12px;padding-top:8px;padding-bottom:8px}
.barre-achat img{width:48px;height:40px;object-fit:contain}
.barre-achat .ba-nom{flex:1;min-width:0}
.barre-achat .ba-nom b{display:block;color:var(--encre);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.barre-achat .btn{padding:10px 14px;white-space:nowrap}
@media (max-width:520px){.barre-achat .ba-nom .petit{display:none}.barre-achat .btn{font-size:.88rem;padding:9px 11px}}
body.avec-barre .pied{padding-bottom:90px}
a.achat{display:flex;flex-direction:column;gap:6px;text-decoration:none;color:var(--texte);cursor:pointer;transition:border-color .15s,box-shadow .15s}
a.achat:hover{border-color:var(--ambre);box-shadow:0 0 0 2px var(--ambre),var(--ombre);color:var(--texte)}
a.achat:hover .btn{background:#e39a08}
a.achat .barres{display:grid}
a.achat .barre b,a.achat .note-grande{color:inherit}
a.achat .barre b{color:var(--encre)}
a.achat .note-grande{color:var(--vert)}
.barres-legende{display:block}
.achat-prix{display:block;margin-top:6px}

/* visuels d'ambiance */
.tete-cat.avec-visuel{max-width:none;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:32px;align-items:center}
.tete-cat.avec-visuel>div{order:-1}
.visuel-tete{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:var(--rayon);box-shadow:var(--ombre)}
@media (max-width:860px){.tete-cat.avec-visuel{grid-template-columns:1fr}.tete-cat.avec-visuel>div{order:0}.visuel-tete{aspect-ratio:16/8}}
.visuel-guide{width:100%;aspect-ratio:16/8;object-fit:cover;border-radius:var(--rayon);margin:8px 0 18px}
.hero.hero-visuel{position:relative;background:linear-gradient(90deg,rgba(27,31,38,.86) 0%,rgba(27,31,38,.62) 50%,rgba(27,31,38,.15) 100%),var(--fond-hero) center/cover no-repeat;color:#fff;padding:70px 0 60px}
.hero.hero-visuel h1{color:#fff;max-width:640px}
.hero.hero-visuel .chapo{color:#ebedf0}
.hero.hero-visuel .surtitre{color:var(--ambre)}
@media (max-width:700px){.hero.hero-visuel{background:linear-gradient(180deg,rgba(27,31,38,.78),rgba(27,31,38,.88)),var(--fond-hero) center/cover no-repeat;padding:44px 0 36px}}

/* ================= refonte UX (modèle meilleuremachineagrain) ================= */
:root{--page:#f7f6f3;--papier:#ffffff}
body{background:var(--page)}
.entete{background:var(--papier)}
.section{padding:48px 0}
.section.blanc{background:var(--papier);border-block:1px solid var(--ligne)}
.section-tete{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:22px;flex-wrap:wrap}
.section-tete h2{margin:0}
.section-tete>a{font-weight:600;text-decoration:none;white-space:nowrap}
.btn.ligne{background:var(--papier)}

/* hero accueil */
.hero{background:transparent;padding:52px 0 40px}
.hero-grille{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center}
.hero h1{font-size:clamp(2rem,4.6vw,3.1rem);margin:.15em 0 .35em}
.hero .chapo{font-size:1.1rem;color:var(--gris);max-width:560px}
.hero .actions{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0}
.confiance{display:flex;gap:18px;flex-wrap:wrap;font-size:.86rem;color:var(--gris)}
.confiance b{color:var(--encre)}
.hero-visuel{position:relative}
.hero-photo{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:20px;box-shadow:var(--ombre)}
.hero-carte{position:relative;margin:-90px 18px 0;display:grid;grid-template-columns:120px 1fr;gap:18px;align-items:center;background:var(--papier);border:1px solid var(--ligne);border-radius:18px;padding:18px 20px;box-shadow:0 10px 30px rgba(27,31,38,.12);text-decoration:none;color:var(--texte);transition:border-color .15s}
.hero-carte:hover{border-color:var(--vert);color:var(--texte)}
.hero-carte img{width:120px;height:100px;object-fit:contain}
.hero-carte>span{display:flex;flex-direction:column;gap:3px}
.hc-nom{font:700 1.2rem/1.2 var(--titre);color:var(--encre)}
.hc-note{font:700 1.9rem/1 var(--titre);color:var(--vert);margin-top:4px}
.hc-note small{font-size:.45em;color:var(--gris)}
.hc-pied{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
@media (max-width:900px){.hero-grille{grid-template-columns:1fr;gap:28px}.hero-carte{margin:-60px 10px 0;grid-template-columns:90px 1fr}.hero-carte img{width:90px;height:80px}}

/* tuiles avec vignette */
.tuile{background:var(--papier);border-radius:var(--rayon);padding:16px 18px}
.tuile b{display:block;font:600 1.05rem/1.3 var(--titre);color:var(--encre);margin-bottom:4px}
.tuiles-visuel{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.tuiles-visuel .tuile{padding:0 0 14px;overflow:hidden}
.tuiles-visuel .tuile b,.tuiles-visuel .tuile>span{padding:0 16px}
.vignette{width:100%;aspect-ratio:16/9;object-fit:cover;margin-bottom:12px;transition:transform .3s}
.tuile:hover .vignette{transform:scale(1.03)}

/* cartes produit */
.grille-produits{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px}
.carte{position:relative;display:flex;flex-direction:column;gap:0;padding:0;overflow:hidden;background:var(--papier);border:1px solid var(--ligne);border-radius:var(--rayon);text-decoration:none;color:var(--texte);transition:box-shadow .15s,border-color .15s}
.carte:hover{box-shadow:var(--ombre);border-color:var(--vert);color:var(--texte)}
.carte .visuel{display:flex;justify-content:center;align-items:center;height:200px;padding:26px 16px 10px;background:#fff}
.carte .visuel img{max-height:100%;width:auto;height:auto;object-fit:contain;margin:0}
.carte .corps{display:flex;flex-direction:column;gap:6px;flex:1;padding:14px 16px 16px;border-top:1px solid var(--ligne)}
.carte .marque{font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--gris)}
.carte .nom{font:600 1.05rem/1.3 var(--titre);color:var(--encre)}
.carte .specs{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0 4px}
.carte .pied-carte{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:auto;padding-top:10px;border-top:1px solid var(--ligne);font-size:.88rem}
.carte .prix{font-weight:600;color:var(--encre)}
.carte .lien{font-weight:600;color:var(--vert);white-space:nowrap}
.badge-note{position:absolute;top:12px;left:12px;z-index:1;background:var(--vert);color:#fff;font:700 .95rem/1 var(--corps);padding:8px 9px;border-radius:10px}
.badge-accroche{position:absolute;top:14px;right:12px;z-index:1;max-width:58%;background:var(--ambre-c);color:#7a4d00;font-size:.68rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:4px 8px;border-radius:6px;text-align:right}

/* classement */
.catalogue{grid-template-columns:240px 1fr}
.filtres{background:var(--papier)}
.reinit{background:none;border:0;padding:0;color:var(--vert);font:600 .88rem var(--corps);text-decoration:underline;cursor:pointer}
.chiffres{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px}
.chiffres div{background:var(--page);border-radius:var(--rayon);padding:16px 18px}
.chiffres b{display:block;font:700 1.6rem/1.1 var(--titre);color:var(--vert)}
.chiffres span{font-size:.86rem;color:var(--gris)}
.contenu{max-width:780px;margin-inline:auto}
.tete-cat.avec-visuel{max-width:none}
.marche{background:var(--papier)}

/* duels */
.grille-duels{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.carte-duel{display:flex;flex-direction:column;gap:6px;background:var(--papier);border:1px solid var(--ligne);border-radius:var(--rayon);padding:16px;text-decoration:none;color:var(--texte);transition:border-color .15s}
.carte-duel:hover{border-color:var(--vert);color:var(--texte)}
.carte-duel b{font:600 1.02rem/1.3 var(--titre);color:var(--encre)}
.cd-visuels{display:flex;align-items:center;justify-content:center;gap:10px;height:130px;background:linear-gradient(180deg,#fdf2e6,#f5e6d6);border-radius:10px;padding:10px}
.cd-visuels img{height:100%;width:auto;max-width:42%;object-fit:contain}
.cd-visuels .vs{font:800 .95rem var(--titre);color:var(--gris)}

/* fiche */
.fiche-tete{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:36px;align-items:start;margin:8px 0 34px}
.fiche-tete h1{font-size:clamp(1.6rem,3.2vw,2.3rem)}
a.fiche-photo{background:#fff;border:1px solid var(--ligne);border-radius:20px;min-height:420px;padding:30px;position:sticky;top:84px}
a.fiche-photo img{max-height:380px}
a.achat{display:flex;flex-direction:column;gap:12px;position:static;border:0;box-shadow:none;padding:0;background:none}
a.achat:hover{border:0;box-shadow:none}
a.achat:hover .bloc-note,a.achat:hover .offres{border-color:var(--ambre)}
.bloc-note{display:flex;gap:20px;align-items:center;background:var(--papier);border:1px solid var(--ligne);border-radius:var(--rayon);padding:18px 20px;transition:border-color .15s}
.note-cercle{flex-shrink:0;width:88px;height:88px;border-radius:50%;background:var(--vert);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center}
.note-cercle b{font:700 1.8rem/1 var(--titre)}
.note-cercle small{font-size:.72rem;opacity:.85}
.criteres{flex:1;display:grid;gap:9px}
.critere{display:block}
.ligne-c{display:flex;justify-content:space-between;font-size:.88rem;margin-bottom:4px}
.ligne-c b{color:var(--encre)}
.jauge{display:block;position:relative;height:8px;background:var(--ligne);border-radius:99px}
.jauge .rempli{position:absolute;inset:0 auto 0 0;background:var(--vert);border-radius:99px}
.jauge .moy{position:absolute;top:-4px;bottom:-4px;border-left:2px dashed var(--encre);opacity:.4}
.offres{display:block;background:var(--papier);border:1px solid var(--ligne);border-radius:var(--rayon);overflow:hidden;transition:border-color .15s}
.titre-offres{display:block;font-size:.74rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--gris);padding:11px 18px;border-bottom:1px solid var(--ligne)}
.offre{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 18px;background:#fff8ee}
.offre .m{display:block;font-weight:700;color:var(--encre)}
.offre .etiquette{display:block;font-size:.78rem;color:var(--vert);font-weight:600}
.offre .btn{white-space:nowrap}
@media (max-width:900px){.fiche-tete{grid-template-columns:1fr}a.fiche-photo{position:relative;top:0;min-height:280px}a.fiche-photo img{max-height:260px}}
@media (max-width:520px){.bloc-note{flex-direction:column;align-items:stretch}.note-cercle{align-self:center}.offre{flex-direction:column;align-items:stretch;text-align:center}}
.section-num .num{color:#fff;background:var(--vert);width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-size:1rem;padding:0;margin-top:1.8em}
.criteres{grid-template-columns:1fr 1fr;column-gap:18px;row-gap:10px}
.criteres .mention{grid-column:1/-1}
.fiche-tete .surtitre{margin-bottom:0}
.fiche-tete h1{margin:.2em 0 .3em}
@media (max-width:520px){.criteres{grid-template-columns:1fr}}

/* ================= galerie des fiches ================= */
.fiche-galerie{position:sticky;top:84px;display:flex;flex-direction:column;gap:10px}
.galerie{display:flex;flex-direction:column;gap:10px}
.galerie-principale{position:relative;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid var(--ligne);border-radius:20px;min-height:400px;padding:24px;cursor:zoom-in}
.galerie-principale img{max-height:380px;width:auto;object-fit:contain}
.galerie-loupe{position:absolute;right:14px;bottom:14px;width:36px;height:36px;border-radius:50%;background:rgba(27,31,38,.75);color:#fff;display:grid;place-items:center;font-size:1.1rem}
.galerie-vignettes{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px}
.galerie-vignette{flex:0 0 74px;height:74px;background:#fff;border:2px solid var(--ligne);border-radius:10px;display:flex;align-items:center;justify-content:center;padding:4px}
.galerie-vignette img{max-width:100%;max-height:100%;object-fit:contain}
.galerie-vignette.actif{border-color:var(--vert)}
.galerie-plein{border:0;padding:0;background:transparent;max-width:min(1100px,94vw);max-height:94vh;overflow:visible}
.galerie-plein::backdrop{background:rgba(27,31,38,.9)}
.galerie-plein img{display:block;max-width:min(1000px,90vw);max-height:80vh;object-fit:contain;background:#fff;border-radius:12px;margin:0 auto}
.galerie-fermer{position:absolute;top:-44px;right:0;background:none;border:0;color:#fff;font-size:2rem;cursor:pointer}
.galerie-nav{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;border:0;background:rgba(255,255,255,.92);font-size:1.8rem;line-height:1;cursor:pointer}
.galerie-nav.prec{left:-58px}.galerie-nav.suiv{right:-58px}
.galerie-compteur{position:absolute;bottom:-34px;left:0;color:#dfe7ec;font-size:.9rem}
.galerie-cta{position:absolute;bottom:-46px;right:0}
.galerie-lien-amazon{font-size:.88rem;font-weight:600;color:var(--vert);text-align:center;text-decoration:none}
.galerie-lien-amazon:hover{text-decoration:underline}
@media (max-width:900px){.fiche-galerie{position:relative;top:0}.galerie-principale{min-height:280px}.galerie-principale img{max-height:260px}.galerie-nav.prec{left:6px}.galerie-nav.suiv{right:6px}}

/* ================= encarts produits des guides ================= */
.selection-guide{margin:30px 0;padding:20px;background:var(--papier);border:1px solid var(--ligne);border-top:4px solid var(--ambre);border-radius:var(--rayon)}
.sel-titre{font:700 1.2rem/1.3 var(--titre);color:var(--encre);margin:0 0 2px}
.sel-sous{font-size:.9rem;color:var(--gris);margin:0 0 14px}
.sel-grille{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.sel-item{display:flex;flex-direction:column;gap:6px}
.sel-carte{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:14px 10px 12px;border:1px solid var(--ligne);border-radius:12px;background:#fff;text-decoration:none;color:var(--texte);transition:border-color .15s,box-shadow .15s}
.sel-carte:hover{border-color:var(--ambre);box-shadow:var(--ombre);color:var(--texte)}
.sel-badge{position:absolute;top:-10px;left:50%;transform:translateX(-50%);background:var(--vert);color:#fff;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:3px 9px;border-radius:99px;white-space:nowrap}
.sel-photo{height:110px;width:auto;object-fit:contain;margin:6px 0}
.sel-nom{font:600 .96rem/1.25 var(--titre);color:var(--encre)}
.sel-note,.sel-specs{font-size:.82rem;color:var(--gris)}
.sel-note b{color:var(--vert);font-size:1rem}
.sel-accroche{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#7a4d00;background:var(--ambre-c);padding:2px 7px;border-radius:5px}
.sel-btn{margin-top:auto;width:100%;padding:9px 10px;font-size:.88rem}
.sel-avis{font-size:.84rem;font-weight:600;text-align:center;text-decoration:none}
.sel-mention{font-size:.75rem;color:var(--gris);margin:12px 0 0}
@media (max-width:700px){.sel-grille{grid-template-columns:1fr}.sel-carte{flex-direction:row;text-align:left;flex-wrap:wrap}.sel-photo{height:80px}}
.encart-produit{margin:26px 0}
.encart-lien{display:grid;grid-template-columns:150px 1fr;gap:18px;align-items:center;padding:16px 18px;background:var(--papier);border:1px solid var(--ligne);border-left:4px solid var(--ambre);border-radius:var(--rayon);text-decoration:none;color:var(--texte);transition:border-color .15s,box-shadow .15s}
.encart-lien:hover{border-color:var(--ambre);box-shadow:var(--ombre);color:var(--texte)}
.encart-photo{width:150px;height:130px;object-fit:contain}
.encart-corps{display:flex;flex-direction:column;gap:4px}
.encart-surtitre{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--gris)}
.encart-nom{font:700 1.12rem/1.25 var(--titre);color:var(--encre)}
.encart-note{font-size:.86rem;color:var(--gris)}
.encart-note b{color:var(--vert);font-size:1.05rem}
.encart-forts{margin:4px 0 6px;padding-left:1.1em;font-size:.9rem}
.encart-btn{align-self:flex-start}
.encart-pied{font-size:.82rem;color:var(--gris);margin:6px 0 0 4px}
.rappel-titre{font:700 1.15rem var(--titre);color:var(--encre);margin:34px 0 0}
@media (max-width:600px){.encart-lien{grid-template-columns:1fr;text-align:center}.encart-photo{margin:0 auto}.encart-btn{align-self:stretch}}

/* Accueil : bloc « Nos avis aussi sur YouTube » */
.yt-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px;margin-top:18px}
.yt-carte{display:flex;flex-direction:column;gap:10px;color:inherit;text-decoration:none}
.yt-carte b{line-height:1.35;font-size:.95rem}
.yt-carte:hover b{color:var(--vert)}
.yt-vignette{position:relative;display:block;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#000}
.yt-vignette img{width:100%;height:100%;object-fit:cover;display:block}
.yt-play{position:absolute;inset:0;margin:auto;width:54px;height:38px;border-radius:10px;background:rgba(255,0,0,.9);color:#fff;display:grid;place-items:center;font-size:18px}
/* Accueil : fonds alternés automatiquement après le hero (blanc / teinte de l'accent), pour que deux sections ne se confondent jamais. */
main > .hero ~ .section{padding:48px 0 !important;border-block:1px solid var(--ligne);background:color-mix(in srgb,var(--vert) 7%,var(--page))}
main > .hero ~ .section:nth-of-type(even){background:var(--papier)}

/* ---------- guides hub (/guides/) */
.gh-tete{background:linear-gradient(180deg,var(--fond2),#fff);padding:6px 0 34px;border-bottom:1px solid var(--ligne)}
.gh-tete-grille{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:36px;align-items:center}
.gh-tete h1{font-size:clamp(2rem,4vw,2.9rem);margin:.15em 0 .3em}
.gh-themes{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.gh-themes a{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border:1px solid var(--ligne);border-radius:999px;background:#fff;color:var(--encre);text-decoration:none;font-weight:600;font-size:.88rem}
.gh-themes a span{background:var(--vert-c);color:var(--vert);border-radius:999px;padding:0 8px;font-size:.78rem}
.gh-themes a:hover{border-color:var(--vert);color:var(--vert)}
.gh-une{display:block;position:relative;border-radius:18px;overflow:hidden;box-shadow:var(--ombre);text-decoration:none;color:#fff;background:var(--encre)}
.gh-une img{width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform .4s}
.gh-une:hover img{transform:scale(1.03)}
.gh-une-corps{position:absolute;inset:auto 0 0 0;padding:26px 24px 22px;background:linear-gradient(180deg,rgba(27,31,38,0) 0%,rgba(27,31,38,.82) 45%,rgba(27,31,38,.95) 100%);display:flex;flex-direction:column;gap:6px}
.gh-une-corps b{font:700 clamp(1.25rem,2.3vw,1.6rem)/1.25 var(--titre);color:#fff}
.gh-une .gh-chapo{color:rgba(255,255,255,.86);font-size:.95rem}
.gh-une .gh-meta{color:rgba(255,255,255,.75)}
.gh-une .gh-lire{color:var(--ambre)}
.gh-badge{align-self:flex-start;background:var(--ambre);color:#1d1503;font-weight:700;font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;border-radius:6px;padding:3px 8px}
.gh-section{padding:38px 0 6px;scroll-margin-top:80px}
.gh-grille{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
@media (max-width:980px){.gh-grille{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.gh-grille{grid-template-columns:1fr}}
.gh-carte{display:flex;flex-direction:column;border:1px solid var(--ligne);border-radius:var(--rayon);overflow:hidden;background:#fff;text-decoration:none;color:var(--texte);transition:box-shadow .2s,border-color .2s,transform .2s}
.gh-carte:hover{border-color:var(--vert);box-shadow:var(--ombre);transform:translateY(-2px)}
.gh-visuel{display:block;aspect-ratio:16/9;overflow:hidden;background:var(--vert-c)}
.gh-visuel img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.gh-carte:hover .gh-visuel img{transform:scale(1.04)}
.gh-visuel-vide{display:flex;align-items:center;justify-content:center;height:100%;font-size:2.4rem;color:var(--vert)}
.gh-carte-corps{display:flex;flex-direction:column;gap:6px;padding:14px 16px 16px;flex:1}
.gh-tag{font-size:.74rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--vert)}
.gh-carte b{font:700 1.08rem/1.3 var(--titre);color:var(--encre)}
.gh-chapo{font-size:.92rem;color:var(--gris);line-height:1.5}
.gh-meta{margin-top:auto;padding-top:8px;display:flex;justify-content:space-between;align-items:center;font-size:.85rem;color:var(--gris)}
.gh-lire{font-weight:700;color:var(--vert)}
.gh-cta{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;background:var(--vert-c);border-radius:18px;padding:26px 28px}
.gh-cta-actions{display:flex;gap:10px;flex-wrap:wrap}
@media (max-width:860px){
  .gh-tete-grille{grid-template-columns:1fr;gap:22px}
  .gh-une-corps{position:static;background:var(--encre)}
  .gh-cta{padding:22px 18px}
}

.logo-img{display:block;height:56px;width:auto}
@media (max-width:640px){.entete .wrap{min-height:68px}.logo-img{height:42px}}

/* en-tête masqué au défilement vers le bas, réaffiché vers le haut */
.entete{transition:transform .28s ease}
.entete.entete-cache{transform:translateY(-100%)}
@media (prefers-reduced-motion:reduce){.entete{transition:none}}
