
:root{--bg:#0a0914;--bg2:#100e20;--card:#15122b;--card2:#1b1738;--line:#27224a;--text:#f6f5fb;--muted:#a9a5c4;--dim:#7a7699;--purple:#8b6cff;--purple2:#6a45ff;--lime:#c9f26b;--paper:#f5f3fc;--ink:#14102b;--ink2:#53506f;
--sans:"Plus Jakarta Sans","Segoe UI",system-ui,-apple-system,Arial,sans-serif;--serif:"Instrument Serif",Georgia,"Times New Roman",serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.6 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}
:focus-visible{outline:3px solid var(--lime);outline-offset:3px;border-radius:8px}
h1,h2,h3,h4,p,ul,ol{margin-top:0}
h1{font-size:clamp(42px,6.2vw,92px);line-height:1.02;letter-spacing:-.045em;font-weight:700}
h2{font-size:clamp(32px,4.4vw,60px);line-height:1.06;letter-spacing:-.04em;font-weight:700;margin-bottom:14px}
h3{font-size:20px;line-height:1.25;letter-spacing:-.02em;margin-bottom:8px}
em{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.01em}
h1 em,h2 em{font-size:1.06em}
p{color:var(--muted)}
.wrap{max-width:1200px;margin:0 auto;padding:0 28px}
.skip{position:absolute;left:-9999px}.skip:focus{position:fixed;left:8px;top:8px;background:#fff;color:#000;z-index:200;padding:12px;border-radius:8px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* header + dock */
.top{position:absolute;top:0;left:0;right:0;z-index:30;display:flex;justify-content:center;padding-top:26px;pointer-events:none}
.logo{pointer-events:auto;font-size:25px;font-weight:800;letter-spacing:-.05em}.logo i{font-style:normal;color:var(--purple)}
.dock{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:60;display:flex;align-items:center;gap:2px;padding:7px;background:#0b0a16d9;border:1px solid #2e2955;border-radius:22px;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 18px 50px #000a}
.dock>a,.dock>button{border:0;background:none;padding:12px 20px;border-radius:16px;font-size:14.5px;font-weight:600;color:#d9d6ee;white-space:nowrap}
.dock>a:hover,.dock>button:hover,.dock>button[aria-expanded=true]{background:#241f48;color:#fff}
.dock>a[aria-current=page]{color:#fff;background:#1e1a3f}
.dock .go{background:linear-gradient(135deg,#7d5cff,#5a38f0);color:#fff;padding:12px 24px;box-shadow:0 8px 24px #6a45ff55}
.dock .go:hover{background:linear-gradient(135deg,#8d6fff,#6a45ff)}
.panel{position:fixed;left:50%;bottom:88px;transform:translateX(-50%);z-index:55;width:min(1040px,calc(100% - 24px));max-height:calc(100vh - 130px);overflow:auto;background:#0e0c1fef;border:1px solid #2e2955;border-radius:26px;padding:30px;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);box-shadow:0 30px 80px #000c}
.panel[hidden]{display:none}
.pgrid{display:grid;grid-template-columns:1fr 1fr 1fr 300px;gap:26px}
.pgrid h4,.pmore h4{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--purple);margin:0 0 10px}
.pgrid a.pi,.pmore a.pi{display:block;padding:9px 12px;margin:0 -12px;border-radius:12px;font-size:14.5px}
.pgrid a.pi:hover,.pmore a.pi:hover{background:#221d46}
.pi b{display:block;font-weight:600}.pi small{display:block;color:var(--dim);font-size:12.5px;line-height:1.4}
.pgrid .sol{background:linear-gradient(160deg,#241c52,#14112b);border:1px solid #352d6b;border-radius:18px;padding:18px}
.pgrid .sol a.pi{margin:0 -8px;padding:10px 8px}
.pmore{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:15px 28px;border-radius:999px;font-weight:600;font-size:15.5px;border:1px solid #3a3466;background:#ffffff0d;transition:.2s;white-space:nowrap}
.btn:hover{background:#ffffff1c;transform:translateY(-1px)}
.btn.p{background:linear-gradient(135deg,#7d5cff,#5a38f0);border-color:transparent;color:#fff;box-shadow:0 10px 30px #6a45ff55}
.btn.p:hover{background:linear-gradient(135deg,#8d6fff,#6a45ff)}
.btn.s{padding:11px 20px;font-size:14px}
.light .btn{border-color:#cfc9ea;background:#fff;color:var(--ink)}.light .btn.p{color:#fff;border-color:transparent}
.lk{font-weight:600;color:var(--purple);font-size:15px}.lk:hover{text-decoration:underline}
.acts{display:flex;gap:12px;flex-wrap:wrap}

/* hero */
.hero{position:relative;overflow:hidden;padding:150px 0 70px;text-align:center;background:radial-gradient(70% 80% at 50% -5%,#5b3cdc88,transparent 70%),radial-gradient(40% 50% at 85% 60%,#2a6bd633,transparent 70%),linear-gradient(180deg,#171040,#0a0914 90%)}
.hero:before{content:"";position:absolute;inset:0;background-image:radial-gradient(#ffffff22 1px,transparent 1px);background-size:26px 26px;opacity:.35;mask-image:linear-gradient(180deg,#000,transparent 80%);-webkit-mask-image:linear-gradient(180deg,#000,transparent 80%)}
.hero .wrap{position:relative}
.hero h1{max-width:1020px;margin:0 auto 22px}
.hero p.lead{font-size:clamp(17px,1.5vw,21px);max-width:660px;margin:0 auto 30px;color:#c9c5e3}
.hero .acts{justify-content:center}
.hero.sm{padding:140px 0 56px}.hero.sm h1{font-size:clamp(38px,5vw,70px)}
.hero.left{text-align:left}.hero.left h1,.hero.left p.lead{margin-left:0}
.split-hero{display:grid;grid-template-columns:1.15fr 1fr;gap:56px;align-items:center;text-align:left}
.split-hero h1{font-size:clamp(36px,4.6vw,66px);margin-left:0}.split-hero p.lead{margin-left:0}.split-hero .acts{justify-content:flex-start}
.pill{display:inline-flex;align-items:center;gap:8px;border:1px solid #4a3f8f;background:#ffffff0c;border-radius:999px;padding:7px 16px;font-size:13px;font-weight:600;color:#ddd5ff;margin-bottom:26px}
.pl{display:inline-block;border:1px solid #2f7a5c;background:#0f2a21;color:#7be3b0;border-radius:999px;padding:5px 14px;font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:18px}
.light .pl{background:#e6f6ee;border-color:#a9dcc3;color:#1c7a52}
.crumb{display:flex;gap:8px;font-size:13px;color:var(--dim);margin-bottom:22px;flex-wrap:wrap}.crumb a:hover{color:#fff}.crumb i{font-style:normal;opacity:.5}

/* marquee */
.marq{overflow:hidden;margin-top:62px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.mtrack{display:flex;gap:20px;width:max-content;animation:mq 80s linear infinite}
.marq:hover .mtrack{animation-play-state:paused}
@keyframes mq{to{transform:translateX(calc(-50% - 10px))}}
.mc{width:320px;flex:none;border-radius:26px;padding:18px;text-align:left;color:var(--ink)}
.mc small{display:block;margin-top:14px;font-size:13px;font-weight:700;opacity:.75}
.works{margin:46px auto 0;display:flex;gap:10px 22px;flex-wrap:wrap;justify-content:center;font-size:13px;color:var(--dim)}
.works b{color:#cfcbe8;font-weight:600}

/* sections */
.sec{padding:110px 0}.sec.light{background:var(--paper);color:var(--ink)}.sec.alt{background:var(--bg2)}
.light h2,.light h3{color:var(--ink)}.light p{color:var(--ink2)}
.sh{text-align:center;max-width:760px;margin:0 auto 60px}.sh p{font-size:18px;margin:0}
.sh.l{text-align:left;margin-left:0}

/* mock UI */
.mk{background:#fff;border-radius:14px;box-shadow:0 14px 34px #14102b26;overflow:hidden;color:var(--ink);font-size:10px;text-align:left}
.mt{display:flex;gap:4px;padding:9px 11px;background:#f3f1fa}.mt i{width:6px;height:6px;border-radius:50%;background:#cfc9e6}
.mb{padding:15px}
.ln{display:block;height:7px;border-radius:4px;background:#e6e3f1;margin-bottom:7px}.ln.d{background:#2a2545;height:10px}.ln.p{background:#a58bff}.ln.w{background:#ffffffcc}
.bt{display:inline-block;height:16px;width:62px;border-radius:9px;background:#6a45ff;margin-top:4px}.bt.sm{width:34px;height:11px}
.cl3{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:12px}.cl3 s{display:block;height:38px;border-radius:8px;background:#efeaff}
.fun{display:flex;align-items:center;gap:4px}.fs{flex:1;background:#f4f2fa;border-radius:8px;padding:9px}.fs em{font-family:var(--sans);font-style:normal;font-weight:700;font-size:9px;display:block;margin-bottom:7px}.ar{font-style:normal;color:#6a45ff;font-weight:700;font-size:16px}
.kb{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.kb>div{background:#f4f2fa;border-radius:8px;padding:7px}.kb em{font-family:var(--sans);font-style:normal;font-weight:700;font-size:9px;display:block;margin-bottom:6px}.kb .c{background:#fff;border-radius:6px;padding:6px;margin-bottom:6px;box-shadow:0 1px 3px #14102b14}.kb .c .ln{margin-bottom:5px}
.bars{display:flex;align-items:end;gap:6px;height:84px;margin-top:12px}.bars.sm{height:48px}.bars i{flex:1;background:linear-gradient(#a58bff,#6a45ff);border-radius:4px 4px 0 0}
.cb{padding:9px 11px;border-radius:12px;background:#f1eefc;margin-bottom:7px;width:78%}.cb .ln:last-child{margin-bottom:0}.cb.me{margin-left:auto;background:#6a45ff}
.who2{display:flex;align-items:center;gap:8px;margin-bottom:8px}.who2 .ln{margin:0}
.av{display:inline-block;width:20px;height:20px;border-radius:50%;background:#ffc46b;flex:none}
.im{height:58px;border-radius:8px;background:linear-gradient(135deg,#cfe6ff,#e6dcff);margin:8px 0}
.dsh{display:flex;gap:12px;align-items:center}.dsh>div{flex:1}
.dn{display:block;width:64px;height:64px;border-radius:50%;flex:none;background:conic-gradient(#6a45ff 0 45%,#7be3b0 0 75%,#ffc46b 0);-webkit-mask:radial-gradient(circle,transparent 0 19px,#000 20px);mask:radial-gradient(circle,transparent 0 19px,#000 20px)}
.kp{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.kp>div{background:#f4f2fa;border-radius:8px;padding:9px}.kp em{font-family:var(--sans);font-style:normal;font-weight:700;font-size:9px;display:block;margin-bottom:8px}.kp .ln{margin:0}
.uis{display:grid;grid-template-columns:30% 1fr;gap:8px}.uil{background:#f4f2fa;border-radius:8px;padding:8px}.uic{display:grid;grid-template-columns:1fr 1fr;gap:6px}.uic s{display:block;height:36px;border-radius:8px;background:#efeaff;border:1.5px dashed #a58bff}
.sbar{display:flex;gap:8px;align-items:center;border:1.5px solid #e6e3f1;border-radius:20px;padding:6px 11px;margin-bottom:10px}.sbar .ln{margin:0}.sr1{margin-bottom:9px}
.nt{display:flex;gap:8px;align-items:center;padding:8px;border-radius:8px;background:#f4f2fa;margin-bottom:6px}.nt>div{flex:1}.nt .ln{margin-bottom:4px}.nt em{font-family:var(--sans);font-style:normal;font-size:8px;font-weight:700;background:#c9f0dd;color:#1f6a4c;padding:2px 7px;border-radius:8px}
.fl{display:flex;align-items:center;gap:6px}.fnode{flex:1;text-align:center;padding:12px 4px;border-radius:8px;background:#efeaff;font-weight:700;font-size:9px}.fnode:nth-child(3){background:#6a45ff;color:#fff}

/* service rows */
.svc{display:grid;grid-template-columns:1fr 1.2fr;gap:80px;align-items:center;padding:60px 0;border-top:1px solid #14102b1f}
.svc:first-child{border-top:0;padding-top:0}.svc.rev .st{order:2}
.svc h3{font-size:clamp(34px,4vw,56px);letter-spacing:-.045em;line-height:1.04;margin-bottom:16px;font-weight:700}
.svc p{font-size:18px;max-width:480px}
.chips{display:flex;flex-wrap:wrap;gap:9px;margin:24px 0 28px}
.chip{padding:9px 17px;border:1px solid #cfc9ea;border-radius:999px;font-size:14px;font-weight:600;background:#fff;color:var(--ink);transition:.15s}.chip:hover{border-color:var(--purple2);color:var(--purple2);transform:translateY(-1px)}
.pv{border-radius:34px;padding:46px;display:grid;align-content:center;min-height:430px;overflow:hidden}
.pv .mk{width:86%}.pv .mk:nth-child(2){margin-left:auto;margin-top:-36px;box-shadow:0 22px 50px #14102b33}

/* flow */
.flow{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);counter-reset:f}
.flow li{position:relative;text-align:center;padding:0 12px}
.flow li:not(:first-child):before{content:"";position:absolute;top:34px;right:50%;width:100%;border-top:2px dashed #4b4390}
.dot{position:relative;z-index:1;width:68px;height:68px;margin:0 auto 18px;border-radius:50%;display:grid;place-items:center;font:700 15px ui-monospace,Consolas,monospace;color:#fff;border:1px solid #ffffff33}
.flow li:nth-child(1) .dot{background:linear-gradient(145deg,#7d5cff,#3b2a9a)}.flow li:nth-child(2) .dot{background:linear-gradient(145deg,#3a8bff,#1d3f99)}.flow li:nth-child(3) .dot{background:linear-gradient(145deg,#26c28c,#0f6a50)}.flow li:nth-child(4) .dot{background:linear-gradient(145deg,#ffa23a,#a1560f)}.flow li:nth-child(5) .dot{background:linear-gradient(145deg,#ff5fa0,#9a2058)}
.flow b{display:block;font-size:18px}.flow small{color:var(--muted);font-size:14px}
.fbar{margin:44px auto 0;max-width:760px;border:1px dashed #4b4390;border-radius:18px;padding:16px 24px;text-align:center;color:#d8d3ee}.fbar b{color:var(--lime)}

/* cases (stacked) */
.cases{display:grid;gap:28px}
.case{position:sticky;top:calc(92px + var(--i)*24px);display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:center;border-radius:36px;padding:46px;color:var(--ink);box-shadow:0 20px 50px #14102b1a}
.case .k{font-family:var(--serif);font-style:italic;font-size:22px}
.case h3{font-size:clamp(26px,3vw,38px);letter-spacing:-.035em;margin:8px 0 12px;color:var(--ink)}
.case p{color:#14102bbb;margin-bottom:20px;font-size:17px}
.tags{display:flex;gap:8px;flex-wrap:wrap}.tags span{background:#ffffffb5;border-radius:999px;padding:7px 14px;font-size:13px;font-weight:600}
.cv{border-radius:26px;background:#ffffff80;padding:34px;display:grid;align-content:center;min-height:300px}.cv .mk{width:92%}.cv .mk+.mk{margin:-22px 0 0 auto}

/* plans */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.plan{display:flex;flex-direction:column;padding:38px 32px 32px;border-radius:30px;border:1px solid #ffffff1c}
.plan:nth-child(1){background:linear-gradient(170deg,#2f2373,#14102f 70%)}.plan:nth-child(2){background:linear-gradient(170deg,#0f4a47,#0d1a26 70%)}.plan:nth-child(3){background:linear-gradient(170deg,#5a3418,#1a1224 70%)}
.plan .tg{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#ffffffaa}
.plan h3{font-size:25px;margin:8px 0 12px;color:#fff}
.plan .pr{font-size:54px;font-weight:700;letter-spacing:-.045em;line-height:1;margin:14px 0 4px;color:#fff}.plan .md{font-size:13px;color:#ffffffa0;margin-bottom:22px}
.plan .ln2{color:#ffffffd0;font-size:15.5px;margin-bottom:22px}
.plan ul{list-style:none;padding:0;margin:0 0 28px}.plan li{position:relative;padding:10px 0 10px 30px;border-top:1px solid #ffffff1c;font-size:15px;color:#ffffffe0}
.plan li:before,.tick li:before{content:"";position:absolute;left:5px;top:15px;width:6px;height:11px;border:solid var(--lime);border-width:0 2px 2px 0;transform:rotate(40deg) scale(.85)}
.plan .foot{margin-top:auto;display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.plan .lk{color:#fff;opacity:.85}

/* why tiles */
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.tile{border-radius:28px;padding:30px;min-height:260px;display:flex;flex-direction:column}
.tile:nth-child(1){background:#e3dcff}.tile:nth-child(2){background:#d3f2e3}.tile:nth-child(3){background:#ffe3bf}.tile:nth-child(4){background:#d4e7ff}
.tile .n{font:700 13px ui-monospace,Consolas,monospace;color:#14102b99;margin-bottom:auto}
.tile h3{font-size:24px;letter-spacing:-.035em;color:var(--ink);margin:40px 0 10px}.tile p{margin:0;font-size:15.5px;color:#14102bcc}

/* bands */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.band{border-radius:32px;padding:46px;border:1px solid #ffffff1a;display:flex;flex-direction:column;align-items:flex-start}
.band:nth-child(1){background:linear-gradient(150deg,#2b2070,#120f2a)}.band:nth-child(2){background:linear-gradient(150deg,#12404a,#0e1226)}
.band h2{font-size:clamp(28px,3vw,42px);color:#fff}.band p{color:#ffffffc4;font-size:17px;margin-bottom:26px;max-width:460px}
.cta{border-radius:40px;padding:84px 30px;text-align:center;background:radial-gradient(60% 90% at 50% 0%,#6a45ff,transparent 70%),linear-gradient(160deg,#241a66,#0f0c26);border:1px solid #4a3f9f;position:relative;overflow:hidden}
.cta h2{font-size:clamp(36px,5.4vw,76px);max-width:820px;margin:0 auto 16px}.cta p{font-size:19px;max-width:520px;margin:0 auto 30px;color:#d6d1f0}.cta .acts{justify-content:center}

/* faq */
.faq{max-width:860px;margin:0 auto}.faq details{border-bottom:1px solid #14102b22}
.faq summary{list-style:none;padding:24px 44px 24px 0;font-weight:600;font-size:19px;position:relative;cursor:pointer;color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:"+";position:absolute;right:4px;top:18px;font-size:30px;font-weight:300;color:var(--purple2)}.faq details[open] summary:after{content:"–"}
.faq p{margin:0 0 26px;font-size:17px;max-width:720px;color:var(--ink2)}

/* options (service pages) */
.catbar{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;margin:0 0 36px;scrollbar-width:none}.catbar::-webkit-scrollbar{display:none}
.catbar a{flex:none;padding:9px 17px;border:1px solid #cfc9ea;border-radius:999px;font-size:13.5px;font-weight:600;background:#fff;color:var(--ink2)}.catbar a:hover{border-color:var(--purple2);color:var(--purple2)}.catbar a[aria-current=page]{background:var(--ink);border-color:var(--ink);color:#fff}
.lay{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:48px;align-items:start}
.grp{margin-bottom:46px;scroll-margin-top:100px}.grp>h3{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--purple2);margin-bottom:6px;display:flex;align-items:center;gap:14px}.grp>h3:after{content:"";flex:1;height:1px;background:#14102b1f}
.grp>.gi{font-size:15.5px;margin:0 0 16px}
.opt{display:grid;grid-template-columns:minmax(0,1fr) 150px auto;gap:26px;align-items:center;padding:26px 28px;margin-bottom:12px;background:#fff;border-radius:22px;box-shadow:0 2px 0 #14102b0d,0 14px 34px #14102b0f;transition:.2s}
.opt:hover{transform:translateY(-2px);box-shadow:0 2px 0 #14102b0d,0 20px 44px #14102b1c}
.opt h3{font-size:19px;margin-bottom:6px;color:var(--ink)}.opt p{font-size:14.5px;line-height:1.55;margin:0;color:var(--ink2)}
.pr2{text-align:right;line-height:1.2}.pr2 .k{display:inline-block;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;padding:3px 10px;border-radius:999px;margin-bottom:8px}
.pr2.fixed .k{background:#d6f5e6;color:#12704a}.pr2.from .k{background:#e5ddff;color:#4b2fc0}.pr2.custom .k{background:#ffe8c7;color:#8a5200}
.pr2 b{display:block;font-size:28px;letter-spacing:-.04em;color:var(--ink)}.pr2 .u{font-size:12.5px;color:var(--ink2)}
.aside{position:sticky;top:96px;display:grid;gap:18px}
.side{background:#fff;border-radius:24px;padding:28px;box-shadow:0 14px 34px #14102b0f}.side h3{font-size:19px}.side p{font-size:15px}
.side.dk{background:linear-gradient(160deg,#2b2070,#14102f);color:#fff}.side.dk h3{color:#fff}.side.dk p{color:#ffffffbb}
.lg{list-style:none;padding:0;margin:0;display:grid;gap:13px;font-size:14px;color:var(--ink2)}.lg b{display:block;color:var(--ink)}
.snav{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 30px}
.note2{background:#fff;border-radius:24px;padding:26px 30px;margin-top:10px;box-shadow:0 14px 34px #14102b0f}.note2 h3{font-size:17px}.note2 p{margin:0;font-size:15.5px;color:var(--ink2)}

/* detail blocks */
.two{display:grid;grid-template-columns:1fr 1fr;gap:20px}.three{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.box{background:#fff;border-radius:26px;padding:32px;box-shadow:0 14px 34px #14102b0f}.box h3{font-size:21px;color:var(--ink)}.box p{font-size:16px;color:var(--ink2)}
.tick{list-style:none;padding:0;margin:0}.tick li{position:relative;padding:11px 0 11px 30px;border-top:1px solid #14102b17;font-size:15.5px;color:var(--ink2)}.tick li:first-child{border-top:0}.tick li:before{border-color:var(--purple2);top:16px}
.rows{background:#fff;border-radius:26px;overflow:hidden;box-shadow:0 14px 34px #14102b0f}
.rows div{display:grid;grid-template-columns:220px 1fr;gap:24px;padding:20px 30px;border-top:1px solid #14102b14;font-size:15.5px}.rows div:first-child{border-top:0}
.rows b{color:var(--ink)}.rows span{color:var(--ink2)}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}.steps>div{padding-top:22px;border-top:3px solid var(--purple2)}.steps .n{font:700 13px ui-monospace,Consolas,monospace;color:var(--purple2)}.steps h3{margin-top:10px;color:var(--ink)}.steps p{font-size:15px;margin:0}
.sec:not(.light) .steps>div{border-color:var(--purple)}.sec:not(.light) .steps h3{color:#fff}.sec:not(.light) .steps .n{color:var(--purple)}
.mile{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.mile>div{border-radius:24px;padding:28px;background:#fff;box-shadow:0 14px 34px #14102b0f}.mile b{display:block;font-size:34px;letter-spacing:-.04em;color:var(--ink)}.mile span{font-size:14px;color:var(--ink2)}
.price-card{background:linear-gradient(155deg,#2c2074,#14102f 70%);border:1px solid #4a3f9f;border-radius:30px;padding:34px}
.price-card .tg{font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:#cdbfff}.price-card .big{font-size:58px;font-weight:700;letter-spacing:-.05em;line-height:1.05;margin:10px 0 2px}.price-card p{font-size:15px;color:#cfcaea}.price-card .btn{width:100%;margin-top:10px}

/* forms */
.fgrid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:48px;align-items:start}
.fld{display:block;margin:0 0 20px}.fld>span{display:block;font-size:14px;font-weight:600;margin-bottom:8px;color:var(--ink)}.fld>span i{font-style:normal;font-weight:400;color:#8a86a8}
input:not([type=checkbox]),select,textarea{width:100%;background:#fff;border:1.5px solid #d9d4ee;border-radius:14px;padding:14px 16px;font-size:16px;color:var(--ink)}
input:focus,select:focus,textarea:focus{border-color:var(--purple2);outline:none;box-shadow:0 0 0 4px #6a45ff22}
textarea{min-height:140px;resize:vertical}
.fld.bad input,.fld.bad textarea{border-color:#e5484d}.er{display:none;color:#c42b30;font-size:13.5px;margin-top:6px}.bad .er{display:block}
.fit{background:#fff;border:1.5px solid #e1dcf3;border-radius:18px;padding:18px 20px;margin-bottom:22px}.fit p{margin:0 0 12px;font-size:15px}
.ck{display:flex;gap:12px;align-items:flex-start;font-size:15px;color:var(--ink2);margin:0}.ck input{margin-top:5px;accent-color:var(--purple2)}
.done{background:linear-gradient(155deg,#2c2074,#14102f);border:1px solid #4a3f9f;border-radius:30px;padding:38px;margin-top:30px;color:#fff}.done h2{font-size:34px;color:#fff}.done p{color:#d3cef0}
.nx{list-style:none;margin:0;padding:0;counter-reset:n}.nx li{position:relative;padding:0 0 18px 42px;font-size:15.5px;color:var(--ink2);counter-increment:n}.nx li:before{content:counter(n);position:absolute;left:0;top:-2px;width:28px;height:28px;border-radius:50%;border:1.5px solid var(--purple2);color:var(--purple2);font-size:13px;font-weight:700;display:grid;place-items:center}
.done .nx li{color:#e4e0f8}.done .nx li:before{border-color:#a58bff;color:#c9b8ff}

/* footer */
.ft{background:#07060f;padding:90px 0 130px;border-top:1px solid var(--line)}
.fcols{display:grid;grid-template-columns:1.6fr 1.5fr 1fr 1fr;gap:40px}
.ft h4{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--purple);margin-bottom:14px}
.ft a{display:block;padding:5px 0;font-size:14.5px;color:var(--muted)}.ft a:hover{color:#fff}
.ft .cc{columns:2;column-gap:20px}
.ft small{display:block;margin-top:56px;padding-top:26px;border-top:1px solid var(--line);color:var(--dim);font-size:13px}

/* responsive */
@media(max-width:1000px){
 .sec{padding:76px 0}.hero{padding:130px 0 56px}
 .split-hero,.svc,.case,.lay,.fgrid,.two,.duo{grid-template-columns:1fr}
 .svc{gap:30px;padding:44px 0}.svc.rev .st{order:0}.split-hero{gap:34px}
 .plans,.tiles,.three,.mile{grid-template-columns:1fr 1fr}.steps{grid-template-columns:1fr 1fr}
 .flow{grid-template-columns:1fr;gap:26px}.flow li{display:flex;gap:18px;text-align:left;align-items:center;padding:0}.flow li:not(:first-child):before{top:-26px;right:auto;left:33px;width:0;height:26px;border-top:0;border-left:2px dashed #4b4390}.dot{margin:0;flex:none}
 .case{position:static}.aside{position:static}.pgrid{grid-template-columns:1fr 1fr}.pgrid .sol{grid-column:1/-1}.pmore{grid-template-columns:1fr 1fr}
 .fcols{grid-template-columns:1fr 1fr}.rows div{grid-template-columns:1fr;gap:4px}
}
@media(max-width:700px){
 .wrap{padding:0 20px}.plans,.tiles,.three,.mile,.steps{grid-template-columns:1fr}
 .opt{grid-template-columns:1fr;gap:14px}.pr2{text-align:left;display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}.pr2 .k{margin:0}
 .dock{bottom:12px;gap:0;padding:5px}.dock>a,.dock>button{padding:11px 13px;font-size:13.5px}.dock .go{padding:11px 16px}.dock .hm{display:none}
 .panel{bottom:76px;padding:22px}.pgrid,.pmore{grid-template-columns:1fr}
 .fcols{grid-template-columns:1fr}.band,.case{padding:30px}.pv{padding:26px;min-height:320px}.cta{padding:58px 22px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}.marq{overflow-x:auto}}
/* ===== v9 additions ===== */
.tr{padding:54px 0}.tr .tl{text-align:center;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin:0 0 26px;font-weight:700}
.logos2{display:flex;flex-wrap:wrap;gap:16px 46px;justify-content:center;align-items:center}
.logos2 span{font-size:20px;color:#8f8bb0;font-weight:700;letter-spacing:-.02em}.logos2 span:nth-child(2n){font-family:var(--serif);font-style:italic;font-weight:400;font-size:25px}.logos2 span:nth-child(3n){letter-spacing:.12em;text-transform:uppercase;font-size:15px}
.stats2{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:46px;border-top:1px solid var(--line)}
.stats2>div{padding:30px 10px 4px;text-align:center;border-left:1px solid var(--line)}.stats2>div:first-child{border-left:0}
.stats2 b{display:block;font-size:clamp(34px,4vw,54px);letter-spacing:-.045em;line-height:1.05;background:linear-gradient(135deg,#fff,#b9a6ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.stats2 span{font-size:14.5px;color:var(--muted)}
.ind{display:grid;grid-template-columns:repeat(6,1fr);gap:18px}
.ic{display:flex;flex-direction:column;padding:32px;border-radius:28px;background:linear-gradient(170deg,#18142f,#100e22);border:1px solid var(--line);border-top:4px solid var(--c);transition:.2s}
.ic:hover{transform:translateY(-4px);border-color:var(--c)}
.ind .ic{grid-column:span 2}.ind .ic:nth-child(n+4){grid-column:span 3}
.ic h3{font-size:23px;letter-spacing:-.035em;color:#fff}.ic p{font-size:15.5px;margin-bottom:12px}.ic .we{color:#d9d6ee}.ic .we b{color:var(--c);margin-right:4px}.ic .lk{margin-top:auto;padding-top:8px}
.case{color:var(--ink);transition:.25s}a.case:hover{transform:translateY(-4px)}
.case .rd{display:inline-block;margin-top:24px;font-weight:700;color:var(--ink)}
.appr{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.ap{border-radius:28px;padding:32px;min-height:230px;display:flex;flex-direction:column;transition:.2s}.ap:hover{transform:translateY(-4px)}
.ap .n{font:700 13px ui-monospace,Consolas,monospace;color:#14102b99;margin-bottom:auto}.ap h3{font-size:26px;letter-spacing:-.04em;color:var(--ink);margin:30px 0 8px}.ap p{margin:0;color:#14102bcc;font-size:15.5px;min-height:50px}
.qc{border-radius:28px;padding:34px;background:linear-gradient(165deg,#1d1840,#12102a);border:1px solid #2f2960;display:flex;flex-direction:column;min-height:300px}
.qc .qm{font-family:var(--serif);font-size:70px;line-height:.6;color:var(--purple);height:34px}
.qc p{font-size:18px;line-height:1.5;color:#ece9fb;margin:12px 0 26px}
.qw{display:flex;gap:14px;align-items:center;margin-top:auto}.qw b{display:block;font-size:15px;color:#fff}.qw small{color:var(--muted);font-size:13px}
.av2{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#7d5cff,#3a8bff);font-weight:700;font-size:14px;color:#fff}
.cols2{columns:2;column-gap:46px}.cols2 li{break-inside:avoid}
.rel{display:block;transition:.2s}.rel:hover{transform:translateY(-3px)}.rel p{margin-bottom:14px}
.snap{display:grid;grid-template-columns:repeat(4,1fr);gap:0;background:#fff;border-radius:24px;box-shadow:0 14px 34px #14102b0f;overflow:hidden}
.snap>div{padding:24px 28px;border-left:1px solid #14102b14}.snap>div:first-child{border-left:0}.snap span{display:block;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#7a7699;margin-bottom:4px;font-weight:700}.snap b{font-size:16px;color:var(--ink)}
.cstat h3{font-size:clamp(30px,4vw,54px)}
.cmpt{background:#fff;border-radius:28px;overflow:hidden;box-shadow:0 14px 34px #14102b0f}
.cmpt .ch,.cmpt .cr{display:grid;grid-template-columns:200px repeat(3,1fr);gap:18px;padding:22px 32px;align-items:start}
.cmpt .ch{background:linear-gradient(120deg,#2b2070,#14102f);color:#fff;font-weight:700;font-size:15.5px}
.cmpt .cr{border-top:1px solid #14102b14;font-size:15.5px;color:var(--ink2)}.cmpt .cr b{color:var(--ink)}
@media(max-width:1000px){.ind{grid-template-columns:1fr 1fr}.ind .ic,.ind .ic:nth-child(n+4){grid-column:auto}.appr{grid-template-columns:1fr 1fr}.snap{grid-template-columns:1fr 1fr}.snap>div:nth-child(3){border-left:0}.snap>div:nth-child(n+3){border-top:1px solid #14102b14}.cmpt .ch,.cmpt .cr{grid-template-columns:1fr;gap:6px;padding:18px 22px}.cmpt .ch span:first-child{display:none}.cols2{columns:1}}
@media(max-width:700px){.ind,.appr,.snap{grid-template-columns:1fr}.snap>div{border-left:0;border-top:1px solid #14102b14}.snap>div:first-child{border-top:0}.stats2{grid-template-columns:1fr 1fr}.stats2>div:nth-child(3){border-left:0}.stats2>div:nth-child(n+3){border-top:1px solid var(--line)}.logos2{gap:14px 28px}}

.sec.light+.sec.light{padding-top:24px}.sec.light+.sec.light .sh{margin-bottom:36px}

/* ===== v10 ===== */
.plan{position:relative}
.rib{position:absolute;top:24px;right:24px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:6px 12px;border-radius:999px;background:#ffffff22;color:#fff;border:1px solid #ffffff2e}
.plan .tg{display:block;padding-right:130px}
.cv2{margin:0 0 24px;padding:16px 18px;border-radius:18px;background:#0000003a;font-size:14px;line-height:1.5;color:#ffffffd6}
.cv2 b{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#ffffff9c;margin-bottom:2px}.cv2 div+div{margin-top:12px}
.hint{display:flex;gap:10px 26px;flex-wrap:wrap;justify-content:center;margin:0 auto 38px;padding:14px 24px;max-width:900px;border:1px solid #3a3470;border-radius:999px;background:#ffffff08;font-size:14.5px;color:#dcd8f2}
.hint span{position:relative;padding-left:22px}.hint span:before{content:"";position:absolute;left:3px;top:5px;width:5px;height:10px;border:solid var(--lime);border-width:0 2px 2px 0;transform:rotate(40deg)}
.price-card .pcn{font-size:13.5px;color:#cfcaea;margin:0 0 8px;padding:12px 14px;border-radius:14px;background:#00000030}
.rv{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}.rv.in{opacity:1;transform:none}
@media(max-width:900px){.dock .hm{display:none}}
@media(max-width:700px){.hint{border-radius:22px;justify-content:flex-start}.plan .tg{padding-right:0;margin-top:28px}}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}}

/* ===== v11: motion graphics + pricing box ===== */
.arw{display:inline-block;transition:transform .25s ease}a:hover .arw,.btn:hover .arw{transform:translateX(5px)}
.btn .ci{width:32px;height:32px;margin:-6px -14px -6px 4px;border-radius:50%;background:#fff;color:#5a38f0;display:inline-grid;place-items:center;font-size:16px;transition:transform .25s}.btn.p:hover .ci{transform:translateX(3px) rotate(-45deg)}

/* live enquiry strip */
.live{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;margin:48px auto 0;max-width:1120px}
.lc{display:flex;align-items:center;gap:12px;padding:12px 20px 12px 12px;border-radius:18px;background:#16122e;border:1px solid #3a3470;text-align:left;animation:lit 8s ease-in-out infinite}
.lc .li{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#7d5cff,#3a8bff);flex:none}
.lc.c2 .li{background:linear-gradient(135deg,#ffa23a,#ff5fa0)}.lc.c3 .li{background:linear-gradient(135deg,#26c28c,#3a8bff)}.lc.c4 .li{background:linear-gradient(135deg,#c9f26b,#26c28c);color:#10300f}
.lc b{display:block;font-size:14px}.lc small{display:block;color:#a9a5c4;font-size:12px}
.lc.c1{animation-delay:0s}.lc.c2{animation-delay:2s}.lc.c3{animation-delay:4s}.lc.c4{animation-delay:6s}
@keyframes lit{0%,22%{border-color:#8b6cff;background:#261e58;box-shadow:0 0 0 5px #8b6cff26,0 14px 40px #6a45ff55;transform:translateY(-3px)}30%,100%{border-color:#3a3470;background:#16122e;box-shadow:none;transform:none}}
.la{position:relative;width:62px;height:2px;margin:0 8px;background:repeating-linear-gradient(90deg,#7a68e0 0 7px,transparent 7px 13px);background-size:13px 2px;animation:dashm .9s linear infinite}
.la:after{content:"";position:absolute;right:-1px;top:-4px;width:9px;height:9px;border:solid #8b6cff;border-width:2px 2px 0 0;transform:rotate(45deg)}
.la:before{content:"";position:absolute;top:-3px;left:0;width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 12px var(--lime);animation:tr 8s ease-in-out infinite}
.la.a1:before{animation-delay:1s}.la.a2:before{animation-delay:3s}.la.a3:before{animation-delay:5s}
@keyframes tr{0%{left:0;opacity:0}3%{opacity:1}20%{left:calc(100% - 8px);opacity:1}24%,100%{left:calc(100% - 8px);opacity:0}}
@keyframes dashm{to{background-position:13px 0}}

/* animated flow (how it comes together) */
.flow li:not(:first-child):before{border-top:0;height:2px;background:repeating-linear-gradient(90deg,#7a68e0 0 7px,transparent 7px 13px);background-size:13px 2px;animation:dashm .9s linear infinite}
.flow li:not(:first-child):after{content:"";position:absolute;top:30px;left:-50%;width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 12px var(--lime);animation:fdot 7s linear infinite}
.flow li:nth-child(2):after{animation-delay:0s}.flow li:nth-child(3):after{animation-delay:1.4s}.flow li:nth-child(4):after{animation-delay:2.8s}.flow li:nth-child(5):after{animation-delay:4.2s}
@keyframes fdot{0%{left:-50%;opacity:0}4%{opacity:1}16%{left:calc(50% - 42px);opacity:1}20%,100%{left:calc(50% - 42px);opacity:0}}
.flow .dot{animation:npulse 7s ease-in-out infinite}
.flow li:nth-child(1) .dot{animation-delay:0s}.flow li:nth-child(2) .dot{animation-delay:1.1s}.flow li:nth-child(3) .dot{animation-delay:2.5s}.flow li:nth-child(4) .dot{animation-delay:3.9s}.flow li:nth-child(5) .dot{animation-delay:5.3s}
.flow li:not(:first-child) .dot:before{content:"";position:absolute;left:-15px;top:50%;width:9px;height:9px;border:solid #8b6cff;border-width:2px 2px 0 0;transform:translateY(-50%) rotate(45deg)}
@keyframes npulse{0%,14%{box-shadow:0 0 0 9px #8b6cff2e,0 0 34px #8b6cff99;transform:scale(1.08)}22%,100%{box-shadow:none;transform:none}}

/* timeline (zenesen-style) */
.tml{position:relative;max-width:1040px;margin:0 auto;padding:4px 0}
.tl-line{position:absolute;left:50%;top:0;bottom:0;width:4px;margin-left:-2px;border-radius:4px;background:#ffffff1c}
.tl-line i{position:absolute;left:0;top:0;width:100%;height:calc(var(--p,0)*100%);background:linear-gradient(#a58bff,#5a38f0);border-radius:4px;box-shadow:0 0 18px #8b6cffaa}
.ts{position:relative;width:calc(50% - 58px);margin-bottom:72px}.ts:last-child{margin-bottom:0}
.ts.r{margin-left:calc(50% + 58px)}.ts.l{text-align:right}
.tdot{position:absolute;top:6px;width:18px;height:18px;border-radius:50%;background:#2b2660;border:3px solid var(--bg);transition:.4s}
.ts.l .tdot{right:-69px}.ts.r .tdot{left:-69px}
.ts.on .tdot{background:#a58bff;box-shadow:0 0 0 7px #8b6cff33}
.tsn{display:block;font-size:12.5px;font-weight:700;letter-spacing:.14em;color:#a58bff;margin-bottom:6px}
.ts h3{font-size:clamp(24px,2.6vw,34px);letter-spacing:-.035em;margin-bottom:8px}.ts p{margin:0 0 22px;font-size:16.5px}
.tsc{height:230px;border-radius:28px;position:relative;overflow:hidden;background:radial-gradient(70% 90% at 80% 0%,#6a3dff,transparent 60%),linear-gradient(160deg,#1d1450,#07060f);border:1px solid #ffffff17}
.light .tl-line{background:#14102b1a}.light .tdot{border-color:var(--paper);background:#cfc9ea}.light .ts.on .tdot{background:#6a45ff}.light .ts h3{color:var(--ink)}.light .ts p{color:var(--ink2)}.light .tsn{color:#6a45ff}
.sc{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:6px}
.gc{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,#ffffff2e,#ffffff0d);border:1px solid #ffffff3d;backdrop-filter:blur(6px);animation:gpulse 4s ease-in-out infinite}
.gc.big{width:92px;height:92px;animation-delay:1.6s}
@keyframes gpulse{0%,100%{box-shadow:0 0 0 0 #8b6cff00}50%{box-shadow:0 0 0 12px #8b6cff2b,0 0 34px #8b6cff77}}
.sca{width:130px;height:64px;margin:0 -2px;align-self:flex-start;margin-top:40px}
.sca .sp,.rar .sp{stroke-dasharray:140;stroke-dashoffset:140;animation:draw 4s ease-in-out infinite}
.sca .sh2,.rar .sh2{opacity:0;animation:headin 4s ease-in-out infinite}
@keyframes draw{0%{stroke-dashoffset:140}35%,82%{stroke-dashoffset:0}100%{stroke-dashoffset:-140}}
@keyframes headin{0%,30%{opacity:0}38%,82%{opacity:1}92%,100%{opacity:0}}
.cur{position:absolute;right:22%;bottom:24%;animation:curm 4s ease-in-out infinite}
@keyframes curm{0%{transform:translate(-34px,24px)}40%{transform:translate(0,0)}48%{transform:scale(.86)}58%,100%{transform:translate(0,0)}}
.tagp{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);font-size:12px;font-weight:700;padding:5px 12px;border-radius:999px;background:#c9f26b;color:#10300f;animation:tagp 4s ease-in-out infinite}
@keyframes tagp{0%,40%{opacity:0;transform:translate(-50%,8px)}55%,88%{opacity:1;transform:translate(-50%,0)}100%{opacity:0}}
.sc4{gap:0}.pillg{position:absolute;left:12%;top:50%;transform:translateY(-50%);display:flex;gap:8px;padding:8px;border-radius:999px;background:#ffffff14;border:1px solid #ffffff2e}.pillg .gc{width:54px;height:54px}
.rbars{position:absolute;right:12%;bottom:30px;display:flex;align-items:flex-end;gap:7px;height:110px}.rbars i{width:14px;border-radius:5px 5px 0 0;background:linear-gradient(#8b6cff,#4a2fd0);transform-origin:bottom;animation:rb 4s ease-in-out infinite}
.rbars i:nth-child(1){height:34px}.rbars i:nth-child(2){height:50px;animation-delay:.1s}.rbars i:nth-child(3){height:44px;animation-delay:.2s}.rbars i:nth-child(4){height:76px;animation-delay:.3s}.rbars i:nth-child(5){height:100px;animation-delay:.4s}
@keyframes rb{0%,8%{transform:scaleY(.1)}40%,86%{transform:scaleY(1)}100%{transform:scaleY(.1)}}
.rar{position:absolute;right:9%;bottom:34px;width:150px;height:96px}

/* animated mock UIs */
.bars i{transform-origin:bottom;animation:gr 5s ease-in-out infinite}
.bars i:nth-child(2){animation-delay:.1s}.bars i:nth-child(3){animation-delay:.2s}.bars i:nth-child(4){animation-delay:.3s}.bars i:nth-child(5){animation-delay:.4s}.bars i:nth-child(6){animation-delay:.5s}.bars i:nth-child(7){animation-delay:.6s}
@keyframes gr{0%,8%{transform:scaleY(.12)}38%,86%{transform:scaleY(1)}100%{transform:scaleY(.12)}}
.fun .fs{animation:fsl 6s ease-in-out infinite}.fun .fs:nth-child(3){animation-delay:2s}.fun .fs:nth-child(5){animation-delay:4s}
@keyframes fsl{0%,26%{background:#e6dcff;box-shadow:0 0 0 2px #6a45ff66}34%,100%{background:#f4f2fa;box-shadow:none}}
.kb .c.mv{position:relative;z-index:3;animation:mvc 7s ease-in-out infinite;box-shadow:0 6px 16px #6a45ff44}
@keyframes mvc{0%,12%{transform:none}30%,42%{transform:translateX(calc(100% + 18px))}60%,74%{transform:translateX(calc(200% + 36px))}86%{opacity:1;transform:translateX(calc(200% + 36px))}87%{opacity:0;transform:none}100%{opacity:1;transform:none}}
.cb:not(.ty){animation:popb 7s ease-in-out infinite}.cb:nth-child(2){animation-delay:1s}.cb:nth-child(3){animation-delay:2.2s}
@keyframes popb{0%,3%{opacity:0;transform:translateY(8px)}10%,88%{opacity:1;transform:none}98%,100%{opacity:0}}
.cb.ty{display:flex;gap:4px;width:56px;padding:12px 14px}.cb.ty i{width:6px;height:6px;border-radius:50%;background:#8b6cff;animation:tyd 1.2s infinite}.cb.ty i:nth-child(2){animation-delay:.15s}.cb.ty i:nth-child(3){animation-delay:.3s}
@keyframes tyd{0%,60%,100%{transform:none;opacity:.4}30%{transform:translateY(-4px);opacity:1}}
.dn{animation:spinm 16s linear infinite}@keyframes spinm{to{transform:rotate(360deg)}}
.nt{animation:nsl 6s ease-in-out infinite}.nt:nth-child(2){animation-delay:.9s}.nt:nth-child(3){animation-delay:1.8s}
@keyframes nsl{0%,4%{opacity:0;transform:translateX(18px)}12%,88%{opacity:1;transform:none}98%,100%{opacity:0}}
.fl .fnode{animation:fpl 5s ease-in-out infinite}.fl .fnode:nth-child(3){animation-delay:1.2s}.fl .fnode:nth-child(5){animation-delay:2.4s}
@keyframes fpl{0%,20%{transform:scale(1.07);box-shadow:0 0 0 3px #6a45ff44}30%,100%{transform:none;box-shadow:none}}

/* pricing box */
.pbox{border-radius:38px;border:1px solid #3d3578;background:linear-gradient(170deg,#18143c,#0c0a20);padding:22px;box-shadow:0 30px 80px #000a,inset 0 1px 0 #ffffff10}
.ptabs{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;padding:6px;margin:0 auto 24px;width:fit-content;max-width:100%;background:#08071a;border:1px solid #2c2755;border-radius:999px}
.pt{border:0;background:none;padding:13px 24px;border-radius:999px;font-weight:600;font-size:15px;color:#b9b5d6;white-space:nowrap}
.pt:hover{color:#fff}.pt[aria-selected=true]{background:linear-gradient(135deg,#7d5cff,#5a38f0);color:#fff;box-shadow:0 8px 22px #6a45ff55}
.pp{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:22px;align-items:stretch}.pp[hidden]{display:none}
.pc1{position:relative;display:flex;flex-direction:column;border-radius:28px;padding:36px 32px 30px;border:1px solid #ffffff1c}
.pc1-0{background:linear-gradient(170deg,#32257a,#15112f 75%)}.pc1-1{background:linear-gradient(170deg,#10504b,#0d1a26 75%)}.pc1-2{background:linear-gradient(170deg,#5d371a,#1a1224 75%)}.pc1-3{background:linear-gradient(170deg,#1c3a73,#0e1428 75%)}
.pc1 .rib{position:absolute;top:24px;right:24px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:6px 12px;border-radius:999px;background:#ffffff22;border:1px solid #ffffff2e;color:#fff}
.pc1 .tg{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#ffffffaa;padding-right:120px}
.pc1 h3{font-size:26px;color:#fff;margin:8px 0 6px}.pc1 .pr{font-size:60px;font-weight:700;letter-spacing:-.05em;line-height:1;margin:14px 0 4px;color:#fff}.pc1 .md{font-size:13.5px;color:#ffffffa8;margin-bottom:18px}
.pc1 p{color:#ffffffd0;font-size:16px}.pc1 .foot{margin-top:auto;display:flex;flex-direction:column;gap:14px;align-items:flex-start}.pc1 .lk{color:#fff;opacity:.9}
.pc2{border-radius:28px;padding:34px 36px;background:#ffffff08;border:1px solid #ffffff14}
.pc2 h4{font-size:12px;letter-spacing:.13em;text-transform:uppercase;color:#a58bff;margin:0 0 10px}.pc2 h4:not(:first-child){margin-top:26px}
.pc2 .sm{font-size:14.5px;margin:0 0 10px}
.pbox .tick li{color:#e1defa;border-color:#ffffff17;font-size:15px}.pbox .tick li:before{border-color:var(--lime)}
.pbox .chips{margin:0}.pbox .chip{background:#ffffff0d;border-color:#ffffff24;color:#e6e3fb;font-weight:500;font-size:13.5px;cursor:default}.pbox .chip:hover{transform:none;color:#e6e3fb;border-color:#ffffff24}
.ms{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.ms>div{border-radius:16px;padding:14px 16px;background:#ffffff0c;border:1px solid #ffffff17}.ms b{display:block;font-size:22px;letter-spacing:-.03em}.ms span{font-size:12.5px;color:#b9b5d6}
.after{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.after span{padding:9px 16px;border-radius:999px;background:#ffffff10;border:1px solid #ffffff22;font-size:14px;font-weight:600}.after i{width:30px;height:2px;background:repeating-linear-gradient(90deg,#7a68e0 0 6px,transparent 6px 11px);background-size:11px 2px;animation:dashm .9s linear infinite;position:relative}.after i:after{content:"";position:absolute;right:-1px;top:-4px;width:8px;height:8px;border:solid #8b6cff;border-width:2px 2px 0 0;transform:rotate(45deg)}
.pfoot{margin-top:22px}.pfoot .hint{margin:0 auto;max-width:none;background:transparent;border:0;padding:6px 0 4px}
.svp{grid-column:1/-1}
.cpills{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-bottom:22px}
.cp{border:1px solid #ffffff26;background:#ffffff0a;color:#d6d2f0;padding:9px 17px;border-radius:999px;font-size:14px;font-weight:600}.cp:hover{border-color:#8b6cff}.cp[aria-selected=true]{background:#8b6cff;border-color:#8b6cff;color:#fff}
.ogrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.oc{display:flex;flex-direction:column;border-radius:22px;padding:24px;background:#ffffff0a;border:1px solid #ffffff17;transition:.2s}.oc:hover{border-color:#8b6cff;transform:translateY(-3px)}
.oc .ot{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;margin-bottom:8px}.oc .ot b{font-size:16.5px;letter-spacing:-.02em}
.ok{flex:none;font-size:10px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;padding:3px 9px;border-radius:999px}.ok.fixed{background:#16473a;color:#7be3b0}.ok.from{background:#2e2670;color:#c9b8ff}.ok.custom{background:#4a3414;color:#ffc979}
.oc p{font-size:14px;color:#b9b5d6;margin:0 0 16px;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.oc .ob{margin-top:auto;display:flex;justify-content:space-between;align-items:center;gap:10px}.oc strong{font-size:26px;letter-spacing:-.04em}.oc strong small{display:block;font-size:11.5px;font-weight:500;color:#9a96bb;letter-spacing:0}
.oc.more{justify-content:center;align-items:flex-start;gap:8px;border-style:dashed}.oc.more b{font-size:17px}
@media(max-width:1000px){.pp{grid-template-columns:minmax(0,1fr)}.ogrid{grid-template-columns:repeat(2,minmax(0,1fr))}.flow li:not(:first-child):after{display:none}.flow li:not(:first-child) .dot:before{display:none}}
@media(max-width:800px){.live{display:grid;grid-template-columns:1fr 1fr;gap:10px}.la{display:none}.lc{padding:10px 14px 10px 10px}
 .tl-line{left:15px;margin-left:0}.ts,.ts.r{width:auto;margin-left:46px}.ts.l{text-align:left}.ts.l .tdot,.ts.r .tdot{left:-40px;right:auto}.tsc{height:200px}}
@media(max-width:700px){.ogrid{grid-template-columns:minmax(0,1fr)}.pt{padding:11px 16px;font-size:14px}.ms{grid-template-columns:1fr}.pc1 .pr{font-size:50px}.pbox{padding:14px;border-radius:28px}.pc2,.pc1{padding:26px 22px}.pc1 .tg{padding-right:0;margin-top:30px}}

.svp,.oc,.pc1,.pc2{min-width:0}.oc .ot b{overflow-wrap:anywhere}
/* v40: self-hosted fonts (Latin + Latin Extended, from Google Fonts, SIL Open Font Licence). V44: headings and accent words use font-display:block (text waits briefly, then appears in the real font, never a visible switch); body text uses swap (never invisible; the size-matched backup keeps the switch tiny). Optional left the backup on screen for a whole visit on slow first loads */
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/inter-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/inter-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/inter-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/inter-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/inter-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/inter-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/inter-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/inter-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Playfair Display';font-style:italic;font-weight:500;font-display:block;src:url(/assets/fonts/playfair-display-i-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Playfair Display';font-style:italic;font-weight:500;font-display:block;src:url(/assets/fonts/playfair-display-i-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Playfair Display';font-style:italic;font-weight:600;font-display:block;src:url(/assets/fonts/playfair-display-i-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Playfair Display';font-style:italic;font-weight:600;font-display:block;src:url(/assets/fonts/playfair-display-i-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:500;font-display:block;src:url(/assets/fonts/poppins-latin-ext-500.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-weight:500;font-display:block;src:url(/assets/fonts/poppins-latin-500.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:block;src:url(/assets/fonts/poppins-latin-ext-600.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:block;src:url(/assets/fonts/poppins-latin-600.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:block;src:url(/assets/fonts/poppins-latin-ext-700.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:block;src:url(/assets/fonts/poppins-latin-700.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* ===== v12 ===== */
.vs{position:absolute;inset:0;width:100%;height:100%}
.vs *{transform-box:fill-box;transform-origin:center}
.vs .a-pop,.vs .a-type,.vs .a-drop,.vs .a-sl,.vs .a-sr,.vs .a-grow,.vs .a-dash,.vs .a-lit,.vs .a-travel,.vs .a-travelr,.vs .a-move,.vs .a-move2,.vs .a-scan,.vs .a-knob,.vs .a-fly,.vs .a-cursor,.vs .a-bounce,.vs .a-blink{animation-duration:7s;animation-iteration-count:infinite;animation-delay:var(--d,0s);animation-timing-function:ease-in-out;animation-fill-mode:backwards}
.a-pop{animation-name:vpop}.a-type{animation-name:vtype;transform-origin:left center!important}.a-drop{animation-name:vdrop}.a-sl{animation-name:vsl}.a-sr{animation-name:vsr}.a-grow{animation-name:vgrow;transform-origin:center bottom!important}
.a-dash{animation-name:vdash;stroke-dasharray:1;stroke-dashoffset:0}.a-lit{animation-name:vlit}.a-travel{animation-name:vtravel}.a-travelr{animation-name:vtravelr}.a-move{animation-name:vmove}.a-move2{animation-name:vmove2}.a-scan{animation-name:vscan}.a-knob{animation-name:vknob}.a-fly{animation-name:vfly}.a-cursor{animation-name:vcursor}.a-bounce{animation-name:vbounce;animation-duration:1.1s!important}.a-blink{animation-name:vblink;animation-duration:1s!important}
@keyframes vpop{0%{opacity:0;scale:.6}10%,82%{opacity:1;scale:1}94%,100%{opacity:0;scale:1}}
@keyframes vtype{0%,2%{scale:0 1;opacity:1}18%,82%{scale:1 1;opacity:1}94%,100%{scale:1 1;opacity:0}}
@keyframes vdrop{0%{opacity:0;translate:0 -22px}12%,82%{opacity:1;translate:0 0}94%,100%{opacity:0;translate:0 0}}
@keyframes vsl{0%{opacity:0;translate:-28px 0}12%,82%{opacity:1;translate:0 0}94%,100%{opacity:0;translate:0 0}}
@keyframes vsr{0%{opacity:0;translate:28px 0}12%,82%{opacity:1;translate:0 0}94%,100%{opacity:0;translate:0 0}}
@keyframes vgrow{0%,4%{scale:1 .04;opacity:1}24%,82%{scale:1 1;opacity:1}94%,100%{scale:1 1;opacity:0}}
@keyframes vdash{0%,6%{stroke-dashoffset:1;opacity:1}28%,82%{stroke-dashoffset:0;opacity:1}94%,100%{stroke-dashoffset:0;opacity:0}}
@keyframes vlit{0%,10%,100%{opacity:.55}20%,34%{opacity:1}}
@keyframes vtravel{0%,8%{translate:0 0;opacity:0}14%{opacity:1}56%{translate:var(--tx,100px) 0;opacity:1}64%,100%{translate:var(--tx,100px) 0;opacity:0}}
@keyframes vtravelr{0%,8%{translate:0 0;opacity:0}14%{opacity:1}56%{translate:calc(var(--tx,100px)*-1) 0;opacity:1}64%,100%{translate:calc(var(--tx,100px)*-1) 0;opacity:0}}
@keyframes vmove{0%,10%{translate:0 0;opacity:1}30%,42%{translate:var(--tx) 0}60%{translate:var(--tx) 0}90%{opacity:1}100%{translate:var(--tx) 0;opacity:0}}
@keyframes vmove2{0%,50%{translate:0 0;opacity:0}56%{opacity:1}76%,90%{translate:var(--tx) 0;opacity:1}100%{translate:var(--tx) 0;opacity:0}}
@keyframes vscan{0%,6%{translate:0 0}50%{translate:var(--tx) var(--ty)}94%,100%{translate:0 0}}
@keyframes vknob{0%,4%{translate:0 0}30%,82%{translate:var(--tx) 0}100%{translate:var(--tx) 0}}
@keyframes vfly{0%,8%{translate:0 0;opacity:1}60%{translate:var(--tx) 0;opacity:1}72%,100%{translate:var(--tx) 0;opacity:0}}
@keyframes vcursor{0%,10%{translate:-40px 24px;opacity:0}20%{opacity:1}44%,70%{translate:0 0;opacity:1}90%,100%{translate:0 0;opacity:0}}
@keyframes vbounce{0%,60%,100%{translate:0 0;opacity:.45}30%{translate:0 -5px;opacity:1}}
@keyframes vblink{0%,50%{opacity:1}51%,100%{opacity:0}}
.tsc .vs{padding:6px}.tsc{height:230px}
body.still .vs *,body.still .ring6 *,body.still .tl-line i{animation:none!important}
body.still .vs .a-pop,body.still .vs .a-type,body.still .vs .a-drop,body.still .vs .a-sl,body.still .vs .a-sr,body.still .vs .a-grow,body.still .vs .a-dash,body.still .vs .a-lit,body.still .vs .a-fly,body.still .vs .a-cursor{opacity:1!important;scale:1!important;translate:none!important;stroke-dashoffset:0!important}
body.still .vs .a-travel,body.still .vs .a-travelr,body.still .vs .a-move2{opacity:0!important}
@media(prefers-reduced-motion:reduce){.vs *,.ring6 *{animation:none!important}.vs .a-pop,.vs .a-type,.vs .a-drop,.vs .a-sl,.vs .a-sr,.vs .a-grow,.vs .a-dash,.vs .a-lit,.vs .a-fly,.vs .a-cursor{opacity:1!important;scale:1!important;translate:none!important;stroke-dashoffset:0!important}.vs .a-travel,.vs .a-travelr,.vs .a-move2{opacity:0!important}}
.stillbtn{background:none;border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:8px 16px;font-size:13px;font-weight:600;margin-left:14px}.stillbtn:hover{color:#fff;border-color:var(--purple)}
/* labels for sample / illustrative content */
.smp{display:inline-flex;align-items:center;margin-left:10px;padding:4px 12px;border-radius:999px;font-size:11.5px;font-weight:700;letter-spacing:.04em;text-transform:none;color:#7a4b00;background:#ffe9b8;border:1px solid #f0c66b;vertical-align:middle}
.sec.alt .smp,.hero .smp,.sec:not(.light) .smp{color:#ffe9b8;background:#4a3600;border-color:#7a5a10}
.cap{max-width:760px;margin:-6px auto 28px;text-align:center;font-size:13.5px;color:var(--muted);font-style:italic}
.sec.light .cap{color:var(--ink2)}
/* hero A: capability tiles */
.hero.hA{padding:100px 0 52px}.hero.hA h1{max-width:1080px;font-size:clamp(38px,4.3vw,66px);margin-bottom:16px}.hero.hA .pill{margin-bottom:18px}.hero.hA p.lead{margin-bottom:22px}
.htiles{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;margin-top:34px}
.ht{display:block;border-radius:22px;padding:12px 12px 16px;text-align:left;background:linear-gradient(170deg,#1f1850,#100d28);border:1px solid #ffffff1c;transition:.25s}
.ht:hover{transform:translateY(-4px);border-color:#8b6cff;box-shadow:0 18px 44px #6a45ff44}
.ht-sc{position:relative;height:98px;border-radius:14px;overflow:hidden;background:radial-gradient(80% 90% at 80% 0%,#5a35e0aa,transparent 60%),#0c0a1f;margin-bottom:12px}
.ht b{display:block;font-size:15px;letter-spacing:-.02em;color:#fff}.ht small{display:block;font-size:12.5px;color:var(--muted);margin-top:2px}
/* hero B: ring */
.hring{display:grid;place-items:center;margin-right:-60px}.hring .ring6{width:min(100%,600px);height:auto}
.hero.hB{padding-bottom:70px}
/* hero C: route cards */
.hroutes{display:grid;gap:14px}.hr{display:grid;grid-template-columns:150px 1fr;gap:18px;align-items:center;border-radius:24px;padding:14px;background:linear-gradient(170deg,#241a5e,#110e2a);border:1px solid #ffffff1c;transition:.25s}
.hr:hover{transform:translateX(-4px);border-color:#8b6cff}.hr-sc{position:relative;height:96px;border-radius:16px;overflow:hidden;background:#0c0a1f}
.hr small{display:block;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#a58bff}.hr b{display:block;font-size:34px;letter-spacing:-.04em;line-height:1.1;color:#fff}.hr span{font-size:13px;color:var(--muted)}
/* 6G ring */
.ring6{display:block;max-width:100%;height:auto}
.ring6 .orb{transform-origin:230px 230px;animation:orbit 18s linear infinite}@keyframes orbit{to{transform:rotate(360deg)}}
.ring6 .rn{cursor:pointer}.ring6 .rnc{fill:#2a2068;stroke:#8b6cff;stroke-width:2;animation:rlit 12s ease-in-out infinite;animation-delay:var(--d)}
@keyframes rlit{0%,14%,100%{fill:#2a2068}6%{fill:#6a45ff}}
.ring6 .rn:hover .rnc,.ring6 .rn:focus .rnc{fill:#7d5cff}
.six-wrap{display:grid;grid-template-columns:1fr 1.1fr;gap:60px;align-items:center}
.ring-box{background:linear-gradient(170deg,#1c1550,#0a0914);border-radius:36px;padding:28px 20px 22px;text-align:center}.ring-box .ring6{margin:0 auto;width:min(100%,600px)}
.rn-cap{margin:6px 0 0;font-size:13.5px;color:var(--muted)}
.six{list-style:none;margin:0;padding:0;display:grid;gap:8px}.six li a{display:grid;grid-template-columns:44px 1fr;gap:16px;align-items:start;padding:14px 18px;border-radius:18px;transition:.2s}
.six li a:hover{background:#fff;box-shadow:0 10px 26px #14102b14}
.six .sn{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#7d5cff,#3b2a9a);color:#fff;font-weight:700}
.six b{display:block;font-size:18px;letter-spacing:-.02em;color:var(--ink)}.six p{margin:2px 0 4px;font-size:15px;color:var(--ink2)}.six small{font-size:12.5px;color:#7a4be8;font-weight:600}
/* new service mocks */
.stg{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.pcd{border-radius:10px;background:#f4f2fa;padding:6px}.pim{display:block;height:44px;border-radius:7px;margin-bottom:7px}.pcd em{display:block;margin-top:6px;width:30px;height:9px;border-radius:5px;background:#6a45ff;font-style:normal}
.cartp{display:inline-block;margin-top:12px;padding:6px 12px;border-radius:999px;background:#14102b;color:#fff;font-size:11.5px;font-weight:700}
.prr{display:flex;align-items:center;gap:10px;margin-bottom:10px}.prr span{width:22px;height:22px;border-radius:50%;background:#14102b;color:#fff;font-size:11.5px;font-weight:700;display:grid;place-items:center;flex:none}.prr .ln{margin:0}
.adc{border:1px solid #14102b1f;border-radius:12px;padding:12px;margin-bottom:12px;background:#fff}.adc small{display:block;font-size:10.5px;color:#7a7699;margin-bottom:8px}
.adaud{display:flex;gap:6px}.adaud i{width:16px;height:16px;border-radius:50%;background:#cdbfff}.adaud i:nth-child(3n){background:#6a45ff}
.cal7{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}.cal7 s{display:block;height:24px;border-radius:6px;background:#ece9f7}.cal7 s.on{background:#6a45ff}.cal7 s.on:nth-child(3n){background:#ff7ab6}.cal7 s.on:nth-child(4n){background:#2dc99a}
.mlc{border:1px solid #14102b1f;border-radius:12px;padding:12px;background:#fff}.mh{display:block;height:14px;border-radius:5px;background:#6a45ff;margin-bottom:8px}.mi{display:block;height:46px;border-radius:8px;background:#cdbfff;margin-bottom:10px}
.hof{display:flex;align-items:center;gap:12px;margin-top:12px}.hb{width:54%;height:34px;border-radius:12px;background:#6a45ff}.hof i{font-style:normal;color:#6a45ff;font-weight:700}.hp{width:30px;height:30px;border-radius:50%;background:#2dc99a;position:relative}
.syn{display:flex;align-items:center;gap:10px;margin-bottom:12px}.sna{flex:1;border:1px solid #14102b1f;border-radius:12px;padding:10px;background:#fff}.sna span{display:block;width:18px;height:18px;border-radius:50%;background:#6a45ff;margin-bottom:8px}.sna.b span{background:#2dc99a}.sar{font-style:normal;color:#6a45ff;font-weight:700;font-size:18px}
/* pricing box: filters, unclamped scope, accessible labels */
.cp[aria-pressed=true],.cf[aria-pressed=true]{background:#8b6cff;border-color:#8b6cff;color:#fff}
.cfil{display:flex;gap:8px;align-items:center;justify-content:center;margin:-8px 0 22px;color:#b9b5d6;font-size:13.5px}.cf{border:1px solid #ffffff26;background:#ffffff0a;color:#d6d2f0;padding:7px 15px;border-radius:999px;font-size:13.5px;font-weight:600}
.svp .intro{text-align:center;margin:0 0 14px;color:#b9b5d6}
.oc p{display:block!important;-webkit-line-clamp:unset!important;overflow:visible!important}
.pc2 .sm{font-size:13.5px;color:#c9c5e3;margin:6px 0 12px}
details.side.hp summary{font-weight:700;font-size:16px;cursor:pointer;list-style:none}details.side.hp summary:after{content:"+";float:right;color:#6a45ff}details.side.hp[open] summary:after{content:"–"}details.side.hp .lg{margin-top:14px}
@media(max-width:700px){.cmpt .ch{display:none}.cmpt .cr{grid-template-columns:1fr;gap:10px;padding:18px 20px}.cmpt .cr span:before{content:attr(data-l);display:block;font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#7a4be8;margin-bottom:2px}}
/* brief form */
.req{font-size:13px;color:var(--ink2);margin:0 0 14px}.hl{display:block;font-size:12.5px;color:var(--ink2);margin-top:6px}
.proto{margin:6px 0 16px;padding:12px 16px;border-radius:12px;background:#fff4d6;color:#6b4a00;font-size:14px;border:1px solid #f0d58a}
.fld .er{display:none;color:#b3261e;font-size:13px;margin-top:6px}.fld.bad .er{display:block}.fld.bad input,.fld.bad textarea{border-color:#b3261e}
#done:focus{outline:none}
a:focus-visible,button:focus-visible,summary:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid #c9f26b;outline-offset:3px}
/* responsive */
@media(max-width:1100px){.htiles{grid-template-columns:repeat(3,minmax(0,1fr))}.six-wrap{grid-template-columns:1fr;gap:34px}}
@media(max-width:700px){.htiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.ht-sc{height:92px}.hr{grid-template-columns:110px 1fr}.hr b{font-size:26px}.split-hero{grid-template-columns:1fr}.hring .ring6{width:min(100%,360px)}.ts .tsc{height:200px}}

@media(max-width:1000px){.hring{margin-right:0}}

.hero h1 .kw{display:flex;width:fit-content;max-width:100%;margin:0 auto 18px;font-size:13px;line-height:1.35;letter-spacing:0;font-weight:600;text-align:center}.hero h1 .dl{display:block}

.tools{background:#0a0914;padding:34px 0 30px;border-bottom:1px solid var(--line)}.tl2{text-align:center;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);font-weight:700;margin:0 0 20px}.tools ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:16px 26px}.tools li{display:flex;flex-direction:column;align-items:center;gap:8px;width:84px}.tb{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:18px;color:#fff;background:radial-gradient(circle at 30% 25%,color-mix(in srgb,var(--c) 70%,#fff),var(--c));box-shadow:0 10px 26px color-mix(in srgb,var(--c) 40%,transparent),inset 0 0 0 2px #ffffff30;animation:tbf 5s ease-in-out infinite;animation-delay:calc(var(--i)*.35s)}.tools b{font-size:12.5px;color:#cfcbe8;font-weight:600;text-align:center}@keyframes tbf{0%,100%{translate:0 0}50%{translate:0 -5px}}body.still .tb{animation:none}@media(prefers-reduced-motion:reduce){.tb{animation:none}}

.vst{max-width:980px;margin:0 auto;border-radius:28px;overflow:hidden;border:1px solid var(--line);background:#100e22}.vh,.vr{display:grid;grid-template-columns:220px 1fr 1fr;gap:18px;padding:18px 28px;align-items:start}.vh{font-weight:700;font-size:15px;color:#fff;background:#15122b}.vh span:last-child{color:var(--lime)}.vr{border-top:1px solid var(--line);font-size:15.5px}.vr b{color:#fff}.vr span{color:var(--muted)}.vr span:last-child{color:#e6e2ff;position:relative;padding-left:24px}.vr span:last-child:before{content:'';position:absolute;left:3px;top:5px;width:5px;height:10px;border:solid var(--lime);border-width:0 2px 2px 0;transform:rotate(40deg)}@media(max-width:700px){.vh{display:none}.vr{grid-template-columns:1fr;gap:8px;padding:16px 20px}.vr span:before{content:attr(data-l);display:block;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#a58bff;margin-bottom:2px}.vr span:last-child:before{position:static;width:auto;height:auto;border:0;transform:none}}

.hic{display:inline-flex;vertical-align:middle;margin:0 .12em;transform:translateY(-.06em)}.hic i{width:.82em;height:.82em;margin-left:-.2em;border-radius:50%;display:inline-grid;place-items:center;font-style:normal;font-size:.92em;font-family:inherit}.hic i{font-size:inherit}.hic i{width:.8em;height:.8em;font-size:.26em;font-weight:700;letter-spacing:0;color:#fff;background:radial-gradient(circle at 30% 25%,color-mix(in srgb,var(--c) 65%,#fff),var(--c));border:.08em solid #fff;box-shadow:0 .1em .3em #0006;animation:hicf 4s ease-in-out infinite;animation-delay:calc(var(--i)*.3s)}.hic i:first-child{margin-left:0}
.hic i{width:3.1em;height:3.1em;border-width:.25em}@keyframes hicf{0%,100%{translate:0 0}50%{translate:0 -.25em}}body.still .hic i{animation:none}@media(prefers-reduced-motion:reduce){.hic i{animation:none}}

.rate{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 auto 16px;font-size:14px;color:#d9d5f0}.rate .rsrc{display:inline-flex}.rate .rsrc i{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-weight:700;font-size:12px;color:#fff;background:var(--c);border:2px solid #fff;margin-left:-7px}.rate .rsrc i:first-child{margin-left:0}.rate .stars{color:#ffc53d;letter-spacing:2px}.rate b{color:#fff}
.hic i img,.tb img{width:70%;height:70%;object-fit:contain}
.team{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.tm{background:#fff;border-radius:24px;padding:28px 22px;text-align:center;box-shadow:0 14px 34px #14102b0f}.tav{width:84px;height:84px;border-radius:50%;display:grid;place-items:center;margin:0 auto 14px;font-weight:700;font-size:26px;color:#fff;background:radial-gradient(circle at 30% 25%,color-mix(in srgb,var(--c) 60%,#fff),var(--c))}.tm b{display:block;font-size:18px;color:var(--ink)}.tm small{color:var(--ink2);font-size:14px}
.st-l{margin-top:40px}.sec.light .st-l b{color:var(--ink)}.sec.light .st-l span{color:var(--ink2)}
.ccards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.cc1{display:block;background:#fff;border-radius:24px;padding:28px;box-shadow:0 14px 34px #14102b0f;color:var(--ink)}.cc1 small{display:block;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#7a4be8;margin-bottom:6px}.cc1 b{font-size:18px;overflow-wrap:anywhere}.cc1 span{display:block;margin-top:4px;font-size:14px;color:var(--ink2)}a.cc1:hover{box-shadow:0 18px 40px #6a45ff26}
.soc{display:flex;gap:8px;margin-top:14px}.soc a{width:34px;height:34px;border-radius:50%;display:grid!important;place-items:center;padding:0!important;border:1px solid var(--line);font-size:11px;font-weight:700}
@media(max-width:900px){.team{grid-template-columns:repeat(2,minmax(0,1fr))}.ccards{grid-template-columns:1fr}}

.fcols{grid-template-columns:1.3fr 1.2fr 1fr 1fr 1.2fr!important}@media(max-width:1000px){.fcols{grid-template-columns:1fr 1fr!important}}.hero.hA{padding-top:92px}.hero.hA .htiles{margin-top:28px}


/* ===== v12 final balance pass ===== */
.sec{padding:96px 0}.sec.light+.sec.light{padding-top:40px}.sec.light+.sec.light .sh{margin-bottom:40px}.sh{margin-bottom:52px}
.sgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.sg{display:flex;flex-direction:column;background:#fff;border-radius:28px;padding:14px 14px 26px;box-shadow:0 14px 34px #14102b0f;transition:.25s}.sg:hover{transform:translateY(-4px);box-shadow:0 22px 44px #14102b1f}
.pv.sm{min-height:0;height:210px;padding:24px;border-radius:20px;margin-bottom:22px}.pv.sm .mk{width:84%}.pv.sm .mk:nth-child(2){margin-top:-60px}
.sg h3{font-size:24px;letter-spacing:-.03em;margin:0 12px 8px;color:var(--ink)}.sg p{font-size:15.5px;margin:0 12px 16px;color:var(--ink2)}.sg .chips{margin:auto 12px 0}
.proc{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.pc{background:#fff;border-radius:24px;padding:14px 14px 24px;box-shadow:0 14px 34px #14102b0f}.pcs{position:relative;height:150px;border-radius:16px;overflow:hidden;background:radial-gradient(70% 90% at 80% 0%,#6a3dff,transparent 60%),linear-gradient(160deg,#1d1450,#07060f);margin-bottom:18px}
.pc .n{display:block;margin:0 8px 6px;font-size:13px;font-weight:700;letter-spacing:.12em;color:#7a4be8}.pc h3{margin:0 8px 6px;font-size:20px;color:var(--ink)}.pc p{margin:0 8px;font-size:15px;color:var(--ink2)}
.vpts{list-style:none;max-width:980px;margin:26px auto 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.vpts li{border:1px solid var(--line);border-radius:20px;padding:20px 22px;background:#ffffff06}.vpts b{display:block;color:#fff;font-size:16.5px;margin-bottom:4px}.vpts span{font-size:14.5px;color:var(--muted)}
.duo-s{padding-bottom:20px}.duo-s+.sec{padding-top:20px}
.sec.alt .ts p{color:var(--muted)}.sec.alt .ts h3{color:#fff}
.cases{gap:22px}
@media(max-width:1000px){.sgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.proc{grid-template-columns:repeat(2,minmax(0,1fr))}.vpts{grid-template-columns:1fr}}
@media(max-width:700px){.sec{padding:72px 0}.sgrid,.proc{grid-template-columns:1fr}.pv.sm{height:190px}}

h1,h2{text-wrap:balance}
.sg .chip{padding:7px 13px;font-size:13px}.sg .chips{gap:6px}
.six-wrap{grid-template-columns:1.05fr 1fr;align-items:stretch}.ring-box{display:grid;place-items:center;align-content:center;padding:34px 24px}.six li a{padding:11px 16px}
.side.dk .btn.p{background:#fff;color:#14102b;box-shadow:none}.side.dk .btn.p:hover{background:#efeaff}

/* ===== v13 ===== */
.hic i[data-m]:not([data-m=""])::before{content:attr(data-m)}
.plat{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:-8px 0 26px;font-size:13.5px;color:#c9c5e3}.plat>span:first-child{color:var(--dim);font-weight:600;margin-right:2px}
.pt2{display:inline-flex;align-items:center;gap:7px;padding:5px 12px 5px 5px;border-radius:999px;background:#ffffff0d;border:1px solid #ffffff21;color:#fff;font-weight:600}
.pt2 i{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--c);font-style:normal;font-size:9.5px;font-weight:700;color:#fff}.pt2 i::before{content:attr(data-m)}
.plat .px{color:var(--dim);font-style:italic}

.vst1 .vr{grid-template-columns:220px 1fr}@media(max-width:700px){.vst1 .vr{grid-template-columns:1fr}.vst1 .vr span:before{content:'';}}


/* v14: genuine narrow-width fixes (360px / 320px) */
.fcols>div{min-width:0}
@media(max-width:560px){.fcols{grid-template-columns:1fr!important}.ft .cc{columns:2}}
.split-hero>*,.six li a>div,.lay>*,.grp,.opt>div{min-width:0}
.crumb{flex-wrap:wrap}
h1,h2,h3{overflow-wrap:break-word}
@media(max-width:420px){.dock{gap:0;padding:6px;max-width:calc(100vw - 16px)}.dock>a,.dock>button{padding:10px 11px;font-size:13.5px}.dock .go{padding:10px 13px}.split-hero h1,.hero.sm h1{font-size:34px}.wrap{padding:0 16px}}

.six-wrap>*,.duo>*{min-width:0}.ring6{max-width:100%}.ft small{display:flex;flex-wrap:wrap;align-items:center;gap:10px}.stillbtn{margin-left:0}@media(max-width:420px){.band{padding:30px 22px}.ring-box{padding:22px 12px}}


@media(max-width:1100px){.six-wrap{grid-template-columns:1fr}}@media(max-width:380px){.dock>a[href="/pricing/"]{display:none}}


/* =====================================================================
   V16 THEME: LeadsVector brand (from leadsvector.com, inspected 31 Oct 2026)
   Pure black, purple gradient #7F52EE→#432E72, green accent #9ECD5F/#61CE70,
   Poppins headings, Inter body, Playfair Display italic accents.
   One dark surface system for every page. Mock screens stay light on purpose.
   ===================================================================== */
:root{
 --bg:#000;--bg2:#07070c;--card:#0c0c12;--card2:#12121a;--line:#1d1d27;--line2:#2a2a36;
 --text:#fff;--muted:#a7a7b6;--dim:#6f6f80;
 --purple:#7F52EE;--purple2:#5b3bd0;--deep:#432E72;--violet:#783DF6;--lime:#9ECD5F;--green:#61CE70;
 --paper:#000;--ink:#fff;--ink2:#a7a7b6;
 --sans:'Inter',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;--head:'Poppins','Inter',system-ui,sans-serif;--serif:'Playfair Display',Georgia,serif;
 --grad:linear-gradient(93deg,#7F52EE 0%,#432E72 100%);
 --surface:linear-gradient(180deg,#0e0e15 0%,#09090d 100%);
 --glow:0 24px 60px -24px #7F52EE66;
}
body{background:#000;color:var(--muted);font-family:var(--sans)}
h1,h2,h3,h4{font-family:var(--head);color:#fff;letter-spacing:-.025em}
h1{font-weight:700;line-height:1.06}h2{font-weight:700;line-height:1.1}h3{font-weight:600}
/* headline treatment: silver text with a purple-to-green serif accent */
.hero h1,.sec h2,.cta h2,.band h2{background:linear-gradient(180deg,#fff 35%,#b9b9c2 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
em{font-family:var(--serif);font-weight:500}
.hero h1 em,.sec h2 em,.cta h2 em,.band h2 em,.ts h3 em{background:linear-gradient(92deg,#c3abff 0%,#9ECD5F 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;padding-right:.06em}
.hero h1 .kw{-webkit-text-fill-color:#d8d0f5;background:#ffffff0a;font-family:var(--sans)}
p{color:var(--muted)}
::selection{background:#7F52EE;color:#fff}

/* sections: black canvas, slightly lifted alternate band with hairlines */
.sec,.sec.light{background:#000;color:var(--muted)}
.sec.alt{background:radial-gradient(60% 50% at 50% 0%,#7F52EE14,transparent 70%),#06060a;border-top:1px solid #ffffff0d;border-bottom:1px solid #ffffff0d}
.sec.light h2,.sec.light h3,.light h2,.light h3{color:#fff}.light p{color:var(--muted)}
.sh p{color:var(--muted)}
.pl,.light .pl{display:inline-flex;align-items:center;gap:8px;background:#ffffff08;border:1px solid #ffffff1c;color:#d9f0bf;font-weight:600;letter-spacing:.08em}
.pl:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--lime);box-shadow:0 0 10px var(--lime)}

/* hero: the leadsvector.com glow (teal-green top left, purple bottom right) */
.hero{background:radial-gradient(42% 60% at 0% 0%,#0f7b62cc,transparent 70%),radial-gradient(45% 65% at 100% 100%,#5b34c4aa,transparent 70%),radial-gradient(60% 50% at 50% 0%,#2a1a5533,transparent 70%),#000}
.hero:before{opacity:.18}
.hero p.lead{color:#cfcfd8}
.pill{border-color:#ffffff22;background:#ffffff0a;color:#e4e0f5}

/* buttons */
.btn,.light .btn{border:1px solid #ffffff26;background:#ffffff08;color:#fff}
.btn:hover,.light .btn:hover{background:#ffffff14;border-color:#ffffff40}
.btn.p,.light .btn.p{background:var(--grad);border-color:#9d7cff55;color:#fff;box-shadow:0 10px 30px -8px #7F52EEaa,inset 0 1px 0 #ffffff26}
.btn.p:hover,.light .btn.p:hover{background:linear-gradient(93deg,#8d64f5,#4f3588)}
.lk{color:#c9b6ff}.lk:hover{color:#fff}
.chip,.light .chip,.catbar a{background:#ffffff08;border:1px solid #ffffff1f;color:#dedbea}
.chip:hover,.catbar a:hover{border-color:#7F52EE;color:#fff}
.catbar a[aria-current=page]{background:var(--grad);border-color:transparent;color:#fff}

/* one card system */
.box,.side,.note2,.rows,.mile>div,.snap,.cmpt,.opt,.tm,.cc1,.sg,.pc,.tile,.fit,.qc,.ic,.vst,.vpts li,.oc,.pc2,.svc .pv{border-radius:22px}
.box,.side,.note2,.rows,.mile>div,.snap,.cmpt,.opt,.tm,.cc1,.sg,.pc,.tile,.fit,.qc{background:var(--surface);border:1px solid var(--line);box-shadow:none;color:var(--muted)}
.opt:hover,.sg:hover,.cc1:hover,.pc:hover,.tile:hover{border-color:#7F52EE66;box-shadow:var(--glow);transform:translateY(-2px)}
.box h3,.side h3,.opt h3,.tm b,.cc1 b,.sg h3,.pc h3,.tile h3,.rows b,.snap b,.mile b,.six b,.lg b,.cmpt .cr b{color:#fff}
.box p,.opt p,.tm small,.cc1 span,.sg p,.pc p,.tile p,.rows span,.mile span,.note2 p,.lg,.cmpt .cr,.side p{color:var(--muted)}
.tile .n,.pc .n{color:var(--lime)}
.side.dk{background:radial-gradient(80% 90% at 100% 0%,#7F52EE55,transparent 60%),linear-gradient(160deg,#1a1233,#0b0912);border-color:#7F52EE44}
.tick li{border-top-color:#ffffff10;color:var(--muted)}.tick li:before{border-color:var(--lime)}
.rows div,.cmpt .cr,.snap>div,.faq details,.svc{border-color:#ffffff10}
.cmpt .ch{background:linear-gradient(120deg,#2a1b55,#120d22)}
.grp>h3:after{background:#ffffff14}.grp>h3{color:#fff}.gi{color:var(--muted)}
.pr2 b{color:#fff}.pr2 .u{color:var(--dim)}
.pr2.fixed .k{background:#9ECD5F1f;color:#bfe39a}.pr2.from .k{background:#7F52EE2b;color:#cdbaff}.pr2.custom .k{background:#ffb84a1c;color:#ffd08c}
.ok.fixed{background:#9ECD5F1f;color:#bfe39a}.ok.from{background:#7F52EE2b;color:#cdbaff}.ok.custom{background:#ffb84a1c;color:#ffd08c}
.faq summary{color:#fff}.faq p{color:var(--muted)}.faq summary:after{color:var(--lime)}

/* service visuals: dark brand panels instead of pastel rainbow (mock screens stay light) */
.pv,.pv.sm{background:radial-gradient(70% 80% at 90% 0%,#7F52EE45,transparent 62%),radial-gradient(60% 70% at 0% 100%,#61CE7026,transparent 62%),#0b0b11!important;border:1px solid var(--line)}
.mk{--ink:#14102b;--ink2:#53506f;color:#14102b;box-shadow:0 20px 50px -10px #000c}
.mk p,.mk h3{color:#14102b}
.sg{padding:12px 12px 24px}

/* case cards: dark with a brand glow, not pastel blocks */
.case{background:radial-gradient(70% 90% at 100% 0%,#7F52EE33,transparent 60%),linear-gradient(160deg,#111019,#08080c)!important;border:1px solid var(--line);color:#fff;box-shadow:0 30px 70px -30px #000}
.case h3{color:#fff}.case p{color:var(--muted)}.case .k{color:#cdbaff}.case .rd{color:#fff}
.tags span{background:#ffffff0f;color:#e2def0;border:1px solid #ffffff17}
.cv{background:#ffffff07;border:1px solid #ffffff10}

/* industries */
.ic{background:var(--surface);border:1px solid var(--line)}.ic:before{background:var(--c)}
.ic h3{color:#fff}.ic p{color:var(--muted)}

/* process, timeline */
.pcs,.tsc{background:radial-gradient(70% 90% at 85% 0%,#7F52EE55,transparent 60%),radial-gradient(60% 70% at 0% 100%,#61CE701f,transparent 60%),#08080d;border:1px solid var(--line)}
.light .tl-line{background:#ffffff14}.light .tdot{border-color:#000;background:#2a2a36}.light .ts.on .tdot{background:var(--purple)}
.light .ts h3{color:#fff}.light .ts p{color:var(--muted)}.light .tsn,.tsn{color:var(--lime)}
.tl-line i{background:linear-gradient(#9ECD5F,#7F52EE)}
.ts.on .tdot{background:var(--lime);box-shadow:0 0 0 7px #9ECD5F26}

/* one-team points */
.vst{background:var(--surface);border:1px solid var(--line)}.vr{border-color:#ffffff0f}.vr b{color:#fff}
.vr span:last-child{color:#d6d3e4}.vr span:last-child:before{border-color:var(--lime)}
.vpts li{background:#ffffff05;border:1px solid var(--line)}

/* plans and pricing box */
.plan{background:linear-gradient(180deg,#0f0f17,#08080c);border:1px solid var(--line);box-shadow:inset 0 -40px 60px -40px #7F52EE55}
.plan:nth-child(2){border-color:#7F52EE66;box-shadow:inset 0 -60px 80px -40px #7F52EE88,var(--glow)}
.plan .pr,.pc1 .pr{background:linear-gradient(180deg,#fff,#c9c9d2);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.plan li:before{border-color:var(--lime)}
.pbox{background:linear-gradient(170deg,#0d0b18,#050508);border-color:#ffffff14}
.ptabs{background:#000;border-color:#ffffff17}.pt[aria-selected=true]{background:var(--grad)}
.pc1-0{background:radial-gradient(90% 80% at 100% 0%,#7F52EE66,transparent 60%),linear-gradient(170deg,#1c1336,#0a0812 75%)}
.pc1-1{background:radial-gradient(90% 80% at 100% 0%,#61CE7040,transparent 60%),linear-gradient(170deg,#0f2118,#08100c 75%)}
.pc1-2{background:radial-gradient(90% 80% at 100% 0%,#9ECD5F33,transparent 60%),linear-gradient(170deg,#1b1530,#09080f 75%)}
.pc1-3{background:radial-gradient(90% 80% at 100% 0%,#7F52EE55,transparent 60%),linear-gradient(170deg,#141020,#08070c 75%)}
.cp[aria-pressed=true],.cf[aria-pressed=true]{background:var(--grad);border-color:transparent}
.hint{border-color:#ffffff1a;background:#ffffff06}.hint span:before{border-color:var(--lime)}

/* forms */
.fld>span{color:#fff}
input:not([type=checkbox]),select,textarea{background:#0b0b11;border:1.5px solid #262632;color:#fff}
input:focus,select,textarea:focus{border-color:var(--purple)}
input::placeholder,textarea::placeholder{color:#5f5f70}
.fit{background:#0b0b11;border-color:#262632}.fit p{color:var(--muted)}
.nx li{color:var(--muted)}.nx li:before{background:var(--grad);color:#fff}
.hl{color:var(--dim)}.fld .er{color:#ff8a80}.fld.bad input,.fld.bad textarea{border-color:#ff8a80}
.done{background:var(--surface);border:1px solid #7F52EE55;border-radius:22px}

/* duo bands and final CTA */
.band{background:radial-gradient(80% 100% at 100% 0%,#7F52EE40,transparent 60%),linear-gradient(160deg,#110e1d,#08080c);border:1px solid var(--line)}
.band:nth-child(2){background:radial-gradient(80% 100% at 100% 0%,#61CE7030,transparent 60%),linear-gradient(160deg,#0d1612,#08080c)}
.cta{background:radial-gradient(50% 80% at 0% 0%,#0f7b6299,transparent 70%),radial-gradient(55% 90% at 100% 100%,#5b34c4bb,transparent 70%),#06060a;border:1px solid #ffffff14}

/* navigation, panels, footer */
.dock{background:#07070bdd;border-color:#ffffff1c;box-shadow:0 18px 50px #000c}
.dock>a:hover,.dock>button:hover,.dock>button[aria-expanded=true]{background:#ffffff12}
.dock .go{background:var(--grad);box-shadow:0 8px 24px -6px #7F52EEaa}
.panel{background:#07070bf2;border-color:#ffffff1c}
.pi:hover{background:#ffffff0a}
.ft{background:#000;border-top-color:#ffffff12}.ft h4{color:var(--lime)}
.top .logo i,.logo i{color:var(--purple)}

/* 6G framework strip */
.g6{position:relative}
.g6-row{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;position:relative}
.g6-row:before{content:"";position:absolute;left:4%;right:4%;top:37px;height:2px;background:linear-gradient(90deg,#7F52EE,#9ECD5F,#7F52EE);opacity:.45}
.g6-i a{position:relative;display:flex;flex-direction:column;height:100%;padding:20px 18px 22px;border-radius:20px;background:var(--surface);border:1px solid var(--line);transition:.25s}
.g6-i a:hover{border-color:#7F52EE77;box-shadow:var(--glow);transform:translateY(-3px)}
.g6-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}
.g6-ic{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;color:#fff;background:var(--grad);box-shadow:0 0 0 5px #000,0 0 22px #7F52EE66;position:relative;z-index:1}
.g6-i:nth-child(even) .g6-ic{background:linear-gradient(135deg,#9ECD5F,#3f7a3a);box-shadow:0 0 0 5px #000,0 0 22px #9ECD5F55}
.g6-n{font:600 12px var(--head);letter-spacing:.12em;color:var(--dim)}
.g6-i b{font:600 18px/1.25 var(--head);color:#fff;margin-bottom:8px}
.g6-i p{font-size:14px;line-height:1.5;margin:0 0 16px}
.g6-l{margin-top:auto;font-size:12.5px;font-weight:600;color:#c9b6ff}
.g6-bar{margin-top:16px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;padding:16px 22px;border-radius:16px;background:#ffffff05;border:1px dashed #ffffff22}
.g6-bl{font:600 15px var(--head);color:#fff}.g6-bt{font-size:14px;color:var(--muted)}
.g6-track{position:relative;height:4px;border-radius:4px;background:#ffffff12;overflow:hidden}
.g6-track i{position:absolute;inset:0;width:40%;border-radius:4px;background:linear-gradient(90deg,transparent,#9ECD5F,#7F52EE,transparent);animation:g6run 5s linear infinite}
@keyframes g6run{from{transform:translateX(-100%)}to{transform:translateX(260%)}}
body.still .g6-track i{animation:none}@media(prefers-reduced-motion:reduce){.g6-track i{animation:none}}
@media(max-width:1100px){.g6-row{grid-template-columns:repeat(3,minmax(0,1fr))}.g6-row:before{display:none}}
@media(max-width:640px){.g6-row{grid-template-columns:minmax(0,1fr)}.g6-bar{grid-template-columns:1fr;gap:8px}}

/* hero tiles and rating */
.ht{background:linear-gradient(180deg,#0f0f17,#08080c);border-color:#ffffff17}
.ht:hover{border-color:#7F52EE88;box-shadow:var(--glow)}
.ht-sc{background:radial-gradient(80% 90% at 80% 0%,#7F52EE66,transparent 60%),radial-gradient(60% 70% at 0% 100%,#61CE7026,transparent 60%),#08080d}

/* service page hero platform chips */
.pt2{background:#ffffff0a;border-color:#ffffff1f}

/* misc */
.qc{background:var(--surface)}.qc p{color:#e6e3f0}.qc .qm{color:var(--lime)}
.stats2 b{color:#fff}.stats2 span{color:var(--muted)}
.smp{color:#ffe9b8;background:#3d2e05;border-color:#6b5310}


.hero h1 .hic i,.hero h1 .hic i::before{-webkit-text-fill-color:#fff;color:#fff}
.plans .plan{background:linear-gradient(180deg,#100d1c,#07070b)!important;border:1px solid #2a2140!important;box-shadow:inset 0 -70px 90px -50px #7F52EE77!important}
.plans .plan:nth-child(2){background:linear-gradient(180deg,#0c1611,#07070b)!important;border-color:#2b4a2c!important;box-shadow:inset 0 -70px 90px -50px #61CE7055!important}
.plans .plan:nth-child(3){background:linear-gradient(180deg,#140f22,#07070b)!important;border-color:#33285a!important;box-shadow:inset 0 -70px 90px -50px #9a7bff66!important}
.plans .plan .tg{color:#cfc6ec}.plans .plan:nth-child(2) .tg{color:#bfe39a}

.split-hero h1{font-size:clamp(34px,3.9vw,56px)}.hero.sm h1{font-size:clamp(34px,4.4vw,62px)}h2{font-size:clamp(30px,3.8vw,52px)}.hero.hA h1{font-size:clamp(36px,4.1vw,62px)}


/* =====================================================================
   V17: polish pass (spacing rhythm, mock colours, purposeful motion, mobile swipe rows)
   ===================================================================== */
/* spacing rhythm: one scale everywhere */
.sec{padding:104px 0}.sec.light+.sec.light{padding-top:24px}
.sh{margin-bottom:56px}.sh p{max-width:640px;margin-left:auto;margin-right:auto;font-size:17.5px;line-height:1.6}.sh.l p{margin-left:0}
.sh h2{margin-bottom:16px}.pl{margin-bottom:18px}
.sgrid,.proc,.ind,.three,.tiles{gap:20px}
.duo-s{padding-bottom:16px}.duo-s+.sec{padding-top:16px}

/* mock screens: brand colours only */
.dn{background:conic-gradient(#7F52EE 0 45%,#9ECD5F 0 72%,#c4b0ff 0)}
.im{background:linear-gradient(135deg,#e7defe,#e3f3d3)}
.cal7 s.on{background:#7F52EE}.cal7 s.on:nth-child(3n){background:#c4b0ff}.cal7 s.on:nth-child(4n){background:#9ECD5F}
.nt em{background:#e6f4d6;color:#3f6b1f}
.uic s{border-color:#b69cff}

/* reveal: fade up with stagger */
.rv{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:var(--rd,0ms)}
.rv.in{opacity:1;transform:none}

/* hero: slow aurora drift behind the glow, tiles rise in on load */
.hero{isolation:isolate}
.hero:after{content:"";position:absolute;inset:-20% -10%;z-index:-1;pointer-events:none;background:radial-gradient(28% 34% at 18% 22%,#12a07a55,transparent 70%),radial-gradient(30% 36% at 82% 78%,#6a3df077,transparent 70%);animation:lvaurora 18s ease-in-out infinite alternate}
@keyframes lvaurora{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(3%,-2%,0) scale(1.06)}100%{transform:translate3d(-3%,2%,0) scale(1)}}
.ht{animation:lvup .8s cubic-bezier(.2,.7,.2,1) both}
.ht:nth-child(1){animation-delay:.15s}.ht:nth-child(2){animation-delay:.22s}.ht:nth-child(3){animation-delay:.29s}.ht:nth-child(4){animation-delay:.36s}.ht:nth-child(5){animation-delay:.43s}.ht:nth-child(6){animation-delay:.5s}
@keyframes lvup{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}

/* floating interface mocks (service cards, case cards, service heroes) */
.pv .mk:nth-child(1),.cv .mk:nth-child(1){animation:lvfloat 7s ease-in-out infinite}
.pv .mk:nth-child(2),.cv .mk:nth-child(2){animation:lvfloat2 7s ease-in-out infinite}
@keyframes lvfloat{0%,100%{translate:0 0}50%{translate:0 -8px}}
@keyframes lvfloat2{0%,100%{translate:0 0}50%{translate:0 7px}}
.bars i{transform-origin:bottom;animation:lvbar 5s ease-in-out infinite alternate}
.bars i:nth-child(2n){animation-delay:-1.4s}.bars i:nth-child(3n){animation-delay:-2.8s}
@keyframes lvbar{from{transform:scaleY(.72)}to{transform:scaleY(1)}}
.sg:hover .pv .mk:nth-child(2){translate:0 -6px}

/* 6G: a highlight travels across the six areas, matching the tracking bar */
.g6-ic{animation:g6glow 9s ease-in-out infinite;animation-delay:calc(var(--i)*1.5s)}
@keyframes g6glow{0%,14%,100%{box-shadow:0 0 0 5px #000,0 0 22px #7F52EE55;transform:none}5%{box-shadow:0 0 0 5px #000,0 0 0 9px #9ECD5F55,0 0 34px #9ECD5F99;transform:scale(1.08)}}
.g6-i a:before{content:"";position:absolute;inset:-1px;border-radius:21px;padding:1px;background:linear-gradient(140deg,#9ECD5F,transparent 40%,transparent 60%,#7F52EE);-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}
.g6-i a:hover:before{opacity:1}

/* featured plan: slow breathing glow */
.plans .plan:nth-child(2){animation:lvbreath 6s ease-in-out infinite}
@keyframes lvbreath{0%,100%{box-shadow:inset 0 -70px 90px -50px #61CE7055,0 0 0 #0000}50%{box-shadow:inset 0 -80px 100px -50px #61CE7077,0 24px 60px -28px #61CE7066}}

/* closing call to action: moving aurora */
.cta{position:relative;overflow:hidden;isolation:isolate}
.cta:before{content:"";position:absolute;inset:-40%;z-index:-1;background:radial-gradient(22% 26% at 30% 35%,#12a07a66,transparent 70%),radial-gradient(24% 28% at 70% 65%,#6a3df088,transparent 70%);animation:lvspin 22s linear infinite}
@keyframes lvspin{to{transform:rotate(360deg)}}

/* industries and generic cards: gentle lift */
.ic{transition:transform .25s,border-color .25s,box-shadow .25s}.ic:hover{transform:translateY(-4px);border-color:#7F52EE66;box-shadow:var(--glow)}

/* stop decorative motion when paused or reduced */
body.still .hero:after,body.still .ht,body.still .pv .mk,body.still .cv .mk,body.still .bars i,body.still .g6-ic,body.still .plans .plan,body.still .cta:before{animation:none!important}
@media(prefers-reduced-motion:reduce){.hero:after,.ht,.pv .mk,.cv .mk,.bars i,.g6-ic,.plans .plan,.cta:before{animation:none!important}.rv{opacity:1;transform:none}}

/* mobile: long card lists become swipe rows (keeps the page short and scannable) */
@media(max-width:700px){
 .sec{padding:72px 0}.sh{margin-bottom:34px}.sh p{font-size:16px}
 .sgrid,.proc,.g6-row,.ind,.htiles{display:grid!important;grid-template-columns:none!important;grid-auto-flow:column;grid-auto-columns:84%;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;gap:14px;padding:4px 2px 14px;scrollbar-width:none}
 .htiles{grid-auto-columns:46%}
 .sgrid::-webkit-scrollbar,.proc::-webkit-scrollbar,.g6-row::-webkit-scrollbar,.ind::-webkit-scrollbar,.htiles::-webkit-scrollbar{display:none}
 .sgrid>*,.proc>*,.g6-row>*,.ind>*,.htiles>*{scroll-snap-align:start;min-width:0}
 .ind .ic,.ind .ic:nth-child(n+4){grid-column:auto!important}
 .g6-row:before{display:none}
 .swipe-hint{display:flex}
}
.swipe-hint{display:none;align-items:center;gap:8px;justify-content:flex-end;margin:-4px 0 10px;font-size:12.5px;color:var(--dim)}


/* v17: review wall, single review, rating strip */
.rstar{color:#ffc53d;letter-spacing:2px;font-size:14px}
.rv-sum{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:16px 34px;margin:-18px 0 40px}
.rv-score{display:flex;align-items:center;gap:12px}.rv-score b{font:700 44px/1 var(--head);color:#fff}.rv-score span{color:var(--muted);font-size:14px}
.rv-srcs{display:flex;gap:10px}.rv-srcs span{display:inline-flex;align-items:center;gap:8px;padding:6px 14px 6px 6px;border-radius:999px;border:1px solid #ffffff1f;background:#ffffff08;color:#fff;font-size:13.5px;font-weight:600}
.rv-srcs i{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--c);font-style:normal;font-size:11px;font-weight:700}
.rv-wall{columns:3 300px;column-gap:20px}
.rv-card{break-inside:avoid;margin:0 0 20px;padding:26px;border-radius:22px;background:var(--surface);border:1px solid var(--line);transition:.25s}
.rv-card:hover{border-color:#7F52EE66;box-shadow:var(--glow)}
.rv-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.rv-src{font-size:12px;color:var(--dim);font-weight:600}
.rv-card blockquote{margin:0 0 20px;color:#ecebf3;font-size:16.5px;line-height:1.6}
.rv-card figcaption{display:flex;align-items:center;gap:12px}.rv-card figcaption b{display:block;color:#fff;font-size:15px}.rv-card figcaption small{color:var(--muted);font-size:13px}
.rv-card .av2{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;flex:none;background:var(--grad);color:#fff;font-weight:700;font-size:14px}
.rv-one{max-width:760px;margin:0 auto}.rv-one .rv-card{margin:0;padding:34px}.rv-one blockquote{font:500 21px/1.55 var(--sans)}
.rv-strip{display:inline-flex;align-items:center;gap:10px;margin-top:6px;padding:9px 18px;border-radius:999px;border:1px solid #ffffff1c;background:#ffffff08;font-size:14px;color:var(--muted)}.rv-strip b{color:#fff}
@media(max-width:700px){.rv-wall{columns:1}.rv-one blockquote{font-size:18px}
 .plans,.cases{display:grid!important;grid-template-columns:none!important;grid-auto-flow:column;grid-auto-columns:86%;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;padding:4px 2px 14px;scrollbar-width:none}
 .plans>*,.cases>*{scroll-snap-align:start;min-width:0}.cases .case{position:relative;top:auto}
 .plans::-webkit-scrollbar,.cases::-webkit-scrollbar{display:none}}

.logos2{display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;gap:20px 28px}.logos2 span{white-space:nowrap;color:#8d8d9e}@media(max-width:900px){.logos2{flex-wrap:wrap;justify-content:center}}


.g6tag{display:inline-block;margin:0 12px 10px;padding:4px 10px;border-radius:999px;font:600 11px/1.4 var(--head);letter-spacing:.1em;text-transform:uppercase;color:#bfe39a;background:#9ECD5F14;border:1px solid #9ECD5F33}.svc .g6tag{margin:0 0 14px}


/* ===== v18: why-us bento ===== */
.wb{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.wb-c{position:relative;display:flex;flex-direction:column;gap:22px;padding:26px;border-radius:24px;background:var(--surface);border:1px solid var(--line);overflow:hidden;transition:.25s}
.wb-c:hover{border-color:#7F52EE66;box-shadow:var(--glow);transform:translateY(-3px)}
.wb-wide{grid-column:span 2;flex-direction:row;align-items:center}
.wb-wide .wb-t{flex:0 0 38%}.wb-wide .wb-v{flex:1}
.wb-c:nth-child(1){background:radial-gradient(70% 90% at 100% 0%,#7F52EE40,transparent 60%),var(--surface)}
.wb-c:nth-child(6){background:radial-gradient(70% 90% at 100% 0%,#61CE7030,transparent 60%),var(--surface)}
.wb-t h3{font-size:21px;margin:0 0 8px;color:#fff}.wb-t p{margin:0;font-size:15px;line-height:1.55;color:var(--muted)}
.wb-v{border-radius:18px;background:#07070b;border:1px solid #ffffff12;padding:16px;font-size:13px;color:#d9d6e6;margin-top:auto}
.wb-thread{display:grid;gap:10px}
.wb-msg{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:14px;background:#ffffff07;animation:wbin 9s ease-in-out infinite;animation-delay:var(--d)}
.wb-msg b{display:block;font-size:12px;color:#fff}.wb-msg span{color:var(--muted)}
.wb-av{width:28px;height:28px;border-radius:50%;flex:none;display:grid;place-items:center;font-weight:700;font-size:12px;color:#000;background:var(--c)}
@keyframes wbin{0%{opacity:0;transform:translateY(8px)}8%,85%{opacity:1;transform:none}95%,100%{opacity:0}}
.wb-price{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.wb-price span{padding:8px 12px;border-radius:12px;background:#ffffff0a;border:1px solid #ffffff17;font:600 15px var(--head);color:#fff}.wb-price small{font:500 11px var(--sans);color:var(--dim)}
.wb-price em{font-style:normal;font-family:var(--sans);color:#bfe39a;font-weight:600;font-size:13px;margin-left:4px}
.wb-tools{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.wb-ic{display:flex}.wb-ic i{width:40px;height:40px;margin-left:-8px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-weight:700;font-size:12px;color:#fff;background:var(--c);border:3px solid #07070b;animation:lvfloat 6s ease-in-out infinite}
.wb-ic i:first-child{margin-left:0}.wb-ic i:nth-child(2n){animation-delay:-2s}.wb-ic i::before{content:attr(data-m)}
.wb-ic .wb-plus{background:#ffffff14;border-style:dashed;border-color:#ffffff40;color:#fff}
.wb-tools small{color:var(--dim)}
.wb-qa{display:grid;gap:8px}.wb-qa div{display:flex;gap:10px;align-items:center;animation:wbin 9s ease-in-out infinite;animation-delay:var(--d)}
.wb-qa i{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:11px;background:#9ECD5F26;color:#bfe39a}
.wb-ai{display:flex;flex-direction:column;gap:8px}
.wb-b{max-width:85%;padding:9px 12px;border-radius:14px;font-size:13px}
.wb-b.me{align-self:flex-end;background:#ffffff12;color:#fff;border-bottom-right-radius:4px}
.wb-b.ai{background:var(--grad);color:#fff;border-bottom-left-radius:4px}
.wb-hand{align-self:flex-start;font-size:11.5px;color:#bfe39a;padding:4px 10px;border-radius:999px;border:1px solid #9ECD5F44}
.wb-month{display:grid;gap:10px}.wb-mh{display:flex;justify-content:space-between}.wb-mh b{color:#fff}.wb-mh span{color:#bfe39a;font-size:12px}
.wb-row{display:grid;grid-template-columns:150px 1fr;gap:12px;align-items:center;color:var(--muted)}
.wb-row i{height:6px;border-radius:6px;background:#ffffff12;overflow:hidden}.wb-row s{display:block;height:100%;width:var(--w);border-radius:6px;background:linear-gradient(90deg,#7F52EE,#9ECD5F);animation:wbbar 3.5s ease-out both}
@keyframes wbbar{from{width:0}to{width:var(--w)}}

/* ===== v18: comparison ===== */
.cm{max-width:1100px;margin:0 auto;border-radius:24px;border:1px solid var(--line);background:var(--surface);overflow:hidden}
.cm-h,.cm-r{display:grid;grid-template-columns:minmax(0,1.6fr) repeat(4,minmax(0,1fr));gap:12px;align-items:center;padding:18px 26px}
.cm-h{font:600 12.5px var(--head);color:var(--dim);letter-spacing:.02em;border-bottom:1px solid #ffffff10}.cm-h span:not(:first-child){text-align:center}
.cm-r{border-top:1px solid #ffffff0b}.cm-r b{display:block;color:#fff;font:600 17px var(--head)}.cm-r small{color:var(--muted);font-size:13.5px}
.cm-r>span{text-align:center}
.cm-r.us{background:radial-gradient(80% 140% at 0% 0%,#7F52EE38,transparent 60%),#100c1c;border:1px solid #7F52EE66;border-radius:18px;margin:8px}
.cm-y{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#9ECD5F22;color:#bfe39a;font-weight:700}
.cm-n{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#ff8a8018;color:#ff9c94;font-weight:700}
.cm-v{font-size:12.5px;color:var(--dim)}
.cm-note{text-align:center;font-size:12.5px;color:var(--dim);margin:14px 0 0}
body.still .wb-msg,body.still .wb-qa div,body.still .wb-ic i,body.still .wb-row s{animation:none!important;opacity:1}
@media(prefers-reduced-motion:reduce){.wb-msg,.wb-qa div,.wb-ic i,.wb-row s{animation:none!important;opacity:1}}
@media(max-width:1000px){.wb{grid-template-columns:repeat(2,minmax(0,1fr))}.wb-wide{grid-column:span 2}}
@media(max-width:700px){.wb{grid-template-columns:minmax(0,1fr)}.wb-wide{grid-column:auto;flex-direction:column;align-items:stretch}.wb-wide .wb-t{flex:none}.wb-row{grid-template-columns:120px 1fr}
 .cm-h{display:none}.cm-r{grid-template-columns:1fr 1fr;padding:18px}.cm-r>div{grid-column:1/-1}.cm-r>span{display:flex;align-items:center;gap:10px;text-align:left;font-size:12.5px;color:var(--muted)}.cm-r>span:before{content:attr(data-l);flex:1}}


.wb-c:nth-child(6){grid-column:span 3}.wb-c:nth-child(6) .wb-t{flex:0 0 32%}@media(max-width:1000px){.wb-c:nth-child(6){grid-column:span 2}}@media(max-width:700px){.wb-c:nth-child(6){grid-column:auto}}.wb-tools{flex:1;justify-content:center}


@media(max-width:700px){.wb{display:grid!important;grid-template-columns:none!important;grid-auto-flow:column;grid-auto-columns:86%;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;padding:4px 2px 14px;scrollbar-width:none}.wb::-webkit-scrollbar{display:none}.wb>*{scroll-snap-align:start;grid-column:auto!important;min-width:0}}


/* =====================================================================
   V19: section separation, slow hero aurora, booking calendar, aligned plans,
   animated service visuals, video reviews
   ===================================================================== */
/* sections: alternate bands are rounded panels that sit apart from the black canvas */
.sec.alt{margin:0 clamp(8px,1.6vw,24px);border-radius:40px;border:1px solid #ffffff12;background:radial-gradient(70% 60% at 50% 0%,#7F52EE1c,transparent 70%),linear-gradient(180deg,#0b0a12,#07070b)}
.sec.alt+.sec,.sec+.sec.alt{margin-top:0}
.sec:not(.alt):not(.light)+.sec:not(.alt),.sec.light+.sec:not(.alt){padding-top:24px}
.sh .pl{margin-bottom:16px}
@media(max-width:700px){.sec.alt{margin:0 8px;border-radius:28px}}

/* hero: slow rotating colour field, like the closing section, but slower and softer */
.hero:after{inset:-45%;background:radial-gradient(22% 26% at 30% 35%,#12a07a4d,transparent 70%),radial-gradient(24% 28% at 70% 65%,#6a3df066,transparent 70%);animation:lvspin 90s linear infinite}

/* services grid: animated scene panels */
.pv.scn{position:relative;padding:0;height:220px;overflow:hidden}
.pv.scn .vs{padding:10px}

/* plans: same rows on every card, the launch package featured */
.plans{align-items:stretch}
.plans .plan{display:flex;flex-direction:column;position:relative}
.plans .plan .tg{min-height:18px}
.plans .plan h3{min-height:2.6em;display:flex;align-items:flex-end}
.plans .plan .ln2{min-height:5.2em}
.plans .plan ul{flex:1}
.plans .plan .foot{margin-top:24px}
.plans .plan:nth-child(1){background:linear-gradient(180deg,#0c1611,#07070b)!important;border-color:#2b4a2c!important;box-shadow:inset 0 -70px 90px -50px #61CE7055!important;animation:none}
.plans .plan.feat{transform:scale(1.045);z-index:1;background:radial-gradient(90% 60% at 50% 0%,#7F52EE55,transparent 70%),linear-gradient(180deg,#160f2c,#08070d)!important;border:1px solid #8d6bff99!important;animation:lvbreathp 6s ease-in-out infinite}
@keyframes lvbreathp{0%,100%{box-shadow:inset 0 -80px 100px -50px #7F52EE88,0 0 0 #0000}50%{box-shadow:inset 0 -90px 110px -50px #7F52EEaa,0 30px 70px -30px #7F52EE99}}
.plans .plan:nth-child(3){animation:none}
.pbadge{position:absolute;top:-13px;left:50%;transform:translateX(-50%);padding:6px 14px;border-radius:999px;background:var(--grad);color:#fff;font:600 12px var(--head);letter-spacing:.04em;box-shadow:0 8px 20px -6px #7F52EEaa;white-space:nowrap}
.plans .plan.feat .pr{font-size:64px}
@media(max-width:1000px){.plans .plan.feat{transform:none}}

/* booking block */
.book-s{padding-top:40px}
.book{display:grid;grid-template-columns:1fr 1.05fr;gap:40px;align-items:center;padding:48px;border-radius:36px;border:1px solid #ffffff14;position:relative;overflow:hidden;isolation:isolate;background:#06060a}
.book:before{content:"";position:absolute;inset:-40%;z-index:-1;background:radial-gradient(22% 26% at 25% 30%,#12a07a55,transparent 70%),radial-gradient(24% 28% at 75% 70%,#6a3df077,transparent 70%);animation:lvspin 40s linear infinite}
.book-l h2{font-size:clamp(30px,3.4vw,48px);margin:0 0 22px;text-align:left}
.book-pts{list-style:none;padding:0;margin:0 0 26px;display:grid;gap:12px}
.book-pts li{position:relative;padding-left:30px;color:#dedbea;font-size:16px}
.book-pts li:before{content:"✓";position:absolute;left:0;top:0;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-size:11px;background:#9ECD5F26;color:#bfe39a}
.book-p{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:18px;background:#ffffff08;border:1px solid #ffffff14;max-width:340px;margin-bottom:18px}
.book-p .av2{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--grad);color:#fff;font-weight:700}
.book-p b{display:block;color:#fff}.book-p small{color:var(--muted)}
.book-alt{margin:0;font-size:14.5px}
.cal{padding:22px;border-radius:24px;background:#0b0b11ee;border:1px solid #ffffff17;box-shadow:0 30px 70px -30px #000}
.cal-h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:14px}.cal-h b{color:#fff;font:600 17px var(--head)}.cal-h span{font-size:12.5px;color:var(--dim)}
.cal-g{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.cal-w{font-size:11.5px;text-align:center;color:var(--dim);font-weight:600}
.cal-d{height:44px;border-radius:12px;border:1px solid #ffffff14;background:#ffffff06;color:#fff;font-weight:600;font-size:15px;transition:.15s}
.cal-d:hover{border-color:#7F52EE}.cal-d[aria-pressed=true]{background:var(--grad);border-color:transparent}
.cal-t{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0;min-height:44px;align-items:center}
.cal-tl{width:100%;font-size:13px;color:var(--muted)}
.cal-s{padding:9px 14px;border-radius:999px;border:1px solid #ffffff1f;background:#ffffff08;color:#fff;font-size:13.5px;font-weight:600}
.cal-s:hover{border-color:#9ECD5F}.cal-s[aria-pressed=true]{background:#9ECD5F;color:#0b0b0b;border-color:#9ECD5F}
.cal-go{width:100%}.cal-go[aria-disabled=true]{opacity:.55;cursor:not-allowed}
body.still .book:before,body.still .plans .plan.feat{animation:none!important}
@media(prefers-reduced-motion:reduce){.book:before,.plans .plan.feat{animation:none!important}}
@media(max-width:900px){.book{grid-template-columns:1fr;padding:28px 20px;gap:28px}}

/* video reviews */
.rv-vid{position:relative;display:block;width:100%;aspect-ratio:16/9;margin:-6px 0 16px;border-radius:16px;border:1px solid #ffffff14;overflow:hidden;background:radial-gradient(70% 90% at 80% 10%,#7F52EE77,transparent 60%),radial-gradient(60% 80% at 10% 90%,#61CE7044,transparent 60%),#0b0a12;cursor:pointer}
.rv-poster{position:absolute;left:16px;bottom:14px;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#ffffff1f;color:#fff;font-weight:700;font-size:14px}
.rv-play{position:absolute;left:50%;top:50%;width:58px;height:58px;margin:-29px 0 0 -29px;border-radius:50%;background:#fffffff0;box-shadow:0 0 0 10px #ffffff1f;transition:.2s}
.rv-play:after{content:"";position:absolute;left:23px;top:18px;border-style:solid;border-width:11px 0 11px 17px;border-color:transparent transparent transparent #5b3bd0}
.rv-vid:hover .rv-play{transform:scale(1.08)}
.rv-len{position:absolute;right:12px;bottom:12px;padding:3px 8px;border-radius:8px;background:#000a;color:#fff;font-size:12px;font-weight:600}
.rvd{border:0;padding:0;border-radius:24px;background:#0b0a12;color:#fff;max-width:min(860px,92vw);width:100%}
.rvd::backdrop{background:#000c}
.rvd video{display:block;width:100%;border-radius:24px}
.rvd-x{position:absolute;top:10px;right:12px;width:38px;height:38px;border-radius:50%;border:1px solid #ffffff2a;background:#000a;color:#fff;font-size:22px;z-index:2}
.rvd-ph{position:relative;aspect-ratio:16/9;display:flex;flex-direction:column;justify-content:flex-end;padding:34px;background:radial-gradient(70% 90% at 80% 10%,#7F52EE77,transparent 60%),#0b0a12}
.rvd-ph .rv-play{top:40%}
.rvd-ph blockquote{margin:0 0 12px;font-size:19px;line-height:1.5;color:#ecebf3;max-width:640px}.rvd-ph b{color:#fff}.rvd-ph small{color:var(--muted)}


.plans .plan .tg{white-space:nowrap;padding-right:0;margin-top:0}


/* =====================================================================
   V20: brighter, more focused. One light reading panel, one brand-colour band,
   brighter text and surfaces, content visible at rest, refined motion.
   ===================================================================== */
:root{--muted:#bebdcc;--dim:#85849a;--line:#24243a;--surface:linear-gradient(180deg,#13131f 0%,#0c0c14 100%)}
.sec{color:var(--muted)}

/* content is visible at rest; scroll motion is a gentle lift, never a fade from invisible */
.rv{opacity:1!important;transform:translateY(18px);transition:transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:var(--rd,0ms)}
.rv.in{transform:none}

/* bright reading panel (Why LeadsVector, Client reviews) */
.sec.bright{margin:0 clamp(8px,1.6vw,24px);border-radius:40px;background:radial-gradient(60% 50% at 85% 0%,#e3d9ff,transparent 70%),radial-gradient(50% 50% at 0% 100%,#e6f6d3,transparent 70%),#f6f3ff;color:#4f4b69;border:0}
.sec.bright h2{background:none;-webkit-text-fill-color:#16112c;color:#16112c}
.sec.bright h2 em{background:linear-gradient(92deg,#6a45ff,#3d8b2f);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.sec.bright .sh p,.sec.bright p{color:#56526f}
.sec.bright .pl{background:#fff;border-color:#e2dcf7;color:#3f6b1f}
.sec.bright .pl:before{background:#5fa32f;box-shadow:none}
.sec.bright .wb-c{box-shadow:0 24px 50px -24px #2a1a6b66}
.sec.bright .wb-c:hover{box-shadow:0 30px 60px -24px #2a1a6b88}
.sec.bright .rv-card{background:#fff;border:1px solid #e7e2f8;box-shadow:0 14px 34px -18px #2a1a6b33}
.sec.bright .rv-card:hover{border-color:#b8a4ff;box-shadow:0 22px 44px -20px #2a1a6b55}
.sec.bright .rv-card blockquote{color:#221c3d}.sec.bright .rv-card figcaption b{color:#16112c}.sec.bright .rv-card figcaption small{color:#6b6787}
.sec.bright .rv-src{color:#8a86a3}
.sec.bright .rv-score b{color:#16112c}.sec.bright .rv-score span{color:#56526f}
.sec.bright .rv-srcs span{background:#fff;border-color:#e2dcf7;color:#16112c}

/* brand band (How we build a growth system) */
.sec.brand{margin:0 clamp(8px,1.6vw,24px);border-radius:40px;position:relative;overflow:hidden;isolation:isolate;background:radial-gradient(50% 70% at 0% 0%,#9ECD5F40,transparent 65%),radial-gradient(60% 80% at 100% 100%,#c4b0ff55,transparent 65%),linear-gradient(135deg,#6a45f0 0%,#4528b0 45%,#22145e 100%);color:#efeaff}
.sec.brand:before{content:"";position:absolute;inset:0;z-index:-1;background-image:radial-gradient(#ffffff26 1px,transparent 1px);background-size:24px 24px;opacity:.35;-webkit-mask-image:linear-gradient(180deg,#000,transparent 85%);mask-image:linear-gradient(180deg,#000,transparent 85%)}
.sec.brand h2{background:none;-webkit-text-fill-color:#fff;color:#fff}
.sec.brand h2 em{background:linear-gradient(92deg,#f1ecff,#d4f5a6);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.sec.brand .sh p{color:#e3dcff}
.sec.brand .pl{background:#ffffff1f;border-color:#ffffff3a;color:#fff}
.sec.brand .pc{background:#ffffff14;border:1px solid #ffffff2e;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.sec.brand .pc:hover{background:#ffffff1f;border-color:#ffffff55;box-shadow:0 24px 50px -24px #0008}
.sec.brand .pc h3{color:#fff}.sec.brand .pc p{color:#e7e2ff}.sec.brand .pc .n{color:#d4f5a6}
.sec.brand .pcs{border-color:#ffffff22}
.sec.brand .proc{position:relative}
.sec.brand .proc:before{content:"";position:absolute;left:6%;right:6%;top:82px;height:2px;background:linear-gradient(90deg,transparent,#ffffffaa,transparent);background-size:40% 100%;background-repeat:no-repeat;animation:lvflow 4s linear infinite;z-index:0;opacity:.7}
@keyframes lvflow{from{background-position:-40% 0}to{background-position:140% 0}}
.sec.brand .pc{position:relative;z-index:1}

/* spacing between neighbouring panels */
.sec.bright+.sec,.sec.brand+.sec,.sec+.sec.bright,.sec+.sec.brand{padding-top:104px}
.sec.alt+.sec.bright,.sec.bright+.sec.alt,.sec.brand+.sec.alt,.sec.alt+.sec.brand{margin-top:16px}

/* hero: headline, text and buttons arrive in sequence on load */
.hero.hA .rate,.hero.hA h1 .kw{animation:lvup .8s .05s both}
.hero.hA h1 .dl{display:block;animation:lvup .9s .15s both}
.hero.hA .lead{animation:lvup .9s .3s both}
.hero.hA .acts{animation:lvup .9s .42s both}

/* primary buttons: a slow light sweep */
.btn.p{position:relative;overflow:hidden}
.btn.p:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,#ffffff3d 50%,transparent 65%);transform:translateX(-130%);animation:lvshine 5s ease-in-out infinite;pointer-events:none}
@keyframes lvshine{0%,60%{transform:translateX(-130%)}85%,100%{transform:translateX(130%)}}

/* service cards: slight lift and tilt on hover */
.sg{transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s,border-color .45s}
.sg:hover{transform:perspective(900px) rotateX(2.5deg) translateY(-6px)}

/* stop decorative motion when paused or reduced */
body.still .btn.p:after,body.still .sec.brand .proc:before,body.still .hero.hA *{animation:none!important}
@media(prefers-reduced-motion:reduce){.btn.p:after,.sec.brand .proc:before{animation:none!important}.hero.hA .rate,.hero.hA h1 .kw,.hero.hA h1 .dl,.hero.hA .lead,.hero.hA .acts{animation:none!important}.rv{transform:none}}
@media(max-width:700px){.sec.bright,.sec.brand{margin:0 8px;border-radius:28px}.sec.bright+.sec,.sec.brand+.sec,.sec+.sec.bright,.sec+.sec.brand{padding-top:72px}.sec.brand .proc:before{display:none}}


.sec.bright .wb-c p,.sec.bright .wb-c small,.sec.bright .wb-v span{color:var(--muted)}.sec.bright .wb-c h3{color:#fff}


/* v21: pause animations that are off-screen */
.offscreen,.offscreen *,.offscreen::before,.offscreen::after,.offscreen *::before,.offscreen *::after{animation-play-state:paused!important}


/* =====================================================================
   V22: moving hero colour field, client logo marquee, colour-led work
   cards, arrows between process steps, 6G areas light up in sequence
   ===================================================================== */
/* hero: the corner glows drift slowly instead of sitting still */
.hero{background:radial-gradient(60% 50% at 50% 0%,#2a1a5540,transparent 70%),#000;overflow:hidden}
.hero:after{inset:-25%;background:radial-gradient(26% 34% at 18% 18%,#0f9b78c4,transparent 70%),radial-gradient(28% 36% at 82% 82%,#6a3df0c8,transparent 70%),radial-gradient(18% 22% at 72% 22%,#7F52EE55,transparent 70%),radial-gradient(16% 20% at 26% 80%,#9ECD5F30,transparent 70%);animation:lvhero 16s ease-in-out infinite alternate;will-change:transform}
@keyframes lvhero{0%{transform:translate3d(-5%,-3%,0) rotate(-4deg) scale(1)}50%{transform:translate3d(4%,3%,0) rotate(6deg) scale(1.1)}100%{transform:translate3d(6%,-4%,0) rotate(-2deg) scale(1.04)}}

/* client logos: continuous right-to-left marquee, tighter band */
.sec.tr{padding:40px 0 44px}.sec.tr .tl{margin-bottom:16px}.sec.tr .stats2{margin-top:28px}
.mq{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.logos2.mq-t{display:flex;flex-wrap:nowrap;justify-content:flex-start;gap:0;width:max-content;animation:lvmq 30s linear infinite}
.logos2.mq-t span{padding:0 26px}
.mq:hover .mq-t{animation-play-state:paused}
@keyframes lvmq{to{transform:translate3d(-50%,0,0)}}
@media(max-width:900px){.logos2.mq-t{flex-wrap:nowrap;justify-content:flex-start}.logos2.mq-t span{padding:0 18px}}

/* work: solid paper-tone cards with dark type, so each case reads like a printed spread on the dark panel */
.case{border:0!important;color:#16112c;box-shadow:0 30px 60px -36px #000c!important}
.cases .case:nth-child(3n+1){background:#e4dcff!important}
.cases .case:nth-child(3n+2){background:#d9f1be!important}
.cases .case:nth-child(3n){background:#f3e5cf!important}
.case h3{color:#16112c!important}.case p{color:#3d3656!important}
.case .k{color:#4a3a8c!important;font-weight:600}
.case .tags span{background:#16112c0d!important;border:1px solid #16112c26!important;color:#16112c!important}
.case .rd{display:inline-flex;align-items:center;gap:6px;margin-top:6px;padding:10px 18px;border-radius:999px;background:#16112c;color:#fff!important;font-weight:600;transition:transform .2s}
.case:hover .rd{transform:translateX(4px)}
.cv{background:#16112c0f!important;border:1px solid #16112c1a!important}

/* process rows: a plain arrow leads from each step to the next */
.proc{gap:30px}
.proc>.pc{position:relative}
.proc>.pc:not(:last-child):after{content:"";position:absolute;top:74px;right:-30px;width:30px;height:30px;border-radius:50%;z-index:3;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235b34c4' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/14px no-repeat;box-shadow:0 4px 12px #0005;animation:lvhand 4s cubic-bezier(.3,.7,.25,1) infinite}
/* the arrows take turns: each one leans forward and tints lime as the flow line passes it, then rests */
.proc>.pc:nth-child(1):after{animation-delay:.6s}.proc>.pc:nth-child(2):after{animation-delay:1.6s}.proc>.pc:nth-child(3):after{animation-delay:2.6s}
@keyframes lvhand{0%,22%,100%{transform:translateX(0) scale(1);background-color:#fff}7%{transform:translateX(5px) scale(1.08);background-color:#d4f5a6}13%{transform:translateX(-1px) scale(1);background-color:#eef9df}}
body.still .proc>.pc:after{animation:none!important}@media(prefers-reduced-motion:reduce){.proc>.pc:after{animation:none!important}}
.sec.brand .proc:before{top:88px}
@media(max-width:1000px){.proc>.pc:after{display:none!important}.proc{gap:20px}}

/* 6G: arrows between areas, and each area lights up in turn with its icon */
.g6-row{gap:26px}
.g6-row:before{display:none}
.g6-i{position:relative}
.g6-i:not(:last-child):after{content:"";position:absolute;top:30px;right:-21px;width:16px;height:16px;z-index:2;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ECD5F' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E") center/16px no-repeat;opacity:.9}
.g6-i a{animation:g6act 9s ease-in-out infinite;animation-delay:calc(var(--i)*1.5s)}
@keyframes g6act{0%,16%,100%{border-color:var(--line);background:var(--surface)}4%,11%{border-color:#9ECD5F88;background:linear-gradient(180deg,#7F52EE2e,#ffffff08)}}
@media(max-width:1100px){.g6-i:after{display:none}}

/* stop the new motion when paused or reduced */
body.still .mq-t,body.still .proc>.pc:after,body.still .g6-i a{animation:none!important}
@media(prefers-reduced-motion:reduce){.hero:after,.mq-t,.proc>.pc:after,.g6-i a{animation:none!important}}
/* ================= V23: visual hierarchy + critique fixes ================= */
/* accent budget: the gradient word stays on the hero and the key sections (work, why us, plans, reviews, booking) */
.sec.q .sh h2 em,.sec.qe .sh h2 em,.duo-s .band h2 em{background:none;-webkit-text-fill-color:currentColor;color:inherit}
/* supporting sections: smaller, left-aligned header with a plain label instead of a pill */
.sec.q .sh{margin-bottom:38px;max-width:820px}
.sec.q .sh h2{font-size:clamp(28px,3vw,42px);letter-spacing:-.03em;margin-bottom:12px}
.sec.q .sh p{font-size:16.5px}
.sec.q .sh .pl{background:none;border:0;padding:0;border-radius:0;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#a49ec2;margin-bottom:14px}
.sec.q .sh .pl:before{box-shadow:none}
.sec.brand.q .sh .pl{color:#e3dcff}.sec.brand.q .sh .pl:before{background:#d4f5a6}
/* key sections: the largest headers on the page */
.sec.k .sh h2{font-size:clamp(36px,4.8vw,64px)}
/* plans: the recommended plan is the one bright card, price large and dark */
.plans .plan.feat{background:radial-gradient(90% 55% at 50% 0%,#ddd0ff,transparent 70%),#f6f3ff!important;border:1px solid #ffffff!important;color:#3d3656}
.plans .plan.feat h3{color:#16112c}
.plans .plan.feat .pr{background:none;-webkit-text-fill-color:#16112c;color:#16112c}
.plans .plan.feat .tg,.plans .plan.feat .md{color:#4a3a8c}
.plans .plan.feat .ln2,.plans .plan.feat li{color:#3d3656}
.plans .plan.feat .lk{color:#4a2fb8}
.plans .plan.feat .pbadge{background:#16112c;color:#fff;border-color:#16112c}
.plans .plan:not(.feat) .pr{font-size:46px}
/* bento "Prices before we start": a short price list instead of loose chips */
.wb-price{flex-direction:column;flex-wrap:nowrap;align-items:stretch;justify-content:center;gap:0;min-height:150px}
.wb-price span{display:flex;flex-direction:row-reverse;justify-content:space-between;align-items:baseline;background:none;border:0;border-bottom:1px dashed #ffffff26;border-radius:0;padding:10px 2px;font-size:17px}
.wb-price small{font-size:13px;color:var(--muted)}
.wb-price em{margin:12px 0 0 2px}
/* footer: the services list gets the room it needs */
@media(min-width:1001px){.fcols{grid-template-columns:1.1fr 1.9fr .9fr .9fr 1.1fr!important}}
/* 6G on narrow screens: show the step count while swiping */
@media(max-width:1100px){.g6-n:after{content:" / 06";color:var(--dim)}}
/* laptop screens (about 800px tall): hero tiles clear the floating dock */
@media(min-width:1001px) and (max-height:900px){.hero.hA{padding-top:64px}.hero.hA .htiles{margin-top:22px}.hero.hA .ht-sc{height:80px}.hero.hA .lead{margin-bottom:22px}}
/* hero fallback: if the entrance animation never plays, the content is shown as is */
.nohero .hero .rate,.nohero .hero h1,.nohero .hero h1 .kw,.nohero .hero h1 .dl,.nohero .hero .lead,.nohero .hero .acts,.nohero .hero .pill,.nohero .ht{animation:none!important;opacity:1!important;transform:none!important}/* ================= V24: Cal.com booking + live brief form ================= */
/* the calendar takes the full width so Cal.com can show details, dates and times side by side */
.book{grid-template-columns:1fr;gap:34px;align-items:start}
@media(min-width:901px){.book-l{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);column-gap:56px;align-items:start}.book-l>.pl,.book-l>h2{grid-column:1}.book-l>.pl{justify-self:start}.book-l>.book-pts,.book-l>.book-p,.book-l>.book-alt{grid-column:2}.book-l>.book-pts{grid-row:1/span 2;margin-top:6px}}
.calx{position:relative;min-height:560px;border-radius:24px;background:#0b0b11;border:1px solid #ffffff17;box-shadow:0 30px 70px -30px #000;overflow:hidden}
.calx iframe{display:block;width:100%!important;border:0}
.calx-load{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:28px;text-align:center;color:var(--muted);transition:opacity .4s ease}
.calx-load b{color:#fff;font:600 18px var(--head)}
.calx.ready .calx-load{opacity:0;pointer-events:none}
.done .calx{margin-top:22px;min-height:620px}
.done.err{border-color:#e2725b88}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
@media(max-width:900px){.book{grid-template-columns:1fr}.calx{min-height:640px}}
/* aligned edges for the left-aligned headers */
.sec.q .cm{max-width:none}
@media(min-width:1001px){.sec.fq .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.9fr);gap:64px;align-items:start}.sec.fq .sh{position:sticky;top:96px;margin:0}.sec.fq .faq{max-width:none;width:auto;margin:0}}
.ft .cc a{break-inside:avoid}
/* ================= V25: premium pass (owner QC) ================= */
/* spacing system: one rhythm for every section and gutter */
:root{--sec-y:clamp(72px,8.5vw,116px);--gut:clamp(20px,4vw,40px);--sh-gap:clamp(36px,4.5vw,56px)}
.wrap{padding-left:max(var(--gut),env(safe-area-inset-left,0px));padding-right:max(var(--gut),env(safe-area-inset-right,0px))}
.sec{padding:var(--sec-y) 0}
.sh{margin-bottom:var(--sh-gap)}
.sec.q .sh{margin-bottom:calc(var(--sh-gap) - 8px)}
.sec.bright,.sec.alt,.sec.brand{margin-top:0;margin-bottom:0}
.sec.bright+.sec,.sec.brand+.sec,.sec+.sec.bright,.sec+.sec.brand{padding-top:var(--sec-y)}
main>.sec+.sec.bright,main>.sec.bright+.sec,main>.sec+.sec.alt,main>.sec.alt+.sec{margin-top:clamp(10px,1.4vw,18px)}
/* real logo (text stays for screen readers) */
.logo{display:inline-block;width:156px;height:39px;background:url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0nMS4wJyBlbmNvZGluZz0ndXRmLTgnPz4NCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSItMTIgLTExNC4wMDAwIDg2Ni41NjY2IDEyNy4yMzI1IiByb2xlPSJpbWciIGFyaWEtbGFiZWw9IkxlYWRzVmVjdG9yIj48dGl0bGU+TGVhZHNWZWN0b3IgLyBWaW9sZXQgZ3JhZGllbnQgLyBTZW1pQm9sZDwvdGl0bGU+PG1ldGFkYXRhPnsiaWQiOiAiRzIiLCAibmFtZSI6ICJWaW9sZXQgZ3JhZGllbnQgLyBTZW1pQm9sZCIsICJmb250IjogIlBvcHBpbnMiLCAid2VpZ2h0IjogNjAwLCAidHJhY2tpbmciOiAtMC44LCAiY2FwIjogOTYsICJtYXJrSCI6IDEwMiwgImxlZnRHYXAiOiAtNSwgInJpZ2h0R2FwIjogLTExLCAiYXJyb3ciOiAiZ3JhZGllbnQiLCAiaW50ZWdyYXRlZCI6IHRydWUsICJ0aGVtZSI6ICJkYXJrIiwgIm9yaWdpbmFsVlBhdGhzUHJlc2VydmVkIjogdHJ1ZSwgIm9yaWdpbmFsU3Ryb2tlT21pdHRlZCI6IHRydWUsICJvdXRsaW5lZCI6IHRydWUsICJwYWNrYWdlZFNlbGVjdGlvbiI6ICJCcmFuZCBLaXQgdjEgLyBHMiJ9PC9tZXRhZGF0YT48ZGVmcz48bGluZWFyR3JhZGllbnQgaWQ9Imx2LWFycm93IiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjY0MCIgeTE9IjU2MCIgeDI9Ijc2MCIgeTI9IjI4OCI+PHN0b3Agb2Zmc2V0PSIwIiBzdG9wLWNvbG9yPSIjNzIzOUVDIiAvPjxzdG9wIG9mZnNldD0iLjU1IiBzdG9wLWNvbG9yPSIjQTQ3N0ZGIiAvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI0Q1QkVGRiIgLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48ZyBmaWxsPSIjRkZGRkZGIj48ZyBpZD0ibHYtbGVhZHMiPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKC05LjQ0OTQgMCkiPjxwYXRoIGRhdGEtbGV0dGVyPSJMIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjAwMDAgMCkgc2NhbGUoMC4xMzY5NDcyIC0wLjEzNjk0NzIpIiBkPSJNMjA5IDExMUg0MzlWMEg2OVY2OThIMjA5WiIgLz48cGF0aCBkYXRhLWxldHRlcj0iZSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNjIuMDU4OCAwKSBzY2FsZSgwLjEzNjk0NzIgLTAuMTM2OTQ3MikiIGQ9Ik01ODAgMjM1SDE3NVExODAgMTc1IDIxNy4wIDE0MS4wUTI1NCAxMDcgMzA4IDEwN1EzODYgMTA3IDQxOSAxNzRINTcwUTU0NiA5NCA0NzguMCA0Mi41UTQxMCAtOSAzMTEgLTlRMjMxIC05IDE2Ny41IDI2LjVRMTA0IDYyIDY4LjUgMTI3LjBRMzMgMTkyIDMzIDI3N1EzMyAzNjMgNjguMCA0MjguMFExMDMgNDkzIDE2Ni4wIDUyOC4wUTIyOSA1NjMgMzExIDU2M1EzOTAgNTYzIDQ1Mi41IDUyOS4wUTUxNSA0OTUgNTQ5LjUgNDMyLjVRNTg0IDM3MCA1ODQgMjg5UTU4NCAyNTkgNTgwIDIzNVpNNDM5IDMyOVE0MzggMzgzIDQwMC4wIDQxNS41UTM2MiA0NDggMzA3IDQ0OFEyNTUgNDQ4IDIxOS41IDQxNi41UTE4NCAzODUgMTc2IDMyOVoiIC8+PHBhdGggZGF0YS1sZXR0ZXI9ImEiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE0NS43NTUyIDApIHNjYWxlKDAuMTM2OTQ3MiAtMC4xMzY5NDcyKSIgZD0iTTI4NiA1NjNRMzQ4IDU2MyAzOTQuNSA1MzguMFE0NDEgNTEzIDQ2OSA0NzVWNTU0SDYxMFYwSDQ2OVY4MVE0NDIgNDIgMzk0LjUgMTYuNVEzNDcgLTkgMjg1IC05UTIxNSAtOSAxNTcuNSAyNy4wUTEwMCA2MyA2Ni41IDEyOC41UTMzIDE5NCAzMyAyNzlRMzMgMzYzIDY2LjUgNDI4LjBRMTAwIDQ5MyAxNTcuNSA1MjguMFEyMTUgNTYzIDI4NiA1NjNaTTMyMiA0NDBRMjgzIDQ0MCAyNTAuMCA0MjEuMFEyMTcgNDAyIDE5Ni41IDM2NS41UTE3NiAzMjkgMTc2IDI3OVExNzYgMjI5IDE5Ni41IDE5MS41UTIxNyAxNTQgMjUwLjUgMTM0LjBRMjg0IDExNCAzMjIgMTE0UTM2MSAxMTQgMzk1LjAgMTMzLjVRNDI5IDE1MyA0NDkuMCAxODkuNVE0NjkgMjI2IDQ2OSAyNzdRNDY5IDMyOCA0NDkuMCAzNjQuNVE0MjkgNDAxIDM5NS4wIDQyMC41UTM2MSA0NDAgMzIyIDQ0MFoiIC8+PHBhdGggZGF0YS1sZXR0ZXI9ImQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIzNy44MDU0IDApIHNjYWxlKDAuMTM2OTQ3MiAtMC4xMzY5NDcyKSIgZD0iTTI4NyA1NjNRMzQxIDU2MyAzOTAuMCA1MzkuNVE0MzkgNTE2IDQ2OCA0NzdWNzQwSDYxMFYwSDQ2OFY4MlE0NDIgNDEgMzk1LjAgMTYuMFEzNDggLTkgMjg2IC05UTIxNiAtOSAxNTguMCAyNy4wUTEwMCA2MyA2Ni41IDEyOC41UTMzIDE5NCAzMyAyNzlRMzMgMzYzIDY2LjUgNDI4LjBRMTAwIDQ5MyAxNTguMCA1MjguMFEyMTYgNTYzIDI4NyA1NjNaTTMyMiA0NDBRMjgzIDQ0MCAyNTAuMCA0MjEuMFEyMTcgNDAyIDE5Ni41IDM2NS41UTE3NiAzMjkgMTc2IDI3OVExNzYgMjI5IDE5Ni41IDE5MS41UTIxNyAxNTQgMjUwLjUgMTM0LjBRMjg0IDExNCAzMjIgMTE0UTM2MSAxMTQgMzk1LjAgMTMzLjVRNDI5IDE1MyA0NDkuMCAxODkuNVE0NjkgMjI2IDQ2OSAyNzdRNDY5IDMyOCA0NDkuMCAzNjQuNVE0MjkgNDAxIDM5NS4wIDQyMC41UTM2MSA0NDAgMzIyIDQ0MFoiIC8+PHBhdGggZGF0YS1sZXR0ZXI9InMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMyOS44NTU2IDApIHNjYWxlKDAuMTM2OTQ3MiAtMC4xMzY5NDcyKSIgZD0iTTM5IDE3NUgxODBRMTg0IDE0MyAyMTEuNSAxMjIuMFEyMzkgMTAxIDI4MCAxMDFRMzIwIDEwMSAzNDIuNSAxMTcuMFEzNjUgMTMzIDM2NSAxNThRMzY1IDE4NSAzMzcuNSAxOTguNVEzMTAgMjEyIDI1MCAyMjhRMTg4IDI0MyAxNDguNSAyNTkuMFExMDkgMjc1IDgwLjUgMzA4LjBRNTIgMzQxIDUyIDM5N1E1MiA0NDMgNzguNSA0ODEuMFExMDUgNTE5IDE1NC41IDU0MS4wUTIwNCA1NjMgMjcxIDU2M1EzNzAgNTYzIDQyOS4wIDUxMy41UTQ4OCA0NjQgNDk0IDM4MEgzNjBRMzU3IDQxMyAzMzIuNSA0MzIuNVEzMDggNDUyIDI2NyA0NTJRMjI5IDQ1MiAyMDguNSA0MzguMFExODggNDI0IDE4OCAzOTlRMTg4IDM3MSAyMTYuMCAzNTYuNVEyNDQgMzQyIDMwMyAzMjdRMzYzIDMxMiA0MDIuMCAyOTYuMFE0NDEgMjgwIDQ2OS41IDI0Ni41UTQ5OCAyMTMgNDk5IDE1OFE0OTkgMTEwIDQ3Mi41IDcyLjBRNDQ2IDM0IDM5Ni41IDEyLjVRMzQ3IC05IDI4MSAtOVEyMTMgLTkgMTU5LjAgMTUuNVExMDUgNDAgNzMuNSA4Mi4wUTQyIDEyNCAzOSAxNzVaIiAvPjwvZz48L2c+PGcgaWQ9Imx2LWVjdG9yIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0OTAuOTM2NCAwKSI+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTQuNTE5MyAwKSI+PHBhdGggZGF0YS1sZXR0ZXI9ImUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAuMDAwMCAwKSBzY2FsZSgwLjEzNjk0NzIgLTAuMTM2OTQ3MikiIGQ9Ik01ODAgMjM1SDE3NVExODAgMTc1IDIxNy4wIDE0MS4wUTI1NCAxMDcgMzA4IDEwN1EzODYgMTA3IDQxOSAxNzRINTcwUTU0NiA5NCA0NzguMCA0Mi41UTQxMCAtOSAzMTEgLTlRMjMxIC05IDE2Ny41IDI2LjVRMTA0IDYyIDY4LjUgMTI3LjBRMzMgMTkyIDMzIDI3N1EzMyAzNjMgNjguMCA0MjguMFExMDMgNDkzIDE2Ni4wIDUyOC4wUTIyOSA1NjMgMzExIDU2M1EzOTAgNTYzIDQ1Mi41IDUyOS4wUTUxNSA0OTUgNTQ5LjUgNDMyLjVRNTg0IDM3MCA1ODQgMjg5UTU4NCAyNTkgNTgwIDIzNVpNNDM5IDMyOVE0MzggMzgzIDQwMC4wIDQxNS41UTM2MiA0NDggMzA3IDQ0OFEyNTUgNDQ4IDIxOS41IDQxNi41UTE4NCAzODUgMTc2IDMyOVoiIC8+PHBhdGggZGF0YS1sZXR0ZXI9ImMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDgzLjY5NjQgMCkgc2NhbGUoMC4xMzY5NDcyIC0wLjEzNjk0NzIpIiBkPSJNMzA3IDU2M1E0MTAgNTYzIDQ3Ny41IDUxMS41UTU0NSA0NjAgNTY4IDM2N0g0MTdRNDA1IDQwMyAzNzYuNSA0MjMuNVEzNDggNDQ0IDMwNiA0NDRRMjQ2IDQ0NCAyMTEuMCA0MDAuNVExNzYgMzU3IDE3NiAyNzdRMTc2IDE5OCAyMTEuMCAxNTQuNVEyNDYgMTExIDMwNiAxMTFRMzkxIDExMSA0MTcgMTg3SDU2OFE1NDUgOTcgNDc3LjAgNDQuMFE0MDkgLTkgMzA3IC05UTIyNyAtOSAxNjUuMCAyNi41UTEwMyA2MiA2OC4wIDEyNi41UTMzIDE5MSAzMyAyNzdRMzMgMzYzIDY4LjAgNDI3LjVRMTAzIDQ5MiAxNjUuMCA1MjcuNVEyMjcgNTYzIDMwNyA1NjNaIiAvPjxwYXRoIGRhdGEtbGV0dGVyPSJ0IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxNjUuMzM4NyAwKSBzY2FsZSgwLjEzNjk0NzIgLTAuMTM2OTQ3MikiIGQ9Ik0yMzIgNDM5VjE3MVEyMzIgMTQzIDI0NS41IDEzMC41UTI1OSAxMTggMjkxIDExOEgzNTZWMEgyNjhROTEgMCA5MSAxNzJWNDM5SDI1VjU1NEg5MVY2OTFIMjMyVjU1NEgzNTZWNDM5WiIgLz48cGF0aCBkYXRhLWxldHRlcj0ibyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjE3LjY3NDIgMCkgc2NhbGUoMC4xMzY5NDcyIC0wLjEzNjk0NzIpIiBkPSJNMzQgMjc3UTM0IDM2MiA3MS41IDQyNy4wUTEwOSA0OTIgMTc0LjAgNTI3LjVRMjM5IDU2MyAzMTkgNTYzUTM5OSA1NjMgNDY0LjAgNTI3LjVRNTI5IDQ5MiA1NjYuNSA0MjcuMFE2MDQgMzYyIDYwNCAyNzdRNjA0IDE5MiA1NjUuNSAxMjcuMFE1MjcgNjIgNDYxLjUgMjYuNVEzOTYgLTkgMzE1IC05UTIzNSAtOSAxNzEuMCAyNi41UTEwNyA2MiA3MC41IDEyNy4wUTM0IDE5MiAzNCAyNzdaTTQ2MCAyNzdRNDYwIDM1NiA0MTguNSAzOTguNVEzNzcgNDQxIDMxNyA0NDFRMjU3IDQ0MSAyMTYuNSAzOTguNVExNzYgMzU2IDE3NiAyNzdRMTc2IDE5OCAyMTUuNSAxNTUuNVEyNTUgMTEzIDMxNSAxMTNRMzUzIDExMyAzODYuNSAxMzEuNVE0MjAgMTUwIDQ0MC4wIDE4Ny4wUTQ2MCAyMjQgNDYwIDI3N1oiIC8+PHBhdGggZGF0YS1sZXR0ZXI9InIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMwNC4yNDY1IDApIHNjYWxlKDAuMTM2OTQ3MiAtMC4xMzY5NDcyKSIgZD0iTTM3OSA1NjJWNDE1SDM0MlEyNzYgNDE1IDI0Mi41IDM4NC4wUTIwOSAzNTMgMjA5IDI3NlYwSDY5VjU1NEgyMDlWNDY4UTIzNiA1MTIgMjc5LjUgNTM3LjBRMzIzIDU2MiAzNzkgNTYyWiIgLz48L2c+PC9nPjxnIGlkPSJsdi1vcmlnaW5hbC12IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzODMuNzQyOSAtMTAyLjAwMDApIHNjYWxlKDAuMTg2MTMxMzkpIHRyYW5zbGF0ZSgtMTgzIC0yODgpIj48cGF0aCBpZD0ibHYtdi1zdHJva2UiIGQ9Ik0xODMgMjg4SDM1N1EzNzEgMjg4IDM3OCAzMDBMNTkxIDY1NlE1OTkgNjY5IDU5MSA2ODJMNTAwIDgzNloiIGZpbGw9IiNGRkZGRkYiIC8+PHBhdGggaWQ9Imx2LWFycm93LXNoYXBlIiBkPSJNNTA2IDI4OEg4MThMNjU2IDU2OEw2MTggNTAyUTYxMyA0OTIgNjE4IDQ4Mkw2ODQgMzY2SDU0OFE1MzggMzY2IDUzMiAzNTdaIiBmaWxsPSJ1cmwoI2x2LWFycm93KSIgLz48L2c+PC9nPjwvc3ZnPg==") left center/contain no-repeat;color:transparent!important;font-size:0!important;line-height:0;overflow:hidden;vertical-align:middle}
.top .logo{width:176px;height:44px}
.top{padding-top:22px}
/* hero: headline first, calmer stack */
.hero.hA .rate{margin-bottom:22px}
.hero.hA h1 .dl{margin-top:0}
/* work: three cards side by side (no sticky stacking that covered the headings) */
@media(min-width:1001px){
 .cases{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;align-items:stretch}
 .cases .case{position:relative!important;top:auto!important;display:flex;flex-direction:column;gap:22px;padding:26px;border-radius:28px}
 .cases .case .cv{order:-1;margin:0}
 .cases .case h3{font-size:clamp(20px,1.6vw,24px);line-height:1.25;margin:10px 0 14px}
 .cases .case .rd{margin-top:auto}
 .cases .case>div:not(.cv){display:flex;flex-direction:column;flex:1}
}
/* light sections: readable text inside the dark cards they hold */
.sec.bright .sg p,.sec.bright .ic p,.sec.bright .sg .chips a{color:var(--muted)}
.sec.bright .sg h3,.sec.bright .ic h3{color:#fff}
.sec.bright.q .sh .pl,.sec.bright.qe .sh .pl{color:#5b4d8f}
.sec.bright.q .sh .pl:before{background:#5fa32f}
.sec.bright .sg,.sec.bright .ic{box-shadow:0 24px 50px -28px #2a1a6b66}
/* calendar: calm placeholder shaped like the calendar, then the real one fades in */
.book-meta{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.book-meta span{padding:6px 12px;border-radius:999px;background:#ffffff0d;border:1px solid #ffffff1f;color:#e9e6f5;font-size:13px;font-weight:600}
.calx{background:#0d0c14;min-height:520px}
.calx-load{justify-content:center;gap:16px}
.calx-sk{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;width:min(420px,86%)}
.calx-sk i{aspect-ratio:1;border-radius:10px;background:#ffffff0d}
.calx-sk i:nth-child(7n),.calx-sk i:nth-child(7n+1){background:#ffffff05}
@media(prefers-reduced-motion:no-preference){.calx-sk i{animation:lvsk 1.6s ease-in-out infinite;animation-delay:calc(var(--k,0)*1s)}.calx-sk i:nth-child(odd){--k:.15}}
@keyframes lvsk{0%,100%{opacity:.55}50%{opacity:1}}
body.still .calx-sk i{animation:none}
/* scenes: elements fade out only briefly, so cards never sit empty */
@keyframes vpop{0%{opacity:0;scale:.86}8%,92%{opacity:1;scale:1}100%{opacity:0;scale:1}}
.ht-sc{height:108px}
.ht-sc .vs{transform:scale(1.18);transform-origin:center}
/* mobile: designed, not just stacked */
@media(max-width:700px){
 :root{--sec-y:64px;--gut:20px;--sh-gap:32px}
 body{padding-bottom:84px}
 .top{padding-top:16px}.top .logo{width:150px;height:38px}
 .hero.hA{padding-top:84px}
 .hero.hA h1{font-size:clamp(34px,9.6vw,44px);line-height:1.08}
 .hero.hA .lead{font-size:16px;line-height:1.6;margin-bottom:24px}
 .hero.hA .acts{flex-direction:column;align-items:stretch;max-width:340px;margin:0 auto}
 .hero.hA .acts .btn{justify-content:center}
 h2,.sec h2,.sec.k .sh h2{font-size:clamp(28px,7.8vw,36px);line-height:1.12}
 .sec.q .sh h2{font-size:clamp(26px,7.2vw,32px)}
 .sh p,.sec.q .sh p{font-size:15.5px}
 .sec.bright,.sec.alt,.sec.brand{border-radius:28px;margin-left:8px;margin-right:8px}
 .book{padding:24px 18px}
 .calx{min-height:600px}
}
/* hero clears the real logo at every desktop height */
.hero.hA{padding-top:112px}
@media(min-width:1001px) and (max-height:900px){.hero.hA{padding-top:100px}.hero.hA .htiles{margin-top:20px}.hero.hA .ht-sc{height:84px}}
@media(max-width:700px){.hero.hA{padding-top:84px}}

/* ================= V26: platform logos, tech stack, legal pages ================= */
/* hero logo circles: white brand mark on the brand colour; "+" opens the full stack */
.hic i.lg{display:inline-grid;place-items:center;color:#fff}
.hic i.lg svg{width:54%;height:54%}
.hic i.lg b{font:700 1em/1 var(--head);letter-spacing:-.02em}
.hic i.lg::before{content:none!important}
.hic-more{display:inline-grid;place-items:center;width:.8em;height:.8em;margin-left:.08em;border-radius:50%;font:600 .5em/1 var(--sans);color:#fff;background:#ffffff14;border:1.5px dashed #ffffff59;text-decoration:none;vertical-align:middle;transition:transform .25s cubic-bezier(.3,.7,.25,1),background .25s,border-color .25s}
.hic-more:hover,.hic-more:focus-visible{transform:translateY(-2px) rotate(90deg);background:#7F52EE;border-color:#7F52EE}
/* tech stack: rows drift in alternate directions, layer by layer */
.anchor{position:relative;top:-24px}
.tstack{display:grid;gap:22px}
.tsl>span{display:block;margin:0 0 10px 4px;font:600 12px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#a49ec2}
.tsr{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.tst{display:flex;gap:12px;width:max-content;animation:lvstack var(--dur,48s) linear infinite}
.tsr.rev .tst{animation-direction:reverse}
.tsr:hover .tst{animation-play-state:paused}
@keyframes lvstack{to{transform:translate3d(-33.333%,0,0)}}
.tsk{display:inline-flex;align-items:center;gap:10px;padding:10px 16px 10px 10px;border-radius:999px;background:#ffffff0a;border:1px solid #ffffff17;color:#eceaf6;font:600 14.5px var(--sans);white-space:nowrap}
.tsk i{width:32px;height:32px;border-radius:50%;display:inline-grid;place-items:center;background:var(--c);color:#fff;flex:none}
.tsk i svg{width:17px;height:17px}.tsk i b{font:700 12px var(--head)}
.tsn{margin:8px 0 0;text-align:center;color:var(--muted);font-size:15px}
body.still .tst{animation:none}
@media(prefers-reduced-motion:reduce){.tst{animation:none;flex-wrap:wrap;width:auto}.tsr{-webkit-mask-image:none;mask-image:none}}
/* legal pages: readable column */
.legal{max-width:760px;margin:0 auto;display:grid;gap:30px}
.legal h2{font-size:clamp(20px,2vw,24px);margin:0 0 10px;color:#fff;text-align:left}
.legal p,.legal li{color:var(--muted);font-size:16px;line-height:1.7}
.legal a{color:#c4b0ff}
.legal-date{font-size:14px!important;color:var(--dim)!important}
/* "+" matches the logo circles (they are 3.1em of .26em = .806em of the headline) */
.hic-more{font-size:.42em;width:1.92em;height:1.92em;margin-left:.18em;border-width:2px;transform:translateY(-.04em)}
/* the drifting rows must never widen the grid */
.tstack{grid-template-columns:minmax(0,1fr)}.tsl,.tsr{min-width:0;max-width:100%}
.tsn{letter-spacing:normal}

/* V27: company disclosure line in the footer */
.ft small{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px}
.ft-co{max-width:820px;font-size:12.5px;line-height:1.6;color:var(--dim)}
/* V28: full-colour vendor marks (HighLevel, ClickFunnels) fill a little more of their circle */
.hic i.lg svg.full,.tsk i svg.full{width:70%;height:70%}
.hic i.lg img.full,.tsk i img.full{width:68%;height:68%;object-fit:contain;display:block}

/* ================= V29: hero logos as one blended group ================= */
/* each circle overlaps the previous one; a ring in the page colour cuts a clean edge where they meet */
.hic{gap:0;align-items:center}
.hic i.lg,.hic-more{border:0!important;box-shadow:0 0 0 .18em #0d0b16,0 .25em .6em -.2em #0008}
.hic i.lg+i.lg{margin-left:-.95em}
.hic i.lg img.full{width:64%;height:64%}
.hic i.lg svg.full{width:72%;height:72%}
.hic-more{margin-left:-.58em;background:#7F52EE;border:0;color:#fff;font-weight:700}
.hic-more span{font-size:.56em;letter-spacing:-.02em;line-height:1}
.hic-more:hover,.hic-more:focus-visible{transform:translateY(-.12em);background:#9068f2;border:0}
/* tech stack chips: white circles for full-colour marks get a hairline so they sit on the dark row */
.tsk i{box-shadow:0 0 0 1px #ffffff14}
.tsk i img.full{width:66%;height:66%}
/* HighLevel (core platform): same circle size, the mark fills more of it */
.hic i.lg svg.full,.tsk i svg.full{width:84%;height:84%}
/* V29 tuning: lighter overlap so every mark stays readable; solid original colours (no tint) */
.hic i.lg+i.lg{margin-left:-.62em}
.hic-more{margin-left:-.38em}
.hic i.lg{background:var(--c)!important}
.hic i.lg img.cover,.tsk i img.cover{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}
.tsk i{overflow:hidden}
/* Zapier's lettering sits a little inside its circle so the "+N" overlap never covers it */
.hic i.lg img.cover{width:86%;height:86%;border-radius:0;transform:translateX(-4%)}
.hic-more{margin-left:-.24em}
.hic i.lg{overflow:hidden}
/* V30: the "more tools" bubble is a plain plus on the brand gradient */
.hic-more{background:linear-gradient(135deg,#9a76ff 0%,#7F52EE 45%,#432E72 100%)!important}
.hic-more svg{width:46%;height:46%;transition:transform .35s cubic-bezier(.3,.7,.25,1)}
.hic-more:hover,.hic-more:focus-visible{background:linear-gradient(135deg,#ad8fff 0%,#8a60f2 45%,#4f3685 100%)!important}
.hic-more:hover svg,.hic-more:focus-visible svg{transform:rotate(90deg)}

/* ================= V31: result lines, "New" badges, custom-quote bars, included block, value list, Growth Partner tiers ================= */
.opt.has-bd,.oc.has-bd{position:relative}
.nbd{display:inline-flex;align-items:center;gap:6px;margin:0 0 10px;padding:4px 11px 4px 9px;border-radius:999px;background:linear-gradient(135deg,#9ECD5F,#7fb83f);color:#10210a;font:700 11px/1 var(--head);letter-spacing:.08em;text-transform:uppercase}
.nbd::before{content:"";width:6px;height:6px;border-radius:50%;background:#10210a;animation:nbdp 2.4s ease-in-out infinite}
@keyframes nbdp{0%,100%{opacity:1}50%{opacity:.35}}
.still .nbd::before{animation:none}
@media (prefers-reduced-motion:reduce){.nbd::before{animation:none}}
.oc .nbd{position:absolute;top:-11px;left:22px;margin:0;box-shadow:0 6px 16px -6px #9ECD5Faa}
.opt .otag,.oc .otag{margin:4px 0 8px;font:italic 500 16.5px/1.4 'Playfair Display',Georgia,serif;color:#5a38f0}
.oc .otag{color:#c4b0ff}
.cbar{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;margin:6px 0 0;padding:18px 24px;border-radius:18px;border:1.5px dashed #7F52EE66;background:#7F52EE0d;color:inherit;text-decoration:none;transition:.2s}
.cbar span{min-width:0;flex:1 1 280px;font-size:15px}
.cbar em{font-style:normal;font-weight:600;color:#5a38f0;white-space:nowrap}
.cbar:hover,.cbar:focus-visible{border-color:#7F52EE;background:#7F52EE17}
.oc.more.cq{border-style:dashed;border-color:#8b6cff88}
.incl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.incl>div{display:flex;flex-direction:column;gap:6px;padding:20px 20px 22px;border-radius:18px;background:#fff;box-shadow:0 2px 0 #14102b0d,0 14px 30px #14102b0f}
.incl b{font:600 16px var(--head);color:#16112c}
.incl b::before{content:"✓";display:inline-grid;place-items:center;width:22px;height:22px;margin-right:9px;border-radius:50%;background:#9ECD5F;color:#10210a;font-size:12px;vertical-align:1px}
.incl span{font-size:14.5px;color:#4a4560}
.worth{display:grid;gap:0;max-width:640px;border-radius:18px;overflow:hidden;background:#fff;box-shadow:0 2px 0 #14102b0d,0 14px 34px #14102b0f}
.worth>div{display:flex;justify-content:space-between;gap:16px;padding:12px 20px;border-bottom:1px solid #14102b12;font-size:15px;color:#2b2640}
.worth>div b{color:#16112c;white-space:nowrap}
.worth .wt{background:#f4f1ff;font-weight:600}
.worth .wt s{color:#8a84a3;text-decoration-thickness:2px}
.worth .wt.now{background:var(--grad);color:#fff;border:0}.worth .wt.now b{color:#fff;font-size:18px}
.pc2 .worth{max-width:none;background:#ffffff0a;box-shadow:none;border:1px solid #ffffff17}
.pc2 .worth>div{color:#e7e3f5;border-color:#ffffff12}.pc2 .worth>div b{color:#fff}.pc2 .worth .wt{background:#ffffff0d}
.tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:start}
.tier{position:relative;display:flex;flex-direction:column;gap:12px;padding:30px 24px 26px;border-radius:24px;background:#fff;box-shadow:0 2px 0 #14102b0d,0 16px 38px #14102b12}
.tier.feat{outline:2px solid #7F52EE;box-shadow:0 22px 50px -18px #7F52EE77}
.tier h3{margin:0;font:600 22px var(--head);color:#16112c}
.tier .pr{font:700 38px/1 var(--head);color:#16112c}.tier .pr small{margin-left:6px;font:500 14px var(--body,inherit);color:#6b6585}
.tier p{margin:0;color:#4a4560;font-size:15px}
.tier ul{list-style:none;margin:6px 0 8px;padding:0;display:grid}
.tier li{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid #14102b10;font-size:14px;color:#4a4560}
.tier li b{color:#16112c;text-align:right}
.tier li:nth-last-child(-n+2) b{color:#5a38f0}
.tier .btn{align-self:stretch;text-align:center;justify-content:center}
.tnote{margin:22px 0 0;text-align:center;color:#4a4560}
.pc-wide{grid-column:1/-1;display:grid;gap:14px}
.pc-wide .tier{background:#ffffff0a;box-shadow:none;border:1px solid #ffffff17}
.pc-wide .tier h3,.pc-wide .tier .pr,.pc-wide .tier li b{color:#fff}.pc-wide .tier p,.pc-wide .tier li,.pc-wide .tnote{color:#cfc9e4}.pc-wide .tier li{border-color:#ffffff14}
.pc-wide .tier li:nth-last-child(-n+2) b{color:#c4b0ff}
@media (max-width:980px){.incl{grid-template-columns:repeat(2,minmax(0,1fr))}.tiers{grid-template-columns:minmax(0,1fr)}}
@media (max-width:520px){.incl{grid-template-columns:minmax(0,1fr)}.cbar{padding:16px 18px}.cbar em{white-space:normal}}
/* v31: result lines and custom bars sit on dark cards; light panels keep the deep purple */
.opt .otag,.cbar em{color:#c4b0ff}
.bright .opt .otag,.bright .cbar em{color:#5a38f0}
.cbar{border-color:#8b6cff66;background:#7F52EE14}
/* v31 padding fix: where the background changes (to or from a light or brand panel) the section keeps its full top space.
   The same-colour collapse rule (.sec:not(.alt):not(.light)+.sec:not(.alt)) used to win on specificity and left 24px. */
#main .sec.bright+.sec,#main .sec.brand+.sec,#main .sec+.sec.bright,#main .sec+.sec.brand{padding-top:var(--sec-y)}

/* v31: Who we help, six cards in a 3 x 2 grid, each opening with its own scene */
@media (min-width:1001px){.ind.ind6 .ic,.ind.ind6 .ic:nth-child(n+4){grid-column:span 2!important}}
.ind6 .ic{display:flex;flex-direction:column}
.ind6 .ic .pv.sm{height:168px;margin:-6px -6px 20px;padding:18px}
.ind6 .ic .lk{margin-top:auto}

/* v31: One team card shows the real platform marks instead of initials */
.wb-av.wb-lg{display:grid;place-items:center;overflow:hidden;background:var(--c);color:transparent;box-shadow:0 0 0 1px #ffffff1f}
.wb-av.wb-lg img,.wb-av.wb-lg svg{width:64%;height:64%;object-fit:contain}
.wb-av.wb-lg img.cover{width:100%;height:100%;object-fit:cover}

/* v31: 6G cards ask one question each and show three platform marks, plus a grey + that jumps to that stage's tech-stack row */
.g6-i a{padding-bottom:70px}
.g6-i .g6-q{margin:0 0 8px;font:italic 500 15.5px/1.4 'Playfair Display',Georgia,serif;color:#d8ccff}
.g6-tools{position:absolute;left:18px;bottom:18px;z-index:3;display:flex;align-items:center}
.g6-tools i.lg{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--c);color:#fff;box-shadow:0 0 0 3px #0d0b16;overflow:hidden}
.g6-tools i.lg+i.lg{margin-left:-8px}
.g6-tools i.lg svg{width:58%;height:58%}.g6-tools i.lg img.full,.g6-tools i.lg svg.full{width:64%;height:64%;object-fit:contain}.g6-tools i.lg img.cover{width:100%;height:100%;object-fit:cover}
.g6-more{display:grid;place-items:center;width:34px;height:34px;margin-left:-8px;border-radius:50%;background:#2a2638;color:#bdb7d1;box-shadow:0 0 0 3px #0d0b16;transition:.25s}
.g6-more svg{width:46%;height:46%;transition:transform .35s cubic-bezier(.3,.7,.2,1)}
.g6-more:hover,.g6-more:focus-visible{background:#3a3550;color:#fff}.g6-more:hover svg{transform:rotate(90deg)}
/* tech stack: closing card for tools that are not listed */
.ts-more{display:flex;align-items:center;gap:16px;margin:18px 0 0;padding:18px 22px;border-radius:18px;border:1.5px dashed #ffffff2e;color:inherit;text-decoration:none;transition:.2s}
.ts-more i{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#2a2638;color:#d6d0ea}
.ts-more i svg{width:46%;height:46%}
.ts-more b{display:block;font:600 16px var(--head);color:#fff}.ts-more small{color:#a49ec2;font-size:14px}
.ts-more:hover,.ts-more:focus-visible{border-color:#8b6cff}
.sec.bright .ts-more{border-color:#16112c26}.sec.bright .ts-more b{color:#16112c}.sec.bright .ts-more small{color:#4a4560}
.tsl{scroll-margin-top:90px}
/* v31: the AI line, on the Why card and in About */
.wb-c h3 em{font-family:'Playfair Display','Playfair FB',Georgia,serif;font-style:italic;font-weight:500;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.ai-line{margin:0 0 14px;font:600 15px var(--head);letter-spacing:.02em;color:#c4b0ff}
.ai-line em{font:italic 500 17px 'Playfair Display',Georgia,serif;color:#9ECD5F}
.wb-c h3 em{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:#c4b0ff} /* accent budget: gradient words stay on the hero and key sections */
/* the + is a link inside .g6-i, so undo the card styling that .g6-i a gives every link there */
.g6-i a.g6-more{display:grid;flex-direction:initial;width:34px;height:34px;padding:0;border:0;border-radius:50%;background:#2a2638;animation:none;transform:none}
.g6-i a.g6-more:before{display:none}
.g6-i a.g6-more:hover,.g6-i a.g6-more:focus-visible{background:#3a3550;box-shadow:0 0 0 3px #0d0b16;transform:none}
.wb-ic i.wb-lg{display:grid;place-items:center;overflow:hidden;background:var(--c);color:#fff}
.wb-ic i.wb-lg:before,.wb-ic i.wb-lg:after{content:none}
.wb-ic i.wb-lg svg{width:58%;height:58%}.wb-ic i.wb-lg img.full,.wb-ic i.wb-lg svg.full{width:64%;height:64%;object-fit:contain}.wb-ic i.wb-lg img.cover{width:100%;height:100%;object-fit:cover}
/* v31: longer result-led button labels wrap on small phones instead of widening the page */
@media (max-width:420px){.oc .ob{flex-wrap:wrap;gap:10px}.oc .ob .btn.s,.opt .btn.s{white-space:normal;text-align:center;max-width:100%}}

/* ================= V32: owner QC pass ================= */
/* hero: the dot grid gathers behind the headline, with a soft light under the words */
.hero.hA:before{opacity:.5;-webkit-mask-image:radial-gradient(72% 62% at 50% 40%,#000 18%,transparent 78%);mask-image:radial-gradient(72% 62% at 50% 40%,#000 18%,transparent 78%)}
.hero.hA .wrap{isolation:isolate}
.hero.hA .wrap:before{content:"";position:absolute;left:50%;top:2%;width:min(1000px,92%);height:62%;transform:translateX(-50%);background:radial-gradient(closest-side,#7F52EE2b,transparent);filter:blur(24px);z-index:-1;pointer-events:none}
/* round logos whose official icon is a wordmark square (Zapier) show the whole word */
.hic i.lg img.cover,.g6-tools i.lg img.cover,.wb-ic i.wb-lg img.cover,.wb-av.wb-lg img.cover,.tsk i img.cover{object-fit:contain!important;width:86%!important;height:86%!important}

/* process steps: a thin line that draws from one card to the next (replaces the white arrow circles) */
.proc{--pg:28px;gap:var(--pg)!important}
.proc>.pc{position:relative}
.proc>.pc:not(:last-child):after{content:""!important;position:absolute!important;width:var(--pg)!important;height:2px!important;right:calc(var(--pg)*-1)!important;left:auto!important;top:88px!important;margin:0!important;padding:0!important;border:0!important;border-radius:2px!important;background:linear-gradient(90deg,#7F52EE,#9ECD5F)!important;box-shadow:0 0 10px #7F52EE66!important;transform-origin:left center;animation:pcline 6s cubic-bezier(.45,.05,.25,1) infinite!important}
.proc>.pc:last-child:after{display:none!important}
.proc>.pc:nth-child(2):after{animation-delay:1.5s!important}.proc>.pc:nth-child(3):after{animation-delay:3s!important}
@keyframes pcline{0%,6%{transform:scaleX(0)}22%,82%{transform:scaleX(1)}100%{transform:scaleX(1);opacity:.35}}
@media(max-width:1000px){.proc>.pc:after{display:none!important}}


/* CTA box: a clean ring all round, and corners that never get clipped by the moving light */
.cta{isolation:isolate;-webkit-mask-image:-webkit-radial-gradient(white,black);box-shadow:inset 0 0 0 1px #ffffff1f,0 40px 90px -50px #7F52EE99!important}


/* why-us bento: visuals sit in the middle of their card; messages stay visible and light up one by one */
.wb-c:not(.wb-wide) .wb-v{margin-top:0!important;flex:1;display:flex;flex-direction:column;justify-content:center;min-height:196px}
.wb-c:not(.wb-wide) .wb-qa{display:flex;gap:8px}
.wb-msg,.wb-qa div{opacity:1!important;animation:wbhi 8s ease-in-out infinite!important}
.wb-qa div{padding:9px 12px;border-radius:12px;background:#ffffff07}
.wb-thread .wb-msg:nth-child(2),.wb-qa div:nth-child(2){animation-delay:2s!important}
.wb-thread .wb-msg:nth-child(3),.wb-qa div:nth-child(3){animation-delay:4s!important}
.wb-thread .wb-msg:nth-child(4),.wb-qa div:nth-child(4){animation-delay:6s!important}
.wb-thread .wb-msg:nth-child(1),.wb-qa div:nth-child(1){animation-delay:0s!important}
@keyframes wbhi{0%,100%{background:#ffffff07;box-shadow:inset 0 0 0 1px transparent}6%,20%{background:#7F52EE1c;box-shadow:inset 0 0 0 1px #7F52EE55}28%{background:#ffffff07;box-shadow:inset 0 0 0 1px transparent}}
.wb-tools{align-items:center!important;justify-content:center}
.wb-ic i.wb-lg{width:50px!important;height:50px!important;margin-left:-12px!important;border:0!important;box-shadow:0 0 0 3px #07070b}
.wb-ic i.wb-lg:first-child{margin-left:0!important}
.wb-ic i.wb-lg svg{width:56%;height:56%}
.wb-ic .wb-plus{width:50px!important;height:50px!important;margin-left:-12px!important;border:0!important;background:linear-gradient(135deg,#9a76ff,#7F52EE 45%,#432E72)!important;box-shadow:0 0 0 3px #07070b;font-size:22px!important;font-weight:500!important;color:#fff!important}
body.still .wb-msg,body.still .wb-qa div{animation:none!important}
@media(prefers-reduced-motion:reduce){.wb-msg,.wb-qa div{animation:none!important}}

/* ways to start: three cards on the same grid lines; the featured one is dark with a purple ring */
.plans{align-items:stretch!important}
.plans .plan h3{min-height:2.5em;display:flex;align-items:flex-end;margin-top:6px}
.plans .plan .ln2{min-height:3.3em}
.plans .plan .foot{margin-top:auto}

/* what we do: the three service chips */
.sg .chips{display:flex;flex-wrap:wrap;gap:6px}

/* client journeys (Work) */
.case.bp .bp-p{margin:10px 0 0;font-size:15px;line-height:1.55;color:#3d3756}
.case.bp .rd{display:inline-block;margin-top:14px;font-weight:600;color:#5a38f0}
@media(min-width:1001px){.cases.bp6{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
.bp-pv{min-height:300px}
.bpj{list-style:none;margin:0;padding:0;display:grid;gap:14px;max-width:860px}
.bpj li{position:relative;display:grid;grid-template-columns:52px minmax(0,1fr);gap:18px;align-items:center;padding:18px 22px;border-radius:18px;background:var(--surface);border:1px solid var(--line)}
.bpj li span{font:700 22px var(--head);color:#c4b0ff}
.bpj li p{margin:0;font-size:17px;line-height:1.5;color:#e7e3f5}
.bpj li:not(:last-child):after{content:"";position:absolute;left:44px;bottom:-15px;width:2px;height:16px;background:linear-gradient(#7F52EE,#9ECD5F)}
.bps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.bps-i{position:relative;display:flex;flex-direction:column;gap:6px;padding:20px 48px 20px 22px;border-radius:18px;background:var(--surface);border:1px solid var(--line);color:inherit;text-decoration:none;transition:.2s}
.bps-i b{font:600 17px var(--head);color:#fff}.bps-i span{color:#bfe39a;font-weight:600}
.bps-i em{position:absolute;top:20px;right:20px;font-style:normal;color:#c4b0ff;transition:.2s}
.bps-i:hover,.bps-i:focus-visible{border-color:#7F52EE88;transform:translateY(-2px)}.bps-i:hover em{transform:translateX(3px)}
.bp-next{position:relative;display:flex;flex-direction:column;gap:6px;max-width:860px;margin:0 auto;padding:28px 72px 28px 32px;border-radius:24px;background:linear-gradient(135deg,#7F52EE24,#9ECD5F14);border:1px solid #7F52EE44;color:inherit;text-decoration:none;transition:.2s}
.bp-next small{color:#a49ec2;text-transform:uppercase;letter-spacing:.12em;font-size:12px}
.bp-next b{font:600 24px var(--head);color:#fff}
.bp-next em{position:absolute;right:28px;top:50%;transform:translateY(-50%);font-style:normal;font-size:24px;color:#c4b0ff}
.bp-next:hover{border-color:#7F52EE}

/* who we help: one small scene per business, with a result tag */
.ind6 .pv.isc-w{position:relative;display:grid;place-items:center;padding:16px}
.isc-tag{position:absolute;top:12px;left:12px;z-index:2;padding:4px 10px;border-radius:999px;background:#9ECD5F;color:#10210a;font:700 10.5px/1.2 var(--head);letter-spacing:.06em;text-transform:uppercase}
.isc{width:min(100%,250px);margin-top:14px;font-size:11.5px;line-height:1.35;color:#e7e3f5}
.isc b{color:#fff;font-weight:600}
.isc small{display:block;color:#a49ec2;font-size:10.5px}
.isc-cal,.isc-lead,.isc-shop,.isc-course{padding:12px;border-radius:14px;background:#ffffff0a;border:1px solid #ffffff14}
.isc-h{display:flex;justify-content:space-between;margin-bottom:8px}.isc-h em{font-style:normal;color:#bfe39a}
.isc-g{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}
.isc-g i{height:14px;border-radius:4px;background:#ffffff12;animation:iscfill 7s ease-in-out infinite;animation-delay:var(--d)}
@keyframes iscfill{0%,4%{background:#ffffff12}10%,86%{background:#7F52EE}96%,100%{background:#ffffff12}}
.isc-sms{display:flex;flex-direction:column;gap:6px}
.isc-sms .b{max-width:84%;padding:7px 10px;border-radius:12px;opacity:0;animation:iscpop 7s ease-in-out infinite;animation-delay:var(--d)}
.isc-sms .in{align-self:flex-start;background:#ffffff14;border-bottom-left-radius:4px}
.isc-sms .out{align-self:flex-end;background:linear-gradient(135deg,#9a76ff,#7F52EE);color:#fff;border-bottom-right-radius:4px}
.isc-sms .ok{align-self:center;border-radius:999px;background:#9ECD5F26;border:1px solid #9ECD5F66;color:#d9f1bd}
@keyframes iscpop{0%{opacity:0;transform:translateY(6px)}7%,86%{opacity:1;transform:none}96%,100%{opacity:0;transform:none}}
.isc-lead{display:grid;gap:10px}
.isc-lead .l1{display:flex;gap:10px;align-items:center}
.isc-lead .av{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#ffa23a;color:#1a1200;font-weight:700;font-size:11px}
.isc-timer{display:flex;align-items:center;gap:10px}
.isc-timer i{flex:1;height:6px;border-radius:6px;background:#ffffff12;overflow:hidden}
.isc-timer s{display:block;height:100%;border-radius:6px;background:linear-gradient(90deg,#7F52EE,#9ECD5F);transform-origin:left;animation:isctime 6s ease-in-out infinite}
.isc-timer span{white-space:nowrap;color:#bfe39a;opacity:0;animation:iscpop 6s ease-in-out infinite;animation-delay:1.6s}
.isc-timer span b{color:#bfe39a}
@keyframes isctime{0%{transform:scaleX(0)}30%,90%{transform:scaleX(1)}100%{transform:scaleX(0)}}
.isc-shop{position:relative;display:grid;gap:10px}
.isc-shop .prod{display:flex;gap:10px;align-items:center}
.isc-shop .prod span{flex:none;width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,#cfe6ff,#9cc8ff)}
.isc-shop .steps{display:flex;gap:6px}
.isc-shop .steps i{flex:1;padding:5px 0;border-radius:8px;text-align:center;font-style:normal;background:#ffffff0d;color:#a49ec2;animation:iscstep 6s ease-in-out infinite;animation-delay:var(--d)}
@keyframes iscstep{0%,6%{background:#ffffff0d;color:#a49ec2}14%,86%{background:#7F52EE;color:#fff}100%{background:#ffffff0d;color:#a49ec2}}
.isc-shop .toast{position:absolute;right:-10px;bottom:-14px;padding:6px 10px;border-radius:10px;background:#9ECD5F;color:#10210a;font-weight:700;box-shadow:0 10px 20px -8px #000;opacity:0;animation:iscpop 6s ease-in-out infinite;animation-delay:2.2s}
.isc-course{display:grid;gap:6px}
.isc-course>div{display:flex;align-items:center;gap:8px;padding:5px 8px;border-radius:8px;background:#ffffff08}
.isc-course>div i{flex:none;width:14px;height:14px;border-radius:50%;border:1.5px solid #ffffff40;animation:iscdone 7s ease-in-out infinite;animation-delay:var(--d)}
@keyframes iscdone{0%,6%{background:transparent;border-color:#ffffff40;box-shadow:none}12%,88%{background:#9ECD5F;border-color:#9ECD5F;box-shadow:inset 0 0 0 3px #0b0b11}100%{background:transparent;border-color:#ffffff40}}
.isc-course .bar{height:5px;margin-top:2px;border-radius:5px;background:#ffffff12;overflow:hidden}
.isc-course .bar s{display:block;height:100%;background:linear-gradient(90deg,#7F52EE,#9ECD5F);transform-origin:left;animation:iscbar 7s ease-in-out infinite}
@keyframes iscbar{0%{transform:scaleX(0)}55%,88%{transform:scaleX(1)}100%{transform:scaleX(0)}}
.isc-ag{position:relative;height:120px}
.isc-ag>div{position:absolute;display:flex;gap:10px;align-items:center;padding:12px;border-radius:14px}
.isc-ag .back{top:0;left:18px;right:0;background:#ffffff0d;border:1px solid #ffffff17;opacity:.75;animation:iscback 6s ease-in-out infinite}
.isc-ag .lvm{flex:none;width:26px;height:26px;border-radius:8px;background:#16112c center/70% no-repeat}
.isc-ag .front{top:40px;left:0;right:18px;background:#fff;box-shadow:0 18px 30px -14px #000;animation:iscfront 6s ease-in-out infinite}
.isc-ag .front b{color:#16112c}.isc-ag .front small{color:#6b6585}
.isc-ag .yb{flex:none;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:#ff7a59;color:#fff;font-weight:800;font-size:11px}
.isc-ag .front em{margin-left:auto;padding:3px 8px;border-radius:999px;background:#16112c0f;color:#5a38f0;font-style:normal;font-size:10px;white-space:nowrap}
@keyframes iscfront{0%,100%{transform:translateY(0)}45%,60%{transform:translateY(-4px)}}
@keyframes iscback{0%,100%{transform:translate(0,0)}45%,60%{transform:translate(6px,-5px)}}
body.still .isc,body.still .isc *{animation:none!important}
body.still .isc-sms .b,body.still .isc-timer span,body.still .isc-shop .toast{opacity:1}
body.still .isc-g i:nth-child(-n+11),body.still .isc-shop .steps i{background:#7F52EE;color:#fff}
body.still .isc-course>div:nth-child(-n+3) i{background:#9ECD5F;border-color:#9ECD5F}
@media(prefers-reduced-motion:reduce){.isc,.isc *{animation:none!important}.isc-sms .b,.isc-timer span,.isc-shop .toast{opacity:1}.isc-g i:nth-child(-n+11),.isc-shop .steps i{background:#7F52EE;color:#fff}.isc-course>div:nth-child(-n+3) i{background:#9ECD5F;border-color:#9ECD5F}}

/* 6G: one question per stage, cards of equal weight */
.g6-row{align-items:stretch}
.g6-i>a{padding:20px 18px 74px!important}
.g6-i b{font-size:19px!important;margin:18px 0 10px!important}
.g6-i .g6-q{margin:0!important;font-size:16px!important;line-height:1.45!important;color:#e2d9ff!important}

/* themed dropdown */
.fsel{position:relative}
.fs-native{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;clip:rect(0 0 0 0);overflow:hidden}
.fs-btn{width:100%;min-height:52px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 16px 0 18px;border-radius:14px;border:1px solid #7F52EE66;background:#0d0b16;color:#fff;font:500 16px/1.3 Inter,system-ui,sans-serif;text-align:left;cursor:pointer;transition:border-color .2s,box-shadow .2s}
.fs-btn:hover{border-color:#8b6cff}
.fs-btn:focus-visible{outline:2px solid #9ECD5F;outline-offset:2px}
.fs-v{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fsel.empty .fs-v{color:#a49ec2}
.fs-btn svg{flex:none;width:18px;height:18px;color:#c4b0ff;transition:transform .25s cubic-bezier(.3,.7,.2,1)}
.fsel.open .fs-btn{border-color:#8b6cff;box-shadow:0 0 0 4px #7F52EE26}
.fsel.open .fs-btn svg{transform:rotate(180deg)}
.fs-list{position:absolute;z-index:40;left:0;right:0;top:calc(100% + 8px);margin:0;padding:6px;list-style:none;max-height:300px;overflow:auto;border-radius:16px;background:#14111f;border:1px solid #7F52EE55;box-shadow:0 24px 60px -20px #000;outline:none}
.fs-list li{display:flex;justify-content:space-between;gap:10px;padding:10px 12px;border-radius:10px;color:#e7e3f5;font-size:15px;cursor:pointer}
.fs-list li.ph{color:#a49ec2}
.fs-list li.act{background:#7F52EE2e;color:#fff}
.fs-list li[aria-selected="true"]{color:#fff;font-weight:600}
.fs-list li[aria-selected="true"]:after{content:"✓";color:#9ECD5F}
.fld.bad .fs-btn{border-color:#ff6b81}

/* start page: trust card under the next steps */
.aside .side.trust{margin-top:16px}
.side.trust b{color:#fff}

/* book a call: a real person beside the calendar */
.bk-host{display:flex;align-items:center;gap:14px;margin:22px 0 14px}
.bk-ph{flex:none;width:64px;height:64px;border-radius:50%;object-fit:cover;background:#16112c;box-shadow:0 0 0 3px #0d0b16,0 0 0 5px #7F52EE88}
.bk-ph.mark{object-fit:contain;padding:12px}
.bk-host b{display:block;font:600 17px var(--head);color:#fff}.bk-host small{color:#a49ec2;font-size:14px}
.bk-q{margin:0 0 16px;max-width:460px;font:italic 500 19px/1.45 'Playfair Display',Georgia,serif;color:#e2d9ff}
@media(min-width:901px){.bk2 .book-l>.pl{grid-row:1}.bk2 .book-l>h2{grid-row:2;margin-bottom:0}.bk2 .book-l>.bk-host{grid-column:1;grid-row:3}.bk2 .book-l>.book-meta{grid-column:1;grid-row:4}.bk2 .book-l>.bk-q{grid-column:2;grid-row:1/span 2;align-self:end;margin:0}.bk2 .book-l>.book-pts{grid-column:2;grid-row:3;margin:16px 0 0}.bk2 .book-l>.book-alt{grid-column:2;grid-row:4;align-self:center;margin:0}} /* calendar keeps the full width below, like Zenesen */

/* Services and Monthly: split hero with a summary card */
.sh2{align-items:center}
.hero-card{display:flex;flex-direction:column;gap:14px;padding:26px;border-radius:24px;background:radial-gradient(90% 70% at 100% 0%,#7F52EE33,transparent 60%),#0f0d18;border:1px solid #ffffff17;box-shadow:0 40px 80px -40px #7F52EE66;text-align:left}
.hero-card .tg{font:700 11px var(--head);letter-spacing:.14em;text-transform:uppercase;color:#bfe39a}
.hero-card h3{margin:0;font:600 22px var(--head);color:#fff}
.hc-rows{display:grid;gap:10px}
.hc-rows>div{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 14px;border-radius:14px;background:#ffffff08;border:1px solid #ffffff12}
.hc-rows b{color:#fff;font:600 15px var(--head)}.hc-rows span{color:#a49ec2;font-size:13px;line-height:1.35}
.hc-rows em{font:700 20px var(--head);font-style:normal;color:#fff;white-space:nowrap}.hc-rows em small{font-size:12px;font-weight:500;color:#a49ec2}
.hc-save{margin:0;color:#bfe39a;font-weight:600;font-size:14px}
.hc-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.hc-stats div{padding:14px 8px;border-radius:14px;background:#ffffff08;border:1px solid #ffffff12;text-align:center}
.hc-stats b{display:block;font:700 26px var(--head);color:#fff}.hc-stats span{font-size:12px;color:#a49ec2}
.hc-new{display:grid;gap:4px;padding:14px;border-radius:14px;background:#9ECD5F10;border:1px solid #9ECD5F33}
.hc-new .nbd{justify-self:start;margin:0 0 4px}
.hc-new b{color:#fff}.hc-new span:not(.nbd){color:#cfc9e4;font-size:14px}
.hero-card .btn{align-self:flex-start}
.side-gp{position:sticky;top:96px}

/* service cards: name and result on the left, price and button on the right, a gradient edge on hover */
.opt{grid-template-columns:minmax(0,1fr) 200px!important;grid-template-areas:"main price" "main cta";row-gap:14px!important;align-items:start!important;position:relative;overflow:hidden;background:linear-gradient(180deg,#14111f,#0e0c16)!important;border:1px solid #ffffff14!important;box-shadow:0 20px 40px -30px #000!important}
.opt>div:first-child{grid-area:main}
.opt>.pr2{grid-area:price;text-align:right}
.opt>.btn{grid-area:cta;justify-self:end;align-self:end}
.opt:before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,#7F52EE,#9ECD5F);opacity:0;transition:opacity .25s}
.opt:hover{border-color:#7F52EE66!important;box-shadow:0 30px 60px -30px #7F52EE66!important}
.opt:hover:before,.opt.has-bd:before{opacity:1}
.save{display:inline-block;margin-top:8px;padding:3px 9px;border-radius:999px;background:#9ECD5F22;border:1px solid #9ECD5F55;color:#bfe39a;font-size:12px;font-weight:700;letter-spacing:.01em}
.oc .save{margin:0 0 0 8px;vertical-align:middle}
@media(max-width:760px){.opt{grid-template-columns:minmax(0,1fr)!important;grid-template-areas:"main" "price" "cta"}.opt>.pr2{text-align:left}.opt>.btn{justify-self:start}}

/* pricing: the package card stays in view next to its long details */
.pp .pc1{position:sticky;top:96px;align-self:start}
/* v32: the founder photo (assets/brand/founder.webp) - face kept centred in the round frame */
.bk-ph{width:76px;height:76px;object-position:50% 50%}

/* ================= V33: owner QC round 2 ================= */
/* Type rule: Playfair italic only for the accent words in headings. Small text is Inter, so it reads easily. */
.opt .otag,.oc .otag{font:500 15px/1.45 Inter,system-ui,sans-serif!important;font-style:normal!important;color:#c4b0ff!important;margin:2px 0 8px!important}
.bright .opt .otag{color:#5a38f0!important}
.g6-i .g6-q{font:400 15px/1.5 Inter,system-ui,sans-serif!important;font-style:normal!important;color:#cfc9e4!important}

/* ways to start: the original white featured card, with the three cards on the same lines */
.plans .plan{display:flex!important;flex-direction:column}
.plans .plan .md{min-height:2.6em}

/* what to expect: dark cards that belong to the site, a coloured number on each */
.tiles .tile{background:var(--surface)!important;border:1px solid var(--line)!important;box-shadow:none!important}
.tiles .tile h3{color:#fff!important}
.tiles .tile p{color:var(--muted)!important}
.tiles .tile .n{display:inline-grid;place-items:center;min-width:34px;height:26px;padding:0 8px;border-radius:999px;background:#7F52EE24;color:#c4b0ff!important;font:700 12px var(--head)!important}
.tiles .tile:nth-child(even) .n{background:#9ECD5F1f;color:#bfe39a!important}
.tiles .tile:hover{border-color:#7F52EE66!important}

/* footer: logo on the same line as the column labels, calmer spacing */
.ft .fcols{align-items:start}
.ft h4{height:30px;display:flex;align-items:center;margin:0 0 12px!important}
.ft .fcols>div:first-child .logo{display:block;margin:0 0 14px;padding:0!important;height:30px;background-position:left center!important}
.ft .fcols>div:first-child p{margin-top:0!important;color:var(--muted);line-height:1.6}

/* journey cards: one interface preview each, so the cards stay a sensible height */
.case.bp .cv>*:nth-child(n+2){display:none}
.case.bp .cv{min-height:0}
.case.bp .bp-p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* Book a call: our panel beside a calendar without Cal.com's own side panel */
.bk3 .book-l{margin-bottom:0}
.bk-card{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);border-radius:28px;overflow:hidden;background:#0c0a14;border:1px solid #ffffff14;box-shadow:0 40px 90px -50px #7F52EE80}
.bk-side{display:flex;flex-direction:column;gap:12px;padding:22px;border-right:1px solid #ffffff12;background:radial-gradient(90% 50% at 50% 0%,#7F52EE2a,transparent 70%)}
.bk-photo{display:block;width:100%;aspect-ratio:1;object-fit:cover;border-radius:20px;background:#cdbef7}
.bk-id b{display:block;font:600 18px var(--head);color:#fff}.bk-id small{color:#a49ec2;font-size:14px}
.bk-side h3{margin:6px 0 0;font:600 17px var(--head);color:#fff}
.bk-meta{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.bk-meta li{padding:5px 10px;border-radius:999px;background:#ffffff0d;border:1px solid #ffffff17;font-size:12.5px;color:#e7e3f5}
.bk-side p{margin:0;font-size:14px;line-height:1.55;color:var(--muted)}
.bk-card .book-r{min-width:0;padding:10px}
.bk-card .calx{border:0!important;box-shadow:none!important;background:transparent!important}
@media(max-width:860px){.bk-card{grid-template-columns:minmax(0,1fr)}.bk-side{border-right:0;border-bottom:1px solid #ffffff12}.bk-photo{max-width:240px}}

/* Growth Partner tiers: identical structure in every column, badge inside the card */
.tiers{padding-top:4px}
.tiers .tier{gap:10px}
.tiers .tier .pbadge{position:absolute!important;top:18px!important;right:18px!important;left:auto!important;transform:none!important;padding:5px 12px}
.tiers .tier h3{min-height:30px}
.tiers .tier .pr{display:flex;align-items:baseline;gap:8px;min-height:46px;font-size:38px!important;line-height:1!important;white-space:nowrap}
.tiers .tier .pr small{font:500 14px Inter,system-ui,sans-serif!important;color:#a49ec2!important;background:none!important;-webkit-text-fill-color:#a49ec2!important}
.tiers .tier>p{min-height:3em}
.gpt{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
.gpt div{display:flex;flex-direction:column;gap:3px;padding:14px 16px;border-radius:14px;background:#ffffff08;border:1px solid #ffffff12}
.gpt b{font:600 14px var(--head);color:#fff}.gpt span{font-size:13px;color:#a49ec2}

/* individual service cards: price block on one tidy line, the saving under it, button aligned */
.oc{position:relative}
.oc .ob{display:grid!important;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:12px;margin-top:auto}
.oc .ob strong{display:flex;flex-direction:column;align-items:flex-start;gap:2px;line-height:1.05}
.oc .ob strong small{font-size:12px}
.oc .save{margin:6px 0 0!important;white-space:nowrap}
.oc .btn.s{white-space:nowrap}
@media(max-width:420px){.oc .ob{grid-template-columns:minmax(0,1fr)}.oc .btn.s{white-space:normal}}
.bk-photo{height:auto}
.bk-card{grid-template-columns:minmax(0,270px) minmax(0,1fr)}
/* the two side packages share one look, so the featured card is the only one that stands out */
.plans .plan:not(.feat){background:radial-gradient(90% 45% at 50% 0%,#7F52EE24,transparent 70%),#0e0c16!important;border-color:#ffffff1c!important}
.plans .plan:not(.feat) .tg{color:#bfe39a!important}
.tiles .tile .n{align-self:flex-start;justify-self:start;width:auto!important;max-width:max-content}

/* ================= V33 phone pass: cards stack one under another (no sideways swipe rows); each card still reveals as it scrolls in ================= */
@media(max-width:700px){
 .sgrid,.proc,.g6-row,.ind,.plans,.cases,.wb,.tiers,.incl,.tiles,.three{display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-auto-flow:row!important;grid-auto-columns:auto!important;overflow:visible!important;scroll-snap-type:none!important;padding:0!important;gap:16px!important}
 .htiles{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-auto-flow:row!important;grid-auto-columns:auto!important;overflow:visible!important;padding:0!important;gap:10px!important}
 .swipe-hint{display:none!important}
 .wb-wide{grid-column:auto!important;flex-direction:column!important;align-items:stretch!important}
 .wb-wide .wb-t{flex:none!important}
 .plans .plan{transform:none!important}
 .ind .ic,.ind .ic:nth-child(n+4){grid-column:auto!important}
 .g6-i:after{display:none!important}
 .g6-i>a{padding-bottom:70px!important}
 .bpj li{grid-template-columns:40px minmax(0,1fr);padding:16px}
 .bpj li:not(:last-child):after{left:36px}
 .tiers .tier .pr{white-space:normal;flex-wrap:wrap}
 .ft .fcols{gap:28px 20px!important}
 .ft .fcols>div:first-child{grid-column:1/-1}
 .ft .fcols>div:first-child p{max-width:none}
 .ft small{flex-direction:column;align-items:flex-start!important}
}
@media(max-width:420px){.tiers .tier .pr{font-size:32px!important}}
/* price cards: every price sits on the same line; the saving lives in the top row next to Fixed/From */
.oc .otr{display:flex;align-items:center;gap:6px;flex:none}
.oc .otr .save{margin:0!important}
.oc .ob strong{min-height:44px;justify-content:flex-end}
/* journey cards: same picture box, same text lines, so all three cards line up */
.cases .case.bp{display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:200px auto;gap:20px!important;align-content:start;padding:22px!important}
.cases .case.bp .cv{order:-1;height:200px!important;min-height:0!important;display:grid!important;place-items:center;overflow:hidden;padding:0!important;margin:0!important}
.cases .case.bp .cv .mk{max-height:180px;margin:0!important;transform:none!important}
.cases .case.bp>div:first-child{display:flex;flex-direction:column;min-height:0}
.cases .case.bp h3{min-height:2.5em;margin:6px 0 0}
.cases .case.bp .bp-p{-webkit-line-clamp:2!important;min-height:3.1em}
.cases .case.bp .tags{display:flex;flex-wrap:wrap;gap:6px;max-height:34px;overflow:hidden;margin-top:14px}
.cases .case.bp .rd{margin-top:16px}
/* balance: tiles read top-down (number, title, text) so titles start on the same line whatever their length */
.tiles .tile{min-height:0!important;gap:0}
.tiles .tile .n{margin:0 0 22px!important}
.tiles .tile h3{margin:0 0 10px!important;min-height:2.5em;display:flex;align-items:flex-start}
/* balance: wide bento cards start at the top like their neighbours */
.wb-wide{align-items:flex-start!important}
.wb-wide .wb-v{align-self:stretch}
/* motion graphics sit inside a card already: no second or third border around them */
.ic .pv,.sg .pv,.pc .pcs,.ind6 .pv.isc-w{border:0!important;box-shadow:none!important}
.isc-cal,.isc-lead,.isc-shop,.isc-course{border:0!important;background:#ffffff08!important}
.isc-ag .back{border:0!important}
/* journey cards: no dark frame around the preview, and a soft shadow that suits the light card */
.case .cv{border:0!important;background:#16112c0a!important}
.case .cv .mk{box-shadow:0 14px 30px -14px #16112c59!important}
/* what we do: one row of three chips on every card, pinned to the bottom */
.sg{display:flex;flex-direction:column}
.sg .chips{margin-top:auto!important;gap:6px!important}
.sg .chip{padding:6px 11px!important;font-size:12.5px!important;white-space:nowrap}
@media(min-width:1001px){.sg .chips{flex-wrap:nowrap}}
.ind6 .ic h3{min-height:1.3em}

/* ================= V34: owner QC round 3 ================= */
/* section panels: a clearly drawn dark panel (not a ghost edge on black) */
.sec.alt{background:radial-gradient(70% 60% at 50% 0%,#7F52EE1c,transparent 70%),#0b0a12!important;border:1px solid #ffffff12!important}

/* packages: no tinted inner glows; visible divider lines on the white card; brand badge; centred actions */
.plans .plan{box-shadow:0 30px 60px -40px #000!important}
.plans .plan.feat{box-shadow:0 40px 90px -40px #7F52EE88!important}
.plans .plan.feat li{border-color:#16112c1f!important}
.plans .plan.feat .pbadge{background:linear-gradient(135deg,#9a76ff,#7F52EE 55%,#5a38f0)!important;color:#fff!important;border:0!important;box-shadow:0 10px 24px -8px #7F52EEcc;padding:7px 16px!important;letter-spacing:.02em}
.plans .plan .foot{display:flex!important;flex-direction:column;align-items:center;gap:14px;text-align:center}
.plans .plan .foot .btn{align-self:stretch;justify-content:center;text-align:center}

/* one team card: the text sits in the middle of the card, level with the message list */
.wb-c.wb-wide:first-child{align-items:center!important}

/* service cards: no gradient line at the top edge (it read as a glitch on the rounded corners) */
.opt:before{display:none!important}

/* pricing: category pills on one row */
.cpills{flex-wrap:wrap;justify-content:center}
@media(min-width:1001px){.cpills{flex-wrap:nowrap}}
/* Pricing NEW badges use the original top-border placement above. */

/* category pages: the side card starts level with the first service card */
@media(min-width:1001px){.lay:has(.grp:first-child>h3) .aside{margin-top:32px}}

/* category hero: real platform marks and a live scene */
.pt3{display:inline-flex;align-items:center;gap:8px}
.pt3 i.lg{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--c);overflow:hidden;flex:none;font-size:0}
.pt3 i.lg:before,.pt3 i.lg:after{content:none!important}
.pt3 i.lg svg{width:58%;height:58%;color:#fff}.pt3 i.lg img.full,.pt3 i.lg svg.full{width:66%;height:66%;object-fit:contain}.pt3 i.lg img.cover{width:86%;height:86%;object-fit:contain}
.cat-pv{display:grid!important;place-items:center;min-height:380px;padding:28px!important;border-radius:28px}
.cat-pv>svg,.cat-pv .vs{width:100%;max-width:520px;height:auto}
.pv.sm.cat-pv{height:auto!important;min-height:380px;margin:0!important}

/* ================= V34 hero intro: one clean sequence =================
   1. the headline fades in (no movement: gradient text inside a moving parent leaves a ghost copy in Chrome)
   2. the platform logos pop in one by one
   3. "customers." wipes in last, after the logos
   On the pre-rendered site the intro waits for the script (html.ready) so it plays once, not twice. */
.hero.hA h1 .dl{animation:h1fade .6s ease .05s both!important;transform:none!important}
.hero.hA .hic i.lg{animation:hicIn .5s cubic-bezier(.3,1.35,.5,1) both,hicf 7s ease-in-out infinite!important;animation-delay:calc(.35s + var(--i)*.09s),calc(1.6s + var(--i)*.45s)!important}
.hero.hA .hic-more{animation:hicIn .5s cubic-bezier(.3,1.35,.5,1) .9s both!important}
.hero.hA h1 em{display:inline-block;animation:emIn .75s cubic-bezier(.2,.7,.2,1) 1.1s both!important}
@keyframes h1fade{from{opacity:0}to{opacity:1}}
@keyframes hicIn{from{opacity:0;scale:.4}to{opacity:1;scale:1}}
@keyframes emIn{from{opacity:0;clip-path:inset(-25% 100% -25% -8%)}to{opacity:1;clip-path:inset(-25% -12% -25% -8%)}}
/* v43: the preserved pre-rendered hero starts its CSS entrance immediately; do not hold logos/outcome text until the site bundle arrives. */
body.still .hero.hA :is(h1 .dl,h1 em,.hic i.lg,.hic-more){animation:none!important;opacity:1!important;clip-path:none!important;scale:1!important}
@media(prefers-reduced-motion:reduce){.hero.hA :is(h1 .dl,h1 em,.hic i.lg,.hic-more){animation:none!important;opacity:1!important;clip-path:none!important;scale:1!important}}
/* Price cards retain the V33 NEW and saving placement. */
.oc .otr .nbd{position:static!important;margin:0!important;padding:3px 8px 3px 7px;font-size:10px}
.oc .ob strong .amt{display:flex;align-items:center;gap:10px}
.oc .ob strong .amt .save{margin:0!important;font-size:11px}
.oc .save-t{color:#bfe39a;font-weight:700}
.oc .ob strong small{white-space:nowrap;display:block}
/* who we help: the result tag has its own strip; scenes fit underneath it */
.ind6 .ic .pv.isc-w{height:184px!important;padding:44px 16px 14px!important;place-items:start center!important;align-content:center}
.ind6 .isc{margin-top:0!important}
.isc-course{gap:4px!important;padding:10px!important}
.isc-course>div{padding:3px 8px!important}
.isc-course>div i{width:12px!important;height:12px!important}
/* footer: the logo's letters (not its arrow) sit level with the column labels; brand text starts level with the first links */
.ft .fcols>div:first-child .logo{height:34px!important;margin:-10px 0 18px!important}
/* category bar: short labels that wrap, so no button is ever cut off at the edge */
.catbar{flex-wrap:wrap;overflow:visible!important;padding-bottom:0!important}
/* the side card is aligned by script (alignAside); the earlier CSS-only offset is no longer needed */
@media(min-width:1001px){.lay:has(.grp:first-child>h3) .aside{margin-top:0}}
/* service rows: the saving gets its own line under "one-time" */
.opt .pr2 .save{display:block;width:max-content;margin:8px 0 0 auto!important}
@media(max-width:760px){.opt .pr2 .save{margin:8px 0 0!important}}
.lay{position:relative}
/* active filter/tab buttons: no light border left showing at the rounded edge of the gradient */
.cp[aria-pressed="true"],.cf[aria-pressed="true"],.pt[aria-selected="true"],.catbar a[aria-current=page]{border-color:transparent!important;background-origin:border-box!important;background-clip:border-box!important}

/* ================= V36: audit fixes ================= */
/* 1. phones: the booking card stacks again so the calendar has the full width (a later desktop rule had overridden this) */
@media(max-width:860px){.bk-card{grid-template-columns:minmax(0,1fr)!important}.bk-card .book-r{padding:6px}}
/* 6. phones: pricing tabs as a compact two-column grid, not one huge oval */
@media(max-width:700px){.ptabs{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:6px!important;border-radius:18px!important}.ptabs .pt{border-radius:12px!important;padding:10px 8px!important;font-size:13.5px!important;white-space:nowrap}.ptabs .pt:last-child{grid-column:1/-1}}

/* ================= V37: mobile polish from the visual QC ================= */
.hic-row{display:none}
.cat-toggle{display:none}
/* related cards: links on one common baseline */
.box.rel{display:flex;flex-direction:column}.box.rel .lk{margin-top:auto;padding-top:12px}
@media(max-width:700px){
 /* hero: whole sentence first, logos on their own row */
 .hero.hA h1 .hic{display:none!important}
 .hic-row{display:flex;justify-content:center;margin:4px 0 18px}
 .hic-row .hic{display:inline-flex!important;font-size:46px}
 /* category hero: the scene fills its panel instead of floating in empty space */
 .pv.sm.cat-pv{min-height:0!important;height:220px!important;padding:16px!important}
 /* category bar: current category and a toggle; the full list opens on demand */
 .catbar a:not([aria-current=page]){display:none}
 .catbar.open a{display:inline-flex}
 .cat-toggle{display:inline-flex;align-items:center;gap:6px;order:2;padding:10px 16px;border-radius:999px;background:#ffffff08;border:1px solid #ffffff1f;color:#dedbea;font:600 14px var(--head,inherit)}
 .cat-toggle:after{content:"▾";font-size:12px;transition:transform .2s}
 .catbar.open .cat-toggle:after{transform:rotate(180deg)}
 .catbar a[aria-current=page]{order:1}
 /* pricing category pills: compact two-column grid */
 .cpills{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px!important}
 .cpills .cp{padding:9px 10px!important;font-size:13px!important;justify-content:center;text-align:center;white-space:normal!important}
 /* shorter illustration panels in steps, services, bento and industries */
 .proc .pcs{height:130px!important;min-height:0!important}
 .sg .pv.sm{height:150px!important}
 .wb-c:not(.wb-wide) .wb-v{min-height:0!important}
 .ind6 .ic .pv.isc-w{height:170px!important}
}
/* v37: phones keep the logos inside the headline like desktop, just smaller (owner) */
@media(max-width:700px){.hero.hA h1 .hic{display:inline-flex!important;font-size:.78em;vertical-align:middle}.hic-row{display:none!important}}

/* ================= V38: quieter secondary bands, tidier starting points ================= */
.duo .band{background:radial-gradient(80% 90% at 0% 0%,#7F52EE1f,transparent 60%),#0c0a14!important;border:1px solid #ffffff12!important;box-shadow:none!important}
.duo .band h2{font-size:clamp(24px,2.4vw,32px)!important}
.three>.ic{display:flex;flex-direction:column}.three>.ic .lk{margin-top:auto}

/* ================= V38: UI/UX hero, a Figma-style canvas: blocks are drawn, sliced and selected ================= */
.fg-pv{display:grid!important;place-items:center;padding:18px!important;min-height:380px}
.fg{width:100%;max-width:560px;border-radius:16px;overflow:hidden;background:#1e1e24;border:1px solid #ffffff14;box-shadow:0 30px 60px -30px #000;font:500 10px/1.2 Inter,system-ui,sans-serif;color:#cfc9e4}
.fg-bar{display:flex;align-items:center;gap:6px;padding:8px 10px;background:#2c2c33;border-bottom:1px solid #ffffff10}
.fg-bar i{width:8px;height:8px;border-radius:50%;background:#ffffff26}.fg-bar i:first-child{background:#ff5f57}.fg-bar i:nth-child(2){background:#febc2e}.fg-bar i:nth-child(3){background:#28c840}
.fg-bar span{margin-left:8px;color:#a49ec2}.fg-bar b{margin-left:auto;padding:3px 9px;border-radius:6px;background:#7F52EE;color:#fff;font-weight:600}
.fg-body{display:grid;grid-template-columns:86px minmax(0,1fr);min-height:250px}
.fg-layers{display:flex;flex-direction:column;gap:2px;padding:8px 6px;background:#25252c;border-right:1px solid #ffffff10}
.fg-layers em{font-style:normal;color:#8a84a3;margin:0 4px 4px}
.fg-layers span{padding:4px 6px;border-radius:5px;animation:fglay 8s infinite;animation-delay:calc(var(--i)*1.2s)}
@keyframes fglay{0%,2%{background:transparent;color:#cfc9e4}5%,14%{background:#7F52EE;color:#fff}17%,100%{background:transparent;color:#cfc9e4}}
.fg-canvas{position:relative;padding:22px 14px 14px;background-color:#1a1a20;background-image:radial-gradient(#ffffff12 1px,transparent 1px);background-size:12px 12px;display:flex;gap:14px;align-items:flex-start}
.fg-frame{position:relative;background:#fff;border-radius:6px;padding:8px;display:grid;gap:6px;box-shadow:0 10px 24px -12px #000}
.fg-frame small{position:absolute;top:-15px;left:0;color:#8a84a3;font-size:9px}
.fg-desk{flex:1;grid-template-columns:repeat(3,1fr)}
.fg-mob{width:74px;flex:none;grid-template-columns:1fr}
.fg-frame .b{border-radius:4px;background:#ece9f8;opacity:0;transform:scale(.92);animation:fgblk 8s cubic-bezier(.3,.8,.3,1) infinite;animation-delay:calc(var(--i)*1.2s)}
@keyframes fgblk{0%,1%{opacity:0;transform:scale(.92)}6%,92%{opacity:1;transform:none}98%,100%{opacity:0;transform:none}}
.fg-desk .b-nav,.fg-desk .b-hero,.fg-desk .b-cta{grid-column:1/-1}
.b-nav{height:10px;background:#16112c!important}
.b-hero{height:62px;padding:8px;display:flex;flex-direction:column;gap:5px;background:linear-gradient(135deg,#e3dcff,#d6f5b8)!important}
.b-hero s{display:block;height:6px;width:70%;border-radius:3px;background:#16112c}.b-hero s+s{width:48%;opacity:.5}
.b-hero u{display:block;margin-top:auto;width:44px;height:11px;border-radius:6px;background:#7F52EE}
.fg-mob .b-hero{height:52px}
.b-c1,.b-c2,.b-c3{height:34px}
.b-cta{height:16px;background:#7F52EE!important}
.fg-sel{position:absolute;left:8px;right:8px;top:24px;height:62px;border:1.5px solid #18a0fb;border-radius:3px;pointer-events:none;animation:fgsel 8s cubic-bezier(.4,.1,.2,1) infinite}
.fg-sel i{position:absolute;width:6px;height:6px;background:#fff;border:1.5px solid #18a0fb}
.fg-sel i:nth-child(1){top:-4px;left:-4px}.fg-sel i:nth-child(2){top:-4px;right:-4px}.fg-sel i:nth-child(3){bottom:-4px;left:-4px}.fg-sel i:nth-child(4){bottom:-4px;right:-4px}
.fg-sel span{position:absolute;bottom:-17px;left:50%;transform:translateX(-50%);padding:1px 6px;border-radius:3px;background:#18a0fb;color:#fff;font-size:8.5px;white-space:nowrap}
@keyframes fgsel{0%,10%{opacity:0;top:8px;height:10px}14%,30%{opacity:1;top:24px;height:62px}36%,52%{opacity:1;top:92px;height:34px}58%,74%{opacity:1;top:132px;height:16px}80%,100%{opacity:0}}
.fg-slice{position:absolute;left:0;right:0;top:88px;border-top:1px dashed #f24e1e;opacity:0;animation:fgcut 8s infinite}
@keyframes fgcut{0%,30%{opacity:0}34%,48%{opacity:.9}52%,100%{opacity:0}}
.fg-cur{position:absolute;display:flex;align-items:flex-start;gap:2px;left:38%;top:44%;animation:fgcur 8s cubic-bezier(.45,.05,.25,1) infinite}
.fg-cur svg{width:14px;height:14px;fill:#9ECD5F;filter:drop-shadow(0 2px 3px #0009)}
.fg-cur span{margin-top:10px;padding:2px 6px;border-radius:4px;background:#9ECD5F;color:#10210a;font-weight:700;font-size:8.5px}
@keyframes fgcur{0%,12%{transform:translate(0,0)}30%{transform:translate(40px,-30px)}48%{transform:translate(-50px,30px)}66%{transform:translate(70px,60px)}84%{transform:translate(110px,-10px)}100%{transform:translate(0,0)}}
body.still .fg *{animation:none!important}body.still .fg .b{opacity:1;transform:none}body.still .fg-sel{opacity:1}
@media(prefers-reduced-motion:reduce){.fg *{animation:none!important}.fg .b{opacity:1;transform:none}.fg-sel{opacity:1}}
@media(max-width:700px){.fg-pv{min-height:0!important;height:auto!important}.fg-body{grid-template-columns:minmax(0,1fr)}.fg-layers{display:none}.fg-mob{width:58px}}

/* ================= V39: service scenes. Each one tells the service's story in a real app window (10s loop) ================= */
/* the panel is a size container; the scene is drawn on a 40em x 26em canvas and scales with the panel */
.pv.xs-pv{container-type:inline-size;display:grid!important;place-items:center;padding:18px!important;overflow:hidden}
.pv.xs-pv.sm{height:auto!important;min-height:0!important;padding:12px!important;margin-bottom:22px}
.pv.cat-pv.xs-pv{min-height:380px}
.sw{--e:cubic-bezier(.3,.8,.3,1);font:500 min(calc(100cqw / 40.2),12.5px)/1.25 Inter,system-ui,sans-serif;width:40em;height:26em;border-radius:1.1em;overflow:hidden;background:#f6f4fc;color:#16112c;box-shadow:0 2.4em 4em -2em #000,0 0 0 1px #ffffff1a;text-align:left;letter-spacing:0}
.sw *{box-sizing:border-box}
.sw b{font-weight:700}.sw em{font-family:Inter,'Inter FB',system-ui,sans-serif!important;font-style:normal!important;letter-spacing:0;background:none;-webkit-text-fill-color:currentColor}.sw s,.sw u{text-decoration:none}
.sw-bar{display:flex;align-items:center;gap:.45em;height:2.3em;padding:0 1em;background:#211e2c}
.sw-bar i{width:.65em;height:.65em;border-radius:50%;background:#ff5f57}.sw-bar i:nth-child(2){background:#febc2e}.sw-bar i:nth-child(3){background:#28c840}
.sw-bar span{margin-left:.8em;padding:.25em .9em;border-radius:1em;background:#ffffff12;color:#bcb5d8;font-size:.9em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:70%}
.sw-body{position:relative;height:calc(100% - 2.3em);padding:1.2em}
.sw-ok{display:inline-grid;place-items:center;width:1.35em;height:1.35em;border-radius:50%;background:#9ECD5F;color:#10210a;font-size:.8em;font-weight:800;flex:none}
.sw-dot{display:inline-block;width:.6em;height:.6em;border-radius:50%;background:#9ECD5F;box-shadow:0 0 0 .25em #9ECD5F40;flex:none}
.sw-toast{position:absolute;display:flex;align-items:center;gap:.7em;padding:.75em 1em;border-radius:.8em;background:#16112c;color:#fff;box-shadow:0 1em 2em -.8em #16112c;font-size:1.05em}
.sw-toast span{display:flex;flex-direction:column;gap:.15em;color:#c9c2e6;font-size:.85em}.sw-toast span b{color:#fff;font-size:1.12em}
.sw-cur{position:absolute;width:1.5em;height:1.5em;z-index:3}
.sw-cur svg{width:100%;height:100%;fill:#16112c;stroke:#fff;stroke-width:1.2;filter:drop-shadow(0 .15em .25em #0006)}

/* story steps: .tN appears at N x 10% of the loop and stays until the loop resets; .fN fills a bar; .gN grows a column */
@keyframes swt0{0%{opacity:.22;transform:none;filter:saturate(0)}5%,92%{opacity:1;transform:none;filter:none}97%,100%{opacity:.22;filter:saturate(0)}}
@keyframes swt1{0%,10%{opacity:.22;transform:none;filter:saturate(0)}15%,92%{opacity:1;transform:none;filter:none}97%,100%{opacity:.22;filter:saturate(0)}}
@keyframes swt2{0%,20%{opacity:.22;transform:none;filter:saturate(0)}25%,92%{opacity:1;transform:none;filter:none}97%,100%{opacity:.22;filter:saturate(0)}}
@keyframes swt3{0%,30%{opacity:.22;transform:none;filter:saturate(0)}35%,92%{opacity:1;transform:none;filter:none}97%,100%{opacity:.22;filter:saturate(0)}}
@keyframes swt4{0%,40%{opacity:.22;transform:none;filter:saturate(0)}45%,92%{opacity:1;transform:none;filter:none}97%,100%{opacity:.22;filter:saturate(0)}}
@keyframes swt5{0%,50%{opacity:.22;transform:none;filter:saturate(0)}55%,92%{opacity:1;transform:none;filter:none}97%,100%{opacity:.22;filter:saturate(0)}}
@keyframes swt6{0%,60%{opacity:.22;transform:none;filter:saturate(0)}65%,92%{opacity:1;transform:none;filter:none}97%,100%{opacity:.22;filter:saturate(0)}}
@keyframes swt7{0%,70%{opacity:.22;transform:none;filter:saturate(0)}75%,92%{opacity:1;transform:none;filter:none}97%,100%{opacity:.22;filter:saturate(0)}}
.sw .t0{animation:swt0 10s var(--e) infinite}.sw .t1{animation:swt1 10s var(--e) infinite}.sw .t2{animation:swt2 10s var(--e) infinite}.sw .t3{animation:swt3 10s var(--e) infinite}
.sw .t4{animation:swt4 10s var(--e) infinite}.sw .t5{animation:swt5 10s var(--e) infinite}.sw .t6{animation:swt6 10s var(--e) infinite}.sw .t7{animation:swt7 10s var(--e) infinite}
@keyframes swf5{0%,52%{transform:scaleX(0)}64%,92%{transform:none}97%,100%{transform:scaleX(0)}}
@keyframes swf6{0%,62%{transform:scaleX(0)}74%,92%{transform:none}97%,100%{transform:scaleX(0)}}
.sw .f5,.sw .f6{transform-origin:left}.sw .f5{animation:swf5 10s var(--e) infinite}.sw .f6{animation:swf6 10s var(--e) infinite}
@keyframes swg2{0%,20%{transform:scaleY(.08)}32%,92%{transform:none}97%,100%{transform:scaleY(.08)}}
@keyframes swg3{0%,30%{transform:scaleY(.08)}42%,92%{transform:none}97%,100%{transform:scaleY(.08)}}
@keyframes swg4{0%,40%{transform:scaleY(.08)}52%,92%{transform:none}97%,100%{transform:scaleY(.08)}}
@keyframes swg5{0%,50%{transform:scaleY(.08)}62%,92%{transform:none}97%,100%{transform:scaleY(.08)}}
.sw .g2,.sw .g3,.sw .g4,.sw .g5{transform-origin:bottom}.sw .g2{animation:swg2 10s var(--e) infinite}.sw .g3{animation:swg3 10s var(--e) infinite}.sw .g4{animation:swg4 10s var(--e) infinite}.sw .g5{animation:swg5 10s var(--e) infinite}

/* websites: the page builds, a visitor clicks the button, an enquiry arrives */
.xw-nav{display:flex;align-items:center;gap:1.1em;padding:.6em .9em;border-radius:.6em;background:#fff;box-shadow:0 .2em .6em -.3em #16112c33;font-size:.95em;color:#6b6584}
.xw-nav b{color:#16112c;margin-right:auto;font-size:1.1em}.xw-nav em{padding:.35em .8em;border-radius:1em;background:#16112c;color:#fff;font-weight:600}
.xw-hero{margin-top:1em;padding:1.3em 1.4em;border-radius:.8em;background:linear-gradient(135deg,#e6deff,#ddf3c4)}
.xw-hero h5{margin:0;font:700 1.9em/1.1 Poppins,Inter,sans-serif;letter-spacing:-.03em;color:#16112c}
.xw-hero p{margin:.45em 0 .9em;color:#4c4766;font-size:1em}
.xw-hero u{display:inline-block;padding:.6em 1.1em;border-radius:1.4em;background:#7F52EE;color:#fff;font-weight:700;animation:xwpress 10s infinite}
@keyframes xwpress{0%,42%{transform:none;box-shadow:0 0 0 0 #7F52EE00}45%{transform:scale(.94);box-shadow:0 0 0 .5em #7F52EE40}50%,100%{transform:none;box-shadow:0 0 0 0 #7F52EE00}}
.xw-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:.7em;margin-top:1em}
.xw-cards i{display:flex;align-items:center;gap:.5em;padding:.9em .7em;border-radius:.7em;background:#fff;font-style:normal;font-weight:600;font-size:.95em;box-shadow:0 .2em .6em -.3em #16112c33}
.xw-cur{left:6.5em;top:12.4em;animation:xwcur 10s cubic-bezier(.45,.05,.25,1) infinite}
@keyframes xwcur{0%,28%{transform:translate(26em,8em);opacity:0}32%{opacity:1}42%{transform:none}45%{transform:scale(.85)}48%,88%{transform:none;opacity:1}94%,100%{opacity:0}}
.xw-toast{right:1.2em;bottom:1.2em}

/* shop: add to cart, pay, order paid */
.sw-shop .sw-body{display:grid;grid-template-columns:1.05fr 1fr;gap:1.1em}
.xe-prod{display:flex;flex-direction:column;gap:.35em;padding:.9em;border-radius:.9em;background:#fff;box-shadow:0 .3em .9em -.4em #16112c33}
.xe-img{flex:1;border-radius:.6em;display:grid;place-items:center;margin-bottom:.4em}

.xe-prod b{font-size:1.2em}.xe-prod small{color:#6b6584;font-size:.9em}
.xe-prod u{margin-top:.4em;padding:.6em;border-radius:.6em;background:#16112c;color:#fff;font-weight:700;text-align:center;animation:xepress 10s infinite}
@keyframes xepress{0%,24%{transform:none;background:#16112c}27%{transform:scale(.95);background:#7F52EE}32%,100%{transform:none;background:#16112c}}
.xe-side{display:flex;flex-direction:column;gap:.7em}
.xe-cart{display:flex;align-items:center;justify-content:space-between;padding:.8em .9em;border-radius:.7em;background:#fff;font-weight:700}
.xe-cart em{display:grid;place-items:center;width:1.6em;height:1.6em;border-radius:50%;background:#7F52EE;color:#fff;font-size:.9em}
.xe-steps{display:flex;flex-direction:column;gap:.45em}
.xe-steps span{display:flex;align-items:center;justify-content:space-between;padding:.65em .9em;border-radius:.6em;background:#fff;color:#4c4766;font-weight:600}
.xe-paid{display:flex;align-items:center;gap:.6em;margin-top:auto;padding:.8em .9em;border-radius:.8em;background:#16112c;color:#c9c2e6;font-size:.95em}
.xe-paid span{display:flex;flex-direction:column}.xe-paid span b{color:#fff}
.xe-cur{left:9em;top:19em;animation:xecur 10s cubic-bezier(.45,.05,.25,1) infinite}
@keyframes xecur{0%,8%{transform:translate(14em,-10em);opacity:0}12%{opacity:1}24%{transform:none}27%{transform:scale(.85)}30%,40%{transform:none;opacity:1}46%,100%{opacity:0}}

/* SEO: the search runs, fixes land, your business climbs to #1 */
.sw-seo .sw-body{display:grid;grid-template-columns:1fr 11em;grid-template-rows:auto 1fr;gap:.9em 1em}
.xs-q{grid-column:1/-1;display:flex;align-items:center;gap:.6em;padding:.65em 1em;border-radius:2em;background:#fff;box-shadow:0 .2em .7em -.3em #16112c40;font-size:1.05em}
.xs-q svg{width:1.2em;height:1.2em;fill:none;stroke:#6b6584;stroke-width:2.4;stroke-linecap:round}
.xs-q span{overflow:hidden;white-space:nowrap;border-right:.1em solid #7F52EE;animation:xstype 10s steps(15) infinite}
@keyframes xstype{0%{max-width:0}12%,100%{max-width:12em}}
.xs-list{position:relative}
.xs-r{position:absolute;left:0;right:0;height:3.7em;display:flex;flex-direction:column;justify-content:center;gap:.2em;padding:0 1em;border-radius:.7em;background:#fff;box-shadow:0 .2em .6em -.3em #16112c26}
.xs-r b{display:flex;align-items:center;gap:.5em;color:#1a0dab;font-size:1.02em}.xs-r small{color:#6b6584;font-size:.85em}
.xs-me{top:0;z-index:2;box-shadow:0 0 0 .14em #9ECD5F,0 .6em 1.2em -.6em #16112c55;animation:xsme 10s cubic-bezier(.5,0,.2,1) infinite}
.xs-me em{padding:.1em .5em;border-radius:1em;background:#9ECD5F;color:#10210a;font-size:.8em}
.xs-1{top:4.2em;animation:xs1 10s cubic-bezier(.5,0,.2,1) infinite}.xs-2{top:8.4em;animation:xs2 10s cubic-bezier(.5,0,.2,1) infinite}.xs-3{top:12.6em;animation:xs3 10s cubic-bezier(.5,0,.2,1) infinite}
@keyframes xsme{0%,20%{top:12.6em}28%,40%{top:8.4em}48%,60%{top:4.2em}68%,100%{top:0}}
@keyframes xs1{0%,60%{top:0}68%,100%{top:4.2em}}
@keyframes xs2{0%,40%{top:4.2em}48%,100%{top:8.4em}}
@keyframes xs3{0%,20%{top:8.4em}28%,100%{top:12.6em}}
.xs-fix{display:flex;flex-direction:column;gap:.5em;padding:.9em;border-radius:.8em;background:#16112c;color:#fff;align-self:start}
.xs-fix em{color:#a49ec2;font-size:.85em;margin-bottom:.2em}.xs-fix span{display:flex;align-items:center;gap:.5em;font-weight:600}

/* ads: Google and Meta ads go live, leads come in, cost per lead drops */
.sw-ads .sw-body{display:flex;flex-direction:column;gap:.9em}
.xa-ads{position:relative;display:grid;grid-template-columns:1.25fr 1fr;gap:.8em}
.xa-g,.xa-m{padding:.85em .95em;border-radius:.8em;background:#fff;box-shadow:0 .2em .7em -.3em #16112c33;display:flex;flex-direction:column;gap:.3em}
.xa-g small,.xa-m small{color:#6b6584;font-size:.8em}.xa-g b{color:#1a0dab;font-size:1.05em;line-height:1.2}.xa-g span{color:#1e7d32;font-size:.85em}
.xa-m{flex-direction:row;flex-wrap:wrap;align-items:center;gap:.3em .7em}.xa-m i{width:3.6em;height:3.6em;border-radius:.5em;background:linear-gradient(135deg,#7F52EE,#9ECD5F);flex:none}
.xa-m small{flex:1;min-width:6em}.xa-m b{flex-basis:100%;font-size:1em}
.xa-lead{position:absolute;bottom:-1.4em;padding:.25em .6em;border-radius:1em;background:#9ECD5F;color:#10210a;font:700 .85em/1.2 Inter,sans-serif;font-style:normal;opacity:0}
.xa-lead.l1{left:18%;animation:xalead 10s ease-out infinite 3s}.xa-lead.l2{left:68%;animation:xalead 10s ease-out infinite 4.6s}.xa-lead.l3{left:38%;animation:xalead 10s ease-out infinite 6.2s}
@keyframes xalead{0%{opacity:0;transform:translateY(-1.5em)}6%{opacity:1}16%{opacity:0;transform:translateY(2.5em)}100%{opacity:0}}
.xa-low{flex:1;display:grid;grid-template-columns:1fr 1.15fr;gap:.9em;min-height:0}
.xa-kpi{display:flex;flex-direction:column;gap:.6em}
.xa-kpi div{flex:1;display:flex;flex-direction:column;justify-content:center;padding:.6em .9em;border-radius:.7em;background:#16112c;color:#fff}
.xa-kpi em{color:#a49ec2;font-size:.85em}.xa-kpi b{font:700 1.6em/1.1 Poppins,Inter,sans-serif;display:flex;align-items:center;gap:.4em}
.xa-kpi s{padding:.15em .45em;border-radius:1em;background:#9ECD5F;color:#10210a;font:700 .5em/1.2 Inter,sans-serif}
.xa-bars{display:flex;align-items:flex-end;gap:.45em;padding:.8em;border-radius:.7em;background:#fff}
.xa-bars i{flex:1;border-radius:.3em .3em .1em .1em;background:linear-gradient(#9b7bff,#7F52EE)}.xa-bars i:last-child{background:linear-gradient(#b8e07f,#9ECD5F)}

/* CRM: the lead card walks the pipeline while the automations do the work */
.sw-crm .sw-body{display:flex;flex-direction:column;gap:.9em}
.xc-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:.8em;height:12.2em}
.xc-col{display:flex;flex-direction:column;gap:.5em;padding:.7em;border-radius:.8em;background:#ebe7f8}
.xc-col em{font-weight:700;font-size:.9em;color:#4c4766}
.xc-col span{margin-top:auto;padding:.55em .7em;border-radius:.55em;background:#fff;color:#6b6584;font-weight:600;font-size:.9em}
.xc-card{position:absolute;top:3.4em;left:calc(1.2em + 2 * (100% - 2.4em + .8em) / 3 + .7em);width:calc((100% - 2.4em - 1.6em) / 3 - 1.4em);display:flex;flex-direction:column;gap:.15em;padding:.6em .75em;border-radius:.6em;background:#fff;box-shadow:0 0 0 .14em #7F52EE,0 .8em 1.4em -.6em #16112c66;z-index:2;animation:xccard 10s cubic-bezier(.6,0,.2,1) infinite}
.xc-card b{font-size:1em}.xc-card small{color:#6b6584;font-size:.8em}
.xc-card i{position:absolute;top:.55em;right:.6em;font-style:normal;color:#10210a;background:#9ECD5F;border-radius:50%;width:1.3em;height:1.3em;display:grid;place-items:center;font-size:.8em;font-weight:800}
@keyframes xccard{0%{opacity:0;left:calc(1.2em + .7em)}5%,30%{opacity:1;left:calc(1.2em + .7em)}38%,60%{left:calc(1.2em + (100% - 2.4em + .8em) / 3 + .7em)}68%,92%{opacity:1;left:calc(1.2em + 2 * (100% - 2.4em + .8em) / 3 + .7em)}97%,100%{opacity:0;left:calc(1.2em + 2 * (100% - 2.4em + .8em) / 3 + .7em)}}
.xc-log{flex:1;display:flex;flex-direction:column;justify-content:center;gap:.45em;padding:.8em 1em;border-radius:.8em;background:#16112c;color:#fff}
.xc-log em{color:#a49ec2;font-size:.85em}.xc-log span{display:flex;align-items:center;gap:.55em;font-weight:600;font-size:.98em}

/* email: write it, send it, opens and clicks turn into sales */
.sw-mail .sw-body{display:grid;grid-template-columns:1fr 1fr;gap:1.1em}
.xm-mail{display:flex;flex-direction:column;gap:.55em;padding:1em;border-radius:.9em;background:#fff;box-shadow:0 .3em .9em -.4em #16112c33}
.xm-mail small{font-weight:700;font-size:1em}
.xm-img{flex:1;border-radius:.6em;background:linear-gradient(135deg,#7F52EE,#b79cff 55%,#9ECD5F)}
.xm-mail s{display:block;height:.6em;border-radius:.3em;background:#e6e2f3}.xm-mail s+s{width:70%}
.xm-mail u{align-self:flex-start;padding:.55em 1em;border-radius:1.4em;background:#7F52EE;color:#fff;font-weight:700}
.xm-side{display:flex;flex-direction:column;gap:.55em}
.xm-send{padding:.65em;border-radius:.6em;background:#16112c;color:#fff;font-weight:700;text-align:center;animation:xmpress 10s infinite}
@keyframes xmpress{0%,33%{transform:none;background:#16112c}36%{transform:scale(.95);background:#7F52EE}41%,100%{transform:none;background:#16112c}}
.xm-st{display:grid;grid-template-columns:1fr auto;align-items:center;gap:.3em;padding:.6em .8em;border-radius:.6em;background:#fff}
.xm-st em{color:#6b6584;font-size:.9em}.xm-st b{font-size:1.15em}
.xm-st i{grid-column:1/-1;height:.45em;border-radius:.3em;background:#ece9f8;overflow:hidden}.xm-st i s{display:block;height:100%;border-radius:.3em;background:#7F52EE}
.xm-rev{margin-top:auto;padding:.7em;border-radius:.7em;background:#9ECD5F;color:#10210a;font:700 1.15em/1.2 Poppins,Inter,sans-serif;text-align:center}
.xm-cur{left:calc(50% + 6em);top:2.6em;animation:xmcur 10s cubic-bezier(.45,.05,.25,1) infinite}
@keyframes xmcur{0%,22%{transform:translate(-8em,10em);opacity:0}26%{opacity:1}33%{transform:none}36%{transform:scale(.85)}39%,46%{transform:none;opacity:1}52%,100%{opacity:0}}

/* AI: answers the chat, books the slot, takes the late-night call */
.sw-ai .sw-body{display:grid;grid-template-columns:1.5fr 1fr;gap:1em}
.xi-chat{display:flex;flex-direction:column;gap:.5em;padding:.9em;border-radius:.9em;background:#fff;box-shadow:0 .3em .9em -.4em #16112c33}
.xi-b{max-width:88%;padding:.55em .8em;border-radius:.9em;font-size:.95em;line-height:1.3}
.xi-u{align-self:flex-end;background:#7F52EE;color:#fff;border-bottom-right-radius:.25em}
.xi-a{align-self:flex-start;background:#efecf9;color:#16112c;border-bottom-left-radius:.25em}
.xi-stk{display:grid}.xi-stk>*{grid-area:1/1}
.xi-typ{align-self:center;justify-self:start;display:flex;gap:.3em;padding:.7em .8em;border-radius:.9em;background:#efecf9;opacity:0;animation:xityp 10s infinite}
.xi-typ i{width:.45em;height:.45em;border-radius:50%;background:#7F52EE;animation:xidot 1s infinite}.xi-typ i:nth-child(2){animation-delay:.15s}.xi-typ i:nth-child(3){animation-delay:.3s}
@keyframes xityp{0%,8%{opacity:0}10%,18%{opacity:1}20%,100%{opacity:0}}
@keyframes xidot{0%,100%{transform:none;opacity:.4}50%{transform:translateY(-.25em);opacity:1}}
.xi-cal{margin-top:auto;display:flex;align-items:center;gap:.5em;padding:.5em .7em;border-radius:.6em;background:#eef8e2;color:#2b4d10;font-weight:700;font-size:.9em}
.xi-call{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.4em;padding:1em .8em;border-radius:.9em;background:#16112c;color:#fff;text-align:center}
.xi-call small{color:#a49ec2;font-size:.8em}.xi-call>b{font-size:1em}
.xi-call span{display:flex;align-items:center;gap:.45em;margin-top:.4em;font-size:.85em;font-weight:600}
.xi-av{position:relative;display:grid;place-items:center;width:4em;height:4em;margin-bottom:.3em}
.xi-av b{position:relative;display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:linear-gradient(135deg,#9b7bff,#7F52EE);font-size:1.1em}
.xi-av i{position:absolute;inset:0;border-radius:50%;border:.12em solid #9b7bff;animation:xiring 2s ease-out infinite}.xi-av i+i{animation-delay:1s}
@keyframes xiring{0%{transform:scale(1);opacity:.8}100%{transform:scale(1.7);opacity:0}}
.xi-wave{display:flex;align-items:center;gap:.25em;height:2em}
.xi-wave i{width:.3em;height:100%;border-radius:.2em;background:#9ECD5F;animation:xiwave 1.1s ease-in-out infinite}
.xi-wave i:nth-child(2){animation-delay:.15s}.xi-wave i:nth-child(3){animation-delay:.3s}.xi-wave i:nth-child(4){animation-delay:.45s}.xi-wave i:nth-child(5){animation-delay:.3s}.xi-wave i:nth-child(6){animation-delay:.15s}
@keyframes xiwave{0%,100%{transform:scaleY(.3)}50%{transform:scaleY(1)}}

/* integrations: one lead travels form > CRM > sheet > team chat on its own */
.sw-flow .sw-body{display:flex;flex-direction:column;justify-content:space-between}
.xf-nodes{position:relative;display:flex;justify-content:space-between;margin-top:1.4em;z-index:1}
.xf-n{width:8em;display:flex;flex-direction:column;align-items:center;gap:.45em;text-align:center}
.xf-n>b{font-size:.95em}
.xf-n small{display:flex;align-items:center;gap:.35em;color:#2b4d10;font-weight:600;font-size:.82em;white-space:nowrap}
.xf-ic{position:relative;display:grid;place-items:center;width:3.6em;height:3.6em;border-radius:.9em;background:var(--c);color:#fff;font:800 1.3em/1 Poppins,Inter,sans-serif;font-style:normal;box-shadow:0 .5em 1em -.5em var(--c)}
.xf-ic em{position:absolute;inset:-.3em;border-radius:1.1em;border:.14em solid #9ECD5F}
.xf-line{position:absolute;left:5.2em;right:5.2em;top:4.82em;height:.25em;border-radius:.2em;background:repeating-linear-gradient(90deg,#cfc8ea 0 .6em,transparent .6em 1.1em)}
.xf-pk{position:absolute;top:4.47em;left:5.2em;margin-left:-.475em;width:.95em;height:.95em;border-radius:50%;background:#9ECD5F;box-shadow:0 0 0 .3em #9ECD5F4d;z-index:2;opacity:0;animation:xfpk 10s cubic-bezier(.5,0,.3,1) infinite}
@keyframes xfpk{0%,3%{opacity:0;left:5.2em}5%{opacity:1}20%{left:calc(5.2em + (100% - 10.4em) / 3)}40%{left:calc(5.2em + 2 * (100% - 10.4em) / 3)}60%{left:calc(100% - 5.2em);opacity:1}64%,100%{left:calc(100% - 5.2em);opacity:0}}
.xf-end{display:grid;grid-template-columns:1.4fr 1fr;gap:.9em;align-items:stretch}
.xf-msg{display:flex;gap:.7em;padding:.8em .9em;border-radius:.8em;background:#fff;box-shadow:0 .3em .9em -.4em #16112c33}
.xf-msg>i{flex:none;display:grid;place-items:center;width:2.4em;height:2.4em;border-radius:.6em;background:#e01e5a;color:#fff;font:800 1em/1 Poppins,Inter,sans-serif;font-style:normal}
.xf-msg span{display:flex;flex-direction:column;gap:.2em;font-size:.9em;color:#4c4766}.xf-msg span b{color:#16112c;font-size:1.05em}
.xf-done{position:static;flex-direction:column;align-items:flex-start;justify-content:center;gap:.4em}
.xf-rep{display:flex;flex-direction:column;gap:.4em;padding:.8em 1em;border-radius:.8em;background:#16112c;color:#fff}
.xf-rep em{color:#a49ec2;font-size:.85em}
.xf-rep span{display:grid;grid-template-columns:6.5em 1fr 2.6em;align-items:center;gap:.6em;font-size:.9em;font-weight:600}
.xf-rep i{height:.5em;border-radius:.3em;background:#ffffff14;overflow:hidden}.xf-rep s{display:block;height:100%;border-radius:.3em;background:#9ECD5F}.xf-rep span b{text-align:right}

/* tracking: real events fire, the numbers and the trend update */
.sw-dash .sw-body{display:grid;grid-template-columns:10.5em 1fr;gap:1em}
.xt-feed{display:flex;flex-direction:column;gap:.5em;padding:.9em;border-radius:.9em;background:#16112c;color:#fff}
.xt-feed em{color:#a49ec2;font-size:.85em;margin-bottom:.2em}
.xt-feed span{display:flex;align-items:center;gap:.55em;padding:.5em .6em;border-radius:.5em;background:#ffffff0f;font:600 .88em/1.2 ui-monospace,Consolas,monospace}
.xt-main{display:flex;flex-direction:column;gap:.7em;min-width:0}
.xt-kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:.55em}
.xt-kpi div{padding:.6em .7em;border-radius:.6em;background:#fff}.xt-kpi em{display:block;color:#6b6584;font-size:.8em}.xt-kpi b{font:700 1.4em/1.15 Poppins,Inter,sans-serif}
.xt-ln{flex:1;width:100%;min-height:0;border-radius:.6em;background:#fff;padding:.6em}
.xt-ln path{fill:none;stroke:#7F52EE;stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.xt-ln{animation:xtln 10s var(--e) infinite}
@keyframes xtln{0%,45%{clip-path:inset(0 100% 0 0)}62%,92%{clip-path:inset(0)}97%,100%{clip-path:inset(0 100% 0 0)}}
.xt-src{display:flex;flex-direction:column;gap:.35em;padding:.6em .8em;border-radius:.6em;background:#fff}
.xt-src span{display:grid;grid-template-columns:4em 1fr;align-items:center;gap:.6em;font-size:.85em;font-weight:600}
.xt-src i{height:.5em;border-radius:.3em;background:#ece9f8;overflow:hidden}.xt-src s{display:block;height:100%;background:#9ECD5F;border-radius:.3em}

/* calm states: the finished story is shown at rest */
body.still .sw *,body.still .sw *::before,body.still .sw *::after{animation:none!important}
@media(prefers-reduced-motion:reduce){.sw *,.sw *::before,.sw *::after{animation:none!important}}
body.still .xi-typ,body.still .xa-lead,body.still .sw-cur,body.still .xf-pk{opacity:0!important}
@media(prefers-reduced-motion:reduce){.xi-typ,.xa-lead,.sw-cur,.xf-pk{opacity:0!important}}
.xf-pk{left:calc(100% - 5.2em)}

/* phone first: the whole scene stays readable and the panel takes the scene's shape (no empty space, no cropping) */
@media(max-width:700px){
 .pv.xs-pv,.pv.cat-pv.xs-pv,.pv.sm.cat-pv.xs-pv{height:auto!important;min-height:0!important;padding:8px!important}
 .sg .pv.xs-pv.sm{height:auto!important}
 .sw{border-radius:.9em}
}
/* V39 phone: a narrower canvas so the scene text is larger on a phone */
@container (max-width:460px){
 .sw{width:34em;height:27em;font-size:min(calc(100cqw / 34.2),12.5px)}
 .sw-body{padding:1em}
 .xw-nav span{display:none}.xw-hero h5{font-size:1.6em}.xw-cards i{font-size:.85em;padding:.8em .5em;gap:.35em}
 .sw-seo .sw-body{grid-template-columns:1fr 9.4em}
 .xa-g b{font-size:.95em}.xa-m i{width:2.6em;height:2.6em}
 .xc-card{left:calc(1em + 2 * (100% - 2em + .8em) / 3 + .5em);width:calc((100% - 2em - 1.6em) / 3 - 1em)}
 @keyframes xccard{0%{opacity:0;left:calc(1em + .5em)}5%,30%{opacity:1;left:calc(1em + .5em)}38%,60%{left:calc(1em + (100% - 2em + .8em) / 3 + .5em)}68%,92%{opacity:1;left:calc(1em + 2 * (100% - 2em + .8em) / 3 + .5em)}97%,100%{opacity:0;left:calc(1em + 2 * (100% - 2em + .8em) / 3 + .5em)}}
 .xf-n{width:7em}.xf-line{left:4.5em;right:4.5em;top:4.62em}.xf-pk{top:4.27em;left:4.5em}
 @keyframes xfpk{0%,3%{opacity:0;left:4.5em}5%{opacity:1}20%{left:calc(4.5em + (100% - 9em) / 3)}40%{left:calc(4.5em + 2 * (100% - 9em) / 3)}60%{left:calc(100% - 4.5em);opacity:1}64%,100%{left:calc(100% - 4.5em);opacity:0}}
 .xf-end{grid-template-columns:1fr}.xf-done{display:none}
 .sw-dash .sw-body{grid-template-columns:9em 1fr}.xt-kpi b{font-size:1.2em}
 .sw-ai .sw-body{grid-template-columns:1.6fr 1fr;gap:.8em}
}
/* V39b: real brand marks and premium product art in the scenes (no letter tiles, no clip-art) */
.sw-lg{display:inline-grid;place-items:center;width:1.25em;height:1.25em;margin-right:.45em;vertical-align:-.25em;flex:none}
.sw-lg img,.sw-lg svg{width:100%;height:100%;object-fit:contain}
.xs-q .sw-lg{width:1.3em;height:1.3em;margin:0}
.xa-g small,.xa-m small,.xt-feed em{display:flex;align-items:center}
.xt-feed em .sw-lg{background:#fff;border-radius:.3em;padding:.12em}
.xf-ic{background:#fff!important;color:inherit;box-shadow:0 0 0 1px #16112c14,0 .6em 1.2em -.6em #16112c55!important}
.xf-ic svg,.xf-ic img{width:52%;height:52%;object-fit:contain}
.xf-msg>i{background:#fff!important;box-shadow:0 0 0 1px #16112c1a}.xf-msg>i img,.xf-msg>i svg{width:60%;height:60%;object-fit:contain}
.xi-av b svg{width:46%;height:46%}
.xe-img{position:relative;background:radial-gradient(60% 50% at 50% 80%,#ffffffcc,transparent 70%),linear-gradient(160deg,#f3eee6,#e6dccd)!important;overflow:hidden}
.xe-img:after{content:"";position:absolute;left:30%;right:30%;bottom:12%;height:.7em;border-radius:50%;background:#16112c26;filter:blur(.25em)}
.xe-btl{position:relative;z-index:1;display:grid;place-items:center;width:3.6em;height:6.2em;margin-top:1.4em;border-radius:.9em .9em 1em 1em;background:linear-gradient(100deg,#2a2140 0%,#4a3a6e 45%,#2a2140 100%);box-shadow:inset .35em 0 .6em #ffffff22,0 .8em 1.2em -.6em #16112c88}
.xe-btl span{font:600 .62em/1 Poppins,Inter,sans-serif;letter-spacing:.22em;color:#e9dcc2;padding-left:.22em}
.xe-cap{position:absolute;z-index:2;top:calc(50% - 4.55em);left:50%;width:1.7em;height:1.5em;margin-left:-.85em;border-radius:.3em .3em .15em .15em;background:linear-gradient(90deg,#b99a62,#e9d4a2,#b99a62)}
.xm-img{display:flex;flex-direction:column;justify-content:flex-end;padding:.8em .9em;background:linear-gradient(150deg,#2a2140,#4b3a78 60%,#7F52EE)!important;color:#fff}
.xm-img span{font-size:.75em;letter-spacing:.18em;text-transform:uppercase;color:#d9cdfa}
.xm-img b{font:600 1.7em/1 "Playfair Display",Georgia,serif;font-style:italic}

/* ================= V39: one phone type scale (owner: text sizes must feel organized) =================
   hero 44 · section title 30 · card title 22 · body 15.5 · section intro 16. Section heads are always centred. */
@media(max-width:700px){
 .hero.hA h1{font-size:clamp(33px,11.6vw,46px)!important;line-height:1.04!important;letter-spacing:-.04em!important}
 #main .sh,#main .sh.l{text-align:center!important;margin-left:auto!important;margin-right:auto!important;align-items:center!important}
 #main .sh h2{font-size:30px!important;line-height:1.1!important;letter-spacing:-.035em!important}
 #main .sh p{font-size:16px!important;line-height:1.6!important;margin-left:auto!important;margin-right:auto!important}
 #main .sec h3:not(.sw h3):not(.fg h3){font-size:22px!important;line-height:1.2!important;letter-spacing:-.025em!important}
 #main .sec p:not(.sh p):not(.sw p):not(.fg p){font-size:15.5px!important;line-height:1.6!important}
}
@media(max-width:700px){#main .sec h2:not(.sw h2){font-size:30px!important;line-height:1.1!important;letter-spacing:-.035em!important}}
/* V39 phone: every hero uses equal full-width buttons (like Home); platform label sits above its logos */
@media(max-width:700px){
 #main .acts{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:10px!important;width:100%}
 #main .acts .btn{width:100%!important;justify-content:center!important;text-align:center}
 #main .plat{display:flex;flex-wrap:wrap;gap:8px}
 #main .plat>span:first-child{flex-basis:100%}
}
@media(max-width:700px){#main .pc1 .btn{width:100%;justify-content:center;text-align:center}}
/* V39: scenes never show a broken frame. The bar fill and chart line rest as a faint track, the cursor never leaves an empty gap,
   and the CRM card dims (never vanishes) when the loop resets */
@keyframes swf5{0%,52%{transform:scaleX(.12)}64%,92%{transform:none}97%,100%{transform:scaleX(.12)}}
@keyframes swf6{0%,62%{transform:scaleX(.12)}74%,92%{transform:none}97%,100%{transform:scaleX(.12)}}
@keyframes xtln{0%,45%{clip-path:inset(0 70% 0 0)}62%,92%{clip-path:inset(0)}97%,100%{clip-path:inset(0 70% 0 0)}}
@keyframes xccard{0%{opacity:.5;left:calc(1.2em + .7em)}5%,30%{opacity:1;left:calc(1.2em + .7em)}38%,60%{left:calc(1.2em + (100% - 2.4em + .8em) / 3 + .7em)}68%,92%{opacity:1;left:calc(1.2em + 2 * (100% - 2.4em + .8em) / 3 + .7em)}97%,100%{opacity:.5;left:calc(1.2em + 2 * (100% - 2.4em + .8em) / 3 + .7em)}}
@container (max-width:460px){@keyframes xccard{0%{opacity:.5;left:calc(1em + .5em)}5%,30%{opacity:1;left:calc(1em + .5em)}38%,60%{left:calc(1em + (100% - 2em + .8em) / 3 + .5em)}68%,92%{opacity:1;left:calc(1em + 2 * (100% - 2em + .8em) / 3 + .5em)}97%,100%{opacity:.5;left:calc(1em + 2 * (100% - 2em + .8em) / 3 + .5em)}}}
/* V39: scene panels use one centred glow (the corner glows made phone stills look lopsided) */
.pv.xs-pv,.pcs.xs-pv{background:radial-gradient(80% 70% at 50% 0%,#7F52EE2e,transparent 70%),#0c0b13!important;border:1px solid #ffffff12!important}
.sec.bright .pv.xs-pv{background:radial-gradient(80% 70% at 50% 0%,#7F52EE38,transparent 70%),#100e1a!important}
@media(max-width:700px){.plans .plan .pr{font-size:48px!important;line-height:1!important;letter-spacing:-.04em!important}}
.pr .pfrom{font-size:.3em;font-weight:600;letter-spacing:0;margin-right:.35em;vertical-align:.9em;opacity:.75;-webkit-text-fill-color:currentColor}
/* V39: journey tags were 37px tall inside a 34px row, so their bottom edge was cut; the row now fits one full line of tags */
.cases .case.bp .tags{max-height:40px!important;padding-bottom:1px}
/* V39: journey mocks (same white app window, real content). Rows fill in one by one and never leave the card empty */
.mk.jm .mt{display:flex;align-items:center;gap:5px}.mk.jm .mt small{margin-left:8px;font-size:10px;font-weight:600;color:#6b6584}
.mk.jm .mb{display:flex;flex-direction:column;gap:7px}
.jm .jr{display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:9px;background:#f4f2fb;animation:jmin 8s ease-in-out infinite;animation-delay:calc(var(--i)*.7s)}
.jm .jr .av{flex:none;width:18px;height:18px;border-radius:50%;background:#c4b0ff}
.jm .jr b{flex:1;min-width:0;font-size:11px;font-weight:600;color:#14102b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jm .jr em{flex:none;font-style:normal;font-size:10px;font-weight:700;padding:3px 8px;border-radius:20px;background:#e4f4cf;color:#2e5410}
.jm .js{display:flex;align-items:center;gap:5px}
.jm .js span{flex:1;text-align:center;padding:9px 4px;border-radius:9px;background:#f4f2fb;font-size:10.5px;font-weight:700;color:#14102b;animation:jmlit 8s ease-in-out infinite;animation-delay:calc(var(--i)*1s)}
.jm .js i{font-style:normal;color:#9a93b8;font-weight:700}
.jm .jk{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.jm .jk>div{padding:7px;border-radius:9px;background:#f4f2fb;animation:jmin 8s ease-in-out infinite;animation-delay:calc(var(--i)*.5s)}
.jm .jk em{display:block;font-style:normal;font-size:10px;font-weight:700;color:#14102b;margin-bottom:4px}
.jm .jk .bars{display:flex;align-items:flex-end;gap:3px;height:28px}.jm .jk .bars i{flex:1;background:#7F52EE;border-radius:2px}
@keyframes jmin{0%,4%{opacity:.4}10%,90%{opacity:1}100%{opacity:.4}}
@keyframes jmlit{0%,6%{background:#f4f2fb;color:#14102b}12%,30%{background:#7F52EE;color:#fff}38%,100%{background:#f4f2fb;color:#14102b}}
body.still .jm *{animation:none!important}@media(prefers-reduced-motion:reduce){.jm *{animation:none!important}}
.mk.jm em,.mk.jm .jk em{font-family:Inter,'Inter FB',system-ui,sans-serif!important;font-style:normal!important;letter-spacing:0;-webkit-text-fill-color:currentColor;background:none}
.mk.jm .jk em{background:none!important;padding:0}
/* V39 phone balance (rechecked after the reverts): tile titles reserve two lines so descriptions align,
   journey text is never cut with "…" on phone, and journey rows wrap instead of truncating */
.ht b{line-height:1.25;min-height:2.5em}
@media(max-width:700px){
 .case.bp .bp-p,.cases .case.bp .bp-p{display:block!important;-webkit-line-clamp:unset!important;overflow:visible!important;min-height:0!important}
 .jm .jr b{white-space:normal;overflow:visible;line-height:1.3}
}
/* V39 320px: journey rows let the status chip wrap under the name; the Monthly hero card never pushes past the screen */
@media(max-width:700px){.jm .jr{flex-wrap:wrap;row-gap:4px}.jm .jr b{flex:1 1 140px;text-overflow:clip}.hero-card,.hero-card.side-gp{min-width:0!important;max-width:100%!important;box-sizing:border-box}}
.bp-pv .mk.jm{width:min(440px,92%);margin:0 auto;font-size:12px}
.bp-pv .mk.jm .jr b{font-size:13px}.bp-pv .mk.jm .jr em{font-size:11.5px}.bp-pv .mk.jm .js span{font-size:12px}
/* V39: the hero glow (::after) was clipped by the hero's bottom edge, leaving a hard purple line on the right; fade it out before the edge */
.hero:after{background:radial-gradient(26% 34% at 18% 18%,#0f9b78c4,transparent 70%),radial-gradient(28% 34% at 82% 70%,#6a3df0c8,transparent 70%),radial-gradient(18% 22% at 72% 22%,#7F52EE55,transparent 70%),radial-gradient(16% 20% at 26% 80%,#9ECD5F30,transparent 70%);-webkit-mask-image:linear-gradient(to bottom,#000 76%,transparent 84%);mask-image:linear-gradient(to bottom,#000 76%,transparent 84%)}
/* V39: the glow layer itself used to move (transform), which dragged its fade with it, so at some moments the hard line came back.
   Now the layer is fixed and ends exactly at the hero's bottom edge, the fade sits on that edge, and only the colours drift inside it. */
.hero:after{inset:-25% -25% 0 -25%!important;transform:none!important;will-change:auto!important;background-size:125% 125%!important;background-repeat:no-repeat!important;animation:lvglow 16s ease-in-out infinite alternate!important;-webkit-mask-image:linear-gradient(to bottom,#000 72%,transparent 100%)!important;mask-image:linear-gradient(to bottom,#000 72%,transparent 100%)!important}
@keyframes lvglow{0%{background-position:35% 40%}50%{background-position:62% 58%}100%{background-position:52% 34%}}
body.still .hero:after{animation:none!important}
@media(prefers-reduced-motion:reduce){.hero:after{animation:none!important}}
/* V39: real reviews. Vertical phone videos show as a portrait poster (face in frame); the player opens tall, with captions */
.rv-vid.rv-vert{aspect-ratio:4/5;padding:0;background:#0b0a12}
.rv-vid .rv-pimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.rv-vid.rv-vert:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,#0009,transparent 45%);pointer-events:none}
.rv-vid.rv-vert .rv-play,.rv-vid.rv-vert .rv-len{z-index:1}
.rv-card .av-img{object-fit:cover;object-position:50% 25%;padding:0;background:#ddd}
.rv-card .rv-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.rv-card .rv-src{font-size:12.5px;font-weight:700;letter-spacing:.02em;color:#7F52EE}
.rvd.vert{max-width:min(420px,92vw);width:auto}
.rvd.vert video{max-height:86vh;width:auto;max-width:100%;margin:0 auto}
.rvd video::cue{background:#000c;color:#fff;font:500 15px/1.4 Inter,system-ui,sans-serif}
@media(max-width:700px){.rv-vid.rv-vert{aspect-ratio:4/5}.rv-one .rv-card{padding:22px}}
/* V39: real reviews in the earlier wall design. Video tiles are wide (as before) and show the client's face */
.rv-vid.rv-real{aspect-ratio:16/10}
.rv-vid.rv-real .rv-pimg{object-position:50% 28%}
.rv-vid.rv-real:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,#0008,transparent 50%);pointer-events:none}
.rv-vid.rv-real .rv-play,.rv-vid.rv-real .rv-len{z-index:1}
/* V39: real video tiles keep the face clear: play button sits bottom-left, duration bottom-right */
.rv-vid.rv-real .rv-play{left:14px;top:auto;bottom:12px;margin:0;width:46px;height:46px;box-shadow:0 0 0 7px #ffffff2e}
.rv-vid.rv-real .rv-play:after{left:18px;top:14px;border-width:9px 0 9px 14px}
/* V39: rating box (a review-site feel in our own style) and an even review grid */
.rv-box{display:flex;align-items:center;gap:22px;width:max-content;max-width:100%;margin:-12px auto 40px;padding:18px 26px;border-radius:22px;background:#fff;border:1px solid #e7e2f8;box-shadow:0 18px 40px -24px #2a1a6b55}
.rv-box .rv-big{font:700 46px/1 Poppins,Inter,sans-serif;letter-spacing:-.04em;color:#16112c}
.rv-box .rv-mid{display:flex;flex-direction:column;gap:4px;padding-right:22px;border-right:1px solid #ece8f8}
.rv-box .rv-stars{font-size:22px;letter-spacing:2px;color:#f5b400;line-height:1}
.rv-box .rv-mid span:last-child{font-size:14px;font-weight:600;color:#5b5675}
.rv-box .rv-faces{display:flex}
.rv-box .rv-faces img{width:36px;height:36px;border-radius:50%;object-fit:cover;border:2px solid #fff;margin-left:-10px;box-shadow:0 4px 10px -4px #16112c55}
.rv-box .rv-faces img:first-child{margin-left:0}
.rv-wall.rv-grid{columns:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:stretch}
.rv-grid .rv-card{margin:0;display:flex;flex-direction:column}
.rv-grid .rv-card figcaption{margin-top:auto}
@media(max-width:1000px){.rv-wall.rv-grid{grid-template-columns:minmax(0,1fr);max-width:560px;margin:0 auto}}
@media(max-width:700px){.rv-box{flex-wrap:wrap;justify-content:center;gap:12px 16px;padding:16px 18px;margin-top:-6px}.rv-box .rv-big{font-size:40px}.rv-box .rv-mid{padding-right:0;border-right:0}.rv-box .rv-faces{flex-basis:100%;justify-content:center}}
@media(max-width:700px){.rv-box .rv-mid{align-items:center;text-align:center}}
/* V39: the earlier staggered wall, balanced: 3 columns, each one video + one written card, and all columns end level */
.rv-wall.rv-cols{columns:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:stretch}
.rv-cols .rv-col{display:flex;flex-direction:column;gap:20px}
.rv-cols .rv-card{margin:0;display:flex;flex-direction:column}
.rv-cols .rv-card:last-child{flex:1}
.rv-cols .rv-card figcaption{margin-top:auto}
@media(max-width:1000px){.rv-wall.rv-cols{grid-template-columns:minmax(0,1fr);max-width:560px;margin:0 auto}.rv-cols .rv-card:last-child{flex:none}}
/* V40: phone dock like an app bar: Work · Services · [V mark] · Pricing · More. The V mark button is "Start a project"; desktop keeps the text pill */
.dock .go-v{display:none}
@media(max-width:700px){
 .dock{align-items:center;gap:0;padding:6px 8px;overflow:visible}
 .dock>a.hm[href="/work/"]{display:block}
 .dock>a[href="/pricing/"]{display:block}
 .dock>a,.dock>button{padding:10px 11px;font-size:13px}
 .dock .go{position:relative;width:56px;height:56px;padding:0!important;margin:-22px 6px 0;flex:none;border-radius:17px;background:none!important;box-shadow:0 10px 26px -6px #7F52EEcc,0 0 0 4px #07070b!important;overflow:hidden}
 .dock .go .go-t{display:none}
 .dock .go .go-v{display:block;width:100%;height:100%}
 .dock .go:active{transform:scale(.95)}
}
@media(max-width:340px){.dock>a,.dock>button{padding:9px 7px;font-size:12.5px}.dock .go{width:50px;height:50px;margin:-18px 3px 0}}
/* v40: the "+" in the platform card matches the hero "+" (same drawn plus, same gradient, same turn on hover) */
.wb-ic .wb-plus svg{width:44%;height:44%;color:#fff;transition:transform .35s cubic-bezier(.3,.7,.25,1)}
.wb-ic .wb-plus:before{content:none!important}
.wb:hover .wb-ic .wb-plus svg{transform:rotate(90deg)}
/* v40: phone dock button like a notch, not a badge: the bar is cut around the V button (mask), the button has no border
   and a thin rim where a light keeps running round (conic gradient on a registered angle), plus a soft inner top highlight */
@property --lvA{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes lvRim{to{--lvA:360deg}}
@media(max-width:700px){
 .dock{display:grid;grid-template-columns:1fr 1fr 64px 1fr 1fr;justify-items:center;background:transparent!important;border-color:transparent!important;box-shadow:none!important;isolation:isolate;width:min(360px,calc(100vw - 16px))}
 .dock:before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:#0b0a12f2;border:1px solid #ffffff1c;box-shadow:inset 0 1px 0 #ffffff12;
  -webkit-mask:radial-gradient(circle 35px at 50% 3px,transparent 97%,#000 100%);mask:radial-gradient(circle 35px at 50% 3px,transparent 97%,#000 100%)}
 .dock>a,.dock>button{padding:10px 6px;justify-self:stretch;text-align:center}
 .dock .go{justify-self:center;width:56px;height:56px;margin:-26px 0 0;padding:1.6px!important;border-radius:17px;
  background:conic-gradient(from var(--lvA),#ffffff 0deg,#ffffff00 80deg,#ffffff00 280deg,#ffffff 360deg),#7d40ff!important;box-shadow:none!important;animation:lvRim 3.2s linear infinite}
 .dock .go .go-v{border-radius:15.4px;position:relative}
 .dock .go:after{content:"";position:absolute;inset:1.6px;border-radius:15.4px;box-shadow:inset 0 2px 3px #ffffff80;pointer-events:none}
}
@media(max-width:340px){.dock{grid-template-columns:1fr 1fr 58px 1fr 1fr}.dock .go{width:50px;height:50px;margin-top:-20px}.dock:before{-webkit-mask:radial-gradient(circle 32px at 50% 5px,transparent 97%,#000 100%);mask:radial-gradient(circle 32px at 50% 5px,transparent 97%,#000 100%)}}
body.still .dock .go{animation:none!important}
@media(prefers-reduced-motion:reduce){.dock .go{animation:none!important}}
/* v40 phone QC: nothing spills out of its box, one spacing system, compact demo visuals */
@media(max-width:700px){
 /* broken: long button text, stat boxes, monthly rows, agency mock */
 #main .btn{white-space:normal;line-height:1.3;text-align:center;min-height:52px;height:auto}
 .hc-stats{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
 .hc-stats>div{min-width:0;padding:14px 8px!important}
 .hc-stats b{font-size:clamp(22px,7.4vw,30px)!important;letter-spacing:-.03em;white-space:nowrap}
 .hc-stats span{font-size:12px!important;line-height:1.3;overflow-wrap:anywhere}
 .hc-rows>div{grid-template-columns:44px minmax(0,1fr) auto!important;gap:10px!important;padding:11px 12px!important}
 .hc-rows span{min-width:0;font-size:13px;line-height:1.35}
 .isc-ag>div{max-width:calc(100% - 4px)}.isc-ag .front em{display:none}
 #main a b{overflow-wrap:anywhere}
 /* one spacing system */
 .sec{padding-top:56px!important;padding-bottom:56px!important}
 #main .sh{margin-bottom:24px!important}
 .ind6 .ic{padding:22px!important}
 .plans .plan{padding:26px 22px!important}
 .wb-c{padding:20px!important;gap:16px!important}
 .rv-card{padding:22px!important}
 .cases .case.bp>div:not(.cv){padding:20px!important}
 /* compact demo visuals (same content, less height) */
 .wb-v{padding:12px!important}
 .wb-msg{padding:8px 10px!important;gap:8px!important;font-size:12.5px;line-height:1.35}
 .wb-msg b{font-size:12px}
}
@media(max-width:360px){
 .wb-ic i.wb-lg,.wb-ic .wb-plus{width:42px!important;height:42px!important;margin-left:-10px!important}
 .wb-ic i.wb-lg:first-child{margin-left:0!important}
}
/* v40: the "side by side" comparison stays a real table on phone and swipes sideways (like the reference), LeadsVector row highlighted */
.cm-hint{display:none}
@media(max-width:700px){
 .cm-hint{display:block;margin:0 0 10px;text-align:right;font-size:12.5px;font-weight:600;color:var(--dim)}
 .cm{overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}
 .cm::-webkit-scrollbar{display:none}
 .cm-h,.cm-r{display:grid!important;grid-template-columns:190px repeat(4,92px)!important;width:max-content;min-width:100%;gap:8px!important;padding:14px 16px!important;align-items:center}
 .cm-r>div{grid-column:auto!important}
 .cm-r>span{display:block!important;text-align:center!important;font-size:inherit!important}
 .cm-r>span:before{content:none!important;display:none!important}
 .cm-h span{font-size:12px;text-align:center}.cm-h span:first-child{text-align:left}
 .cm-r b{font-size:15px}.cm-r small{font-size:12.5px;line-height:1.35}
 .cm-r.us{margin:6px!important}
}
/* v40: the dock rises around the V button as one dark shape (no see-through cut), so it looks right on white and dark sections */
@media(max-width:700px){
 .dock:before{-webkit-mask:none!important;mask:none!important}
 .dock:after{content:"";position:absolute;z-index:-1;left:50%;top:-20px;width:72px;height:44px;margin-left:-36px;border-radius:24px 24px 0 0;background:#0b0a12f2;border:1px solid #ffffff1c;border-bottom:0;pointer-events:none}
}
@media(max-width:340px){.dock:after{top:-15px;width:66px;margin-left:-33px;height:38px}}
/* v40: the dock is cut with a smooth U-notch around the V button (like the reference): curved shoulders, an even gap round the button,
   and the bar's thin top edge follows the curve. Built from a mask in three parts so it works at any dock width */
@media(max-width:700px){
 .dock:after{content:"";position:absolute;z-index:-1;left:50%;top:0;width:100px;height:40px;margin-left:-50px;border:0!important;border-radius:0!important;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40'%3E%3Cpath d='M0 .5H4C11 .5 13 3.5 15 9.5L17 18C20 31 27 36.5 38 36.5H62C73 36.5 80 31 83 18L85 9.5C87 3.5 89 .5 96 .5H100' fill='none' stroke='%23ffffff33' stroke-width='1'/%3E%3C/svg%3E") center top/100px 40px no-repeat!important;pointer-events:none}
 .dock:before{
  -webkit-mask:linear-gradient(#000,#000) left top/calc(50% - 50px) 100% no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40'%3E%3Cpath d='M0 0H4C11 0 13 3 15 9L17 18C20 31 27 36 38 36H62C73 36 80 31 83 18L85 9C87 3 89 0 96 0H100V40H0Z'/%3E%3C/svg%3E") center top/100px 40px no-repeat,linear-gradient(#000,#000) center bottom/100px calc(100% - 39px) no-repeat,linear-gradient(#000,#000) right top/calc(50% - 50px) 100% no-repeat!important;
  mask:linear-gradient(#000,#000) left top/calc(50% - 50px) 100% no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40'%3E%3Cpath d='M0 0H4C11 0 13 3 15 9L17 18C20 31 27 36 38 36H62C73 36 80 31 83 18L85 9C87 3 89 0 96 0H100V40H0Z'/%3E%3C/svg%3E") center top/100px 40px no-repeat,linear-gradient(#000,#000) center bottom/100px calc(100% - 39px) no-repeat,linear-gradient(#000,#000) right top/calc(50% - 50px) 100% no-repeat!important}
 .dock .go{margin-top:-24px!important}
}
@media(max-width:340px){.dock .go{margin-top:-20px!important}}
@media(max-width:340px){.hc-stats b{font-size:21px!important;letter-spacing:-.04em}.hc-stats>div{padding:12px 4px!important}}
@media(max-width:700px){.hc-rows span{white-space:normal!important;overflow-wrap:anywhere}}
/* v40: the notch is a carved groove, not a hole: it is filled with a deeper shade of the dock, so white sections never show through */
@media(max-width:700px){
 .dock:after{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40'%3E%3Cpath d='M4 0C11 0 13 3 15 9L17 18C20 31 27 36 38 36H62C73 36 80 31 83 18L85 9C87 3 89 0 96 0Z' fill='%2304030a' fill-opacity='.94'/%3E%3Cpath d='M0 .5H4C11 .5 13 3.5 15 9.5L17 18C20 31 27 36.5 38 36.5H62C73 36.5 80 31 83 18L85 9.5C87 3.5 89 .5 96 .5H100' fill='none' stroke='%23ffffff38' stroke-width='1'/%3E%3C/svg%3E") center top/100px 40px no-repeat!important}
}
/* v40: clean notch. The blur sat on the whole dock box, so the page looked smeared inside the cut; it now sits only on the bar
   shape (which is masked), the notch is a true clean cut, and only the thin edge line follows the curve */
@media(max-width:700px){
 .dock{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
 .dock:before{-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%)}
 .dock:after{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40'%3E%3Cpath d='M0 .5H4C11 .5 13 3.5 15 9.5L17 18C20 31 27 36.5 38 36.5H62C73 36.5 80 31 83 18L85 9.5C87 3.5 89 .5 96 .5H100' fill='none' stroke='%23ffffff38' stroke-width='1'/%3E%3C/svg%3E") center top/100px 40px no-repeat!important}
}
@media(max-width:360px){.ptabs .pt{white-space:normal!important;line-height:1.25;font-size:13px!important;padding-left:8px!important;padding-right:8px!important}}
/* v40: tighter notch: button 53px and raised, U hugs it with an even 5px gap */
@media(max-width:700px){
 .dock .go{width:53px!important;height:53px!important;margin-top:-28px!important;border-radius:16px!important}
 .dock .go .go-v,.dock .go:after{border-radius:14.4px!important}
 .dock:before{
  -webkit-mask:linear-gradient(#000,#000) left top/calc(50% - 50px) 100% no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40'%3E%3Cpath d='M0 0H7C13 0 15 3 16.5 8L18.5 15C21 25 27 30 37 30H63C73 30 79 25 81.5 15L83.5 8C85 3 87 0 93 0H100V40H0Z'/%3E%3C/svg%3E") center top/100px 40px no-repeat,linear-gradient(#000,#000) center bottom/100px calc(100% - 39px) no-repeat,linear-gradient(#000,#000) right top/calc(50% - 50px) 100% no-repeat!important;
  mask:linear-gradient(#000,#000) left top/calc(50% - 50px) 100% no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40'%3E%3Cpath d='M0 0H7C13 0 15 3 16.5 8L18.5 15C21 25 27 30 37 30H63C73 30 79 25 81.5 15L83.5 8C85 3 87 0 93 0H100V40H0Z'/%3E%3C/svg%3E") center top/100px 40px no-repeat,linear-gradient(#000,#000) center bottom/100px calc(100% - 39px) no-repeat,linear-gradient(#000,#000) right top/calc(50% - 50px) 100% no-repeat!important}
 .dock:after{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40'%3E%3Cpath d='M0 .5H7C13 .5 15 3.5 16.5 8.5L18.5 15C21 25 27 30.5 37 30.5H63C73 30.5 79 25 81.5 15L83.5 8.5C85 3.5 87 .5 93 .5H100' fill='none' stroke='%23ffffff38' stroke-width='1'/%3E%3C/svg%3E") center top/100px 40px no-repeat!important}
}
@media(max-width:340px){.dock .go{width:48px!important;height:48px!important;margin-top:-24px!important}}
@media(max-width:700px){.dock .go{align-self:start!important;margin-top:-34px!important}}
@media(max-width:340px){.dock .go{margin-top:-29px!important}}
/* v40: the cut follows the V button's own shape: the same rounded square, offset 4px all round (straight sides, matching corners) */
@media(max-width:700px){
 .dock:before{
  -webkit-mask:linear-gradient(#000,#000) left top/calc(50% - 50px) 100% no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40'%3E%3Cpath d='M0 0H16Q19.5 0 19.5 3.5V10Q19.5 30 39.5 30H60.5Q80.5 30 80.5 10V3.5Q80.5 0 84 0H100V40H0Z'/%3E%3C/svg%3E") center top/100px 40px no-repeat,linear-gradient(#000,#000) center bottom/100px calc(100% - 39px) no-repeat,linear-gradient(#000,#000) right top/calc(50% - 50px) 100% no-repeat!important;
  mask:linear-gradient(#000,#000) left top/calc(50% - 50px) 100% no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40'%3E%3Cpath d='M0 0H16Q19.5 0 19.5 3.5V10Q19.5 30 39.5 30H60.5Q80.5 30 80.5 10V3.5Q80.5 0 84 0H100V40H0Z'/%3E%3C/svg%3E") center top/100px 40px no-repeat,linear-gradient(#000,#000) center bottom/100px calc(100% - 39px) no-repeat,linear-gradient(#000,#000) right top/calc(50% - 50px) 100% no-repeat!important}
 .dock:after{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40'%3E%3Cpath d='M0 .5H16Q19 .5 19 3.5V10Q19 30.5 39.5 30.5H60.5Q81 30.5 81 10V3.5Q81 .5 84 .5H100' fill='none' stroke='%23ffffff38' stroke-width='1'/%3E%3C/svg%3E") center top/100px 40px no-repeat!important}
}
/* v40: button sits 6px lower; the matching cut is 6px deeper */
@media(max-width:700px){
 .dock .go{margin-top:-28px!important}
 .dock:before{
  -webkit-mask:linear-gradient(#000,#000) left top/calc(50% - 50px) 100% no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40'%3E%3Cpath d='M0 0H16Q19.5 0 19.5 3.5V16Q19.5 36 39.5 36H60.5Q80.5 36 80.5 16V3.5Q80.5 0 84 0H100V40H0Z'/%3E%3C/svg%3E") center top/100px 40px no-repeat,linear-gradient(#000,#000) center bottom/100px calc(100% - 39px) no-repeat,linear-gradient(#000,#000) right top/calc(50% - 50px) 100% no-repeat!important;
  mask:linear-gradient(#000,#000) left top/calc(50% - 50px) 100% no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40'%3E%3Cpath d='M0 0H16Q19.5 0 19.5 3.5V16Q19.5 36 39.5 36H60.5Q80.5 36 80.5 16V3.5Q80.5 0 84 0H100V40H0Z'/%3E%3C/svg%3E") center top/100px 40px no-repeat,linear-gradient(#000,#000) center bottom/100px calc(100% - 39px) no-repeat,linear-gradient(#000,#000) right top/calc(50% - 50px) 100% no-repeat!important}
 .dock:after{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40'%3E%3Cpath d='M0 .5H16Q19 .5 19 3.5V16Q19 36.5 39.5 36.5H60.5Q81 36.5 81 16V3.5Q81 .5 84 .5H100' fill='none' stroke='%23ffffff38' stroke-width='1'/%3E%3C/svg%3E") center top/100px 40px no-repeat!important}
}
@media(max-width:340px){.dock .go{margin-top:-24px!important}}
/* v40: button seated a third above / two thirds inside the bar; a soft brand-lime glow runs along the bar's top edge and the cut
   (fading towards the rounded ends), the button itself has no glow */
@media(max-width:700px){
 .dock .go{margin-top:-25px!important}
 .dock:before{
  -webkit-mask:linear-gradient(#000,#000) left top/calc(50% - 50px) 100% no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40'%3E%3Cpath d='M0 0H16Q19.5 0 19.5 3.5V19Q19.5 39 39.5 39H60.5Q80.5 39 80.5 19V3.5Q80.5 0 84 0H100V40H0Z'/%3E%3C/svg%3E") center top/100px 40px no-repeat,linear-gradient(#000,#000) center bottom/100px calc(100% - 39.5px) no-repeat,linear-gradient(#000,#000) right top/calc(50% - 50px) 100% no-repeat!important;
  mask:linear-gradient(#000,#000) left top/calc(50% - 50px) 100% no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40'%3E%3Cpath d='M0 0H16Q19.5 0 19.5 3.5V19Q19.5 39 39.5 39H60.5Q80.5 39 80.5 19V3.5Q80.5 0 84 0H100V40H0Z'/%3E%3C/svg%3E") center top/100px 40px no-repeat,linear-gradient(#000,#000) center bottom/100px calc(100% - 39.5px) no-repeat,linear-gradient(#000,#000) right top/calc(50% - 50px) 100% no-repeat!important;
  border-top-color:transparent!important}
 .dock:after{left:0!important;right:0;width:auto!important;margin-left:0!important;top:-7px!important;height:47px!important;
  background:
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40'%3E%3Cdefs%3E%3Cfilter id='g' x='-20%25' y='-40%25' width='140%25' height='180%25'%3E%3CfeGaussianBlur stdDeviation='1.6'/%3E%3C/filter%3E%3C/defs%3E%3Cpath d='M0 .5H16Q19 .5 19 3.5V19Q19 39.5 39.5 39.5H60.5Q81 39.5 81 19V3.5Q81 .5 84 .5H100' fill='none' stroke='%239ECD5F' stroke-opacity='.34' stroke-width='2.6' filter='url(%23g)'/%3E%3Cpath d='M0 .5H16Q19 .5 19 3.5V19Q19 39.5 39.5 39.5H60.5Q81 39.5 81 19V3.5Q81 .5 84 .5H100' fill='none' stroke='%23c6ea93' stroke-opacity='.55' stroke-width='1'/%3E%3C/svg%3E") center 7px/100px 40px no-repeat,
   linear-gradient(90deg,#9ECD5F00,#c6ea93c0) 20px 7px/calc(50% - 70px) 1px no-repeat,
   linear-gradient(90deg,#c6ea93c0,#9ECD5F00) calc(100% - 20px) 7px/calc(50% - 70px) 1px no-repeat,
   linear-gradient(90deg,#9ECD5F00,#9ECD5F30) 20px 1px/calc(50% - 70px) 6px no-repeat,
   linear-gradient(90deg,#9ECD5F30,#9ECD5F00) calc(100% - 20px) 1px/calc(50% - 70px) 6px no-repeat!important;
  -webkit-mask:linear-gradient(#000 0,#000 100%);mask:none}
}
@media(max-width:340px){.dock .go{margin-top:-21px!important}}
/* v40 phone type scale (slightly smaller, still very readable) and balanced line breaks:
   headings balance their lines, paragraphs avoid a lone last word */
@media(max-width:700px){
 .hero.hA h1{font-size:clamp(31px,10.4vw,40px)!important;line-height:1.06!important}
 .split-hero h1,.hero.sm h1,#main .hero:not(.hA) h1{font-size:clamp(28px,8.6vw,32px)!important;line-height:1.1!important}
 #main .sh h2,#main .sec h2:not(.sw h2){font-size:28px!important;line-height:1.12!important}
 #main .sec h3:not(.sw h3):not(.fg h3){font-size:20px!important;line-height:1.22!important}
 #main .sh p{font-size:15.5px!important;line-height:1.6!important}
 #main p:not(.sh p):not(.sw p):not(.fg p):not(.mk p),#main li:not(.sw li){font-size:15px!important;line-height:1.6!important}
 #main .hero p.lead,#main .hero p{font-size:15.5px!important;line-height:1.6!important}
 #main h1,#main h2,#main h3,#main .sh p{text-wrap:balance}
 #main p,#main li,#main blockquote{text-wrap:pretty}
}
/* v40 phone footer: brand and Services full width, "Ways to start" and "Company" side by side, Contact full width */
@media(max-width:700px){
 footer .fcols{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:30px 18px!important}
 footer .fcols>*:nth-child(1),footer .fcols>*:nth-child(2),footer .fcols>*:nth-child(5){grid-column:1/-1}
 footer .fcols a{font-size:14.5px;line-height:1.4}
}
/* v40 phone hero: "We build the systems that turn traffic into" (balanced), the logos on their own line, then "customers." */
@media(max-width:700px){
 .hero.hA h1{text-wrap:balance}
 .hero.hA h1 .hic{display:flex!important;justify-content:center;width:max-content;margin:.16em auto .1em!important;font-size:.82em!important}
 .hero.hA h1 em{display:block}
 .hero.hA .lead{max-width:34ch;margin-left:auto;margin-right:auto}
}
.hero.hA .lead{text-wrap:balance}
/* v40: the running edge light on the V button made clearly visible: a 2px rim with a bright beam (white into brand lime) */
@media(max-width:700px){
 .dock .go{padding:2px!important;background:conic-gradient(from var(--lvA),#ffffff 0deg,#c6ea93 40deg,#9ECD5F00 110deg,#9ECD5F00 250deg,#c6ea93 320deg,#ffffff 360deg),#5a35d6!important}
 .dock .go .go-v,.dock .go:after{border-radius:14px!important}
 .dock .go:after{inset:2px!important}
}
/* v40 fix: the headline text uses background-clip:text, and Chrome drops the text before a flex child, so the logo line is a plain block */
@media(max-width:700px){.hero.hA h1 .hic{display:block!important;width:auto!important;text-align:center;white-space:nowrap}}
/* v40 fix: on phone the plain headline words are solid white (background-clip:text drops lines once the logos sit on their own line) */
@media(max-width:700px){.hero.hA h1{background:none!important;-webkit-text-fill-color:#fff!important;color:#fff}.hero.hA h1 .dl{text-align:center}}
/* v40 phone hero balance: logos near text height, subheadline full width, and a soft brand-purple wash from the top so the
   space around the headline reads as colour, not empty black (the side glows stay) */
@media(max-width:700px){
 .hero.hA h1 .hic{font-size:1.02em!important;margin:.12em auto .04em!important}
 .hero.hA .lead{max-width:none!important}
 .hero.hA{background:radial-gradient(120% 62% at 50% 0%,#5b33d6b3 0%,#3a1f8a66 38%,transparent 72%),#000!important}
}
/* v40: the wash sits behind the headline (not under the logo, whose purple V would vanish into it) */
@media(max-width:700px){.hero.hA{background:radial-gradient(95% 34% at 50% 27%,#5b33d6a6 0%,#3a1f8a55 45%,transparent 78%),#000!important}}
/* v40 phone: lighter headings. Poppins 700 read heavy and solid on a small screen; 600 with a touch more letter spacing keeps it strong but calmer */
@media(max-width:700px){
 .hero.hA h1{font-size:clamp(30px,9.4vw,36px)!important;font-weight:600!important;letter-spacing:-.03em!important;line-height:1.08!important}
 #main .hero:not(.hA) h1{font-weight:600!important;letter-spacing:-.025em!important}
 #main .sh h2,#main .sec h2:not(.sw h2){font-weight:600!important;letter-spacing:-.025em!important}
 #main .sec h3:not(.sw h3):not(.fg h3){font-weight:600!important;letter-spacing:-.015em!important}
}
/* v40: calmer start. The hero tiles rose 22px on load, which read as a jump; they now settle 8px with a soft ease (still a staggered entrance) */
@keyframes lvsettle{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.ht{animation-name:lvsettle!important;animation-duration:.9s!important;animation-timing-function:cubic-bezier(.25,.8,.3,1)!important;animation-fill-mode:both!important}
/* v40 phone: the logo line sat in a full text-height line box, leaving a hole above "customers.". The line now hugs the logos (a little bigger) and the accent word tucks up under them */
@media(max-width:700px){
 .hero.hA h1 .hic{font-size:1.12em!important;line-height:0!important;margin:.2em auto .14em!important}
 .hero.hA h1 em{line-height:1!important}
}
/* v40 readability: the italic accent words (e.g. "customers.") read faint. Two causes: on phone the word is a full-width block, so the
   lavender→green gradient spanned the screen and the word only got its greyish middle (sRGB mixes of purple and green go grey);
   and the thin italic. Fix: the gradient spans just the word, mixes in OKLab (no grey dip), brighter end stops, a touch more weight */
.hero h1 em,.sec h2 em,.cta h2 em,.band h2 em,.ts h3 em{background:linear-gradient(92deg in oklab,#d6c6ff 0%,#b6e07c 100%);-webkit-background-clip:text;background-clip:text;font-weight:600}
.sec.bright h2 em{background:linear-gradient(92deg in oklab,#5a35e6,#2f7a22);-webkit-background-clip:text;background-clip:text;font-weight:600}
.hero.hA h1 em{width:fit-content;margin-inline:auto}
/* v40: client logo strip (Home, under the hero). White one-colour marks at 72% so they read as proof, not decoration; two rows drift opposite ways */
.cl-sec{padding:34px 0 40px}.cl-sec .tl{text-align:center;margin-bottom:22px}
.cl-mq+.cl-mq{margin-top:22px}
.cl-row{display:flex;align-items:center;width:max-content;animation:lvmq 46s linear infinite}
.cl-row.rv-dir{animation-direction:reverse;animation-duration:52s}
.cl-row img{display:block;flex:none;margin:0 30px;opacity:.72;transition:opacity .3s}
.cl-row img:hover{opacity:1}
@media(max-width:700px){.cl-sec{padding:28px 0 32px}.cl-sec .tl{margin-bottom:18px}.cl-mq+.cl-mq{margin-top:16px}.cl-row img{margin:0 20px;width:auto!important;height:calc(var(--h,40px)*.8)}}
@media(prefers-reduced-motion:reduce){.cl-row{animation:none!important}}
body.still .cl-row{animation:none!important}
/* v40: one smooth entrance. The hero used to arrive in pieces on separate clocks (logos popping until 1.4s, "customers." only at 1.1–1.85s,
   tiles starting before the text, sub-line and buttons rising 22px), which read as jumpy. Same motions, one top-to-bottom sequence, done by ~1s */
.hero.hA .hic i.lg{animation-name:hicIn,hicf!important;animation-duration:.45s,7s!important;animation-timing-function:cubic-bezier(.3,1.18,.5,1),ease-in-out!important;animation-delay:calc(.18s + var(--i)*.045s),calc(1.6s + var(--i)*.45s)!important}
.hero.hA .hic-more{animation-delay:.5s!important;animation-duration:.45s!important}
@keyframes hicIn{from{opacity:0;scale:.7}to{opacity:1;scale:1}}
.hero.hA h1 em{animation-delay:.42s!important;animation-duration:.6s!important}
.hero.hA .lead{animation:lvsettle .8s cubic-bezier(.25,.8,.3,1) .32s both}
.hero.hA .acts{animation:lvsettle .8s cubic-bezier(.25,.8,.3,1) .42s both}
.htiles .ht:nth-child(1){animation-delay:.5s!important}.htiles .ht:nth-child(2){animation-delay:.55s!important}.htiles .ht:nth-child(3){animation-delay:.6s!important}
.htiles .ht:nth-child(4){animation-delay:.65s!important}.htiles .ht:nth-child(5){animation-delay:.7s!important}.htiles .ht:nth-child(6){animation-delay:.75s!important}
.ht{animation-duration:.7s!important}
/* v40: hero dot field. The dot grid was there but at ~7% white it never showed. Now soft lavender dots, strongest behind the headline and fading
   out to the edges (our own take on a dotted hero, not a copy): it adds depth without competing with the text */
.hero.hA:before{background-image:radial-gradient(circle,#cdb9ff 1.25px,transparent 1.75px)!important;background-size:24px 24px!important;background-position:50% 0!important;opacity:.44!important;
 -webkit-mask-image:radial-gradient(70% 58% at 50% 34%,#000 0%,#0009 40%,transparent 76%)!important;mask-image:radial-gradient(70% 58% at 50% 34%,#000 0%,#0009 40%,transparent 76%)!important}
@media(max-width:700px){.hero.hA:before{background-size:20px 20px!important;opacity:.38!important;-webkit-mask-image:radial-gradient(95% 40% at 50% 28%,#000 0%,#0009 45%,transparent 80%)!important;mask-image:radial-gradient(95% 40% at 50% 28%,#000 0%,#0009 45%,transparent 80%)!important}}
/* v40 balance: the logo strip sat 92px below the tiles (an older .sec.tr rule won over the strip's padding) and its second row slid under the dock.
   Now the hero-to-strip gap matches the hero's own rhythm, the rows sit closer, and the marks are a touch smaller, so on a laptop screen the whole strip clears the dock */
.hero.hA{padding-bottom:30px!important}
.sec.tr.cl-sec{padding:26px 0 40px}
.sec.tr.cl-sec .tl{margin-bottom:16px}
.cl-sec .cl-mq{-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.cl-mq+.cl-mq{margin-top:12px}
.cl-row img{width:auto!important;height:calc(var(--h,40px)*.84)}
@media(max-width:700px){.hero.hA{padding-bottom:24px!important}.sec.tr.cl-sec{padding:22px 0 34px}.cl-row img{height:calc(var(--h,40px)*.74)}}
/* v40 dots, calmer: dimmer right behind the words (so they never fight the text), a soft ring of texture around them, gone at the edges */
.hero.hA:before{background-image:radial-gradient(circle,#cdb9ff 1.1px,transparent 1.6px)!important;opacity:.34!important;
 -webkit-mask-image:radial-gradient(68% 60% at 50% 36%,#0006 0%,#000c 34%,#0007 55%,transparent 78%)!important;mask-image:radial-gradient(68% 60% at 50% 36%,#0006 0%,#000c 34%,#0007 55%,transparent 78%)!important}
@media(max-width:700px){.hero.hA:before{opacity:.3!important}}
/* v40: logos smaller (owner + design call): a proof strip is quiet texture; the tallest marks now ~30px desktop, ~26px phone, with tighter spacing to keep the rhythm */
.cl-row img{height:calc(var(--h,40px)*.66);margin:0 26px}
.cl-mq+.cl-mq{margin-top:10px}
@media(max-width:700px){.cl-row img{height:calc(var(--h,40px)*.56);margin:0 17px}}
/* V45: the backups also carry the real fonts' ascent/descent/line-gap (divided by size-adjust, the Next.js convention), so lines keep the same height when the real font arrives; without them the page below the hero moved 4px mid-scroll */
/* v40 no-jump fonts: if a web font is not ready for the first frame (common on Ctrl+R), the browser draws a backup font and swaps later; the headline
   re-wrapped and "customers." re-centred the line. These backups are local fonts resized to each web font's measured width, so the swap moves nothing */
@font-face{font-family:'Poppins FB';src:local('Arial'),local('ArialMT'),local('Liberation Sans'),local('Roboto');font-weight:400 500;size-adjust:106.9%;ascent-override:98.22%;descent-override:32.74%;line-gap-override:9.35%}
@font-face{font-family:'Poppins FB';src:local('Arial Bold'),local('Arial-BoldMT'),local('Liberation Sans Bold'),local('Roboto Bold');font-weight:600;size-adjust:106.9%;ascent-override:98.22%;descent-override:32.74%;line-gap-override:9.35%}
@font-face{font-family:'Poppins FB';src:local('Arial Bold'),local('Arial-BoldMT'),local('Liberation Sans Bold'),local('Roboto Bold');font-weight:700 800;size-adjust:108.3%;ascent-override:96.95%;descent-override:32.32%;line-gap-override:9.23%}
@font-face{font-family:'Inter FB';src:local('Arial'),local('ArialMT'),local('Liberation Sans'),local('Roboto');font-weight:400 500;size-adjust:106%;ascent-override:91.39%;descent-override:22.75%;line-gap-override:0.00%}
@font-face{font-family:'Inter FB';src:local('Arial Bold'),local('Arial-BoldMT'),local('Liberation Sans Bold'),local('Roboto Bold');font-weight:600 800;size-adjust:101.1%;ascent-override:95.82%;descent-override:23.86%;line-gap-override:0.00%}
@font-face{font-family:'Playfair FB';src:local('Georgia Italic'),local('Georgia-Italic');font-style:italic;font-weight:400 500;size-adjust:95.3%;ascent-override:113.54%;descent-override:26.34%;line-gap-override:0.00%}
@font-face{font-family:'Playfair FB';src:local('Georgia Italic'),local('Georgia-Italic');font-style:italic;font-weight:600 800;size-adjust:97%;ascent-override:111.55%;descent-override:25.88%;line-gap-override:0.00%}
:root{--sans:'Inter','Inter FB',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;--head:'Poppins','Poppins FB','Inter','Inter FB',system-ui,sans-serif;--serif:'Playfair Display','Playfair FB',Georgia,serif}
/* v40 phone: the strip label broke onto two heavy lines; one quiet line like the other eyebrow labels */
@media(max-width:700px){.sec.tr.cl-sec .tl{font-size:11px;letter-spacing:.14em;white-space:nowrap;margin-bottom:14px}}
/* v40: content-visibility on below-fold sections was tried and removed: it moved layout work into the first scroll (felt sticky) and risked small shifts */
/* v40 QC (1024px laptops / iPad landscape): the footer contact column was narrower than hello@leadsvector.com, and the six overlapping tool marks in the
   "Why" card ran 4px past their card. The contact column now never gets narrower than its content; the marks step down a size on narrow desktops */
@media(min-width:1001px){.fcols{grid-template-columns:1.1fr 1.9fr .9fr .9fr minmax(max-content,1.1fr)!important}}
@media(min-width:701px) and (max-width:1180px){.wb-ic i.wb-lg{width:42px!important;height:42px!important}.wb-ic i.wb-lg:not(:first-child){margin-left:-13px!important}}
/* v40 rhythm (measured audit, 33 pages): sections sat 233–270px apart on desktop (up to 417px before the closing CTA card) and 131–152px on phone (up to 257px),
   and the first section after an inner-page hero started 202px down on most pages but 56–76px on others. One calmer, consistent rhythm:
   section spacing 96px max desktop / 48px phone; the first section after any hero starts at the same, closer distance */
:root{--sec-y:clamp(64px,6.6vw,96px)}
#main .hero.sm+.sec:not(.bright):not(.brand),#main .hero.sm+.sec.light{padding-top:calc(var(--sec-y)*.55)}
@media(max-width:700px){
 #main .sec{padding-top:48px!important;padding-bottom:48px!important}
 #main .hero.sm+.sec:not(.bright):not(.brand){padding-top:28px!important}
 #main .sec.tr.cl-sec{padding:22px 0 34px!important}
}
/* v40 dock edge, fixed at the source: the soft glow was a hard-edged 6px band that stopped where the cut began (a visible box above the bar), and the line
   was brighter on the sides (75%) than round the cut (55%), so the joint showed. Now one crisp line at the same strength everywhere, and the glow is a real
   soft light that follows the line's shape, round the U included */
@media(max-width:700px){
 .dock:after{background:
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40'%3E%3Cpath d='M0 .5H16Q19 .5 19 3.5V19Q19 39.5 39.5 39.5H60.5Q81 39.5 81 19V3.5Q81 .5 84 .5H100' fill='none' stroke='%23c6ea93' stroke-opacity='.72' stroke-width='1'/%3E%3C/svg%3E") center 7px/100px 40px no-repeat,
   linear-gradient(90deg,#c6ea9300,#c6ea93b8) 20px 7px/calc(50% - 70px) 1px no-repeat,
   linear-gradient(90deg,#c6ea93b8,#c6ea9300) calc(100% - 20px) 7px/calc(50% - 70px) 1px no-repeat!important;
  filter:drop-shadow(0 0 2.2px #9ECD5Fb0) drop-shadow(0 0 6px #9ECD5F40)}
}
/* V45: the filled seat (mask:none) was removed at the owner's request: the cut round the V is see-through again, as approved (lime line unchanged) */
/* v40 desktop: "Start a project" gets the same running edge light as the phone V button (same beam colours and speed), as a thin rim round the purple pill.
   The rim's 2px is taken back in margin so the dock does not change size; it stops with Pause animations and reduced motion like the phone one */
@media(min-width:701px){
 .dock .go{border:2px solid transparent!important;margin:-2px 0;background:var(--grad) padding-box,conic-gradient(from var(--lvA),#ffffff 0deg,#c6ea93 40deg,#9ECD5F00 110deg,#9ECD5F00 250deg,#c6ea93 320deg,#ffffff 360deg) border-box!important;animation:lvRim 3.2s linear infinite}
 .dock .go:hover{background:linear-gradient(135deg,#8d6fff,#6a45ff) padding-box,conic-gradient(from var(--lvA),#ffffff 0deg,#c6ea93 40deg,#9ECD5F00 110deg,#9ECD5F00 250deg,#c6ea93 320deg,#ffffff 360deg) border-box!important}
}
/* v40 dock line, pixel-exact: on odd widths (e.g. a 375px iPhone gives a 359px bar) the centre fell on a half pixel, so the straight line and the curved
   piece met with a sub-pixel gap/tick. The bar is now always an even width (whole-pixel centre), and the straight lines butt exactly onto the curve piece */
@supports (width:round(down,10px,2px)){@media(max-width:700px){.dock{width:round(down,min(360px,calc(100vw - 16px)),2px)!important;left:round(down,50%,1px)!important}}}
@media(max-width:700px){
 .dock:after{background:
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 40'%3E%3Cpath d='M1 .5H16Q19 .5 19 3.5V19Q19 39.5 39.5 39.5H60.5Q81 39.5 81 19V3.5Q81 .5 84 .5H99' fill='none' stroke='%23c6ea93' stroke-opacity='.72' stroke-width='1' stroke-linecap='butt'/%3E%3C/svg%3E") center 7px/100px 40px no-repeat,
   linear-gradient(90deg,#c6ea9300,#c6ea93b8) 20px 7px/calc(50% - 69px) 1px no-repeat,
   linear-gradient(90deg,#c6ea93b8,#c6ea9300) calc(100% - 20px) 7px/calc(50% - 69px) 1px no-repeat!important}
}
/* v40: if the hero safety net ever steps in, it reveals the whole headline (logo row and "customers." too), never half of it */
.nohero .hero h1 .hic,.nohero .hero h1 .hic i.lg,.nohero .hero .hic-more,.nohero .hero h1 em,.nohero .hero .htiles{animation:none!important;opacity:1!important;transform:none!important;scale:none!important;clip-path:none!important}

/* V44 pricing footer (L02): the price sat in a minmax(0,1fr) column that could shrink below its own width while the button never shrank, so on
   768/1024 cards (and two 1280/1440 cards) the price ran into the button (measured: up to -66px). One consistent footer on every card and width:
   the price on its own line, a full-width button beneath, bottom-aligned (the layout phones already used). Side-by-side would mix layouts within a row */
.oc .ob{display:flex!important;flex-direction:column;align-items:stretch;gap:12px}
.oc .ob strong{align-self:flex-start}
.oc .ob .btn.s{width:100%;max-width:100%;justify-content:center;text-align:center;white-space:normal}
/* V44 (L03): on the light Growth Partner plan cards (solution page) the Core and Scale actions used dark-surface styling (white on white) and were invisible.
   Plain .tier cards are white, so their outline action gets dark text (#16112c, the light-panel text colour; --ink is #fff on this dark-first site) and a visible border; the dark Pricing variant (.pc-wide) keeps its original look */
.tier .btn:not(.p){color:#16112c;background:#fff;border:1px solid #16112c33}
.tier .btn:not(.p):hover{background:#f4f0ff;border-color:#7F52EE;color:#432E72}
.tier .btn:not(.p):focus-visible{outline:2px solid #7F52EE;outline-offset:3px}
.pc-wide .tier .btn:not(.p){color:#fff;background:#ffffff08;border:1px solid #ffffff26}
.pc-wide .tier .btn:not(.p):hover{background:#ffffff14;border-color:#ffffff40;color:#fff}
/* V44 (V02): solution hero price cards show "From" as the same small raised label the Solutions cards use, so the price itself leads */
.price-card .big .pfrom{font-size:.3em;font-weight:600;letter-spacing:0;margin-right:.35em;vertical-align:.9em;opacity:.75;-webkit-text-fill-color:currentColor}
/* V45 dock fit (owner screenshots): (1) the bar was sized from 100vw, which includes a classic scrollbar, so in a narrow desktop window it ran edge to
   edge; it now uses the visible width (100%, which excludes the scrollbar) and always keeps its 8px gutter. (2) at 320-360 "Services" ran onto the cut's
   lime edge (-1px at 320). The centre slot is 70px (cut edge +-31px, so a 4px buffer), and narrow phones get slightly smaller labels and side padding.
   All four label columns are forced equal (minmax(0,1fr)) and labels centre over them: a 1fr column wider than its word pushed the V 2px off its cut */
@media(max-width:700px){
 .dock{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 70px minmax(0,1fr) minmax(0,1fr)!important;width:min(360px,calc(100% - 16px))!important}
 .dock>a:not(.go),.dock>button{justify-self:center!important;white-space:nowrap}
 @supports (width:round(down,10px,2px)){.dock{width:round(down,min(360px,calc(100% - 16px)),2px)!important}}
}
@media(max-width:360px){.dock{padding-left:6px!important;padding-right:6px!important}.dock>a:not(.go),.dock>button{font-size:12px!important;padding-left:2px!important;padding-right:2px!important;letter-spacing:-.005em}}
/* V46 buying journey (client-POV review, phone first) ------------------------------------------------------------------------------------------ */
/* real-client proof above the headline (the existing .rate slot): a quiet link, calm entrance, no review count */
.rate.rate-real{width:fit-content;margin:0 auto 16px;padding:5px 12px 5px 6px;border-radius:999px;background:#ffffff08;border:1px solid #ffffff17;text-decoration:none;color:#d9d5f0;gap:8px;font-size:13.5px}
.rate.rate-real:hover{background:#ffffff12;border-color:#ffffff33}.rate.rate-real:focus-visible{outline:2px solid #9ECD5F;outline-offset:3px}
.rate-real .rf{display:inline-flex}.rate-real .rf img{width:26px;height:26px;border-radius:50%;object-fit:cover;border:2px solid #0b0a12;margin-left:-8px}.rate-real .rf img:first-child{margin-left:0}
.rate-real .stars{font-size:12px;letter-spacing:1.5px}
.hero.hA .rate.rate-real{animation:lvsettle .8s cubic-bezier(.25,.8,.3,1) .05s both!important}
body.still .hero.hA .rate.rate-real{animation:none!important}
@media(prefers-reduced-motion:reduce){.hero.hA .rate.rate-real{animation:none!important}}
@media(max-width:700px){.rate.rate-real{margin-bottom:12px;font-size:13px}.rate-real .rf img{width:22px;height:22px}}
/* review anchor and the phone short list */
#reviews,#cal{scroll-margin-top:18px}
.rv-cols.rv-short>.rv-col:nth-child(n+2){display:none}
.rv-all{display:flex;margin:22px auto 0;width:100%;max-width:360px;justify-content:center}
.sec.bright .rv-all{color:#16112c;background:#fff;border:1px solid #16112c33}
.sec.bright .rv-all:hover{background:#f4f0ff;border-color:#7F52EE}
/* Start: selected-service strip */
.selsum{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 16px;margin-bottom:10px;border-radius:16px;background:#ffffff0a;border:1px solid #9d7cff55}
.selsum small{display:block;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#b9b0d6;margin-bottom:3px}
.selsum b{display:block;color:#fff;font-size:16px}.selsum span{display:block;color:#c6ea93;font-size:14px;margin-top:2px}
.selsum .lk{flex:none;background:none;border:1px solid #ffffff2e;border-radius:999px;padding:8px 14px;color:#fff;font:inherit;font-size:14px;cursor:pointer}
.selsum .lk:hover{border-color:#ffffff5c}.selsum .lk:focus-visible{outline:2px solid #9ECD5F;outline-offset:2px}
.selnote{margin:0 0 18px;font-size:14px;color:#b9b0d6}
/* Pricing: website-only route beside the launch package */
.pb-alt{margin:14px 0 0;font-size:14.5px;color:#b9b0d6}.pb-alt .lk{margin-left:4px}
/* V46: the proof badge sits in the hero's top spacing, so the hero gives back part of the height it adds (logo-to-badge 34px -> 20px on desktop) */
@media(min-width:701px){.hero.hA:has(.rate-real){padding-top:86px!important}.rate.rate-real{margin-bottom:12px}}
/* V46 (owner report: a white dot at the right end of buttons): the button fill was painted under its semi-transparent border too, and at the end of
   the pill, where the curve turns vertical, Chrome's two smoothed edges overlapped into a light dot. The fill now stays inside the border. The dock's
   edge-light button uses its own layered background and is not affected */
.btn{background-clip:padding-box!important}

/* V49: cleaner first screen, calmer colour, premium footer details */
/* hero: the buttons get room before the six tiles */
.hero.hA .htiles{margin-top:64px!important}
@media(min-width:1001px) and (max-height:900px){.hero.hA .htiles{margin-top:48px!important}}
@media(max-width:700px){.hero.hA .htiles{margin-top:44px!important}}
/* hero glow: same four lights, the green one softer so purple leads */
.hero:after{background:radial-gradient(26% 34% at 18% 18%,#0f9b7855,transparent 70%),radial-gradient(28% 34% at 82% 70%,#6a3df0c8,transparent 70%),radial-gradient(18% 22% at 72% 22%,#7F52EE55,transparent 70%),radial-gradient(16% 20% at 26% 80%,#9ECD5F1a,transparent 70%)!important}
/* footer: quiet headings, legal line, back to top, copy email, faded wordmark */
.ft h4{color:#b9a9f2!important}
.ft{position:relative;overflow:hidden}
.ft-end{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;margin:40px 0 0}
.ft-legal{display:flex;flex-wrap:wrap;gap:6px 22px}
.ft .ft-legal a{display:inline;margin:0;font-size:14px;color:var(--muted)}.ft .ft-legal a:hover{color:#fff}
.ft-top{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;border:1px solid #ffffff1f;background:#ffffff08;color:#e8e4f6;font:600 13px/1 var(--body,Inter),sans-serif;cursor:pointer;transition:background .25s ease,border-color .25s ease}
.ft-top:hover{background:#7F52EE26;border-color:#7F52EE88}.ft-top span{transition:transform .25s ease}.ft-top:hover span{transform:translateY(-2px)}
.ft-mail{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.ft .ft-mail a{margin:0}
.cpy{padding:4px 10px;border-radius:999px;border:1px solid #ffffff1f;background:transparent;color:var(--muted);font:600 11.5px/1.4 var(--body,Inter),sans-serif;cursor:pointer;transition:color .2s ease,border-color .2s ease,background .2s ease}
.cpy:hover{color:#fff;border-color:#7F52EE99}.cpy.cpy-done{color:#10210a;background:#9ECD5F;border-color:#9ECD5F}
/* Copy and Copied take the same width, so the footer never moves */
.cpy{min-width:66px;text-align:center;text-transform:none!important;letter-spacing:0!important;flex:none}
/* footer logo sits level with the column headings */
.ft .fcols>div:first-child .logo{height:22px!important;margin:4px 0 20px!important;background-position:left top!important}
.ft-mark{height:clamp(70px,13.2vw,190px);margin:8px auto 0;max-width:1320px;background:url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0nMS4wJyBlbmNvZGluZz0ndXRmLTgnPz4NCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSItMTIgLTExNC4wMDAwIDg2Ni41NjY2IDEyNy4yMzI1IiByb2xlPSJpbWciIGFyaWEtbGFiZWw9IkxlYWRzVmVjdG9yIj48dGl0bGU+TGVhZHNWZWN0b3IgLyBzaW5nbGUgY29sb3VyIHdoaXRlPC90aXRsZT48bWV0YWRhdGE+eyJmb250IjogIlBvcHBpbnMiLCAid2VpZ2h0IjogNjAwLCAic2luZ2xlQ29sb3VyIjogIiNGRkZGRkYiLCAiZXhhY3RPcmlnaW5hbFZQYXRocyI6IHRydWUsICJvdXRsaW5lZCI6IHRydWV9PC9tZXRhZGF0YT48ZGVmcz48bGluZWFyR3JhZGllbnQgaWQ9Imx2LWFycm93IiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjY0MCIgeTE9IjU2MCIgeDI9Ijc2MCIgeTI9IjI4OCI+PHN0b3Agb2Zmc2V0PSIwIiBzdG9wLWNvbG9yPSIjNjIzMEM3IiAvPjxzdG9wIG9mZnNldD0iLjU1IiBzdG9wLWNvbG9yPSIjODU1MEU0IiAvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI0E0NzdFRCIgLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48ZyBmaWxsPSIjRkZGRkZGIj48ZyBpZD0ibHYtbGVhZHMiPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKC05LjQ0OTQgMCkiPjxwYXRoIGRhdGEtbGV0dGVyPSJMIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjAwMDAgMCkgc2NhbGUoMC4xMzY5NDcyIC0wLjEzNjk0NzIpIiBkPSJNMjA5IDExMUg0MzlWMEg2OVY2OThIMjA5WiIgLz48cGF0aCBkYXRhLWxldHRlcj0iZSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNjIuMDU4OCAwKSBzY2FsZSgwLjEzNjk0NzIgLTAuMTM2OTQ3MikiIGQ9Ik01ODAgMjM1SDE3NVExODAgMTc1IDIxNy4wIDE0MS4wUTI1NCAxMDcgMzA4IDEwN1EzODYgMTA3IDQxOSAxNzRINTcwUTU0NiA5NCA0NzguMCA0Mi41UTQxMCAtOSAzMTEgLTlRMjMxIC05IDE2Ny41IDI2LjVRMTA0IDYyIDY4LjUgMTI3LjBRMzMgMTkyIDMzIDI3N1EzMyAzNjMgNjguMCA0MjguMFExMDMgNDkzIDE2Ni4wIDUyOC4wUTIyOSA1NjMgMzExIDU2M1EzOTAgNTYzIDQ1Mi41IDUyOS4wUTUxNSA0OTUgNTQ5LjUgNDMyLjVRNTg0IDM3MCA1ODQgMjg5UTU4NCAyNTkgNTgwIDIzNVpNNDM5IDMyOVE0MzggMzgzIDQwMC4wIDQxNS41UTM2MiA0NDggMzA3IDQ0OFEyNTUgNDQ4IDIxOS41IDQxNi41UTE4NCAzODUgMTc2IDMyOVoiIC8+PHBhdGggZGF0YS1sZXR0ZXI9ImEiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE0NS43NTUyIDApIHNjYWxlKDAuMTM2OTQ3MiAtMC4xMzY5NDcyKSIgZD0iTTI4NiA1NjNRMzQ4IDU2MyAzOTQuNSA1MzguMFE0NDEgNTEzIDQ2OSA0NzVWNTU0SDYxMFYwSDQ2OVY4MVE0NDIgNDIgMzk0LjUgMTYuNVEzNDcgLTkgMjg1IC05UTIxNSAtOSAxNTcuNSAyNy4wUTEwMCA2MyA2Ni41IDEyOC41UTMzIDE5NCAzMyAyNzlRMzMgMzYzIDY2LjUgNDI4LjBRMTAwIDQ5MyAxNTcuNSA1MjguMFEyMTUgNTYzIDI4NiA1NjNaTTMyMiA0NDBRMjgzIDQ0MCAyNTAuMCA0MjEuMFEyMTcgNDAyIDE5Ni41IDM2NS41UTE3NiAzMjkgMTc2IDI3OVExNzYgMjI5IDE5Ni41IDE5MS41UTIxNyAxNTQgMjUwLjUgMTM0LjBRMjg0IDExNCAzMjIgMTE0UTM2MSAxMTQgMzk1LjAgMTMzLjVRNDI5IDE1MyA0NDkuMCAxODkuNVE0NjkgMjI2IDQ2OSAyNzdRNDY5IDMyOCA0NDkuMCAzNjQuNVE0MjkgNDAxIDM5NS4wIDQyMC41UTM2MSA0NDAgMzIyIDQ0MFoiIC8+PHBhdGggZGF0YS1sZXR0ZXI9ImQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIzNy44MDU0IDApIHNjYWxlKDAuMTM2OTQ3MiAtMC4xMzY5NDcyKSIgZD0iTTI4NyA1NjNRMzQxIDU2MyAzOTAuMCA1MzkuNVE0MzkgNTE2IDQ2OCA0NzdWNzQwSDYxMFYwSDQ2OFY4MlE0NDIgNDEgMzk1LjAgMTYuMFEzNDggLTkgMjg2IC05UTIxNiAtOSAxNTguMCAyNy4wUTEwMCA2MyA2Ni41IDEyOC41UTMzIDE5NCAzMyAyNzlRMzMgMzYzIDY2LjUgNDI4LjBRMTAwIDQ5MyAxNTguMCA1MjguMFEyMTYgNTYzIDI4NyA1NjNaTTMyMiA0NDBRMjgzIDQ0MCAyNTAuMCA0MjEuMFEyMTcgNDAyIDE5Ni41IDM2NS41UTE3NiAzMjkgMTc2IDI3OVExNzYgMjI5IDE5Ni41IDE5MS41UTIxNyAxNTQgMjUwLjUgMTM0LjBRMjg0IDExNCAzMjIgMTE0UTM2MSAxMTQgMzk1LjAgMTMzLjVRNDI5IDE1MyA0NDkuMCAxODkuNVE0NjkgMjI2IDQ2OSAyNzdRNDY5IDMyOCA0NDkuMCAzNjQuNVE0MjkgNDAxIDM5NS4wIDQyMC41UTM2MSA0NDAgMzIyIDQ0MFoiIC8+PHBhdGggZGF0YS1sZXR0ZXI9InMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMyOS44NTU2IDApIHNjYWxlKDAuMTM2OTQ3MiAtMC4xMzY5NDcyKSIgZD0iTTM5IDE3NUgxODBRMTg0IDE0MyAyMTEuNSAxMjIuMFEyMzkgMTAxIDI4MCAxMDFRMzIwIDEwMSAzNDIuNSAxMTcuMFEzNjUgMTMzIDM2NSAxNThRMzY1IDE4NSAzMzcuNSAxOTguNVEzMTAgMjEyIDI1MCAyMjhRMTg4IDI0MyAxNDguNSAyNTkuMFExMDkgMjc1IDgwLjUgMzA4LjBRNTIgMzQxIDUyIDM5N1E1MiA0NDMgNzguNSA0ODEuMFExMDUgNTE5IDE1NC41IDU0MS4wUTIwNCA1NjMgMjcxIDU2M1EzNzAgNTYzIDQyOS4wIDUxMy41UTQ4OCA0NjQgNDk0IDM4MEgzNjBRMzU3IDQxMyAzMzIuNSA0MzIuNVEzMDggNDUyIDI2NyA0NTJRMjI5IDQ1MiAyMDguNSA0MzguMFExODggNDI0IDE4OCAzOTlRMTg4IDM3MSAyMTYuMCAzNTYuNVEyNDQgMzQyIDMwMyAzMjdRMzYzIDMxMiA0MDIuMCAyOTYuMFE0NDEgMjgwIDQ2OS41IDI0Ni41UTQ5OCAyMTMgNDk5IDE1OFE0OTkgMTEwIDQ3Mi41IDcyLjBRNDQ2IDM0IDM5Ni41IDEyLjVRMzQ3IC05IDI4MSAtOVEyMTMgLTkgMTU5LjAgMTUuNVExMDUgNDAgNzMuNSA4Mi4wUTQyIDEyNCAzOSAxNzVaIiAvPjwvZz48L2c+PGcgaWQ9Imx2LWVjdG9yIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0OTAuOTM2NCAwKSI+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTQuNTE5MyAwKSI+PHBhdGggZGF0YS1sZXR0ZXI9ImUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAuMDAwMCAwKSBzY2FsZSgwLjEzNjk0NzIgLTAuMTM2OTQ3MikiIGQ9Ik01ODAgMjM1SDE3NVExODAgMTc1IDIxNy4wIDE0MS4wUTI1NCAxMDcgMzA4IDEwN1EzODYgMTA3IDQxOSAxNzRINTcwUTU0NiA5NCA0NzguMCA0Mi41UTQxMCAtOSAzMTEgLTlRMjMxIC05IDE2Ny41IDI2LjVRMTA0IDYyIDY4LjUgMTI3LjBRMzMgMTkyIDMzIDI3N1EzMyAzNjMgNjguMCA0MjguMFExMDMgNDkzIDE2Ni4wIDUyOC4wUTIyOSA1NjMgMzExIDU2M1EzOTAgNTYzIDQ1Mi41IDUyOS4wUTUxNSA0OTUgNTQ5LjUgNDMyLjVRNTg0IDM3MCA1ODQgMjg5UTU4NCAyNTkgNTgwIDIzNVpNNDM5IDMyOVE0MzggMzgzIDQwMC4wIDQxNS41UTM2MiA0NDggMzA3IDQ0OFEyNTUgNDQ4IDIxOS41IDQxNi41UTE4NCAzODUgMTc2IDMyOVoiIC8+PHBhdGggZGF0YS1sZXR0ZXI9ImMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDgzLjY5NjQgMCkgc2NhbGUoMC4xMzY5NDcyIC0wLjEzNjk0NzIpIiBkPSJNMzA3IDU2M1E0MTAgNTYzIDQ3Ny41IDUxMS41UTU0NSA0NjAgNTY4IDM2N0g0MTdRNDA1IDQwMyAzNzYuNSA0MjMuNVEzNDggNDQ0IDMwNiA0NDRRMjQ2IDQ0NCAyMTEuMCA0MDAuNVExNzYgMzU3IDE3NiAyNzdRMTc2IDE5OCAyMTEuMCAxNTQuNVEyNDYgMTExIDMwNiAxMTFRMzkxIDExMSA0MTcgMTg3SDU2OFE1NDUgOTcgNDc3LjAgNDQuMFE0MDkgLTkgMzA3IC05UTIyNyAtOSAxNjUuMCAyNi41UTEwMyA2MiA2OC4wIDEyNi41UTMzIDE5MSAzMyAyNzdRMzMgMzYzIDY4LjAgNDI3LjVRMTAzIDQ5MiAxNjUuMCA1MjcuNVEyMjcgNTYzIDMwNyA1NjNaIiAvPjxwYXRoIGRhdGEtbGV0dGVyPSJ0IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxNjUuMzM4NyAwKSBzY2FsZSgwLjEzNjk0NzIgLTAuMTM2OTQ3MikiIGQ9Ik0yMzIgNDM5VjE3MVEyMzIgMTQzIDI0NS41IDEzMC41UTI1OSAxMTggMjkxIDExOEgzNTZWMEgyNjhROTEgMCA5MSAxNzJWNDM5SDI1VjU1NEg5MVY2OTFIMjMyVjU1NEgzNTZWNDM5WiIgLz48cGF0aCBkYXRhLWxldHRlcj0ibyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjE3LjY3NDIgMCkgc2NhbGUoMC4xMzY5NDcyIC0wLjEzNjk0NzIpIiBkPSJNMzQgMjc3UTM0IDM2MiA3MS41IDQyNy4wUTEwOSA0OTIgMTc0LjAgNTI3LjVRMjM5IDU2MyAzMTkgNTYzUTM5OSA1NjMgNDY0LjAgNTI3LjVRNTI5IDQ5MiA1NjYuNSA0MjcuMFE2MDQgMzYyIDYwNCAyNzdRNjA0IDE5MiA1NjUuNSAxMjcuMFE1MjcgNjIgNDYxLjUgMjYuNVEzOTYgLTkgMzE1IC05UTIzNSAtOSAxNzEuMCAyNi41UTEwNyA2MiA3MC41IDEyNy4wUTM0IDE5MiAzNCAyNzdaTTQ2MCAyNzdRNDYwIDM1NiA0MTguNSAzOTguNVEzNzcgNDQxIDMxNyA0NDFRMjU3IDQ0MSAyMTYuNSAzOTguNVExNzYgMzU2IDE3NiAyNzdRMTc2IDE5OCAyMTUuNSAxNTUuNVEyNTUgMTEzIDMxNSAxMTNRMzUzIDExMyAzODYuNSAxMzEuNVE0MjAgMTUwIDQ0MC4wIDE4Ny4wUTQ2MCAyMjQgNDYwIDI3N1oiIC8+PHBhdGggZGF0YS1sZXR0ZXI9InIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMwNC4yNDY1IDApIHNjYWxlKDAuMTM2OTQ3MiAtMC4xMzY5NDcyKSIgZD0iTTM3OSA1NjJWNDE1SDM0MlEyNzYgNDE1IDI0Mi41IDM4NC4wUTIwOSAzNTMgMjA5IDI3NlYwSDY5VjU1NEgyMDlWNDY4UTIzNiA1MTIgMjc5LjUgNTM3LjBRMzIzIDU2MiAzNzkgNTYyWiIgLz48L2c+PC9nPjxnIGlkPSJsdi1vcmlnaW5hbC12IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzODMuNzQyOSAtMTAyLjAwMDApIHNjYWxlKDAuMTg2MTMxMzkpIHRyYW5zbGF0ZSgtMTgzIC0yODgpIj48cGF0aCBpZD0ibHYtdi1zdHJva2UiIGQ9Ik0xODMgMjg4SDM1N1EzNzEgMjg4IDM3OCAzMDBMNTkxIDY1NlE1OTkgNjY5IDU5MSA2ODJMNTAwIDgzNloiIGZpbGw9IiNGRkZGRkYiIC8+PHBhdGggaWQ9Imx2LWFycm93LXNoYXBlIiBkPSJNNTA2IDI4OEg4MThMNjU2IDU2OEw2MTggNTAyUTYxMyA0OTIgNjE4IDQ4Mkw2ODQgMzY2SDU0OFE1MzggMzY2IDUzMiAzNTdaIiBmaWxsPSIjRkZGRkZGIiAvPjwvZz48L2c+PC9zdmc+") center top/100% auto no-repeat;opacity:.07;-webkit-mask:linear-gradient(#000 35%,transparent);mask:linear-gradient(#000 35%,transparent);pointer-events:none}
@media(max-width:700px){.ft-end{margin-top:30px}.ft-mark{height:clamp(46px,14vw,90px);margin-bottom:0}}
/* V49: the calendar box fits the Cal.com calendar once it is ready (phone had ~260px of empty space around it);
   the reserved loading height is close to the real one, so the change stays small */
@media(max-width:700px){.calx{min-height:380px!important}}
.calx.ready,.calx.ready cal-inline{min-height:0!important;height:auto!important}

/* V49: footer social icons */
.ft .soc{margin-top:16px;gap:10px}.ft .soc a{width:36px;height:36px;margin:0!important;color:var(--muted);border-color:#ffffff1f;background:#ffffff06;transition:color .2s ease,border-color .2s ease,background .2s ease}.ft .soc a:hover{color:#fff;border-color:#7F52EE99;background:#7F52EE26}

/* V51: Services panel gets a way to the whole services page */
.pall{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 18px;padding:14px 18px;border-radius:16px;border:1px solid #7F52EE55;background:linear-gradient(135deg,#7F52EE26,#ffffff06);color:#fff;text-decoration:none;transition:background .25s ease,border-color .25s ease}
.pall b{display:block;font:600 16px/1.3 var(--head)}.pall small{display:block;margin-top:2px;color:var(--muted);font-size:13px}
.pall i{font-style:normal;font-size:18px;transition:transform .25s ease}.pall:hover{border-color:#7F52EEaa;background:linear-gradient(135deg,#7F52EE3d,#ffffff0a)}.pall:hover i{transform:translateX(3px)}

/* V52: footer bottom — one row (legal links left; Pause + Back to top right), company line under it */
.ft .ft-end{display:none}
.ft-bot{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:44px;padding-top:22px;border-top:1px solid #ffffff14}
.ft-bot small{display:contents!important}
.ft-bot .ft-legal{order:1}
.ft-bot .stillbtn{order:2;margin-left:auto!important}
.ft-bot .ft-top{order:3}
.ft-bot .ft-co{order:4;flex:1 0 100%;max-width:none;margin-top:2px}
@media(max-width:560px){.ft-bot{gap:12px}.ft-bot .stillbtn{margin-left:0!important}.ft-bot .ft-legal{flex:1 0 100%}}
/* big wordmark: exactly the content width, brand gradient arrow, readable but quiet */
.ft-mark{max-width:none!important;width:100%;height:auto!important;aspect-ratio:866.57/127.23;margin:36px 0 0!important;background:url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0nMS4wJyBlbmNvZGluZz0ndXRmLTgnPz4NCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSItMTIgLTExNC4wMDAwIDg2Ni41NjY2IDEyNy4yMzI1IiByb2xlPSJpbWciIGFyaWEtbGFiZWw9IkxlYWRzVmVjdG9yIj48dGl0bGU+TGVhZHNWZWN0b3IgLyBWaW9sZXQgZ3JhZGllbnQgLyBTZW1pQm9sZDwvdGl0bGU+PG1ldGFkYXRhPnsiaWQiOiAiRzIiLCAibmFtZSI6ICJWaW9sZXQgZ3JhZGllbnQgLyBTZW1pQm9sZCIsICJmb250IjogIlBvcHBpbnMiLCAid2VpZ2h0IjogNjAwLCAidHJhY2tpbmciOiAtMC44LCAiY2FwIjogOTYsICJtYXJrSCI6IDEwMiwgImxlZnRHYXAiOiAtNSwgInJpZ2h0R2FwIjogLTExLCAiYXJyb3ciOiAiZ3JhZGllbnQiLCAiaW50ZWdyYXRlZCI6IHRydWUsICJ0aGVtZSI6ICJkYXJrIiwgIm9yaWdpbmFsVlBhdGhzUHJlc2VydmVkIjogdHJ1ZSwgIm9yaWdpbmFsU3Ryb2tlT21pdHRlZCI6IHRydWUsICJvdXRsaW5lZCI6IHRydWUsICJwYWNrYWdlZFNlbGVjdGlvbiI6ICJCcmFuZCBLaXQgdjEgLyBHMiJ9PC9tZXRhZGF0YT48ZGVmcz48bGluZWFyR3JhZGllbnQgaWQ9Imx2LWFycm93IiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjY0MCIgeTE9IjU2MCIgeDI9Ijc2MCIgeTI9IjI4OCI+PHN0b3Agb2Zmc2V0PSIwIiBzdG9wLWNvbG9yPSIjNzIzOUVDIiAvPjxzdG9wIG9mZnNldD0iLjU1IiBzdG9wLWNvbG9yPSIjQTQ3N0ZGIiAvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI0Q1QkVGRiIgLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48ZyBmaWxsPSIjRkZGRkZGIj48ZyBpZD0ibHYtbGVhZHMiPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKC05LjQ0OTQgMCkiPjxwYXRoIGRhdGEtbGV0dGVyPSJMIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLjAwMDAgMCkgc2NhbGUoMC4xMzY5NDcyIC0wLjEzNjk0NzIpIiBkPSJNMjA5IDExMUg0MzlWMEg2OVY2OThIMjA5WiIgLz48cGF0aCBkYXRhLWxldHRlcj0iZSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNjIuMDU4OCAwKSBzY2FsZSgwLjEzNjk0NzIgLTAuMTM2OTQ3MikiIGQ9Ik01ODAgMjM1SDE3NVExODAgMTc1IDIxNy4wIDE0MS4wUTI1NCAxMDcgMzA4IDEwN1EzODYgMTA3IDQxOSAxNzRINTcwUTU0NiA5NCA0NzguMCA0Mi41UTQxMCAtOSAzMTEgLTlRMjMxIC05IDE2Ny41IDI2LjVRMTA0IDYyIDY4LjUgMTI3LjBRMzMgMTkyIDMzIDI3N1EzMyAzNjMgNjguMCA0MjguMFExMDMgNDkzIDE2Ni4wIDUyOC4wUTIyOSA1NjMgMzExIDU2M1EzOTAgNTYzIDQ1Mi41IDUyOS4wUTUxNSA0OTUgNTQ5LjUgNDMyLjVRNTg0IDM3MCA1ODQgMjg5UTU4NCAyNTkgNTgwIDIzNVpNNDM5IDMyOVE0MzggMzgzIDQwMC4wIDQxNS41UTM2MiA0NDggMzA3IDQ0OFEyNTUgNDQ4IDIxOS41IDQxNi41UTE4NCAzODUgMTc2IDMyOVoiIC8+PHBhdGggZGF0YS1sZXR0ZXI9ImEiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE0NS43NTUyIDApIHNjYWxlKDAuMTM2OTQ3MiAtMC4xMzY5NDcyKSIgZD0iTTI4NiA1NjNRMzQ4IDU2MyAzOTQuNSA1MzguMFE0NDEgNTEzIDQ2OSA0NzVWNTU0SDYxMFYwSDQ2OVY4MVE0NDIgNDIgMzk0LjUgMTYuNVEzNDcgLTkgMjg1IC05UTIxNSAtOSAxNTcuNSAyNy4wUTEwMCA2MyA2Ni41IDEyOC41UTMzIDE5NCAzMyAyNzlRMzMgMzYzIDY2LjUgNDI4LjBRMTAwIDQ5MyAxNTcuNSA1MjguMFEyMTUgNTYzIDI4NiA1NjNaTTMyMiA0NDBRMjgzIDQ0MCAyNTAuMCA0MjEuMFEyMTcgNDAyIDE5Ni41IDM2NS41UTE3NiAzMjkgMTc2IDI3OVExNzYgMjI5IDE5Ni41IDE5MS41UTIxNyAxNTQgMjUwLjUgMTM0LjBRMjg0IDExNCAzMjIgMTE0UTM2MSAxMTQgMzk1LjAgMTMzLjVRNDI5IDE1MyA0NDkuMCAxODkuNVE0NjkgMjI2IDQ2OSAyNzdRNDY5IDMyOCA0NDkuMCAzNjQuNVE0MjkgNDAxIDM5NS4wIDQyMC41UTM2MSA0NDAgMzIyIDQ0MFoiIC8+PHBhdGggZGF0YS1sZXR0ZXI9ImQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDIzNy44MDU0IDApIHNjYWxlKDAuMTM2OTQ3MiAtMC4xMzY5NDcyKSIgZD0iTTI4NyA1NjNRMzQxIDU2MyAzOTAuMCA1MzkuNVE0MzkgNTE2IDQ2OCA0NzdWNzQwSDYxMFYwSDQ2OFY4MlE0NDIgNDEgMzk1LjAgMTYuMFEzNDggLTkgMjg2IC05UTIxNiAtOSAxNTguMCAyNy4wUTEwMCA2MyA2Ni41IDEyOC41UTMzIDE5NCAzMyAyNzlRMzMgMzYzIDY2LjUgNDI4LjBRMTAwIDQ5MyAxNTguMCA1MjguMFEyMTYgNTYzIDI4NyA1NjNaTTMyMiA0NDBRMjgzIDQ0MCAyNTAuMCA0MjEuMFEyMTcgNDAyIDE5Ni41IDM2NS41UTE3NiAzMjkgMTc2IDI3OVExNzYgMjI5IDE5Ni41IDE5MS41UTIxNyAxNTQgMjUwLjUgMTM0LjBRMjg0IDExNCAzMjIgMTE0UTM2MSAxMTQgMzk1LjAgMTMzLjVRNDI5IDE1MyA0NDkuMCAxODkuNVE0NjkgMjI2IDQ2OSAyNzdRNDY5IDMyOCA0NDkuMCAzNjQuNVE0MjkgNDAxIDM5NS4wIDQyMC41UTM2MSA0NDAgMzIyIDQ0MFoiIC8+PHBhdGggZGF0YS1sZXR0ZXI9InMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMyOS44NTU2IDApIHNjYWxlKDAuMTM2OTQ3MiAtMC4xMzY5NDcyKSIgZD0iTTM5IDE3NUgxODBRMTg0IDE0MyAyMTEuNSAxMjIuMFEyMzkgMTAxIDI4MCAxMDFRMzIwIDEwMSAzNDIuNSAxMTcuMFEzNjUgMTMzIDM2NSAxNThRMzY1IDE4NSAzMzcuNSAxOTguNVEzMTAgMjEyIDI1MCAyMjhRMTg4IDI0MyAxNDguNSAyNTkuMFExMDkgMjc1IDgwLjUgMzA4LjBRNTIgMzQxIDUyIDM5N1E1MiA0NDMgNzguNSA0ODEuMFExMDUgNTE5IDE1NC41IDU0MS4wUTIwNCA1NjMgMjcxIDU2M1EzNzAgNTYzIDQyOS4wIDUxMy41UTQ4OCA0NjQgNDk0IDM4MEgzNjBRMzU3IDQxMyAzMzIuNSA0MzIuNVEzMDggNDUyIDI2NyA0NTJRMjI5IDQ1MiAyMDguNSA0MzguMFExODggNDI0IDE4OCAzOTlRMTg4IDM3MSAyMTYuMCAzNTYuNVEyNDQgMzQyIDMwMyAzMjdRMzYzIDMxMiA0MDIuMCAyOTYuMFE0NDEgMjgwIDQ2OS41IDI0Ni41UTQ5OCAyMTMgNDk5IDE1OFE0OTkgMTEwIDQ3Mi41IDcyLjBRNDQ2IDM0IDM5Ni41IDEyLjVRMzQ3IC05IDI4MSAtOVEyMTMgLTkgMTU5LjAgMTUuNVExMDUgNDAgNzMuNSA4Mi4wUTQyIDEyNCAzOSAxNzVaIiAvPjwvZz48L2c+PGcgaWQ9Imx2LWVjdG9yIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0OTAuOTM2NCAwKSI+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTQuNTE5MyAwKSI+PHBhdGggZGF0YS1sZXR0ZXI9ImUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAuMDAwMCAwKSBzY2FsZSgwLjEzNjk0NzIgLTAuMTM2OTQ3MikiIGQ9Ik01ODAgMjM1SDE3NVExODAgMTc1IDIxNy4wIDE0MS4wUTI1NCAxMDcgMzA4IDEwN1EzODYgMTA3IDQxOSAxNzRINTcwUTU0NiA5NCA0NzguMCA0Mi41UTQxMCAtOSAzMTEgLTlRMjMxIC05IDE2Ny41IDI2LjVRMTA0IDYyIDY4LjUgMTI3LjBRMzMgMTkyIDMzIDI3N1EzMyAzNjMgNjguMCA0MjguMFExMDMgNDkzIDE2Ni4wIDUyOC4wUTIyOSA1NjMgMzExIDU2M1EzOTAgNTYzIDQ1Mi41IDUyOS4wUTUxNSA0OTUgNTQ5LjUgNDMyLjVRNTg0IDM3MCA1ODQgMjg5UTU4NCAyNTkgNTgwIDIzNVpNNDM5IDMyOVE0MzggMzgzIDQwMC4wIDQxNS41UTM2MiA0NDggMzA3IDQ0OFEyNTUgNDQ4IDIxOS41IDQxNi41UTE4NCAzODUgMTc2IDMyOVoiIC8+PHBhdGggZGF0YS1sZXR0ZXI9ImMiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDgzLjY5NjQgMCkgc2NhbGUoMC4xMzY5NDcyIC0wLjEzNjk0NzIpIiBkPSJNMzA3IDU2M1E0MTAgNTYzIDQ3Ny41IDUxMS41UTU0NSA0NjAgNTY4IDM2N0g0MTdRNDA1IDQwMyAzNzYuNSA0MjMuNVEzNDggNDQ0IDMwNiA0NDRRMjQ2IDQ0NCAyMTEuMCA0MDAuNVExNzYgMzU3IDE3NiAyNzdRMTc2IDE5OCAyMTEuMCAxNTQuNVEyNDYgMTExIDMwNiAxMTFRMzkxIDExMSA0MTcgMTg3SDU2OFE1NDUgOTcgNDc3LjAgNDQuMFE0MDkgLTkgMzA3IC05UTIyNyAtOSAxNjUuMCAyNi41UTEwMyA2MiA2OC4wIDEyNi41UTMzIDE5MSAzMyAyNzdRMzMgMzYzIDY4LjAgNDI3LjVRMTAzIDQ5MiAxNjUuMCA1MjcuNVEyMjcgNTYzIDMwNyA1NjNaIiAvPjxwYXRoIGRhdGEtbGV0dGVyPSJ0IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxNjUuMzM4NyAwKSBzY2FsZSgwLjEzNjk0NzIgLTAuMTM2OTQ3MikiIGQ9Ik0yMzIgNDM5VjE3MVEyMzIgMTQzIDI0NS41IDEzMC41UTI1OSAxMTggMjkxIDExOEgzNTZWMEgyNjhROTEgMCA5MSAxNzJWNDM5SDI1VjU1NEg5MVY2OTFIMjMyVjU1NEgzNTZWNDM5WiIgLz48cGF0aCBkYXRhLWxldHRlcj0ibyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjE3LjY3NDIgMCkgc2NhbGUoMC4xMzY5NDcyIC0wLjEzNjk0NzIpIiBkPSJNMzQgMjc3UTM0IDM2MiA3MS41IDQyNy4wUTEwOSA0OTIgMTc0LjAgNTI3LjVRMjM5IDU2MyAzMTkgNTYzUTM5OSA1NjMgNDY0LjAgNTI3LjVRNTI5IDQ5MiA1NjYuNSA0MjcuMFE2MDQgMzYyIDYwNCAyNzdRNjA0IDE5MiA1NjUuNSAxMjcuMFE1MjcgNjIgNDYxLjUgMjYuNVEzOTYgLTkgMzE1IC05UTIzNSAtOSAxNzEuMCAyNi41UTEwNyA2MiA3MC41IDEyNy4wUTM0IDE5MiAzNCAyNzdaTTQ2MCAyNzdRNDYwIDM1NiA0MTguNSAzOTguNVEzNzcgNDQxIDMxNyA0NDFRMjU3IDQ0MSAyMTYuNSAzOTguNVExNzYgMzU2IDE3NiAyNzdRMTc2IDE5OCAyMTUuNSAxNTUuNVEyNTUgMTEzIDMxNSAxMTNRMzUzIDExMyAzODYuNSAxMzEuNVE0MjAgMTUwIDQ0MC4wIDE4Ny4wUTQ2MCAyMjQgNDYwIDI3N1oiIC8+PHBhdGggZGF0YS1sZXR0ZXI9InIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMwNC4yNDY1IDApIHNjYWxlKDAuMTM2OTQ3MiAtMC4xMzY5NDcyKSIgZD0iTTM3OSA1NjJWNDE1SDM0MlEyNzYgNDE1IDI0Mi41IDM4NC4wUTIwOSAzNTMgMjA5IDI3NlYwSDY5VjU1NEgyMDlWNDY4UTIzNiA1MTIgMjc5LjUgNTM3LjBRMzIzIDU2MiAzNzkgNTYyWiIgLz48L2c+PC9nPjxnIGlkPSJsdi1vcmlnaW5hbC12IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgzODMuNzQyOSAtMTAyLjAwMDApIHNjYWxlKDAuMTg2MTMxMzkpIHRyYW5zbGF0ZSgtMTgzIC0yODgpIj48cGF0aCBpZD0ibHYtdi1zdHJva2UiIGQ9Ik0xODMgMjg4SDM1N1EzNzEgMjg4IDM3OCAzMDBMNTkxIDY1NlE1OTkgNjY5IDU5MSA2ODJMNTAwIDgzNloiIGZpbGw9IiNGRkZGRkYiIC8+PHBhdGggaWQ9Imx2LWFycm93LXNoYXBlIiBkPSJNNTA2IDI4OEg4MThMNjU2IDU2OEw2MTggNTAyUTYxMyA0OTIgNjE4IDQ4Mkw2ODQgMzY2SDU0OFE1MzggMzY2IDUzMiAzNTdaIiBmaWxsPSJ1cmwoI2x2LWFycm93KSIgLz48L2c+PC9nPjwvc3ZnPg==") left top/100% 100% no-repeat!important;opacity:.16!important;-webkit-mask:linear-gradient(#000 30%,#0000 100%)!important;mask:linear-gradient(#000 30%,#0000 100%)!important}
@media(max-width:700px){.ft-mark{margin-top:26px!important}}
/* QC: the pricing package card is sticky only when it sits beside its details; stacked (phone/tablet) it scrolls normally,
   so the "what's included" list no longer slides over the card */
@media(max-width:1080px){.pp .pc1{position:static!important}}

/* V53 trial (Design Monks spirit, our structure kept): a brand-purple field at the top of the Home hero that fades to black
   behind the tiles; the corner glows step back so the field reads as one light; dots stay as texture */
#main .hero.hA{background:radial-gradient(95% 72% at 50% -12%,#6a35e0 0%,#4b24b4 26%,#2a1268 50%,#12082c 66%,transparent 82%),#000!important}
#main .hero.hA:after{opacity:.32}
#main .hero.hA:before{opacity:.26}
@media(max-width:700px){#main .hero.hA{background:radial-gradient(150% 62% at 50% -8%,#6a35e0 0%,#4b24b4 28%,#2a1268 52%,#12082c 68%,transparent 86%),#000!important}}

/* V55 trial — (1) hero bottom belongs to the purple top: the tiles become purple-tinted glass lit from above, and a low purple light
   sits behind them, so the hero reads as one piece instead of "purple top + dark boxes on black" */
#main .hero.hA{background:radial-gradient(95% 72% at 50% -12%,#6a35e0 0%,#4b24b4 26%,#2a1268 50%,#12082c 66%,transparent 82%),radial-gradient(70% 34% at 50% 100%,#3a1c8c38,transparent 72%),#000!important}
.hero.hA .ht{background:linear-gradient(180deg,#1f1544 0%,#130d29 52%,#0c0a15 100%)!important;border-color:#ffffff17!important;box-shadow:inset 0 1px 0 #ffffff1c,0 24px 50px -30px #6a35e066!important}
.hero.hA .ht .ht-sc{background-color:#0d0a1a!important}
@media(max-width:700px){#main .hero.hA{background:radial-gradient(150% 62% at 50% -8%,#6a35e0 0%,#4b24b4 28%,#2a1268 52%,#12082c 68%,transparent 86%),radial-gradient(90% 26% at 50% 100%,#3a1c8c38,transparent 72%),#000!important}}
/* (2) the client logo strip gets its own breathing room (Musemind-style): more air above, rows a little apart */
.sec.tr.cl-sec{padding:58px 0 46px!important}
.sec.tr.cl-sec .tl{margin-bottom:22px!important}
.cl-mq+.cl-mq{margin-top:18px!important}
@media(max-width:700px){.sec.tr.cl-sec{padding:40px 0 36px!important}.sec.tr.cl-sec .tl{margin-bottom:16px!important}.cl-mq+.cl-mq{margin-top:14px!important}}
/* (3) phone: stacked plan cards get room for the "Most complete" badge (it sat 4px under the card above) */
@media(max-width:700px){.plans{row-gap:30px!important}}
/* (4) desktop only: a soft blur + fade at the bottom of the screen behind the dock, so content passing under it never competes
   with the dock or the page (Design Monks does the same). Phone keeps its solid dock bar and no blur, so scrolling stays light */



/* V57: progressive blur behind the dock (desktop/tablet). One blur layer with a short fade made text "jump" from sharp to blurred as it
   scrolled under it; three stacked layers (2px, 5px, 10px), each fading out lower down, make the blur grow gradually, so nothing pops */
.bblur{display:none}
@media(min-width:701px){
 .bblur{display:block;position:fixed;inset:auto 0 0;height:clamp(110px,14vh,135px);z-index:50;pointer-events:none}
 .bblur i{position:absolute;inset:0}
 .bblur i:nth-child(1){-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);-webkit-mask-image:linear-gradient(to top,#000 0%,#000 55%,#0000 100%);mask-image:linear-gradient(to top,#000 0%,#000 55%,#0000 100%)}
 .bblur i:nth-child(2){-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);-webkit-mask-image:linear-gradient(to top,#000 0%,#000 40%,#0000 78%);mask-image:linear-gradient(to top,#000 0%,#000 40%,#0000 78%)}
 .bblur i:nth-child(3){-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);-webkit-mask-image:linear-gradient(to top,#000 0%,#000 25%,#0000 58%);mask-image:linear-gradient(to top,#000 0%,#000 25%,#0000 58%)}
}

/* V58: /start/ review card, quiet and compact so the form stays the focus */
.srv{margin:0 0 16px}
.srv-top{display:flex;align-items:center;gap:12px}
.srv-ph{width:44px;height:44px;border-radius:50%;object-fit:cover;flex:none}
.srv-who{min-width:0}.srv-who b{display:block;font:600 15px/1.3 var(--head);color:#fff}.srv-who small{display:block;color:var(--muted);font-size:13px}
.srv-st{margin-left:auto;color:#f5c451;font-size:13px;letter-spacing:1px;white-space:nowrap}
.srv blockquote{margin:14px 0 12px;color:#e6e3f0;font-size:15px;line-height:1.6}
.srv-all{font-size:13.5px;font-weight:600;color:#cdbaff;text-decoration:none}.srv-all:hover{color:#fff}
/* V58: the separating rings on the overlapping hero circles (tool logos, rating faces) were near-black; invisible on the old black hero,
   they read as hard black outlines on the purple field. Same rings, now a deep brand purple that sits in the field */
.hero.hA .hic i.lg,.hero.hA .hic-more{box-shadow:0 0 0 .18em #2a1470,0 .25em .6em -.2em #0006!important}
.hero.hA .rate-real .rf img{border-color:#2f1a6e!important}
/* V58 fix: the phone-only short review list ("See all reviews") is decided once at load; if the window was narrow then (or zoomed in)
   and is widened later, the desktop wall kept only its first column. The collapse and its button now only apply at phone width */
@media(min-width:701px){.rv-cols.rv-short>.rv-col:nth-child(n+2){display:flex!important}.rv-all{display:none!important}}
/* V58: footer company line smaller and quieter (owner: balance); on desktop it now fits one line */
.ft-bot .ft-co{font-size:11px!important;line-height:1.55!important;color:#8a85a3!important}
/* V59: the four client faces above the headline are photos that arrive a moment after the page; until then the browser drew an empty
   ring. The circle is now filled with the same deep purple as its ring, so it reads as one solid dot until the photo appears */
.rate-real .rf img{background:#2f1a6e}
/* V60 fix: on Pricing, the "Need only a website?" line (V46) was a grid child of the launch package, so it took the right-hand cell and pushed the
   package details under the sticky price card, where they slid together while scrolling. Card left, details right, the line full width below */
@media(min-width:1081px){.pp>.pc1{grid-column:1;grid-row:1}.pp>.pc2{grid-column:2;grid-row:1}.pp>.pb-alt{grid-column:1/-1;grid-row:2;margin-top:18px}}
/* V61: the sticky card can travel to the end of its package, so a full-width line below it slid under the card's corner (its border showed
   as a thin line at the corner). The "Need only a website?" box now sits in the right column under the details, out of the card's path */
@media(min-width:1081px){.pp>.pc1{grid-row:1/3}.pp>.pb-alt{grid-column:2;grid-row:2}}
/* V62: the stuck price card stops where its button stays above the dock on every screen: 96px down on tall screens, higher on laptops,
   and on very short screens only the card top slides off (the button stays visible). --ch is the card's measured height (pcFit in pages.js), 110px = dock area plus a gap */
@media(min-width:1081px){.pp .pc1{top:min(96px,calc(100vh - var(--ch,600px) - 110px))!important}}

/* V63: cookie choice in the brand look: a dark pill centred above the dock, one short line and a purple Accept (GA4 loads only after Accept).
   The close cross sits on the pill's top-left corner and shows on hover, as on Musemind; always shown on touch screens and on keyboard focus. Closing declines. */
.lvcc{position:fixed;left:50%;bottom:100px;z-index:70;transform:translateX(-50%);max-width:calc(100% - 32px);display:flex;align-items:center;gap:16px;padding:7px 7px 7px 22px;border-radius:999px;background:#14111fe6;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid #9d7cff40;box-shadow:0 18px 44px -18px #000,0 0 0 1px #00000040;color:#d9d5ea;font-size:14px;line-height:1.3;animation:lvccIn .45s cubic-bezier(.25,.8,.3,1) both}
.lvcc p{margin:0;white-space:nowrap}.lvcc a{color:#cdbaff;font-weight:600;text-decoration:none}.lvcc a:hover{color:#fff;text-decoration:underline}
.lvcc-b{display:flex;align-items:center;flex:none}
.lvcc .cc-yes{border:0;padding:11px 21px;font:600 13.5px/1 var(--body,Inter),sans-serif;border-radius:999px;cursor:pointer;color:#fff;background:var(--grad);box-shadow:0 8px 22px -8px #7F52EEaa,inset 0 0 0 1px #ffffff1a,inset 0 1px 0 #ffffff26}.lvcc .cc-yes:hover{background:linear-gradient(93deg,#8d64f5,#4f3588)}
.lvcc .cc-no{position:absolute;top:-12px;left:10px;display:grid;place-items:center;width:24px;height:24px;padding:0;border-radius:50%;background:#1d1930;border:1px solid #9d7cff40;box-shadow:0 4px 10px -4px #000;color:#cfcbe8;cursor:pointer;opacity:0;transition:opacity .2s ease,color .2s ease,border-color .2s ease}
.lvcc .cc-no svg{width:11px;height:11px}.lvcc .cc-no:hover{color:#fff;border-color:#9d7cff99}
.lvcc:hover .cc-no,.lvcc .cc-no:focus-visible{opacity:1}
@media(hover:none){.lvcc .cc-no{opacity:1}}
@keyframes lvccIn{from{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%,0)}}
@media(prefers-reduced-motion:reduce){.lvcc{animation:none}}
.ft-legal .ft-cc{background:none;border:0;padding:0;font:inherit;font-size:14px;color:var(--muted);cursor:pointer}.ft-legal .ft-cc:hover{color:#fff}

/* V64: real case studies. Card on /work/, and the case page: cover, facts row, result numbers, brief, journey, screenshots */
.rc-list{display:grid;gap:22px}
.rc-card{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:center;gap:34px;padding:18px 34px 18px 18px;border-radius:28px;background:#100e22;border:1px solid var(--line);color:inherit;text-decoration:none;transition:border-color .25s ease,transform .35s cubic-bezier(.25,.8,.3,1)}
.rc-card:hover{border-color:#7F52EE88;transform:translateY(-3px)}
.rc-cv{display:block;border-radius:18px;overflow:hidden;background:#eaf6ff}.rc-cv img{display:block;width:100%;height:auto}
.rc-tx{display:flex;flex-direction:column;gap:10px}.rc-tx small{color:#a58bff;font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.rc-tx>b{font:600 30px/1.15 var(--head);color:#fff;letter-spacing:-.01em}
.rc-nums{display:flex;flex-wrap:wrap;gap:12px 28px;margin:6px 0 4px}.rc-nums span{display:flex;flex-direction:column;color:var(--muted);font-size:14px}.rc-nums b{font:600 26px/1.1 var(--head);color:var(--lime)}
.rc-go{font-weight:600;color:#cdbaff}.rc-go i{font-style:normal;display:inline-block;transition:transform .25s ease}.rc-card:hover .rc-go{color:#fff}.rc-card:hover .rc-go i{transform:translateX(3px)}
.rc-cover{border-radius:24px;overflow:hidden;background:#eaf6ff;border:1px solid var(--line);box-shadow:0 30px 60px -30px #000}.rc-cover img{display:block;width:100%;height:auto}
.rc-meta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin:44px 0 0;padding:22px 0 0;border-top:1px solid var(--line)}
.rc-meta dt{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}.rc-meta dd{margin:4px 0 0;color:#fff;font-weight:600}
.rc-src{margin:18px 0 0;font-size:13.5px;color:var(--ink2)}
.rc-brief{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:40px;align-items:start}.rc-brief>p{margin:0;font-size:18px;line-height:1.65;color:#d9d5ea}
.rc-built{padding:24px 26px;border-radius:22px;background:#100e22;border:1px solid var(--line)}.rc-built b{display:block;margin-bottom:12px;color:#fff;font:600 17px var(--head)}
.rc-built ul{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px}.rc-built li{padding:6px 12px;border-radius:999px;background:#7F52EE24;border:1px solid #9d7cff33;color:#e6e2ff;font-size:14px;font-weight:600}
.rc-shots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;align-items:start}
.rc-shot{margin:0}.rc-fr{border-radius:22px;overflow:hidden;background:#eef6ff;box-shadow:0 18px 40px #14102b14}.rc-fr img{display:block;width:100%;height:auto}
.rc-shot.tall .rc-fr{max-height:760px;overflow-y:auto;overscroll-behavior:contain}
.rc-fr{box-shadow:0 24px 50px -24px #000}
.rc-shot figcaption{margin:12px 4px 0;font-size:14.5px;line-height:1.5;color:var(--muted)}.rc-shot figcaption a{color:#cdbaff;font-weight:600;white-space:nowrap}.rc-shot figcaption a:hover{color:#fff}
@media(max-width:900px){.rc-card{grid-template-columns:1fr;gap:20px;padding:14px 14px 24px}.rc-tx{padding:0 8px}.rc-tx>b{font-size:25px}.rc-meta{grid-template-columns:repeat(2,minmax(0,1fr))}.rc-brief{grid-template-columns:1fr;gap:24px}.rc-shots{grid-template-columns:1fr}.rc-shot.tall .rc-fr{max-height:600px}}
@media(prefers-reduced-motion:reduce){.rc-card{transition:none}.rc-card:hover{transform:none}}
.mile.rc-res{grid-template-columns:repeat(4,minmax(0,1fr))!important}@media(max-width:900px){.mile.rc-res{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
.sec.bright .rc-shot figcaption{color:var(--ink2)}.sec.bright .rc-shot figcaption a{color:#6a45ff}.sec.bright .rc-shot figcaption a:hover{color:#3d1fb8}.sec.bright .rc-fr{box-shadow:0 18px 40px #14102b1f}
/* V64: screenshots at full height, two columns like the review wall; one column in story order on phone */
.rc-shots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;align-items:start}
.rc-col{display:flex;flex-direction:column;gap:28px;min-width:0}
a.rc-fr{display:block;cursor:zoom-in;transition:transform .35s cubic-bezier(.25,.8,.3,1),box-shadow .35s ease}a.rc-fr:hover{transform:translateY(-3px)}
@media(max-width:900px){.rc-shots{display:flex;flex-direction:column;align-items:stretch;gap:24px}.rc-col{display:contents}}
@media(prefers-reduced-motion:reduce){a.rc-fr{transition:none}a.rc-fr:hover{transform:none}}
/* V64: the shorter screenshot column sticks with its bottom above the dock (110px), so both columns end together */
@media(min-width:901px){.rc-col.stk{position:sticky;top:min(96px,calc(100vh - var(--ch,600px) - 110px))}}
/* V64: the brief text is short next to the "What we built" card, so it is larger and sits level with the card's middle (desktop); phone keeps 18px */
@media(min-width:901px){.rc-brief{align-items:center}.rc-brief>p{font-size:clamp(19px,1.65vw,24px);line-height:1.55;color:#e6e2ff;letter-spacing:-.005em}}
/* V64: Platform as tech-stack chips in the case facts row */
.rc-plat{display:flex;flex-wrap:wrap;gap:8px;margin-top:2px}.rc-meta .tsk{padding:5px 16px 5px 5px;gap:9px;font-size:13.5px;line-height:1}.rc-meta .tsk i{width:26px;height:26px}.rc-meta .tsk i svg{width:14px;height:14px}
@media(min-width:901px){.rc-meta{grid-template-columns:1fr 1fr 1.5fr 1fr}}
.rc-cv{position:relative}
/* V64: the platform chips always sit on one line: on desktop the Platform column takes the chips' own width; on phone it spans the full row */
@media(min-width:901px){.rc-meta{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) max-content minmax(0,.7fr);column-gap:32px}.rc-plat{flex-wrap:nowrap}}
@media(max-width:900px){.rc-meta>div:has(.rc-plat){grid-column:1/-1}}
.rc-cover{position:relative}
/* V64: phone, three platform chips fit one line */
@media(max-width:900px){.rc-plat{gap:6px}.rc-meta .tsk{padding:4px 11px 4px 4px;gap:6px;font-size:12.5px}.rc-meta .tsk i{width:22px;height:22px}.rc-meta .tsk i svg{width:12px;height:12px}}
/* V64: the chip outline is nearly invisible on black, so the logo circle is what the eye reads: pull the chips left by their inset (5px + 1px border) so the logo starts under the label */
.rc-plat{margin-left:-6px}
@media(max-width:900px){.rc-plat{gap:5px}.rc-meta .tsk{padding:4px 9px 4px 4px;gap:5px;font-size:12px}}
/* V66: UX before -> after cards in the case result (same dark cards as the number results) */
.rc-ba{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.rc-ba>div{display:flex;flex-direction:column;gap:14px;padding:24px;border-radius:22px;background:var(--surface);border:1px solid var(--line)}
.rc-ba small{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#a58bff}
.rc-ba p{margin:0;font-size:15px;line-height:1.5}.rc-ba i{display:block;margin-bottom:3px;font-style:normal;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.rc-ba .b4{color:var(--muted)}.rc-ba .b4 i{color:#7d7894}
.rc-ba .af{padding-top:14px;border-top:1px solid var(--line);color:#fff;font-weight:600}.rc-ba .af i{color:var(--lime)}
@media(max-width:900px){.rc-ba{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.rc-ba{grid-template-columns:1fr}}
/* V66: before/after cards keep their own colours inside the light result panel (its p rule would grey them) */
.sec .rc-ba>div{background:linear-gradient(180deg,#16142a,#0e0d18);border-color:#ffffff14}
.sec .rc-ba p.b4{color:#8f8aa8}.sec .rc-ba p.af{color:#fff}
/* V66: the facts row spreads its items across the full width (3 or 4 of them), text only wraps when space runs out; the platform chips never squeeze */
@media(min-width:901px){.rc-meta{display:flex;justify-content:space-between;gap:24px 40px}.rc-meta>div{flex:0 1 auto;min-width:0}.rc-meta>div:has(.rc-plat){flex-shrink:0}}
/* V66: before/after cards share their rows (title, before, after), so the "After" line sits at the same height in every card */
.rc-ba>div{display:grid;grid-template-rows:subgrid;grid-row:span 3;row-gap:14px;align-content:start}
.rc-ba p.b4{align-self:start}
/* V66: small laptops keep each before/after line pair at two lines */
@media(min-width:901px) and (max-width:1180px){.rc-ba>div{padding:22px 20px}.rc-ba p{font-size:14px}}
/* V67: Home "Our work" bento. The owner's case covers are shown whole (each plate keeps the cover's own shape, contain, its own edge colour behind),
   client colour as a soft glow in our dark card, results inside the cards, a quiet proof line under the heading */
.rc-proof{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 16px;margin:-6px auto 36px;color:var(--muted);font-size:14.5px}
.rc-pf-faces{display:flex}.rc-pf-faces img{width:30px;height:30px;border-radius:50%;object-fit:cover;border:2px solid #0f0d1d;margin-left:-9px}.rc-pf-faces img:first-child{margin-left:0}
.rc-pf-stars{color:#f5c451;letter-spacing:2px;font-size:14px}
.rc-proof b{color:#fff;font-weight:700;font-variant-numeric:tabular-nums}.rc-proof>i{width:4px;height:4px;border-radius:50%;background:#ffffff40}
.rc-bento{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);grid-template-rows:1fr 1fr auto;gap:22px}
.rc-bt{--cc:#7F52EE;display:flex;flex-direction:column;min-width:0;border-radius:26px;overflow:hidden;color:inherit;text-decoration:none;
 background:radial-gradient(115% 85% at 100% 0%,color-mix(in srgb,var(--cc) 22%,transparent),transparent 62%),radial-gradient(80% 60% at 0% 100%,color-mix(in srgb,var(--cc) 10%,transparent),transparent 62%),#0f0d1d;
 border:1px solid color-mix(in srgb,var(--cc) 30%,#ffffff10);transition:border-color .25s ease,transform .35s cubic-bezier(.25,.8,.3,1)}
.rc-bt:hover{border-color:color-mix(in srgb,var(--cc) 62%,#ffffff1a);transform:translateY(-3px)}
.rc-bt.rv{transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:var(--rd,0ms)}
.rc-pl{display:block;flex:none;margin:12px 12px 0;border-radius:18px;overflow:hidden;background:var(--pl);aspect-ratio:var(--ar)}
.rc-pl img{display:block;width:100%;height:100%;object-fit:contain;transition:transform .6s cubic-bezier(.25,.8,.3,1)}
.rc-bt:hover .rc-pl img{transform:scale(1.02)}
.rc-bt-l{grid-row:1/3}
.rc-bt-w{grid-column:1/-1;flex-direction:row-reverse}.rc-bt-w .rc-pl{width:44%;margin:12px 12px 12px 0}
.rc-btx{display:flex;flex-direction:column;gap:10px;padding:20px 26px 24px;flex:1;min-width:0}
.rc-bt-l .rc-btx{padding:22px 30px 28px;gap:12px}.rc-bt-w .rc-btx{padding:28px 36px}
.rc-chip{align-self:flex-start;padding:4px 10px;border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;white-space:nowrap;
 background:color-mix(in srgb,var(--cc) 16%,transparent);border:1px solid color-mix(in srgb,var(--cc) 42%,transparent);color:color-mix(in srgb,var(--cc) 48%,#fff)}
.rc-nm{font:600 20px/1.2 var(--head);color:#fff}.rc-bt-l .rc-nm{font-size:30px;letter-spacing:-.01em}.rc-bt-w .rc-nm{font-size:26px}
.rc-hl{font:italic 400 20px/1.2 var(--serif);background:linear-gradient(92deg,color-mix(in srgb,var(--cc) 62%,#fff),#9ECD5F);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-variant-numeric:tabular-nums}
.rc-bt-l .rc-hl{font-size:34px}.rc-bt-w .rc-hl{font-size:26px}
.rc-st4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:4px;padding-top:16px;border-top:1px solid var(--line)}
.rc-st4>span{display:flex;flex-direction:column;gap:4px;font-size:12.5px;line-height:1.35;color:var(--muted)}.rc-st4 b{font:600 21px/1.1 var(--head);color:#fff;font-variant-numeric:tabular-nums}
.rc-cap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 22px 18px;flex:1}
.rc-cap>span:first-child{display:flex;flex-direction:column;gap:5px;min-width:0}
.rc-face{display:flex;align-items:center;gap:9px;flex:none;color:var(--muted);font-size:13px;white-space:nowrap}
.rc-face img{width:30px;height:30px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px color-mix(in srgb,var(--cc) 55%,transparent)}
.rc-face>span{display:flex;flex-direction:column;line-height:1.25;color:#fff;font-weight:600}.rc-face i{font-style:normal;color:#f5c451}.rc-face small{color:var(--muted);font-weight:400;font-size:12px}
.rc-cap .rc-face small{display:none}
.rc-q{font:italic 400 15px/1.55 var(--sans);color:#d9d5ea}
.rc-btx .rc-go{margin-top:auto;padding-top:6px}.rc-bt:hover .rc-go{color:#fff}.rc-bt:hover .rc-go i{transform:translateX(3px)}
@media(max-width:1080px){.rc-bento{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto}.rc-bt-l{grid-column:1/-1;grid-row:auto}.rc-bt-w{flex-direction:column}.rc-bt-w .rc-pl{width:auto;margin:12px 12px 0}}
@media(max-width:700px){.rc-bento{grid-template-columns:1fr}.rc-st4{grid-template-columns:repeat(2,minmax(0,1fr))}.rc-bt-l .rc-nm{font-size:24px}.rc-bt-l .rc-hl{font-size:27px}.rc-bt-w .rc-nm,.rc-bt-w .rc-hl{font-size:22px}.rc-bt-w .rc-btx{padding:20px 24px 24px}}
@media(prefers-reduced-motion:reduce){.rc-bt,.rc-pl img{transition:none}.rc-bt:hover,.rc-bt:hover .rc-pl img{transform:none}}
/* V67: the rating shows five stars over the score, never a single star (a lone star next to 5.0 reads as a one-star rating) */
.rc-face .rc-stars{color:#f5c451;font-style:normal;font-size:11.5px;letter-spacing:1.5px;line-height:1}
.rc-face .rc-fs{display:flex;align-items:baseline;gap:0;margin-top:4px}.rc-face .rc-fs b{color:#fff;font-weight:700;font-size:13px}.rc-face .rc-fs small{display:inline;font-size:12.5px}
.rc-cap .rc-face .rc-fs small{display:none}
/* V67: the italic result lines read clearly on the dark card: heavier weight, near-white with a light touch of the client colour (no thin gradient) */
.rc-bt .rc-hl{font-weight:600;background:none;-webkit-text-fill-color:currentColor;color:color-mix(in srgb,var(--cc) 28%,#fff);letter-spacing:.005em}
.rc-face .rc-fs small{margin-left:5px;text-transform:none;letter-spacing:0;font-weight:400;color:var(--muted)}
/* V67: result line in the heading font: the number white and bold, the words after it softer */
.rc-bt .rc-hl{font:500 19px/1.25 var(--head);font-style:normal;background:none;-webkit-text-fill-color:currentColor;color:#bdb8d4;letter-spacing:-.005em}
.rc-bt .rc-hl b{color:#fff;font-weight:700;font-variant-numeric:tabular-nums}
.rc-bt-l .rc-hl{font-size:28px}.rc-bt-w .rc-hl{font-size:23px}
/* small cards: name and result on top, the reviewer (face, stars, score, name) under a hairline */
.rc-bt-s .rc-cap{flex-direction:column;align-items:stretch;justify-content:flex-start;gap:12px}
.rc-bt-s .rc-cap .rc-face{padding-top:12px;border-top:1px solid var(--line)}
.rc-bt-s .rc-cap .rc-face .rc-fs small{display:inline}
.rc-bt-s .rc-capt{display:flex;flex-direction:column;gap:4px}
@media(max-width:700px){.rc-bt-l .rc-hl{font-size:24px}.rc-bt-w .rc-hl{font-size:20px}}
/* V67: stats row sizes itself to the number of stats */
.rc-st4{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}
/* V67: large and wide cards carry a short "what we built" line, the platforms, and (wide) the full review */
.rc-bt .rc-bl{font:400 15.5px/1.6 var(--sans);color:var(--muted);max-width:56ch}
.rc-bt .rc-bplat{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:4px}
.rc-bt .rc-bplat small{width:100%;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.rc-bt .rc-bplat .tsk{padding:6px 12px 6px 6px;font-size:13px;gap:8px}.rc-bt .rc-bplat .tsk i{width:24px;height:24px}.rc-bt .rc-bplat .tsk i svg{width:13px;height:13px}
.rc-bt-w .rc-q{font:italic 400 18px/1.6 var(--sans);color:#e6e3f2;padding-left:16px;border-left:2px solid color-mix(in srgb,var(--cc) 60%,transparent)}
.rc-bt-w .rc-face img{width:42px;height:42px}.rc-bt-w .rc-face .rc-fs b{font-size:14px}.rc-bt-w .rc-face .rc-fs small{font-size:13.5px}
.rc-bt-l .rc-st4{margin-top:8px}
/* the time phrase in each result line: the site's accent italic */
.rc-bt .rc-hl em{font:italic 500 1.06em/1 var(--serif);color:color-mix(in srgb,var(--cc) 40%,#fff);-webkit-text-fill-color:currentColor;background:none;padding-right:.04em}
@media(max-width:700px){.rc-bt .rc-bl{font-size:14.5px}.rc-bt-w .rc-q{font-size:16px}}
/* V67: Work page case cards: text left, cover right, client colour inside our dark ambience; they stack as you scroll on desktop */
.rc-wl{display:grid;gap:26px}
.rc-w{--cc:#7F52EE;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);align-items:center;gap:40px;padding:22px 22px 22px 44px;border-radius:30px;color:inherit;text-decoration:none;
 background:radial-gradient(90% 120% at 0% 0%,color-mix(in srgb,var(--cc) 20%,transparent),transparent 60%),linear-gradient(color-mix(in srgb,var(--cc) 7%,#0f0d1d),color-mix(in srgb,var(--cc) 7%,#0f0d1d));
 border:1px solid color-mix(in srgb,var(--cc) 34%,#ffffff10);box-shadow:0 -18px 40px -24px #000c;transition:border-color .25s ease}
.rc-w:hover{border-color:color-mix(in srgb,var(--cc) 65%,#ffffff1a)}
.rc-w.rv{transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1),border-color .25s ease}
.rc-w .rc-pl{margin:0;border-radius:20px}
.rc-w:hover .rc-pl img{transform:scale(1.02)}
.rc-wtx{display:flex;flex-direction:column;gap:12px;min-width:0;padding:16px 0}
.rc-wtag{font:italic 500 19px/1.2 var(--serif);color:color-mix(in srgb,var(--cc) 45%,#fff)}
.rc-wnm{font:700 34px/1.12 var(--head);color:#fff;letter-spacing:-.015em;text-wrap:balance}
.rc-w .rc-hl{font:500 22px/1.3 var(--head);color:#bdb8d4}.rc-w .rc-hl b{color:#fff;font-weight:700;font-variant-numeric:tabular-nums}
.rc-w .rc-hl em{font:italic 500 1.06em/1 var(--serif);color:color-mix(in srgb,var(--cc) 40%,#fff);-webkit-text-fill-color:currentColor;background:none}
.rc-wbl{font:400 15.5px/1.65 var(--sans);color:var(--muted);max-width:50ch}
.rc-wfx{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:10px;padding-top:18px;border-top:1px solid var(--line)}
.rc-wfx>span{display:flex;flex-direction:column;gap:5px;min-width:0}.rc-wfx small{font-size:13px;color:var(--muted)}.rc-wfx b{font:600 18px/1.3 var(--head);color:#fff}
.rc-wbar{display:flex;align-items:center;gap:14px;margin-top:12px;padding:12px 18px 12px 12px;border-radius:16px;background:#ffffff0b;border:1px solid #ffffff14;transition:background .25s ease}
.rc-w:hover .rc-wbar{background:#ffffff12}
.rc-wbar img,.rc-wav{width:40px;height:40px;border-radius:50%;object-fit:cover;flex:none;box-shadow:0 0 0 2px color-mix(in srgb,var(--cc) 55%,transparent)}
.rc-wav{display:grid;place-items:center;background:color-mix(in srgb,var(--cc) 30%,#0f0d1d);color:#fff;font:700 17px var(--head);font-style:normal}
.rc-wwho{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}.rc-wwho b{color:#fff;font:600 15px/1.2 var(--head)}
.rc-wwho small{font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rc-wwho .rc-stars{font-style:normal;color:#f5c451;letter-spacing:1px;font-size:11.5px;margin-right:4px}
.rc-warr{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;flex:none;background:color-mix(in srgb,var(--cc) 22%,transparent);color:#fff;font-style:normal;transition:transform .25s ease}
.rc-w:hover .rc-warr{transform:translateX(3px)}
@media(min-width:1081px) and (min-height:780px){.rc-wl{gap:40px;padding-bottom:20px}.rc-w{position:sticky;top:calc(84px + var(--i)*22px)}}
@media(max-width:1080px){.rc-w{grid-template-columns:1fr;gap:6px;padding:14px 14px 22px}.rc-w .rc-pl{order:-1}.rc-wtx{padding:14px 12px 0}.rc-wnm{font-size:28px}}
@media(max-width:700px){.rc-wnm{font-size:25px}.rc-w .rc-hl{font-size:19px}.rc-wtag{font-size:17px}.rc-wbl{font-size:14.5px}.rc-wfx{gap:14px}.rc-wfx b{font-size:15.5px}.rc-wtx{padding:12px 6px 0}}
@media(prefers-reduced-motion:reduce){.rc-w,.rc-warr,.rc-wbar{transition:none}.rc-w:hover .rc-warr{transform:none}}
@media(min-width:1081px){.rc-w{min-height:480px}}
/* V67: journey cards: tool chips (light, for the pastel cards) */
.bp-tl{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.case.bp .bp-tl .tsk{padding:4px 11px 4px 4px;gap:7px;font:600 12.5px var(--sans);background:#ffffffa6;border:1px solid #16112c1f;color:#16112c}
.case.bp .bp-tl .tsk i{width:22px;height:22px;box-shadow:0 0 0 1px #16112c14}.case.bp .bp-tl .tsk i svg{width:12px;height:12px}
.bp-tlh{margin-top:22px}.bp-tlh .tsk{padding:6px 13px 6px 6px;font-size:13.5px}.bp-tlh .tsk i{width:26px;height:26px}
/* card: lifts a little on hover, the app window tilts toward you */
.cases .case.bp{transition:transform .35s cubic-bezier(.25,.8,.3,1),box-shadow .35s ease}
.cases .case.bp:hover{transform:translateY(-4px);box-shadow:0 26px 50px -30px #000}
.cases .case.bp .cv .mk{transition:transform .5s cubic-bezier(.25,.8,.3,1)!important}
.cases .case.bp:hover .cv .mk{transform:translateY(-3px) scale(1.025)!important}
/* mini app window: rows slide in one after another, the status pill pops in after its row, then the set resets */
.jm .jr{animation:jrIn 7.5s cubic-bezier(.2,.7,.2,1) infinite;animation-delay:calc(var(--i)*.55s)}
.jm .jr em{animation:jrPop 7.5s cubic-bezier(.3,1.5,.5,1) infinite;animation-delay:calc(var(--i)*.55s + .45s)}
.jm .jr .av{animation:jrAv 7.5s ease-out infinite;animation-delay:calc(var(--i)*.55s)}
.jm .jk>div{animation:jrIn 7.5s cubic-bezier(.2,.7,.2,1) infinite;animation-delay:calc(var(--i)*.4s)}
.jm .jk .bars i{transform-origin:bottom;animation:jrBar 7.5s cubic-bezier(.2,.7,.2,1) infinite;animation-delay:calc(var(--i)*.4s + .2s)}
.jm .js span{animation:jsLit 7.5s ease-in-out infinite;animation-delay:calc(var(--i)*.9s)}
@keyframes jrIn{0%{opacity:0;transform:translateY(10px)}7%,86%{opacity:1;transform:none}94%,100%{opacity:0;transform:translateY(-4px)}}
@keyframes jrPop{0%,2%{opacity:0;transform:scale(.6)}8%{opacity:1;transform:scale(1.1)}12%,84%{opacity:1;transform:none}92%,100%{opacity:0;transform:scale(.9)}}
@keyframes jrAv{0%{box-shadow:0 0 0 0 #7F52EE80}10%{box-shadow:0 0 0 6px #7F52EE00}100%{box-shadow:0 0 0 0 #7F52EE00}}
@keyframes jrBar{0%,3%{transform:scaleY(.15)}14%,86%{transform:none}96%,100%{transform:scaleY(.15)}}
@keyframes jsLit{0%,4%{background:#f4f2fb;color:#14102b;transform:none}10%{background:#7F52EE;color:#fff;transform:translateY(-2px)}26%{background:#7F52EE;color:#fff;transform:none}34%,100%{background:#ece7ff;color:#14102b}}
@media(prefers-reduced-motion:reduce){.cases .case.bp,.cases .case.bp .cv .mk{transition:none!important}.cases .case.bp:hover,.cases .case.bp:hover .cv .mk{transform:none!important}}
/* V67: stacked Work cards: no slide-in on desktop, so a card never jumps when it reaches its stacked place */
@media(min-width:1081px) and (min-height:780px){.rc-w.rv,.rc-w.rv.in{transform:none!important;transition:opacity .6s ease,border-color .25s ease!important}}
.case.bp .bp-tl{flex-wrap:nowrap;overflow:hidden}.case.bp .bp-tl .tsk{flex:none}
@media(max-width:380px){.case.bp .bp-tl .tsk{font-size:11.5px;padding-right:9px;gap:5px}.case.bp .bp-tl .tsk i{width:20px;height:20px}}
/* journey cards: the tools as a row of logos with their names beside, so nothing wraps or clips */
.case.bp .bp-tl{display:flex;align-items:center;gap:10px;flex-wrap:nowrap;overflow:visible;margin-top:14px;min-width:0}
.bp-lg{display:flex;flex:none}
.bp-lg i{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--c);margin-left:-7px;box-shadow:0 0 0 2px #ffffffd9,0 4px 10px -4px #16112c55;overflow:hidden;transition:transform .3s cubic-bezier(.3,1.5,.5,1)}
.bp-lg i:first-child{margin-left:0}.bp-lg i svg{width:15px;height:15px;color:#fff}.bp-lg i img.full{width:100%;height:100%;object-fit:cover}
.case.bp:hover .bp-lg i{transform:translateY(-2px)}.case.bp:hover .bp-lg i:nth-child(2){transition-delay:.05s}.case.bp:hover .bp-lg i:nth-child(3){transition-delay:.1s}
.case.bp .bp-tl small{min-width:0;font:600 13px/1.35 var(--sans);color:#3d3756}
@media(prefers-reduced-motion:reduce){.bp-lg i{transition:none}.case.bp:hover .bp-lg i{transform:none}}
/* V67: Home wide card (Matthieu): quieter quote, content centred with even spacing */
.rc-bt-w .rc-btx{justify-content:center;gap:14px;padding:34px 40px}
.rc-bt-w .rc-q{font-size:16px;line-height:1.7;max-width:46ch;margin-top:6px;color:#d9d5ea}
.rc-bt-w .rc-face{margin-top:2px}
.rc-bt-w .rc-btx .rc-go{margin-top:12px;padding-top:0}
@media(max-width:1080px){.rc-bt-w .rc-btx{padding:22px 26px 26px}}
@media(max-width:700px){.rc-bt-w .rc-q{font-size:15px}.rc-bt-w .rc-btx{padding:20px 22px 24px}}
/* V68: small Home cards: "Read the case study" sits on the reviewer row, right side */
.rc-bt-s .rc-crow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:12px;border-top:1px solid var(--line)}
.rc-bt-s .rc-crow .rc-face{padding-top:0;border-top:0;min-width:0}
.rc-bt-s .rc-go-s{flex:none;margin:0;padding:0;font-size:14px;white-space:nowrap}
.rc-bt-s:hover .rc-go-s{color:#fff}.rc-bt-s:hover .rc-go-s i{transform:translateX(3px)}
@media(max-width:420px){.rc-bt-s .rc-go-s>span{display:none}.rc-bt-s .rc-go-s i{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:color-mix(in srgb,var(--cc) 22%,transparent);color:#fff}}
.rc-wwho small{white-space:normal}
/* V68: journey tools row, cleaner: logos side by side (no overlap), each on the same white disc with a hairline ring */
.bp-lg{gap:5px}
.bp-lg i{width:28px;height:28px;margin-left:0;box-shadow:0 0 0 1px #16112c1a,0 2px 6px -3px #16112c40}
.bp-lg i img.full{width:100%;height:100%;object-fit:cover;border-radius:50%}
.bp-lg i svg{width:15px;height:15px}
.case.bp .bp-tl{gap:10px;padding-top:14px;margin-top:14px;border-top:1px solid #16112c14}
.case.bp .bp-tl small{font-weight:500;font-size:12.5px;color:#4a4463}
/* V68: journey cards: full problem line (no clamp), tools and button pinned to the card bottom so every card lines up; 2 columns on tablet */
.cases .case.bp .bp-p{display:block!important;-webkit-line-clamp:unset!important;overflow:visible!important;min-height:0!important}
.cases .case.bp>div:first-child{flex:1}
.case.bp .bp-tl{margin-top:auto!important}
.cases .case.bp>div:first-child>.bp-p{margin-bottom:16px}
@media(min-width:701px) and (max-width:1180px){.cases.bp6{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
.cases .case.bp h3{min-height:0!important}.cases .case.bp .bp-p{margin-top:10px!important}
.cases .case.bp{grid-template-rows:200px 1fr!important}
.cases .case.bp>div:first-child{align-self:stretch!important;height:100%!important}.cases .case.bp>div:first-child .bp-tl{margin-top:auto!important}
/* V69: section subtitles wrap into even lines (no single orphan word) */
.sh p{text-wrap:balance}
/* V70: client logo (white tile) in the Work card client bar when there is no reviewer photo */
.rc-wlogo{flex:none;display:grid;place-items:center;width:74px;height:48px;padding:6px 9px;border-radius:12px;background:#fff;box-shadow:0 0 0 2px color-mix(in srgb,var(--cc) 45%,transparent)}
.rc-wlogo img{display:block;max-width:100%;max-height:100%;object-fit:contain}
.rc-wbar .rc-wlogo img{width:auto;height:auto;max-width:100%;max-height:100%;border-radius:0;box-shadow:none;object-fit:contain}
.rc-wlogo{width:100px;height:58px;padding:5px 8px}@media(max-width:700px){.rc-wlogo{width:84px;height:50px}}
/* V71: proof line on tablet and phone: no dangling dot; centred rows (faces + stars + rating, then the conversion line) */
@media(max-width:1000px){.rc-proof>i{display:none}.rc-proof>span:last-child{flex-basis:100%;text-align:center;text-wrap:balance}}
@media(max-width:560px){.rc-proof{gap:8px 12px;font-size:14px}.rc-proof>span:nth-child(3){flex-basis:100%;text-align:center}}
/* V71: TeleSlim stats on phones: 2 x 2 grid again (the auto-column rule was forcing 4 narrow columns); tool chips stay on one row where they fit */
@media(max-width:700px){.rc-st4{grid-auto-flow:row;grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-auto-columns:auto;gap:16px 14px}.rc-st4 b{font-size:20px}}
.rc-bt .rc-bplat .tsk{flex:none}
