:root{--bg:#fff9ef;--surface:#fffdf8;--surface-2:#f8eedf;--ink:#3e211b;--muted:#795f55;--line:#ead8c5;--accent:#23784e;--accent-strong:#185d3c;--accent-soft:#d9f0c4;--brown:#71381f;--hero-sky:#f8d6a3;--hero-glow:#ffd787;--shadow:0 22px 55px rgba(94,50,25,.13);--max:1180px;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg)}
html[data-theme=dark]{--bg:#211a17;--surface:#2b211c;--surface-2:#38271e;--ink:#fff5e9;--muted:#d4bba5;--line:#584236;--accent:#9bdd72;--accent-strong:#6fbd54;--accent-soft:#385632;--brown:#f0bd83;--hero-sky:#624330;--hero-glow:#d58a47;--shadow:0 22px 55px rgba(0,0,0,.32)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;line-height:1.5;overflow-x:hidden;background:var(--bg);color:var(--ink)}body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.16;background-image:radial-gradient(var(--brown) .6px,transparent .6px);background-size:22px 22px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.6),transparent 70%)}a{color:inherit;text-decoration:none}.container{width:min(var(--max),calc(100% - 64px));margin-inline:auto}.page-glow{position:fixed;z-index:-1;width:420px;height:420px;border-radius:50%;filter:blur(80px);opacity:.18;pointer-events:none}.page-glow-one{background:var(--hero-glow);top:2%;left:-220px}.page-glow-two{background:var(--accent);right:-260px;top:52%}
.site-header{position:sticky;z-index:10;top:0;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(16px)}.header-inner{min-height:78px;display:flex;align-items:center;gap:30px}.brand{display:flex;align-items:center;gap:9px;font-size:23px;font-weight:900;letter-spacing:-.05em;white-space:nowrap}.brand-cup{display:grid;place-items:center;width:35px;height:35px;border-radius:12px;background:var(--brown);color:var(--bg);font-size:19px;box-shadow:0 7px 16px rgba(113,56,31,.22)}.brand-accent{color:var(--accent)}.main-nav{display:flex;gap:28px;margin:auto;font-size:14px;font-weight:700;color:var(--muted)}.main-nav a,.site-footer a{transition:color .2s ease}.main-nav a:hover,.site-footer a:hover{color:var(--accent)}.header-actions{display:flex;align-items:center;gap:9px}.theme-toggle{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:10px 13px;display:inline-flex;align-items:center;gap:7px;font:700 13px inherit;cursor:pointer}.theme-icon{font-size:16px;line-height:1}.button{display:inline-flex;align-items:center;justify-content:center;gap:9px;border-radius:999px;padding:14px 22px;border:1px solid transparent;font:800 14px/1.1 inherit;cursor:pointer;transition:transform .2s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease}.button:hover{transform:translateY(-2px)}.button-primary{background:var(--accent);color:#fff;box-shadow:0 12px 24px color-mix(in srgb,var(--accent) 26%,transparent)}.button-primary:hover{background:var(--accent-strong)}.button-ghost{background:var(--surface);border-color:var(--line);color:var(--ink)}.button-ghost:hover{border-color:var(--accent);color:var(--accent)}.button-light{background:#fff7e9;color:#533021}.button-small{padding:12px 18px}.button-login{padding:11px 17px}
.hero{display:grid;grid-template-columns:.92fr 1.08fr;align-items:center;gap:42px;padding:72px 0 86px}.hero-copy{position:relative;z-index:2}.eyebrow,.section-kicker{display:inline-flex;align-items:center;gap:9px;color:var(--accent);font-size:12px;font-weight:900;letter-spacing:.09em}.eyebrow{border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line));border-radius:99px;padding:9px 14px;background:color-mix(in srgb,var(--surface) 75%,transparent)}.hero h1{margin:25px 0 22px;font-size:clamp(52px,6.2vw,84px);line-height:.98;letter-spacing:-.075em}.hero h1 span{color:var(--accent);display:inline-block}.hero-lead{max-width:520px;margin:0;color:var(--muted);font-size:19px;line-height:1.62}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}.trust-row{display:flex;flex-wrap:wrap;gap:18px;margin-top:34px;color:var(--muted);font-size:13px;font-weight:700}.trust-row span{display:inline-flex;align-items:center;gap:7px}.trust-row b{display:grid;place-items:center;width:25px;height:25px;border-radius:9px;background:var(--accent-soft);color:var(--accent);font-size:17px}
.hero-scene{position:relative;min-height:530px;border-radius:34px;overflow:hidden;background:linear-gradient(145deg,var(--hero-sky),var(--hero-glow) 47%,#b86d3c 150%);box-shadow:var(--shadow);isolation:isolate}.hero-scene:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(39,22,16,.04),rgba(255,255,255,.1)),linear-gradient(0deg,rgba(39,22,16,.35),transparent 53%);z-index:1}.scene-sun{position:absolute;width:130px;height:130px;top:80px;left:18%;border-radius:50%;background:#fff0b5;box-shadow:0 0 65px #ffe5a0;opacity:.86}.scene-window{position:absolute;top:0;right:0;width:54%;height:64%;background:linear-gradient(180deg,#7ac1d1,#f5c486 82%);border-left:10px solid rgba(100,50,28,.64);border-bottom:10px solid rgba(100,50,28,.64)}.scene-window:before,.scene-window:after{content:"";position:absolute;background:rgba(100,50,28,.58)}.scene-window:before{width:8px;height:100%;left:48%}.scene-window:after{height:8px;width:100%;top:52%}.scene-window span{position:absolute;bottom:13%;width:38px;height:70px;background:#754934;box-shadow:22px 17px 0 #935236,50px 4px 0 #69402d;opacity:.56}.scene-window span:nth-child(1){left:16%}.scene-window span:nth-child(2){left:50%;height:50px}.scene-window span:nth-child(3){left:76%;height:95px}.scene-shelf{position:absolute;right:4%;top:17%;z-index:3;width:23%;height:45%;border-left:11px solid #6c3c28;background:repeating-linear-gradient(to bottom,transparent 0 70px,rgba(99,51,30,.75) 70px 79px)}.scene-shelf i{display:block;width:27px;height:40px;border-radius:8px 8px 4px 4px;background:#f3c084;margin:20px auto 14px;box-shadow:37px 14px 0 #b86a44,-35px 8px 0 #86a65d}.scene-lamp{position:absolute;z-index:4;top:0;width:56px;height:120px;border-left:3px solid #69412e}.scene-lamp:after{content:"";position:absolute;top:104px;left:-28px;width:56px;height:27px;border-radius:4px 4px 24px 24px;background:#ef9d44;box-shadow:0 0 26px #ffbf65}.lamp-one{left:17%;height:140px}.lamp-two{left:68%;height:95px}.scene-barista{position:absolute;z-index:4;right:16%;bottom:17%;width:180px;height:275px}.scene-barista .hair{position:absolute;top:0;left:19px;width:137px;height:145px;border-radius:53% 48% 42% 47%;background:#5c2e23;transform:rotate(-8deg);box-shadow:30px 44px 0 -19px #45251e}.scene-barista .face{position:absolute;z-index:2;top:39px;left:47px;width:84px;height:108px;border-radius:45% 45% 48% 48%;background:#f8c596;transform:rotate(-3deg)}.scene-barista .face i{position:absolute;top:43px;width:8px;height:11px;border-radius:50%;background:#6b3325}.scene-barista .face i:first-child{left:22px}.scene-barista .face i:nth-child(2){right:20px}.scene-barista .face b{position:absolute;bottom:21px;left:34px;width:18px;height:9px;border-bottom:3px solid #a64d45;border-radius:50%}.scene-barista .apron{position:absolute;bottom:0;left:22px;width:136px;height:144px;border-radius:44px 44px 0 0;background:#6e3e2c;border-top:18px solid #f3b983;box-shadow:inset 0 0 0 7px rgba(255,255,255,.12)}.scene-counter{position:absolute;z-index:5;left:0;right:0;bottom:0;height:118px;background:linear-gradient(180deg,#6a3b28,#422419);box-shadow:0 -8px 0 rgba(255,223,160,.25)}.scene-cat{position:absolute;z-index:7;bottom:25px;left:4%;width:47%;height:auto;object-fit:contain;filter:drop-shadow(0 14px 10px rgba(25,12,9,.22))}.scene-laptop{position:absolute;z-index:8;bottom:61px;left:38%;width:190px;height:118px;border-radius:12px 12px 6px 6px;background:#332b2c;border:5px solid #171719;box-shadow:0 18px 0 -4px #211b1b;transform:skewY(-4deg)}.scene-laptop:after{content:"";position:absolute;left:-22px;right:-22px;bottom:-19px;height:16px;border-radius:50%;background:#171516}.scene-laptop span{display:grid;place-items:center;height:100%;font-weight:900;color:var(--accent);font-size:26px}.scene-laptop i{position:absolute;right:9px;bottom:7px;width:8px;height:8px;border-radius:50%;background:#80ce6b}.scene-cup{position:absolute;z-index:9;bottom:78px;right:12%;width:62px;height:55px;border-radius:8px 8px 22px 22px;background:#fff5e8;border:3px solid #b97852;box-shadow:0 11px 0 -5px #fff5e8}.scene-cup:after{content:"";position:absolute;right:-19px;top:13px;width:22px;height:24px;border:5px solid #b97852;border-left:0;border-radius:0 20px 20px 0}.scene-cup span{display:grid;place-items:center;height:100%;color:#6c3d29}.scene-note{position:absolute;z-index:6;right:4%;bottom:157px;width:125px;padding:13px 10px;background:#354833;color:#fff2d3;text-align:center;font:16px/1.25 Georgia,serif;transform:rotate(4deg);box-shadow:0 9px 0 rgba(43,23,16,.16)}.scene-note strong{color:#b5e288;font-weight:600}.scene-sticker{position:absolute;z-index:9;color:#fff8db;font-size:28px}.sticker-one{top:33%;left:7%}.sticker-two{top:43%;right:29%}
.plans-section{padding:82px 0 96px;background:var(--surface-2)}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:28px}.section-heading h2,.how-section h2,.faq-section h2{margin:10px 0 7px;font-size:clamp(32px,4vw,49px);line-height:1.02;letter-spacing:-.06em}.section-heading p,.faq-section p{margin:0;color:var(--muted)}.text-link,.plan-link{color:var(--accent);font-weight:900;font-size:14px}.plans-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px}.plan-card{min-height:256px;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:24px;background:var(--surface);padding:25px;box-shadow:0 8px 0 color-mix(in srgb,var(--brown) 7%,transparent)}.plan-card-featured{border:2px solid var(--accent);background:linear-gradient(150deg,var(--surface),color-mix(in srgb,var(--accent-soft) 28%,var(--surface)))}.plan-top{display:flex;align-items:center;justify-content:space-between}.plan-icon{display:grid;place-items:center;width:43px;height:43px;border-radius:14px;background:var(--accent-soft);color:var(--accent);font-size:22px}.plan-badge{font-size:12px;font-weight:900;color:var(--accent)}.plan-card h3{margin:24px 0 8px;font-size:22px;letter-spacing:-.04em}.plan-card p{margin:0;color:var(--muted);font-size:14px;line-height:1.55}.plan-link{margin-top:auto;padding-top:23px}.plan-link span{margin-left:6px;font-size:18px}
.how-section{padding:90px 0}.section-heading.compact{display:block}.steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:36px}.step-card{position:relative;border:1px solid var(--line);border-radius:21px;background:var(--surface);padding:17px;min-height:260px}.step-number{position:absolute;top:14px;left:14px;display:grid;place-items:center;width:31px;height:31px;border-radius:50%;background:var(--brown);color:var(--bg);font-weight:900}.step-illustration{display:grid;place-items:center;height:120px;margin:-1px -1px 20px;border-radius:16px;background:linear-gradient(135deg,var(--accent-soft),var(--surface-2));color:var(--accent);font-size:50px;font-weight:900}.step-telegram{background:linear-gradient(135deg,#c4e8ed,#eaf5dc);color:#2789a0}.step-install{background:linear-gradient(135deg,#f7d7a7,#f2edc7);color:#bd733b}.step-connect{background:linear-gradient(135deg,#d3efbb,#f5e7bc);color:var(--accent)}.step-enjoy{background:linear-gradient(135deg,#f4c6a8,#f7e0b7);color:#9a5839}.step-card h3{margin:0 0 6px;font-size:16px}.step-card p{margin:0;color:var(--muted);font-size:13px;line-height:1.5}
.world-section{padding:0 0 96px}.world-card{display:grid;grid-template-columns:.9fr 1.1fr;min-height:378px;border-radius:30px;overflow:hidden;background:linear-gradient(120deg,#215b43,#193b33);color:#fff6e9;box-shadow:var(--shadow)}.world-copy{padding:47px 48px}.world-copy .section-kicker{color:#b6e57c}.world-copy h2{margin:12px 0 13px;font-size:clamp(34px,4vw,54px);line-height:.98;letter-spacing:-.06em}.world-copy h2 span{color:#b6e57c}.world-copy p{max-width:390px;margin:0 0 25px;color:#d4e4d1}.platforms{display:flex;flex-wrap:wrap;gap:8px;margin-top:29px}.platforms span{padding:7px 10px;border:1px solid rgba(255,255,255,.2);border-radius:999px;color:#e5efdf;font-size:11px}.world-map{position:relative;overflow:hidden;background:radial-gradient(circle at 62% 36%,rgba(214,234,160,.5),transparent 3%),linear-gradient(145deg,#b7daae,#e9d394);isolation:isolate}.world-map:before{content:"";position:absolute;inset:0;opacity:.45;background:radial-gradient(ellipse at 24% 35%,#77b27f 0 12%,transparent 12.4%),radial-gradient(ellipse at 53% 29%,#79b87b 0 14%,transparent 14.4%),radial-gradient(ellipse at 69% 57%,#6aa879 0 12%,transparent 12.4%),radial-gradient(ellipse at 39% 70%,#8ec08b 0 10%,transparent 10.4%);transform:rotate(-8deg) scale(1.1)}.map-land{position:absolute;background:#73af79;opacity:.6;border-radius:47% 53% 62% 38%}.land-one{width:170px;height:92px;left:14%;top:22%;transform:rotate(-23deg)}.land-two{width:140px;height:180px;left:47%;top:23%;transform:rotate(16deg)}.land-three{width:205px;height:80px;right:6%;bottom:22%;transform:rotate(-12deg)}.map-line{position:absolute;z-index:2;border-top:3px dashed rgba(117,91,43,.6);width:240px;border-radius:50%}.line-one{left:13%;top:38%;transform:rotate(14deg)}.line-two{left:39%;top:62%;transform:rotate(-15deg)}.map-pin{position:absolute;z-index:3;display:grid;place-items:center;width:38px;height:38px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:#fff4dc;color:#67402b;box-shadow:0 8px 14px rgba(50,47,20,.16);font-size:17px}.pin-one{left:23%;top:26%}.pin-two{left:53%;top:52%}.pin-three{right:16%;top:25%}
.faq-section{padding:0 0 85px}.faq-inner{display:flex;justify-content:space-between;align-items:center;gap:25px;border-top:1px solid var(--line);padding-top:60px}.faq-inner h2{margin-bottom:10px}.site-footer{border-top:1px solid var(--line);padding:26px 0;color:var(--muted);font-size:13px}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:22px}.footer-inner .brand{font-size:18px}.footer-inner .brand-cup{width:29px;height:29px;font-size:15px}.footer-inner nav{display:flex;gap:20px}
@media (max-width:1000px){.main-nav{gap:16px}.header-actions .button-login{display:none}.hero{grid-template-columns:1fr;padding-top:55px}.hero-copy{max-width:700px}.hero-scene{min-height:500px}.steps-grid{grid-template-columns:repeat(2,1fr)}.world-card{grid-template-columns:1fr}.world-map{min-height:300px}}
@media (max-width:700px){.container{width:calc(100% - 32px)}.site-header{position:relative}.header-inner{min-height:70px;gap:10px}.main-nav{display:none}.header-actions{margin-left:auto}.theme-label{display:none}.theme-toggle{padding:10px 12px}.button-small{padding:11px 14px}.brand{font-size:20px}.hero{padding:44px 0 63px;gap:30px}.hero h1{font-size:clamp(48px,14vw,70px)}.hero-lead{font-size:17px}.hero-actions{flex-direction:column;align-items:stretch}.hero-scene{min-height:395px;border-radius:24px}.scene-barista{right:8%;transform:scale(.72);transform-origin:bottom right}.scene-laptop{left:29%;transform:scale(.73) skewY(-4deg);transform-origin:bottom left}.scene-cat{left:-7%;width:54%}.scene-note{right:3%;bottom:140px;transform:scale(.8) rotate(4deg);transform-origin:right bottom}.scene-window{width:63%;height:56%}.scene-shelf{width:27%}.plans-section,.how-section{padding:64px 0 70px}.section-heading{display:block}.section-heading .text-link{display:inline-block;margin-top:20px}.plans-grid{grid-template-columns:1fr;margin-top:26px}.plan-card{min-height:220px}.steps-grid{grid-template-columns:1fr 1fr;gap:12px}.step-card{min-height:244px;padding:13px}.step-illustration{height:100px;margin-bottom:16px}.world-copy{padding:35px 27px}.world-map{min-height:240px}.faq-inner{align-items:flex-start;flex-direction:column;padding-top:45px}.footer-inner{align-items:flex-start;flex-direction:column}.footer-inner nav{flex-wrap:wrap;gap:13px}.trust-row{gap:12px}}
@media (max-width:420px){.container{width:calc(100% - 24px)}.brand-cup{width:31px;height:31px}.hero-scene{min-height:335px}.scene-cat{width:57%;left:-13%;bottom:13px}.scene-laptop{left:25%;bottom:46px}.scene-cup{right:8%;bottom:63px;transform:scale(.8)}.scene-note{bottom:117px;transform:scale(.66) rotate(4deg)}.scene-lamp{transform:scale(.8);transform-origin:top}.steps-grid{grid-template-columns:1fr}.step-card{min-height:205px}.step-illustration{height:84px}.platforms span{font-size:10px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button,.main-nav a,.site-footer a{transition:none}}

/* Hero art uses one compressed VPNCoffee illustration; no character placeholder. */
.hero h1{font-size:clamp(52px,5.2vw,70px)}
.hero-scene{position:relative;display:flex;align-items:center;justify-content:center;padding:0;background:#fff2dc}
.hero-scene:before{z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(255,242,220,.16),transparent 45%)}
.hero-scene>img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center;border-radius:inherit}
html[data-theme=dark] .hero-scene{background:#33251d}
html[data-theme=dark] .hero-scene>img{filter:brightness(.72) saturate(.85)}
@media(max-width:700px){.hero-scene>img{object-position:center}}