:root {
  --bg: #fbfcfe; --bg-alt: #f3f6fa; --surface: #fff; --text: #101525;
  --text-secondary: #667085; --border: #dfe5ec; --accent: #3569dc;
  --accent-strong: #2455bd; --accent-soft: #edf3ff; --success: #18794e;
  --success-soft: #ecf8f2; --shadow: 0 1px 2px rgba(16,24,40,.04), 0 12px 30px rgba(16,24,40,.07);
  --maxw: 1120px;
}
@media (prefers-color-scheme: dark) {
  :root { --bg:#0a0d14; --bg-alt:#0e131c; --surface:#151922; --text:#f8fafc; --text-secondary:#a7b0c0; --border:#313948; --accent:#7fa3ff; --accent-strong:#a9c0ff; --accent-soft:#22375f; --success:#49c987; --success-soft:#1d3a2d; --shadow:0 1px 3px rgba(0,0,0,.38),0 18px 48px rgba(0,0,0,.35); }
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; background:var(--bg); color:var(--text); font:17px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; -webkit-font-smoothing:antialiased; }
img { max-width:100%; display:block; }
a { color:var(--accent); text-decoration:none; }
a:hover { text-decoration:underline; }
.wrap { max-width:var(--maxw); margin:0 auto; padding:0 24px; }
header { position:sticky; top:0; z-index:30; background:color-mix(in srgb,var(--bg) 90%,transparent); backdrop-filter:saturate(150%) blur(12px); border-bottom:1px solid var(--border); }
.nav { height:64px; display:flex; align-items:center; gap:24px; }
.brand { display:flex; align-items:center; gap:10px; color:var(--text); font-weight:750; white-space:nowrap; }
.brand:hover { text-decoration:none; }
.brand img { width:32px; height:32px; border-radius:8px; }
.nav-links { display:flex; gap:22px; margin-left:auto; }
.nav-links a { color:var(--text-secondary); font-size:14px; font-weight:600; }
.nav-links a:hover { color:var(--text); text-decoration:none; }
.nav-links a[href="/faq.html"] { display:none; }
.hero { padding:68px 0 58px; border-bottom:1px solid var(--border); background:linear-gradient(180deg,var(--bg),var(--bg-alt)); }
.compare-hero { padding:78px 0 64px; text-align:center; background:var(--bg); border-bottom:0; }
.compare-hero .wrap { max-width:920px; }
.compare-hero .breadcrumbs, .compare-hero .eyebrow { display:none; }
.compare-hero h1 { max-width:820px; margin:0 auto; font-size:clamp(46px,7vw,78px); line-height:.98; letter-spacing:.02em; text-transform:uppercase; }
.compare-hero .lede { max-width:760px; margin:32px auto 0; font-size:20px; }
.compare-hero .lede a { color:var(--accent); font-weight:700; }
.hero-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:52px; align-items:center; }
.eyebrow { color:var(--accent); font-size:13px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
h1,h2,h3 { margin:0; line-height:1.14; letter-spacing:0; }
h1 { margin-top:13px; font-size:clamp(38px,5.6vw,60px); }
h2 { font-size:clamp(27px,4vw,39px); }
h3 { font-size:21px; }
p { margin:14px 0 0; color:var(--text-secondary); }
.lede { max-width:700px; font-size:20px; }
.actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; }
.btn { display:inline-flex; align-items:center; justify-content:center; padding:12px 18px; border:1px solid transparent; border-radius:7px; background:var(--accent); color:#fff; font-weight:720; }
.btn:hover { background:var(--accent-strong); text-decoration:none; }
.btn.secondary { background:var(--surface); color:var(--text); border-color:var(--border); }
.visual { min-height:320px; padding:24px; border:1px solid var(--border); border-radius:8px; background:var(--surface); box-shadow:var(--shadow); display:grid; align-content:center; gap:12px; }
.visual-row { padding:16px; border:1px solid var(--border); border-radius:7px; background:var(--bg-alt); }
.visual-row span { display:block; color:var(--text-secondary); font-size:13px; }
.visual-row b { display:block; margin-top:5px; }
.trust { padding:27px 0; border-bottom:1px solid var(--border); background:var(--surface); }
.trust-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.trust b { display:block; }
.trust span { color:var(--text-secondary); font-size:14px; }
.section { padding:76px 0; }
.section.alt { background:var(--bg-alt); }
.section-head { max-width:720px; margin-bottom:34px; }
.section-head p { font-size:18px; }
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.card { display:block; min-height:210px; padding:22px; border:1px solid var(--border); border-radius:8px; background:var(--surface); color:var(--text); box-shadow:var(--shadow); }
.card:hover { border-color:var(--accent); text-decoration:none; }
.card .kicker { color:var(--accent); font-size:13px; font-weight:780; text-transform:uppercase; }
.card h3 { margin-top:14px; }
.card p { font-size:15px; }
.article-card { padding:0; overflow:hidden; }
.article-card img { width:100%; height:220px; object-fit:cover; }
.article-card .body { padding:20px; }
.compare-card-top { display:flex; align-items:center; gap:12px; min-height:42px; }
.compare-card-top img { width:42px; height:42px; padding:6px; border:1px solid var(--border); border-radius:10px; background:var(--bg-alt); object-fit:contain; }
.compare-card-top .kicker { margin:0; }
.content { max-width:800px; margin:0 auto; padding:60px 24px 84px; }
.content h2 { margin-top:54px; font-size:32px; }
.content h2:first-child { margin-top:0; }
.content ul,.content ol { color:var(--text-secondary); padding-left:24px; }
.content li { margin:9px 0; }
.callout,.source-box,.chart,.table-wrap { margin:28px 0; border:1px solid var(--border); border-radius:8px; background:var(--surface); box-shadow:var(--shadow); }
.callout,.source-box,.chart { padding:20px; }
.callout { background:var(--accent-soft); box-shadow:none; }
.callout p { color:var(--text); margin:0; }
.table-wrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; min-width:620px; }
th,td { padding:14px 16px; border-bottom:1px solid var(--border); text-align:left; }
th { color:var(--text-secondary); font-size:13px; text-transform:uppercase; }
tr:last-child td { border-bottom:0; }
.chart h3 { margin-bottom:16px; }
.bar-row { display:grid; grid-template-columns:150px 1fr 60px; gap:12px; align-items:center; margin-top:12px; }
.bar-label,.bar-value { font-size:14px; }
.bar-value { text-align:right; font-weight:750; }
.bar-track { height:12px; border:1px solid var(--border); border-radius:999px; overflow:hidden; background:var(--bg-alt); }
.bar-fill { height:100%; background:linear-gradient(90deg,var(--accent),var(--success)); }
.meta { display:flex; flex-wrap:wrap; gap:16px; margin-top:23px; color:var(--text-secondary); font-size:14px; }
.article-hero-img { border:1px solid var(--border); border-radius:8px; overflow:hidden; box-shadow:var(--shadow); }
.article-hero-img img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.faq details { padding:17px 19px; margin-bottom:12px; border:1px solid var(--border); border-radius:8px; background:var(--surface); }
.faq summary { cursor:pointer; font-weight:700; }
.us-note { display:flex; gap:10px; align-items:flex-start; padding:14px 16px; margin-top:24px; border:1px solid color-mix(in srgb,var(--accent) 30%,var(--border)); border-radius:8px; background:var(--accent-soft); color:var(--text); font-size:14px; }
.site-footer { padding:54px 0 34px; border-top:1px solid var(--border); background:var(--bg-alt); color:var(--text-secondary); font-size:14px; }
.footer-top { display:flex; justify-content:space-between; align-items:flex-start; gap:28px; flex-wrap:wrap; }
.footer-top p { max-width:360px; margin-top:12px; }
.footer-links-grid { display:grid; grid-template-columns:170px 300px minmax(0,1fr); gap:28px; margin-top:38px; padding-top:28px; border-top:1px solid var(--border); }
.footer-links-grid h3 { margin:0 0 14px; color:var(--text); font-size:12px; letter-spacing:.08em; text-transform:uppercase; }
.footer-links { display:grid; gap:9px; }
.footer-links a,.language-grid a { color:var(--text-secondary); }
.footer-links a:hover,.language-grid a:hover { color:var(--text); }
.language-grid { display:grid; grid-template-columns:repeat(5,minmax(76px,1fr)); gap:9px 18px; }
.footer-bottom { margin-top:30px; padding-top:18px; border-top:1px solid var(--border); font-size:13px; }
footer:not(.site-footer) { padding:42px 0; border-top:1px solid var(--border); background:var(--bg-alt); color:var(--text-secondary); font-size:14px; }
@media (max-width:940px) { .hero-grid,.grid-3 { grid-template-columns:1fr; } .visual { min-height:240px; } }
@media (max-width:760px) { .wrap{padding:0 18px}.nav-links{display:none}.hero{padding:46px 0}.hero-grid{gap:30px}.trust-grid{grid-template-columns:1fr;gap:14px}.section{padding:58px 0}.bar-row{grid-template-columns:105px 1fr 48px;gap:8px}.article-card img{height:240px}.language-menu{margin-left:auto}.footer-links-grid{grid-template-columns:1fr 1fr}.language-grid{grid-column:1 / -1;grid-template-columns:repeat(3,minmax(76px,1fr))} }