:root{
 --white:#fff;--soft:#f7f8fa;--soft2:#eef2f6;--text:#101828;--muted:#667085;
 --line:#e4e7ec;--blue:#3157e8;--blue2:#6d3df5;--green:#067647;--orange:#9a3412;
 --shadow:0 18px 46px rgba(16,24,40,.08);--radius:22px
}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,Helvetica,sans-serif;color:var(--text);background:#fff;line-height:1.58}
a{text-decoration:none;color:inherit}.container{width:min(1180px,calc(100% - 40px));margin:auto}
.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.95);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
.navin{height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand img{height:44px;display:block}
.navlinks{display:flex;align-items:center;gap:21px;font-size:14px;color:#475467;font-weight:650}.navlinks a:hover{color:var(--blue)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 20px;border-radius:13px;border:1px solid var(--line);background:#fff;font-weight:750}
.btn.primary{border:none;color:#fff;background:linear-gradient(135deg,var(--blue2),var(--blue))}
.btn.soft{background:var(--soft)}
.hero{padding:96px 0 70px;background:linear-gradient(180deg,#fff 0,#fbfcff 100%)}
.heroGrid{display:grid;grid-template-columns:1.03fr .97fr;gap:54px;align-items:center}
.badge{display:inline-flex;padding:8px 12px;border-radius:999px;background:#f0f4ff;color:#3647c8;font-size:13px;font-weight:800}
h1{font-size:clamp(46px,7vw,76px);line-height:.98;letter-spacing:-.055em;margin:22px 0 24px}
.lead{font-size:19px;color:var(--muted);max-width:710px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin:30px 0 16px}
.micro{font-size:13px;color:var(--muted)}
.device{background:#101828;border-radius:32px;padding:15px;box-shadow:var(--shadow)}
.screen{min-height:430px;border-radius:22px;background:linear-gradient(180deg,#fbfcfe,#eff3f8);padding:26px}
.appTop{display:flex;justify-content:space-between;color:#667085;font-size:12px}.setup{margin-top:58px;background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px;box-shadow:0 17px 42px rgba(16,24,40,.09)}
.macLabel{font-size:12px;color:#667085}.mac{font-family:ui-monospace,monospace;font-size:25px;font-weight:850;margin:4px 0 2px}
.inputRow{display:grid;grid-template-columns:1fr auto;gap:10px;margin-top:18px}.fakeInput{height:48px;border:1px solid var(--line);background:#fafafa;border-radius:12px;padding:0 14px;display:flex;align-items:center;color:#98a2b3}.fakeBtn{border-radius:12px;color:#fff;background:linear-gradient(135deg,var(--blue2),var(--blue));display:flex;align-items:center;padding:0 18px;font-weight:800}
.ok{margin-top:14px;background:#ecfdf3;border:1px solid #abefc6;color:#05603a;padding:12px 14px;border-radius:13px;font-size:13px;font-weight:650}
.section{padding:82px 0}.grey{background:var(--soft);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.eyebrow{font-size:12px;letter-spacing:.09em;text-transform:uppercase;color:#4657d6;font-weight:850}
h2{font-size:clamp(34px,5vw,50px);letter-spacing:-.04em;line-height:1.06;margin:10px 0 15px}.intro{max-width:760px;color:var(--muted);font-size:18px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px}.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:34px}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:0 7px 26px rgba(16,24,40,.04)}
.icon{width:43px;height:43px;border-radius:13px;background:#eef3ff;color:#4051d5;display:grid;place-items:center;font-weight:850;margin-bottom:18px}
.card h3{margin:0 0 8px;font-size:20px}.card p{margin:0;color:var(--muted)}
.step{background:#fff;border:1px solid var(--line);border-radius:20px;padding:23px}.num{width:34px;height:34px;border-radius:50%;background:#101828;color:#fff;display:grid;place-items:center;font-size:13px;font-weight:850;margin-bottom:20px}.step p{font-size:14px;color:var(--muted)}
.dark{background:#101828;color:#fff;border-radius:30px;padding:44px;display:grid;grid-template-columns:.9fr 1.1fr;gap:40px}.dark p{color:#d0d5dd}.checks{display:grid;gap:11px}.check{padding:13px 15px;border-radius:13px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.11);font-weight:650}
.split{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:32px}.panel{border:1px solid var(--line);border-radius:22px;padding:27px;background:#fff}.pill{display:inline-flex;padding:7px 10px;border-radius:999px;background:#ecfdf3;color:#067647;font-size:12px;font-weight:850}
.warn{margin-top:20px;background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;padding:18px;border-radius:15px}
.contactGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px}.email{font-weight:850;margin:17px 0;color:#344054}
.review{margin-top:18px;border:1px solid #d1e0ff;background:#f0f4ff;border-radius:22px;padding:28px}
.footer{background:#fbfcfd;border-top:1px solid var(--line);padding:48px 0 26px}.footerGrid{display:grid;grid-template-columns:1.3fr repeat(3,.7fr);gap:30px}.footerLogo{height:42px}.footer h4{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#98a2b3}.footer a{display:block;color:#475467;margin:8px 0;font-size:14px}.bottom{border-top:1px solid var(--line);margin-top:30px;padding-top:20px;font-size:13px;color:var(--muted)}
.article{max-width:860px;margin:auto;padding:72px 0}.article h1{font-size:50px}.article h2{font-size:28px;margin-top:40px}.article p,.article li{color:#475467}.callout{padding:20px;border-radius:17px;border:1px solid var(--line);background:var(--soft);margin:23px 0}.article ul{padding-left:23px}
@media(max-width:920px){.navlinks{display:none}.heroGrid,.dark,.split,.footerGrid{grid-template-columns:1fr}.grid3,.contactGrid{grid-template-columns:1fr}.grid4{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.container{width:min(100% - 24px,1180px)}.grid4{grid-template-columns:1fr}.hero{padding-top:48px}h1{font-size:45px}.dark{padding:27px}.brand img{height:38px}}