
:root{--bg:#0b0d11;--panel:#12151b;--panel2:#171a21;--text:#f4f6f8;--muted:#a8b0bf;--line:#292e38;--accent:#8d7cff;--accent2:#42d6c5;--max:1120px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Helvetica,Arial,sans-serif;line-height:1.7}
a{color:#b8b0ff;text-decoration:none}a:hover{text-decoration:underline}.wrap{max-width:var(--max);margin:auto;padding:0 20px}
.site-header{position:sticky;top:0;z-index:50;background:rgba(11,13,17,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav{min-height:72px;display:flex;align-items:center;gap:22px}.brand{display:flex;align-items:center;gap:10px;font-weight:800;color:#fff;white-space:nowrap}.brand img{width:42px;height:42px;border-radius:10px;object-fit:cover}.navlinks{display:flex;align-items:center;gap:15px;margin-left:auto;flex-wrap:wrap}.navlinks a{color:#dfe3e9;font-size:14px;font-weight:600}.navlinks a:hover{color:#fff}.drop{position:relative}.drop>span{font-size:14px;color:#dfe3e9;font-weight:600}.dropmenu{display:none;position:absolute;top:25px;left:-10px;background:var(--panel);border:1px solid var(--line);padding:10px;border-radius:12px;min-width:180px}.drop:hover .dropmenu{display:block}.dropmenu a{display:block;padding:7px 9px}.menu{display:none;background:none;border:1px solid var(--line);color:#fff;border-radius:10px;padding:8px 10px}
.hero{padding:75px 0 45px}.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:45px;align-items:center}.eyebrow{display:inline-block;padding:5px 10px;border:1px solid var(--line);border-radius:999px;color:#bfc6d3;font-size:13px}.hero h1{font-size:clamp(34px,5vw,60px);line-height:1.08;margin:18px 0}.hero p{font-size:18px;color:var(--muted);max-width:720px}.buttons{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.btn{display:inline-block;padding:12px 18px;border-radius:10px;font-weight:800;background:var(--accent);color:#fff;border:1px solid transparent}.btn.secondary{background:transparent;border-color:var(--line);color:#fff}.hero-card{background:linear-gradient(145deg,#151820,#0e1015);border:1px solid var(--line);border-radius:26px;padding:28px;text-align:center;box-shadow:0 20px 70px rgba(0,0,0,.25)}.hero-card img{width:100%;max-width:350px;border-radius:22px}
.notice{border:1px solid #343a47;background:#11141a;padding:15px 18px;border-radius:12px;color:#bfc6d3;font-size:14px;margin:20px 0}.notice strong{color:#fff}
.section{padding:48px 0}.section h2{font-size:32px;line-height:1.2;margin:0 0 15px}.section h3{font-size:21px;margin:28px 0 8px}.muted{color:var(--muted)}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:20px}.feature h3{margin:0 0 7px}.feature p{margin:0;color:var(--muted)}.tag{display:inline-block;font-size:12px;color:#d3d7e0;border:1px solid var(--line);padding:3px 8px;border-radius:999px;margin:3px}
table{width:100%;border-collapse:collapse;background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden}th,td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}th{color:#fff;background:#181b22}td{color:#c5cbd5}ul,ol{padding-left:23px}.procon{display:grid;grid-template-columns:1fr 1fr;gap:18px}.pro{border-left:3px solid var(--accent2)}.con{border-left:3px solid #ff7070}
.article-head{padding:65px 0 25px}.article-head h1{font-size:clamp(32px,5vw,52px);line-height:1.1;margin:12px 0}.article-meta{color:var(--muted);font-size:14px}.article-cover{width:100%;max-height:520px;object-fit:cover;border-radius:18px;border:1px solid var(--line);margin:20px 0 30px}.content{max-width:850px}.content p{color:#c8ced8}.content li{color:#c8ced8}.content h2{margin-top:42px}.content h3{margin-top:26px}.faq details{background:var(--panel);border:1px solid var(--line);padding:14px 17px;border-radius:12px;margin:10px 0}.faq summary{cursor:pointer;font-weight:700}.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.blog-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;overflow:hidden}.blog-card img{width:100%;aspect-ratio:16/9;object-fit:cover}.blog-card .inside{padding:17px}.blog-card h3{font-size:19px;margin:0 0 7px;line-height:1.35}.blog-card p{font-size:14px;color:var(--muted);margin:0 0 10px}
footer{border-top:1px solid var(--line);margin-top:40px;padding:40px 0;color:var(--muted);font-size:14px}.footergrid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:30px}.footergrid h3{color:#fff;margin-top:0}.footerlinks{display:grid;gap:7px}.copyright{border-top:1px solid var(--line);margin-top:25px;padding-top:20px}
@media(max-width:900px){.navlinks{display:none}.menu{display:block;margin-left:auto}.hero-grid,.grid3,.blog-grid{grid-template-columns:1fr}.grid2,.procon,.footergrid{grid-template-columns:1fr}.hero{padding-top:45px}.dropmenu{position:static;display:block;background:transparent;border:0;padding:0 0 0 12px}.drop>span{display:block;margin-bottom:4px}.site-header.open .navlinks{display:grid;padding:12px 0}.nav{flex-wrap:wrap}.site-header.open .navlinks{width:100%;margin:0}}
@media(max-width:600px){.wrap{padding:0 15px}.hero h1{font-size:36px}.section{padding:35px 0}.article-head{padding-top:42px}.hero-card{padding:18px}}
