/* meilleur-pc-portable - gabarit complet.
   L ancien fichier (1131 o) ne stylait que la typographie et le bandeau : les tableaux
   comparatifs sortaient en texte tabule, les images en vignettes brutes et les liens produit
   en liens bleus. Tout est repris ici, y compris ce qui n existait pas : tableaux, cartes
   produit, boutons d achat, encadre d affiliation.
   Contrainte assumee : le HTML des pages n a presque aucune classe -> l essentiel doit tenir
   sur des selecteurs de balises et de voisinage, pour fonctionner sans reecrire les pages. */

*{box-sizing:border-box}

:root{
  --v1unggq:#10243e; --v35o6ev:#16395f; --v0zu4pa:#23466d;
  --vdo86bd:#ffb703; --vf23e9h:#e09e00;
  --v1emc6b:#f5f7fa; --v6wj2y8:#fff; --vd2goyl:#19212b; --vey58js:#4a5b6e;
  --v99hmp9:#dbe3ec; --v2fwzni:0 1px 2px rgba(16,36,62,.06),0 4px 16px rgba(16,36,62,.07);
  --venz1cx:10px;
}

body{margin:0;background:var(--v1emc6b);color:var(--vd2goyl);
  font:17px/1.65 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-text-size-adjust:100%}

/* --v8psnzl en-tete et navigation --v8psnzl */
header{background:#fff;color:var(--v1unggq);border-bottom:1px solid var(--v99hmp9)}
header .c83s2ag{max-width:1840px;min-height:84px;margin:auto;padding:0 48px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.cfjda8q{display:inline-flex;align-items:baseline;flex:none;color:var(--v1unggq);font-size:1.55rem;font-weight:800;letter-spacing:-.035em;line-height:1;text-decoration:none;white-space:nowrap}
.cfjda8q span{color:#e52620;font-weight:500}
header nav{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:0;padding:0}
header nav a{color:var(--v1unggq);text-decoration:none;padding:9px 14px;border-radius:0;font-size:1rem;font-weight:500;line-height:1.25;transition:color .15s,box-shadow .15s}
header nav a:hover,header nav a:focus{background:transparent;color:#e52620}
header nav a[aria-current="page"]{background:transparent;color:var(--v1unggq);font-weight:750;box-shadow:inset 0 -2px 0 #e52620}

main{max-width:880px;margin:34px auto 64px;padding:0 24px}

/* --v8psnzl titres --v8psnzl */
h1{font-size:clamp(1.9rem,4.4vw,2.9rem);line-height:1.12;margin:0 0 18px;
  color:var(--v1unggq);letter-spacing:-.02em}
h2{font-size:clamp(1.35rem,2.6vw,1.7rem);line-height:1.25;margin:52px 0 14px;
  color:var(--v35o6ev);border-left:4px solid var(--vdo86bd);padding-left:13px;letter-spacing:-.01em}
h3{font-size:1.12rem;line-height:1.35;margin:30px 0 6px;color:var(--v1unggq)}
p{margin:0 0 15px}
.cdxkchd{font-size:1.1rem;color:var(--vey58js)}
section{padding-bottom:2px}

/* --v8psnzl listes --v8psnzl */
ul,ol{margin:0 0 16px;padding-left:22px}
li{margin:7px 0}
ul li::marker{color:var(--vf23e9h)}

/* --v8psnzl tableau comparatif --v8psnzl
   c est la piece maitresse d un comparateur : sans style, il sortait en texte tabule. */
table{width:100%;border-collapse:collapse;margin:20px 0 26px;background:var(--v6wj2y8);
  border:1px solid var(--v99hmp9);border-radius:var(--venz1cx);overflow:hidden;
  box-shadow:var(--v2fwzni);font-size:.94rem}
thead th{background:var(--v1unggq);color:#fff;text-align:left;font-weight:600;
  padding:12px 13px;font-size:.88rem;letter-spacing:.01em;white-space:nowrap}
td,tbody th{padding:11px 13px;border-top:1px solid var(--v99hmp9);vertical-align:top}
tbody th{text-align:left;font-weight:600;color:var(--v1unggq)}
tbody tr:nth-child(even){background:#fafcfe}
tbody tr:hover{background:#f0f6fd}
td a{color:var(--v35o6ev);font-weight:600}
/* un tableau large doit pouvoir defiler sur mobile plutot que deborder */
.c0jq905,.ccmpc5q{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:20px 0 26px}
.c0jq905 table,.ccmpc5q table{margin:0}

/* --v8psnzl classement et cartes produit --v8psnzl */
.ca45zjy{margin:26px 0 14px}.ca45zjy h2{margin-top:26px}.c4ib7zv{max-width:700px;color:var(--vey58js)}
.c211oeo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:20px 0 8px}
.c3b5rkc{position:relative;display:grid;grid-template-columns:132px minmax(0,1fr);gap:14px;background:var(--v6wj2y8);border:1px solid var(--v99hmp9);border-radius:var(--venz1cx);padding:16px;box-shadow:var(--v2fwzni)}
.c5x2liw{position:absolute;top:10px;left:10px;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--v1unggq);color:#fff;font-size:.85rem;font-weight:800}
.cbv2shq{height:150px;display:flex;align-items:center;justify-content:center;background:#f7f9fc;border-radius:7px;overflow:hidden}
.cbv2shq img{display:block;width:100%;height:100%;object-fit:contain;padding:8px}
.ca6mckb{min-width:0}.cem8apl{margin:0 0 3px;color:var(--v35o6ev);font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.045em}.c3b5rkc h3{margin:0 0 8px;padding:0;border:0;box-shadow:none;background:transparent;font-size:1.1rem}.cewl96e{margin:0 0 10px;padding-left:17px;font-size:.88rem;line-height:1.4}.cewl96e li{margin:2px 0}.c6ak9dt{margin:0 0 7px;font-size:.9rem}.c6ak9dt strong{font-size:1.04rem;color:var(--v1unggq)}.c8w7a8z{margin:0 0 11px;font-size:.84rem;line-height:1.42;color:var(--vey58js)}
.c1phwzx,a[href*="amazon."]{display:inline-flex;align-items:center;justify-content:center;background:var(--vdo86bd);color:var(--v1unggq);font-weight:800;text-decoration:none;padding:10px 14px;border-radius:7px;border:1px solid var(--vf23e9h);box-shadow:0 1px 0 rgba(0,0,0,.06);transition:background .15s,transform .05s;font-size:.9rem}.c1phwzx:hover,.c1phwzx:focus,a[href*="amazon."]:hover,a[href*="amazon."]:focus{background:#ffc633;color:var(--v1unggq)}.c1phwzx:active,a[href*="amazon."]:active{transform:translateY(1px)}
td a[href*="amazon."]{padding:6px 12px;font-size:.87rem;border-radius:6px}
img{max-width:100%;height:auto}

/* --v8psnzl divulgation d affiliation --v8psnzl */
p:has(> strong:first-child),.c12b8wt{}
main > p:nth-of-type(3),.c1ch5x3{}
/* repere par le texte : la phrase de divulgation commence toujours par Liens partenaires */
.c4dati6,.c12b8wt,.c1ch5x3{background:#fff8e6;border:1px solid #f2d98a;
  border-left:4px solid var(--vdo86bd);border-radius:8px;padding:12px 16px;font-size:.9rem;
  color:#5a4a1f;margin:0 0 22px}

/* --v8psnzl pied de page --v8psnzl */
footer{background:var(--v1unggq);color:#c3d4e6;padding:30px 0;font-size:.9rem;margin-top:56px}
footer a{color:#e8f1fa}

/* --v8psnzl mobile --v8psnzl */
@media (max-width:620px){
  main{margin:24px auto 44px;padding:0 16px}
  header .c83s2ag{min-height:auto;padding:16px;align-items:flex-start;flex-direction:column;gap:14px}
  .cfjda8q{font-size:1.32rem}
  header nav{justify-content:flex-start;gap:0;width:100%}
  header nav a{font-size:.94rem;padding:7px 10px}
  table{font-size:.86rem;display:block;overflow-x:auto;white-space:nowrap}
  thead th,td{padding:9px 10px}
  .c211oeo{grid-template-columns:1fr;gap:12px}
  .c3b5rkc{grid-template-columns:108px minmax(0,1fr);padding:13px}
  .cbv2shq{height:132px}
  .c1phwzx{display:flex;width:100%;text-align:center}
  a[href*="amazon."]{display:block;text-align:center}
}

/* --v8psnzl mode sombre --v8psnzl */
@media (prefers-color-scheme:dark){
  :root{--v1emc6b:#111820;--v6wj2y8:#18222e;--vd2goyl:#e9eef4;--vey58js:#b3c3d3;
    --v99hmp9:#2a3846;--v2fwzni:0 1px 2px rgba(0,0,0,.3),0 4px 16px rgba(0,0,0,.25)}
  header{background:#f7f9fc} footer{background:#08131f}
  h1,h3{color:#f5f8fc}
  h2{color:#a9cff5}
  tbody tr:nth-child(even){background:#1c2734}
  tbody tr:hover{background:#22303f}
  tbody th{color:#cfe3f7}
  td a{color:#8fc0f0}
  a{color:#8fc0f0}
  .c4dati6,.c12b8wt,.c1ch5x3{background:#2a2415;border-color:#5c4a1c;color:#e8d9ae}
}


/* Navigation en clusters : toutes les URLs utiles restent accessibles depuis chaque page. */
.c8onmb9{position:relative;z-index:20;background:#fff;border-bottom:1px solid var(--v99hmp9);box-shadow:0 2px 12px rgba(16,36,62,.035)}
.c8onmb9 .c83s2ag{max-width:1240px;min-height:78px;padding:0 28px;gap:26px}
.c0il4rj{display:flex;align-items:stretch;justify-content:flex-end;gap:3px;min-height:78px}
.c0il4rj > a,.c9j4ry3 > summary{display:flex;align-items:center;color:var(--v1unggq);font:700 .93rem/1.2 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;text-decoration:none;padding:0 12px;cursor:pointer;white-space:nowrap;border:0;background:transparent;list-style:none}
.c9j4ry3 > summary::-webkit-details-marker{display:none}
.c9j4ry3 > summary::after{content:"";width:7px;height:7px;margin:0 0 3px 8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);transition:transform .18s}
.c0il4rj > a:hover,.c0il4rj > a:focus,.c9j4ry3 > summary:hover,.c9j4ry3 > summary:focus{color:#e52620;outline:none}
.c0il4rj > a[aria-current="page"],.c9j4ry3:has(a[aria-current="page"]) > summary{box-shadow:inset 0 -3px 0 #e52620}
.c9j4ry3{position:relative;display:flex}
.c9j4ry3[open] > summary{color:#e52620}
.c9j4ry3[open] > summary::after{transform:rotate(225deg);margin-bottom:-3px}
.c2xq46x{position:absolute;top:calc(100% - 7px);right:0;width:min(680px,calc(100vw - 32px));padding:22px;background:#fff;border:1px solid var(--v99hmp9);border-radius:0 0 14px 14px;box-shadow:0 16px 35px rgba(16,36,62,.16);display:grid;grid-template-columns:1fr 1fr;gap:28px}
.mega-panel--vg9q7k3,.mega-panel--v9n2bfs{width:min(360px,calc(100vw - 32px));grid-template-columns:1fr}
.c2xq46x p{margin:0 0 9px;color:#687689;font-size:.72rem;font-weight:800;letter-spacing:.075em;text-transform:uppercase}
.c2xq46x a{display:block;padding:7px 8px;border-radius:6px;color:var(--v1unggq);font-size:.93rem;font-weight:650;line-height:1.25;text-decoration:none}
.c2xq46x a:hover,.c2xq46x a:focus{color:#c91b17;background:#fff0ef;outline:none}
.c2xq46x a[aria-current="page"]{color:#c91b17;background:#fff0ef}

.capw1bv{background:#10243e;color:#dce6f0;margin-top:64px;border:0}
.capw1bv .c83s2ag{max-width:1240px;padding:42px 28px 22px}
.capw1bv .cfjda8q{color:#fff;font-size:1.35rem}.capw1bv .cfjda8q span{color:#ff6b64}
.c8mytv6{max-width:540px}.c8mytv6 p{margin:9px 0 30px;color:#b8c8d8;font-size:.95rem;line-height:1.5}
.cclzks4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:25px;padding:24px 0 28px;border-top:1px solid rgba(220,230,240,.2)}
.cclzks4 section{padding:0}.cclzks4 p{margin:0 0 8px;color:#fff;font-size:.8rem;font-weight:800;letter-spacing:.04em}
.cclzks4 a{display:block;width:max-content;max-width:100%;padding:4px 0;color:#c3d1df;font-size:.88rem;line-height:1.35;text-decoration:none}
.cclzks4 a:hover,.cclzks4 a:focus,.cclzks4 a[aria-current="page"]{color:#fff;text-decoration:underline;text-underline-offset:3px;outline:none}
.cb3dgzi{display:flex;flex-wrap:wrap;gap:8px 22px;padding-top:18px;border-top:1px solid rgba(220,230,240,.2);color:#a6b9ca;font-size:.78rem;line-height:1.45}

@media(max-width:900px){
 .c8onmb9 .c83s2ag{min-height:0;display:block;padding:14px 20px 0}.c0il4rj{min-height:0;justify-content:flex-start;align-items:stretch;flex-wrap:wrap;margin-top:11px}.c0il4rj > a,.c9j4ry3 > summary{min-height:42px;padding:0 10px;font-size:.89rem}.c9j4ry3{position:static}.c2xq46x{top:auto;left:20px;right:20px;width:auto;max-width:none;border-radius:10px;grid-template-columns:1fr;gap:16px}.mega-panel--vg9q7k3,.mega-panel--v9n2bfs{width:auto}.cclzks4{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 18px}}
@media(max-width:520px){
 .c8onmb9 .c83s2ag{padding:13px 14px 0}.cfjda8q{font-size:1.32rem}.c0il4rj{display:block;margin-top:10px;padding-bottom:10px}.c0il4rj > a,.c9j4ry3 > summary{min-height:42px;padding:0 7px}.c9j4ry3{display:block}.c2xq46x{position:static;width:100%;margin:0 0 8px;padding:14px;border-radius:8px;box-shadow:none}.capw1bv .c83s2ag{padding:34px 20px 20px}.cclzks4{grid-template-columns:1fr;gap:20px}.c8mytv6 p{margin-bottom:24px}}