/* Android VPN Guide — responsive styles */
:root{--bg:#071526;--bg2:#0a1b2e;--panel:#10243a;--panel2:#132b43;--text:#edf5ff;--muted:#a9bbd0;--line:#263f59;--accent:#54e0c1;--blue:#82aaff;--max:1160px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;background:radial-gradient(ellipse at 85% -5%,#173555 0,transparent 34%),var(--bg);color:var(--text);font:16px/1.7 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--accent);text-underline-offset:4px}a:hover{color:#a3ffeb}
img{max-width:100%;height:auto;display:block}
.container{width:min(var(--max),calc(100% - 40px));margin-inline:auto}
.skip-link{position:absolute;left:-9999px;top:8px;background:var(--accent);color:#04131d;padding:10px 14px;border-radius:8px;z-index:99}.skip-link:focus{left:10px}
.site-header{position:sticky;top:0;z-index:20;background:rgba(7,21,38,.9);backdrop-filter:blur(16px);border-bottom:1px solid #21374f}
.nav-wrap{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--text);line-height:1.1;flex-shrink:0}.brand img{object-fit:contain}.brand strong,.brand small{display:block;letter-spacing:1.5px}.brand strong{font-size:14px}.brand small{font-size:11px;color:var(--accent);font-weight:800;margin-top:5px}
.main-nav{display:flex;align-items:center;gap:clamp(12px,2vw,26px)}.main-nav a{font-size:13px;color:#c3d1e1;text-decoration:none;font-weight:650}.main-nav a:hover{color:var(--accent)}
.menu-toggle{display:none;background:#122941;color:var(--text);border:1px solid var(--line);border-radius:10px;padding:9px 12px;font:inherit;font-weight:700}
.hero{padding:72px 0 62px;overflow:hidden}.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:50px}.eyebrow,.kicker{font-size:11px;font-weight:850;letter-spacing:1.7px;color:var(--accent)}.eyebrow{display:inline-flex;align-items:center;gap:9px;padding:7px 12px;border:1px solid #28645e;border-radius:999px;background:#0b292e}.pulse{width:7px;height:7px;background:var(--accent);border-radius:50%;box-shadow:0 0 0 4px #54e0c11c}
h1,h2,h3,p{margin-top:0}h1{font-size:clamp(36px,5vw,61px);line-height:1.06;letter-spacing:-2px;margin:21px 0 20px;max-width:730px}h2{font-size:clamp(27px,3.5vw,39px);line-height:1.16;letter-spacing:-.9px;margin:10px 0 17px}h3{font-size:19px;line-height:1.35;letter-spacing:-.2px;margin-bottom:10px}.hero-lead{font-size:18px;line-height:1.75;color:#b8c8da;max-width:670px}.hero-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:27px 0 22px}
.button{min-height:49px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:12px 18px;border-radius:12px;text-decoration:none;font-size:14px;font-weight:850;transition:transform .18s ease,background .18s ease,border-color .18s ease}.button:hover{transform:translateY(-2px)}.button svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.button-primary{background:linear-gradient(120deg,#62edcb,#6bd9e8);color:#061723;box-shadow:0 8px 24px #54e0c126}.button-primary:hover{color:#061723;background:#8cf5df}.button-ghost{border:1px solid #39536f;color:var(--text);background:#102239}.button-ghost:hover{border-color:var(--accent);color:var(--text)}.trust-points{display:flex;gap:10px 17px;flex-wrap:wrap;color:#c1d0df;font-size:12px}.trust-points b{color:var(--accent);margin-right:5px}.micro-note{font-size:12px;line-height:1.6;color:#8299b1;margin:17px 0 0}.hero-art{position:relative;max-width:560px;margin-inline:auto}.hero-art>img{width:100%;filter:drop-shadow(0 25px 40px #0004)}.floating-card{position:absolute;bottom:9%;left:-5%;display:flex;align-items:center;gap:12px;padding:14px 16px;background:#11283e;border:1px solid #34516a;border-radius:15px;box-shadow:0 18px 35px #0004}.floating-card strong,.floating-card small{display:block}.floating-card strong{font-size:12px}.floating-card small{font-size:11px;color:var(--muted);margin-top:3px}.status-icon{width:30px;height:30px;display:grid;place-items:center;border-radius:10px;background:#164b45;color:var(--accent);font-weight:900}
.metrics-strip{border-block:1px solid #203750;background:#0a1b2c}.metrics-grid{display:grid;grid-template-columns:repeat(4,1fr);padding:22px 0;gap:20px}.metrics-grid>div{display:flex;align-items:center;gap:12px}.metrics-grid strong{font-size:20px;color:var(--accent);letter-spacing:-1px}.metrics-grid span{font-size:12px;color:#bdcbd9;font-weight:650}
.section{padding:84px 0}.section-heading{max-width:760px;margin-bottom:31px}.section-heading>p,.section-copy{color:var(--muted);font-size:16px}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.feature-card{padding:25px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(145deg,#10243a,#0c1c2e);min-height:220px;transition:transform .2s,border-color .2s}.feature-card:hover{transform:translateY(-3px);border-color:#42647f}.feature-card p{color:var(--muted);font-size:14px;margin-bottom:0}.feature-icon{width:43px;height:43px;display:grid;place-items:center;border-radius:13px;background:#153d45;color:var(--accent);font-size:23px;margin-bottom:17px}
.download-section{padding:78px 0;background:linear-gradient(115deg,#0c2536,#0c1b2d 65%);border-block:1px solid #23425b}.download-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center}.download-grid h2{max-width:600px}.download-grid>div>p{color:var(--muted)}code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.9em;color:#a6f8e5;background:#0b1827;border:1px solid #21394e;border-radius:5px;padding:2px 5px;overflow-wrap:anywhere}.download-meta{display:flex;gap:14px;flex-wrap:wrap;margin:22px 0}.download-meta span{padding:10px 12px;border:1px solid #29445e;border-radius:10px;color:#b8c8da;font-size:12px}.download-meta b{display:block;color:var(--text);font-size:11px;margin-bottom:3px}.button-download{min-height:55px;padding-inline:22px}.warning-note{max-width:600px;border-left:2px solid #e8bf6b;padding-left:12px}.download-panel{border:1px solid #2b4862;border-radius:22px;background:linear-gradient(150deg,#122b43,#0a192a);padding:30px}.download-panel>img{width:135px;height:135px;object-fit:contain;margin:0 auto 15px}.download-panel h3{text-align:center}.check-list,.cross-list{list-style:none;padding:0;margin:16px 0 0}.check-list li,.cross-list li{position:relative;padding:8px 0 8px 27px;color:var(--muted);font-size:14px;border-bottom:1px solid #21364b}.check-list li:before{content:"✓";position:absolute;left:0;color:var(--accent);font-weight:900}.cross-list li:before{content:"×";position:absolute;left:0;color:#ff9b9b;font-size:18px;font-weight:900}
.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.step-card{padding:24px;border:1px solid var(--line);border-radius:17px;background:#0e2034}.step-number{display:block;font-size:13px;font-weight:900;letter-spacing:1px;color:var(--accent);margin-bottom:20px}.step-card p{color:var(--muted);font-size:14px;margin-bottom:0}
.section-alt{background:#0a1b2c;border-block:1px solid #1c344b}.security-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:65px;align-items:center}.large-checks{list-style:none;padding:0;margin:25px 0 0;display:grid;gap:18px}.large-checks li{display:flex;gap:13px}.large-checks li>span{flex:0 0 30px;height:30px;display:grid;place-items:center;border-radius:9px;background:#17443f;color:var(--accent);font-weight:900}.large-checks strong{font-size:15px}.large-checks p{font-size:13px;color:var(--muted);margin:4px 0 0}.info-card{padding:28px;border:1px solid #67562f;border-radius:20px;background:linear-gradient(145deg,#2b281e,#171e28)}.info-card-symbol{width:40px;height:40px;display:grid;place-items:center;background:#514222;color:#ffdf8e;border-radius:12px;font-size:22px;font-weight:900;margin-bottom:17px}.info-card p{color:#c7c1b0;font-size:14px;margin-bottom:0}
.comparison{display:grid;grid-template-columns:1fr 1fr;gap:17px}.comparison-col{border:1px solid var(--line);background:#0e2034;border-radius:18px;padding:25px}.comparison-col h3{margin-bottom:10px}.faq-section{background:#081829;border-top:1px solid #203750}.faq-layout{display:grid;grid-template-columns:.7fr 1.3fr;gap:60px;align-items:start}.faq-layout>div:first-child{position:sticky;top:110px}.faq-list{display:grid;gap:10px}details{border:1px solid #263f58;border-radius:13px;background:#0e2034;padding:17px 19px}summary{cursor:pointer;font-weight:750;font-size:14px;list-style:none;display:flex;justify-content:space-between;gap:15px}summary::-webkit-details-marker{display:none}summary:after{content:"+";color:var(--accent);font-size:20px;line-height:1}details[open] summary:after{content:"−"}details p{margin:12px 0 0;color:var(--muted);font-size:14px}
.final-cta{padding:55px 0}.final-cta-inner{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:32px 36px;border:1px solid #2b605d;border-radius:22px;background:linear-gradient(115deg,#10363b,#10243b)}.final-cta h2{margin:8px 0}.final-cta p{margin:0;color:#b4c8d8}.site-footer{border-top:1px solid #203750;padding:32px 0 20px;background:#06111f}.footer-grid{display:grid;grid-template-columns:.6fr 1.3fr .7fr;gap:35px;align-items:start}.footer-grid>p{font-size:12px;color:#91a5bb;margin:0}.footer-grid nav{display:grid;gap:8px;justify-items:start}.footer-grid nav a{font-size:12px;color:#b5c5d6;text-decoration:none}.footer-grid nav a:hover{color:var(--accent)}.footer-brand strong{font-size:12px}.copyright{border-top:1px solid #1a2d42;margin-top:26px;padding-top:16px;color:#7289a1;font-size:11px}
@media(max-width:900px){.hero-grid{gap:24px}.main-nav{gap:12px}.main-nav a{font-size:12px}.feature-grid,.steps-grid{grid-template-columns:repeat(2,1fr)}.download-grid,.security-grid{gap:32px}.faq-layout{gap:30px}.footer-grid{grid-template-columns:1fr 1.5fr}.footer-grid nav{grid-column:1/-1;display:flex;gap:20px;flex-wrap:wrap}}
@media(max-width:700px){.container{width:min(var(--max),calc(100% - 30px))}.nav-wrap{min-height:68px;flex-wrap:wrap;gap:10px}.menu-toggle{display:inline-flex;align-items:center;gap:8px}.main-nav{display:none;width:100%;padding:0 0 15px;flex-direction:column;align-items:stretch;gap:0}.main-nav.open{display:flex}.main-nav a{padding:10px 2px;border-top:1px solid #1e344a;font-size:14px}.hero{padding:48px 0 40px}.hero-grid,.download-grid,.security-grid,.faq-layout{grid-template-columns:1fr}.hero-grid{gap:15px}h1{font-size:clamp(36px,10vw,50px);letter-spacing:-1.4px}.hero-lead{font-size:16px}.hero-art{max-width:460px}.floating-card{left:0;bottom:5%;padding:10px 12px}.floating-card strong{font-size:11px}.floating-card small{font-size:10px}.metrics-grid{grid-template-columns:repeat(2,1fr);gap:17px;padding:18px 0}.metrics-grid strong{font-size:18px}.metrics-grid span{font-size:11px}.section{padding:58px 0}.feature-grid,.steps-grid{grid-template-columns:1fr}.feature-card{min-height:0;padding:22px}.download-section{padding:58px 0}.download-panel{padding:23px}.security-grid{gap:25px}.faq-layout>div:first-child{position:static}.comparison{grid-template-columns:1fr}.final-cta-inner{align-items:flex-start;flex-direction:column;padding:25px 22px}.footer-grid{grid-template-columns:1fr;gap:20px}.footer-grid nav{grid-column:auto}.hero-actions .button{width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}
