:root{
  --ink:#14121f;
  --muted:#56526a;
  --line:#e4e2ee;
  --soft:#f7f6fb;
  --accent:#5f40f4;
  --accent-dark:#300776;
  --ok:#0f7a4d;
  --warn:#9a5b00;
  --max:1120px;
  --prose:820px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:#fff;
  color:var(--ink);
  font-family:Manrope,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:17px;
  line-height:1.65;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto}
a{color:var(--accent-dark);text-underline-offset:2px}
a:hover{color:var(--accent)}

.wrap{max-width:var(--max);margin:0 auto;padding-inline:20px}
.prose{max-width:var(--prose)}

h1,h2,h3,h4{line-height:1.22;font-weight:700;margin:0 0 .5em;letter-spacing:-.015em}
h1{font-size:clamp(1.85rem,4.6vw,2.85rem);margin-bottom:.35em}
h2{font-size:clamp(1.4rem,3.2vw,1.95rem);margin-top:2.6em}
h3{font-size:clamp(1.1rem,2.4vw,1.3rem);margin-top:1.8em}
h4{font-size:1.02rem;margin-top:1.4em}
p,ul,ol{margin:0 0 1.1em}
ul,ol{padding-left:1.25em}
li{margin-bottom:.4em}
strong{font-weight:700}
small{font-size:.86rem}

/* header */
.masthead{border-bottom:1px solid var(--line);background:#fff}
.masthead-in{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between;padding-block:16px}
.brand{font-weight:700;letter-spacing:-.02em;font-size:1.02rem;text-decoration:none;color:var(--ink)}
.brand span{color:var(--accent)}
.nav{display:flex;flex-wrap:wrap;gap:18px;font-size:.92rem}
.nav a{color:var(--muted);text-decoration:none}
.nav a:hover{color:var(--ink);text-decoration:underline}

/* transparency notice — required by art. L111-7 */
.disclosure{background:var(--soft);border-bottom:1px solid var(--line)}
.disclosure p{margin:0;padding-block:14px;font-size:.92rem;color:var(--muted);max-width:var(--prose)}
.disclosure a{color:var(--accent-dark)}

.hero{padding-block:46px 10px}
.lede{font-size:1.12rem;color:var(--muted);max-width:var(--prose)}
.meta-line{font-size:.88rem;color:var(--muted);margin-bottom:1.6em}

/* table of contents */
.toc{border:1px solid var(--line);border-radius:10px;padding:20px 22px;margin:2em 0;background:var(--soft);max-width:var(--prose)}
.toc h2{font-size:.82rem;text-transform:uppercase;letter-spacing:.08em;margin:0 0 .7em;color:var(--muted)}
.toc ol{margin:0;padding-left:1.2em;font-size:.96rem}
.toc li{margin-bottom:.3em}

/* criteria */
.criteria{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));margin:1.6em 0 0;padding:0;list-style:none}
.criteria li{border:1px solid var(--line);border-radius:10px;padding:16px 18px;margin:0}
.criteria .c-num{font-size:.78rem;font-weight:700;color:var(--accent);letter-spacing:.06em}
.criteria h3{margin:.3em 0 .35em;font-size:1rem}
.criteria p{margin:0;font-size:.92rem;color:var(--muted)}

/* ranking */
.rank{border-top:1px solid var(--line);padding-block:26px}
.rank-head{display:flex;gap:16px;align-items:baseline;flex-wrap:wrap}
.rank-pos{font-size:1.5rem;font-weight:700;color:var(--accent);min-width:2.2ch}
.rank-title{margin:0;font-size:1.35rem}
.rank-org{font-size:.9rem;color:var(--muted);font-weight:400}
.rank-facts{display:grid;gap:2px 26px;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));margin:16px 0 14px;padding:0;list-style:none;font-size:.94rem}
.rank-facts li{margin:0;padding-block:5px;border-bottom:1px solid var(--line)}
.rank-facts b{font-weight:700}
.rank-facts .k{color:var(--muted);display:block;font-size:.8rem;text-transform:uppercase;letter-spacing:.05em}
.verdict{border-left:3px solid var(--accent);padding:2px 0 2px 16px;margin:1.1em 0;max-width:var(--prose)}
.verdict p{margin:0 0 .5em}
.verdict p:last-child{margin:0}

/* table */
.table-scroll{overflow-x:auto;margin:1.6em 0;border:1px solid var(--line);border-radius:10px}
table{border-collapse:collapse;width:100%;min-width:860px;font-size:.9rem}
caption{text-align:left;padding:14px 16px;font-size:.88rem;color:var(--muted);border-bottom:1px solid var(--line)}
th,td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--line);vertical-align:top}
thead th{background:var(--soft);font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700;white-space:nowrap}
tbody tr:last-child td{border-bottom:0}
tbody th{font-weight:700;white-space:nowrap}
.yes{color:var(--ok);font-weight:700}
.no{color:var(--muted)}
.na{color:var(--warn)}

/* callouts */
.note{border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:0 8px 8px 0;padding:16px 18px;margin:1.6em 0;background:var(--soft);max-width:var(--prose)}
.note p:last-child{margin:0}
.note h3{margin-top:0}

/* faq */
.faq{max-width:var(--prose)}
.faq h3{margin-top:1.9em}

/* footer */
.foot{border-top:1px solid var(--line);margin-top:60px;padding-block:34px 50px;font-size:.9rem;color:var(--muted)}
.foot a{color:var(--muted)}
.foot-nav{display:flex;flex-wrap:wrap;gap:18px;margin-bottom:14px}
.foot p{max-width:var(--prose)}

@media (max-width:640px){
  body{font-size:16px}
  .hero{padding-block:32px 6px}
  h2{margin-top:2.1em}
}