/* Vook v5: premium components, icons, backgrounds, motion polish */
:root{--eo:cubic-bezier(.23,1,.32,1);--eio:cubic-bezier(.77,0,.175,1)}

/* icons */
svg.i{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ic.shop{background:#e7f8ee;color:#0f9a55}.ic.up{background:var(--vi3);color:var(--vi)}.ic.hk{background:#fff3df;color:#c27c00}
.play svg.i{width:20px;height:20px;margin-left:2px}
.bi{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--ink);color:#fff;margin-bottom:16px;box-shadow:inset 0 -8px 16px rgba(106,77,255,.45)}
.bi svg.i{width:19px;height:19px}

/* reveal: shorter, stronger ease-out */
.js .r{transform:translate3d(0,16px,0);transition:opacity .7s var(--eo),transform .7s var(--eo)}
.js .r.in{opacity:1;transform:none}

/* press feedback on everything pressable */
.cta,.nbtn,.pbtn,.sbtn,.sticky,.burger,.tabs button,.billing button,.opts span,.faq summary,.more{transition:transform .16s var(--eo),background-color .2s ease,color .2s ease,box-shadow .25s ease,border-color .2s ease}
.cta:active,.nbtn:active,.pbtn:active,.sbtn:active,.sticky:active,.burger:active,.vk .vk-cta .elementor-button:active,.tabs button:active,.billing button:active,.opts span:active,.more:active{transform:scale(.97)!important}
.vk .vk-cta .elementor-button{transition:transform .16s var(--eo),box-shadow .25s ease,background-color .2s ease}
/* hover only where a real pointer exists */
@media(hover:none){.cta:hover,.nbtn:hover,.pbtn:hover,.sticky:hover,.stat:hover,.bx:hover,.wc:hover,.vk .vk-cta .elementor-button:hover,.oc:hover{transform:none;box-shadow:inherit}.wc:hover .vid img,.case:hover .cimg img{transform:none}}

/* sliding pill for tabs + billing */
.tabs,.billing{position:relative;isolation:isolate}
.tabs .pbg,.billing .pbg{position:absolute;top:5px;left:0;height:calc(100% - 10px);border-radius:999px;background:var(--ink);z-index:-1;transition:transform .45s var(--eo),width .45s var(--eo);will-change:transform}
.tabs.ready button.on,.billing.ready button.on{background:transparent}
.tabs button,.billing button{position:relative;z-index:1}
/* price crossfade */
.amt b{display:inline-block;transition:opacity .22s ease,filter .22s ease,transform .22s var(--eo)}
.amt b.swap{opacity:0;filter:blur(3px);transform:translate3d(0,6px,0)}

/* FAQ: smooth height (JS) */
.faq details>p{overflow:hidden}

/* image reveals */
.js .cimg,.js .wc .vid{clip-path:inset(12% 12% 12% 12% round 24px);transition:clip-path 1.1s var(--eio)}
.js .cimg.in,.js .wc .vid.in{clip-path:inset(0 0 0 0 round 0px)}
.js .wc .vid.in{clip-path:inset(0 0 0 0 round 18px)}

/* mobile menu items stagger */
.nav.open ul li{animation:mi .45s var(--eo) both}
.nav.open ul li:nth-child(2){animation-delay:.04s}.nav.open ul li:nth-child(3){animation-delay:.08s}.nav.open ul li:nth-child(4){animation-delay:.12s}.nav.open ul li:nth-child(5){animation-delay:.16s}.nav.open ul li:nth-child(6){animation-delay:.2s}
@keyframes mi{from{opacity:0;transform:translate3d(0,10px,0)}to{opacity:1;transform:none}}

/* ---------- backgrounds ---------- */
.hero4>*{position:relative;z-index:1}
.hero4:after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background-image:radial-gradient(rgba(13,13,16,.11) 1px,transparent 1.2px);background-size:24px 24px;-webkit-mask-image:radial-gradient(ellipse 60% 70% at 28% 35%,#000 20%,transparent 75%);mask-image:radial-gradient(ellipse 60% 70% at 28% 35%,#000 20%,transparent 75%)}
#results,#pricing,#cases{isolation:isolate}
#results:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(ellipse 60% 55% at 50% 45%,#000,transparent 75%);mask-image:radial-gradient(ellipse 60% 55% at 50% 45%,#000,transparent 75%)}
#pricing:before{content:'';position:absolute;left:50%;top:38%;width:min(900px,90vw);height:520px;transform:translateX(-50%);z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(106,77,255,.18),transparent)}
.sec.dark:after{content:'';position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(rgba(255,255,255,.08) 1px,transparent 1.2px);background-size:26px 26px;-webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 55%,#000,transparent 80%);mask-image:radial-gradient(ellipse 70% 60% at 50% 55%,#000,transparent 80%)}
.sec.dark>*{position:relative;z-index:1}
/* section eyebrow polish */
.eyebrow{box-shadow:0 1px 2px rgba(13,13,16,.04);background:#fff}
.dark .eyebrow,.final .eyebrow,.lside .eyebrow{background:rgba(255,255,255,.06)}

/* ---------- footer v5 ---------- */
.foot{padding:40px 0 0;position:relative;overflow:hidden}
.final{padding:120px 30px}
.final:after{content:'';position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(rgba(255,255,255,.09) 1px,transparent 1.2px);background-size:24px 24px;-webkit-mask-image:radial-gradient(ellipse 60% 70% at 50% 100%,#000,transparent 75%);mask-image:radial-gradient(ellipse 60% 70% at 50% 100%,#000,transparent 75%)}
.fgrid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;margin-top:72px;padding-bottom:40px;border-bottom:1px solid var(--line)}
.fbrand p{color:var(--mute);font-size:15px;margin-top:16px;max-width:320px}
.fmail{display:inline-block;margin-top:18px;font-weight:500;border-bottom:1px solid var(--line2);padding-bottom:2px;transition:border-color .2s,color .2s}
.fmail:hover{color:var(--vi);border-color:var(--vi)}
.fc h4{font:600 13px/1 var(--fb);letter-spacing:.06em;text-transform:uppercase;color:var(--mute2)}
.fc ul{margin-top:18px;display:flex;flex-direction:column;gap:12px;font-size:15px;color:var(--ink2)}
.fc a{position:relative;transition:color .2s}
.fc a:hover{color:var(--vi)}
.fb{padding:22px 0 0}
.bigword{font:600 clamp(120px,27vw,420px)/.8 var(--fh);letter-spacing:-.07em;text-align:center;margin-top:30px;color:transparent;background:linear-gradient(180deg,rgba(13,13,16,.09),rgba(13,13,16,0) 85%);-webkit-background-clip:text;background-clip:text;user-select:none;pointer-events:none;transform:translate3d(0,8%,0)}
.fl{display:none}

@media(max-width:1080px){.fgrid{grid-template-columns:1fr 1fr;gap:34px}.fbrand{grid-column:1/-1}}
@media(max-width:720px){.final{padding:84px 22px}.fgrid{margin-top:50px}.bi{width:36px;height:36px}.foot{padding-bottom:84px}}
@media(prefers-reduced-motion:reduce){.js .cimg,.js .wc .vid{clip-path:none;transition:none}.nav.open ul li{animation:none}}