/* VOLYA app landing — styled to match the main site volya.world (Durov Resistance Army):
   Carter One display, Exo 2 headlines, Montserrat body, dark blue/purple gradients,
   blue glass buttons with glow + pulse, and floating glow orbs. */
:root{
  --ink:#EAF2FB;--mut:#a9b7d8;--dim:#6d7cab;
  --blue:#3B82F6;--blue2:#2563EB;--accent:#4E5CE0;--link:#7fb2ff;--gold:#FFC83D;--ok:#46D17A;
  --grad:linear-gradient(135deg,#3B82F6 0%,#2563EB 50%,#1E3A8A 100%);
  --panel:rgba(18,27,66,.52);--line:rgba(120,140,255,.18);--glassb:rgba(150,170,255,.22);
}
*{box-sizing:border-box}html,body{margin:0}
body{color:var(--ink);position:relative;overflow-x:hidden;
  background:#04060f;
  background:radial-gradient(120% 80% at 50% -10%,#0c1140 0%,#06091a 45%,#04060f 100%);
  font:16px/1.65 "Montserrat",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased}

/* floating glow orbs (same idea as volya.world) */
.orbs{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.orb{position:absolute;border-radius:50%;filter:blur(95px);opacity:.5;animation:float-orb 20s ease-in-out infinite}
.orb.a{width:460px;height:460px;left:-120px;top:-80px;background:#2b5cff;animation-delay:0s}
.orb.b{width:520px;height:520px;right:-160px;top:120px;background:#5a2ee0;animation-delay:-6s;opacity:.42}
.orb.c{width:380px;height:380px;left:20%;bottom:-140px;background:#1e7bd6;animation-delay:-12s;opacity:.4}
@keyframes float-orb{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(26px,-30px) scale(1.06)}66%{transform:translate(-18px,20px) scale(.96)}}

.wrap{max-width:1080px;margin:0 auto;padding:0 22px;position:relative;z-index:1}
a{color:inherit;text-decoration:none}
.top{display:flex;align-items:center;gap:14px;padding:20px 0}
.brand{font:400 25px/1 "Carter One",cursive;letter-spacing:.12em;color:#dbe7ff;text-shadow:0 2px 18px rgba(59,130,246,.55)}
.brand small{display:block;font:700 8px/1 "Exo 2",ui-monospace,monospace;letter-spacing:.2em;color:var(--dim);margin-top:5px}
.top nav{margin-left:auto;display:flex;gap:18px;font:700 13.5px/1 "Exo 2",sans-serif;letter-spacing:.02em;color:var(--mut);text-transform:uppercase}
.top nav a:hover{color:var(--link)}

.btn{display:inline-block;border-radius:50px;padding:13px 26px;font:800 15px/1 "Exo 2",sans-serif;letter-spacing:.03em;text-transform:uppercase;
  border:2px solid var(--glassb);background:rgba(255,255,255,.05);backdrop-filter:blur(12px);transition:transform .1s,filter .15s,box-shadow .2s}
.btn:hover{filter:brightness(1.12);transform:translateY(-1px)}
.btn.pri{color:#fff;background:var(--grad);border:3px solid rgba(255,255,255,.82);
  box-shadow:inset 0 0 0 2px rgba(59,130,246,.6),0 0 18px rgba(59,130,246,.55),0 6px 20px rgba(0,0,0,.5);animation:btn-pulse 2.8s ease-in-out infinite}
.btn.pri:hover{transform:scale(1.05)}
@keyframes btn-pulse{0%,100%{box-shadow:inset 0 0 0 2px rgba(59,130,246,.6),0 0 18px rgba(59,130,246,.55),0 6px 20px rgba(0,0,0,.5)}
  50%{box-shadow:inset 0 0 0 2px rgba(59,130,246,.85),0 0 30px rgba(59,130,246,.85),0 6px 22px rgba(0,0,0,.55)}}

.hero{text-align:center;padding:52px 0 26px;position:relative}
/* animated Lottie character figures flanking the hero (from volya.world) */
.hero-fig{position:absolute;top:54%;width:210px;height:210px;z-index:0;pointer-events:none;opacity:.95;filter:drop-shadow(0 12px 30px rgba(0,0,0,.55))}
.hero-fig-l{left:-46px;animation:fig-bob 5s ease-in-out infinite}
.hero-fig-r{right:-46px;animation:fig-bob-r 5.6s ease-in-out infinite}   /* mirrored to face inward */
@keyframes fig-bob{0%,100%{transform:translateY(-50%)}50%{transform:translateY(-62%)}}
@keyframes fig-bob-r{0%,100%{transform:scaleX(-1) translateY(-50%)}50%{transform:scaleX(-1) translateY(-62%)}}
@media(max-width:1180px){.hero-fig{width:150px}.hero-fig-l{left:-26px}.hero-fig-r{right:-26px}}
@media(max-width:900px){.hero-fig{display:none}}
.pill{display:inline-block;font:700 11px/1 "Exo 2",ui-monospace,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--link);
  border:1px solid #2c4a8a;border-radius:999px;padding:7px 14px;margin-bottom:22px;background:rgba(59,130,246,.1)}
h1{font:400 clamp(42px,9vw,104px)/1.02 "Carter One",cursive;letter-spacing:.05em;margin:0 0 18px;
  text-shadow:2px 5px 22px rgba(0,0,0,.9),0 0 42px rgba(59,130,246,.3)}
h1 .g{color:#8fd0ff}
.lead{font-size:clamp(16px,2.3vw,19px);color:var(--mut);max-width:760px;margin:0 auto 30px}
.cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.trust{margin-top:26px;color:var(--dim);font:600 12.5px/1.7 "Exo 2",ui-monospace,monospace}.trust b{color:var(--gold)}

section{padding:44px 0;position:relative;z-index:1}
h2{font:800 clamp(23px,4vw,36px)/1.15 "Exo 2",sans-serif;text-transform:uppercase;letter-spacing:.02em;margin:0 0 12px;text-align:center}
.ssub{text-align:center;color:var(--mut);max-width:680px;margin:0 auto 34px}
.prose{max-width:760px;margin:0 auto;color:var(--mut)}
.prose h2{text-align:left}.prose p{margin:0 0 16px}.prose strong{color:var(--ink)}.prose a{color:var(--link);text-decoration:underline}

.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:820px){.grid{grid-template-columns:1fr}}
.card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:22px;backdrop-filter:blur(10px);
  box-shadow:0 18px 44px -24px rgba(0,0,0,.9),inset 0 1px 0 rgba(150,170,255,.14)}
.card .ic{font-size:24px;margin-bottom:12px}
.card h3{margin:0 0 7px;font:800 16px/1.3 "Exo 2",sans-serif;text-transform:uppercase;letter-spacing:.02em}
.card p{margin:0;color:var(--mut);font-size:14.5px}

.steps{counter-reset:s;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:820px){.steps{grid-template-columns:1fr}}
.step{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:24px 22px 22px;position:relative;backdrop-filter:blur(10px)}
.step::before{counter-increment:s;content:counter(s);position:absolute;top:-14px;left:20px;width:32px;height:32px;border-radius:10px;
  background:var(--grad);color:#fff;font:900 15px/32px "Exo 2",sans-serif;text-align:center;box-shadow:0 0 16px rgba(59,130,246,.6)}
.step h3{margin:8px 0 6px;font:800 16px/1.3 "Exo 2",sans-serif;text-transform:uppercase;letter-spacing:.02em}.step p{margin:0;color:var(--mut);font-size:14px}

/* comparison table (Bueno page) */
.cmp{max-width:820px;margin:0 auto;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--panel);backdrop-filter:blur(10px)}
.cmp table{width:100%;border-collapse:collapse;font-size:14.5px}
.cmp th,.cmp td{padding:13px 16px;text-align:left;border-bottom:1px solid var(--line)}
.cmp th{background:rgba(59,130,246,.12);font:800 13px/1 "Exo 2",sans-serif;text-transform:uppercase}
.cmp td:first-child{color:var(--mut);font-weight:600}
.cmp .v{color:var(--ok);font-weight:700}.cmp .x{color:var(--dim)}
.cmp tr:last-child td{border-bottom:none}

.faq details{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:4px 18px;margin-bottom:10px;max-width:820px;margin-left:auto;margin-right:auto;backdrop-filter:blur(10px)}
.faq summary{cursor:pointer;font:700 15px/1 "Exo 2",sans-serif;padding:14px 0;list-style:none}.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"+ ";color:var(--blue)}.faq details[open] summary::before{content:"– "}
.faq p{color:var(--mut);margin:0 0 14px;font-size:14.5px}

.foot{border-top:1px solid var(--line);padding:30px 0 50px;color:var(--dim);font-size:13.5px;text-align:center;position:relative;z-index:1}
.foot a{color:var(--mut)}.foot a:hover{color:var(--link)}
.foot .links{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;margin-bottom:14px;font-weight:600}