
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:Inter,sans-serif;background:#f8fafc;color:#1f2937}
.container{max-width:1200px;margin:auto;padding:0 24px}
.nav{background:#fff;position:sticky;top:0;border-bottom:1px solid #eee}
.nav .container{display:flex;align-items:center;justify-content:space-between;height:76px}
.logo{font-size:30px;font-weight:800;color:#6C3CF0}
.logo span{color:#FF7A00}
nav a{text-decoration:none;color:#444;margin:0 12px}
.actions{display:flex;gap:10px}
.btn{padding:12px 22px;border-radius:12px;text-decoration:none;font-weight:700}
.primary{background:#6C3CF0;color:#fff}
.secondary,.ghost{border:1px solid #6C3CF0;color:#6C3CF0}
.hero{background:linear-gradient(135deg,#efe9ff,#fff);padding:80px 0}
.hero-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:50px;align-items:center}
.eyebrow{color:#6C3CF0;font-weight:700;letter-spacing:1px}
h1{font-size:64px;line-height:1.05;margin:18px 0}
.lead{font-size:20px;line-height:1.6;color:#555}
.cta{margin:30px 0;display:flex;gap:15px}
.trust{display:flex;gap:20px;flex-wrap:wrap;color:#666;font-size:15px}
.phone-card{display:flex;justify-content:center}
.phone{width:320px;height:620px;background:#222;border-radius:42px;padding:12px;box-shadow:0 30px 60px rgba(0,0,0,.2)}
.screen{background:#fff;height:100%;border-radius:30px;padding:24px}
.screen h3{text-align:center;color:#6C3CF0}
.pill{background:#f2efff;margin:12px 0;padding:12px;border-radius:14px;font-weight:700}
.ecosystem{padding:80px 24px}
.ecosystem h2{text-align:center;font-size:42px;margin-bottom:40px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px}
.card{background:#fff;padding:28px;border-radius:20px;box-shadow:0 10px 25px rgba(0,0,0,.08)}
footer{background:#111827;color:#fff;padding:40px;margin-top:80px}
@media(max-width:900px){
.hero-grid{grid-template-columns:1fr}
nav{display:none}
.actions{display:none}
h1{font-size:44px}
}
