/* Comparatifs : circulation entre la page Comparatif et les trois comparatifs (choix du client M2a, 5 nov. 2026).
   Bande « Les comparatifs » sous l'en-tête, et « Comparatif suivant » avant le pied, sur les quatre pages. */
.cmp-bande{background:var(--blanc,#FFFDF8);border-bottom:1px solid var(--filet)}
.cmp-bande .wrap{display:flex;align-items:center;flex-wrap:wrap;gap:0 22px;min-height:56px;padding-top:4px;padding-bottom:4px}
.cmp-k{font-family:"Geist Mono",ui-monospace,monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--or-f,#9A6B12)}
.cmp-bande .cmp-k{margin-right:4px}
.cmp-bande a{display:inline-flex;align-items:center;min-height:44px;font-size:15px;font-weight:500;color:var(--encre-2);text-decoration:none;border-bottom:2px solid transparent}
.cmp-bande a:hover{color:var(--violet,#6D28D9)}
.cmp-bande a:focus-visible{outline:2px solid var(--violet,#6D28D9);outline-offset:2px}
.cmp-bande a[aria-current="page"]{color:var(--navy);font-weight:600;border-bottom-color:var(--or,#EFBF6E)}
/* Téléphone : le libellé sur sa ligne, les quatre liens ensemble sur la suivante (sinon Lojii et Septeo passaient seuls à la ligne). */
@media (max-width:560px){.cmp-bande .wrap{gap:0 18px}.cmp-bande .cmp-k{flex-basis:100%;padding-top:10px}}
/* Bande collée sous l'en-tête au défilement (choix du client du 5 nov. 2026) : ordinateur et tablette seulement, affinée
   à 44 px une fois collée (comparatifs.js pose .is-colle) ; sur téléphone elle reste à sa place.
   --cmp-dec : décalage des ancres sous l'en-tête et la bande collée (45 px de bande + 12 px d'air). */
:root{--cmp-dec:57px}
.cmp-bande{position:sticky;top:var(--nav-h,72px);z-index:50}
.cmp-bande.is-colle .wrap{min-height:44px;padding-top:0;padding-bottom:0}
body [id]{scroll-margin-top:calc(var(--nav-h,72px) + var(--cmp-dec))}
@media (max-width:560px){:root{--cmp-dec:12px}.cmp-bande{position:static}}
.cmp-suivant{background:var(--creme,#FBF6EC);border-top:1px solid var(--filet);padding:30px 0}
.cmp-suivant .wrap{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px 28px}
.cmp-next{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:4px 18px;min-width:min(100%,460px);padding:18px 22px;background:var(--blanc,#FFFDF8);border:1px solid rgba(29,66,99,.22);border-bottom:3px solid var(--or,#EFBF6E);border-radius:3px;color:inherit;text-decoration:none}
.cmp-next .cmp-k{grid-column:1}
.cmp-next b{grid-column:1;font-family:"Instrument Serif",serif;font-weight:400;font-size:clamp(23px,2.4vw,28px);line-height:1.15;color:var(--navy)}
.cmp-next i{grid-column:2;grid-row:1 / span 2;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:var(--or,#EFBF6E);color:#1B1426;font-style:normal;font-size:20px}
.cmp-next:hover{border-color:var(--violet,#6D28D9);border-bottom-color:var(--violet,#6D28D9)}
.cmp-next:hover b{color:var(--violet,#6D28D9)}
.cmp-next:hover i{background:var(--violet,#6D28D9);color:#FFFDF8}
.cmp-next:focus-visible,.cmp-tous:focus-visible{outline:2px solid var(--violet,#6D28D9);outline-offset:3px}
.cmp-tous{display:inline-flex;align-items:center;min-height:44px;font-size:15.5px;font-weight:500;color:var(--navy);text-decoration:underline;text-decoration-color:rgba(29,66,99,.35);text-underline-offset:4px}
.cmp-tous:hover{color:var(--violet,#6D28D9)}