
:root{
 --bg:#f5f7fb;--card:#fff;--text:#0f172a;--muted:#667085;--line:#e6eaf2;
 --brand:#315efb;--brand2:#7c3aed;--green:#12b76a;--amber:#f59e0b;--shadow:0 20px 60px rgba(15,23,42,.08)
}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--text)}
a{text-decoration:none;color:inherit}.container{max-width:1180px;margin:auto;padding:0 22px}
.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.95);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
.navin{height:72px;display:flex;align-items:center;gap:24px}.logo{display:flex;align-items:center;gap:10px;font-weight:900;font-size:22px;letter-spacing:-.6px}
.mark{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--brand),var(--brand2))}
.navlinks{display:flex;gap:22px;flex:1;color:#344054;font-size:14px}.navlinks a:hover{color:var(--brand)}
.navright{display:flex;gap:10px;align-items:center}.btn{border:1px solid var(--line);background:#fff;border-radius:12px;padding:11px 15px;font-weight:800;cursor:pointer}
.btn.primary{border:0;color:#fff;background:linear-gradient(135deg,var(--brand),var(--brand2))}.btn.dark{border:0;background:#111827;color:#fff}
.hero{padding:54px 0 32px}.heroGrid{display:grid;grid-template-columns:1.25fr .75fr;gap:28px}.eyebrow{display:inline-flex;background:#edf3ff;color:#2148d8;padding:8px 12px;border-radius:999px;font-weight:800;font-size:13px}
h1{font-size:60px;line-height:1;letter-spacing:-3px;margin:18px 0}.gradient{background:linear-gradient(90deg,var(--brand),var(--brand2));-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{font-size:18px;line-height:1.65;color:var(--muted);max-width:720px}
.searchbox{position:relative;display:flex;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:18px;padding:8px;margin-top:26px}
.searchbox input{flex:1;border:0;outline:0;padding:14px;font-size:16px;background:transparent}.suggest{display:none;position:absolute;top:69px;left:0;right:0;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);overflow:hidden;z-index:90}
.suggest a{display:block;padding:12px 14px;border-bottom:1px solid #f0f2f6}.suggest a:hover{background:#f7f9ff}
.heroCard,.card,.panel,.scorePanel,.tableCard{background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 8px 20px rgba(15,23,42,.04)}
.heroCard{padding:25px;background:linear-gradient(145deg,#edf4ff,#fff 55%,#f4efff)}.metric{padding:15px;border-radius:15px;background:#fff;border:1px solid var(--line);margin:10px 0}.metric strong{font-size:28px;color:var(--brand)}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:13px}.chip{font-size:12px;padding:8px 11px;border:1px solid var(--line);background:#fff;border-radius:999px;color:#475467}
.ad{display:flex;align-items:center;justify-content:space-between;gap:18px;border:1px solid #cfddff;background:linear-gradient(90deg,#eef6ff,#fff,#f6efff);border-radius:18px;padding:18px 22px;margin:22px 0}.ad small{display:block;text-transform:uppercase;letter-spacing:.8px;font-size:10px;color:#667085}.ad p{margin:5px 0;color:var(--muted)}
.section{padding:30px 0}.sectionHead{display:flex;justify-content:space-between;align-items:end;margin-bottom:17px}.sectionHead h2{margin:0;font-size:28px}.sectionHead p{margin:5px 0 0;color:var(--muted)}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.card{padding:18px}.card:hover{transform:translateY(-2px);transition:.2s;box-shadow:var(--shadow)}
.icon{width:43px;height:43px;border-radius:13px;background:#edf3ff;display:grid;place-items:center;font-size:20px;margin-bottom:12px}.card h3{margin:0 0 7px}.card p{margin:0;color:var(--muted);font-size:13px;line-height:1.55}
.meta{display:flex;gap:8px;align-items:center;margin-top:14px;font-size:12px;color:#667085}.score{font-size:28px;font-weight:900;color:var(--brand);margin-top:10px}
.trustbar{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.trustitem{padding:14px;border:1px solid var(--line);background:#fff;border-radius:14px}.trustitem b{display:block;margin-bottom:5px}
.pageHero{padding:40px 0 18px}.pageHero h1{font-size:44px;margin:10px 0}
.compareGrid{display:grid;grid-template-columns:1fr 330px;gap:20px}.tableCard{overflow:hidden}.thead,.row{display:grid;grid-template-columns:1.15fr 1fr 1fr;border-bottom:1px solid var(--line)}.thead{background:#fafcff;font-weight:900}.cell{padding:15px;border-right:1px solid var(--line)}.cell:last-child{border-right:0}
.scorePanel{padding:20px;height:max-content;position:sticky;top:94px}.ring{width:118px;height:118px;border-radius:50%;background:conic-gradient(var(--green) 0 92%,#e7edf5 92%);display:grid;place-items:center;margin:14px auto}.ring span{width:86px;height:86px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:28px;font-weight:900}
.badge{display:inline-flex;padding:6px 9px;border-radius:999px;background:#fff4d8;color:#8a5b00;font-weight:800;font-size:12px}.sideAd{background:linear-gradient(160deg,#0f172a,#334155);color:#fff;border-radius:18px;padding:18px;margin-top:18px}
.reviewGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.stars{color:#f59e0b}.review{padding:18px;background:#fff;border:1px solid var(--line);border-radius:18px}
.footer{margin-top:45px;background:#fff;border-top:1px solid var(--line);padding:34px 0}.footerGrid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:28px}.footer a{display:block;color:#667085;font-size:13px;margin:7px 0}
.notice{padding:14px;border:1px solid #d9e2ff;background:#f5f8ff;border-radius:14px}.input,.select{border:1px solid var(--line);background:#fff;border-radius:12px;padding:11px 12px}.filters{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}.productGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:900px){.navlinks{display:none}.heroGrid,.compareGrid,.footerGrid{grid-template-columns:1fr}.grid,.trustbar,.productGrid,.reviewGrid{grid-template-columns:1fr 1fr}h1{font-size:46px}.scorePanel{position:static}}
@media(max-width:620px){.grid,.trustbar,.productGrid,.reviewGrid{grid-template-columns:1fr}.navright .lang{display:none}h1{font-size:40px}.thead,.row{font-size:12px}.cell{padding:9px}}

.langselect{min-width:112px}
.heroCard .metric span{display:block;color:var(--muted);font-size:13px;margin-top:4px}
.card .scoreline{margin-top:14px;display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:13px}
.scorepill{font-weight:900;color:var(--brand);background:#edf3ff;border-radius:999px;padding:6px 9px}
.emptyState{padding:22px;border:1px dashed var(--line);border-radius:18px;color:var(--muted);background:#fff}
.footer{border-top:1px solid var(--line);background:#fff;margin-top:56px;padding:30px 0}
.footerin{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;color:var(--muted);font-size:13px}
.footerlinks{display:flex;gap:16px;flex-wrap:wrap}
@media(max-width:760px){.navlinks{display:none}.heroGrid{grid-template-columns:1fr}h1{font-size:44px}.trustbar{grid-template-columns:1fr 1fr}.ad{align-items:flex-start;flex-direction:column}}
