@charset "UTF-8";
/* Nivelva — VPN Remote (WireGuard). prefix: wg. Ink panels + brand orange + WireGuard red accent */
:root{--wg-ink:#1B1712;--wg-ink2:#26201A;--wg-line:rgba(255,255,255,.10);--wg-dim:rgba(255,255,255,.62);--wg-red:#C8102E;--wg-ok:#22C55E}
.wgHero,.wgWhy,.wgPlans,.wgUses,.wgSetup,.wgFaq,.wgCta{overflow:hidden}
.wgKick{display:inline-block;font:700 11.5px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.wgHead{max-width:740px;margin:0 auto 40px;text-align:center}
.wgH2{font:600 clamp(30px,3.8vw,48px)/1.06 var(--serif);letter-spacing:-.02em;margin:12px 0 0;text-wrap:balance}
.wgH2 em{font-style:italic;color:var(--accent);font-weight:500}
.wgLead{font-size:17px;line-height:1.6;color:var(--ink-2);margin:14px 0 0;text-wrap:pretty}
.wgBtn{background:var(--accent);color:#fff;border-color:var(--accent)}
.wgBtn:hover{color:#fff}
code{font-family:var(--mono);font-size:.92em}

/* hero */
.wgHero{padding:56px 0 76px;background:linear-gradient(180deg,var(--bg),var(--bg-2))}
.wgHero__grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:52px;align-items:center}
.wgHero h1{font:600 clamp(38px,5vw,66px)/1.02 var(--serif);letter-spacing:-.025em;margin:16px 0 0;text-wrap:balance}
.wgHero h1 em{font-style:italic;color:var(--accent);font-weight:500}
.wgHero__sub{font-size:18px;line-height:1.6;color:var(--ink-2);margin:18px 0 26px;max-width:34em}
.wgHero__sub b{color:var(--ink)}
.wgHero__sub code{background:var(--bg-2);border:1px solid color-mix(in oklab,var(--line) 14%,transparent);border-radius:5px;padding:1px 5px}
.wgHero__cta{display:flex;gap:12px;flex-wrap:wrap}
.wgHero__pts{list-style:none;padding:0;margin:24px 0 0;display:flex;gap:10px 22px;flex-wrap:wrap}
.wgHero__pts li{display:inline-flex;align-items:center;gap:7px;font:600 14px/1.3 var(--sans);color:var(--ink-2)}
.wgHero__pts svg{color:var(--wg-ok)}

.wgDev{background:var(--wg-ink);color:#fff;border-radius:22px;padding:22px;box-shadow:0 28px 60px rgba(0,0,0,.25)}
.wgDev__top{display:flex;align-items:center;justify-content:space-between}
.wgDev__name{font:700 15px/1 var(--mono)}
.wgSw{width:50px;height:28px;border-radius:999px;border:none;cursor:pointer;background:rgba(255,255,255,.18);position:relative;transition:background .2s}
.wgSw i{position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;transition:transform .2s}
.wgSw.is-on{background:var(--wg-ok)}
.wgSw.is-on i{transform:translateX(22px)}
.wgDev__state{margin-top:8px;font:500 12.5px/1.3 var(--mono);color:var(--wg-dim)}
.wgDev__state.is-on{color:#86EFAC}
.wgConf{margin:16px 0 0;padding:16px 18px;background:rgba(0,0,0,.32);border:1px solid var(--wg-line);border-radius:14px;font:500 13px/1.65 var(--mono);color:rgba(255,255,255,.86);white-space:pre;overflow-x:auto}
.wgUse{margin-top:14px;padding:14px 16px;background:rgba(255,255,255,.05);border:1px solid var(--wg-line);border-radius:14px}
.wgUse__row{display:flex;justify-content:space-between;gap:10px;font-size:13px;color:var(--wg-dim)}
.wgUse__row b{font:700 13.5px/1.2 var(--mono);color:#fff}
.wgUse__bar{height:7px;border-radius:7px;background:rgba(255,255,255,.12);margin:10px 0 8px;overflow:hidden}
.wgUse__bar i{display:block;height:100%;border-radius:7px;background:linear-gradient(90deg,var(--accent),var(--accent-2))}
.wgUse__io{display:flex;gap:18px;font:500 12px/1 var(--mono);color:var(--wg-dim)}

/* why */
.wgWhy{padding:80px 0}
.wgWhy__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px;max-width:980px;margin:0 auto}
.wgWhy__item{display:flex;gap:16px;padding:22px 0;border-top:1.5px solid color-mix(in oklab,var(--line) 12%,transparent)}
.wgWhy__ic{flex-shrink:0;width:46px;height:46px;border-radius:13px;display:grid;place-items:center;background:color-mix(in oklab,var(--accent) 12%,transparent);color:var(--accent)}
.wgWhy__item b{display:block;font:700 17px/1.3 var(--sans)}
.wgWhy__item p{margin:6px 0 0;font-size:14.5px;line-height:1.55;color:var(--ink-2)}

/* plans */
.wgPlans{padding:84px 0;background:var(--wg-ink);color:#fff}
.wgPlans .wgH2{color:#fff}
.wgPlans .wgLead{color:var(--wg-dim)}
.wgPlans .wgKick{color:var(--accent-2)}
.wgEst{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.6fr);gap:24px;align-items:center;max-width:980px;margin:0 auto 28px;padding:22px 24px;background:rgba(255,255,255,.05);border:1px solid var(--wg-line);border-radius:18px}
.wgEst__lbl{display:block;font:600 14px/1.3 var(--sans);color:#fff;margin-bottom:10px}
.wgEst__lbl b{color:var(--accent-2);font-family:var(--mono)}
.wgEst__chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.wgChip{padding:8px 14px;border-radius:999px;cursor:pointer;background:transparent;border:1.5px solid rgba(255,255,255,.2);color:rgba(255,255,255,.85);font:600 13.5px/1 var(--sans);transition:background .15s,border-color .15s}
.wgChip:hover{border-color:rgba(255,255,255,.45)}
.wgChip.is-on{background:#fff;border-color:#fff;color:var(--ink)}
.wgRange{width:100%;accent-color:var(--accent)}
.wgEst__r{text-align:center;padding:18px 14px;border-radius:14px;background:rgba(0,0,0,.25)}
.wgEst__r span{font:500 11px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--wg-dim)}
.wgEst__r b{display:block;font:700 34px/1.1 var(--serif);margin:8px 0 6px}
.wgEst__r b small{font:500 13px/1 var(--sans);color:var(--wg-dim);margin-left:4px}
.wgEst__r em{font-style:normal;font:600 13.5px/1.3 var(--sans);color:var(--accent-2)}
.wgPlans__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;max-width:980px;margin:0 auto}
.wgPlan{position:relative;display:flex;flex-direction:column;background:var(--wg-ink2);border:1.5px solid var(--wg-line);border-radius:20px;padding:26px 24px;transition:border-color .2s,transform .2s}
.wgPlan.is-hot{background:#fff;color:var(--ink);border-color:#fff}
.wgPlan.is-rec{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in oklab,var(--accent) 30%,transparent);transform:translateY(-4px)}
.wgPlan__flag{position:absolute;top:18px;right:18px;font:700 11px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;background:var(--accent);color:#fff;padding:5px 9px;border-radius:6px}
.wgPlan__name{font:700 13px/1 var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--accent-2)}
.wgPlan.is-hot .wgPlan__name{color:var(--accent)}
.wgPlan__quota{font:700 36px/1.1 var(--serif);letter-spacing:-.02em;margin-top:12px}
.wgPlan__quota small{font:500 14px/1 var(--sans);margin-left:6px;opacity:.6}
.wgPlan__fit{margin:6px 0 0;font-size:14px;line-height:1.45;color:var(--wg-dim)}
.wgPlan.is-hot .wgPlan__fit{color:var(--ink-3)}
.wgPlan__feats{list-style:none;padding:18px 0 0;margin:18px 0 0;border-top:1px solid var(--wg-line);display:grid;gap:10px;flex:1}
.wgPlan.is-hot .wgPlan__feats{border-color:color-mix(in oklab,var(--line) 12%,transparent)}
.wgPlan__feats li{display:flex;gap:9px;align-items:flex-start;font-size:14px;line-height:1.4}
.wgPlan__feats svg{flex-shrink:0;margin-top:2px;color:var(--wg-ok)}
.wgPlan__price{font:700 26px/1 var(--serif);margin-top:22px}
.wgPlan__price small{font:500 13px/1 var(--sans);opacity:.6;margin-left:4px}
.wgPlan__btn{display:block;margin-top:16px;text-align:center;padding:13px;border-radius:12px;font:700 15px/1 var(--sans);text-decoration:none;background:rgba(255,255,255,.1);color:#fff;transition:background .15s}
.wgPlan__btn:hover{background:rgba(255,255,255,.18);color:#fff}
.wgPlan.is-hot .wgPlan__btn,.wgPlan.is-rec .wgPlan__btn{background:var(--accent);color:#fff}
.wgPlans__note{text-align:center;margin:22px auto 0;font-size:13.5px;color:var(--wg-dim);max-width:640px}

/* uses — scenario switcher + route diagram */
.wgUses{padding:84px 0}
.wgUses__head{text-align:center;margin-bottom:40px}
.wgUses__grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:44px;align-items:center}
.wgUses__tabs{display:flex;flex-direction:column}
.wgUses__tab{position:relative;text-align:left;cursor:pointer;background:none;border:none;padding:18px 0 18px 22px;border-left:3px solid color-mix(in oklab,var(--line) 12%,transparent);transition:border-color .2s}
.wgUses__tab b{display:block;font:600 22px/1.25 var(--serif);letter-spacing:-.01em;color:var(--ink-3);transition:color .2s}
.wgUses__tab p{margin:0;max-height:0;overflow:hidden;opacity:0;font-size:14.5px;line-height:1.55;color:var(--ink-2);transition:max-height .35s ease,opacity .25s ease,margin .25s ease}
.wgUses__tab:hover b{color:var(--ink)}
.wgUses__tab.is-on{border-left-color:var(--accent)}
.wgUses__tab.is-on b{color:var(--ink);font-size:24px}
.wgUses__tab.is-on p{max-height:120px;opacity:1;margin-top:8px}
.wgUses__prog{position:absolute;left:-3px;top:0;width:3px;height:0;background:var(--ink);animation:wgProg 5.2s linear forwards}
@keyframes wgProg{to{height:100%}}

.wgRoute{background:var(--wg-ink);color:#fff;border-radius:24px;padding:38px 30px 28px;box-shadow:0 28px 60px rgba(0,0,0,.22);animation:wgFade .45s ease both}
@keyframes wgFade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.wgRoute__lane{display:grid;grid-template-columns:auto minmax(0,1fr) auto minmax(0,1fr) auto;align-items:start}
.wgRoute__node{display:flex;flex-direction:column;align-items:center;gap:10px;width:104px;text-align:center}
.wgRoute__node b{font:600 13px/1.3 var(--sans);color:rgba(255,255,255,.88)}
.wgRoute__ic{width:64px;height:64px;border-radius:18px;display:grid;place-items:center;background:rgba(255,255,255,.07);border:1px solid var(--wg-line);color:#fff}
.wgRoute__node--hub .wgRoute__ic{background:#fff;border-color:#fff;box-shadow:0 0 0 6px color-mix(in oklab,var(--accent) 28%,transparent)}
.wgRoute__node--hub .wgRoute__ic img{width:38px;height:auto;display:block}
.wgRoute__node--hub b{color:var(--accent-2);font-family:var(--mono);font-size:12px}
.wgRoute__pipe{position:relative;height:16px;margin-top:24px;border-radius:16px;background:color-mix(in oklab,var(--accent) 30%,transparent);border:1.5px solid var(--accent);overflow:visible}
.wgRoute__pipe--out{height:2px;margin-top:31px;background:none;border:none;border-top:2px dashed rgba(255,255,255,.35);border-radius:0}
.wgRoute__lock{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:#fff;z-index:2}
.wgRoute__pkt{position:absolute;top:50%;left:0;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:#fff;box-shadow:0 0 8px #fff;animation:wgRun 1.8s linear infinite}
.wgRoute__pkt.p2{animation-delay:.9s}
.wgRoute__pipe--out .wgRoute__pkt{top:-1px;background:rgba(255,255,255,.75);box-shadow:none;width:6px;height:6px;margin-top:-3px}
@keyframes wgRun{0%{left:0;opacity:0}12%{opacity:1}88%{opacity:1}100%{left:calc(100% - 8px);opacity:0}}
.wgRoute__legend{display:flex;justify-content:center;gap:22px;flex-wrap:wrap;margin-top:28px;font:500 12px/1 var(--mono);color:var(--wg-dim)}
.wgRoute__legend span{display:inline-flex;align-items:center;gap:8px}
.wgRoute__legend i{width:22px;height:0;border-top:2px dashed rgba(255,255,255,.4)}
.wgRoute__legend i.is-enc{height:8px;border:1.5px solid var(--accent);border-radius:8px;background:color-mix(in oklab,var(--accent) 30%,transparent)}
.wgRoute__note{margin:20px 0 0;padding-top:18px;border-top:1px solid var(--wg-line);text-align:center;font:500 16px/1.5 var(--sans);color:#fff;text-wrap:balance}
@media (prefers-reduced-motion:reduce){.wgRoute__pkt,.wgUses__prog{animation:none}.wgRoute__pkt{display:none}}
@media (max-width:980px){.wgUses__grid{grid-template-columns:minmax(0,1fr);gap:28px}}
@media (max-width:620px){
  .wgRoute{padding:26px 16px 22px}
  .wgRoute__node{width:72px}
  .wgRoute__ic{width:50px;height:50px;border-radius:14px}
  .wgRoute__ic svg{width:21px;height:21px}
  .wgRoute__node--hub .wgRoute__ic img{width:30px}
  .wgRoute__pipe{margin-top:17px}
  .wgRoute__pipe--out{margin-top:24px}
  .wgRoute__node b,.wgRoute__node--hub b{font-size:11px}
  .wgUses__tab b{font-size:19px}
  .wgUses__tab.is-on b{font-size:20px}
}

/* setup */
.wgSetup{padding:80px 0;background:var(--bg-2)}
.wgFlow{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.wgFlow::before{content:"";position:absolute;top:27px;left:12%;right:12%;border-top:2px dashed color-mix(in oklab,var(--accent) 40%,transparent)}
.wgFlow__s{position:relative;text-align:center;padding:0 6px}
.wgFlow__ic{position:relative;z-index:1;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;margin:0 auto 14px;background:var(--bg);border:2px solid var(--accent);color:var(--accent)}
.wgFlow__s b{display:block;font:700 16px/1.3 var(--sans)}
.wgFlow__s p{margin:6px 0 0;font-size:14px;line-height:1.5;color:var(--ink-2)}
.wgOs{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;margin-top:40px}
.wgOs>span:first-child{font:600 13px/1 var(--mono);color:var(--ink-3);margin-right:4px}
.wgOs__i{padding:8px 14px;border-radius:999px;background:var(--bg);border:1.5px solid color-mix(in oklab,var(--line) 14%,transparent);font:600 13.5px/1 var(--sans)}

/* faq */
.wgFaq{padding:80px 0}
.wgFaq__grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.25fr);gap:32px;align-items:start}
.wgFaq__tabs{display:flex;flex-direction:column;gap:8px}
.wgFaq__tab{text-align:left;cursor:pointer;padding:14px 16px;border-radius:12px;background:var(--bg);border:1.5px solid color-mix(in oklab,var(--line) 14%,transparent);font:600 15px/1.4 var(--sans);color:var(--ink);transition:background .15s,border-color .15s}
.wgFaq__tab:hover{border-color:color-mix(in oklab,var(--accent) 45%,transparent)}
.wgFaq__tab.is-on{background:var(--wg-ink);border-color:var(--wg-ink);color:#fff}
.wgFaq__panel{position:sticky;top:24px;padding:30px;border-radius:18px;background:var(--bg-2);border:1.5px solid color-mix(in oklab,var(--line) 14%,transparent)}
.wgFaq__panel h3{font:700 22px/1.3 var(--serif);margin:0 0 12px}
.wgFaq__panel p{margin:0;font-size:16px;line-height:1.7;color:var(--ink-2)}

/* cta */
.wgCta{padding:0 0 84px}
.wgCta__box{text-align:center;color:#fff;border-radius:26px;padding:60px 40px;background:radial-gradient(600px 300px at 85% 0%,color-mix(in oklab,var(--accent) 35%,transparent),transparent 65%),var(--wg-ink)}
.wgCta__box h2{font:600 clamp(30px,4vw,48px)/1.08 var(--serif);margin:0;letter-spacing:-.02em}
.wgCta__box h2 em{font-style:italic;color:var(--accent);font-weight:500}
.wgCta__box p{margin:14px auto 26px;max-width:44ch;font-size:17px;line-height:1.6;color:var(--wg-dim)}
.wgCta__btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.wgBtn--wire{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.4);box-shadow:none}
.wgBtn--wire:hover{color:#fff;background:rgba(255,255,255,.08)}

@media (max-width:980px){
  .wgHero__grid,.wgFaq__grid{grid-template-columns:minmax(0,1fr);gap:32px}
  .wgDev{max-width:520px}
  .wgEst{grid-template-columns:minmax(0,1fr)}
  .wgPlans__grid{grid-template-columns:minmax(0,1fr);max-width:480px}
  .wgFlow{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:32px}
  .wgFlow::before{display:none}
  .wgFaq__tabs{flex-direction:row;overflow-x:auto;padding-bottom:6px;scrollbar-width:none}
  .wgFaq__tab{flex-shrink:0;white-space:nowrap;border-radius:999px;padding:10px 16px}
  .wgFaq__panel{position:static}
}
@media (max-width:620px){
  .wgWhy__list{grid-template-columns:1fr}
  .wgHero__cta .btn,.wgCta__btns .btn{flex:1 1 100%;justify-content:center}
  .wgFlow{grid-template-columns:1fr}
  .wgCta__box{padding:44px 22px}
  .wgConf{font-size:12px}
  .wgHero,.wgWhy,.wgPlans,.wgUses,.wgSetup,.wgFaq{padding-top:56px;padding-bottom:56px}
}

/* prerendered fallback (replaced by React) */
.wgSeo{max-width:880px;margin:0 auto;padding:48px 20px;font-family:var(--sans);color:var(--ink);line-height:1.6}
.wgSeo h1{font:600 clamp(30px,5vw,48px)/1.1 var(--serif)}
.wgSeo h2{font:600 26px/1.2 var(--serif);margin-top:36px}
.wgSeo a{color:var(--accent)}
.wgHero__kick{display:block;margin-bottom:16px;font-style:normal}
.wgHero h1{margin-top:0}
@media (max-width:380px){.wgHero h1{font-size:32px}.wgEst{padding:18px 16px}.wgRoute__node{width:62px}.wgRoute__ic{width:44px;height:44px}.wgDev{padding:16px}.wgConf{font-size:11px;padding:12px}.wgPlan{padding:22px 18px}}
@media (max-width:620px){.wgWhy__list{grid-template-columns:minmax(0,1fr)}.wgFlow{grid-template-columns:minmax(0,1fr)}}

@media (max-width:720px){.wgChip{min-height:40px}}
/* uses mobile v2 */
@media (max-width:720px){
.wgUses__tabs{background:#fff;border-radius:18px;padding:4px 0;box-shadow:0 0 0 1px rgba(40,40,40,.08),0 16px 32px -26px rgba(60,40,20,.4);overflow:hidden}
.wgUses__tab{padding:15px 18px 15px 22px!important;border-radius:0!important;border:0!important;border-top:1px solid rgba(40,40,40,.07)!important;background:transparent!important}
.wgUses__tab:first-child{border-top:0!important}
.wgUses__tab b{font-size:15.5px}
.wgUses__tab.is-on{background:#FFF7F0!important}
.wgUses__tab.is-on b{color:var(--accent)}
.wgUses__tab p{font-size:14px;line-height:1.6;margin-top:6px}
.wgUses__prog{top:0;bottom:0;height:auto!important}
.wgRoute{padding:20px 18px!important;border-radius:18px}
.wgRoute__lane{display:flex!important;flex-direction:column;align-items:stretch;gap:0}
.wgRoute__node{display:flex!important;flex-direction:row;align-items:center;gap:14px;width:auto!important;text-align:left}
.wgRoute__node b{font-size:15px!important;line-height:1.3;white-space:normal}
.wgRoute__ic{flex-shrink:0;margin:0!important}
.wgRoute__pipe{width:2px!important;height:36px!important;margin:4px 0 4px 21px;flex:none!important;background:repeating-linear-gradient(180deg,var(--accent) 0 6px,transparent 6px 12px)!important}
.wgRoute__pipe--out{background:repeating-linear-gradient(180deg,rgba(255,255,255,.35) 0 6px,transparent 6px 12px)!important}
.wgRoute__pkt{display:none!important}
.wgRoute__lock{left:16px!important;top:50%!important;transform:translateY(-50%)!important;width:24px;height:24px}
.wgRoute__legend{flex-direction:column;align-items:flex-start;gap:8px;margin-top:18px}
.wgRoute__note{font-size:14px;line-height:1.6}
}
/* faq mobile accordion */
.wgFm{display:none}
@media (max-width:860px){
.wgFaq__grid{display:none!important}
.wgFm{display:block;margin-top:24px;background:#fff;border-radius:18px;box-shadow:0 0 0 1px rgba(40,40,40,.08),0 18px 36px -28px rgba(60,40,20,.4);overflow:hidden}
.wgFm__it{border-top:1px solid rgba(40,40,40,.08)}
.wgFm__it:first-child{border-top:0}
.wgFm__q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:17px 18px;border:0;background:transparent;text-align:left;cursor:pointer;color:var(--ink);font:700 15.5px/1.4 var(--sans)}
.wgFm__q i{position:relative;flex-shrink:0;width:26px;height:26px;border-radius:50%;background:#F4EEE6}
.wgFm__q i::before,.wgFm__q i::after{content:"";position:absolute;left:50%;top:50%;width:10px;height:2px;margin:-1px 0 0 -5px;background:#6B6157;border-radius:2px;transition:transform .2s}
.wgFm__q i::after{transform:rotate(90deg)}
.wgFm__it.is-on{background:#FFF8F2}
.wgFm__it.is-on .wgFm__q{color:var(--accent)}
.wgFm__it.is-on .wgFm__q i{background:var(--accent)}
.wgFm__it.is-on .wgFm__q i::before,.wgFm__it.is-on .wgFm__q i::after{background:#fff}
.wgFm__it.is-on .wgFm__q i::after{transform:rotate(0)}
.wgFm__a{padding:0 18px 18px}
.wgFm__a p{margin:0;font-size:15px;line-height:1.7;color:#3D3833}
.wgFm__wa{display:flex;flex-direction:column;gap:3px;padding:16px 18px;background:#1B1A17;color:#fff;text-decoration:none}
.wgFm__wa b{font:700 15px/1.3 var(--sans)}
.wgFm__wa span{font-size:14px;color:#F7A26F;font-weight:600}
}
/* uses mobile v3: swipe cards */
.wgUm{display:none}
@media (max-width:720px){
.wgUses__grid{display:none!important}
.wgUm{display:block;margin-top:24px}
.wgUm__track{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 -20px;padding:4px 20px 6px;scroll-padding:0 20px}
.wgUm__track::-webkit-scrollbar{display:none}
.wgUm__card{flex:0 0 86%;scroll-snap-align:start;border-radius:20px;padding:20px 18px 18px;background:radial-gradient(260px 160px at 100% 0%,rgba(236,101,42,.4),transparent 70%),#1B1A17;color:#EDE7DD;box-shadow:0 20px 40px -26px rgba(0,0,0,.6)}
.wgUm__route{display:flex;align-items:center}
.wgUm__n{flex-shrink:0;width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:rgba(255,255,255,.08);color:#F7A26F;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.wgUm__n.is-hub{width:52px;background:#fff}
.wgUm__n.is-hub img{width:34px;height:auto}
.wgUm__p{flex:1;height:2px;margin:0 6px;position:relative;background:repeating-linear-gradient(90deg,rgba(255,255,255,.3) 0 5px,transparent 5px 10px)}
.wgUm__p.is-enc{background:repeating-linear-gradient(90deg,var(--accent) 0 5px,transparent 5px 10px)}
.wgUm__p.is-enc svg{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:22px;height:22px;padding:4px;border-radius:50%;background:var(--accent);color:#fff}
.wgUm__lb{display:flex;justify-content:space-between;margin-top:8px;font:600 11.5px/1.3 var(--mono);color:#A9A196}
.wgUm__lb span:last-child{text-align:right}
.wgUm__card h3{margin:18px 0 6px;font:700 20px/1.25 var(--serif);color:#fff}
.wgUm__card p{margin:0;font-size:14.5px;line-height:1.6;color:#CFC7BB}
.wgUm__card small{display:block;margin-top:14px;padding-top:12px;border-top:1px dashed rgba(255,255,255,.16);font-size:13px;line-height:1.5;color:#7FE3AE}
.wgUm__dots{display:flex;justify-content:center;gap:8px;margin-top:14px}
.wgUm__dots button{width:8px;height:8px;padding:0;border:0;border-radius:999px;background:rgba(40,40,40,.2);cursor:pointer;transition:width .2s,background .2s}
.wgUm__dots button.is-on{width:24px;background:var(--accent)}
}
/* uses mobile v4: vertical light list */
@media (max-width:720px){
.wgUm__track{flex-direction:column;gap:0;overflow:visible;scroll-snap-type:none;margin:0;padding:0;background:#fff;border-radius:20px;box-shadow:0 0 0 1px rgba(40,40,40,.08),0 18px 36px -28px rgba(60,40,20,.4)}
.wgUm__card{flex:none;width:auto;border-radius:0;padding:20px 18px;background:transparent;color:var(--ink);box-shadow:none;border-top:1px solid rgba(40,40,40,.08)}
.wgUm__card:first-child{border-top:0}
.wgUm__route{max-width:260px}
.wgUm__n{width:38px;height:38px;border-radius:12px;background:#FFF1E4;color:var(--accent);box-shadow:inset 0 0 0 1px rgba(236,101,42,.2)}
.wgUm__n.is-hub{width:48px;background:#1B1A17;box-shadow:none}
.wgUm__n.is-hub img{filter:brightness(0) invert(1);width:32px}
.wgUm__p{background:repeating-linear-gradient(90deg,rgba(40,40,40,.25) 0 5px,transparent 5px 10px)}
.wgUm__lb{max-width:260px;color:#8A8178}
.wgUm__card h3{margin:14px 0 6px;font-size:18px;color:var(--ink)}
.wgUm__card p{font-size:14.5px;color:#4A4540}
.wgUm__card small{margin-top:10px;padding-top:0;border-top:0;color:#17663F;font-weight:600}
.wgUm__dots{display:none}
}