/* SiteBox · портал «Записко» — стилі лендингу, майстра, оплати й юридичних сторінок.
   Без зовнішніх шрифтів, без бібліотек. Анімації вимикаються при prefers-reduced-motion. */
:root{
  --bg:#07090d;--bg2:#0c1016;--card:#10151c;--card2:#141a23;--line:rgba(255,255,255,.08);--line2:rgba(255,255,255,.14);
  --text:#eef2f6;--mute:#9aa6b2;--dim:#6b7783;
  --acc:#3ddc84;--acc2:#14954f;--accg:linear-gradient(135deg,#27b765 0%,#1a9e55 55%,#138a49 100%);
  --mint:#2fe0a5;--violet:#8b7bff;--bad:#ff5d5d;
  --r:22px;--r-sm:14px;--sh:0 30px 80px -30px rgba(0,0,0,.8);
  --font:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:84px}
body{background:var(--bg);color:var(--text);font:16px/1.55 var(--font);-webkit-font-smoothing:antialiased;overflow-x:hidden;min-height:100vh}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--acc);outline-offset:3px;border-radius:6px}
::selection{background:rgba(61,220,132,.35)}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}
.i{width:20px;height:20px;flex:none}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--acc);color:#111;padding:10px 14px;border-radius:10px;font-weight:700}
.skip:focus{top:12px}
.tbd{color:var(--acc);font-weight:600;white-space:nowrap}
.nowrap{white-space:nowrap}
.hp{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}
[hidden]{display:none!important}

/* ---------- кнопки, типографіка ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:15px;padding:15px 24px;font-weight:750;font-size:16px;line-height:1.1;cursor:pointer;white-space:nowrap;transition:transform .15s,box-shadow .25s,background .2s,border-color .2s,opacity .2s;-webkit-tap-highlight-color:transparent}
.btn:active{transform:scale(.97)}
.btn .i{width:19px;height:19px}
.btn-acc{background:var(--accg);color:#fff;box-shadow:0 12px 34px -8px rgba(34,184,102,.55),inset 0 1px 0 rgba(255,255,255,.45)}
.btn-acc:hover{box-shadow:0 18px 44px -8px rgba(34,184,102,.7),inset 0 1px 0 rgba(255,255,255,.45)}
.btn-acc:after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);background-size:250% 100%;background-position:120% 0;transition:background-position .9s}
.btn-acc:hover:after{background-position:-40% 0}
.btn-ghost{background:rgba(255,255,255,.06);color:var(--text);border:1px solid var(--line2)}
.btn-ghost:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.24)}
.btn-sm{padding:11px 16px;font-size:15px;border-radius:12px}
.btn-xl{padding:19px 28px;font-size:17.5px;border-radius:17px}
.btn-block{width:100%}
.btn[disabled],.btn.busy{opacity:.6;pointer-events:none}
.btn.busy:before{content:"";width:17px;height:17px;border-radius:50%;border:2.5px solid currentColor;border-right-color:transparent;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.kick{display:inline-flex;align-items:center;gap:8px;color:var(--acc);font-weight:800;font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:12px}
.kick .i{width:16px;height:16px}
h1{font-size:clamp(38px,6.1vw,74px);line-height:1.01;font-weight:850;letter-spacing:-.03em}
h1 em,h2 em{font-style:normal;background:var(--accg);-webkit-background-clip:text;background-clip:text;color:transparent}
.h1-sm{font-size:clamp(32px,4.6vw,54px);line-height:1.05}
h2{font-size:clamp(28px,4vw,46px);line-height:1.07;letter-spacing:-.022em;font-weight:820}
h3{font-size:18px;line-height:1.3;font-weight:750}
.lead{color:#cfd7df;font-size:clamp(17px,1.9vw,20px);line-height:1.55;max-width:620px}
.lead b{color:var(--text)}
.sub{color:var(--mute);font-size:18px;max-width:660px}
.fine{color:var(--dim);font-size:13.5px;line-height:1.5}
.fine a,.sub a,.lead a{color:var(--acc);text-decoration:underline;text-underline-offset:3px}
.ticks{list-style:none;display:grid;gap:11px}
.ticks li{display:flex;gap:11px;align-items:flex-start;color:#d5dde5}
.ticks li>span{flex:1;min-width:0}
.ticks .i{width:20px;height:20px;padding:3px;border-radius:7px;background:rgba(47,224,165,.14);color:var(--mint);stroke-width:3;margin-top:2px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}
.chip{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.05);border:1px solid var(--line2);padding:7px 13px;border-radius:99px;font-size:13.5px;font-weight:650;color:#d7dee6;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.chip b{width:7px;height:7px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 0 rgba(47,224,165,.7);animation:ping 2.2s infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(47,224,165,.6)}70%,100%{box-shadow:0 0 0 9px rgba(47,224,165,0)}}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:8px;flex:none}
.dot.ok{background:var(--mint);box-shadow:0 0 6px rgba(47,224,165,.6)}
.dot.warn{background:var(--acc);box-shadow:0 0 6px rgba(61,220,132,.5)}
.dot.off{background:var(--bad);box-shadow:0 0 6px rgba(255,93,93,.45)}

/* reveal */
.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.js .reveal.in{opacity:1;transform:none}

/* фон: «аврора» й сітка */
.aurora{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.aurora i{position:absolute;width:60vmax;height:60vmax;border-radius:50%;opacity:.5;will-change:transform}
.aurora i:nth-child(1){background:radial-gradient(circle,rgba(61,220,132,.38),transparent 62%);top:-28vmax;left:-12vmax;animation:drift1 22s ease-in-out infinite alternate}
.aurora i:nth-child(2){background:radial-gradient(circle,rgba(40,190,160,.32),transparent 62%);top:-18vmax;right:-22vmax;animation:drift2 26s ease-in-out infinite alternate}
.aurora i:nth-child(3){background:radial-gradient(circle,rgba(47,224,165,.18),transparent 62%);bottom:-34vmax;left:22%;animation:drift1 30s ease-in-out infinite alternate-reverse}
@keyframes drift1{to{transform:translate(9vmax,6vmax) scale(1.12)}}
@keyframes drift2{to{transform:translate(-8vmax,9vmax) scale(.92)}}
.gridbg{position:absolute;inset:0;pointer-events:none;z-index:0;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 30%,#000 30%,transparent 75%);mask-image:radial-gradient(ellipse 70% 60% at 50% 30%,#000 30%,transparent 75%)}

/* ---------- хедер ---------- */
.hd{position:sticky;top:0;z-index:40;background:rgba(7,9,13,.72);backdrop-filter:saturate(1.5) blur(14px);-webkit-backdrop-filter:saturate(1.5) blur(14px);border-bottom:1px solid transparent;transition:border-color .3s,background .3s}
.hd.scrolled{border-bottom-color:var(--line);background:rgba(7,9,13,.88)}
.hd-in{display:flex;align-items:center;gap:22px;height:68px}
.logo{display:inline-flex;align-items:center;gap:10px;font-weight:850;font-size:17px;letter-spacing:-.01em;white-space:nowrap}
.logo-m{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:var(--accg);color:#fff;font-weight:900;font-size:15px;letter-spacing:-.04em;box-shadow:0 8px 24px -6px rgba(34,184,102,.6)}
.nav{display:flex;gap:4px;margin-left:auto}
.nav a{padding:8px 12px;border-radius:10px;color:var(--mute);font-weight:600;font-size:15px;transition:color .2s,background .2s}
.nav a:hover{color:var(--text);background:rgba(255,255,255,.05)}
.hd-r{display:flex;align-items:center;gap:14px}
.hd-pay{color:var(--mute);font-weight:650;font-size:15px}
.hd-pay:hover{color:var(--text)}
.nav+.hd-r{margin-left:0}
.hd-in>.logo+.hd-r{margin-left:auto}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;isolation:isolate;padding:48px 0 70px}
.hero-in{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);gap:48px;align-items:start}
.hero-copy h1{margin-bottom:18px;font-size:clamp(38px,4.7vw,66px)}
.hero-copy .lead{margin-bottom:26px}
.hero-card{position:relative;border-radius:26px;padding:1px;background:linear-gradient(140deg,rgba(61,220,132,.55),rgba(255,255,255,.08) 35%,rgba(40,190,160,.4));box-shadow:var(--sh)}
.hero-card>.wz{border-radius:25px}
.hero-facts{list-style:none;display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:20px;color:var(--mute);font-size:14.5px}
.hero-facts li{display:flex;align-items:center;gap:8px}
.hero-facts b{color:var(--text)}
.hero-facts .i{width:18px;height:18px;color:var(--acc)}
.hero-vis{position:relative;padding-top:24px}

/* ---------- майстер ---------- */
.wz{position:relative;background:linear-gradient(180deg,rgba(20,26,35,.94),rgba(13,17,23,.96));border:1px solid var(--line);border-radius:24px;padding:20px 20px 22px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.hero-card>.wz{border:0}
.wz-head{display:flex;align-items:center;gap:12px;margin-bottom:14px;min-height:34px}
.wz-back{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;border:1px solid var(--line2);background:rgba(255,255,255,.04);cursor:pointer;transition:background .2s}
.wz-back:hover{background:rgba(255,255,255,.1)}
.wz-back .i{transform:rotate(180deg);width:17px;height:17px}
.wz-steps{display:flex;gap:6px;flex:1}
.wz-steps i{height:5px;flex:1;max-width:72px;border-radius:9px;background:rgba(255,255,255,.1);overflow:hidden;position:relative}
.wz-steps i:after{content:"";position:absolute;inset:0;background:var(--accg);transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.wz-steps i.on:after{transform:none}
.wz-count{color:var(--mute);font-size:13px;font-weight:650;white-space:nowrap}
.wz-count b{color:var(--text)}
.wz-form fieldset{border:0;min-width:0}
.js .wz-pane{display:none}
.js .wz-pane.on{display:block;animation:paneIn .45s cubic-bezier(.2,.8,.2,1)}
.js .wz-pane.back{animation-name:paneBack}
@keyframes paneIn{from{opacity:0;transform:translateX(26px)}to{opacity:1;transform:none}}
@keyframes paneBack{from{opacity:0;transform:translateX(-26px)}to{opacity:1;transform:none}}
.wz-q{font-size:21px;font-weight:800;letter-spacing:-.01em;margin-bottom:14px;padding:0}
.wz-niches{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}
.wz-niche{position:relative;cursor:pointer}
.wz-niche input{position:absolute;opacity:0;pointer-events:none}
.wz-niche>span{display:block}
.wz-niche{display:flex;flex-direction:column;align-items:center;gap:9px;padding:15px 6px 13px;border-radius:16px;border:1px solid var(--line);background:rgba(255,255,255,.03);text-align:center;transition:transform .18s,border-color .2s,background .2s}
.wz-niche:hover{transform:translateY(-2px);border-color:var(--line2);background:rgba(255,255,255,.06)}
.wz-ni{display:grid!important;place-items:center;width:44px;height:44px;border-radius:13px;background:rgba(61,220,132,.1);color:var(--acc);transition:background .2s,color .2s,transform .3s}
.wz-ni .i{width:23px;height:23px}
.wz-nl{font-size:13.5px;font-weight:700;line-height:1.2}
.wz-niche:has(input:checked),.wz-niche.on{border-color:var(--acc);background:linear-gradient(180deg,rgba(61,220,132,.12),rgba(255,122,69,.05))}
.wz-niche:has(input:checked) .wz-ni,.wz-niche.on .wz-ni{background:var(--accg);color:#fff;transform:scale(1.06)}
.wz-niche:has(input:focus-visible){outline:2px solid var(--acc);outline-offset:2px}
.wz-search{position:relative;margin-bottom:12px}
.wz-search .i{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--mute);width:19px;height:19px}
.wz-search input{width:100%;padding:15px 14px 15px 44px;border-radius:14px;border:1px solid var(--line2);background:rgba(0,0,0,.25);font-size:16px;transition:border-color .2s}
.wz-search input:focus{outline:none;border-color:var(--acc)}
.wz-cities{display:flex;flex-wrap:wrap;gap:8px;max-height:212px;overflow:auto;padding:2px;scrollbar-width:thin}
.wz-city{padding:10px 14px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.04);font-weight:650;font-size:14.5px;cursor:pointer;transition:all .18s}
.wz-city:hover{border-color:var(--line2);background:rgba(255,255,255,.08)}
.wz-city.on{background:var(--accg);color:#fff;border-color:transparent}
.wz-city mark{background:none;color:var(--acc)}
.wz-city.on mark{color:inherit}
.wz-empty{color:var(--mute);font-size:14px;padding:8px 2px}
.wz-hint{color:var(--dim);font-size:13px;margin-top:12px}
.fld{margin-bottom:13px}
.fld label{display:block;font-size:13.5px;color:var(--mute);margin-bottom:6px;font-weight:650}
.fld input,.fld select{width:100%;padding:15px;border-radius:14px;border:1px solid var(--line2);background:rgba(0,0,0,.25);font-size:16px;transition:border-color .2s,box-shadow .2s}
.fld input:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 4px rgba(61,220,132,.12)}
.fld input.bad{border-color:var(--bad);box-shadow:0 0 0 4px rgba(255,93,93,.12)}
.fld-tel{display:flex;align-items:stretch;border-radius:14px;border:1px solid var(--line2);background:rgba(0,0,0,.25);transition:border-color .2s,box-shadow .2s}
.fld-tel:focus-within{border-color:var(--acc);box-shadow:0 0 0 4px rgba(61,220,132,.12)}
.fld-tel.bad{border-color:var(--bad)}
.fld-tel span{display:grid;place-items:center;padding:0 4px 0 15px;color:var(--mute);font-weight:700}
.fld-tel input{border:0!important;background:none!important;box-shadow:none!important;padding-left:6px;letter-spacing:.02em}
.agree{display:flex;gap:11px;align-items:flex-start;font-size:14px;color:#c5ced7;margin:4px 0 16px;cursor:pointer;line-height:1.45}
.agree input{appearance:none;-webkit-appearance:none;flex:none;width:22px;height:22px;border-radius:7px;border:2px solid #4a5563;margin-top:0;display:grid;place-items:center;cursor:pointer;transition:all .18s}
.agree input:checked{background:var(--accg);border-color:transparent}
.agree input:checked:after{content:"";width:6px;height:11px;border:solid #fff;border-width:0 2.6px 2.6px 0;transform:rotate(45deg) translate(-1px,-1px)}
.agree input.bad{border-color:var(--bad);animation:shake .4s}
.agree a{color:var(--acc);text-decoration:underline;text-underline-offset:3px}
@keyframes shake{25%{transform:translateX(-4px)}50%{transform:translateX(4px)}75%{transform:translateX(-2px)}}
.wz-go{width:100%}
.wz-msg{min-height:0;font-weight:700;font-size:14.5px;color:var(--bad);margin-top:10px}
.wz-msg:empty{margin:0}
.wz-msg.ok{color:var(--mint)}
.wz-fine{color:var(--dim);font-size:13px;margin-top:12px;text-align:center}
.wz-sum{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.wz-sum:empty{display:none}
.wz.nudge{animation:nudge 1s ease}
@keyframes nudge{30%{box-shadow:0 0 0 4px rgba(61,220,132,.55),0 0 60px rgba(61,220,132,.35)}}
.wz-sum span{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:#d0d8e0;background:rgba(255,255,255,.06);border:1px solid var(--line);padding:5px 10px;border-radius:99px;cursor:pointer}
.wz-sum .i{width:14px;height:14px;color:var(--acc)}

/* ---------- макет пристроїв ---------- */
.mock{position:relative;container-type:inline-size;aspect-ratio:1/.86;width:100%;max-width:620px;margin-left:auto}
.mk-glow{position:absolute;inset:12% 6% 4% 10%;background:radial-gradient(closest-side,rgba(61,220,132,.35),transparent);filter:blur(20px);z-index:0}
.mk-laptop{position:absolute;left:0;top:5%;width:86%;z-index:1;animation:float 7s ease-in-out infinite}
.mk-lid{border-radius:2.2cqw 2.2cqw .8cqw .8cqw;background:#1b212a;padding:.9cqw;border:1px solid rgba(255,255,255,.12);box-shadow:0 4cqw 8cqw -3cqw rgba(0,0,0,.9)}
.mk-bar{display:flex;align-items:center;gap:.8cqw;height:4cqw;padding:0 1.4cqw;background:#0e1218;border-radius:1.4cqw 1.4cqw 0 0;border-bottom:1px solid rgba(255,255,255,.06)}
.mk-bar>i{width:1.1cqw;height:1.1cqw;border-radius:50%;background:#ff5f57}
.mk-bar>i:nth-child(2){background:#febc2e}.mk-bar>i:nth-child(3){background:#28c840}
.mk-url{display:flex;align-items:center;gap:.6cqw;margin:0 auto;padding:.5cqw 1.6cqw;border-radius:99px;background:rgba(255,255,255,.06);font-size:1.35cqw;color:#c8d0d8;font-weight:600;max-width:70%;white-space:nowrap;overflow:hidden}
.mk-url svg{width:1.2cqw;height:1.2cqw;color:var(--mint);flex:none}
.mk-screen{background:#0b0e13;border-radius:0 0 1.2cqw 1.2cqw;overflow:hidden;font-size:1.3cqw}
.mk-nav{display:flex;align-items:center;gap:1cqw;padding:1.3cqw 1.8cqw}
.mk-logo{display:grid;place-items:center;width:3.4cqw;height:3.4cqw;border-radius:1cqw;background:var(--mka,var(--accg));color:#fff;font-weight:900;font-size:1.6cqw;transition:background .5s}
.mk-nav b{font-size:1.65cqw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:26cqw}
.mk-sp{flex:1}
.mk-pill{font-size:1.25cqw;color:#c9d1d9;font-weight:700}
.mk-btn{display:inline-block;background:var(--mka,var(--accg));color:#fff;font-weight:800;font-size:1.25cqw;padding:.8cqw 1.5cqw;border-radius:.9cqw;white-space:nowrap;transition:background .5s}
.mk-hero{position:relative;height:25cqw;margin:0 1.4cqw;border-radius:1.4cqw;overflow:hidden;display:flex;align-items:flex-end}
.mk-photo{position:absolute;inset:0;background:#1a2029 center/cover no-repeat;transition:opacity .5s,transform 6s linear;transform:scale(1.04)}
.mk-photo.zoom{transform:scale(1.12)}
.mk-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,8,11,.92) 0%,rgba(6,8,11,.6) 45%,rgba(6,8,11,.05) 100%)}
.mk-hero-t{position:relative;z-index:1;padding:2.2cqw;display:flex;flex-direction:column;gap:.8cqw;transition:opacity .4s,transform .4s}
.mk-hero-t small{color:var(--mkc,var(--acc));font-weight:800;font-size:1.15cqw;letter-spacing:.1em;text-transform:uppercase;transition:color .5s}
.mk-hero-t strong{font-size:3.5cqw;line-height:1.03;letter-spacing:-.02em;font-weight:850}
.mk-hero-t strong em{font-style:normal;color:var(--mkc,var(--acc));transition:color .5s}
.mk-cta{align-self:flex-start;margin-top:.6cqw;background:var(--mka,var(--accg));color:#fff;font-weight:800;padding:.9cqw 1.8cqw;border-radius:1cqw;font-size:1.3cqw}
.mk-book{padding:1.4cqw 1.8cqw 1.8cqw}
.mk-days{display:flex;gap:.8cqw;margin-bottom:1cqw}
.mk-days span{flex:1;text-align:center;padding:.7cqw 0;border-radius:1cqw;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.06);color:var(--mute);font-size:1cqw;font-weight:700;text-transform:uppercase}
.mk-days b{display:block;color:var(--text);font-size:1.7cqw;line-height:1.2}
.mk-days .on{background:var(--mka,var(--accg));color:#3b2a00;border-color:transparent}
.mk-days .on b{color:#fff}
.mk-slots{display:grid;grid-template-columns:repeat(8,1fr);gap:.7cqw}
.mk-slots span{text-align:center;padding:.75cqw 0;border-radius:.8cqw;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.06);font-weight:700;font-size:1.15cqw}
.mk-slots .off{opacity:.3;text-decoration:line-through}
.mk-slots .pick{animation:pick 6s infinite}
@keyframes pick{0%,22%{background:rgba(255,255,255,.05);color:var(--text);transform:none}28%{transform:scale(1.15)}32%,92%{background:var(--acc);color:#fff;transform:none;box-shadow:0 0 2cqw rgba(61,220,132,.6)}100%{background:rgba(255,255,255,.05)}}
.mk-base{height:1.8cqw;margin:0 -4%;background:linear-gradient(#2a313b,#151a21);border-radius:0 0 2.4cqw 2.4cqw;position:relative}
.mk-base:before{content:"";position:absolute;left:50%;top:0;width:14%;height:.6cqw;transform:translateX(-50%);background:#0e1218;border-radius:0 0 1cqw 1cqw}
.mk-phone{position:absolute;right:0;bottom:2%;width:31%;aspect-ratio:9/19;z-index:3;border-radius:5cqw;background:#05070a;padding:1.1cqw;border:1px solid rgba(255,255,255,.16);box-shadow:0 5cqw 9cqw -2cqw rgba(0,0,0,.95),0 0 0 .5cqw #1c222b;animation:float 7s ease-in-out -3.5s infinite}
.mk-island{position:absolute;left:50%;top:2.2cqw;width:9cqw;height:2.4cqw;border-radius:2cqw;background:#000;transform:translateX(-50%);z-index:4}
.mk-pscreen{position:relative;height:100%;border-radius:4cqw;overflow:hidden;background:#0b0e13;display:flex;flex-direction:column}
.mk-photo.sm{position:relative;inset:auto;height:36%;flex:none}
.mk-photo.sm:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,#0b0e13)}
.mk-pbody{padding:1.5cqw 2cqw;display:flex;flex-direction:column;gap:.7cqw;flex:1;min-height:0}
.mk-pbody small{color:var(--mkc,var(--acc));font-weight:800;font-size:1.05cqw;letter-spacing:.08em;text-transform:uppercase}
.mk-pbody strong{font-size:2.2cqw;line-height:1.1;font-weight:850}
.mk-svc{list-style:none;display:grid;gap:.6cqw;margin-top:.5cqw}
.mk-svc li{display:flex;justify-content:space-between;gap:1cqw;padding:.9cqw 1.1cqw;border-radius:1.1cqw;background:rgba(255,255,255,.05);font-size:1.15cqw}
.mk-svc span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mk-svc b{white-space:nowrap}
.mk-ticket{display:flex;align-items:center;gap:1cqw;margin-top:auto;padding:1.1cqw;border-radius:1.3cqw;background:rgba(47,224,165,.12);border:1px solid rgba(47,224,165,.4);font-size:1.1cqw;color:#bff5e1;animation:ticket 6s infinite}
.mk-ticket i{display:grid;place-items:center;width:3cqw;height:3cqw;border-radius:50%;background:var(--mint);color:#04140e;flex:none}
.mk-ticket i .i{width:1.8cqw;height:1.8cqw;stroke-width:3.4}
.mk-ticket b{color:#fff;font-size:1.3cqw}
@keyframes ticket{0%,34%{opacity:0;transform:translateY(2cqw) scale(.9)}42%,90%{opacity:1;transform:none}100%{opacity:0}}
.mk-pbar{display:flex;gap:1cqw;padding:1.2cqw 1.6cqw 2cqw;background:rgba(11,14,19,.95);border-top:1px solid rgba(255,255,255,.06)}
.mk-call{display:grid;place-items:center;width:4.2cqw;border-radius:1.1cqw;background:rgba(255,255,255,.08)}
.mk-call .i{width:2cqw;height:2cqw}
.mk-pbar .mk-btn{flex:1;text-align:center;padding:1.1cqw 0;font-size:1.2cqw;border-radius:1.1cqw}
.mk-toast{position:absolute;left:-2%;top:58%;z-index:4;display:flex;align-items:center;gap:1.4cqw;padding:1.5cqw 2.2cqw 1.5cqw 1.5cqw;border-radius:2.2cqw;background:rgba(22,28,37,.92);border:1px solid rgba(255,255,255,.14);box-shadow:0 3cqw 6cqw -2cqw rgba(0,0,0,.9);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-size:1.7cqw;animation:toast 6s infinite;max-width:52%}
.mk-toast b{display:block;font-size:1.85cqw}
.mk-toast small{display:block;color:var(--mute);font-size:1.5cqw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mk-toast>span:last-child{min-width:0}
.mk-tg{display:grid;place-items:center;width:5cqw;height:5cqw;border-radius:50%;background:linear-gradient(135deg,#37aee2,#1e96c8);color:#fff;flex:none}
.mk-tg .i{width:2.5cqw;height:2.5cqw;transform:translateX(-.15cqw)}
@keyframes toast{0%,44%{opacity:0;transform:translateX(-4cqw) scale(.95)}52%,88%{opacity:1;transform:none}96%,100%{opacity:0;transform:translateY(-2cqw)}}
.mk-tag{position:absolute;right:4%;top:-1%;z-index:5;font-size:max(11px,1.8cqw);font-weight:750;color:#fff;background:var(--accg);padding:.9cqw 2cqw;border-radius:99px;box-shadow:0 1.6cqw 3cqw -1cqw rgba(34,184,102,.6);transform:rotate(3deg)}
.mock.swap .mk-hero-t,.mock.swap .mk-pbody{opacity:0;transform:translateY(1cqw)}
.mock.swap .mk-photo{opacity:.15}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-1.4cqw)}}

/* ---------- стрічка ніш ---------- */
.strip{position:relative;overflow:hidden;border-block:1px solid var(--line);background:rgba(255,255,255,.015);padding:18px 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.strip-run{display:flex;gap:44px;width:max-content;animation:run 38s linear infinite}
.strip:hover .strip-run{animation-play-state:paused}
.strip span{display:flex;align-items:center;gap:10px;font-weight:750;font-size:17px;color:#c9d2db;white-space:nowrap}
.strip .i{width:22px;height:22px;color:var(--acc)}
@keyframes run{to{transform:translateX(-50%)}}

/* ---------- секції ---------- */
.sec{position:relative;padding:104px 0}
.sec-h{margin-bottom:44px}
.sec-h h2{max-width:780px;margin-bottom:14px}

/* кроки */
.steps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;position:relative;counter-reset:s}
.steps:before{content:"";position:absolute;left:8%;right:8%;top:56px;height:2px;background:linear-gradient(90deg,transparent,rgba(61,220,132,.6),rgba(40,190,160,.6),transparent);z-index:0}
.step{position:relative;z-index:1;background:linear-gradient(180deg,var(--card2),var(--card));border:1px solid var(--line);border-radius:var(--r);padding:28px 24px 26px;transition:transform .3s,border-color .3s}
.step:hover{transform:translateY(-4px);border-color:var(--line2)}
.step-n{position:absolute;right:20px;top:14px;font-size:64px;font-weight:900;line-height:1;letter-spacing:-.05em;background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,0));-webkit-background-clip:text;background-clip:text;color:transparent}
.step-ic{display:grid;place-items:center;width:58px;height:58px;border-radius:17px;background:var(--accg);color:#fff;margin-bottom:22px;box-shadow:0 14px 30px -10px rgba(34,184,102,.7)}
.step-ic .i{width:28px;height:28px}
.step h3{font-size:20px;margin-bottom:8px}
.step p{color:var(--mute)}

/* бенто */
.bento{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.bx{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--card2),var(--card));border:1px solid var(--line);border-radius:var(--r);padding:22px;display:flex;flex-direction:column;transition:border-color .3s,transform .3s}
.bx:hover{border-color:var(--line2);transform:translateY(-3px)}
.bx:before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:radial-gradient(400px circle at var(--mx,50%) var(--my,0%),rgba(61,220,132,.45),transparent 40%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .3s;pointer-events:none}
.bx:hover:before{opacity:1}
.bx-big{grid-column:span 2}
.bx:last-child{grid-column:span 2}
.bx h3{display:flex;align-items:center;gap:10px;font-size:19px;margin:18px 0 6px}
.bx h3 .i{color:var(--acc);width:21px;height:21px}
.bx p{color:var(--mute);font-size:15.5px}
.bx-vis{position:relative;height:150px;border-radius:16px;background:radial-gradient(120% 120% at 50% 0%,rgba(255,255,255,.05),rgba(0,0,0,.2));border:1px solid var(--line);overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding:14px}
.bx-big .bx-vis{height:170px}
.vis-tg{justify-content:flex-start;padding-top:12px}
.vb-days,.vb-slots{display:flex;gap:8px}
.vb-days{margin-bottom:10px}
.vb-days span{flex:1;text-align:center;padding:7px 0;border-radius:11px;background:rgba(255,255,255,.05);font-size:11px;font-weight:750;color:var(--mute);text-transform:uppercase}
.vb-days b{display:block;font-size:17px;color:var(--text)}
.vb-days .on{background:var(--accg);color:#3b2a00}.vb-days .on b{color:#fff}
.vb-slots{flex-wrap:wrap}
.vb-slots span{flex:1 0 calc(25% - 8px);text-align:center;padding:8px 0;border-radius:10px;background:rgba(255,255,255,.05);font-weight:700;font-size:13px}
.vb-slots .off{opacity:.3;text-decoration:line-through}
.vb-slots .pick{animation:pick 6s infinite}
.vb-ticket{position:absolute;right:14px;top:14px;display:flex;flex-direction:column;gap:2px;padding:10px 40px 10px 14px;border-radius:13px;background:rgba(10,13,18,.92);border:1px solid rgba(47,224,165,.45);box-shadow:0 14px 30px -10px rgba(0,0,0,.9);animation:ticket 6s infinite}
.vb-ticket span{font-size:11px;color:var(--mute);font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.vb-ticket b{font-size:15px}
.vb-ticket i{position:absolute;right:10px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--mint);color:#04140e}
.vb-ticket i .i{width:13px;height:13px;stroke-width:3.4}
.vt-msg{display:flex;align-items:center;gap:11px;padding:8px 12px;border-radius:14px;background:rgba(22,28,37,.95);border:1px solid var(--line2);font-size:13px;animation:msgIn 6s infinite}
.vt-msg .mk-tg{width:34px;height:34px}
.vt-msg .mk-tg .i{width:17px;height:17px}
.vt-msg b{display:block;font-size:14px}
.vt-msg small{display:block;color:var(--mute);font-size:12px}
.vt-2{margin-top:7px;margin-left:24px;animation-delay:.6s}
@keyframes msgIn{0%,8%{opacity:0;transform:translateY(14px)}16%,86%{opacity:1;transform:none}96%,100%{opacity:0}}
.va-row{display:flex;justify-content:space-between;padding:8px 12px;border-radius:10px;background:rgba(255,255,255,.04);font-size:13.5px;margin-bottom:6px}
.va-row b{font-weight:700}
.va-edit{border:1px solid var(--acc);background:rgba(61,220,132,.07)}
.caret{font-style:normal;border-right:2px solid var(--acc);padding-right:2px;animation:caret 1s steps(1) infinite}
@keyframes caret{50%{border-color:transparent}}
.va-ok{position:absolute;right:12px;bottom:10px;display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:750;color:var(--mint);background:rgba(47,224,165,.12);padding:5px 10px;border-radius:99px;animation:saved 4s infinite}
.va-ok .i{width:14px;height:14px;stroke-width:3}
@keyframes saved{0%,40%{opacity:0;transform:translateY(6px)}50%,90%{opacity:1;transform:none}100%{opacity:0}}
.vu-bar{display:flex;align-items:center;gap:10px;padding:13px 16px;border-radius:14px;background:rgba(0,0,0,.35);border:1px solid var(--line2);font-family:var(--mono);font-size:13.5px;color:#cfd7df;overflow:hidden;white-space:nowrap}
.vu-lock{flex:none;width:12px;height:14px;border-radius:3px;background:var(--mint);position:relative;margin-top:4px}
.vu-lock:before{content:"";position:absolute;left:2px;top:-6px;width:4px;height:6px;border:2px solid var(--mint);border-bottom:0;border-radius:5px 5px 0 0}
.vu-txt span{color:var(--acc);border-right:2px solid var(--acc);animation:caret 1s steps(1) infinite}
.vis-ads svg{width:100%;height:100%}
.va-line{stroke:var(--acc);stroke-dasharray:400;stroke-dashoffset:400;transition:stroke-dashoffset 2s cubic-bezier(.3,.7,.2,1)}
.in .va-line{stroke-dashoffset:0}
.va-area{fill:rgba(61,220,132,.12)}
.vis-mob{align-items:center}
.vm-ph{position:relative;width:96px;height:130px;margin-top:30px;border-radius:18px;border:2px solid var(--line2);background:#0b0e13;padding:12px 9px;display:flex;flex-direction:column;gap:6px}
.vm-ph i{height:8px;border-radius:4px;background:rgba(255,255,255,.08)}
.vm-ph i:first-child{height:34px;background:linear-gradient(135deg,rgba(61,220,132,.4),rgba(255,122,69,.25))}
.vm-ph span{position:absolute;bottom:10px;left:9px;display:grid;place-items:center;width:24px;height:22px;border-radius:7px;background:rgba(255,255,255,.1)}
.vm-ph span .i{width:12px;height:12px}
.vm-ph .vm-b{left:38px;right:9px;width:auto;background:var(--accg);color:#fff;font-size:9px;font-weight:800}
.vis-doc{flex-direction:row;align-items:center;gap:14px;justify-content:center;flex-wrap:wrap}
.vd-p{display:flex;align-items:center;gap:8px;padding:12px 16px;border-radius:13px;background:rgba(255,255,255,.05);border:1px solid var(--line2);font-family:var(--mono);font-size:13px}
.vd-p .i{color:var(--acc)}
.vd-c{display:flex;align-items:center;gap:9px;padding:12px 16px;border-radius:13px;background:rgba(47,224,165,.08);border:1px solid rgba(47,224,165,.35);font-size:13.5px;font-weight:650}
.vd-c i{display:grid;place-items:center;width:20px;height:20px;border-radius:6px;background:var(--mint);color:#04140e}
.vd-c .i{width:13px;height:13px;stroke-width:3.4}

/* приклади */
.ex-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.ex{position:relative;display:flex;flex-direction:column;border-radius:20px;overflow:hidden;border:1px solid var(--line);background:var(--card);transition:transform .3s,border-color .3s,box-shadow .3s}
.ex:hover{transform:translateY(-5px);border-color:var(--line2);box-shadow:0 24px 50px -20px rgba(0,0,0,.9)}
.ex-img{position:relative;aspect-ratio:4/3;overflow:hidden;background:linear-gradient(135deg,#1c232d,#10151c)}
.ex-img img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.ex:hover .ex-img img{transform:scale(1.07)}
.ex-img:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(16,21,28,.9))}
.ex-b{display:flex;align-items:center;gap:12px;padding:14px 14px 16px;margin-top:-26px;position:relative;z-index:1}
.ex-ic{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:var(--accg);color:#fff;flex:none;box-shadow:0 10px 22px -8px rgba(34,184,102,.7)}
.ex-ic .i{width:21px;height:21px}
.ex-t{flex:1;min-width:0}
.ex-t b{display:block;font-size:16px}
.ex-t small{display:block;color:var(--mute);font-size:13px;line-height:1.35}
.ex-go{color:var(--mute);transition:transform .3s,color .3s}
.ex:hover .ex-go{transform:translateX(4px);color:var(--acc)}

/* ціна */
.price-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;align-items:start}
.price{position:relative;border-radius:28px;padding:34px 30px 28px;background:linear-gradient(180deg,#171d27,#0f141b);border:1px solid rgba(61,220,132,.35);box-shadow:0 40px 90px -40px rgba(34,184,102,.45);overflow:hidden}
.price:before{content:"";position:absolute;inset:0;background:radial-gradient(600px 240px at 80% -10%,rgba(61,220,132,.18),transparent 60%);pointer-events:none}
.price-top{position:relative;margin-bottom:24px}
.price-name{display:block;color:var(--mute);font-weight:700;margin-bottom:6px}
.price-num{display:flex;align-items:flex-end;gap:12px}
.price-num b{font-size:96px;line-height:.9;font-weight:900;letter-spacing:-.05em;background:var(--accg);-webkit-background-clip:text;background-clip:text;color:transparent}
.price-num span{color:var(--mute);font-weight:700;line-height:1.2;padding-bottom:8px}
.price-day{display:inline-block;margin-top:12px;padding:6px 12px;border-radius:99px;background:rgba(47,224,165,.12);color:var(--mint);font-weight:750;font-size:14.5px}
.price .ticks{margin-bottom:26px;position:relative}
.price-fine{color:var(--dim);font-size:13.5px;margin-top:14px;text-align:center}
.price-side{display:grid;gap:18px}
.topup,.life{border-radius:var(--r);padding:24px;background:linear-gradient(180deg,var(--card2),var(--card));border:1px solid var(--line)}
.topup h3,.life h3{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.topup h3 .i,.life h3 .i{color:var(--acc)}
.topup p{color:var(--mute);font-size:15px;margin-bottom:16px}
.topup-f,.ref-in{display:flex;gap:10px}
.topup-f input,.ref-in input{flex:1;min-width:0;padding:14px 16px;border-radius:14px;border:1px solid var(--line2);background:rgba(0,0,0,.25);font-size:17px;font-weight:700;letter-spacing:.06em}
.topup-f input:focus,.ref-in input:focus{outline:none;border-color:var(--acc)}
.calc{margin-top:20px;padding-top:18px;border-top:1px dashed var(--line2)}
.calc-row{display:flex;justify-content:space-between;align-items:baseline;color:var(--mute);font-size:14.5px}
.calc-row b{color:var(--text);font-size:18px}
.calc input[type=range]{width:100%;margin:14px 0;-webkit-appearance:none;appearance:none;height:6px;border-radius:9px;background:linear-gradient(90deg,var(--acc) var(--p,18%),rgba(255,255,255,.1) var(--p,18%));outline:none}
.calc input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;border-radius:50%;background:#fff;border:5px solid var(--acc2);cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.5)}
.calc input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:5px solid var(--acc2);cursor:pointer}
.life-t{list-style:none;display:grid;gap:12px;margin-top:6px;position:relative}
.life-t:before{content:"";position:absolute;left:4px;top:8px;bottom:8px;width:1px;background:var(--line2)}
.life-t li{display:flex;gap:12px;align-items:flex-start;color:var(--mute);font-size:14.5px;position:relative}
.life-t .dot{margin:6px 0 0}
.life-t b{color:var(--text)}

/* реферал */
.ref{position:relative;display:grid;grid-template-columns:1.2fr 1fr;gap:34px;align-items:center;padding:38px;border-radius:30px;background:linear-gradient(135deg,rgba(40,190,160,.16),rgba(61,220,132,.08));border:1px solid rgba(40,190,160,.35);overflow:hidden}
.ref h2{margin-bottom:10px}
.ref .kick{color:#8ee8b8}
.ref-f label{display:block;font-size:14px;color:var(--mute);font-weight:650;margin-bottom:8px}
.ref-out{display:flex;gap:10px;align-items:center;margin-top:12px;padding:10px 10px 10px 14px;border-radius:14px;background:rgba(0,0,0,.3);border:1px solid var(--line2)}
.ref-out code{flex:1;min-width:0;font-family:var(--mono);font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--acc)}

/* FAQ */
.faq-w{max-width:880px}
.faq{display:grid;gap:10px}
.faq details{border-radius:18px;background:var(--card);border:1px solid var(--line);transition:border-color .3s,background .3s}
.faq details[open]{border-color:var(--line2);background:var(--card2)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 22px;font-weight:750;font-size:17px;cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary .i{color:var(--mute);transition:transform .3s}
.faq details[open] summary .i{transform:rotate(180deg);color:var(--acc)}
.faq details>div{padding:0 22px 20px;color:#bcc6d0;line-height:1.65}
.faq details>div a{color:var(--acc);text-decoration:underline;text-underline-offset:3px}

/* фінальний CTA */
.sec-last{padding-top:20px}
.final{position:relative;overflow:hidden;isolation:isolate;text-align:center;padding:76px 24px;border-radius:34px;background:linear-gradient(180deg,#141a23,#0c1016);border:1px solid var(--line2)}
.final .aurora{z-index:-1}
.final h2{max-width:760px;margin:0 auto 14px;font-size:clamp(30px,4.6vw,54px)}
.final .sub{margin:0 auto 30px}

/* липка панель (телефон) */
.mbar{position:fixed;left:0;right:0;bottom:0;z-index:45;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(7,9,13,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line);transform:translateY(110%);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.mbar.show{transform:none}

/* ---------- футер ---------- */
.ft{border-top:1px solid var(--line);padding:56px 0 34px;background:linear-gradient(180deg,transparent,rgba(255,255,255,.015));margin-top:40px}
.ft-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:30px}
.ft-brand p{color:var(--mute);font-size:14.5px;margin-top:14px;max-width:320px}
.ft-col{display:flex;flex-direction:column;gap:9px;font-size:14.5px}
.ft-col b{font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-bottom:4px}
.ft-col a{color:#c3ccd5}
.ft-col a:hover{color:var(--acc)}
.ft-req span{color:#c3ccd5}
.ft-bot{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:40px;padding-top:22px;border-top:1px solid var(--line);color:var(--dim);font-size:13px}

/* згода на аналітику */
.consent{position:fixed;left:16px;right:16px;bottom:16px;z-index:60;max-width:520px;margin:0 auto;padding:16px 18px;border-radius:18px;background:rgba(18,23,31,.97);border:1px solid var(--line2);box-shadow:var(--sh);display:flex;flex-direction:column;gap:12px;font-size:14.5px;color:#cfd7df}
.consent a{color:var(--acc);text-decoration:underline}
.consent-b{display:flex;gap:10px;justify-content:flex-end}

/* ---------- /new ---------- */
.new-pg{position:relative;overflow:hidden;isolation:isolate;padding:56px 0 40px}
.new-in{position:relative;z-index:1;display:grid;grid-template-columns:1fr minmax(0,520px);gap:48px;align-items:start}
.new-copy .lead{margin:16px 0 24px}

/* ---------- сторінка «створено» ---------- */
.done-pg,.pay-pg,.thx-pg{position:relative;overflow:hidden;isolation:isolate;padding:56px 0 30px;min-height:70vh}
.done-in,.pay-in{position:relative;z-index:1;max-width:1040px}
.confetti{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}
.done-head{text-align:center;max-width:760px;margin:0 auto 30px}
.done-head .lead{margin:14px auto 0}
.done-badge{display:grid;place-items:center;width:84px;height:84px;margin:0 auto 18px;border-radius:50%;background:radial-gradient(circle,rgba(47,224,165,.25),rgba(47,224,165,.08));border:2px solid var(--mint);color:var(--mint);box-shadow:0 0 50px rgba(47,224,165,.35);animation:pop .7s cubic-bezier(.2,1.6,.4,1)}
.done-badge .i{width:40px;height:40px;stroke-width:3;stroke-dasharray:30;stroke-dashoffset:30;animation:draw .6s .35s ease forwards}
@keyframes pop{from{transform:scale(.3);opacity:0}}
@keyframes draw{to{stroke-dashoffset:0}}
.done-id{display:flex;flex-direction:column;align-items:center;gap:4px;margin:0 auto 26px;padding:22px;max-width:460px;border-radius:24px;background:linear-gradient(180deg,#171d27,#0f141b);border:1px solid rgba(61,220,132,.35);text-align:center}
.done-id span{color:var(--mute);font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:.12em}
.done-id b{font-size:64px;line-height:1;font-weight:900;letter-spacing:.02em;background:var(--accg);-webkit-background-clip:text;background-clip:text;color:transparent}
.done-id small{color:var(--dim);font-size:13.5px;max-width:340px}
.done-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.dc{border-radius:var(--r);padding:24px;background:linear-gradient(180deg,var(--card2),var(--card));border:1px solid var(--line);display:flex;flex-direction:column;gap:14px}
.dc>p{color:var(--mute)}
.dc-key{grid-column:1/-1;border-color:rgba(61,220,132,.45);box-shadow:0 30px 70px -40px rgba(34,184,102,.6)}
.dc-h{display:flex;align-items:center;gap:12px}
.dc-h h2{font-size:21px;letter-spacing:-.01em}
.dc-ic{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:rgba(61,220,132,.12);color:var(--acc);flex:none}
.dc-warn{padding:12px 14px;border-radius:13px;background:rgba(61,220,132,.08);border:1px solid rgba(61,220,132,.3);color:#f3e2b0!important;font-size:14.5px}
.dc-warn b{color:var(--acc)}
.linkbox{padding:14px 16px;border-radius:14px;background:rgba(0,0,0,.35);border:1px solid var(--line2);overflow-wrap:anywhere}
.linkbox code{font-family:var(--mono);font-size:14px;color:#e9eef3;line-height:1.5}
.dc-b{display:flex;gap:10px;flex-wrap:wrap}
.dc-b .btn{flex:1 1 180px}
.share{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:14px;color:var(--mute)}
.sh{display:inline-flex;align-items:center;gap:7px;padding:9px 13px;border-radius:11px;border:1px solid var(--line2);background:rgba(255,255,255,.05);font-weight:700;font-size:14px;color:var(--text);cursor:pointer;transition:background .2s,border-color .2s}
.sh:hover{background:rgba(255,255,255,.1)}
.sh .i{width:17px;height:17px}
.sh-tg .i{color:#37aee2}.sh-vb .i{color:#9a77ff}
.saved{display:flex;gap:10px;align-items:center;font-weight:650;font-size:15px;cursor:pointer;padding-top:4px}
.saved input{width:20px;height:20px;accent-color:var(--mint)}
.dc-pay{border-color:rgba(47,224,165,.3)}
.next{margin-top:30px;padding:28px;border-radius:var(--r);border:1px dashed var(--line2)}
.next h2{font-size:22px;margin-bottom:14px}
.next ol{padding-left:22px;display:grid;gap:9px;color:var(--mute)}
.next b{color:var(--text)}
.lost{margin-top:20px;padding:24px;border-radius:var(--r);background:rgba(255,93,93,.07);border:1px solid rgba(255,93,93,.35)}
.lost h2{font-size:20px;margin-bottom:8px}
.lost p{color:var(--mute);margin-bottom:14px}

/* ---------- оплата ---------- */
.pay-head{margin-bottom:28px}
.pay-find{max-width:520px;padding:24px;border-radius:var(--r);background:linear-gradient(180deg,var(--card2),var(--card));border:1px solid var(--line)}
.pay-find label{display:block;font-weight:700;margin-bottom:10px}
.pay-find .fine{margin-top:10px}
.pay-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:18px;align-items:start}
.pay-site,.pay-box,.thx-site{border-radius:var(--r);padding:22px;background:linear-gradient(180deg,var(--card2),var(--card));border:1px solid var(--line)}
.pay-site{position:sticky;top:90px}
.ps-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px 0;border-top:1px dashed var(--line2);font-size:15px}
.ps-row:first-child{border-top:0;padding-top:0}
.ps-row span{color:var(--mute)}
.ps-row b{display:flex;align-items:center;text-align:right}
.ps-err{margin-top:10px;color:var(--bad);font-weight:650;font-size:14.5px}
.ps-change{display:inline-block;margin-top:12px;color:var(--mute);font-size:14px;text-decoration:underline;text-underline-offset:3px}
.pay-box fieldset{border:0}
.pay-box legend{font-weight:750;font-size:17px;margin-bottom:12px}
.presets{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}
.pre{position:relative;cursor:pointer}
.pre input{position:absolute;opacity:0}
.pre span{display:flex;flex-direction:column;gap:2px;padding:14px;border-radius:15px;border:1px solid var(--line2);background:rgba(255,255,255,.03);transition:all .2s;height:100%}
.pre b{font-size:19px}
.pre small{color:var(--mute);font-size:13px}
.pre:hover span{border-color:rgba(255,255,255,.26)}
.pre input:checked+span{border-color:var(--acc);background:linear-gradient(180deg,rgba(61,220,132,.13),rgba(255,122,69,.05));box-shadow:0 0 0 3px rgba(61,220,132,.12)}
.pre input:focus-visible+span{outline:2px solid var(--acc);outline-offset:2px}
.own-fld{margin-top:12px}
.pay-total{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin:20px 0 16px;padding:16px 18px;border-radius:16px;background:rgba(0,0,0,.28)}
.pay-total span{color:var(--mute);font-weight:650}
.pay-total b{font-size:28px;margin-left:auto}
.pay-total small{width:100%;text-align:right;color:var(--mint);font-weight:650}
.pay-notes{list-style:none;display:grid;gap:10px;margin-top:18px;color:var(--mute);font-size:14px}
.pay-notes li{display:flex;gap:10px}
.pay-notes li>span{flex:1}
.pay-notes .i{width:18px;height:18px;color:var(--acc);margin-top:2px}
.pay-notes a{color:var(--acc);text-decoration:underline}
.soon{display:flex;gap:16px;align-items:flex-start}
.soon h2{font-size:20px;margin-bottom:6px}
.soon p{color:var(--mute)}
.iban{margin-top:20px}
.iban h2{font-size:20px;margin-bottom:8px}
.iban>p{color:var(--mute);margin-bottom:14px}
.req{display:grid;gap:0;border-radius:16px;border:1px solid var(--line);overflow:hidden;margin:6px 0 14px}
.req>div{display:grid;grid-template-columns:minmax(150px,.8fr) 1.4fr auto;gap:12px;align-items:center;padding:12px 16px;border-top:1px solid var(--line);background:rgba(255,255,255,.015)}
.req>div:first-child{border-top:0}
.req dt{color:var(--mute);font-size:14px}
.req dd{font-weight:650;overflow-wrap:anywhere}
.req dd a{color:var(--acc)}
.req .cp{padding:7px 10px;border-radius:10px;border:1px solid var(--line2);background:rgba(255,255,255,.05);cursor:pointer;display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700}
.req .cp .i{width:15px;height:15px}

/* ---------- «дякуємо» ---------- */
.thx-in{position:relative;z-index:1;max-width:640px}
.thx-card{text-align:center;padding:40px 28px;border-radius:30px;background:linear-gradient(180deg,#151b24,#0e1218);border:1px solid var(--line2)}
.thx-card .lead{margin:12px auto 22px}
.thx-ic{display:grid;place-items:center;height:96px;margin-bottom:6px}
.spin{width:64px;height:64px;border-radius:50%;border:4px solid rgba(255,255,255,.08);border-top-color:var(--acc);border-right-color:var(--acc2);animation:spin .9s linear infinite}
.thx-site{text-align:left;margin:0 auto 22px;max-width:420px}
.thx-b{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:18px}
.thx-card[data-t-state=fail] .spin{animation:none;border-color:rgba(61,220,132,.4)}

/* ---------- юридичні сторінки ---------- */
.legal-pg{padding:46px 0 20px}
.legal-in{display:grid;grid-template-columns:250px minmax(0,1fr);gap:46px;align-items:start}
.legal-side{position:sticky;top:90px;display:grid;gap:14px;max-height:calc(100vh - 110px);overflow:auto;scrollbar-width:thin}
.legal-docs{display:grid;gap:2px;padding:8px;border-radius:16px;background:var(--card);border:1px solid var(--line)}
.legal-docs a{padding:9px 12px;border-radius:10px;color:var(--mute);font-weight:650;font-size:14.5px}
.legal-docs a:hover{color:var(--text);background:rgba(255,255,255,.04)}
.legal-docs a[aria-current]{color:#fff;background:var(--accg)}
.legal-toc{padding:10px 12px;border-radius:16px;border:1px solid var(--line)}
.legal-toc summary{display:flex;justify-content:space-between;align-items:center;font-weight:750;font-size:14px;cursor:pointer;list-style:none;padding:4px}
.legal-toc summary::-webkit-details-marker{display:none}
.legal-toc summary .i{width:16px;height:16px;transition:transform .2s}
.legal-toc[open] summary .i{transform:rotate(180deg)}
.legal-toc ol{list-style:none;display:grid;gap:1px;margin-top:6px}
.legal-toc a{display:block;padding:5px 6px;border-radius:8px;color:var(--mute);font-size:13.5px;line-height:1.35}
.legal-toc a:hover,.legal-toc a.on{color:var(--text);background:rgba(255,255,255,.05)}
.legal{max-width:780px;font-size:16.5px;line-height:1.72;color:#d3dbe3}
.legal-h{margin-bottom:28px;padding-bottom:22px;border-bottom:1px solid var(--line)}
.legal-h h1{font-size:clamp(32px,4.4vw,48px);line-height:1.08;margin-bottom:10px;color:var(--text)}
.legal-date{color:var(--mute);font-size:14.5px;font-weight:650}
.legal-tbd{margin-top:12px;padding:10px 14px;border-radius:12px;background:rgba(61,220,132,.08);border:1px solid rgba(61,220,132,.3);color:#f3e2b0;font-size:14px}
.legal-lead{font-size:18px;color:#e3e9ef;margin-bottom:26px;padding:18px 20px;border-radius:16px;background:rgba(255,255,255,.03);border-left:3px solid var(--acc)}
.legal section{margin-bottom:30px;scroll-margin-top:90px}
.legal h2{font-size:23px;line-height:1.25;letter-spacing:-.01em;color:var(--text);margin-bottom:12px}
.legal h3{font-size:17px;margin:18px 0 6px;color:var(--text)}
.legal p{margin-bottom:11px}
.legal ul,.legal ol{padding-left:22px;margin:4px 0 12px;display:grid;gap:6px}
.legal a{color:var(--acc);text-decoration:underline;text-underline-offset:3px}
.legal b{color:var(--text)}
.legal .terms{display:grid;grid-template-columns:200px 1fr;gap:8px 18px;padding:16px 18px;border-radius:16px;background:rgba(255,255,255,.02);border:1px solid var(--line)}
.legal .terms dt{font-weight:750;color:var(--text)}
.legal .tbl{width:100%;border-collapse:collapse;margin:8px 0 14px;font-size:15px}
.legal .tbl th,.legal .tbl td{text-align:left;padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.legal .tbl th{color:var(--mute);font-weight:700;font-size:13.5px;text-transform:uppercase;letter-spacing:.06em}
.legal code{font-family:var(--mono);font-size:.9em;padding:2px 6px;border-radius:6px;background:rgba(255,255,255,.07)}
.legal-f{display:flex;gap:10px;flex-wrap:wrap;margin-top:34px;padding-top:22px;border-top:1px solid var(--line)}

/* ---------- копіювання: тост ---------- */
.toast{position:fixed;left:50%;bottom:24px;z-index:80;transform:translate(-50%,30px);opacity:0;padding:12px 18px;border-radius:14px;background:#1d2530;border:1px solid var(--line2);font-weight:700;font-size:14.5px;box-shadow:var(--sh);transition:opacity .25s,transform .25s;pointer-events:none;display:flex;gap:8px;align-items:center}
.toast.show{opacity:1;transform:translate(-50%,0)}
.toast .i{color:var(--mint);width:18px;height:18px;stroke-width:3}

/* ---------- адаптив ---------- */
@media (max-width:1080px){
  .nav{display:none}
  .hd-in>.hd-r{margin-left:auto}
  .hero-in{grid-template-columns:1fr;gap:34px}
  .hero-vis{max-width:640px;margin:0 auto;width:100%;padding-top:0}
  .mock{margin:0 auto}
  .bento{grid-template-columns:1fr 1fr}
  .bx-big,.bx:last-child{grid-column:1/-1}
  .ex-grid{grid-template-columns:repeat(2,1fr)}
  .price-grid,.ref,.new-in{grid-template-columns:1fr}
  .ft-grid{grid-template-columns:1fr 1fr}
  .legal-in{grid-template-columns:1fr;gap:20px}
  .legal-side{position:static;max-height:none}
  .legal-toc{display:none}
}
@media (max-width:760px){
  .wrap{padding:0 16px}
  .hd-in{height:62px;gap:12px}
  .hd-pay{display:none}
  .hero{padding:26px 0 48px}
  .hero-copy h1{font-size:clamp(34px,10vw,46px)}
  .chips{margin-bottom:14px}
  .chip{font-size:12.5px;padding:6px 11px}
  .wz{padding:16px 14px 18px}
  .wz-niches{grid-template-columns:repeat(2,1fr);gap:8px}
  .wz-niche{flex-direction:row;padding:11px 10px;gap:10px;text-align:left}
  .wz-ni{width:38px;height:38px;border-radius:11px}
  .wz-ni .i{width:20px;height:20px}
  .wz-q{font-size:19px}
  .sec{padding:72px 0}
  .sec-h{margin-bottom:30px}
  .sub{font-size:16.5px}
  .steps{grid-template-columns:1fr}
  .steps:before{left:49px;right:auto;top:30px;bottom:30px;width:2px;height:auto;background:linear-gradient(180deg,rgba(61,220,132,.6),rgba(40,190,160,.6))}
  .bento{grid-template-columns:1fr}
  .ex-grid{gap:10px}
  .ex-b{padding:10px 10px 12px;gap:9px;margin-top:-22px}
  .ex-ic{width:34px;height:34px;border-radius:10px}
  .ex-ic .i{width:17px;height:17px}
  .ex-t b{font-size:14.5px}
  .ex-t small{display:none}
  .ex-go{display:none}
  .price{padding:28px 20px 22px}
  .price-num b{font-size:80px}
  .ref{padding:26px 20px}
  .topup-f,.ref-in{flex-direction:column}
  .faq summary{padding:17px 16px;font-size:16px}
  .faq details>div{padding:0 16px 18px}
  .final{padding:54px 18px;border-radius:26px}
  .ft{padding-bottom:100px}
  .ft-grid{grid-template-columns:1fr;gap:24px}
  .done-grid,.pay-grid{grid-template-columns:1fr}
  .pay-site{position:static}
  .done-id b{font-size:52px}
  .dc{padding:20px 16px}
  .req>div{grid-template-columns:1fr auto;gap:2px 10px}
  .req dt{grid-column:1/-1}
  .legal .terms{grid-template-columns:1fr;gap:2px}
  .legal .terms dd{margin-bottom:10px}
  .legal{font-size:16px}
  .legal .tbl{font-size:14px}
  .legal .tbl th,.legal .tbl td{padding:9px 6px}
  .consent{bottom:84px}
}
@media (max-width:380px){
  .wz-nl{font-size:12.5px}
  .logo-t{display:none}
}
@media (min-width:761px){.mbar{display:none}}
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js .reveal{opacity:1;transform:none}
  .mk-ticket,.mk-toast,.vb-ticket,.vt-msg,.va-ok{opacity:1}
  .mk-slots .pick,.vb-slots .pick{background:var(--acc);color:#fff}
  .va-line{stroke-dashoffset:0}
  .done-badge .i{stroke-dashoffset:0}
}
@media print{
  body{background:#fff;color:#000}
  .hd,.ft,.legal-side,.legal-f,.consent,.mbar,.aurora,.skip{display:none!important}
  .legal-in{display:block}
  .legal,.legal b,.legal h1,.legal h2,.legal h3,.legal .terms dt{color:#000}
  .legal a{color:#000}
  .legal-lead,.legal .terms{background:none;border-color:#999}
  .tbd{color:#000}
}

/* ---------- v2: лендинг за макетом (зелений, світлі й темні секції) ---------- */
h1 em,h2 em{background:none;-webkit-background-clip:initial;background-clip:initial;color:var(--acc)}
.logo-m .i{width:21px;height:21px;color:#fff}
/* світла секція: перевизначаємо змінні — компоненти беруть їх самі */
.lt{--card:#fff;--card2:#fff;--text:#0f1f17;--mute:#56665e;--dim:#7b8a82;--line:rgba(16,50,30,.09);--line2:rgba(16,50,30,.16);--acc:#13894a;background:#f4f8f5;color:var(--text)}
.lt2{background:#fff}
.lt h2,.lt h3{color:var(--text)}
.lt .ticks li,.lt .faq details>div{color:#34443c}
.lt .faq details{box-shadow:0 1px 0 rgba(16,50,30,.04)}
.lt .price{background:linear-gradient(180deg,#f1faf4,#fff);border-color:rgba(19,137,74,.28);box-shadow:0 30px 70px -40px rgba(19,137,74,.45)}
.lt .price:before{background:radial-gradient(600px 240px at 80% -10%,rgba(61,220,132,.16),transparent 60%)}
.lt .topup-f input,.lt .ref-in input{background:#f4f8f5}
.lt .calc input[type=range]{background:linear-gradient(90deg,var(--acc) var(--p,18%),rgba(16,50,30,.12) var(--p,18%))}
.lt .btn-ghost{background:#fff;color:var(--text);border-color:var(--line2)}
.lt .btn-ghost:hover{background:#eef5f0}
.lt .price-day{background:rgba(19,137,74,.1);color:#13894a}
.lt .ticks .i{background:rgba(19,137,74,.12);color:#13894a}
.dk{background:#0b1a13}
.sec.dk{padding:96px 0}
#druzi{background:#fff;padding-top:0}
#druzi .ref{background:linear-gradient(135deg,#0f2a1d,#0b1a13);color:#eef2f6}
#druzi .ref .sub{color:#a9bdb2}

/* hero */
.h2o{position:relative;overflow:hidden;isolation:isolate;background:#06100b;border-radius:0 0 36px 36px}
.h2o-bg{position:absolute;inset:-3%;z-index:-2;background-size:cover;background-position:center;opacity:.42;filter:saturate(.85);animation:kb2 26s ease-in-out infinite alternate}
@keyframes kb2{to{transform:scale(1.07) translate(-1%,-1%)}}
.h2o:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(5,14,9,.96) 0%,rgba(5,14,9,.82) 45%,rgba(5,14,9,.45) 100%),linear-gradient(0deg,rgba(5,14,9,.9),transparent 40%)}
.h2o-in{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:40px;align-items:center;padding-top:64px;padding-bottom:64px}
.pill-g{display:inline-block;padding:7px 14px;border-radius:99px;background:rgba(61,220,132,.12);border:1px solid rgba(61,220,132,.35);color:#7ff0b0;font-weight:700;font-size:13.5px;margin-bottom:20px}
.h2o h1{font-size:clamp(40px,6vw,70px);line-height:1.02}
.h2o .lead{margin:20px 0 28px;color:#d3ddd7}
.h2o-fine{color:#8fa79a;font-size:13.5px;margin-top:12px}
.h2o-facts{list-style:none;display:flex;flex-wrap:wrap;gap:22px;margin-top:34px}
.h2o-facts li{display:flex;gap:10px;align-items:center;color:#a9bdb2;font-size:13px}
.h2o-facts .i{width:36px;height:36px;padding:8px;border-radius:11px;background:rgba(61,220,132,.12);color:var(--acc)}
.h2o-facts b{display:block;color:#fff;font-size:15px}
.h2o-vis{position:relative;display:flex;justify-content:center;min-height:540px;align-items:center}
/* телефон */
.ph{position:relative;width:270px;border-radius:44px;padding:11px;background:#0d0f12;box-shadow:0 0 0 2px #2a2f36,0 40px 80px -30px rgba(0,0,0,.85);flex:none}
.ph:before{content:"";position:absolute;top:19px;left:50%;width:84px;height:24px;margin-left:-42px;border-radius:14px;background:#000;z-index:2}
.ph-scr{border-radius:34px;overflow:hidden;background:#fff;color:#14231b;min-height:520px;font-size:12px}
.ph-hero{animation:floaty 7s ease-in-out infinite}
@keyframes floaty{50%{transform:translateY(-10px)}}
.ph-cover{height:150px;background-size:cover;background-position:center}
.ph-body{padding:14px 16px 18px}
.ph-title{display:block;font-size:17px}
.ph-sub{color:#6b7a72}
.ph-h{margin:14px 0 6px;font-weight:800;font-size:12.5px;display:flex;justify-content:space-between}
.ph-h small{color:#6b7a72;font-weight:600}
.ph-row{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid #edf1ee}
.ph-row b{color:#13894a}
.ph-slots{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.ph-slots span{text-align:center;padding:7px 0;border-radius:9px;border:1px solid #e1e8e3;font-weight:700}
.ph-slots .on{background:#1aa35a;border-color:#1aa35a;color:#fff}
.ph-btn{display:block;margin-top:14px;text-align:center;padding:11px;border-radius:12px;background:#1aa35a;color:#fff;font-weight:800}
.tg-card{position:absolute;right:-6px;top:70px;width:230px;padding:14px 16px;border-radius:18px;background:#fff;color:#14231b;box-shadow:0 30px 60px -20px rgba(0,0,0,.6);transform:rotate(4deg);animation:pop2 .9s .6s both cubic-bezier(.2,1.4,.4,1)}
@keyframes pop2{from{opacity:0;transform:translateY(20px) rotate(4deg) scale(.9)}}
.tg-card b{display:block;font-size:15px;margin:6px 0 4px}
.tg-card p{color:#4d5c54;font-size:12.5px;line-height:1.5}
.tg-h{display:flex;align-items:center;gap:7px;color:#6b7a72;font-size:12px;font-weight:600}
.tg-ic{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#2aa3e0;color:#fff}
.tg-ic .i{width:12px;height:12px}
.hand{position:absolute;right:-28px;top:262px;color:#cfe9da;font:italic 600 15px/1.25 "Segoe Print","Bradley Hand","Marker Felt",cursive;transform:rotate(-6deg);opacity:.9}
/* майстер на темній смузі */
.wz-band{position:relative;padding:72px 0;background:#0b1a13}
.wz-in{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:40px;align-items:center}
.wz-band .sub{color:#a9bdb2}
/* проблема */
.pr-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:40px;align-items:center}
.pr-pill{display:inline-flex;align-items:center;gap:10px;margin-top:24px;padding:15px 20px;border-radius:15px;background:#0f2a1d;color:#fff;font-weight:750}
.pr-pill .i{color:var(--acc);background:#163d29;border-radius:50%;padding:3px;width:22px;height:22px}
.pr-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.pr-c{background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px 18px;box-shadow:0 20px 40px -32px rgba(16,50,30,.35)}
.pr-ic{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:#e8f6ee;color:#13894a;margin-bottom:14px}
.pr-c h3{font-size:16.5px;margin-bottom:6px}
.pr-c p{color:var(--mute);font-size:14px}
/* три кроки */
.st3{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.st3 li{display:flex;flex-direction:column;align-items:center;gap:22px;padding:24px 18px 0;border-radius:24px;background:#f4f8f5;overflow:hidden}
.st3-h{display:flex;gap:14px;align-self:stretch}
.st3-n{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#1aa35a;color:#fff;font-weight:850;flex:none}
.st3-h h3{font-size:17px;margin-bottom:4px}
.st3-h p{color:var(--mute);font-size:14px}
.ph-sm{width:230px;border-radius:38px;margin-bottom:-120px}
.ph-sm .ph-scr{min-height:400px;border-radius:29px;padding:44px 14px 14px}
.mini-h{display:flex;align-items:center;gap:6px;font-weight:800;margin-bottom:10px}
.mini-h .i{width:16px;height:16px;color:#13894a}
.mini-t{display:block;font-size:15px;margin-bottom:10px}
.mini-opt{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;border:1px solid #edf1ee;margin-bottom:6px;font-weight:600}
.mini-opt .i{width:15px;height:15px;color:#13894a}
.mini-opt.on{background:#e8f6ee;border-color:#1aa35a}
.mini-f{border:1px solid #e1e8e3;border-radius:10px;padding:8px 10px;margin-bottom:8px}
.mini-f small{display:block;color:#6b7a72;font-size:10.5px}
.mini-f span{font-weight:700}
.ph-dark{background:linear-gradient(180deg,#183a2a,#0b1a13);color:#fff}
.lock-t{text-align:center;font-size:46px;font-weight:300;letter-spacing:-.02em;margin:18px 0 22px}
.lock-t small{display:block;font-size:12px;color:#bfd3c8;font-weight:500;letter-spacing:0}
.tg-in{position:relative;right:auto;top:auto;width:auto;transform:none;animation:none;margin-bottom:8px;background:rgba(255,255,255,.92)}
.tg-2{opacity:.85}
/* ніші */
.dk .sub{color:#a9bdb2}
.ng{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.ng-c{position:relative;display:block;aspect-ratio:4/3.1;border-radius:20px;overflow:hidden;background:#13261c;isolation:isolate;transition:transform .3s,box-shadow .3s}
.ng-c img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.ng-c:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 35%,rgba(4,12,8,.92))}
.ng-c:hover{transform:translateY(-4px);box-shadow:0 26px 50px -24px rgba(0,0,0,.9)}
.ng-c:hover img{transform:scale(1.07)}
.ng-t{position:absolute;left:16px;right:48px;bottom:14px;color:#fff}
.ng-t b{display:block;font-size:16.5px}
.ng-t small{display:block;color:#c3d6cb;font-size:12.5px;line-height:1.35}
.ng-go{position:absolute;right:14px;bottom:16px;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:rgba(61,220,132,.2);color:var(--acc)}
.ng-go .i{width:16px;height:16px}
/* telegram */
.tgs{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:48px;align-items:center}
.tgs-vis{display:flex;justify-content:center;padding:30px;border-radius:30px;background:radial-gradient(circle at 50% 30%,#e3f4ea,#f4f8f5 70%)}
.tgs-vis .ph-sm{margin-bottom:0}
.ph-tilt{transform:rotate(-4deg)}
.tgs-f{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:26px}
.tgs-f li{display:flex;align-items:center;gap:12px;font-weight:700;font-size:15px}
.tgs-f .i{width:40px;height:40px;padding:10px;border-radius:12px;background:#e8f6ee;color:#13894a}
/* фінал */
.sec-last.dk{padding:80px 0}
.dk .final{background:linear-gradient(135deg,#123526,#0b1a13);border-color:rgba(61,220,132,.25)}

@media (max-width:1080px){
  .ng{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pr-grid,.wz-in,.tgs{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:860px){
  .h2o-in{grid-template-columns:minmax(0,1fr);padding-top:40px;padding-bottom:40px}
  .h2o-vis{min-height:0;padding-top:10px}
  .st3{grid-template-columns:minmax(0,1fr)}
  .st3 li{max-width:440px;margin:0 auto;width:100%}
}
@media (max-width:640px){
  .h2o{border-radius:0 0 26px 26px}
  .h2o .btn-xl{width:100%}
  .h2o-facts{gap:14px 18px}
  .h2o-facts li{flex:1 1 40%}
  .ph{width:240px}.ph-scr{min-height:470px}
  .tg-card{width:200px;right:-4px;top:40px}
  .hand{display:none}
  .pr-cards{grid-template-columns:minmax(0,1fr)}
  .pr-c{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:14px}
  .pr-c .pr-ic{grid-row:span 2;margin:0}
  .ng{gap:10px}
  .ng-t{left:12px;right:12px;bottom:10px}.ng-t small,.ng-go{display:none}
  .tgs-f{grid-template-columns:minmax(0,1fr)}
  .wz-band,.sec.dk{padding:56px 0}
}
@media (prefers-reduced-motion:reduce){.h2o-bg,.ph-hero,.tg-card{animation:none}}

/* ---------- слайдер «Який у тебе бізнес?» ---------- */
.bz{position:relative;padding:64px 0 40px;background:#06100b;overflow:hidden}
.bz-h{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:24px}
.bz-h h2{color:#fff}
.bz-nav{display:flex;gap:10px}
.bz-a{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:#fff;cursor:pointer;transition:background .2s}
.bz-a:hover{background:rgba(61,220,132,.18)}
.bz-a[data-bz-prev] .i{transform:rotate(180deg)}
.bz-track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 max(20px,calc((100vw - 1180px)/2 + 20px));padding:0 max(20px,calc((100vw - 1180px)/2 + 20px)) 8px;scrollbar-width:none;-webkit-overflow-scrolling:touch;outline:none}
.bz-track::-webkit-scrollbar{display:none}
.bz-s{position:relative;flex:0 0 min(560px,86vw);aspect-ratio:4/4.3;border-radius:28px;overflow:hidden;scroll-snap-align:start;isolation:isolate;background:#13261c}
.bz-s img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.bz-s:hover img{transform:scale(1.05)}
.bz-s:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(4,12,8,.1) 20%,rgba(4,12,8,.55) 50%,rgba(4,12,8,.96) 100%)}
.bz-c{position:absolute;left:0;right:0;bottom:0;padding:24px;color:#fff}
.bz-tag{display:inline-flex;align-items:center;gap:8px;padding:7px 14px 7px 10px;border-radius:99px;background:#1aa35a;font-weight:800;font-size:15px;margin-bottom:14px}
.bz-tag .i{width:18px;height:18px}
.bz-t{display:block;font-size:20px;margin-bottom:10px}
.bz-l{list-style:none;display:grid;gap:8px;margin-bottom:18px;color:#d7e4dc;font-size:15px}
.bz-l li{display:flex;gap:9px;align-items:flex-start}
.bz-l .i{width:19px;height:19px;padding:3px;border-radius:6px;background:rgba(61,220,132,.2);color:var(--acc);flex:none;margin-top:1px}
.bz-b{display:flex;gap:10px;flex-wrap:wrap}
.bz-b .btn{white-space:normal;text-align:center}
.bz-b .btn-acc{flex:1 1 auto}
.bz-dots{display:flex;justify-content:center;gap:7px;margin-top:18px}
.bz-dots i{width:7px;height:7px;border-radius:9px;background:rgba(255,255,255,.25);transition:width .3s,background .3s}
.bz-dots i.on{width:22px;background:var(--acc)}
.bz-hint{display:none;text-align:center;color:#8fa79a;font-size:13px;margin-top:10px}
@media (max-width:760px){
  .bz{padding:44px 0 30px}
  .bz-nav{display:none}
  .bz-hint{display:block}
  .bz-s{aspect-ratio:auto;min-height:480px}
  .bz-c{padding:20px}
}
/* крок 3: картку Telegram видно повністю */
.st3 li:nth-child(3) .ph-scr{padding-top:40px}
.st3 li:nth-child(3) .lock-t{font-size:38px;margin:6px 0 12px}
.st3 li:nth-child(3) .tg-in{margin:0 2px}
.st3 li:nth-child(3) .tg-in p{color:#34443c}
.bz-s:after{background:linear-gradient(180deg,rgba(4,12,8,0) 0%,rgba(4,12,8,.15) 30%,rgba(4,12,8,.85) 55%,rgba(4,12,8,.97) 100%)}
@media (max-width:760px){.bz-s{min-height:580px}.bz-s img{height:62%;bottom:auto}}
.st3 li:nth-child(3) .tg-in{margin:4px 0 16px;box-shadow:0 14px 30px -12px rgba(0,0,0,.6)}
.st3 li:nth-child(3) .lock-t{margin:0}
/* телефон: після кнопки одразу список бізнесів */
@media (max-width:860px){
  .h2o-vis{display:none}
  .h2o-in{padding-bottom:28px}
  .h2o{border-radius:0}
  .bz{padding-top:28px}
  .h2o-facts{margin-top:24px}
}
.bz-more{display:inline-block;margin-top:12px;color:#9fe6bd;font-size:14px;font-weight:650;text-decoration:underline;text-underline-offset:3px}
.ft-grid{grid-template-columns:1.3fr 1fr 1.1fr 1fr 1.1fr}
@media (max-width:1080px){.ft-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.tr-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.tr-grid .pr-c a{color:#13894a;text-decoration:underline;text-underline-offset:3px}
@media (max-width:860px){.tr-grid{grid-template-columns:minmax(0,1fr)}.tr-grid .pr-c{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:14px}.tr-grid .pr-ic{grid-row:span 2;margin:0}}
/* кнопка «Поповнити баланс» у шапці — видно завжди */
.hd-pay2{padding:10px 14px;gap:8px;border-color:rgba(61,220,132,.35);color:#cdeedb}
.hd-pay2 .i{width:18px;height:18px;color:var(--acc)}
.hd-pay2:hover{background:rgba(61,220,132,.12)}
@media (max-width:760px){
  .hd-in{gap:10px}
  .hd-r{gap:8px;margin-left:auto}
  .hd-pay2{padding:10px;border-radius:12px}
  .hd-pay2 span{display:none}
  .hd .btn-acc.btn-sm{padding:10px 13px;font-size:14px}
}
@media (max-width:380px){.logo-t{display:none}}
/* сторінки ніш і каталог */
.crumbs{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:13.5px;color:#9fb6a8;margin-bottom:16px}
.crumbs a{color:#cdeedb;text-decoration:underline;text-underline-offset:3px}
.crumbs-lt{color:var(--mute)}.crumbs-lt a{color:#13894a}
.nh .pill-g .i{width:16px;height:16px;vertical-align:-3px}
.nh-in{grid-template-columns:minmax(0,1fr);max-width:900px}
.nh-cta{display:flex;flex-wrap:wrap;gap:12px}
.nh-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:start}
.nh-svc{list-style:none;background:#fff;border:1px solid var(--line);border-radius:22px;padding:6px 20px;box-shadow:0 20px 40px -32px rgba(16,50,30,.35)}
.nh-svc li{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid #edf1ee}
.nh-svc li:last-child{border-bottom:0}
.nh-svc b{display:block;font-size:15.5px}.nh-svc small{color:var(--mute);font-size:13px}
.nh-svc em{font-style:normal;font-weight:800;color:#13894a;white-space:nowrap}
.nh-ex{margin-top:24px;text-align:center}
.nh-other{margin-top:22px;color:#a9bdb2;font-size:14.5px;line-height:1.9}
.nh-other a{color:#cdeedb;text-decoration:underline;text-underline-offset:3px}
.nh-dark{color:#13894a}
.cat-top{padding-top:56px}
.cat-f{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 30px}
.cat-f a{padding:9px 14px;border-radius:99px;border:1px solid var(--line2);background:#fff;font-weight:650;font-size:14px}
.cat-f a.on{background:#1aa35a;border-color:#1aa35a;color:#fff}
.cat-city{font-size:22px;margin:26px 0 12px}
.cat-l{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.cat-l a{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:12px;align-items:center;padding:16px;border-radius:16px;background:#fff;border:1px solid var(--line);transition:border-color .2s,transform .2s}
.cat-l a:hover{border-color:#1aa35a;transform:translateY(-2px)}
.cat-l b{font-size:15.5px}.cat-l small{grid-column:2;color:var(--mute);font-size:13px}
.cat-ic{grid-row:span 2;display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:#e8f6ee;color:#13894a}
.cat-empty{padding:30px;border-radius:22px;background:#fff;border:1px dashed var(--line2);display:grid;gap:12px;justify-items:start}
.cat-note{margin-top:30px}
.cat-note a{color:#13894a}
@media (max-width:860px){.nh-two{grid-template-columns:minmax(0,1fr)}.cat-l{grid-template-columns:minmax(0,1fr)}.nh-cta .btn{width:100%}}
/* «Переказ здійснено» */
.claim{margin-top:20px;padding:18px;border-radius:18px;border:1px solid rgba(61,220,132,.3);background:rgba(61,220,132,.06);display:grid;gap:10px}
.claim h3{font-size:18px}
.claim label{font-size:13.5px;color:var(--mute);font-weight:600}
.claim input:not(.hp){padding:14px 16px;border-radius:13px;border:1px solid var(--line2);background:rgba(0,0,0,.25);font-size:16px}
.claim-msg{font-weight:700;font-size:14.5px;min-height:20px}.claim-msg.ok{color:var(--acc)}.claim-msg.bad{color:var(--bad)}