:root{--bg:#0f1115;--card:#171a21;--fg:#e6e8ec;--mut:#9aa0aa;--acc:#5b8cff;--line:#20242e}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--fg);line-height:1.6}
.wrap{max-width:960px;margin:0 auto;padding:0 24px}
header{display:flex;align-items:center;justify-content:space-between;padding:24px 0;border-bottom:1px solid var(--line)}
.logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:19px}
.logo img{width:26px;height:26px}
nav a{color:var(--mut);text-decoration:none;margin-left:22px;font-size:15px}
nav a:hover{color:var(--fg)}
.hero{text-align:center;padding:80px 0 50px}
.hero h1{font-size:42px;line-height:1.15;margin-bottom:16px}
.hero p{color:var(--mut);font-size:18px;max-width:600px;margin:0 auto 30px}
.btn{display:inline-block;background:var(--acc);color:#fff;padding:12px 26px;border-radius:10px;text-decoration:none;font-weight:600}
.btn.ghost{background:transparent;border:1px solid #2a2f3a;color:var(--fg);margin-left:10px}
.shot{width:100%;max-width:820px;margin:20px auto 0;display:block;border:1px solid var(--line);border-radius:14px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding:60px 0}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:24px}
.card h3{font-size:17px;margin-bottom:8px}
.card p{color:var(--mut);font-size:15px}
table{width:100%;border-collapse:collapse;margin:30px 0}
th,td{padding:12px;border-bottom:1px solid var(--line);text-align:left;font-size:15px}
th{color:var(--mut);font-weight:500}
footer{border-top:1px solid var(--line);padding:28px 0;color:var(--mut);font-size:14px;text-align:center}
@media(max-width:680px){.grid{grid-template-columns:1fr}.hero h1{font-size:30px}}