*{margin:0;padding:0;box-sizing:border-box}
html,body{font-size:14px;color:#e5e7eb;background:linear-gradient(180deg,#0b1020 0%,#0f172a 50%,#0b1020 100%)}
img{display:block;max-width:100%}
li{list-style:none}
a{text-decoration:none;color:#e5e7eb}

:root{--primary:#7c3aed;--accent:#3b82f6;--muted:#9ca3af;--card:#111827;--glass:rgba(255,255,255,0.06);--radius:14px;--shadow:0 8px 24px rgba(0,0,0,0.35);--container:1200px}
.container{width:100%;max-width:var(--container);padding:0 20px;margin:0 auto}

.nav{position:fixed;top:0;left:0;right:0;height:72px;background:rgba(12,17,32,0.7);backdrop-filter:saturate(180%) blur(10px);box-shadow:0 4px 20px rgba(0,0,0,0.25);z-index:999}
.nav-inner{height:100%;display:flex;align-items:center;justify-content:space-between}
.logo{width:160px}
.menu{display:flex;gap:24px;align-items:center}
.menu>li>a{line-height:72px;font-size:16px;color:#e5e7eb;transition:.2s}
.menu>li>a:hover{color:var(--accent)}
.menu .btn{display:inline-block;padding:10px 18px;border-radius:999px;border:1px solid rgba(255,255,255,0.2);transition:.2s}
.menu .btn-primary{background:linear-gradient(90deg,#3b82f6,#7c3aed);border:none}
.menu .btn-primary:hover{filter:brightness(1.1)}

.menu .has-qr{position:relative}
.menu .has-qr ol{position:absolute;top:64px;right:0;display:none}
.menu .has-qr:hover ol{display:block}
.menu .ewm{padding:12px;border-radius:10px;background:rgba(20,25,45,0.9);box-shadow:var(--shadow)}
.menu .ewm img{max-width:142px}
.menu .ewm p{text-align:center;color:#e5e7eb;font-size:14px;margin-top:6px}

.hero{padding-top:140px;padding-bottom:80px;position:relative}
.hero:before{content:"";position:absolute;inset:0;background:radial-gradient(600px 300px at 80% 20%,rgba(124,58,237,0.35) 0%,transparent 60%),radial-gradient(600px 300px at 20% 20%,rgba(59,130,246,0.35) 0%,transparent 60%)}
.hero-inner{position:relative;display:flex;gap:40px;align-items:center}
.hero-left{flex:1}
.hero-right{flex:1;display:flex;justify-content:center;align-items:center}
.hero h1{font-size:44px;line-height:1.2;color:#fff;margin-bottom:16px}
.hero p{font-size:18px;color:#cbd5e1;margin-bottom:24px}
.cta{display:flex;gap:16px}
.btn-primary{display:inline-block;padding:14px 22px;border-radius:12px;background:linear-gradient(90deg,#3b82f6,#7c3aed);color:#fff}
.btn-secondary{display:inline-block;padding:14px 22px;border-radius:12px;background:rgba(255,255,255,0.1);color:#fff;border:1px solid rgba(255,255,255,0.2)}
.btn-secondary:hover{background:rgba(255,255,255,0.15)}
.hero-art{width:420px;height:420px;border-radius:50%;background:conic-gradient(from 180deg at 50% 50%,#3b82f6, #7c3aed, #22d3ee, #3b82f6);filter:blur(6px);opacity:.8;box-shadow:0 0 80px rgba(124,58,237,0.35)}

.section{padding:60px 0}
.section h2{text-align:center;font-size:30px;color:#fff;margin-bottom:28px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{background:var(--glass);border:1px solid rgba(255,255,255,0.12);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px;transition:.2s}
.card:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(0,0,0,0.45)}
.card .thumb{width:100%;height:160px;border-radius:10px;overflow:hidden;background:#0f172a}
.card .thumb img{width:100%;height:100%;object-fit:cover}
.card h3{font-size:18px;color:#fff;margin:12px 0}
.card p{font-size:14px;color:#94a3b8;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.card .more{display:inline-block;margin-top:10px;color:#93c5fd}

.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.step{background:var(--glass);border:1px solid rgba(255,255,255,0.12);border-radius:var(--radius);box-shadow:var(--shadow);min-height:160px;padding:20px}
.step h4{font-size:20px;color:#fff;margin-bottom:8px}
.step p{font-size:14px;color:#94a3b8}

.brands{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.brands a{background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.12);border-radius:10px;display:flex;justify-content:center;align-items:center;padding:12px}

footer{margin-top:40px}
.foot-cta{background:linear-gradient(90deg,#3b82f6,#7c3aed);padding:28px 0}
.foot-cta .container{display:flex;justify-content:space-between;align-items:center}
.foot-cta h3{font-size:22px;color:#fff}
.foot-cta a{background:rgba(255,255,255,0.15);border:1px solid rgba(255,255,255,0.3);padding:12px 18px;border-radius:10px;color:#fff}

/* legacy footer blocks restyled for v2 theme */
.foottop{background:rgba(12,17,32,0.8)}
.foottop>div{width:var(--container);max-width:var(--container);margin:0 auto;padding:24px 20px}
.lj{padding:16px 0;margin-bottom:8px}
.lj>span{font-size:16px;font-weight:600;color:#e5e7eb;margin-right:12px}
.lj>a{display:inline-block;margin:6px 12px 6px 0;color:#93c5fd;font-size:14px}
.lj>a:hover{color:#bfdbfe;text-decoration:underline}

.box{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;padding:12px 0}
.box-left img{max-width:180px;border-radius:10px;box-shadow:var(--shadow)}
.box-zx{flex:1}
.box-zx_top{display:flex;align-items:center;border-bottom:1px solid rgba(255,255,255,0.12);margin-bottom:12px;padding-bottom:16px}
.box-zx_top>img{width:54px;height:48px}
.box-zx_top .rig p:first-of-type{color:#fff;font-size:28px;font-weight:700}
.box-zx_top .rig p:last-of-type{color:#94a3b8;font-size:14px}
.box-zx>p{padding-left:30px;height:30px;margin-bottom:8px;color:#94a3b8;line-height:30px;font-size:14px}

.box-right{width:300px}
.box-right>h3{font-size:18px;font-weight:700;color:#fff;margin-bottom:16px}
.box-right ul{display:flex;gap:16px}
.box-right ul li{background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.12);border-radius:12px;padding:10px;display:flex;flex-direction:column;align-items:center}
.box-right ul li img{width:120px;height:120px;border-radius:8px}
.box-right ul li p{text-align:center;color:#94a3b8;line-height:24px;font-size:14px;margin-top:8px}

.footbottom{background:#0b1020;height:68px}
.footbottom>p{color:#94a3b8;text-align:center;font-size:14px;line-height:68px}

@media (max-width:992px){.grid{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:repeat(2,1fr)}.brands{grid-template-columns:repeat(3,1fr)}.hero-inner{flex-direction:column}.hero-right{order:-1}}
@media (max-width:576px){.grid{grid-template-columns:1fr}.steps{grid-template-columns:1fr}.brands{grid-template-columns:repeat(2,1fr)}.hero{padding-top:120px;padding-bottom:60px}.hero h1{font-size:32px}}