/* VoltWay — feuille de style écrite pour ce site. Noir + vert citron sur blanc cassé, téléphone d'abord. */
:root{--fond:#FAFAF7;--encre:#111;--gris:#5a5a5a;--ligne:#e3e3dc;--vert:#C6FF3D;--vert-fonce:#8BD400;--blanc:#fff;--rayon:14px}
*{box-sizing:border-box}
body{margin:0;background:var(--fond);color:var(--encre);font:17px/1.55 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;padding-bottom:72px}
a{color:var(--encre);text-decoration-color:var(--vert-fonce);text-decoration-thickness:2px;text-underline-offset:3px}
main{max-width:860px;margin:0 auto;padding:0 16px 32px}
h1{font-size:clamp(1.7rem,5.5vw,2.6rem);line-height:1.12;letter-spacing:-.02em;margin:.6em 0 .3em}
h2{font-size:1.35rem;margin:1.8em 0 .5em;padding-left:.6em;border-left:6px solid var(--vert)}
h3{font-size:1.08rem;margin:1.2em 0 .4em}
p{margin:.5em 0}small{color:var(--gris);font-size:.86em}
.haut{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;background:var(--blanc);border-bottom:1px solid var(--ligne);position:sticky;top:0;z-index:5}
.logo{font-weight:900;font-size:1.35rem;text-decoration:none;letter-spacing:-.03em}.logo span{background:var(--vert);padding:0 .15em;border-radius:4px}
.haut-nav{display:none;gap:18px}.haut-nav a{text-decoration:none;font-weight:600}
@media(min-width:720px){.haut-nav{display:flex}body{padding-bottom:0}.bas{display:none}}
.ariane{font-size:.86rem;color:var(--gris);margin-top:14px}.ariane a{color:var(--gris)}
.meta{font-size:.9rem;color:var(--gris)}
.chapeau{font-size:1.15rem;font-weight:500}
.sommaire{background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--rayon);padding:12px 16px;margin:16px 0}.sommaire ol{margin:.4em 0 0;padding-left:1.2em}.sommaire li{margin:.2em 0}
.table-scroll{overflow-x:auto;margin:.6em 0;-webkit-overflow-scrolling:touch}
table{border-collapse:collapse;width:100%;min-width:560px;background:var(--blanc);font-size:.93rem}
table.vertical{min-width:0}table.vertical th{width:42%}
th,td{padding:9px 10px;border-bottom:1px solid var(--ligne);text-align:left;vertical-align:top}thead th{background:#f1f1ea;font-weight:700;position:sticky;top:0}tbody th{font-weight:600;white-space:nowrap}
.nc{color:var(--gris);font-style:italic}.c{color:#7a5a00}
.cartes{display:grid;gap:14px;grid-template-columns:1fr}@media(min-width:640px){.cartes{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}}
.carte{display:flex;gap:12px;background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--rayon);padding:12px}
.carte-photo{flex:0 0 84px;height:84px;border-radius:10px;background:#fff;border:1px solid var(--ligne);background-image:linear-gradient(135deg,#f3f3ee,#e8e8e0)}
.carte-photo.grande{flex-basis:140px;height:140px}
.carte-corps{flex:1;min-width:0}.carte h3{margin:0 0 .2em;font-size:1.05rem}.carte h3 a{text-decoration:none}
.note{margin:.2em 0}.note b{font-size:1.4rem;background:var(--vert);padding:0 .25em;border-radius:6px}.note.grande b{font-size:1.9rem}
.chiffres{font-size:.9rem;color:var(--gris)}.raison{font-size:.95rem}.dispo{font-size:.88rem;color:#7a5a00;background:#fff7d6;padding:4px 8px;border-radius:6px;display:inline-block}
.achat{margin:.4em 0 0}.prix{font-weight:800;font-size:1.25rem}.prix-date{display:block}
.btn{display:inline-block;background:var(--encre);color:#fff;text-decoration:none;font-weight:700;padding:11px 18px;border-radius:999px;min-height:44px;line-height:22px}
.btn:hover{background:var(--vert-fonce);color:var(--encre)}
.achat-haut{display:flex;flex-direction:column;gap:16px;align-items:flex-start;background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--rayon);padding:16px;margin:14px 0}
@media(min-width:640px){.achat-haut{flex-direction:row}}
.achat-haut .carte-photo.grande{width:140px}
.deux{display:grid;gap:16px}@media(min-width:640px){.deux{grid-template-columns:1fr 1fr}}
ul{padding-left:1.2em}li{margin:.3em 0}
.barres{list-style:none;padding:0}.barres li{display:grid;grid-template-columns:140px 1fr 44px;gap:8px;align-items:center;margin:.55em 0}.barres .lab{font-weight:600;font-size:.92rem}.barres .barre{height:12px;background:#ebebe3;border-radius:6px;overflow:hidden}.barres .barre span{display:block;height:100%;background:var(--vert-fonce)}.barres b{text-align:right}.barres small{grid-column:1/-1;margin-top:-4px}
.bloc{background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--rayon);padding:12px 16px;margin:12px 0}.bloc h3{margin-top:0}
details{background:var(--blanc);border:1px solid var(--ligne);border-radius:10px;padding:8px 14px;margin:8px 0}summary{font-weight:600;cursor:pointer;min-height:28px}
.sources{columns:2;column-gap:24px;font-size:.92rem}@media(max-width:600px){.sources{columns:1}}
.recap{background:#f1f1ea;border-radius:var(--rayon);padding:4px 16px 16px;margin-top:28px}
.lire-aussi ul{padding-left:1.1em}
footer{max-width:860px;margin:24px auto 0;padding:16px;border-top:1px solid var(--ligne);color:var(--gris);font-size:.88rem}
.bas{position:fixed;bottom:0;left:0;right:0;display:flex;background:var(--encre);z-index:6}.bas a{flex:1;color:#fff;text-align:center;text-decoration:none;font-weight:700;padding:14px 4px;min-height:48px}.bas a+a{border-left:1px solid #333}
.sticky-prix{position:fixed;bottom:56px;left:0;right:0;background:var(--vert);padding:8px 16px;display:none;z-index:6;font-weight:700;text-align:center}
@media(max-width:719px){.sticky-prix.visible{display:block}}
/* ---------- en-tête commun (maquette 27/10) ---------- */
.haut{gap:18px}.btn-pourvous{background:var(--vert);color:var(--encre);font-weight:800;text-decoration:none;padding:8px 14px;border-radius:999px;white-space:nowrap}
@media(min-width:720px){.haut-nav{margin-right:auto;margin-left:24px}}
main.large{max-width:1120px}
/* ---------- fiche produit, gabarit final ---------- */
.ic{width:22px;height:22px;flex:0 0 22px;fill:none;stroke:var(--encre);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.fiche-haut{display:grid;gap:22px;margin:12px 0 18px}@media(min-width:880px){.fiche-haut{grid-template-columns:1.08fr 1fr;align-items:start}}
.galerie{display:flex;flex-direction:column-reverse;gap:10px}@media(min-width:880px){.galerie{flex-direction:row}}
.vignettes{display:flex;gap:8px;overflow-x:auto}@media(min-width:880px){.vignettes{flex-direction:column;overflow:visible}}
.vignettes button{flex:0 0 64px;width:64px;height:64px;padding:3px;border:1.5px solid var(--ligne);border-radius:10px;background:#fff;cursor:pointer}.vignettes button.actif{border-color:var(--encre)}
.vignettes img{width:100%;height:100%;object-fit:contain}
.principale{position:relative;flex:1;margin:0;background:#fff;border:1px solid var(--ligne);border-radius:var(--rayon);aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;overflow:hidden}
.principale img{max-width:92%;max-height:92%;object-fit:contain}.principale figcaption{position:absolute;right:12px;bottom:10px;font-size:.8rem;color:var(--gris)}
.fiche-infos .marque{text-transform:uppercase;letter-spacing:.08em;font-size:.8rem;color:var(--gris);margin:0}.fiche-infos h1{margin:.15em 0 .3em;font-size:clamp(1.6rem,4.2vw,2.3rem)}
.ligne-note{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:.3em 0}.ligne-note span{color:var(--gris);font-size:.92rem}
.pastille{display:inline-flex;align-items:baseline;gap:1px;background:var(--vert);border-radius:8px;padding:2px 8px;line-height:1.2}.pastille b{font-size:1.25rem}.pastille small{color:var(--encre);font-size:.75rem}
.pastille.petite b{font-size:1rem}.pastille.petite{padding:1px 6px}
.badge{background:#fff7d6;color:#6b4e00;border-radius:999px;padding:3px 10px;font-size:.82rem;font-weight:700}
.reponse-courte{font-size:1.02rem;color:#2c2c2c}
.cles{list-style:none;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:14px 0}@media(min-width:520px){.cles{grid-template-columns:repeat(4,1fr)}}
.cles li,.grille-carac li,.garanties li{display:flex;gap:9px;align-items:flex-start;margin:0}.cles span,.grille-carac span,.garanties span{display:flex;flex-direction:column;line-height:1.25}.cles b{font-size:1rem}
.prix-bloc{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin:14px 0 6px}.prix-grand{font-size:2rem;font-weight:900;letter-spacing:-.02em}.prix-bloc small{flex-basis:100%}
.promo{background:var(--encre);color:var(--vert);font-weight:800;font-size:.78rem;border-radius:6px;padding:2px 8px}
.btn-grand{display:block;text-align:center;font-size:1.05rem;padding:14px 20px;margin:8px 0}
.garanties{list-style:none;padding:12px;margin:14px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;background:#f4f4ee;border-radius:var(--rayon);font-size:.85rem}.garanties .ic{width:20px;height:20px}
@media(max-width:519px){.garanties{grid-template-columns:1fr}}
.details{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:6px 0 18px}@media(min-width:720px){.details{grid-template-columns:repeat(4,1fr)}}
.details figure{margin:0;background:#fff;border:1px solid var(--ligne);border-radius:12px;overflow:hidden}.details img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;background:#f4f4ee}
.details figcaption{padding:8px 10px;font-size:.88rem;display:flex;flex-direction:column}
.onglets{position:sticky;top:57px;z-index:4;display:flex;gap:4px;overflow-x:auto;background:var(--fond);border-bottom:1px solid var(--ligne);margin:10px -16px 0;padding:0 16px}
.onglets a{padding:12px 12px;text-decoration:none;font-weight:700;white-space:nowrap;border-bottom:3px solid transparent}.onglets a:first-child{border-bottom-color:var(--vert-fonce)}
.presentation{display:grid;gap:20px;align-items:center}@media(min-width:880px){.presentation{grid-template-columns:1fr 1.15fr}}
.presentation h2{border:0;padding:0;font-size:1.6rem;line-height:1.2}.situation{margin:0;border-radius:var(--rayon);overflow:hidden}.situation img{width:100%;display:block;aspect-ratio:4/3;object-fit:cover}
.coches,.croix{list-style:none;padding:0}.coches li,.croix li{display:flex;gap:8px;align-items:flex-start}.coches .ic{stroke:var(--vert-fonce);stroke-width:2.6;width:20px;height:20px}.croix .ic{stroke:#c0392b;stroke-width:2.4;width:18px;height:18px}
.forts-verdict{display:grid;gap:18px;background:#f4f4ee;border-radius:var(--rayon);padding:18px;margin:22px 0}@media(min-width:880px){.forts-verdict{grid-template-columns:1fr 1fr 1.1fr}}
.forts-verdict h3{margin-top:0}.forts-verdict li{font-size:.93rem}
.usages-grille{display:grid;gap:12px;grid-template-columns:1fr}@media(min-width:640px){.usages-grille{grid-template-columns:repeat(2,1fr)}}@media(min-width:960px){.usages-grille{grid-template-columns:repeat(4,1fr)}}
.usage{background:#fff;border:1px solid var(--ligne);border-radius:12px;overflow:hidden}.usage img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block}.usage div{padding:10px 12px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}.usage small{flex-basis:100%}
.grille-carac{list-style:none;padding:16px;display:grid;gap:16px;grid-template-columns:repeat(2,1fr);background:#fff;border:1px solid var(--ligne);border-radius:var(--rayon)}@media(min-width:720px){.grille-carac{grid-template-columns:repeat(4,1fr)}}
.grille-carac b{font-size:.9rem}
details.tout{margin-top:12px}
.plan-dim{display:grid;gap:16px;margin:22px 0}@media(min-width:880px){.plan-dim{grid-template-columns:1.4fr 1fr}}
.gros-plan{display:grid;gap:0;background:#fff;border:2px solid var(--vert);border-radius:var(--rayon);overflow:hidden}@media(min-width:640px){.gros-plan{grid-template-columns:1fr 1fr}}
.gros-plan img{width:100%;height:100%;min-height:220px;object-fit:cover;display:block}.gros-plan div{padding:16px}.gros-plan h3{margin-top:0;display:flex;gap:8px;align-items:center}
.dimensions{background:#fff;border:1px solid var(--ligne);border-radius:var(--rayon);padding:14px}.dimensions h3{margin-top:0}.dimensions>div{display:flex;gap:12px}
.cotes{position:relative;flex:1;margin:0;padding:0 0 26px 30px}.cotes img{width:100%;aspect-ratio:1/1;object-fit:contain}
.cote-h{position:absolute;left:0;top:0;bottom:26px;writing-mode:vertical-rl;transform:rotate(180deg);border-right:1.5px solid var(--gris);text-align:center;font-size:.78rem;padding-left:4px}
.cote-l{position:absolute;left:30px;right:0;bottom:6px;border-top:1.5px solid var(--gris);text-align:center;font-size:.78rem}
.cotes figcaption{position:absolute;top:4px;right:6px;font-size:.8rem;font-weight:700}
.similaires .rangee{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(170px,1fr);gap:12px;overflow-x:auto;padding-bottom:6px}
.carte-alt{display:flex;flex-direction:column;gap:4px;background:#fff;border:1px solid var(--ligne);border-radius:12px;padding:10px;text-decoration:none}.carte-alt img{width:100%;aspect-ratio:1/1;object-fit:contain}
.carte-alt b{font-size:.95rem}.prix-alt{font-weight:900}.sans-photo{display:block;aspect-ratio:1/1;background:#f4f4ee;border-radius:8px}

@media(min-width:720px){.bas{display:none}}
.fiche-haut>*,.galerie,.fiche-infos,.presentation>*,.forts-verdict>*,.plan-dim>*{min-width:0}.fiche-infos h1{overflow-wrap:anywhere}

/* ---------- palette sobre (Thomas, 27/10 : « couleurs sobres comme sur l'image ») : blanc, gris clairs, noir, un seul accent rouge corail ---------- */
:root{--fond:#ffffff;--encre:#111827;--gris:#6b7280;--ligne:#e5e7eb;--doux:#f5f6f8;--accent:#ef4b46;--accent-fonce:#d63b36;--ok:#16a34a;--ko:#dc2626;--vert:#e8f7ee;--vert-fonce:#16a34a}
body{background:var(--fond);color:var(--encre)}
a{text-decoration-color:#cbd0d8}
.logo span{background:none;color:var(--accent);padding:0}
h2{border-left:0;padding-left:0}
.haut{border-bottom:1px solid var(--ligne)}
.btn,.btn-grand{background:var(--accent);color:#fff;border-radius:10px}.btn:hover,.btn-grand:hover{background:var(--accent-fonce);color:#fff}
.btn-pourvous{background:var(--accent);color:#fff;border-radius:999px}.btn-pourvous:hover{background:var(--accent-fonce)}
.pastille,.note b{background:var(--vert);color:#166534}.pastille small{color:#166534}
.badge{background:var(--vert);color:#166534}
.promo{background:var(--accent);color:#fff}
.coches .ic{stroke:var(--ok)}.croix .ic{stroke:var(--ko)}
.onglets{background:#fff}.onglets a:first-child{border-bottom-color:var(--encre)}
.gros-plan{border:1px solid var(--ligne)}
.barres .barre{background:#eceef2}.barres .barre span{background:var(--ok)}
.forts-verdict,.garanties,.recap{background:var(--doux)}
.details figure,.usage,.carte-alt,.grille-carac,.dimensions,.principale,.vignettes button,details,.sommaire,.carte,.achat-haut,.bloc{border-color:var(--ligne)}
.vignettes button.actif{border-color:var(--encre)}
.dispo{background:#fff7ed;color:#9a3412}
thead th{background:var(--doux)}
.bas{background:#fff;border-top:1px solid var(--ligne)}.bas a{color:var(--encre)}.bas a+a{border-left:1px solid var(--ligne)}
.sticky-prix{background:var(--accent);color:#fff}
.sans-photo{background:var(--doux)}

/* ---------- galerie sans script (radios + étiquettes) : marche même si le JavaScript est bloqué ---------- */
.g-radio{position:absolute;opacity:0;pointer-events:none}
.galerie{position:relative}
.g-vignette{flex:0 0 64px;width:64px;height:64px;padding:3px;border:1.5px solid var(--ligne);border-radius:10px;background:#fff;cursor:pointer;display:block}
.g-vignette img{width:100%;height:100%;object-fit:contain}.g-vignette:hover{border-color:var(--gris)}
.principale .g-grand{display:none;margin:0;width:100%;height:100%;align-items:center;justify-content:center}
.principale .g-grand img{max-width:92%;max-height:92%;object-fit:contain}
.principale .g-grand figcaption{position:absolute;right:12px;bottom:10px;font-size:.8rem;color:var(--gris)}
#photo-1:checked~.principale .g1{display:flex}#photo-1:checked~.vignettes label[for=photo-1]{border-color:var(--encre)}
#photo-2:checked~.principale .g2{display:flex}#photo-2:checked~.vignettes label[for=photo-2]{border-color:var(--encre)}
#photo-3:checked~.principale .g3{display:flex}#photo-3:checked~.vignettes label[for=photo-3]{border-color:var(--encre)}
#photo-4:checked~.principale .g4{display:flex}#photo-4:checked~.vignettes label[for=photo-4]{border-color:var(--encre)}
#photo-5:checked~.principale .g5{display:flex}#photo-5:checked~.vignettes label[for=photo-5]{border-color:var(--encre)}
#photo-6:checked~.principale .g6{display:flex}#photo-6:checked~.vignettes label[for=photo-6]{border-color:var(--encre)}
.g-radio:focus-visible~.vignettes{outline:2px solid var(--accent);outline-offset:3px;border-radius:10px}
section[id],[id=faq],[id=notes]{scroll-margin-top:120px}

/* ---------- onglets sans lien ni script (radios + étiquettes) ---------- */
.o-radio{position:absolute;opacity:0;pointer-events:none}
.onglets label{padding:12px 12px;font-weight:700;white-space:nowrap;border-bottom:3px solid transparent;cursor:pointer;color:var(--gris)}.onglets label:hover{color:var(--encre)}
.onglets a:first-child{border-bottom-color:transparent}
.panneau{display:none;padding-top:8px}
#o-presentation:checked~.p-presentation{display:block}#o-presentation:checked~.onglets label[for=o-presentation]{border-bottom-color:var(--encre);color:var(--encre)}
#o-caracteristiques:checked~.p-caracteristiques{display:block}#o-caracteristiques:checked~.onglets label[for=o-caracteristiques]{border-bottom-color:var(--encre);color:var(--encre)}
#o-notes:checked~.p-notes{display:block}#o-notes:checked~.onglets label[for=o-notes]{border-bottom-color:var(--encre);color:var(--encre)}
#o-faq:checked~.p-faq{display:block}#o-faq:checked~.onglets label[for=o-faq]{border-bottom-color:var(--encre);color:var(--encre)}
.o-radio:focus-visible~.onglets{outline:2px solid var(--accent);outline-offset:2px}

/* ---------- une rangée d'images = même format, même taille (Thomas, 27/10) ---------- */
.rangee,.usages-grille,.details,.cartes{align-items:stretch}
.carte-alt{height:100%}.carte-alt img{width:100%;aspect-ratio:1/1;display:block;border-radius:8px;background:#fff}
.carte-alt img.produit{object-fit:contain;padding:6%}.carte-alt img.plein{object-fit:cover}
.details img{aspect-ratio:4/3;object-fit:cover;width:100%;height:auto}
.usage img{aspect-ratio:16/10;object-fit:cover;width:100%;height:auto}
.usage,.details figure,.carte-alt{display:flex;flex-direction:column}

/* verdict : meilleure et moins bonne note par usage (28/10) */
.note-extreme{margin-top:.6rem}.note-extreme p{margin:.2rem 0}.note-extreme.mauvaise .pastille{background:#fdecec;color:#b42318}.note-extreme.mauvaise .pastille b{color:#b42318}

/* ===== en-tête : menu burger + recherche (28/10) ===== */
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.haut{flex-wrap:wrap;row-gap:10px}
.menu-case{position:absolute;opacity:0;pointer-events:none}
.burger{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;margin-left:-8px;cursor:pointer;border-radius:10px;padding:0 10px;box-sizing:border-box}
.burger:hover{background:#f2f3f5}
.burger span{display:block;height:2px;background:var(--encre,#111);border-radius:2px}
.menu-panneau{position:fixed;top:0;left:0;bottom:0;width:min(86vw,360px);background:#fff;z-index:30;transform:translateX(-105%);transition:transform .2s ease;overflow-y:auto;box-shadow:0 0 40px rgba(0,0,0,.15)}
.menu-panneau nav{padding:20px 20px 40px}
.menu-fond{position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:25;display:none}
.menu-case:checked~.menu-panneau{transform:none}
.menu-case:checked~.menu-fond{display:block}
.menu-raccourcis{display:flex;flex-direction:column;gap:8px;margin-bottom:18px}
.menu-raccourcis a{display:block;padding:10px 12px;border-radius:10px;background:#f2f3f5;text-decoration:none;font-weight:700}
.menu-raccourcis a:first-child{background:var(--accent);color:#fff}
.menu-groupe{border-top:1px solid var(--ligne);padding:14px 0}
.menu-groupe b{display:block;font-size:.8rem;text-transform:uppercase;letter-spacing:.04em;color:#6b7280;margin-bottom:6px}
.menu-groupe ul{list-style:none;margin:0;padding:0}
.menu-groupe li a{display:block;padding:7px 0;text-decoration:none;color:var(--encre,#111)}
.menu-groupe .tout{display:inline-block;margin-top:4px;font-weight:700;text-decoration:none;color:var(--accent)}
.recherche{position:relative;display:flex;align-items:center;order:10;flex:1 1 100%;background:#f2f3f5;border-radius:999px;padding:0 6px 0 14px;min-width:0}
.recherche input{flex:1;min-width:0;border:0;background:transparent;font:inherit;padding:10px 0;outline:none}
.recherche button{border:0;background:none;width:40px;height:40px;cursor:pointer;color:#4b5563;border-radius:999px}
.recherche:focus-within{box-shadow:0 0 0 2px var(--accent)}
.suggestions{position:absolute;top:calc(100% + 6px);left:0;right:0;margin:0;padding:6px;list-style:none;background:#fff;border:1px solid var(--ligne);border-radius:14px;box-shadow:0 12px 30px rgba(0,0,0,.12);z-index:20;max-height:60vh;overflow-y:auto}
.suggestions a,.resultats a{display:flex;justify-content:space-between;gap:10px;padding:9px 10px;border-radius:8px;text-decoration:none;color:var(--encre,#111)}
.suggestions a:hover,.suggestions a.actif{background:#f2f3f5}
.suggestions small,.resultats small{color:#6b7280;white-space:nowrap}
.resultats{list-style:none;padding:0}
.haut .logo{margin-right:auto}
@media(min-width:880px){
 .haut{flex-wrap:nowrap}
 .haut .logo{margin-right:0}
 .recherche{order:0;flex:0 1 300px;margin-left:12px}
 .haut-nav{margin-left:16px}
}
@media(max-width:879px){.haut-nav{display:none!important}}

/* (28/10) menu au-dessus de la barre du bas ; pas de barre de défilement à côté des photos ; barre de prix en bas sur téléphone */
.haut:has(.menu-case:checked){z-index:50}
.vignettes{scrollbar-width:none;-ms-overflow-style:none}
.vignettes::-webkit-scrollbar{display:none}
.barre-prix{position:fixed;left:0;right:0;bottom:0;z-index:7;display:flex;align-items:center;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--ligne);box-shadow:0 -6px 20px rgba(0,0,0,.08)}
.barre-prix .bp-prix{display:flex;flex-direction:column;line-height:1.15;min-width:0}
.barre-prix .bp-prix b{font-size:1.25rem;font-weight:900}
.barre-prix .bp-prix small{color:#6b7280;font-size:.75rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.barre-prix .btn-barre{margin-left:auto;background:var(--accent);color:#fff;font-weight:800;text-decoration:none;padding:12px 16px;border-radius:999px;white-space:nowrap;min-height:44px;box-sizing:border-box;display:inline-flex;align-items:center}
body.avec-barre-prix{padding-bottom:76px}
@media(min-width:720px){.barre-prix{display:none}body.avec-barre-prix{padding-bottom:0}}

/* (28/10) plus de barre Meilleurs / Comparer / Pour vous en bas */
body{padding-bottom:0}
body.avec-barre-prix{padding-bottom:76px}
@media(min-width:720px){body.avec-barre-prix{padding-bottom:0}}
.bas{display:none!important}

/* (28/10) recherche plus petite, sur la même ligne, entre le logo et « Nos sélections » */
.haut{flex-wrap:nowrap}
.haut .logo{margin-right:0}
.recherche{order:0;flex:1 1 auto;min-width:0;margin:0 4px;padding:0 2px 0 10px}
.recherche input{padding:7px 0;font-size:.9rem}
.recherche button{width:32px;height:32px}
.btn-pourvous{padding:7px 12px;font-size:.9rem}
@media(max-width:420px){.recherche input::placeholder{font-size:.8rem}.btn-pourvous{padding:7px 10px;font-size:.82rem}.logo{font-size:1.15rem}}
@media(min-width:880px){.recherche{flex:0 1 280px;margin-left:12px}}
.burger,.haut .logo,.btn-pourvous{flex:0 0 auto}
@media(max-width:879px){.haut{gap:8px;padding:10px 12px}.burger{width:36px;padding:0 7px;margin-left:-4px}.recherche{min-width:96px}}
.recherche input{width:100%}
@media(max-width:879px){.recherche{margin:0}.recherche button{width:26px}}

/* (28/10) menu burger v2 : rubriques qui se déplient */
.menu-panneau nav{padding:0 0 40px}
.menu-tete{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--ligne)}
.menu-fermer{font-size:28px;line-height:1;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:8px}
.menu-fermer:hover{background:#f2f3f5}
.rubrique{border-bottom:1px solid var(--ligne)}
.rubrique summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:16px;font-weight:700;font-size:1.05rem}
.rubrique summary::-webkit-details-marker{display:none}
.rubrique summary::after{content:"";width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin-top:-4px;transition:transform .15s}
.rubrique[open] summary::after{transform:rotate(-135deg);margin-top:4px}
.rubrique ul{list-style:none;margin:0;padding:0 16px 12px}
.rubrique li a{display:block;padding:9px 0 9px 12px;text-decoration:none;color:var(--encre,#111);border-left:2px solid var(--ligne)}
.rubrique li a:hover{border-left-color:var(--accent);color:var(--accent)}
.rubrique .sous-titre{font-weight:700;font-size:.85rem;color:#4b5563;padding:12px 0 4px}
.menu-simples{display:flex;flex-direction:column;padding:12px 16px}
.menu-simples a{padding:10px 0;text-decoration:none;color:var(--encre,#111)}
.menu-panneau details.rubrique{border:0;border-bottom:1px solid var(--ligne);border-radius:0;margin:0;padding:0;background:none}
.menu-panneau details.rubrique summary{padding:15px 16px}

/* ===================================================================
   (28/10) Version « pro » : fini les coins très arrondis, les pilules, les ombres et les pastilles pastel.
   Coins nets (3 px au plus), filets fins, une seule couleur d'accent, textes gris sobres.
   =================================================================== */
:root{--rayon:3px;--ligne:#dcdfe4;--doux:#f6f7f9}
*,*::before,*::after{border-radius:0!important;box-shadow:none!important}
body{font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;letter-spacing:-.005em}
h1,h2,h3{font-weight:700;letter-spacing:-.015em}
/* boutons et champs : coins à peine cassés */
.btn,.btn-grand,.btn-barre,.btn-pourvous,.recherche,.recherche input,.recherche button{border-radius:3px!important}
.btn-pourvous{font-weight:700}
.btn-barre,.btn-grand{font-weight:700;letter-spacing:.01em}
.recherche{background:#fff;border:1px solid var(--ligne)}
.recherche:focus-within{border-color:var(--encre);outline:none}
/* photos et cartes : cadre fin, pas d'ombre */
.galerie .principale,.g-vignette,.vignettes label,.carte,.carte-alt,.usage,.details figure,.situation,.rangee>*,.similaires article,.forts-verdict,details{border-radius:0!important}
.forts-verdict{background:#fff;border:1px solid var(--ligne)}
/* note : chiffre net dans un cadre, sans fond pastel */
.pastille{background:#fff!important;border:1.5px solid var(--ok);color:var(--encre);padding:1px 6px}
.pastille b{color:var(--ok)!important}
.note-extreme.mauvaise .pastille{border-color:var(--ko)}
.note-extreme.mauvaise .pastille b{color:var(--ko)!important}
/* étiquettes : texte simple, plus de pilule colorée */
.badge{background:none!important;border:1px solid var(--ligne);color:var(--gris);font-weight:600;font-size:.78rem;padding:2px 6px;text-transform:none}
.promo{background:none!important;color:var(--ko)!important;padding:0!important;font-weight:600;font-size:.85rem}
/* menu et suggestions : ombre remplacée par un filet */
.menu-panneau{border-right:1px solid var(--ligne)}
.suggestions{border:1px solid var(--ligne)}
.barre-prix{border-top:1px solid var(--ligne)}
/* onglets : soulignement net */
.onglets label{font-weight:600}
.provenance{font-size:.82rem;color:var(--gris);margin:14px 0 0;padding-top:10px;border-top:1px solid var(--ligne)}
.garanties{display:none}
/* coches et croix : traits fins et couleurs moins vives */
.coches svg,.croix svg{width:14px;height:14px}
.coches svg{color:#3f7d58}.croix svg{color:#b54a45}
.forts-verdict h3{font-size:.95rem;text-transform:none}
.ariane{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:719px){.ariane{font-size:.76rem}}

/* (28/10) en-tête de fiche : nom en gros + note globale ; photos sur blanc sans cadre ; Comparer / Ajouter à ma liste à droite */
.fiche-titre{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin:4px 0 16px}
.fiche-titre h1{font-size:clamp(1.6rem,4.5vw,2.4rem);font-weight:800;line-height:1.15;margin:0}
.note-globale{flex:0 0 auto;display:inline-flex;align-items:baseline;gap:2px;border:2px solid var(--ok);padding:4px 10px;color:var(--ok)}
.note-globale b{font-size:1.6rem;font-weight:800;line-height:1}
.note-globale small{font-size:.85rem;color:var(--gris)}
.principale,.galerie .principale{border:0!important;background:#fff}
.vignettes label{border:1px solid transparent}
.details figure{border:0!important;background:#fff}
.details img{background:#fff}
.galerie-zone{display:flex;flex-direction:column;gap:10px;min-width:0}
.fiche-actions{display:flex;justify-content:flex-end;gap:8px}
.act{font:inherit;font-size:.88rem;font-weight:600;background:#fff;color:var(--encre);border:1px solid var(--ligne);padding:8px 12px;cursor:pointer;text-decoration:none;white-space:nowrap;border-radius:3px!important}
.act:hover{border-color:var(--encre)}
.act.dans-liste{border-color:var(--ok);color:var(--ok)}
@media(min-width:880px){.galerie-zone{flex-direction:row;align-items:flex-start}.galerie-zone .galerie{flex:1;min-width:0}.fiche-actions{flex-direction:column;justify-content:flex-start}}
.fiche-titre{justify-content:flex-start;align-items:center;flex-wrap:wrap}
.fiche-titre{flex-wrap:nowrap}
@media(max-width:719px){.note-globale{padding:3px 7px}.note-globale b{font-size:1.3rem}}

/* (28/10) téléphone : le nom tient sur une ligne ; la barre de prix se réduit quand on descend */
@media(max-width:719px){
 .fiche-titre h1{font-size:3.85vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
 .fiche-titre{gap:10px}
}
.barre-prix{transition:padding .2s ease}
.barre-prix .bp-prix b,.barre-prix .btn-barre{transition:font-size .2s ease,padding .2s ease,min-height .2s ease}
.barre-prix.compacte{padding-top:5px;padding-bottom:calc(5px + env(safe-area-inset-bottom))}
.barre-prix.compacte .bp-prix b{font-size:1rem}
.barre-prix.compacte .btn-barre{padding:6px 12px;min-height:34px;font-size:.88rem}
@media(max-width:719px){.fiche-titre h1{font-size:4.2vw}}
@media(max-width:719px){.fiche-titre h1{font-size:4.1vw}}
@media(max-width:719px){.fiche-titre h1{font-size:3.9vw}}

/* (28/10) note globale : petite, sous le nom, à gauche, en dix graduations (design 3 choisi par Thomas) */
.fiche-titre{display:block;margin:4px 0 14px}
.note-globale{display:none}
.note-crans{display:flex;align-items:center;gap:8px;margin:6px 0 0;font-size:.85rem;color:var(--gris)}
.note-crans b{color:var(--encre);font-size:.95rem}
.crans{display:inline-flex;gap:2px}
.crans i{display:block;width:9px;height:9px;background:linear-gradient(90deg,var(--encre) var(--p),#e5e7eb var(--p))}
@media(max-width:719px){.fiche-titre h1{font-size:4.6vw}}

/* (28/10) photo principale 20 % plus petite */
.principale img,.principale .g-grand img{max-width:74%!important;max-height:74%!important}
.principale{aspect-ratio:5/4!important}
.principale img,.principale .g-grand img{max-width:92%!important;max-height:92%!important}

/* (28/10) toutes les notes (hors note globale) : design 1 — chiffre seul, « /10 » petit et gris, aligné à droite, sans cadre ni couleur */
.note-n{display:inline-flex;align-items:baseline;gap:1px;white-space:nowrap}
.note-n b{font-weight:700;color:var(--encre)}
.note-n small{font-size:.72em;color:var(--gris);font-weight:400}
.pastille{display:none}
.liste-notes{list-style:none;margin:0;padding:0}
.liste-notes li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid #eef0f2;font-size:.92rem}
.liste-notes li:last-child{border-bottom:0}
.liste-notes .lab em{font-style:normal;color:var(--gris);font-size:.85em;margin-left:4px}
.table-usages td .note-n,.table-usages td:nth-child(2){text-align:right}
.note-extreme .note-n b{font-size:1.05rem}
.ligne-note{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
/* prix en promotion : prix de base barré + remise */
.prix-bloc{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px}
.prix-barre{color:var(--gris);font-size:1rem}
.remise{color:var(--ko);font-weight:700;font-size:.95rem}
.barre-prix .bp-prix{flex-direction:row;align-items:baseline;gap:8px}
.barre-prix .prix-barre{font-size:.8rem}.barre-prix .remise{font-size:.8rem}
.promo{display:none}
.usage>div{display:grid;grid-template-columns:1fr auto;align-items:baseline;column-gap:10px}
.usage>div>small{grid-column:1/-1}
.barre-prix .bp-prix{white-space:nowrap;gap:6px}.barre-prix .bp-prix b{font-size:1.15rem}.barre-prix .btn-barre{padding:11px 14px}
.prix-barre,.remise{white-space:nowrap}

/* (28/10) « Pour quels usages ? » : chaque carte est un lien vers la page de l'usage, avec une photo */
a.usage{display:flex;flex-direction:column;text-decoration:none;color:var(--encre);border:1px solid var(--ligne);background:#fff}
a.usage:hover{border-color:var(--encre)}
a.usage>div{flex:1}
a.usage>div::after{content:"Voir la sélection →";grid-column:1/-1;font-size:.82rem;font-weight:600;color:var(--accent);margin-top:4px}
.usage img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;background:#fff}
.usage-vide{display:block;aspect-ratio:16/10;background:#f6f7f9}

/* (28/10) barre du bas : prix en haut, prix barré et % dessous ; le bouton garde sa place */
.barre-prix .bp-prix{flex-direction:column!important;align-items:flex-start!important;gap:0!important;min-width:0;flex:1 1 auto}
.barre-prix .bp-remise{display:flex;gap:6px;align-items:baseline;line-height:1.1}
.barre-prix .btn-barre{flex:0 0 auto;margin-left:8px}
.barre-prix.compacte .bp-remise{display:none}

/* (28/10) bandeau « Quelle trottinette pour moi ? » (design 10) : collé au-dessus de la barre de prix sur téléphone, coin bas droit sur ordinateur */
.bas-fixe{position:fixed;left:0;right:0;bottom:0;z-index:7;display:flex;flex-direction:column}
.bas-fixe .barre-prix{position:static!important}
.bandeau-pourvous{display:flex;justify-content:center;align-items:center;gap:6px;background:#f3f4f6;color:var(--encre);border-top:1px solid var(--ligne);padding:8px 16px;font-size:.88rem;font-weight:700;text-decoration:none}
.bandeau-pourvous:hover{background:#e9ebee}
body{padding-bottom:40px}
body.avec-barre-prix{padding-bottom:112px}
@media(min-width:720px){
 body,body.avec-barre-prix{padding-bottom:0}
 .bas-fixe{left:auto;right:20px;bottom:20px}
 .bandeau-pourvous{border:1px solid var(--encre);background:var(--encre);color:#fff;padding:11px 16px;border-radius:3px}
 .bandeau-pourvous:hover{background:#000}
}

/* ===== comparatif (duel) — gabarit final 28/10 ===== */
.duel-titre{font-size:clamp(1.5rem,4.5vw,2.3rem);font-weight:800;line-height:1.15;margin:4px 0 8px}
.duel-bref{font-size:1.05rem;color:#374151;margin:0 0 18px;max-width:760px}
.duel{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:start;margin-bottom:28px}
.duel-vs{align-self:center;font-weight:700;color:var(--gris);font-size:.95rem}
.duel-carte{border:1px solid var(--ligne);padding:14px;display:flex;flex-direction:column;gap:6px;background:#fff;min-width:0}
.duel-photo{aspect-ratio:5/4;display:flex;align-items:center;justify-content:center;background:#fff}
.duel-photo img{max-width:88%;max-height:88%;object-fit:contain}
.duel-nom{font-size:1.05rem;margin:4px 0 0;line-height:1.25}
.duel-nom a{color:var(--encre);text-decoration:none}.duel-nom a:hover{text-decoration:underline}
.duel-carte .prix-bloc{margin:4px 0 2px}.duel-carte .prix-grand{font-size:1.4rem;font-weight:800}
.duel-carte .btn{text-align:center}
.table-duel{width:100%;border-collapse:collapse;font-size:.92rem}
.table-duel th,.table-duel td{padding:9px 10px;border-bottom:1px solid #eef0f2;text-align:left;vertical-align:top}
.table-duel thead th{font-size:.8rem;color:var(--gris);font-weight:700;border-bottom:1px solid var(--ligne)}
.table-duel tbody th{font-weight:500;color:#374151;width:34%}
.table-duel td.gagne{font-weight:700}
.table-duel td.gagne::after{content:" ✓";color:var(--ok);font-weight:700}
.choisir{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.choisir>div{border-top:2px solid var(--encre);padding-top:8px}
.barre-duo{gap:8px!important}
.btn-duo{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--accent);color:#fff;text-decoration:none;padding:6px 8px;line-height:1.15;border-radius:3px;min-height:44px}
.btn-duo+.btn-duo{background:var(--encre)}
.btn-duo small{font-size:.72rem;opacity:.9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.btn-duo b{font-size:.98rem}
@media(max-width:719px){
 .duel{grid-template-columns:1fr 1fr;gap:8px}.duel-vs{display:none}
 .duel-carte{padding:10px}.duel-nom{font-size:.9rem}.duel-carte .prix-grand{font-size:1.1rem}
 .duel-carte .btn{font-size:.8rem;padding:9px 6px}.duel-carte .note-crans{font-size:.78rem}.duel-carte .crans i{width:6px;height:6px}
 .choisir{grid-template-columns:1fr}
 .table-duel{font-size:.84rem}.table-duel th,.table-duel td{padding:8px 6px}
}
.barre-prix .btn-duo small{color:#fff!important;opacity:.85;font-size:.72rem}
.duel-carte .provenance{font-size:.74rem;margin-top:2px;padding-top:6px}
.table-duel{table-layout:fixed}.table-duel th:first-child{width:36%}.table-duel td,.table-duel th{overflow-wrap:anywhere;word-break:normal}
#face-a-face .table-scroll,#notes .table-scroll{overflow-x:visible}
.table-duel{min-width:0!important;width:100%!important}
.table-duel th,.table-duel td{white-space:normal!important}
.table-voisines th.moi,.table-voisines td.moi{background:#f6f7f9;font-weight:700}
.table-voisines thead th a{color:var(--encre)}
.table-voisines th,.table-voisines td{overflow-wrap:normal!important;word-break:normal!important;hyphens:none}
.table-voisines{font-size:.84rem}
@media(max-width:719px){.table-voisines{font-size:.76rem}.table-voisines th,.table-voisines td{padding:7px 4px}.table-voisines tbody th{width:28%}}

/* ===== classement — gabarit final 28/10 ===== */
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:28px}
.classe-carte{position:relative}
.rang{display:inline-flex;align-items:center;justify-content:center;min-width:26px;height:26px;background:var(--encre);color:#fff;font-weight:800;font-size:.9rem;border-radius:3px}
.classe-carte .rang{position:absolute;top:10px;left:10px}
.role{font-size:.8rem;font-weight:700;color:var(--accent);margin:2px 0 0}
.classe-liste{list-style:none;margin:0;padding:0;border-top:1px solid var(--ligne)}
.classe-ligne{display:grid;grid-template-columns:auto 84px 1fr;gap:12px;align-items:start;padding:14px 0;border-bottom:1px solid var(--ligne)}
.cl-photo{width:84px;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;background:#fff}
.cl-photo img{max-width:100%;max-height:100%;object-fit:contain}
.cl-tete{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.cl-tete a{color:var(--encre);text-decoration:none}.cl-tete a:hover{text-decoration:underline}
.cl-chiffres{margin:4px 0 6px;font-size:.86rem;color:#4b5563}
.cl-achat{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.prix-moyen{font-weight:800;font-size:1.05rem}
.btn-petit{font-size:.82rem;padding:7px 12px;margin-left:auto;border-radius:3px}
.classe-detail{display:grid;grid-template-columns:140px 1fr;gap:16px;padding:16px 0;border-bottom:1px solid var(--ligne)}
.cd-photo{aspect-ratio:1/1;display:flex;align-items:center;justify-content:center}.cd-photo img{max-width:100%;max-height:100%;object-fit:contain}
.classe-detail h3{margin:0 0 6px;display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.classe-detail h3 a{color:var(--encre)}
.classe-detail p{margin:4px 0}
.bp-n1{font-size:.7rem;color:var(--gris);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}
@media(max-width:719px){
 .trio{grid-template-columns:1fr;gap:10px}
 .classe-carte{display:grid;grid-template-columns:96px 1fr;column-gap:12px;align-items:start}
 .classe-carte .duel-photo{grid-row:1/span 6}
 .classe-carte .rang{top:6px;left:6px}
 .classe-ligne{grid-template-columns:auto 64px 1fr;gap:10px}.cl-photo{width:64px}
 .classe-detail{grid-template-columns:84px 1fr;gap:12px}
}
@media(max-width:719px){.classe-carte>*:not(.duel-photo):not(.rang){grid-column:2}.classe-carte .provenance{border-top:0;padding-top:0}}

/* ===== classement v3 (maquette 09-classement) ===== */
.c-hero{display:grid;grid-template-columns:1fr 1.1fr;border:1px solid var(--ligne);background:#fff;margin:6px 0 28px;overflow:hidden}
.c-hero-texte{padding:28px 28px 22px;display:flex;flex-direction:column;justify-content:center}
.c-hero-photo{margin:0;min-height:100%}.c-hero-photo img{width:100%;height:100%;object-fit:cover;display:block}
.c-hero-btns{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 10px}
.c-grille{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:28px;align-items:start}
.c-trio{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:10px 0 30px}
.c-carte{border:1px solid var(--ligne);background:#fff;display:flex;flex-direction:column;min-width:0}
.c-carte-photo{aspect-ratio:4/3;overflow:hidden;background:#f6f7f9}.c-carte-photo img{width:100%;height:100%;object-fit:cover;display:block}
.c-carte-corps{padding:12px 14px;display:flex;flex-direction:column;gap:6px;flex:1}
.c-carte-corps h3{margin:0;font-size:1rem}.c-carte-corps h3 a{color:var(--encre);text-decoration:none}
.c-carte-corps .btn{margin-top:auto;text-align:center}
.c-etiquette{display:inline-block;align-self:flex-start;margin:0;font-size:.7rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--accent);border:1px solid #f6c3c1;padding:2px 6px}
.c-chips{display:flex;flex-wrap:wrap;gap:4px;margin:0}.c-chips span{font-size:.74rem;border:1px solid var(--ligne);padding:2px 6px;color:#374151}
.c-ligne{display:grid;grid-template-columns:150px 1fr 150px;gap:16px;border:1px solid var(--ligne);background:#fff;padding:14px;margin-bottom:12px}
.c-ligne-photo{position:relative;aspect-ratio:1/1;overflow:hidden;background:#f6f7f9}.c-ligne-photo img{width:100%;height:100%;object-fit:cover;display:block}
.c-ligne-photo .rang{position:absolute;top:8px;left:8px}
.c-ligne-corps h3{margin:4px 0 6px}.c-ligne-corps h3 a{color:var(--encre);text-decoration:none}.c-ligne-corps p{margin:4px 0;font-size:.92rem}
.c-puces{list-style:none;margin:6px 0;padding:0}.c-puces li{font-size:.84rem;color:#374151;padding:2px 0 2px 18px;position:relative}
.c-puces li::before{content:"✓";position:absolute;left:0;color:var(--ok);font-weight:700}
.c-ligne-note{display:flex;flex-direction:column;align-items:flex-end;gap:6px;text-align:right}
.note-n.grande b{font-size:1.8rem;font-weight:800}.note-n.grande small{font-size:.9rem}
.c-ligne-note>small{color:var(--gris);font-size:.75rem;margin-top:-6px}
.c-ligne-note .btn{font-size:.85rem;padding:9px 12px}
.g-cote{display:flex;flex-direction:column;gap:14px;position:sticky;top:90px}
.g-cote>section{border:1px solid var(--ligne);background:#fff;padding:14px}
.g-cote h2{font-size:1rem;margin:0 0 10px}
.g-mini{list-style:none;margin:0;padding:0}.g-mini li+li{border-top:1px solid #eef0f2}
.g-mini a{display:grid;grid-template-columns:64px 1fr;gap:10px;padding:8px 0;text-decoration:none;color:var(--encre)}
.g-mini-photo{aspect-ratio:1/1;overflow:hidden;background:#f6f7f9}.g-mini-photo img{width:100%;height:100%;object-fit:cover}
.g-mini b{display:block;font-size:.88rem}.g-mini small{display:block;color:var(--gris);font-size:.75rem}.g-mini em{font-style:normal;font-size:.78rem;font-weight:700;color:var(--accent)}
.g-cote .tout{font-weight:700;font-size:.85rem;color:var(--accent);text-decoration:none}
.g-aide .btn{display:block;text-align:center;margin-top:8px}
.g-proches{list-style:none;margin:0;padding:0}.g-proches li{padding:6px 0;border-top:1px solid #eef0f2;font-size:.88rem}.g-proches li:first-child{border-top:0}
.g-proches a{color:var(--encre);text-decoration:none}.g-proches a:hover{text-decoration:underline}
.g-confiance{list-style:none;margin:0;padding:0;font-size:.85rem}.g-confiance li{padding:5px 0 5px 20px;position:relative}.g-confiance li::before{content:"✓";position:absolute;left:0;color:var(--accent);font-weight:700}
@media(max-width:959px){.c-grille{grid-template-columns:1fr}.g-cote{position:static}}
@media(max-width:719px){
 .c-hero{grid-template-columns:1fr}.c-hero-texte{padding:18px 16px}.c-hero-photo{order:2;aspect-ratio:4/3}
 .c-trio{grid-template-columns:1fr 1fr;gap:10px}.c-trio>.c-carte:nth-child(3){grid-column:1/-1}
 .c-carte-corps{padding:10px}.c-carte-corps .btn{font-size:.8rem;padding:9px 6px}
 .c-ligne{grid-template-columns:96px 1fr;gap:12px;padding:12px}
 .c-ligne-note{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between;text-align:left;border-top:1px solid #eef0f2;padding-top:10px}
 .c-ligne-note>small{margin:0}
}
.c-hero-btns .act,.c-hero-btns .btn{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;box-sizing:border-box}
.c-carte-photo img.seule,.c-ligne-photo img.seule,.g-mini-photo img.seule{object-fit:contain!important;padding:6%;box-sizing:border-box;background:#fff}
.c-carte-photo,.c-ligne-photo{background:#fff}
section>.role+h2{margin-top:2px}
.g-texte>section{margin-bottom:34px}

/* (28/10) les deux boutons du haut côte à côte, aussi sur téléphone */
.c-hero-btns{flex-wrap:nowrap}
.c-hero-btns .btn,.c-hero-btns .act{flex:1 1 0;justify-content:center;text-align:center;white-space:nowrap;margin:0}
@media(max-width:719px){.c-hero-btns .btn,.c-hero-btns .act{font-size:.86rem;padding:0 8px}}

/* (28/10) texte sous le H1 : un bloc plein, sans demi-ligne */
.duel-bref{text-align:justify;text-align-last:justify;hyphens:auto;-webkit-hyphens:auto}
/* (28/10) deux boutons sous chaque modèle : la fiche + le marchand */
.deux-boutons{display:flex;gap:6px;margin-top:auto;width:100%}
.deux-boutons a{flex:1 1 0;display:inline-flex;align-items:center;justify-content:center;text-align:center;min-height:42px;padding:6px 8px;font-size:.84rem;font-weight:700;border-radius:3px;text-decoration:none;box-sizing:border-box;line-height:1.2}
.deux-boutons .btn{background:var(--accent);color:#fff}
.c-ligne-note .deux-boutons{flex-direction:column;width:100%}
@media(max-width:719px){.c-ligne-note .deux-boutons{flex-direction:row}.deux-boutons a{font-size:.78rem;padding:6px 4px}}
.table-recap th,.table-recap td{white-space:nowrap}
.table-recap td:first-child,.table-recap tbody th{white-space:normal}
.table-recap tbody td:first-of-type{white-space:normal}
@media(max-width:719px){.table-recap{font-size:.8rem}.table-recap th,.table-recap td{padding:7px 4px}.table-recap tbody th{width:26%}}
@media(max-width:719px){.table-recap tr.pas-mobile{display:none}.table-recap thead th{white-space:normal;font-size:.76rem;line-height:1.2}.table-recap td{font-size:.8rem}}
.duel-bref{text-align:left!important;text-align-last:auto!important;hyphens:manual!important}
.duel-bref{font-size:calc(1.05rem * .95)}
.duel-bref{font-size:calc(1.05rem * .95 * .95)}
.table-recap td small,.table-recap th small{color:var(--gris);font-weight:400}
.table-recap td{white-space:normal}
.table-recap td,.table-recap th{overflow-wrap:normal!important;word-break:normal!important;hyphens:none!important}
.duel-bref{font-size:calc(1.05rem * .95 * .95 * .95)}
/* (28/10) récapitulatif sur téléphone : le critère sur toute la largeur, puis les 3 notes côte à côte, chacune sur une ligne */
@media(max-width:719px){
 .table-recap{table-layout:auto}
 .table-recap thead tr,.table-recap tbody tr{display:grid;grid-template-columns:repeat(3,1fr)}
 .table-recap thead th:first-child{display:none}
 .table-recap tbody th{grid-column:1/-1;width:auto!important;padding:8px 4px 2px;border-bottom:0;font-weight:700;white-space:nowrap}
 .table-recap tbody td{white-space:nowrap;padding:2px 4px 8px}
 .table-recap tbody td .val{display:none}
 .table-recap tbody td small{font-size:.95em;color:var(--encre)}
 .table-recap thead th{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}

/* ---------- page marque (28/10) ---------- */
.c-grille-modeles{grid-template-columns:repeat(3,1fr)}
.ff{display:grid;grid-template-columns:1fr 1fr;gap:18px}.ff h3{font-size:1rem;margin:0 0 6px}
.table-cartes td,.table-cartes th{white-space:normal;overflow-wrap:normal;word-break:normal;hyphens:none}
@media(max-width:719px){
 .c-grille-modeles{grid-template-columns:1fr 1fr}.c-grille-modeles>.c-carte:nth-child(3){grid-column:auto}
 .ff{grid-template-columns:1fr}
 .table-cartes{min-width:0!important;border:0}.table-cartes thead{display:none}
 .table-cartes tbody tr{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--ligne);margin:0 0 10px;padding:8px 10px;background:#fff}
 .table-cartes tbody th{grid-column:1/-1;padding:0 0 6px;border:0;font-size:1rem}
 .table-cartes tbody td{border:0;padding:3px 6px 3px 0;font-size:.9rem}
 .table-cartes tbody td::before{content:attr(data-l);display:block;font-size:.72rem;color:var(--gris);text-transform:uppercase;letter-spacing:.03em}
 .table-gammes tbody td{grid-column:1/-1}
}

.table-cartes .prix-barre,.table-cartes .remise{margin-left:6px;font-size:.85rem}
@media(max-width:719px){
 .table-cartes tbody th{width:auto!important;display:block;white-space:normal}
 .table-cartes tbody td .prix-barre,.table-cartes tbody td .remise{display:inline-block}
 .c-trio-choix{grid-template-columns:1fr!important}.c-trio-choix>.c-carte{grid-column:auto!important}
}

@media(min-width:720px){.table-cartes td{white-space:nowrap!important}.table-cartes thead th{white-space:normal!important;overflow-wrap:normal!important;word-break:keep-all!important;hyphens:none!important}.table-gammes td{white-space:normal!important}}

.table-cartes{table-layout:auto!important;width:100%}.table-cartes th,.table-cartes td{overflow:visible!important;text-overflow:clip!important}

/* ---------- boutons d'action (Thomas, 28/10) : alignés, même taille, jamais hors de leur cadre ---------- */
.deux-boutons{display:grid!important;grid-template-columns:1fr 1fr;gap:6px;width:100%;box-sizing:border-box}
.deux-boutons a{min-width:0;width:100%;margin:0!important;overflow-wrap:normal;word-break:normal;hyphens:none}
.c-carte .deux-boutons,.duel-carte .deux-boutons{grid-template-columns:1fr}  /* dans une carte : les deux boutons empilés, pleine largeur */
.c-carte .deux-boutons a,.duel-carte .deux-boutons a{min-height:40px;font-size:.84rem}
.c-ligne-note .deux-boutons{grid-template-columns:1fr}
@media(max-width:719px){.c-ligne-note .deux-boutons{grid-template-columns:1fr 1fr}}
.btn,.act,.btn-barre{box-sizing:border-box;max-width:100%}
.c-carte-corps>*{min-width:0}
.c-carte .deux-boutons a,.duel-carte .deux-boutons a,.c-ligne-note .deux-boutons a{white-space:nowrap;font-size:.8rem;padding:6px 8px;height:42px;min-height:0}
@media(max-width:400px){.c-carte .deux-boutons a,.duel-carte .deux-boutons a{font-size:.74rem;padding:4px 4px;letter-spacing:-.01em}}

/* ---------- UX texte et images (28/10) ---------- */
.autre-gagne{font-size:1rem;color:var(--encre);border-top:1px solid var(--ligne);padding-top:12px;margin-top:14px}
.usages-grille .usage{display:grid!important;grid-template-columns:112px 1fr;align-items:center;gap:12px;padding:8px!important}
.usages-grille .usage img{width:112px!important;height:84px!important;aspect-ratio:auto!important;object-fit:cover;display:block}
.usages-grille .usage .usage-vide{width:112px;height:84px;display:block;background:#f6f7f9}
@media(max-width:719px){
 #selection .c-trio>.c-carte:nth-child(3){grid-column:1/-1;display:grid;grid-template-columns:42% 1fr}
 #selection .c-trio>.c-carte:nth-child(3) .c-carte-photo{aspect-ratio:auto;height:100%;min-height:150px}
 .c-ligne-corps p,.c-ligne-corps li{font-size:.95rem;line-height:1.5}
 .usages-grille .usage{grid-template-columns:96px 1fr}.usages-grille .usage img{width:96px!important;height:72px!important}
}
@media(min-width:960px){.usages-grille{grid-template-columns:repeat(2,1fr)!important}}
.usages-grille .usage.sans-img{grid-template-columns:1fr!important}
@media(max-width:719px){
 #selection .c-trio>.c-carte:nth-child(3) .c-carte-photo img{object-fit:contain!important;width:100%;height:100%;padding:8%;box-sizing:border-box;background:#fff}
 #methode .c-trio{grid-template-columns:1fr!important}#methode .c-trio>.c-carte{grid-column:auto!important}
}

/* ---------- guide (28/10, maquette 10-guide, style des classements) ---------- */
.g-grille{display:grid;grid-template-columns:200px minmax(0,1fr) 300px;gap:28px;align-items:start}
.g-sommaire{position:sticky;top:84px;border:1px solid var(--ligne);background:#fff;padding:12px 14px}
.g-sommaire summary{font-weight:800;cursor:pointer;list-style:none}.g-sommaire ol{margin:8px 0 0;padding-left:18px;font-size:.9rem;line-height:1.45}.g-sommaire li{margin:6px 0}.g-sommaire a{color:var(--encre);text-decoration:none}
.en-bref{border-left:4px solid var(--accent);background:#fff;padding:12px 16px;margin:0 0 26px;border-top:1px solid var(--ligne);border-right:1px solid var(--ligne);border-bottom:1px solid var(--ligne)}
.en-bref p:last-child{margin:4px 0 0;font-size:1.02rem;line-height:1.55}
.g-chiffres{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0 6px}
.g-chiffres>div{border:1px solid var(--ligne);background:#fff;padding:10px 12px;display:flex;flex-direction:column;gap:2px}
.g-chiffres small{color:var(--gris);font-size:.78rem;text-transform:uppercase;letter-spacing:.03em}.g-chiffres b{font-size:1.1rem}.g-chiffres span{font-size:.85rem;color:var(--gris)}
.g-usages .c-carte,.g-budget .c-carte{text-decoration:none;color:var(--encre)}.g-usages .tout{color:var(--accent);font-weight:700;font-size:.9rem;margin-top:auto}
.g-budget{grid-template-columns:repeat(2,1fr)!important}
@media(max-width:1100px){.g-grille{grid-template-columns:minmax(0,1fr) 300px}.g-sommaire{grid-column:1/-1;position:static}}
@media(max-width:959px){.g-grille{grid-template-columns:1fr}}
@media(max-width:719px){.g-chiffres{grid-template-columns:1fr 1fr}.g-usages,.g-budget{grid-template-columns:1fr 1fr!important}.g-usages>.c-carte:nth-child(3),.g-budget>.c-carte:nth-child(3){grid-column:auto!important}}
/* 29/10 : une colonne de haut de page ne s'élargit jamais au-delà de l'écran */
@media(max-width:719px){.c-hero{grid-template-columns:minmax(0,1fr)}}

/* 29/10 : bandeau cookies — bords nets, deux boutons de même poids (refuser aussi simple qu'accepter) */
#cookie-banner{position:fixed;left:0;right:0;bottom:0;z-index:50;background:#fff;border-top:2px solid var(--encre);padding:14px 16px;font-size:.9rem;line-height:1.45}
#cookie-banner p{margin:0 0 10px;max-width:860px}
#cookie-banner .cb-boutons{display:grid;grid-template-columns:1fr 1fr;gap:8px;max-width:420px}
#cookie-banner button{min-height:44px;font:inherit;font-weight:700;border:1px solid var(--encre);background:#fff;color:var(--encre);border-radius:3px;cursor:pointer}
#cookie-banner button[data-cb="oui"]{background:var(--encre);color:#fff}
@media(min-width:720px){#cookie-banner{display:flex;align-items:center;gap:20px;justify-content:center}#cookie-banner p{margin:0}#cookie-banner .cb-boutons{flex:0 0 300px}}