*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,'Noto Sans SC','Microsoft YaHei',sans-serif;color:#111}
.header{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;border-bottom:1px solid #eee;position:sticky;top:0;background:rgba(255,255,255,.8);backdrop-filter:blur(6px);z-index:10}
.logo{height:36px}
.nav .btn{margin-left:8px;padding:8px 12px;border:1px solid #ddd;background:#fff;cursor:pointer;border-radius:8px}
.nav .btn.on{border-color:#6E56CF;color:#6E56CF}
.hero{text-align:center;padding:48px 16px}
.title{margin:0 0 8px 0;font-size:40px;line-height:1.2}
.subtitle{margin:0 auto 24px;max-width:840px;color:#4b5563}
.btn.primary{background:#6E56CF;color:#fff;border:none}
.btn{display:inline-block;padding:10px 16px;margin:6px;border-radius:10px;text-decoration:none;border:1px solid #ddd;color:#111}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;padding:24px;max-width:1200px;margin:0 auto}
.card{border:1px solid #eee;border-radius:14px;padding:16px;background:#fff}
.contact{text-align:center;padding:32px 16px}
.contact .qr{width:256px;height:256px;margin-top:8px;image-rendering: pixelated;image-rendering: crisp-edges;}
.footer{border-top:1px solid #eee;padding:16px;display:flex;justify-content:center;align-items:center;gap:12px;color:#6b7280}
.footer .secondary{height:18px}
@media (max-width:900px){.grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.grid{grid-template-columns:1fr}.title{font-size:28px}}
.brand-wrap{display:flex;align-items:center;gap:.5rem}
.brand-flag{
  padding:.2rem .5rem;
  border:1px solid #e5e7eb;
  border-radius:.5rem;
  font-size:12px;
  color:#6b7280;
  white-space:nowrap;
}