@import url("/brand/tokens.css");
:root{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--vpnnet-text);background:var(--vpnnet-surface);font-synthesis:none}*{box-sizing:border-box}body{margin:0}.demo{background:#30343B;color:#E9F5E2;padding:10px 5%;font-size:11px;font-weight:750;letter-spacing:.1em;display:flex;justify-content:space-between}.demo span{font-weight:400;letter-spacing:0}header{max-width:1240px;margin:auto;padding:32px 42px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;gap:4px;align-items:center;text-decoration:none;color:inherit;font-size:24px;font-weight:800;letter-spacing:-1px}.mark{display:inline-grid;place-items:center;background:#4CBB17;color:#30343B;border-radius:11px;width:37px;height:37px;margin-right:10px;transform:rotate(-7deg)}.muted{font-weight:400;color:#7d8a7b}.pill{font-size:10px;letter-spacing:.12em;border:1px solid #d9dfd3;border-radius:20px;padding:9px 13px}main{max-width:1160px;margin:30px auto 70px;display:grid;grid-template-columns:1fr 1fr;gap:70px;padding:0 32px}aside{padding-top:24px}.eyebrow{font-size:10px;letter-spacing:.17em;font-weight:800;color:#28710B;margin-bottom:20px}h1{font-size:46px;letter-spacing:-1.8px;line-height:1.12;margin:0 0 22px;font-weight:630}h1 em{font-style:normal;color:#28710B}p{font-size:14px;color:#66746a;line-height:1.7}.intro{max-width:385px;font-size:15px}.network{height:200px;position:relative;max-width:350px;margin:20px 0}.orbit{border:1px dashed #ccd8c2;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.orbit.one{width:180px;height:100px}.orbit.two{width:300px;height:170px;transform:translate(-50%,-50%) rotate(-20deg)}.hub{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:68px;height:68px;border-radius:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#fff;color:#30343B;font-size:29px;box-shadow:0 8px 30px #24413020}.hub span{font-size:9px;margin-top:3px;letter-spacing:.1em}.dot{position:absolute;width:13px;height:13px;background:#4CBB17;border:3px solid var(--vpnnet-surface);border-radius:50%;box-shadow:0 0 0 1px #b9c9a7}.dot.a{left:28px;top:103px}.dot.b{right:25px;top:65px}.dot.c{left:190px;bottom:23px}.node-label{position:absolute;bottom:0;left:105px;color:#92a089;font-size:8px;letter-spacing:.15em}.benefits{list-style:none;padding:0;display:grid;gap:14px;font-size:13px}.benefits li:before{content:'✓';color:#28710B;margin-right:12px}.fine{max-width:350px;font-size:10px;color:#626A61;line-height:1.6;margin-top:30px}.panel{background:#fff;border:1px solid #e2e7dc;border-radius:22px;padding:30px 34px 0;box-shadow:0 20px 70px #21402f06;align-self:start;min-height:575px}.steps{display:flex;gap:18px;margin-bottom:40px;padding-bottom:20px;border-bottom:1px solid #edf0e8;font-size:10px;color:#626A61}.steps .active{color:#2a573c;font-weight:750}.screen .eyebrow{margin-bottom:12px}h2{font-size:27px;letter-spacing:-.7px;font-weight:640;line-height:1.2;margin:0 0 14px}.screen p{margin-bottom:22px}.screen[hidden],button[hidden],div[hidden]{display:none}label{display:block;font-size:12px;font-weight:600;margin:18px 0 8px}input{width:100%;font:inherit;font-size:14px;border:1px solid #d9e0d2;border-radius:9px;padding:13px 14px;background:#fafbf8;color:#254031;outline:none}input:focus{border-color:#658657;box-shadow:0 0 0 3px #c4dca43d}button{font:inherit;cursor:pointer;border:0;border-radius:9px;background:#28710B;color:#fff;padding:14px 17px;margin-top:20px;width:100%;font-size:13px;font-weight:600;display:flex;align-items:center;justify-content:space-between}button:hover{background:#215E08}button:disabled{opacity:.55;cursor:wait}button.provider{justify-content:start;gap:14px;background:white;border:1px solid #dce3d5;color:#263d2e;margin-top:12px;padding:15px}.provider small{margin-left:auto;font-size:8px;color:#626A61}.provider b{font-size:18px;width:22px;color:#607458}.secondary{background:#E9F5E2;color:#28710B;justify-content:center}.secondary:hover{background:#d9e7c9}.caption{font-size:10px!important;line-height:1.6!important;color:#626A61!important;margin-top:12px!important}.privacy{background:#f6f8f2;border:1px solid #e9eee2;border-radius:9px;padding:13px 15px;font-size:11px;line-height:1.65;color:#626A61;margin:24px 0 10px}.identity-card{display:flex;align-items:center;gap:12px;border:1px solid #e4e9dc;padding:14px;border-radius:10px;margin:20px 0}.avatar{border-radius:50%;width:36px;height:36px;display:grid;place-items:center;background:#edf2e5;color:#638050;font-size:11px}.identity-card strong{font-size:13px}.identity-card div span{display:block;font-size:11px;color:#626A61;margin-top:5px}.slug-input{display:flex;align-items:center;border:1px solid #d9e0d2;border-radius:9px;background:#fafbf8}.slug-input input{border:0;width:55%;box-shadow:none;background:transparent}.slug-input span{font-size:13px;color:#626A61}.check{display:flex;align-items:center;gap:9px;color:#7d8977;font-size:10px;font-weight:400}.check input{width:auto}.progress-list{padding:0;list-style:none;counter-reset:progress;margin:28px 0}.progress-list li{font-size:12px;padding:12px 0;color:#9aa492;display:flex;align-items:center;gap:12px}.progress-list li:before{counter-increment:progress;content:counter(progress);display:grid;place-items:center;width:23px;height:23px;border:1px solid #dfe5d7;border-radius:50%;font-size:10px}.progress-list li.done{color:#28710B}.progress-list li.done:before{content:'✓';background:#E9F5E2;border-color:#d4e5bd}.progress-list li.current{color:#28710B;font-weight:650}.text-button{color:#8a9384;background:transparent;justify-content:center;font-size:10px;margin-top:8px}.text-button:hover{background:#f5f7f1}footer{margin-top:38px;border-top:1px solid #edf0e8;padding:18px 0;display:flex;justify-content:space-between;color:#626A61;font-size:9px}#notice:not(:empty){padding:12px 14px;background:#fff3df;color:#896129;font-size:12px;border-radius:9px;margin-bottom:20px}button:focus-visible{outline:3px solid #8aaf68;outline-offset:3px}@media(max-width:850px){main{grid-template-columns:1fr;gap:30px;max-width:560px;margin-top:0}aside{padding-top:5px}h1{font-size:37px}.network,.benefits,.fine{display:none}.intro{max-width:none}header{padding:23px 30px}.panel{padding:26px 25px 0}.demo{display:block;line-height:1.6}.demo span{display:block}.steps{gap:16px;margin-bottom:30px}}

.brand img{display:block;width:235px;height:auto}.brand{line-height:0}.hub{border:1px solid var(--vpnnet-border);box-shadow:0 8px 30px #30343b12}.demo{color:#E9F5E2}.intro,p{color:var(--vpnnet-muted)}@media(max-width:500px){header{padding:20px 24px}.brand img{width:190px}header .pill{font-size:8px;padding:7px}.demo span{font-size:10px}main{padding:0 20px}.panel{padding:24px 20px 0}h1{font-size:34px}.provider{font-size:12px}.caption{color:#626A61!important}}

#reset-preview{width:auto;background:transparent;color:var(--vpnnet-muted);font-size:10px;padding:8px;margin:0}header{gap:12px}@media(max-width:600px){header{flex-wrap:wrap}.pill{display:none}}
